@wikicasa-dev/components 2.0.44 → 2.0.46

package/dist/BaseAutocomplete.js

@@ -1,4 +1,4 @@
-import { _ as f } from "./chunks/BaseAutocomplete.vue_vue_type_script_setup_true_lang.DI5YPfeQ.js";
+import { _ as f } from "./chunks/BaseAutocomplete.vue_vue_type_script_setup_true_lang.CThPNixl.js";
 export {
   f as default
 };

package/dist/BaseDropDown.js

@@ -1,4 +1,4 @@
-import { _ as f } from "./chunks/BaseDropDown.vue_vue_type_script_setup_true_lang.BscSQ5bW.js";
+import { _ as f } from "./chunks/BaseDropDown.vue_vue_type_script_setup_true_lang.CDb77c8J.js";
 export {
   f as default
 };

package/dist/BaseModal.js

@@ -1,4 +1,4 @@
-import { _ as f } from "./chunks/BaseModal.vue_vue_type_style_index_0_lang.Bn6P4cIx.js";
+import { _ as f } from "./chunks/BaseModal.vue_vue_type_style_index_0_lang.CeKWAwpg.js";
 export {
   f as default
 };

package/dist/UIKit/BaseDropDown.vue.d.ts

@@ -1,4 +1,5 @@
-import { ClassType } from '@wikicasa-dev/types';
+import { Nullable } from '@wikicasa-dev/types';
+import { ClassType } from './types';
 declare function __VLS_template(): {
     slots: {
         btn_slot?(_: {
@@ -10,6 +11,8 @@ declare function __VLS_template(): {
             toggleDropdown: () => void;
             activeIdx: number;
             selectedIdx: number;
+            setActiveIdx: (idx?: Nullable<number>) => void;
+            setSelectedIdx: (idx?: Nullable<number>) => void;
         }): any;
     };
     refs: {
@@ -60,8 +63,8 @@ declare const __VLS_component: import('vue').DefineComponent<{
     dataCy: string;
     arrowWidth: number;
     btnClasses: string;
-    labelClasses: ClassType;
-    dropdownClasses: ClassType;
+    labelClasses: string | Record<string, boolean> | ClassType[] | null;
+    dropdownClasses: string | Record<string, boolean> | ClassType[] | null;
     withArrowIcon: boolean;
     btnLabel: string;
     direction: "up" | "down";

package/dist/UIKit/BaseModal.vue.d.ts

@@ -43,6 +43,7 @@ declare const __VLS_component: import('vue').DefineComponent<{
 }, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
     opened: () => any;
     closed: () => any;
+    dialogClick: (args_0: MouseEvent) => any;
 }, string, import('vue').PublicProps, Readonly<{
     id?: string;
     size?: "modal-sm" | "modal-md" | "modal-lg" | "modal-xxl" | "modal-full";
@@ -67,6 +68,7 @@ declare const __VLS_component: import('vue').DefineComponent<{
 }> & Readonly<{
     onOpened?: (() => any) | undefined;
     onClosed?: (() => any) | undefined;
+    onDialogClick?: ((args_0: MouseEvent) => any) | undefined;
 }>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
     backdropEl: HTMLDivElement;
     modalDialog: HTMLDialogElement;

package/dist/chunks/{BaseAutocomplete.vue_vue_type_script_setup_true_lang.DI5YPfeQ.js → BaseAutocomplete.vue_vue_type_script_setup_true_lang.CThPNixl.js}

@@ -1,6 +1,6 @@
 import { defineComponent as T, mergeModels as $, useModel as L, ref as r, computed as k, onBeforeMount as F, watch as f, openBlock as C, createBlock as S, normalizeClass as H, withCtx as s, createVNode as z, renderSlot as V, createElementBlock as A, Fragment as K, renderList as N, unref as U, createElementVNode as W } from "vue";
 import j from "../BaseInput.js";
-import { _ as q } from "./BaseDropDown.vue_vue_type_script_setup_true_lang.BscSQ5bW.js";
+import { _ as q } from "./BaseDropDown.vue_vue_type_script_setup_true_lang.CDb77c8J.js";
 import "./types-B0dZ7OiV.D29wNgoj.js";
 import { _ as G } from "./SelectItem.vue_vue_type_script_setup_true_lang.GPFf7fjA.js";
 import { A as J } from "./useKeyboardController.CutKeclN.js";

package/dist/chunks/{BaseDropDown.vue_vue_type_script_setup_true_lang.BscSQ5bW.js → BaseDropDown.vue_vue_type_script_setup_true_lang.CDb77c8J.js}

@@ -1,9 +1,9 @@
-import { defineComponent as D, useId as S, ref as m, computed as L, useTemplateRef as E, watch as r, onBeforeMount as I, onMounted as A, onUnmounted as O, openBlock as s, createElementBlock as W, normalizeClass as i, withModifiers as w, renderSlot as v, createVNode as $, unref as a, withCtx as b, createElementVNode as M, createBlock as h, createCommentVNode as H, resolveDynamicComponent as N } from "vue";
-import { _ as T } from "./BaseButton.vue_vue_type_script_setup_true_lang.BWZPE2Gf.js";
-import { a as V } from "./ArrowIcon.CCFMdsq6.js";
+import { defineComponent as I, useId as L, ref as w, computed as A, useTemplateRef as E, watch as s, onBeforeMount as O, onMounted as W, onUnmounted as $, openBlock as u, createElementBlock as M, normalizeClass as i, withModifiers as v, renderSlot as b, createVNode as H, unref as a, withCtx as h, createElementVNode as N, createBlock as C, createCommentVNode as T, resolveDynamicComponent as V } from "vue";
+import { _ as K } from "./BaseButton.vue_vue_type_script_setup_true_lang.BWZPE2Gf.js";
+import { a as q } from "./ArrowIcon.CCFMdsq6.js";
 import "./PharmacyIcon.56ql_DYl.js";
-import { A as K } from "./useKeyboardController.CutKeclN.js";
-const q = ["innerHTML"], G = /* @__PURE__ */ D({
+import { A as z } from "./useKeyboardController.CutKeclN.js";
+const R = ["innerHTML"], Q = /* @__PURE__ */ I({
   inheritAttrs: !1,
   __name: "BaseDropDown",
   props: {
@@ -24,13 +24,13 @@ const q = ["innerHTML"], G = /* @__PURE__ */ D({
     dataCy: { default: "" }
   },
   emits: ["click", "update:dropdownState"],
-  setup(C, { emit: y }) {
-    const o = C, u = S(), p = y, t = m(!1), n = m([]), g = L(() => n.value.length), c = E("dropdown"), { activeIdx: B, selectedIdx: k } = K({
-      optionsLength: g,
+  setup(y, { emit: g }) {
+    const o = y, c = L(), p = g, t = w(!1), n = w([]), B = A(() => n.value.length), k = E("dropdown"), { activeIdx: f, selectedIdx: d } = z({
+      optionsLength: B,
       isDropdownOpen: t,
       activate: o.activateKeyboardController
     });
-    r(
+    s(
       () => o.openDropdown,
       (e) => {
         t.value = e;
@@ -38,34 +38,38 @@ const q = ["innerHTML"], G = /* @__PURE__ */ D({
       {
         immediate: !0
       }
-    ), r(t, (e) => {
+    ), s(t, (e) => {
       p("update:dropdownState", e);
-    }), r(k, (e) => {
+    }), s(d, (e) => {
       e !== -1 && n.value[e].querySelector("a")?.click();
     });
-    const f = () => {
+    const m = () => {
       t.value = !1;
-    }, d = () => {
+    }, r = () => {
       o.keepState === "closed" && !t.value || o.keepState === "opened" && t.value || (t.value = !t.value);
+    }, S = (e) => {
+      e != null && (f.value = e);
+    }, D = (e) => {
+      e != null && (d.value = e);
     };
-    return I(() => {
-      o.closeWhenClickedOutside && document.body.addEventListener("click", f);
-    }), A(() => {
-      c.value && (n.value = c.value.children || []);
-    }), O(() => {
-      o.closeWhenClickedOutside && document.body.removeEventListener("click", f);
-    }), (e, l) => (s(), W("div", {
+    return O(() => {
+      o.closeWhenClickedOutside && document.body.addEventListener("click", m);
+    }), W(() => {
+      k.value && (n.value = k.value.children || []);
+    }), $(() => {
+      o.closeWhenClickedOutside && document.body.removeEventListener("click", m);
+    }), (e, l) => (u(), M("div", {
       class: i(["uikit-relative uikit-block", e.$attrs.class]),
-      onClick: l[1] || (l[1] = w((z) => {
-        p("click"), d();
+      onClick: l[1] || (l[1] = v((U) => {
+        p("click"), r();
       }, ["stop"]))
     }, [
-      v(e.$slots, "btn_slot", {
-        toggleDropdown: d,
+      b(e.$slots, "btn_slot", {
+        toggleDropdown: r,
         isOpen: t.value
       }, () => [
-        $(T, {
-          id: a(u),
+        H(K, {
+          id: a(c),
           type: "button",
           "data-cy": e.dataCy,
           class: i([
@@ -75,24 +79,24 @@ const q = ["innerHTML"], G = /* @__PURE__ */ D({
           "aria-expanded": t.value,
           "btn-class": "uikit-btn-single-selection"
         }, {
-          default: b(() => [
-            M("span", {
+          default: h(() => [
+            N("span", {
               class: i(["uikit-mr-5px", e.labelClasses]),
               innerHTML: e.btnLabel
-            }, null, 10, q),
-            e.withArrowIcon ? (s(), h(a(V), {
+            }, null, 10, R),
+            e.withArrowIcon ? (u(), C(a(q), {
               key: 0,
               class: i(["uikit-shrink-0 uikit-transition-transform motion-reduce:uikit-transition-none", t.value ? "uikit-rotate-180" : ""]),
               width: e.arrowWidth,
               height: e.arrowWidth,
               "stroke-color": e.arrowStrokeColor
-            }, null, 8, ["class", "width", "height", "stroke-color"])) : H("", !0)
+            }, null, 8, ["class", "width", "height", "stroke-color"])) : T("", !0)
           ]),
           _: 1
         }, 8, ["id", "data-cy", "class", "aria-expanded"])
       ]),
-      (s(), h(N(e.dropdownElement), {
-        id: "dropdown_" + a(u),
+      (u(), C(V(e.dropdownElement), {
+        id: "dropdown_" + a(c),
         ref: "dropdown",
         "data-cy": e.dataCy && `${e.dataCy}_dropdown`,
         class: i(["uikit-max-h-[220px] uikit-w-full uikit-min-w-[90px] uikit-flex-col uikit-overflow-y-auto uikit-border uikit-border-solid uikit-border-w-lavender uikit-bg-white uikit-pl-0 uikit-opacity-100 uikit-shadow uikit-no-scrollbar", [
@@ -103,15 +107,17 @@ const q = ["innerHTML"], G = /* @__PURE__ */ D({
           { "uikit-absolute": e.isAbsolute }
         ]]),
         "aria-hidden": !t.value,
-        onClick: l[0] || (l[0] = w(() => {
+        onClick: l[0] || (l[0] = v(() => {
         }, ["stop"]))
       }, {
-        default: b(() => [
-          v(e.$slots, "default", {
+        default: h(() => [
+          b(e.$slots, "default", {
             isOpen: t.value,
-            toggleDropdown: d,
-            activeIdx: a(B),
-            selectedIdx: a(k)
+            toggleDropdown: r,
+            activeIdx: a(f),
+            selectedIdx: a(d),
+            setActiveIdx: S,
+            setSelectedIdx: D
           })
         ]),
         _: 3
@@ -120,5 +126,5 @@ const q = ["innerHTML"], G = /* @__PURE__ */ D({
   }
 });
 export {
-  G as _
+  Q as _
 };

package/dist/chunks/{BaseModal.vue_vue_type_style_index_0_lang.Bn6P4cIx.js → BaseModal.vue_vue_type_style_index_0_lang.CeKWAwpg.js}

@@ -1,16 +1,16 @@
-import { defineComponent as E, ref as d, useTemplateRef as T, onUnmounted as z, watch as H, openBlock as m, createBlock as O, Teleport as $, createElementVNode as l, normalizeClass as s, withModifiers as y, createElementBlock as h, createVNode as D, unref as I, createCommentVNode as w, renderSlot as r, nextTick as K } from "vue";
+import { defineComponent as T, ref as d, useTemplateRef as z, onUnmounted as H, watch as O, openBlock as m, createBlock as $, Teleport as D, createElementVNode as a, normalizeClass as s, withModifiers as y, createElementBlock as h, createVNode as I, unref as K, createCommentVNode as w, renderSlot as r, nextTick as N } from "vue";
 import "./types-B0dZ7OiV.D29wNgoj.js";
-import { l as N } from "./CloseIcon.DIkr4soH.js";
+import { l as V } from "./CloseIcon.DIkr4soH.js";
 import "./PharmacyIcon.56ql_DYl.js";
-import '../assets/BaseModal.css';const g = () => navigator?.userAgent.includes("Windows"), V = (o, c) => new Promise((a, t) => {
+import '../assets/BaseModal.css';const g = () => navigator?.userAgent.includes("Windows"), A = (o, c) => new Promise((l, t) => {
   setTimeout(() => {
     try {
-      o && o(), a();
+      o && o(), l();
     } catch {
       t();
     }
   }, c);
-}), A = ["id", "data-cy"], F = ["innerHTML"], R = /* @__PURE__ */ E({
+}), F = ["id", "data-cy"], P = ["innerHTML"], j = /* @__PURE__ */ T({
   __name: "BaseModal",
   props: {
     id: { default: "base-bt-modal" },
@@ -31,25 +31,25 @@ import '../assets/BaseModal.css';const g = () => navigator?.userAgent.includes("
     closeIconBtnClasses: {},
     titleClasses: {}
   },
-  emits: ["closed", "opened"],
+  emits: ["closed", "opened", "dialogClick"],
   setup(o, { emit: c }) {
-    const a = c, t = d(!1), f = d(null), u = T("modalDialog"), k = d(!1), n = d(!1), p = ({ key: e }) => {
+    const l = c, t = d(!1), f = d(null), u = z("modalDialog"), k = d(!1), n = d(!1), p = ({ key: e }) => {
       e === "Escape" && i();
     }, C = () => {
       document?.body.addEventListener("keydown", p);
     }, b = () => {
       document?.body.removeEventListener("keydown", p);
     }, M = async () => {
-      t.value = !0, K(() => {
-        C(), document?.documentElement.classList.add("uikit-no-scrolling"), g() ? document?.body.classList.add("uikit-no-scrolling", "sm:uikit-pr-15px") : document?.body.classList.add("uikit-no-scrolling");
-      }), a("opened"), o.autoClose !== void 0 && setTimeout(() => {
+      t.value = !0, N(() => {
+        C(), g() ? document?.body.classList.add("uikit-no-scrolling", "sm:uikit-pr-15px") : document?.body.classList.add("uikit-no-scrolling");
+      }), l("opened"), o.autoClose !== void 0 && setTimeout(() => {
         i();
       }, o.autoClose);
     }, B = (e) => {
       u.value && u.value.contains(e.target) && (n.value = !0);
-    }, L = (e) => {
+    }, x = (e) => {
       u.value && u.value.contains(e.target) && (n.value = !1);
-    }, x = async () => {
+    }, L = async () => {
       if (o.closeOnClickOut) {
         if (n.value) {
           n.value = !1;
@@ -58,20 +58,20 @@ import '../assets/BaseModal.css';const g = () => navigator?.userAgent.includes("
         await i();
       }
     }, i = async () => {
-      t.value = !1, b(), document?.documentElement.classList.remove("uikit-no-scrolling"), navigator.userAgent.includes("Windows") ? document?.body.classList.remove("uikit-no-scrolling", "sm:uikit-pr-15px") : document?.body.classList.remove("uikit-no-scrolling"), await V(() => {
-        f.value?.classList.add("uikit-hidden"), a("closed");
+      t.value = !1, b(), document?.documentElement.classList.remove("uikit-no-scrolling"), navigator.userAgent.includes("Windows") ? document?.body.classList.remove("uikit-no-scrolling", "sm:uikit-pr-15px") : document?.body.classList.remove("uikit-no-scrolling"), await A(() => {
+        f.value?.classList.add("uikit-hidden"), l("closed");
       }, 250);
     };
-    return z(() => {
+    return H(() => {
       b(), document?.documentElement.classList.remove("uikit-no-scrolling"), g() ? document?.body.classList.remove("uikit-no-scrolling", "sm:uikit-pr-15px") : document?.body.classList.remove("uikit-no-scrolling");
-    }), H(
+    }), O(
       () => o.showModal,
       async (e) => {
         !e && !t.value ? k.value = !0 : k.value = !1, e && !t.value && await M(), !e && t.value && await i(), t.value = e;
       },
       { immediate: !0 }
-    ), (e, v) => (m(), O($, { to: "body" }, [
-      l("div", {
+    ), (e, v) => (m(), $(D, { to: "body" }, [
+      a("div", {
         ref_key: "backdropEl",
         ref: f,
         class: s(["bbt-backdrop uikit-fixed uikit-left-0 uikit-top-0 uikit-h-full uikit-w-full", [
@@ -84,11 +84,11 @@ import '../assets/BaseModal.css';const g = () => navigator?.userAgent.includes("
           { hide: k.value }
         ]]),
         style: { "z-index": "1062" },
-        onClick: x,
+        onClick: L,
         onMousedown: B,
-        onMouseup: L
+        onMouseup: x
       }, [
-        l("dialog", {
+        a("dialog", {
           id: e.id,
           ref: "modalDialog",
           "data-cy": e.dataCy,
@@ -102,10 +102,9 @@ import '../assets/BaseModal.css';const g = () => navigator?.userAgent.includes("
             `base-${e.size}`,
             e.fullHeight ? "uikit-h-[95%]" : "uikit-h-auto"
           ]]),
-          onClick: v[0] || (v[0] = y(() => {
-          }, ["stop"]))
+          onClick: v[0] || (v[0] = y((E) => l("dialogClick", E), ["stop"]))
         }, [
-          l("div", {
+          a("div", {
             class: s(["default-header uikit-sticky uikit-top-0 uikit-z-10 uikit-rounded-t uikit-border-0 uikit-bg-white uikit-px-4 uikit-pb-10px uikit-pt-20px sm:uikit-px-6", [e.customModalHeaderClasses]])
           }, [
             e.withCloseIcon ? (m(), h("button", {
@@ -117,20 +116,20 @@ import '../assets/BaseModal.css';const g = () => navigator?.userAgent.includes("
               "aria-label": "Close",
               onClick: y(i, ["prevent", "stop"])
             }, [
-              D(I(N), {
+              I(K(V), {
                 class: "bbt-close-icon uikit-box-border uikit-p-5px",
                 width: 30,
                 height: 30
               })
             ], 2)) : w("", !0),
             r(e.$slots, "header", { closeModal: i }, () => [
-              l("span", {
+              a("span", {
                 class: s(["uikit-w-auto uikit-text-18 uikit-font-semibold sm:uikit-text-22", e.titleClasses]),
                 innerHTML: e.headerTitle
-              }, null, 10, F)
+              }, null, 10, P)
             ])
           ], 2),
-          l("div", {
+          a("div", {
             class: s(["uikit-bbt-body uikit-flex-auto uikit-overflow-y-auto uikit-overflow-x-hidden uikit-px-4 uikit-pb-0 uikit-no-scrollbar sm:uikit-px-6 sm:uikit-pb-25px", [e.customModalBodyClasses]])
           }, [
             r(e.$slots, "body", { closeModal: i })
@@ -142,11 +141,11 @@ import '../assets/BaseModal.css';const g = () => navigator?.userAgent.includes("
             r(e.$slots, "footer", { closeModal: i })
           ], 2)) : w("", !0),
           r(e.$slots, "fixed-bottom")
-        ], 10, A)
+        ], 10, F)
       ], 34)
     ]));
   }
 });
 export {
-  R as _
+  j as _
 };

package/dist/index.js

@@ -11,12 +11,12 @@ import { _ as g } from "./chunks/RadioButton.vue_vue_type_script_setup_true_lang
 import { _ as h } from "./chunks/RadioGroup.vue_vue_type_script_setup_true_lang.DdmSUyxZ.js";
 import { _ as I } from "./chunks/AccessibleSelect.vue_vue_type_script_setup_true_lang.ClV6kObA.js";
 import { _ as w } from "./chunks/BaseAlert.vue_vue_type_style_index_0_lang.BtqP_iYL.js";
-import { _ as k } from "./chunks/BaseAutocomplete.vue_vue_type_script_setup_true_lang.DI5YPfeQ.js";
+import { _ as k } from "./chunks/BaseAutocomplete.vue_vue_type_script_setup_true_lang.CThPNixl.js";
 import { _ as v } from "./chunks/BaseBadge.vue_vue_type_style_index_0_lang.BOA1gBKu.js";
 import { _ as G } from "./chunks/BaseButton.vue_vue_type_script_setup_true_lang.BWZPE2Gf.js";
 import { default as O } from "./BaseCard.js";
 import { default as R } from "./BaseComplexToggle.js";
-import { _ as V } from "./chunks/BaseDropDown.vue_vue_type_script_setup_true_lang.BscSQ5bW.js";
+import { _ as V } from "./chunks/BaseDropDown.vue_vue_type_script_setup_true_lang.CDb77c8J.js";
 import { default as q } from "./BaseFloatingLabel.js";
 import { default as z } from "./BaseIcon.js";
 import { default as H } from "./BaseInput.js";
@@ -27,7 +27,7 @@ import { default as Z } from "./BaseTextarea.js";
 import { default as ee } from "./BaseToggle.js";
 import { default as re } from "./BaseTooltip.js";
 import { _ as te } from "./chunks/BaseUploadFile.vue_vue_type_script_setup_true_lang.2elmVcZt.js";
-import { _ as fe } from "./chunks/BaseModal.vue_vue_type_style_index_0_lang.Bn6P4cIx.js";
+import { _ as fe } from "./chunks/BaseModal.vue_vue_type_style_index_0_lang.CeKWAwpg.js";
 import { default as me } from "./BaseSnackbar.js";
 import { default as le } from "./StaticSpinner.js";
 import { default as de } from "./BaseShimmerLoader.js";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wikicasa-dev/components",
-  "version": "2.0.44",
+  "version": "2.0.46",
   "description": "Wikicasa frontend components",
   "type": "module",
   "main": "./dist/index.js",