@wikicasa-dev/components 1.2.47 → 1.2.48

package/dist/AccessibleSelect.js

@@ -1,4 +1,4 @@
-import { _ as f } from "./chunks/AccessibleSelect.vue_vue_type_script_setup_true_lang.CJSkDBar.js";
+import { _ as f } from "./chunks/AccessibleSelect.vue_vue_type_script_setup_true_lang.lyHlWiC5.js";
 export {
   f as default
 };

package/dist/BaseAutocomplete.js

@@ -1,4 +1,4 @@
-import { _ as f } from "./chunks/BaseAutocomplete.vue_vue_type_script_setup_true_lang.DkNApxB4.js";
+import { _ as f } from "./chunks/BaseAutocomplete.vue_vue_type_script_setup_true_lang.Ct4_y9HP.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.D9uxpIpT.js";
+import { _ as f } from "./chunks/BaseDropDown.vue_vue_type_script_setup_true_lang.C4VH7V0e.js";
 export {
   f as default
 };

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

@@ -96,6 +96,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     }): any;
     default?(_: {
         isOpen: boolean;
+        toggleDropdown: () => void;
     }): any;
 }>;
 export default _default;

package/dist/chunks/AccessibleSelect.vue_vue_type_script_setup_true_lang.lyHlWiC5.js

@@ -0,0 +1,239 @@
+import { h as V, ref as L, onMounted as E, onUnmounted as T, unref as v, defineComponent as C, computed as F, watch as A, openBlock as u, createElementBlock as d, Fragment as H, createElementVNode as l, normalizeClass as n, createCommentVNode as m, renderSlot as B, withModifiers as w, createBlock as D, createVNode as P, renderList as q } from "vue";
+import { d as z } from "./ArrowIcon.CklBXJPN.js";
+import { o as N } from "./DefaultValues-k7iQWtC2.CPFgoBrE.js";
+const S = (o, { attrs: s }) => {
+  o = { ...N(), ...o };
+  const { width: a, height: i } = o;
+  return V(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 11.175 13.409",
+      width: `${a}`,
+      height: `${i}`,
+      class: o.class ?? "",
+      "aria-hidden": s["aria-hidden"] ?? "true",
+      fill: "none",
+      stroke: s["stroke-color"] ?? "#FA4F64"
+    },
+    [
+      V("circle", {
+        cx: 6,
+        cy: 6,
+        r: 4.5
+      }),
+      V("path", {
+        "stroke-linejoin": "round",
+        d: "M5.8 3.6h.4L6 6.5z"
+      }),
+      V("circle", {
+        cx: 6,
+        cy: 8.2,
+        r: 0.6,
+        fill: s["stroke-color"] ?? "#FA4F64",
+        stroke: "none"
+      })
+    ]
+  );
+}, U = (o) => {
+  const { isDropdownOpen: s, disableSpaceHandler: a } = o, i = L(-1), f = L(-1), $ = (t) => {
+    const k = "ArrowUp", g = "ArrowDown", b = "Enter", h = "Escape", e = " ", p = "PageUp", r = "Home", c = "PageDown", y = "End";
+    if (!s.value || ![
+      k,
+      g,
+      b,
+      h,
+      e,
+      p,
+      r,
+      c,
+      y
+    ].includes(t.key))
+      return;
+    const M = v(o.optionsLength);
+    if (t.key === k)
+      i.value = i.value === 0 ? M - 1 : i.value - 1;
+    else if (t.key === g)
+      i.value = (i.value + 1) % M;
+    else if (t.key === b || t.key === e) {
+      if (t.key === e && a)
+        return;
+      f.value = i.value, s.value = !1;
+    } else
+      t.key === h ? (i.value = f.value, s.value = !1) : t.key === p || t.key === r ? i.value = 0 : (t.key === c || t.key === y) && (i.value = M - 1);
+    t.stopPropagation(), t.preventDefault();
+  };
+  return E(() => {
+    document && document.addEventListener("keydown", $);
+  }), T(() => {
+    document && document.removeEventListener("keydown", $);
+  }), {
+    activeIdx: i,
+    selectedIdx: f
+  };
+}, j = ["id", "innerHTML"], I = ["id", "data-cy", "aria-required", "aria-controls", "aria-labelledby", "aria-expanded", "aria-activedescendant", "aria-invalid", "aria-describedby"], O = ["innerHTML"], Y = { class: "uikit-inline-flex" }, G = ["innerHTML"], J = ["data-cy"], K = ["id", "aria-selected", "onClick", "onMouseover"], Q = { class: "uikit-inline-block uikit-cursor-pointer uikit-text-sm" }, R = ["name", "checked", "onInput"], W = ["innerHTML"], X = ["id", "arial-live", "innerHTML"], Z = ["id", "arial-live", "innerHTML"], ie = /* @__PURE__ */ C({
+  inheritAttrs: !1,
+  __name: "AccessibleSelect",
+  props: {
+    label: { default: "" },
+    dropdownPosition: { default: "bottom" },
+    namespace: {},
+    options: {},
+    modelValue: { default: () => ({
+      id: "",
+      label: ""
+    }) },
+    isValid: { type: [Boolean, null], default: null },
+    feedback: {}
+  },
+  emits: ["update:modelValue"],
+  setup(o, { emit: s }) {
+    const a = o, i = L(!1), f = L(null), $ = F(() => !!a.modelValue.label), t = s, { activeIdx: k, selectedIdx: g } = U({
+      optionsLength: a.options.length,
+      isDropdownOpen: i
+    }), b = (e) => {
+      i.value = !1, t("update:modelValue", e);
+    };
+    A(g, (e) => {
+      b(a.options[e]), i.value = !1;
+    });
+    const h = () => {
+      i.value = !1;
+    };
+    return E(() => {
+      document && document.addEventListener("click", h);
+    }), T(() => {
+      document && document.removeEventListener("click", h);
+    }), (e, p) => (u(), d(H, null, [
+      l("div", {
+        class: n(["uikit-relative uikit-flex uikit-items-center", [e.label ? "uikit-h-[52px]" : "uikit-h-[42px]", e.$attrs.class]])
+      }, [
+        e.label ? (u(), d("label", {
+          key: 0,
+          id: `${e.namespace}_label`,
+          class: n(["uikit-absolute uikit-text-sm uikit-font-medium uikit-transition-all uikit-ease-in-out", [
+            $.value ? "as-floating -uikit-top-1 uikit-left-[22px] uikit-text-w-black" : "as-inline uikit-left-4 uikit-top-4 uikit-text-w-gray",
+            e.$attrs["label-classes"]
+          ]]),
+          innerHTML: e.label
+        }, null, 10, j)) : m("", !0),
+        B(e.$slots, "lefticon"),
+        l("button", {
+          id: `${e.namespace}_btn`,
+          ref_key: "btnEl",
+          ref: f,
+          type: "button",
+          "data-cy": e.$attrs["data-cy"],
+          class: n(["uikit-peer uikit-flex uikit-h-full uikit-w-full uikit-items-center uikit-justify-between uikit-truncate uikit-border-0 uikit-bg-white uikit-px-4 uikit-text-left focus-visible:uikit-outline-0", e.$attrs["btn-classes"]]),
+          "aria-required": !!e.$attrs.required,
+          role: "combobox",
+          "aria-haspopup": "listbox",
+          "aria-controls": `${e.namespace}_dropdown`,
+          "aria-labelledby": `${e.namespace}_label ${e.namespace}_btn`,
+          "aria-expanded": i.value,
+          "aria-activedescendant": v(k) >= 0 && i.value ? `${e.namespace}_element_${e.options[v(k)].label}` : "",
+          "aria-invalid": a.isValid === !1,
+          "aria-describedby": a.isValid === !1 ? `${e.namespace}_invalid_msg` : void 0,
+          onClick: p[0] || (p[0] = w((r) => i.value = !i.value, ["stop"]))
+        }, [
+          l("span", {
+            class: n(e.$attrs["btn-text-classes"]),
+            innerHTML: e.modelValue.visibleLabel || e.modelValue.label
+          }, null, 10, O),
+          l("span", Y, [
+            a.isValid == !1 ? (u(), D(v(S), {
+              key: 0,
+              class: "uikit-mr-1",
+              width: 20,
+              height: 20
+            })) : m("", !0),
+            P(v(z), {
+              class: n(["uikit-transition-transform motion-reduce:uikit-transition-none", i.value && "uikit-rotate-180"]),
+              width: 18,
+              height: 18,
+              "stroke-color": e.isValid ? "#2B5DFF" : e.isValid === !1 ? "#FA4F64" : "#222"
+            }, null, 8, ["class", "stroke-color"])
+          ])
+        ], 10, I),
+        l("fieldset", {
+          "aria-hidden": "true",
+          class: n(["uikit-pointer-events-none uikit-absolute -uikit-top-[1px] uikit-bottom-0 uikit-left-0 uikit-right-0 uikit-box-border uikit-cursor-pointer uikit-rounded-xs uikit-border uikit-border-solid uikit-px-2 peer-focus:uikit-border-2 peer-focus:uikit-border-w-primary peer-focus-visible:uikit-border-2 peer-focus-visible:uikit-border-w-primary peer-aria-invalid:uikit-border-w-danger", [
+            e.label ? "uikit-h-12" : "uikit-h-[42px]",
+            e.$attrs["fieldset-classes"],
+            e.isValid ? "uikit-border-w-primary" : e.isValid === !1 ? "uikit-border-w-danger" : "uikit-border-w-secondary"
+          ]])
+        }, [
+          e.label ? (u(), d("legend", {
+            key: 0,
+            class: n([e.$attrs["legend-classes"], "uikit-ml-2 uikit-h-3 uikit-px-0"])
+          }, [
+            l("span", {
+              class: n(["uikit-mx-5px", e.modelValue.label ? "uikit-invisible" : "uikit-hidden"]),
+              innerHTML: e.label
+            }, null, 10, G)
+          ], 2)) : m("", !0)
+        ], 2),
+        l("ul", {
+          "data-cy": e.$attrs["data-cy"] && `${e.$attrs["data-cy"]}_dropdown`,
+          role: "listbox",
+          tabindex: -1,
+          "aria-multiselectable": !1,
+          class: n(["uikit-absolute uikit-z-10 uikit-m-0 uikit-max-h-[225px] uikit-w-full uikit-min-w-full uikit-list-none uikit-overflow-y-auto uikit-p-0 uikit-no-scrollbar", [
+            { "uikit-h-0 uikit-w-0 uikit-overflow-hidden": !i.value },
+            {
+              "uikit-rounded-xs uikit-border uikit-border-solid uikit-border-w-secondary uikit-bg-white": i.value
+            },
+            { "uikit-bottom-[55px]": e.dropdownPosition === "top" },
+            { "uikit-top-[55px]": e.dropdownPosition === "bottom" },
+            e.$attrs["dropdown-classes"]
+          ]]),
+          onClick: p[1] || (p[1] = w(() => {
+          }, ["stop"]))
+        }, [
+          (u(!0), d(H, null, q(e.options, (r, c) => (u(), d("li", {
+            id: `${e.namespace}_element_${e.options[c].label}`,
+            key: `${r.label}_${c}`,
+            role: "option",
+            "aria-selected": v(k) === c,
+            class: n(["uikit-m-1 uikit-cursor-pointer uikit-px-20px uikit-py-10px uikit-text aria-selected:uikit-rounded-xs aria-selected:uikit-bg-w-cultured", e.$attrs["dropdown-item-classes"]]),
+            onClick: w((y) => b(r), ["stop"]),
+            onMouseover: w((y) => k.value = c, ["stop"])
+          }, [
+            l("label", Q, [
+              l("input", {
+                tabindex: "-1",
+                class: "uikit-appearance-none",
+                name: `${e.namespace}_radio`,
+                type: "radio",
+                checked: r.label === e.modelValue.label,
+                onInput: w((y) => b(r), ["stop"])
+              }, null, 40, R),
+              l("span", {
+                innerHTML: r.label
+              }, null, 8, W)
+            ])
+          ], 42, K))), 128))
+        ], 10, J)
+      ], 2),
+      e.feedback ? (u(), d(H, { key: 0 }, [
+        e.feedback.valid ? (u(), d("span", {
+          key: 0,
+          id: `${e.namespace}_valid_msg`,
+          "arial-live": e.$attrs["aria-live"],
+          class: "uikit-mb-2 uikit-text-sm",
+          innerHTML: e.isValid ? e.feedback.valid : ""
+        }, null, 8, X)) : m("", !0),
+        e.feedback.invalid ? (u(), d("span", {
+          key: 1,
+          id: `${e.namespace}_invalid_msg`,
+          "arial-live": e.$attrs["aria-live"],
+          class: "uikit-mb-2 uikit-text-sm uikit-text-w-danger",
+          innerHTML: e.isValid === !1 ? e.feedback.invalid : ""
+        }, null, 8, Z)) : m("", !0)
+      ], 64)) : m("", !0)
+    ], 64));
+  }
+});
+export {
+  ie as _
+};

package/dist/chunks/{BaseAutocomplete.vue_vue_type_script_setup_true_lang.DkNApxB4.js → BaseAutocomplete.vue_vue_type_script_setup_true_lang.Ct4_y9HP.js}

@@ -1,6 +1,6 @@
 import { defineComponent as z, mergeModels as V, useModel as E, ref as s, computed as f, onBeforeMount as N, watch as C, openBlock as g, createBlock as S, normalizeClass as U, withCtx as b, createVNode as A, renderSlot as B, createElementBlock as F, Fragment as K, renderList as P, unref as W, createElementVNode as j } from "vue";
 import q from "../BaseInput.js";
-import { _ as G } from "./BaseDropDown.vue_vue_type_script_setup_true_lang.D9uxpIpT.js";
+import { _ as G } from "./BaseDropDown.vue_vue_type_script_setup_true_lang.C4VH7V0e.js";
 import "./js.cookie.BaTT4o7s.js";
 import { _ as J } from "./SelectItem.vue_vue_type_script_setup_true_lang.BOLdDTLM.js";
 import { useKeyboardController as Q } from "../useKeyboardController.js";

package/dist/chunks/{BaseDropDown.vue_vue_type_script_setup_true_lang.D9uxpIpT.js → BaseDropDown.vue_vue_type_script_setup_true_lang.C4VH7V0e.js}

@@ -1,4 +1,4 @@
-import { defineComponent as w, ref as b, watch as r, onBeforeMount as h, onUnmounted as v, openBlock as n, createElementBlock as C, normalizeClass as i, withModifiers as u, renderSlot as c, createVNode as y, withCtx as p, createElementVNode as $, createBlock as k, unref as B, createCommentVNode as g, resolveDynamicComponent as D } from "vue";
+import { defineComponent as w, ref as b, watch as r, onBeforeMount as h, onUnmounted as v, openBlock as l, createElementBlock as C, normalizeClass as i, withModifiers as u, renderSlot as c, createVNode as y, withCtx as p, createElementVNode as g, createBlock as k, unref as $, createCommentVNode as B, resolveDynamicComponent as D } from "vue";
 import { _ as E } from "./BaseButton.vue_vue_type_script_setup_true_lang.BrJbAMJ8.js";
 import { d as L } from "./ArrowIcon.CklBXJPN.js";
 const S = ["innerHTML"], M = /* @__PURE__ */ w({
@@ -24,7 +24,7 @@ const S = ["innerHTML"], M = /* @__PURE__ */ w({
   },
   emits: ["click", "update:dropdownState"],
   setup(f, { emit: m }) {
-    const o = f, l = m, t = b(!1);
+    const o = f, s = m, t = b(!1);
     r(
       () => o.openDropdown,
       (e) => {
@@ -34,25 +34,25 @@ const S = ["innerHTML"], M = /* @__PURE__ */ w({
         immediate: !0
       }
     ), r(t, (e) => {
-      l("update:dropdownState", e);
+      s("update:dropdownState", e);
     });
-    const s = () => {
+    const d = () => {
       t.value = !1;
-    }, d = () => {
+    }, n = () => {
       o.keepState === "closed" && !t.value || o.keepState === "opened" && t.value || (t.value = !t.value);
     };
     return h(() => {
-      o.closeWhenClickedOutside && document && document.body.addEventListener("click", s);
+      o.closeWhenClickedOutside && document && document.body.addEventListener("click", d);
     }), v(() => {
-      o.closeWhenClickedOutside && document && document.body.removeEventListener("click", s);
-    }), (e, a) => (n(), C("div", {
+      o.closeWhenClickedOutside && document && document.body.removeEventListener("click", d);
+    }), (e, a) => (l(), C("div", {
       class: i(["uikit-relative uikit-block", e.$attrs.class]),
       onClick: a[1] || (a[1] = u((W) => {
-        l("click"), d();
+        s("click"), n();
       }, ["stop"]))
     }, [
       c(e.$slots, "btn_slot", {
-        toggleDropdown: d,
+        toggleDropdown: n,
         isOpen: t.value
       }, () => [
         y(E, {
@@ -69,22 +69,22 @@ const S = ["innerHTML"], M = /* @__PURE__ */ w({
           "icon-name": e.iconName
         }, {
           default: p(() => [
-            $("span", {
+            g("span", {
               class: i(["uikit-mr-5px", e.labelClasses]),
               innerHTML: e.btnLabel
             }, null, 10, S),
-            e.withArrowIcon ? (n(), k(B(L), {
+            e.withArrowIcon ? (l(), k($(L), {
               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.$attrs["arrow-stroke-color"]
-            }, null, 8, ["class", "width", "height", "stroke-color"])) : g("", !0)
+            }, null, 8, ["class", "width", "height", "stroke-color"])) : B("", !0)
           ]),
           _: 1
         }, 8, ["id", "data-cy", "class", "aria-expanded", "icon-class", "icon-name"])
       ]),
-      (n(), k(D(e.dropdownElement), {
+      (l(), k(D(e.dropdownElement), {
         id: "dropdown_" + e.id,
         ref: "dropdown",
         "data-cy": e.$attrs["data-cy"] && `${e.$attrs["data-cy"]}_dropdown`,
@@ -99,7 +99,10 @@ const S = ["innerHTML"], M = /* @__PURE__ */ w({
         }, ["stop"]))
       }, {
         default: p(() => [
-          c(e.$slots, "default", { isOpen: t.value })
+          c(e.$slots, "default", {
+            isOpen: t.value,
+            toggleDropdown: n
+          })
         ]),
         _: 3
       }, 8, ["id", "data-cy", "class"]))

package/dist/index.js

@@ -8,14 +8,14 @@ import { default as B } from "./CheckboxBtn.js";
 import { _ as n } from "./chunks/CheckboxGroup.vue_vue_type_script_setup_true_lang.C5jcwwv6.js";
 import { default as c } from "./RadioButton.js";
 import { default as b } from "./RadioGroup.js";
-import { _ as A } from "./chunks/AccessibleSelect.vue_vue_type_script_setup_true_lang.CJSkDBar.js";
+import { _ as A } from "./chunks/AccessibleSelect.vue_vue_type_script_setup_true_lang.lyHlWiC5.js";
 import { _ as C } from "./chunks/BaseAlert.vue_vue_type_script_setup_true_lang.HqYdk4yE.js";
-import { _ as T } from "./chunks/BaseAutocomplete.vue_vue_type_script_setup_true_lang.DkNApxB4.js";
+import { _ as T } from "./chunks/BaseAutocomplete.vue_vue_type_script_setup_true_lang.Ct4_y9HP.js";
 import { _ as w } from "./chunks/BaseBadge.vue_vue_type_style_index_0_lang.BOA1gBKu.js";
 import { _ as k } from "./chunks/BaseButton.vue_vue_type_script_setup_true_lang.BrJbAMJ8.js";
 import { _ as F } from "./chunks/BaseCard.vue_vue_type_style_index_0_lang.w5aEohzG.js";
 import { default as O } from "./BaseComplexToggle.js";
-import { _ as R } from "./chunks/BaseDropDown.vue_vue_type_script_setup_true_lang.D9uxpIpT.js";
+import { _ as R } from "./chunks/BaseDropDown.vue_vue_type_script_setup_true_lang.C4VH7V0e.js";
 import { default as M } from "./BaseFloatingLabel.js";
 import { default as U } from "./BaseIcon.js";
 import { default as j } from "./BaseInput.js";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wikicasa-dev/components",
-  "version": "1.2.47",
+  "version": "1.2.48",
   "description": "Wikicasa frontend components",
   "type": "module",
   "main": "./dist/index.js",
@@ -54,6 +54,7 @@
     "@wikicasa-dev/types": "^0.9.2",
     "@wikicasa-dev/utilities": "^0.2.1",
     "@wikicasa-dev/svg-icons": "^0.0.1",
+    "@wikicasa-dev/vue-composables": "^0.0.3",
     "autoprefixer": "^10.4.15",
     "chromatic": "^11.2.0",
     "eslint": "^8.57.0",

package/dist/chunks/AccessibleSelect.vue_vue_type_script_setup_true_lang.CJSkDBar.js

@@ -1,204 +0,0 @@
-import { h as f, defineComponent as H, ref as y, computed as T, watch as C, onMounted as F, onUnmounted as B, openBlock as l, createElementBlock as o, Fragment as v, createElementVNode as t, normalizeClass as a, createCommentVNode as u, renderSlot as E, unref as k, withModifiers as p, createBlock as A, createVNode as q, renderList as z } from "vue";
-import { useKeyboardController as N } from "../useKeyboardController.js";
-import { d as P } from "./ArrowIcon.CklBXJPN.js";
-import { o as j } from "./DefaultValues-k7iQWtC2.CPFgoBrE.js";
-const D = (n, { attrs: d }) => {
-  n = { ...j(), ...n };
-  const { width: s, height: e } = n;
-  return f(
-    "svg",
-    {
-      xmlns: "http://www.w3.org/2000/svg",
-      viewBox: "0 0 11.175 13.409",
-      width: `${s}`,
-      height: `${e}`,
-      class: n.class ?? "",
-      "aria-hidden": d["aria-hidden"] ?? "true",
-      fill: "none",
-      stroke: d["stroke-color"] ?? "#FA4F64"
-    },
-    [
-      f("circle", {
-        cx: 6,
-        cy: 6,
-        r: 4.5
-      }),
-      f("path", {
-        "stroke-linejoin": "round",
-        d: "M5.8 3.6h.4L6 6.5z"
-      }),
-      f("circle", {
-        cx: 6,
-        cy: 8.2,
-        r: 0.6,
-        fill: d["stroke-color"] ?? "#FA4F64",
-        stroke: "none"
-      })
-    ]
-  );
-}, S = ["id", "innerHTML"], K = ["id", "data-cy", "aria-required", "aria-controls", "aria-labelledby", "aria-expanded", "aria-activedescendant", "aria-invalid", "aria-describedby"], O = ["innerHTML"], U = { class: "uikit-inline-flex" }, G = ["innerHTML"], I = ["data-cy"], J = ["id", "aria-selected", "onClick", "onMouseover"], Q = { class: "uikit-inline-block uikit-cursor-pointer uikit-text-sm" }, R = ["name", "checked", "onInput"], W = ["innerHTML"], X = ["id", "arial-live", "innerHTML"], Y = ["id", "arial-live", "innerHTML"], ei = /* @__PURE__ */ H({
-  inheritAttrs: !1,
-  __name: "AccessibleSelect",
-  props: {
-    label: { default: "" },
-    dropdownPosition: { default: "bottom" },
-    namespace: {},
-    options: {},
-    modelValue: { default: () => ({
-      id: "",
-      label: ""
-    }) },
-    isValid: { type: [Boolean, null], default: null },
-    feedback: {}
-  },
-  emits: ["update:modelValue"],
-  setup(n, { emit: d }) {
-    const s = n, e = y(!1), g = y(null), V = T(() => !!s.modelValue.label), L = d, { activeIdx: c, selectedIdx: M } = N({
-      optionsLength: s.options.length,
-      isDropdownOpen: e
-    }), h = (i) => {
-      e.value = !1, L("update:modelValue", i);
-    };
-    C(M, (i) => {
-      h(s.options[i]), e.value = !1;
-    });
-    const w = () => {
-      e.value = !1;
-    };
-    return F(() => {
-      document && document.addEventListener("click", w);
-    }), B(() => {
-      document && document.removeEventListener("click", w);
-    }), (i, b) => (l(), o(v, null, [
-      t("div", {
-        class: a(["uikit-relative uikit-flex uikit-items-center", [i.label ? "uikit-h-[52px]" : "uikit-h-[42px]", i.$attrs.class]])
-      }, [
-        i.label ? (l(), o("label", {
-          key: 0,
-          id: `${i.namespace}_label`,
-          class: a(["uikit-absolute uikit-text-sm uikit-font-medium uikit-transition-all uikit-ease-in-out", [
-            V.value ? "as-floating -uikit-top-1 uikit-left-[22px] uikit-text-w-black" : "as-inline uikit-left-4 uikit-top-4 uikit-text-w-gray",
-            i.$attrs["label-classes"]
-          ]]),
-          innerHTML: i.label
-        }, null, 10, S)) : u("", !0),
-        E(i.$slots, "lefticon"),
-        t("button", {
-          id: `${i.namespace}_btn`,
-          ref_key: "btnEl",
-          ref: g,
-          type: "button",
-          "data-cy": i.$attrs["data-cy"],
-          class: a(["uikit-peer uikit-flex uikit-h-full uikit-w-full uikit-items-center uikit-justify-between uikit-truncate uikit-border-0 uikit-bg-white uikit-px-4 uikit-text-left focus-visible:uikit-outline-0", i.$attrs["btn-classes"]]),
-          "aria-required": !!i.$attrs.required,
-          role: "combobox",
-          "aria-haspopup": "listbox",
-          "aria-controls": `${i.namespace}_dropdown`,
-          "aria-labelledby": `${i.namespace}_label ${i.namespace}_btn`,
-          "aria-expanded": e.value,
-          "aria-activedescendant": k(c) >= 0 && e.value ? `${i.namespace}_element_${i.options[k(c)].label}` : "",
-          "aria-invalid": s.isValid === !1,
-          "aria-describedby": s.isValid === !1 ? `${i.namespace}_invalid_msg` : void 0,
-          onClick: b[0] || (b[0] = p((r) => e.value = !e.value, ["stop"]))
-        }, [
-          t("span", {
-            class: a(i.$attrs["btn-text-classes"]),
-            innerHTML: i.modelValue.visibleLabel || i.modelValue.label
-          }, null, 10, O),
-          t("span", U, [
-            s.isValid == !1 ? (l(), A(k(D), {
-              key: 0,
-              class: "uikit-mr-1",
-              width: 20,
-              height: 20
-            })) : u("", !0),
-            q(k(P), {
-              class: a(["uikit-transition-transform motion-reduce:uikit-transition-none", e.value && "uikit-rotate-180"]),
-              width: 18,
-              height: 18,
-              "stroke-color": i.isValid ? "#2B5DFF" : i.isValid === !1 ? "#FA4F64" : "#222"
-            }, null, 8, ["class", "stroke-color"])
-          ])
-        ], 10, K),
-        t("fieldset", {
-          "aria-hidden": "true",
-          class: a(["uikit-pointer-events-none uikit-absolute -uikit-top-[1px] uikit-bottom-0 uikit-left-0 uikit-right-0 uikit-box-border uikit-cursor-pointer uikit-rounded-xs uikit-border uikit-border-solid uikit-px-2 peer-focus:uikit-border-2 peer-focus:uikit-border-w-primary peer-focus-visible:uikit-border-2 peer-focus-visible:uikit-border-w-primary peer-aria-invalid:uikit-border-w-danger", [
-            i.label ? "uikit-h-12" : "uikit-h-[42px]",
-            i.$attrs["fieldset-classes"],
-            i.isValid ? "uikit-border-w-primary" : i.isValid === !1 ? "uikit-border-w-danger" : "uikit-border-w-secondary"
-          ]])
-        }, [
-          i.label ? (l(), o("legend", {
-            key: 0,
-            class: a([i.$attrs["legend-classes"], "uikit-ml-2 uikit-h-3 uikit-px-0"])
-          }, [
-            t("span", {
-              class: a(["uikit-mx-5px", i.modelValue.label ? "uikit-invisible" : "uikit-hidden"]),
-              innerHTML: i.label
-            }, null, 10, G)
-          ], 2)) : u("", !0)
-        ], 2),
-        t("ul", {
-          "data-cy": i.$attrs["data-cy"] && `${i.$attrs["data-cy"]}_dropdown`,
-          role: "listbox",
-          tabindex: -1,
-          "aria-multiselectable": !1,
-          class: a(["uikit-absolute uikit-z-10 uikit-m-0 uikit-max-h-[225px] uikit-w-full uikit-min-w-full uikit-list-none uikit-overflow-y-auto uikit-p-0 uikit-no-scrollbar", [
-            { "uikit-h-0 uikit-w-0 uikit-overflow-hidden": !e.value },
-            {
-              "uikit-rounded-xs uikit-border uikit-border-solid uikit-border-w-secondary uikit-bg-white": e.value
-            },
-            { "uikit-bottom-[55px]": i.dropdownPosition === "top" },
-            { "uikit-top-[55px]": i.dropdownPosition === "bottom" },
-            i.$attrs["dropdown-classes"]
-          ]]),
-          onClick: b[1] || (b[1] = p(() => {
-          }, ["stop"]))
-        }, [
-          (l(!0), o(v, null, z(i.options, (r, m) => (l(), o("li", {
-            id: `${i.namespace}_element_${i.options[m].label}`,
-            key: `${r.label}_${m}`,
-            role: "option",
-            "aria-selected": k(c) === m,
-            class: a(["uikit-m-1 uikit-cursor-pointer uikit-px-20px uikit-py-10px uikit-text aria-selected:uikit-rounded-xs aria-selected:uikit-bg-w-cultured", i.$attrs["dropdown-item-classes"]]),
-            onClick: p(($) => h(r), ["stop"]),
-            onMouseover: p(($) => c.value = m, ["stop"])
-          }, [
-            t("label", Q, [
-              t("input", {
-                tabindex: "-1",
-                class: "uikit-appearance-none",
-                name: `${i.namespace}_radio`,
-                type: "radio",
-                checked: r.label === i.modelValue.label,
-                onInput: p(($) => h(r), ["stop"])
-              }, null, 40, R),
-              t("span", {
-                innerHTML: r.label
-              }, null, 8, W)
-            ])
-          ], 42, J))), 128))
-        ], 10, I)
-      ], 2),
-      i.feedback ? (l(), o(v, { key: 0 }, [
-        i.feedback.valid ? (l(), o("span", {
-          key: 0,
-          id: `${i.namespace}_valid_msg`,
-          "arial-live": i.$attrs["aria-live"],
-          class: "uikit-mb-2 uikit-text-sm",
-          innerHTML: i.isValid ? i.feedback.valid : ""
-        }, null, 8, X)) : u("", !0),
-        i.feedback.invalid ? (l(), o("span", {
-          key: 1,
-          id: `${i.namespace}_invalid_msg`,
-          "arial-live": i.$attrs["aria-live"],
-          class: "uikit-mb-2 uikit-text-sm uikit-text-w-danger",
-          innerHTML: i.isValid === !1 ? i.feedback.invalid : ""
-        }, null, 8, Y)) : u("", !0)
-      ], 64)) : u("", !0)
-    ], 64));
-  }
-});
-export {
-  ei as _
-};