@5even7/dlc-ui 0.2.7 → 0.2.9

package/CHANGELOG.md

@@ -2,10 +2,19 @@
 
 > **发版规则**：默认每次发布只递增补丁号（0.x.y → 0.x.(y+1)，即 +0.01）；除非手动明确指定新版本号，否则不升次版本。
 
+## 0.2.9 - 2026-08-09
+
+- 修复：`/vue2`、`/vue3` 的 CJS 构建丢失默认导出（`require(...).default` 为 undefined，webpack/CommonJS 下 `import X from` 会拿到命名空间对象而不是组件）；legacy 入口现在转发默认导出，并带 `__esModule` 标记。
+- 对称补齐 Vue 组件实例方法：胶囊新增 `setMouseColor()`，进度条新增 `setShowValue()`（此前只有 Color 暴露了同类方法）。
+
+## 0.2.8 - 2026-08-09
+
+- 最终命名确认：官方组件导出为 `DlcCapsule / DlcProgress / DlcColor`（无中划线），模板中仍可直接写 `<dlc-capsule>` 等 kebab 写法（Vue 自动映射）；移除字符串形式的导出名，兼容 Vite/esbuild。
+
 ## 0.2.7 - 2026-08-09
 
 - 修复：0.2.6 发布包未包含 mouseColor / showValue 热切换（watch 仍走重建），本轮真正启用 `setMouseColor()` / `setShowValue()`，开关不再重建组件、不丢插槽内容。
-- 组件更名：`CosmicCapsule → dlc-capsule`、`ProgressCapsule → dlc-progress`、`ColorBackground → dlc-color`（旧名保留为兼容别名，标记 deprecated）。
+- 组件更名：`CosmicCapsule → DlcCapsule`、`ProgressCapsule → DlcProgress`、`ColorBackground → DlcColor`（旧名保留为兼容别名，标记 deprecated；模板里也可写 `<dlc-capsule>` 等）。
 
 ## 0.2.6 - 2026-08-09
 

package/README.md

@@ -163,7 +163,7 @@ export default {
 
 dlc-color 背景层（`createColorBackground(host, options)`）：`preset`、`colors`、`seed`、`speed`、`quality`、`renderer`、`mouseColor`、`respectReducedMotion`、`opacity`（0~1）、`fallbackColor`（预置底色 / 十六进制色 / false）。控制器支持 `setPreset / setColors / setSeed / setSpeed / setQuality / setOpacity / setFallbackColor / setMouseColor / randomize / pause / resume / dispose` 和 `ready / presetchange / error` 事件。Vue 里可用官方组件 `dlc-color`（从 `@5even7/dlc-ui/vue2` 或 `/vue3` 导入），它的默认插槽内容会显示在背景层上方。
 
-胶囊控制器额外支持 `setSeed(seed)` / `setSpeed(speed)` / `setText(content)` / `setColorContent(content)` / `setTextRatio(ratio)` / `setCssVars(vars)` / `setLabel(label)` 热更新；进度控制器额外支持 `setEdgeStyle('flow' | 'tide')` / `setValueSuffix(suffix)` 和同样的插槽热更新方法。`setPreset` 只接受文学名称字符串（如 `'汐潮'`）。Vue 组件实例也暴露 `setText` / `setColorContent` / `setTextRatio` / `setCssVars` / `setLabel`（进度另有 `setValueSuffix`），与 H5 控制器对称。
+胶囊控制器额外支持 `setSeed(seed)` / `setSpeed(speed)` / `setText(content)` / `setColorContent(content)` / `setTextRatio(ratio)` / `setCssVars(vars)` / `setLabel(label)` 热更新；进度控制器额外支持 `setEdgeStyle('flow' | 'tide')` / `setValueSuffix(suffix)` 和同样的插槽热更新方法。`setPreset` 只接受文学名称字符串（如 `'汐潮'`）。Vue 组件实例也暴露 `setText` / `setColorContent` / `setTextRatio` / `setCssVars` / `setLabel`（胶囊另有 `setMouseColor`，进度另有 `setValueSuffix` / `setShowValue`），与 H5 控制器对称。
 
 > 进度条是完全受控组件：组件自身不再自动增长，`value` 由使用方驱动。要自动步进，自己写定时器加值即可：
 >

package/dist/vue2.cjs

@@ -1,5 +1,7 @@
 'use strict';
 
+Object.defineProperty(exports, '__esModule', { value: true });
+
 function _arrayLikeToArray(r, a) {
   (null == a || a > r.length) && (a = r.length);
   for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e];
@@ -3208,6 +3210,9 @@ function makeCapsuleWrapper(createCapsule, render) {
       setLabel: function setLabel(label) {
         return this.controller && this.controller.setLabel(label);
       },
+      setMouseColor: function setMouseColor(value) {
+        return this.controller && this.controller.setMouseColor(value);
+      },
       setQuality: function setQuality(quality) {
         return this.controller && this.controller.setQuality(quality);
       },
@@ -3311,6 +3316,9 @@ function makeProgressWrapper(createProgressCapsule, render) {
       setValueSuffix: function setValueSuffix(suffix) {
         return this.controller && this.controller.setValueSuffix(suffix);
       },
+      setShowValue: function setShowValue(show) {
+        return this.controller && this.controller.setShowValue(show);
+      },
       setQuality: function setQuality(quality) {
         return this.controller && this.controller.setQuality(quality);
       },
@@ -3422,6 +3430,14 @@ var DlcColor = makeColorWrapper(createColorBackground, renderColor);
 var CosmicCapsule = DlcCapsule;
 var ProgressCapsule = DlcProgress;
 var ColorBackground = DlcColor;
+var vue2 = {
+  DlcCapsule: DlcCapsule,
+  DlcProgress: DlcProgress,
+  DlcColor: DlcColor,
+  CosmicCapsule: CosmicCapsule,
+  ProgressCapsule: ProgressCapsule,
+  ColorBackground: ColorBackground
+};
 
 exports.ColorBackground = ColorBackground;
 exports.CosmicCapsule = CosmicCapsule;
@@ -3429,6 +3445,4 @@ exports.DlcCapsule = DlcCapsule;
 exports.DlcColor = DlcColor;
 exports.DlcProgress = DlcProgress;
 exports.ProgressCapsule = ProgressCapsule;
-exports["dlc-capsule"] = DlcCapsule;
-exports["dlc-color"] = DlcColor;
-exports["dlc-progress"] = DlcProgress;
+exports.default = vue2;

package/dist/vue2.mjs

@@ -3082,6 +3082,7 @@ function makeCapsuleWrapper(createCapsule, render) {
       setTextRatio(ratio) { return this.controller && this.controller.setTextRatio(ratio); },
       setCssVars(vars) { return this.controller && this.controller.setCssVars(vars); },
       setLabel(label) { return this.controller && this.controller.setLabel(label); },
+      setMouseColor(value) { return this.controller && this.controller.setMouseColor(value); },
       setQuality(quality) { return this.controller && this.controller.setQuality(quality); },
       getController() { return this.controller; }
     }
@@ -3156,8 +3157,9 @@ function makeProgressWrapper(createProgressCapsule, render) {
       setCssVars(vars) { return this.controller && this.controller.setCssVars(vars); },
       setLabel(label) { return this.controller && this.controller.setLabel(label); },
       setValueSuffix(suffix) { return this.controller && this.controller.setValueSuffix(suffix); },
+      setShowValue(show) { return this.controller && this.controller.setShowValue(show); },
       setQuality(quality) { return this.controller && this.controller.setQuality(quality); },
-      getController() { return this.controller; }
+      getController() { return this.controller; }
     }
   });
 }
@@ -3239,12 +3241,12 @@ const ProgressCapsule = DlcProgress;
 const ColorBackground = DlcColor;
 
 var vue2 = {
-  'dlc-capsule': DlcCapsule,
-  'dlc-progress': DlcProgress,
-  'dlc-color': DlcColor,
+  DlcCapsule,
+  DlcProgress,
+  DlcColor,
   CosmicCapsule,
   ProgressCapsule,
   ColorBackground
 };
 
-export { ColorBackground, CosmicCapsule, DlcCapsule, DlcColor, DlcProgress, ProgressCapsule, vue2 as default, DlcCapsule as "dlc-capsule", DlcColor as "dlc-color", DlcProgress as "dlc-progress" };
+export { ColorBackground, CosmicCapsule, DlcCapsule, DlcColor, DlcProgress, ProgressCapsule, vue2 as default };

package/dist/vue3.cjs

@@ -1,5 +1,7 @@
 'use strict';
 
+Object.defineProperty(exports, '__esModule', { value: true });
+
 var vue = require('vue');
 
 function _arrayLikeToArray(r, a) {
@@ -3210,6 +3212,9 @@ function makeCapsuleWrapper(createCapsule, render) {
       setLabel: function setLabel(label) {
         return this.controller && this.controller.setLabel(label);
       },
+      setMouseColor: function setMouseColor(value) {
+        return this.controller && this.controller.setMouseColor(value);
+      },
       setQuality: function setQuality(quality) {
         return this.controller && this.controller.setQuality(quality);
       },
@@ -3313,6 +3318,9 @@ function makeProgressWrapper(createProgressCapsule, render) {
       setValueSuffix: function setValueSuffix(suffix) {
         return this.controller && this.controller.setValueSuffix(suffix);
       },
+      setShowValue: function setShowValue(show) {
+        return this.controller && this.controller.setShowValue(show);
+      },
       setQuality: function setQuality(quality) {
         return this.controller && this.controller.setQuality(quality);
       },
@@ -3424,6 +3432,14 @@ var DlcColor = makeColorWrapper(createColorBackground, renderColor);
 var CosmicCapsule = DlcCapsule;
 var ProgressCapsule = DlcProgress;
 var ColorBackground = DlcColor;
+var vue3 = {
+  DlcCapsule: DlcCapsule,
+  DlcProgress: DlcProgress,
+  DlcColor: DlcColor,
+  CosmicCapsule: CosmicCapsule,
+  ProgressCapsule: ProgressCapsule,
+  ColorBackground: ColorBackground
+};
 
 exports.ColorBackground = ColorBackground;
 exports.CosmicCapsule = CosmicCapsule;
@@ -3431,6 +3447,4 @@ exports.DlcCapsule = DlcCapsule;
 exports.DlcColor = DlcColor;
 exports.DlcProgress = DlcProgress;
 exports.ProgressCapsule = ProgressCapsule;
-exports["dlc-capsule"] = DlcCapsule;
-exports["dlc-color"] = DlcColor;
-exports["dlc-progress"] = DlcProgress;
+exports.default = vue3;

package/dist/vue3.mjs

@@ -3084,6 +3084,7 @@ function makeCapsuleWrapper(createCapsule, render) {
       setTextRatio(ratio) { return this.controller && this.controller.setTextRatio(ratio); },
       setCssVars(vars) { return this.controller && this.controller.setCssVars(vars); },
       setLabel(label) { return this.controller && this.controller.setLabel(label); },
+      setMouseColor(value) { return this.controller && this.controller.setMouseColor(value); },
       setQuality(quality) { return this.controller && this.controller.setQuality(quality); },
       getController() { return this.controller; }
     }
@@ -3158,8 +3159,9 @@ function makeProgressWrapper(createProgressCapsule, render) {
       setCssVars(vars) { return this.controller && this.controller.setCssVars(vars); },
       setLabel(label) { return this.controller && this.controller.setLabel(label); },
       setValueSuffix(suffix) { return this.controller && this.controller.setValueSuffix(suffix); },
+      setShowValue(show) { return this.controller && this.controller.setShowValue(show); },
       setQuality(quality) { return this.controller && this.controller.setQuality(quality); },
-      getController() { return this.controller; }
+      getController() { return this.controller; }
     }
   });
 }
@@ -3241,12 +3243,12 @@ const ProgressCapsule = DlcProgress;
 const ColorBackground = DlcColor;
 
 var vue3 = {
-  'dlc-capsule': DlcCapsule,
-  'dlc-progress': DlcProgress,
-  'dlc-color': DlcColor,
+  DlcCapsule,
+  DlcProgress,
+  DlcColor,
   CosmicCapsule,
   ProgressCapsule,
   ColorBackground
 };
 
-export { ColorBackground, CosmicCapsule, DlcCapsule, DlcColor, DlcProgress, ProgressCapsule, vue3 as default, DlcCapsule as "dlc-capsule", DlcColor as "dlc-color", DlcProgress as "dlc-progress" };
+export { ColorBackground, CosmicCapsule, DlcCapsule, DlcColor, DlcProgress, ProgressCapsule, vue3 as default };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@5even7/dlc-ui",
-  "version": "0.2.7",
+  "version": "0.2.9",
   "publishConfig": {
     "access": "public"
   },
@@ -79,7 +79,7 @@
   ],
   "scripts": {
     "build": "rollup -c && node scripts/copy-css.mjs",
-    "test": "node --test tests/",
+    "test": "node --test",
     "serve": "node scripts/serve.mjs",
     "demo:h5": "node scripts/serve.mjs",
     "demo:vue3": "npm --prefix examples/vue3 run dev",

package/types/vue2.d.ts

@@ -1,7 +1,7 @@
 export {
-  DlcCapsule as 'dlc-capsule',
-  DlcProgress as 'dlc-progress',
-  DlcColor as 'dlc-color',
+  DlcCapsule,
+  DlcProgress,
+  DlcColor,
   CosmicCapsule,
   ProgressCapsule,
   ColorBackground,

package/types/vue3.d.ts

@@ -1,7 +1,7 @@
 import { CapsuleOptions, ProgressOptions } from './index.js';
 
-export interface CosmicCapsuleComponent {
-  name: 'CosmicCapsule';
+export interface CosmicCapsuleComponent {
+  name: 'dlc-capsule';
   props: (keyof CapsuleOptions)[];
   emits: string[];
   mounted: () => void;
@@ -19,13 +19,14 @@ export interface CosmicCapsuleComponent {
     setTextRatio(ratio: number): any;
     setCssVars(vars: Record<string, string>): any;
     setLabel(label: string): any;
+    setMouseColor(value: boolean): any;
     setQuality(quality: CapsuleOptions['quality']): any;
-    getController(): any;
+    getController(): any;
   };
 }
 
-export interface ProgressCapsuleComponent {
-  name: 'ProgressCapsule';
+export interface ProgressCapsuleComponent {
+  name: 'dlc-progress';
   props: (keyof ProgressOptions)[];
   emits: string[];
   mounted: () => void;
@@ -47,13 +48,14 @@ export interface ProgressCapsuleComponent {
     setCssVars(vars: Record<string, string>): any;
     setLabel(label: string): any;
     setValueSuffix(suffix: string): any;
+    setShowValue(show: boolean): any;
     setQuality(quality: ProgressOptions['quality']): any;
     getController(): any;
   };
 }
 
 export interface ColorBackgroundComponent {
-  name: 'ColorBackground';
+  name: 'dlc-color';
   props: (keyof import('./index').ColorBackgroundOptions)[];
   emits: string[];
   mounted: () => void;
@@ -78,16 +80,15 @@ export interface ColorBackgroundComponent {
 export declare const DlcCapsule: CosmicCapsuleComponent;
 export declare const DlcProgress: ProgressCapsuleComponent;
 export declare const DlcColor: ColorBackgroundComponent;
-export { DlcCapsule as 'dlc-capsule', DlcProgress as 'dlc-progress', DlcColor as 'dlc-color' };
 
 // 旧名兼容别名（deprecated）
 export declare const CosmicCapsule: CosmicCapsuleComponent;
 export declare const ProgressCapsule: ProgressCapsuleComponent;
 export declare const ColorBackground: ColorBackgroundComponent;
 declare const _default: {
-  'dlc-capsule': CosmicCapsuleComponent;
-  'dlc-progress': ProgressCapsuleComponent;
-  'dlc-color': ColorBackgroundComponent;
+  DlcCapsule: CosmicCapsuleComponent;
+  DlcProgress: ProgressCapsuleComponent;
+  DlcColor: ColorBackgroundComponent;
   CosmicCapsule: CosmicCapsuleComponent;
   ProgressCapsule: ProgressCapsuleComponent;
   ColorBackground: ColorBackgroundComponent;