@wikicasa-dev/components 2.2.9-alpha.48 → 2.2.9-alpha.49

package/dist/Swiper/autoplay.js

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

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

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

package/package.json

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