@wikicasa-dev/components 2.1.4-alpha.2 → 2.1.4-alpha.21

package/dist/packages/components/lib/UIKit/BaseInput.vue.js

@@ -1,61 +1,58 @@
-import { defineComponent as A, mergeModels as L, useModel as N, ref as v, useAttrs as O, useId as j, computed as D, watch as p, createElementBlock as o, openBlock as s, normalizeClass as T, unref as k, renderSlot as m, createElementVNode as G, createBlock as J, createCommentVNode as h, withKeys as Q, withModifiers as g, Fragment as B, renderList as E } from "vue";
-import W from "./BaseFloatingLabel.vue.js";
+import { defineComponent as N, mergeModels as L, useModel as O, ref as k, useAttrs as j, useId as x, computed as D, watch as p, createElementBlock as o, openBlock as s, normalizeClass as T, unref as m, renderSlot as v, createElementVNode as G, createBlock as J, createCommentVNode as g, withKeys as Q, withModifiers as w, Fragment as B, renderList as E } from "vue";
+import R from "./BaseFloatingLabel.vue.js";
 import '../../../../assets/packages/components/lib/UIKit/BaseFloatingLabel.css';/* empty css                       */
-import { useFloatingLabel as X } from "../../../../composables/useFloatingLabel.js";
-const Y = ["id", "data-cy", "name", "data-validation", "autocomplete", "disabled", "aria-labelledby", "readonly", "type", "pattern", "min", "max", "maxlength", "inputmode", "placeholder", "value"], Z = ["innerHTML"], x = ["innerHTML"], U = {
+import { useFloatingLabel as W } from "../../../../composables/useFloatingLabel.js";
+const X = ["id", "data-cy", "name", "data-validation", "autocomplete", "disabled", "aria-labelledby", "readonly", "type", "pattern", "min", "max", "maxlength", "inputmode", "placeholder", "value"], Y = ["innerHTML"], Z = ["innerHTML"], U = {
   key: 1,
   class: "under-label uikit-absolute uikit-text-12"
-}, _ = "peer-data-[validation='invalid']:uikit-text-w-red peer-data-[validation='valid']:uikit-text-w-blue", ne = /* @__PURE__ */ A({
+}, _ = "peer-data-[validation='invalid']:uikit-text-w-red peer-data-[validation='valid']:uikit-text-w-blue", ne = /* @__PURE__ */ N({
   inheritAttrs: !1,
   __name: "BaseInput",
   props: /* @__PURE__ */ L({
-    inputClass: {},
     labelText: { default: "" },
     feedback: {},
     isValid: { default: null },
     keepFloatingLabel: { type: Boolean, default: !1 },
     formatter: { default: null },
+    inputClass: {},
     labelClasses: {},
     labelTextClasses: {},
-    withLeftIcon: { type: Boolean, default: () => {
-    } },
-    withRightIcon: { type: Boolean, default: () => {
-    } },
-    dataCy: {}
+    dataCy: {},
+    withBorder: { type: Boolean, default: !0 }
   }, {
     modelValue: { default: "" },
     modelModifiers: {}
   }),
   emits: /* @__PURE__ */ L(["click", "keydownEnterPressed", "focusin", "focusout", "keydown", "keyup"], ["update:modelValue"]),
   setup(l, { expose: M, emit: H }) {
-    const u = N(l, "modelValue"), i = v(""), d = H, {
+    const u = O(l, "modelValue"), i = k(""), d = H, {
       labelState: c,
       handleFocusIn: P,
-      handleFocusOut: w,
-      setInlineLabel: $,
+      handleFocusOut: $,
+      setInlineLabel: h,
       setFloatingLabel: V
-    } = X(), I = O(), q = j(), r = D(() => I.id || q), n = v("text"), f = v({}), b = v(null), K = () => {
+    } = W(), F = j(), q = x(), r = D(() => F.id || q), n = k("text"), f = k({}), b = k(null), K = () => {
       l.feedback && (f.value = l.feedback, l.feedback.valid && typeof l.feedback.valid == "string" && (f.value.valid = [l.feedback.valid]), l.feedback.invalid && typeof l.feedback.invalid == "string" && (f.value.invalid = [l.feedback.invalid]));
-    }, F = (e, a) => {
+    }, C = (e, a) => {
       if (!l.formatter || !l.formatter.formatFn)
         return i.value = e, "";
       const t = e.length ? l.formatter.formatFn(e) : e;
       return a && (a.value = t), i.value = t, t;
-    }, C = (e, a = !0) => {
+    }, I = (e, a = !0) => {
       if (a && (!l.formatter || !l.formatter.unFormatFn))
         return u.value = e, e;
       if (!a || !l.formatter || !l.formatter.unFormatFn) return;
       const t = l.formatter.unFormatFn(e);
       return u.value = t ?? "", t;
-    }, R = ({ target: e }) => {
-      const a = e, t = C(a.value);
-      F(
+    }, S = ({ target: e }) => {
+      const a = e, t = I(a.value);
+      C(
         `${t}`,
         t === u.value ? a : void 0
       );
-    }, S = () => {
-      u.value = "", $();
     }, z = () => {
+      u.value = "", h();
+    }, A = () => {
       n.value === "password" ? n.value = "text" : n.value === "text" && (n.value = "password");
     };
     return p(
@@ -69,10 +66,10 @@ const Y = ["id", "data-cy", "name", "data-validation", "autocomplete", "disabled
     ), p(
       u,
       (e) => {
-        F(
+        C(
           `${e}`,
-          C(`${e}`, !1) === e ? b.value : void 0
-        ), i.value != null && i.value.length > 0 && c.value !== "floating-label" ? V() : !i.value && document && document.activeElement !== b.value && $();
+          I(`${e}`, !1) === e ? b.value : void 0
+        ), i.value != null && i.value.length > 0 && c.value !== "floating-label" ? V() : !i.value && document && document.activeElement !== b.value && h();
       },
       {
         immediate: !0
@@ -80,9 +77,9 @@ const Y = ["id", "data-cy", "name", "data-validation", "autocomplete", "disabled
     ), p(
       () => l.keepFloatingLabel,
       (e) => {
-        e ? V() : w(u.value);
+        e ? V() : $(u.value);
       }
-    ), n.value = I.type || "text", M({
+    ), n.value = F.type || "text", M({
       select: () => {
         b.value?.select();
       }
@@ -90,20 +87,20 @@ const Y = ["id", "data-cy", "name", "data-validation", "autocomplete", "disabled
       class: T(["uikit-input-wrapper [&.has-right-icon.is-invalid_.text-input-icon]:uikit-mr-25px [&.has-right-icon.is-valid_.text-input-icon]:uikit-mr-25px uikit-relative uikit-inline-block uikit-w-full", [
         e.$attrs.class,
         { "floating-label": e.labelText },
-        k(c) === "floating-label" ? "floating-state" : "inline-state",
+        m(c) === "floating-label" ? "floating-state" : "inline-state",
         {
-          "has-right-icon": e.withRightIcon !== void 0 ? e.withRightIcon : !!e.$slots.righticon
+          "has-right-icon": !!e.$slots.rightIcon
         },
         {
-          "has-left-icon": e.withLeftIcon !== void 0 ? e.withLeftIcon : !!e.$slots.leftIcon
+          "has-left-icon": !!e.$slots.leftIcon
         },
         { "is-invalid": e.isValid === !1, "is-valid": e.isValid }
       ]])
     }, [
-      m(e.$slots, "leftIcon"),
-      m(e.$slots, "righticon", {
-        handleClean: S,
-        handleShowPasswd: z,
+      v(e.$slots, "leftIcon"),
+      v(e.$slots, "rightIcon", {
+        handleClean: z,
+        handleShowPasswd: A,
         curType: n.value
       }),
       G("input", {
@@ -112,12 +109,16 @@ const Y = ["id", "data-cy", "name", "data-validation", "autocomplete", "disabled
         ref: b,
         "data-cy": e.dataCy,
         name: e.$attrs.name,
-        class: T(["input-element disabled:uikit-text-w-secondary uikit-peer uikit-relative uikit-box-border uikit-block uikit-h-[56px] uikit-w-full uikit-appearance-none uikit-truncate uikit-rounded-2xs uikit-border uikit-border-solid uikit-border-w-lightgray uikit-bg-white uikit-px-sm uikit-pb-0 uikit-pt-md uikit-text-16 uikit-outline-none focus-visible:uikit-border-w-blue disabled:uikit-bg-w-cultured data-[validation='invalid']:uikit-border-w-red data-[validation='valid']:uikit-border-w-blue", [
+        class: T(["input-element disabled:uikit-text-w-secondary uikit-peer uikit-relative uikit-box-border uikit-block uikit-w-full uikit-appearance-none uikit-truncate uikit-rounded-2xs uikit-bg-white uikit-px-sm uikit-pb-0 uikit-text-16 uikit-outline-none disabled:uikit-bg-w-cultured", [
           {
             "is-invalid": e.isValid === !1,
-            "is-valid": e.isValid
+            "is-valid": e.isValid,
+            "uikit-pt-md": e.labelText
           },
-          e.inputClass
+          e.inputClass,
+          {
+            "uikit-border uikit-border-solid uikit-border-w-lightgray focus-visible:uikit-border-w-blue data-[validation='invalid']:uikit-border-w-red data-[validation='valid']:uikit-border-w-blue": e.withBorder
+          }
         ]]),
         "data-validation": e.isValid ? "valid" : e.isValid === !1 ? "invalid" : "",
         autocomplete: e.$attrs.autocomplete === "on" ? "on" : "off",
@@ -133,50 +134,50 @@ const Y = ["id", "data-cy", "name", "data-validation", "autocomplete", "disabled
         placeholder: e.$attrs.placeholder,
         value: i.value,
         onClick: a[0] || (a[0] = (t) => d("click", t)),
-        onFocusin: a[1] || (a[1] = g(
+        onFocusin: a[1] || (a[1] = w(
           (t) => {
-            d("focusin", t), e.labelText && k(P)();
+            d("focusin", t), e.labelText && m(P)();
           },
           ["stop"]
         )),
-        onFocusout: a[2] || (a[2] = g(
+        onFocusout: a[2] || (a[2] = w(
           (t) => {
-            d("focusout", t), e.labelText && !e.keepFloatingLabel && k(w)(i.value);
+            d("focusout", t), e.labelText && !e.keepFloatingLabel && m($)(i.value);
           },
           ["stop"]
         )),
-        onInput: g(R, ["stop"]),
+        onInput: w(S, ["stop"]),
         onKeydown: [
           a[3] || (a[3] = Q(() => d("keydownEnterPressed"), ["enter"])),
           a[4] || (a[4] = (t) => d("keydown", t))
         ],
         onKeyup: a[5] || (a[5] = (t) => d("keyup", t))
-      }, null, 42, Y),
-      e.labelText ? (s(), J(W, {
+      }, null, 42, X),
+      e.labelText ? (s(), J(R, {
         key: 0,
         for: r.value,
         "label-text": e.labelText,
-        "label-state": k(c),
+        "label-state": m(c),
         "is-valid": e.isValid,
         required: e.$attrs.required,
         disabled: e.$attrs.disabled,
         "label-classes": [e.labelClasses, _],
         "label-text-classes": e.labelTextClasses
-      }, null, 8, ["for", "label-text", "label-state", "is-valid", "required", "disabled", "label-classes", "label-text-classes"])) : h("", !0),
-      m(e.$slots, "feedback", {}, () => [
+      }, null, 8, ["for", "label-text", "label-state", "is-valid", "required", "disabled", "label-classes", "label-text-classes"])) : g("", !0),
+      v(e.$slots, "feedback", {}, () => [
         e.isValid === !1 ? (s(!0), o(B, { key: 0 }, E(f.value.invalid, (t, y) => (s(), o("div", {
           key: `${r.value}_invalid_${y}`,
           class: "uikit-mt-1 uikit-text-12 uikit-text-w-red",
           innerHTML: t
-        }, null, 8, Z))), 128)) : e.isValid === !0 ? (s(!0), o(B, { key: 1 }, E(f.value.valid, (t, y) => (s(), o("div", {
+        }, null, 8, Y))), 128)) : e.isValid === !0 ? (s(!0), o(B, { key: 1 }, E(f.value.valid, (t, y) => (s(), o("div", {
           key: `${r.value}_valid_${y}`,
           class: "uikit-mt-1 uikit-text-12 uikit-text-w-blue",
           innerHTML: t
-        }, null, 8, x))), 128)) : h("", !0)
+        }, null, 8, Z))), 128)) : g("", !0)
       ]),
       e.$slots["under-label"] ? (s(), o("div", U, [
-        m(e.$slots, "under-label")
-      ])) : h("", !0)
+        v(e.$slots, "under-label")
+      ])) : g("", !0)
     ], 2));
   }
 });

package/dist/packages/components/lib/UIKit/BaseModal.vue.js

@@ -1,6 +1,6 @@
 import { defineComponent as z, ref as d, useTemplateRef as D, useId as K, computed as N, onUnmounted as S, watch as V, createBlock as W, openBlock as f, Teleport as A, createElementVNode as l, normalizeClass as o, withModifiers as g, createElementBlock as w, createCommentVNode as h, renderSlot as r, createVNode as F, unref as P, nextTick as U } from "vue";
-import { CloseIcon as R } from "../../../../node_modules/.pnpm/@wikicasa-dev_svg-icons@1.2.12_typescript@5.8.3/node_modules/@wikicasa-dev/svg-icons/dist/CloseIcon.js";
-import "../../../../node_modules/.pnpm/@wikicasa-dev_svg-icons@1.2.12_typescript@5.8.3/node_modules/@wikicasa-dev/svg-icons/dist/PharmacyIcon.js";
+import { CloseIcon as R } from "../../../../node_modules/.pnpm/@wikicasa-dev_svg-icons@1.2.15-alpha.1_vue@3.5.16_typescript@5.8.3_/node_modules/@wikicasa-dev/svg-icons/dist/CloseIcon.js";
+import "../../../../node_modules/.pnpm/@wikicasa-dev_svg-icons@1.2.15-alpha.1_vue@3.5.16_typescript@5.8.3_/node_modules/@wikicasa-dev/svg-icons/dist/PharmacyIcon.js";
 const j = ["id", "data-cy"], q = ["innerHTML"], X = /* @__PURE__ */ z({
   __name: "BaseModal",
   props: {

package/dist/packages/components/lib/UIKit/BaseNotificationBadge.vue.js

@@ -1,7 +1,7 @@
 import { defineComponent as o, createElementBlock as e, openBlock as i, renderSlot as n, createCommentVNode as u, toDisplayString as s } from "vue";
 const r = { class: "uikit-relative uikit-inline-block" }, a = {
   key: 0,
-  class: "uikit-pointer-events-none uikit-absolute -uikit-right-sm -uikit-top-sm uikit-rounded-3xs uikit-bg-w-cultured uikit-px-2xs uikit-text-12 uikit-font-medium uikit-text-w-blue"
+  class: "uikit-pointer-events-none uikit-absolute -uikit-right-sm -uikit-top-sm uikit-rounded-2xs uikit-bg-w-cultured uikit-px-2xs uikit-text-12 uikit-font-medium uikit-text-w-blue"
 }, p = /* @__PURE__ */ o({
   __name: "BaseNotificationBadge",
   props: {

package/dist/packages/components/lib/UIKit/BasePagination.vue.js

@@ -1,11 +1,11 @@
-import { defineComponent as v, mergeModels as P, useModel as C, computed as N, createBlock as n, openBlock as a, unref as i, withCtx as e, createVNode as l, createElementBlock as c, createElementVNode as p, toDisplayString as k, Fragment as b, renderList as L, createTextVNode as m } from "vue";
-import { PaginationRoot as B, PaginationList as D, PaginationPrev as F, PaginationListItem as M, PaginationEllipsis as E, PaginationNext as V } from "reka-ui";
-import { ArrowIcon as f } from "../../../../node_modules/.pnpm/@wikicasa-dev_svg-icons@1.2.12_typescript@5.8.3/node_modules/@wikicasa-dev/svg-icons/dist/ArrowIcon.js";
-import "../../../../node_modules/.pnpm/@wikicasa-dev_svg-icons@1.2.12_typescript@5.8.3/node_modules/@wikicasa-dev/svg-icons/dist/PharmacyIcon.js";
-import { useBreakpoints as _ } from "../../../../node_modules/.pnpm/@wikicasa-dev_vue-composables@0.0.23_typescript@5.8.3/node_modules/@wikicasa-dev/vue-composables/dist/useBreakpoints.js";
-const z = { class: "max-sm:uikit-hidden" }, I = { class: "max-sm:uikit-hidden" }, j = /* @__PURE__ */ v({
+import { defineComponent as L, mergeModels as N, computed as m, useModel as D, createBlock as n, openBlock as u, unref as i, withCtx as l, createVNode as o, createElementBlock as b, createElementVNode as f, toDisplayString as k, Fragment as p, renderList as U, resolveDynamicComponent as B, mergeProps as F, createTextVNode as y } from "vue";
+import { PaginationRoot as S, PaginationList as M, PaginationPrev as T, PaginationListItem as E, PaginationEllipsis as V, PaginationNext as j } from "reka-ui";
+import { ArrowIcon as h } from "../../../../node_modules/.pnpm/@wikicasa-dev_svg-icons@1.2.15-alpha.1_vue@3.5.16_typescript@5.8.3_/node_modules/@wikicasa-dev/svg-icons/dist/ArrowIcon.js";
+import "../../../../node_modules/.pnpm/@wikicasa-dev_svg-icons@1.2.15-alpha.1_vue@3.5.16_typescript@5.8.3_/node_modules/@wikicasa-dev/svg-icons/dist/PharmacyIcon.js";
+import { useBreakpoints as z } from "../../../../node_modules/.pnpm/@wikicasa-dev_vue-composables@0.0.24-alpha.5_vue@3.5.16_typescript@5.8.3_/node_modules/@wikicasa-dev/vue-composables/dist/useBreakpoints.js";
+const I = { class: "max-sm:uikit-hidden" }, Q = { class: "max-sm:uikit-hidden" }, G = /* @__PURE__ */ L({
   __name: "BasePagination",
-  props: /* @__PURE__ */ P({
+  props: /* @__PURE__ */ N({
     count: { default: 0 },
     limit: { default: 25 },
     siblings: {},
@@ -13,79 +13,102 @@ const z = { class: "max-sm:uikit-hidden" }, I = { class: "max-sm:uikit-hidden" }
     prevLabel: { default: "" },
     nextLabel: { default: "" },
     prevDataCy: {},
-    nextDataCy: {}
+    nextDataCy: {},
+    linkProps: {},
+    linkTag: { type: [Object, Function, String], default: "a" },
+    baseUrl: {},
+    pageQueryParameter: { default: "p" },
+    formatter: { type: Function }
   }, {
     pageNumber: { default: 1 },
     pageNumberModifiers: {}
   }),
   emits: ["update:pageNumber"],
-  setup(s) {
-    const { isSmall: w } = _({
+  setup(a) {
+    const { isSmall: w } = z({
       breakpoints: {
         sm: 640,
         md: 768,
         lg: 1024,
         xl: 1280
       }
-    }), r = C(s, "pageNumber"), h = N(() => Math.ceil(s.count / s.limit)), x = (t = 1) => t === 1, y = (t = 1) => t === h.value;
-    return (t, u) => (a(), n(i(B), {
-      page: r.value,
-      "onUpdate:page": u[0] || (u[0] = (d) => r.value = d),
+    }), v = m(() => a.baseUrl ? a.linkTag : "button"), s = D(a, "pageNumber"), x = m(() => Math.ceil(a.count / a.limit)), P = (t = 1) => t === 1, C = (t = 1) => t === x.value, g = (t = 1) => {
+      if (a.baseUrl)
+        try {
+          const e = new URL(a.baseUrl);
+          return t === 1 || e.searchParams.set(a.pageQueryParameter, `${t}`), e.toString();
+        } catch (e) {
+          console.error(e);
+          return;
+        }
+    };
+    return (t, e) => (u(), n(i(S), {
+      page: s.value,
+      "onUpdate:page": e[0] || (e[0] = (d) => s.value = d),
       total: t.count,
       "sibling-count": t.siblings ?? (i(w) ? 0 : 1),
       "items-per-page": t.limit,
       "show-edges": "",
       class: "uikit-text-16"
     }, {
-      default: e(() => [
-        l(i(D), { class: "uikit-flex uikit-gap-x-md" }, {
-          default: e(({ items: d }) => [
-            l(i(F), {
+      default: l(() => [
+        o(i(M), { class: "uikit-flex uikit-gap-x-md" }, {
+          default: l(({ items: d }) => [
+            o(i(T), {
               class: "uikit-flex uikit-cursor-pointer uikit-items-center uikit-gap-x-xs uikit-bg-transparent uikit-text-w-blue disabled:uikit-cursor-default disabled:uikit-text-w-lightgray [&:disabled_path]:uikit-stroke-w-lightgray",
               "data-cy": t.prevDataCy,
-              disabled: x(r.value)
+              disabled: P(s.value)
             }, {
-              default: e(() => [
-                l(i(f), {
+              default: l(() => [
+                o(i(h), {
                   width: 20,
                   height: 11,
                   "stroke-color": t.arrowColor,
                   class: "uikit-inline-block uikit-rotate-90"
                 }, null, 8, ["stroke-color"]),
-                p("span", z, k(t.prevLabel), 1)
+                f("span", I, k(t.prevLabel), 1)
               ]),
               _: 1
             }, 8, ["data-cy", "disabled"]),
-            (a(!0), c(b, null, L(d, (o, g) => (a(), c(b, null, [
-              o.type === "page" ? (a(), n(i(M), {
-                key: g,
-                value: o.value,
-                class: "uikit-size-xl uikit-cursor-pointer uikit-rounded-full uikit-border uikit-border-solid uikit-border-w-lightgray uikit-bg-white uikit-text-w-blue data-[selected]:uikit-border-w-blue data-[selected]:uikit-bg-w-cultured"
+            (u(!0), b(p, null, U(d, (r, c) => (u(), b(p, null, [
+              r.type === "page" ? (u(), n(i(E), {
+                key: c,
+                value: r.value,
+                "as-child": ""
               }, {
-                default: e(() => [
-                  m(k(o.value), 1)
+                default: l(() => [
+                  (u(), n(B(v.value), F({
+                    class: "uikit-flex uikit-size-xl uikit-cursor-pointer uikit-items-center uikit-justify-center uikit-rounded-full uikit-border uikit-border-solid uikit-border-w-lightgray uikit-bg-white uikit-text-w-blue data-[selected]:uikit-border-w-blue data-[selected]:uikit-bg-w-cultured",
+                    href: g(r.value),
+                    to: g(r.value)
+                  }, { ref_for: !0 }, t.linkProps), {
+                    default: l(() => [
+                      y(k(t.formatter ? t.formatter(r.value) : r.value), 1)
+                    ]),
+                    _: 2
+                  }, 1040, ["href", "to"]))
                 ]),
                 _: 2
-              }, 1032, ["value"])) : (a(), n(i(E), {
-                key: o.type,
+              }, 1032, ["value"])) : (u(), n(i(V), {
+                key: r.type,
                 class: "uikit-size-xl uikit-cursor-pointer uikit-rounded-full uikit-border uikit-border-solid uikit-border-w-lightgray uikit-bg-white uikit-text-center uikit-text-w-lightgray",
-                index: g
+                index: c
               }, {
-                default: e(() => u[1] || (u[1] = [
-                  m(" … ")
+                default: l(() => e[1] || (e[1] = [
+                  y(" … ")
                 ])),
                 _: 2,
                 __: [1]
               }, 1032, ["index"]))
             ], 64))), 256)),
-            l(i(V), {
+            o(i(j), {
               class: "uikit-flex uikit-cursor-pointer uikit-items-center uikit-gap-x-xs uikit-bg-transparent uikit-text-w-blue disabled:uikit-cursor-default disabled:uikit-text-w-lightgray [&:disabled_path]:uikit-stroke-w-lightgray",
               "data-cy": t.nextDataCy,
-              disabled: y(r.value)
+              disabled: C(s.value)
             }, {
-              default: e(() => [
-                p("span", I, k(t.nextLabel), 1),
-                l(i(f), {
+              default: l(() => [
+                f("span", Q, k(t.nextLabel), 1),
+                o(i(h), {
                   "stroke-color": t.arrowColor,
                   width: 20,
                   height: 11,
@@ -103,5 +126,5 @@ const z = { class: "max-sm:uikit-hidden" }, I = { class: "max-sm:uikit-hidden" }
   }
 });
 export {
-  j as default
+  G as default
 };

package/dist/packages/components/lib/UIKit/BasePin.vue.js

@@ -20,7 +20,7 @@ const a = {
       l("span", {
         class: n(["uikit-pin-body uikit-box-border", [
           {
-            "uikit-inline-flex uikit-min-w-xl uikit-rounded-3xs uikit-px-sm uikit-py-2xs": ["default", "large"].includes(i.type),
+            "uikit-inline-flex uikit-min-w-xl uikit-rounded-2xs uikit-px-xs uikit-py-2xs": ["default", "large"].includes(i.type),
             "uikit-px-xs": i.type === "large",
             "uikit-inline-flex uikit-size-lg uikit-items-center uikit-justify-center uikit-rounded-full": i.type === "rounded"
           }

package/dist/packages/components/lib/UIKit/{NativeSelect.vue.js → BaseSelect.vue.js}

@@ -1,6 +1,6 @@
-import { defineComponent as x, mergeModels as u, useCssVars as C, computed as v, useModel as w, useId as y, watch as S, createElementBlock as a, openBlock as d, createCommentVNode as V, createElementVNode as O, normalizeClass as c, unref as m, toDisplayString as p, Fragment as z, renderList as E } from "vue";
-const B = { class: "select-wrapper" }, D = ["for"], M = ["id"], N = ["data-idx", "selected"], I = /* @__PURE__ */ x({
-  __name: "NativeSelect",
+import { defineComponent as x, mergeModels as u, useCssVars as w, computed as C, useModel as v, useId as y, watch as S, createElementBlock as a, openBlock as d, createCommentVNode as V, createElementVNode as O, normalizeClass as c, unref as m, toDisplayString as p, Fragment as z, renderList as B } from "vue";
+const E = { class: "select-wrapper" }, D = ["for"], M = ["id"], T = ["data-idx", "selected"], N = /* @__PURE__ */ x({
+  __name: "BaseSelect",
   props: /* @__PURE__ */ u({
     labelText: { default: "" },
     options: { default: () => [] },
@@ -18,10 +18,10 @@ const B = { class: "select-wrapper" }, D = ["for"], M = ["id"], N = ["data-idx",
   }),
   emits: /* @__PURE__ */ u(["change"], ["update:modelValue"]),
   setup(o, { emit: f }) {
-    C((e) => ({
-      f3734614: k.value
+    w((e) => ({
+      "7c189782": b.value
     }));
-    const s = w(o, "modelValue"), b = f, n = y(), k = v(() => `${o.arrowSize}px`), g = ({ target: e }) => {
+    const s = v(o, "modelValue"), k = f, n = y(), b = C(() => `${o.arrowSize}px`), g = ({ target: e }) => {
       const i = (e.selectedOptions?.[0]).dataset.idx;
       if (i === void 0) return;
       const h = o.options[i];
@@ -36,7 +36,7 @@ const B = { class: "select-wrapper" }, D = ["for"], M = ["id"], N = ["data-idx",
         t && (s.value = t);
       },
       { immediate: !0 }
-    ), (e, t) => (d(), a("div", B, [
+    ), (e, t) => (d(), a("div", E, [
       e.labelText ? (d(), a("label", {
         key: 0,
         for: m(n),
@@ -44,22 +44,22 @@ const B = { class: "select-wrapper" }, D = ["for"], M = ["id"], N = ["data-idx",
       }, p(e.labelText), 11, D)) : V("", !0),
       O("select", {
         id: m(n),
-        class: c(["uikit-cursor-pointer uikit-bg-white uikit-pr-xl uikit-text-16 uikit-font-regular", {
+        class: c(["uikit-w-full uikit-cursor-pointer uikit-bg-white uikit-pr-xl uikit-text-16 uikit-font-regular", {
           "uikit-rounded-2xs uikit-border uikit-border-solid uikit-border-w-lightgray uikit-py-md uikit-pl-sm": e.border
         }]),
         onChange: t[0] || (t[0] = (l) => {
-          b("change", l), g(l);
+          k("change", l), g(l);
         })
       }, [
-        (d(!0), a(z, null, E(e.options, (l, i) => (d(), a("option", {
+        (d(!0), a(z, null, B(e.options, (l, i) => (d(), a("option", {
           key: `option-${i}`,
           "data-idx": i,
           selected: r(l, s.value)
-        }, p(l.label), 9, N))), 128))
+        }, p(l.label), 9, T))), 128))
       ], 42, M)
     ]));
   }
 });
 export {
-  I as default
+  N as default
 };

package/dist/packages/components/lib/UIKit/BaseSnackbar.vue.js

@@ -1,6 +1,6 @@
 import { defineComponent as p, ref as u, onBeforeMount as f, createBlock as h, openBlock as i, Teleport as y, createElementVNode as e, withModifiers as l, normalizeClass as x, createElementBlock as a, createCommentVNode as s, createVNode as v, unref as _ } from "vue";
-import { CloseIcon as C } from "../../../../node_modules/.pnpm/@wikicasa-dev_svg-icons@1.2.12_typescript@5.8.3/node_modules/@wikicasa-dev/svg-icons/dist/CloseIcon.js";
-import "../../../../node_modules/.pnpm/@wikicasa-dev_svg-icons@1.2.12_typescript@5.8.3/node_modules/@wikicasa-dev/svg-icons/dist/PharmacyIcon.js";
+import { CloseIcon as C } from "../../../../node_modules/.pnpm/@wikicasa-dev_svg-icons@1.2.15-alpha.1_vue@3.5.16_typescript@5.8.3_/node_modules/@wikicasa-dev/svg-icons/dist/CloseIcon.js";
+import "../../../../node_modules/.pnpm/@wikicasa-dev_svg-icons@1.2.15-alpha.1_vue@3.5.16_typescript@5.8.3_/node_modules/@wikicasa-dev/svg-icons/dist/PharmacyIcon.js";
 const g = { class: "snackbar-container uikit-fixed uikit-bottom-10px uikit-left-10px uikit-z-[2000] max-sm:uikit-left-0 max-sm:uikit-w-full" }, T = ["data-cy"], w = ["src", "alt"], L = {
   key: 1,
   class: "snackbar-type-icon uikit-bg-contain uikit-bg-no-repeat"

package/dist/packages/components/lib/UIKit/BaseTextarea.vue.js

@@ -1,8 +1,8 @@
-import { defineComponent as T, mergeModels as n, useModel as g, ref as C, watch as h, createElementBlock as f, openBlock as b, normalizeClass as r, createElementVNode as v, createCommentVNode as L, unref as o, createVNode as x, withModifiers as u, nextTick as F } from "vue";
+import { defineComponent as $, mergeModels as n, useModel as T, ref as h, watch as C, createElementBlock as f, openBlock as b, normalizeClass as r, createElementVNode as v, createCommentVNode as L, unref as o, createVNode as x, withModifiers as u, nextTick as F } from "vue";
 import M from "./BaseFloatingLabel.vue.js";
 import '../../../../assets/packages/components/lib/UIKit/BaseFloatingLabel.css';/* empty css                       */
 import { useFloatingLabel as E } from "../../../../composables/useFloatingLabel.js";
-const z = ["id", "data-cy", "data-validation", "rows", "disabled", "aria-labelledby", "readonly", "value"], B = ["innerHTML"], q = "peer-data-[validation='invalid']/fieldset:uikit-text-w-red peer-data-[validation='valid']/fieldset:uikit-text-w-blue", S = /* @__PURE__ */ T({
+const z = ["id", "data-cy", "data-validation", "rows", "disabled", "aria-labelledby", "readonly", "value"], B = ["innerHTML"], q = "peer-data-[validation='invalid']/fieldset:uikit-text-w-red peer-data-[validation='valid']/fieldset:uikit-text-w-blue", S = /* @__PURE__ */ $({
   inheritAttrs: !1,
   __name: "BaseTextarea",
   props: /* @__PURE__ */ n({
@@ -17,21 +17,21 @@ const z = ["id", "data-cy", "data-validation", "rows", "disabled", "aria-labelle
   }),
   emits: /* @__PURE__ */ n(["focusin", "focusout", "click", "keydown"], ["update:modelValue"]),
   setup(k, { expose: m, emit: p }) {
-    const t = g(k, "modelValue"), s = p, {
+    const t = T(k, "modelValue"), s = p, {
       labelState: d,
       handleFocusIn: c,
       handleFocusOut: w,
       setFloatingLabel: y,
       setInlineLabel: V
-    } = E(), a = C(null);
-    h(
+    } = E(), a = h(null);
+    C(
       t,
       (e) => {
         `${e}`.length && d.value !== "floating-label" ? y() : !e?.length && d.value !== "inline-label" && document.activeElement !== a.value && V();
       },
       { immediate: !0 }
     );
-    const $ = ({ target: e }) => {
+    const g = ({ target: e }) => {
       t.value = e.value;
     };
     return m({
@@ -59,7 +59,7 @@ const z = ["id", "data-cy", "data-validation", "rows", "disabled", "aria-labelle
           ref_key: "textarea",
           ref: a,
           "data-cy": e.$attrs["data-cy"],
-          class: r(["textarea-scrollbar uikit-peer/fieldset uikit-relative uikit-min-h-[130px] uikit-min-w-[343px] uikit-overflow-y-auto uikit-whitespace-pre-wrap uikit-rounded-2xs uikit-border uikit-border-solid uikit-bg-white uikit-px-sm uikit-py-lg uikit-text-16 uikit-outline-none focus-visible:uikit-border-w-blue data-[validation='invalid']:uikit-border-w-red data-[validation='valid']:uikit-border-w-blue", [
+          class: r(["textarea-scrollbar uikit-peer/fieldset uikit-relative uikit-min-h-[130px] uikit-min-w-[343px] uikit-overflow-y-auto uikit-whitespace-pre-wrap uikit-rounded-2xs uikit-border uikit-border-solid uikit-border-w-lightgray uikit-bg-white uikit-px-sm uikit-py-lg uikit-text-16 uikit-outline-none focus-visible:uikit-border-w-blue data-[validation='invalid']:uikit-border-w-red data-[validation='valid']:uikit-border-w-blue", [
             { "is-invalid": e.isValid === !1 },
             { "is-valid": e.isValid },
             { "uikit-resize-none": !e.resize },
@@ -82,7 +82,7 @@ const z = ["id", "data-cy", "data-validation", "rows", "disabled", "aria-labelle
             },
             ["stop"]
           )),
-          onInput: u($, ["stop"]),
+          onInput: u(g, ["stop"]),
           onKeydown: i[2] || (i[2] = u((l) => s("keydown", l), ["stop"])),
           onClick: i[3] || (i[3] = (l) => s("click", l)),
           value: t.value

package/dist/packages/components/lib/UIKit/BaseUploadFile.vue.js

@@ -29,7 +29,7 @@ const h = ["for"], k = ["id", "multiple", "accept"], B = /* @__PURE__ */ p({
       class: s(["base-upload-file-wrapper uikit-relative", [e.$attrs.class]])
     }, [
       i("label", {
-        class: s(["uikit-btn uikit-btn-w-ternary", e.labelClasses]),
+        class: s(["uikit-btn uikit-btn-ternary", e.labelClasses]),
         for: e.id
       }, [
         i("input", {

package/dist/packages/components/lib/UIKit/Checkbox/CheckboxBtn.vue.js

@@ -1,6 +1,6 @@
 import { defineComponent as m, useId as f, computed as h, watch as b, createElementBlock as p, openBlock as u, createVNode as n, renderSlot as C, unref as l, normalizeClass as y, withCtx as s, createBlock as V, createCommentVNode as g, createTextVNode as B, toDisplayString as w } from "vue";
-import { CheckIcon as I } from "../../../../../node_modules/.pnpm/@wikicasa-dev_svg-icons@1.2.12_typescript@5.8.3/node_modules/@wikicasa-dev/svg-icons/dist/CheckIcon.js";
-import "../../../../../node_modules/.pnpm/@wikicasa-dev_svg-icons@1.2.12_typescript@5.8.3/node_modules/@wikicasa-dev/svg-icons/dist/PharmacyIcon.js";
+import { CheckIcon as I } from "../../../../../node_modules/.pnpm/@wikicasa-dev_svg-icons@1.2.15-alpha.1_vue@3.5.16_typescript@5.8.3_/node_modules/@wikicasa-dev/svg-icons/dist/CheckIcon.js";
+import "../../../../../node_modules/.pnpm/@wikicasa-dev_svg-icons@1.2.15-alpha.1_vue@3.5.16_typescript@5.8.3_/node_modules/@wikicasa-dev/svg-icons/dist/PharmacyIcon.js";
 import { CheckboxRoot as v, CheckboxIndicator as x } from "reka-ui";
 const N = ["for"], q = /* @__PURE__ */ m({
   __name: "CheckboxBtn",
@@ -19,7 +19,7 @@ const N = ["for"], q = /* @__PURE__ */ m({
   },
   emits: ["click", "change", "update:modelValue"],
   setup(t, { emit: r }) {
-    const i = f(), d = h(() => `${t.id || i}`), a = r;
+    const i = f(), d = h(() => `${t.id ?? i}`), a = r;
     b(
       () => t.checked,
       (e) => {
@@ -43,7 +43,7 @@ const N = ["for"], q = /* @__PURE__ */ m({
         "model-value": e.modelValue,
         "data-cy": e.dataCy,
         disabled: e.disabled,
-        class: y(["uikit-inline-flex uikit-size-[20px] uikit-items-center uikit-justify-center uikit-rounded-3xs uikit-p-0 data-[state='unchecked']:uikit-border data-[state='unchecked']:uikit-border-solid data-[state='unchecked']:uikit-border-w-lightgray", [
+        class: y(["uikit-inline-flex uikit-size-[20px] uikit-items-center uikit-justify-center uikit-rounded-2xs uikit-p-0 data-[state='unchecked']:uikit-border data-[state='unchecked']:uikit-border-solid data-[state='unchecked']:uikit-border-w-lightgray", [
           {
             "uikit-bg-white": !e.modelValue,
             "uikit-bg-w-blue": e.modelValue