open-index/open-npm huggingface dataset:
npm package: @sctg/vite-plugin-github-pages-spa
Description: Vite plugin to enable SPA (Single Page Application) support for GitHub Pages
Author: Ronan LE MEILLAT
Latest version: 0.2.0

# Vite Plugin: GitHub Pages SPA Support

A Vite plugin that enables seamless Single Page Application (SPA) support when hosting on GitHub Pages. GitHub Pages doesn't natively support SPAs, which can cause 404 errors when users refresh the page or navigate directly to a route. This plugin solves that problem by:

1. Creating a `404.html` file that redirects all requests to your SPA
2. Injecting a script in your `index.html` that handles the redirection

## Star the project

**If you appreciate my work, please consider giving it a star! 🤩**

## Installation

```bash
npm install @sctg/vite-plugin-github-pages-spa --save-dev
# or
yarn add @sctg/vite-plugin-github-pages-spa --dev
# or
pnpm add @sctg/vite-plugin-github-pages-spa -D
```

## Usage

Add the plugin to your `vite.config.ts` or `vite.config.js`:

```typescript
import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react'; // or any other framework plugin
import { githubPagesSpa } from "@sctg/vite-plugin-github-pages-spa";

export default defineConfig({
  // Set base if your repo isn't deployed at the root domain
  // For example, if your GitHub Pages URL is 'https://username.github.io/repo-name/'
  base: '/repo-name/',
  
  plugins: [
    react(),
    githubPagesSpa({
      // Options are optional
      verbose: true, // Set to false to disable console logs
    }),
  ],
});
```

## Options

| Option | Type | Default | Description |
|--------|------|---------|-------------|
| `verbose` | `boolean` | `true` | Whether to show log messages during build |
| `injectScript` | `boolean` | `true` | Whether to inject the redirection script into index.html |
| `custom404Html` | `string` | `undefined` | Optional custom HTML content for the 404.html file |
| `title` | `string` | `404 - Page Not Found` | Title for the 404.html file (ignored if custom404Html is set) |

## How It Works

The plugin implements the [SPA GitHub Pages technique](https://github.com/rafgraph/spa-github-pages) by:

1. Adding a script to your `index.html` that checks for special query parameters and redirects correctly
2. Creating a `404.html` file that handles GitHub Pages 404 errors by redirecting to your index page with those special query parameters

## Credits

This plugin is based on the technique described by Rafael Pedicini at [spa-github-pages](https://github.com/rafgraph/spa-github-pages).

## License

MIT
npm package: @sctools/statical
Description: A high-level stats video framework built on top of D3.js.
Author: SCTools
Latest version: 0.1.1

# Statical

A high-level stats video framework built on top of [D3.js](https://d3js.org).

## Videos made with Statical

[!["Cocomelon VS SET India: The Race For 2ND Most Subscribed Company Channel" by JipStats](https://github.com/user-attachments/assets/fe3fb175-d907-4849-9c30-d0b08262b43a)](https://www.youtube.com/watch?v=Y3zxw7INPc8)

[!["Every Channel with Over 100M Subscribers Visualized" by MinMax](https://github.com/user-attachments/assets/773f0e3b-b999-4547-9415-42611a22243d)](https://www.youtube.com/watch?v=rnIyZvWI630)

## Usage

Install with NPM:

```bash
npm install @sctools/statical
```

Or use a CDN such as [unpkg](https://unpkg.com):

```js
<script src="https://unpkg.com/@sctools/statical/statical.js"></script>
```

Or [download it straight from the source](./statical.js).

Then use it in HTML:

```html
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <script src="https://d3js.org/d3.v7.min.js"></script>
  </head>
  <body>
    <div id="count">0</div>
    <div id="chart"></div>
  </body>
  <script src="./statical.js"></script>
  <script>
    // this can come from an external script, such as "./data.js"
    const data = {
      dates: [
        "2022-01-01",
        "2023-01-01",
        "2024-01-01",
        "2025-01-01",
        "2026-01-01",
        "2027-01-01",
        "2028-01-01",
      ],
      count: [1, 5, 10, 15, 20, 25, 30],
    };

    var dates = data.dates.map((date) => new Date(date));
    var DPMS = (5 * 1000) / dates.length;
    var charts = {
      chart: {
        style: {
          width: 920,
          height: 105,
          marginLeft: 25,
          marginTop: 10,
          marginBottom: 25,
          marginRight: 25,
        },
        lines: {
          color: "black",
        },
      },
    };
    var valueTypes = {
      count: (val) => val.toLocaleString(),
    };

    function update() {
      animateValue("count", data.count[pastIndex], data.count[index]);
    }

    function animateCharts() {
      updateChart("chart", parseInt(getText("count")));
    }
  </script>
</html>
```

## Why did we make Statical?

Because we thought that making high-quality stats videos with D3.js was too complicated, involving a lot of code that you have to copy and paste a bunch of times. With Statical, we put the best practices used by many creators such as [JipStats](https://youtube.com/@JipStats), [GNZGUY](https://youtube.com/@GNZGUY) and [MinMax](https://youtube.com/@MinMaxStats) in a simple and easy-to-use package, whilst still giving you the option to make the video your own.
npm package: @sctrl/event-stack
Description: A library for create event sourced applications
Author: undecidedapollo
Latest version: 0.1.2

# @sctrl/event-stack

A Javascript library for managing and maintaining event sourced systems. Focused on usability and ease of use, this library simplifies interactions with the underlying eventing architecture to enable developers to create complex event based models with little worry for how things work under the hood.

Examples can be found in the `/sample` demonstrating how to create an event stack, view, model definition, etc.

This library contains the foundations for working with event stacks. Future libraries will be created for storing this data in a database, caching, and other features.

## Installation

Install library using npm

```bash
npm install @sctrl/event-stack
```

## Example

You can find a step by step tutorial for creating an event sourced application using this library by following the links below

[Movie Rental Store](sample/movieRental/movieRental.md)

You can also find many example models and scripts in the `./sample` directory.

## Terminology

Event Stack - A data structure for managing interactions with underlying event streams. Usually you create one event stack per model. Event stacks store actions in an ordered sequence, allowing the ability to build state from the underlying actions. Examples of event stack names are `bankAccount` or `userProfile`

Action - An action which takes place against the event stack, consisting of an action name and a payload. Actions are the fundamental building block of storing data in an event stack. Examples of action names would be `RETURN_BOOK` or `DEPOSIT_CASH`.

View - A state based representation of the actions in an event stack. By running through all the actions which have occured in an event stack, you can build up a "view" of the data, allowing you to more easily work with the data instead of a sequence of events.

Query - Similar to a view but allows the building of more targeted state. By allowing parameters to be passed to the view reducer, a more purpose driven view of the data can be gathered.

Model - A collection of helper tools to make working with an event stack easier. Models provide mappers for Actions, Views, and Queries to allow developers to create objects which look like normal Javascript objects but interact with the event stack instead. Models make it easier to write more readable and concise code and remove the need for tedious orchestration code.
npm package: @scuba-squad/acceptable
Description: Content negotiation middleware for Express and Restify
Author: Steve Winberg
Latest version: 2.0.7

# Acceptable
[![Build Status](https://github.com/scub45t3v3/acceptable/workflows/CI/badge.svg?event=push)](https://github.com/scub45t3v3/acceptable/actions)
[![Coverage Status](https://coveralls.io/repos/github/scub45t3v3/acceptable/badge.svg)](https://coveralls.io/github/scub45t3v3/acceptable)

## Purpose
Error fast/early for *406 Not Acceptable* requests

## Installation
Via [npm](https://www.npmjs.com/)

```bash
npm install @scuba-squad/acceptable
```

## Usage

```javascript
const express = require('express');
const acceptable = require('@scuba-squad/acceptable');

const app = express();

app.use(acceptable('json', 'txt', 'html', 'xml', 'js', 'jpg'));
```

## Test
[tests](TEST.md)

```bash
npm install
npm test
```
npm package: @scuba-squad/country-db
Description: json country database
Author: Steve Winberg
Latest version: 1.0.1

# Country DB

## Purpose
Database of countries in json format

**Notes:**

*This repo while registered as an npm module should remain agnostic so that it
may be used with several languages and platforms.*

## Installation
Via [npm](https://www.npmjs.com/)

```bash
npm install @scuba-squad/country-db
```

## Usage
```javascript
const countries = require('@scuba-squad/country-db');
```

## Object Structure
**v1.0.0**

```json
{
  "name": "string",
  "iso2Code": "string",
  "iso3Code": "string",
  "isoNumericCode": "string",
  "postalCodeRegEx": "string | null",
  "callingCode": "string | string[]"
}
```

## License
[MIT](LICENSE)
npm package: @scuba-squad/virtual-ext
Description: middleware for Express and Restify to allow file extension in url
Author: Steve Winberg
Latest version: 2.0.7

# Virtual Ext
[![Build Status](https://github.com/scub45t3v3/virtual-ext/workflows/CI/badge.svg?event=push)](https://github.com/scub45t3v3/virtual-ext/actions)
[![Coverage Status](https://coveralls.io/repos/github/scub45t3v3/virtual-ext/badge.svg)](https://coveralls.io/github/scub45t3v3/virtual-ext)

## Purpose
Transform a file extension in a url path into an Accept header

```bash
### ORIGINAL REQUEST ###
HTTP/2.0 GET /v1/accounts.json

Accept: */*

### TRANSFORMED REQUEST ###
HTTP/2.0 GET /v1/accounts

Accept: application/json
```

## Installation
Via [npm](https://www.npmjs.com/)

```bash
npm install @scuba-squad/virtual-ext
```

## Usage

```javascript
const express = require('express');
const virtual = require('@scuba-squad/virtual-ext');

const app = express();

app.use(virtual);
```

## Test
[tests](TEST.md)

```bash
npm install
npm test
```