@das-fed/upf-ui 6.4.0-dev.132 → 6.4.0-dev.134

package/packages/components/switch/index.js

@@ -1,49 +1,65 @@
 import '@das-fed/upf-ui/packages/components/switch/style.css';
-import { withInstall as u } from "@das-fed/upf-utils/with-install/index";
-import { setThemeRule as d } from "@das-fed/upf-web/packages/theme/index";
-import { defineComponent as m, computed as c, ref as f, onMounted as p, createElementBlock as _, openBlock as h, createVNode as w, unref as v, mergeProps as S } from "vue";
-import { ElSwitch as b } from "element-plus";
+import { withInstall as f } from "@das-fed/upf-utils/with-install/index";
+import { setThemeRule as p } from "@das-fed/upf-web/packages/theme/index";
+import { defineComponent as h, computed as n, ref as _, onMounted as w, createElementBlock as S, openBlock as v, normalizeStyle as x, createVNode as z, unref as y, mergeProps as B } from "vue";
+import { ElSwitch as V } from "element-plus";
 import "element-plus/es/components/switch/style/css";
-const x = { class: "das-ui-switch" }, B = {
+import { useFormSize as b } from "@das-fed/upf-ui/packages/components/form";
+const g = {
   inheritAttrs: !1
-}, V = /* @__PURE__ */ m({
-  ...B,
+}, D = /* @__PURE__ */ h({
+  ...g,
   __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(() => {
+  setup(o, { expose: a }) {
+    const e = o, s = n(() => e.modelValue), i = n(() => e.size ? e.size : "small"), c = _(null), m = () => {
       var t, r;
-      const l = (r = (t = a.value) == null ? void 0 : t.$el) == null ? void 0 : r.querySelector(".el-switch__input");
+      const l = (r = (t = c.value) == null ? void 0 : t.$el) == null ? void 0 : r.querySelector(".el-switch__input");
       l && l.setAttribute("tabindex", "-1");
-    }), i({
-      $refSwitch: a
-    }), (l, t) => (h(), _("div", x, [
-      w(v(b), S({
-        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"])
-    ]));
+    }, u = b(), d = n(() => ({
+      "--switch-height": u.value && {
+        small: "24px",
+        default: "32px",
+        large: "40px"
+      }[u.value]
+    }));
+    return w(m), a({
+      $refSwitch: c
+    }), (l, t) => (v(), S(
+      "div",
+      {
+        class: "das-ui-switch",
+        style: x(d.value)
+      },
+      [
+        z(y(V), B({
+          ref_key: "$refSwitch",
+          ref: c,
+          modelValue: s.value,
+          "onUpdate:modelValue": t[0] || (t[0] = (r) => s.value = r)
+        }, l.$attrs, { size: i.value }), null, 16, ["modelValue", "size"])
+      ],
+      4
+      /* STYLE */
+    ));
   }
-}), z = (o, i) => {
+}), k = (o, a) => {
   const e = o.__vccOpts || o;
-  for (const [s, n] of i)
-    e[s] = n;
+  for (const [s, i] of a)
+    e[s] = i;
   return e;
-}, D = /* @__PURE__ */ z(V, [["__scopeId", "data-v-25cfdf31"]]), I = {
+}, F = /* @__PURE__ */ k(D, [["__scopeId", "data-v-2529e92f"]]), I = {
   "--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);
+p(I);
+const q = f(F);
 export {
-  T as DasSwitch,
-  T as default
+  q as DasSwitch,
+  q as default
 };

package/packages/components/switch/style.css

@@ -1 +1 @@
-.das-ui-switch[data-v-25cfdf31]{display:inline-flex}.das-ui-switch[data-v-25cfdf31] .el-switch{--el-switch-on-color: var(--das-ui-switch-on-color);--el-switch-off-color: var(--das-ui-switch-off-color)}.das-ui-switch[data-v-25cfdf31] .el-switch.is-disabled{--el-switch-on-color: var(--das-ui-switch-on-color-disabled);--el-switch-off-color: var(--das-ui-switch-off-color-disabled);opacity:1}.das-ui-switch[data-v-25cfdf31] .el-switch.el-switch--small{height:16px}.das-ui-switch[data-v-25cfdf31] .el-switch.el-switch--small .el-switch__core{min-width:32px}.das-ui-switch[data-v-25cfdf31] .el-switch.el-switch--small .el-switch__core .el-switch__action{width:14px;height:14px;left:0}.das-ui-switch[data-v-25cfdf31] .el-switch.el-switch--small.is-checked .el-switch__core .el-switch__action{left:calc(100% - 14px)}.das-ui-switch[data-v-25cfdf31] .el-switch.el-switch--default{height:20px}.das-ui-switch[data-v-25cfdf31] .el-switch.el-switch--default .el-switch__core .el-switch__action{width:18px;height:18px;left:0}.das-ui-switch[data-v-25cfdf31] .el-switch.el-switch--default.is-checked .el-switch__core .el-switch__action{left:calc(100% - 18px)}.das-ui-switch[data-v-25cfdf31] .el-switch .el-switch__core .el-switch__action .el-icon{background-image:url("data:image/svg+xml,%3c?xml%20version='1.0'%20standalone='no'?%3e%3c!DOCTYPE%20svg%20PUBLIC%20'-//W3C//DTD%20SVG%201.1//EN'%20'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3e%3csvg%20t='1686210106297'%20class='icon'%20viewBox='0%200%201024%201024'%20version='1.1'%20xmlns='http://www.w3.org/2000/svg'%20p-id='11699'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20width='200'%20height='200'%3e%3cpath%20d='M512%2064c247.424%200%20448%20200.576%20448%20448%200%2093.76-28.928%20183.296-81.92%20258.304a32%2032%200%200%201-52.256-36.96A382.048%20382.048%200%200%200%20896%20512c0-212.064-171.936-384-384-384a32%2032%200%200%201%200-64z'%20p-id='11700'%20fill='%235480F0'%3e%3c/path%3e%3c/svg%3e");background-size:cover}.das-ui-switch[data-v-25cfdf31] .el-switch .el-switch__core .el-switch__action .el-icon.is-loading{animation:rotating 1s linear infinite}.das-ui-switch[data-v-25cfdf31] .el-switch .el-switch__core .el-switch__action .el-icon svg{display:none}
+.das-ui-switch[data-v-2529e92f]{display:inline-flex;height:var(--switch-height);align-items:center}.das-ui-switch[data-v-2529e92f] .el-switch{--el-switch-on-color: var(--das-ui-switch-on-color);--el-switch-off-color: var(--das-ui-switch-off-color)}.das-ui-switch[data-v-2529e92f] .el-switch.is-disabled{--el-switch-on-color: var(--das-ui-switch-on-color-disabled);--el-switch-off-color: var(--das-ui-switch-off-color-disabled);opacity:1}.das-ui-switch[data-v-2529e92f] .el-switch.el-switch--small{height:16px}.das-ui-switch[data-v-2529e92f] .el-switch.el-switch--small .el-switch__core{min-width:32px}.das-ui-switch[data-v-2529e92f] .el-switch.el-switch--small .el-switch__core .el-switch__action{width:14px;height:14px;left:0}.das-ui-switch[data-v-2529e92f] .el-switch.el-switch--small.is-checked .el-switch__core .el-switch__action{left:calc(100% - 14px)}.das-ui-switch[data-v-2529e92f] .el-switch.el-switch--default{height:20px}.das-ui-switch[data-v-2529e92f] .el-switch.el-switch--default .el-switch__core .el-switch__action{width:18px;height:18px;left:0}.das-ui-switch[data-v-2529e92f] .el-switch.el-switch--default.is-checked .el-switch__core .el-switch__action{left:calc(100% - 18px)}.das-ui-switch[data-v-2529e92f] .el-switch .el-switch__core .el-switch__action .el-icon{background-image:url("data:image/svg+xml,%3c?xml%20version='1.0'%20standalone='no'?%3e%3c!DOCTYPE%20svg%20PUBLIC%20'-//W3C//DTD%20SVG%201.1//EN'%20'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3e%3csvg%20t='1686210106297'%20class='icon'%20viewBox='0%200%201024%201024'%20version='1.1'%20xmlns='http://www.w3.org/2000/svg'%20p-id='11699'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20width='200'%20height='200'%3e%3cpath%20d='M512%2064c247.424%200%20448%20200.576%20448%20448%200%2093.76-28.928%20183.296-81.92%20258.304a32%2032%200%200%201-52.256-36.96A382.048%20382.048%200%200%200%20896%20512c0-212.064-171.936-384-384-384a32%2032%200%200%201%200-64z'%20p-id='11700'%20fill='%235480F0'%3e%3c/path%3e%3c/svg%3e");background-size:cover}.das-ui-switch[data-v-2529e92f] .el-switch .el-switch__core .el-switch__action .el-icon.is-loading{animation:rotating 1s linear infinite}.das-ui-switch[data-v-2529e92f] .el-switch .el-switch__core .el-switch__action .el-icon svg{display:none}