open-index/open-npm huggingface dataset:
npm package: @foxkit/fs
Description: Filesystem Helpers with full TypeScript support for Node.js
Author: Mitsunee
Latest version: 0.1.2

# Foxkit FS

This package contains a collection of utility functions for interacting with the filesystem in Node.js with support for TypeScript out of the box.

## Installation

Install the package using the package manager used by your project:

```sh
npm install @foxkit/list
pnpm add @foxkit/list
yarn add @foxkit/list
```

## Usage

See [Documentation](./docs/README.md)
npm package: @foxkit/sort
Description: Fast Array sorting using Quick Sort
Author: Mitsunee
Latest version: 1.1.1

# Foxkit Sort

This package contains variations of the Quick Sort and Selection Sort algorithms as functions that take a sortBy argument similar to the callback paramter of `Array.prototype.sort`.

## Installation

```sh
yarn add -D @foxkit/sort
```

## Usage

```js
import { qSort } from "@foxkit/sort";

// sort by a <= b
qSort(myArr);

// sort by a.id <= b.id
qSort(myObjs, "id");

// sort using custom callback
qSort(myObjs, (a, b) => b.id - a.id); // descending order
```

The following algorithms are available:

- `qSort`: Quick Sort
- `qSortDP`: Dual-pivot Quick Sort
- `selSort`: Selection Sort

Note: Due to the nature of these algorithms duplicates may appear in random order. You can prevent this with a custom callback function if you have other properties available for comparison.

### Callback Function

The callback function may return any number (such as the result of a subtraction) or boolean (return `true` if `a` should come before `b`)

```js
selSort(myObjs, (a, b) => a.id > b.id); // descending order
```

## Stable Quick Sort

Stable variants of `qSort` and `qSortDP` are available in the `/stable` import. These are generally slower by a tiny amount but take the position in the original array into consideration, leading to deterministic results:

```js
import { qSort } from "@foxkit/sort/stable";

const myArr = [
  { v: 3, idx: 0 },
  { v: 1, idx: 1 },
  { v: 7, idx: 2 },
  { v: 3, idx: 3 }
];

qSort(myArr, "v"); /* results in:
[
  { v: 1, idx: 1 },
  { v: 3, idx: 0 },
  { v: 3, idx: 3 },
  { v: 7, idx: 2 }
] */
```

## Benchmarks

The following benchmarks were ran on Node.js 16.15.1 on an AMD Ryzen 5 5600X:

| Algorithm                      | Size 10              | Size 100          | Size 1000        |
| :----------------------------- | -------------------- | ----------------- | ---------------- |
| Quick Sort                     | 2,922,624 ops/s      | 154,397 ops/s     | 9,960 ops/s      |
| Quick Sort (stable)            | 2,849,336 ops/s      | 138,888 ops/s     | 9,272 ops/s      |
| Selection Sort                 | **17,031,188 ops/s** | 229,315 ops/s     | 3,916 ops/s      |
| Dual-Pivot Quick Sort          | 5,111,350 ops/s      | **340,698 ops/s** | **19,933 ops/s** |
| Dual-Pivot Quick Sort (stable) | 4,840,080 ops/s      | 314,799 ops/s     | 18,580 ops/s     |
npm package: @foxland/stylelint-config
Description: Foxland stylelint config for WordPress projects
Author: Sami Keijonen
Latest version: 1.3.0

# Foxland Stylelint Config

## Dependencies

1. [Node & NPM](https://www.npmjs.com/get-npm) - 3rd party dependencies are managed through NPM, so you will need that installed globally
2. [Stylelint](https://stylelint.io/) - as this is a config extention for Stylelint, you will need Stylelint installed in your main project in order for it to work.

## Installation

First, install Stylelint:
```
// NPM
npm install stylelint --save-dev

// Yarn
yarn add stylelint
```

Then install the Foxland stylelint config:
```
// NPM
npm install @foxland/stylelint-config --save-dev
```

## Usage

Add the following to your `.stylelintrc` file:

```js
{
	"extends": "@foxland/stylelint-config"
}
```
npm package: @foxlight/analyzer
Description: Static analysis engine for Foxlight — AST scanning, component detection, import resolution.
Author: Jose Cruz
Latest version: 0.2.0

# @foxlight/analyzer

Static analysis engine for [Foxlight](https://github.com/josegabrielcruz/foxlight) — the open-source front-end intelligence platform.

## What's Inside

- **AST Scanner** — TypeScript compiler API-based extraction of imports, exports, JSX usage, and function declarations
- **Component Detector** — heuristic detection of React/Vue/Svelte/Angular components with cross-referencing
- **Prop Extractor** — TypeScript type-checker based prop extraction with defaults and JSDoc descriptions
- **Vue SFC Parser** — parses `.vue` Single File Components (`<script setup>`, `defineProps`, template scanning)
- **Svelte Parser** — parses `.svelte` files (`export let` props, module scripts, template child detection)
- **Project Analyzer** — orchestrates full-project analysis with glob matching, multi-framework support, and dependency graph construction

## Installation

```bash
npm install @foxlight/analyzer
```

> **Note:** `typescript` is a peer dependency. Make sure it's installed in your project.

## Usage

```typescript
import { analyzeProject, analyzeFile, detectComponents } from '@foxlight/analyzer';

// Analyze an entire project
const result = await analyzeProject('/path/to/project');
console.log(result.stats.componentsFound);
console.log(result.registry.getAllComponents());

// Analyze a single file
const fileAnalysis = await analyzeFile('/path/to/Button.tsx');
const components = detectComponents(fileAnalysis, 'react');

// Parse Vue SFCs
import { parseVueSFC } from '@foxlight/analyzer';
const vue = parseVueSFC(sourceCode, 'MyComponent.vue');

// Parse Svelte files
import { parseSvelteFile } from '@foxlight/analyzer';
const svelte = parseSvelteFile(sourceCode, 'Counter.svelte');
```

## License

MIT
npm package: @foxlight/bundle
Description: Bundle size analysis for Foxlight — Vite and Webpack plugins for per-component size tracking.
Author: Jose Cruz
Latest version: 0.2.0

# @foxlight/bundle

Bundle size analysis for [Foxlight](https://github.com/josegabrielcruz/foxlight) — the open-source front-end intelligence platform.

## What's Inside

- **Size Tracker** — computes raw and gzip sizes, per-component bundle breakdown (self, exclusive, total), chunk tracking
- **Vite Plugin** — Rollup-based dependency resolution with BFS traversal, JSON report output, console summary
- **Webpack Plugin** — hooks into Webpack's emit phase for per-module size extraction and reporting

## Installation

```bash
npm install @foxlight/bundle
```

## Vite Plugin

```typescript
// vite.config.ts
import { defineConfig } from 'vite';
import { foxlightVitePlugin } from '@foxlight/bundle/vite';

export default defineConfig({
  plugins: [
    foxlightVitePlugin({
      outputPath: '.foxlight/bundle-report.json',
    }),
  ],
});
```

## Webpack Plugin

```typescript
// webpack.config.js
import { FoxlightWebpackPlugin } from '@foxlight/bundle/webpack';

export default {
  plugins: [
    new FoxlightWebpackPlugin({
      outputPath: '.foxlight/bundle-report.json',
    }),
  ],
};
```

## Programmatic API

```typescript
import { computeSize, computeComponentBundleInfo, formatBytes } from '@foxlight/bundle';

const size = computeSize(sourceCode);
console.log(formatBytes(size.gzip)); // "12.4 KB"
```

## License

MIT
npm package: @foxlight/ci
Description: CI/CD integration for Foxlight — GitHub PR comments, check runs, and snapshot comparison.
Author: Jose Cruz
Latest version: 0.2.0

# @foxlight/ci

CI/CD integration for [Foxlight](https://github.com/josegabrielcruz/foxlight) — the open-source front-end intelligence platform.

## What's Inside

- **GitHub Integration** — PR comments with component/bundle/health diffs, Check Runs API with pass/fail annotations
- **GitLab Integration** — merge request notes with the same diff tables
- **Snapshot Comparator** — captures project state and detects significant changes between snapshots

## Installation

```bash
npm install @foxlight/ci
```

## GitHub Actions

```yaml
# .github/workflows/foxlight.yml
name: Foxlight
on: [pull_request]

jobs:
  analyze:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - uses: actions/setup-node@v4
        with:
          node-version: 20
      - run: npm ci
      - run: npx foxlight ci
        env:
          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
```

## GitLab CI

```yaml
# .gitlab-ci.yml
foxlight:
  script:
    - npm ci
    - npx foxlight ci
  rules:
    - if: $CI_MERGE_REQUEST_IID
```

## Programmatic API

```typescript
import {
  postPRComment,
  createCheckRun,
  detectGitHubEnv,
  postMRComment,
  detectGitLabEnv,
} from '@foxlight/ci';

// GitHub — post a PR comment
const env = detectGitHubEnv();
if (env) {
  await postPRComment(env, snapshotDiff);
  await createCheckRun({
    ...env,
    name: 'Foxlight Analysis',
    diff: snapshotDiff,
  });
}

// GitLab — post an MR note
const gitlabEnv = detectGitLabEnv();
if (gitlabEnv) {
  await postMRComment(gitlabEnv, snapshotDiff);
}
```

## License

MIT
npm package: @foxlight/cli
Description: Command-line interface for Foxlight — analyze components, check health, run upgrades.
Author: Jose Cruz
Latest version: 0.2.0

# @foxlight/cli

Command-line interface for [Foxlight](https://github.com/josegabrielcruz/foxlight) — the open-source front-end intelligence platform.

## Installation

```bash
npm install -g @foxlight/cli
```

Or use via npx:

```bash
npx @foxlight/cli <command>
```

## Commands

### `foxlight init`

Initialize Foxlight in your project. Creates a `.foxlight.json` configuration file.

```bash
foxlight init
```

### `foxlight analyze`

Scan your project and discover components, imports, and dependencies.

```bash
foxlight analyze
foxlight analyze --json           # Output as JSON
foxlight analyze --root ./my-app  # Specify project root
```

### `foxlight health`

Show the component health dashboard with scores for bundle size, test coverage, accessibility, freshness, and performance.

```bash
foxlight health
foxlight health --component Button  # Filter to one component
foxlight health --json              # Output as JSON
```

### `foxlight cost`

Estimate hosting costs based on your bundle sizes across different providers.

```bash
foxlight cost
foxlight cost --provider vercel     # Specific provider
foxlight cost --json                # Output as JSON
```

### `foxlight upgrade <package>`

Analyze the impact of upgrading a dependency.

```bash
foxlight upgrade react
foxlight upgrade react --to 19.0.0  # Target specific version
foxlight upgrade --json              # Output as JSON
```

## Global Options

| Option         | Description                           |
| -------------- | ------------------------------------- |
| `--root <dir>` | Project root directory (default: `.`) |
| `--json`       | Output results as JSON                |
| `--help`       | Show help message                     |
| `--version`    | Show version number                   |

## Configuration

Create a `.foxlight.json` in your project root:

```json
{
  "include": ["src/**/*.{ts,tsx,js,jsx,vue,svelte}"],
  "exclude": ["**/*.test.*", "**/*.spec.*"],
  "framework": "react"
}
```

## License

MIT
npm package: @foxlight/core
Description: Shared data types, component registry, and dependency graph for Foxlight.
Author: Jose Cruz
Latest version: 0.2.0

# @foxlight/core

Shared data layer for [Foxlight](https://github.com/josegabrielcruz/foxlight) — the open-source front-end intelligence platform.

## What's Inside

- **Component Registry** — stores and queries component metadata, props, relationships, bundle info, and health scores
- **Dependency Graph** — directed graph with cycle detection, topological sort, and impact analysis
- **Health Scorer** — 6-metric weighted scoring system (bundle size, test coverage, accessibility, freshness, performance, reliability)
- **Cost Estimator** — hosting cost estimation with pre-configured models for Vercel, Netlify, AWS, and Cloudflare
- **Upgrade Analyzer** — dependency upgrade impact analysis (semver risk, peer deps, deprecation)
- **Config Loader** — loads `.foxlight.json` config with framework auto-detection

## Installation

```bash
npm install @foxlight/core
```

## Usage

```typescript
import {
  ComponentRegistry,
  DependencyGraph,
  computeComponentHealth,
  estimateCostImpact,
  COST_MODELS,
  loadConfig,
} from '@foxlight/core';

// Create a registry and add components
const registry = new ComponentRegistry();
registry.addComponents([{ id: 'Button', name: 'Button' /* ... */ }]);

// Build a dependency graph from imports
const graph = DependencyGraph.fromImports(imports);
const cycles = graph.detectCycles();

// Score component health
const health = computeComponentHealth({
  component: myComponent,
  bundleInfo: myBundleInfo,
  testCoverage: 85,
});

// Estimate hosting costs
const cost = estimateCostImpact(currentBundles, updatedBundles, COST_MODELS.vercel);
```

## License

MIT
npm package: @foxman/plugin-automount
Description: Router 自动刷新
Latest version: 1.0.1

# Automount
> Foxman-Plugin

## 如何启用
1. cd path/to/project(以启用 foxman 的工程)
2. npm i --save-dev foxman-plugin-automount
3. 在 foxman.config.js 中新增 plugins 的配置项
```javascript
const Automount = require('foxman-plugin-automount');
module.exports = {
    ...
    plugins: [
        new Automount({
            tplUrlMap: {
                '/index.html': 'index',
                '/index2.html': 'index',
            },
            /**
             * 同步接口 xxx.ftl 映射实际url的接口，默认如下
             * @param ftlPath(不带后缀)
             * @returns {string|*|XML|void} 
             */
            syncDataMatch: ftlPath => { 
                return '/' + ftlPath + '.html'; 
            },
            /**
             * 异步接口 xxx.json 映射实际url的接口，默认如下
             * @param dataPath(不带后缀)
             * @returns {string|*|XML|void} 
             */
            asyncDataMatch: dataPath => {
                return '/' + dataPath + '.html'; 
            }
        })
    ],
    ...
}
```

[查看例子](../../example/foxman.config.js)
npm package: @foxman/plugin-mock-control
Description: > 扩展 Foxman 基础的 Mock 方式
Author: June
Latest version: 1.2.3

# MockControl
> 扩展 Foxman 基础的 Mock 方式

## 插件作用
Foxman 基础的 Mock 方式，是返回静态的 json。但是，我们终究会遇到一些特殊的需求：
1. 根据请求对响应数据进行定制；
2. 模拟请求超时
3. Mock 文件下载功能
4. JSONP 等其他非 JSON 格式的 异步数据响应

而这个插件的作用，就是扩展 Foxman 的 Mock 数据加工的能力。

## DEMO 演示
```bash
$ git clone https://github.com/kaola-fed/foxman/
$ cd packages/foxman-plugin-mockcontrol/example/
$ npm i # 无梯子用户推荐 cnpm
$ npm start
```

* [根据请求来定制响应 DEMO](http://127.0.0.1:9000/example.1.ftl)
* [jsonp 响应 DEMO](http://127.0.0.1:9000/example.2.ftl)
* [下载文件 DEMO](http://127.0.0.1:9000/example.3.ftl)
* [延时响应 DEMO](http://127.0.0.1:9000/example.4.ftl)
* [延时响应 + JSONP DEMO](http://127.0.0.1:9000/example.5.ftl)

⚠️  以上都是本地链接

## 如何引入
1. cd `path/to/project` (已启用 foxman 的工程)
2. `npm i --save-dev @foxman/plugin-mock-control`
3. 在 `foxman.config.js` 中新增 plugins 的配置项

```javascript
const MockControl = require('@foxman/plugin-mock-control');
module.exports = {
    ...
    plugins: [
        new MockControl({
            mapJS: function (dataPath) { // (mockDATA) => mockJS
                return dataPath.replace(/\.json$/, '.js');
            }
        })
    ],
    ...
}
```
* mapJS - 从 Mock Data 文件到 Mock JS 文件的映射方式，缺省为与 `.json` 同名 `.js` 文件 

## Mock JS 能力说明
* this 指向 koa 当前请求的 context
```js
module.exports = function () {
    console.log(this);
}
```

* 第一个参数为 mock 数据
```js
module.exports = function (data) {
    console.log('data', data);
}
```

* 当方法体含 return 语句时，会将 return 的对象用于后续的页面渲染
```js
module.exports = function (data) {
    return data;
}
```

* 当方法体不含 return 语句，则不再执行后续中间件。此时，可以指定 `this.body`
```js
module.exports = function (data) {
    this.body = 'without return.'
}
```

* 支持 `generator`，用于处理异步的场景
```js
module.exports = function * (data) {
    yield new Promise((resolve) => {
        setTimeout(resolve, 3000);
    });
    return data;
}
```
npm package: @foxman/plugin-route-display
Description: route-display
Author: June
Latest version: 1.0.2

# RouteDisplay
> Foxman-Plugin

## 如何启用
1. cd path/to/project(以启用 foxman 的工程)
2. npm i --save-dev foxman-plugin-route-display
3. 在 foxman.config.js 中新增 plugins 的配置项
```javascript
const RouteDisplay = require('foxman-plugin-route-display');
module.exports = {
    ...
    plugins: [
        new RouteDisplay()
    ],
    ...
}
```
npm package: @foxman/plugin-webpack-dev-server
Description: Webpack Dev Server For Foxman
Author: June
Latest version: 1.0.0

## WebpackDevServer
> Foxman-Plugin

### 如何启用
1. cd path/to/project(以启用 foxman 的工程)
2. npm i --save-dev foxman-plugin-webpack-dev-server
3. 在 foxman.config.js 中新增 plugins 的配置项
```javascript
const WebpackDevServer = require('foxman-plugin-webpack-dev-server');
const webpackConfig = require('./webpack.config');
module.exports = {
    ...
    plugins: [
         new WebpackDevServer({
            webpackConfig,
            devServerConfig:{
                quiet: true,
                noInfo: true
            }
        })
    ],
    ...
}
```
### devServerConfig 默认配置项
```javascript
options.devServerConfig = {
    noInfo: false,
    // display no info to console (only warnings and errors)

    quiet: false,
    // display nothing to the console

    lazy: true,
    // switch into lazy mode
    // that means no watching, but recompilation on every request
    watchOptions: {
        aggregateTimeout: 300
    },
    // filename: "bundle.js",
    // delay after change (only lazy: false)
    // public path to bind the middleware to
    // use the same as in webpack

    headers: {"X-Custom-Header": "yes"},
    // custom headers

    stats: {
        colors: true
    },
    contentBase: webpackConfig.output.path,
    publicPath: webpackConfig.output.publicPath,
    hot: true,
    // stats: webpackConf.devServer.stats
    // options for formating the statistics
}
```
npm package: @foxmn/mdx-loader
Description: Loader for MDX
Author: John Otander
Latest version: 1.5.14

# `@mdx-js/loader`

[![Build Status][build-badge]][build]
[![lerna][lerna-badge]][lerna]
[![Join the community on Spectrum][spectrum-badge]][spectrum]

Webpack loader for [MDX][].

## Installation

[npm][]:

```sh
npm i -D @mdx-js/loader
```

## Usage

```js
// ...
module: {
  rules: [
    // ...
    {
      test: /\.mdx?$/,
      use: ['babel-loader', '@mdx-js/loader']
    }
  ]
}
```

The `renderer` option specifies a string that will be prepended to the generated source allowing for the use of any `createElement` implementation. By default, that string is:

```js
import React from 'react'
import {mdx} from '@mdx-js/react'
```

Using the `renderer` option, one can swap out React for another implementation. The example below wraps a generic JSX compatible function named `h`.

```js
const renderer = `
import { h } from 'generic-implementation'

const mdx = (function (createElement) {
  return function (name, props, ...children) {
    if (typeof name === 'string') {
      if (name === 'wrapper') return children.map(createElement)
      if (name === 'inlineCode') return createElement('code', props, ...children)
    }

    return createElement(name, props, ...children)
  }
}(h))
`

// ...
module: {
  rules: [
    // ...
    {
      test: /\.mdx?$/,
      use: [
        'babel-loader',
        {
          loader: '@mdx-js/loader'
          options: {
            renderer,
          }
        }
      ]
    }
  ]
}
```

For more information on why this is required, see [this post](https://mdxjs.com/blog/custom-pragma).

## Contribute

See the [Support][] and [Contributing][] guidelines on the MDX website for ways
to (get) help.

This project has a [Code of Conduct][coc].
By interacting with this repository, organisation, or community you agree to
abide by its terms.

## License

[MIT][] © [Compositor][] and [ZEIT][]

<!-- Definitions -->

[build]: https://travis-ci.com/mdx-js/mdx
[build-badge]: https://travis-ci.com/mdx-js/mdx.svg?branch=master
[lerna]: https://lernajs.io/
[lerna-badge]: https://img.shields.io/badge/maintained%20with-lerna-cc00ff.svg
[spectrum]: https://spectrum.chat/mdx
[spectrum-badge]: https://withspectrum.github.io/badge/badge.svg
[contributing]: https://mdxjs.com/contributing
[support]: https://mdxjs.com/support
[coc]: https://github.com/mdx-js/.github/blob/master/code-of-conduct.md
[mit]: license
[compositor]: https://compositor.io
[zeit]: https://zeit.co
[mdx]: https://github.com/mdx-js/mdx
[npm]: https://docs.npmjs.com/cli/install
npm package: @foxmn/next-mdx
Description: Use [MDX](https://github.com/mdx-js/mdx) with [Next.js](https://github.com/zeit/next.js)
Latest version: 9.2.3

# Next.js + MDX

Use [MDX](https://github.com/mdx-js/mdx) with [Next.js](https://github.com/zeit/next.js)

## Installation

```
npm install @next/mdx @mdx-js/loader
```

or

```
yarn add @next/mdx @mdx-js/loader
```

## Usage

Create a `next.config.js` in your project

```js
// next.config.js
const withMDX = require('@next/mdx')()
module.exports = withMDX()
```

Optionally you can provide [MDX options](https://github.com/mdx-js/mdx#options):

```js
// next.config.js
const withMDX = require('@next/mdx')({
  options: {
    mdPlugins: [],
    hastPlugins: [],
  },
})
module.exports = withMDX()
```

Optionally you can add your custom Next.js configuration as parameter

```js
// next.config.js
const withMDX = require('@next/mdx')()
module.exports = withMDX({
  webpack(config, options) {
    return config
  },
})
```

Optionally you can match other file extensions for MDX compilation, by default only `.mdx` is supported

```js
// next.config.js
const withMDX = require('@next/mdx')({
  extension: /\.(md|mdx)$/,
})
module.exports = withMDX()
```

## Top level .mdx pages

Define the `pageExtensions` option to have Next.js handle `.mdx` files in the `pages` directory as pages:

```js
// next.config.js
const withMDX = require('@next/mdx')({
  extension: /\.mdx?$/,
})
module.exports = withMDX({
  pageExtensions: ['js', 'jsx', 'mdx'],
})
```

## Typescript

Follow [this guide](https://mdxjs.com/advanced/typescript) from the MDX docs.
npm package: @foxnot/fiducial-oauth
Description: Get an authorization code to use the fiducial api
Author: Foxnot
Latest version: 0.0.3

# fiducial-oauth

## Preamble
Here is the authentication workflow of a Fiducial user in order to use the API:
- The user is redirected to the authentication provider.
- The user enters his login details
- The user authorizes the connection
- The authentication provider redirects to a URL of your application with an authorization code allowing you to generate a session token to call the Fiducial API

This package was developed in the context of an already loaded application so as not to disrupt the user experience.

The objective of the package is to be able to obtain an authorization code using two components:
- A login button
- An empty page allowing to pass the code to your application

## Installation

```
yarn add @foxnot/fiducial-oauth
```

### Environment variables to set
* **PROVIDER_FICUCIAL_API_URL** (by example https://preprod-auth.signatureparfiducial.fr)
* **PROVIDER_FIDUCIAL_API_KEY** (your public key provided by Fiducial)
* **PROVIDER_FICUCIAL_API_CALLBACK_URI** (your redirect uri)

## Implementation
Here is an example of implementation in a ReactJs application
### Add the login button in your application
```
import React, {useEffect, useRef} from 'react';
import {AuthenticatorButton, AuthenticatorButtonModel} from '@foxnot/fiducial-oauth';
import '@foxnot/fiducial-oauth/asset/css/button.css';

export const MyComponent = () => {
    const ref = useRef();
    const ButtonModel = new AuthenticatorButtonModel('fiducial-oauth-button', 'btn btn-primary', 'Connexion');

    const callback = (authorizationCode:string) => {
        // Authorisation code is received, lets your backend get an oauth token and implement your business logic
    }

    useEffect(() => {
        const MyButton:HTMLButtonElement = AuthenticatorButton.render(ButtonModel, callback);
        ref.current.appendChild(MyButton);
    }, []);

    // @ts-ignore
    return <div ref={ ref } />
}
```

### Add to your redirection page, the transition mechanism of the authorization code
```
import {IProvider} from "./interfaces/IProvider";
import {ProviderCallbackStatusEnum} from "./enums/status.enum";
import {AuthenticatorPage} from '@foxnot/fiducial-oauth';

export class FiducialProvider implements IProvider
{
    execute(args?:any):ProviderCallbackStatusEnum {
        AuthenticatorPage.execute();
        return ProviderCallbackStatusEnum.SUCCESS;
    }

    getArgs(): any {
        return;
    }
}
```
npm package: @foxochat/api-types
Description: FoxoChat API typings.
Author: FoxoCorp
Latest version: 0.1.24

# FoxoChat API Types

Simple type definitions for the FoxoChat API.

## Installation

Install with [npm](https://www.npmjs.com/) / [yarn](https://yarnpkg.com) / [pnpm](https://pnpm.js.org/):

```sh
npm install @foxochat/api-types
yarn add @foxochat/api-types
pnpm add @foxochat/api-types
```

## Usage

```ts
import { APIChannel } from "@foxochat/api-types";
```
npm package: @foxochatjs/api
Description: The API client for foxochat.js
Author: Kasefuchs
Latest version: 0.1.22

# FoxoChat API

The API client for foxochat.js

## Installation

Install with [npm](https://www.npmjs.com/) / [yarn](https://yarnpkg.com) / [pnpm](https://pnpm.js.org/):

```sh
npm install @foxochatjs/api
yarn add @foxochatjs/api
pnpm add @foxochatjs/api
```

## Usage

```ts
import API from "@foxochatjs/api";

const api = new API(rest);

api.rest.token = TOKEN;

try {
  await api.message.create(CHANNEL_ID, {
    content: "floof by coof",
  });
} catch (error) {
  console.error(error);
}
```
npm package: @foxochatjs/api-types
Description: FoxoChat API typings.
Author: Kasefuchs
Latest version: 0.1.28

# FoxoChat API Types

Simple type definitions for the FoxoChat API.

## Installation

Install with [npm](https://www.npmjs.com/) / [yarn](https://yarnpkg.com) / [pnpm](https://pnpm.js.org/):

```sh
npm install @foxochatjs/api-types
yarn add @foxochatjs/api-types
pnpm add @foxochatjs/api-types
```

## Usage

```ts
import { APIChannel } from "@foxochatjs/api-types";
```
npm package: @foxochatjs/gateway-types
Description: FoxoChat Gateway typings.
Author: Kasefuchs
Latest version: 0.1.11

# FoxoChat Gateway Types

Simple type definitions for the FoxoChat Gateway.

## Installation

Install with [npm](https://www.npmjs.com/) / [yarn](https://yarnpkg.com) / [pnpm](https://pnpm.js.org/):

```sh
npm install @foxochatjs/gateway-types
yarn add @foxochatjs/gateway-types
pnpm add @foxochatjs/gateway-types
```

## Usage

```ts
import { GatewayHelloMessage } from "@foxochatjs/gateway-types";
```
npm package: @foxochatjs/rest
Description: The HTTP REST API client for foxochat.js
Author: Kasefuchs
Latest version: 0.1.16

# FoxoChat REST

The HTTP REST API client for foxochat.js

## Installation

Install with [npm](https://www.npmjs.com/) / [yarn](https://yarnpkg.com) / [pnpm](https://pnpm.js.org/):

```sh
npm install @foxochatjs/rest
yarn add @foxochatjs/rest
pnpm add @foxochatjs/rest
```

## Usage

```ts
import REST from "@foxochatjs/rest";
import { APIRoutes, RouteUrlsMap } from "@foxochatjs/api-types";

const rest = new REST({
  baseURL: RouteUrlsMap.production.api,
});

rest.token = TOKEN;

try {
  await rest.post(APIRoutes.messages(CHANNEL_ID), {
    body: {
      content: "floof by coof",
    },
  });
} catch (error) {
  console.error(error);
}
```
npm package: @foxogram/api
Description: The API client for foxogram.js
Author: FoxoCorp
Latest version: 0.1.17
Deprecated: Use @foxochat/api instead

# Foxogram API

The API client for foxogram.js

## Installation

Install with [npm](https://www.npmjs.com/) / [yarn](https://yarnpkg.com) / [pnpm](https://pnpm.js.org/):

```sh
npm install @foxogram/api
yarn add @foxogram/api
pnpm add @foxogram/api
```

## Usage

```ts
import API from "@foxogram/api";

const api = new API(rest);

api.rest.token = TOKEN;

try {
  await api.message.create(CHANNEL_ID, {
    content: "floof by coof",
  });
} catch (error) {
  console.error(error);
}
```
npm package: @foxogram/api-types
Description: Foxogram API typings.
Author: FoxoCorp
Latest version: 0.1.20
Deprecated: Use @foxochat/api-types instead

# Foxogram API Types

Simple type definitions for the Foxogram API.

## Installation

Install with [npm](https://www.npmjs.com/) / [yarn](https://yarnpkg.com) / [pnpm](https://pnpm.js.org/):

```sh
npm install @foxogram/api-types
yarn add @foxogram/api-types
pnpm add @foxogram/api-types
```

## Usage

```ts
import { APIChannel } from "@foxogram/api-types";
```
npm package: @foxogram/gateway
Description: The Gateway client for foxogram.js
Author: FoxoCorp
Latest version: 0.1.11
Deprecated: Use @foxochat/gateway instead

# Foxogram Gateway

The Gateway client for foxogram.js

## Installation

Install with [npm](https://www.npmjs.com/) / [yarn](https://yarnpkg.com) / [pnpm](https://pnpm.js.org/):

```sh
npm install @foxogram/gateway
yarn add @foxogram/gateway
pnpm add @foxogram/gateway
```

## Usage

```ts
import Gateway from "@foxogram/gateway";
```
npm package: @foxogram/gateway-types
Description: Foxogram Gateway typings.
Author: FoxoCorp
Latest version: 0.1.8
Deprecated: Use @foxochat/gateway-types instead

# Foxogram Gateway Types

Simple type definitions for the Foxogram Gateway.

## Installation

Install with [npm](https://www.npmjs.com/) / [yarn](https://yarnpkg.com) / [pnpm](https://pnpm.js.org/):

```sh
npm install @foxogram/gateway-types
yarn add @foxogram/gateway-types
pnpm add @foxogram/gateway-types
```

## Usage

```ts
import { GatewayHelloMessage } from "@foxogram/gateway-types";
```
npm package: @foxogram/rest
Description: The HTTP REST API client for foxogram.js
Author: FoxoCorp
Latest version: 0.1.15
Deprecated: Use @foxochat/rest instead

# Foxogram REST

The HTTP REST API client for foxogram.js

## Installation

Install with [npm](https://www.npmjs.com/) / [yarn](https://yarnpkg.com) / [pnpm](https://pnpm.js.org/):

```sh
npm install @foxogram/rest
yarn add @foxogram/rest
pnpm add @foxogram/rest
```

## Usage

```ts
import REST from "@foxogram/rest";
import { APIRoutes, RouteUrlsMap } from "@foxogram/api-types";

const rest = new REST({
  baseURL: RouteUrlsMap.production.api,
})

rest.token = TOKEN;

try {
  await rest.post(APIRoutes.messages(CHANNEL_ID), {
    body: {
      content: "floof by coof",
    },
  });
} catch (error) {
  console.error(error);
}
```
npm package: @foxone/memo-encode
Description: Pando memo proto
Latest version: 0.3.4

# Pando Memo Encoding Proto

This typescript repo provide implementation of [Pando Memo Encoding Proto](https://developers.pando.im/references/action.html)

## Usage

Here is an example for converting swap params to base64 formated memo:

```ts
import { swap as MemoEncoder } from "@foxone/memo-encode";

// swap encode
const params = {
  follow_id: uuid(),
  fill_asset_id: uuid(),
  minimum: 1.00001,
  route_hash: "xyz",
  members: [],
};

// base64 memo for mixin transaction
const memo = MemoEncoder.encodeSwapMemo(params);
```

Other functions and params please read source code from `src/index.ts`