@wikicasa-dev/components 2.6.10 → 3.0.0-alpha.0

package/dist/chunks/BaseAccordionItem.vue_vue_type_script_setup_true_lang.BJB5DnDs.js

@@ -0,0 +1,143 @@
+import { defineComponent as h, ref as $, inject as p, watch as l, unref as d, createElementBlock as v, openBlock as u, normalizeClass as m, createBlock as y, createCommentVNode as g, renderSlot as t, createElementVNode as k, withModifiers as O, createVNode as f, withCtx as c } from "vue";
+import { _ as B } from "./BaseAccordionBtn.vue_vue_type_script_setup_true_lang.DEk3SXLJ.js";
+import { _ as A } from "./BaseAccordionContent.vue_vue_type_script_setup_true_lang.Qp_TWYFE.js";
+import { a as E } from "./ArrowIcon.Bq6Xr3uH.js";
+import "./PharmacyIcon.DEQ8mOEJ.js";
+const W = { key: 0 }, I = ["id", "data-cy", "aria-expanded", "aria-controls"], M = ["itemprop", "innerHTML"], P = /* @__PURE__ */ h({
+  inheritAttrs: !1,
+  __name: "BaseAccordionItem",
+  props: {
+    title: {},
+    id: {},
+    active: { type: Boolean, default: !1 },
+    arrowColor: {},
+    arrowWidth: { default: 12 },
+    onContainerClickExpand: { type: Boolean, default: !1 },
+    rootClasses: {},
+    dataCy: {},
+    btnClasses: {},
+    itemProp: {},
+    arrowClasses: {},
+    btnWrapperClasses: {},
+    accordionContentClasses: {},
+    accordionOpenClasses: {},
+    accordionCloseClasses: {},
+    accordionClasses: {}
+  },
+  emits: ["click", "accordionOpened", "accordionClosed", "update:accordionState"],
+  setup(i, { emit: w }) {
+    const a = w, o = $(!1), r = p(
+      "accordionItems",
+      () => {
+      },
+      !0
+    ), b = p(
+      "handleClick",
+      () => {
+      },
+      !0
+    ), C = (e, s = !1) => {
+      a(s ? "accordionOpened" : "accordionClosed", e), a("update:accordionState", s);
+    };
+    r && (r.value[i.id] = { id: i.id, title: i.title, active: i.active }), l(
+      () => d(r),
+      (e) => {
+        const s = e?.[i.id];
+        !s || o.value === s.active || (o.value = s.active ?? !1, C(
+          { id: i.id, title: i.title, active: s.active },
+          s.active
+        ));
+      },
+      { deep: !0, immediate: !0 }
+    ), l(o, (e) => {
+      o.value = e, C({ id: i.id, title: i.title, active: o.value }, e);
+    }), l(
+      () => i.active,
+      (e) => {
+        o.value = e;
+      },
+      { immediate: !0 }
+    );
+    const n = () => {
+      o.value = !o.value;
+    };
+    return (e, s) => (u(), v("div", {
+      class: m(e.rootClasses)
+    }, [
+      !e.$slots.custom_content && !e.$slots.custom_btn && !e.$slots.custom_accordion ? (u(), v("div", W, [
+        k("button", {
+          id: `accordion-title-${e.id}`,
+          type: "button",
+          class: m(["uikit:flex uikit:w-full uikit:items-center uikit:justify-between uikit:border-0 uikit:bg-white uikit:px-5 uikit:py-4 uikit:text-left uikit:font-semibold uikit:transition-colors uikit:max-sm:active:bg-w-cultured uikit:sm:hover:bg-w-cultured", e.btnClasses]),
+          "data-cy": e.dataCy,
+          "aria-expanded": o.value,
+          "aria-controls": `accordion-text-${e.id}`,
+          onClick: s[0] || (s[0] = O((N) => {
+            n(), d(b)?.({ id: e.id, title: e.title, active: o.value }), a("click");
+          }, ["prevent", "stop"]))
+        }, [
+          k("span", {
+            itemprop: e.itemProp,
+            innerHTML: e.title
+          }, null, 8, M),
+          f(d(E), {
+            class: m([
+              "uikit:shrink-0 uikit:transition-transform uikit:motion-reduce:transition-none",
+              [o.value ? "uikit:rotate-180" : "", e.arrowClasses]
+            ]),
+            "arrow-classes": e.arrowClasses,
+            width: e.arrowWidth,
+            height: e.arrowWidth
+          }, null, 8, ["class", "arrow-classes", "width", "height"])
+        ], 10, I)
+      ])) : (e.$slots.custom_content || e.$slots.custom_btn) && !e.$slots.custom_accordion ? (u(), y(B, {
+        key: 1,
+        id: e.id,
+        "btn-wrapper-classes": e.btnWrapperClasses,
+        "btn-classes": e.btnClasses,
+        "arrow-color": e.arrowColor,
+        "arrow-classes": e.arrowClasses,
+        "toggle-accordion": n,
+        "on-container-click-expand": e.onContainerClickExpand,
+        "accordion-open": o.value
+      }, {
+        custom_content: c(() => [
+          t(e.$slots, "custom_content")
+        ]),
+        custom_btn: c(() => [
+          t(e.$slots, "custom_btn", {
+            btnId: `btn-${e.id}`,
+            isOpen: o.value,
+            toggleAccordion: n
+          })
+        ]),
+        _: 3
+      }, 8, ["id", "btn-wrapper-classes", "btn-classes", "arrow-color", "arrow-classes", "on-container-click-expand", "accordion-open"])) : g("", !0),
+      t(e.$slots, "custom_accordion", {
+        id: e.id,
+        isOpen: o.value,
+        toggleAccordion: n
+      }, () => [
+        f(A, {
+          id: e.id,
+          "accordion-open": o.value,
+          "accordion-open-classes": e.accordionOpenClasses,
+          "accordion-close-classes": e.accordionCloseClasses,
+          "accordion-content-classes": e.accordionContentClasses,
+          "accordion-classes": e.accordionClasses
+        }, {
+          custom_accordion_content: c(() => [
+            t(e.$slots, "custom_accordion_content", { isOpen: o.value })
+          ]),
+          default: c(() => [
+            t(e.$slots, "default", { isOpen: o.value })
+          ]),
+          _: 3
+        }, 8, ["id", "accordion-open", "accordion-open-classes", "accordion-close-classes", "accordion-content-classes", "accordion-classes"])
+      ])
+    ], 2));
+  }
+});
+export {
+  P as _
+};

package/dist/chunks/BaseAlert.vue_vue_type_style_index_0_lang.DUWb9d9_.js

@@ -0,0 +1,19 @@
+import { defineComponent as t, createElementBlock as r, openBlock as s, normalizeClass as a, renderSlot as l } from "vue";
+import '../assets/BaseAlert.css';const o = ["id"], p = /* @__PURE__ */ t({
+  __name: "BaseAlert",
+  props: {
+    alertClass: { default: "" }
+  },
+  setup(n) {
+    return (e, i) => (s(), r("div", {
+      id: e.$attrs.id,
+      class: a(["uikit-alert", e.alertClass]),
+      role: "alert"
+    }, [
+      l(e.$slots, "default")
+    ], 10, o));
+  }
+});
+export {
+  p as _
+};

package/dist/chunks/BaseAutocomplete.vue_vue_type_script_setup_true_lang.S_XFg2zV.js

@@ -0,0 +1,202 @@
+import { defineComponent as T, mergeModels as $, useModel as L, ref as r, computed as k, onBeforeMount as F, watch as f, createBlock as S, openBlock as C, normalizeClass as H, withCtx as s, createElementBlock as z, Fragment as A, renderList as K, unref as N, createElementVNode as U, createVNode as W, renderSlot as V } from "vue";
+import j from "../BaseInput.js";
+import { _ as q } from "./BaseDropDown.vue_vue_type_script_setup_true_lang.OKB0gEpo.js";
+import "./polyline.DjpLdMaW.js";
+import { _ as G } from "./SelectItem.vue_vue_type_script_setup_true_lang.jB3LVM3c.js";
+import { A as J } from "./useBreakpoints.BXk8Xcw3.js";
+function Q(t, p) {
+  return (...v) => new Promise((d, u) => {
+    t.id && clearTimeout(t.id), t.id = setTimeout(() => {
+      try {
+        const i = p(...v);
+        d(i);
+      } catch (i) {
+        u(i);
+      }
+    }, t.delay);
+  });
+}
+const R = ["innerHTML"], le = /* @__PURE__ */ T({
+  __name: "BaseAutocomplete",
+  props: /* @__PURE__ */ $({
+    isValid: { default: null },
+    theme: { default: "" },
+    label: { default: "" },
+    disableCb: { type: Boolean, default: !1 },
+    onInputChangeCb: { type: Function },
+    onOptionSelectedCb: { default: null },
+    keepState: { default: null },
+    cleanupOnClose: { type: Boolean, default: !0 },
+    dropdownClasses: { default: "" },
+    closeDropdownOnBodyPressed: { type: Boolean, default: !0 },
+    inputClasses: {},
+    fieldsetClasses: {},
+    dataCy: { default: "" }
+  }, {
+    modelValue: {
+      default() {
+        return { id: "", label: "" };
+      }
+    },
+    modelModifiers: {}
+  }),
+  emits: /* @__PURE__ */ $(["update:dropdownState", "changedValue", "click", "keydown", "keydownEnterPressed"], ["update:modelValue"]),
+  setup(t, { expose: p, emit: v }) {
+    const d = L(
+      t,
+      "modelValue"
+    ), u = v, i = r(""), n = r([]), m = r(null), c = r(!1), o = r(!1), y = r(null), B = k(() => n.value.length);
+    F(() => {
+      m.value = Q({ delay: 300 }, t.onInputChangeCb);
+    });
+    const { activeIdx: h, selectedIdx: w } = J({
+      optionsLength: B,
+      isDropdownOpen: o,
+      disableSpaceHandler: !0
+    }), O = k(() => {
+      switch (t.theme) {
+        case "bordered":
+          return "";
+        case "all-bordered":
+          return "uikit:rounded! " + (o.value && "uikit:rounded-b-none!");
+        case "all-bordered-thick":
+          return "uikit:rounded-xl! uikit:h-[52px]! " + (o.value && "uikit:rounded-b-none!");
+        default:
+          return "";
+      }
+    }), I = k(() => {
+      switch (t.theme) {
+        case "bordered":
+          return "";
+        case "all-bordered":
+          return "uikit:border uikit:border-w-lavender uikit:border-solid uikit:rounded! uikit:border-w-lavender! uikit:border! " + (o.value ? "uikit:border-b-0! uikit:rounded-b-none!" : "");
+        case "all-bordered-thick":
+          return "uikit:rounded-xl! uikit:h-[60px]! uikit:border-w-lavender! uikit:border-none! " + (o.value ? "uikit:rounded-b-none!" : "");
+        default:
+          return "";
+      }
+    }), M = k(() => {
+      const e = "uikit:rounded-b-xl uikit:shadow uikit:rounded-t-none uikit:mb-0 uikit:mt-0! uikit:text-w-black uikit:rounded-b-xl! uikit:rounded-t-none!";
+      switch (t.theme) {
+        case "bordered":
+          return "uikit:before:content-[''] uikit:before:absolute uikit:before:w-1/2 uikit:before:border-b uikit:before:border-b-w-lavender uikit:before:[border-bottom-style:solid] uikit:before:right-1/4 uikit:rounded-b-xl uikit:shadow uikit:rounded-t-none uikit:mt-5px uikit:mb-0";
+        case "all-bordered":
+          return e;
+        case "all-bordered-thick":
+          return e + " uikit:border-0!";
+        default:
+          return "";
+      }
+    }), P = async (e) => {
+      if (i.value !== e && (u("changedValue", e), i.value = e, !!t.onInputChangeCb)) {
+        if (!e || c.value) {
+          n.value = [], c.value = !1, w.value = -1, h.value = -1, d.value && (d.value.label = ""), o.value = !1, await m.value(null);
+          return;
+        }
+        t.disableCb || (n.value = await m.value(e), o.value = !!n.value.length);
+      }
+    }, g = (e, l) => {
+      t.onOptionSelectedCb && t.onOptionSelectedCb(e), t.cleanupOnClose && (n.value = []), c.value = !0, i.value = e.label, d.value = e, o.value = !1, w.value = l;
+    }, D = () => {
+      n.value.length && t.keepState !== "closed" && (o.value = !0);
+    };
+    return f(
+      d,
+      (e, l) => {
+        e === l || e?.label === i.value || (i.value = e?.label || "");
+      },
+      { immediate: !0 }
+    ), f(w, (e) => {
+      if (e === -1 || !n.value.length) return;
+      const l = n.value[e];
+      c.value && l.label === d.value?.label || g(l, e);
+    }), f(
+      () => t.keepState,
+      (e) => {
+        e === "closed" ? (o.value = !1, t.cleanupOnClose && (n.value = [])) : e === "open" && n.value.length && (o.value = !0);
+      }
+    ), f(o, (e) => {
+      u("update:dropdownState", e);
+    }), p({
+      select: () => {
+        y.value?.select();
+      }
+    }), (e, l) => (C(), S(q, {
+      class: H(e.$attrs["root-classes"]),
+      "data-cy": e.dataCy ? e.dataCy : `ac_${e.$attrs.id}`,
+      "dropdown-element": "ul",
+      "dropdown-classes": [
+        { "bordered-dropdown": e.theme === "bordered" },
+        { "all-bordered-dropdown": e.theme === "all-bordered" },
+        { "all-bordered-dropdown thick": e.theme === "all-bordered-thick" },
+        {
+          "uikit:mt-10px uikit:border! uikit:border-w-secondary! uikit:rounded-xs!": !e.theme
+        },
+        M.value,
+        "uikit:max-h-[210px]! uikit:z-30",
+        e.dropdownClasses
+      ],
+      "open-dropdown": o.value,
+      "keep-state": !n.value.length || e.keepState === "closed" ? "closed" : "opened",
+      "close-when-clicked-outside": e.closeDropdownOnBodyPressed,
+      "activate-keyboard-controller": !1,
+      "onUpdate:dropdownState": l[3] || (l[3] = (a) => o.value = a),
+      onClick: l[4] || (l[4] = (a) => {
+        u("click"), D();
+      })
+    }, {
+      btn_slot: s(() => [
+        W(j, {
+          id: e.$attrs.id ? `ac_input_${e.$attrs.id}` : "",
+          ref_key: "baseInput",
+          ref: y,
+          "data-cy": e.dataCy ? `ac_input_${e.dataCy}` : `ac_input_${e.$attrs.id}`,
+          "label-text": e.label,
+          "model-value": i.value,
+          "is-valid": e.isValid,
+          disabled: e.$attrs.disabled,
+          placeholder: e.$attrs.placeholder,
+          "with-left-icon": !!e.$slots.lefticon,
+          "with-right-icon": !!e.$slots.righticon,
+          "input-class": [
+            O.value,
+            e.inputClasses,
+            "uikit:ml-0! uikit:w-full!"
+          ],
+          "fieldset-classes": [I.value, e.fieldsetClasses],
+          "onUpdate:modelValue": l[0] || (l[0] = (a) => P(a === void 0 ? "" : `${a}`)),
+          onKeydown: l[1] || (l[1] = (a) => u("keydown", a)),
+          onKeydownEnterPressed: l[2] || (l[2] = () => u("keydownEnterPressed"))
+        }, {
+          leftIcon: s(() => [
+            V(e.$slots, "lefticon")
+          ]),
+          righticon: s(({ handleClean: a }) => [
+            V(e.$slots, "righticon", { handleClean: a })
+          ]),
+          _: 3
+        }, 8, ["id", "data-cy", "label-text", "model-value", "is-valid", "disabled", "placeholder", "with-left-icon", "with-right-icon", "input-class", "fieldset-classes"])
+      ]),
+      default: s(() => [
+        (C(!0), z(A, null, K(n.value, (a, b) => (C(), S(G, {
+          key: b,
+          active: N(h) === b,
+          class: "uikit:m-1 uikit:rounded-[5px] uikit:px-5 uikit:py-10px uikit:hover:cursor-pointer",
+          onClick: (E) => g(a, b),
+          onMouseover: (E) => h.value = b
+        }, {
+          default: s(() => [
+            U("span", {
+              innerHTML: a.label
+            }, null, 8, R)
+          ]),
+          _: 2
+        }, 1032, ["active", "onClick", "onMouseover"]))), 128))
+      ]),
+      _: 3
+    }, 8, ["class", "data-cy", "dropdown-classes", "open-dropdown", "keep-state", "close-when-clicked-outside"]));
+  }
+});
+export {
+  le as _
+};

package/dist/chunks/BaseBadge.vue_vue_type_style_index_0_lang.DvAI34Oa.js

@@ -0,0 +1,19 @@
+import { defineComponent as e, createElementBlock as a, openBlock as t, normalizeClass as r, renderSlot as i } from "vue";
+import '../assets/BaseBadge.css';const o = ["id"], p = /* @__PURE__ */ e({
+  inheritAttrs: !1,
+  __name: "BaseBadge",
+  props: {
+    badgeClass: { default: "uikit-badge-w-primary-sm" }
+  },
+  setup(n) {
+    return (s, d) => (t(), a("span", {
+      id: s.$attrs.id,
+      class: r(["uikit-badge uikit:shadow-sm", s.badgeClass, s.$attrs.class])
+    }, [
+      i(s.$slots, "default")
+    ], 10, o));
+  }
+});
+export {
+  p as _
+};

package/dist/chunks/BaseBreadcrumb.vue_vue_type_script_setup_true_lang.BrzeVW2_.js

@@ -0,0 +1,58 @@
+import { defineComponent as d, computed as k, createElementBlock as s, openBlock as i, createElementVNode as n, normalizeClass as a, Fragment as u, renderList as p, renderSlot as c, toDisplayString as h, createVNode as b, unref as f } from "vue";
+import { a as C } from "./ArrowIcon.Bq6Xr3uH.js";
+import "./PharmacyIcon.DEQ8mOEJ.js";
+const g = { "aria-label": "Breadcrumb" }, w = ["data-tooltip"], B = ["href"], $ = /* @__PURE__ */ d({
+  __name: "BaseBreadcrumb",
+  props: {
+    items: {},
+    listClasses: {},
+    listItemClasses: {}
+  },
+  setup(r) {
+    const m = k(() => {
+      let e = 0;
+      const l = [];
+      for (; e < r.items.length; )
+        l.push({ ...r.items[e], idx: e }), e < r.items.length - 1 && l.push({ arrowIcon: !0 }), e++;
+      return l;
+    });
+    return (e, l) => (i(), s("nav", g, [
+      n("ol", {
+        class: a(["uikit:flex uikit:items-center uikit:gap-10px uikit:p-0", e.listClasses])
+      }, [
+        (i(!0), s(u, null, p(m.value, (t, o) => (i(), s(u, null, [
+          t?.label ? (i(), s("li", {
+            key: `breadcrumb-li-${o}`,
+            class: a(["uikit:list-none", e.listItemClasses]),
+            "data-tooltip": t.dataTooltip
+          }, [
+            c(e.$slots, "item", {
+              item: t
+            }, () => [
+              n("a", {
+                class: a(["uikit:text-w-black uikit:no-underline", { "uikit:text-w-primary": t.active }]),
+                href: t.link
+              }, h(t.label), 11, B)
+            ])
+          ], 10, w)) : (i(), s("li", {
+            key: `breadcrumb-li-no-label-${o}`,
+            class: a(["uikit:list-none", e.listItemClasses]),
+            "aria-hidden": "true"
+          }, [
+            c(e.$slots, "separator", {}, () => [
+              b(f(C), {
+                class: "uikit:-rotate-90",
+                "stroke-color": "#222",
+                width: 10,
+                height: 10
+              })
+            ])
+          ], 2))
+        ], 64))), 256))
+      ], 2)
+    ]));
+  }
+});
+export {
+  $ as _
+};

package/dist/chunks/BaseButton.vue_vue_type_script_setup_true_lang.DHwyd5Gb.js

@@ -0,0 +1,66 @@
+import { defineComponent as y, ref as b, computed as s, createElementBlock as f, openBlock as v, withModifiers as l, normalizeStyle as B, normalizeClass as C, renderSlot as u, createVNode as c } from "vue";
+import M from "../StaticSpinner.js";
+const z = ["id", "data-cy", "type", "data-active", "disabled", "aria-label", "title"], h = /* @__PURE__ */ y({
+  __name: "BaseButton",
+  props: {
+    btnClass: { default: "btn-w-primary" },
+    outlined: { type: Boolean },
+    size: {},
+    withMinWidth: { type: Boolean, default: !0 },
+    keepActive: { type: Boolean },
+    isLoading: { type: Boolean },
+    disabled: { type: Boolean },
+    ariaLabel: {},
+    title: {},
+    dataCy: {},
+    type: {}
+  },
+  emits: ["mouseover", "mouseout", "click"],
+  setup(o, { emit: r }) {
+    const a = r, n = b(!1), d = s(() => o.size ? `uikit-btn-${o.size}` : ""), m = s(() => o.outlined ? "uikit-btn-outline" : ""), p = () => {
+      n.value = !0;
+    }, k = () => {
+      n.value = !1;
+    };
+    return (e, t) => (v(), f("button", {
+      id: e.$attrs.id,
+      "data-cy": e.dataCy,
+      type: e.type,
+      class: C([
+        "uikit:btn",
+        {
+          "uikit:btn-empty": !e.withMinWidth,
+          "active uikit:font-medium": e.keepActive,
+          "uikit:flex uikit:items-center uikit:justify-center": e.isLoading
+        },
+        `uikit:${e.btnClass}`,
+        d.value,
+        m.value
+      ]),
+      style: B(e.$attrs.style),
+      "data-active": e.keepActive,
+      disabled: e.isLoading || e.disabled,
+      "aria-label": e.ariaLabel,
+      title: e.title,
+      onMouseover: t[0] || (t[0] = l((i) => {
+        p(), a("mouseover", i);
+      }, ["stop"])),
+      onMouseout: t[1] || (t[1] = l((i) => {
+        k(), a("mouseout", i);
+      }, ["stop"])),
+      onClick: t[2] || (t[2] = (i) => a("click", i))
+    }, [
+      e.isLoading ? u(e.$slots, "spinner", { key: 1 }, () => [
+        c(M, {
+          "stroke-color": e.outlined ? "#ACB4C3" : "#fff"
+        }, null, 8, ["stroke-color"])
+      ]) : u(e.$slots, "default", {
+        key: 0,
+        hover: n.value
+      })
+    ], 46, z));
+  }
+});
+export {
+  h as _
+};

package/dist/chunks/BaseDropDown.vue_vue_type_script_setup_true_lang.OKB0gEpo.js

@@ -0,0 +1,137 @@
+import { defineComponent as M, mergeModels as b, useId as A, useModel as E, ref as h, computed as O, useTemplateRef as W, watch as n, onBeforeMount as $, onMounted as H, onUnmounted as N, createElementBlock as T, openBlock as u, withModifiers as g, normalizeClass as i, renderSlot as C, createBlock as y, createVNode as V, unref as l, withCtx as D, createElementVNode as K, createCommentVNode as q, resolveDynamicComponent as z } from "vue";
+import { _ as R } from "./BaseButton.vue_vue_type_script_setup_true_lang.DHwyd5Gb.js";
+import { a as U } from "./ArrowIcon.Bq6Xr3uH.js";
+import "./PharmacyIcon.DEQ8mOEJ.js";
+import { A as j } from "./useBreakpoints.BXk8Xcw3.js";
+const F = ["innerHTML"], Z = /* @__PURE__ */ M({
+  inheritAttrs: !1,
+  __name: "BaseDropDown",
+  props: /* @__PURE__ */ b({
+    dropdownClasses: { default: "" },
+    btnClasses: { default: "" },
+    withArrowIcon: { type: Boolean, default: !1 },
+    btnLabel: { default: "" },
+    labelClasses: { default: "" },
+    direction: { default: "down" },
+    arrowWidth: { default: 12 },
+    arrowStrokeColor: { default: void 0 },
+    isAbsolute: { type: Boolean, default: !0 },
+    openDropdown: { type: Boolean, default: !1 },
+    closeWhenClickedOutside: { type: Boolean, default: !0 },
+    dropdownElement: { default: "div" },
+    keepState: { default: "" },
+    activateKeyboardController: { type: Boolean, default: !0 },
+    dataCy: { default: "" }
+  }, {
+    toggleDropdown: {
+      default: void 0
+    },
+    toggleDropdownModifiers: {}
+  }),
+  emits: /* @__PURE__ */ b(["click", "update:dropdownState"], ["update:toggleDropdown"]),
+  setup(p, { emit: B }) {
+    const o = p, c = A(), f = B, k = E(p, "toggleDropdown"), t = h(!1), d = h([]), S = O(() => d.value.length), w = W("dropdown"), { activeIdx: m, selectedIdx: r } = j({
+      optionsLength: S,
+      isDropdownOpen: t,
+      activate: o.activateKeyboardController
+    });
+    n(
+      () => o.openDropdown,
+      (e) => {
+        t.value = e;
+      },
+      {
+        immediate: !0
+      }
+    ), n(t, (e) => {
+      f("update:dropdownState", e);
+    }), n(k, (e) => {
+      e && (t.value = !t.value, k.value = !1);
+    }), n(r, (e) => {
+      e !== -1 && d.value[e].querySelector("a")?.click();
+    });
+    const v = () => {
+      t.value = !1;
+    }, s = () => {
+      o.keepState === "closed" && !t.value || o.keepState === "opened" && t.value || (t.value = !t.value);
+    }, I = (e) => {
+      e != null && (m.value = e);
+    }, L = (e) => {
+      e != null && (r.value = e);
+    };
+    return $(() => {
+      o.closeWhenClickedOutside && document.body.addEventListener("click", v);
+    }), H(() => {
+      w.value && (d.value = w.value.children || []);
+    }), N(() => {
+      o.closeWhenClickedOutside && document.body.removeEventListener("click", v);
+    }), (e, a) => (u(), T("div", {
+      class: i(["uikit:relative uikit:block", e.$attrs.class]),
+      onClick: a[1] || (a[1] = g((G) => {
+        f("click"), s();
+      }, ["stop"]))
+    }, [
+      C(e.$slots, "btn_slot", {
+        toggleDropdown: s,
+        isOpen: t.value
+      }, () => [
+        V(R, {
+          id: l(c),
+          type: "button",
+          "data-cy": e.dataCy,
+          class: i([
+            "uikit:flex! uikit:w-full uikit:items-center uikit:truncate",
+            e.btnClasses
+          ]),
+          "aria-expanded": t.value,
+          "btn-class": "btn-single-selection"
+        }, {
+          default: D(() => [
+            K("span", {
+              class: i(["uikit:mr-5px", e.labelClasses]),
+              innerHTML: e.btnLabel
+            }, null, 10, F),
+            e.withArrowIcon ? (u(), y(l(U), {
+              key: 0,
+              class: i(["uikit:shrink-0 uikit:transition-transform uikit:motion-reduce:transition-none", t.value ? "uikit:rotate-180" : ""]),
+              width: e.arrowWidth,
+              height: e.arrowWidth,
+              "stroke-color": e.arrowStrokeColor
+            }, null, 8, ["class", "width", "height", "stroke-color"])) : q("", !0)
+          ]),
+          _: 1
+        }, 8, ["id", "data-cy", "class", "aria-expanded"])
+      ]),
+      (u(), y(z(e.dropdownElement), {
+        id: "dropdown_" + l(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", [
+          e.dropdownClasses,
+          t.value ? "uikit:flex" : "uikit:hidden",
+          { "uikit:bottom-[55px] uikit:rounded-xs": e.direction === "up" },
+          { "uikit:rounded-b uikit:border-t-0": e.direction === "down" },
+          { "uikit:absolute": e.isAbsolute }
+        ]]),
+        "aria-hidden": !t.value,
+        onClick: a[0] || (a[0] = g(() => {
+        }, ["stop"]))
+      }, {
+        default: D(() => [
+          C(e.$slots, "default", {
+            isOpen: t.value,
+            toggleDropdown: s,
+            activeIdx: l(m),
+            selectedIdx: l(r),
+            setActiveIdx: I,
+            setSelectedIdx: L
+          })
+        ]),
+        _: 3
+      }, 8, ["id", "data-cy", "class", "aria-hidden"]))
+    ], 2));
+  }
+});
+export {
+  Z as _
+};