open-index/open-npm huggingface dataset:
npm package: @mathsgod/x-html
Description: This template should help get you started developing with Vue 3 and TypeScript in Vite. The template uses Vue 3 `<script setup>` SFCs, check out the [script setup docs](https://v3.vuejs.org/api/sfc-script-setup.html#sfc-script-setup) to learn more.
Latest version: 0.0.14

# Vue 3 + TypeScript + Vite

This template should help get you started developing with Vue 3 and TypeScript in Vite. The template uses Vue 3 `<script setup>` SFCs, check out the [script setup docs](https://v3.vuejs.org/api/sfc-script-setup.html#sfc-script-setup) to learn more.

## Recommended IDE Setup

- [VS Code](https://code.visualstudio.com/) + [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar)

## Type Support For `.vue` Imports in TS

Since TypeScript cannot handle type information for `.vue` imports, they are shimmed to be a generic Vue component type by default. In most cases this is fine if you don't really care about component prop types outside of templates. However, if you wish to get actual prop types in `.vue` imports (for example to get props validation when using manual `h(...)` calls), you can enable Volar's Take Over mode by following these steps:

1. Run `Extensions: Show Built-in Extensions` from VS Code's command palette, look for `TypeScript and JavaScript Language Features`, then right click and select `Disable (Workspace)`. By default, Take Over mode will enable itself if the default TypeScript extension is disabled.
2. Reload the VS Code window by running `Developer: Reload Window` from the command palette.

You can learn more about Take Over mode [here](https://github.com/johnsoncodehk/volar/discussions/471).
npm package: @mathshistory/bbcode-rules
Description: A set of rules for serializing, deserializing and rendering the bbcodes used for the Maths History website.
Author: David Ferguson
Latest version: 1.3.0

# @mathshistory/bbcode-rules

A set of rules for serializing, deserializing and rendering the bbcodes used for the Maths History website.

Used in the slate editor and lektor plugin for the Maths History site.

KaTeX is used for math tags to serialize to HTML and render in the editor, and when using in a HTML page or in the editor, you'll need to include the KaTeX CSS to get it to display correctly.

```js
import {
  HTML_RULES,
  BBCODE_RULES,
  BBCODE_TAGS,
  RENDER_BLOCK,
  RENDER_MARK,
  RENDER_INLINE
} from '@mathshistory/bbcode-rules'
```
npm package: @mathshistory/katex-server
Description: Runs a HTTP server which renders KaTeX, to speed up build times.
Author: David Ferguson
Latest version: 0.1.1

# @mathshistory/katex-server

Runs a HTTP server which renders KaTeX, to speed up build times.

When building a page for the Maths History website, the page can contain formula
elements which need to get rendered with KaTeX, which is done using the
`katex` command line tool. However, if a page contains many formulae, this means
that repeated calls are needed, which significantly slows down the build with
the overhead.

This runs a small HTTP server which takes input of KaTeX markup, and returns the
rendered HTML.

---

The port is specified as the first command line argument, with the default being
5002.

The data sent to it should be an array of KaTeX formulae, and the response is an
array of those formulae rendered as HTML.
npm package: @mathspace/glossary-builder
Description: A custom [Now](https://zeit.co/now) builder that can generate a glossary of terms organised by collections and languages.
Latest version: 0.3.3

# Glossary Builder

A custom [Now](https://zeit.co/now) builder that can generate a glossary of
terms organised by collections and languages.

## Getting started

In your `now.json` file:

```json
{
  "version": 2,
  "builds": [
    {
      "src": "null",
      "use": "@mathspace/glossary-builder",
      "config": {
        "title": "My Glossary",
        "data": "data.yml"
      }
    }
  ]
}
```

In your `data.yml` file:

```yaml
# Every record must have type and id fields.
# Type fields: /[a-zA-Z-_]+/
# ID fields: /[a-zA-Z0-9-_]+/
# The value of the id field must be unique within the context of the type.
# Foreign key refs are a type and an id combined with slash ("type/id").
---
type: language
id: en
# Reference to another language that is a superset of this language. Nullable.
parent:
title: English
---
type: collection
id: a
# Reference to another collection that is a superset of this collection. Nullable.
parent:
title: Collection A
---
type: definition-set
id: thing
---
type: definition
id: a
# ID of the language this definition belongs to. Required.
language: language/en
# ID of the collection this definition belongs to. Nullable.
collection:
# ID of the set this definition belongs to. Required.
definitionSet: definition-set/thing
title: A Thing
body:
  It's a thing.
```
npm package: @mathssyfy/markdown-it-katex
Description: Plugin markown-it for katex rendering with ability to add global \newcommand
Author: DavidCouronne
Latest version: 1.0.0

# @mathssyfy/markdown-it-katex
Plugin markdown-it for katex rendering with ability to add global \newcommand 

## Installation

```bash
yarn add @mathssyfy/markdown-it-katex
# or
npm install @mathssyfy/markdown-it-katex --save
```

Add CSS:

```html
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.10.0/dist/katex.min.css" integrity="sha384-9eLZqc9ds8eNjO3TmqPeYcDj8n+Qfa4nuSiGYa6DjLNcv9BtN69ZIulL9+8CqC9Y" crossorigin="anonymous">
```
## Basic

```js
const md = require('markdown-it')();
const mkn = require('@mathssyfy/markdown-it-katex');
md.use(mkn);
```
 ## Add newcommands

Example:
 ```js
const md = require('markdown-it')();
const mynewcommands = '\\displaystyle'
    +'\\newcommand{\\vect}[1]{\\overrightarrow{#1}}'
    +'\\newcommand{\\Oij}{\\left(O;\\vect{i};\\vect{j}\\right)}';
const mkn = require('@mathssyfy/markdown-it-katex');
md.use(mkn, {
      "newcommands": mynewcommands
    });
 ```

 ## Katex

 [Katex supported functions](https://katex.org/docs/supported.html)

 The native katex syntax also is supported:

 ```js
const mymacroskatex = {
    "\\f": "f(#1)"
};
const mynewcommands = '\\newcommand{\\g}[1]{g\\left(#1\\right)}';
const mkn = require('@mathssyfy/markdown-it-katex');
md.use(mkn, {
    "macros": mymacroskatex,
    "newcommands": mynewcommands
})
 ```
npm package: @mathssyfy/markdown-it-prewrapper
Description: > TODO: description
Author: DavidCouronne
Latest version: 1.3.9

# `@mathssyfy/markdown-it-prewrapper`

> TODO: description

## Usage

```
const markdownItPrewrapper = require('@mathssyfy/markdown-it-prewrapper');

// TODO: DEMONSTRATE API
```
npm package: @mathssyfy/plugin-back-to-top
Description: > TODO: description
Author: DavidCouronne
Latest version: 1.0.0

# `@mathssyfy/plugin-back-to-top`

> TODO: description

## Usage

```
const pluginBackToTop = require('@mathssyfy/plugin-back-to-top');

// TODO: DEMONSTRATE API
```
npm package: @mathssyfy/plugin-markdown
Description: A Powerful and Highspeed Markdown Parser for Vue and Nuxt
Author: DavidCouronne
Latest version: 1.3.13

# `@mathssyfy/plugin-markdown`

## Description

Plugin Markdown for Nuxt or Vue

## Installation

```
yarn add @mathssyfy/plugin-markdon
```

## Usage

Pour Nuxt:

+ Dans nuxt.config.js:
  ```
    css: [
    ...
    '@mathssyfy/plugin-markdown/lib/theme.css',
    ...
  ],
    ```
+ Dans une vue:
  
 ```
<script>
import Markdown from '@mathssyfy/plugin-markdown'
export default {
  components: {
    Markdown
  },
}
</script>
 ```

 ```
<markdown>
# Un titre

blabla

...
</markdown>
 ```
Inspiré de Vuepress et de vue-markdown:

+ [Vuepress](https://vuepress.vuejs.org/)
+ [vue-markdown](https://github.com/miaolz123/vue-markdown)
npm package: @mathstack/app-kit
Description: The app-kit is a library of miscellaneous utilities, styles, and components that are specific to neither the `@mathstack/ui` nor the `@mathstack/viz` libraries.
Latest version: 2.2.0

# AppDevKit

## Overview

The app-kit is a library of miscellaneous utilities, styles, and components that are specific to
neither the `@mathstack/ui` nor the `@mathstack/viz` libraries.

This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version
19.2.0.

## Code scaffolding

Run `ng generate component component-name --project app-kit` to generate a new component. You can
also use `ng generate directive|pipe|service|class|guard|interface|enum|module --project app-kit`.

> Note: Don't forget to add `--project app-kit` or else it will be added to the default project in
> your `angular.json` file.

## Build

Run `ng build app-kit` to build the project. The build artifacts will be stored in the `dist`
directory.

## Publishing

After building your library with `ng build app-kit`, go to the dist folder `cd dist/app-kit` and run
`npm publish`.

## Running unit tests

Run `ng test app-kit` to execute the unit tests via [Karma](https://karma-runner.github.io).

## Further help

To get more help on the Angular CLI use `ng help` or go check out the
[Angular CLI Overview and Command Reference](https://angular.dev/tools/cli) page.
npm package: @mathstack/old-viz
Description: A library of Angular components for data visualization produced by Mathematica, Inc.
Latest version: 1.0.1

# VizComponents

This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 14.0.0.

## Code scaffolding

Run `ng generate component component-name --project viz-components` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module --project viz-components`.

> Note: Don't forget to add `--project viz-components` or else it will be added to the default project in your `angular.json` file.

## Build

Run `./build.sh` to build the project. The build artifacts will be stored in the `dist/` directory.

## Publishing

1. run `npm run prepare` from the viz-components folder

2. in the root folder, run ./build.sh

3. Go to the dist folder `cd dist/viz-components` and run `npm publish`.

## Using the library

1. run `npm install @mathstack/old-viz`. If it can't be found, it's probably because the preinstall script didn't actually run (it's supposed to but doesn't always, at least not for me, and haven't successfully debugged yet). Manually run the preinstall script, `npm run preinstall`, then run `npm install @mathstack/old-viz` again.

## Extending a component

After installing the library, run `ng g viz-components:extend` and follow the instructions from there.

If you need to extend a component and then also extend an interactivity directive, see the code snippet below: 

```
export class MyProjectLinesComponent extends LinesComponent {
  myLines = true;
}

@Directive()
export class MyProjectLinesHoverMoveDirective extends LinesHoverMoveDirective<MyProjectLinesComponent> {
  @Input('vicLinesHoverMoveEffects')
  override effects: HoverMoveEventEffect<
    LinesHoverMoveDirective<MyProjectLinesComponent>
  >[];

  constructor(@Inject(LINES) public override lines: MyProjectLinesComponent) {
    super(lines);
  }
}
```

## Running unit tests

Run `ng test viz-components` to execute the unit tests via [Karma](https://karma-runner.github.io).

## Further help

To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI Overview and Command Reference](https://angular.io/cli) page.
npm package: @mathstack/ui
Description: This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 19.2.0.
Latest version: 2.2.0

# UiComponents

This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version
19.2.0.

## Overview

This library serves as the home for replacements to any Material components that are exceptionally
difficult to style, and for reusable components that do not exist in angular Material (e.g., loading
dialog).

It provides a centralized location for managing custom components that enhance the functionality and
appearance of the application, ensuring consistency and reusability.

## Code scaffolding

Run `ng generate component component-name --project ui` to generate a new component. You can also
use `ng generate directive|pipe|service|class|guard|interface|enum|module --project ui`.

> Note: Don't forget to add `--project ui` or else it will be added to the default project in your
> `angular.json` file.

## Build

Run `ng build ui` to build the project. The build artifacts will be stored in the `dist/` directory.

## Publishing

After building your library with `ng build ui`, go to the dist folder `cd dist/ui` and run
`npm publish`.

## Running unit tests

Run `ng test ui` to execute the unit tests via [Karma](https://karma-runner.github.io).

## Further help

To get more help on the Angular CLI use `ng help` or go check out the
[Angular CLI Overview and Command Reference](https://angular.io/cli) page.
npm package: @mathstack/viz
Description: Viz Components is a library of Angular components for building highly custom data visualizations, built on top of D3.
Latest version: 2.2.0

# VizComponents

## Overview

Viz Components is a library of Angular components for building highly custom data visualizations,
built on top of D3.

Viz Components allows users to compose sub-chart level components into custom data visualizations
and to fully customize the system of visual marks used to represent data. At the same time, this
package takes care of common data viz functionality, such as setting scales, creating axes, and
responsively scaling svgs under the hood.
npm package: @mathtiasse/user-activity-tracking
Description: Agnostic Activity Tracking core with pluggable connectors (GTM, GA4, ...).
Latest version: 1.0.0

# @your-scope/activity-tracking

Noyau **agnostique** de tracking d’activité avec **connecteurs plug-and-play** (GTM, GA4, Console…).  
Architecture middleware par connecteur : `map(event) → transform(mapped) → send(transformed)`.

## ✨ Features
- Core agnostique (aucun nom d’event spécifique à un outil)
- Connecteurs modulaires, chacun avec **config**, **mapping**, **transform**, **send**
- Renommage d’event **par connecteur** (ex. `page_load` → `page_view` pour GA4)
- SPA navigation observer, Web Vitals (LCP/CLS/INP), JS error tracking, scroll depth
- ESM + CJS + Types fournis

## 📦 Installation
```bash
npm i @your-scope/activity-tracking
# ou
yarn add @your-scope/activity-tracking
```

## 🚀 Quickstart (ESM)
```ts
import { createActivityTracking } from "@your-scope/activity-tracking";
import { gtmConnector, ga4Connector } from "@your-scope/activity-tracking";

const AT = createActivityTracking();

AT.registerConnector(gtmConnector());
AT.registerConnector(ga4Connector());

AT.init({
  detectAdblock: true,
  trackWebVitals: true,
  trackSpaPages: true,
  connectors: {
    gtm: { enabled: true },
    ga4: {
      enabled: true,
      eventMap: { page_load: "page_view" },
      flattenUserActivity: true
    }
  }
});

// AT.sendEvent("click_product", { product_id: "SKU123" });
```

### CommonJS
```js
const pkg = require("@your-scope/activity-tracking");
const AT = pkg.createActivityTracking();

AT.registerConnector(pkg.gtmConnector());
AT.registerConnector(pkg.ga4Connector());

AT.init({ connectors: { gtm: { enabled: true }, ga4: { enabled: true } } });
```

## 🧱 Concept
- **Core** : gère l’identité/visite, la collecte, et **dispatch** chaque event vers tous les connecteurs actifs.
- **Connecteur** : encapsule la logique d’un outil cible (mapping d’events, transformation, envoi).

```
event (agnostique)
   └─> connector.map(evt)
          └─> connector.transform(mapped)
                 └─> connector.send(transformed)
```

## 🧩 Créer un connecteur custom (template)
```ts
import type { ConnectorPack } from "@your-scope/activity-tracking";

export function myConnector(): ConnectorPack {
  return {
    name: "myConnector",
    defaults: {
      enabled: true,
      eventMap: { page_load: "page_load" }
    },
    factory({ config, globalConfig }) {
      return {
        map(evt) {
          const name = (config.eventMap?.[evt.event]) ?? evt.event;
          return { ...evt, event: name };
        },
        transform(mapped) {
          return mapped;
        },
        async send(payload) {
          await fetch("https://api.example.com/collect", {
            method: "POST",
            headers: { "content-type": "application/json" },
            body: JSON.stringify(payload)
          });
        }
      };
    }
  };
}
```

## 📦 Build / Dev
- `npm run build` → ESM + CJS + types (tsup)
- `npm run dev` → watch
- `npm run check` → `tsc --noEmit`

## 📤 Publish via GitHub Actions
Crée le secret `NPM_TOKEN`, puis :
```bash
npm version patch   # ou minor/major
git push --follow-tags
```
npm package: @mathu01/gdpr-consent
Description: GDPR banner to comply with the European cookie law. Inspired by tarteaucitronjs.
Author: simon
Latest version: 1.0.8

[![NPM version](https://badge.fury.io/js/gdpr-consent.svg)](http://badge.fury.io/js/gdpr-consent)
[![QC Checks](https://github.com/lesjoursfr/gdpr-consent/actions/workflows/quality-control.yml/badge.svg)](https://github.com/lesjoursfr/gdpr-consent/actions/workflows/quality-control.yml)

# gdpr-consent.js

Comply to the european cookie law.
Inspired by [AmauriC/tarteaucitron.js](https://github.com/AmauriC/tarteaucitron.js/)

# What is this script?

The european cookie law regulates the management of cookies and you should ask your visitors their consent before exposing them to third party services.

Clearly this script will:

-   Disable all services by default,
-   Display a banner on the first page view and a small one on other pages,
-   Display a panel to allow or deny each services one by one,
-   Activate services on the second page view if not denied,
-   Store the consent in a cookie for 365 days.

# How to use

```html
<link rel="stylesheet" href="gdpr-consent.css" />
<script type="text/javascript" src="gdpr-consent.js"></script>
<script type="text/javascript">
	GDPRConsent.init({
		hashtag: "#tarteaucitron" /* Open the panel with this hashtag */,
		cookieName: "tarteaucitron" /* Cookie name */,
		timeExpire: 31536000000 /* Cookie expiration time */,
		websiteName: "Les Jours" /* The name of the Website */,
		AcceptAllCta: true /* Show the accept all button*/,
		moreInfoLink: true /* Show more info link */,
		mandatory: false /* Show a message about mandatory cookies */,
	});
</script>
```

# Add services

```html
<script type="text/javascript">
	/* Initialize gdprconsent.js job array */
	GDPRConsent.job = GDPRConsent.job || [];

	/* Add Google Tag Manager */
	GDPRConsent.user.googletagmanagerId = "GTMID";
	GDPRConsent.job.push("googletagmanager");

	/* Add Google Analytics (gtag.js) */
	GDPRConsent.user.gtagUa = "GAID";
	GDPRConsent.user.gtagInitOptions = {};
	GDPRConsent.job.push("gtag");

	/* Add Socials Sharing Services : Twitter & Facebook */
	GDPRConsent.job.push("twitter");
	window.fbAsyncInit = function () {
		FB.init({});
	};
	GDPRConsent.job.push("facebook");

	/* Add Vidéos */
	GDPRConsent.job.push("vimeo");
	GDPRConsent.job.push("youtube");
</script>
```