valaxy 1.0.0-rc.9 → 1.0.0

package/client/.gitignore

@@ -0,0 +1,7 @@
+# unplugin-vue-components
+components.d.ts
+
+# vue-router/vite (file-based routing)
+typed-router.d.ts
+
+.env.local

package/client/components/ValaxyLocalSearch.vue

@@ -26,7 +26,7 @@ watch(() => props.open, (val) => {
   else {
     query.value = ''
   }
-})
+}, { immediate: true })
 
 watch(results, () => {
   selectedIndex.value = 0

package/client/composables/app/useValaxyHead.ts

@@ -19,7 +19,7 @@ export function useValaxyHead() {
     if (!/^https?:\/\//.test(siteUrl))
       return ''
 
-    const pagePath = fm.value.url || route.path
+    const pagePath = fm.value.canonical || fm.value.url || route.path
     return resolveSiteUrl(siteUrl, pagePath)
   })
 

package/client/composables/features/collapse-code.ts

@@ -46,7 +46,7 @@ export function useCollapseCode() {
   // determine whether to add folded class name
   onMounted(() => {
     const els = document.querySelectorAll('div[class*="language-"]')
-    for (const el of [...els]) {
+    for (const el of Array.from(els)) {
       const elHeight = getHeightViaClone(el as HTMLElement)
       if (elHeight > codeHeightLimit)
         el.classList.add('folded')

package/client/composables/features/copy-markdown.ts

@@ -1,10 +1,11 @@
 import { isClient, useClipboard } from '@vueuse/core'
 import { computed, ref, watchEffect } from 'vue'
 import { useRoute } from 'vue-router'
+import { useSiteConfig } from '../../config'
 
 /**
  * Composable for copying raw Markdown content of the current post.
- * Requires `siteConfig.llms.files: true` to have .md files available at build output.
+ * Requires `siteConfig.llms.enable: true` and `siteConfig.llms.files: true` to have .md files available at build output.
  *
  * The `available` ref is initially `false` and becomes `true` after a HEAD request
  * confirms the `.md` file exists. This allows themes to conditionally render
@@ -26,6 +27,7 @@ import { useRoute } from 'vue-router'
  */
 export function useCopyMarkdown() {
   const route = useRoute()
+  const siteConfig = useSiteConfig()
   const copied = ref(false)
   const loading = ref(false)
   const available = ref(false)
@@ -39,14 +41,26 @@ export function useCopyMarkdown() {
     return `${p}.md`
   })
 
-  // Probe the .md file to detect availability (siteConfig.llms.files enabled at build time)
+  // Only probe when raw Markdown output is enabled.
   if (isClient) {
-    watchEffect(() => {
+    watchEffect((onCleanup) => {
       available.value = false
       error.value = null
-      fetch(mdUrl.value, { method: 'HEAD' })
-        .then((res) => { available.value = res.ok })
-        .catch(() => { available.value = false })
+      if (!siteConfig.value.llms.enable || !siteConfig.value.llms.files)
+        return
+
+      const controller = new AbortController()
+      onCleanup(() => controller.abort())
+
+      fetch(mdUrl.value, { method: 'HEAD', signal: controller.signal })
+        .then((res) => {
+          if (!controller.signal.aborted)
+            available.value = res.ok
+        })
+        .catch(() => {
+          if (!controller.signal.aborted)
+            available.value = false
+        })
     })
   }
 

package/client/composables/search/useLocalSearch.ts

@@ -13,7 +13,7 @@ export interface LocalSearchResult {
 export function useLocalSearch(query: Ref<string>) {
   const results = shallowRef<LocalSearchResult[]>([])
   const loading = ref(false)
-  let miniSearch: MiniSearch | null = null
+  const miniSearch = shallowRef<MiniSearch | null>(null)
 
   async function load(locale = 'root') {
     loading.value = true
@@ -25,9 +25,9 @@ export function useLocalSearch(query: Ref<string>) {
         return
       }
       const mod = await loader()
-      const data: string = JSON.parse(mod.default)
+      const data: string = mod.default
       const { default: MiniSearchCtor } = await import('minisearch')
-      miniSearch = MiniSearchCtor.loadJSON(data, {
+      miniSearch.value = MiniSearchCtor.loadJSON(data, {
         fields: ['title', 'titles', 'text'],
         storeFields: ['title', 'titles'],
       })
@@ -38,11 +38,11 @@ export function useLocalSearch(query: Ref<string>) {
   }
 
   watchEffect(() => {
-    if (!miniSearch || !query.value.trim()) {
+    if (!miniSearch.value || !query.value.trim()) {
       results.value = []
       return
     }
-    results.value = miniSearch.search(query.value, {
+    results.value = miniSearch.value.search(query.value, {
       prefix: true,
       fuzzy: 0.2,
       boost: { title: 4, text: 2, titles: 1 },

package/client/index.d.ts

@@ -2,6 +2,7 @@ import type { Ref } from 'vue'
 import type { Post } from '../types'
 
 import './shims.d'
+import '../vendor/layouts/client'
 // Import vue-router RouteMeta augmentation
 import '../types/vue-router.d'
 

package/client/index.html

@@ -6,6 +6,7 @@
 </head>
 <body>
   <div id="app"></div>
+  <div id="valaxy-teleports"></div>
   <script type="module" src="./main.ts"></script>
   <!-- body -->
 </body>

package/client/modules/devtools.ts

@@ -1,62 +1,57 @@
 import type { UserModule } from '../types'
+import { createValaxyPageBridge } from '@valaxyjs/devtools/page'
+import { useWindowSize } from '@vueuse/core'
+import { effectScope, onScopeDispose, watch } from 'vue'
+import { useScreenSize } from '../composables/helper/useScreenSize'
+import { useValaxyConfig } from '../config'
 
-import { normalizeRepositoryUrl } from '@valaxyjs/utils'
-import pkg from '../../package.json'
-import valaxyLogo from '../assets/images/valaxy-logo.png'
-
-// import {addCustomCommand, addCustomTab } from '@vue/devtools-api'
-
-/**
- * add when enable vue devtools
- * https://devtools-next.vuejs.org/plugins/api
- */
-export async function addValaxyTabAndCommand() {
-  const { addCustomTab, addCustomCommand } = await import('@vue/devtools-api')
-  addCustomTab({
-    // unique identifier
-    name: 'valaxy',
-    // title to display in the tab
-    title: 'Valaxy',
-    // any icon from Iconify, or a URL to an image
-    icon: valaxyLogo,
-    // iframe view
-    view: {
-      type: 'iframe',
-      // src: import.meta.env.DEV ? 'http://localhost:5001/' : '/__valaxy_devtools__/',
-      src: '/__valaxy_devtools__/',
-    },
-    // category: 'pinned',
-    category: 'app',
-  })
-
-  addCustomCommand({
-    id: 'valaxy',
-    title: 'Valaxy',
-    icon: valaxyLogo,
-    children: [
-      {
-        id: 'valaxy:github',
-        title: 'Github',
-        icon: 'i-ri-github-fill',
-        action: {
-          type: 'url',
-          src: normalizeRepositoryUrl(pkg.repository.url),
-        },
+export const install: UserModule = ({ app, router }) => {
+  const scope = effectScope()
+  app.runWithContext(() => scope.run(() => {
+    const config = useValaxyConfig()
+    const { width, height } = useWindowSize()
+    const screen = useScreenSize()
+    const bridge = createValaxyPageBridge(router, {
+      getDebug() {
+        const route = router.currentRoute.value
+        const { siteConfig, themeConfig, theme } = config.value
+        return {
+          route: {
+            path: route.path,
+            fullPath: route.fullPath,
+            name: route.name == null ? undefined : String(route.name),
+            layout: String(route.meta.layout || 'default'),
+            query: route.query,
+            params: route.params,
+          },
+          viewport: {
+            width: width.value,
+            height: height.value,
+            breakpoints: [
+              { label: 'xs', active: screen.isXs.value },
+              { label: 'sm', active: screen.isSm.value },
+              { label: 'md', active: screen.isMd.value },
+              { label: 'lg', active: screen.isLg.value },
+              { label: 'xl', active: screen.isXl.value },
+              { label: '2xl', active: screen.is2xl.value },
+            ],
+          },
+          config: {
+            theme: theme || '',
+            site: { lang: siteConfig.lang, title: siteConfig.title, url: siteConfig.url },
+            themeConfig: { ...themeConfig },
+          },
+        }
       },
-      {
-        id: 'valaxy:website',
-        title: 'Website',
-        icon: valaxyLogo,
-        action: {
-          type: 'url',
-          src: 'https://valaxy.site/',
-        },
-        order: 2,
-      },
-    ],
-  })
-}
-
-export const install: UserModule = async () => {
-  await addValaxyTabAndCommand()
+    })
+    const sync = () => bridge.sync()
+    watch([width, height, config, ...Object.values(screen)], sync, { deep: true })
+    import.meta.hot?.on('valaxy:pageData', sync)
+    onScopeDispose(() => {
+      bridge.close()
+      import.meta.hot?.off('valaxy:pageData', sync)
+    })
+  }))
+  app.onUnmount(() => scope.stop())
+  import.meta.hot?.dispose(() => scope.stop())
 }

package/client/modules/unhead.ts

@@ -1,11 +1,19 @@
 import type { UserModule } from '../types'
-import { InferSeoMetaPlugin } from '@unhead/addons'
+import { InferSeoMetaPlugin } from '@unhead/bundler'
 
 export const install: UserModule = async ({ head, isClient }) => {
   // Disables on client build, allows 0kb runtime
   if (isClient && import.meta.env.PROD)
     return
 
+  // Unhead's server entry adds this default, but its client entry does not.
+  // Keep mobile development previews at device width, just like SSG pages.
+  if (import.meta.env.DEV) {
+    head?.push({
+      meta: [{ name: 'viewport', content: 'width=device-width, initial-scale=1' }],
+    })
+  }
+
   /**
    * https://unhead.unjs.io/docs/head/guides/plugins/infer-seo-meta-tags
    */

package/client/setup/main.ts

@@ -27,7 +27,7 @@ export default function setupMain(ctx: ValaxySSGContext, config: ComputedRef<Val
   installNprogress(ctx)
   installFloatingVue(ctx, config)
 
-  if (import.meta.env.DEV && ctx.isClient) {
+  if (import.meta.env.DEV && ctx.isClient && config.value.devtools) {
     import('../modules/devtools').then(({ install: installDevtools }) => {
       setTimeout(() => {
         installDevtools(ctx)

package/client/setups.ts

@@ -1,7 +1,6 @@
 import type { Awaitable } from '@antfu/utils'
 import type { App } from 'vue'
 import type { Router, RouteRecordRaw } from 'vue-router'
-import type { MermaidOptions } from './types'
 
 /**
  * @en
@@ -35,9 +34,6 @@ export type AppContext = ValaxySSGContext
 
 export type AppSetup = (ctx: AppContext) => Awaitable<void>
 
-// client
-export type MermaidSetup = () => Partial<MermaidOptions> | void
-
 /**
  * @en
  * Define the setup function for the client application.
@@ -49,6 +45,7 @@ export function defineAppSetup(fn: AppSetup) {
   return fn
 }
 
-export function defineMermaidSetup(fn: MermaidSetup) {
+/** @deprecated Import defineMermaidSetup from valaxy-addon-mermaid instead. */
+export function defineMermaidSetup<T extends object>(fn: () => T | void) {
   return fn
 }

package/client/shims.d.ts

@@ -49,3 +49,10 @@ declare module '#valaxy/blog/collections' {
   const collections: CollectionConfig[]
   export default collections
 }
+
+declare module '@intlify/unplugin-vue-i18n/messages' {
+  import type { I18nOptions } from 'vue-i18n'
+
+  const messages: I18nOptions['messages']
+  export default messages
+}

package/client/styles/css-vars/borders.css

@@ -20,5 +20,5 @@
 .dark {
   --va-c-border: #3c3f44;
   --va-c-divider: #2e2e32;
-  --va-c-gutter: #000000;
+  --va-c-gutter: #000;
 }

package/client/styles/css-vars/function.css

@@ -25,7 +25,6 @@
   --va-c-default-2: var(--va-c-gray-2);
   --va-c-default-3: var(--va-c-gray-3);
   --va-c-default-soft: var(--va-c-gray-soft);
-
   --va-c-brand-1: var(--va-c-indigo-1);
   --va-c-brand-2: var(--va-c-indigo-2);
   --va-c-brand-3: var(--va-c-indigo-3);
@@ -33,17 +32,14 @@
 
   /* DEPRECATED: Use `--va-c-brand-1` instead. */
   --va-c-brand: var(--va-c-brand-1);
-
   --va-c-tip-1: var(--va-c-brand-1);
   --va-c-tip-2: var(--va-c-brand-2);
   --va-c-tip-3: var(--va-c-brand-3);
   --va-c-tip-soft: var(--va-c-brand-soft);
-
   --va-c-warning-1: var(--va-c-yellow-1);
   --va-c-warning-2: var(--va-c-yellow-2);
   --va-c-warning-3: var(--va-c-yellow-3);
   --va-c-warning-soft: var(--va-c-yellow-soft);
-
   --va-c-danger-1: var(--va-c-red-1);
   --va-c-danger-2: var(--va-c-red-2);
   --va-c-danger-3: var(--va-c-red-3);

package/client/styles/css-vars/palette.css

@@ -30,28 +30,23 @@
   --va-c-gray-1: #dddde3;
   --va-c-gray-2: #e4e4e9;
   --va-c-gray-3: #ebebef;
-  --va-c-gray-soft: rgba(142, 150, 170, 0.14);
-
+  --va-c-gray-soft: rgb(142 150 170 / 0.14);
   --va-c-indigo-1: #3451b2;
   --va-c-indigo-2: #3a5ccc;
   --va-c-indigo-3: #5672cd;
-  --va-c-indigo-soft: rgba(100, 108, 255, 0.14);
-
+  --va-c-indigo-soft: rgb(100 108 255 / 0.14);
   --va-c-green-1: #18794e;
   --va-c-green-2: #299764;
   --va-c-green-3: #30a46c;
-  --va-c-green-soft: rgba(16, 185, 129, 0.14);
-
+  --va-c-green-soft: rgb(16 185 129 / 0.14);
   --va-c-yellow-1: #915930;
   --va-c-yellow-2: #946300;
   --va-c-yellow-3: #9f6a00;
-  --va-c-yellow-soft: rgba(234, 179, 8, 0.14);
-
+  --va-c-yellow-soft: rgb(234 179 8 / 0.14);
   --va-c-red-1: #b8272c;
   --va-c-red-2: #d5393e;
   --va-c-red-3: #e0575b;
-  --va-c-red-soft: rgba(244, 63, 94, 0.14);
-
+  --va-c-red-soft: rgb(244 63 94 / 0.14);
   --va-c-sponsor: #db2777;
 }
 
@@ -59,25 +54,21 @@
   --va-c-gray-1: #515c67;
   --va-c-gray-2: #414853;
   --va-c-gray-3: #32363f;
-  --va-c-gray-soft: rgba(101, 117, 133, 0.16);
-
+  --va-c-gray-soft: rgb(101 117 133 / 0.16);
   --va-c-indigo-1: #a8b1ff;
   --va-c-indigo-2: #5c73e7;
   --va-c-indigo-3: #3e63dd;
-  --va-c-indigo-soft: rgba(100, 108, 255, 0.16);
-
+  --va-c-indigo-soft: rgb(100 108 255 / 0.16);
   --va-c-green-1: #3dd68c;
   --va-c-green-2: #30a46c;
   --va-c-green-3: #298459;
-  --va-c-green-soft: rgba(16, 185, 129, 0.16);
-
+  --va-c-green-soft: rgb(16 185 129 / 0.16);
   --va-c-yellow-1: #f9b44e;
   --va-c-yellow-2: #da8b17;
   --va-c-yellow-3: #a46a0a;
-  --va-c-yellow-soft: rgba(234, 179, 8, 0.16);
-
+  --va-c-yellow-soft: rgb(234 179 8 / 0.16);
   --va-c-red-1: #f66f81;
   --va-c-red-2: #f14158;
   --va-c-red-3: #b62a3c;
-  --va-c-red-soft: rgba(244, 63, 94, 0.16);
+  --va-c-red-soft: rgb(244 63 94 / 0.16);
 }

package/client/tsconfig.json

@@ -6,9 +6,7 @@
       "valaxy": ["./index.d.ts"]
     },
     "types": [
-      "vite/client",
-      "vite-plugin-vue-layouts-next/client",
-      "@intlify/unplugin-vue-i18n/messages"
+      "vite/client"
     ]
   },
   "include": ["."]

package/client/types/index.ts

@@ -1,11 +1,5 @@
-import type mermaid from 'mermaid'
 import type { ValaxySSGContext } from '../setups'
 
 export type UserModule = (ctx: ValaxySSGContext) => 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
-
 export * from './collection'

package/client/utils/content.ts

@@ -8,6 +8,11 @@ export let contentUpdatedCallbacks: (() => any)[] = []
  * in the DOM.
  */
 export function onContentUpdated(fn: () => any) {
+  // SSR never unmounts components, so this module-level array would retain
+  // every rendered page and its router. In the browser, register during setup
+  // so parent listeners exist when child content first mounts.
+  if (import.meta.env.SSR)
+    return
   contentUpdatedCallbacks.push(fn)
   onUnmounted(() => {
     contentUpdatedCallbacks = contentUpdatedCallbacks.filter(f => f !== fn)

package/dist/node/cli/index.d.mts

@@ -1,20 +1,35 @@
 import { Argv } from 'yargs';
-import { LogLevel, ViteDevServer } from 'vite';
+import { LogLevel, InlineConfig, ViteDevServer } from 'vite';
 
-declare function startValaxyDev({ root, port, remote, log, open, }: {
+/**
+ * valaxy build
+ */
+declare function execBuild({ ssg, root, output, log, siteUrl }: {
+    ssg: boolean;
+    root: string;
+    output: string;
+    log: string;
+    siteUrl?: string;
+}): Promise<void>;
+
+declare function startValaxyDev({ root, port, remote, log, open, vite, }: {
     root?: string;
     port?: number;
     remote?: boolean;
     log?: LogLevel;
     open?: boolean;
+    /** Final host overrides for programmatic callers such as desktop hosts. */
+    vite?: InlineConfig;
 }): Promise<ViteDevServer>;
 declare function registerDevCommand(cli: Argv): void;
 
+/** Programmatic lifecycle contract supported by desktop hosts. */
+declare const desktopRuntimeVersion = 1;
 interface CreateCliOptions {
     userRoot?: string;
 }
 declare function createCli(argv?: string[], options?: CreateCliOptions): Promise<Argv<object>>;
 declare function run(argv?: string[], options?: CreateCliOptions): Promise<void>;
 
-export { createCli, registerDevCommand, run, startValaxyDev };
+export { createCli, desktopRuntimeVersion, execBuild, registerDevCommand, run, startValaxyDev };
 export type { CreateCliOptions };

package/dist/node/cli/index.mjs

@@ -2,13 +2,13 @@ import 'node:path';
 import 'node:process';
 import 'yargs';
 import 'yargs/helpers';
-export { c as createCli, J as registerDevCommand, Y as run, _ as startValaxyDev } from '../../shared/valaxy.Cb_HdczD.mjs';
+export { c as createCli, s as desktopRuntimeVersion, u as execBuild, O as registerDevCommand, a1 as run, a3 as startValaxyDev } from '../../shared/valaxy.BVZF0N6Q.mjs';
 import 'node:os';
 import 'consola';
 import 'consola/utils';
-import 'fast-glob';
 import 'fs-extra';
 import 'gray-matter';
+import 'tinyglobby';
 import 'js-yaml';
 import '@antfu/utils';
 import 'debug';
@@ -23,22 +23,35 @@ import 'cross-spawn';
 import 'mlly';
 import 'resolve-global';
 import '@valaxyjs/utils';
+import 'node:fs';
 import 'node:fs/promises';
 import 'dayjs';
 import 'feed';
-import 'markdown-it';
+import 'markdown-exit';
 import 'table';
 import 'hookable';
-import 'node:fs';
-import '@intlify/unplugin-vue-i18n/vite';
-import '@unhead/addons/vite';
-import 'unplugin-vue-components/vite';
-import 'vite-plugin-vue-layouts-next';
+import '@unhead/bundler/vite';
 import 'vitepress-plugin-group-icons';
-import 'p-map';
+import 'local-pkg';
+import 'picomatch';
+import 'chokidar';
+import 'unplugin';
+import 'unplugin-utils';
+import 'obug';
+import 'magic-string';
 import 'node:buffer';
+import 'p-map';
+import '@intlify/shared';
+import '@intlify/bundle-utils';
+import '@rollup/pluginutils';
+import 'vue/compiler-sfc';
+import 'picocolors';
+import '@eslint-community/eslint-utils';
+import '@intlify/vue-i18n-extensions';
+import '@typescript-eslint/scope-manager';
 import 'minisearch';
 import '@shikijs/transformers';
+import 'lru-cache';
 import 'shiki';
 import 'css-i18n';
 import 'markdown-it-anchor';
@@ -52,17 +65,15 @@ import 'markdown-it-container';
 import 'katex';
 import 'katex/contrib/mhchem';
 import 'unplugin-vue-markdown/vite';
-import 'js-base64';
-import 'lru-cache';
 import 'jiti';
 import 'unocss';
 import 'pascalcase';
 import 'html-to-text';
 import 'vue-router/vite';
-import 'node:child_process';
-import 'node:v8';
 import 'vite-ssg-sitemap';
 import '@unhead/vue/server';
+import 'vue-router/unplugin';
+import 'node:child_process';
 import '@clack/prompts';
 import 'node:net';
 import 'node:readline';