@wikicasa-dev/components 2.2.8-alpha.11 → 2.2.8-alpha.13

package/dist/Swiper/autoplay.js

@@ -1,5 +1,5 @@
 import { Autoplay as t } from "swiper/modules";
-import '../assets/swiper-thumbs.css';/* empty css                                                                           */
+import '../assets/swiper-keyboard.css';/* empty css                                                                           */
 export {
   t as Autoplay
 };

package/dist/Swiper/controller.js

@@ -1,5 +1,5 @@
 import { Controller as e } from "swiper/modules";
-import '../assets/swiper-thumbs.css';/* empty css                                                                             */
+import '../assets/swiper-keyboard.css';/* empty css                                                                             */
 export {
   e as Controller
 };

package/dist/Swiper/keyboard.js

@@ -1,5 +1,5 @@
 import { Keyboard as m } from "swiper/modules";
-import '../assets/swiper-thumbs.css';/* empty css                                                                           */
+import '../assets/swiper-keyboard.css';/* empty css                                                                           */
 export {
   m as Keyboard
 };

package/dist/Swiper/thumbs.js

@@ -1,5 +1,5 @@
 import { Thumbs as p } from "swiper/modules";
-import '../assets/swiper-thumbs.css';/* empty css                                                                         */
+import '../assets/swiper-keyboard.css';/* empty css                                                                         */
 export {
   p as Thumbs
 };

package/dist/UIKit/Autocomplete/ClearableAutocomplete.d.ts

@@ -17,8 +17,10 @@ declare const _default: <TID extends string | number | undefined, TPayload>(__VL
     props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{
         readonly "onUpdate:modelValue"?: ((value: Nullable<AccessibleSelectOptions<TPayload, TID>>) => any) | undefined;
         readonly onClick?: (() => any) | undefined;
+        readonly onKeydown?: ((args_0: KeyboardEvent) => any) | undefined;
         readonly "onUpdate:open"?: ((value: boolean) => any) | undefined;
-    } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, never>, "onUpdate:modelValue" | "onClick" | "onUpdate:open"> & ({
+        readonly "onUpdate:inputValue"?: ((args_0: string) => any) | undefined;
+    } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, never>, "onUpdate:modelValue" | "onClick" | "onKeydown" | "onUpdate:open" | "onUpdate:inputValue"> & ({
         open?: boolean;
         modelValue?: Nullable<AccessibleSelectOptions<TPayload, TID>>;
     } & ClearableAutocompleteProps<TID, TPayload>) & Partial<{}>> & import('vue').PublicProps;
@@ -35,7 +37,7 @@ declare const _default: <TID extends string | number | undefined, TPayload>(__VL
             idx: number;
         }): any;
     };
-    emit: ((evt: "click") => void) & (((evt: "update:modelValue", value: Nullable<AccessibleSelectOptions<TPayload, TID>>) => void) & ((evt: "update:open", value: boolean) => void));
+    emit: (((evt: "click") => void) & ((evt: "keydown", args_0: KeyboardEvent) => void) & ((evt: "update:inputValue", args_0: string) => void)) & (((evt: "update:modelValue", value: Nullable<AccessibleSelectOptions<TPayload, TID>>) => void) & ((evt: "update:open", value: boolean) => void));
 }>) => import('vue').VNode & {
     __ctx?: Awaited<typeof __VLS_setup>;
 };

package/dist/UIKit/BaseModal.d.ts

@@ -7,6 +7,10 @@ type __VLS_Props = {
     customModalHeaderClasses?: ClassTypeProp;
     customModalBodyClasses?: ClassTypeProp;
     customModalFooterClasses?: ClassTypeProp;
+    closeIcon?: Partial<{
+        size?: number;
+        classes?: ClassTypeProp;
+    }>;
     withCloseIcon?: boolean;
     showModal?: boolean;
     headerTitle?: string;

package/dist/packages/components/lib/UIKit/Autocomplete/ClearableAutocomplete.vue.js

@@ -1,11 +1,11 @@
-import { defineComponent as N, mergeModels as g, useModel as M, useTemplateRef as m, shallowRef as r, onBeforeMount as O, watch as C, nextTick as U, createBlock as $, openBlock as p, withCtx as b, createElementBlock as V, Fragment as D, renderList as H, renderSlot as c, createElementVNode as d, normalizeClass as v, withDirectives as K, createCommentVNode as A, vModelText as P, toDisplayString as X, normalizeStyle as j, createTextVNode as q } from "vue";
+import { defineComponent as L, mergeModels as M, useModel as V, useTemplateRef as C, shallowRef as r, onBeforeMount as N, watch as b, nextTick as O, createBlock as $, openBlock as p, withCtx as y, createElementBlock as B, Fragment as U, renderList as D, renderSlot as c, createElementVNode as d, normalizeClass as v, withDirectives as H, createCommentVNode as A, vModelText as P, toDisplayString as X, normalizeStyle as j, createTextVNode as q } from "vue";
 import G from "../BaseDropDown.vue.js";
 import '../../../../../assets/BaseDropDown.css';/* empty css                   */
 import J from "../BaseSelect/SelectItem.vue.js";
 import { debounce as Q } from "@wikicasa-dev/utilities";
-const Y = ["readonly", "placeholder"], Z = ["innerHTML"], oe = /* @__PURE__ */ N({
+const Y = ["readonly", "placeholder"], Z = ["innerHTML"], oe = /* @__PURE__ */ L({
   __name: "ClearableAutocomplete",
-  props: /* @__PURE__ */ g({
+  props: /* @__PURE__ */ M({
     dataCy: {},
     placeholder: {},
     triggerWrapperClasses: {},
@@ -22,41 +22,41 @@ const Y = ["readonly", "placeholder"], Z = ["innerHTML"], oe = /* @__PURE__ */ N
     modelValue: { default: null },
     modelModifiers: {}
   }),
-  emits: /* @__PURE__ */ g(["click"], ["update:open", "update:modelValue"]),
-  setup(l, { expose: B, emit: x }) {
-    const s = M(l, "open"), i = M(l, "modelValue"), R = x, T = m("inputRef"), n = r(""), y = r(0), f = r(!1), h = r(null), a = r([]), z = m("dropdownRef"), k = m("hiddenSpan"), W = () => {
-      n.value = "", i.value = null;
+  emits: /* @__PURE__ */ M(["click", "update:inputValue", "keydown"], ["update:open", "update:modelValue"]),
+  setup(l, { expose: x, emit: R }) {
+    const u = V(l, "open"), i = V(l, "modelValue"), f = R, T = C("inputRef"), o = r(""), w = r(0), k = r(!1), h = r(null), a = r([]), z = C("dropdownRef"), m = C("hiddenSpan"), W = () => {
+      o.value = "", i.value = null;
     }, I = async (t) => {
-      if (!t) {
-        a.value = [], s.value = !1;
+      if (f("update:inputValue", t), !t) {
+        a.value = [], u.value = !1;
         return;
       }
-      a.value = await h.value?.(t) || [], f.value = !0, s.value = !!a.value.length;
-    }, w = (t = -1) => {
+      a.value = await h.value?.(t) || [], k.value = !0, u.value = !!a.value.length;
+    }, S = (t = -1) => {
       const e = a.value[t];
-      !e || e.id === i.value?.id || (l.onOptionSelectedCb?.(e), n.value = e.label, s.value = !1, i.value = e, a.value = []);
+      !e || e.id === i.value?.id || (l.onOptionSelectedCb?.(e), o.value = e.label, u.value = !1, i.value = e, a.value = []);
     }, E = () => {
       T.value?.select();
     };
-    return O(() => {
+    return N(() => {
       h.value = Q({ delay: 300 }, l.onInputChangeCb);
-    }), C(n, () => {
-      U(() => {
-        k.value && (y.value = k.value.offsetWidth);
+    }), b(o, () => {
+      O(() => {
+        m.value && (w.value = m.value.offsetWidth);
       });
-    }), C(
+    }), b(
       () => z.value?.selectedIdx,
       (t) => {
         const e = t ?? -1;
-        e !== -1 && w(e);
+        e !== -1 && S(e);
       }
-    ), C(
+    ), b(
       i,
       (t, e) => {
-        t === e || t?.label === n.value || (n.value = t?.label || "");
+        t === e || t?.label === o.value || (o.value = t?.label || "");
       },
       { immediate: !0 }
-    ), B({
+    ), x({
       select: E
     }), (t, e) => (p(), $(G, {
       ref: "dropdownRef",
@@ -64,14 +64,14 @@ const Y = ["readonly", "placeholder"], Z = ["innerHTML"], oe = /* @__PURE__ */ N
       "data-cy": l.dataCy,
       "dropdown-element": "ul",
       "dropdown-classes": ["uikit-z-30", l.dropdownClasses],
-      "open-dropdown": s.value,
+      "open-dropdown": u.value,
       "keep-state": !a.value.length || l.keepState === "closed" ? "closed" : "opened",
-      "reset-keyboard-controller": f.value,
-      "onUpdate:resetKeyboardController": e[1] || (e[1] = (o) => f.value = o),
-      "onUpdate:dropdownState": e[2] || (e[2] = (o) => s.value = o),
-      onClick: e[3] || (e[3] = (o) => R("click"))
+      "reset-keyboard-controller": k.value,
+      "onUpdate:resetKeyboardController": e[2] || (e[2] = (n) => k.value = n),
+      "onUpdate:dropdownState": e[3] || (e[3] = (n) => u.value = n),
+      onClick: e[4] || (e[4] = (n) => f("click"))
     }, {
-      btn_slot: b(() => [
+      btn_slot: y(() => [
         d("div", {
           class: v(["uikit-text-16", l.triggerWrapperClasses])
         }, [
@@ -79,10 +79,10 @@ const Y = ["readonly", "placeholder"], Z = ["innerHTML"], oe = /* @__PURE__ */ N
           d("div", {
             class: v(["uikit-relative", l.inputWrapperClasses])
           }, [
-            K(d("input", {
+            H(d("input", {
               ref: "inputRef",
               "onUpdate:modelValue": [
-                e[0] || (e[0] = (o) => n.value = o),
+                e[0] || (e[0] = (n) => o.value = n),
                 I
               ],
               readonly: !!i.value?.label,
@@ -91,52 +91,53 @@ const Y = ["readonly", "placeholder"], Z = ["innerHTML"], oe = /* @__PURE__ */ N
                 font: "inherit",
                 fontSize: "inherit"
               },
-              placeholder: l.placeholder
-            }, null, 10, Y), [
-              [P, n.value]
+              placeholder: l.placeholder,
+              onKeydown: e[1] || (e[1] = (n) => f("keydown", n))
+            }, null, 42, Y), [
+              [P, o.value]
             ]),
             d("span", {
               ref_key: "hiddenSpan",
-              ref: k,
+              ref: m,
               class: "uikit-invisible uikit-absolute uikit-left-0 uikit-top-0 uikit-whitespace-pre",
               style: {
                 font: "inherit",
                 fontSize: "inherit"
               }
-            }, X(n.value), 513),
-            i.value?.label ? (p(), V("button", {
+            }, X(o.value), 513),
+            i.value?.label ? (p(), B("button", {
               key: 0,
               type: "button",
               class: v(["uikit-clear-btn uikit-absolute uikit-top-1/2 -uikit-translate-y-1/2 uikit-appearance-none", l.clearButtonClasses]),
               "aria-label": "Clear input",
               style: j({
-                left: `${y.value + 16}px`
+                left: `${w.value + 16}px`
               }),
               onClick: W
             }, [
               c(t.$slots, "clear-icon", {}, () => [
-                e[4] || (e[4] = q("X", -1))
+                e[5] || (e[5] = q("X", -1))
               ])
             ], 6)) : A("", !0)
           ], 2),
           c(t.$slots, "right-icon")
         ], 2)
       ]),
-      default: b(({ activeIdx: o, setActiveIdx: F }) => [
-        (p(!0), V(D, null, H(a.value, (S, u) => (p(), $(J, {
-          key: u,
-          active: o === u,
+      default: y(({ activeIdx: n, setActiveIdx: F }) => [
+        (p(!0), B(U, null, D(a.value, (g, s) => (p(), $(J, {
+          key: s,
+          active: n === s,
           class: "uikit-m-1 uikit-rounded-[5px] uikit-px-5 uikit-py-10px hover:uikit-cursor-pointer",
-          onClick: (L) => w(u),
-          onMouseover: (L) => F(u)
+          onClick: (K) => S(s),
+          onMouseover: (K) => F(s)
         }, {
-          default: b(() => [
+          default: y(() => [
             c(t.$slots, "option-content", {
-              option: S,
-              idx: u
+              option: g,
+              idx: s
             }, () => [
               d("span", {
-                innerHTML: S.label
+                innerHTML: g.label
               }, null, 8, Z)
             ])
           ]),

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

@@ -1,7 +1,7 @@
-import { defineComponent as T, ref as n, useTemplateRef as z, onUnmounted as H, watch as I, createBlock as O, openBlock as r, Teleport as $, createElementVNode as l, normalizeClass as s, withModifiers as y, createElementBlock as h, createCommentVNode as w, renderSlot as d, createVNode as D, unref as K, nextTick as N } from "vue";
+import { defineComponent as I, ref as n, useTemplateRef as T, onUnmounted as z, watch as H, createBlock as O, openBlock as r, Teleport as $, createElementVNode as l, normalizeClass as s, withModifiers as y, createElementBlock as h, createCommentVNode as w, renderSlot as d, createVNode as D, unref as K, nextTick as N } from "vue";
 import { isWindows as C, awaitableSetTimeout as S } from "@wikicasa-dev/utilities";
 import { CloseIcon as V } from "@wikicasa-dev/svg-icons";
-const F = ["id", "data-cy"], U = ["innerHTML"], R = /* @__PURE__ */ T({
+const F = ["id", "data-cy"], U = ["innerHTML"], R = /* @__PURE__ */ I({
   __name: "BaseModal",
   props: {
     id: { default: "base-bt-modal" },
@@ -11,6 +11,7 @@ const F = ["id", "data-cy"], U = ["innerHTML"], R = /* @__PURE__ */ T({
     customModalHeaderClasses: {},
     customModalBodyClasses: {},
     customModalFooterClasses: {},
+    closeIcon: {},
     withCloseIcon: { type: Boolean, default: !0 },
     showModal: { type: Boolean, default: !0 },
     headerTitle: { default: "" },
@@ -24,7 +25,7 @@ const F = ["id", "data-cy"], U = ["innerHTML"], R = /* @__PURE__ */ T({
   },
   emits: ["closed", "opened", "dialogClick"],
   setup(e, { emit: g }) {
-    const c = g, i = n(!1), m = n(null), a = z("modalDialog"), k = n(!1), u = n(!1), f = ({ key: t }) => {
+    const c = g, i = n(!1), m = n(null), a = T("modalDialog"), k = n(!1), u = n(!1), f = ({ key: t }) => {
       t === "Escape" && o();
     }, x = () => {
       document?.body.addEventListener("keydown", f);
@@ -53,9 +54,9 @@ const F = ["id", "data-cy"], U = ["innerHTML"], R = /* @__PURE__ */ T({
         m.value?.classList.add("uikit-hidden"), c("closed");
       }, 250);
     };
-    return H(() => {
+    return z(() => {
       b(), document?.documentElement.classList.remove("uikit-no-scrolling"), C() ? document?.body.classList.remove("uikit-no-scrolling", "sm:uikit-pr-15px") : document?.body.classList.remove("uikit-no-scrolling");
-    }), I(
+    }), H(
       () => e.showModal,
       async (t) => {
         !t && !i.value ? k.value = !0 : k.value = !1, t && !i.value && await p(), !t && i.value && await o(), i.value = t;
@@ -102,16 +103,16 @@ const F = ["id", "data-cy"], U = ["innerHTML"], R = /* @__PURE__ */ T({
               key: 0,
               id: "close-icon-btn",
               "data-cy": "bbt-default-close-icon-btn",
-              class: s(["uikit-absolute uikit-right-15px uikit-top-15px uikit-z-10 uikit-bg-transparent", e.closeIconBtnClasses]),
+              class: s(["uikit-absolute uikit-right-15px uikit-top-15px uikit-z-10 uikit-bg-transparent uikit-p-5px", e.closeIconBtnClasses]),
               type: "button",
               "aria-label": "Close",
               onClick: y(o, ["prevent", "stop"])
             }, [
               D(K(V), {
-                class: "bbt-close-icon uikit-box-border uikit-p-5px",
-                width: 30,
-                height: 30
-              })
+                class: s(["bbt-close-icon uikit-box-border", e.closeIcon?.classes]),
+                width: e.closeIcon?.size || 30,
+                height: e.closeIcon?.size || 30
+              }, null, 8, ["class", "width", "height"])
             ], 2)) : w("", !0),
             d(t.$slots, "header", { closeModal: o }, () => [
               l("span", {

package/package.json

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