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

package/dist/Swiper/autoplay.js

@@ -1,5 +1,5 @@
 import { Autoplay as t } from "swiper/modules";
-import '../assets/swiper-controller.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-controller.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-controller.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-controller.css';/* empty css                                                                         */
+import '../assets/swiper-keyboard.css';/* empty css                                                                         */
 export {
   p as Thumbs
 };

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

@@ -15,7 +15,11 @@ export interface ClearableAutocompleteProps<TID extends string | number | undefi
         offset?: number;
     };
     keepState?: Nullable<"closed" | "open">;
-    disableCb?: boolean;
+    /**
+     * If true, `onInputChangeCb` and `update:input-value` event will be disabled.
+     * The input value will still be updated internally and synced with the model value
+     */
+    disableAutocomplete?: boolean;
     onInputChangeCb: (v: string) => Promise<AccessibleSelectOptions<TPayload, TID>[]>;
     onOptionSelectedCb?: Nullable<(v: AccessibleSelectOptions<TPayload, TID>) => void>;
 }
@@ -25,12 +29,11 @@ declare const _default: <TID extends string | number | undefined, TPayload>(__VL
         readonly onClick?: ((args_0: MouseEvent) => any) | undefined;
         readonly onKeydown?: ((args_0: KeyboardEvent) => any) | undefined;
         readonly "onUpdate:open"?: ((value: boolean) => any) | undefined;
-        readonly "onUpdate:inputValue"?: ((value: string) => any) | undefined;
         readonly onInputClick?: ((args_0: MouseEvent) => any) | undefined;
-    } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, never>, "onUpdate:modelValue" | "onClick" | "onKeydown" | "onUpdate:open" | "onUpdate:inputValue" | "onInputClick"> & ({
+        readonly "onUpdate:input-value"?: ((args_0: string) => any) | undefined;
+    } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, never>, "onUpdate:modelValue" | "onClick" | "onKeydown" | "onUpdate:open" | "onInputClick" | "onUpdate:input-value"> & ({
         open?: boolean;
         modelValue?: Nullable<AccessibleSelectOptions<TPayload, TID>>;
-        inputValue?: string;
     } & ClearableAutocompleteProps<TID, TPayload>) & Partial<{}>> & import('vue').PublicProps;
     expose(exposed: import('vue').ShallowUnwrapRef<{
         getRootElement: () => HTMLDivElement | null | undefined;
@@ -47,7 +50,7 @@ declare const _default: <TID extends string | number | undefined, TPayload>(__VL
             idx: number;
         }): any;
     };
-    emit: (((evt: "click", args_0: MouseEvent) => void) & ((evt: "keydown", args_0: KeyboardEvent) => void) & ((evt: "inputClick", args_0: MouseEvent) => void)) & (((evt: "update:modelValue", value: Nullable<AccessibleSelectOptions<TPayload, TID>>) => void) & ((evt: "update:open", value: boolean) => void) & ((evt: "update:inputValue", value: string) => void));
+    emit: (((evt: "click", args_0: MouseEvent) => void) & ((evt: "keydown", args_0: KeyboardEvent) => void) & ((evt: "inputClick", args_0: MouseEvent) => void) & ((evt: "update:input-value", 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/packages/components/lib/UIKit/Autocomplete/ClearableAutocomplete.vue.js

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

package/package.json

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