diff --git a/packages/unconfig-vitepress/src/plugins/nolebase/index.ts b/packages/unconfig-vitepress/src/plugins/nolebase/index.ts index 9709da6b..0e0184f1 100644 --- a/packages/unconfig-vitepress/src/plugins/nolebase/index.ts +++ b/packages/unconfig-vitepress/src/plugins/nolebase/index.ts @@ -141,6 +141,15 @@ const defaultOptions: NolebasePluginPresetOptions = { dateFnsLocaleName: 'enUS', }, }, + { + key: 'someCustomProperty', + type: 'dynamic', + title: 'Some custom property', + options: { + type: 'custom', + getter: () => 'Custom value', + }, + }, ], 'zh-CN': [ { @@ -184,6 +193,15 @@ const defaultOptions: NolebasePluginPresetOptions = { dateFnsLocaleName: 'zhCN', }, }, + { + key: 'someCustomProperty', + type: 'dynamic', + title: '自定义属性', + options: { + type: 'custom', + getter: () => 'Custom value', + }, + }, ], }, }, diff --git a/packages/vitepress-plugin-page-properties/src/client/components/PageProperties.vue b/packages/vitepress-plugin-page-properties/src/client/components/PageProperties.vue index 6c7e1203..82c0baee 100644 --- a/packages/vitepress-plugin-page-properties/src/client/components/PageProperties.vue +++ b/packages/vitepress-plugin-page-properties/src/client/components/PageProperties.vue @@ -4,8 +4,10 @@ import { useData } from 'vitepress' import { NuTag } from '@nolebase/ui' import { InjectionKey } from '../constants' +import type { Property } from '../types' import { isDatetimeProperty, + isDynamicCustomProperty, isDynamicReadingTimeProperty, isDynamicWordsCountProperty, isLinkProperty, @@ -22,7 +24,8 @@ import ProgressBar from './ProgressBar.vue' import Datetime from './Datetime.vue' const options = inject(InjectionKey, {}) -const { lang, frontmatter } = useData() +const vitePressData = useData() +const { lang, frontmatter } = vitePressData const { t } = useI18n() const rawPath = useRawPath() const pagePropertiesData = usePageProperties() @@ -148,6 +151,9 @@ const readingTime = computed(() => { + + + @@ -245,6 +251,17 @@ const readingTime = computed(() => { {{ formatDurationFromValue(readingTime, property.pageProperty.options.dateFnsLocaleName || lang) }} + + + {{ property.pageProperty.options.getter(vitePressData) }} + + { + + + @@ -269,6 +275,17 @@ const readingTime = computed(() => { {{ formatDurationFromValue(readingTime, property.pageProperty.options.dateFnsLocaleName || lang) }} + + + {{ property.pageProperty.options.getter(vitePressData) }} + + | null) return false } -export function isDynamicWordsCountProperty(_?: any, property?: Property | null): property is DynamicProperty | null { +export function isDynamicWordsCountProperty(_?: any, property?: Property | null): property is DynamicProperty | null { if (property && property.type && property.type === 'dynamic' && property.options && property.options.type === 'wordsCount') return true return false } -export function isDynamicReadingTimeProperty(_?: any, property?: Property | null): property is DynamicProperty | null { +export function isDynamicReadingTimeProperty(_?: any, property?: Property | null): property is DynamicProperty | null { if (property && property.type && property.type === 'dynamic' && property.options && property.options.type === 'readingTime') return true return false } + +export function isDynamicCustomProperty(_?: any, property?: Property | null): property is DynamicProperty | null { + if (property && property.type && property.type === 'dynamic' && property.options && property.options.type === 'custom') + return true + + return false +} diff --git a/packages/vitepress-plugin-page-properties/src/client/types.ts b/packages/vitepress-plugin-page-properties/src/client/types.ts index 11da60e7..b51c3359 100644 --- a/packages/vitepress-plugin-page-properties/src/client/types.ts +++ b/packages/vitepress-plugin-page-properties/src/client/types.ts @@ -1,3 +1,5 @@ +import type { VitePressData } from 'vitepress' + export interface TagsProperty { type: 'tags' key: K @@ -36,15 +38,18 @@ export interface LinkProperty { omitEmpty?: boolean } -export interface DynamicProperty { +export interface DynamicProperty { type: 'dynamic' key: K | string title: string - options: - DynamicWordsCountProperty | - DynamicReadingTimeProperty + options: OP } +export type DynamicPropertyOptions = + | DynamicWordsCountProperty + | DynamicReadingTimeProperty + | DynamicCustomProperty + export interface DynamicWordsCountProperty { type: 'wordsCount' } @@ -54,13 +59,18 @@ export interface DynamicReadingTimeProperty { dateFnsLocaleName?: string } +export interface DynamicCustomProperty { + type: 'custom' + getter: (data: VitePressData) => string | Promise +} + export type Property = - TagsProperty | - PlainProperty | - DatetimeProperty | - ProgressProperty | - LinkProperty | - DynamicProperty + | TagsProperty + | PlainProperty + | DatetimeProperty + | ProgressProperty + | LinkProperty + | DynamicProperty export type PropertyType = Property['type'] export type DynamicPropertyType = DynamicProperty['options']['type'] diff --git a/packages/vitepress-plugin-page-properties/src/client/virtual.d.ts b/packages/vitepress-plugin-page-properties/src/client/virtual.d.ts index 964b9191..3b6135eb 100644 --- a/packages/vitepress-plugin-page-properties/src/client/virtual.d.ts +++ b/packages/vitepress-plugin-page-properties/src/client/virtual.d.ts @@ -1,70 +1,3 @@ -interface TagsProperty { - type: 'tags' - key: K - title: string - omitEmpty?: boolean -} - -interface PlainProperty { - type: 'plain' - key: K - title: string - omitEmpty?: boolean -} - -interface DatetimeProperty { - type: 'datetime' - key: K - title: string - formatAsFrom?: boolean - dateFnsLocaleName?: string - format?: string - omitEmpty?: boolean -} - -interface ProgressProperty { - type: 'progress' - key: K - title: string - omitEmpty?: boolean -} - -interface LinkProperty { - type: 'link' - key: K - title: string - omitEmpty?: boolean -} - -interface DynamicProperty { - type: 'dynamic' - key: K | string - title: string - options: - DynamicWordsCountProperty | - DynamicReadingTimeProperty -} - -interface DynamicWordsCountProperty { - type: 'wordsCount' -} - -interface DynamicReadingTimeProperty { - type: 'readingTime' - dateFnsLocaleName?: string -} - -type Property = - TagsProperty | - PlainProperty | - DatetimeProperty | - ProgressProperty | - LinkProperty | - DynamicProperty - -type PropertyType = Property['type'] -type DynamicPropertyType = DynamicProperty['options']['type'] - declare module 'virtual:nolebase-page-properties' { const pagePropertiesData: Record