@movk/nuxt-docs 1.14.1 → 1.15.0

package/README.md

@@ -24,7 +24,7 @@
   <img src="https://docs.mhaibaraai.cn/ai/AiChat.png" alt="AiChat" width="400">
 </div>
 
-- **AI 聊天助手** - 内置智能文档助手，基于 Vercel AI SDK 支持多种 LLM 模型（Mistral、Qwen、OpenRouter）
+- **AI 聊天助手** - 内置智能文档助手，基于 Vercel AI SDK 支持多种 LLM 模型
 - **MCP Server 支持** - 集成 Model Context Protocol 服务器，为 AI 助手提供结构化的文档访问能力
 - **LLM 优化** - 通过 `nuxt-llms` 模块自动生成 `llms.txt` 和 `llms-full.txt`，为 AI 工具提供优化的文档索引
 - **流式响应** - 支持 AI 响应流式输出和代码高亮，配合 `shiki-stream` 实现实时语法高亮渲染

package/app/app.config.ts

@@ -17,26 +17,8 @@ export default defineAppConfig({
     colors: {
       primary: 'green',
       neutral: 'slate'
-    },
-    contentNavigation: {
-      slots: {
-        linkLeadingIcon: 'size-4 mr-1',
-        linkTrailing: 'hidden'
-      },
-      defaultVariants: {
-        variant: 'link'
-      }
-    },
-    pageLinks: {
-      slots: {
-        linkLeadingIcon: 'size-4',
-        linkLabelExternalIcon: 'size-2.5'
-      }
     }
-  },
-  vercelAnalytics: {
-    enable: false,
-    debug: false
+
   },
   header: {
     avatar: 'https://docs.mhaibaraai.cn/avatar.png',
@@ -79,28 +61,19 @@ export default defineAppConfig({
     },
     texts: {
       title: 'AI 助手',
-      collapse: '折叠',
-      expand: '展开',
       clearChat: '清除聊天记录',
       close: '关闭',
-      loading: 'Loading...',
-      askAnything: '问我任何事情...',
-      askMeAnythingDescription: '我可以帮助您浏览文档、解释概念并回答您的问题。',
-      faq: 'FAQ 建议',
       placeholder: '输入你的问题...',
       lineBreak: '换行',
       trigger: '与 AI 聊天',
-      streaming: '思考中...',
-      streamed: '思考过程',
       explainWithAi: '用 AI 解释此页面'
     },
     icons: {
-      loading: 'i-lucide-loader',
       trigger: 'i-custom-ai',
-      explain: 'i-lucide-brain',
-      close: 'i-lucide-x',
-      clearChat: 'i-lucide-trash-2',
-      streaming: 'i-lucide-chevron-down',
+      explain: 'i-lucide-bot-message-square',
+      reasoning: 'i-lucide-brain',
+      close: 'i-lucide-panel-right-close',
+      clearChat: 'i-lucide-list-x',
       providers: {
         deepseek: 'i-hugeicons:deepseek',
         alibaba: 'i-hugeicons:qwen',

package/app/app.vue

@@ -1,33 +1,39 @@
 <script setup lang="ts">
 import colors from 'tailwindcss/colors'
-import { Analytics } from '@vercel/analytics/nuxt'
-import { SpeedInsights } from '@vercel/speed-insights/nuxt'
+import { withoutTrailingSlash } from 'ufo'
+import { zh_cn } from '@nuxt/ui/locale'
 
 const site = useSiteConfig()
 const appConfig = useAppConfig()
 const colorMode = useColorMode()
 const route = useRoute()
-const { isEnabled: isAiChatEnabled, panelWidth: aiChatPanelWidth, shouldPushContent } = useAIChat()
+const { style, link } = useTheme()
+const { isEnabled: isAiChatEnabled } = useAIChat()
 
 const { data: navigation } = await useAsyncData('navigation', () => queryCollectionNavigation('docs', ['category', 'description']))
-const { data: files } = useLazyAsyncData('search', () => queryCollectionSearchSections('docs'), {
+const { data: files } = useLazyAsyncData('search', () => queryCollectionSearchSections('docs', {
+  ignoredTags: ['style']
+}), {
   server: false
 })
+
 const color = computed(() => colorMode.value === 'dark' ? (colors as any)[appConfig.ui.colors.neutral][900] : 'white')
-const radius = computed(() => `:root { --ui-radius: ${appConfig.theme.radius}rem; }`)
-const blackAsPrimary = computed(() => appConfig.theme.blackAsPrimary ? `:root { --ui-primary: black; } .dark { --ui-primary: white; }` : ':root {}')
-const font = computed(() => `:root { --font-sans: '${appConfig.theme.font}', sans-serif; }`)
 
 useHead({
   meta: [
     { name: 'viewport', content: 'width=device-width, initial-scale=1' },
     { key: 'theme-color', name: 'theme-color', content: color }
   ],
-  style: [
-    { innerHTML: radius, id: 'nuxt-ui-radius', tagPriority: -2 },
-    { innerHTML: blackAsPrimary, id: 'nuxt-ui-black-as-primary', tagPriority: -2 },
-    { innerHTML: font, id: 'nuxt-ui-font', tagPriority: -2 }
-  ]
+  link: [
+    { rel: 'icon', href: '/favicon.ico' },
+    { rel: 'canonical', href: `${site.url}${withoutTrailingSlash(route.path)}` },
+    ...link.value
+  ],
+  htmlAttrs: {
+    lang: 'zh-CN',
+    dir: 'ltr'
+  },
+  style
 })
 
 useSeoMeta({
@@ -44,32 +50,48 @@ provide('navigation', rootNavigation)
 </script>
 
 <template>
-  <UApp :toaster="appConfig.toaster">
+  <UApp :toaster="appConfig.toaster" :locale="zh_cn">
     <NuxtLoadingIndicator color="var(--ui-primary)" :height="2" />
-    <Analytics v-if="appConfig.vercelAnalytics" :debug="appConfig.vercelAnalytics?.debug" />
-    <SpeedInsights v-if="appConfig.vercelAnalytics" :debug="appConfig.vercelAnalytics?.debug" />
 
-    <div :class="{ root: route.path.startsWith('/docs/') }" :style="{ marginRight: shouldPushContent ? `${aiChatPanelWidth}px` : '0' }">
-      <template v-if="!route.path.startsWith('/examples')">
-        <Header v-if="$route.meta.header !== false" />
-      </template>
+    <UTheme
+      :ui="{
+        contentNavigation: {
+          linkLeadingIcon: 'size-4 mr-1',
+          linkTrailing: 'hidden'
+        },
+        pageLinks: {
+          linkLeadingIcon: 'size-4',
+          linkLabelExternalIcon: 'size-2.5'
+        }
+      }"
+    >
+      <div class="flex">
+        <div class="flex-1 min-w-0" :class="[route.path.startsWith('/docs/') && 'root']">
+          <template v-if="!route.path.startsWith('/examples')">
+            <Header v-if="$route.meta.header !== false" />
+          </template>
 
-      <NuxtLayout>
-        <NuxtPage />
-      </NuxtLayout>
+          <NuxtLayout>
+            <NuxtPage />
+          </NuxtLayout>
 
-      <template v-if="!route.path.startsWith('/examples')">
-        <Footer v-if="$route.meta.footer !== false" />
+          <template v-if="!route.path.startsWith('/examples')">
+            <Footer v-if="$route.meta.footer !== false" />
 
-        <ClientOnly>
-          <LazyUContentSearch :files="files" :navigation="rootNavigation" :fuse="{ resultLimit: 1000 }" />
-          <template v-if="isAiChatEnabled">
-            <LazyAiChatPanel />
-            <LazyAiChatFloatingInput />
+            <ClientOnly>
+              <UContentSearch :files="files" :navigation="rootNavigation" :fuse="{ resultLimit: 500 }" />
+            </ClientOnly>
           </template>
-        </ClientOnly>
-      </template>
-    </div>
+        </div>
+
+        <template v-if="!route.path.startsWith('/examples') && isAiChatEnabled">
+          <ClientOnly>
+            <AiChatPanel />
+            <AiChatFloatingInput />
+          </ClientOnly>
+        </template>
+      </div>
+    </UTheme>
   </UApp>
 </template>
 

package/app/components/DocsAsideRightBottom.vue

@@ -19,6 +19,6 @@ const showExplainWithAi = computed(() => {
     size="sm"
     variant="ghost"
     color="neutral"
-    @click="open(`解释此页面 ${pageUrl}`, true)"
+    @click="open(`阅读 ${pageUrl} 处的文档页面并对其进行总结，我想问一下相关问题。`)"
   />
 </template>

package/app/components/OgImage/OgImageDocs.takumi.vue

@@ -0,0 +1,90 @@
+<script setup lang="ts">
+withDefaults(defineProps<{
+  title?: string
+  description?: string
+  siteName?: string
+}>(), {
+  title: '文档',
+  description: '使用 Nuxt Content 构建的文档站点',
+  siteName: 'Movk Nuxt Docs'
+})
+</script>
+
+<template>
+  <div
+    style="font-family: 'Public Sans', 'Noto Sans SC', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;"
+    class="w-full h-full flex flex-col justify-center items-center relative p-10 lg:p-15 bg-white text-neutral-900 dark:bg-neutral-900 dark:text-neutral-50"
+  >
+    <div
+      class="absolute top-0 left-0 right-0 bottom-0"
+      :style="{
+        backgroundImage: `radial-gradient(at 100% 100%, rgba(34, 197, 94, 0.15), transparent)`
+      }"
+    />
+    <div
+      class="absolute top-0 left-0 right-0 bottom-0"
+      :style="{
+        backgroundImage: `radial-gradient(at 0% 0%, rgba(34, 197, 94, 0.1), transparent)`
+      }"
+    />
+
+    <div class="relative flex flex-col items-center text-center gap-5 lg:gap-8">
+      <div class="flex items-center gap-3">
+        <svg viewBox="0 0 64 64" class="w-10 h-10 lg:w-16 lg:h-16">
+          <defs>
+            <linearGradient
+              id="nsLine1"
+              x1="0%"
+              y1="100%"
+              x2="100%"
+              y2="0%"
+            >
+              <stop offset="0%" stop-color="#22c55e" />
+              <stop offset="100%" stop-color="#86efac" />
+            </linearGradient>
+            <linearGradient
+              id="nsFill1"
+              x1="0%"
+              y1="0%"
+              x2="0%"
+              y2="100%"
+            >
+              <stop offset="0%" stop-color="#22c55e" stop-opacity="0.6" />
+              <stop offset="100%" stop-color="#22c55e" stop-opacity="0" />
+            </linearGradient>
+          </defs>
+          <path d="M8 52 Q20 48 24 36 T40 20 T56 12 L56 56 L8 56 Z" fill="url(#nsFill1)" />
+          <path
+            d="M8 52 Q20 48 24 36 T40 20 T56 12"
+            fill="none"
+            stroke="url(#nsLine1)"
+            stroke-width="4"
+            stroke-linecap="round"
+          />
+          <circle
+            cx="56"
+            cy="12"
+            r="6"
+            fill="url(#nsLine1)"
+          />
+        </svg>
+        <span class="text-[32px] font-medium lg:text-[42px] text-green-500">
+          {{ siteName }}
+        </span>
+      </div>
+
+      <div class="items-center justify-center w-full">
+        <h1
+          class="text-[48px] lg:text-[72px] leading-tight text-pretty font-normal text-slate-900 max-w-175 lg:max-w-250"
+          style="display: block; line-clamp: 3; text-overflow: ellipsis; text-wrap: balance;"
+        >
+          {{ title }}
+        </h1>
+      </div>
+
+      <p v-if="description" class="text-slate-500 text-[24px] lg:text-[32px] opacity-70 max-w-162.5 lg:max-w-225 leading-normal">
+        {{ description }}
+      </p>
+    </div>
+  </div>
+</template>

package/app/components/PageHeaderLinks.vue

@@ -1,10 +1,11 @@
 <script setup lang="ts">
+import { useClipboard } from '@vueuse/core'
+
 const route = useRoute()
 const toast = useToast()
 const { copy, copied } = useClipboard()
 const site = useSiteConfig()
-const { vercelAnalytics, ui } = useAppConfig()
-const { track } = useAnalytics()
+const { ui } = useAppConfig()
 
 const appBaseURL = useRuntimeConfig().app?.baseURL || '/'
 
@@ -15,7 +16,6 @@ const items = [[
     label: 'Copy Markdown link',
     icon: 'i-lucide-link',
     onSelect() {
-      if (vercelAnalytics?.debug) track('Page Action', { action: 'Copy Markdown Link' })
       copy(mdPath.value)
       toast.add({
         title: 'Copied to clipboard',
@@ -27,28 +27,19 @@ const items = [[
     label: 'View as Markdown',
     icon: 'i-simple-icons-markdown',
     target: '_blank',
-    to: `/raw${route.path}.md`,
-    onSelect() {
-      if (vercelAnalytics?.debug) track('Page Action', { action: 'View as Markdown' })
-    }
+    to: `/raw${route.path}.md`
   },
   {
     label: 'Open in ChatGPT',
     icon: 'i-simple-icons-openai',
     target: '_blank',
-    to: `https://chatgpt.com/?hints=search&q=${encodeURIComponent(`Read ${mdPath.value} so I can ask questions about it.`)}`,
-    onSelect() {
-      if (vercelAnalytics?.debug) track('Page Action', { action: 'Open in ChatGPT' })
-    }
+    to: `https://chatgpt.com/?hints=search&q=${encodeURIComponent(`Read ${mdPath.value} so I can ask questions about it.`)}`
   },
   {
     label: 'Open in Claude',
     icon: 'i-simple-icons-anthropic',
     target: '_blank',
-    to: `https://claude.ai/new?q=${encodeURIComponent(`Read ${mdPath.value} so I can ask questions about it.`)}`,
-    onSelect() {
-      if (vercelAnalytics?.debug) track('Page Action', { action: 'Open in Claude' })
-    }
+    to: `https://claude.ai/new?q=${encodeURIComponent(`Read ${mdPath.value} so I can ask questions about it.`)}`
   }
 ], [
   {
@@ -77,7 +68,6 @@ const items = [[
 ]]
 
 async function copyPage() {
-  if (vercelAnalytics?.debug) track('Page Action', { action: 'Copy Page Content' })
   copy(await $fetch<string>(`/raw${route.path}.md`))
 }
 </script>

package/app/components/content/CommitChangelog.vue

@@ -1,5 +1,6 @@
 <script setup lang="ts">
 import { camelCase, kebabCase, upperFirst } from 'scule'
+import { useTimeAgo } from '@vueuse/core'
 
 interface Commit {
   sha: string

package/app/components/content/Mermaid.vue

@@ -1,7 +1,6 @@
 <script setup lang="ts">
 import { hash } from 'ohash'
 import type { IconProps } from '@nuxt/ui'
-import type { ClassNameValue } from 'tailwind-merge'
 import {
   useClipboard,
   useElementVisibility,
@@ -10,6 +9,9 @@ import {
 } from '@vueuse/core'
 import { tv } from '@nuxt/ui/utils/tv'
 
+type ClassNameValue = ClassNameArray | string | null | undefined | 0 | 0n | false
+type ClassNameArray = ClassNameValue[]
+
 const theme = {
   slots: {
     root: 'relative my-5 group border border-muted rounded-md overflow-hidden',

package/app/components/header/HeaderCTA.vue

@@ -1,18 +1,9 @@
 <script lang="ts" setup>
-const route = useRoute()
 const { isEnabled: isAiChatEnabled } = useAIChat()
 </script>
 
 <template>
   <div v-if="isAiChatEnabled" class="hidden md:block">
-    <UButton
-      v-if="route.path === '/'"
-      to="/docs"
-      label="Get Started"
-      variant="ghost"
-      trailing
-      icon="i-lucide-arrow-right"
-    />
-    <AiChat v-else />
+    <AiChat />
   </div>
 </template>

package/app/components/theme-picker/ThemePicker.vue

@@ -1,19 +1,10 @@
 <script setup lang="ts">
 import { useClipboard } from '@vueuse/core'
 
-const appConfig = useAppConfig()
 const colorMode = useColorMode()
 
-const { track } = useAnalytics()
-
 const open = ref(false)
 
-watch(open, (isOpen) => {
-  if (isOpen && appConfig.vercelAnalytics?.debug) {
-    track('Theme Picker Opened')
-  }
-})
-
 const { copy: copyCSS, copied: copiedCSS } = useClipboard()
 const { copy: copyAppConfig, copied: copiedAppConfig } = useClipboard()
 
@@ -22,7 +13,7 @@ const {
   neutral,
   primaryColors,
   primary,
-  setBlackAsPrimary,
+  blackAsPrimary,
   radiuses,
   radius,
   fonts,
@@ -58,21 +49,24 @@ const {
           Primary
 
           <UButton
-            to="https://ui.nuxt.com/docs/getting-started/theme/css-variables#colors"
+            to="/docs/getting-started/theme/css-variables#colors"
             size="xs"
             color="neutral"
             variant="link"
-            target="_blank"
-            icon="i-lucide-circle-help"
+            icon="i-lucide-help-circle"
             class="p-0 -my-0.5"
             :ui="{ leadingIcon: 'size-3' }"
           />
         </legend>
 
         <div class="grid grid-cols-3 gap-1 -mx-2">
-          <ThemePickerButton label="Black" :selected="appConfig.theme.blackAsPrimary" @click="setBlackAsPrimary(true)">
+          <ThemePickerButton
+            label="Black"
+            :selected="blackAsPrimary"
+            @click="blackAsPrimary = true"
+          >
             <template #leading>
-              <span class="inline-block w-2 h-2 rounded-full bg-black dark:bg-white" />
+              <span class="inline-block size-2 rounded-full bg-black dark:bg-white" />
             </template>
           </ThemePickerButton>
 
@@ -81,7 +75,7 @@ const {
             :key="color"
             :label="color"
             :chip="color"
-            :selected="!appConfig.theme.blackAsPrimary && primary === color"
+            :selected="!blackAsPrimary && primary === color"
             @click="primary = color"
           />
         </div>
@@ -92,12 +86,11 @@ const {
           Neutral
 
           <UButton
-            to="https://ui.nuxt.com/docs/getting-started/theme/css-variables#text"
+            to="/docs/getting-started/theme/css-variables#text"
             size="xs"
             color="neutral"
             variant="link"
-            target="_blank"
-            icon="i-lucide-circle-help"
+            icon="i-lucide-help-circle"
             class="p-0 -my-0.5"
             :ui="{ leadingIcon: 'size-3' }"
           />
@@ -120,12 +113,11 @@ const {
           Radius
 
           <UButton
-            to="https://ui.nuxt.com/docs/getting-started/theme/css-variables#radius"
+            to="/docs/getting-started/theme/css-variables#radius"
             size="xs"
             color="neutral"
             variant="link"
-            target="_blank"
-            icon="i-lucide-circle-help"
+            icon="i-lucide-help-circle"
             class="p-0 -my-0.5"
             :ui="{ leadingIcon: 'size-3' }"
           />
@@ -148,12 +140,11 @@ const {
           Font
 
           <UButton
-            to="https://ui.nuxt.com/docs/getting-started/integrations/fonts"
+            to="/docs/getting-started/integrations/fonts"
             size="xs"
             color="neutral"
             variant="link"
-            target="_blank"
-            icon="i-lucide-circle-help"
+            icon="i-lucide-help-circle"
             class="p-0 -my-0.5"
             :ui="{ leadingIcon: 'size-3' }"
           />
@@ -177,12 +168,11 @@ const {
           Icons
 
           <UButton
-            to="https://ui.nuxt.com/docs/getting-started/integrations/icons"
+            to="/docs/getting-started/integrations/icons"
             size="xs"
             color="neutral"
             variant="link"
-            target="_blank"
-            icon="i-lucide-circle-help"
+            icon="i-lucide-help-circle"
             class="p-0 -my-0.5"
             :ui="{ leadingIcon: 'size-3' }"
           />
@@ -206,12 +196,11 @@ const {
           Color Mode
 
           <UButton
-            to="https://ui.nuxt.com/docs/getting-started/integrations/color-mode"
+            to="/docs/getting-started/integrations/color-mode"
             size="xs"
             color="neutral"
             variant="link"
-            target="_blank"
-            icon="i-lucide-circle-help"
+            icon="i-lucide-help-circle"
             class="p-0 -my-0.5"
             :ui="{ leadingIcon: 'size-3' }"
           />
@@ -241,7 +230,7 @@ const {
             size="sm"
             label="main.css"
             class="flex-1 text-[11px]"
-            :icon="copiedCSS ? appConfig.ui.icons.copyCheck : appConfig.ui.icons.copy"
+            :icon="copiedCSS ? 'i-lucide-copy-check' : 'i-lucide-copy'"
             @click="copyCSS(exportCSS())"
           />
           <UButton
@@ -250,7 +239,7 @@ const {
             variant="soft"
             size="sm"
             label="app.config.ts"
-            :icon="copiedAppConfig ? appConfig.ui.icons.copyCheck : appConfig.ui.icons.copy"
+            :icon="copiedAppConfig ? 'i-lucide-copy-check' : 'i-lucide-copy'"
             class="flex-1 text-[11px]"
             @click="copyAppConfig(exportAppConfig())"
           />