feat(page-properties): added new page properties plugin

.vscode/settings.json

@@ -40,7 +40,8 @@
     "./docs",
     "./packages/vitepress-plugin-enhanced-readabilities",
     "./packages/vitepress-plugin-git-changelog",
-    "./packages/vitepress-plugin-inline-link-preview"
+    "./packages/vitepress-plugin-inline-link-preview",
+    "./packages/vitepress-plugin-page-properties"
   ],
   "typescript.tsdk": "node_modules/typescript/lib"
 }

docs/.vitepress/config.ts

@@ -82,6 +82,7 @@ export default defineConfig({
               { text: 'Inline Links Previewing', link: '/pages/en/integrations/vitepress-plugin-inline-link-preview/' },
               { text: 'Blinking highlight targeted heading', link: '/pages/en/integrations/vitepress-plugin-highlight-targeted-heading/' },
               { text: 'Changelog & File history', link: '/pages/en/integrations/vitepress-plugin-git-changelog/' },
+              { text: 'Page properties', link: '/pages/en/integrations/vitepress-plugin-page-properties/' },
             ],
           },
         ],
@@ -132,6 +133,7 @@ export default defineConfig({
               { text: '行内链接预览', link: '/pages/zh-CN/integrations/vitepress-plugin-inline-link-preview/' },
               { text: '闪烁高亮当前的目标标题', link: '/pages/zh-CN/integrations/vitepress-plugin-highlight-targeted-heading/' },
               { text: '变更日志 及 文件历史', link: '/pages/zh-CN/integrations/vitepress-plugin-git-changelog/' },
+              { text: '页面属性', link: '/pages/zh-CN/integrations/vitepress-plugin-page-properties/' },
             ],
           },
         ],

docs/.vitepress/theme/index.ts

@@ -22,12 +22,17 @@ import {
   NolebaseGitChangelogPlugin,
 } from '@nolebase/vitepress-plugin-git-changelog/client'
 
+import {
+  NolebasePagePropertiesPlugin,
+} from '@nolebase/vitepress-plugin-page-properties/client'
+
 import 'virtual:uno.css'
 
 import '@nolebase/vitepress-plugin-enhanced-readabilities/dist/style.css'
 import '@nolebase/vitepress-plugin-inline-link-preview/dist/style.css'
 import '@nolebase/vitepress-plugin-highlight-targeted-heading/dist/style.css'
 import '@nolebase/vitepress-plugin-git-changelog/client/style.css'
+import '@nolebase/vitepress-plugin-page-properties/client/style.css'
 
 import './styles/vars.css'
 import './styles/main.css'
@@ -55,7 +60,6 @@ export const Theme: ThemeConfig = {
     app.component('HomeContent', HomeContent)
 
     app.use(NolebaseInlineLinkPreviewPlugin)
-    app.use(NolebaseGitChangelogPlugin)
 
     app.provide(NolebaseEnhancedReadabilitiesInjectionKey, {
       layoutSwitch: {
@@ -66,6 +70,7 @@ export const Theme: ThemeConfig = {
       },
     })
 
+    app.use(NolebaseGitChangelogPlugin)
     app.provide(NolebaseGitChangelogInjectionKey, {
       mapContributors: [
         {
@@ -82,6 +87,80 @@ export const Theme: ThemeConfig = {
         },
       ],
     })
+
+    app.use(NolebasePagePropertiesPlugin<{
+      tags: string[]
+      authors: string[]
+      progress: string[]
+      createdAt: string
+      updatedAt: string
+      url1: string
+    }>(), {
+      properties: {
+        'en': [
+          {
+            key: 'tags',
+            type: 'tags',
+            title: 'Tags',
+          },
+          {
+            key: 'progress',
+            type: 'progress',
+            title: 'Progress',
+          },
+          {
+            key: 'createdAt',
+            type: 'datetime',
+            title: 'Created at',
+            formatAsFrom: true,
+            dateFnsLocaleName: 'enUS',
+          },
+          {
+            key: 'updatedAt',
+            type: 'datetime',
+            title: 'Updated at',
+            formatAsFrom: true,
+            dateFnsLocaleName: 'enUS',
+          },
+          {
+            key: 'url1',
+            type: 'link',
+            title: 'URL 1',
+          },
+        ],
+        'zh-CN': [
+          {
+            key: 'tags',
+            type: 'tags',
+            title: '标签',
+          },
+          {
+            key: 'progress',
+            type: 'progress',
+            title: '进度',
+          },
+          {
+            key: 'createdAt',
+            type: 'datetime',
+            title: '创建时间',
+            formatAsFrom: true,
+            dateFnsLocaleName: 'zhCN',
+          },
+          {
+            key: 'updatedAt',
+            type: 'datetime',
+            title: '更新时间',
+            formatAsFrom: true,
+            dateFnsLocaleName: 'zhCN',
+          },
+          {
+            key: 'url1',
+            type: 'link',
+            title: '链接 1',
+          },
+        ],
+      },
+    })
   },
 }
 

docs/package.json

@@ -15,6 +15,8 @@
     "@nolebase/vitepress-plugin-enhanced-readabilities": "workspace:^",
     "@nolebase/vitepress-plugin-git-changelog": "workspace:^",
     "@nolebase/vitepress-plugin-highlight-targeted-heading": "workspace:^",
-    "@nolebase/vitepress-plugin-inline-link-preview": "workspace:^"
+    "@nolebase/vitepress-plugin-inline-link-preview": "workspace:^",
+    "@nolebase/vitepress-plugin-page-properties": "workspace:^",
+    "vite-plugin-inspect": "^0.8.3"
   }
 }

docs/pages/en/index.md

@@ -46,6 +46,8 @@ Nólëbase Integrations project provides a variety of integrations, plugins, com
 
   <IntegrationCard type="vitepress" title="Changelog & File history" package="vitepress-plugin-git-changelog" />
 
+  <IntegrationCard type="vitepress" title="Page properties" package="vitepress-plugin-page-properties" />
+
   <IntegrationCard type="obsidian" title="UnoCSS" package="obsidian-plugin-unocss" />
 
 </div>

docs/pages/en/integrations/index.md

@@ -30,4 +30,8 @@ Nólëbase Integrations project provides a variety of integrations, plugins, com
 
 <br />
 
+<IntegrationCard type="vitepress" title="Page properties" package="vitepress-plugin-page-properties" />
+
+<br />
+
 <IntegrationCard type="obsidian" title="UnoCSS" package="obsidian-plugin-unocss" />

docs/pages/en/integrations/vitepress-plugin-page-properties/index.md

@@ -0,0 +1,12 @@
+---
+tags:
+  - Integrations/VitePress-Plugin
+  - Integrations/VitePress-Plugin/Page-Properties
+  - Markdown/frontmatter
+progress: 85
+url1: https://nolebase-integrations.ayaka.io/pages/en/
+createdAt: 2024-01-23
+updatedAt: 2024-01-23
+---
+
+# Page properties

docs/pages/zh-CN/index.md

@@ -46,6 +46,8 @@ Nólëbase 集成项目提供多种不同的集成、插件、组件和库来方
 
   <IntegrationCard type="vitepress" title="变更日志 及 文件历史" package="vitepress-plugin-git-changelog" />
 
+  <IntegrationCard type="vitepress" title="页面属性" package="vitepress-plugin-page-properties" />
+
   <IntegrationCard type="obsidian" title="UnoCSS" package="obsidian-plugin-unocss" />
 
 </div>

docs/pages/zh-CN/integrations/index.md

@@ -30,4 +30,8 @@ Nólëbase 集成项目提供多种不同的集成、插件、组件和库来方
 
 <br />
 
+<IntegrationCard type="vitepress" title="页面属性" package="vitepress-plugin-page-properties" />
+
+<br />
+
 <IntegrationCard type="obsidian" title="UnoCSS" package="obsidian-plugin-unocss" />

docs/pages/zh-CN/integrations/vitepress-plugin-page-properties/index.md

@@ -0,0 +1,12 @@
+---
+tags:
+  - 集成/VitePress-插件
+  - 集成/VitePress-插件/页面属性
+  - Markdown/frontmatter
+progress: 35
+url1: https://nolebase-integrations.ayaka.io/pages/zh-CN/
+createdAt: 2024-01-23
+updatedAt: 2024-01-23
+---
+
+# 页面属性

docs/vite.config.ts

@@ -1,12 +1,15 @@
 import { join } from 'node:path'
 import { defineConfig } from 'vite'
 import UnoCSS from 'unocss/vite'
+import Inspect from 'vite-plugin-inspect'
 import { GitChangelog, GitChangelogMarkdownSection } from '@nolebase/vitepress-plugin-git-changelog/vite'
+import { PagePropertiesMarkdownSection } from '@nolebase/vitepress-plugin-page-properties/vite'
 
 export default defineConfig(async () => {
   return {
     assetsInclude: ['**/*.mov', '**/*.mp4'],
     plugins: [
+      Inspect(),
       UnoCSS(),
       GitChangelog({
         repoURL: () => 'https://github.com/nolebase/integrations',
@@ -23,6 +26,25 @@ export default defineConfig(async () => {
 
           return 'File History'
         },
+        getContributorsTitle: (_, __, { helpers }): string => {
+          if (helpers.idStartsWith(join('pages', 'en')))
+            return 'Contributors'
+          if (helpers.idStartsWith(join('pages', 'zh-CN')))
+            return '贡献者'
+
+          return 'Contributors'
+        },
+        excludes: [],
+        exclude: (_, { helpers }): boolean => {
+          if (helpers.idEquals(join('pages', 'en', 'index.md')))
+            return true
+          if (helpers.idEquals(join('pages', 'zh-CN', 'index.md')))
+            return true
+
+          return false
+        },
+      }),
+      PagePropertiesMarkdownSection({
         excludes: [],
         exclude: (_, { helpers }): boolean => {
           if (helpers.idEquals(join('pages', 'en', 'index.md')))

packages/vitepress-plugin-page-properties/README.md

@@ -0,0 +1,27 @@
+# `@nolebase/vitepress-plugin-page-properties`
+
+A VitePress plugin that renders frontmatter as page properties, and makes them editable.
+
+## Install
+
+### Npm
+
+```shell
+npm i @nolebase/vitepress-plugin-page-properties -D
+```
+
+### Yarn
+
+```shell
+yarn add @nolebase/vitepress-plugin-page-properties -D
+```
+
+### Pnpm
+
+```shell
+pnpm add @nolebase/vitepress-plugin-page-properties -D
+```
+
+## Documentation
+
+Please refer to [Page properties](https://nolebase-integrations.ayaka.io/pages/en/integrations/vitepress-plugin-page-properties/) for more information.

packages/vitepress-plugin-page-properties/build.config.ts

@@ -0,0 +1,19 @@
+import { defineBuildConfig } from 'unbuild'
+import builtins from 'builtin-modules'
+
+export default defineBuildConfig({
+  entries: [
+    'src/vite/index',
+  ],
+  clean: false,
+  sourcemap: true,
+  declaration: true,
+  externals: [
+    'vite',
+    // builtins
+    ...builtins,
+  ],
+  rollup: {
+    emitCJS: true,
+  },
+})

packages/vitepress-plugin-page-properties/package.json

@@ -0,0 +1,76 @@
+{
+  "name": "@nolebase/vitepress-plugin-page-properties",
+  "type": "module",
+  "version": "1.12.1",
+  "description": "A VitePress plugin that renders frontmatter as page properties, and makes them editable.",
+  "author": {
+    "name": "Nólëbase",
+    "email": "[email protected]",
+    "url": "https://github.com/nolebase"
+  },
+  "license": "MIT",
+  "homepage": "https://nolebase-integrations.ayaka.io/pages/en/integrations/vitepress-plugin-page-properties/",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/nolebase/integrations.git",
+    "directory": "packages/vitepress-plugin-page-properties"
+  },
+  "keywords": [
+    "vitepress",
+    "nolebase",
+    "obsidian",
+    "markdown",
+    "properties",
+    "frontmatter",
+    "graymatter",
+    "live-edit",
+    "editor",
+    "tags",
+    "vitepress-plugin",
+    "nolebase-integration"
+  ],
+  "sideEffects": false,
+  "exports": {
+    "./vite": {
+      "types": "./dist/vite/index.d.ts",
+      "import": "./dist/vite/index.mjs",
+      "require": "./dist/vite/index.cjs"
+    },
+    "./client/style.css": "./dist/client/style.css",
+    "./client": {
+      "types": "./dist/client/index.d.ts",
+      "import": "./dist/client/index.mjs",
+      "require": "./dist/client/index.cjs"
+    }
+  },
+  "main": "./dist/client/index.cjs",
+  "module": "./dist/client/index.mjs",
+  "types": "./dist/client/index.d.ts",
+  "files": [
+    "README.md",
+    "dist",
+    "package.json"
+  ],
+  "scripts": {
+    "dev": "concurrently \"pnpm run stub\" \"pnpm run build:watch\" \"pnpm run emit-types\"",
+    "stub": "unbuild --stub",
+    "emit-types": "vue-tsc --declaration --esModuleInterop --sourceMap --skipLibCheck --skipDefaultLibCheck --emitDeclarationOnly --outDir dist/client src/client/index.ts",
+    "build": "vite build && pnpm run emit-types && unbuild",
+    "build:watch": "vite build --mode development --watch"
+  },
+  "peerDependencies": {
+    "vitepress": ">=1.0.0-rc.39",
+    "vue": ">=3.3.0"
+  },
+  "dependencies": {
+    "gray-matter": "^4.0.3",
+    "markdown-it": "^13.0.2",
+    "uuid": "^9.0.1"
+  },
+  "devDependencies": {
+    "@types/markdown-it": "^13.0.7",
+    "@types/uuid": "^9.0.7",
+    "builtin-modules": "^3.3.0",
+    "date-fns": "^3.3.1"
+  }
+}