vft 0.0.239 → 0.0.240

package/es/components/color-picker/color-picker.vue2.js

@@ -1,11 +1,11 @@
-import { defineComponent as U, ref as u, reactive as ie, computed as h, onMounted as se, watch as w, nextTick as g, provide as ce, createBlock as C, openBlock as m, unref as o, withCtx as V, createElementVNode as p, withKeys as K, normalizeClass as t, createElementBlock as x, createCommentVNode as y, normalizeStyle as ue, withDirectives as L, createVNode as f, vShow as pe, createTextVNode as H } from "vue";
+import { defineComponent as U, ref as s, reactive as ie, computed as v, onMounted as se, watch as w, nextTick as g, provide as ue, createBlock as C, openBlock as p, unref as o, withCtx as V, createElementVNode as u, withKeys as K, normalizeClass as n, createElementBlock as x, createCommentVNode as y, normalizeStyle as ce, withDirectives as L, createVNode as d, vShow as pe, createTextVNode as H } from "vue";
 import { ClickOutside as de } from "@vft/directives";
 import { VftButton as M } from "../button/index.js";
 import "../form/index.js";
 import { VftIcon as O } from "../icon/index.js";
 import { VftInput as me } from "../input/index.js";
 import { VftTooltip as fe } from "../tooltip/index.js";
-import { UPDATE_MODEL_EVENT as P, CHANGE_EVENT as ve } from "../../constants/event.js";
+import { UPDATE_MODEL_EVENT as _, CHANGE_EVENT as ve } from "../../constants/event.js";
 import "@vueuse/core";
 import "@vft/utils";
 import { debugWarn as R } from "../../utils/error.js";
@@ -20,13 +20,13 @@ import we from "./components/hue-slider.vue.js";
 import ge from "./components/predefine.vue.js";
 import Ce from "./components/sv-panel.vue.js";
 import { colorPickerContextKey as Ve } from "./contants.js";
-import $ from "./utils/color.js";
+import P from "./utils/color.js";
 import { useFormItem as ye, useFormItemInputId as Ee } from "../form/hooks/use-form-item.js";
-import { useFormSize as Ae, useFormDisabled as Se } from "../form/hooks/use-form-common-props.js";
-const _e = ["id", "aria-label", "aria-labelledby", "aria-description", "tabindex"], Pe = U({
+import { useFormSize as Ae, useFormDisabled as Ie } from "../form/hooks/use-form-common-props.js";
+const Se = ["id", "aria-label", "aria-labelledby", "aria-description", "tabindex"], _e = U({
   name: "VftColorPicker"
 }), eo = /* @__PURE__ */ U({
-  ...Pe,
+  ..._e,
   props: {
     modelValue: {},
     id: {},
@@ -41,104 +41,103 @@ const _e = ["id", "aria-label", "aria-labelledby", "aria-description", "tabindex
     validateEvent: { type: Boolean, default: !0 }
   },
   emits: [
-    P,
+    _,
     ve,
     "activeChange",
     "click-outside"
   ],
   setup(G, { expose: W, emit: j }) {
-    const a = G, d = j, l = he("color"), { formItem: i } = ye(), q = Ae(), E = Se(), { inputId: J, isLabeledByFormItem: z } = Ee(a, {
-      formItemContext: i
-    }), B = u(), Q = u(), F = u(), X = u();
+    const a = G, c = j, l = he("color"), { formItem: b } = ye(), q = Ae(), E = Ie(), { inputId: J, isLabeledByFormItem: $ } = Ee(a, {
+      formItemContext: b
+    }), z = s(), Q = s(), B = s(), X = s();
     let A = !0;
     const r = ie(
-      new $({
+      new P({
         enableAlpha: a.showAlpha,
         format: a.colorFormat || "",
         value: a.modelValue
       })
-    ), v = u(!1), s = u(!1), b = u(""), Y = h(() => !a.modelValue && !s.value ? "transparent" : le(r, a.showAlpha)), S = h(() => !a.modelValue && !s.value ? "" : r.value), Z = h(() => z.value ? void 0 : a.label || "色彩选择器"), ee = h(() => z.value ? i == null ? void 0 : i.labelId : void 0), oe = h(() => [
+    ), m = s(!1), i = s(!1), f = s(""), Y = v(() => !a.modelValue && !i.value ? "transparent" : le(r, a.showAlpha)), I = v(() => !a.modelValue && !i.value ? "" : r.value), Z = v(() => $.value ? void 0 : a.label || "色彩选择器"), ee = v(() => $.value ? b?.labelId : void 0), oe = v(() => [
       l.b("picker"),
       l.is("disabled", E.value),
       l.bm("picker", q.value)
     ]);
-    function le(e, n) {
-      if (!(e instanceof $))
+    function le(e, t) {
+      if (!(e instanceof P))
         throw new TypeError("color should be instance of _color Class");
-      const { r: c, g: I, b: D } = e.toRgb();
-      return n ? `rgba(${c}, ${I}, ${D}, ${e.get("alpha") / 100})` : `rgb(${c}, ${I}, ${D})`;
+      const { r: k, g: T, b: D } = e.toRgb();
+      return t ? `rgba(${k}, ${T}, ${D}, ${e.get("alpha") / 100})` : `rgb(${k}, ${T}, ${D})`;
     }
     function ae(e) {
-      v.value = e;
+      m.value = e;
     }
-    const k = be(ae, 100);
+    const h = be(ae, 100);
     function re(e) {
-      k(!1), _(), d("click-outside", e);
+      h(!1), S(), c("click-outside", e);
     }
-    function _() {
+    function S() {
       g(() => {
         a.modelValue ? r.fromString(a.modelValue) : (r.value = "", g(() => {
-          s.value = !1;
+          i.value = !1;
         }));
       });
     }
-    function N() {
-      E.value || k(!v.value);
+    function F() {
+      E.value || h(!m.value);
     }
-    function T() {
-      r.fromString(b.value);
+    function N() {
+      r.fromString(f.value);
     }
     function te() {
       const e = r.value;
-      d(P, e), d("change", e), a.validateEvent && (i == null || i.validate("change").catch((n) => R(n))), k(!1), g(() => {
-        const n = new $({
+      c(_, e), c("change", e), a.validateEvent && b?.validate("change").catch((t) => R(t)), h(!1), g(() => {
+        const t = new P({
           enableAlpha: a.showAlpha,
           format: a.colorFormat || "",
           value: a.modelValue
         });
-        r.compare(n) || _();
+        r.compare(t) || S();
       });
     }
     function ne() {
-      k(!1), d(P, null), d("change", null), a.modelValue !== null && a.validateEvent && (i == null || i.validate("change").catch((e) => R(e))), _();
+      h(!1), c(_, null), c("change", null), a.modelValue !== null && a.validateEvent && b?.validate("change").catch((e) => R(e)), S();
     }
     return se(() => {
-      a.modelValue && (b.value = S.value);
+      a.modelValue && (f.value = I.value);
     }), w(
       () => a.modelValue,
       (e) => {
-        e ? e && e !== r.value && (A = !1, r.fromString(e)) : s.value = !1;
+        e ? e && e !== r.value && (A = !1, r.fromString(e)) : i.value = !1;
       }
     ), w(
-      () => S.value,
+      () => I.value,
       (e) => {
-        b.value = e, A && d("activeChange", e), A = !0;
+        f.value = e, A && c("activeChange", e), A = !0;
       }
     ), w(
       () => r.value,
       () => {
-        !a.modelValue && !s.value && (s.value = !0);
+        !a.modelValue && !i.value && (i.value = !0);
       }
     ), w(
-      () => v.value,
+      () => m.value,
       () => {
         g(() => {
-          var e, n, c;
-          (e = B.value) == null || e.update(), (n = Q.value) == null || n.update(), (c = F.value) == null || c.update();
+          z.value?.update(), Q.value?.update(), B.value?.update();
         });
       }
-    ), ce(Ve, {
-      currentColor: S
+    ), ue(Ve, {
+      currentColor: I
     }), W({
       /**
        * @description current color object
        */
       color: r,
-      showPicker: v
-    }), (e, n) => (m(), C(o(fe), {
+      showPicker: m
+    }), (e, t) => (p(), C(o(fe), {
       ref_key: "popper",
       ref: X,
-      visible: v.value,
+      visible: m.value,
       "show-arrow": !1,
       "fallback-placements": ["bottom", "top", "right", "left"],
       offset: 0,
@@ -151,70 +150,72 @@ const _e = ["id", "aria-label", "aria-labelledby", "aria-description", "tabindex
       persistent: ""
     }, {
       content: V(() => [
-        L((m(), x("div", null, [
-          p("div", {
-            class: t(o(l).be("dropdown", "main-wrapper"))
+        L((p(), x("div", null, [
+          u("div", {
+            class: n(o(l).be("dropdown", "main-wrapper"))
           }, [
-            f(we, {
+            d(we, {
               ref_key: "hue",
-              ref: B,
+              ref: z,
               class: "hue-slider",
               color: r,
               vertical: ""
             }, null, 8, ["color"]),
-            f(Ce, {
+            d(Ce, {
               ref: "svPanel",
               color: r
             }, null, 8, ["color"])
           ], 2),
-          e.showAlpha ? (m(), C(ke, {
+          e.showAlpha ? (p(), C(ke, {
             key: 0,
             ref_key: "alpha",
-            ref: F,
+            ref: B,
             color: r
           }, null, 8, ["color"])) : y("", !0),
-          e.predefine ? (m(), C(ge, {
+          e.predefine ? (p(), C(ge, {
             key: 1,
             ref: "predefine",
             color: r,
             colors: e.predefine
           }, null, 8, ["color", "colors"])) : y("", !0),
-          p("div", {
-            class: t(o(l).be("dropdown", "btns"))
+          u("div", {
+            class: n(o(l).be("dropdown", "btns"))
           }, [
-            p("span", {
-              class: t(o(l).be("dropdown", "value"))
+            u("span", {
+              class: n(o(l).be("dropdown", "value"))
             }, [
-              f(o(me), {
-                modelValue: b.value,
-                "onUpdate:modelValue": n[0] || (n[0] = (c) => b.value = c),
+              d(o(me), {
+                modelValue: f.value,
+                "onUpdate:modelValue": t[0] || (t[0] = (k) => f.value = k),
                 "validate-event": !1,
                 size: "small",
-                onKeyup: K(T, ["enter"]),
-                onBlur: T
+                onKeyup: K(N, ["enter"]),
+                onBlur: N
               }, null, 8, ["modelValue"])
             ], 2),
-            f(o(M), {
-              class: t(o(l).be("dropdown", "link-btn")),
+            d(o(M), {
+              class: n(o(l).be("dropdown", "link-btn")),
               text: "",
               size: "small",
               onClick: ne
             }, {
-              default: V(() => [
+              default: V(() => t[1] || (t[1] = [
                 H(" 取消 ")
-              ]),
-              _: 1
+              ])),
+              _: 1,
+              __: [1]
             }, 8, ["class"]),
-            f(o(M), {
+            d(o(M), {
               plain: "",
               size: "small",
-              class: t(o(l).be("dropdown", "btn")),
+              class: n(o(l).be("dropdown", "btn")),
               onClick: te
             }, {
-              default: V(() => [
+              default: V(() => t[2] || (t[2] = [
                 H(" 确认 ")
-              ]),
-              _: 1
+              ])),
+              _: 1,
+              __: [2]
             }, 8, ["class"])
           ], 2)
         ])), [
@@ -222,48 +223,48 @@ const _e = ["id", "aria-label", "aria-labelledby", "aria-description", "tabindex
         ])
       ]),
       default: V(() => [
-        p("div", {
+        u("div", {
           id: o(J),
-          class: t(oe.value),
+          class: n(oe.value),
           role: "button",
           "aria-label": Z.value,
           "aria-labelledby": ee.value,
           "aria-description": `目前色彩為 {color}。按一下 Enter 以選擇新色彩${e.modelValue}`,
           tabindex: e.tabindex,
-          onKeydown: K(N, ["enter"])
+          onKeydown: K(F, ["enter"])
         }, [
-          o(E) ? (m(), x("div", {
+          o(E) ? (p(), x("div", {
             key: 0,
-            class: t(o(l).be("picker", "mask"))
+            class: n(o(l).be("picker", "mask"))
           }, null, 2)) : y("", !0),
-          p("div", {
-            class: t(o(l).be("picker", "trigger")),
-            onClick: N
+          u("div", {
+            class: n(o(l).be("picker", "trigger")),
+            onClick: F
           }, [
-            p("span", {
-              class: t([o(l).be("picker", "color"), o(l).is("alpha", e.showAlpha)])
+            u("span", {
+              class: n([o(l).be("picker", "color"), o(l).is("alpha", e.showAlpha)])
             }, [
-              p("span", {
-                class: t(o(l).be("picker", "color-inner")),
-                style: ue({
+              u("span", {
+                class: n(o(l).be("picker", "color-inner")),
+                style: ce({
                   backgroundColor: Y.value
                 })
               }, [
-                L(f(o(O), {
+                L(d(o(O), {
                   icon: "icon-arrow-down",
-                  class: t([o(l).be("picker", "icon"), o(l).is("icon-arrow-down")])
+                  class: n([o(l).be("picker", "icon"), o(l).is("icon-arrow-down")])
                 }, null, 8, ["class"]), [
-                  [pe, e.modelValue || s.value]
+                  [pe, e.modelValue || i.value]
                 ]),
-                !e.modelValue && !s.value ? (m(), C(o(O), {
+                !e.modelValue && !i.value ? (p(), C(o(O), {
                   key: 0,
                   icon: "icon-circle-close",
-                  class: t([o(l).be("picker", "empty"), o(l).is("icon-close")])
+                  class: n([o(l).be("picker", "empty"), o(l).is("icon-close")])
                 }, null, 8, ["class"])) : y("", !0)
               ], 6)
             ], 2)
           ], 2)
-        ], 42, _e)
+        ], 42, Se)
       ]),
       _: 1
     }, 8, ["visible", "popper-class", "transition"]));

package/es/components/color-picker/components/alpha-slider.vue.d.ts

@@ -3,7 +3,7 @@ export interface AlphaSliderProps {
     color: Color;
     vertical?: boolean;
 }
-declare const _default: import("vue").DefineComponent<__VLS_TypePropsToRuntimeProps<AlphaSliderProps>, {
+declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<__VLS_TypePropsToRuntimeProps<AlphaSliderProps>>, {
     /**
      * @description update alpha slider manually
      * @type {Function}
@@ -13,13 +13,13 @@ declare const _default: import("vue").DefineComponent<__VLS_TypePropsToRuntimePr
      * @description bar element ref
      * @type {HTMLElement}
      */
-    bar: import("vue").ShallowRef<HTMLElement | undefined>;
+    bar: import("vue").ShallowRef<HTMLElement | undefined, HTMLElement | undefined>;
     /**
      * @description thumb element ref
      * @type {HTMLElement}
      */
-    thumb: import("vue").ShallowRef<HTMLElement | undefined>;
-}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_TypePropsToRuntimeProps<AlphaSliderProps>>>, {}, {}>;
+    thumb: import("vue").ShallowRef<HTMLElement | undefined, HTMLElement | undefined>;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_TypePropsToRuntimeProps<AlphaSliderProps>>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;
 type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
 type __VLS_TypePropsToRuntimeProps<T> = {

package/es/components/color-picker/components/hue-slider.vue.d.ts

@@ -1,28 +1,28 @@
 import type { PropType } from 'vue';
 import type Color from '../utils/color';
-declare const _default: import("vue").DefineComponent<{
+declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     color: {
         type: PropType<Color>;
         required: true;
     };
     vertical: BooleanConstructor;
-}, {
-    bar: import("vue").Ref<HTMLElement | undefined>;
-    thumb: import("vue").Ref<HTMLElement | undefined>;
-    thumbLeft: import("vue").Ref<number>;
-    thumbTop: import("vue").Ref<number>;
+}>, {
+    bar: import("vue").Ref<HTMLElement | undefined, HTMLElement | undefined>;
+    thumb: import("vue").Ref<HTMLElement | undefined, HTMLElement | undefined>;
+    thumbLeft: import("vue").Ref<number, number>;
+    thumbTop: import("vue").Ref<number, number>;
     hueValue: import("vue").ComputedRef<any>;
     handleClick: (event: MouseEvent | TouchEvent) => void;
     update: () => void;
     ns: {
-        namespace: import("vue").Ref<string>;
+        namespace: import("vue").Ref<string, string>;
         b: (blockSuffix?: string) => string;
-        e: (element?: string | undefined) => string;
-        m: (modifier?: string | undefined) => string;
-        be: (blockSuffix?: string | undefined, element?: string | undefined) => string;
-        em: (element?: string | undefined, modifier?: string | undefined) => string;
-        bm: (blockSuffix?: string | undefined, modifier?: string | undefined) => string;
-        bem: (blockSuffix?: string | undefined, element?: string | undefined, modifier?: string | undefined) => string;
+        e: (element?: string) => string;
+        m: (modifier?: string) => string;
+        be: (blockSuffix?: string, element?: string) => string;
+        em: (element?: string, modifier?: string) => string;
+        bm: (blockSuffix?: string, modifier?: string) => string;
+        bem: (blockSuffix?: string, element?: string, modifier?: string) => string;
         is: {
             (name: string, state: boolean | undefined): string;
             (name: string): string;
@@ -32,13 +32,13 @@ declare const _default: import("vue").DefineComponent<{
         cssVarBlock: (object: Record<string, string | undefined>) => Record<string, string>;
         cssVarBlockName: (name: string) => string;
     };
-}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     color: {
         type: PropType<Color>;
         required: true;
     };
     vertical: BooleanConstructor;
-}>>, {
+}>> & Readonly<{}>, {
     vertical: boolean;
-}, {}>;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;

package/es/components/color-picker/components/predefine.vue.d.ts

@@ -1,6 +1,6 @@
 import type { PropType, Ref } from 'vue';
 import Color from '../utils/color';
-declare const _default: import("vue").DefineComponent<{
+declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     colors: {
         type: PropType<string[]>;
         required: true;
@@ -9,18 +9,18 @@ declare const _default: import("vue").DefineComponent<{
         type: PropType<Color>;
         required: true;
     };
-}, {
-    rgbaColors: Ref<Color[]>;
+}>, {
+    rgbaColors: Ref<Color[], Color[]>;
     handleSelect: (index: number) => void;
     ns: {
-        namespace: Ref<string>;
+        namespace: Ref<string, string>;
         b: (blockSuffix?: string) => string;
-        e: (element?: string | undefined) => string;
-        m: (modifier?: string | undefined) => string;
-        be: (blockSuffix?: string | undefined, element?: string | undefined) => string;
-        em: (element?: string | undefined, modifier?: string | undefined) => string;
-        bm: (blockSuffix?: string | undefined, modifier?: string | undefined) => string;
-        bem: (blockSuffix?: string | undefined, element?: string | undefined, modifier?: string | undefined) => string;
+        e: (element?: string) => string;
+        m: (modifier?: string) => string;
+        be: (blockSuffix?: string, element?: string) => string;
+        em: (element?: string, modifier?: string) => string;
+        bm: (blockSuffix?: string, modifier?: string) => string;
+        bem: (blockSuffix?: string, element?: string, modifier?: string) => string;
         is: {
             (name: string, state: boolean | undefined): string;
             (name: string): string;
@@ -30,7 +30,7 @@ declare const _default: import("vue").DefineComponent<{
         cssVarBlock: (object: Record<string, string | undefined>) => Record<string, string>;
         cssVarBlockName: (name: string) => string;
     };
-}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     colors: {
         type: PropType<string[]>;
         required: true;
@@ -39,5 +39,5 @@ declare const _default: import("vue").DefineComponent<{
         type: PropType<Color>;
         required: true;
     };
-}>>, {}, {}>;
+}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;

package/es/components/color-picker/components/sv-panel.vue.d.ts

@@ -1,14 +1,14 @@
 import type { PropType } from 'vue';
 import type Color from '../utils/color';
-declare const _default: import("vue").DefineComponent<{
+declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     color: {
         type: PropType<Color>;
         required: true;
     };
-}, {
-    cursorTop: import("vue").Ref<number>;
-    cursorLeft: import("vue").Ref<number>;
-    background: import("vue").Ref<string>;
+}>, {
+    cursorTop: import("vue").Ref<number, number>;
+    cursorLeft: import("vue").Ref<number, number>;
+    background: import("vue").Ref<string, string>;
     colorValue: import("vue").ComputedRef<{
         hue: any;
         value: any;
@@ -16,14 +16,14 @@ declare const _default: import("vue").DefineComponent<{
     handleDrag: (event: MouseEvent | TouchEvent) => void;
     update: () => void;
     ns: {
-        namespace: import("vue").Ref<string>;
+        namespace: import("vue").Ref<string, string>;
         b: (blockSuffix?: string) => string;
-        e: (element?: string | undefined) => string;
-        m: (modifier?: string | undefined) => string;
-        be: (blockSuffix?: string | undefined, element?: string | undefined) => string;
-        em: (element?: string | undefined, modifier?: string | undefined) => string;
-        bm: (blockSuffix?: string | undefined, modifier?: string | undefined) => string;
-        bem: (blockSuffix?: string | undefined, element?: string | undefined, modifier?: string | undefined) => string;
+        e: (element?: string) => string;
+        m: (modifier?: string) => string;
+        be: (blockSuffix?: string, element?: string) => string;
+        em: (element?: string, modifier?: string) => string;
+        bm: (blockSuffix?: string, modifier?: string) => string;
+        bem: (blockSuffix?: string, element?: string, modifier?: string) => string;
         is: {
             (name: string, state: boolean | undefined): string;
             (name: string): string;
@@ -33,10 +33,10 @@ declare const _default: import("vue").DefineComponent<{
         cssVarBlock: (object: Record<string, string | undefined>) => Record<string, string>;
         cssVarBlockName: (name: string) => string;
     };
-}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     color: {
         type: PropType<Color>;
         required: true;
     };
-}>>, {}, {}>;
+}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;

package/es/components/color-picker/components/sv-panel.vue.js

@@ -1,32 +1,31 @@
-import l from "./sv-panel.vue2.js";
-import { createElementBlock as n, openBlock as t, normalizeStyle as r, normalizeClass as o, createElementVNode as s } from "vue";
-import a from "../../../_virtual/_plugin-vue_export-helper.js";
-const c = /* @__PURE__ */ s("div", null, null, -1), i = [
-  c
-];
-function d(e, p, u, m, f, v) {
-  return t(), n("div", {
+import n from "./sv-panel.vue2.js";
+import { createElementBlock as a, openBlock as t, normalizeStyle as s, normalizeClass as o, createElementVNode as r } from "vue";
+import i from "../../../_virtual/_plugin-vue_export-helper.js";
+function p(e, l, u, d, c, m) {
+  return t(), a("div", {
     class: o(e.ns.b()),
-    style: r({
+    style: s({
       backgroundColor: e.background
     })
   }, [
-    s("div", {
+    r("div", {
       class: o(e.ns.e("white"))
     }, null, 2),
-    s("div", {
+    r("div", {
       class: o(e.ns.e("black"))
     }, null, 2),
-    s("div", {
+    r("div", {
       class: o(e.ns.e("cursor")),
-      style: r({
+      style: s({
         top: e.cursorTop + "px",
         left: e.cursorLeft + "px"
       })
-    }, i, 6)
+    }, l[0] || (l[0] = [
+      r("div", null, null, -1)
+    ]), 6)
   ], 6);
 }
-const h = /* @__PURE__ */ a(l, [["render", d]]);
+const b = /* @__PURE__ */ i(n, [["render", p]]);
 export {
-  h as default
+  b as default
 };

package/es/components/color-picker/composables/use-alpha-slider.d.ts

@@ -1,11 +1,11 @@
 import type { AlphaSliderProps } from '../components/alpha-slider.vue';
 export declare const useAlphaSlider: (props: AlphaSliderProps) => {
-    thumb: import("vue").ShallowRef<HTMLElement | undefined>;
-    bar: import("vue").ShallowRef<HTMLElement | undefined>;
+    thumb: import("vue").ShallowRef<HTMLElement | undefined, HTMLElement | undefined>;
+    bar: import("vue").ShallowRef<HTMLElement | undefined, HTMLElement | undefined>;
     handleDrag: (event: MouseEvent | TouchEvent) => void;
     handleClick: (event: MouseEvent | TouchEvent) => void;
 };
-export declare const useAlphaSliderDOM: (props: AlphaSliderProps, { bar, thumb, handleDrag, }: Pick<ReturnType<typeof useAlphaSlider>, 'bar' | 'thumb' | 'handleDrag'>) => {
+export declare const useAlphaSliderDOM: (props: AlphaSliderProps, { bar, thumb, handleDrag, }: Pick<ReturnType<typeof useAlphaSlider>, "bar" | "thumb" | "handleDrag">) => {
     rootKls: import("vue").ComputedRef<string[]>;
     barKls: import("vue").ComputedRef<string>;
     barStyle: import("vue").ComputedRef<{