open-index/open-npm huggingface dataset:
npm package: @smooth-markdown/core
Description: smooth-markdown is a pluggable markdown editor for vue.js 3.   it is easy to extend in terms of markdown syntax, editing operations, and appearance.
Author: TinyWisp
Latest version: 1.0.4

smooth-markdown is a pluggable markdown editor for vue.js 3.  
it is easy to extend in terms of markdown syntax, editing operations, and appearance.

[Docs](https://tinywisp.github.io/smooth-markdown/?lang=en)

---

smooth-markdown是一个基于vue 3的markdown编辑器。  
它拥有较强的扩展机制，不论是markdown语法，编辑操作，还是外观上，都很易于扩展。

[文档](https://tinywisp.github.io/smooth-markdown/?lang=zh_CN)
npm package: @smooth-markdown/element-toolbar
Description: smooth-markdown is a pluggable markdown editor for vue.js 3.   it is easy to extend in terms of markdown syntax, editing operations, and appearance.
Author: TinyWisp
Latest version: 1.0.1

smooth-markdown is a pluggable markdown editor for vue.js 3.  
it is easy to extend in terms of markdown syntax, editing operations, and appearance.

[Docs](https://tinywisp.github.io/smooth-markdown/?lang=en)

---

smooth-markdown是一个基于vue 3的markdown编辑器。  
它拥有较强的扩展机制，不论是markdown语法，编辑操作，还是外观上，都很易于扩展。

[文档](https://tinywisp.github.io/smooth-markdown/?lang=zh_CN)
npm package: @smooth-markdown/presets
Description: smooth-markdown is a pluggable markdown editor for vue.js 3.   it is easy to extend in terms of markdown syntax, editing operations, and appearance.
Author: TinyWisp
Latest version: 1.0.0

smooth-markdown is a pluggable markdown editor for vue.js 3.  
it is easy to extend in terms of markdown syntax, editing operations, and appearance.

[Docs](https://tinywisp.github.io/smooth-markdown/?lang=en)

---

smooth-markdown是一个基于vue 3的markdown编辑器。  
它拥有较强的扩展机制，不论是markdown语法，编辑操作，还是外观上，都很易于扩展。

[文档](https://tinywisp.github.io/smooth-markdown/?lang=zh_CN)
npm package: @smooth-markdown/vuetify-toolbar
Description: smooth-markdown is a pluggable markdown editor for vue.js 3.   it is easy to extend in terms of markdown syntax, editing operations, and appearance.
Author: TinyWisp
Latest version: 1.0.1

smooth-markdown is a pluggable markdown editor for vue.js 3.  
it is easy to extend in terms of markdown syntax, editing operations, and appearance.

[Docs](https://tinywisp.github.io/smooth-markdown/?lang=en)

---

smooth-markdown是一个基于vue 3的markdown编辑器。  
它拥有较强的扩展机制，不论是markdown语法，编辑操作，还是外观上，都很易于扩展。

[文档](https://tinywisp.github.io/smooth-markdown/?lang=zh_CN)
npm package: @smooth-player/react
Description: React component for Smooth Player
Latest version: 2.1.3

# @smooth-player/react

React wrapper component for [`smooth-player`](https://www.npmjs.com/package/smooth-player).

## Install

```bash
npm install smooth-player @smooth-player/react
```

## Usage

```tsx
import "smooth-player/dist/smooth-player.css";
import { SmoothAudioPlayer } from "@smooth-player/react";
import type { PlaylistEntry } from "smooth-player";

const tracks: PlaylistEntry[] = [
  {
    id: "demo",
    title: "Demo Playlist",
    tracks: [
      {
        id: "song-1",
        src: "https://cdn.pixabay.com/audio/2020/08/17/audio_613575b827.mp3",
        metadata: { title: "Robot Gypsy Jazz", artist: "Frank Vanga" },
      },
    ],
  },
];

export function App() {
  return (
    <SmoothAudioPlayer
      tracks={tracks}
      accentColor="#0ed2a4"
      backgroundColor="#0b1220"
      visualizer="spectrum"
      initialVolume={0.8}
      uiOptions={{ showLogo: true }}
    />
  );
}
```

## Component props

- `tracks: PlaylistEntry[]`
- `accentColor?: string`
- `backgroundColor?: string`
- `visualizer?: "spectrum" | "waveform" | "none"`
- `initialVolume?: number`
- `playerOptions?: Omit<SmoothPlayerOptions, "playlist" | "accentColor" | "backgroundColor" | "visualizer" | "initialVolume">`
- `uiOptions?: StandardPlayerUIMountOptions`

## Prop Mapping

| Wrapper prop | Core equivalent |
| --- | --- |
| `tracks` | `new SmoothPlayer({ playlist: tracks })` |
| `accentColor` | `new SmoothPlayer({ accentColor })` |
| `backgroundColor` | `new SmoothPlayer({ backgroundColor })` |
| `visualizer` | `new SmoothPlayer({ visualizer })` |
| `initialVolume` | `new SmoothPlayer({ initialVolume })` |
| `playerOptions` | Spread into `SmoothPlayerOptions` |
| `uiOptions` | Passed to `mountPlayerUI(player, root, uiOptions)` |

## Documentation

For the full list of player config options, runtime APIs, events, and UI options, see the main docs:

- [smooth-player README](https://github.com/marlenesco/smooth-player#readme)
npm package: @smooth-player/svelte
Description: Svelte component for Smooth Player
Latest version: 2.1.3

# @smooth-player/svelte

Svelte wrapper component for [`smooth-player`](https://www.npmjs.com/package/smooth-player).

## Install

```bash
npm install smooth-player @smooth-player/svelte
```

## Usage

```svelte
<script lang="ts">
  import "smooth-player/dist/smooth-player.css";
  import { SmoothAudioPlayer } from "@smooth-player/svelte";
  import type { PlaylistEntry } from "smooth-player";

  const tracks: PlaylistEntry[] = [
    {
      id: "demo",
      title: "Demo Playlist",
      tracks: [
        {
          id: "song-1",
          src: "https://cdn.pixabay.com/audio/2020/08/17/audio_613575b827.mp3",
          metadata: { title: "Robot Gypsy Jazz", artist: "Frank Vanga" },
        },
      ],
    },
  ];
</script>

<SmoothAudioPlayer
  {tracks}
  accentColor="#0ed2a4"
  backgroundColor="#0b1220"
  visualizer="spectrum"
  initialVolume={0.8}
  uiOptions={{ showLogo: true }}
/>
```

## Component props

- `tracks: PlaylistEntry[]`
- `accentColor?: string`
- `backgroundColor?: string`
- `visualizer?: "spectrum" | "waveform" | "none"`
- `initialVolume?: number`
- `playerOptions?: Omit<SmoothPlayerOptions, "playlist" | "accentColor" | "backgroundColor" | "visualizer" | "initialVolume">`
- `uiOptions?: StandardPlayerUIMountOptions`

## Prop Mapping

| Wrapper prop | Core equivalent |
| --- | --- |
| `tracks` | `new SmoothPlayer({ playlist: tracks })` |
| `accentColor` | `new SmoothPlayer({ accentColor })` |
| `backgroundColor` | `new SmoothPlayer({ backgroundColor })` |
| `visualizer` | `new SmoothPlayer({ visualizer })` |
| `initialVolume` | `new SmoothPlayer({ initialVolume })` |
| `playerOptions` | Spread into `SmoothPlayerOptions` |
| `uiOptions` | Passed to `mountPlayerUI(player, root, uiOptions)` |

## Documentation

For the full list of player config options, runtime APIs, events, and UI options, see the main docs:

- [smooth-player README](https://github.com/marlenesco/smooth-player#readme)
npm package: @smooth-player/vue
Description: Vue component for Smooth Player
Latest version: 2.1.3

# @smooth-player/vue

Vue wrapper component for [`smooth-player`](https://www.npmjs.com/package/smooth-player).

## Install

```bash
npm install smooth-player @smooth-player/vue
```

## Usage

```vue
<script setup lang="ts">
import "smooth-player/dist/smooth-player.css";
import { SmoothAudioPlayer } from "@smooth-player/vue";
import type { PlaylistEntry } from "smooth-player";

const tracks: PlaylistEntry[] = [
  {
    id: "demo",
    title: "Demo Playlist",
    tracks: [
      {
        id: "song-1",
        src: "https://cdn.pixabay.com/audio/2020/08/17/audio_613575b827.mp3",
        metadata: { title: "Robot Gypsy Jazz", artist: "Frank Vanga" },
      },
    ],
  },
];
</script>

<template>
  <SmoothAudioPlayer
    :tracks="tracks"
    accent-color="#0ed2a4"
    background-color="#0b1220"
    visualizer="spectrum"
    :initial-volume="0.8"
    :ui-options="{ showLogo: true }"
  />
</template>
```

## Component props

- `tracks: PlaylistEntry[]`
- `accentColor?: string`
- `backgroundColor?: string`
- `visualizer?: "spectrum" | "waveform" | "none"`
- `initialVolume?: number`
- `playerOptions?: Omit<SmoothPlayerOptions, "playlist" | "accentColor" | "backgroundColor" | "visualizer" | "initialVolume">`
- `uiOptions?: StandardPlayerUIMountOptions`

## Prop Mapping

| Wrapper prop | Core equivalent |
| --- | --- |
| `tracks` | `new SmoothPlayer({ playlist: tracks })` |
| `accentColor` | `new SmoothPlayer({ accentColor })` |
| `backgroundColor` | `new SmoothPlayer({ backgroundColor })` |
| `visualizer` | `new SmoothPlayer({ visualizer })` |
| `initialVolume` | `new SmoothPlayer({ initialVolume })` |
| `playerOptions` | Spread into `SmoothPlayerOptions` |
| `uiOptions` | Passed to `mountPlayerUI(player, root, uiOptions)` |

## Documentation

For the full list of player config options, runtime APIs, events, and UI options, see the main docs:

- [smooth-player README](https://github.com/marlenesco/smooth-player#readme)