@das-fed/ui 6.4.0-hot.1 → 6.4.0-hot.3

package/packages/components/switch/index.js

@@ -1,49 +1,565 @@
 import '@das-fed/ui/packages/components/switch/style.css';
-import { withInstall as u } from "@das-fed/utils/with-install/index";
-import { setThemeRule as d } from "@das-fed/web/packages/theme/index";
-import { defineComponent as m, computed as c, ref as f, onMounted as p, openBlock as _, createElementBlock as h, createVNode as w, unref as b, mergeProps as v } from "vue";
-import { ElSwitch as S } from "element-plus";
-import "element-plus/es/components/switch/style/css";
-const x = { class: "das-ui-switch" }, B = {
+import { withInstall as Ee } from "@das-fed/utils/with-install/index";
+import { setThemeRule as Ce } from "@das-fed/web/packages/theme/index";
+import { defineComponent as B, openBlock as d, createElementBlock as S, createElementVNode as L, warn as Pe, watch as D, unref as s, getCurrentInstance as J, inject as E, ref as $, computed as v, mergeProps as ue, renderSlot as ze, onMounted as X, toRef as ke, onUnmounted as Be, normalizeClass as I, normalizeStyle as ie, withModifiers as Oe, withKeys as Te, createBlock as g, withCtx as P, resolveDynamicComponent as T, createCommentVNode as V, toDisplayString as H, createVNode as de, nextTick as De } from "vue";
+import "element-plus/theme-chalk/base.css";
+import "element-plus/theme-chalk/el-switch.css";
+var re;
+const ve = typeof window < "u";
+ve && ((re = window == null ? void 0 : window.navigator) != null && re.userAgent) && /iP(ad|hone|od)/.test(window.navigator.userAgent);
+/**
+* @vue/shared v3.4.35
+* (c) 2018-present Yuxi (Evan) You and Vue contributors
+* @license MIT
+**/
+process.env.NODE_ENV !== "production" && Object.freeze({});
+process.env.NODE_ENV !== "production" && Object.freeze([]);
+const Ae = Object.prototype.hasOwnProperty, le = (e, t) => Ae.call(e, t), Y = (e) => typeof e == "function", k = (e) => typeof e == "string", ee = (e) => e !== null && typeof e == "object", ce = (e) => (ee(e) || Y(e)) && Y(e.then) && Y(e.catch);
+function Ke(e) {
+  for (var t = -1, n = e == null ? 0 : e.length, o = {}; ++t < n; ) {
+    var i = e[t];
+    o[i[0]] = i[1];
+  }
+  return o;
+}
+const je = (e) => e === void 0, U = (e) => typeof e == "boolean", M = (e) => typeof e == "number", Fe = (e) => k(e) ? !Number.isNaN(Number(e)) : !1;
+class pe extends Error {
+  constructor(t) {
+    super(t), this.name = "ElementPlusError";
+  }
+}
+function Le(e, t) {
+  throw new pe(`[${e}] ${t}`);
+}
+function A(e, t) {
+  if (process.env.NODE_ENV !== "production") {
+    const n = k(e) ? new pe(`[${e}] ${t}`) : e;
+  }
+}
+const Ue = "utils/dom/style";
+function fe(e, t = "px") {
+  if (!e)
+    return "";
+  if (M(e) || Fe(e))
+    return `${e}${t}`;
+  if (k(e))
+    return e;
+  A(Ue, "binding value must be a string or number");
+}
+/*! Element Plus Icons Vue v2.3.1 */
+var Me = /* @__PURE__ */ B({
+  name: "Loading",
+  __name: "loading",
+  setup(e) {
+    return (t, n) => (d(), S("svg", {
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 1024 1024"
+    }, [
+      L("path", {
+        fill: "currentColor",
+        d: "M512 64a32 32 0 0 1 32 32v192a32 32 0 0 1-64 0V96a32 32 0 0 1 32-32m0 640a32 32 0 0 1 32 32v192a32 32 0 1 1-64 0V736a32 32 0 0 1 32-32m448-192a32 32 0 0 1-32 32H736a32 32 0 1 1 0-64h192a32 32 0 0 1 32 32m-640 0a32 32 0 0 1-32 32H96a32 32 0 0 1 0-64h192a32 32 0 0 1 32 32M195.2 195.2a32 32 0 0 1 45.248 0L376.32 331.008a32 32 0 0 1-45.248 45.248L195.2 240.448a32 32 0 0 1 0-45.248zm452.544 452.544a32 32 0 0 1 45.248 0L828.8 783.552a32 32 0 0 1-45.248 45.248L647.744 692.992a32 32 0 0 1 0-45.248zM828.8 195.264a32 32 0 0 1 0 45.184L692.992 376.32a32 32 0 0 1-45.248-45.248l135.808-135.808a32 32 0 0 1 45.248 0m-452.544 452.48a32 32 0 0 1 0 45.248L240.448 828.8a32 32 0 0 1-45.248-45.248l135.808-135.808a32 32 0 0 1 45.248 0z"
+      })
+    ]));
+  }
+}), Re = Me;
+const me = "__epPropKey", te = (e) => e, Je = (e) => ee(e) && !!e[me], he = (e, t) => {
+  if (!ee(e) || Je(e))
+    return e;
+  const { values: n, required: o, default: i, type: c, validator: h } = e, b = {
+    type: c,
+    required: !!o,
+    validator: n || h ? (p) => {
+      let w = !1, _ = [];
+      if (n && (_ = Array.from(n), le(e, "default") && _.push(i), w || (w = _.includes(p))), h && (w || (w = h(p))), !w && _.length > 0) {
+        const N = [...new Set(_)].map((K) => JSON.stringify(K)).join(", ");
+        Pe(`Invalid prop: validation failed${t ? ` for prop "${t}"` : ""}. Expected one of [${N}], got value ${JSON.stringify(p)}.`);
+      }
+      return w;
+    } : void 0,
+    [me]: !0
+  };
+  return le(e, "default") && (b.default = i), b;
+}, ye = (e) => Ke(Object.entries(e).map(([t, n]) => [
+  t,
+  he(n, t)
+])), F = te([
+  String,
+  Object,
+  Function
+]), be = (e, t) => (e.install = (n) => {
+  for (const o of [e, ...Object.values({})])
+    n.component(o.name, o);
+}, e), W = "update:modelValue", Z = "change", G = "input", we = ["", "default", "small", "large"], qe = (e) => ["", ...we].includes(e), He = ({ from: e, replacement: t, scope: n, version: o, ref: i, type: c = "API" }, h) => {
+  D(() => s(h), (l) => {
+    l && A(n, `[${c}] ${e} is about to be deprecated in version ${o}, please use ${t} instead.
+For more detail, please visit: ${i}
+`);
+  }, {
+    immediate: !0
+  });
+}, x = "el", Ye = "is-", C = (e, t, n, o, i) => {
+  let c = `${e}-${t}`;
+  return n && (c += `-${n}`), o && (c += `__${o}`), i && (c += `--${i}`), c;
+}, xe = Symbol("namespaceContextKey"), ge = (e) => {
+  const t = J() ? E(xe, $(x)) : $(x);
+  return v(() => s(t) || x);
+}, _e = (e, t) => {
+  const n = ge();
+  return {
+    namespace: n,
+    b: (r = "") => C(n.value, e, r, "", ""),
+    e: (r) => r ? C(n.value, e, "", r, "") : "",
+    m: (r) => r ? C(n.value, e, "", "", r) : "",
+    be: (r, u) => r && u ? C(n.value, e, r, u, "") : "",
+    em: (r, u) => r && u ? C(n.value, e, "", r, u) : "",
+    bm: (r, u) => r && u ? C(n.value, e, r, "", u) : "",
+    bem: (r, u, y) => r && u && y ? C(n.value, e, r, u, y) : "",
+    is: (r, ...u) => {
+      const y = u.length >= 1 ? u[0] : !0;
+      return r && y ? `${Ye}${r}` : "";
+    },
+    cssVar: (r) => {
+      const u = {};
+      for (const y in r)
+        r[y] && (u[`--${n.value}-${y}`] = r[y]);
+      return u;
+    },
+    cssVarName: (r) => `--${n.value}-${r}`,
+    cssVarBlock: (r) => {
+      const u = {};
+      for (const y in r)
+        r[y] && (u[`--${n.value}-${e}-${y}`] = r[y]);
+      return u;
+    },
+    cssVarBlockName: (r) => `--${n.value}-${e}-${r}`
+  };
+}, Ie = (e) => {
+  const t = J();
+  return v(() => {
+    var n, o;
+    return (o = (n = t == null ? void 0 : t.proxy) == null ? void 0 : n.$props) == null ? void 0 : o[e];
+  });
+}, Q = {
+  prefix: Math.floor(Math.random() * 1e4),
+  current: 0
+}, We = Symbol("elIdInjection"), Ze = () => J() ? E(We, Q) : Q, Ge = (e) => {
+  const t = Ze();
+  !ve && t === Q && A("IdInjection", `Looks like you are using server rendering, you must provide a id provider to ensure the hydration process to be succeed
+usage: app.provide(ID_INJECTION_KEY, {
+  prefix: number,
+  current: number,
+})`);
+  const n = ge();
+  return v(() => s(e) || `${n.value}-id-${t.prefix}-${t.current++}`);
+};
+he({
+  type: String,
+  values: we,
+  required: !1
+});
+const Qe = Symbol("size"), Xe = () => {
+  const e = E(Qe, {});
+  return v(() => s(e.size) || "");
+};
+var Se = (e, t) => {
+  const n = e.__vccOpts || e;
+  for (const [o, i] of t)
+    n[o] = i;
+  return n;
+};
+const et = ye({
+  size: {
+    type: te([Number, String])
+  },
+  color: {
+    type: String
+  }
+}), tt = B({
+  name: "ElIcon",
+  inheritAttrs: !1
+}), nt = /* @__PURE__ */ B({
+  ...tt,
+  props: et,
+  setup(e) {
+    const t = e, n = _e("icon"), o = v(() => {
+      const { size: i, color: c } = t;
+      return !i && !c ? {} : {
+        fontSize: je(i) ? void 0 : fe(i),
+        "--color": c
+      };
+    });
+    return (i, c) => (d(), S("i", ue({
+      class: s(n).b(),
+      style: s(o)
+    }, i.$attrs), [
+      ze(i.$slots, "default")
+    ], 16));
+  }
+});
+var ot = /* @__PURE__ */ Se(nt, [["__file", "/home/runner/work/element-plus/element-plus/packages/components/icon/src/icon.vue"]]);
+const z = be(ot), ne = Symbol("formContextKey"), $e = Symbol("formItemContextKey"), at = (e, t = {}) => {
+  const n = $(void 0), o = t.prop ? n : Ie("size"), i = t.global ? n : Xe(), c = t.form ? { size: void 0 } : E(ne, void 0), h = t.formItem ? { size: void 0 } : E($e, void 0);
+  return v(() => o.value || s(e) || (h == null ? void 0 : h.size) || (c == null ? void 0 : c.size) || i.value || "");
+}, st = (e) => {
+  const t = Ie("disabled"), n = E(ne, void 0);
+  return v(() => t.value || s(e) || (n == null ? void 0 : n.disabled) || !1);
+}, it = () => {
+  const e = E(ne, void 0), t = E($e, void 0);
+  return {
+    form: e,
+    formItem: t
+  };
+}, rt = (e, {
+  formItemContext: t,
+  disableIdGeneration: n,
+  disableIdManagement: o
+}) => {
+  n || (n = $(!1)), o || (o = $(!1));
+  const i = $();
+  let c;
+  const h = v(() => {
+    var l;
+    return !!(!e.label && t && t.inputIds && ((l = t.inputIds) == null ? void 0 : l.length) <= 1);
+  });
+  return X(() => {
+    c = D([ke(e, "id"), n], ([l, b]) => {
+      const p = l ?? (b ? void 0 : Ge().value);
+      p !== i.value && (t != null && t.removeInputId && (i.value && t.removeInputId(i.value), !(o != null && o.value) && !b && p && t.addInputId(p)), i.value = p);
+    }, { immediate: !0 });
+  }), Be(() => {
+    c && c(), t != null && t.removeInputId && i.value && t.removeInputId(i.value);
+  }), {
+    isLabeledByFormItem: h,
+    inputId: i
+  };
+}, lt = ye({
+  modelValue: {
+    type: [Boolean, String, Number],
+    default: !1
+  },
+  disabled: {
+    type: Boolean,
+    default: !1
+  },
+  loading: {
+    type: Boolean,
+    default: !1
+  },
+  size: {
+    type: String,
+    validator: qe
+  },
+  width: {
+    type: [String, Number],
+    default: ""
+  },
+  inlinePrompt: {
+    type: Boolean,
+    default: !1
+  },
+  inactiveActionIcon: {
+    type: F
+  },
+  activeActionIcon: {
+    type: F
+  },
+  activeIcon: {
+    type: F
+  },
+  inactiveIcon: {
+    type: F
+  },
+  activeText: {
+    type: String,
+    default: ""
+  },
+  inactiveText: {
+    type: String,
+    default: ""
+  },
+  activeValue: {
+    type: [Boolean, String, Number],
+    default: !0
+  },
+  inactiveValue: {
+    type: [Boolean, String, Number],
+    default: !1
+  },
+  activeColor: {
+    type: String,
+    default: ""
+  },
+  inactiveColor: {
+    type: String,
+    default: ""
+  },
+  borderColor: {
+    type: String,
+    default: ""
+  },
+  name: {
+    type: String,
+    default: ""
+  },
+  validateEvent: {
+    type: Boolean,
+    default: !0
+  },
+  beforeChange: {
+    type: te(Function)
+  },
+  id: String,
+  tabindex: {
+    type: [String, Number]
+  },
+  value: {
+    type: [Boolean, String, Number],
+    default: !1
+  },
+  label: {
+    type: String,
+    default: void 0
+  }
+}), ct = {
+  [W]: (e) => U(e) || k(e) || M(e),
+  [Z]: (e) => U(e) || k(e) || M(e),
+  [G]: (e) => U(e) || k(e) || M(e)
+}, ut = ["onClick"], dt = ["id", "aria-checked", "aria-disabled", "aria-label", "name", "true-value", "false-value", "disabled", "tabindex", "onKeydown"], vt = ["aria-hidden"], pt = ["aria-hidden"], ft = ["aria-hidden"], R = "ElSwitch", mt = B({
+  name: R
+}), ht = /* @__PURE__ */ B({
+  ...mt,
+  props: lt,
+  emits: ct,
+  setup(e, { expose: t, emit: n }) {
+    const o = e, i = J(), { formItem: c } = it(), h = at(), l = _e("switch");
+    ((a) => {
+      a.forEach((m) => {
+        He({
+          from: m[0],
+          replacement: m[1],
+          scope: R,
+          version: "2.3.0",
+          ref: "https://element-plus.org/en-US/component/switch.html#attributes",
+          type: "Attribute"
+        }, v(() => {
+          var O;
+          return !!((O = i.vnode.props) != null && O[m[2]]);
+        }));
+      });
+    })([
+      ['"value"', '"model-value" or "v-model"', "value"],
+      ['"active-color"', "CSS var `--el-switch-on-color`", "activeColor"],
+      ['"inactive-color"', "CSS var `--el-switch-off-color`", "inactiveColor"],
+      ['"border-color"', "CSS var `--el-switch-border-color`", "borderColor"]
+    ]);
+    const { inputId: p } = rt(o, {
+      formItemContext: c
+    }), w = st(v(() => o.loading)), _ = $(o.modelValue !== !1), N = $(), K = $(), oe = v(() => [
+      l.b(),
+      l.m(h.value),
+      l.is("disabled", w.value),
+      l.is("checked", f.value)
+    ]), r = v(() => [
+      l.e("label"),
+      l.em("label", "left"),
+      l.is("active", !f.value)
+    ]), u = v(() => [
+      l.e("label"),
+      l.em("label", "right"),
+      l.is("active", f.value)
+    ]), y = v(() => ({
+      width: fe(o.width)
+    }));
+    D(() => o.modelValue, () => {
+      _.value = !0;
+    }), D(() => o.value, () => {
+      _.value = !1;
+    });
+    const ae = v(() => _.value ? o.modelValue : o.value), f = v(() => ae.value === o.activeValue);
+    [o.activeValue, o.inactiveValue].includes(ae.value) || (n(W, o.inactiveValue), n(Z, o.inactiveValue), n(G, o.inactiveValue)), D(f, (a) => {
+      var m;
+      N.value.checked = a, o.validateEvent && ((m = c == null ? void 0 : c.validate) == null || m.call(c, "change").catch((O) => A(O)));
+    });
+    const j = () => {
+      const a = f.value ? o.inactiveValue : o.activeValue;
+      n(W, a), n(Z, a), n(G, a), De(() => {
+        N.value.checked = f.value;
+      });
+    }, se = () => {
+      if (w.value)
+        return;
+      const { beforeChange: a } = o;
+      if (!a) {
+        j();
+        return;
+      }
+      const m = a();
+      [
+        ce(m),
+        U(m)
+      ].includes(!0) || Le(R, "beforeChange must return type `Promise<boolean>` or `boolean`"), ce(m) ? m.then((q) => {
+        q && j();
+      }).catch((q) => {
+        A(R, `some error occurred: ${q}`);
+      }) : m && j();
+    }, Ve = v(() => l.cssVarBlock({
+      ...o.activeColor ? { "on-color": o.activeColor } : null,
+      ...o.inactiveColor ? { "off-color": o.inactiveColor } : null,
+      ...o.borderColor ? { "border-color": o.borderColor } : null
+    })), Ne = () => {
+      var a, m;
+      (m = (a = N.value) == null ? void 0 : a.focus) == null || m.call(a);
+    };
+    return X(() => {
+      N.value.checked = f.value;
+    }), t({
+      focus: Ne,
+      checked: f
+    }), (a, m) => (d(), S("div", {
+      class: I(s(oe)),
+      style: ie(s(Ve)),
+      onClick: Oe(se, ["prevent"])
+    }, [
+      L("input", {
+        id: s(p),
+        ref_key: "input",
+        ref: N,
+        class: I(s(l).e("input")),
+        type: "checkbox",
+        role: "switch",
+        "aria-checked": s(f),
+        "aria-disabled": s(w),
+        "aria-label": a.label,
+        name: a.name,
+        "true-value": a.activeValue,
+        "false-value": a.inactiveValue,
+        disabled: s(w),
+        tabindex: a.tabindex,
+        onChange: j,
+        onKeydown: Te(se, ["enter"])
+      }, null, 42, dt),
+      !a.inlinePrompt && (a.inactiveIcon || a.inactiveText) ? (d(), S("span", {
+        key: 0,
+        class: I(s(r))
+      }, [
+        a.inactiveIcon ? (d(), g(s(z), { key: 0 }, {
+          default: P(() => [
+            (d(), g(T(a.inactiveIcon)))
+          ]),
+          _: 1
+        })) : V("v-if", !0),
+        !a.inactiveIcon && a.inactiveText ? (d(), S("span", {
+          key: 1,
+          "aria-hidden": s(f)
+        }, H(a.inactiveText), 9, vt)) : V("v-if", !0)
+      ], 2)) : V("v-if", !0),
+      L("span", {
+        ref_key: "core",
+        ref: K,
+        class: I(s(l).e("core")),
+        style: ie(s(y))
+      }, [
+        a.inlinePrompt ? (d(), S("div", {
+          key: 0,
+          class: I(s(l).e("inner"))
+        }, [
+          a.activeIcon || a.inactiveIcon ? (d(), g(s(z), {
+            key: 0,
+            class: I(s(l).is("icon"))
+          }, {
+            default: P(() => [
+              (d(), g(T(s(f) ? a.activeIcon : a.inactiveIcon)))
+            ]),
+            _: 1
+          }, 8, ["class"])) : a.activeText || a.inactiveText ? (d(), S("span", {
+            key: 1,
+            class: I(s(l).is("text")),
+            "aria-hidden": !s(f)
+          }, H(s(f) ? a.activeText : a.inactiveText), 11, pt)) : V("v-if", !0)
+        ], 2)) : V("v-if", !0),
+        L("div", {
+          class: I(s(l).e("action"))
+        }, [
+          a.loading ? (d(), g(s(z), {
+            key: 0,
+            class: I(s(l).is("loading"))
+          }, {
+            default: P(() => [
+              de(s(Re))
+            ]),
+            _: 1
+          }, 8, ["class"])) : a.activeActionIcon && s(f) ? (d(), g(s(z), { key: 1 }, {
+            default: P(() => [
+              (d(), g(T(a.activeActionIcon)))
+            ]),
+            _: 1
+          })) : a.inactiveActionIcon && !s(f) ? (d(), g(s(z), { key: 2 }, {
+            default: P(() => [
+              (d(), g(T(a.inactiveActionIcon)))
+            ]),
+            _: 1
+          })) : V("v-if", !0)
+        ], 2)
+      ], 6),
+      !a.inlinePrompt && (a.activeIcon || a.activeText) ? (d(), S("span", {
+        key: 1,
+        class: I(s(u))
+      }, [
+        a.activeIcon ? (d(), g(s(z), { key: 0 }, {
+          default: P(() => [
+            (d(), g(T(a.activeIcon)))
+          ]),
+          _: 1
+        })) : V("v-if", !0),
+        !a.activeIcon && a.activeText ? (d(), S("span", {
+          key: 1,
+          "aria-hidden": !s(f)
+        }, H(a.activeText), 9, ft)) : V("v-if", !0)
+      ], 2)) : V("v-if", !0)
+    ], 14, ut));
+  }
+});
+var yt = /* @__PURE__ */ Se(ht, [["__file", "/home/runner/work/element-plus/element-plus/packages/components/switch/src/switch.vue"]]);
+const bt = be(yt), wt = { class: "das-ui-switch" }, gt = {
   inheritAttrs: !1
-}, V = /* @__PURE__ */ m({
-  ...B,
+}, _t = /* @__PURE__ */ B({
+  ...gt,
   __name: "Index",
   props: {
     modelValue: { type: [Boolean, String, Number], default: !0 },
     size: { default: "small" }
   },
-  setup(o, { expose: i }) {
-    const e = o, s = c(() => e.modelValue), n = c(() => e.size ? e.size : "small"), a = f(null);
-    return p(() => {
-      var t, r;
-      const l = (r = (t = a.value) == null ? void 0 : t.$el) == null ? void 0 : r.querySelector(".el-switch__input");
+  setup(e, { expose: t }) {
+    const n = e, o = v(() => n.modelValue), i = v(() => n.size ? n.size : "small"), c = $(null);
+    return X(() => {
+      var b, p;
+      const l = (p = (b = c.value) == null ? void 0 : b.$el) == null ? void 0 : p.querySelector(".el-switch__input");
       l && l.setAttribute("tabindex", "-1");
-    }), i({
-      $refSwitch: a
-    }), (l, t) => (_(), h("div", x, [
-      w(b(S), v({
+    }), t({
+      $refSwitch: c
+    }), (l, b) => (d(), S("div", wt, [
+      de(s(bt), ue({
         ref_key: "$refSwitch",
-        ref: a,
-        modelValue: s.value,
-        "onUpdate:modelValue": t[0] || (t[0] = (r) => s.value = r)
-      }, l.$attrs, { size: n.value }), null, 16, ["modelValue", "size"])
+        ref: c,
+        modelValue: o.value,
+        "onUpdate:modelValue": b[0] || (b[0] = (p) => o.value = p)
+      }, l.$attrs, { size: i.value }), null, 16, ["modelValue", "size"])
     ]));
   }
-}), z = (o, i) => {
-  const e = o.__vccOpts || o;
-  for (const [s, n] of i)
-    e[s] = n;
-  return e;
-}, D = /* @__PURE__ */ z(V, [["__scopeId", "data-v-247b1241"]]), I = {
+}), It = (e, t) => {
+  const n = e.__vccOpts || e;
+  for (const [o, i] of t)
+    n[o] = i;
+  return n;
+}, St = /* @__PURE__ */ It(_t, [["__scopeId", "data-v-247b1241"]]), $t = {
   "--das-ui-switch-on-color": "#5582F3",
   "--das-ui-switch-off-color": "#B2B2B2",
   "--das-ui-switch-on-color-disabled": "#B5CAFF",
   "--das-ui-switch-off-color-disabled": "#D9D9D9"
 };
-d(I);
-const T = u(D);
+Ce($t);
+const zt = Ee(St);
 export {
-  T as DasSwitch,
-  T as default
+  zt as DasSwitch,
+  zt as default
 };