# vitepress-plugin-callout

> [![NPM version](https://img.shields.io/npm/v/vitepress-plugin-callout?color=a1b858&label=)](https://www.npmjs.com/package/vitepress-plugin-callout)

Latest version **0.0.1** (published 2022-07-05) · MIT license · 0 weekly downloads

## Install

```sh
npm install vitepress-plugin-callout
pnpm add vitepress-plugin-callout
yarn add vitepress-plugin-callout
bun add vitepress-plugin-callout
```

## Health

**Score 30/100 (F)** — status: abandoned.

Positive: has types; esm support; no vulnerabilities; high quality score.

Warnings: low downloads; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.0.1 |
| Published | 2022-07-05 |
| First published | 2022-07-05 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 2 |
| Unpacked size | 10.9 KB |
| Known vulnerabilities | 0 (+2 in 1 direct dependencies) |
| Install scripts | no |
| GitHub stars | 1 |
| Author | widcardw |
| Maintainers | widcardw |

## Links

- npm: https://www.npmjs.com/package/vitepress-plugin-callout
- Repository: https://github.com/widcardw/vitepress-plugin-callout
- Homepage: https://github.com/widcardw/vitepress-plugin-callout#readme
- Issues: https://github.com/widcardw/vitepress-plugin-callout/issues
- npm.io page: https://npm.io/package/vitepress-plugin-callout

## Dependencies (2)

- [markdown-it](https://npm.io/package/markdown-it.md) ^13.0.1
- [@types/markdown-it](https://npm.io/package/@types/markdown-it.md) ^12.2.3

## Recent versions

- 0.0.1 (latest) — 2022-07-05
- 0.0.0 — 2022-07-05

## README

# vitepress-plugin-callout (WIP)

[![NPM version](https://img.shields.io/npm/v/vitepress-plugin-callout?color=a1b858&label=)](https://www.npmjs.com/package/vitepress-plugin-callout)

This is a plugin for vitepress that support callout blocks. The callout block is inspired by [Obsidian](https://obsidian.md).

## Some examples

![examples](./img/examples.png)

## Installation

Install the plugin with npm.

```sh
npm install vitepress-plugin-callout
```

Then import it into vitepress

```ts
// .vitepress/config.ts
import callout from 'vitepress-plugin-callout'
export default {
  markdown: {
    config: (md: markdownit) => {
      md.use(callout)
    }
  }
}
```

Import styles (I have no idea how to build css files into dist, so try to download it from github and import mannually `¯\_(ツ)_/¯`)

```ts
// .vitepress/theme/index.ts
import 'path/to/styles.css'
```

## Usage

Basic usage.

```markdown
> [!note] This is a note
> This is the body of callout block.
>
> You can write more lines.
```

If you do not want the callout body, just write the title, and the fold icon will be hidden.

```markdown
> [!tip] Callout without body
```

All of the callout blocks are *expanded* by default, except the _example_ block. However, you can change it mannually.
If you want to fold the block by default, you can write `open` or `closed` in the options.

```markdown
> [!info|closed] The block will be folded by default.
> You can click the header to expand it.
```

The following callout types are supported.

|Type	|Aliases|
|-------|-------|
|note	|note, seealso|
|abstract	|abstract, summary, tldr|
|info	|info, todo|
|tip	|tip, hint, important|
|success	|success, check, done|
|question	|question, help, faq|
|warning	|warning, caution, attention|
|failure	|failure, fail, missing|
|danger	|danger, error|
|bug	|bug|
|example	|example|
|quote	|quote, cite|

## Repo template

[antfu/starter-ts](https://github.com/antfu/starter-ts.git)

## License

[MIT](./LICENSE) License © 2022 [widcardw](https://github.com/widcardw)

---
_Source: https://npm.io/package/vitepress-plugin-callout · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._