vitepress-theme-element-plus 1.3.0 → 1.3.2

package/client/utils/client/outline.ts

@@ -1,126 +1,133 @@
-import type { Header } from 'vitepress'
-import type { DefaultTheme } from 'vitepress/theme'
-
-const ignoreRE = /\b(?:VPBadge|header-anchor|footnote-ref|ignore-header)\b/
-
-// cached list of anchor elements from resolveHeaders
-const resolvedHeaders: { element: HTMLHeadElement, link: string }[] = []
-
-export type MenuItem = Omit<Header, 'slug' | 'children'> & {
-  element: HTMLHeadElement
-  titleTags: string[]
-  children?: MenuItem[]
-}
-
-export function resolveTitle(theme: DefaultTheme.Config): string {
-  return (
-    (typeof theme.outline === 'object'
-      && !Array.isArray(theme.outline)
-      && theme.outline.label)
-    || theme.outlineTitle
-    || 'On this page'
-  )
-}
-
-export function getHeaders(range: DefaultTheme.Config['outline']): MenuItem[] {
-  const headers = Array.from(document.querySelectorAll('.VPDoc :where(h1,h2,h3,h4,h5,h6)'))
-    .filter(el => el.id && el.hasChildNodes())
-    .map((el) => {
-      const level = Number(el.tagName[1])
-      const { text, tags } = serializeHeader(el)
-      return {
-        element: el as HTMLHeadElement,
-        title: text,
-        titleTags: tags,
-        link: `#${el.id}`,
-        level,
-      }
-    })
-
-  return resolveHeaders(headers, range)
-}
-
-function serializeHeader(h: Element): { text: string, tags: string[] } {
-  let text = ''
-  const tags: string[] = []
-  for (const node of Array.from(h.childNodes)) {
-    if (node.nodeType === 1) {
-      const element = node as HTMLElement
-      if (ignoreRE.test(element.className))
-        continue
-      if (element.classList.contains('el-tag') || element.classList.contains('vp-tag')) {
-        tags.push(element.outerHTML)
-        continue
-      }
-      text += element.textContent ?? ''
-    }
-    else if (node.nodeType === 3) {
-      const value = node.textContent ?? ''
-      text += value
-    }
-  }
-  return {
-    text: text.trim(),
-    tags,
-  }
-}
-
-export function resolveHeaders(
-  headers: MenuItem[],
-  range?: DefaultTheme.Config['outline'],
-): MenuItem[] {
-  if (range === false) {
-    return []
-  }
-
-  const levelsRange
-    = (typeof range === 'object' && !Array.isArray(range)
-      ? range.level
-      : range) || 2
-
-  const [high, low]: [number, number]
-    = typeof levelsRange === 'number'
-      ? [levelsRange, levelsRange]
-      : levelsRange === 'deep'
-        ? [2, 6]
-        : levelsRange
-
-  return buildTree(headers, high, low)
-}
-
-function buildTree(data: MenuItem[], min: number, max: number): MenuItem[] {
-  resolvedHeaders.length = 0
-
-  const result: MenuItem[] = []
-  const stack: (MenuItem | { level: number, shouldIgnore: true })[] = []
-
-  data.forEach((item) => {
-    const node = { ...item, children: [] }
-    let parent = stack[stack.length - 1]
-
-    while (parent && parent.level >= node.level) {
-      stack.pop()
-      parent = stack[stack.length - 1]
-    }
-
-    if (
-      node.element.classList.contains('ignore-header')
-      || (parent && 'shouldIgnore' in parent)
-    ) {
-      stack.push({ level: node.level, shouldIgnore: true })
-      return
-    }
-
-    if (node.level > max || node.level < min)
-      return
-    resolvedHeaders.push({ element: node.element, link: node.link })
-
-    if (parent)
-      (parent as MenuItem).children.push(node)
-    else result.push(node)
-
-    stack.push(node)
-  })
-
-  return result
-}
+import type { Header } from 'vitepress'
+import type { DefaultTheme } from 'vitepress/theme'
+
+const ignoreRE = /\b(?:VPBadge|header-anchor|footnote-ref|ignore-header)\b/
+
+// cached list of anchor elements from resolveHeaders
+const resolvedHeaders: { element: HTMLHeadElement, link: string }[] = []
+
+export type MenuItem = Omit<Header, 'slug' | 'children'> & {
+  element: HTMLHeadElement
+  titleTags: string[]
+  children?: MenuItem[]
+}
+
+export function resolveTitle(theme: DefaultTheme.Config): string {
+  return (
+    (typeof theme.outline === 'object'
+      && !Array.isArray(theme.outline)
+      && theme.outline.label)
+    || theme.outlineTitle
+    || 'On this page'
+  )
+}
+
+export function getHeaders(range: DefaultTheme.Config['outline']): MenuItem[] {
+  const headers = Array.from(document.querySelectorAll('.VPDoc :where(h1,h2,h3,h4,h5,h6)'))
+    .filter(el => el.id && el.hasChildNodes())
+    .map((el) => {
+      const level = Number(el.tagName[1])
+      const { text, tags } = serializeHeader(el)
+      return {
+        element: el as HTMLHeadElement,
+        title: text,
+        titleTags: tags,
+        link: `#${el.id}`,
+        level,
+      }
+    })
+
+  return resolveHeaders(headers, range)
+}
+
+function serializeHeader(h: Element): { text: string, tags: string[] } {
+  let text = ''
+  const tags: string[] = []
+  for (const node of Array.from(h.childNodes)) {
+    if (node.nodeType === 1) {
+      const element = node as HTMLElement
+      if (ignoreRE.test(element.className))
+        continue
+      if (element.classList.contains('el-tag') || element.classList.contains('vp-tag')) {
+        const cloned = element.cloneNode(true) as HTMLElement
+        const transitionClassRE = /(?:^|-)enter-(?:active|from|to)$|(?:^|-)leave-(?:active|from|to)$/
+        for (const cls of Array.from(cloned.classList)) {
+          if (transitionClassRE.test(cls) || cls.startsWith('el-zoom-in-center-')) {
+            cloned.classList.remove(cls)
+          }
+        }
+        tags.push(cloned.outerHTML)
+        continue
+      }
+      text += element.textContent ?? ''
+    }
+    else if (node.nodeType === 3) {
+      const value = node.textContent ?? ''
+      text += value
+    }
+  }
+  return {
+    text: text.trim(),
+    tags,
+  }
+}
+
+export function resolveHeaders(
+  headers: MenuItem[],
+  range?: DefaultTheme.Config['outline'],
+): MenuItem[] {
+  if (range === false) {
+    return []
+  }
+
+  const levelsRange
+    = (typeof range === 'object' && !Array.isArray(range)
+      ? range.level
+      : range) || 2
+
+  const [high, low]: [number, number]
+    = typeof levelsRange === 'number'
+      ? [levelsRange, levelsRange]
+      : levelsRange === 'deep'
+        ? [2, 6]
+        : levelsRange
+
+  return buildTree(headers, high, low)
+}
+
+function buildTree(data: MenuItem[], min: number, max: number): MenuItem[] {
+  resolvedHeaders.length = 0
+
+  const result: MenuItem[] = []
+  const stack: (MenuItem | { level: number, shouldIgnore: true })[] = []
+
+  data.forEach((item) => {
+    const node = { ...item, children: [] }
+    let parent = stack[stack.length - 1]
+
+    while (parent && parent.level >= node.level) {
+      stack.pop()
+      parent = stack[stack.length - 1]
+    }
+
+    if (
+      node.element.classList.contains('ignore-header')
+      || (parent && 'shouldIgnore' in parent)
+    ) {
+      stack.push({ level: node.level, shouldIgnore: true })
+      return
+    }
+
+    if (node.level > max || node.level < min)
+      return
+    resolvedHeaders.push({ element: node.element, link: node.link })
+
+    if (parent)
+      (parent as MenuItem).children.push(node)
+    else result.push(node)
+
+    stack.push(node)
+  })
+
+  return result
+}

package/client/utils/common.ts

@@ -1,90 +1,90 @@
-const HASH_RE = /#.*$/
-const HASH_OR_QUERY_RE = /[?#].*$/
-const INDEX_OR_EXT_RE = /(?:(^|\/)index)?\.(?:md|html)$/
-
-export const inBrowser = typeof document !== 'undefined'
-
-export function isActive(
-  currentPath: string,
-  matchPath?: string,
-  asRegex: boolean = false,
-): boolean {
-  if (matchPath === undefined) {
-    return false
-  }
-
-  currentPath = normalize(`/${currentPath}`)
-
-  if (asRegex) {
-    return new RegExp(matchPath).test(currentPath)
-  }
-
-  if (normalize(matchPath) !== currentPath) {
-    return false
-  }
-
-  const hashMatch = matchPath.match(HASH_RE)
-
-  if (hashMatch) {
-    return (inBrowser ? location.hash : '') === hashMatch[0]
-  }
-
-  return true
-}
-
-function normalize(path: string): string {
-  return decodeURI(path)
-    .replace(HASH_OR_QUERY_RE, '')
-    .replace(INDEX_OR_EXT_RE, '$1')
-}
-
-export function ensureStartingSlash(path: string): string {
-  return /^\//.test(path) ? path : `/${path}`
-}
-
-export function isPlainObject(obj: any) {
-  // 首先排除 null 和非对象类型
-  if (obj === null || typeof obj !== 'object') {
-    return false
-  }
-
-  // 检查对象的构造函数是否是 Object
-  if (obj.constructor !== Object) {
-    return false
-  }
-
-  // 检查对象的原型是否是 Object.prototype
-  if (Object.getPrototypeOf(obj) !== Object.prototype) {
-    return false
-  }
-
-  return true
-}
-
-export function isString(value) {
-  return typeof value === 'string'
-}
-
-export function capitalizeFirstLetter(string: string) {
-  if (!string)
-    return '' // 如果字符串为空，返回空字符串
-  return string.charAt(0).toUpperCase() + string.slice(1)
-}
-
-export function throttleAndDebounce(fn: () => void, delay: number): () => void {
-  let timeoutId: NodeJS.Timeout
-  let called = false
-
-  return () => {
-    if (timeoutId)
-      clearTimeout(timeoutId)
-
-    if (!called) {
-      fn()
-      ;(called = true) && setTimeout(() => (called = false), delay)
-    }
-    else {
-      timeoutId = setTimeout(fn, delay)
-    }
-  }
-}
+const HASH_RE = /#.*$/
+const HASH_OR_QUERY_RE = /[?#].*$/
+const INDEX_OR_EXT_RE = /(?:(^|\/)index)?\.(?:md|html)$/
+
+export const inBrowser = typeof document !== 'undefined'
+
+export function isActive(
+  currentPath: string,
+  matchPath?: string,
+  asRegex: boolean = false,
+): boolean {
+  if (matchPath === undefined) {
+    return false
+  }
+
+  currentPath = normalize(`/${currentPath}`)
+
+  if (asRegex) {
+    return new RegExp(matchPath).test(currentPath)
+  }
+
+  if (normalize(matchPath) !== currentPath) {
+    return false
+  }
+
+  const hashMatch = matchPath.match(HASH_RE)
+
+  if (hashMatch) {
+    return (inBrowser ? location.hash : '') === hashMatch[0]
+  }
+
+  return true
+}
+
+function normalize(path: string): string {
+  return decodeURI(path)
+    .replace(HASH_OR_QUERY_RE, '')
+    .replace(INDEX_OR_EXT_RE, '$1')
+}
+
+export function ensureStartingSlash(path: string): string {
+  return /^\//.test(path) ? path : `/${path}`
+}
+
+export function isPlainObject(obj: any) {
+  // 首先排除 null 和非对象类型
+  if (obj === null || typeof obj !== 'object') {
+    return false
+  }
+
+  // 检查对象的构造函数是否是 Object
+  if (obj.constructor !== Object) {
+    return false
+  }
+
+  // 检查对象的原型是否是 Object.prototype
+  if (Object.getPrototypeOf(obj) !== Object.prototype) {
+    return false
+  }
+
+  return true
+}
+
+export function isString(value) {
+  return typeof value === 'string'
+}
+
+export function capitalizeFirstLetter(string: string) {
+  if (!string)
+    return '' // 如果字符串为空，返回空字符串
+  return string.charAt(0).toUpperCase() + string.slice(1)
+}
+
+export function throttleAndDebounce(fn: () => void, delay: number): () => void {
+  let timeoutId: NodeJS.Timeout
+  let called = false
+
+  return () => {
+    if (timeoutId)
+      clearTimeout(timeoutId)
+
+    if (!called) {
+      fn()
+      ;(called = true) && setTimeout(() => (called = false), delay)
+    }
+    else {
+      timeoutId = setTimeout(fn, delay)
+    }
+  }
+}

package/index.ts

@@ -1,45 +1,45 @@
-import type { DefaultTheme, Theme } from 'vitepress'
-import VPTheme from 'vitepress/theme'
-import Layout from './client/components/Layout.vue'
-import 'element-plus/theme-chalk/base.css'
-import 'element-plus/theme-chalk/el-tag.css'
-import 'element-plus/theme-chalk/dark/css-vars.css'
-import './styles/index.scss'
-import './styles/base.scss'
-import './styles/code.scss'
-import './styles/doc-content.scss'
-import './styles/tag-content.scss'
-
-const EPTheme: Theme = {
-  extends: VPTheme,
-  Layout,
-}
-// #region snippet
-export interface FooterBlogrollLink {
-  text: string
-  link: string
-}
-
-export interface FooterBlogrollSection {
-  title: string
-  children: FooterBlogrollLink[]
-}
-
-export interface EPThemeFooter extends DefaultTheme.Footer {
-  /**
-   * 友情链接配置
-   */
-  blogroll?: FooterBlogrollSection[]
-}
-
-export interface EPThemeConfig extends DefaultTheme.Config {
-  /**
-   * 文档版本号
-   */
-  version?: string
-  footer?: EPThemeFooter
-}
-// #endregion snippet
-
-export { Layout }
-export default EPTheme
+import type { DefaultTheme, Theme } from 'vitepress'
+import VPTheme from 'vitepress/theme'
+import Layout from './client/components/Layout.vue'
+import 'element-plus/theme-chalk/base.css'
+import 'element-plus/theme-chalk/el-tag.css'
+import 'element-plus/theme-chalk/dark/css-vars.css'
+import './styles/index.scss'
+import './styles/base.scss'
+import './styles/code.scss'
+import './styles/doc-content.scss'
+import './styles/tag-content.scss'
+
+const EPTheme: Theme = {
+  extends: VPTheme,
+  Layout,
+}
+// #region snippet
+export interface FooterBlogrollLink {
+  text: string
+  link: string
+}
+
+export interface FooterBlogrollSection {
+  title: string
+  children: FooterBlogrollLink[]
+}
+
+export interface EPThemeFooter extends DefaultTheme.Footer {
+  /**
+   * 友情链接配置
+   */
+  blogroll?: FooterBlogrollSection[]
+}
+
+export interface EPThemeConfig extends DefaultTheme.Config {
+  /**
+   * 文档版本号
+   */
+  version?: string
+  footer?: EPThemeFooter
+}
+// #endregion snippet
+
+export { Layout }
+export default EPTheme

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "vitepress-theme-element-plus",
   "type": "module",
-  "version": "1.3.0",
+  "version": "1.3.2",
   "description": "A VitePress theme for Element Plus",
   "author": "Hezhengxu",
   "license": "MIT",
@@ -35,7 +35,7 @@
     "styles"
   ],
   "peerDependencies": {
-    "vitepress": "2.0.0-alpha.12"
+    "vitepress": "^2.0.0-alpha.12"
   },
   "dependencies": {
     "@iconify/vue": "^4"

package/shared/constants.ts

@@ -1,3 +1,3 @@
-export const NOT_ARTICLE_LAYOUTS = ['blog', 'tags', 'categorys', 'projects', 'home', 'page']
-
-export const DEFAULT_PAGE_SIZE = 5
+export const NOT_ARTICLE_LAYOUTS = ['blog', 'tags', 'categorys', 'projects', 'home', 'page']
+
+export const DEFAULT_PAGE_SIZE = 5