cisse-vue-ui 0.5.22 → 0.5.23

package/dist/{DarkModeToggle.vue_vue_type_script_setup_true_lang-43fxlbro.js → DarkModeToggle.vue_vue_type_script_setup_true_lang-D1Q43mhJ.js}

@@ -1,15 +1,16 @@
 import { defineComponent, computed, createBlock, createElementBlock, openBlock, createCommentVNode, renderSlot, normalizeClass, createElementVNode, createTextVNode, toDisplayString, useSlots, createVNode, Fragment, renderList, resolveDynamicComponent, withCtx, createSlots, ref, watch, unref, withDirectives, vModelText, withModifiers, Teleport, Transition, normalizeStyle, nextTick, resolveComponent, mergeProps, provide, inject, vShow, onMounted, onUnmounted } from "vue";
-import { _ as _sfc_main$l, u as useBreakpoints } from "./index-Dghdw1yo.js";
-import { b as _sfc_main$j, a as _sfc_main$k, c as _sfc_main$r } from "./Button.vue_vue_type_script_setup_true_lang-DKE8elsf.js";
+import { _ as _sfc_main$l, u as useBreakpoints } from "./index-CJwlO351.js";
+import { b as _sfc_main$j, a as _sfc_main$k, c as _sfc_main$r } from "./Button.vue_vue_type_script_setup_true_lang-CD9QPOeU.js";
 import { e as _sfc_main$m, d as _sfc_main$n, c as _sfc_main$o, b as _sfc_main$p, a as _sfc_main$q } from "./BadgeType.vue_vue_type_script_setup_true_lang-CnB5eNEM.js";
 import { Icon } from "@iconify/vue";
 import { u as useDropdown } from "./useDropdown-iVu14E6s.js";
+import { u as useId } from "./useId-xeHj7rkg.js";
 import { u as useDarkMode } from "./useDarkMode-Cl5QWTlC.js";
-const _hoisted_1$d = {
+const _hoisted_1$f = {
   key: 1,
   class: "flex flex-col overflow-hidden rounded-lg bg-white shadow-md dark:bg-slate-950"
 };
-const _hoisted_2$a = { class: "flex flex-col gap-0.5" };
+const _hoisted_2$c = { class: "flex flex-col gap-0.5" };
 const _hoisted_3$7 = {
   key: 1,
   class: "text-sm font-normal text-gray-600 dark:text-gray-400"
@@ -41,7 +42,7 @@ const _sfc_main$i = /* @__PURE__ */ defineComponent({
         lines: __props.loadingLines,
         "show-avatar": __props.loadingAvatar,
         "show-actions": __props.loadingActions
-      }, null, 8, ["lines", "show-avatar", "show-actions"])) : (openBlock(), createElementBlock("div", _hoisted_1$d, [
+      }, null, 8, ["lines", "show-avatar", "show-actions"])) : (openBlock(), createElementBlock("div", _hoisted_1$f, [
         _ctx.$slots.header ? (openBlock(), createElementBlock("div", {
           key: 0,
           class: normalizeClass(["border-b", dividerClasses.value])
@@ -51,7 +52,7 @@ const _sfc_main$i = /* @__PURE__ */ defineComponent({
           key: 1,
           class: normalizeClass(["flex items-center justify-between border-b px-5 py-3", dividerClasses.value])
         }, [
-          createElementVNode("div", _hoisted_2$a, [
+          createElementVNode("div", _hoisted_2$c, [
             __props.title || _ctx.$slots.title ? (openBlock(), createElementBlock("span", {
               key: 0,
               class: normalizeClass(["text-md font-semibold", titleClasses.value])
@@ -75,8 +76,8 @@ const _sfc_main$i = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$c = { class: "overflow-hidden" };
-const _hoisted_2$9 = {
+const _hoisted_1$e = { class: "overflow-hidden" };
+const _hoisted_2$b = {
   key: 1,
   class: "overflow-x-auto"
 };
@@ -210,12 +211,12 @@ const _sfc_main$h = /* @__PURE__ */ defineComponent({
       return props.sortBy === property.name;
     };
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$c, [
+      return openBlock(), createElementBlock("div", _hoisted_1$e, [
         __props.loading ? (openBlock(), createBlock(_sfc_main$k, {
           key: 0,
           rows: __props.loadingRows,
           columns: visibleProperties.value.length
-        }, null, 8, ["rows", "columns"])) : (openBlock(), createElementBlock("div", _hoisted_2$9, [
+        }, null, 8, ["rows", "columns"])) : (openBlock(), createElementBlock("div", _hoisted_2$b, [
           createElementVNode("table", _hoisted_3$6, [
             createElementVNode("thead", _hoisted_4$5, [
               createElementVNode("tr", null, [
@@ -321,8 +322,8 @@ const _sfc_main$h = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$b = { class: "space-y-3" };
-const _hoisted_2$8 = { class: "flex items-center gap-3 p-3" };
+const _hoisted_1$d = { class: "space-y-3" };
+const _hoisted_2$a = { class: "flex items-center gap-3 p-3" };
 const _hoisted_3$5 = { class: "text-sm text-gray-600 dark:text-gray-400" };
 const _hoisted_4$4 = {
   key: 0,
@@ -389,7 +390,7 @@ const _sfc_main$g = /* @__PURE__ */ defineComponent({
     };
     const hasEmptySlot = computed(() => !!slots.empty);
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$b, [
+      return openBlock(), createElementBlock("div", _hoisted_1$d, [
         __props.loading ? (openBlock(), createBlock(_sfc_main$i, { key: 0 }, {
           default: withCtx(() => [
             createVNode(_sfc_main$r, {
@@ -403,7 +404,7 @@ const _sfc_main$g = /* @__PURE__ */ defineComponent({
         })) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
           __props.selectable && selectableItems.value.length > 0 ? (openBlock(), createBlock(_sfc_main$i, { key: 0 }, {
             default: withCtx(() => [
-              createElementVNode("div", _hoisted_2$8, [
+              createElementVNode("div", _hoisted_2$a, [
                 createVNode(_sfc_main$l, {
                   "model-value": allSelected.value,
                   indeterminate: someSelected.value,
@@ -588,11 +589,11 @@ const _sfc_main$f = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$a = {
+const _hoisted_1$c = {
   key: 0,
   class: "mb-2 block text-sm font-medium text-gray-700 dark:text-gray-300"
 };
-const _hoisted_2$7 = { class: "relative" };
+const _hoisted_2$9 = { class: "relative" };
 const _hoisted_3$4 = ["disabled", "placeholder"];
 const _hoisted_4$3 = ["disabled"];
 const _hoisted_5$1 = {
@@ -708,8 +709,8 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
         ref: containerRef,
         class: "autocomplete-container"
       }, [
-        __props.label ? (openBlock(), createElementBlock("label", _hoisted_1$a, toDisplayString(__props.label), 1)) : createCommentVNode("", true),
-        createElementVNode("div", _hoisted_2$7, [
+        __props.label ? (openBlock(), createElementBlock("label", _hoisted_1$c, toDisplayString(__props.label), 1)) : createCommentVNode("", true),
+        createElementVNode("div", _hoisted_2$9, [
           createElementVNode("div", {
             ref_key: "inputWrapperRef",
             ref: inputWrapperRef,
@@ -884,8 +885,8 @@ const _sfc_main$d = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$9 = { class: "relative inline-block" };
-const _hoisted_2$6 = ["src", "alt"];
+const _hoisted_1$b = { class: "relative inline-block" };
+const _hoisted_2$8 = ["src", "alt"];
 const _hoisted_3$3 = { key: 1 };
 const _sfc_main$c = /* @__PURE__ */ defineComponent({
   __name: "Avatar",
@@ -933,7 +934,7 @@ const _sfc_main$c = /* @__PURE__ */ defineComponent({
     });
     const showImage = computed(() => props.src && !imageError.value);
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$9, [
+      return openBlock(), createElementBlock("div", _hoisted_1$b, [
         createElementVNode("div", {
           class: normalizeClass([
             "flex items-center justify-center overflow-hidden bg-gray-200 font-medium text-gray-600 dark:bg-gray-700 dark:text-gray-300",
@@ -947,7 +948,7 @@ const _sfc_main$c = /* @__PURE__ */ defineComponent({
             alt: __props.alt || __props.name,
             class: "size-full object-cover",
             onError: _cache[0] || (_cache[0] = ($event) => imageError.value = true)
-          }, null, 40, _hoisted_2$6)) : initials.value ? (openBlock(), createElementBlock("span", _hoisted_3$3, toDisplayString(initials.value), 1)) : (openBlock(), createBlock(unref(Icon), {
+          }, null, 40, _hoisted_2$8)) : initials.value ? (openBlock(), createElementBlock("span", _hoisted_3$3, toDisplayString(initials.value), 1)) : (openBlock(), createBlock(unref(Icon), {
             key: 2,
             icon: "lucide:user",
             class: "size-1/2"
@@ -965,8 +966,8 @@ const _sfc_main$c = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$8 = ["aria-selected", "disabled", "onClick"];
-const _hoisted_2$5 = { class: "mt-4" };
+const _hoisted_1$a = ["aria-selected", "disabled", "onClick"];
+const _hoisted_2$7 = { class: "mt-4" };
 const _sfc_main$b = /* @__PURE__ */ defineComponent({
   __name: "Tabs",
   props: {
@@ -1032,17 +1033,17 @@ const _sfc_main$b = /* @__PURE__ */ defineComponent({
                 activeTab.value === tab.key ? variantClasses[__props.variant].active : variantClasses[__props.variant].inactive
               ]),
               onClick: ($event) => selectTab(tab)
-            }, toDisplayString(tab.label), 11, _hoisted_1$8);
+            }, toDisplayString(tab.label), 11, _hoisted_1$a);
           }), 128))
         ], 2),
-        createElementVNode("div", _hoisted_2$5, [
+        createElementVNode("div", _hoisted_2$7, [
           renderSlot(_ctx.$slots, "default", { activeTab: activeTab.value })
         ])
       ]);
     };
   }
 });
-const _hoisted_1$7 = { role: "tabpanel" };
+const _hoisted_1$9 = { role: "tabpanel" };
 const _sfc_main$a = /* @__PURE__ */ defineComponent({
   __name: "TabPanel",
   props: {
@@ -1053,7 +1054,7 @@ const _sfc_main$a = /* @__PURE__ */ defineComponent({
     const activeTab = inject("activeTab");
     const isActive = computed(() => (activeTab == null ? void 0 : activeTab.value) === props.value);
     return (_ctx, _cache) => {
-      return withDirectives((openBlock(), createElementBlock("div", _hoisted_1$7, [
+      return withDirectives((openBlock(), createElementBlock("div", _hoisted_1$9, [
         renderSlot(_ctx.$slots, "default")
       ], 512)), [
         [vShow, isActive.value]
@@ -1061,7 +1062,7 @@ const _sfc_main$a = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$6 = {
+const _hoisted_1$8 = {
   key: 2,
   class: "text-sm font-semibold"
 };
@@ -1134,7 +1135,7 @@ const _sfc_main$9 = /* @__PURE__ */ defineComponent({
                   key: 1,
                   icon: step.icon,
                   class: "size-6"
-                }, null, 8, ["icon"])) : (openBlock(), createElementBlock("span", _hoisted_1$6, toDisplayString(index + 1), 1))
+                }, null, 8, ["icon"])) : (openBlock(), createElementBlock("span", _hoisted_1$8, toDisplayString(index + 1), 1))
               ], 2),
               createElementVNode("div", {
                 class: normalizeClass([
@@ -1258,16 +1259,20 @@ const _sfc_main$8 = /* @__PURE__ */ defineComponent({
     };
   }
 });
+const _hoisted_1$7 = ["aria-describedby"];
+const _hoisted_2$6 = ["id"];
 const _sfc_main$7 = /* @__PURE__ */ defineComponent({
   __name: "Tooltip",
   props: {
     content: {},
     position: { default: "top" },
     delay: { default: 0 },
-    disabled: { type: Boolean, default: false }
+    disabled: { type: Boolean, default: false },
+    id: {}
   },
   setup(__props) {
     const props = __props;
+    const { id: tooltipId } = useId({ prefix: "tooltip", id: props.id });
     const isVisible = ref(false);
     let timeoutId = null;
     const show = () => {
@@ -1306,6 +1311,7 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", {
         class: "relative inline-block",
+        "aria-describedby": __props.content && !__props.disabled ? unref(tooltipId) : void 0,
         onMouseenter: show,
         onMouseleave: hide,
         onFocus: show,
@@ -1323,26 +1329,33 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
           default: withCtx(() => [
             isVisible.value && __props.content ? (openBlock(), createElementBlock("div", {
               key: 0,
+              id: unref(tooltipId),
               class: normalizeClass(positionClasses.value),
               role: "tooltip"
-            }, toDisplayString(__props.content), 3)) : createCommentVNode("", true)
+            }, toDisplayString(__props.content), 11, _hoisted_2$6)) : createCommentVNode("", true)
           ]),
           _: 1
         })
-      ], 32);
+      ], 40, _hoisted_1$7);
     };
   }
 });
+const _hoisted_1$6 = ["id", "aria-expanded", "aria-controls"];
+const _hoisted_2$5 = ["id", "aria-labelledby"];
 const _sfc_main$6 = /* @__PURE__ */ defineComponent({
   __name: "Popover",
   props: {
     position: { default: "bottom" },
     hover: { type: Boolean, default: false },
     teleport: { type: Boolean, default: true },
-    width: { default: "auto" }
+    width: { default: "auto" },
+    id: {}
   },
   setup(__props) {
     const props = __props;
+    const { related } = useId({ prefix: "popover", id: props.id });
+    const triggerId = computed(() => related("trigger"));
+    const popoverId = computed(() => related("content"));
     const triggerRef = ref();
     const popoverRef = ref();
     const { isOpen, dropdownStyle, toggle, close, open } = useDropdown(triggerRef, popoverRef, {
@@ -1379,10 +1392,13 @@ const _sfc_main$6 = /* @__PURE__ */ defineComponent({
         createElementVNode("div", {
           ref_key: "triggerRef",
           ref: triggerRef,
+          id: triggerId.value,
+          "aria-expanded": unref(isOpen),
+          "aria-controls": popoverId.value,
           onClick: handleTrigger
         }, [
           renderSlot(_ctx.$slots, "trigger")
-        ], 512),
+        ], 8, _hoisted_1$6),
         (openBlock(), createBlock(Teleport, {
           to: "body",
           disabled: !__props.teleport
@@ -1398,8 +1414,11 @@ const _sfc_main$6 = /* @__PURE__ */ defineComponent({
             default: withCtx(() => [
               unref(isOpen) ? (openBlock(), createElementBlock("div", {
                 key: 0,
+                id: popoverId.value,
                 ref_key: "popoverRef",
                 ref: popoverRef,
+                role: "dialog",
+                "aria-labelledby": triggerId.value,
                 style: normalizeStyle(unref(dropdownStyle)),
                 class: normalizeClass([
                   "z-[9999] rounded-lg border border-gray-200 bg-white p-4 shadow-lg dark:border-gray-700 dark:bg-gray-800",
@@ -1407,7 +1426,7 @@ const _sfc_main$6 = /* @__PURE__ */ defineComponent({
                 ])
               }, [
                 renderSlot(_ctx.$slots, "default", { close: unref(close) })
-              ], 6)) : createCommentVNode("", true)
+              ], 14, _hoisted_2$5)) : createCommentVNode("", true)
             ]),
             _: 3
           })
@@ -1664,9 +1683,9 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$2 = ["disabled", "aria-expanded"];
+const _hoisted_1$2 = ["id", "disabled", "aria-expanded", "aria-controls"];
 const _hoisted_2$2 = { class: "flex items-center gap-2 font-medium" };
-const _hoisted_3$1 = { class: "overflow-hidden" };
+const _hoisted_3$1 = ["id", "aria-labelledby"];
 const _hoisted_4$1 = { class: "px-4 py-3 bg-gray-50 dark:bg-gray-900 text-gray-700 dark:text-gray-300" };
 const _sfc_main$2 = /* @__PURE__ */ defineComponent({
   __name: "AccordionItem",
@@ -1674,10 +1693,14 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
     itemKey: {},
     title: {},
     icon: {},
-    disabled: { type: Boolean }
+    disabled: { type: Boolean },
+    id: {}
   },
   setup(__props) {
     const props = __props;
+    const { related } = useId({ prefix: "accordion", id: props.id });
+    const headerId = computed(() => related("header"));
+    const panelId = computed(() => related("panel"));
     const accordion = inject("accordion");
     const isOpen = computed(() => (accordion == null ? void 0 : accordion.isOpen(props.itemKey)) ?? false);
     const toggle = () => {
@@ -1688,25 +1711,29 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", null, [
         createElementVNode("button", {
+          id: headerId.value,
           type: "button",
           class: normalizeClass(["flex items-center justify-between w-full px-4 py-3 text-left transition-colors", [
             __props.disabled ? "bg-gray-50 text-gray-400 cursor-not-allowed dark:bg-gray-800 dark:text-gray-500" : "bg-white hover:bg-gray-50 text-gray-900 dark:bg-gray-800 dark:hover:bg-gray-700 dark:text-white"
           ]]),
           disabled: __props.disabled,
           "aria-expanded": isOpen.value,
+          "aria-controls": panelId.value,
           onClick: toggle
         }, [
           createElementVNode("span", _hoisted_2$2, [
             __props.icon ? (openBlock(), createBlock(unref(Icon), {
               key: 0,
               icon: __props.icon,
-              class: "w-5 h-5"
+              class: "w-5 h-5",
+              "aria-hidden": "true"
             }, null, 8, ["icon"])) : createCommentVNode("", true),
             createTextVNode(" " + toDisplayString(__props.title), 1)
           ]),
           createVNode(unref(Icon), {
             icon: "heroicons:chevron-down",
-            class: normalizeClass(["w-5 h-5 transition-transform duration-200", { "rotate-180": isOpen.value }])
+            class: normalizeClass(["w-5 h-5 transition-transform duration-200", { "rotate-180": isOpen.value }]),
+            "aria-hidden": "true"
           }, null, 8, ["class"])
         ], 10, _hoisted_1$2),
         createVNode(Transition, {
@@ -1718,11 +1745,16 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
           "leave-to-class": "opacity-0 max-h-0"
         }, {
           default: withCtx(() => [
-            withDirectives(createElementVNode("div", _hoisted_3$1, [
+            withDirectives(createElementVNode("div", {
+              id: panelId.value,
+              role: "region",
+              "aria-labelledby": headerId.value,
+              class: "overflow-hidden"
+            }, [
               createElementVNode("div", _hoisted_4$1, [
                 renderSlot(_ctx.$slots, "default")
               ])
-            ], 512), [
+            ], 8, _hoisted_3$1), [
               [vShow, isOpen.value]
             ])
           ]),
@@ -1933,4 +1965,4 @@ export {
   _sfc_main$1 as q,
   _sfc_main as r
 };
-//# sourceMappingURL=DarkModeToggle.vue_vue_type_script_setup_true_lang-43fxlbro.js.map
+//# sourceMappingURL=DarkModeToggle.vue_vue_type_script_setup_true_lang-D1Q43mhJ.js.map