open-index/open-npm huggingface dataset:
npm package: @rmchen-12/toast
Description: React Toast组件
Author: rmchen-12
Latest version: 1.0.0

# react Toast 组件

### toast.success('success')

### toast.fail('fail')

### 支持配置 toast.success({
    prefixCls: PropTypes.string, // 自定义类名前缀
    type: PropTypes.string, // success / error
    onClose: PropTypes.func, // 关闭回调
    duration: PropTypes.number // 默认3s
})
npm package: @rmckayfleming/tiptap
Description: A rich-text editor for Vue.js
Latest version: 1.27.5

# tiptap
This is the core package of [tiptap](https://www.npmjs.com/package/tiptap).

[![](https://img.shields.io/npm/v/tiptap.svg?label=version)](https://www.npmjs.com/package/tiptap)
[![](https://img.shields.io/npm/dm/tiptap.svg)](https://npmcharts.com/compare/tiptap?minimal=true)
[![](https://img.shields.io/npm/l/tiptap.svg)](https://www.npmjs.com/package/tiptap)
[![](http://img.badgesize.io/https://unpkg.com/tiptap/dist/tiptap.min.js?compression=gzip&label=size&colorB=000000)](https://www.npmjs.com/package/tiptap)
npm package: @rmckayfleming/tiptap-commands
Description: Commands for tiptap
Latest version: 1.13.5

# tiptap-commands
This is a collection of commands for [tiptap](https://www.npmjs.com/package/tiptap).

[![](https://img.shields.io/npm/v/tiptap-commands.svg?label=version)](https://www.npmjs.com/package/tiptap-commands)
[![](https://img.shields.io/npm/dm/tiptap-commands.svg)](https://npmcharts.com/compare/tiptap-commands?minimal=true)
[![](https://img.shields.io/npm/l/tiptap-commands.svg)](https://www.npmjs.com/package/tiptap-commands)
[![](http://img.badgesize.io/https://unpkg.com/tiptap-commands/dist/commands.min.js?compression=gzip&label=size&colorB=000000)](https://www.npmjs.com/package/tiptap-commands)
npm package: @rmckayfleming/tiptap-extensions
Description: Extensions for tiptap
Latest version: 1.29.5

# tiptap-extensions
This is a collection of extensions for [tiptap](https://www.npmjs.com/package/tiptap).

[![](https://img.shields.io/npm/v/tiptap-extensions.svg?label=version)](https://www.npmjs.com/package/tiptap-extensions)
[![](https://img.shields.io/npm/dm/tiptap-extensions.svg)](https://npmcharts.com/compare/tiptap-extensions?minimal=true)
[![](https://img.shields.io/npm/l/tiptap-extensions.svg)](https://www.npmjs.com/package/tiptap-extensions)
[![](http://img.badgesize.io/https://unpkg.com/tiptap-extensions/dist/extensions.min.js?compression=gzip&label=size&colorB=000000)](https://www.npmjs.com/package/tiptap-extensions)
npm package: @rmckayfleming/tiptap-utils
Description: Utility functions for tiptap
Latest version: 1.9.5

# tiptap-utils
This is a collection of utility functions for [tiptap](https://www.npmjs.com/package/tiptap).

[![](https://img.shields.io/npm/v/tiptap-utils.svg?label=version)](https://www.npmjs.com/package/tiptap-utils)
[![](https://img.shields.io/npm/dm/tiptap-utils.svg)](https://npmcharts.com/compare/tiptap-utils?minimal=true)
[![](https://img.shields.io/npm/l/tiptap-utils.svg)](https://www.npmjs.com/package/tiptap-utils)
[![](http://img.badgesize.io/https://unpkg.com/tiptap-utils/dist/utils.min.js?compression=gzip&label=size&colorB=000000)](https://www.npmjs.com/package/tiptap-utils)
npm package: @rmckee-cleo/cleo-cli-darwin-universal
Description: This is the **universal-apple-darwin** binary for `@rmckee-cleo/cleo-cli`
Latest version: 0.0.1

# `@rmckee-cleo/cleo-cli-darwin-universal`

This is the **universal-apple-darwin** binary for `@rmckee-cleo/cleo-cli`
npm package: @rmckee-cleo/cleo-cli-darwin-x64
Description: This is the **x86_64-apple-darwin** binary for `@rmckee-cleo/cleo-cli`
Latest version: 0.0.1

# `@rmckee-cleo/cleo-cli-darwin-x64`

This is the **x86_64-apple-darwin** binary for `@rmckee-cleo/cleo-cli`
npm package: @rmckee-cleo/cleo-cli-linux-arm-gnueabihf
Description: Template project for writing node package with napi-rs
Latest version: 1.0.1

# `@rmckee-cleo/cleo-cli-linux-arm-gnueabihf`

This is the **armv7-unknown-linux-gnueabihf** binary for `@rmckee-cleo/cleo-cli`
npm package: @rmckee-cleo/cleo-cli-linux-arm64-musl
Description: Template project for writing node package with napi-rs
Latest version: 1.0.1

# `@rmckee-cleo/cleo-cli-linux-arm64-musl`

This is the **aarch64-unknown-linux-musl** binary for `@rmckee-cleo/cleo-cli`
npm package: @rmckee-cleo/cleo-cli-linux-x64-gnu
Description: This is the **x86_64-unknown-linux-gnu** binary for `@rmckee-cleo/cleo-cli`
Latest version: 0.0.1

# `@rmckee-cleo/cleo-cli-linux-x64-gnu`

This is the **x86_64-unknown-linux-gnu** binary for `@rmckee-cleo/cleo-cli`
npm package: @rmckee-cleo/cleo-cli-linux-x64-musl
Description: This is the **x86_64-unknown-linux-musl** binary for `@rmckee-cleo/cleo-cli`
Latest version: 0.0.1

# `@rmckee-cleo/cleo-cli-linux-x64-musl`

This is the **x86_64-unknown-linux-musl** binary for `@rmckee-cleo/cleo-cli`
npm package: @rmcooper/next-fullcalendar
Description: FullCalendar and plugins for my specific needs that have been modified to work with Next.js
Author: Robert Cooper
Latest version: 1.0.1

# next-fullcalendar

### fullcalendar-react, modified to work with Next.js

This package was created for a very specific requirement and differs from the standard release in that it has been modified to work with Next.js by removing the CSS imports within the common, daygrid and timegrid modules and by only including the cjs conformant files. The timegrid, daygrid and interaction plugins are included within this package.

If you will be using the included plugins then include these lines in _app.js:
```
import '@rmcooper/next-fullcalendar/common/main.css'
import '@rmcooper/next-fullcalendar/daygrid/main.css'
import '@rmcooper/next-fullcalendar/timegrid/main.css'
```

And on the page or component that uses FullCalendar, include these lines:
```
import FullCalendar from '@rmcooper/next-fullcalendar'
import dayGridPlugin from '@rmcooper/next-fullcalendar/daygrid'
import timeGridPlugin from '@rmcooper/next-fullcalendar/timegrid'
import interactionPlugin from '@rmcooper/next-fullcalendar/interaction'
```

Then add the plugins to the FullCalendar component as follows:
```
<FullCalendar plugins={[dayGridPlugin, timeGridPlugin, interactionPlugin]} initialView="dayGridMonth" ... />
```

For the complete documentation on FullCalendar visit [FullCalendar.io](https://fullcalendar.io).
npm package: @rmderojr/ibge-data-cli
Description: A CLI tool to fetch, store, and query Brazilian location data from the IBGE API.
Author: Roberto Mardero Junior
Latest version: 1.3.0

![npm version](https://img.shields.io/npm/v/@rmderojr/ibge-data-cli)
![downloads](https://img.shields.io/npm/dw/@rmderojr/ibge-data-cli)
![license](https://img.shields.io/npm/l/@rmderojr/ibge-data-cli)

# IBGE Data CLI

`ibge-data-cli` is a command-line interface (CLI) tool to fetch, store, and query Brazilian location data (states and cities) from the official IBGE API.

This tool is perfect for developers, data analysts, and students who need quick and offline access to this public data.

## Features

- **One-Command Sync**: Fetch all states and cities from the IBGE API and store them in a local SQLite database.
- **Offline Queries**: List all cities for a specific state directly from your terminal, without needing an internet connection after the initial sync.
- **Data Export**: Export the entire dataset of states and cities to a single CSV file for use in other applications or analysis.
- **Local Cache**: API requests are cached to avoid unnecessary calls and respect rate limits.

## Installation

You can install the CLI globally via npm to use it anywhere on your system.

```bash
npm install -g @rmderojr/ibge-data-cli
```

## Usage

### 1. Import Data
First, you need to sync the data from the IBGE API to your local database. This command creates the database and populates it.

```bash
ibge-data-cli import-data
```

### 2. List Cities by State
Once the data is imported, you can list all cities for a given state using its two-letter abbreviation (UF).

```bash
ibge-data-cli list-cities <UF>
```

**Example:**
```bash
ibge-data-cli list-cities SP
```

### 3. Export to CSV
Export all states and their corresponding cities to a CSV file.

```bash
ibge-data-cli export-csv <filename.csv>
```

**Example:**
```bash
ibge-data-cli export-csv brazil-locations.csv
```

## Development

If you want to contribute to the project, follow these steps:

1.  **Clone the repository:** `git clone https://github.com/mrx6SO/ibge-data-cli.git`
2.  **Install dependencies:** `npm install`
3.  **Run migrations:** `npm run knex:migrate`
4.  **Run commands locally:** `node src/app.js <command>`
npm package: @rmdes/indiekit-endpoint-github
Description: GitHub activity endpoint for Indiekit. Display commits, stars, contributions, and featured repositories.
Author: Ricardo Mendes
Latest version: 1.2.7

# @rmdes/indiekit-endpoint-github

A GitHub activity endpoint plugin for [Indiekit](https://getindiekit.com). Display your GitHub commits, stars, contributions, and featured repositories in your Indiekit admin dashboard, with a public JSON API for use in your static site.

## Features

- **Featured Projects**: Showcase specific repositories with recent commits
- **Recent Commits**: Display your latest commits across repositories
- **Starred Repositories**: Show repos you've recently starred
- **PRs & Issues**: Track your open source contributions
- **Public API**: JSON endpoints for integrating with static site generators

## Installation

```bash
npm install @rmdes/indiekit-endpoint-github
```

## Configuration

Add the plugin to your Indiekit configuration:

```javascript
export default {
  plugins: [
    "@rmdes/indiekit-endpoint-github",
    // ... other plugins
  ],

  "@rmdes/indiekit-endpoint-github": {
    // Required: Your GitHub username
    username: "your-username",

    // Optional: GitHub personal access token for higher rate limits
    // and access to private repos (set via GITHUB_TOKEN env var)
    token: process.env.GITHUB_TOKEN,

    // Optional: Mount path for the endpoint (default: "/github")
    mountPath: "/github-api",

    // Optional: Cache duration in milliseconds (default: 15 minutes)
    cacheTtl: 900_000,

    // Optional: Limits for each section
    limits: {
      commits: 10,
      stars: 20,
      contributions: 10,
      repos: 10,
    },

    // Optional: Featured repositories to showcase with commits
    featuredRepos: [
      "owner/repo-name",
      "owner/another-repo",
    ],
  },
};
```

## Endpoints

### Protected (require authentication)

- `GET /github-api/` - Dashboard view with all sections
- `GET /github-api/commits` - Recent commits page
- `GET /github-api/stars` - Starred repositories page
- `GET /github-api/contributions` - PRs & Issues page
- `GET /github-api/activity` - Activity feed page

### Public API (no authentication)

- `GET /github-api/api/commits` - JSON: Recent commits
- `GET /github-api/api/stars` - JSON: Starred repositories
- `GET /github-api/api/activity` - JSON: Activity feed
- `GET /github-api/api/featured` - JSON: Featured repositories with commits

## Using the Public API

The public API endpoints return JSON and can be used by your static site generator (Eleventy, Hugo, etc.) to display GitHub activity on your public site.

Example Eleventy data file:

```javascript
import EleventyFetch from "@11ty/eleventy-fetch";

export default async function() {
  const url = "https://your-site.com/github-api/api/featured";

  const data = await EleventyFetch(url, {
    duration: "15m",
    type: "json",
  });

  return data.featured || [];
}
```

## Environment Variables

- `GITHUB_TOKEN` - Optional GitHub personal access token for:
  - Higher API rate limits (5000/hour vs 60/hour)
  - Access to private repository information

## License

MIT
npm package: @rmdes/indiekit-endpoint-lastfm
Description: Last.fm scrobble and listening activity endpoint for Indiekit. Display listening history, loved tracks, and statistics.
Author: Ricardo Mendes
Latest version: 1.0.13

# @rmdes/indiekit-endpoint-lastfm

Last.fm scrobble and listening activity endpoint for [Indiekit](https://getindiekit.com).

## Features

- Display scrobble history from Last.fm
- Now playing / recently played status
- Loved tracks
- Listening statistics (top artists, albums, trends)
- Background sync to MongoDB for offline access
- Public JSON API for frontend integration

## Installation

```bash
npm install @rmdes/indiekit-endpoint-lastfm
```

## Configuration

Add to your Indiekit config:

```javascript
import LastFmEndpoint from "@rmdes/indiekit-endpoint-lastfm";

export default {
  plugins: [
    "@rmdes/indiekit-endpoint-lastfm",
    // ... other plugins
  ],

  "@rmdes/indiekit-endpoint-lastfm": {
    mountPath: "/lastfmapi",
    apiKey: process.env.LASTFM_API_KEY,
    username: process.env.LASTFM_USERNAME,
    cacheTtl: 900_000,        // 15 minutes
    syncInterval: 300_000,    // 5 minutes
    limits: {
      scrobbles: 20,
      loved: 20,
      topArtists: 10,
      topAlbums: 10,
    },
  },
};
```

## Environment Variables

| Variable | Description |
|----------|-------------|
| `LASTFM_API_KEY` | Your Last.fm API key ([get one here](https://www.last.fm/api/account/create)) |
| `LASTFM_USERNAME` | Last.fm username to track |

## API Endpoints

| Endpoint | Description |
|----------|-------------|
| `GET /api/now-playing` | Current or recently played track |
| `GET /api/scrobbles` | Paginated scrobble history |
| `GET /api/loved` | Paginated loved tracks |
| `GET /api/stats` | Listening statistics |
| `GET /api/stats/trends` | Daily scrobble trends |

## Requirements

- Node.js >= 20
- Indiekit >= 1.0.0-beta.25
- MongoDB (for background sync and statistics)

## License

MIT
npm package: @rmdes/indiekit-endpoint-webmentions-proxy
Description: Webmentions proxy endpoint for Indiekit. Proxies webmention.io API requests with server-side authentication.
Author: Ricardo Mendes
Latest version: 1.0.3

# @rmdes/indiekit-endpoint-webmentions-proxy

Webmentions proxy endpoint for [Indiekit](https://getindiekit.com). Proxies webmention.io API requests with server-side authentication, enabling real-time webmention fetching from frontend applications without exposing API tokens.

## Why This Plugin Exists

The official `@indiekit/endpoint-webmention-io` plugin provides an admin dashboard view at `/webmentions`, but:

1. **No public API** - Only provides protected routes (requires authentication)
2. **No database storage** - Fetches directly from webmention.io on each request, doesn't cache in MongoDB
3. **Renders HTML** - Returns server-rendered views, not JSON for frontend consumption

For a static site (like Eleventy) that needs real-time webmentions on the frontend via JavaScript fetch, the options were:

| Approach | Drawback |
|----------|----------|
| Expose token to frontend | Security risk - token visible in browser |
| Build-time data fetching | Not real-time, requires rebuild for updates |
| Fork official plugin | Maintenance burden of tracking upstream |
| **Dedicated proxy plugin** | Small additional dependency (this plugin) |

This plugin takes the dedicated proxy approach: a small, single-purpose endpoint (~70 lines) that keeps the token server-side while providing a public JSON API for frontends.

## Installation

```bash
npm install @rmdes/indiekit-endpoint-webmentions-proxy
```

## Configuration

```javascript
// indiekit.config.js
export default {
  plugins: [
    "@rmdes/indiekit-endpoint-webmentions-proxy",
  ],

  "@rmdes/indiekit-endpoint-webmentions-proxy": {
    mountPath: "/webmentions-api",  // API mount path (default)
    token: process.env.WEBMENTION_IO_TOKEN,  // Your webmention.io token
    domain: "example.com",  // Domain to fetch webmentions for
    cacheTtl: 60,  // Cache TTL in seconds (default: 60)
  },
};
```

## API Endpoints

### GET /webmentions-api/api/mentions

Fetch webmentions from webmention.io.

**Query Parameters:**
- `page` - Page number (default: 0)
- `per-page` - Items per page (default: 50)
- `target` - Filter by specific URL (optional)
- `wm-property` - Filter by webmention type: `in-reply-to`, `like-of`, `repost-of`, `mention-of` (optional)

**Response:** JF2 format webmentions from webmention.io

**Example:**
```javascript
// Fetch all webmentions for page 0
fetch('/webmentions-api/api/mentions?page=0&per-page=50')

// Fetch only likes for a specific post
fetch('/webmentions-api/api/mentions?target=https://example.com/post&wm-property=like-of')
```

## License

MIT
npm package: @rmdes/indiekit-startup-gate
Description: Defers plugin background tasks until the Indiekit host signals readiness (e.g., after Eleventy build completes).
Latest version: 1.0.0

# @rmdes/indiekit-startup-gate

Defers Indiekit plugin background tasks until the host signals readiness.

## Problem

On deployment, Indiekit plugins start background work (feed polling, federation queues, sync jobs) immediately — competing for resources with the Eleventy site build. This package gates heavy tasks behind a file-based readiness signal.

## Usage

```javascript
import { waitForReady } from "@rmdes/indiekit-startup-gate";

// In your plugin's init():
this._stopGate = waitForReady(
  () => {
    startPolling(indiekit, options);
  },
  { label: "MyPlugin" },
);

// In your plugin's destroy():
this._stopGate?.();
```

## How It Works

1. The deployment script (`start.sh`) removes `/app/data/.indiekit-ready` before the Eleventy build
2. Plugins call `waitForReady(callback)` — if the file doesn't exist, they poll every 5 seconds
3. After the build completes and the atomic symlink swap happens, `start.sh` creates the file
4. Plugins detect the file and start their background tasks
5. If the file already exists (hot restart, dev mode), the callback fires immediately

## API

### `waitForReady(callback, options?)`

- **callback** `Function` — Called when the readiness signal is detected
- **options.label** `string` — Plugin name for log messages (default: `"plugin"`)
- **Returns** `Function` — Call to cancel polling (for plugin `destroy()` lifecycle)

## Log Output

```
[startup-gate] MyPlugin: waiting for readiness signal...
[startup-gate] MyPlugin: ready — starting deferred tasks
```

## Signal File

Default path: `/app/data/.indiekit-ready`

Currently hardcoded for Cloudron deployments. Will be made configurable for other deployment methods.
npm package: @rmdes/indiekit-syndicator-indienews
Description: IndieNews syndicator for Indiekit
Author: Rick Mendes
Latest version: 1.0.1

# @rmdes/indiekit-syndicator-indienews

IndieNews syndicator for [Indiekit](https://getindiekit.com/).

Submits posts to [IndieNews](https://news.indieweb.org/), a community-curated aggregator of IndieWeb-related content.

## Installation

```bash
npm install @rmdes/indiekit-syndicator-indienews
```

## Configuration

```js
// indiekit.config.js
export default {
  plugins: ["@rmdes/indiekit-syndicator-indienews"],
  "@rmdes/indiekit-syndicator-indienews": {
    languages: ["en", "fr"],  // Languages to register as syndication targets
    checked: false            // Pre-select in syndication UI
  }
};
```

## Options

| Option | Type | Default | Description |
|--------|------|---------|-------------|
| `languages` | `string[]` | `["en"]` | Language codes to register as syndication targets |
| `checked` | `boolean` | `false` | Whether to pre-select this target in the UI |

## Supported Languages

| Code | Name |
|------|------|
| `en` | English |
| `fr` | Français |
| `de` | Deutsch |
| `es` | Español |
| `ja` | 日本語 |
| `zh` | 中文 |

## How It Works

IndieNews uses webmentions for submission:

1. Your post must have a `u-syndication` link pointing to `https://news.indieweb.org/{lang}`
2. The plugin sends a webmention with your post URL as `source`
3. IndieNews returns a permalink URL which is stored in your post's `syndication` property

### Template Requirement

Your site template must render pending syndication targets as `u-syndication` links. For Eleventy, add this to your post template:

```njk
{% if mpSyndicateTo %}
<div class="hidden">
  {% for url in mpSyndicateTo %}
    {% if "news.indieweb.org" in url %}
    <a href="{{ url }}" class="u-syndication" rel="syndication">IndieNews</a>
    {% endif %}
  {% endfor %}
</div>
{% endif %}
```

## No Credentials Required

Unlike most syndicators, IndieNews doesn't require API keys or authentication. Submission is done entirely via webmentions.

## License

MIT
npm package: @rmdes/indiekit-syndicator-linkedin
Description: LinkedIn syndicator for Indiekit, supporting notes and articles
Author: rmdes
Latest version: 1.0.2

# @rmdes/indiekit-syndicator-linkedin

LinkedIn syndicator for [Indiekit](https://getindiekit.com), supporting notes (short text) and articles (long-form with URL card).

Originally based on work by [Giacomo Debidda](https://giacomodebidda.com) ([jackdbd](https://github.com/jackdbd)), from an unmerged [pull request](https://github.com/jackdbd/indiekit/tree/feat/531-linkedin-syndicator) to the Indiekit monorepo.

## Installation

```bash
npm install @rmdes/indiekit-syndicator-linkedin
```

## Requirements

- A LinkedIn account with a [registered application](https://www.linkedin.com/developers/apps)
- OAuth scopes: `openid`, `profile`, `w_member_social`
- A valid access token stored in the `LINKEDIN_ACCESS_TOKEN` environment variable

## Usage

Add to your Indiekit configuration:

```js
export default {
  plugins: ["@rmdes/indiekit-syndicator-linkedin"],
  "@rmdes/indiekit-syndicator-linkedin": {
    authorName: "Your Name",
    authorProfileUrl: "https://www.linkedin.com/in/yourname",
    checked: true,
  },
};
```

## Options

| Option             | Type    | Default    | Description                           |
| ------------------ | ------- | ---------- | ------------------------------------- |
| `accessToken`      | string  | env var    | LinkedIn API access token             |
| `authorName`       | string  | `""`       | Your name as shown on LinkedIn        |
| `authorProfileUrl` | string  | `""`       | Your LinkedIn profile URL             |
| `characterLimit`   | number  | `3000`     | LinkedIn post character limit         |
| `checked`          | boolean | `false`    | Pre-check syndicator in Indiekit UI   |
| `postsAPIVersion`  | string  | `"202601"` | LinkedIn API version (YYYYMM format)  |

## Supported Post Types

- **Notes**: Short text posts, syndicated as LinkedIn text posts with a permalink
- **Articles**: Long-form posts with a title, syndicated as LinkedIn article cards with URL, title, description, and thumbnail image. Thumbnails are resolved automatically: first from the post's featured photo, then by scraping the article's Open Graph image tag.

## Known Limitations

- **Token expiration**: LinkedIn access tokens expire (typically after 60 days). You will need to refresh your token manually. A companion OAuth endpoint package (`@rmdes/indiekit-endpoint-linkedin`) is planned to handle token acquisition through the Indiekit UI.

## Credits

This package is based on the LinkedIn syndicator originally written by [Giacomo Debidda](https://giacomodebidda.com) as an unmerged PR to the [Indiekit monorepo](https://github.com/getindiekit/indiekit). Extended with article post support and adapted as a standalone package.

## License

MIT
npm package: @rmdwirizki/editor-alert
Description: alert Tool for Editor.js
Author: groupher team
Latest version: 1.0.20


# Alert Tool

Provides Code Blocks for the [Editor.js](https://editorjs.io).

![alert-demo](https://user-images.githubusercontent.com/6184465/68541410-1ea36500-03da-11ea-9c0d-540a70a1d588.gif)


## Installation

### Install via NPM

Get the package

```shell
npm i --save-dev @rmdwirizki/editor-alert
```

Include module at your application

```javascript
const Alert = require('@rmdwirizki/editor-alert');
```

### Download to your project's source dir

1. Upload folder `dist` from repository
2. Add `dist/bundle.js` file to your page.

### Load from CDN

You can load specific version of package from [jsDelivr CDN](https://www.jsdelivr.com/package/npm/@editorjs/quote).

`https://cdn.jsdelivr.net/npm/@rmdwirizki/editor-alert@1.0.19`

Then require this script on page with Editor.js.

```html
<script src="..."></script>
```

## Usage

Add a new Tool to the `tools` property of the Editor.js initial config.

```javascript
var editor = EditorJS({
  ...
  
  tools: {
    ...
    alert: Alert,
  },
  
  ...
});
```

## Output data

| Field     | Type     | Description          |
| --------- | -------- | -------------------- |
| title      | `string` | warning title         |
| desc  | `string` | warning desc |
| alert  | `string` | alert type (warning, error, success, info) |


```json
{
    "type" : "quote",
    "data" : {
        "title" : ""note",
        "desc" : "this is a warning",
        "type" : "warning"
    }
}
```
npm package: @rmdwirizki/editor-quote
Description: Quote Tool for Editor.js
Author: CodeX
Latest version: 2.3.2

![](https://badgen.net/badge/Editor.js/v2.0/blue)

# Quote Tool

Provides Quote Blocks for the [Editor.js](https://editorjs.io).

![](https://capella.pics/017dca46-6869-40cb-93a0-994416576e33.jpg)

## Installation

### Install via NPM

Get the package

```shell
npm i --save-dev @rmdwirizki/editor-quote
```

Include module at your application

```javascript
const Quote = require('@rmdwirizki/editor-quote');
```

### Download to your project's source dir

1. Upload folder `dist` from repository
2. Add `dist/bundle.js` file to your page.

### Load from CDN

You can load specific version of package from [jsDelivr CDN](https://www.jsdelivr.com/package/npm/@editorjs/quote).

`https://cdn.jsdelivr.net/npm/@editorjs/quote@2.0.0`

Then require this script on page with Editor.js.

```html
<script src="..."></script>
```

## Usage

Add a new Tool to the `tools` property of the Editor.js initial config.

```javascript
var editor = EditorJS({
  ...
  
  tools: {
    ...
    quote: Quote,
  },
  
  ...
});
```

Or init Quote Tool with additional settings

```javascript
var editor = EditorJS({
  ...
  
  tools: {
    ...
    quote: {
      class: Quote,
      inlineToolbar: true,
      shortcut: 'CMD+SHIFT+O',
      config: {
        quotePlaceholder: 'Enter a quote',
        captionPlaceholder: 'Quote\'s author',
      },
    },
  },
  
  ...
});
```

## Config Params

| Field              | Type     | Description                 |
| ------------------ | -------- | ----------------------------|
| quotePlaceholder   | `string` | quote's placeholder string  |
| captionPlaceholder | `string` | caption's placeholder string|

## Tool's settings

![](https://capella.pics/0db5d4de-c431-4cc2-90bf-bb1f4feec5df.jpg)

You can choose alignment for the quote. It takes no effect while editing, but saved the «alignment» param.

## Output data

| Field     | Type     | Description          |
| --------- | -------- | -------------------- |
| text      | `string` | quote's text         |
| caption   | `string` | caption or an author |
| alignment | `string` | `left` or `center`   |


```json
{
    "type" : "quote",
    "data" : {
        "text" : "The unexamined life is not worth living.",
        "caption" : "Socrates",
        "alignment" : "left"
    }
}
```