@opentinyvue/vue-docs 3.28.0 → 3.28.2

package/demos/pc/app/cascader/filter-mode-composition-api.vue

@@ -168,5 +168,6 @@ const options = ref([
   }
 ])
 
-const value = 'anzhuangcli'
+// 使用 ref 创建响应式引用，这样才能用于 v-model 双向绑定
+const value = ref('anzhuangcli')
 </script>

package/demos/pc/app/icon/advance-icons.js

@@ -402,6 +402,7 @@ export const batch3Icons = [
   'IconTermination',
   'IconTimezone',
   'IconTrain',
+  'IconTransfer',
   'IconTransferInventoryList',
   'IconTransferringInventoryListsAcrossOrganizations',
   'IconTransportation',
@@ -409,106 +410,3 @@ export const batch3Icons = [
   'IconWaybill',
   'IconWorkOvertime'
 ]
-
-export const batch4Icons = [
-  'IconAIAbout',
-  'IconAIApplication',
-  'IconAIBrowsingHistory',
-  'IconAICalendar',
-  'IconAIComputingPowerAIPolicy',
-  'IconAIConferenceManagement',
-  'IconAIDocument',
-  'IconAIDocumentQA',
-  'IconAIExternalKnowledgeAnswer',
-  'IconAIFindRecords',
-  'IconAIFollowUp',
-  'IconAIGCPainting',
-  'IconAIImageBasedTextRecognition',
-  'IconAIInformation',
-  'IconAIInternalKnowledgeAnswers',
-  'IconAIITServiceQA',
-  'IconAILabelExtraction',
-  'IconAIMemorySpace',
-  'IconAIOfficeDataSearch',
-  'IconAIOrganization',
-  'IconAIPosting',
-  'IconAIProcessQA',
-  'IconAIQuestion',
-  'IconAIReading',
-  'IconAISearch',
-  'IconAISearchPeople',
-  'IconAISearchQA',
-  'IconAISmartLookup',
-  'IconAISmartNotes',
-  'IconAISmartTranslation',
-  'IconAITakingPhotos',
-  'IconAITechnicalInsightsQA',
-  'IconAITerminologyQA',
-  'IconAITranslation',
-  'IconAIUCDSearch',
-  'IconAIWebQA',
-  'IconAIWrite',
-  'IconAIWriting',
-  'IconAnalysisTypeContainer',
-  'IconAnchor',
-  'IconApprovalFlow',
-  'IconAvatar',
-  'IconBadge',
-  'IconButtonBar',
-  'IconCalendarView',
-  'IconCardGroup',
-  'IconCardTemplate',
-  'IconCarousel',
-  'IconCascader',
-  'IconChart',
-  'IconCheckbox',
-  'IconChooser',
-  'IconCreatePage',
-  'IconDetailsTemplatePage',
-  'IconDialogSelect',
-  'IconFilterView',
-  'IconFloating',
-  'IconFlowchart',
-  'IconFoldingPanelContainers',
-  'IconForm',
-  'IconGeneralPage',
-  'IconGrid',
-  'IconImage',
-  'IconInput',
-  'IconListSheet',
-  'IconMetAlert',
-  'IconMultiColumnContainer',
-  'IconMultipleContainerGroups',
-  'IconNavigationContainer',
-  'IconNumber',
-  'IconNumeric',
-  'IconObjectInfo',
-  'IconPageLoader',
-  'IconPager',
-  'IconProcessOverview',
-  'IconProgress',
-  'IconRadio',
-  'IconRecord',
-  'IconRuleBuilder',
-  'IconSelection',
-  'IconSelectView',
-  'IconShortcut',
-  'IconSlider',
-  'IconSliderButton',
-  'IconSplitPanelContainer',
-  'IconSpreadGrid',
-  'IconStandardList',
-  'IconSteps',
-  'IconSwitch',
-  'IconSwitchCard',
-  'IconTabContainer',
-  'IconTabs',
-  'IconTag',
-  'IconTagGroup',
-  'IconTimeLine',
-  'IconTimePicker',
-  'IconTitleContainer',
-  'IconTransfer',
-  'IconTree',
-  'IconTreeMenuContainer'
-]

package/demos/pc/app/icon/advance-usage-composition-api.vue

@@ -72,35 +72,13 @@
         <span class="svgs-text" :title="name">{{ name }}</span>
       </div>
     </div>
-    <hr />
-    <div class="svgs-wrapper">
-      <div
-        v-for="name in batch4Icons"
-        :key="name"
-        :class="{
-          'svg-visible': searchName === '' || name.toLowerCase().includes(searchName.toLowerCase()),
-          'svgs-item': true
-        }"
-        @click="click(name)"
-      >
-        <component
-          :is="Svgs[name] && Svgs[name]()"
-          class="svgs-icon"
-          :first-color="firstColor"
-          :second-color="secondColor"
-          :shape="shape"
-          :underlay="isUnderlay ? underlay : null"
-        ></component>
-        <span class="svgs-text" :title="name">{{ name }}</span>
-      </div>
-    </div>
   </div>
 </template>
 
 <script setup lang="js">
 import Svgs from '@opentiny/vue-icon'
 import { TinyForm, TinyFormItem, TinyModal, TinyInput, TinyRadioGroup, TinyRadio, TinySwitch } from '@opentiny/vue'
-import { advanceIcons, batch3Icons, batch4Icons } from './advance-icons.js'
+import { advanceIcons, batch3Icons } from './advance-icons.js'
 import { getCurrentInstance, ref, watch } from 'vue'
 
 const searchName = ref('')

package/demos/pc/app/icon/advance-usage.vue

@@ -72,28 +72,6 @@
         <span class="svgs-text" :title="name">{{ name }}</span>
       </div>
     </div>
-    <hr />
-    <div class="svgs-wrapper">
-      <div
-        v-for="name in batch4Icons"
-        :key="name"
-        :class="{
-          'svg-visible': searchName === '' || name.toLowerCase().includes(searchName.toLowerCase()),
-          'svgs-item': true
-        }"
-        @click="click(name)"
-      >
-        <component
-          :is="Svgs[name] && Svgs[name]()"
-          class="svgs-icon"
-          :first-color="firstColor"
-          :second-color="secondColor"
-          :shape="shape"
-          :underlay="isUnderlay ? underlay : null"
-        ></component>
-        <span class="svgs-text" :title="name">{{ name }}</span>
-      </div>
-    </div>
   </div>
 </template>
 
@@ -109,7 +87,7 @@ import {
   TinyColorPicker,
   TinySwitch
 } from '@opentiny/vue'
-import { advanceIcons, batch3Icons, batch4Icons } from './advance-icons.js'
+import { advanceIcons, batch3Icons } from './advance-icons.js'
 
 export default {
   components: {
@@ -126,7 +104,6 @@ export default {
       Svgs,
       advanceIcons,
       batch3Icons,
-      batch4Icons,
       searchName: '',
       shape: 'line',
       firstColor: '#0067D1',

package/demos/pc/app/tabs/tooltip-composition-api.vue

@@ -18,7 +18,7 @@ import { TinyTabs, TinyTabItem, TinySwitch } from '@opentiny/vue'
 
 const activeName4 = ref('navigation1')
 const tooltipConfig = ref({ effect: 'light', placement: 'left', visible: 'auto' })
-const value = true
+const value = ref(true)
 const tabs3 = ref([
   {
     name: 'navigation1',

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@opentinyvue/vue-docs",
   "type": "module",
-  "version": "3.28.0",
+  "version": "3.28.2",
   "license": "MIT",
   "devDependencies": {
     "@playwright/test": "~1.49.0",
@@ -64,25 +64,25 @@
     "vue-i18n": "~9.14.3",
     "vue-router": "4.1.5",
     "zod": "^3.24.4",
-    "@opentiny/utils": "npm:@opentinyvue/utils@~3.28.0",
     "@opentiny-internal/unplugin-virtual-template": "~0.1.1-beta.0",
-    "@opentiny/vue": "~3.28.0",
+    "@opentiny/utils": "~3.28.0",
     "@opentiny/vue-common": "~3.28.0",
-    "@opentiny/vue-design-aurora": "~3.28.0",
     "@opentiny/vue-design-saas": "~3.28.0",
+    "@opentiny/vue-design-aurora": "~3.28.0",
+    "@opentiny/vue-design-smb": "~3.28.0",
+    "@opentiny/vue": "~3.28.0",
     "@opentiny/vue-directive": "~3.28.0",
     "@opentiny/vue-flowchart": "~3.28.0",
-    "@opentiny/vue-design-smb": "~3.28.0",
-    "@opentiny/vue-hooks": "npm:@opentinyvue/vue-hooks@~3.28.0",
-    "@opentiny/vue-huicharts": "~3.28.0",
-    "@opentiny/vue-icon": "~3.28.0",
+    "@opentiny/vue-hooks": "~3.28.0",
     "@opentiny/vue-icon-multicolor": "~3.28.0",
     "@opentiny/vue-icon-saas": "~3.28.0",
+    "@opentiny/vue-icon": "~3.28.0",
     "@opentiny/vue-modal": "~3.28.0",
     "@opentiny/vue-locale": "~3.28.0",
     "@opentiny/vue-renderless": "~3.28.0",
-    "@opentiny/vue-theme": "~3.28.0",
-    "@opentiny/vue-theme-saas": "~3.28.0"
+    "@opentiny/vue-huicharts": "~3.28.0",
+    "@opentiny/vue-theme-saas": "~3.28.0",
+    "@opentiny/vue-theme": "~3.28.0"
   },
   "scripts": {
     "start": "vite",

package/demos/pc/webdoc/v3.28.0-release-article.md

@@ -1,943 +0,0 @@
-# 🎉 Tiny Vue 3.28.0 震撼发布：选择器家族大重构！
-
-> **发布日期：2025 年 12 月 29 日**  
-> 这是一个让选择器组件"脱胎换骨"的版本！
-
----
-
-## 📢 版本速览
-
-![版本号徽章](https://img.shields.io/badge/version-3.28.0-blue)
-![Vue2支持](https://img.shields.io/badge/Vue2-✅-green)
-![Vue3支持](https://img.shields.io/badge/Vue3-✅-green)
-
-**v3.28.0** 版本带来了：
-
-- 🎯 **选择器组件家族全面重构** - 统一架构，性能提升
-- 🎨 **主题动画全局配置** - 一键定制，随心所欲
-- 🐛 **65+ Bug 修复** - 稳定性大幅提升
-
----
-
-## 🚀 核心亮点：选择器组件"家族重组"
-
-### 从"各自为政"到"统一架构"
-
-还记得之前那些"长得像但代码不统一"的选择器组件吗？`select`、`tree-select`、`grid-select`、`base-select` 各自为政，维护起来让人头疼。
-
-![选择器组件对比图]
-
-```
-旧版本：select | tree-select | grid-select | base-select
-        ↓        ↓             ↓            ↓
-       各自维护，代码重复，体验不一致
-
-新版本：        select-wrapper
-        ↓        ↓             ↓            ↓
-      统一架构，代码复用，体验一致
-```
-
-**这次重构，我们做了三件大事：**
-
-1. **统一架构设计** - 所有选择器组件都基于 `select-wrapper` 构建
-2. **代码同步优化** - `base-select` 与 `select` 组件代码完全同步
-3. **性能大幅提升** - 减少重复代码，提升渲染效率
-
-### 重构背后的技术细节
-
-#### 为什么需要重构？
-
-在重构之前，每个选择器组件都有自己独立的实现逻辑：
-
-- **代码重复率高** - 相同的功能在多个组件中重复实现，维护成本高
-- **体验不一致** - 不同组件的交互方式、样式表现存在差异
-- **扩展困难** - 新增功能需要在多个组件中同步修改
-- **性能瓶颈** - 重复的代码导致包体积增大，运行时性能受影响
-
-#### 新架构的优势
-
-通过引入 `select-wrapper` 作为核心基础组件，我们实现了：
-
-**1. 统一的 API 设计**
-所有选择器组件现在共享相同的核心 API，使用方式更加一致：
-
-```vue
-<!-- 基础选择器 -->
-<tiny-select v-model="value" :options="options" />
-
-<!-- 树形选择器 -->
-<tiny-tree-select v-model="value" :data="treeData" />
-
-<!-- 表格选择器 -->
-<tiny-grid-select v-model="value" :data="gridData" />
-```
-
-**2. 代码复用率提升 60%+**
-通过抽取公共逻辑到 `select-wrapper`，代码重复率从原来的 70% 降低到 10% 以下。
-
-**3. 维护成本降低**
-现在只需要在一个地方（`select-wrapper`）修复 bug 或添加功能，所有选择器组件都能自动受益。
-
-**4. 性能优化**
-
-- 减少了组件初始化时间
-- 降低了内存占用
-- 提升了渲染性能
-
-### 实际使用场景
-
-#### 场景一：基础下拉选择
-
-```vue
-<template>
-  <tiny-select v-model="selectedValue" :options="options" placeholder="请选择" clearable filterable />
-</template>
-
-<script>
-export default {
-  data() {
-    return {
-      selectedValue: '',
-      options: [
-        { label: '选项1', value: '1' },
-        { label: '选项2', value: '2' },
-        { label: '选项3', value: '3' }
-      ]
-    }
-  }
-}
-</script>
-```
-
-#### 场景二：树形数据选择
-
-```vue
-<template>
-  <tiny-tree-select v-model="selectedIds" :data="treeData" multiple check-strictly :default-expand-all="true" />
-</template>
-
-<script>
-export default {
-  data() {
-    return {
-      selectedIds: [],
-      treeData: [
-        {
-          id: '1',
-          label: '一级节点',
-          children: [
-            { id: '1-1', label: '二级节点1' },
-            { id: '1-2', label: '二级节点2' }
-          ]
-        }
-      ]
-    }
-  }
-}
-</script>
-```
-
-#### 场景三：表格数据选择
-
-```vue
-<template>
-  <tiny-grid-select v-model="selectedRows" :data="tableData" :columns="columns" multiple :pager="pager" />
-</template>
-```
-
-### 新增功能：懒加载支持
-
-`tree-select` 现在支持懒加载了！想象一下，一个包含 10,000 个节点的树形选择器，以前需要一次性加载所有数据，现在可以按需加载，性能提升不是一点点！
-
-#### 懒加载的使用场景
-
-懒加载特别适合以下场景：
-
-1. **大数据量树形结构** - 当树节点数量超过 1000 个时，懒加载可以显著提升性能
-2. **动态数据加载** - 数据需要从服务器按需获取
-3. **减少初始加载时间** - 只加载用户需要查看的节点
-
-#### 完整示例
-
-```vue
-<template>
-  <tiny-tree-select v-model="selectedValue" lazy :load="loadNode" :props="props" />
-</template>
-
-<script>
-export default {
-  data() {
-    return {
-      selectedValue: '',
-      props: {
-        label: 'name',
-        children: 'children',
-        isLeaf: 'leaf'
-      }
-    }
-  },
-  methods: {
-    loadNode(node, resolve) {
-      // 如果是根节点
-      if (node.level === 0) {
-        // 加载第一层数据
-        this.fetchRootNodes().then((data) => {
-          resolve(data)
-        })
-      } else {
-        // 加载子节点数据
-        this.fetchChildNodes(node.data.id).then((data) => {
-          resolve(data)
-        })
-      }
-    },
-    async fetchRootNodes() {
-      // 模拟 API 调用
-      const response = await fetch('/api/tree/root')
-      return response.json()
-    },
-    async fetchChildNodes(parentId) {
-      const response = await fetch(`/api/tree/children/${parentId}`)
-      return response.json()
-    }
-  }
-}
-</script>
-```
-
-#### 性能对比
-
-![懒加载效果对比图]
-
-| 节点数量 | 旧版本加载时间 | 新版本初始加载时间 | 性能提升 |
-| -------- | -------------- | ------------------ | -------- |
-| 1,000    | 800ms          | 50ms               | 16x      |
-| 5,000    | 4,200ms        | 50ms               | 84x      |
-| 10,000   | 8,500ms        | 50ms               | 170x     |
-
-- **旧版本**：一次性加载所有节点，页面卡顿 😫
-- **新版本**：按需加载，丝滑流畅 ✨
-
-#### 懒加载最佳实践
-
-1. **合理设置 `isLeaf` 属性** - 明确标识哪些节点是叶子节点，避免不必要的加载请求
-2. **使用缓存机制** - 对已加载的节点进行缓存，避免重复请求
-3. **错误处理** - 添加适当的错误处理逻辑，提升用户体验
-
----
-
-## 🎨 主题动画：一键定制，随心所欲
-
-### 全局动画配置
-
-以前想要修改组件的动画效果？需要深入到每个组件的样式文件中修改。现在，只需要在主题配置中统一设置！
-
-#### 为什么需要全局动画配置？
-
-在之前的版本中，每个组件的动画都是硬编码在组件内部的：
-
-- **维护困难** - 需要修改多个文件才能统一动画风格
-- **不一致** - 不同组件的动画时长、缓动函数可能不同
-- **定制困难** - 想要统一修改所有组件的动画效果几乎不可能
-
-现在，通过全局动画配置，你可以：
-
-- **统一管理** - 所有组件动画统一配置
-- **灵活定制** - 支持全局和局部配置
-- **性能优化** - 动画性能进一步提升
-
-#### 完整配置示例
-
-```javascript
-// theme.js
-export default {
-  animation: {
-    // 全局动画时长
-    duration: {
-      fast: '0.15s', // 快速动画
-      normal: '0.3s', // 正常动画
-      slow: '0.5s' // 慢速动画
-    },
-    // 缓动函数
-    easing: {
-      easeIn: 'cubic-bezier(0.4, 0, 1, 1)',
-      easeOut: 'cubic-bezier(0, 0, 0.2, 1)',
-      easeInOut: 'cubic-bezier(0.4, 0, 0.2, 1)',
-      linear: 'linear'
-    },
-    // 组件特定动画
-    components: {
-      modal: {
-        fadeIn: '0.3s ease-out',
-        fadeOut: '0.2s ease-in'
-      },
-      drawer: {
-        slideIn: '0.3s ease-out',
-        slideOut: '0.2s ease-in'
-      },
-      dropdown: {
-        fadeIn: '0.15s ease-out',
-        fadeOut: '0.1s ease-in'
-      }
-    }
-  }
-}
-```
-
-#### 在项目中使用
-
-```javascript
-// main.js
-import { createApp } from 'vue'
-import TinyVue from '@opentiny/vue'
-import theme from './theme'
-
-const app = createApp(App)
-app.use(TinyVue, {
-  theme
-})
-```
-
-#### 局部覆盖配置
-
-如果你只想修改某个特定组件的动画，可以在组件级别进行覆盖：
-
-```vue
-<template>
-  <tiny-modal v-model="visible" :animation-duration="0.5" animation-easing="ease-in-out"> 内容 </tiny-modal>
-</template>
-```
-
-#### 支持的动画类型
-
-- **淡入淡出** (fade) - 用于 Modal、Popover 等组件
-- **滑动** (slide) - 用于 Drawer、Collapse 等组件
-- **缩放** (scale) - 用于 Tooltip、Popover 等组件
-- **旋转** (rotate) - 用于 Loading、Icon 等组件
-
-![动画配置效果图]
-
-#### 性能优化建议
-
-1. **使用 CSS 动画而非 JS 动画** - 利用 GPU 加速
-2. **合理设置动画时长** - 避免过长的动画影响用户体验
-3. **使用 `will-change` 属性** - 提示浏览器进行优化
-4. **减少动画数量** - 在低性能设备上可以禁用部分动画
-
----
-
-## 🎯 其他重要更新
-
-### 下拉菜单右键支持
-
-`dropdown` 组件现在支持右键菜单触发了！这对于需要上下文菜单的场景非常有用。
-
-#### 使用场景
-
-右键菜单在很多业务场景中都非常常见：
-
-- **表格行操作** - 在表格行上右键显示操作菜单
-- **文件管理** - 文件列表的右键菜单
-- **编辑器** - 文本编辑器的上下文菜单
-- **图形界面** - 画布元素的右键菜单
-
-#### 完整示例
-
-```vue
-<template>
-  <div>
-    <!-- 基础右键菜单 -->
-    <tiny-dropdown trigger="contextmenu">
-      <template #default>
-        <div class="context-target">右键点击我显示菜单</div>
-      </template>
-      <template #dropdown>
-        <tiny-dropdown-menu>
-          <tiny-dropdown-item @click="handleCopy">复制</tiny-dropdown-item>
-          <tiny-dropdown-item @click="handleCut">剪切</tiny-dropdown-item>
-          <tiny-dropdown-item divided @click="handleDelete">删除</tiny-dropdown-item>
-        </tiny-dropdown-menu>
-      </template>
-    </tiny-dropdown>
-
-    <!-- 表格行右键菜单 -->
-    <tiny-grid :data="tableData">
-      <tiny-grid-column prop="name" label="名称" />
-      <tiny-grid-column label="操作">
-        <template #default="{ row }">
-          <tiny-dropdown trigger="contextmenu">
-            <template #default>
-              <span>右键操作</span>
-            </template>
-            <template #dropdown>
-              <tiny-dropdown-menu>
-                <tiny-dropdown-item @click="handleEdit(row)">编辑</tiny-dropdown-item>
-                <tiny-dropdown-item @click="handleDelete(row)">删除</tiny-dropdown-item>
-              </tiny-dropdown-menu>
-            </template>
-          </tiny-dropdown>
-        </template>
-      </tiny-grid-column>
-    </tiny-grid>
-  </div>
-</template>
-
-<script>
-export default {
-  data() {
-    return {
-      tableData: [
-        { id: 1, name: '数据1' },
-        { id: 2, name: '数据2' }
-      ]
-    }
-  },
-  methods: {
-    handleCopy() {
-      console.log('复制操作')
-    },
-    handleCut() {
-      console.log('剪切操作')
-    },
-    handleDelete(row) {
-      console.log('删除', row)
-    },
-    handleEdit(row) {
-      console.log('编辑', row)
-    }
-  }
-}
-</script>
-```
-
-![右键菜单演示图]
-
-#### 支持的触发方式
-
-- `click` - 点击触发（默认）
-- `hover` - 悬停触发
-- `contextmenu` - 右键触发（新功能）
-- `focus` - 聚焦触发
-
-### Switch 组件宽度自定义
-
-`switch` 组件现在支持自定义宽度了！不再局限于固定的尺寸。
-
-#### 使用场景
-
-自定义宽度让你可以：
-
-- **适配不同设计风格** - 根据 UI 设计调整开关大小
-- **提升视觉层次** - 通过不同尺寸区分重要程度
-- **响应式设计** - 在不同屏幕尺寸下使用不同宽度
-
-#### 完整示例
-
-```vue
-<template>
-  <div>
-    <!-- 默认宽度 -->
-    <tiny-switch v-model="value1" />
-
-    <!-- 自定义宽度 -->
-    <tiny-switch v-model="value2" :width="60" />
-    <tiny-switch v-model="value3" :width="80" />
-    <tiny-switch v-model="value4" :width="100" />
-
-    <!-- 动态宽度 -->
-    <tiny-switch v-model="value5" :width="switchWidth" />
-    <tiny-button @click="switchWidth = switchWidth === 60 ? 100 : 60"> 切换宽度 </tiny-button>
-  </div>
-</template>
-
-<script>
-export default {
-  data() {
-    return {
-      value1: true,
-      value2: false,
-      value3: true,
-      value4: false,
-      value5: true,
-      switchWidth: 60
-    }
-  }
-}
-</script>
-```
-
-#### 样式定制
-
-配合 CSS，你可以进一步定制开关的样式：
-
-```vue
-<template>
-  <tiny-switch v-model="value" :width="80" class="custom-switch" />
-</template>
-
-<style scoped>
-.custom-switch {
-  /* 自定义样式 */
-}
-</style>
-```
-
-### Modal 头部拖拽
-
-`modal` 组件现在支持设置 `headerDragable` 属性，让用户可以拖拽弹窗头部来移动弹窗位置。
-
-#### 使用场景
-
-拖拽功能特别适合：
-
-- **多窗口场景** - 用户可以自由调整弹窗位置，避免遮挡
-- **大屏幕应用** - 在宽屏显示器上，拖拽可以提升操作效率
-- **用户个性化** - 让用户按照自己的习惯摆放弹窗
-
-#### 完整示例
-
-```vue
-<template>
-  <div>
-    <tiny-button @click="showModal = true">打开可拖拽弹窗</tiny-button>
-
-    <tiny-modal v-model="showModal" title="可拖拽的弹窗" :header-dragable="true" width="600px">
-      <p>你可以拖拽标题栏来移动这个弹窗</p>
-      <p>这对于多窗口场景非常有用</p>
-    </tiny-modal>
-  </div>
-</template>
-
-<script>
-export default {
-  data() {
-    return {
-      showModal: false
-    }
-  }
-}
-</script>
-```
-
-![Modal拖拽演示图]
-
-#### 注意事项
-
-- 拖拽功能只在弹窗未全屏时生效
-- 拖拽范围受视口限制，不会拖出屏幕
-- 可以通过 CSS 自定义拖拽时的样式
-
-### Drawer 按 ESC 关闭
-
-`drawer` 组件现在支持通过按 `ESC` 键关闭，用户体验更加友好。
-
-#### 使用场景
-
-ESC 键关闭是用户习惯的操作方式：
-
-- **符合用户预期** - 大多数应用都支持 ESC 关闭
-- **提升操作效率** - 键盘操作比鼠标点击更快
-- **无障碍支持** - 方便键盘用户操作
-
-#### 完整示例
-
-```vue
-<template>
-  <div>
-    <tiny-button @click="showDrawer = true">打开抽屉</tiny-button>
-
-    <tiny-drawer v-model="showDrawer" title="按 ESC 关闭" :close-on-press-escape="true">
-      <p>按 ESC 键可以关闭这个抽屉</p>
-      <p>这是用户习惯的操作方式</p>
-    </tiny-drawer>
-  </div>
-</template>
-
-<script>
-export default {
-  data() {
-    return {
-      showDrawer: false
-    }
-  }
-}
-</script>
-```
-
-#### 其他关闭方式
-
-Drawer 组件支持多种关闭方式：
-
-- 点击遮罩层关闭（默认）
-- 点击关闭按钮
-- 按 ESC 键关闭（新功能）
-- 调用 `close()` 方法
-
-### Tree Menu 节点点击增强
-
-`tree-menu` 组件现在支持在文档中点击添加节点，交互更加直观。
-
-#### 使用场景
-
-这个功能特别适合：
-
-- **可视化编辑** - 在文档中直接点击添加节点
-- **快速操作** - 提升节点添加的效率
-- **直观交互** - 所见即所得的编辑体验
-
-### Guide 组件触发条件优化
-
-`guide` 组件现在支持 `showStep` 属性，只有在 `showStep` 为 `true` 时才会触发引导。
-
-#### 使用场景
-
-这个优化让你可以：
-
-- **条件触发** - 只在特定条件下显示引导
-- **避免干扰** - 不会在用户不需要时弹出
-- **灵活控制** - 根据业务逻辑动态控制引导显示
-
----
-
-## 🐛 Bug 修复：稳定性大幅提升
-
-本次版本修复了 **65+ 个 Bug**，涉及多个核心组件：
-
-### Grid 表格组件优化
-
-- ✅ 修复最后一行边框显示问题
-- ✅ 修复标题响应式更新问题
-- ✅ 修复插入行无法进入编辑模式的问题
-- ✅ 修复列索引错误
-- ✅ 优化数据更新和插入删除性能
-- ✅ 修复滚动时重新渲染所有表格的问题
-- ✅ 修复 `editConfig` 为 null 时的错误
-- ✅ 修复插入行索引错误
-- ✅ 修复可见列变化时删除插入行的问题
-- ✅ 修复 `loadData` 解析时机问题
-
-### 日期选择器优化
-
-- ✅ 修复系统时区转换逻辑
-- ✅ 修复使用时间戳时时间选择异常的问题
-
-### 文件上传优化
-
-- ✅ 修复 EDM 模式下文件大小限制无效的问题
-- ✅ 修复上传提示文案中的多余空格
-
-### Tabs 标签页优化
-
-- ✅ 修复标签宽度更新问题
-- ✅ 修复标签内容无法加载的问题
-
-### 其他重要修复
-
-- ✅ 修复富文本编辑器字体大小设置失败的问题
-- ✅ 修复图标引用问题（`IconSubScript` 重命名为 `IconSubscript`，修复图标导出问题等）
-- ✅ 修复 FormItem 不在 Form 中使用报错的问题
-- ✅ 修复 Popover 点击外部区域关闭的 bug
-- ✅ 修复 Transfer 接收空对象数据时的问题
-- ✅ 修复 Dropdown 下拉菜单图标背景色问题
-- ✅ 修复 Select 下拉面板宽度无法跟随输入框宽度的问题
-- ✅ Timeline 添加 `description` 属性支持配置模式显示
-- ✅ AutoTip 添加 `popperClass` 属性支持
-- ✅ 修复 Space 覆盖按钮组件的默认间距
-- ✅ Split 添加 SaaS 样式支持
-- ✅ 修复 Modal alert/confirm 场景下标题图标垂直居中问题
-- ✅ 修复多个 E2E 测试问题
-
----
-
-## 📚 文档和开发体验改进
-
-### 自动化文档更新
-
-现在文档可以自动触发了！不再需要手动更新，大大提升了开发效率。
-
-#### 自动化流程
-
-通过 GitHub Actions，我们实现了：
-
-1. **自动构建文档** - 代码合并后自动触发文档构建
-2. **自动部署** - 文档构建完成后自动部署到生产环境
-3. **自动更新** - 版本发布时自动更新版本信息
-
-#### 开发效率提升
-
-- **节省时间** - 不再需要手动执行文档构建和部署流程
-- **减少错误** - 自动化流程减少了人为错误
-- **及时更新** - 文档始终与代码保持同步
-
-### 构建优化
-
-#### 移除不必要的文件条目
-
-**优化前**：
-
-```json
-{
-  "ignore": [
-    "file1.js",
-    "file2.js",
-    "file3.js"
-    // ... 更多文件
-  ]
-}
-```
-
-**优化后**：
-
-```json
-{
-  "ignore": [
-    // 只保留必要的文件
-  ]
-}
-```
-
-**效果**：
-
-- 减少了开发时需要执行的命令数量
-- 提升了开发环境的启动速度
-- 简化了构建配置
-
-#### 构建流程优化
-
-**1. Vite 配置优化**
-
-- 添加了 `saas.html` 入口配置
-- 移除了 Rollup 配置中未使用的 `saas.html` 输入
-- 优化了构建输出结构
-
-**2. 构建脚本优化**
-
-- 修复了 GitHub Actions 构建脚本的错误
-- 优化了构建流程，提升了构建速度 15%+
-- 改进了错误处理机制
-
-**3. 依赖管理优化**
-
-- 修复了 `icon-saas` 依赖错误版本的问题
-- 修复了 `gradient-parser` 包依赖导致的管道错误
-- 修复了 `icon-multicolor` 构建失败的问题
-
-#### 性能提升数据
-
-| 指标             | 优化前 | 优化后 | 提升   |
-| ---------------- | ------ | ------ | ------ |
-| 开发环境启动时间 | 45s    | 38s    | ⬆️ 15% |
-| 构建时间         | 120s   | 102s   | ⬆️ 15% |
-| 热更新速度       | 2.5s   | 2.1s   | ⬆️ 16% |
-
-### 文档改进
-
-#### 新增文档内容
-
-1. **添加 DeepWiki 询问功能** - 在 README 中添加了 DeepWiki 入口
-2. **更新介绍文档** - 添加和更新了项目介绍文档
-3. **完善组件文档** - 补充了多个组件的使用说明和示例
-
-#### 文档样式优化
-
-- 修改了文档提示样式，提升可读性
-- 优化了图片引用路径和大小
-- 改进了文档的整体布局
-
-### CI/CD 优化
-
-#### 部署流程拆分
-
-将 `deploy-obs` 拆分为构建和部署两个独立步骤：
-
-- **构建阶段** - 独立执行，可以并行进行
-- **部署阶段** - 构建成功后自动触发
-
-**优势**：
-
-- 更好的错误定位
-- 更灵活的部署控制
-- 更快的反馈循环
-
----
-
-## 👥 新贡献者
-
-感谢以下新贡献者的加入：
-
-- @IKEYCY - 为 dropdown 和 drawer 组件添加了多个实用功能
-- @neostfox - 修复了 FormItem 的重要问题
-
-![贡献者头像]
-
----
-
-## 🎁 升级指南
-
-### 快速开始
-
-```bash
-# 安装最新版本
-npm install @opentiny/vue@3.28.0
-
-# 或使用 yarn
-yarn add @opentiny/vue@3.28.0
-```
-
-### 迁移建议
-
-如果你正在使用 `select`、`tree-select`、`grid-select` 或 `base-select` 组件，建议：
-
-#### 1. 查看迁移文档
-
-首先了解新架构的变化：
-
-- **API 兼容性** - 大部分 API 保持不变，无需修改
-- **新增功能** - 了解新增的功能和属性
-- **废弃功能** - 查看是否有功能被废弃
-
-#### 2. 逐步迁移策略
-
-**阶段一：新功能使用新组件**
-
-```vue
-<!-- 在新功能中直接使用新组件 -->
-<template>
-  <tiny-select-wrapper v-model="value" :options="options" />
-</template>
-```
-
-**阶段二：逐步替换旧组件**
-
-```vue
-<!-- 逐步将旧组件替换为新组件 -->
-<!-- 旧代码 -->
-<tiny-select v-model="value" :options="options" />
-
-<!-- 新代码 -->
-<tiny-select-wrapper v-model="value" :options="options" />
-```
-
-**阶段三：全面迁移**
-
-- 替换所有旧组件
-- 移除不再使用的代码
-- 更新相关文档
-
-#### 3. 测试验证
-
-在迁移过程中，确保：
-
-- ✅ 功能测试 - 所有功能正常工作
-- ✅ 样式测试 - 样式显示正确
-- ✅ 性能测试 - 性能没有下降
-- ✅ 兼容性测试 - 在不同浏览器中测试
-
-#### 4. 常见问题处理
-
-**问题一：样式不匹配**
-
-```vue
-<!-- 如果样式有差异，可以通过 CSS 覆盖 -->
-<style>
-.custom-select {
-  /* 自定义样式 */
-}
-</style>
-```
-
-**问题二：事件处理**
-
-```vue
-<!-- 事件名称可能有所变化，请查看文档 -->
-<tiny-select-wrapper v-model="value" @change="handleChange" @visible-change="handleVisibleChange" />
-```
-
-### 兼容性说明
-
-#### Vue 版本兼容性
-
-- ✅ **完全向后兼容 Vue 2.x** - 所有 Vue 2.x 项目可以直接升级
-- ✅ **完全向后兼容 Vue 3.x** - 所有 Vue 3.x 项目可以直接升级
-- ✅ **API 保持稳定** - 无需修改现有代码
-
-#### 浏览器兼容性
-
-- ✅ Chrome/Edge (最新 2 个版本)
-- ✅ Firefox (最新 2 个版本)
-- ✅ Safari (最新 2 个版本)
-- ✅ 移动端浏览器支持
-
-#### 迁移检查清单
-
-在升级前，建议检查以下内容：
-
-- [ ] 查看 [Breaking Changes](https://github.com/opentiny/tiny-vue/releases) 文档
-- [ ] 在开发环境测试所有功能
-- [ ] 检查自定义样式是否需要调整
-- [ ] 验证第三方插件兼容性
-- [ ] 更新相关文档和示例代码
-
-#### 回退方案
-
-如果遇到问题，可以：
-
-1. **查看 Issue** - 在 GitHub 上搜索相关问题
-2. **提交 Issue** - 如果问题未解决，提交新的 Issue
-3. **临时回退** - 如果问题严重，可以临时回退到上一个版本
-
----
-
-## 📊 性能提升数据
-
-根据我们的测试，新版本在以下方面有显著提升：
-
-| 指标               | 提升幅度 |
-| ------------------ | -------- |
-| 选择器组件渲染速度 | ⬆️ 30%   |
-| 懒加载性能         | ⬆️ 60%   |
-| 构建速度           | ⬆️ 15%   |
-
-![性能对比图表]
-
----
-
-## 🔮 未来展望
-
-在 v3.28.0 的基础上，我们正在规划：
-
-- 🎨 主题定制能力的进一步增强
-- 🚀 性能优化的持续推进
-
----
-
-## 🙏 致谢
-
-感谢所有贡献者的辛勤付出，让 Tiny Vue 变得越来越好！
-
-特别感谢：
-
-- @discreted66 - 选择器组件重构的核心贡献者
-- @zzcr - 主题和构建系统的优化
-- @wuyiping0628 - 文档支持
-- @IKEYCY - 新功能的添加
-- @gimmyhehe - Grid 组件的持续优化
-- 以及所有其他贡献者！
-
----
-
-## 📞 反馈与支持
-
-如果你在使用过程中遇到任何问题，或者有好的建议，欢迎：
-
-- 📝 [提交 Issue](https://github.com/opentiny/tiny-vue/issues)
-- 💬 [加入讨论](https://github.com/opentiny/tiny-vue/discussions)
-- 📖 [查看文档](https://opentiny.design/tiny-vue)
-
----
-
-**让我们一起，让前端开发变得更简单、更高效！** 🚀
-
----
-
-_本文档由 Tiny Vue 团队编写，如有疑问欢迎反馈。_