From 8ab36d05fa4aa8b3707c1f89efc1c820ffaf9669 Mon Sep 17 00:00:00 2001 From: Evan You Date: Sat, 11 Mar 2023 17:37:42 +0800 Subject: [PATCH] fix: properly serialize header in outline BREAKING CHANGE: default theme config option `outlineBadge` has been removed. Badges in headers are now always excluded when generating outline text. --- docs/reference/default-theme-config.md | 9 ++----- .../theme-default/composables/outline.ts | 24 ++++++++++++++++--- types/default-theme.d.ts | 7 ------ 3 files changed, 23 insertions(+), 17 deletions(-) diff --git a/docs/reference/default-theme-config.md b/docs/reference/default-theme-config.md index 0da89c19..f196c626 100644 --- a/docs/reference/default-theme-config.md +++ b/docs/reference/default-theme-config.md @@ -168,6 +168,7 @@ export type SidebarItem = { - Type: `boolean` - Default: `true` +- Can be overridden per page via [frontmatter](./frontmatter-config#aside) Setting this value to `false` prevents rendering of aside container. @@ -175,16 +176,10 @@ Setting this value to `false` prevents rendering of aside container. - Type: `number | [number, number] | 'deep' | false` - Default: `2` +- Can be overridden per page via [frontmatter](./frontmatter-config#outline) The levels of header to display in the outline. You can specify a particular level by passing a number, or you can provide a level range by passing a tuple containing the bottom and upper limits. When passing `'deep'` which equals `[2, 6]`, all header levels are shown in the outline except `h1`. Set `false` to hide outline. -## outlineBadges - -- Type: `boolean` -- Default: `true` - -By default the badge text is displayed in the outline. Disable this to hide badge text from outline. - ## outlineTitle - Type: `string` diff --git a/src/client/theme-default/composables/outline.ts b/src/client/theme-default/composables/outline.ts index 5ab9cd3d..1c513148 100644 --- a/src/client/theme-default/composables/outline.ts +++ b/src/client/theme-default/composables/outline.ts @@ -11,13 +11,13 @@ export type MenuItem = Omit & { children?: MenuItem[] } -export function getHeaders(range?: DefaultTheme.Config['outline']) { +export function getHeaders(range: DefaultTheme.Config['outline']) { const headers = [...document.querySelectorAll('.VPDoc h2,h3,h4,h5,h6')] - .filter((el) => el.id && el.firstChild && el.firstChild.nodeType === 3) + .filter((el) => el.id && el.hasChildNodes()) .map((el) => { const level = Number(el.tagName[1]) return { - title: (el.firstChild as Text).data.trim(), + title: serializeHeader(el), link: '#' + el.id, level } @@ -26,6 +26,24 @@ export function getHeaders(range?: DefaultTheme.Config['outline']) { return resolveHeaders(headers, range) } +function serializeHeader(h: Element): string { + let ret = '' + for (const node of h.childNodes) { + if (node.nodeType === 1) { + if ( + (node as Element).classList.contains('VPBadge') || + (node as Element).classList.contains('header-anchor') + ) { + continue + } + ret += node.textContent + } else if (node.nodeType === 3) { + ret += node.textContent + } + } + return ret +} + export function resolveHeaders( headers: MenuItem[], range?: DefaultTheme.Config['outline'] diff --git a/types/default-theme.d.ts b/types/default-theme.d.ts index 7abab0b6..ce0292af 100644 --- a/types/default-theme.d.ts +++ b/types/default-theme.d.ts @@ -22,13 +22,6 @@ export namespace DefaultTheme { */ outline?: Outline | Outline['level'] | false - /** - * Disable this to hide badge text from outline. - * - * @default true - */ - outlineBadges?: boolean - /** * @deprecated * Use `outline.label` instead.