@sugarat/theme 0.2.17 → 0.2.18

package/node.d.ts

@@ -365,8 +365,19 @@ declare namespace Theme {
         /**
          * 配置内置的 markdown-it-task-checkbox 插件，设置 false 则关闭
          * 详见 https://github.com/linsir/markdown-it-task-checkbox
+         * @default true
          */
         taskCheckbox?: TaskCheckbox | boolean;
+        /**
+         * 支持 markdown 时间线语法，在 vitepress 中使用 markdown 渲染时间线（时间轴）样式。
+         * 详见 https://github.com/HanochMa/vitepress-markdown-timeline
+         * @default true
+         */
+        timeline?: boolean;
+        /**
+         * 回到顶部
+         * @default true
+         */
         backToTop?: boolean | BackToTop;
     }
     interface BackToTop {

package/node.js

@@ -203,6 +203,9 @@ var tabsPlugin = (md) => {
   };
 };
 
+// src/utils/node/mdPlugins.ts
+var import_vitepress_markdown_timeline = __toESM(require("vitepress-markdown-timeline"));
+
 // src/utils/node/index.ts
 var import_node_child_process = require("child_process");
 var import_node_path = __toESM(require("path"));
@@ -324,18 +327,15 @@ function getMarkdownPlugins(cfg) {
   if (cfg?.tabs !== false) {
     markdownPlugin.push(tabsPlugin);
   }
-  if (cfg) {
-    cfg.mermaid = cfg?.mermaid ?? true;
-    if (cfg?.mermaid !== false) {
-      const { MermaidMarkdown } = _require("vitepress-plugin-mermaid");
-      markdownPlugin.push(MermaidMarkdown);
-    }
+  if (cfg?.mermaid !== false) {
+    const { MermaidMarkdown } = _require("vitepress-plugin-mermaid");
+    markdownPlugin.push(MermaidMarkdown);
   }
-  if (cfg) {
-    cfg.taskCheckbox = cfg?.taskCheckbox ?? true;
-    if (cfg.taskCheckbox !== false) {
-      markdownPlugin.push(taskCheckboxPlugin(cfg.taskCheckbox));
-    }
+  if (cfg.taskCheckbox !== false) {
+    markdownPlugin.push(taskCheckboxPlugin(typeof cfg?.taskCheckbox === "boolean" ? {} : cfg?.taskCheckbox));
+  }
+  if (cfg?.timeline !== false) {
+    markdownPlugin.push(import_vitepress_markdown_timeline.default);
   }
   return markdownPlugin;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sugarat/theme",
-  "version": "0.2.17",
+  "version": "0.2.18",
   "description": "简约风的 Vitepress 博客主题，sugarat vitepress blog theme",
   "author": "sugar",
   "license": "MIT",
@@ -42,6 +42,7 @@
     "gray-matter": "^4.0.3",
     "markdown-it-task-checkbox": "^1.0.6",
     "mermaid": "^10.2.4",
+    "vitepress-markdown-timeline": "^1.2.1",
     "vitepress-plugin-mermaid": "2.0.13",
     "vitepress-plugin-pagefind": "0.2.10",
     "vitepress-plugin-rss": "0.2.1",

package/src/components/BlogApp.vue

@@ -37,9 +37,9 @@ const { Layout } = Theme
       <!-- 阅读时间分析 -->
       <ClientOnly>
         <BlogArticleAnalyze />
+        <!-- 图片预览 -->
+        <BlogImagePreview />
       </ClientOnly>
-      <!-- 图片预览 -->
-      <BlogImagePreview />
     </template>
 
     <template #nav-bar-content-before>

package/src/components/BlogBackToTop.vue

@@ -28,8 +28,8 @@ const iconSVGStr = computed(() => typeof backToTopConfig === 'boolean' ? '' : ba
 
 <template>
   <div v-if="open" v-show="show" class="back-to-top">
-    <span class="icon-wrapper">
-      <ElIcon @click="handleBackRoTop">
+    <span class="icon-wrapper" @click="handleBackRoTop">
+      <ElIcon :size="20">
         <i v-if="iconSVGStr" v-outer-html="iconSVGStr" />
         <svg v-else width="512" height="512" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
           <path

package/src/components/BlogComment.vue

@@ -94,15 +94,15 @@ const labelText = computed(() => {
 
     <div v-show="!commentIsVisible" class="comment-btn-wrapper">
       <span v-if="!mobileMinify && labelText" class="icon-wrapper-text" @click="handleScrollToComment">
-        <ElIcon>
+        <ElIcon :size="20">
           <CommentIcon />
         </ElIcon>
         <span class="text">
           {{ labelText }}
         </span>
       </span>
-      <span v-else class="icon-wrapper">
-        <ElIcon @click="handleScrollToComment">
+      <span v-else class="icon-wrapper" @click="handleScrollToComment">
+        <ElIcon :size="20">
           <CommentIcon />
         </ElIcon>
       </span>

package/src/composables/config/index.ts

@@ -397,9 +397,19 @@ export namespace Theme {
     /**
      * 配置内置的 markdown-it-task-checkbox 插件，设置 false 则关闭
      * 详见 https://github.com/linsir/markdown-it-task-checkbox
+     * @default true
      */
     taskCheckbox?: TaskCheckbox | boolean
-
+    /**
+     * 支持 markdown 时间线语法，在 vitepress 中使用 markdown 渲染时间线（时间轴）样式。
+     * 详见 https://github.com/HanochMa/vitepress-markdown-timeline
+     * @default true
+     */
+    timeline?: boolean
+    /**
+     * 回到顶部
+     * @default true
+     */
     backToTop?: boolean | BackToTop
   }
 

package/src/index.ts

@@ -5,9 +5,13 @@ import './styles/index.scss'
 import 'element-plus/dist/index.css'
 import 'element-plus/theme-chalk/dark/css-vars.css'
 
+// 引入时间线组件样式
+import 'vitepress-markdown-timeline/dist/theme/index.css'
 import type { Theme } from 'vitepress'
 import DefaultTheme from 'vitepress/theme'
 import { enhanceAppWithTabs } from 'vitepress-plugin-tabs/client'
+
+// 图表渲染组件
 import Mermaid from 'vitepress-plugin-mermaid/Mermaid.vue'
 import BlogApp from './components/BlogApp.vue'
 import { withConfigProvider } from './composables/config/blog'
@@ -27,7 +31,7 @@ export const BlogTheme: Theme = {
     DefaultTheme.enhanceApp(ctx)
     ctx.app.component('TimelinePage', TimelinePage)
     ctx.app.component('UserWorksPage', UserWorksPage)
-    ctx.app.component('Mermaid', Mermaid)
+    ctx.app.component('Mermaid', Mermaid as any)
   }
 }
 

package/src/utils/node/mdPlugins.ts

@@ -2,6 +2,7 @@
 import { createRequire } from 'module'
 import { tabsMarkdownPlugin } from 'vitepress-plugin-tabs'
 import type { UserConfig } from 'vitepress'
+import timeline from 'vitepress-markdown-timeline'
 import type { Theme } from '../../composables/config/index'
 import { aliasObjectToArray } from './index'
 
@@ -17,25 +18,22 @@ export function getMarkdownPlugins(cfg?: Partial<Theme.BlogConfig>) {
   }
 
   // 添加mermaid markdown 插件
-  if (cfg) {
-    cfg.mermaid = cfg?.mermaid ?? true
-    if (cfg?.mermaid !== false) {
-      const { MermaidMarkdown } = _require('vitepress-plugin-mermaid')
-      markdownPlugin.push(MermaidMarkdown)
-    }
+  if (cfg?.mermaid !== false) {
+    const { MermaidMarkdown } = _require('vitepress-plugin-mermaid')
+    markdownPlugin.push(MermaidMarkdown)
   }
 
-  if (cfg) {
-    cfg.taskCheckbox = cfg?.taskCheckbox ?? true
-    if (cfg.taskCheckbox !== false) {
-      markdownPlugin.push(taskCheckboxPlugin(cfg.taskCheckbox))
-    }
+  if (cfg.taskCheckbox !== false) {
+    markdownPlugin.push(taskCheckboxPlugin(typeof cfg?.taskCheckbox === 'boolean' ? {} : cfg?.taskCheckbox))
   }
 
+  if (cfg?.timeline !== false) {
+    markdownPlugin.push(timeline)
+  }
   return markdownPlugin
 }
 
-export function taskCheckboxPlugin(ops: Theme.TaskCheckbox | boolean) {
+export function taskCheckboxPlugin(ops?: Theme.TaskCheckbox) {
   return (md: any) => {
     md.use(_require('markdown-it-task-checkbox'), ops)
   }