@sugarat/theme 0.5.14 → 0.5.16

package/node.d.ts

@@ -622,6 +622,24 @@ declare namespace Theme {
          * @default '🏷 标签'
          */
         title?: string;
+        /**
+         * 首页标签默认展示数量，超出部分折叠
+         * @default 999
+         */
+        limit?: number;
+        /**
+         * 标签排序方式
+         * desc: 降序
+         * asc: 升序
+         * normal: 不排序 (默认)
+         * @default 'normal'
+         */
+        sort?: 'desc' | 'asc' | 'normal';
+        /**
+         * 是否显示文章数量
+         * @default false
+         */
+        showCount?: boolean;
     }
 }
 

package/node.js

@@ -40,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.7.3_vitepress@2.0.0-alpha.15_@types+node@24.5.2_async-validator_f00dcfd3cc5e72074cf41a606f1d799c/node_modules/vitepress-plugin-tabs/dist/node/index.js
+// ../../node_modules/.pnpm/vitepress-plugin-tabs@0.7.3_vitepress@2.0.0-alpha.16_@types+node@24.5.2_async-validator@4.2.5_wszfouv2xxx6bizfwwcmbwut3e/node_modules/vitepress-plugin-tabs/dist/node/index.js
 function container_plugin(md, name, options) {
   function validateDefault(params) {
     return params.trim().split(" ", 2)[0] === name;
@@ -422,7 +422,8 @@ async function getArticleMeta(filepath, route, timeZone = defaultTimeZoneOffset,
   meta.tag = [meta.tag || []].flat().concat([
     .../* @__PURE__ */ new Set([...meta.categories || [], ...meta.tags || []])
   ]);
-  meta.description = meta.description || (0, import_theme_shared2.getTextSummary)(content, 100) || excerpt;
+  const contentWithoutHeadings = content.replace(/^#+\s+.*$/gm, "");
+  meta.description = meta.description || (0, import_theme_shared2.getTextSummary)(contentWithoutHeadings, 100) || excerpt;
   meta.cover = meta.cover ?? getFirstImagURLFromMD(fileContent, route);
   if (meta.publish === false) {
     meta.hidden = true;

package/node.mjs

@@ -9,7 +9,7 @@ var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require
 // src/utils/node/mdPlugins.ts
 import { createRequire } from "module";
 
-// ../../node_modules/.pnpm/vitepress-plugin-tabs@0.7.3_vitepress@2.0.0-alpha.15_@types+node@24.5.2_async-validator_f00dcfd3cc5e72074cf41a606f1d799c/node_modules/vitepress-plugin-tabs/dist/node/index.js
+// ../../node_modules/.pnpm/vitepress-plugin-tabs@0.7.3_vitepress@2.0.0-alpha.16_@types+node@24.5.2_async-validator@4.2.5_wszfouv2xxx6bizfwwcmbwut3e/node_modules/vitepress-plugin-tabs/dist/node/index.js
 function container_plugin(md, name, options) {
   function validateDefault(params) {
     return params.trim().split(" ", 2)[0] === name;
@@ -389,7 +389,8 @@ async function getArticleMeta(filepath, route, timeZone = defaultTimeZoneOffset,
   meta.tag = [meta.tag || []].flat().concat([
     .../* @__PURE__ */ new Set([...meta.categories || [], ...meta.tags || []])
   ]);
-  meta.description = meta.description || getTextSummary(content, 100) || excerpt;
+  const contentWithoutHeadings = content.replace(/^#+\s+.*$/gm, "");
+  meta.description = meta.description || getTextSummary(contentWithoutHeadings, 100) || excerpt;
   meta.cover = meta.cover ?? getFirstImagURLFromMD(fileContent, route);
   if (meta.publish === false) {
     meta.hidden = true;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sugarat/theme",
-  "version": "0.5.14",
+  "version": "0.5.16",
   "description": "简约风的 Vitepress 博客主题，sugarat vitepress blog theme",
   "author": "sugar",
   "license": "MIT",
@@ -51,11 +51,11 @@
     "vitepress-plugin-group-icons": "1.6.5",
     "vitepress-plugin-mermaid": "2.0.13",
     "vitepress-plugin-tabs": "0.7.3",
-    "vitepress-plugin-announcement": "0.1.7",
     "@sugarat/theme-shared": "0.0.7",
-    "vitepress-plugin-image-preview": "0.1.0",
-    "vitepress-plugin-rss": "0.4.2",
-    "vitepress-plugin-pagefind": "0.4.18"
+    "vitepress-plugin-image-preview": "0.1.1",
+    "vitepress-plugin-rss": "0.4.3",
+    "vitepress-plugin-pagefind": "0.4.19",
+    "vitepress-plugin-announcement": "0.1.7"
   },
   "devDependencies": {
     "artalk": "^2.8.5",
@@ -63,7 +63,7 @@
     "pagefind": "^1.3.0",
     "typescript": "^5.4.5",
     "vite": "^5.4.9",
-    "vitepress": "2.0.0-alpha.15",
+    "vitepress": "2.0.0-alpha.16",
     "vue": "^3.5.24",
     "vitepress-plugin-51la": "0.1.1"
   },

package/src/components/BlogHomeTags.vue

@@ -1,5 +1,5 @@
 <script lang="ts" setup>
-import { computed, watch } from 'vue'
+import { computed, ref, watch } from 'vue'
 import { useBrowserLocation, useUrlSearchParams } from '@vueuse/core'
 import { useRoute, useRouter } from 'vitepress'
 import {
@@ -19,9 +19,47 @@ const title = computed(() => (typeof homeTagsConfig.value === 'boolean' || !home
   ? `${tagsSvgStr}标签`
   : homeTagsConfig.value?.title
 )
-const tags = computed(() => {
-  return [...new Set(docs.value.map(v => v.meta.tag || []).flat(3))]
+
+// 统计每个标签的文章数量，并按数量降序排序
+const tagsWithCount = computed(() => {
+  const tagCountMap = new Map<string, number>()
+  docs.value.forEach((v) => {
+    const articleTags = v.meta.tag || []
+    const flatTags = Array.isArray(articleTags) ? articleTags.flat(3) : [articleTags]
+    flatTags.forEach((tag: string) => {
+      tagCountMap.set(tag, (tagCountMap.get(tag) || 0) + 1)
+    })
+  })
+  // 按文章数量降序排序
+  const data = [...tagCountMap.entries()]
+  const sort = (typeof homeTagsConfig.value === 'object' && homeTagsConfig.value?.sort) ? homeTagsConfig.value.sort : 'normal'
+  if (sort !== 'normal') {
+    data.sort((a, b) => {
+      return sort === 'asc' ? a[1] - b[1] : b[1] - a[1]
+    })
+  }
+  return data.map(([tag, count]) => ({ tag, count }))
+})
+
+// 折叠/展开功能，从配置中读取 limit，默认 10
+const limit = computed(() => {
+  if (typeof homeTagsConfig.value === 'object' && homeTagsConfig.value?.limit) {
+    return homeTagsConfig.value.limit
+  }
+  return 999
+})
+const isExpanded = ref(false)
+const displayTags = computed(() => {
+  if (isExpanded.value || tagsWithCount.value.length <= limit.value) {
+    return tagsWithCount.value
+  }
+  return tagsWithCount.value.slice(0, limit.value)
 })
+const hasMore = computed(() => tagsWithCount.value.length > limit.value)
+
+function toggleExpand() {
+  isExpanded.value = !isExpanded.value
+}
 
 const activeTag = useActiveTag()
 
@@ -78,7 +116,7 @@ watch(
 </script>
 
 <template>
-  <div v-if="showTags && tags.length" class="card tags" data-pagefind-ignore="all">
+  <div v-if="showTags && tagsWithCount.length" class="card tags" data-pagefind-ignore="all">
     <!-- 头部 -->
     <div class="card-header">
       <span class="title svg-icon" v-html="title" />
@@ -91,15 +129,33 @@ watch(
     </div>
     <!-- 标签列表 -->
     <ul class="tag-list">
-      <li v-for="(tag, idx) in tags" :key="tag">
+      <li v-for="(item, idx) in displayTags" :key="item.tag">
         <Tag
           :type="tagType[idx % tagType.length] || 'primary'"
-          @click="handleTagClick(tag, tagType[idx % tagType.length])"
+          @click="handleTagClick(item.tag, tagType[idx % tagType.length])"
         >
-          {{ tag }}
+          {{ item.tag }}
+          <span v-if="typeof homeTagsConfig === 'object' && homeTagsConfig?.showCount" class="tag-count">{{ item.count }}</span>
         </Tag>
       </li>
     </ul>
+    <!-- 展开/收起按钮 -->
+    <div v-if="hasMore" class="expand-btn" @click="toggleExpand">
+      <span>{{ isExpanded ? '收起' : `展开全部 ${tagsWithCount.length} 个标签` }}</span>
+      <svg
+        class="expand-icon"
+        :class="{ 'is-expanded': isExpanded }"
+        viewBox="0 0 1024 1024"
+        xmlns="http://www.w3.org/2000/svg"
+        width="1em"
+        height="1em"
+      >
+        <path
+          fill="currentColor"
+          d="M488.832 344.32l-339.84 356.672a32 32 0 0 0 0 44.16l.384.384a29.44 29.44 0 0 0 42.688 0l320-335.872 319.872 335.872a29.44 29.44 0 0 0 42.688 0l.384-.384a32 32 0 0 0 0-44.16L535.168 344.32a32 32 0 0 0-46.336 0z"
+        />
+      </svg>
+    </div>
   </div>
 </template>
 
@@ -147,4 +203,43 @@ watch(
   margin-bottom: 10px;
   cursor: pointer;
 }
+
+.tag-count {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  margin-left: 4px;
+  min-width: 16px;
+  height: 16px;
+  padding: 0 4px;
+  font-size: 10px;
+  line-height: 1;
+  border-radius: 8px;
+  background-color: rgba(255, 255, 255, 0.3);
+}
+
+.expand-btn {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 4px;
+  margin-top: 6px;
+  padding: 4px 0;
+  font-size: 12px;
+  color: var(--vp-c-text-2);
+  cursor: pointer;
+  transition: color 0.3s;
+  user-select: none;
+}
+.expand-btn:hover {
+  color: var(--vp-c-brand);
+}
+
+.expand-icon {
+  transition: transform 0.3s;
+  transform: rotate(180deg);
+}
+.expand-icon.is-expanded {
+  transform: rotate(0deg);
+}
 </style>

package/src/composables/config/index.ts

@@ -659,5 +659,23 @@ export namespace Theme {
      * @default '🏷 标签'
      */
     title?: string
+    /**
+     * 首页标签默认展示数量，超出部分折叠
+     * @default 999
+     */
+    limit?: number
+    /**
+     * 标签排序方式
+     * desc: 降序
+     * asc: 升序
+     * normal: 不排序 (默认)
+     * @default 'normal'
+     */
+    sort?: 'desc' | 'asc' | 'normal'
+    /**
+     * 是否显示文章数量
+     * @default false
+     */
+    showCount?: boolean
   }
 }

package/src/utils/node/theme.ts

@@ -66,8 +66,10 @@ export async function getArticleMeta(filepath: string, route: string, timeZone =
 
   // 获取摘要信息
   // TODO：摘要生成优化，支持AI？
+  // 先去除 Markdown 中的标题行（# 开头），避免 description 中重复出现标题文字
+  const contentWithoutHeadings = content.replace(/^#+\s+.*$/gm, '')
   meta.description
-    = meta.description || getTextSummary(content, 100) || excerpt
+    = meta.description || getTextSummary(contentWithoutHeadings, 100) || excerpt
 
   // 获取封面图
   // TODO: 耦合信息优化