open-index/open-npm huggingface dataset:
npm package: @magicpages/ghost-typesense-cli
Description: CLI tool for managing Ghost content in Typesense
Latest version: 1.12.0

# @magicpages/ghost-typesense-cli

Command-line tool for managing Ghost content in Typesense.

## Installation

```bash
npm install -g @magicpages/ghost-typesense-cli
```

## Usage

1. Create `ghost-typesense.config.json`:

Minimal configuration:
```json
{
  "ghost": {
    "url": "https://your-ghost-blog.com",
    "key": "your-content-api-key",
    "version": "v5.0"
  },
  "typesense": {
    "nodes": [{
      "host": "your-typesense-host",
      "port": 443,
      "protocol": "https"
    }],
    "apiKey": "your-admin-api-key"
  },
  "collection": {
    "name": "ghost"
  }
}
```

The tool comes with default field configurations optimized for Ghost CMS. These include:
- Required fields: `id`, `title`, `url`, `slug`, `html`, `plaintext`, `excerpt`, `published_at`, `updated_at`
- Optional fields: `feature_image`, `tags`, `authors`

The `plaintext` field is automatically generated from HTML content if not provided by Ghost, ensuring better search quality.

You can override or add additional fields by specifying them in the config:

```json
{
  "collection": {
    "name": "ghost",
    "fields": [
      { "name": "title", "type": "string", "index": true, "sort": true },
      { "name": "plaintext", "type": "string", "index": true },
      { "name": "custom_field", "type": "string", "optional": true }
    ]
  }
}
```

The tool will ensure all required fields are present with correct types while keeping your custom fields.

2. Available commands:

```bash
# Initialize collection
ghost-typesense init --config ghost-typesense.config.json

# Sync all posts
ghost-typesense sync --config ghost-typesense.config.json

# Clear collection
ghost-typesense clear --config ghost-typesense.config.json
```

## Configuration

| Option | Description |
|--------|-------------|
| `ghost.url` | Your Ghost blog URL |
| `ghost.key` | Content API key |
| `ghost.version` | Ghost API version |
| `typesense.nodes` | Array of Typesense nodes |
| `typesense.apiKey` | Admin API key |
| `collection.name` | Collection name |

## License

MIT © [MagicPages](https://www.magicpages.co)
npm package: @magicpattern/js-sdk
Description: Integrate MagicPattern into your web app
Author: Jim Raptis
Latest version: 0.0.3

<a href="https://magicpattern.design/?ref=github"><img src="/assets/github-cover.jpg"/></a>

<div align="center">
  <img src="https://badgen.net/npm/v/@magicpattern/js-sdk" alt="Latest release" />
  <img src="https://badgen.net/bundlephobia/minzip/@magicpattern/js-sdk" alt="minzipped size"/>
</div>

<br />
<div align="center"><strong>The official library for integrating MagicPattern into your webapp.</strong></div>
<div align="center">Interested? Just hit us up at <a href="mailto:jim@magicpattern.design">jim@magicpattern.design</a></div>
<br />
<div align="center">
  <a href="https://magicpattern.design/">Website</a> 
  <span> · </span>
  <a href="https://twitter.com/magicpattern">Twitter</a>
</div>

<br />
<div align="center">
  <sub>Made by <a href="https://twitter.com/d__raptis">Jim Raptis</a> ✨</sub>
</div>
<br />

## Installation

#### With NPM

```sh
npm i @magicpattern/js-sdk
```

#### With yarn

```sh
yarn add @magicpattern/js-sdk
```

## Usage

> Be aware that we restrict the integration of MagicPattern by platforms at the moment. Are you interested? Hit me up at jim@magicpattern.design

```ts
import { openMagicPattern } from '@magicpattern/js-sdk';

async function() {
  try {
    const blob = await openMagicPattern(
      {
        provider: "YOUR PRODUCT'S NAME", // The name of your own product
        toolId: "TOOL_ID_TO_OPEN", // Optional: input image to editor
        canChangeTool: false, // Optional: can the user choose a different tool
        width: 1200, // Optional
        height: 900, // Optional
        src: "IMAGE_URL_TO_EDIT", // Optional: Used only on specific tools like the Fractral Glass generator
      }
    );

    // do something with the blob, e.g. create an object url to show it in an img tag:
    // URL.createObjectURL(blob);
  } catch (error) {
    // error handling
  }
}
```

All the available `toolId` values are:

```
const toolIds = [
  "confetti-generator",
  "grid-patterns",
  "polka-patterns",
  "noise-generator",
  "blob-compositions",
  "geometric-patterns",
  "seamless-patterns",
  "blurry-gradients",
  "wave-generator",
  "css-patterns",
  "chart-generator",
  "mesh-gradients",
  "blob-generator",
  "doodle-backgrounds",
  "iphone-13-gradients",
  "fractal-glass",
];
```

## Demo

[Demo for React.js](httcdfrps://codesandbox.io/s/magicpattern-integration-react-js-demo-d3nkih)

<!-- ## Testing Locally

1. `npm run build`
2. `npm link` in the library root directory
3. Navigate to your project and run `npm link PATH_TO_LOCAL_LIBRARY`

Use `npm prefix -g` to find local path with the linked library.
https://dev.to/one-beyond/different-approaches-to-testing-your-own-packages-locally-npm-link-4hoj
-->

<!-- 2. [Demo for vanilla JS](https://codesandbox.io/s/brandbird-integration-vanilla-js-eyvic) -->
npm package: @magicpatterns/cubed
Description: Magic Patterns design system preset for Tailwind CSS
Latest version: 0.0.6

# @magicpatterns/cubed

Design system preset and component library for Magic Patterns.

## Publish

```bash
yarn build
npm publish
```

## Development

```bash
yarn workspace @magicpatterns/cubed run build   # compile ESM + CJS
yarn workspace @magicpatterns/cubed run storybook  # run component explorer
yarn workspace @magicpatterns/cubed run lint    # lint sources
yarn workspace @magicpatterns/cubed run clean   # remove build artifacts
```
npm package: @magicpatterns/helix-shadcn-demo
Description: Shadcn-based design system preset for Tailwind CSS
Latest version: 0.0.6

# @magicpatterns/helix-shadcn-demo

This is an example design system package showing off:

- A custom NPM package being bundled and consumed by Magic Patterns
- A custom MCP server that exposes existing Storybook files + custom guidelines

This is an opinionated set up for what we've seen working well in terms of production codebases + external AI agents. The two important pieces here are:

**Context on Component Usage**: Context and examples on _how_ an agent should use your custom design system. The more the better! The implementation in this example is a custom MCP server, but there are many ways to go about this. Other solutions include:

- Directly leveraging Storybook's MCP Server add-on
- Parsing the NPM package when context is bundled in to skip needing to host a MCP server

**NPM Package**: This helps Magic Patterns use the exact same components your production web app might be using. It also helps the code be more "production-ready", in that it'll be using the same exact props / composition as you would find in the codebase. Magic Patterns uses this to render the preview of a prototype in a Vite app.

## Demo Codebase Overview

```
/guidelines
  # Inside here, you can put .md files that will be automatically exposed as context in the MCP
  # You can put anything in here including product context!
/mcp
  # This is where the MCP server lives
  # This MCP server actually scrapes the rest of the codebase to find stories and guidelines and exposes it in a toolset described in MP_DS_MCP_SPEC.md
/recipes
  # This is where extra resources on how to compose components, common layout patterns, and otherwise important documentation on how components should be used lives
/src
  # Where the design system components live
```

## Running the demo

The MCP is automatically hosted on Render. Any changes pushed to `main` will automatically deploy to Render in 5-10 minutes. The MCP currently is designed to automatically parse stories in the codebase to use as context. For example, if you create a new component with a story, the MCP when deployed will automatically include that information.
npm package: @magicpay/magicpay-js
Description: Magic Payment is an SDK provide you a secure way to redirect consumer from merchant site to magic link
Author: Ali Abdullah
Latest version: 0.0.23

## How to use in React Project

* Using Magic Link to Launch the hosted page.

* To Launch the Development Hosted page add 'isSandbox' at <magic-link> tag.
* To Launch the Production Hosted page do not add 'isSandbox' at <magic-link> tag.

* To Send Response after Operation in Onsuccess to hosted page, use '__sendEventToChild__' function with argument response format of: 

```
    response = {
      'type': 'SUCCESS_RESPONSE',
      'message': 'success message',
    }, 
    response = {
      'type': 'ERROR_RESPONSE',
      'message': 'error message,
    }
```

* Use this way to Add MagicLink, Here it's example for react.
* onSuccess and onError are function which need to pass when component is mounted, for that use 'reference' concept according to framework.

```javascript
import "@magicpay/magicpay-js";
import {sendEventToChild} from "@magicpay/magicpay-js";
import React, { useRef, useEffect } from 'react';

function App() {
  const link_token = "<example_magic_link_token>";
  const checkout_id = "<example_checkout_object_id>";
  const myRef = useRef(null);
  const onError = (data) => {
    console.log("Error Occured: ", data);
  };
  const onSuccess = (data) => {
    console.log("Success: ", data);
    response = {
      'type': 'SUCCESS_RESPONSE',
      'message': 'successful',
    }
    sendEventToChild(response)
  };
  useEffect(() => {
    const element = myRef.current;
    if (element) {
      element.onSuccess = onSuccess;
      element.onError = onError;
    }
  }, []);
  return (
    <div>
      <magic-link
        checkoutId={checkout_id}
        linkToken={link_token}
        ref={myRef}
        isSandbox
      />
    </div>
  );
}

export default App;
```

### Using Magic Marketing Component

```javascript
import "@magicpay/magicpay-js";

function App() {
  return (
    <div>
      <magic-info />
    </div>
  );
}

export default App;
```

### Using Magic Button

```javascript
import "@magicpay/magicpay-js";

function App() {
  const handleButtonClick = () => {
    console.log("Handle Button Click");
  };
  return (
    <div>
      <magic-btn onClick={handleButtonClick} />
    </div>
  );
}

export default App;
```
npm package: @magicpay/magicpay-js-public
Description: Magic Payment is an SDK provide you a secure way to redirect consumer from merchant site to magic link
Author: Ali Abdullah
Latest version: 1.0.7

## How to use in React Project

* Using Magic Link to Launch the hosted page.

* To Launch the Development Hosted page add 'isSandbox' at <magic-link> tag.
* To Launch the Production Hosted page do not add 'isSandbox' at <magic-link> tag.

* To Send Response after Operation in Onsuccess to hosted page, use '__sendEventToChild__' function with argument response format of: 

```
    response = {
      'type': 'SUCCESS_RESPONSE',
      'message': 'success message',
    }, 
    response = {
      'type': 'ERROR_RESPONSE',
      'message': 'error message,
    }
```


```javascript
import "@magicpay/magicpay-js";
import {sendEventToChild} from "@magicpay/magicpay-js";

function App() {
  const link_token = "<example_magic_link_token>";
  const checkout_id = "<example_checkout_object_id>";
  const onError = (data) => {
    console.log("Error Occured: ", data);
  };
  const onSuccess = (data) => {
    console.log("Success: ", data);
    response = {
      'type': 'SUCCESS_RESPONSE',
      'message': 'successful',
    }
    sendEventToChild(response)
  };
  return (
    <div>
      <magic-link
        checkoutId={checkout_id}
        linkToken={link_token}
        onSuccess={onSuccess}
        onError={onError}
        isSandbox
      />
    </div>
  );
}

export default App;
```

### Using Magic Marketing Component

```javascript
import "@magicpay/magicpay-js";

function App() {
  return (
    <div>
      <magic-info />
    </div>
  );
}

export default App;
```

### Using Magic Button

```javascript
import "@magicpay/magicpay-js";

function App() {
  const handleButtonClick = () => {
    console.log("Handle Button Click");
  };
  return (
    <div>
      <magic-btn onClick={handleButtonClick} />
    </div>
  );
}

export default App;
```
npm package: @magicpay/react-magicpay
Description: Magic Payment is an SDK provide you a secure way to redirect consumer from merchant site to magic link
Author: Ali Abdullah
Latest version: 0.0.18

# Magic Payment
## Dependencies
-  React 17

## Example To Open Magic Link:
```javascript
import { MagicLink, MagicButton } from "@magicpay/react-magicpay";
import React, { useState } from "react";

function App() {
  const [key, setKey] = useState(0);
  const [link, setLink] = useState(false);
  const [checkoutId] = useState("Put the checkout id here.");

  const handleClick = () => {
    setKey(key + 1);
    setLink(true);
  };

  const onError = (data) => {
    console.log("Error Occured: ", data);
  };
  const onSuccess = (data) => {
    console.log("Success: ", data);
  };
  return (
    <div className="app">
      {link && (
        <MagicLink
          key={key}
          link={link}
          checkoutId={checkoutId}
          onError={onError}
          onSuccess={onSuccess}
        />
      )}
      <MagicButton onClick={handleClick} />
    </div>
  );
}

export default App;
```
## Example for Magic Marketing Component with Popup

```javascript
import { MagicInfo } from "@magicpay/react-magicpay";
import React, { useState } from "react";

function App() {
  return (
    <div className="app">
      <MagicInfo creditAmount={"14.90"} />
    </div>
  );
}

export default App;
```
## Development
1. Take the pull from `main`
2. Use Node version `v16.19.0`
3. Install dependencies `npm install`
4. We are using storybook to create the components. Run the command `npm run storybook` and it will run the story book at `http://localhost:6006`

## NPM Management
- Create an account at [NPM](https://www.npmjs.com/)
- In the project root directory use `npm login` to login to your account. And run `npm publish` to publish the new version
- Make sure in update the version in package.json file
npm package: @magicsandbox.ai/build-docs
Description: `@magicsandbox.ai/build-docs` turns a documentation Markdown file into a [Magic Sandbox](https://magicsandbox.ai) App.
Latest version: 0.1.1

# @magicsandbox.ai/build-docs

`@magicsandbox.ai/build-docs` turns a documentation Markdown file into a [Magic Sandbox](https://magicsandbox.ai) App.

## Getting Started

`npm install "@magicsandbox.ai/build-docs"`

Refer to the [Magic Sandbox docs](https://magicsandbox.ai/?_app=magicsandbox.Docs) for details on the `magic.json5` file and Magic Sandbox in general.

`@magicsandbox.ai/build-docs` installs [@magicsandbox.ai/dev](https://github.com/magicsandbox-ai/magicsandbox/tree/main/packages/js/dev) as a dependency.

## Usage

Set up a folder structured like so, where `index.md` is your documentation Markdown file. For your links to work correctly, `magic.json5` must contain an `author` key with your username. `@magicsandbox.ai/build-docs` will throw an error if the `author` key is missing.

```
MyDocsApp/
├── magic.json5
└── index.md
```

Then run:

`npx magicsandbox docs MyDocsApp`

Which generates the following files. You may want to configure your .gitignore file to ignore the `dist` folder:

```
MyDocsApp/
├── magic.json5
├── index.md
├── dist/
│   ├── index.js
│   ├── index.html
│   └── index.css
```

And configures your `magic.json5` file like so:

```javascript
{
  scriptFile: "dist/index.js",
  htmlFile: "dist/index.html",
  styleFile: "dist/index.css",
  prebuild: "npx magicsandbox docs MyDocsApp",
  esbuildOptions: {
    loader: { ".md": "text" },
  },
}
```

You can then use `@magicsandbox.ai/dev` to preview and publish your App. All you have to do to make changes is edit the `index.md` file.

```
npx magicsandbox dev MyDocsApp
npx magicsandbox publish MyDocsApp
```

See the [@magicsandbox.ai/dev docs](https://github.com/magicsandbox-ai/magicsandbox/tree/main/packages/js/dev) for details.
npm package: @magicsandbox.ai/docs
Description: `@magicsandbox.ai/docs` provides tools for working with [Magic Sandbox](https://magicsandbox.ai) documentation.
Latest version: 0.1.3

# @magicsandbox.ai/docs

`@magicsandbox.ai/docs` provides tools for working with [Magic Sandbox](https://magicsandbox.ai) documentation.

## Getting Started

`npm install "@magicsandbox.ai/docs"`

## Usage

### Importing the Docs

`@magicsandbox.ai/docs` exposes a `docs.md` file that contains the Magic Sandbox documentation:

```javascript
import docs from "@magicsandbox.ai/docs/docs.md";
```

Make sure your bundler is configured to load Markdown files:

```javascript
{
  esbuildOptions: {
    loader: { ".js": "jsx", ".md": "text" },
  }
}
```

### getHeadings

You can use `getHeadings` to extract specific headings from the docs:

```javascript
import docs from "@magicsandbox.ai/docs/docs.md";
import { getHeadings } from "@magicsandbox.ai/docs";

function context() {
  return `Context specific to my App here...

  Magic Sandbox executes Apps in a sandbox. The restrictions and capabilities of the Sandbox are documented below:

  ${getHeadings(docs, ["Sandbox"])}
  `;
}

export { context };
```
npm package: @magicsandbox.ai/esbuild-plugin-tailwind
Description: `@magicsandbox.ai/esbuild-plugin-tailwind` is an esbuild plugin for Tailwind.
Latest version: 0.1.0

# @magicsandbox.ai/esbuild-plugin-tailwind

`@magicsandbox.ai/esbuild-plugin-tailwind` is an esbuild plugin for Tailwind.

## Getting Started

`npm install "@magicsandbox.ai/esbuild-plugin-tailwind"`

## Usage

```js
import { tailwindPlugin } from "@magicsandbox.ai/esbuild-plugin-tailwind";
import config from "./tailwind.config.js";

await esbuild.build({
  //other options...
  plugins: [tailwindPlugin(config)],
});
```
npm package: @magicsandbox.ai/react-sandbox
Description: `@magicsandbox.ai/react-sandbox` is a React Sandbox component for [Magic Sandbox](https://magicsandbox.ai).
Latest version: 0.2.2

# @magicsandbox.ai/react-sandbox

`@magicsandbox.ai/react-sandbox` is a React Sandbox component for [Magic Sandbox](https://magicsandbox.ai).

## Getting Started

`npm install "@magicsandbox.ai/react-sandbox"`

See [magicsandbox.Assistant](https://github.com/magicsandbox-ai/magicsandbox/tree/main/apps/Assistant) for example usage.
npm package: @magicsandbox.ai/streaming
Description: `@magicsandbox.ai/streaming` is a collection of streaming utilities for [Magic Sandbox](https://magicsandbox.ai).
Latest version: 0.2.1

# @magicsandbox.ai/streaming

`@magicsandbox.ai/streaming` is a collection of streaming utilities for [Magic Sandbox](https://magicsandbox.ai).

## Getting Started

`npm install "@magicsandbox.ai/streaming"`

See the [Magic Sandbox docs](https://magicsandbox.ai/?_app=magicsandbox.Docs#streaming-json) for example usage.
npm package: @magicsandbox.ai/tailwind-browser
Description: `@magicsandbox.ai/tailwind-browser` is a utility for using Tailwind in the browser.
Latest version: 0.2.0

# @magicsandbox.ai/tailwind-browser

`@magicsandbox.ai/tailwind-browser` is a utility for using Tailwind in the browser.

## Getting Started

`npm install "@magicsandbox.ai/tailwind-browser"`

## Usage

```js
import processTailwind from "@magicsandbox.ai/tailwind-browser";

const config = {
  content: [{ raw: '<div class="font-bold">', extension: "html" }],
};

const css = "@tailwind base; @tailwind components; @tailwind utilities;";

processTailwind(config, css).then(({ processedCss }) => {
  console.log(processedCss);
});

/*
...base, components, utilities styles...
.font-bold {
  font-weight: 700;
}
*/
```
npm package: @magicsandbox.ai/types
Description: `@magicsandbox.ai/types` is a collection of TypeScript types for [Magic Sandbox](https://magicsandbox.ai).
Latest version: 0.2.0

# @magicsandbox.ai/types

`@magicsandbox.ai/types` is a collection of TypeScript types for [Magic Sandbox](https://magicsandbox.ai).

## Getting Started

Refer to the docs for [magicsandbox.ai/dev](https://github.com/magicsandbox-ai/magicsandbox/tree/main/packages/js/dev) to get started.
npm package: @magicsandbox/monaco-yaml
Description: YAML plugin for the Monaco Editor
Author: Kevin Decker
Latest version: 2.1.2

# Monaco YAML

YAML language plugin for the Monaco Editor. It provides the following features when editing YAML files:
* Code completion, based on JSON schemas or by looking at similar objects in the same file
* Hovers, based on JSON schemas
* Validation: Syntax errors and schema validation
* Formatting
* Document Symbols
* Syntax highlighting
* Automatically load remote schema files (by enabling DiagnosticsOptions.enableSchemaRequest)

Schemas can also be provided by configuration. See [here](https://github.com/Microsoft/monaco-json/blob/master/src/monaco.d.ts)
for the API that the JSON plugin offers to configure the JSON language support.

## Installing

`yarn add monaco-yaml`
See `test/index.html` as an example. Currently only load with vs loader is supported. (AMD)
Load with ESM is added, but not yet tested.

## Development

* `git clone https://github.com/pengx17/monaco-yaml`
* `cd monaco-yaml`
* `yarn`
* open `$/monaco-yaml/demo/index.html` in your favorite browser.

A running example:
![demo-image](test-demo.png)

## Credits
- https://github.com/redhat-developer/yaml-language-server

### Maintain
Manually clone dependencies list below and update the project files accordingly:
- `src/languageservice`: https://github.com/redhat-developer/yaml-language-server
  - `cp yaml-language-server/src/languageservice monaco-yaml/src/languageservice`
  - Modify the import paths, go to the test page and see if it still works
- `src/yaml-ast-parser`: https://github.com/mulesoft-labs/yaml-ast-parser/tree/master/src

## License
[MIT](https://github.com/pengx17/monaco-yaml/blob/master/LICENSE.md)
npm package: @magicsoup.io/instant
Description: An instant React-Native starter for instant apps. Open lid, add hot water, boil, enjoy!
Author: zauberware
Latest version: 0.0.70



# MagicSoup.io - Instant

A lightweight component library for your next React-Native project. The *soup* is getting cooked with [styled-components](https://github.com/styled-components/styled-components) and [styled-system](https://github.com/jxnblk/styled-system).

Inspired by [rebass-native](https://github.com/Hermanya/rebass-native) we at [zauberware](https://www.zauberware.com) created our own component starter library: **[MagicSoup.io](https://magicsoup.io)**!

**We love to code! We love to share! We love to create awesome UIs!**

Our goal is to write clean, flexile, maintainable and extendable components. MagicSoup.io follows the principles of component based frontend design and implements the philosophy of `styled-components` and `styled-system`. For us it's one of the best starter libraries to create individual designed mobile interfaces.


## Principles

- Minimal
- Useful
- Unopinionated
- Flexible
- Consistent
- Extensible
- Themeable

## Features

- A starter library to create your own React-Native component library
- Easy adoption, well known props because of [styled-system](https://github.com/jxnblk/styled-system) 
- Stateless UI components
- Theming is possible and easy
- Components are extensible
- Speeds up your frontend development

## Installation

`npm i @magicsoup.io/instant`

## Documentation

### Quick start
`import { TextInput } from '@magicsoup.io/instant'`

```
<TextInput
  fontSize={[ 3, 4, 5 ]}
  fontWeight='bold'
  color='primary' />
```

## TBD
- Docs (Finish docs for base components)
- Logo (Creating a logo for MagicSoup.io)
- Badges (Adding travis CI, Code coverage etc.)
- Default props (give all components the right default props)
- Sandbox (LiveCode with X?)
- Examples (building higher order components)
- Boilerplates (create-react-app, gatsby)
- Authors, Contributors
- Extension packs:
  - magicsoup-io/greens
  - magicsoup-io/form
    - Checkbox
    - Radio
    - Input
    - Textarea
    - Switch
    - Label
  - magicsoup-io/marketing
    - ?
  - magicsoup-io/progress
  - magicsoup-io/menu
  - magicsoup-io/tabs
  - magicsoup-io/accordion
  - magicsoup-io/slider
  - magicsoup-io/truncate
npm package: @magicspace/boilerplate-url
Description: [![NPM version](https://img.shields.io/npm/v/@magicspace/boilerplate-url?color=%23cb3837&style=flat-square)](https://www.npmjs.com/package/@magicspace/boilerplate-url) [![MIT License](https://img.shields.io/badge/license-MIT-999999?style=flat-square)](./L
Author: Chengdu Mufan Technology Co., Ltd.
Latest version: 0.4.0

[![NPM version](https://img.shields.io/npm/v/@magicspace/boilerplate-url?color=%23cb3837&style=flat-square)](https://www.npmjs.com/package/@magicspace/boilerplate-url)
[![MIT License](https://img.shields.io/badge/license-MIT-999999?style=flat-square)](./LICENSE)
[![Discord](https://img.shields.io/badge/chat-discord-5662f6?style=flat-square)](https://discord.gg/vanVrDwSkS)

# Boilerplate URL

A [magicspace](https://github.com/makeflow/magicspace) boilerplate that downloads content from URL.

Currently supports only `zip` format.

## Usage

```bash
npm install --global magicspace @magicspace/boilerplate-url

magicspace create @magicspace/boilerplate-url
```

## Example

```json
{
  "extends": "@magicspace/boilerplate-url",
  "options": {
    "url": "https://github.com/react-boilerplate/react-boilerplate/archive/master.zip",
    "strip": 1
  }
}
```

## License

MIT License.
npm package: @magicspace/boilerplate-url-resolver
Description: [![NPM version](https://img.shields.io/npm/v/@magicspace/boilerplate-url-resolver?color=%23cb3837&style=flat-square)](https://www.npmjs.com/package/@magicspace/boilerplate-url-resolver) [![MIT License](https://img.shields.io/badge/license-MIT-999999?style
Author: Chengdu Mufan Technology Co., Ltd.
Latest version: 0.4.0

[![NPM version](https://img.shields.io/npm/v/@magicspace/boilerplate-url-resolver?color=%23cb3837&style=flat-square)](https://www.npmjs.com/package/@magicspace/boilerplate-url-resolver)
[![MIT License](https://img.shields.io/badge/license-MIT-999999?style=flat-square)](./LICENSE)
[![Discord](https://img.shields.io/badge/chat-discord-5662f6?style=flat-square)](https://discord.gg/vanVrDwSkS)

# @magicspace/boilerplate-url-resolver

Used by [@magicspace/boilerplate-url](../boilerplate-url) internally to download and extract boilerplate from given URL.

## License

MIT License.
npm package: @magicspace/configs
Description: Custom TSLint rules for MagicSpace.
Author: Chengdu Mufan Technology Co., Ltd.
Latest version: 0.2.5

# @magicspace/configs

- `@magicspace/configs/prettier`
- `@magicspace/configs/tsconfig.json`

## Installation

```bash
yarn add @magicspace/configs --dev
```

## Usage

`prettier.config.js`

```js
module.exports = require('@magicspace/configs/prettier');
```

`tsconfig.json`

```json
{
  "extends": "@magicspace/configs/tsconfig.json"
}
```
npm package: @magicspace/core
Description: [![NPM version](https://img.shields.io/npm/v/@magicspace/core?color=%23cb3837&style=flat-square)](https://www.npmjs.com/package/@magicspace/core) [![MIT License](https://img.shields.io/badge/license-MIT-999999?style=flat-square)](./LICENSE) [![Discord](ht
Author: Chengdu Mufan Technology Co., Ltd.
Latest version: 0.4.0

[![NPM version](https://img.shields.io/npm/v/@magicspace/core?color=%23cb3837&style=flat-square)](https://www.npmjs.com/package/@magicspace/core)
[![MIT License](https://img.shields.io/badge/license-MIT-999999?style=flat-square)](./LICENSE)
[![Discord](https://img.shields.io/badge/chat-discord-5662f6?style=flat-square)](https://discord.gg/vanVrDwSkS)

# @magicspace/core

Just another awesome magic.

## License

MIT License.
npm package: @magicspace/eslint-plugin
Description: Custom ESLint rules for MagicSpace.
Author: Chengdu Mufan Technology Co., Ltd.
Latest version: 0.1.32

# @magicspace/eslint-plugin

- `plugin:@magicspace/default`
- `plugin:@magicspace/override-dev`

## 安装

使用下面的命令来进行安装

```
yarn add @magicspace/configs @magicspace/eslint-plugin --dev
```

## 使用

使用的时候需要将 parserOptions.project 赋值成 tsconfig.json 相对于 eslintrc 的路径，就像下面这样。

```js
module.exports = {
  extends: ['plugin:@magicspace/default', 'plugin:@magicspace/override-dev'],
  parserOptions: {
    project: './tsconfig.json',
    tsconfigRootDir: __dirname,
  },
};
```

## eslint vscode 插件的配置示例

```json
{
  "eslint.validate": [
    "javascript",
    {
      "language": "typescript",
      "autoFix": true
    }
  ],
  "typescript.tsdk": "node_modules\\typescript\\lib"
}
```

## 规则

魔法空格里面集成了一些规则可以提供一些风格层面的检查工作。

### Import-Groups

它能够帮助你将 import 语句进行分组，比如:

```ts
// 内建模块
import * as FS from 'fs';
import * as Path from 'path';

// 第三方模块
import * as request from 'request';
```

Import-Groups 提供了两种分组规则:

1.  \$node-core 对内建模块进行分组
2.  \$node-modules 对第三方模块进行分组

配置形如：

```json
{
  "groups": [
    {"name": "node-core", "test": "$node-core"},
    {"name": "node-modules", "test": "$node-modules"}
  ],
  "ordered": true
}
```

name 字段可以指定 group 的名字，test 为 group 的匹配规则， 除此之外， 你还可以自己添加一些自定义 group，test 可以为正则表达式

你还可以指定 ordered 字段，来让你的分组变的有顺序， 任意一个分组的顺序变动都会导致 import-groups 抛出 failure ，如果你不想这样， 你可以将它设置为 false

### Scoped-Modules

使用此规则之前必须要达成一个约定，即以 @ 开头的模块，是默认不导出的。Scoped-Modules 帮你做了检查的工作，任何以 @ 开头的模块被导出都会抛出 failure

此外， 如果有 index.ts (.js)，那么，在此目录下任何不为 @ 的模块都必须被导出

配置 `tslint.json` 下的 `rules` 开启该规则:

```json
{
  "scoped-modules": true
}
```

### Explicit-Return-Type

此规则规定，必须要显示的声明函数的返回值， 但是又一些特殊情况可以不必添加返回值。比如

```ts
[1, 2, 3].map(item => item + 1);
```

配置 `tslint.json` 下的 `rules` 开启该规则:

```json
{
  "explicit-return-type": true
}
```

### Import-Path-Convention

当你需要导入在 baseUrl 目录下的模块时，这个规则会特别有用

它会帮你检查引入的路径。比如 baseUrl 为 core，有一个模块 foo 存在于 core 目录下

假如当前模块在 baseUrl 之外

```ts
import {foo} from '../core/foo'; // failure
```

```ts
import {foo} from 'foo'; //right
```

假如当前模块在 baseUrl 内

```ts
import {foo} from 'foo'; //failure
```

```ts
import {foo} from './foo'; //right
```

如果你希望 Import-Path-Convention 帮你做这些检查， 并提供修复， 那么你可以在配置项里开启它，并在它的配置里写上 baseUrl 的路径

```json
{
  "import-path-convention": [
    true,
    {
      "baseUrl": "src/core",
      "tsConfigSearchName": "tsconfig.json"
    }
  ]
}
```

tsConfigSearchName 字段是为了描述处于项目根目录的文件

比如，你可以指定 tsConfigSearchName 为 tsconfig.json，那么 import-path-convention 将会找到项目里的 tsconfig.json，以此来确定项目的根目录

这两个字段都是很必要的，请在使用之前将它们配置好

### import-path-no-parent

这个规则能够帮助你避免循环引用

配置 `tslint.json` 下的 `rules` 开启该规则:

```json
{
  "import-path-no-parent": true
}
```

### Empty-Line-Around-Blocks

该规则要求在多数含有代码块的语句周围存在适当的空行

配置 `tslint.json` 下的 `rules` 开启该规则:

```json
{
  "empty-line-around-blocks": true
}
```
npm package: @magicspace/tslint-rules
Description: Custom TSLint rules for MagicSpace.
Author: Chengdu Mufan Technology Co., Ltd.
Latest version: 0.1.46

# @magicspace/tslint-rules

## 规则

魔法空格里面集成了一些规则可以提供一些风格层面的检查工作。

### Import-Groups

它能够帮助你将 import 语句进行分组，比如:

```ts
// 内建模块
import * as FS from 'fs';
import * as Path from 'path';

// 第三方模块
import * as request from 'request';
```

Import-Groups 提供了两种分组规则:

1.  \$node-core 对内建模块进行分组
2.  \$node-modules 对第三方模块进行分组

配置形如：

```json
{
  "groups": [
    {"name": "node-core", "test": "$node-core"},
    {"name": "node-modules", "test": "$node-modules"}
  ],
  "ordered": true
}
```

name 字段可以指定 group 的名字，test 为 group 的匹配规则， 除此之外， 你还可以自己添加一些自定义 group，test 可以为正则表达式

你还可以指定 ordered 字段，来让你的分组变的有顺序， 任意一个分组的顺序变动都会导致 import-groups 抛出 failure ，如果你不想这样， 你可以将它设置为 false

### Scoped-Modules

使用此规则之前必须要达成一个约定，即以 @ 开头的模块，是默认不导出的。Scoped-Modules 帮你做了检查的工作，任何以 @ 开头的模块被导出都会抛出 failure

此外， 如果有 index.ts (.js)，那么，在此目录下任何不为 @ 的模块都必须被导出

配置 `tslint.json` 下的 `rules` 开启该规则:

```json
{
  "scoped-modules": true
}
```

### Explicit-Return-Type

此规则规定，必须要显示的声明函数的返回值， 但是又一些特殊情况可以不必添加返回值。比如

```ts
[1, 2, 3].map(item => item + 1);
```

配置 `tslint.json` 下的 `rules` 开启该规则:

```json
{
  "explicit-return-type": true
}
```

### Import-Path-Convention

当你需要导入在 baseUrl 目录下的模块时，这个规则会特别有用

它会帮你检查引入的路径。比如 baseUrl 为 core，有一个模块 foo 存在于 core 目录下

假如当前模块在 baseUrl 之外

```ts
import {foo} from '../core/foo'; // failure
```

```ts
import {foo} from 'foo'; //right
```

假如当前模块在 baseUrl 内

```ts
import {foo} from 'foo'; //failure
```

```ts
import {foo} from './foo'; //right
```

如果你希望 Import-Path-Convention 帮你做这些检查， 并提供修复， 那么你可以在配置项里开启它，并在它的配置里写上 baseUrl 的路径

```json
{
  "import-path-convention": [
    true,
    {
      "baseUrl": "src/core",
      "tsConfigSearchName": "tsconfig.json"
    }
  ]
}
```

tsConfigSearchName 字段是为了描述处于项目根目录的文件

比如，你可以指定 tsConfigSearchName 为 tsconfig.json，那么 import-path-convention 将会找到项目里的 tsconfig.json，以此来确定项目的根目录

这两个字段都是很必要的，请在使用之前将它们配置好

### import-path-no-parent

这个规则能够帮助你避免循环引用

配置 `tslint.json` 下的 `rules` 开启该规则:

```json
{
  "import-path-no-parent": true
}
```

### Empty-Line-Around-Blocks

该规则要求在多数含有代码块的语句周围存在适当的空行

配置 `tslint.json` 下的 `rules` 开启该规则:

```json
{
  "empty-line-around-blocks": true
}
```
npm package: @magicspace/utils
Description: [![NPM version](https://img.shields.io/npm/v/@magicspace/utils?color=%23cb3837&style=flat-square)](https://www.npmjs.com/package/@magicspace/utils) [![MIT License](https://img.shields.io/badge/license-MIT-999999?style=flat-square)](./LICENSE) [![Discord](
Author: Chengdu Mufan Technology Co., Ltd.
Latest version: 0.4.0

[![NPM version](https://img.shields.io/npm/v/@magicspace/utils?color=%23cb3837&style=flat-square)](https://www.npmjs.com/package/@magicspace/utils)
[![MIT License](https://img.shields.io/badge/license-MIT-999999?style=flat-square)](./LICENSE)
[![Discord](https://img.shields.io/badge/chat-discord-5662f6?style=flat-square)](https://discord.gg/vanVrDwSkS)

# @magicspace/utils

Just another awesome magic.

## License

MIT License.
npm package: @magicsrl/expo-android-esim-manager
Description: Native eSIM manager access through Expo Modules
Author: Bruno
Latest version: 0.1.4

# expo-android-esim-manager

Native esim manager access throguh expo modules

# API documentation

- [Documentation for the latest stable release](https://docs.expo.dev/versions/latest/sdk/android-esim-manager/)
- [Documentation for the main branch](https://docs.expo.dev/versions/unversioned/sdk/android-esim-manager/)

# Installation in managed Expo projects

For [managed](https://docs.expo.dev/archive/managed-vs-bare/) Expo projects, please follow the installation instructions in the [API documentation for the latest stable release](#api-documentation). If you follow the link and there is no documentation available then this library is not yet usable within managed projects &mdash; it is likely to be included in an upcoming Expo SDK release.

# Installation in bare React Native projects

For bare React Native projects, you must ensure that you have [installed and configured the `expo` package](https://docs.expo.dev/bare/installing-expo-modules/) before continuing.

### Add the package to your npm dependencies

```
npm install expo-android-esim-manager
```

### Configure for Android




### Configure for iOS

Run `npx pod-install` after installing the npm package.

# Contributing

Contributions are very welcome! Please refer to guidelines described in the [contributing guide]( https://github.com/expo/expo#contributing).
npm package: @magicswap/sdk
Description: 🛠 An SDK for building applications on top of MagicSwap.
Latest version: 2.6.1

# MagicSwap SDK

Forked from the [Uniswap SDK](https://github.com/Uniswap/uniswap-v2-sdk/commit/a88048e9c4198a5bdaea00883ca00c8c8e582605).

You can refer to the Uniswap SDK documentation [uniswap.org](https://docs.uniswap.org/sdk/2.0.0/).

## Running tests

To run the tests, follow these steps. You must have at least node v10 and [yarn](https://yarnpkg.com/) installed.

First clone the repository:

```sh
git clone https://github.com/alphadev2022/magic_swap_sdk.git
```

Move into the magic-swap-sdk working directory

```sh
cd magic_pswap_sdk/
```

Install dependencies

```sh
yarn install
```

Run tests

```sh
yarn test
```

You should see output like the following:

```sh
yarn run v1.22.4
$ tsdx test
 PASS  test/constants.test.ts
 PASS  test/pair.test.ts
 PASS  test/fraction.test.ts
 PASS  test/miscellaneous.test.ts
 PASS  test/entities.test.ts
 PASS  test/trade.test.ts

Test Suites: 1 skipped, 6 passed, 6 of 7 total
Tests:       3 skipped, 82 passed, 85 total
Snapshots:   0 total
Time:        5.091s
Ran all test suites.
✨  Done in 6.61s.
```
npm package: @magictrail/vue
Description: Magictrail vue plugin to track events
Author: vijayasankar jothi
Latest version: 1.0.1

# @magictrail/vue

Magictrail Vue plugin to track events

## Installation
```bash
npm install @magictrail/vue
```

## Usage
```js
import MagicTrailVuePlugin from '@magictrail/vue'; 
// Register the library as a plugin
const app = createApp(App);
app.use(MagicTrailVuePlugin,{token: "<TOKEN>", url: "<URL>"});
app.mount('#app');
```

## Track events
```js
import { track } from '@magictrail/vue'; 

// track events - all the fields are customizable
track("events",{
    name: "Order Placed",
    item : "#1233",
    tags: ["sss"]
})

// set user identity - all the fields are customizable
track("users",{
    name: "Jack",
    email : "jack@gmail.com", 
    userid: "29384"
    plan: "paying"
})
```
npm package: @magicwrites/gus-api
Description: Service to communicate with Polish GUS
Latest version: 1.0.9

# Quickstart

## Installation

```bash
npm install @magicwrites/gus-api
```

## Example usage

```javascript
import { GusApiRegon } from '@magicwrites/gus-api';

const service = new GusApiRegon('YOUR_API_KEY');

const results = await service.search({
  Nip: '1234567890',
});

console.log('Results', results);
```

## Search params

| Name       | Example                       | Optional |
| ---------- | ----------------------------- | -------- |
| Nip        | 9471986146                    | true     |
| Krs        | 0000090577                    | true     |
| Regon      | 008376680 or 00000008376680   | true     |
| Krsy       | 0000090577,0000090577         | true     |
| Nipy       | 9471986146,9471986146         | true     |
| Regony14zn | 00000008376680,00000008376680 | true     |
| Regony9zn  | 008376680,008376680           | true     |
npm package: @magicyan/discord-events
Description: Extended events of discord.js
Author: Rincko Dev
Latest version: 1.2.1

<div align="center">
  <img src="../../assets/images/icon.png" alt="Icon" width="100" height="100">
  <div style="margin-left: 20px;">

  # Magicyan Discord Events
  
  </div>
</div>

Install with
```bash
npm install @magicyan/discord-events
pnpm install @magicyan/discord-events
yarn add @magicyan/discord-events
bun install @magicyan/discord-events
```

This lib adds more discord.js specific events

## Setup
Create your bot client normally and pass it to the initDiscordEvents function, so that events can be registered

```ts
import { Client } from "discord.js";
import { initDiscordEvents } from "@magicyan/discord-events";

const client = new Client({
    intents: [/* add your intents ... */]
    // set your client options ...
});

initDiscordEvents(client);
```

## How to use
You can create a listener for the event in the same way you create it for standard discord.js events

```ts
client.on("guildMemberConnect", (member, channel) => {
    console.log(member.displayName, "joined the" channel.name);
})
```

See below the list of all events

| Event | Parameters | Description |
| ----- | --------- |------------ |
| webhookMessageCreate | `message`, `webhook` | Emitted when a webhook message is created. | 
| guildMemberConnect | `member`, `voiceChannel` | Emitted when a member connect to voice channel in a guild. |
| guildMemberDisconnect | `member`, `voiceChannel`  | Emitted when a member disconnect from voice channel in a guild. |
| guildMemberMoved | `member`, `executor`, `oldVoiceChannel`, `newVoiceChannel` | Emitted when a member is moved from one voice channel to another. |
| guildMemberTimeoutAdd | `member`, `executor`, `expireAt`, `reason` | Emitted when a member gets a timeout |
| guildMemberTimeoutAdd | `member`, `executor` | Emitted when a member has a timeout removed |
| userKick | `user`, `executor`, `reason`, `guild` | Emitted when a user is kicked from the guild |
| userBanAdd | `user`, `executor`, `reason`, `guild` | Emitted when a user is banned from the guild |
| userBanRemove | `user`, `executor`, `reason`, `guild` | Emitted when a user's ban is removed |
| extendedRoleCreate | `role`, `executor` | Emitted when a role is created |
| extendedRoleUpdate | `role`, `changes`, `executor` | Emitted when a role is updated |
| extendedRoleDelete | `deletedRole`, `executor` | Emitted when a role is deleted |
npm package: @magidoc/cli
Description: Magidoc CLI application responsible for generating GraphQL documentation websites.
Latest version: 6.3.0

# Magidoc CLI
Magidoc CLI is a NodeJS CLI application that can be used to generate beautiful and fully customizable GraphQL documentation websites from scratch. 

## Documentation
Read our [documentation](https://magidoc.js.org/introduction/welcome) for more details about how to get started with Magidoc.
npm package: @magidoc/plugin-fuse-graphql
Description: A plugin used to index a GraphQL schema into a Fuse.js search engine.
Latest version: 6.3.0

# Magidoc - Fuse GraphQL

This library was created to index GraphQL schemas into a [FuseJS](https://github.com/krisk/Fuse) engine. It does so by indexing each query, mutation, subscription and type into a search engine. All descriptions are parsed with a markdown engine to extract only the relevant text out of it.

> This plugin can be used in any browser or node application.

## Documentation

For more details on how to use this plugin, see the [documentation](https://magidoc.js.org/plugins/fuse-graphql).
npm package: @magidoc/plugin-fuse-markdown
Description: A plugin used to index markdown text into a Fuse.js search engine.
Latest version: 6.3.0

# Magidoc - Fuse Markdown

This plugin is designed to index Markdown into a [FuseJS](https://github.com/krisk/Fuse) engine. It does so by splitting every section (separated by a header) into different documents, and then index each of these documents separately. Doing so makes it possible to know which document is in which section, and to search for a specific section.

> This plugin can be used in any browser or node application.

## Documentation

For more details on how to use this plugin, see the [documentation](https://magidoc.js.org/plugins/fuse-markdown).
npm package: @magidoc/plugin-query-generator
Description: A browser and nodeJS compatible plugin that allows to generate GraphQL Queries and Variables
Latest version: 6.3.0

# Magidoc - Query Generator
This library generates GraphQL Queries from a GraphQL Schema and a root field. It enables you to dynamically build functional queries targeting your API, which can be useful either for testing or documentation.

> This plugin can be used in any Javascript application, wether it is browser or NodeJS based.

## Documentation
For more details on how to use this library, see the [documentation](https://magidoc.js.org/plugins/graphql-query-generator)
npm package: @magidoc/plugin-reverse-schema-mapper
Description: A library that provides the ability to do a reverse lookup on GraphQL types.
Latest version: 6.3.0

> This plugin is still under development and is not ready for production yet.

# Magidoc - Reverse-Schema-Mapper
A library to perform reverse mapping of a GraphQL Schema, allowing to find where types are used or referenced. 

It also aims to build a reverse tree of the GraphQL Schema, allowing to find how to query a specific field. 

> This plugin can be used in any Javascript application, wether it is browser or NodeJS based.
## Documentation
Coming soon...
npm package: @magidoc/plugin-svelte-marked
Description: A markdown parser library that renders to svelte components.
Latest version: 6.3.0

# Magidoc - Svelte Marked

Svelte-Marked is a markdown parser that renders into Svelte components. It supports [Github Flavored Markdown](https://github.github.com/gfm/) out of the box (tables, lists, raw HTML, etc.).

Each component renderer can be overwritten to customize its style and [extensions](https://github.com/markedjs/marked-extension-template) can be registered to support a more advanced markdown syntax.

> This library can be used in any Svelte or SvelteKit application.

## Documentation
For more details on how to use this library, see the [documentation](https://magidoc.js.org/svelte-plugins/marked)
npm package: @magidoc/plugin-svelte-prismjs
Description: A Svelte component library providing an easy to use component to display PrismJS code blocks
Latest version: 6.3.0

# Magidoc - Svelte PrismJS

A Svelte-PrismJS library built with TypeScript. Plugin is fully reactive. It supports change of language and code and will re-hightlight code automatically on change. 

> This plugin can be used in any Svelte or SvelteKit application.

## Documentation
For more details on how to use this library, see the [documentation](https://magidoc.js.org/svelte-plugins/prismjs)
npm package: @magidoc/rollup-plugin-fetch-gql-schema
Description: A Rollup and ViteJS plugin that allows to fetch a GraphQL Schema from a target URL and save it to a target output folder.
Latest version: 2.14.5

# Magidoc - Fetch GraphQL Schema
A Rollup/ViteJS plugin that fetches a remote GraphQL schema using the introspection query. Configuration is available to pass custom headers, url, method, etc.

> This plugin can be used in any project that uses Rollup/ViteJS, wether it is browser or NodeJS based.

## Documentation
For more details on how to use this plugin, see the [documentation](https://magidoc.js.org/plugins/rollup-fetch-graphql-schema).
npm package: @magidoc/rollup-plugin-gql-schema
Description: A Rollup and ViteJS plugin that allows to parse a GraphQL Schema from a target URL and save it to a target output folder, or to parse it from the disk and convert it to a desired format.
Latest version: 6.3.0

# Magidoc - GraphQL Schema
A Rollup/ViteJS plugin that can both fetch or parse GraphQL schemas and store them locally. 


> This plugin can be used in any project that uses Rollup/ViteJS, wether it is browser or NodeJS based.

## Fetching
When fetching the schema, configuration is available to set custom headers, url, method and output format.

## Parsing
When parsing the schema, it is possible to aggregate multiple schema parts into one file using glob patterns and/or custom file paths.

## Documentation
For more details on how to use this plugin, see the [documentation](https://magidoc.js.org/plugins/rollup-graphql-schema).
npm package: @magidoc/rollup-plugin-parse-gql-schema
Description: A Rollup and ViteJS plugin that allows to fetch a GraphQL Schema from a target URL and save it to a target output folder.
Latest version: 2.14.5

# Magidoc - Parse GraphQL Schema
A Rollup/ViteJS plugin that parses local GraphQL SDL files into an introspection query file. 
Supports providing multiple paths and glob patterns as input.


> This plugin can be used in any project that uses Rollup/ViteJS, wether it is browser or NodeJS based.
## Documentation
For more details on how to use this plugin, see the [documentation](https://magidoc.js.org/plugins/rollup-parse-graphql-schema).