cisse-vue-ui 0.5.13 → 0.5.15

package/dist/{Skeleton.vue_vue_type_script_setup_true_lang-DR8HFQ2G.cjs → ListSkeleton.vue_vue_type_script_setup_true_lang-CHoagJ0-.cjs}

@@ -2,13 +2,13 @@
 const vue = require("vue");
 const vue$1 = require("@iconify/vue");
 const _pluginVue_exportHelper = require("./_plugin-vue_export-helper-DM9IkUGy.cjs");
-const _hoisted_1$9 = { class: "flex items-center justify-center py-12" };
-const _hoisted_2$7 = { class: "text-center" };
-const _hoisted_3$7 = {
+const _hoisted_1$c = { class: "flex items-center justify-center py-12" };
+const _hoisted_2$a = { class: "text-center" };
+const _hoisted_3$9 = {
   key: 0,
   class: "mt-4 text-gray-600 dark:text-gray-400"
 };
-const _sfc_main$a = /* @__PURE__ */ vue.defineComponent({
+const _sfc_main$d = /* @__PURE__ */ vue.defineComponent({
   __name: "LoadingSpinner",
   props: {
     text: {},
@@ -21,29 +21,29 @@ const _sfc_main$a = /* @__PURE__ */ vue.defineComponent({
       lg: "h-16 w-16"
     };
     return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$9, [
-        vue.createElementVNode("div", _hoisted_2$7, [
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$c, [
+        vue.createElementVNode("div", _hoisted_2$a, [
           vue.createElementVNode("div", {
             class: vue.normalizeClass([sizeClasses[__props.size], "border-primary inline-block animate-spin rounded-full border-4 border-solid border-r-transparent"])
           }, null, 2),
-          __props.text ? (vue.openBlock(), vue.createElementBlock("p", _hoisted_3$7, vue.toDisplayString(__props.text), 1)) : vue.createCommentVNode("", true)
+          __props.text ? (vue.openBlock(), vue.createElementBlock("p", _hoisted_3$9, vue.toDisplayString(__props.text), 1)) : vue.createCommentVNode("", true)
         ])
       ]);
     };
   }
 });
-const _hoisted_1$8 = {
+const _hoisted_1$b = {
   key: 0,
   class: "flex items-center justify-between border-b border-gray-200 px-6 py-4 dark:border-gray-700"
 };
-const _hoisted_2$6 = { class: "text-xl font-semibold text-gray-900 dark:text-gray-100" };
-const _hoisted_3$6 = { class: "sr-only" };
-const _hoisted_4$4 = { class: "flex-1 overflow-y-auto px-6 py-4" };
+const _hoisted_2$9 = { class: "text-xl font-semibold text-gray-900 dark:text-gray-100" };
+const _hoisted_3$8 = { class: "sr-only" };
+const _hoisted_4$6 = { class: "flex-1 overflow-y-auto px-6 py-4" };
 const _hoisted_5$1 = {
   key: 1,
   class: "flex items-center justify-end gap-3 border-t border-gray-200 px-6 py-4 dark:border-gray-700"
 };
-const _sfc_main$9 = /* @__PURE__ */ vue.defineComponent({
+const _sfc_main$c = /* @__PURE__ */ vue.defineComponent({
   __name: "Modal",
   props: {
     title: { default: "" },
@@ -88,8 +88,8 @@ const _sfc_main$9 = /* @__PURE__ */ vue.defineComponent({
         vue.createElementVNode("div", {
           class: vue.normalizeClass([sizeClasses[__props.size], "flex max-h-[90vh] w-full flex-col rounded-lg bg-white shadow-xl dark:bg-gray-900"])
         }, [
-          __props.title || _ctx.$slots.header || _ctx.$slots.title ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$8, [
-            vue.createElementVNode("h3", _hoisted_2$6, [
+          __props.title || _ctx.$slots.header || _ctx.$slots.title ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$b, [
+            vue.createElementVNode("h3", _hoisted_2$9, [
               vue.renderSlot(_ctx.$slots, "header", {}, () => [
                 vue.renderSlot(_ctx.$slots, "title", {}, () => [
                   vue.createTextVNode(vue.toDisplayString(__props.title), 1)
@@ -105,10 +105,10 @@ const _sfc_main$9 = /* @__PURE__ */ vue.defineComponent({
                 class: "h-5 w-5",
                 icon: "lucide:x"
               }),
-              vue.createElementVNode("span", _hoisted_3$6, vue.toDisplayString(__props.closeButtonLabel), 1)
+              vue.createElementVNode("span", _hoisted_3$8, vue.toDisplayString(__props.closeButtonLabel), 1)
             ])
           ])) : vue.createCommentVNode("", true),
-          vue.createElementVNode("div", _hoisted_4$4, [
+          vue.createElementVNode("div", _hoisted_4$6, [
             vue.renderSlot(_ctx.$slots, "default")
           ]),
           _ctx.$slots.footer ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_5$1, [
@@ -119,13 +119,13 @@ const _sfc_main$9 = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const _hoisted_1$7 = {
+const _hoisted_1$a = {
   key: 0,
   class: "flex flex-col sm:flex-row sm:items-center sm:justify-between gap-3 border-t border-gray-200 px-4 sm:px-6 py-4 dark:border-gray-700"
 };
-const _hoisted_2$5 = { class: "flex flex-col sm:flex-row sm:items-center gap-3 sm:gap-4" };
-const _hoisted_3$5 = { class: "text-sm text-gray-700 dark:text-gray-300 text-center sm:text-left" };
-const _hoisted_4$3 = {
+const _hoisted_2$8 = { class: "flex flex-col sm:flex-row sm:items-center gap-3 sm:gap-4" };
+const _hoisted_3$7 = { class: "text-sm text-gray-700 dark:text-gray-300 text-center sm:text-left" };
+const _hoisted_4$5 = {
   key: 0,
   class: "flex items-center justify-center sm:justify-start gap-2"
 };
@@ -140,7 +140,7 @@ const _hoisted_9 = ["disabled"];
 const _hoisted_10 = { class: "hidden sm:inline" };
 const _hoisted_11 = ["disabled"];
 const _hoisted_12 = { class: "hidden sm:inline" };
-const _sfc_main$8 = /* @__PURE__ */ vue.defineComponent({
+const _sfc_main$b = /* @__PURE__ */ vue.defineComponent({
   __name: "PaginationControls",
   props: {
     currentPage: {},
@@ -168,10 +168,10 @@ const _sfc_main$8 = /* @__PURE__ */ vue.defineComponent({
       emit("update:pageSize", Number(target.value));
     };
     return (_ctx, _cache) => {
-      return __props.totalPages > 1 ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$7, [
-        vue.createElementVNode("div", _hoisted_2$5, [
-          vue.createElementVNode("div", _hoisted_3$5, vue.toDisplayString(__props.pageLabel) + " " + vue.toDisplayString(__props.currentPage) + " " + vue.toDisplayString(__props.ofLabel) + " " + vue.toDisplayString(__props.totalPages), 1),
-          __props.showPageSize ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_4$3, [
+      return __props.totalPages > 1 ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$a, [
+        vue.createElementVNode("div", _hoisted_2$8, [
+          vue.createElementVNode("div", _hoisted_3$7, vue.toDisplayString(__props.pageLabel) + " " + vue.toDisplayString(__props.currentPage) + " " + vue.toDisplayString(__props.ofLabel) + " " + vue.toDisplayString(__props.totalPages), 1),
+          __props.showPageSize ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_4$5, [
             vue.createElementVNode("label", _hoisted_5, vue.toDisplayString(__props.itemsPerPageLabel), 1),
             vue.createElementVNode("select", {
               id: "page-size",
@@ -216,17 +216,17 @@ const _sfc_main$8 = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const _hoisted_1$6 = { class: "flex max-w-md items-start space-x-3 rounded-lg border border-gray-200 bg-white p-4 shadow-lg dark:border-gray-800 dark:bg-black" };
-const _hoisted_2$4 = { class: "flex min-w-0 flex-1 flex-col" };
-const _hoisted_3$4 = {
+const _hoisted_1$9 = { class: "flex max-w-md items-start space-x-3 rounded-lg border border-gray-200 bg-white p-4 shadow-lg dark:border-gray-800 dark:bg-black" };
+const _hoisted_2$7 = { class: "flex min-w-0 flex-1 flex-col" };
+const _hoisted_3$6 = {
   key: 0,
   class: "text-sm font-semibold text-gray-900 dark:text-gray-100"
 };
-const _hoisted_4$2 = {
+const _hoisted_4$4 = {
   key: 1,
   class: "mt-1 text-sm text-gray-600 dark:text-gray-400"
 };
-const _sfc_main$7 = /* @__PURE__ */ vue.defineComponent({
+const _sfc_main$a = /* @__PURE__ */ vue.defineComponent({
   __name: "NotificationComponent",
   props: {
     notification: {},
@@ -293,7 +293,7 @@ const _sfc_main$7 = /* @__PURE__ */ vue.defineComponent({
       }
     });
     return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$6, [
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$9, [
         vue.createElementVNode("div", {
           class: vue.normalizeClass([bgColor.value, "flex items-center justify-center rounded-full p-2"])
         }, [
@@ -302,9 +302,9 @@ const _sfc_main$7 = /* @__PURE__ */ vue.defineComponent({
             icon: iconName.value
           }, null, 8, ["class", "icon"])
         ], 2),
-        vue.createElementVNode("div", _hoisted_2$4, [
-          __props.notification.title ? (vue.openBlock(), vue.createElementBlock("h4", _hoisted_3$4, vue.toDisplayString(__props.notification.title), 1)) : vue.createCommentVNode("", true),
-          __props.notification.message ? (vue.openBlock(), vue.createElementBlock("p", _hoisted_4$2, vue.toDisplayString(__props.notification.message), 1)) : vue.createCommentVNode("", true)
+        vue.createElementVNode("div", _hoisted_2$7, [
+          __props.notification.title ? (vue.openBlock(), vue.createElementBlock("h4", _hoisted_3$6, vue.toDisplayString(__props.notification.title), 1)) : vue.createCommentVNode("", true),
+          __props.notification.message ? (vue.openBlock(), vue.createElementBlock("p", _hoisted_4$4, vue.toDisplayString(__props.notification.message), 1)) : vue.createCommentVNode("", true)
         ]),
         vue.createElementVNode("button", {
           class: "shrink-0 text-gray-400 transition-colors hover:text-gray-600 dark:text-gray-600 dark:hover:text-gray-400",
@@ -319,8 +319,8 @@ const _sfc_main$7 = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const _hoisted_1$5 = { class: "fixed top-5 right-5 z-50 flex flex-col gap-3" };
-const _sfc_main$6 = /* @__PURE__ */ vue.defineComponent({
+const _hoisted_1$8 = { class: "fixed top-5 right-5 z-50 flex flex-col gap-3" };
+const _sfc_main$9 = /* @__PURE__ */ vue.defineComponent({
   __name: "NotificationList",
   props: {
     notifications: {},
@@ -331,9 +331,9 @@ const _sfc_main$6 = /* @__PURE__ */ vue.defineComponent({
   setup(__props, { emit: __emit }) {
     const emit = __emit;
     return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$5, [
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$8, [
         (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(__props.notifications, (notification) => {
-          return vue.openBlock(), vue.createBlock(_sfc_main$7, {
+          return vue.openBlock(), vue.createBlock(_sfc_main$a, {
             key: notification.id,
             notification,
             "auto-dismiss": __props.autoDismiss,
@@ -345,13 +345,13 @@ const _sfc_main$6 = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const _hoisted_1$4 = { class: "flex-1" };
-const _hoisted_2$3 = {
+const _hoisted_1$7 = { class: "flex-1" };
+const _hoisted_2$6 = {
   key: 0,
   class: "mb-1 font-medium text-gray-900 dark:text-white"
 };
-const _hoisted_3$3 = { class: "text-sm text-gray-700 dark:text-gray-300" };
-const _sfc_main$5 = /* @__PURE__ */ vue.defineComponent({
+const _hoisted_3$5 = { class: "text-sm text-gray-700 dark:text-gray-300" };
+const _sfc_main$8 = /* @__PURE__ */ vue.defineComponent({
   __name: "Alert",
   props: {
     variant: { default: "info" },
@@ -403,9 +403,9 @@ const _sfc_main$5 = /* @__PURE__ */ vue.defineComponent({
           icon: __props.icon || vue.unref(styles).icon,
           class: vue.normalizeClass(["size-5 shrink-0", vue.unref(styles).iconColor])
         }, null, 8, ["icon", "class"]),
-        vue.createElementVNode("div", _hoisted_1$4, [
-          __props.title ? (vue.openBlock(), vue.createElementBlock("h4", _hoisted_2$3, vue.toDisplayString(__props.title), 1)) : vue.createCommentVNode("", true),
-          vue.createElementVNode("div", _hoisted_3$3, [
+        vue.createElementVNode("div", _hoisted_1$7, [
+          __props.title ? (vue.openBlock(), vue.createElementBlock("h4", _hoisted_2$6, vue.toDisplayString(__props.title), 1)) : vue.createCommentVNode("", true),
+          vue.createElementVNode("div", _hoisted_3$5, [
             vue.renderSlot(_ctx.$slots, "default")
           ])
         ]),
@@ -424,17 +424,17 @@ const _sfc_main$5 = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const _hoisted_1$3 = { class: "py-12 text-center" };
-const _hoisted_2$2 = {
+const _hoisted_1$6 = { class: "py-12 text-center" };
+const _hoisted_2$5 = {
   key: 1,
   class: "mb-2 text-lg font-medium text-gray-900 dark:text-white"
 };
-const _hoisted_3$2 = { class: "text-gray-500 dark:text-gray-400" };
-const _hoisted_4$1 = {
+const _hoisted_3$4 = { class: "text-gray-500 dark:text-gray-400" };
+const _hoisted_4$3 = {
   key: 2,
   class: "mt-4"
 };
-const _sfc_main$4 = /* @__PURE__ */ vue.defineComponent({
+const _sfc_main$7 = /* @__PURE__ */ vue.defineComponent({
   __name: "EmptyState",
   props: {
     message: { default: "No results found" },
@@ -443,32 +443,32 @@ const _sfc_main$4 = /* @__PURE__ */ vue.defineComponent({
   },
   setup(__props) {
     return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$3, [
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$6, [
         __props.icon ? (vue.openBlock(), vue.createBlock(vue.unref(vue$1.Icon), {
           key: 0,
           icon: __props.icon,
           class: "mx-auto mb-4 size-12 text-gray-400 dark:text-gray-500"
         }, null, 8, ["icon"])) : vue.createCommentVNode("", true),
-        __props.title ? (vue.openBlock(), vue.createElementBlock("h3", _hoisted_2$2, vue.toDisplayString(__props.title), 1)) : vue.createCommentVNode("", true),
-        vue.createElementVNode("p", _hoisted_3$2, [
+        __props.title ? (vue.openBlock(), vue.createElementBlock("h3", _hoisted_2$5, vue.toDisplayString(__props.title), 1)) : vue.createCommentVNode("", true),
+        vue.createElementVNode("p", _hoisted_3$4, [
           vue.renderSlot(_ctx.$slots, "default", {}, () => [
             vue.createTextVNode(vue.toDisplayString(__props.message), 1)
           ])
         ]),
-        _ctx.$slots.action ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_4$1, [
+        _ctx.$slots.action ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_4$3, [
           vue.renderSlot(_ctx.$slots, "action")
         ])) : vue.createCommentVNode("", true)
       ]);
     };
   }
 });
-const _hoisted_1$2 = { class: "flex-1 min-w-0" };
-const _hoisted_2$1 = {
+const _hoisted_1$5 = { class: "flex-1 min-w-0" };
+const _hoisted_2$4 = {
   key: 0,
   class: "font-medium text-gray-900 dark:text-white"
 };
-const _hoisted_3$1 = { class: "text-sm text-gray-700 dark:text-gray-300" };
-const _sfc_main$3 = /* @__PURE__ */ vue.defineComponent({
+const _hoisted_3$3 = { class: "text-sm text-gray-700 dark:text-gray-300" };
+const _sfc_main$6 = /* @__PURE__ */ vue.defineComponent({
   __name: "Toast",
   props: {
     message: {},
@@ -521,9 +521,9 @@ const _sfc_main$3 = /* @__PURE__ */ vue.defineComponent({
           icon: vue.unref(config).icon,
           class: vue.normalizeClass(["size-5 shrink-0", vue.unref(config).iconColor])
         }, null, 8, ["icon", "class"]),
-        vue.createElementVNode("div", _hoisted_1$2, [
-          __props.title ? (vue.openBlock(), vue.createElementBlock("p", _hoisted_2$1, vue.toDisplayString(__props.title), 1)) : vue.createCommentVNode("", true),
-          vue.createElementVNode("p", _hoisted_3$1, vue.toDisplayString(__props.message), 1)
+        vue.createElementVNode("div", _hoisted_1$5, [
+          __props.title ? (vue.openBlock(), vue.createElementBlock("p", _hoisted_2$4, vue.toDisplayString(__props.title), 1)) : vue.createCommentVNode("", true),
+          vue.createElementVNode("p", _hoisted_3$3, vue.toDisplayString(__props.message), 1)
         ]),
         __props.closable ? (vue.openBlock(), vue.createElementBlock("button", {
           key: 0,
@@ -540,7 +540,7 @@ const _sfc_main$3 = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const _sfc_main$2 = /* @__PURE__ */ vue.defineComponent({
+const _sfc_main$5 = /* @__PURE__ */ vue.defineComponent({
   __name: "ToastContainer",
   props: {
     toasts: {},
@@ -583,7 +583,7 @@ const _sfc_main$2 = /* @__PURE__ */ vue.defineComponent({
           }, {
             default: vue.withCtx(() => [
               (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(__props.toasts, (toast) => {
-                return vue.openBlock(), vue.createBlock(_sfc_main$3, {
+                return vue.openBlock(), vue.createBlock(_sfc_main$6, {
                   key: toast.id,
                   message: toast.message,
                   type: toast.type,
@@ -600,14 +600,14 @@ const _sfc_main$2 = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const _hoisted_1$1 = { class: "w-full" };
-const _hoisted_2 = {
+const _hoisted_1$4 = { class: "w-full" };
+const _hoisted_2$3 = {
   key: 0,
   class: "mb-1 flex justify-between text-sm"
 };
-const _hoisted_3 = { class: "font-medium text-gray-900 dark:text-white" };
-const _hoisted_4 = ["aria-valuenow", "aria-valuemax"];
-const _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
+const _hoisted_3$2 = { class: "font-medium text-gray-900 dark:text-white" };
+const _hoisted_4$2 = ["aria-valuenow", "aria-valuemax"];
+const _sfc_main$4 = /* @__PURE__ */ vue.defineComponent({
   __name: "Progress",
   props: {
     value: {},
@@ -637,10 +637,10 @@ const _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
       error: "bg-red-500"
     };
     return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$1, [
-        __props.showLabel && !__props.indeterminate ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2, [
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$4, [
+        __props.showLabel && !__props.indeterminate ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$3, [
           _cache[0] || (_cache[0] = vue.createElementVNode("span", { class: "text-gray-600 dark:text-gray-400" }, "Progress", -1)),
-          vue.createElementVNode("span", _hoisted_3, vue.toDisplayString(Math.round(percentage.value)) + "%", 1)
+          vue.createElementVNode("span", _hoisted_3$2, vue.toDisplayString(Math.round(percentage.value)) + "%", 1)
         ])) : vue.createCommentVNode("", true),
         vue.createElementVNode("div", {
           class: vue.normalizeClass([
@@ -662,17 +662,17 @@ const _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
             ]),
             style: vue.normalizeStyle({ width: __props.indeterminate ? "30%" : `${percentage.value}%` })
           }, null, 6)
-        ], 10, _hoisted_4)
+        ], 10, _hoisted_4$2)
       ]);
     };
   }
 });
-const Progress = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main$1, [["__scopeId", "data-v-7ff636cf"]]);
-const _hoisted_1 = {
+const Progress = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main$4, [["__scopeId", "data-v-7ff636cf"]]);
+const _hoisted_1$3 = {
   key: 0,
   class: "space-y-2"
 };
-const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+const _sfc_main$3 = /* @__PURE__ */ vue.defineComponent({
   __name: "Skeleton",
   props: {
     variant: { default: "text" },
@@ -689,7 +689,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
       rounded: "rounded-lg"
     };
     return (_ctx, _cache) => {
-      return __props.variant === "text" && __props.lines > 1 ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
+      return __props.variant === "text" && __props.lines > 1 ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$3, [
         (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(__props.lines, (i) => {
           return vue.openBlock(), vue.createElementBlock("div", {
             key: i,
@@ -719,15 +719,152 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
+const _hoisted_1$2 = { class: "w-full" };
+const _hoisted_2$2 = {
+  key: 0,
+  class: "flex gap-4 px-4 py-3 border-b border-gray-200 dark:border-gray-700"
+};
+const _sfc_main$2 = /* @__PURE__ */ vue.defineComponent({
+  __name: "TableSkeleton",
+  props: {
+    rows: { default: 5 },
+    columns: { default: 4 },
+    showHeader: { type: Boolean, default: true }
+  },
+  setup(__props) {
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$2, [
+        __props.showHeader ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$2, [
+          (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(__props.columns, (col) => {
+            return vue.openBlock(), vue.createElementBlock("div", {
+              key: `header-${col}`,
+              class: "flex-1 h-4 bg-gray-200 dark:bg-gray-700 rounded animate-pulse",
+              style: vue.normalizeStyle({ maxWidth: col === 1 ? "30%" : "20%" })
+            }, null, 4);
+          }), 128))
+        ])) : vue.createCommentVNode("", true),
+        (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(__props.rows, (row) => {
+          return vue.openBlock(), vue.createElementBlock("div", {
+            key: `row-${row}`,
+            class: "flex items-center gap-4 px-4 py-4 border-b border-gray-100 dark:border-gray-800"
+          }, [
+            (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(__props.columns, (col) => {
+              return vue.openBlock(), vue.createElementBlock("div", {
+                key: `cell-${row}-${col}`,
+                class: "flex-1 h-4 bg-gray-200 dark:bg-gray-700 rounded animate-pulse",
+                style: vue.normalizeStyle({
+                  maxWidth: col === 1 ? "40%" : col === __props.columns ? "15%" : "25%",
+                  opacity: 1 - row * 0.1
+                })
+              }, null, 4);
+            }), 128))
+          ]);
+        }), 128))
+      ]);
+    };
+  }
+});
+const _hoisted_1$1 = { class: "bg-white dark:bg-gray-900 rounded-lg shadow-md p-4 space-y-4" };
+const _hoisted_2$1 = {
+  key: 0,
+  class: "flex items-center gap-3"
+};
+const _hoisted_3$1 = { class: "space-y-2" };
+const _hoisted_4$1 = {
+  key: 1,
+  class: "flex justify-end gap-2 pt-2"
+};
+const _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
+  __name: "CardSkeleton",
+  props: {
+    showAvatar: { type: Boolean, default: false },
+    lines: { default: 3 },
+    showActions: { type: Boolean, default: false }
+  },
+  setup(__props) {
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$1, [
+        __props.showAvatar ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$1, [..._cache[0] || (_cache[0] = [
+          vue.createElementVNode("div", { class: "w-10 h-10 rounded-full bg-gray-200 dark:bg-gray-700 animate-pulse" }, null, -1),
+          vue.createElementVNode("div", { class: "flex-1 space-y-2" }, [
+            vue.createElementVNode("div", { class: "h-4 bg-gray-200 dark:bg-gray-700 rounded animate-pulse w-1/2" }),
+            vue.createElementVNode("div", { class: "h-3 bg-gray-200 dark:bg-gray-700 rounded animate-pulse w-1/3" })
+          ], -1)
+        ])])) : vue.createCommentVNode("", true),
+        vue.createElementVNode("div", _hoisted_3$1, [
+          (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(__props.lines, (line) => {
+            return vue.openBlock(), vue.createElementBlock("div", {
+              key: line,
+              class: "h-4 bg-gray-200 dark:bg-gray-700 rounded animate-pulse",
+              style: vue.normalizeStyle({ width: line === __props.lines ? "60%" : "100%" })
+            }, null, 4);
+          }), 128))
+        ]),
+        __props.showActions ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_4$1, [..._cache[1] || (_cache[1] = [
+          vue.createElementVNode("div", { class: "h-8 w-20 bg-gray-200 dark:bg-gray-700 rounded animate-pulse" }, null, -1),
+          vue.createElementVNode("div", { class: "h-8 w-20 bg-gray-200 dark:bg-gray-700 rounded animate-pulse" }, null, -1)
+        ])])) : vue.createCommentVNode("", true)
+      ]);
+    };
+  }
+});
+const _hoisted_1 = { class: "divide-y divide-gray-200 dark:divide-gray-700" };
+const _hoisted_2 = {
+  key: 0,
+  class: "flex-shrink-0 w-10 h-10 rounded-full bg-gray-200 dark:bg-gray-700 animate-pulse"
+};
+const _hoisted_3 = { class: "flex-1 min-w-0 space-y-2" };
+const _hoisted_4 = {
+  key: 1,
+  class: "flex-shrink-0 w-8 h-8 rounded bg-gray-200 dark:bg-gray-700 animate-pulse"
+};
+const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+  __name: "ListSkeleton",
+  props: {
+    items: { default: 5 },
+    showAvatar: { type: Boolean, default: true },
+    showSecondary: { type: Boolean, default: true },
+    showAction: { type: Boolean, default: false }
+  },
+  setup(__props) {
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
+        (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(__props.items, (item) => {
+          return vue.openBlock(), vue.createElementBlock("div", {
+            key: item,
+            class: "flex items-center gap-4 py-4 px-4"
+          }, [
+            __props.showAvatar ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2)) : vue.createCommentVNode("", true),
+            vue.createElementVNode("div", _hoisted_3, [
+              vue.createElementVNode("div", {
+                class: "h-4 bg-gray-200 dark:bg-gray-700 rounded animate-pulse",
+                style: vue.normalizeStyle({ width: `${60 + Math.random() * 30}%` })
+              }, null, 4),
+              __props.showSecondary ? (vue.openBlock(), vue.createElementBlock("div", {
+                key: 0,
+                class: "h-3 bg-gray-200 dark:bg-gray-700 rounded animate-pulse",
+                style: vue.normalizeStyle({ width: `${40 + Math.random() * 20}%` })
+              }, null, 4)) : vue.createCommentVNode("", true)
+            ]),
+            __props.showAction ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_4)) : vue.createCommentVNode("", true)
+          ]);
+        }), 128))
+      ]);
+    };
+  }
+});
 exports.Progress = Progress;
-exports._sfc_main = _sfc_main$a;
-exports._sfc_main$1 = _sfc_main$9;
-exports._sfc_main$2 = _sfc_main$8;
-exports._sfc_main$3 = _sfc_main$7;
-exports._sfc_main$4 = _sfc_main$6;
-exports._sfc_main$5 = _sfc_main$5;
-exports._sfc_main$6 = _sfc_main$4;
-exports._sfc_main$7 = _sfc_main$3;
-exports._sfc_main$8 = _sfc_main$2;
-exports._sfc_main$9 = _sfc_main;
-//# sourceMappingURL=Skeleton.vue_vue_type_script_setup_true_lang-DR8HFQ2G.cjs.map
+exports._sfc_main = _sfc_main$d;
+exports._sfc_main$1 = _sfc_main$c;
+exports._sfc_main$10 = _sfc_main$2;
+exports._sfc_main$11 = _sfc_main$1;
+exports._sfc_main$12 = _sfc_main;
+exports._sfc_main$2 = _sfc_main$b;
+exports._sfc_main$3 = _sfc_main$a;
+exports._sfc_main$4 = _sfc_main$9;
+exports._sfc_main$5 = _sfc_main$8;
+exports._sfc_main$6 = _sfc_main$7;
+exports._sfc_main$7 = _sfc_main$6;
+exports._sfc_main$8 = _sfc_main$5;
+exports._sfc_main$9 = _sfc_main$3;
+//# sourceMappingURL=ListSkeleton.vue_vue_type_script_setup_true_lang-CHoagJ0-.cjs.map