valaxy 0.19.1 → 0.19.3

package/client/App.vue

@@ -1,97 +1,3 @@
-<script setup lang="ts">
-import { computed } from 'vue'
-import { useHead, useSeoMeta } from '@unhead/vue'
-
-// @ts-expect-error virtual module
-import ValaxyUserApp from '/@valaxyjs/UserAppVue'
-
-// @ts-expect-error virtual module
-import ValaxyThemeApp from '/@valaxyjs/ThemeAppVue'
-import pkg from 'valaxy/package.json'
-import { useI18n } from 'vue-i18n'
-import { definePerson, defineWebPage, defineWebSite, useSchemaOrg } from '@unhead/schema-org'
-
-// https://github.com/vueuse/head
-// you can use this to manipulate the document head in any components,
-// they will be rendered correctly in the html results with vite-ssg
-import { useSiteConfig } from './config'
-import ValaxyAddons from './components/ValaxyAddons.vue'
-import { useFrontmatter } from './composables'
-
-// <link rel="apple-touch-icon" href="/pwa-192x192.png">
-// <link rel="mask-icon" href="/safari-pinned-tab.svg" color="#00aba9">
-
-const siteConfig = useSiteConfig()
-// todo, allow user config
-const fm = useFrontmatter()
-
-const { locale } = useI18n()
-
-const title = computed(() => fm.value[`title_${locale.value}`] || fm.value.title)
-useHead({
-  title,
-  titleTemplate: computed(() => fm.value.titleTemplate || ((title: string) => title ? `${title} - ${siteConfig.value.title}` : siteConfig.value.title)),
-  link: [
-    {
-      rel: 'icon',
-      href: siteConfig.value.favicon,
-      type: siteConfig.value.favicon?.endsWith('svg') ? 'image/svg+xml' : 'image/png',
-    },
-  ],
-  meta: [
-    { name: 'description', content: computed(() => siteConfig.value.description) },
-    {
-      name: 'generator',
-      content: `Valaxy ${pkg.version}`,
-    },
-  ],
-
-  templateParams: {
-    schemaOrg: {
-      host: siteConfig.value.url,
-    },
-  },
-})
-
-// seo
-// todo: get first image url from markdown
-const siteUrl = computed(() => fm.value.url || siteConfig.value.url)
-const description = computed(() => fm.value.excerpt || fm.value.description || siteConfig.value.description)
-
-useSeoMeta({
-  description,
-  ogDescription: description,
-  ogLocale: computed(() => locale.value || fm.value.lang || siteConfig.value.lang || 'en'),
-  ogLocaleAlternate: computed(() => siteConfig.value.languages.filter(l => l !== locale.value)),
-  ogSiteName: computed(() => siteConfig.value.title),
-  ogTitle: computed(() => fm.value.title || siteConfig.value.title),
-  ogImage: computed(() => fm.value.ogImage || fm.value.cover || siteConfig.value.favicon),
-  ogType: 'website',
-  ogUrl: siteUrl,
-})
-
-// for SEO
-useSchemaOrg([
-  // https://unhead.unjs.io/guide/guides/identity.html
-  // Personal Website or Blog
-  definePerson({
-    name: siteConfig.value.author.name,
-    url: siteUrl.value,
-    image: siteConfig.value.author.avatar,
-    sameAs: siteConfig.value.social.map(s => s.link),
-  }),
-  defineWebSite({
-    name: title.value,
-    datePublished: computed(() => fm.value.date),
-    dateModified: computed(() => fm.value.updated),
-  }),
-  defineWebPage(),
-])
-</script>
-
 <template>
-  <ValaxyThemeApp />
-  <ValaxyAddons />
-  <ValaxyUserApp />
-  <RouterView />
+  <ValaxyApp />
 </template>

package/client/components/ValaxyApp.vue

@@ -0,0 +1,98 @@
+<script setup lang="ts">
+// TODO: add docs to override ValaxyApp
+import { computed } from 'vue'
+import { useHead, useSeoMeta } from '@unhead/vue'
+
+// @ts-expect-error virtual module
+import ValaxyUserApp from '/@valaxyjs/UserAppVue'
+// @ts-expect-error virtual module
+import ValaxyThemeApp from '/@valaxyjs/ThemeAppVue'
+
+import pkg from 'valaxy/package.json'
+import { useI18n } from 'vue-i18n'
+import { definePerson, defineWebPage, defineWebSite, useSchemaOrg } from '@unhead/schema-org'
+
+// https://github.com/vueuse/head
+// you can use this to manipulate the document head in any components,
+// they will be rendered correctly in the html results with vite-ssg
+import { useSiteConfig } from '../config'
+import { useFrontmatter } from '../composables'
+import ValaxyAddons from './ValaxyAddons.vue'
+
+// <link rel="apple-touch-icon" href="/pwa-192x192.png">
+// <link rel="mask-icon" href="/safari-pinned-tab.svg" color="#00aba9">
+
+const siteConfig = useSiteConfig()
+// todo, allow user config
+const fm = useFrontmatter()
+
+const { locale } = useI18n()
+
+const title = computed(() => fm.value[`title_${locale.value}`] || fm.value.title)
+useHead({
+  title,
+  titleTemplate: computed(() => fm.value.titleTemplate || ((title: string) => title ? `${title} - ${siteConfig.value.title}` : siteConfig.value.title)),
+  link: [
+    {
+      rel: 'icon',
+      href: siteConfig.value.favicon,
+      type: siteConfig.value.favicon?.endsWith('svg') ? 'image/svg+xml' : 'image/png',
+    },
+  ],
+  meta: [
+    { name: 'description', content: computed(() => siteConfig.value.description) },
+    {
+      name: 'generator',
+      content: `Valaxy ${pkg.version}`,
+    },
+  ],
+
+  templateParams: {
+    schemaOrg: {
+      host: siteConfig.value.url,
+    },
+  },
+})
+
+// seo
+// todo: get first image url from markdown
+const siteUrl = computed(() => fm.value.url || siteConfig.value.url)
+const description = computed(() => fm.value.excerpt || fm.value.description || siteConfig.value.description)
+
+useSeoMeta({
+  description,
+  ogDescription: description,
+  ogLocale: computed(() => locale.value || fm.value.lang || siteConfig.value.lang || 'en'),
+  ogLocaleAlternate: computed(() => siteConfig.value.languages.filter(l => l !== locale.value)),
+  ogSiteName: computed(() => siteConfig.value.title),
+  ogTitle: computed(() => fm.value.title || siteConfig.value.title),
+  ogImage: computed(() => fm.value.ogImage || fm.value.cover || siteConfig.value.favicon),
+  ogType: 'website',
+  ogUrl: siteUrl,
+})
+
+// for SEO
+useSchemaOrg([
+  // https://unhead.unjs.io/guide/guides/identity.html
+  // Personal Website or Blog
+  definePerson({
+    name: siteConfig.value.author.name,
+    url: siteUrl.value,
+    image: siteConfig.value.author.avatar,
+    sameAs: siteConfig.value.social.map(s => s.link),
+  }),
+  defineWebSite({
+    name: title.value,
+    datePublished: computed(() => fm.value.date),
+    dateModified: computed(() => fm.value.updated),
+  }),
+  defineWebPage(),
+])
+</script>
+
+<template>
+  <ValaxyThemeApp />
+  <ValaxyAddons />
+  <ValaxyUserApp />
+  <router-view />
+</template>

package/client/composables/categories.ts

@@ -13,6 +13,13 @@ export interface BaseCategory {
   total: number
 }
 
+/**
+ * @en
+ * Category list
+ *
+ * @zh
+ * 分类列表
+ */
 export interface CategoryList {
   /**
    * category name
@@ -27,7 +34,11 @@ export interface CategoryList {
 export type Category = CategoryList
 export type Categories = Map<string, Post | CategoryList>
 
-// todo write unit test
+/**
+ * For theme development, you can use this function to determine whether the category is a category list.
+ * @todo write unit test
+ * @param category
+ */
 export function isCategoryList(category: any): category is CategoryList {
   return category.children
 }

package/client/composables/outline/headers.ts

@@ -1,67 +1,10 @@
 import { computed, shallowRef } from 'vue'
-import type { DefaultTheme, Header } from 'valaxy/types'
+import type { DefaultTheme } from 'valaxy/types'
+import type { MenuItem } from '@valaxyjs/utils'
+import { getHeaders } from '@valaxyjs/utils'
 import { onContentUpdated } from '../../utils'
 import { useFrontmatter, useThemeConfig } from '../..'
 
-export type MenuItem = Omit<Header, 'slug' | 'children'> & {
-  children?: MenuItem[]
-}
-
-export function resolveHeaders(
-  headers: MenuItem[],
-  levelsRange: Exclude<DefaultTheme.Config['outline'], false> = [2, 4],
-) {
-  const levels: [number, number]
-    = typeof levelsRange === 'number'
-      ? [levelsRange, levelsRange]
-      : levelsRange === 'deep'
-        ? [2, 6]
-        : levelsRange
-
-  return groupHeaders(headers, levels)
-}
-
-function groupHeaders(headers: MenuItem[], levelsRange: [number, number]) {
-  const result: MenuItem[] = []
-
-  headers = headers.map(h => ({ ...h }))
-  headers.forEach((h, index) => {
-    if (h.level >= levelsRange[0] && h.level <= levelsRange[1]) {
-      if (addToParent(index, headers, levelsRange))
-        result.push(h)
-    }
-  })
-
-  return result
-}
-
-function addToParent(
-  currIndex: number,
-  headers: MenuItem[],
-  levelsRange: [number, number],
-) {
-  if (currIndex === 0)
-    return true
-
-  const currentHeader = headers[currIndex]
-  for (let index = currIndex - 1; index >= 0; index--) {
-    const header = headers[index]
-
-    if (
-      header.level < currentHeader.level
-      && header.level >= levelsRange[0]
-      && header.level <= levelsRange[1]
-    ) {
-      if (header.children == null)
-        header.children = []
-      header.children.push(currentHeader)
-      return false
-    }
-  }
-
-  return true
-}
-
 /**
  * export headers & handleClick to generate outline
  */
@@ -76,7 +19,11 @@ export function useOutline() {
   onContentUpdated(() => {
     if (pageOutline.value === false)
       return
-    headers.value = getHeaders(pageOutline.value)
+    headers.value = getHeaders({
+      range: pageOutline.value,
+      selector: '.markdown-body',
+      filter: el => !!el.id && el.hasChildNodes(),
+    })
   })
 
   const handleClick = ({ target: el }: Event) => {
@@ -100,42 +47,3 @@ export function useOutline() {
     handleClick,
   }
 }
-
-/**
- * get headers from document directly
- */
-export function getHeaders(range: Exclude<DefaultTheme.Config['outline'], false>) {
-  const headers = Array.from(document.querySelectorAll('.markdown-body :where(h1,h2,h3,h4,h5,h6)'))
-    .filter(el => el.id && el.hasChildNodes())
-    .map((el) => {
-      const level = Number(el.tagName[1])
-      return {
-        title: serializeHeader(el),
-        link: `#${el.id}`,
-        level,
-        // @ts-expect-error lang
-        lang: el.lang,
-      }
-    })
-
-  return resolveHeaders(headers, range)
-}
-
-function serializeHeader(h: Element): string {
-  let ret = ''
-  for (const node of Array.from(h.childNodes)) {
-    if (node.nodeType === 1) {
-      if (
-        (node as Element).classList.contains('VABadge')
-        || (node as Element).classList.contains('header-anchor')
-      )
-        continue
-
-      ret += node.textContent
-    }
-    else if (node.nodeType === 3) {
-      ret += node.textContent
-    }
-  }
-  return ret.trim()
-}

package/client/composables/tags.ts

@@ -2,6 +2,15 @@ import { computed } from 'vue'
 import type { Post } from '../../types'
 import { useSiteStore } from '../stores'
 
+/**
+ * @en
+ * Tag list, key is tag name, value is the object of tag.
+ * - count: the number of posts with this tag.
+ *
+ * @zh
+ * 标签列表，键是标签名，值是标签对象。
+ * - count: 使用该标签的文章数量。
+ */
 export type Tags = Map<string, {
   count: number
 }>

package/client/index.ts

@@ -9,3 +9,6 @@ export * from './utils'
 export * from './setups'
 
 export * from './types'
+
+// child packages
+export * from '@valaxyjs/utils'

package/client/locales/en.yml

@@ -35,8 +35,8 @@ sidebar:
 
 post:
   decrypt: DECRYPT
-  posted: Posted on
-  edited: Edited on
+  posted: 'Posted on '
+  edited: 'Edited on '
   created: Created
   modified: Modified
   edit: Edit this post

package/client/main.ts

@@ -19,6 +19,7 @@ import { setupLayouts } from 'virtual:generated-layouts'
 import { initValaxyConfig, valaxyConfigSymbol } from 'valaxy'
 import AppLink from './components/AppLink.vue'
 
+// import App from '/@valaxyjs/App.vue'
 import App from './App.vue'
 
 import setupMain from './setup/main'

package/client/setup/mermaid.ts

@@ -3,6 +3,13 @@
 import { defineMermaidSetup } from 'valaxy'
 import type { MermaidOptions } from '../types'
 
+/**
+ * @en
+ * Extend the Mermaid configuration.
+ *
+ * @zh
+ * 扩展 Mermaid 配置。
+ */
 export default defineMermaidSetup(() => {
   // eslint-disable-next-line prefer-const
   let injection_return: MermaidOptions = {

package/client/setups.ts

@@ -2,6 +2,14 @@ import type { ViteSSGContext } from 'vite-ssg'
 import type { Awaitable } from '@antfu/utils'
 import type { MermaidOptions } from './types'
 
+/**
+ * @see https://github.com/antfu-collective/vite-ssg
+ * @en
+ * The context object for the application setup function.
+ *
+ * @zh
+ * 应用 setup 函数的上下文对象。（包括了 ViteSSG context）
+ */
 export type AppContext = ViteSSGContext
 
 export type AppSetup = (ctx: AppContext) => Awaitable<void>
@@ -9,6 +17,13 @@ export type AppSetup = (ctx: AppContext) => Awaitable<void>
 // client
 export type MermaidSetup = () => Partial<MermaidOptions> | void
 
+/**
+ * @en
+ * Define the setup function for the client application.
+ *
+ * @zh
+ * 扩展客户端应用的 setup 函数。
+ */
 export function defineAppSetup(fn: AppSetup) {
   return fn
 }

package/client/types/index.ts

@@ -3,4 +3,7 @@ import type mermaid from 'mermaid'
 
 export type UserModule = (ctx: ViteSSGContext) => void
 
+/**
+ * @see https://mermaid.js.org/config/schema-docs/config.html#mermaid-config-schema
+ */
 export type MermaidOptions = (typeof mermaid.initialize) extends (a: infer A) => any ? A : never

package/client/utils/router.ts

@@ -1,7 +1,18 @@
 import type { Router } from 'vue-router'
 
+/**
+ * @en
+ * Options for scrolling to a target element.
+ *
+ * @zh
+ * 滚动到目标元素的选项。
+ */
 export interface ScrollToOptions {
   /**
+   * @en
+   * Whether to scroll smoothly.
+   *
+   * @zh
    * 平滑滚动
    */
   smooth: boolean
@@ -11,6 +22,13 @@ export interface ScrollToOptions {
   targetPadding: number
 }
 
+/**
+ * For theme developers, you can use this function to scroll to the target element.
+ * For example, when you click the anchor link in the markdown file, it will scroll to the target element.
+ * @param el
+ * @param hash
+ * @param options
+ */
 export function scrollTo(el: HTMLElement, hash: string, options: Partial<ScrollToOptions> = {
   smooth: true,
   targetPadding: -64,

package/client/utils/time.ts

@@ -10,6 +10,14 @@ export function formatDate(date: string | number | Date, template = 'yyyy-MM-dd'
   return format(date, template)
 }
 
+/**
+ * date-fns format date with 'yyyy-MM-dd HH:mm:ss'
+ * @param date
+ */
+export function formatTimestamp(date: string | number | Date): string {
+  return format(date, 'yyyy-MM-dd HH:mm:ss')
+}
+
 /**
  * sort posts by date
  * @param posts

package/dist/{chunk-I6UPHJXQ.cjs → chunk-AFNVTV2C.cjs}

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true});var m=Object.create;var o=Object.defineProperty;var i=Object.getOwnPropertyDescriptor;var u=Object.getOwnPropertyNames;var d=Object.getPrototypeOf,f=Object.prototype.hasOwnProperty;var l=(e=>typeof require<"u"?require:typeof Proxy<"u"?new Proxy(e,{get:(t,n)=>(typeof require<"u"?require:t)[n]}):e)(function(e){if(typeof require<"u")return require.apply(this,arguments);throw Error('Dynamic require of "'+e+'" is not supported')});var p=(e,t)=>()=>(e&&(t=e(e=0)),t);var R=(e,t)=>()=>(t||e((t={exports:{}}).exports,t),t.exports);var a=(e,t,n,c)=>{if(t&&typeof t=="object"||typeof t=="function")for(let r of u(t))!f.call(e,r)&&r!==n&&o(e,r,{get:()=>t[r],enumerable:!(c=i(t,r))||c.enumerable});return e};var h=(e,t,n)=>(n=e!=null?m(d(e)):{},a(t||!e||!e.__esModule?o(n,"default",{value:e,enumerable:!0}):n,e));var s,I,U= exports.e =p(()=>{"use strict";s=()=>typeof document>"u"?new URL("file:"+__filename).href:document.currentScript&&document.currentScript.src||new URL("main.js",document.baseURI).href,I= exports.d =s()});exports.a = l; exports.b = R; exports.c = h; exports.d = I; exports.e = U;
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});var m=Object.create;var o=Object.defineProperty;var i=Object.getOwnPropertyDescriptor;var u=Object.getOwnPropertyNames;var d=Object.getPrototypeOf,f=Object.prototype.hasOwnProperty;var l=(e=>typeof require<"u"?require:typeof Proxy<"u"?new Proxy(e,{get:(t,n)=>(typeof require<"u"?require:t)[n]}):e)(function(e){if(typeof require<"u")return require.apply(this,arguments);throw Error('Dynamic require of "'+e+'" is not supported')});var p=(e,t)=>()=>(e&&(t=e(e=0)),t);var R=(e,t)=>()=>(t||e((t={exports:{}}).exports,t),t.exports);var a=(e,t,n,c)=>{if(t&&typeof t=="object"||typeof t=="function")for(let r of u(t))!f.call(e,r)&&r!==n&&o(e,r,{get:()=>t[r],enumerable:!(c=i(t,r))||c.enumerable});return e};var h=(e,t,n)=>(n=e!=null?m(d(e)):{},a(t||!e||!e.__esModule?o(n,"default",{value:e,enumerable:!0}):n,e));var s,I,U= exports.e =p(()=>{"use strict";s=()=>typeof document>"u"?new URL(`file:${__filename}`).href:document.currentScript&&document.currentScript.src||new URL("main.js",document.baseURI).href,I= exports.d =s()});exports.a = l; exports.b = R; exports.c = h; exports.d = I; exports.e = U;