@wikicasa-dev/components 2.3.1-alpha.18 → 2.3.1-alpha.2

package/dist/index.js

@@ -1,123 +1,104 @@
-import { default as n } from "./packages/components/lib/UIKit/Accordion/BaseAccordion.vue.js";
-import { default as b } from "./packages/components/lib/UIKit/Accordion/BaseAccordionItem.vue.js";
-import './assets/BaseSnackbar.css';import './assets/BaseModal.css';import './assets/BaseDropDown.css';import './assets/BaseCard.css';import './assets/BaseBadge.css';import './assets/ClearableAutocomplete.css';import './assets/BaseAutocomplete.css';import './assets/BaseAlert.css';import './assets/AccessibleSelect.css';import './assets/RadioButtonItem.css';import './assets/BaseTabsIndicator.css';import './assets/CheckboxBtn.css';import './assets/BaseAccordionItem.css';/* empty css                                                               */
-import { default as S } from "./packages/components/lib/UIKit/Accordion/AccordionItemPrimitive.vue.js";
-import { default as g } from "./packages/components/lib/UIKit/Accordion/AccordionHeaderPrimitive.vue.js";
-import { default as A } from "./packages/components/lib/UIKit/Accordion/AccordionTriggerPrimitive.vue.js";
-import { default as v } from "./packages/components/lib/UIKit/Accordion/AccordionContentPrimitive.vue.js";
-import { default as G } from "./packages/components/lib/UIKit/BaseSelect/SelectItem.vue.js";
-import { default as L } from "./packages/components/lib/UIKit/Checkbox/CheckboxBtn.vue.js";
+import { default as B } from "./packages/components/lib/UIKit/Accordion/BaseAccordion.vue.js";
+import { default as c } from "./packages/components/lib/UIKit/Accordion/BaseAccordionBtn.vue.js";
+import { default as S } from "./packages/components/lib/UIKit/Accordion/BaseAccordionContent.vue.js";
+import { default as g } from "./packages/components/lib/UIKit/Accordion/BaseAccordionItem.vue.js";
+import './assets/BaseSnackbar.css';import './assets/BaseModal.css';import './assets/BaseDropDown.css';import './assets/BaseCard.css';import './assets/BaseBadge.css';import './assets/ClearableAutocomplete.css';import './assets/BaseAutocomplete.css';import './assets/BaseAlert.css';import './assets/AccessibleSelect.css';import './assets/RadioButtonItem.css';import './assets/CheckboxBtn.css';import './assets/BaseAccordionItem.css';/* empty css                                                               */
+import { default as A } from "./packages/components/lib/UIKit/BaseSelect/SelectItem.vue.js";
+import { default as T } from "./packages/components/lib/UIKit/Checkbox/CheckboxBtn.vue.js";
 /* empty css                                                        */
-import { default as w } from "./packages/components/lib/UIKit/Checkbox/CheckboxGroup.vue.js";
-import { default as F } from "./packages/components/lib/UIKit/Checkbox/v2/CheckboxButtonGroup.vue.js";
-import { default as O } from "./packages/components/lib/UIKit/Checkbox/v2/CheckboxGroupPrimitive.vue.js";
-import { default as U } from "./packages/components/lib/UIKit/Checkbox/v2/CheckboxGroupItemPrimitive.vue.js";
-import { default as j } from "./packages/components/lib/UIKit/Tab/BaseTabView.vue.js";
-import { default as y } from "./packages/components/lib/UIKit/Tab/BaseTab.vue.js";
-import { default as E } from "./packages/components/lib/UIKit/Tab/v2/BaseTabs.vue.js";
-import { default as K } from "./packages/components/lib/UIKit/Tab/v2/BaseTabsContent.vue.js";
-import { default as Q } from "./packages/components/lib/UIKit/Tab/v2/BaseTabsIndicator.vue.js";
+import { default as R } from "./packages/components/lib/UIKit/Checkbox/CheckboxGroup.vue.js";
+import { default as w } from "./packages/components/lib/UIKit/Checkbox/v2/CheckboxButtonGroup.vue.js";
+import { default as v } from "./packages/components/lib/UIKit/Tab/BaseTabView.vue.js";
+import { default as F } from "./packages/components/lib/UIKit/Tab/BaseTab.vue.js";
+import { default as O } from "./packages/components/lib/UIKit/Radio/RadioButton.vue.js";
+import { default as U } from "./packages/components/lib/UIKit/Radio/RadioGroup.vue.js";
+import { default as j } from "./packages/components/lib/UIKit/Radio/v2/RadioButtonGroup.vue.js";
+import { default as y } from "./packages/components/lib/UIKit/Radio/v2/RadioButtonItem.vue.js";
 /* empty css                                                            */
-import { default as X } from "./packages/components/lib/UIKit/Tab/v2/BaseTabsList.vue.js";
-import { default as Z } from "./packages/components/lib/UIKit/Tab/v2/BaseTabsTrigger.vue.js";
-import { default as $ } from "./packages/components/lib/UIKit/Radio/RadioButton.vue.js";
-import { default as oe } from "./packages/components/lib/UIKit/Radio/RadioGroup.vue.js";
-import { default as ae } from "./packages/components/lib/UIKit/Radio/v2/RadioButtonGroup.vue.js";
-import { default as fe } from "./packages/components/lib/UIKit/Radio/v2/RadioButtonItem.vue.js";
-/* empty css                                                            */
-import { default as me } from "./packages/components/lib/UIKit/Radio/v2/RadioGroupItemPrimitive.vue.js";
-import { default as le } from "./packages/components/lib/UIKit/AccessibleSelect.vue.js";
+import { default as E } from "./packages/components/lib/UIKit/Radio/v2/RadioGroupItemPrimitive.vue.js";
+import { default as J } from "./packages/components/lib/UIKit/AccessibleSelect.vue.js";
 /* empty css                                                    */
-import { default as ue } from "./packages/components/lib/UIKit/BaseAlert.vue.js";
+import { default as N } from "./packages/components/lib/UIKit/BaseAlert.vue.js";
 /* empty css                                             */
-import { default as xe } from "./packages/components/lib/UIKit/BaseAutocomplete.vue.js";
+import { default as W } from "./packages/components/lib/UIKit/BaseAutocomplete.vue.js";
 /* empty css                                                    */
-import { default as ne } from "./packages/components/lib/UIKit/Autocomplete/ClearableAutocomplete.vue.js";
+import { default as Y } from "./packages/components/lib/UIKit/Autocomplete/ClearableAutocomplete.vue.js";
 /* empty css                                                                      */
-import { default as be } from "./packages/components/lib/UIKit/BaseBadge.vue.js";
+import { default as _ } from "./packages/components/lib/UIKit/BaseBadge.vue.js";
 /* empty css                                             */
-import { default as Se } from "./packages/components/lib/UIKit/BaseButton.vue.js";
-import { default as ge } from "./packages/components/lib/UIKit/BaseCard.vue.js";
+import { default as ee } from "./packages/components/lib/UIKit/BaseButton.vue.js";
+import { default as ae } from "./packages/components/lib/UIKit/BaseCard.vue.js";
 /* empty css                                            */
-import { default as Ae } from "./UIKit/BaseComplexToggle.js";
-import { default as ve } from "./packages/components/lib/UIKit/BaseDropDown.vue.js";
+import { default as re } from "./UIKit/BaseComplexToggle.js";
+import { default as se } from "./packages/components/lib/UIKit/BaseDropDown.vue.js";
 /* empty css                                                */
-import { default as Ge } from "./UIKit/BaseFloatingLabel.js";
-import { default as Le } from "./UIKit/BaseInput.js";
-import { default as we } from "./packages/components/lib/UIKit/BasePagination.vue.js";
-import { default as Fe } from "./UIKit/BaseSlider.js";
-import { default as Oe } from "./UIKit/BaseTextarea.js";
-import { default as Ue } from "./packages/components/lib/UIKit/BaseToggle.vue.js";
-import { default as je } from "./UIKit/BaseTooltip.js";
-import { default as ye } from "./packages/components/lib/UIKit/BaseUploadFile.vue.js";
-import { default as Ee } from "./packages/components/lib/UIKit/BaseModal.vue.js";
+import { default as me } from "./UIKit/BaseFloatingLabel.js";
+import { default as de } from "./UIKit/BaseInput.js";
+import { default as xe } from "./packages/components/lib/UIKit/BasePagination.vue.js";
+import { default as Be } from "./UIKit/BaseSlider.js";
+import { default as ce } from "./UIKit/BaseTextarea.js";
+import { default as Se } from "./packages/components/lib/UIKit/BaseToggle.vue.js";
+import { default as ge } from "./UIKit/BaseTooltip.js";
+import { default as Ae } from "./packages/components/lib/UIKit/BaseUploadFile.vue.js";
+import { default as Te } from "./packages/components/lib/UIKit/BaseModal.vue.js";
 /* empty css                                             */
-import { default as Ke } from "./UIKit/StaticSpinner.js";
-import { default as Qe } from "./UIKit/ShimmerLoader/BaseShimmerLoader.js";
-import { default as Xe } from "./packages/components/lib/UIKit/ShimmerLoader/ShimmerMultiLine.vue.js";
-import { default as Ze } from "./packages/components/lib/chart/DoughnutChart.vue.js";
-import { default as $e } from "./packages/components/lib/chart/LineChart.vue.js";
-import { default as oo } from "./UIKit/Slider/SimpleSlider.js";
-import { default as ao } from "./packages/components/lib/UIKit/BaseSnackbar.vue.js";
+import { default as Re } from "./UIKit/StaticSpinner.js";
+import { default as we } from "./UIKit/ShimmerLoader/BaseShimmerLoader.js";
+import { default as ve } from "./packages/components/lib/UIKit/ShimmerLoader/ShimmerMultiLine.vue.js";
+import { default as Fe } from "./packages/components/lib/chart/DoughnutChart.vue.js";
+import { default as Oe } from "./packages/components/lib/chart/LineChart.vue.js";
+import { default as Ue } from "./UIKit/Slider/SimpleSlider.js";
+import { default as je } from "./packages/components/lib/UIKit/BaseSnackbar.vue.js";
 /* empty css                                                */
-import { default as fo } from "./packages/components/lib/components/IntersectionObserver/IntersectionObservable.vue.js";
-import { default as mo } from "./packages/components/lib/components/IntersectionObserver/IntersectionObserver.vue.js";
-import { default as lo } from "./components/carousel/SwiperCarousel.js";
-import { default as io } from "./components/carousel/SwiperSlide.js";
-import { default as Bo } from "./packages/components/lib/UIKit/BaseBreadcrumb.vue.js";
+import { default as ye } from "./packages/components/lib/components/IntersectionObserver/IntersectionObservable.vue.js";
+import { default as Ee } from "./packages/components/lib/components/IntersectionObserver/IntersectionObserver.vue.js";
+import { default as Je } from "./components/carousel/SwiperCarousel.js";
+import { default as Ne } from "./components/carousel/SwiperSlide.js";
+import { default as We } from "./packages/components/lib/UIKit/BaseBreadcrumb.vue.js";
 export {
-  le as AccessibleSelect,
-  v as AccordionContentPrimitive,
-  g as AccordionHeaderPrimitive,
-  S as AccordionItemPrimitive,
-  A as AccordionTriggerPrimitive,
-  n as BaseAccordion,
-  b as BaseAccordionItem,
-  ue as BaseAlert,
-  xe as BaseAutocomplete,
-  be as BaseBadge,
-  Bo as BaseBreadcrumb,
-  Se as BaseButton,
-  ge as BaseCard,
-  Ae as BaseComplexToggle,
-  ve as BaseDropDown,
-  Ge as BaseFloatingLabel,
-  Le as BaseInput,
-  Ee as BaseModal,
-  we as BasePagination,
-  Qe as BaseShimmerLoader,
-  Fe as BaseSlider,
-  ao as BaseSnackbar,
-  y as BaseTab,
-  j as BaseTabView,
-  E as BaseTabs,
-  K as BaseTabsContent,
-  Q as BaseTabsIndicator,
-  X as BaseTabsList,
-  Z as BaseTabsTrigger,
-  Oe as BaseTextarea,
-  Ue as BaseToggle,
-  je as BaseTooltip,
-  ye as BaseUploadFile,
-  L as CheckboxBtn,
-  F as CheckboxButtonGroup,
-  w as CheckboxGroup,
-  U as CheckboxGroupItemPrimitive,
-  O as CheckboxGroupPrimitive,
-  ne as ClearableAutocomplete,
-  Ze as DoughnutChart,
-  fo as IntersectionObservable,
-  mo as IntersectionObserver,
-  $e as LineChart,
-  $ as RadioButton,
-  ae as RadioButtonGroup,
-  fe as RadioButtonItem,
-  oe as RadioGroup,
-  me as RadioGroupItemPrimitive,
-  G as SelectItem,
-  Xe as ShimmerMultiLine,
-  oo as SimpleSlider,
-  Ke as StaticSpinner,
-  lo as SwiperCarousel,
-  io as SwiperSlide
+  J as AccessibleSelect,
+  B as BaseAccordion,
+  c as BaseAccordionBtn,
+  S as BaseAccordionContent,
+  g as BaseAccordionItem,
+  N as BaseAlert,
+  W as BaseAutocomplete,
+  _ as BaseBadge,
+  We as BaseBreadcrumb,
+  ee as BaseButton,
+  ae as BaseCard,
+  re as BaseComplexToggle,
+  se as BaseDropDown,
+  me as BaseFloatingLabel,
+  de as BaseInput,
+  Te as BaseModal,
+  xe as BasePagination,
+  we as BaseShimmerLoader,
+  Be as BaseSlider,
+  je as BaseSnackbar,
+  F as BaseTab,
+  v as BaseTabView,
+  ce as BaseTextarea,
+  Se as BaseToggle,
+  ge as BaseTooltip,
+  Ae as BaseUploadFile,
+  T as CheckboxBtn,
+  w as CheckboxButtonGroup,
+  R as CheckboxGroup,
+  Y as ClearableAutocomplete,
+  Fe as DoughnutChart,
+  ye as IntersectionObservable,
+  Ee as IntersectionObserver,
+  Oe as LineChart,
+  O as RadioButton,
+  j as RadioButtonGroup,
+  y as RadioButtonItem,
+  U as RadioGroup,
+  E as RadioGroupItemPrimitive,
+  A as SelectItem,
+  ve as ShimmerMultiLine,
+  Ue as SimpleSlider,
+  Re as StaticSpinner,
+  Je as SwiperCarousel,
+  Ne as SwiperSlide
 };

package/dist/packages/components/lib/UIKit/Accordion/BaseAccordion.vue.js

@@ -1,33 +1,25 @@
-import { defineComponent as d, mergeModels as n, useModel as u, createBlock as i, openBlock as r, unref as m, withCtx as p, renderSlot as s, normalizeProps as c, guardReactiveProps as f } from "vue";
-import { AccordionRoot as y } from "reka-ui";
-const b = /* @__PURE__ */ d({
+import { defineComponent as i, mergeModels as d, useModel as r, provide as u, createBlock as n, openBlock as s, unref as p, withCtx as m, renderSlot as c } from "vue";
+import { AccordionRoot as f } from "reka-ui";
+const b = /* @__PURE__ */ i({
   __name: "BaseAccordion",
-  props: /* @__PURE__ */ n({
+  props: /* @__PURE__ */ d({
     collapsible: { type: Boolean },
-    type: {},
-    disabled: { type: Boolean },
-    dir: {},
-    orientation: {},
-    unmountOnHide: { type: Boolean },
-    asChild: { type: Boolean },
-    as: {},
-    modelValue: {},
-    defaultValue: {}
+    type: {}
   }, {
     modelValue: {},
     modelModifiers: {}
   }),
   emits: ["update:modelValue"],
-  setup(e) {
-    const l = u(e, "modelValue");
-    return (t, a) => (r(), i(m(y), {
-      collapsible: e.collapsible,
-      type: e.type,
-      modelValue: l.value,
-      "onUpdate:modelValue": a[0] || (a[0] = (o) => l.value = o)
+  setup(t) {
+    const e = r(t, "modelValue");
+    return u("isActive", (l) => typeof e.value == "string" ? e.value === l : !!e.value?.find((o) => o === l)), (l, o) => (s(), n(p(f), {
+      collapsible: t.collapsible,
+      type: t.type,
+      modelValue: e.value,
+      "onUpdate:modelValue": o[0] || (o[0] = (a) => e.value = a)
     }, {
-      default: p((o) => [
-        s(t.$slots, "default", c(f(o)))
+      default: m(() => [
+        c(l.$slots, "default")
       ]),
       _: 3
     }, 8, ["collapsible", "type", "modelValue"]));

package/dist/packages/components/lib/UIKit/Accordion/BaseAccordionBtn.vue.js

@@ -0,0 +1,59 @@
+import { defineComponent as l, createElementBlock as s, openBlock as d, normalizeClass as n, renderSlot as i, createElementVNode as u, withModifiers as k, createVNode as m, unref as f } from "vue";
+import { ArrowIcon as g } from "@wikicasa-dev/svg-icons";
+const C = ["id"], w = ["aria-expanded", "aria-controls"], b = /* @__PURE__ */ l({
+  inheritAttrs: !1,
+  __name: "BaseAccordionBtn",
+  props: {
+    id: {},
+    arrowWidth: { default: 12 },
+    arrowColor: {},
+    onContainerClickExpand: { type: Boolean, default: !1 },
+    accordionOpen: { type: Boolean, default: !1 },
+    toggleAccordion: { type: Function }
+  },
+  emits: ["click"],
+  setup(t, { emit: r }) {
+    const a = r;
+    return (o, e) => (d(), s("div", {
+      id: `${t.id}`,
+      class: n(["uikit-flex uikit-items-center uikit-justify-around", [
+        o.$attrs["btn-wrapper-classes"],
+        t.onContainerClickExpand ? "uikit-cursor-pointer" : ""
+      ]]),
+      onClick: e[1] || (e[1] = (c) => t.onContainerClickExpand && t.toggleAccordion())
+    }, [
+      i(o.$slots, "custom-content"),
+      i(o.$slots, "custom_btn", {
+        btnId: `btn-${t.id}`,
+        isOpen: t.accordionOpen,
+        toggleAccordion: t.toggleAccordion
+      }, () => [
+        u("button", {
+          type: "button",
+          class: n(["uikit-border-0 uikit-bg-transparent", o.$attrs["btn-classes"]]),
+          "aria-expanded": t.accordionOpen,
+          "aria-controls": `accordion-text-${t.id}`,
+          onClick: e[0] || (e[0] = k((c) => {
+            t.toggleAccordion(), a("click");
+          }, ["prevent", "stop"]))
+        }, [
+          m(f(g), {
+            class: n([
+              "uikit-transition-transform motion-reduce:uikit-transition-none",
+              [
+                t.accordionOpen ? "uikit-rotate-180" : "",
+                o.$attrs["arrow-classes"]
+              ]
+            ]),
+            "stroke-color": t.arrowColor ?? "#222",
+            width: t.arrowWidth,
+            height: t.arrowWidth
+          }, null, 8, ["stroke-color", "class", "width", "height"])
+        ], 10, w)
+      ])
+    ], 10, C));
+  }
+});
+export {
+  b as default
+};

package/dist/packages/components/lib/UIKit/Accordion/BaseAccordionContent.vue.js

@@ -0,0 +1,34 @@
+import { defineComponent as n, createElementBlock as a, openBlock as c, normalizeClass as o, renderSlot as t, createElementVNode as d } from "vue";
+const s = ["id", "aria-labelledby"], u = /* @__PURE__ */ n({
+  __name: "BaseAccordionContent",
+  props: {
+    id: {},
+    accordionOpen: { type: Boolean },
+    accordionOpenClasses: {},
+    accordionClosedClasses: {},
+    accordionContentClasses: {}
+  },
+  setup(i) {
+    return (e, r) => (c(), a("div", {
+      id: `accordion-text-${i.id}`,
+      role: "region",
+      "aria-labelledby": `accordion-title-${i.id}`,
+      class: o(["uikit-grid uikit-overflow-hidden uikit-px-5 uikit-text-sm uikit-text-w-black uikit-transition-[grid-template-rows,opacity,padding,margin] uikit-duration-300 uikit-ease-in-out", [
+        i.accordionOpen ? i.accordionOpenClasses : i.accordionClosedClasses,
+        i.accordionOpen ? "uikit-grid-rows-[1fr] uikit-opacity-100" : "uikit-grid-rows-[0fr] uikit-opacity-0",
+        e.$attrs["accordion-classes"]
+      ]])
+    }, [
+      t(e.$slots, "custom-accordion-content", { isOpen: i.accordionOpen }, () => [
+        d("div", {
+          class: o(["uikit-overflow-hidden", i.accordionContentClasses])
+        }, [
+          t(e.$slots, "default", { isOpen: i.accordionOpen })
+        ], 2)
+      ])
+    ], 10, s));
+  }
+});
+export {
+  u as default
+};

package/dist/packages/components/lib/UIKit/Accordion/BaseAccordionItem.vue.js

@@ -1,10 +1,7 @@
-import { defineComponent as o, createBlock as l, openBlock as n, withCtx as i, createVNode as a, normalizeClass as s, renderSlot as r, createTextVNode as u, toDisplayString as c, unref as d } from "vue";
-import f from "./AccordionContentPrimitive.vue.js";
-import m from "./AccordionTriggerPrimitive.vue.js";
-import k from "./AccordionHeaderPrimitive.vue.js";
-import h from "./AccordionItemPrimitive.vue.js";
-import { ArrowIcon as w } from "@wikicasa-dev/svg-icons";
-const B = /* @__PURE__ */ o({
+import { defineComponent as n, inject as c, createBlock as u, openBlock as d, unref as t, withCtx as a, createVNode as s, normalizeClass as r, renderSlot as l, createTextVNode as f, toDisplayString as k } from "vue";
+import { AccordionItem as h, AccordionHeader as m, AccordionTrigger as g, AccordionContent as w } from "reka-ui";
+import { ArrowIcon as C } from "@wikicasa-dev/svg-icons";
+const b = /* @__PURE__ */ n({
   __name: "BaseAccordionItem",
   props: {
     title: {},
@@ -18,36 +15,39 @@ const B = /* @__PURE__ */ o({
     arrowClasses: {},
     headerTag: { default: "h3" }
   },
-  setup(t) {
-    return (e, g) => (n(), l(h, { value: t.value }, {
-      default: i(() => [
-        a(k, {
-          as: t.headerTag,
-          class: s([
-            t.headerClasses,
+  setup(e) {
+    const o = c("isActive");
+    return (i, v) => (d(), u(t(h), { value: e.value }, {
+      default: a(() => [
+        s(t(m), {
+          as: e.headerTag,
+          class: r([
+            e.headerClasses,
             "uikit-flex uikit-items-center uikit-justify-between"
           ])
         }, {
-          default: i(() => [
-            r(e.$slots, "header-content"),
-            a(m, {
-              "data-cy": t.dataCy,
-              class: s([
-                t.triggerClasses,
+          default: a(() => [
+            l(i.$slots, "header-content"),
+            s(t(g), {
+              "data-cy": e.dataCy,
+              class: r([
+                e.triggerClasses,
                 {
-                  "uikit-base-accordion-trigger uikit-inline-flex uikit-cursor-pointer uikit-items-center uikit-justify-between uikit-border-0 uikit-bg-transparent uikit-px-[16px] uikit-py-[16px] uikit-text-left uikit-font-semibold": !e.$slots.trigger,
-                  "uikit-w-full": !e.$slots["header-content"]
+                  "uikit-inline-flex uikit-cursor-pointer uikit-items-center uikit-justify-between uikit-border-0 uikit-bg-transparent uikit-px-[16px] uikit-py-[16px] uikit-text-left uikit-font-semibold": !i.$slots.trigger,
+                  "uikit-w-full": !i.$slots["header-content"]
                 }
               ])
             }, {
-              default: i(() => [
-                r(e.$slots, "trigger", {}, () => [
-                  u(c(t.title) + " ", 1),
-                  a(d(w), {
-                    class: s(["uikit-base-accordion-item-arrow uikit-flex-shrink-0 uikit-transition-transform motion-reduce:uikit-transition-none", t.arrowClasses]),
-                    "arrow-classes": t.arrowClasses,
-                    width: t.arrowWidth,
-                    height: t.arrowWidth
+              default: a(() => [
+                l(i.$slots, "trigger", {
+                  active: t(o)(e.value)
+                }, () => [
+                  f(k(e.title) + " ", 1),
+                  s(t(C), {
+                    class: r(["uikit-flex-shrink-0 uikit-transition-transform motion-reduce:uikit-transition-none", [t(o)(e.value) ? "uikit-rotate-180" : "", e.arrowClasses]]),
+                    "arrow-classes": e.arrowClasses,
+                    width: e.arrowWidth,
+                    height: e.arrowWidth
                   }, null, 8, ["class", "arrow-classes", "width", "height"])
                 ])
               ]),
@@ -56,14 +56,14 @@ const B = /* @__PURE__ */ o({
           ]),
           _: 3
         }, 8, ["as", "class"]),
-        a(f, {
-          class: s([
-            t.contentClasses,
+        s(t(w), {
+          class: r([
+            e.contentClasses,
             "uikit-base-accordion-item-content uikit-px-[16px]"
           ])
         }, {
-          default: i(() => [
-            r(e.$slots, "default")
+          default: a(() => [
+            l(i.$slots, "default")
           ]),
           _: 3
         }, 8, ["class"])
@@ -73,5 +73,5 @@ const B = /* @__PURE__ */ o({
   }
 });
 export {
-  B as default
+  b as default
 };

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

@@ -1,4 +1,4 @@
-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 x, withCtx as M, createElementBlock as Z, Fragment as _, renderList as ee, renderSlot as b, createElementVNode as u, 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 { 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 u, 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 re from "../BaseSelect/SelectItem.vue.js";
@@ -31,14 +31,14 @@ const ce = ["id", "data-cy", "placeholder"], fe = ["innerHTML"], ye = /* @__PURE
   }),
   emits: /* @__PURE__ */ U(["input", "click", "inputClick", "keydown"], ["update:open", "update:modelValue", "update:inputValue"]),
   setup(t, { expose: L, emit: D }) {
-    const s = S(t, "open"), p = S(t, "modelValue"), o = S(t, "inputValue"), v = D, K = q(), C = d("inputRef"), k = c(0), y = c(!1), r = c(!1), W = c(null), a = c([]), O = d("dropdownRef"), h = d("hiddenSpan"), w = d("inputWrapperRef"), R = d("clearButtonRef"), N = () => {
+    const s = S(t, "open"), p = S(t, "modelValue"), o = S(t, "inputValue"), v = D, K = q(), C = d("inputRef"), k = c(0), y = c(!1), r = c(!1), x = c(null), a = c([]), O = d("dropdownRef"), h = d("hiddenSpan"), w = d("inputWrapperRef"), R = d("clearButtonRef"), N = () => {
       o.value = "", p.value = null, r.value = !1;
     }, A = async (l) => {
       if (!l) {
         a.value = [], s.value = !1;
         return;
       }
-      t.disableCb || (a.value = await W.value?.(l) || [], y.value = !0, s.value = !!a.value.length);
+      t.disableCb || (a.value = await x.value?.(l) || [], y.value = !0, s.value = !!a.value.length);
     }, F = (l = -1) => {
       const e = a.value[l];
       !e || e.id === p.value?.id || (t.onOptionSelectedCb?.(e), o.value = e.label, s.value = !1, p.value = e, r.value = !0, a.value = []);
@@ -51,11 +51,11 @@ const ce = ["id", "data-cy", "placeholder"], fe = ["innerHTML"], ye = /* @__PURE
     const $ = () => {
       const l = h.value, e = w.value, n = R.value;
       if (!l || !e) return;
-      const T = l.offsetWidth, m = e.offsetWidth, i = t.clearButton?.offset || 0, g = t.clearButton?.width || n?.offsetWidth || 0, X = m - i - g, V = Math.min(T, X);
+      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 !== k.value && (k.value = V);
     };
     return G(() => {
-      W.value = de({ delay: 300 }, t.onInputChangeCb);
+      x.value = de({ delay: 300 }, t.onInputChangeCb);
     }), J(() => {
       w.value && (B = new ResizeObserver(() => {
         $();
@@ -82,7 +82,7 @@ const ce = ["id", "data-cy", "placeholder"], fe = ["innerHTML"], ye = /* @__PURE
       getRootElement: () => O.value?.getRootElement(),
       select: P,
       focus: H
-    }), (l, e) => (x(), z(se, {
+    }), (l, e) => (M(), z(se, {
       ref: "dropdownRef",
       class: "uikit-clearable-autocomplete",
       "data-cy": t.dataCy,
@@ -95,12 +95,12 @@ const ce = ["id", "data-cy", "placeholder"], fe = ["innerHTML"], ye = /* @__PURE
       open: s.value,
       "onUpdate:open": e[6] || (e[6] = (n) => s.value = n)
     }, {
-      btn_slot: M(() => [
+      btn_slot: W(() => [
         u("div", {
           class: f(["uikit-text-16", t.triggerWrapperClasses]),
           onClick: e[4] || (e[4] = (n) => v("click", n))
         }, [
-          b(l.$slots, "left-icon"),
+          m(l.$slots, "left-icon"),
           u("div", {
             ref: "inputWrapperRef",
             class: f(["uikit-relative", t.inputWrapperClasses])
@@ -134,7 +134,7 @@ const ce = ["id", "data-cy", "placeholder"], fe = ["innerHTML"], ye = /* @__PURE
             u("span", {
               ref_key: "hiddenSpan",
               ref: h,
-              class: f(["uikit-invisible uikit-absolute uikit-left-0 uikit-top-0 uikit-max-w-full uikit-overflow-hidden uikit-whitespace-pre", t.hiddenTextClasses]),
+              class: f(["uikit-invisible uikit-absolute uikit-left-0 uikit-top-0 uikit-whitespace-pre", t.hiddenTextClasses]),
               style: {
                 font: "inherit",
                 fontSize: "inherit"
@@ -152,31 +152,31 @@ const ce = ["id", "data-cy", "placeholder"], fe = ["innerHTML"], ye = /* @__PURE
               }),
               onClick: oe(N, ["stop"])
             }, [
-              b(l.$slots, "clear-icon", {}, () => [
+              m(l.$slots, "clear-icon", {}, () => [
                 e[7] || (e[7] = ie("X", -1))
               ])
             ], 6), [
               [ue, r.value && k.value]
             ])
           ], 2),
-          b(l.$slots, "right-icon")
+          m(l.$slots, "right-icon")
         ], 2)
       ]),
-      default: M(({ activeIdx: n, setActiveIdx: T }) => [
-        (x(!0), Z(_, null, ee(a.value, (m, i) => (x(), z(re, {
+      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: (g) => F(i),
           onMouseover: (g) => T(i)
         }, {
-          default: M(() => [
-            b(l.$slots, "option-content", {
-              option: m,
+          default: W(() => [
+            m(l.$slots, "option-content", {
+              option: b,
               idx: i
             }, () => [
               u("span", {
-                innerHTML: m.label
+                innerHTML: b.label
               }, null, 8, fe)
             ])
           ]),