diff --git a/README.md b/README.md index 9abca4b..960cce4 100644 --- a/README.md +++ b/README.md @@ -1,8 +1,8 @@ # rehype-callouts -[![Coverage][coverage-badge]][coverage] +[![codecov][coverage-badge]][coverage] [![npm downloads][npm-downloads-src]][npm-downloads-href] -[![JSDocs][jsdocs-src]][jsdocs-href] +[![jsDocs.io][jsdocs-src]][jsdocs-href] A [rehype](https://github.com/rehypejs/rehype) plugin for processing and rendering blockquote-based callouts. @@ -55,6 +55,8 @@ In browsers with [`esm.sh`](https://esm.sh/): Say `example.md` contains: ```md + + > [!note] This is a _non-collapsible_ callout > Some content is displayed directly! diff --git a/src/index.ts b/src/index.ts index eb09e36..89dcc43 100644 --- a/src/index.ts +++ b/src/index.ts @@ -157,12 +157,16 @@ const rehypeCallouts: Plugin<[UserOptions?], Root> = (options) => { }, title ? [ - showIndicator ? getIndicator(config, revisedType) : null, + showIndicator + ? getIndicator(expandedCallouts, revisedType) + : null, node.children[0], collapsable ? getFoldIcon() : null, ] : [ - showIndicator ? getIndicator(config, revisedType) : null, + showIndicator + ? getIndicator(expandedCallouts, revisedType) + : null, h( 'div', { className: ['callout-title-inner'] }, diff --git a/src/themes/vitepress/config.ts b/src/themes/vitepress/config.ts index 213df62..4430da2 100644 --- a/src/themes/vitepress/config.ts +++ b/src/themes/vitepress/config.ts @@ -4,31 +4,31 @@ export const vitepressCallouts: DefaultCallouts = { note: { title: 'NOTE', indicator: - '', + '', color: ['rgb(142, 150, 170)', 'rgb(101, 117, 133)'], }, tip: { title: 'TIP', indicator: - '', + '', color: ['rgb(100, 108, 255)', 'rgb(100, 108, 255)'], }, important: { title: 'IMPORTANT', indicator: - '', + '', color: ['rgb(159, 122, 234)', 'rgb(159, 122, 234)'], }, warning: { title: 'WARNING', indicator: - '', + '', color: ['rgb(234, 179, 8)', 'rgb(234, 179, 8)'], }, caution: { title: 'CAUTION', indicator: - '', + '', color: ['rgb(244, 63, 94)', 'rgb(244, 63, 94)'], }, } diff --git a/src/themes/vitepress/index.css b/src/themes/vitepress/index.css index f1b3b91..d51abf8 100644 --- a/src/themes/vitepress/index.css +++ b/src/themes/vitepress/index.css @@ -68,5 +68,5 @@ .callout-fold svg { width: 16px; height: 16px; - stroke-width: 3; + stroke-width: 2.2; } diff --git a/src/utils.ts b/src/utils.ts index 27cfbba..f34aa28 100644 --- a/src/utils.ts +++ b/src/utils.ts @@ -190,10 +190,10 @@ export function generateStyle( * SVG element or undefined if not found. */ export function getIndicator( - config: ConfigOptions, + callouts: Callouts, type: string ): Element | undefined { - const indicator = config.callouts[type]?.indicator + const indicator = callouts[type]?.indicator if (!indicator) return const indicatorElement = fromHtml(indicator, { diff --git a/test/fixtures/customTheme/output.html b/test/fixtures/customTheme/output.html index 70102c8..3be70a3 100644 --- a/test/fixtures/customTheme/output.html +++ b/test/fixtures/customTheme/output.html @@ -4,7 +4,18 @@ >
- + +
NOTE
@@ -24,13 +35,13 @@ width="1em" height="1em" viewBox="0 0 24 24" + fill="none" + stroke="currentColor" + stroke-width="2" + stroke-linecap="round" + stroke-linejoin="round" > @@ -53,13 +64,13 @@ width="1em" height="1em" viewBox="0 0 24 24" + fill="none" + stroke="currentColor" + stroke-width="2" + stroke-linecap="round" + stroke-linejoin="round" > @@ -82,13 +93,13 @@ width="1em" height="1em" viewBox="0 0 24 24" + fill="none" + stroke="currentColor" + stroke-width="2" + stroke-linecap="round" + stroke-linejoin="round" > diff --git a/test/fixtures/showIndicator/input.md b/test/fixtures/showIndicator/input.md index 9e7b9cf..31479e3 100644 --- a/test/fixtures/showIndicator/input.md +++ b/test/fixtures/showIndicator/input.md @@ -1,4 +1,4 @@ -> [!note] +> [!n] > This is the content! > [!TIP] diff --git a/test/index.test.ts b/test/index.test.ts index 167d240..1b0048f 100644 --- a/test/index.test.ts +++ b/test/index.test.ts @@ -62,7 +62,7 @@ run('fromHtml', { showIndicator: false }, true) run('collapsibleCallouts', { showIndicator: false }) run('markdownInTitle', { showIndicator: false }) run('nestedCallouts', { showIndicator: false }) -run('showIndicator') +run('showIndicator', { aliases: { note: ['n'] } }) run('customTheme', { theme: 'vitepress', callouts: {