vue-amazing-ui 2.9.0 → 2.10.0

package/README.md

@@ -16,8 +16,8 @@
 
 ## Features
 
-- The component library is implemented with `Vue@3.5.29`+ `TypeScript@5.9.3` + `Vite@7.3.1` + `Less@4.5.1`.
-- Currently, it includes `68` basic UI components and `22` utility functions, with continuous exploration and updates ongoing...
+- The component library is implemented with `Vue@3.5.42`+ `TypeScript@5.9.3` + `Vite@7.3.1` + `Less@4.5.1`.
+- Currently, it includes `69` basic UI components and `22` utility functions, with continuous exploration and updates ongoing...
 - Theme Customizable, all you need is to provide a theme color, then all the stuffs will be done by me.
 - By the way, they are all treeshakable.
 - All the stuff in Vue Amazing UI is written in TypeScript. It can work with your typescript project seamlessly.
@@ -61,8 +61,9 @@ _In this form, only the imported components will be bundled._
 import { createApp } from 'vue'
 import App from './App.vue'
 import { Button, Tag } from 'vue-amazing-ui'
-import 'vue-amazing-ui/es/button/Button.css'
-import 'vue-amazing-ui/es/tag/Tag.css'
+// One style entry per component (recommended form): global default styles + the component's own styles + its dependency components' styles
+import 'vue-amazing-ui/es/button/style'
+import 'vue-amazing-ui/es/tag/style'
 
 const app = createApp(App)
 app.use(Button).use(Tag)
@@ -76,8 +77,9 @@ _In this form, only the imported components will be bundled as well._
 ```vue
 <script setup lang="ts">
 import { Button, Tag } from 'vue-amazing-ui'
-import 'vue-amazing-ui/es/button/Button.css'
-import 'vue-amazing-ui/es/tag/Tag.css'
+// One style entry per component (recommended form): global default styles + the component's own styles + its dependency components' styles
+import 'vue-amazing-ui/es/button/style'
+import 'vue-amazing-ui/es/tag/style'
 </script>
 <template>
   <Button>button</Button>
@@ -85,16 +87,7 @@ import 'vue-amazing-ui/es/tag/Tag.css'
 </template>
 ```
 
-**Both Global Partial Registration and Local Registration require manually importing the global default styles of the component library ([Automatic On-Demand Import](https://themusecatcher.github.io/vue-amazing-ui/guide/import-on-demand.html#%E8%87%AA%E5%8A%A8%E6%8C%89%E9%9C%80%E5%BC%95%E5%85%A5-%E5%BC%BA%E7%83%88%E6%8E%A8%E8%8D%90) is recommended).**
-
-```ts
-import { createApp } from 'vue'
-import App from './App.vue'
-import 'vue-amazing-ui/es/style/global.css' // 引入全局默认样式
-
-const app = createApp(App)
-app.mount('#app')
-```
+> The style entry also supports the more explicit file form `import 'vue-amazing-ui/es/button/style/index.js'`.
 
 **Automatic On-Demand Import (Strongly Recommended)**
 
@@ -250,33 +243,34 @@ All sponsors will be listed here, thank you very much for your support and spons
 | Card            | 卡片        | Carousel       | 轮播图      |
 | Cascader        | 级联选择    | Checkbox       | 复选框      |
 | Collapse        | 折叠面板    | ColorPicker    | 颜色选择器  |
-| ConfigProvider  | 全局化配置  | Countdown      | 倒计时      |
-| DatePicker      | 日期选择器  | Descriptions   | 描述列表    |
-| Dialog          | 对话框      | Divider        | 分割线      |
-| Drawer          | 抽屉        | Ellipsis       | 文本省略    |
-| Empty           | 空状态      | Flex           | 弹性布局    |
-| FloatButton     | 浮动按钮    | GradientText   | 渐变文字    |
-| Grid            | 栅格        | Highlight      | 高亮文本    |
-| Image           | 图片        | Input          | 输入框      |
-| InputNumber     | 数字输入框  | InputSearch    | 搜索框      |
-| List            | 列表        | LoadingBar     | 加载条      |
-| Message         | 全局提示    | Modal          | 模态框      |
-| Notification    | 通知提醒    | NumberAnimation | 数值动画    |
-| Pagination      | 分页        | Popconfirm     | 弹出确认    |
-| Popover         | 气泡卡片    | Progress       | 进度条      |
-| QRCode          | 二维码      | Radio          | 单选框      |
-| Rate            | 评分        | Result         | 结果        |
-| Scrollbar       | 滚动条      | Segmented      | 分段控制器  |
-| Select          | 选择器      | Skeleton       | 骨架屏      |
-| Slider          | 滑动输入条  | Space          | 间距        |
-| Spin            | 加载中      | Statistic      | 统计数值    |
-| Steps           | 步骤条      | Swiper         | 触摸滑动    |
-| Switch          | 开关        | Table          | 表格        |
-| Tabs            | 标签页      | Tag            | 标签        |
-| Textarea        | 文本域      | TextScroll     | 文字滚动    |
-| Timeline        | 时间轴      | Tooltip        | 文字提示    |
-| Upload          | 上传        | Video          | 播放器      |
-| Waterfall       | 瀑布流      | Watermark      | 水印        |
+| Comment         | 评论        | ConfigProvider | 全局化配置  |
+| Countdown       | 倒计时      | DatePicker     | 日期选择器  |
+| Descriptions    | 描述列表    | Dialog         | 对话框      |
+| Divider         | 分割线      | Drawer         | 抽屉        |
+| Ellipsis        | 文本省略    | Empty          | 空状态      |
+| Flex            | 弹性布局    | FloatButton    | 浮动按钮    |
+| GradientText    | 渐变文字    | Grid           | 栅格        |
+| Highlight       | 高亮文本    | Image          | 图片        |
+| Input           | 输入框      | InputNumber    | 数字输入框  |
+| InputSearch     | 搜索框      | List           | 列表        |
+| LoadingBar      | 加载条      | Message        | 全局提示    |
+| Modal           | 模态框      | Notification   | 通知提醒    |
+| NumberAnimation | 数值动画    | Pagination     | 分页        |
+| Popconfirm      | 弹出确认    | Popover        | 气泡卡片    |
+| Progress        | 进度条      | QRCode         | 二维码      |
+| Radio           | 单选框      | Rate           | 评分        |
+| Result          | 结果        | Scrollbar      | 滚动条      |
+| Segmented       | 分段控制器  | Select         | 选择器      |
+| Skeleton        | 骨架屏      | Slider         | 滑动输入条  |
+| Space           | 间距        | Spin           | 加载中      |
+| Statistic       | 统计数值    | Steps          | 步骤条      |
+| Swiper          | 触摸滑动    | Switch         | 开关        |
+| Table           | 表格        | Tabs           | 标签页      |
+| Tag             | 标签        | Textarea       | 文本域      |
+| TextScroll      | 文字滚动    | Timeline       | 时间轴      |
+| Tooltip         | 文字提示    | Upload         | 上传        |
+| Video           | 播放器      | Waterfall      | 瀑布流      |
+| Watermark       | 水印        |                |             |
 
 ## Functions
 

package/README.zh-CN.md

@@ -16,8 +16,8 @@
 
 ## 特性
 
-- 组件库采用 `Vue@3.5.29`+ `TypeScript@5.9.3` + `Vite@7.3.1` + `Less@4.5.1` 实现
-- 目前共包含 `68` 个基础 `UI` 组件以及 `22` 个工具函数，并且持续探索更新中...
+- 组件库采用 `Vue@3.5.42`+ `TypeScript@5.9.3` + `Vite@7.3.1` + `Less@4.5.1` 实现
+- 目前共包含 `69` 个基础 `UI` 组件以及 `22` 个工具函数，并且持续探索更新中...
 - 主题可调，你只需提供一个主题色，剩下的都交给我
 - 顺便一提，它们全都可以 `treeshaking`
 - `Vue Amazing UI` 全量使用 `TypeScript` 编写，和你的 `TypeScript` 项目无缝衔接
@@ -61,8 +61,9 @@ _这种情况下，只有导入的组件才会被打包_
 import { createApp } from 'vue'
 import App from './App.vue'
 import { Button, Tag } from 'vue-amazing-ui'
-import 'vue-amazing-ui/es/button/Button.css'
-import 'vue-amazing-ui/es/tag/Tag.css'
+// 每个组件一个样式入口（推荐写法）：内含全局默认样式 + 组件自身样式 + 其依赖组件样式
+import 'vue-amazing-ui/es/button/style'
+import 'vue-amazing-ui/es/tag/style'
 
 const app = createApp(App)
 app.use(Button).use(Tag)
@@ -76,8 +77,9 @@ _这种情况下，也只有导入的组件才会被打包_
 ```vue
 <script setup lang="ts">
 import { Button, Tag } from 'vue-amazing-ui'
-import 'vue-amazing-ui/es/button/Button.css'
-import 'vue-amazing-ui/es/tag/Tag.css'
+// 每个组件一个样式入口（推荐写法）：内含全局默认样式 + 组件自身样式 + 其依赖组件样式
+import 'vue-amazing-ui/es/button/style'
+import 'vue-amazing-ui/es/tag/style'
 </script>
 <template>
   <Button>button</Button>
@@ -85,16 +87,7 @@ import 'vue-amazing-ui/es/tag/Tag.css'
 </template>
 ```
 
-**全局部分注册和局部注册组件，都需手动引入组件库全局默认样式（推荐使用[自动按需引入](https://themusecatcher.github.io/vue-amazing-ui/guide/import-on-demand.html#%E8%87%AA%E5%8A%A8%E6%8C%89%E9%9C%80%E5%BC%95%E5%85%A5-%E5%BC%BA%E7%83%88%E6%8E%A8%E8%8D%90)）**
-
-```ts
-import { createApp } from 'vue'
-import App from './App.vue'
-import 'vue-amazing-ui/es/style/global.css' // 引入全局默认样式
-
-const app = createApp(App)
-app.mount('#app')
-```
+> 样式入口也支持（更显式的）文件写法 `import 'vue-amazing-ui/es/button/style/index.js'`。
 
 **自动按需引入（强烈推荐）**
 
@@ -250,33 +243,34 @@ pnpm docs:dev
 | Card            | 卡片       | Carousel       | 轮播图     |
 | Cascader        | 级联选择   | Checkbox       | 复选框     |
 | Collapse        | 折叠面板   | ColorPicker    | 颜色选择器 |
-| ConfigProvider  | 全局化配置 | Countdown      | 倒计时     |
-| DatePicker      | 日期选择器 | Descriptions   | 描述列表   |
-| Dialog          | 对话框     | Divider        | 分割线     |
-| Drawer          | 抽屉       | Ellipsis       | 文本省略   |
-| Empty           | 空状态     | Flex           | 弹性布局   |
-| FloatButton     | 浮动按钮   | GradientText   | 渐变文字   |
-| Grid            | 栅格       | Highlight      | 高亮文本   |
-| Image           | 图片       | Input          | 输入框     |
-| InputNumber     | 数字输入框 | InputSearch    | 搜索框     |
-| List            | 列表       | LoadingBar     | 加载条     |
-| Message         | 全局提示   | Modal          | 模态框     |
-| Notification    | 通知提醒   | NumberAnimation | 数值动画   |
-| Pagination      | 分页       | Popconfirm     | 弹出确认   |
-| Popover         | 气泡卡片   | Progress       | 进度条     |
-| QRCode          | 二维码     | Radio          | 单选框     |
-| Rate            | 评分       | Result         | 结果       |
-| Scrollbar       | 滚动条     | Segmented      | 分段控制器 |
-| Select          | 选择器     | Skeleton       | 骨架屏     |
-| Slider          | 滑动输入条 | Space          | 间距       |
-| Spin            | 加载中     | Statistic      | 统计数值   |
-| Steps           | 步骤条     | Swiper         | 触摸滑动   |
-| Switch          | 开关       | Table          | 表格       |
-| Tabs            | 标签页     | Tag            | 标签       |
-| Textarea        | 文本域     | TextScroll     | 文字滚动   |
-| Timeline        | 时间轴     | Tooltip        | 文字提示   |
-| Upload          | 上传       | Video          | 播放器     |
-| Waterfall       | 瀑布流     | Watermark      | 水印       |
+| Comment         | 评论       | ConfigProvider | 全局化配置 |
+| Countdown       | 倒计时     | DatePicker     | 日期选择器 |
+| Descriptions    | 描述列表   | Dialog         | 对话框     |
+| Divider         | 分割线     | Drawer         | 抽屉       |
+| Ellipsis        | 文本省略   | Empty          | 空状态     |
+| Flex            | 弹性布局   | FloatButton    | 浮动按钮   |
+| GradientText    | 渐变文字   | Grid           | 栅格       |
+| Highlight       | 高亮文本   | Image          | 图片       |
+| Input           | 输入框     | InputNumber    | 数字输入框 |
+| InputSearch     | 搜索框     | List           | 列表       |
+| LoadingBar      | 加载条     | Message        | 全局提示   |
+| Modal           | 模态框     | Notification   | 通知提醒   |
+| NumberAnimation | 数值动画   | Pagination     | 分页       |
+| Popconfirm      | 弹出确认   | Popover        | 气泡卡片   |
+| Progress        | 进度条     | QRCode         | 二维码     |
+| Radio           | 单选框     | Rate           | 评分       |
+| Result          | 结果       | Scrollbar      | 滚动条     |
+| Segmented       | 分段控制器 | Select         | 选择器     |
+| Skeleton        | 骨架屏     | Slider         | 滑动输入条 |
+| Space           | 间距       | Spin           | 加载中     |
+| Statistic       | 统计数值   | Steps          | 步骤条     |
+| Swiper          | 触摸滑动   | Switch         | 开关       |
+| Table           | 表格       | Tabs           | 标签页     |
+| Tag             | 标签       | Textarea       | 文本域     |
+| TextScroll      | 文字滚动   | Timeline       | 时间轴     |
+| Tooltip         | 文字提示   | Upload         | 上传       |
+| Video           | 播放器     | Waterfall      | 瀑布流     |
+| Watermark       | 水印       |                |            |
 
 ## 工具函数