@cldemo/ui-kit 1.1.1 → 1.1.3

package/COMPONENT_CATALOG.md

@@ -11,26 +11,36 @@
 
 #### 方式一：全局注册
 
-一次性注册所有组件，任何页面可直接使用标签：
+一次性注册该端的**组件 + 指令 + 注入**，任何页面可直接使用标签。按端三选一：
 
 ```ts
 // main.ts
 import { createApp } from 'vue'
 import App from './App.vue'
-import { install as ClLibs } from '@cldemo/ui-kit'
+
+import { install as ClLibs } from '@cldemo/ui-kit'          // 全部：Element + Web + Mobile
+// import { install as ClLibs } from '@cldemo/ui-kit/web'     // 仅 Web：Element + Web
+// import { install as ClLibs } from '@cldemo/ui-kit/mobile'  // 仅 Mobile：Element + Mobile
 
 const app = createApp(App)
 app.use(ClLibs)
 app.mount('#app')
 ```
 
+> 只需部分组件，或只想注册指令 / 注入时，见方式二、方式三与 [Core 的使用（指令与注入）](#core-的使用指令与注入)。
+
 #### 方式二：页面单独引用
 
-在需要的页面中手动 import 组件：
+在需要的页面中手动 import 组件（两种写法任选，均自带组件样式与 TS 类型）：
 
 ```vue
 <script setup lang="ts">
-import { ClButton, ClInput } from '@cldemo/ui-kit'
+// ① 小驼峰入口（推荐）：只加载该组件及其样式，体积最小
+import ClButton from '@cldemo/ui-kit/button'
+import ClInput from '@cldemo/ui-kit/input'
+
+// ② 根入口具名导入：写法最简，但会静态引入全部组件
+import { ClModal } from '@cldemo/ui-kit'
 </script>
 
 <template>
@@ -39,6 +49,8 @@ import { ClButton, ClInput } from '@cldemo/ui-kit'
 </template>
 ```
 
+> 小驼峰入口名 = 组件名去掉 `Cl` 前缀后首字母小写：`ClButton` → `button`、`ClColorPicker` → `colorPicker`、`ClCalendarM` → `calendarM`。
+
 #### 方式三：unplugin-vue-components 自动按需
 
 配置后在模板中直接使用标签，构建时自动按组件级别引入，未使用的组件（及其依赖如 echarts）不会进入项目。
@@ -59,12 +71,12 @@ export default defineConfig({
     vue(),
     Components({
       resolvers: [clResolver],
-      directives: true, // 使用 cl-highlight、cl-waves 等指令时需要开启
     }),
   ],
 })
 ```
 
+> **只解析组件：** `clResolver` 仅覆盖组件标签（`cl-button` / `ClButton` / `cl-form-validate` 均可解析），**不解析指令、也不解析注入**——`v-cl-*` 指令与 `$ClGlobals.*` 注入都需显式注册，见 [Core 的使用（指令与注入）](#core-的使用指令与注入)。
 
 ### 文档目录 (docs)
 
@@ -216,24 +228,72 @@ docs/
 
 ## 工具函数 (Common)
 
-> 以下工具函数从 `@cldemo/ui-kit/common` 引入。AI 生成页面代码时，优先使用这些已封装的工具函数。
+> 每个工具都支持**单独引入**（推荐：只加载该模块及其依赖，体积最小）或从 `@cldemo/ui-kit/common` **全量引入**（会连带整套 common：axios / dayjs / vue 等，体积最大）。AI 生成页面代码时，优先使用这些已封装的工具函数与单独入口。
 
-| 模块 | 引入 | 说明 | 文档 |
-|------|------|------|------|
-| CommonBase | `import { CommonBase } from '@cldemo/ui-kit/common'` | 基础工具类：类型判断、JSON操作、数组/字符串格式化 | [详细文档](./docs/tools/CommonBase.md) |
-| CommonAxios | `import { CommonAxios } from '@cldemo/ui-kit/common'` | HTTP 请求封装：自动取消重复请求、超时重试 | [详细文档](./docs/tools/CommonAxios.md) |
-| CommonDay | `import { CommonDay } from '@cldemo/ui-kit/common'` | 日期时间工具：格式化、时区、农历、时间运算 | [详细文档](./docs/tools/CommonDay.md) |
-| CommonPromise | `import { CommonPromise } from '@cldemo/ui-kit/common'` | Promise 辅助：并行执行、结果收集 | [详细文档](./docs/tools/CommonPromise.md) |
-| CommonTooltip | `import { CommonTooltip } from '@cldemo/ui-kit/common'` | 浮层提示：基于 Popper.js，多种触发方式 | [详细文档](./docs/tools/CommonTooltip.md) |
-| CommonElement | `import { CommonElement } from '@cldemo/ui-kit/common'` | DOM 工具：位置计算、样式操作、事件绑定 | [详细文档](./docs/tools/CommonElement.md) |
-| CommonTools | `import { CommonTools } from '@cldemo/ui-kit/common'` | Cookie/LocalStorage/高精度计算/防抖函数 | [详细文档](./docs/tools/CommonTools.md) |
-| CommonElementEvent | `import { CommonElementEvent } from '@cldemo/ui-kit/common'` | 拖拽/缩放事件封装 | [详细文档](./docs/tools/CommonElementEvent.md) |
-| CommonI18n | `import { CommonI18n } from '@cldemo/ui-kit/common'` | 国际化语言包管理，中英文切换 | [详细文档](./docs/tools/CommonI18n.md) |
-| CommonEchart | `import CommonEchart from '@cldemo/ui-kit/common/echart'` | ECharts 图表辅助：线图/柱状图/散点图配置 | [详细文档](./docs/tools/CommonEchart.md) |
+| 模块 | 单独入口（推荐） | 全量入口 | 说明 | 文档 |
+|------|-----------------|---------|------|------|
+| CommonBase | `import CommonBase from '@cldemo/ui-kit/common/base'` | `import { CommonBase } from '@cldemo/ui-kit/common'` | 基础工具类：类型判断、JSON操作、数组/字符串格式化 | [详细文档](./docs/tools/CommonBase.md) |
+| CommonAxios | `import CommonAxios from '@cldemo/ui-kit/common/axios'` | `import { CommonAxios } from '@cldemo/ui-kit/common'` | HTTP 请求封装：自动取消重复请求、超时重试 | [详细文档](./docs/tools/CommonAxios.md) |
+| CommonDay | `import CommonDay from '@cldemo/ui-kit/common/day'` | `import { CommonDay } from '@cldemo/ui-kit/common'` | 日期时间工具：格式化、时区、农历、时间运算 | [详细文档](./docs/tools/CommonDay.md) |
+| CommonPromise | `import CommonPromise from '@cldemo/ui-kit/common/promise'` | `import { CommonPromise } from '@cldemo/ui-kit/common'` | Promise 辅助：并行执行、结果收集 | [详细文档](./docs/tools/CommonPromise.md) |
+| CommonTooltip | `import CommonTooltip from '@cldemo/ui-kit/common/tooltip'` | `import { CommonTooltip } from '@cldemo/ui-kit/common'` | 浮层提示：基于 Popper.js，多种触发方式 | [详细文档](./docs/tools/CommonTooltip.md) |
+| CommonElement | `import CommonElement from '@cldemo/ui-kit/common/element'` | `import { CommonElement } from '@cldemo/ui-kit/common'` | DOM 工具：位置计算、样式操作、事件绑定 | [详细文档](./docs/tools/CommonElement.md) |
+| CommonTools | `import CommonTools from '@cldemo/ui-kit/common/tools'` | `import { CommonTools } from '@cldemo/ui-kit/common'` | Cookie/LocalStorage/高精度计算/防抖函数 | [详细文档](./docs/tools/CommonTools.md) |
+| CommonElementEvent | `import CommonElementEvent from '@cldemo/ui-kit/common/element/event'` | `import { CommonElementEvent } from '@cldemo/ui-kit/common'` | 拖拽/缩放事件封装 | [详细文档](./docs/tools/CommonElementEvent.md) |
+| CommonI18n | `import CommonI18n from '@cldemo/ui-kit/common/i18n'` | `import { CommonI18n } from '@cldemo/ui-kit/common'` | 国际化语言包管理，中英文切换 | [详细文档](./docs/tools/CommonI18n.md) |
+| CommonBrowserProgress | `import CommonBrowserProgress from '@cldemo/ui-kit/common/browserProgress'` | `import { CommonBrowserProgress } from '@cldemo/ui-kit/common'` | 顶部进度条：路由/请求联动，可 configure 配置 | [详细文档](./docs/tools/CommonBrowserProgress.md) |
+| CommonEchart | `import CommonEchart from '@cldemo/ui-kit/common/echart'` | —（无 barrel 导出） | ECharts 图表辅助：线图/柱状图/散点图配置（依赖较大，不进 barrel） | [详细文档](./docs/tools/CommonEchart.md) |
+| clLog | `import { clLog } from '@cldemo/ui-kit/common/log'` | `import { clLog } from '@cldemo/ui-kit/common'` | 统一日志：受 setGlobalConfig({ debug }) 控制 | [详细文档](./docs/tools/clLog.md) |
+| CommonGlobalConfig | `import CommonGlobalConfig from '@cldemo/ui-kit/common/globalConfig'` | `import { setGlobalConfig, getGlobalConfig } from '@cldemo/ui-kit/common'` | 全局组件配置注册表（组件默认值 + formValidate，见本文末章节） | [详细文档](./docs/tools/CommonGlobalConfig.md) |
+| （类型）globalTypes | `import type { ClGlobals, ClGlobalOptions } from '@cldemo/ui-kit/common/globalTypes'` | —（无 barrel 导出） | `$ClGlobals` 与 install options 的类型定义（纯类型，编译期擦除） | [详细文档](./docs/tools/globalTypes.md) |
+
+## Core 的使用（指令与注入）
+
+「Core」指组件库的**指令（directives）**与**注入（provides，即 `$ClGlobals`）**两部分，它们与组件是两套独立的引入体系：
+
+- **组件**：`clResolver` 自动按需（见方式三）、小驼峰入口（方式二）或全量 `app.use(install)`；
+- **指令 / 注入**：`clResolver` **只解析组件、不解析指令与注入**，必须显式注册——用安装器一次注册，或按需组合。
+
+### 注册方式
+
+```ts
+// ① 整端一次注册（省事，体积最大）
+import installCore from "@cldemo/ui-kit/core"         // Element + Web + Mobile
+// import installCore from "@cldemo/ui-kit/core/web"     // Element + Web
+// import installCore from "@cldemo/ui-kit/core/mobile"  // Element + Mobile
+app.use(installCore)
+
+// ② 按需组合（体积最小）：只注册用到的指令与注入
+import { createInstallCore } from "@cldemo/ui-kit/core/installCommon"
+import * as Tooltip from "@cldemo/ui-kit/core/tooltip"
+import Notify from "@cldemo/ui-kit/core/notify"
+app.use(createInstallCore({ tooltip: Tooltip }, { notify: Notify }), { notify: {} })
+```
+
+> `createInstallCore(指令表, 注入表)`：第一个参数是指令、第二个是注入；`app.use` 的第二个参数按注入键名分段传配置（可省略）。
+> 导入写法有区别：**指令是具名导出**（`name` + `directive`），用 `import * as X`；**注入是 default 导出的工厂函数**，用 `import X`。
+
+### 入口清单
+
+| 类别 | 短路径入口 | 对应 | 说明 |
+|------|-----------|------|------|
+| 指令 | `import * as Tooltip from "@cldemo/ui-kit/core/tooltip"` | `v-cl-tooltip` | 浮层提示（基于 Popper.js） |
+| 指令 | `import * as Waves from "@cldemo/ui-kit/core/waves"` | `v-cl-waves` | 波纹点击效果 |
+| 指令 | `import * as CodeHighlight from "@cldemo/ui-kit/core/codeHighlight"` | `v-cl-code-highlight` | 代码高亮（highlight.js 懒加载） |
+| 指令 | `import * as LazyImage from "@cldemo/ui-kit/core/lazyImage"` | `v-cl-lazy-image` | 图片懒加载 |
+| 注入 | `import Notify from "@cldemo/ui-kit/core/notify"` | `$ClGlobals.notify` | 通知 |
+| 注入 | `import Alert from "@cldemo/ui-kit/core/alert"` | `$ClGlobals.alert` | 警告框 |
+| 注入 | `import Preview from "@cldemo/ui-kit/core/preview"` | `$ClGlobals.preview` | 大图/视频预览（video.js 懒加载，不进启动路径） |
+| 注入 | `import Clipboard from "@cldemo/ui-kit/core/clipboard"` | `$ClGlobals.clipboard` | 剪贴板 |
+| 注入 | `import LoadScreen from "@cldemo/ui-kit/core/loadScreen"` | `$ClGlobals.loadScreen` | 全屏加载 |
+| 注入 | `import LanguagePack from "@cldemo/ui-kit/core/languagePack"` | `$ClGlobals.languagePack` | 语言包 |
+| 注入 | `import Validate from "@cldemo/ui-kit/core/validate"` | `$ClGlobals.validate` | 校验规则表 |
+| 注入 | `import Toast from "@cldemo/ui-kit/core/toast"` | `$ClGlobals.toast` | 轻提示（移动端） |
+| 注入 | `import NotifyM from "@cldemo/ui-kit/core/notifyM"` | `$ClGlobals.notifyM` | 通知（移动端） |
 
-## 指令
+### 内置指令
 
-组件库提供 4 个内置指令，随组件一起发布，可通过全量 `app.use(install)` 或按需 `installCore` 注册（`unplugin-vue-components` 按需模式下需开启 `directives: true`，见上文方式三）：
+组件库提供 4 个内置指令，注册后即可在模板使用（`v-cl-*` 前缀）：
 
 | 指令 | 说明 |
 |------|------|
@@ -242,6 +302,23 @@ docs/
 | `v-cl-tooltip` | 浮层提示（基于 Popper.js，多种触发方式） |
 | `v-cl-lazy-image` | 图片懒加载 |
 
+### 全局注入 `$ClGlobals`
+
+注册注入后，组件内通过 `inject("$ClGlobals")` 访问：
+
+```vue
+<script setup lang="ts">
+import { inject } from "vue"
+const _clGlobals: any = inject("$ClGlobals")
+// 可用成员：clipboard / loadScreen / languagePack / validate / notify / alert / preview / toast / notifyM
+_clGlobals.notify?.info("消息")
+</script>
+```
+
+> **二选一**：`$ClGlobals` 与下方的 use 工厂是两套入口，**请勿在同一项目混用**，否则同一功能行为可能不一致。
+
+> **配置不走 Core**：组件默认值与 `cl-form-validate` 的 `type` / `rules` / `messages` 属于配置通道，见文末 [setGlobalConfig 全局配置](#setglobalconfig-全局配置)。
+
 ## use 工厂（开放 API）
 
 组件库有一批 `use*` 工厂函数开放给外部业务使用。它们不依赖 `app.use(install)`，各自独立 mount 自身实例，可在任意页面按需调用，是除 `$ClGlobals` 之外的推荐入口：
@@ -299,41 +376,36 @@ lang.setType('en')
 
 > 部分工厂的完整参数与配置项（如 `useNotify` 的 `position / delay`、`useAlert` 的 `iconType / html / submitCallback`）见对应 Demo 页面或组件源码。
 
-## `$ClGlobals` 全局注入
+## setGlobalConfig 全局配置
 
-`$ClGlobals` 是全量安装（`app.use(install)`）时由组件库 `provide` 的全局注入容器，结构与 use 工厂对应：
+组件库支持通过 `setGlobalConfig` 给组件设置全局默认配置，按需加载与全量安装共用同一份配置注册表。两种引入写法任选——**推荐写法一**：直达子路径只加载配置模块本身，不会连带加载整套 `common` 工具：
 
 ```ts
-// main.ts（全量安装）
-import { install as ClLibs } from '@cldemo/ui-kit'
-const app = createApp(App)
-app.use(ClLibs, { globalsOption: { calendar: { restDays: [...] } } })
-```
+// 写法一（推荐）：default 命名空间 + 直达子路径
+import CommonGlobalConfig from '@cldemo/ui-kit/common/globalConfig'
+CommonGlobalConfig.setGlobalConfig({ calendar: { restDays: ['2026-01-01'] } })
 
-```vue
-<script setup lang="ts">
-import { inject } from 'vue'
-const _clGlobals: any = inject('$ClGlobals')
-// 可用成员：clipboard / loadScreen / languagePack / validate / notify / alert / preview / toast
-_clGlobals.notify?.info('消息')
-</script>
+// 写法二：具名导入 + common 入口
+import { setGlobalConfig } from '@cldemo/ui-kit/common'
+setGlobalConfig({ calendar: { restDays: ['2026-01-01'] } })
 ```
 
-> **注意**：`$ClGlobals.*` 依赖全量 `app.use(install)` 的 `provide`，只在全量安装场景可用，按需模式下拿不到。use 工厂与 `$ClGlobals` 是两套入口，**请二选一使用，勿在同一项目混用**，否则同一功能行为可能不一致。
-
-## setGlobalConfig 全局配置
-
-组件库支持通过 `setGlobalConfig` 给组件设置全局默认配置，按需加载与全量安装共用同一份配置注册表：
+完整示例（组件默认值与 `cl-form-validate` 配置一并写）：
 
 ```ts
-// 按需加载（推荐）：import { setGlobalConfig } from '@cldemo/ui-kit/common'
-import { setGlobalConfig } from '@cldemo/ui-kit/common'
+import CommonGlobalConfig from '@cldemo/ui-kit/common/globalConfig'
 
-setGlobalConfig({
+CommonGlobalConfig.setGlobalConfig({
   calendar: { restDays: ['2026-01-01'] },   // ClCalendar 全局默认
   calendarM: { restDays: ['2026-01-01'] },  // ClCalendarM 全局默认
   selectTag: { theme: 'blue' },             // ClSelectTag 全局默认
   switchery: { colorChecked: '#07c160' },   // ClSwitchery 全局默认
+  ellipsis: { isUseTooltipAuto: true },     // Web 端文本溢出自动 Tooltip
+  formValidate: {                            // cl-form-validate（type / rules / messages 一并写）
+    type: 'text',                            // 错误消息展示类型 | enum: tip, text
+    rules: { qq: (value: string) => /^[0-9]{5,10}$/.test(value) },  // 自定义规则，与内置规则表合并
+    messages: { zh_cn: { qq: 'QQ号不正确' }, en: { qq: 'Incorrect QQ number' } },
+  },
 })
 ```
 
@@ -343,4 +415,15 @@ setGlobalConfig({
 app.use(ClLibs, { globalsOption: { calendar: { restDays: [...] } } })
 ```
 
+| 配置项 | 键 | 是否需要 installCore |
+|--------|-----|---------------------|
+| 组件默认值 | 组件名（`calendar` / `calendarM` / `selectTag` / `switchery` / `ellipsis` / `debug` …） | 不需要 |
+| `cl-form-validate` 的 `type` / `rules` / `messages` | `formValidate` | 不需要 |
+| `$ClGlobals.notify` / `alert` / `preview` 等**实例** | 走 provides，不是配置 | 需要（`installCore` 或细粒度 `__provide__` 入口） |
+| `v-cl-*` **指令** | 走指令注册，不是配置 | 需要（`installCore` 或细粒度 `__directive__` 入口） |
+
 **合并优先级**：页面 props 显式值 > 全局配置（`setGlobalConfig` / `globalsOption`）> 组件默认值。运行中再次调用 `setGlobalConfig` 会自动刷新（注册表为 reactive，组件 computed 会重新计算）。
+
+`cl-form-validate` 的校验规则表另有一条四层链（后者覆盖前者）：内置规则表 → `$ClGlobals.validate`（`installCore` 的 options）→ `setGlobalConfig({ formValidate })` → 组件 props / form 的 `data-theme`。
+
+> **注意**：`formValidate.messages` 支持「多语言子表」（`{ zh_cn: {...}, en: {...} }`）或「扁平表」（`{ qq: '...' }`）二选一——两者同时写时只会命中多语言子表，顶层扁平键不生效。

package/README.md

@@ -31,7 +31,8 @@ npm run lib:build # 构建组件库产物
   - `clResolver` 额外容忍 PascalCase 直写标签（`<ClDropdownMenu>`）与全小写（`<clbutton>`）；
   - 新增组件只需在对应 `componentsInstalls.ts` 加 import，`npm run dev` / `npm run lib:build` 会自动重生成清单，`npm run gate` 会拦住漏导。
 - **`setGlobalConfig` 全局组件配置**：单个入口配置所有组件的全局默认，按需加载与全量安装共用同一份配置注册表：
-  - 按需加载：`import { setGlobalConfig } from '@cldemo/ui-kit/common'`，如 `setGlobalConfig({ calendar: { restDays: [...] } })`；
+  - 按需加载（推荐直达子路径，只加载配置模块本身）：`import CommonGlobalConfig from '@cldemo/ui-kit/common/globalConfig'`，如 `CommonGlobalConfig.setGlobalConfig({ calendar: { restDays: [...] } })`；
+  - 亦可从 common 具名引入：`import { setGlobalConfig } from '@cldemo/ui-kit/common'`；
   - 全量安装：等价写法 `app.use(ClLibs, { globalsOption: { calendar: { restDays: [...] } } })`（`install` 内部写入同一注册表）；
   - 合并优先级：**页面 props 显式值 > 全局配置 > 组件默认值**；注册表为 reactive，运行中再次调用会自动刷新。
 - **类型提示**：`install` 签名与 `$ClGlobals` 结构可从 `import { ClGlobals, ClGlobalOptions } from '@cldemo/ui-kit'` 获取。
@@ -109,11 +110,11 @@ setLocale('zh_cn')
 库内告警统一走 `clLog`，默认**开发构建输出、生产构建静默**（`error` 始终输出）：
 
 ```ts
-import { setGlobalConfig } from '@cldemo/ui-kit/common'
+import CommonGlobalConfig from '@cldemo/ui-kit/common/globalConfig'
 
-setGlobalConfig({ debug: true })                         // 全开
-setGlobalConfig({ debug: { warn: true, error: false } }) // 只开告警
-setGlobalConfig({ debug: null })                         // 清除，回到默认策略
+CommonGlobalConfig.setGlobalConfig({ debug: true })                         // 全开
+CommonGlobalConfig.setGlobalConfig({ debug: { warn: true, error: false } }) // 只开告警
+CommonGlobalConfig.setGlobalConfig({ debug: null })                         // 清除，回到默认策略
 ```
 
 输出统一带 `[ui-kit][组件名]` 前缀，便于在控制台区分来源。
@@ -276,7 +277,7 @@ src/
 
 ### 指令
 
-指令随组件库一起发布，全量 `app.use(install)` 自动注册；`unplugin-vue-components` 按需模式下在 `Components({ directives: true })` 开启后即可在模板直接使用。
+指令随组件库一起发布，全量 `app.use(install)` 自动注册；按需模式下 `clResolver` **只解析组件、不解析指令**（`Components({ directives: true })` 对此无效），需显式注册后再在模板使用 —— 例如 `import * as Tooltip from '@cldemo/ui-kit/core/tooltip'` 后 `app.use(createInstallCore({ tooltip: Tooltip }, {}))`（完整入口清单见 `COMPONENT_CATALOG.md` 的「按需引入：细粒度入口」）。
 
 | 指令 | 说明 |
 |------|------|
@@ -295,7 +296,7 @@ src/
 | `useClipboard()` | 剪贴板复制 |
 | `languagePack()` | 语言包 |
 | `$ClGlobals` | 全局注入容器（全量安装时可用，`inject('$ClGlobals')` 获取），成员明细见下方 |
-| `setGlobalConfig()` | 组件全局默认配置（`@cldemo/ui-kit/common`） |
+| `setGlobalConfig()` | 组件全局默认配置（推荐 `@cldemo/ui-kit/common/globalConfig`，亦可从 `@cldemo/ui-kit/common` 具名引入） |
 
 `$ClGlobals` 共 8 个成员，其中 5 个与上方 use 工厂对应，另有 `loadScreen` / `validate` / `toast` 三个成员无对应 use 工厂：
 

package/buildLibs/all/BallColor4-B7mDHedF.js

@@ -0,0 +1,36 @@
+import { defineComponent as p, computed as u, openBlock as l, createElementBlock as r, unref as _, createElementVNode as f, Fragment as C, renderList as h, normalizeStyle as B } from "vue";
+import g from "@cldemo/ui-kit/common/base";
+import { _ as k } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+const v = ["id"], x = { class: "loader" }, y = /* @__PURE__ */ p({
+  name: "ClLoadBallColor4",
+  __name: "BallColor4",
+  props: {
+    id: {},
+    color: {}
+  },
+  setup(a) {
+    const n = a, d = n.id, i = `ballColor4-${g.getRandom(5)}`, s = ["#2ecc71", "#3498db", "#f1c40f", "#e74c3c"], m = u(() => {
+      const e = n.color || "";
+      if (!e) return s;
+      const o = e.split("|").map((t) => t.trim()).filter(Boolean);
+      if (o.length === 0) return s;
+      for (; o.length < 4; )
+        o.push(o[0]);
+      return o.slice(0, 4);
+    });
+    return (e, o) => (l(), r("div", {
+      class: "load-ballColor4",
+      id: _(d)
+    }, [
+      f("div", x, [
+        (l(!0), r(C, null, h(m.value, (t, c) => (l(), r("span", {
+          key: `${i}-${c}`,
+          style: B({ "--i": c + 1, "--c": t })
+        }, null, 4))), 128))
+      ])
+    ], 8, v));
+  }
+}), w = /* @__PURE__ */ k(y, [["__scopeId", "data-v-f4260593"]]);
+export {
+  w as default
+};

package/buildLibs/all/BallColor4-CYX2eI-j.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),u=require("@cldemo/ui-kit/common/base"),p=require("./_plugin-vue_export-helper-BHFhmbuH.cjs"),m=["id"],_={class:"loader"},f=e.defineComponent({name:"ClLoadBallColor4",__name:"BallColor4",props:{id:{},color:{}},setup(s){const r=s,a=r.id,i=`ballColor4-${u.getRandom(5)}`,n=["#2ecc71","#3498db","#f1c40f","#e74c3c"],d=e.computed(()=>{const t=r.color||"";if(!t)return n;const o=t.split("|").map(l=>l.trim()).filter(Boolean);if(o.length===0)return n;for(;o.length<4;)o.push(o[0]);return o.slice(0,4)});return(t,o)=>(e.openBlock(),e.createElementBlock("div",{class:"load-ballColor4",id:e.unref(a)},[e.createElementVNode("div",_,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(d.value,(l,c)=>(e.openBlock(),e.createElementBlock("span",{key:`${i}-${c}`,style:e.normalizeStyle({"--i":c+1,"--c":l})},null,4))),128))])],8,m))}}),B=p._export_sfc(f,[["__scopeId","data-v-f4260593"]]);exports.default=B;

package/buildLibs/all/BarBounce-BU0gnsJy.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue");require("@cldemo/ui-kit/common/base");const l=require("./_plugin-vue_export-helper-BHFhmbuH.cjs"),a=["id"],s=e.defineComponent({name:"ClLoadBarBounce",__name:"BarBounce",props:{id:{},color:{}},setup(n){const o=n,t=o.id,c=o.color||"#000";return(d,r)=>(e.openBlock(),e.createElementBlock("div",{class:"load-barBounce",id:e.unref(t),style:e.normalizeStyle({"--g":`no-repeat linear-gradient(${e.unref(c)} 0 0)`})},[...r[0]||(r[0]=[e.createElementVNode("div",{class:"loader"},null,-1)])],12,a))}}),u=l._export_sfc(s,[["__scopeId","data-v-8e6f1e61"]]);exports.default=u;

package/buildLibs/all/BarBounce-C8fDn9nE.js

@@ -0,0 +1,24 @@
+import { defineComponent as c, openBlock as l, createElementBlock as s, normalizeStyle as d, unref as r, createElementVNode as i } from "vue";
+import "@cldemo/ui-kit/common/base";
+import { _ as p } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+const m = ["id"], _ = /* @__PURE__ */ c({
+  name: "ClLoadBarBounce",
+  __name: "BarBounce",
+  props: {
+    id: {},
+    color: {}
+  },
+  setup(n) {
+    const e = n, t = e.id, a = e.color || "#000";
+    return (u, o) => (l(), s("div", {
+      class: "load-barBounce",
+      id: r(t),
+      style: d({ "--g": `no-repeat linear-gradient(${r(a)} 0 0)` })
+    }, [...o[0] || (o[0] = [
+      i("div", { class: "loader" }, null, -1)
+    ])], 12, m));
+  }
+}), x = /* @__PURE__ */ p(_, [["__scopeId", "data-v-8e6f1e61"]]);
+export {
+  x as default
+};

package/buildLibs/all/BarEqualizer-CLM0rXmR.js

@@ -0,0 +1,24 @@
+import { defineComponent as n, openBlock as s, createElementBlock as i, normalizeStyle as c, unref as r, createElementVNode as d } from "vue";
+import "@cldemo/ui-kit/common/base";
+import { _ as p } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+const m = ["id"], _ = /* @__PURE__ */ n({
+  name: "ClLoadBarEqualizer",
+  __name: "BarEqualizer",
+  props: {
+    id: {},
+    color: {}
+  },
+  setup(t) {
+    const e = t, a = e.id, l = e.color || "#000";
+    return (u, o) => (s(), i("div", {
+      class: "load-barEqualizer",
+      id: r(a),
+      style: c({ "--g": `no-repeat linear-gradient(${r(l)} 0 0)` })
+    }, [...o[0] || (o[0] = [
+      d("div", { class: "loader" }, null, -1)
+    ])], 12, m));
+  }
+}), B = /* @__PURE__ */ p(_, [["__scopeId", "data-v-93ced557"]]);
+export {
+  B as default
+};

package/buildLibs/all/BarEqualizer-CSmPfckO.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue");require("@cldemo/ui-kit/common/base");const a=require("./_plugin-vue_export-helper-BHFhmbuH.cjs"),i=["id"],c=e.defineComponent({name:"ClLoadBarEqualizer",__name:"BarEqualizer",props:{id:{},color:{}},setup(t){const r=t,l=r.id,n=r.color||"#000";return(d,o)=>(e.openBlock(),e.createElementBlock("div",{class:"load-barEqualizer",id:e.unref(l),style:e.normalizeStyle({"--g":`no-repeat linear-gradient(${e.unref(n)} 0 0)`})},[...o[0]||(o[0]=[e.createElementVNode("div",{class:"loader"},null,-1)])],12,i))}}),s=a._export_sfc(c,[["__scopeId","data-v-93ced557"]]);exports.default=s;

package/buildLibs/all/BarMeter-DOYYJBe3.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue");require("@cldemo/ui-kit/common/base");const d=require("./_plugin-vue_export-helper-BHFhmbuH.cjs"),l=["id"],s=e.defineComponent({name:"ClLoadBarMeter",__name:"BarMeter",props:{id:{},color:{}},setup(n){const t=n,a=t.id,r=t.color||"#000";return(c,o)=>(e.openBlock(),e.createElementBlock("div",{class:"load-barMeter",id:e.unref(a),style:e.normalizeStyle({"--g":`no-repeat linear-gradient(${e.unref(r)} 0 0)`,"--r1":`radial-gradient(farthest-side at bottom, ${e.unref(r)} 93%, #0000)`,"--r2":`radial-gradient(farthest-side at top, ${e.unref(r)} 93%, #0000)`})},[...o[0]||(o[0]=[e.createElementVNode("div",{class:"loader"},null,-1)])],12,l))}}),i=d._export_sfc(s,[["__scopeId","data-v-1e6ccd1d"]]);exports.default=i;

package/buildLibs/all/BarMeter-Dpsp41_L.js

@@ -0,0 +1,24 @@
+import { defineComponent as n, openBlock as s, createElementBlock as l, normalizeStyle as i, unref as e, createElementVNode as c } from "vue";
+import "@cldemo/ui-kit/common/base";
+import { _ as p } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+const m = ["id"], _ = /* @__PURE__ */ n({
+  name: "ClLoadBarMeter",
+  __name: "BarMeter",
+  props: {
+    id: {},
+    color: {}
+  },
+  setup(a) {
+    const r = a, d = r.id, t = r.color || "#000";
+    return (f, o) => (s(), l("div", {
+      class: "load-barMeter",
+      id: e(d),
+      style: i({ "--g": `no-repeat linear-gradient(${e(t)} 0 0)`, "--r1": `radial-gradient(farthest-side at bottom, ${e(t)} 93%, #0000)`, "--r2": `radial-gradient(farthest-side at top, ${e(t)} 93%, #0000)` })
+    }, [...o[0] || (o[0] = [
+      c("div", { class: "loader" }, null, -1)
+    ])], 12, m));
+  }
+}), M = /* @__PURE__ */ p(_, [["__scopeId", "data-v-1e6ccd1d"]]);
+export {
+  M as default
+};

package/buildLibs/all/BarPulse-CGTRpoDg.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue");require("@cldemo/ui-kit/common/base");const s=require("./_plugin-vue_export-helper-BHFhmbuH.cjs"),a=["id"],c=e.defineComponent({name:"ClLoadBarPulse",__name:"BarPulse",props:{id:{},color:{}},setup(t){const o=t,l=o.id,n=o.color||"#000";return(u,r)=>(e.openBlock(),e.createElementBlock("div",{class:"load-barPulse",id:e.unref(l),style:e.normalizeStyle({"--g":`no-repeat linear-gradient(${e.unref(n)} 0 0)`})},[...r[0]||(r[0]=[e.createElementVNode("div",{class:"loader"},null,-1)])],12,a))}}),d=s._export_sfc(c,[["__scopeId","data-v-10d72786"]]);exports.default=d;

package/buildLibs/all/BarPulse-DeUFthGo.js

@@ -0,0 +1,24 @@
+import { defineComponent as n, openBlock as a, createElementBlock as d, normalizeStyle as c, unref as r, createElementVNode as i } from "vue";
+import "@cldemo/ui-kit/common/base";
+import { _ as p } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+const m = ["id"], _ = /* @__PURE__ */ n({
+  name: "ClLoadBarPulse",
+  __name: "BarPulse",
+  props: {
+    id: {},
+    color: {}
+  },
+  setup(t) {
+    const e = t, l = e.id, s = e.color || "#000";
+    return (u, o) => (a(), d("div", {
+      class: "load-barPulse",
+      id: r(l),
+      style: c({ "--g": `no-repeat linear-gradient(${r(s)} 0 0)` })
+    }, [...o[0] || (o[0] = [
+      i("div", { class: "loader" }, null, -1)
+    ])], 12, m));
+  }
+}), v = /* @__PURE__ */ p(_, [["__scopeId", "data-v-10d72786"]]);
+export {
+  v as default
+};

package/buildLibs/all/BarRamp-DHyOaL0A.js

@@ -0,0 +1,24 @@
+import { defineComponent as l, openBlock as s, createElementBlock as d, normalizeStyle as p, unref as r, createElementVNode as c } from "vue";
+import "@cldemo/ui-kit/common/base";
+import { _ as m } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+const i = ["id"], _ = /* @__PURE__ */ l({
+  name: "ClLoadBarRamp",
+  __name: "BarRamp",
+  props: {
+    id: {},
+    color: {}
+  },
+  setup(t) {
+    const o = t, a = o.id, n = o.color || "#000";
+    return (f, e) => (s(), d("div", {
+      class: "load-barRamp",
+      id: r(a),
+      style: p({ "--g": `no-repeat linear-gradient(${r(n)} 0 0)` })
+    }, [...e[0] || (e[0] = [
+      c("div", { class: "loader" }, null, -1)
+    ])], 12, i));
+  }
+}), v = /* @__PURE__ */ m(_, [["__scopeId", "data-v-0902404d"]]);
+export {
+  v as default
+};

package/buildLibs/all/BarRamp-j0BcyAi0.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue");require("@cldemo/ui-kit/common/base");const l=require("./_plugin-vue_export-helper-BHFhmbuH.cjs"),s=["id"],c=e.defineComponent({name:"ClLoadBarRamp",__name:"BarRamp",props:{id:{},color:{}},setup(t){const o=t,n=o.id,a=o.color||"#000";return(i,r)=>(e.openBlock(),e.createElementBlock("div",{class:"load-barRamp",id:e.unref(n),style:e.normalizeStyle({"--g":`no-repeat linear-gradient(${e.unref(a)} 0 0)`})},[...r[0]||(r[0]=[e.createElementVNode("div",{class:"loader"},null,-1)])],12,s))}}),d=l._export_sfc(c,[["__scopeId","data-v-0902404d"]]);exports.default=d;

package/buildLibs/all/BarStream-ImPjB2Xq.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue");require("@cldemo/ui-kit/common/base");const s=require("./_plugin-vue_export-helper-BHFhmbuH.cjs"),l=["id"],d=e.defineComponent({name:"ClLoadBarStream",__name:"BarStream",props:{id:String,color:{type:String,default:""}},setup(o){e.useCssVars(c=>({v1c744c18:a.value}));const t=o,a=e.computed(()=>t.color||"#000"),n=t.id;return(c,r)=>(e.openBlock(),e.createElementBlock("div",{class:"load-barStream",id:e.unref(n)},[...r[0]||(r[0]=[e.createElementVNode("div",{class:"loader"},null,-1)])],8,l))}}),u=s._export_sfc(d,[["__scopeId","data-v-960e169b"]]);exports.default=u;

package/buildLibs/all/BarStream-vQ65ld1l.js

@@ -0,0 +1,27 @@
+import { defineComponent as c, useCssVars as n, computed as l, openBlock as d, createElementBlock as m, unref as p, createElementVNode as i } from "vue";
+import "@cldemo/ui-kit/common/base";
+import { _ } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+const u = ["id"], f = /* @__PURE__ */ c({
+  name: "ClLoadBarStream",
+  __name: "BarStream",
+  props: {
+    id: String,
+    // desc: 组件实例唯一标识
+    color: { type: String, default: "" }
+  },
+  setup(t) {
+    n((s) => ({
+      v1c744c18: r.value
+    }));
+    const e = t, r = l(() => e.color || "#000"), a = e.id;
+    return (s, o) => (d(), m("div", {
+      class: "load-barStream",
+      id: p(a)
+    }, [...o[0] || (o[0] = [
+      i("div", { class: "loader" }, null, -1)
+    ])], 8, u));
+  }
+}), x = /* @__PURE__ */ _(f, [["__scopeId", "data-v-960e169b"]]);
+export {
+  x as default
+};

package/buildLibs/all/BarStretch-BGBQV6PK.js

@@ -0,0 +1,24 @@
+import { defineComponent as c, openBlock as l, createElementBlock as s, normalizeStyle as d, unref as o, createElementVNode as i } from "vue";
+import "@cldemo/ui-kit/common/base";
+import { _ as p } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+const m = ["id"], _ = /* @__PURE__ */ c({
+  name: "ClLoadBarStretch",
+  __name: "BarStretch",
+  props: {
+    id: {},
+    color: {}
+  },
+  setup(r) {
+    const e = r, a = e.id, n = e.color || "#000";
+    return (f, t) => (l(), s("div", {
+      class: "load-barStretch",
+      id: o(a),
+      style: d({ "--g": `no-repeat linear-gradient(${o(n)} 0 0)` })
+    }, [...t[0] || (t[0] = [
+      i("div", { class: "loader" }, null, -1)
+    ])], 12, m));
+  }
+}), h = /* @__PURE__ */ p(_, [["__scopeId", "data-v-cd408a19"]]);
+export {
+  h as default
+};

package/buildLibs/all/BarStretch-x5XcsNjn.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue");require("@cldemo/ui-kit/common/base");const l=require("./_plugin-vue_export-helper-BHFhmbuH.cjs"),a=["id"],s=e.defineComponent({name:"ClLoadBarStretch",__name:"BarStretch",props:{id:{},color:{}},setup(o){const t=o,n=t.id,c=t.color||"#000";return(i,r)=>(e.openBlock(),e.createElementBlock("div",{class:"load-barStretch",id:e.unref(n),style:e.normalizeStyle({"--g":`no-repeat linear-gradient(${e.unref(c)} 0 0)`})},[...r[0]||(r[0]=[e.createElementVNode("div",{class:"loader"},null,-1)])],12,a))}}),d=l._export_sfc(s,[["__scopeId","data-v-cd408a19"]]);exports.default=d;

package/buildLibs/all/BarWave-RhfBvsx_.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue");require("@cldemo/ui-kit/common/base");const a=require("./_plugin-vue_export-helper-BHFhmbuH.cjs"),c=["id"],s=e.defineComponent({name:"ClLoadBarWave",__name:"BarWave",props:{id:{},color:{}},setup(t){const o=t,n=o.id,l=o.color||"#000";return(i,r)=>(e.openBlock(),e.createElementBlock("div",{class:"load-barWave",id:e.unref(n),style:e.normalizeStyle({"--c":e.unref(l)})},[...r[0]||(r[0]=[e.createElementVNode("div",{class:"loader"},null,-1)])],12,c))}}),d=a._export_sfc(s,[["__scopeId","data-v-93f61946"]]);exports.default=d;

package/buildLibs/all/BarWave-pa0zBCvt.js

@@ -0,0 +1,24 @@
+import { defineComponent as s, openBlock as l, createElementBlock as c, normalizeStyle as d, unref as r, createElementVNode as i } from "vue";
+import "@cldemo/ui-kit/common/base";
+import { _ as p } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+const m = ["id"], _ = /* @__PURE__ */ s({
+  name: "ClLoadBarWave",
+  __name: "BarWave",
+  props: {
+    id: {},
+    color: {}
+  },
+  setup(t) {
+    const o = t, a = o.id, n = o.color || "#000";
+    return (f, e) => (l(), c("div", {
+      class: "load-barWave",
+      id: r(a),
+      style: d({ "--c": r(n) })
+    }, [...e[0] || (e[0] = [
+      i("div", { class: "loader" }, null, -1)
+    ])], 12, m));
+  }
+}), W = /* @__PURE__ */ p(_, [["__scopeId", "data-v-93f61946"]]);
+export {
+  W as default
+};

package/buildLibs/all/CircleBubble-C0rZgQXq.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue");require("@cldemo/ui-kit/common/base");const r=require("./_plugin-vue_export-helper-BHFhmbuH.cjs"),d=["id"],s=e.defineComponent({name:"ClLoadCircleBubble",__name:"CircleBubble",props:{id:{},color:{}},setup(l){const i=l,a=i.id,b=i.color||"#000",t=e.computed(()=>({"load-circleBubble":!0}));return(v,c)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(t.value),id:e.unref(a),style:e.normalizeStyle({color:e.unref(b)})},[...c[0]||(c[0]=[e.createStaticVNode('<div class="load-circleBubble-container" data-v-524af90b><div class="circleBubble-container circleBubble-container1" data-v-524af90b><div class="circleBubble-item circleBubble-item1" data-v-524af90b></div><div class="circleBubble-item circleBubble-item2" data-v-524af90b></div><div class="circleBubble-item circleBubble-item3" data-v-524af90b></div><div class="circleBubble-item circleBubble-item4" data-v-524af90b></div></div><div class="circleBubble-container circleBubble-container2" data-v-524af90b><div class="circleBubble-item circleBubble-item1" data-v-524af90b></div><div class="circleBubble-item circleBubble-item2" data-v-524af90b></div><div class="circleBubble-item circleBubble-item3" data-v-524af90b></div><div class="circleBubble-item circleBubble-item4" data-v-524af90b></div></div><div class="circleBubble-container circleBubble-container3" data-v-524af90b><div class="circleBubble-item circleBubble-item1" data-v-524af90b></div><div class="circleBubble-item circleBubble-item2" data-v-524af90b></div><div class="circleBubble-item circleBubble-item3" data-v-524af90b></div><div class="circleBubble-item circleBubble-item4" data-v-524af90b></div></div></div>',1)])],14,d))}}),u=r._export_sfc(s,[["__scopeId","data-v-524af90b"]]);exports.default=u;

package/buildLibs/all/CircleBubble-Ce8tsDg-.js

@@ -0,0 +1,24 @@
+import { defineComponent as r, computed as d, openBlock as s, createElementBlock as v, normalizeStyle as o, unref as c, normalizeClass as u, createStaticVNode as m } from "vue";
+import "@cldemo/ui-kit/common/base";
+import { _ as B } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+const n = ["id"], f = /* @__PURE__ */ r({
+  name: "ClLoadCircleBubble",
+  __name: "CircleBubble",
+  props: {
+    id: {},
+    color: {}
+  },
+  setup(l) {
+    const e = l, a = e.id, b = e.color || "#000", t = d(() => ({ "load-circleBubble": !0 }));
+    return (p, i) => (s(), v("div", {
+      class: u(t.value),
+      id: c(a),
+      style: o({ color: c(b) })
+    }, [...i[0] || (i[0] = [
+      m('<div class="load-circleBubble-container" data-v-524af90b><div class="circleBubble-container circleBubble-container1" data-v-524af90b><div class="circleBubble-item circleBubble-item1" data-v-524af90b></div><div class="circleBubble-item circleBubble-item2" data-v-524af90b></div><div class="circleBubble-item circleBubble-item3" data-v-524af90b></div><div class="circleBubble-item circleBubble-item4" data-v-524af90b></div></div><div class="circleBubble-container circleBubble-container2" data-v-524af90b><div class="circleBubble-item circleBubble-item1" data-v-524af90b></div><div class="circleBubble-item circleBubble-item2" data-v-524af90b></div><div class="circleBubble-item circleBubble-item3" data-v-524af90b></div><div class="circleBubble-item circleBubble-item4" data-v-524af90b></div></div><div class="circleBubble-container circleBubble-container3" data-v-524af90b><div class="circleBubble-item circleBubble-item1" data-v-524af90b></div><div class="circleBubble-item circleBubble-item2" data-v-524af90b></div><div class="circleBubble-item circleBubble-item3" data-v-524af90b></div><div class="circleBubble-item circleBubble-item4" data-v-524af90b></div></div></div>', 1)
+    ])], 14, n));
+  }
+}), k = /* @__PURE__ */ B(f, [["__scopeId", "data-v-524af90b"]]);
+export {
+  k as default
+};