@wikicasa-dev/components 2.0.2 → 2.0.4

package/dist/AccessibleSelect.js

@@ -1,4 +1,4 @@
-import { _ as f } from "./chunks/AccessibleSelect.vue_vue_type_script_setup_true_lang.MhVm5k0I.js";
+import { _ as f } from "./chunks/AccessibleSelect.vue_vue_type_script_setup_true_lang.YIp2u7gd.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.CwGssIPe.js";
+import { _ as f } from "./chunks/BaseAutocomplete.vue_vue_type_script_setup_true_lang.m5rScY4N.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.H0XcZCcL.js";
+import { _ as f } from "./chunks/BaseDropDown.vue_vue_type_script_setup_true_lang.BscSQ5bW.js";
 export {
   f as default
 };

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

@@ -29,6 +29,10 @@ declare const __VLS_component: import('vue').DefineComponent<{
     fieldsetClasses?: ClassType;
     legendClasses?: ClassType;
     dropdownClasses?: ClassType;
+    labelClasses?: ClassType;
+    btnClasses?: ClassType;
+    dropdownItemClasses?: ClassType;
+    btnTextClasses?: ClassType;
     arrowIcon?: Partial<{
         width: number;
         height: number;
@@ -57,6 +61,10 @@ declare const __VLS_component: import('vue').DefineComponent<{
     fieldsetClasses?: ClassType;
     legendClasses?: ClassType;
     dropdownClasses?: ClassType;
+    labelClasses?: ClassType;
+    btnClasses?: ClassType;
+    dropdownItemClasses?: ClassType;
+    btnTextClasses?: ClassType;
     arrowIcon?: Partial<{
         width: number;
         height: number;
@@ -75,8 +83,10 @@ declare const __VLS_component: import('vue').DefineComponent<{
         classes: ClassType;
     }>;
     dataCy: string;
+    btnClasses: ClassType;
     isValid: boolean | null;
     modelValue: AccessibleSelectOptions;
+    labelClasses: ClassType;
     dropdownPosition: "top" | "bottom";
     feedback: Partial<{
         valid: string;
@@ -87,6 +97,8 @@ declare const __VLS_component: import('vue').DefineComponent<{
     fieldsetClasses: ClassType;
     legendClasses: ClassType;
     dropdownClasses: ClassType;
+    dropdownItemClasses: ClassType;
+    btnTextClasses: ClassType;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;

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

@@ -26,6 +26,7 @@ declare const __VLS_component: import('vue').DefineComponent<{
     labelClasses?: ClassType;
     direction?: "up" | "down";
     arrowWidth?: number;
+    arrowStrokeColor?: `#${string}`;
     isAbsolute?: boolean;
     openDropdown?: boolean;
     closeWhenClickedOutside?: boolean;
@@ -44,6 +45,7 @@ declare const __VLS_component: import('vue').DefineComponent<{
     labelClasses?: ClassType;
     direction?: "up" | "down";
     arrowWidth?: number;
+    arrowStrokeColor?: `#${string}`;
     isAbsolute?: boolean;
     openDropdown?: boolean;
     closeWhenClickedOutside?: boolean;
@@ -63,6 +65,7 @@ declare const __VLS_component: import('vue').DefineComponent<{
     withArrowIcon: boolean;
     btnLabel: string;
     direction: "up" | "down";
+    arrowStrokeColor: `#${string}`;
     isAbsolute: boolean;
     openDropdown: boolean;
     closeWhenClickedOutside: boolean;

package/dist/chunks/{AccessibleSelect.vue_vue_type_script_setup_true_lang.MhVm5k0I.js → AccessibleSelect.vue_vue_type_script_setup_true_lang.YIp2u7gd.js}

@@ -1,5 +1,5 @@
-import { h as m, defineComponent as M, ref as $, computed as B, watch as H, onMounted as T, onUnmounted as F, openBlock as a, createElementBlock as s, normalizeClass as l, createElementVNode as o, createCommentVNode as d, withModifiers as k, renderSlot as z, unref as p, createBlock as A, createVNode as E, Fragment as g, renderList as P } from "vue";
-import { A as I } from "./useKeyboardController.CutKeclN.js";
+import { h as m, defineComponent as M, ref as g, computed as T, watch as B, onMounted as H, onUnmounted as F, openBlock as l, createElementBlock as s, normalizeClass as a, createElementVNode as o, createCommentVNode as d, withModifiers as k, renderSlot as I, unref as p, createBlock as z, createVNode as A, Fragment as C, renderList as E } from "vue";
+import { A as P } from "./useKeyboardController.CutKeclN.js";
 import { a as O } from "./ArrowIcon.CCFMdsq6.js";
 import { e as q } from "./PharmacyIcon.56ql_DYl.js";
 const N = (n, { attrs: f }) => {
@@ -55,59 +55,60 @@ const N = (n, { attrs: f }) => {
     fieldsetClasses: { default: "" },
     legendClasses: { default: "" },
     dropdownClasses: { default: "" },
+    labelClasses: { default: "" },
+    btnClasses: { default: "" },
+    dropdownItemClasses: { default: "" },
+    btnTextClasses: { default: "" },
     arrowIcon: { default: void 0 },
     dataCy: { default: "" }
   },
   emits: ["update:modelValue"],
   setup(n, { emit: f }) {
-    const t = n, e = $(!1), V = $(null), v = B(() => !!t.modelValue.label), C = f, { activeIdx: b, selectedIdx: L } = I({
+    const t = n, e = g(!1), $ = g(null), v = T(() => !!t.modelValue.label), V = f, { activeIdx: b, selectedIdx: L } = P({
       optionsLength: t.options.length,
       isDropdownOpen: e
     }), h = (i) => {
-      e.value = !1, C("update:modelValue", i);
+      e.value = !1, V("update:modelValue", i);
     };
-    H(L, (i) => {
+    B(L, (i) => {
       h(t.options[i]), e.value = !1;
     });
     const w = ({ target: i }) => {
       `${t.namespace}_btn` !== i.id && (e.value = !1);
     };
-    return T(() => {
+    return H(() => {
       t.closeOnBodyPressed && document.addEventListener("click", w);
     }), F(() => {
       t.closeOnBodyPressed && document.removeEventListener("click", w);
-    }), (i, r) => (a(), s("div", {
-      class: l([i.$attrs.class])
+    }), (i, r) => (l(), s("div", {
+      class: a([i.$attrs.class])
     }, [
       o("div", j, [
-        i.label ? (a(), s("label", {
+        i.label ? (l(), s("label", {
           key: 0,
           id: `${i.namespace}_label`,
-          class: l(["uikit-pointer-events-none uikit-absolute uikit-z-10 uikit-text-sm uikit-font-medium uikit-transition-all uikit-ease-in-out", [
+          class: a(["uikit-pointer-events-none uikit-absolute uikit-z-10 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-top-4 uikit-text-w-gray",
-            i.$attrs["label-classes"],
+            i.labelClasses,
             { "uikit-left-9": i.$slots.lefticon && !v.value },
             { "uikit-left-4": !i.$slots.lefticon && !v.value }
           ]]),
           innerHTML: i.label
         }, null, 10, D)) : d("", !0),
-        i.$slots.lefticon ? (a(), s("span", {
+        i.$slots.lefticon ? (l(), s("span", {
           key: 1,
           class: "uikit-z-20 uikit-mt-2 uikit-pl-2",
           onClick: r[0] || (r[0] = k((u) => e.value = !e.value, ["stop"]))
         }, [
-          z(i.$slots, "lefticon")
+          I(i.$slots, "lefticon")
         ])) : d("", !0),
         o("button", {
           id: `${i.namespace}_btn`,
           ref_key: "btnEl",
-          ref: V,
+          ref: $,
           type: "button",
           "data-cy": i.dataCy,
-          class: l(["uikit-peer uikit-relative uikit-z-10 uikit-flex uikit-h-full uikit-w-full uikit-items-center uikit-justify-between uikit-truncate uikit-border-0 uikit-bg-transparent uikit-pr-4 uikit-text-left focus-visible:uikit-outline-0", [
-            i.$slots.lefticon ? "uikit-pl-2" : "uikit-pl-4",
-            i.$attrs["btn-classes"]
-          ]]),
+          class: a(["uikit-peer uikit-relative uikit-z-10 uikit-flex uikit-h-full uikit-w-full uikit-items-center uikit-justify-between uikit-truncate uikit-border-0 uikit-bg-transparent uikit-pr-4 uikit-text-left focus-visible:uikit-outline-0", [i.$slots.lefticon ? "uikit-pl-2" : "uikit-pl-4", i.btnClasses]]),
           "aria-required": !!i.$attrs.required,
           role: "combobox",
           "aria-haspopup": "listbox",
@@ -120,18 +121,18 @@ const N = (n, { attrs: f }) => {
           onClick: r[1] || (r[1] = (u) => e.value = !e.value)
         }, [
           o("span", {
-            class: l(["uikit-pointer-events-none uikit-mt-1", i.$attrs["btn-text-classes"]]),
+            class: a(["uikit-pointer-events-none uikit-mt-1", i.btnTextClasses]),
             innerHTML: i.modelValue.visibleLabel || i.modelValue.label
           }, null, 10, U),
           o("span", G, [
-            t.isValid == !1 ? (a(), A(p(N), {
+            t.isValid == !1 ? (l(), z(p(N), {
               key: 0,
               class: "uikit-mr-1",
               width: 20,
               height: 20
             })) : d("", !0),
-            E(p(O), {
-              class: l(["uikit-transition-transform motion-reduce:uikit-transition-none", [
+            A(p(O), {
+              class: a(["uikit-transition-transform motion-reduce:uikit-transition-none", [
                 e.value ? "uikit-rotate-180" : "",
                 i.arrowIcon?.classes
               ]]),
@@ -143,7 +144,7 @@ const N = (n, { attrs: f }) => {
         ], 10, S),
         o("fieldset", {
           "aria-hidden": "true",
-          class: l(["uikit-pointer-events-none uikit-absolute uikit-bottom-0 uikit-left-0 uikit-right-0 uikit-m-0 uikit-box-border uikit-h-12 uikit-cursor-pointer uikit-rounded-xs uikit-bg-white uikit-px-2 uikit-py-0 peer-focus:uikit-border-2", [
+          class: a(["uikit-pointer-events-none uikit-absolute uikit-bottom-0 uikit-left-0 uikit-right-0 uikit-m-0 uikit-box-border uikit-h-12 uikit-cursor-pointer uikit-rounded-xs uikit-bg-white uikit-px-2 uikit-py-0 peer-focus:uikit-border-2", [
             i.fieldsetClasses,
             i.isValid ? "uikit-border-w-primary" : i.isValid === !1 ? "uikit-border-w-danger" : "uikit-border-w-secondary",
             {
@@ -153,21 +154,21 @@ const N = (n, { attrs: f }) => {
           ]])
         }, [
           o("legend", {
-            class: l([[i.legendClasses, { "uikit-m-0 uikit-w-0": !i.label }], "uikit-ml-2 uikit-h-3 uikit-px-0 uikit-text-sm"])
+            class: a([[i.legendClasses, { "uikit-m-0 uikit-w-0": !i.label }], "uikit-ml-2 uikit-h-3 uikit-px-0 uikit-text-sm"])
           }, [
-            i.label ? (a(), s("span", {
+            i.label ? (l(), s("span", {
               key: 0,
-              class: l(["uikit-mx-5px", [i.modelValue.label ? "uikit-invisible" : "uikit-hidden"]]),
+              class: a(["uikit-mx-5px", [i.modelValue.label ? "uikit-invisible" : "uikit-hidden"]]),
               innerHTML: i.label
             }, null, 10, J)) : d("", !0)
           ], 2)
         ], 2),
         o("ul", {
-          "data-cy": i.$attrs["data-cy"] && `${i.$attrs["data-cy"]}_dropdown`,
+          "data-cy": i.dataCy && `${i.dataCy}_dropdown`,
           role: "listbox",
           tabindex: -1,
           "aria-multiselectable": !1,
-          class: l(["uikit-absolute uikit-z-30 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", [
+          class: a(["uikit-absolute uikit-z-30 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
@@ -179,12 +180,12 @@ const N = (n, { attrs: f }) => {
           onClick: r[3] || (r[3] = k(() => {
           }, ["stop"]))
         }, [
-          (a(!0), s(g, null, P(i.options, (u, c) => (a(), s("li", {
+          (l(!0), s(C, null, E(i.options, (u, c) => (l(), s("li", {
             id: `${i.namespace}_element_${i.options[c].label}`,
             key: `${u.label}_${c}`,
             role: "option",
             "aria-selected": p(b) === c,
-            class: l(["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"]]),
+            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.dropdownItemClasses]),
             onClick: k((y) => h(u), ["stop"]),
             onMouseover: k((y) => b.value = c, ["stop"]),
             onBlur: r[2] || (r[2] = k(() => {
@@ -206,15 +207,15 @@ const N = (n, { attrs: f }) => {
           ], 42, Q))), 128))
         ], 10, K)
       ]),
-      i.feedback ? (a(), s(g, { key: 0 }, [
-        i.feedback.valid ? (a(), s("span", {
+      i.feedback ? (l(), s(C, { key: 0 }, [
+        i.feedback.valid ? (l(), s("span", {
           key: 0,
           id: `${i.namespace}_valid_msg`,
           "arial-live": i.$attrs["aria-live"],
           class: "uikit-mt-1 uikit-inline-block uikit-text-12",
           innerHTML: i.isValid ? i.feedback.valid : ""
         }, null, 8, Y)) : d("", !0),
-        i.feedback.invalid ? (a(), s("span", {
+        i.feedback.invalid ? (l(), s("span", {
           key: 1,
           id: `${i.namespace}_invalid_msg`,
           "arial-live": i.$attrs["aria-live"],

package/dist/chunks/{BaseAutocomplete.vue_vue_type_script_setup_true_lang.CwGssIPe.js → BaseAutocomplete.vue_vue_type_script_setup_true_lang.m5rScY4N.js}

@@ -1,6 +1,6 @@
 import { defineComponent as L, mergeModels as S, useModel as H, ref as s, computed as k, onBeforeMount as z, watch as f, openBlock as y, createBlock as V, normalizeClass as A, withCtx as c, createVNode as K, renderSlot as B, createElementBlock as N, Fragment as U, renderList as F, 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.H0XcZCcL.js";
+import { _ as G } from "./BaseDropDown.vue_vue_type_script_setup_true_lang.BscSQ5bW.js";
 import "./types-B0dZ7OiV.D29wNgoj.js";
 import { _ as J } from "./SelectItem.vue_vue_type_script_setup_true_lang.GPFf7fjA.js";
 import { A as Q } from "./useKeyboardController.CutKeclN.js";

package/dist/chunks/{BaseDropDown.vue_vue_type_script_setup_true_lang.H0XcZCcL.js → BaseDropDown.vue_vue_type_script_setup_true_lang.BscSQ5bW.js}

@@ -1,4 +1,4 @@
-import { defineComponent as D, useId as $, ref as m, computed as L, useTemplateRef as E, watch as r, onBeforeMount as I, onMounted as S, onUnmounted as A, openBlock as s, createElementBlock as O, normalizeClass as i, withModifiers as w, renderSlot as v, createVNode as W, unref as a, withCtx as b, createElementVNode as M, createBlock as h, createCommentVNode as H, resolveDynamicComponent as N } from "vue";
+import { defineComponent as D, useId as S, ref as m, computed as L, useTemplateRef as E, watch as r, onBeforeMount as I, onMounted as A, onUnmounted as O, openBlock as s, createElementBlock as W, normalizeClass as i, withModifiers as w, renderSlot as v, createVNode as $, unref as a, withCtx as b, createElementVNode as M, createBlock as h, createCommentVNode as H, resolveDynamicComponent as N } from "vue";
 import { _ as T } from "./BaseButton.vue_vue_type_script_setup_true_lang.BWZPE2Gf.js";
 import { a as V } from "./ArrowIcon.CCFMdsq6.js";
 import "./PharmacyIcon.56ql_DYl.js";
@@ -14,6 +14,7 @@ const q = ["innerHTML"], G = /* @__PURE__ */ D({
     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 },
@@ -23,8 +24,8 @@ const q = ["innerHTML"], G = /* @__PURE__ */ D({
     dataCy: { default: "" }
   },
   emits: ["click", "update:dropdownState"],
-  setup(y, { emit: C }) {
-    const o = y, u = $(), p = C, t = m(!1), n = m([]), g = L(() => n.value.length), c = E("dropdown"), { activeIdx: B, selectedIdx: k } = K({
+  setup(C, { emit: y }) {
+    const o = C, u = S(), p = y, t = m(!1), n = m([]), g = L(() => n.value.length), c = E("dropdown"), { activeIdx: B, selectedIdx: k } = K({
       optionsLength: g,
       isDropdownOpen: t,
       activate: o.activateKeyboardController
@@ -49,11 +50,11 @@ const q = ["innerHTML"], G = /* @__PURE__ */ D({
     };
     return I(() => {
       o.closeWhenClickedOutside && document.body.addEventListener("click", f);
-    }), S(() => {
-      c.value && (n.value = c.value.children || []);
     }), A(() => {
+      c.value && (n.value = c.value.children || []);
+    }), O(() => {
       o.closeWhenClickedOutside && document.body.removeEventListener("click", f);
-    }), (e, l) => (s(), O("div", {
+    }), (e, l) => (s(), W("div", {
       class: i(["uikit-relative uikit-block", e.$attrs.class]),
       onClick: l[1] || (l[1] = w((z) => {
         p("click"), d();
@@ -63,7 +64,7 @@ const q = ["innerHTML"], G = /* @__PURE__ */ D({
         toggleDropdown: d,
         isOpen: t.value
       }, () => [
-        W(T, {
+        $(T, {
           id: a(u),
           type: "button",
           "data-cy": e.dataCy,
@@ -84,7 +85,7 @@ const q = ["innerHTML"], G = /* @__PURE__ */ D({
               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"]
+              "stroke-color": e.arrowStrokeColor
             }, null, 8, ["class", "width", "height", "stroke-color"])) : H("", !0)
           ]),
           _: 1
@@ -93,7 +94,7 @@ const q = ["innerHTML"], G = /* @__PURE__ */ D({
       (s(), h(N(e.dropdownElement), {
         id: "dropdown_" + a(u),
         ref: "dropdown",
-        "data-cy": e.$attrs["data-cy"] && `${e.$attrs["data-cy"]}_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",

package/dist/index.js

@@ -9,14 +9,14 @@ import { _ } from "./chunks/BaseTab.vue_vue_type_script_setup_true_lang.Cu67jd8K
 import { _ as S } from "./chunks/BaseTabView.vue_vue_type_script_setup_true_lang.DGeL_YSc.js";
 import { _ as g } from "./chunks/RadioButton.vue_vue_type_script_setup_true_lang.CiJAhkRj.js";
 import { _ as h } from "./chunks/RadioGroup.vue_vue_type_script_setup_true_lang.BalzO73O.js";
-import { _ as I } from "./chunks/AccessibleSelect.vue_vue_type_script_setup_true_lang.MhVm5k0I.js";
+import { _ as I } from "./chunks/AccessibleSelect.vue_vue_type_script_setup_true_lang.YIp2u7gd.js";
 import { _ as w } from "./chunks/BaseAlert.vue_vue_type_style_index_0_lang.BtqP_iYL.js";
-import { _ as k } from "./chunks/BaseAutocomplete.vue_vue_type_script_setup_true_lang.CwGssIPe.js";
+import { _ as k } from "./chunks/BaseAutocomplete.vue_vue_type_script_setup_true_lang.m5rScY4N.js";
 import { _ as v } from "./chunks/BaseBadge.vue_vue_type_style_index_0_lang.BOA1gBKu.js";
 import { _ as G } from "./chunks/BaseButton.vue_vue_type_script_setup_true_lang.BWZPE2Gf.js";
 import { default as O } from "./BaseCard.js";
 import { default as R } from "./BaseComplexToggle.js";
-import { _ as V } from "./chunks/BaseDropDown.vue_vue_type_script_setup_true_lang.H0XcZCcL.js";
+import { _ as V } from "./chunks/BaseDropDown.vue_vue_type_script_setup_true_lang.BscSQ5bW.js";
 import { default as q } from "./BaseFloatingLabel.js";
 import { default as z } from "./BaseIcon.js";
 import { default as H } from "./BaseInput.js";

package/package.json

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