@sugarat/theme 0.2.27 → 0.2.29

package/node.d.ts

@@ -412,11 +412,24 @@ declare namespace Theme {
         liClass?: string;
     }
     type RSSOptions = RSSPluginOptions;
+    interface FooterItem {
+        text: string;
+        link?: string;
+        icon?: boolean | string;
+    }
     interface Footer {
         /**
-         * 自定义补充信息（支持配置为HTML）
+         * 自定义补充信息（支持配置为HTML），在内置的 footer 上方
          */
         message?: string | string[];
+        /**
+         * 自定义补充信息（支持配置为HTML），在内置的 footer 下方
+         */
+        bottomMessage?: string | string[];
+        /**
+         * 自定义补充信息（支持配置为HTML），紧随内置的后方
+         */
+        list?: string | string[] | FooterItem | FooterItem[];
         /**
          * 是否展示主题版本信息
          */
@@ -468,4 +481,6 @@ declare function getThemeConfig(cfg?: Partial<Theme.BlogConfig>): any;
  */
 declare function defineConfig(config: UserConfig<Theme.Config>): any;
 
-export { defineConfig, getThemeConfig };
+declare function footerHTML(footerData: Theme.FooterItem | Theme.FooterItem[]): string;
+
+export { defineConfig, footerHTML, getThemeConfig };

package/node.js

@@ -31,6 +31,7 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 var node_exports = {};
 __export(node_exports, {
   defineConfig: () => defineConfig,
+  footerHTML: () => footerHTML,
   getThemeConfig: () => getThemeConfig,
   tabsMarkdownPlugin: () => tabsPlugin
 });
@@ -39,7 +40,7 @@ module.exports = __toCommonJS(node_exports);
 // src/utils/node/mdPlugins.ts
 var import_module = require("module");
 
-// ../../node_modules/.pnpm/vitepress-plugin-tabs@0.2.0_vitepress@1.0.0-rc.45_vue@3.4.21/node_modules/vitepress-plugin-tabs/dist/index.js
+// ../../node_modules/.pnpm/vitepress-plugin-tabs@0.2.0_vitepress@1.0.1_vue@3.4.21/node_modules/vitepress-plugin-tabs/dist/index.js
 var tabsMarker = "=tabs";
 var tabsMarkerLen = tabsMarker.length;
 var ruleBlockTabs = (state, startLine, endLine, silent) => {
@@ -588,9 +589,20 @@ function getThemeConfig(cfg) {
 function defineConfig(config) {
   return config;
 }
+function footerHTML(footerData) {
+  const data = [footerData || []].flat();
+  return data.map((d) => {
+    const { icon, text, link } = d;
+    return `<span class="footer-item">
+    ${icon ? `<i>${icon}</i>` : ""}
+    ${link ? `<a href="${link}" target="_blank" rel="noopener noreferrer">${text}</a>` : `<span>${text}</span>`}
+</span>`;
+  }).join("");
+}
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   defineConfig,
+  footerHTML,
   getThemeConfig,
   tabsMarkdownPlugin
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sugarat/theme",
-  "version": "0.2.27",
+  "version": "0.2.29",
   "description": "简约风的 Vitepress 博客主题，sugarat vitepress blog theme",
   "author": "sugar",
   "license": "MIT",
@@ -42,7 +42,7 @@
     "gray-matter": "^4.0.3",
     "markdown-it-task-checkbox": "^1.0.6",
     "mermaid": "^10.2.4",
-    "oh-my-live2d": "^0.10.0",
+    "oh-my-live2d": "^0.13.0",
     "swiper": "^11.0.5",
     "vitepress-markdown-timeline": "^1.2.1",
     "vitepress-plugin-mermaid": "2.0.13",
@@ -57,7 +57,7 @@
     "pagefind": "1.0.3",
     "sass": "^1.56.1",
     "typescript": "^4.8.2",
-    "vitepress": "1.0.0-rc.45",
+    "vitepress": "1.0.1",
     "vue": "^3.4.21"
   },
   "scripts": {

package/src/components/BlogFooter.vue

@@ -3,6 +3,7 @@ import { computed } from 'vue'
 import { useHomeFooterConfig } from '../composables/config/blog'
 import packageJSON from '../../package.json'
 import { copyrightSVG, icpSVG, themeSVG } from '../constants/svg'
+import { vOuterHtml } from '../directives'
 
 const footerData = useHomeFooterConfig()
 
@@ -12,14 +13,15 @@ const renderData = computed(() => {
   }
   const flatData = [footerData].flat()
   return flatData.flat().map((footer, idx) => {
-    const { icpRecord, securityRecord, copyright, version, message } = footer
-    const data: {
+    const { icpRecord, securityRecord, copyright, version, message, bottomMessage, list } = footer
+    const data: ({
       name: string
       link?: string
       icon?: string | boolean
-    }[] = []
+    } | string) [] = []
     // message
-    const messageData: string[] = [message || []].flat()
+    const messageData = [message || []].flat()
+    const bottomMessageData = [bottomMessage || []].flat()
 
     // version
     const isLast = idx === flatData.length - 1
@@ -58,9 +60,23 @@ const renderData = computed(() => {
         ...securityRecord
       })
     }
+    if (list) {
+      const listData = [list || []].flat()
+      data.push(...listData.map((v) => {
+        if (typeof v === 'string') {
+          return v
+        }
+        return {
+          name: v.text,
+          icon: v.icon,
+          link: v.link
+        }
+      }))
+    }
     return {
       data,
-      messageData
+      messageData,
+      bottomMessageData
     }
   })
 })
@@ -70,20 +86,27 @@ const renderData = computed(() => {
   <footer v-if="renderData.length" class="blog-footer">
     <!-- eslint-disable vue/require-v-for-key -->
     <!-- see https://cn.vuejs.org/guide/essentials/list.html#v-for-on-template -->
-    <template v-for="({ data, messageData }) in renderData">
+    <template v-for="({ data, messageData, bottomMessageData }) in renderData">
+      <!-- 在内置footer上方渲染 -->
       <p v-for="message in messageData" v-html="message" />
+      <!-- 内置的列表 -->
       <p class="footer-item-list">
-        <span v-for="item in data" class="footer-item">
-          <i v-if="item.icon === 'security'">
-            <img src="./../styles/gongan.png" alt="公网安备">
-          </i>
-          <i v-else-if="item.icon" v-html="item.icon" />
-          <a v-if="item.link" :href="item.link" target="_blank" rel="noopener noreferrer">
-            {{ item.name }}
-          </a>
-          <span v-else>{{ item.name }}</span>
-        </span>
+        <template v-for="item in data">
+          <span v-if="typeof item !== 'string'" class="footer-item">
+            <i v-if="item.icon === 'security'">
+              <img src="./../styles/gongan.png" alt="公网安备">
+            </i>
+            <i v-else-if="item.icon" v-html="item.icon" />
+            <a v-if="item.link" :href="item.link" target="_blank" rel="noopener noreferrer">
+              {{ item.name }}
+            </a>
+            <span v-else>{{ item.name }}</span>
+          </span>
+          <span v-else v-outer-html="item" />
+        </template>
       </p>
+      <!-- 在内置的footer下方渲染 -->
+      <p v-for="message in bottomMessageData" v-html="message" />
     </template>
   </footer>
 </template>
@@ -124,6 +147,7 @@ footer.blog-footer {
 
   i {
     margin-right: 4px;
+    font-style: normal;
   }
 
   i :deep(svg) {

package/src/components/BlogHotArticle.vue

@@ -2,8 +2,8 @@
 import { computed, ref } from 'vue'
 import { ElButton, ElLink } from 'element-plus'
 import { withBase } from 'vitepress'
-import { useArticles, useBlogConfig } from '../composables/config/blog'
-import { formatShowDate } from '../utils/client'
+import { useArticles, useBlogConfig, useCleanUrls } from '../composables/config/blog'
+import { formatShowDate, wrapperCleanUrls } from '../utils/client'
 import { fireSVG } from '../constants/svg'
 
 const { hotArticle } = useBlogConfig()
@@ -27,10 +27,14 @@ function changePage() {
   currentPage.value = newIdx + 1
 }
 
+const cleanUrls = useCleanUrls()
 const currentWikiData = computed(() => {
   const startIdx = (currentPage.value - 1) * pageSize.value
   const endIdx = startIdx + pageSize.value
-  return recommendList.value.slice(startIdx, endIdx)
+  return recommendList.value.slice(startIdx, endIdx).map(v => ({
+    ...v,
+    route: wrapperCleanUrls(cleanUrls, v.route)
+  }))
 })
 
 const showChangeBtn = computed(() => {

package/src/components/BlogItem.vue

@@ -2,7 +2,8 @@
 import { withBase } from 'vitepress'
 import { computed } from 'vue'
 import { useWindowSize } from '@vueuse/core'
-import { formatShowDate } from '../utils/client'
+import { formatShowDate, wrapperCleanUrls } from '../utils/client'
+import { useCleanUrls } from '../composables/config/blog'
 
 const props = defineProps<{
   route: string
@@ -22,22 +23,12 @@ const showTime = computed(() => {
   return formatShowDate(props.date)
 })
 
-// function isWrappedWithPreventDefault(element: HTMLElement) {
-//   let parent = element.parentElement
-
-//   while (parent) {
-//     if (parent.hasAttribute('preventDefault')) {
-//       return true
-//     }
-//     parent = parent.parentElement
-//   }
-
-//   return false
-// }
+const cleanUrls = useCleanUrls()
+const link = computed(() => withBase(wrapperCleanUrls(!!cleanUrls, props.route)))
 </script>
 
 <template>
-  <a class="blog-item" :href="withBase(route)">
+  <a class="blog-item" :href="link">
     <i v-if="!!pin" class="pin" />
     <!-- 标题 -->
     <p v-if="inMobile" class="title">{{ title }}</p>

package/src/components/BlogRecommendArticle.vue

@@ -2,8 +2,8 @@
 import { computed, onMounted, ref } from 'vue'
 import { useRoute, withBase } from 'vitepress'
 import { ElButton, ElLink } from 'element-plus'
-import { formatShowDate } from '../utils/client'
-import { useArticles, useBlogConfig } from '../composables/config/blog'
+import { formatShowDate, wrapperCleanUrls } from '../utils/client'
+import { useArticles, useBlogConfig, useCleanUrls } from '../composables/config/blog'
 import { recommendSVG } from '../constants/svg'
 import type { Theme } from '../composables/config/index'
 
@@ -145,6 +145,8 @@ onMounted(() => {
   const currentPageNum = Math.floor(currentPageIndex / pageSize.value) + 1
   currentPage.value = currentPageNum
 })
+
+const cleanUrls = useCleanUrls()
 </script>
 
 <template>
@@ -170,7 +172,7 @@ onMounted(() => {
           <ElLink
             type="info" class="title" :class="{
               current: isCurrentDoc(v.route),
-            }" :href="v.route"
+            }" :href="wrapperCleanUrls(cleanUrls, v.route)"
           >
             {{ v.meta.title }}
           </ElLink>

package/src/composables/config/blog.ts

@@ -225,3 +225,8 @@ export function useHomeFooterConfig() {
 export function useBackToTopConfig() {
   return useBlogConfig().backToTop
 }
+
+export function useCleanUrls() {
+  const { site } = useData()
+  return !!site.value.cleanUrls
+}

package/src/composables/config/index.ts

@@ -450,11 +450,25 @@ export namespace Theme {
 
   export type RSSOptions = RSSPluginOptions
 
+  export interface FooterItem {
+    text: string
+    link?: string
+    icon?: boolean | string
+  }
+
   export interface Footer {
     /**
-     * 自定义补充信息（支持配置为HTML）
+     * 自定义补充信息（支持配置为HTML），在内置的 footer 上方
      */
     message?: string | string[]
+    /**
+     * 自定义补充信息（支持配置为HTML），在内置的 footer 下方
+     */
+    bottomMessage?: string | string[]
+    /**
+     * 自定义补充信息（支持配置为HTML），紧随内置的后方
+     */
+    list?: string | string[] | FooterItem | FooterItem[]
     /**
      * 是否展示主题版本信息
      */

package/src/index.ts

@@ -31,7 +31,9 @@ export const BlogTheme: Theme = {
     DefaultTheme.enhanceApp(ctx)
     ctx.app.component('TimelinePage', TimelinePage)
     ctx.app.component('UserWorksPage', UserWorksPage)
-    ctx.app.component('Mermaid', Mermaid as any)
+    if (!ctx.app.component('Mermaid')) {
+      ctx.app.component('Mermaid', Mermaid as any)
+    }
   }
 }
 

package/src/node.ts

@@ -56,3 +56,15 @@ export function defineConfig(config: UserConfig<Theme.Config>): any {
 
 // 重新导包 tabsMarkdownPlugin 导出CJS格式支持
 export { tabsMarkdownPlugin } from 'vitepress-plugin-tabs'
+
+export function footerHTML(footerData: Theme.FooterItem | Theme.FooterItem[]) {
+  const data = [footerData || []].flat()
+  return data.map((d) => {
+    const { icon, text, link } = d
+
+    return `<span class="footer-item">
+    ${icon ? `<i>${icon}</i>` : ''}
+    ${link ? `<a href="${link}" target="_blank" rel="noopener noreferrer">${text}</a>` : `<span>${text}</span>`}
+</span>`
+  }).join('')
+}

package/src/utils/client/index.ts

@@ -172,3 +172,8 @@ export function getImageUrl(
   } // 如果 ThemeableImage 类型不是上述情况，则返回空字符串
   return ''
 }
+
+export function wrapperCleanUrls(cleanUrls: boolean, route: string) {
+  const tempUrl = route.replace(/\.html$/, '')
+  return cleanUrls ? tempUrl : `${tempUrl}.html`
+}