refactor: deprecate MarkdownSectionWrapper, use SFC layout. (#424)

project-trans · Sep 19, 2024 · eca59fa · eca59fa
1 parent b0ece49
commit eca59fa
Show file tree

Hide file tree

Showing 5 changed files with 45 additions and 216 deletions.
diff --git a/packages/vitepress-theme-project-trans/package.json b/packages/vitepress-theme-project-trans/package.json
@@ -24,11 +24,6 @@
       "import": "./dist/theme.mjs",
       "require": "./dist/theme.js"
     },
-    "./plugins/MarkdownSectionWrapper": {
-      "types": "./dist/plugins/MarkdownSectionWrapper.d.ts",
-      "import": "./dist/plugins/MarkdownSectionWrapper.mjs",
-      "require": "./dist/plugins/MarkdownSectionWrapper.js"
-    },
     "./components": {
       "types": "./dist/components.d.ts",
       "import": "./dist/components.mjs",

diff --git a/packages/vitepress-theme-project-trans/src/Layout.vue b/packages/vitepress-theme-project-trans/src/Layout.vue
@@ -0,0 +1,43 @@
+<script lang="ts" setup>
+import DefaultTheme from 'vitepress/theme'
+import {
+  NolebaseHighlightTargetedHeading,
+} from '@nolebase/vitepress-plugin-highlight-targeted-heading/client'
+import {
+  NolebaseEnhancedReadabilitiesMenu,
+  NolebaseEnhancedReadabilitiesScreenMenu,
+} from '@nolebase/vitepress-plugin-enhanced-readabilities/client'
+
+import { useData } from 'vitepress'
+import CopyrightInfo from './components/CopyrightInfo.vue'
+import AppFooter from './components/AppFooter.vue'
+import AppearanceToggle from './components/AppearanceToggle.vue'
+import PageInfo from './components/PageInfo.vue'
+
+const { Layout } = DefaultTheme
+const { frontmatter } = useData()
+</script>
+
+<template>
+  <AppearanceToggle>
+    <Layout>
+      <template #doc-before>
+        <div class="vp-doc">
+          <h1>{{ frontmatter.title }}</h1>
+          <PageInfo />
+          <CopyrightInfo />
+        </div>
+        <NolebaseHighlightTargetedHeading />
+      </template>
+      <template #doc-after>
+        <AppFooter />
+      </template>
+      <template #nav-bar-content-after>
+        <NolebaseEnhancedReadabilitiesMenu />
+      </template>
+      <template #nav-screen-content-after>
+        <NolebaseEnhancedReadabilitiesScreenMenu />
+      </template>
+    </Layout>
+  </AppearanceToggle>
+</template>
diff --git a/packages/vitepress-theme-project-trans/src/config.ts b/packages/vitepress-theme-project-trans/src/config.ts
@@ -5,11 +5,6 @@ import { fileURLToPath } from 'node:url'
 
 import { GitChangelog } from '@nolebase/vitepress-plugin-git-changelog/vite'
 import { transformHeadMeta } from '@nolebase/vitepress-plugin-meta'
-import {
-  MarkdownSectionWrapper,
-  PageHeaderTemplate,
-  TemplateCopyrightInfo,
-} from '@project-trans/vitepress-theme-project-trans/plugins/MarkdownSectionWrapper'
 import footnote from 'markdown-it-footnote'
 import katex from 'markdown-it-katex'
 import mdPangu from 'markdown-it-pangu'
@@ -169,19 +164,6 @@ function genConfig() {
     },
     vite: {
       plugins: [
-        MarkdownSectionWrapper(
-          [PageHeaderTemplate, TemplateCopyrightInfo],
-          [],
-          {
-            excludes: [],
-            exclude: (_, { helpers }): boolean => {
-              if (helpers.idEquals('index.md'))
-                return true
-
-              return false
-            },
-          },
-        ),
         GitChangelog({
           repoURL: githubRepoLink,
         }),

diff --git a/packages/vitepress-theme-project-trans/src/plugins/MarkdownSectionWrapper.ts b/packages/vitepress-theme-project-trans/src/plugins/MarkdownSectionWrapper.ts
diff --git a/packages/vitepress-theme-project-trans/src/theme.ts b/packages/vitepress-theme-project-trans/src/theme.ts
@@ -5,48 +5,25 @@ import { h } from 'vue'
 import './custom-font.css'
 
 import {
-  NolebaseEnhancedReadabilitiesMenu,
   NolebaseEnhancedReadabilitiesPlugin,
-  NolebaseEnhancedReadabilitiesScreenMenu,
 } from '@nolebase/vitepress-plugin-enhanced-readabilities/client'
 
-import {
-  NolebaseHighlightTargetedHeading,
-} from '@nolebase/vitepress-plugin-highlight-targeted-heading/client'
-
 import {
   NolebaseGitChangelogPlugin,
 } from '@nolebase/vitepress-plugin-git-changelog/client'
 import type Options from 'vitepress-sidebar'
-import AppearanceToggle from './components/AppearanceToggle.vue'
 
 import '@nolebase/vitepress-plugin-enhanced-readabilities/client/style.css'
 import '@nolebase/vitepress-plugin-git-changelog/client/style.css'
 import '@nolebase/vitepress-plugin-highlight-targeted-heading/client/style.css'
 
-import AppFooter from './components/AppFooter.vue'
+import Layout from './Layout.vue'
 
 export type SidebarOptions = Options
 
 export default {
   extends: DefaultTheme,
-  Layout: () => {
-    return h(AppearanceToggle, null, {
-      default: () => h(DefaultTheme.Layout, null, {
-        // https://vitepress.dev/guide/extending-default-theme#layout-slots
-        'doc-top': () => [
-          h(NolebaseHighlightTargetedHeading),
-        ],
-        'doc-after': () => [h(AppFooter)],
-        'nav-bar-content-after': () => [
-          h(NolebaseEnhancedReadabilitiesMenu),
-        ],
-        'nav-screen-content-after': () => [
-          h(NolebaseEnhancedReadabilitiesScreenMenu),
-        ],
-      }),
-    })
-  },
+  Layout,
   enhanceApp({ app }) {
     app.use(NolebaseEnhancedReadabilitiesPlugin, {
       spotlight: {