qy-vue-plugins 1.0.2-beta → 1.0.2

package/dist/chunks/el-color-picker-panel-BfOVWDkH.js

@@ -1,1024 +0,0 @@
-import { getCurrentInstance as ne, shallowRef as Ce, computed as y, ref as V, onMounted as he, watch as R, defineComponent as A, createElementBlock as I, openBlock as D, normalizeClass as E, unref as l, createElementVNode as L, normalizeStyle as M, inject as De, watchEffect as ra, Fragment as ia, renderList as sa, reactive as ua, nextTick as j, provide as Oe, createBlock as te, createCommentVNode as we, createVNode as O, renderSlot as ca, withCtx as x, mergeProps as Ee, withDirectives as ie, vShow as Se, withKeys as da, createTextVNode as Pe, toDisplayString as Ke } from "vue";
-import { _ as H, U as W, d as Fe, c as Be, w as xe, C as fe, b as fa, e as va, E as Te } from "./aria-GiGFrmP1.js";
-import { isClient as ha, reactiveComputed as pa } from "@vueuse/core";
-import { u as Q, E as ba } from "./el-popper-zUql4Vp-.js";
-import { T as Z, E as Ve } from "./el-button-Dh7ROB0R.js";
-import { ArrowDown as ma, Close as ga } from "@element-plus/icons-vue";
-import { L as _a, M as ka, j as Y, m as F, u as q, k as le, a as ee, q as ae, O as $e, f as X, o as ya } from "./base-DfCoKyyG.js";
-import { u as U, b as Ca, c as wa } from "./index-Dq3Y5qiS.js";
-import { u as Ea, a as Sa, p as Pa } from "./index-DHO_7w-5.js";
-import { E as Ka } from "./el-input-DCpRXscw.js";
-import { g as pe, E as $ } from "./index-Cw_w6CLf.js";
-import { t as Le, C as Ta } from "./el-select-Dil0JEvg.js";
-var se = function() {
-  return _a.Date.now();
-}, Va = "Expected a function", $a = Math.max, La = Math.min;
-function Aa(e, t, a) {
-  var n, i, o, r, f, p, g = 0, C = !1, b = !1, u = !0;
-  if (typeof e != "function")
-    throw new TypeError(Va);
-  t = Le(t) || 0, ka(a) && (C = !!a.leading, b = "maxWait" in a, o = b ? $a(Le(a.maxWait) || 0, t) : o, u = "trailing" in a ? !!a.trailing : u);
-  function _(k) {
-    var P = n, B = i;
-    return n = i = void 0, g = k, r = e.apply(B, P), r;
-  }
-  function m(k) {
-    return g = k, f = setTimeout(h, t), C ? _(k) : r;
-  }
-  function d(k) {
-    var P = k - p, B = k - g, G = t - P;
-    return b ? La(G, o - B) : G;
-  }
-  function s(k) {
-    var P = k - p, B = k - g;
-    return p === void 0 || P >= t || P < 0 || b && B >= o;
-  }
-  function h() {
-    var k = se();
-    if (s(k))
-      return v(k);
-    f = setTimeout(h, d(k));
-  }
-  function v(k) {
-    return f = void 0, u && n ? _(k) : (n = i = void 0, r);
-  }
-  function w() {
-    f !== void 0 && clearTimeout(f), g = 0, n = p = i = f = void 0;
-  }
-  function S() {
-    return f === void 0 ? r : v(se());
-  }
-  function K() {
-    var k = se(), P = s(k);
-    if (n = arguments, i = this, p = k, P) {
-      if (f === void 0)
-        return m(p);
-      if (b)
-        return clearTimeout(f), f = setTimeout(h, t), _(p);
-    }
-    return f === void 0 && (f = setTimeout(h, t)), r;
-  }
-  return K.cancel = w, K.flush = S, K;
-}
-const Ie = Y({
-  color: {
-    type: F(Object),
-    required: !0
-  },
-  vertical: Boolean,
-  disabled: Boolean
-}), Ra = Ie;
-let ue = !1;
-function ve(e, t) {
-  if (!ha)
-    return;
-  const a = function(o) {
-    var r;
-    (r = t.drag) == null || r.call(t, o);
-  }, n = function(o) {
-    var r;
-    document.removeEventListener("mousemove", a), document.removeEventListener("mouseup", n), document.removeEventListener("touchmove", a), document.removeEventListener("touchend", n), document.onselectstart = null, document.ondragstart = null, ue = !1, (r = t.end) == null || r.call(t, o);
-  }, i = function(o) {
-    var r;
-    ue || (document.onselectstart = () => !1, document.ondragstart = () => !1, document.addEventListener("mousemove", a), document.addEventListener("mouseup", n), document.addEventListener("touchmove", a), document.addEventListener("touchend", n), ue = !0, (r = t.start) == null || r.call(t, o));
-  };
-  e.addEventListener("mousedown", i), e.addEventListener("touchstart", i, { passive: !1 });
-}
-const Me = (e) => {
-  let t, a;
-  return e.type === "touchend" ? (a = e.changedTouches[0].clientY, t = e.changedTouches[0].clientX) : e.type.startsWith("touch") ? (a = e.touches[0].clientY, t = e.touches[0].clientX) : (a = e.clientY, t = e.clientX), {
-    clientX: t,
-    clientY: a
-  };
-}, Ne = (e, { key: t, minValue: a, maxValue: n }) => {
-  const i = ne(), o = Ce(), r = Ce(), f = y(() => e.color.get(t));
-  function p(u) {
-    var _;
-    if (e.disabled)
-      return;
-    u.target !== o.value && g(u), (_ = o.value) == null || _.focus();
-  }
-  function g(u) {
-    if (!r.value || !o.value || e.disabled)
-      return;
-    const m = i.vnode.el.getBoundingClientRect(), { clientX: d, clientY: s } = Me(u);
-    let h;
-    if (e.vertical) {
-      let v = s - m.top;
-      v = Math.max(o.value.offsetHeight / 2, v), v = Math.min(v, m.height - o.value.offsetHeight / 2), h = Math.round((v - o.value.offsetHeight / 2) / (m.height - o.value.offsetHeight) * n);
-    } else {
-      let v = d - m.left;
-      v = Math.max(o.value.offsetWidth / 2, v), v = Math.min(v, m.width - o.value.offsetWidth / 2), h = Math.round((v - o.value.offsetWidth / 2) / (m.width - o.value.offsetWidth) * n);
-    }
-    e.color.set(t, h);
-  }
-  function C(u) {
-    if (e.disabled)
-      return;
-    const { shiftKey: _ } = u, m = pe(u), d = _ ? 10 : 1, s = t === "hue" ? -1 : 1;
-    let h = !0;
-    switch (m) {
-      case $.left:
-      case $.down:
-        b(-d * s);
-        break;
-      case $.right:
-      case $.up:
-        b(d * s);
-        break;
-      case $.home:
-        e.color.set(t, t === "hue" ? n : a);
-        break;
-      case $.end:
-        e.color.set(t, t === "hue" ? a : n);
-        break;
-      case $.pageDown:
-        b(-4 * s);
-        break;
-      case $.pageUp:
-        b(4 * s);
-        break;
-      default:
-        h = !1;
-        break;
-    }
-    h && u.preventDefault();
-  }
-  function b(u) {
-    let _ = f.value + u;
-    _ = _ < a ? a : _ > n ? n : _, e.color.set(t, _);
-  }
-  return {
-    thumb: o,
-    bar: r,
-    currentValue: f,
-    handleDrag: g,
-    handleClick: p,
-    handleKeydown: C
-  };
-}, We = (e, {
-  namespace: t,
-  maxValue: a,
-  bar: n,
-  thumb: i,
-  currentValue: o,
-  handleDrag: r,
-  getBackground: f
-}) => {
-  const p = ne(), g = q(t), C = V(0), b = V(0), u = V();
-  function _() {
-    if (!i.value || e.vertical)
-      return 0;
-    const K = p.vnode.el, k = o.value;
-    return K ? Math.round(k * (K.offsetWidth - i.value.offsetWidth / 2) / a) : 0;
-  }
-  function m() {
-    if (!i.value)
-      return 0;
-    const K = p.vnode.el;
-    if (!e.vertical)
-      return 0;
-    const k = o.value;
-    return K ? Math.round(k * (K.offsetHeight - i.value.offsetHeight / 2) / a) : 0;
-  }
-  function d() {
-    C.value = _(), b.value = m(), u.value = f?.();
-  }
-  he(() => {
-    if (!n.value || !i.value)
-      return;
-    const K = {
-      drag: (k) => {
-        r(k);
-      },
-      end: (k) => {
-        r(k);
-      }
-    };
-    ve(n.value, K), ve(i.value, K), d();
-  }), R(o, () => d()), R(() => e.color.value, () => d());
-  const s = y(() => [
-    g.b(),
-    g.is("vertical", e.vertical),
-    g.is("disabled", e.disabled)
-  ]), h = y(() => g.e("bar")), v = y(() => g.e("thumb")), w = y(() => ({ background: u.value })), S = y(() => ({
-    left: le(C.value),
-    top: le(b.value)
-  }));
-  return {
-    rootKls: s,
-    barKls: h,
-    barStyle: w,
-    thumbKls: v,
-    thumbStyle: S,
-    thumbLeft: C,
-    thumbTop: b,
-    update: d
-  };
-}, Ae = 0, ce = 100, Da = A({
-  name: "ElColorAlphaSlider"
-}), Oa = /* @__PURE__ */ A({
-  ...Da,
-  props: Ie,
-  setup(e, { expose: t }) {
-    const a = e, { currentValue: n, bar: i, thumb: o, handleDrag: r, handleClick: f, handleKeydown: p } = Ne(a, { key: "alpha", minValue: Ae, maxValue: ce }), { rootKls: g, barKls: C, barStyle: b, thumbKls: u, thumbStyle: _, update: m } = We(a, {
-      namespace: "color-alpha-slider",
-      maxValue: ce,
-      currentValue: n,
-      bar: i,
-      thumb: o,
-      handleDrag: r,
-      getBackground: v
-    }), { t: d } = U(), s = y(() => d("el.colorpicker.alphaLabel")), h = y(() => d("el.colorpicker.alphaDescription", {
-      alpha: n.value,
-      color: a.color.value
-    }));
-    function v() {
-      if (a.color && a.color.value) {
-        const { r: w, g: S, b: K } = a.color.toRgb();
-        return `linear-gradient(to right, rgba(${w}, ${S}, ${K}, 0) 0%, rgba(${w}, ${S}, ${K}, 1) 100%)`;
-      }
-      return "";
-    }
-    return t({
-      update: m,
-      bar: i,
-      thumb: o
-    }), (w, S) => (D(), I("div", {
-      class: E(l(g))
-    }, [
-      L("div", {
-        ref_key: "bar",
-        ref: i,
-        class: E(l(C)),
-        style: M(l(b)),
-        onClick: l(f)
-      }, null, 14, ["onClick"]),
-      L("div", {
-        ref_key: "thumb",
-        ref: o,
-        class: E(l(u)),
-        style: M(l(_)),
-        "aria-label": l(s),
-        "aria-valuenow": l(n),
-        "aria-valuetext": l(h),
-        "aria-orientation": w.vertical ? "vertical" : "horizontal",
-        "aria-valuemin": Ae,
-        "aria-valuemax": ce,
-        role: "slider",
-        tabindex: w.disabled ? void 0 : 0,
-        "aria-disabled": w.disabled,
-        onKeydown: l(p)
-      }, null, 46, ["aria-label", "aria-valuenow", "aria-valuetext", "aria-orientation", "tabindex", "aria-disabled", "onKeydown"])
-    ], 2));
-  }
-});
-var Fa = /* @__PURE__ */ H(Oa, [["__file", "alpha-slider.vue"]]);
-const Re = 0, de = 360, Ba = A({
-  name: "ElColorHueSlider"
-}), xa = /* @__PURE__ */ A({
-  ...Ba,
-  props: Ra,
-  setup(e, { expose: t }) {
-    const a = e, { currentValue: n, bar: i, thumb: o, handleDrag: r, handleClick: f, handleKeydown: p } = Ne(a, { key: "hue", minValue: Re, maxValue: de }), { rootKls: g, barKls: C, thumbKls: b, thumbStyle: u, thumbTop: _, update: m } = We(a, {
-      namespace: "color-hue-slider",
-      maxValue: de,
-      currentValue: n,
-      bar: i,
-      thumb: o,
-      handleDrag: r
-    }), { t: d } = U(), s = y(() => d("el.colorpicker.hueLabel")), h = y(() => d("el.colorpicker.hueDescription", {
-      hue: n.value,
-      color: a.color.value
-    }));
-    return t({
-      bar: i,
-      thumb: o,
-      thumbTop: _,
-      update: m
-    }), (v, w) => (D(), I("div", {
-      class: E(l(g))
-    }, [
-      L("div", {
-        ref_key: "bar",
-        ref: i,
-        class: E(l(C)),
-        onClick: l(f)
-      }, null, 10, ["onClick"]),
-      L("div", {
-        ref_key: "thumb",
-        ref: o,
-        class: E(l(b)),
-        style: M(l(u)),
-        "aria-label": l(s),
-        "aria-valuenow": l(n),
-        "aria-valuetext": l(h),
-        "aria-orientation": v.vertical ? "vertical" : "horizontal",
-        "aria-valuemin": Re,
-        "aria-valuemax": de,
-        role: "slider",
-        tabindex: v.disabled ? void 0 : 0,
-        "aria-disabled": v.disabled,
-        onKeydown: l(p)
-      }, null, 46, ["aria-label", "aria-valuenow", "aria-valuetext", "aria-orientation", "tabindex", "aria-disabled", "onKeydown"])
-    ], 2));
-  }
-});
-var Ia = /* @__PURE__ */ H(xa, [["__file", "hue-slider.vue"]]);
-const Ma = Y({
-  colors: {
-    type: F(Array),
-    required: !0
-  },
-  color: {
-    type: F(Object),
-    required: !0
-  },
-  enableAlpha: {
-    type: Boolean,
-    required: !0
-  },
-  disabled: Boolean
-}), He = Y({
-  modelValue: {
-    type: F(String),
-    default: void 0
-  },
-  border: {
-    type: Boolean,
-    default: !0
-  },
-  showAlpha: Boolean,
-  colorFormat: String,
-  disabled: Boolean,
-  predefine: {
-    type: F(Array)
-  },
-  validateEvent: {
-    type: Boolean,
-    default: !0
-  }
-}), Na = {
-  [W]: (e) => ee(e) || ae(e)
-}, ze = Symbol("colorCommonPickerKey"), je = Symbol("colorPickerPanelContextKey");
-class oe {
-  constructor(t = {}) {
-    this._hue = 0, this._saturation = 100, this._value = 100, this._alpha = 100, this._tiny = new Z(), this._isValid = !1, this.enableAlpha = !1, this.format = "", this.value = "";
-    for (const a in t)
-      $e(t, a) && (this[a] = t[a]);
-    t.value ? this.fromString(t.value) : this.doOnChange();
-  }
-  set(t, a) {
-    if (arguments.length === 1 && typeof t == "object") {
-      for (const n in t)
-        $e(t, n) && this.set(n, t[n]);
-      return;
-    }
-    this[`_${t}`] = a, this._isValid = !0, this.doOnChange();
-  }
-  get(t) {
-    return ["hue", "saturation", "value", "alpha"].includes(t) ? Math.round(this[`_${t}`]) : this[`_${t}`];
-  }
-  toRgb() {
-    return this._isValid ? this._tiny.toRgb() : { r: 255, g: 255, b: 255, a: 0 };
-  }
-  fromString(t) {
-    const a = new Z(t);
-    if (this._isValid = a.isValid, a.isValid) {
-      const { h: n, s: i, v: o, a: r } = a.toHsv();
-      this._hue = n, this._saturation = i * 100, this._value = o * 100, this._alpha = r * 100;
-    } else
-      this._hue = 0, this._saturation = 100, this._value = 100, this._alpha = 100;
-    this.doOnChange();
-  }
-  clear() {
-    this._isValid = !1, this.value = "", this._hue = 0, this._saturation = 100, this._value = 100, this._alpha = 100;
-  }
-  compare(t) {
-    const a = new Z({
-      h: t._hue,
-      s: t._saturation / 100,
-      v: t._value / 100,
-      a: t._alpha / 100
-    });
-    return this._tiny.equals(a);
-  }
-  doOnChange() {
-    const { _hue: t, _saturation: a, _value: n, _alpha: i, format: o, enableAlpha: r } = this;
-    let f = o || (r ? "rgb" : "hex");
-    o === "hex" && r && (f = "hex8"), this._tiny = new Z({
-      h: t,
-      s: a / 100,
-      v: n / 100,
-      a: i / 100
-    }), this.value = this._isValid ? this._tiny.toString(f) : "";
-  }
-}
-const Wa = (e) => {
-  const { currentColor: t } = De(je), a = V(i(e.colors, e.color));
-  R(() => t.value, (o) => {
-    const r = new oe({
-      value: o,
-      enableAlpha: e.enableAlpha
-    });
-    a.value.forEach((f) => {
-      f.selected = r.compare(f);
-    });
-  }), ra(() => {
-    a.value = i(e.colors, e.color);
-  });
-  function n(o) {
-    e.color.fromString(e.colors[o]);
-  }
-  function i(o, r) {
-    return o.map((f) => {
-      const p = new oe({
-        value: f,
-        enableAlpha: e.enableAlpha
-      });
-      return p.selected = p.compare(r), p;
-    });
-  }
-  return {
-    rgbaColors: a,
-    handleSelect: n
-  };
-}, Ha = (e) => {
-  const t = q("color-predefine"), a = y(() => [t.b(), t.is("disabled", e.disabled)]), n = y(() => t.e("colors"));
-  function i(o) {
-    return [
-      t.e("color-selector"),
-      t.is("alpha", o.get("alpha") < 100),
-      { selected: o.selected }
-    ];
-  }
-  return {
-    rootKls: a,
-    colorsKls: n,
-    colorSelectorKls: i
-  };
-}, za = A({
-  name: "ElColorPredefine"
-}), ja = /* @__PURE__ */ A({
-  ...za,
-  props: Ma,
-  setup(e) {
-    const t = e, { rgbaColors: a, handleSelect: n } = Wa(t), { rootKls: i, colorsKls: o, colorSelectorKls: r } = Ha(t), { t: f } = U(), p = (g) => f("el.colorpicker.predefineDescription", { value: g });
-    return (g, C) => (D(), I("div", {
-      class: E(l(i))
-    }, [
-      L("div", {
-        class: E(l(o))
-      }, [
-        (D(!0), I(ia, null, sa(l(a), (b, u) => (D(), I("button", {
-          key: g.colors[u],
-          type: "button",
-          disabled: g.disabled,
-          "aria-label": p(b.value),
-          class: E(l(r)(b)),
-          onClick: (_) => l(n)(u)
-        }, [
-          L("div", {
-            style: M({ backgroundColor: b.value })
-          }, null, 4)
-        ], 10, ["disabled", "aria-label", "onClick"]))), 128))
-      ], 2)
-    ], 2));
-  }
-});
-var Xa = /* @__PURE__ */ H(ja, [["__file", "predefine.vue"]]);
-const Ya = Y({
-  color: {
-    type: F(Object),
-    required: !0
-  },
-  disabled: Boolean
-}), qa = (e) => {
-  const t = ne(), a = V(), n = V(0), i = V(0), o = V("hsl(0, 100%, 50%)"), r = y(() => e.color.get("saturation")), f = y(() => e.color.get("value")), p = y(() => e.color.get("hue"));
-  function g(m) {
-    var d;
-    if (e.disabled)
-      return;
-    m.target !== a.value && C(m), (d = a.value) == null || d.focus({ preventScroll: !0 });
-  }
-  function C(m) {
-    if (e.disabled)
-      return;
-    const s = t.vnode.el.getBoundingClientRect(), { clientX: h, clientY: v } = Me(m);
-    let w = h - s.left, S = v - s.top;
-    w = Math.max(0, w), w = Math.min(w, s.width), S = Math.max(0, S), S = Math.min(S, s.height), i.value = w, n.value = S, e.color.set({
-      saturation: w / s.width * 100,
-      value: 100 - S / s.height * 100
-    });
-  }
-  function b(m) {
-    if (e.disabled)
-      return;
-    const { shiftKey: d } = m, s = pe(m), h = d ? 10 : 1;
-    let v = !0;
-    switch (s) {
-      case $.left:
-        u(-h);
-        break;
-      case $.right:
-        u(h);
-        break;
-      case $.up:
-        _(h);
-        break;
-      case $.down:
-        _(-h);
-        break;
-      default:
-        v = !1;
-        break;
-    }
-    v && m.preventDefault();
-  }
-  function u(m) {
-    let d = r.value + m;
-    d = d < 0 ? 0 : d > 100 ? 100 : d, e.color.set("saturation", d);
-  }
-  function _(m) {
-    let d = f.value + m;
-    d = d < 0 ? 0 : d > 100 ? 100 : d, e.color.set("value", d);
-  }
-  return {
-    cursorRef: a,
-    cursorTop: n,
-    cursorLeft: i,
-    background: o,
-    saturation: r,
-    brightness: f,
-    hue: p,
-    handleClick: g,
-    handleDrag: C,
-    handleKeydown: b
-  };
-}, Ua = (e, {
-  cursorTop: t,
-  cursorLeft: a,
-  background: n,
-  handleDrag: i
-}) => {
-  const o = ne(), r = q("color-svpanel");
-  function f() {
-    const u = e.color.get("saturation"), _ = e.color.get("value"), m = o.vnode.el, { clientWidth: d, clientHeight: s } = m;
-    a.value = u * d / 100, t.value = (100 - _) * s / 100, n.value = `hsl(${e.color.get("hue")}, 100%, 50%)`;
-  }
-  he(() => {
-    ve(o.vnode.el, {
-      drag: (u) => {
-        i(u);
-      },
-      end: (u) => {
-        i(u);
-      }
-    }), f();
-  }), R([
-    () => e.color.get("hue"),
-    () => e.color.get("value"),
-    () => e.color.value
-  ], () => f());
-  const p = y(() => r.b()), g = y(() => r.e("cursor")), C = y(() => ({
-    backgroundColor: n.value
-  })), b = y(() => ({
-    top: le(t.value),
-    left: le(a.value)
-  }));
-  return {
-    rootKls: p,
-    cursorKls: g,
-    rootStyle: C,
-    cursorStyle: b,
-    update: f
-  };
-}, Ga = A({
-  name: "ElSvPanel"
-}), Ja = /* @__PURE__ */ A({
-  ...Ga,
-  props: Ya,
-  setup(e, { expose: t }) {
-    const a = e, {
-      cursorRef: n,
-      cursorTop: i,
-      cursorLeft: o,
-      background: r,
-      saturation: f,
-      brightness: p,
-      handleClick: g,
-      handleDrag: C,
-      handleKeydown: b
-    } = qa(a), { rootKls: u, cursorKls: _, rootStyle: m, cursorStyle: d, update: s } = Ua(a, {
-      cursorTop: i,
-      cursorLeft: o,
-      background: r,
-      handleDrag: C
-    }), { t: h } = U(), v = y(() => h("el.colorpicker.svLabel")), w = y(() => h("el.colorpicker.svDescription", {
-      saturation: f.value,
-      brightness: p.value,
-      color: a.color.value
-    }));
-    return t({
-      update: s
-    }), (S, K) => (D(), I("div", {
-      class: E(l(u)),
-      style: M(l(m)),
-      onClick: l(g)
-    }, [
-      L("div", {
-        ref_key: "cursorRef",
-        ref: n,
-        class: E(l(_)),
-        style: M(l(d)),
-        tabindex: S.disabled ? void 0 : 0,
-        "aria-disabled": S.disabled,
-        role: "slider",
-        "aria-valuemin": "0,0",
-        "aria-valuemax": "100,100",
-        "aria-label": l(v),
-        "aria-valuenow": `${l(f)},${l(p)}`,
-        "aria-valuetext": l(w),
-        onKeydown: l(b)
-      }, null, 46, ["tabindex", "aria-disabled", "aria-label", "aria-valuenow", "aria-valuetext", "onKeydown"])
-    ], 14, ["onClick"]));
-  }
-});
-var Qa = /* @__PURE__ */ H(Ja, [["__file", "sv-panel.vue"]]);
-const Xe = (e, t) => {
-  const a = ua(new oe({
-    enableAlpha: e.showAlpha,
-    format: e.colorFormat || "",
-    value: e.modelValue
-  }));
-  return R(() => [e.colorFormat, e.showAlpha], () => {
-    a.enableAlpha = e.showAlpha, a.format = e.colorFormat || a.format, a.doOnChange(), t(W, a.value);
-  }), {
-    color: a
-  };
-}, Za = A({
-  name: "ElColorPickerPanel"
-}), et = /* @__PURE__ */ A({
-  ...Za,
-  props: He,
-  emits: Na,
-  setup(e, { expose: t, emit: a }) {
-    const n = e, i = q("color-picker-panel"), { formItem: o } = Fe(), r = Be(), f = V(), p = V(), g = V(), C = V(), b = V(""), { color: u } = De(ze, () => Xe(n, a), !0);
-    function _() {
-      u.fromString(b.value), u.value !== b.value && (b.value = u.value);
-    }
-    function m() {
-      var s;
-      n.validateEvent && ((s = o?.validate) == null || s.call(o, "blur").catch((h) => X(h)));
-    }
-    function d() {
-      var s, h, v;
-      (s = f.value) == null || s.update(), (h = p.value) == null || h.update(), (v = g.value) == null || v.update();
-    }
-    return he(() => {
-      n.modelValue && (b.value = u.value), j(d);
-    }), R(() => n.modelValue, (s) => {
-      s !== u.value && (s ? u.fromString(s) : u.clear());
-    }), R(() => u.value, (s) => {
-      a(W, s), b.value = s, n.validateEvent && o?.validate("change").catch((h) => X(h));
-    }), Oe(je, {
-      currentColor: y(() => u.value)
-    }), t({
-      color: u,
-      inputRef: C,
-      update: d
-    }), (s, h) => (D(), I("div", {
-      class: E([l(i).b(), l(i).is("disabled", l(r)), l(i).is("border", s.border)]),
-      onFocusout: m
-    }, [
-      L("div", {
-        class: E(l(i).e("wrapper"))
-      }, [
-        O(Ia, {
-          ref_key: "hueRef",
-          ref: f,
-          class: "hue-slider",
-          color: l(u),
-          vertical: "",
-          disabled: l(r)
-        }, null, 8, ["color", "disabled"]),
-        O(Qa, {
-          ref_key: "svRef",
-          ref: p,
-          color: l(u),
-          disabled: l(r)
-        }, null, 8, ["color", "disabled"])
-      ], 2),
-      s.showAlpha ? (D(), te(Fa, {
-        key: 0,
-        ref_key: "alphaRef",
-        ref: g,
-        color: l(u),
-        disabled: l(r)
-      }, null, 8, ["color", "disabled"])) : we("v-if", !0),
-      s.predefine ? (D(), te(Xa, {
-        key: 1,
-        ref: "predefine",
-        "enable-alpha": s.showAlpha,
-        color: l(u),
-        colors: s.predefine,
-        disabled: l(r)
-      }, null, 8, ["enable-alpha", "color", "colors", "disabled"])) : we("v-if", !0),
-      L("div", {
-        class: E(l(i).e("footer"))
-      }, [
-        O(l(Ka), {
-          ref_key: "inputRef",
-          ref: C,
-          modelValue: b.value,
-          "onUpdate:modelValue": (v) => b.value = v,
-          "validate-event": !1,
-          size: "small",
-          disabled: l(r),
-          onChange: _
-        }, null, 8, ["modelValue", "onUpdate:modelValue", "disabled"]),
-        ca(s.$slots, "footer")
-      ], 2)
-    ], 34));
-  }
-});
-var at = /* @__PURE__ */ H(et, [["__file", "color-picker-panel.vue"]]);
-const tt = xe(at), lt = Y({
-  persistent: {
-    type: Boolean,
-    default: !0
-  },
-  modelValue: {
-    type: F(String),
-    default: void 0
-  },
-  id: String,
-  showAlpha: Boolean,
-  colorFormat: String,
-  disabled: {
-    type: Boolean,
-    default: void 0
-  },
-  size: ya,
-  popperClass: Q.popperClass,
-  popperStyle: Q.popperStyle,
-  tabindex: {
-    type: [String, Number],
-    default: 0
-  },
-  teleported: Q.teleported,
-  appendTo: Q.appendTo,
-  predefine: {
-    type: F(Array)
-  },
-  validateEvent: {
-    type: Boolean,
-    default: !0
-  },
-  ...Ca,
-  ...Ea(["ariaLabel"])
-}), ot = {
-  [W]: (e) => ee(e) || ae(e),
-  [fe]: (e) => ee(e) || ae(e),
-  activeChange: (e) => ee(e) || ae(e),
-  focus: (e) => e instanceof FocusEvent,
-  blur: (e) => e instanceof FocusEvent
-}, nt = A({
-  name: "ElColorPicker"
-}), rt = /* @__PURE__ */ A({
-  ...nt,
-  props: lt,
-  emits: ot,
-  setup(e, { expose: t, emit: a }) {
-    const n = e, { t: i } = U(), o = q("color"), { formItem: r } = Fe(), f = fa(), p = Be(), { valueOnClear: g, isEmptyValue: C } = wa(n, null), b = Xe(n, a), { inputId: u, isLabeledByFormItem: _ } = va(n, {
-      formItemContext: r
-    }), m = V(), d = V(), s = V(), h = V(!1), v = V(!1);
-    let w = !0;
-    const { isFocused: S, handleFocus: K, handleBlur: k } = Sa(d, {
-      disabled: p,
-      beforeBlur(c) {
-        var T;
-        return (T = m.value) == null ? void 0 : T.isFocusInsideContent(c);
-      },
-      afterBlur() {
-        var c;
-        z(!1), N(), n.validateEvent && ((c = r?.validate) == null || c.call(r, "blur").catch((T) => X(T)));
-      }
-    }), P = pa(() => {
-      var c, T;
-      return (T = (c = s.value) == null ? void 0 : c.color) != null ? T : b.color;
-    }), B = y(() => Pa(n, Object.keys(He))), G = y(() => !n.modelValue && !v.value ? "transparent" : Je(P, n.showAlpha)), Ye = y(() => !n.modelValue && !v.value ? "" : P.value), qe = y(() => _.value ? void 0 : n.ariaLabel || i("el.colorpicker.defaultLabel")), Ue = y(() => _.value ? r?.labelId : void 0), Ge = y(() => [
-      o.b("picker"),
-      o.is("disabled", p.value),
-      o.bm("picker", f.value),
-      o.is("focused", S.value)
-    ]);
-    function Je(c, T) {
-      const { r: re, g: ke, b: ye, a: na } = c.toRgb();
-      return T ? `rgba(${re}, ${ke}, ${ye}, ${na})` : `rgb(${re}, ${ke}, ${ye})`;
-    }
-    function z(c) {
-      h.value = c;
-    }
-    const J = Aa(z, 100, { leading: !0 });
-    function be() {
-      p.value || z(!0);
-    }
-    function me() {
-      J(!1), N();
-    }
-    function N() {
-      j(() => {
-        n.modelValue ? P.fromString(n.modelValue) : (P.value = "", j(() => {
-          v.value = !1;
-        }));
-      });
-    }
-    function Qe() {
-      p.value || (h.value && N(), J(!h.value));
-    }
-    function Ze() {
-      const c = C(P.value) ? g.value : P.value;
-      a(W, c), a(fe, c), n.validateEvent && r?.validate("change").catch((T) => X(T)), J(!1), j(() => {
-        const T = new oe({
-          enableAlpha: n.showAlpha,
-          format: n.colorFormat || "",
-          value: n.modelValue
-        });
-        P.compare(T) || N();
-      });
-    }
-    function ea() {
-      J(!1), a(W, g.value), a(fe, g.value), n.modelValue !== g.value && n.validateEvent && r?.validate("change").catch((c) => X(c)), N();
-    }
-    function aa() {
-      var c, T;
-      (T = (c = s?.value) == null ? void 0 : c.inputRef) == null || T.focus();
-    }
-    function ta() {
-      h.value && (me(), S.value && _e());
-    }
-    function ge(c) {
-      c.preventDefault(), c.stopPropagation(), z(!1), N();
-    }
-    function la(c) {
-      switch (pe(c)) {
-        case $.enter:
-        case $.numpadEnter:
-        case $.space:
-          c.preventDefault(), c.stopPropagation(), be();
-          break;
-        case $.esc:
-          ge(c);
-          break;
-      }
-    }
-    function _e() {
-      d.value.focus();
-    }
-    function oa() {
-      d.value.blur();
-    }
-    return R(() => Ye.value, (c) => {
-      w && a("activeChange", c), w = !0;
-    }), R(() => P.value, () => {
-      !n.modelValue && !v.value && (v.value = !0);
-    }), R(() => n.modelValue, (c) => {
-      c ? c && c !== P.value && (w = !1, P.fromString(c)) : v.value = !1;
-    }), R(() => h.value, () => {
-      var c;
-      j((c = s.value) == null ? void 0 : c.update);
-    }), Oe(ze, b), t({
-      color: P,
-      show: be,
-      hide: me,
-      focus: _e,
-      blur: oa
-    }), (c, T) => (D(), te(l(ba), {
-      ref_key: "popper",
-      ref: m,
-      visible: h.value,
-      "show-arrow": !1,
-      "fallback-placements": ["bottom", "top", "right", "left"],
-      offset: 0,
-      "gpu-acceleration": !1,
-      "popper-class": [l(o).be("picker", "panel"), c.popperClass],
-      "popper-style": c.popperStyle,
-      "stop-popper-mouse-event": !1,
-      pure: "",
-      loop: "",
-      role: "dialog",
-      effect: "light",
-      trigger: "click",
-      teleported: c.teleported,
-      transition: `${l(o).namespace.value}-zoom-in-top`,
-      persistent: c.persistent,
-      "append-to": c.appendTo,
-      onShow: aa,
-      onHide: (re) => z(!1)
-    }, {
-      content: x(() => [
-        ie((D(), te(l(tt), Ee({
-          ref_key: "pickerPanelRef",
-          ref: s
-        }, l(B), {
-          border: !1,
-          "validate-event": !1,
-          onKeydown: da(ge, ["esc"])
-        }), {
-          footer: x(() => [
-            L("div", null, [
-              O(l(Ve), {
-                class: E(l(o).be("footer", "link-btn")),
-                text: "",
-                size: "small",
-                onClick: ea
-              }, {
-                default: x(() => [
-                  Pe(Ke(l(i)("el.colorpicker.clear")), 1)
-                ]),
-                _: 1
-              }, 8, ["class"]),
-              O(l(Ve), {
-                plain: "",
-                size: "small",
-                class: E(l(o).be("footer", "btn")),
-                onClick: Ze
-              }, {
-                default: x(() => [
-                  Pe(Ke(l(i)("el.colorpicker.confirm")), 1)
-                ]),
-                _: 1
-              }, 8, ["class"])
-            ])
-          ]),
-          _: 1
-        }, 16, ["onKeydown"])), [
-          [l(Ta), ta, d.value]
-        ])
-      ]),
-      default: x(() => [
-        L("div", Ee({
-          id: l(u),
-          ref_key: "triggerRef",
-          ref: d
-        }, c.$attrs, {
-          class: l(Ge),
-          role: "button",
-          "aria-label": l(qe),
-          "aria-labelledby": l(Ue),
-          "aria-description": l(i)("el.colorpicker.description", { color: c.modelValue || "" }),
-          "aria-disabled": l(p),
-          tabindex: l(p) ? void 0 : c.tabindex,
-          onKeydown: la,
-          onFocus: l(K),
-          onBlur: l(k)
-        }), [
-          L("div", {
-            class: E(l(o).be("picker", "trigger")),
-            onClick: Qe
-          }, [
-            L("span", {
-              class: E([l(o).be("picker", "color"), l(o).is("alpha", c.showAlpha)])
-            }, [
-              L("span", {
-                class: E(l(o).be("picker", "color-inner")),
-                style: M({
-                  backgroundColor: l(G)
-                })
-              }, [
-                ie(O(l(Te), {
-                  class: E([l(o).be("picker", "icon"), l(o).is("icon-arrow-down")])
-                }, {
-                  default: x(() => [
-                    O(l(ma))
-                  ]),
-                  _: 1
-                }, 8, ["class"]), [
-                  [Se, c.modelValue || v.value]
-                ]),
-                ie(O(l(Te), {
-                  class: E([l(o).be("picker", "empty"), l(o).is("icon-close")])
-                }, {
-                  default: x(() => [
-                    O(l(ga))
-                  ]),
-                  _: 1
-                }, 8, ["class"]), [
-                  [Se, !c.modelValue && !v.value]
-                ])
-              ], 6)
-            ], 2)
-          ], 2)
-        ], 16, ["id", "aria-label", "aria-labelledby", "aria-description", "aria-disabled", "tabindex", "onFocus", "onBlur"])
-      ]),
-      _: 1
-    }, 8, ["visible", "popper-class", "popper-style", "teleported", "transition", "persistent", "append-to", "onHide"]));
-  }
-});
-var it = /* @__PURE__ */ H(rt, [["__file", "color-picker.vue"]]);
-const kt = xe(it);
-export {
-  kt as E,
-  Aa as d
-};