md2ui 1.0.18 → 1.0.20

package/public/docs/03-/350/277/233/351/230/266/346/214/207/345/215/227/02-/350/207/252/345/256/232/344/271/211/351/205/215/347/275/256.md

@@ -1,63 +0,0 @@
-# 自定义配置
-
-md2ui 支持多种自定义配置，满足不同场景需求。
-
-## 修改网站标题
-
-编辑 `index.html`：
-
-```html
-<title>你的文档站点</title>
-```
-
-## 修改 Logo
-
-编辑 `src/components/Logo.vue`：
-
-```vue
-<span class="logo-text">你的项目名</span>
-```
-
-或替换 `public/logo.svg` 图标文件。
-
-## 修改首页
-
-编辑 `public/README.md` 文件，这是点击 Logo 后显示的首页内容。
-
-## 修改端口
-
-编辑 `vite.config.js`：
-
-```javascript
-export default defineConfig({
-  server: {
-    port: 3000
-  }
-})
-```
-
-## 样式定制
-
-全局样式在 `src/style.css` 中，主要变量：
-
-```css
-/* 颜色 */
---primary-color: #3b82f6;
---text-color: #1f2937;
---bg-color: #ffffff;
---border-color: #e5e7eb;
-
-/* 尺寸 */
---sidebar-width: 280px;
---toc-width: 240px;
-```
-
-## 文档排序规则
-
-文件名格式：`序号-名称.md`
-
-- `00-快速开始.md` 排在最前
-- `01-使用指南.md` 排在其后
-- 没有序号的文件按字母排序
-
-文件夹同样支持序号前缀。

package/public/docs/03-/350/277/233/351/230/266/346/214/207/345/215/227/03-/351/203/250/347/275/262/346/226/271/346/241/210.md

@@ -1,73 +0,0 @@
-# 部署方案
-
-md2ui 构建后是纯静态文件，可部署到任意静态服务器。
-
-## 构建
-
-```bash
-pnpm build
-```
-
-构建产物在 `dist/` 目录。
-
-## Nginx 部署
-
-```nginx
-server {
-    listen 80;
-    server_name docs.example.com;
-    root /var/www/md2ui/dist;
-    index index.html;
-
-    # 支持 HTML5 History 模式
-    location / {
-        try_files $uri $uri/ /index.html;
-    }
-
-    # 静态资源缓存
-    location ~* \.(js|css|png|jpg|jpeg|gif|ico|svg)$ {
-        expires 30d;
-        add_header Cache-Control "public, immutable";
-    }
-}
-```
-
-## Docker 部署
-
-项目已包含 Dockerfile：
-
-```bash
-# 构建镜像
-docker build -t md2ui .
-
-# 运行容器
-docker run -d -p 3000:3000 md2ui
-```
-
-## 部署流程
-
-```mermaid
-flowchart LR
-    A[代码提交] --> B[CI 构建]
-    B --> C[生成 dist]
-    C --> D{部署目标}
-    D --> E[Nginx]
-    D --> F[Docker]
-    D --> G[CDN]
-```
-
-## GitHub Pages
-
-1. 修改 `vite.config.js` 设置 base 路径：
-
-```javascript
-export default defineConfig({
-  base: '/your-repo-name/'
-})
-```
-
-2. 构建并推送到 gh-pages 分支
-
-## Vercel / Netlify
-
-直接连接 Git 仓库，自动构建部署，无需额外配置。

package/public/docs/04-API/345/217/202/350/200/203/01-/347/273/204/344/273/266API.md

@@ -1,80 +0,0 @@
-# 组件 API
-
-md2ui 的核心组件及其接口说明。
-
-## TreeNode
-
-树形节点组件，用于渲染文档导航。
-
-### Props
-
-| 属性 | 类型 | 说明 |
-|------|------|------|
-| item | Object | 节点数据 |
-| currentDoc | String | 当前选中的文档 |
-
-### Events
-
-| 事件 | 参数 | 说明 |
-|------|------|------|
-| toggle | folder | 切换文件夹展开状态 |
-| select | docKey | 选中文档 |
-
-### item 数据结构
-
-```javascript
-{
-  key: 'docs/guide.md',      // 唯一标识
-  name: '使用指南',           // 显示名称
-  type: 'file',              // 类型: file | folder
-  path: '/docs/guide.md',    // 文件路径
-  expanded: false,           // 是否展开(仅文件夹)
-  children: []               // 子节点(仅文件夹)
-}
-```
-
-## TableOfContents
-
-文档目录组件，显示当前文档的标题大纲。
-
-### Props
-
-| 属性 | 类型 | 说明 |
-|------|------|------|
-| tocItems | Array | 目录项列表 |
-| activeHeading | String | 当前高亮的标题 ID |
-| collapsed | Boolean | 是否折叠 |
-| width | Number | 组件宽度 |
-
-### Events
-
-| 事件 | 参数 | 说明 |
-|------|------|------|
-| scroll-to | headingId | 跳转到指定标题 |
-
-### tocItems 数据结构
-
-```javascript
-[
-  { id: 'heading-1', text: '快速开始', level: 1 },
-  { id: 'heading-2', text: '安装', level: 2 },
-  { id: 'heading-3', text: '配置', level: 2 }
-]
-```
-
-## ImageZoom
-
-图片放大组件。
-
-### Props
-
-| 属性 | 类型 | 说明 |
-|------|------|------|
-| visible | Boolean | 是否显示 |
-| imageContent | String | 图片 HTML 内容 |
-
-### Events
-
-| 事件 | 说明 |
-|------|------|
-| close | 关闭放大视图 |

package/public/docs/04-API/345/217/202/350/200/203/02-Composables.md

@@ -1,92 +0,0 @@
-# Composables
-
-md2ui 使用 Vue 3 Composition API，将可复用逻辑封装为 composables。
-
-## useMarkdown
-
-Markdown 渲染相关逻辑。
-
-### 返回值
-
-```javascript
-const { 
-  htmlContent,    // ref<string> - 渲染后的 HTML
-  tocItems,       // ref<array> - 目录项列表
-  renderMarkdown  // function - 渲染方法
-} = useMarkdown()
-```
-
-### renderMarkdown
-
-```javascript
-// 渲染 Markdown 文本
-await renderMarkdown(markdownText)
-```
-
-处理流程：
-
-```mermaid
-flowchart TD
-    A[Markdown 文本] --> B[marked 解析]
-    B --> C[提取标题]
-    C --> D[处理 Mermaid]
-    D --> E[输出 HTML]
-```
-
-## useScroll
-
-滚动相关逻辑。
-
-### 返回值
-
-```javascript
-const {
-  scrollProgress,  // ref<number> - 阅读进度 0-100
-  showBackToTop,   // ref<boolean> - 是否显示返回顶部
-  activeHeading,   // ref<string> - 当前高亮标题 ID
-  handleScroll,    // function - 滚动事件处理
-  scrollToHeading, // function - 跳转到标题
-  scrollToTop      // function - 返回顶部
-} = useScroll()
-```
-
-### 使用示例
-
-```vue
-<template>
-  <main @scroll="handleScroll">
-    <!-- 内容 -->
-  </main>
-  <button v-if="showBackToTop" @click="scrollToTop">
-    返回顶部 {{ scrollProgress }}%
-  </button>
-</template>
-```
-
-## useResize
-
-拖拽调整宽度逻辑。
-
-### 返回值
-
-```javascript
-const {
-  sidebarWidth,  // ref<number> - 侧边栏宽度
-  tocWidth,      // ref<number> - 目录宽度
-  startResize    // function - 开始拖拽
-} = useResize()
-```
-
-### 使用示例
-
-```vue
-<template>
-  <aside :style="{ width: sidebarWidth + 'px' }">
-    <!-- 侧边栏 -->
-  </aside>
-  <div 
-    class="resizer" 
-    @mousedown="startResize('left', $event)"
-  ></div>
-</template>
-```

package/src/api/docs.js

@@ -1,106 +0,0 @@
-import { config } from '../config.js'
-
-// 构建目录树结构（支持多层嵌套）
-function buildTree(files) {
-  const root = { children: [] }
-  
-  files.forEach(file => {
-    const parts = file.relativePath.split('/')
-    let currentLevel = root
-    
-    for (let i = 0; i < parts.length - 1; i++) {
-      const folderName = parts[i]
-      const folderPath = parts.slice(0, i + 1).join('/')
-      
-      let folder = currentLevel.children.find(item => item.key === folderPath)
-      
-      if (!folder) {
-        const match = folderName.match(/^(\d+)-(.+)$/)
-        const folderLabel = match ? match[2] : folderName
-        const cleanFolderLabel = folderLabel.replace(/[。.]$/, '')
-        folder = {
-          type: 'folder',
-          key: folderPath,
-          label: cleanFolderLabel,
-          order: match ? parseInt(match[1]) : 999,
-          level: i,
-          children: [],
-          expanded: config.folderExpanded
-        }
-        currentLevel.children.push(folder)
-      }
-      
-      currentLevel = folder
-    }
-    
-    currentLevel.children.push({
-      type: 'file',
-      ...file
-    })
-  })
-  
-  function sortChildren(node) {
-    if (node.children) {
-      node.children.sort((a, b) => a.order - b.order)
-      node.children.forEach(child => sortChildren(child))
-    }
-  }
-  
-  sortChildren(root)
-  return root.children
-}
-
-// 获取文档列表
-export async function getDocsList() {
-  // 尝试 CLI 模式：检查是否有用户文档 API
-  try {
-    const response = await fetch('/@user-docs-list')
-    if (response.ok) {
-      return await response.json()
-    }
-  } catch {
-    // 忽略错误，继续使用开发模式
-  }
-
-  // 开发模式：扫描 public/docs 目录
-  try {
-    // 排除隐藏目录和隐藏文件（以 . 开头的路径段）
-    const modules = import.meta.glob('/public/docs/**/*.md', { eager: false })
-    const files = []
-    
-    for (const path in modules) {
-      const relativePath = path.replace('/public/docs/', '').replace('.md', '')
-      const parts = relativePath.split('/')
-      const fileName = parts[parts.length - 1]
-      
-      const match = fileName.match(/^(\d+)-(.+)$/)
-      if (match) {
-        const [, order, name] = match
-        const cleanName = name.replace(/[。.]$/, '')
-        files.push({
-          key: relativePath,
-          label: cleanName,
-          order: parseInt(order),
-          path: `/docs/${relativePath}.md`,
-          relativePath,
-          level: parts.length - 1
-        })
-      } else {
-        const cleanFileName = fileName.replace(/[。.]$/, '')
-        files.push({
-          key: relativePath,
-          label: cleanFileName,
-          order: 999,
-          path: `/docs/${relativePath}.md`,
-          relativePath,
-          level: parts.length - 1
-        })
-      }
-    }
-    
-    return buildTree(files)
-  } catch (error) {
-    console.error('获取文档列表失败:', error)
-    return []
-  }
-}

package/src/components/SearchPanel.vue

@@ -1,90 +0,0 @@
-<template>
-  <teleport to="body">
-    <div v-if="visible" class="search-overlay" @click.self="$emit('close')">
-      <div class="search-panel">
-        <div class="search-input-wrapper">
-          <Search :size="18" class="search-icon" />
-          <input
-            ref="inputRef"
-            type="text"
-            class="search-input"
-            placeholder="搜索文档..."
-            :value="query"
-            @input="$emit('search', $event.target.value)"
-            @keydown.escape="$emit('close')"
-            @keydown.enter="handleEnter"
-            @keydown.up.prevent="moveSelection(-1)"
-            @keydown.down.prevent="moveSelection(1)"
-          />
-          <kbd class="search-kbd">ESC</kbd>
-        </div>
-        <div class="search-results" v-if="query">
-          <div v-if="results.length === 0" class="search-empty">
-            没有找到相关文档
-          </div>
-          <div
-            v-for="(item, index) in results"
-            :key="item.key"
-            :class="['search-result-item', { active: index === selectedIndex }]"
-            @click="selectResult(item)"
-            @mouseenter="selectedIndex = index"
-          >
-            <FileText :size="16" class="result-icon" />
-            <span class="result-title">{{ item.title }}</span>
-          </div>
-        </div>
-        <div class="search-footer" v-if="!query">
-          <span class="search-tip">输入关键词搜索文档内容</span>
-        </div>
-      </div>
-    </div>
-  </teleport>
-</template>
-
-<script setup>
-import { ref, watch, nextTick } from 'vue'
-import { Search, FileText } from 'lucide-vue-next'
-
-const props = defineProps({
-  visible: { type: Boolean, default: false },
-  query: { type: String, default: '' },
-  results: { type: Array, default: () => [] }
-})
-
-const emit = defineEmits(['close', 'search', 'select'])
-const inputRef = ref(null)
-const selectedIndex = ref(0)
-
-// 面板打开时自动聚焦输入框
-watch(() => props.visible, (val) => {
-  if (val) {
-    selectedIndex.value = 0
-    nextTick(() => inputRef.value?.focus())
-  }
-})
-
-// 搜索结果变化时重置选中
-watch(() => props.results, () => {
-  selectedIndex.value = 0
-})
-
-// 键盘上下移动选中项
-function moveSelection(delta) {
-  const len = props.results.length
-  if (len === 0) return
-  selectedIndex.value = (selectedIndex.value + delta + len) % len
-}
-
-// 回车选中
-function handleEnter() {
-  if (props.results.length > 0) {
-    selectResult(props.results[selectedIndex.value])
-  }
-}
-
-// 选中结果
-function selectResult(item) {
-  emit('select', item.key)
-  emit('close')
-}
-</script>