Skip to content

Commit

Permalink
chore: update deps & docs
Browse files Browse the repository at this point in the history
  • Loading branch information
@lin-stephanie
lin-stephanie committed Dec 18, 2024
1 parent a7953c5 commit 9e6b92c
Show file tree
Hide file tree
Showing 4 changed files with 1,162 additions and 868 deletions.
60 changes: 39 additions & 21 deletions README.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -64,9 +64,10 @@ Say `example.md` contains:
> Some content shown after opening!
```

And module `example.js` contains:
For vanilla JS：

```js
// example.js
import { unified } from 'unified'
import remarkParse from 'remark-parse'
import remarkRehype from 'remark-rehype'
Expand All @@ -84,27 +85,44 @@ const file = unified()
console.log(String(file))
```

Or for an Astro project, the `astro.config.ts` contains:
For Astro projects:

```ts
// astro.config.ts
import { defineConfig } from 'astro/config'
import rehypeCallouts from 'rehype-callouts'

// https://docs.astro.build/en/reference/configuration-reference/
export default defineConfig({
// ...
markdown: {
// ...
rehypePlugins: [
// ...
rehypeCallouts,
],
rehypePlugins: [rehypeCallouts],
},
// ...
})
```

Then running `node example.js` or `pnpm astro dev` yields:
For Next.js projects:

```ts
// next.config.ts
import type { NextConfig } from 'next'
import rehypeCallouts from 'rehype-callouts'

// https://nextjs.org/docs/app/api-reference/config/next-config-js
const nextConfig: NextConfig = {
pageExtensions: ['js', 'jsx', 'md', 'mdx', 'ts', 'tsx'],
}

const withMDX = createMDX({
options: {
remarkPlugins: [],
rehypePlugins: [rehypeCallouts],
},
})

export default nextConfig
```

Run `node example.js` (`pnpm dev`) to get:

```html
<div
Expand All @@ -113,7 +131,7 @@ Then running `node example.js` or `pnpm astro dev` yields:
style="--callout-color-light: rgb(8, 109, 221); --callout-color-dark: rgb(2, 122, 255);"
>
<div class="callout-title">
<div class="callout-icon">
<div class="callout-icon" aria-hidden="true">
<!-- svg icon-->
</div>
<div class="callout-title-inner">
Expand All @@ -131,13 +149,13 @@ Then running `node example.js` or `pnpm astro dev` yields:
style="--callout-color-light: rgb(236, 117, 0); --callout-color-dark: rgb(233, 151, 63);"
>
<summary class="callout-title">
<div class="callout-icon">
<div class="callout-icon" aria-hidden="true">
<!-- svg icon-->
</div>
<div class="callout-title-inner">
This is a <strong>collapsible</strong> callout
</div>
<div class="callout-fold">
<div class="callout-fold" aria-hidden="true">
<!-- svg icon-->
</div>
</summary>
Expand Down Expand Up @@ -188,7 +206,7 @@ This package exports no identifiers. The default export is `rehypeCallouts`.

### `unified().use(rehypeCallouts, options?)`

Used to render callouts, including an optional parameter [`options`](#options).
Used to render callouts, including an optional parameter [`options`](#options-useroptions).

### `options: UserOptions`

Expand All @@ -199,12 +217,12 @@ You can configure this plugin with the following optional settings:
| theme | `'github'\|'obsidian'\|'vitepress'`<br>(default: `'obsidian'`) | Specifies your desired callout theme to automatically apply its default callout types. |
| [callouts](#callouts-recordstring-calloutconfig) | `Record<string, CalloutConfig>` (default: see [source code](https://github.com/lin-stephanie/rehype-callouts/tree/main/src/themes) ) | Defines the properties for default and custom callouts. For example: `{'note': {title: 'CustomTitle'}, 'custom': {color: 'pink'}}` |
| aliases | `Record<string, string[]>` (default: `{}`) | Configures aliases for callout types. For example: `{'note': ['n'], 'tip': ['t']}` |
| showIndicator | `boolean`(default: `true`) | Whether to display an type-specific icons before callout title. |
| showIndicator | `boolean` (default: `true`) | Whether to display an type-specific icons before callout title. |
| [htmlTagNames](#htmltagnames-htmltagnamesconfig) | `HtmlTagNamesConfig`(default: `'div'`) | Configures HTML tag names for elements within the callout structure for semantic flexibility. |

### `callouts: Record<string, CalloutConfig>`

Defines properties for default and custom callouts. Each key represents a callout type, and the value is an object with the following optional properties:
Each key represents a callout type, and the value is an object with the following optional properties:

| Property | Type | Description |
| --------- | ---------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
Expand All @@ -214,7 +232,7 @@ Defines properties for default and custom callouts. Each key represents a callou

### `htmlTagNames: HtmlTagNamesConfig`

Configures HTML tag names for elements within the callout structure for semantic flexibility. Note that custom HTML tag names may affect default package styling; check and adjust styles as needed.
Configures callout HTML tag names for semantic flexibility. Custom tags may affect default package styling; adjust as necessary.

| Property | Type | Description |
| ------------------------------ | -------- | --------------------------------------------------------------------------------------------------------------------------------------------- |
Expand Down Expand Up @@ -261,11 +279,11 @@ If you see any errors or room for improvement on this plugin, feel free to open

<!-- Badges -->

[version-badge]: https://img.shields.io/github/v/release/lin-stephanie/rehype-callouts?label=release&style=flat&colorA=080f12&colorB=ef7575
[version-badge]: https://img.shields.io/github/v/release/lin-stephanie/rehype-callouts?label=release&style=flat&colorA=080f12&colorB=f87171
[version-link]: https://github.com/lin-stephanie/rehype-callouts/releases
[coverage-badge]: https://img.shields.io/codecov/c/github/lin-stephanie/rehype-callouts?style=flat&colorA=080f12&colorB=ef7575
[coverage-badge]: https://img.shields.io/codecov/c/github/lin-stephanie/rehype-callouts?style=flat&colorA=080f12&colorB=f87171
[coverage]: https://codecov.io/github/lin-stephanie/rehype-callouts
[npm-downloads-src]: https://img.shields.io/npm/dm/rehype-callouts?style=flat&colorA=080f12&colorB=ef7575
[npm-downloads-src]: https://img.shields.io/npm/dm/rehype-callouts?style=flat&colorA=080f12&colorB=f87171
[npm-downloads-href]: https://npmjs.com/package/rehype-callouts
[jsdocs-src]: https://img.shields.io/badge/jsdocs-reference-080f12?style=flat&colorA=080f12&colorB=ef7575
[jsdocs-src]: https://img.shields.io/badge/jsdocs-reference-080f12?style=flat&colorA=080f12&colorB=f87171
[jsdocs-href]: https://www.jsdocs.io/package/rehype-callouts
21 changes: 12 additions & 9 deletions package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,10 +7,11 @@
"keywords": [
"rehype-plugin",
"obsidian",
"callout",
"callouts",
"github",
"alerts",
"admonitions",
"github",
"unified",
"hast"
],
Expand All @@ -25,8 +26,8 @@
"module": "dist/index.js",
"exports": {
".": {
"import": "./dist/index.js",
"types": "./dist/index.d.ts"
"types": "./dist/index.d.ts",
"import": "./dist/index.js"
},
"./theme/github": "./dist/themes/github/index.css",
"./theme/obsidian": "./dist/themes/obsidian/index.css",
Expand All @@ -37,6 +38,7 @@
"test": "vitest && vitest run --coverage",
"build": "rimraf dist && tsc",
"postbuild": "copyfiles -u 1 'src/**/*.css' dist",
"check": "publint",
"typecheck": "tsc --noEmit",
"typecheck:coverage": "type-coverage --strict --detail --min=100",
"lint": "xo --prettier",
Expand All @@ -52,10 +54,11 @@
"unist-util-visit": "^5.0.0"
},
"devDependencies": {
"@vitest/coverage-v8": "^2.1.2",
"@vitest/coverage-v8": "^2.1.8",
"copyfiles": "^2.4.1",
"lint-staged": "^15.2.10",
"prettier": "^3.3.3",
"lint-staged": "^15.2.11",
"prettier": "^3.4.2",
"publint": "^0.2.12",
"rehype-minify-whitespace": "^6.0.2",
"rehype-parse": "^9.0.1",
"rehype-stringify": "^10.0.1",
Expand All @@ -65,10 +68,10 @@
"simple-git-hooks": "^2.11.1",
"to-vfile": "^8.0.0",
"type-coverage": "^2.29.1",
"typescript": "^5.6.3",
"typescript": "^5.7.2",
"unified": "^11.0.5",
"vitest": "^2.1.2",
"xo": "^0.59.3"
"vitest": "^2.1.8",
"xo": "^0.60.0"
},
"xo": {
"space": true,
Expand Down
Loading

0 comments on commit 9e6b92c

Please sign in to comment.