cisse-vue-ui 0.8.4 → 0.9.0

package/dist/ListSkeleton.vue_vue_type_script_setup_true_lang-Bo3HqgX0.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListSkeleton.vue_vue_type_script_setup_true_lang-Bo3HqgX0.cjs","sources":["../src/components/feedback/CardSkeleton.vue","../src/components/feedback/TableSkeleton.vue","../src/components/feedback/PaginationControls.vue","../src/components/feedback/ListSkeleton.vue"],"sourcesContent":["<script lang=\"ts\" setup>\r\nwithDefaults(\r\n  defineProps<{\r\n    /** Show avatar/icon placeholder */\r\n    showAvatar?: boolean\r\n    /** Number of text lines */\r\n    lines?: number\r\n    /** Show action buttons */\r\n    showActions?: boolean\r\n  }>(),\r\n  {\r\n    showAvatar: false,\r\n    lines: 3,\r\n    showActions: false,\r\n  },\r\n)\r\n</script>\r\n\r\n<template>\r\n  <div class=\"bg-white dark:bg-gray-900 rounded-lg shadow-md p-4 space-y-4\" aria-hidden=\"true\">\r\n    <!-- Header with avatar -->\r\n    <div v-if=\"showAvatar\" class=\"flex items-center gap-3\">\r\n      <div class=\"size-10 rounded-full bg-gray-200 dark:bg-gray-700 animate-pulse\" />\r\n      <div class=\"flex-1 space-y-2\">\r\n        <div class=\"h-4 bg-gray-200 dark:bg-gray-700 rounded animate-pulse w-1/2\" />\r\n        <div class=\"h-3 bg-gray-200 dark:bg-gray-700 rounded animate-pulse w-1/3\" />\r\n      </div>\r\n    </div>\r\n\r\n    <!-- Content lines -->\r\n    <div class=\"space-y-2\">\r\n      <div\r\n        v-for=\"line in lines\"\r\n        :key=\"line\"\r\n        class=\"h-4 bg-gray-200 dark:bg-gray-700 rounded animate-pulse\"\r\n        :style=\"{ width: line === lines ? '60%' : '100%' }\"\r\n      />\r\n    </div>\r\n\r\n    <!-- Actions -->\r\n    <div v-if=\"showActions\" class=\"flex justify-end gap-2 pt-2\">\r\n      <div class=\"h-8 w-20 bg-gray-200 dark:bg-gray-700 rounded animate-pulse\" />\r\n      <div class=\"h-8 w-20 bg-gray-200 dark:bg-gray-700 rounded animate-pulse\" />\r\n    </div>\r\n  </div>\r\n</template>\r\n","<script lang=\"ts\" setup>\r\nwithDefaults(\r\n  defineProps<{\r\n    /** Number of rows */\r\n    rows?: number\r\n    /** Number of columns */\r\n    columns?: number\r\n    /** Show header */\r\n    showHeader?: boolean\r\n  }>(),\r\n  {\r\n    rows: 5,\r\n    columns: 4,\r\n    showHeader: true,\r\n  },\r\n)\r\n</script>\r\n\r\n<template>\r\n  <div class=\"w-full\" aria-hidden=\"true\">\r\n    <!-- Header -->\r\n    <div\r\n      v-if=\"showHeader\"\r\n      class=\"flex gap-4 px-4 py-3 border-b border-gray-200 dark:border-gray-700\"\r\n    >\r\n      <div\r\n        v-for=\"col in columns\"\r\n        :key=\"`header-${col}`\"\r\n        class=\"flex-1 h-4 bg-gray-200 dark:bg-gray-700 rounded animate-pulse\"\r\n        :style=\"{ maxWidth: col === 1 ? '30%' : '20%' }\"\r\n      />\r\n    </div>\r\n    <!-- Rows -->\r\n    <div\r\n      v-for=\"row in rows\"\r\n      :key=\"`row-${row}`\"\r\n      class=\"flex items-center gap-4 px-4 py-4 border-b border-gray-100 dark:border-gray-800\"\r\n    >\r\n      <div\r\n        v-for=\"col in columns\"\r\n        :key=\"`cell-${row}-${col}`\"\r\n        class=\"flex-1 h-4 bg-gray-200 dark:bg-gray-700 rounded animate-pulse\"\r\n        :style=\"{\r\n          maxWidth: col === 1 ? '40%' : col === columns ? '15%' : '25%',\r\n          opacity: 1 - (row * 0.1)\r\n        }\"\r\n      />\r\n    </div>\r\n  </div>\r\n</template>\r\n","<script lang=\"ts\" setup>\r\nimport { computed } from 'vue'\r\nimport { Icon } from '@iconify/vue'\r\n\r\nconst {\r\n  currentPage,\r\n  totalPages,\r\n  loading = false,\r\n  pageSize = 10,\r\n  pageSizeOptions = [10, 20, 50, 100],\r\n  showPageSize = true,\r\n  showPageNumbers = true,\r\n  maxVisiblePages = 7,\r\n  pageLabel = 'Page',\r\n  ofLabel = 'of',\r\n  itemsPerPageLabel = 'Items per page:',\r\n  previousLabel = 'Previous',\r\n  nextLabel = 'Next',\r\n} = defineProps<{\r\n  currentPage: number\r\n  totalPages: number\r\n  loading?: boolean\r\n  pageSize?: number\r\n  pageSizeOptions?: number[]\r\n  showPageSize?: boolean\r\n  showPageNumbers?: boolean\r\n  maxVisiblePages?: number\r\n  pageLabel?: string\r\n  ofLabel?: string\r\n  itemsPerPageLabel?: string\r\n  previousLabel?: string\r\n  nextLabel?: string\r\n}>()\r\n\r\ntype PageItem = number | 'ellipsis-start' | 'ellipsis-end'\r\n\r\nconst visiblePages = computed<PageItem[]>(() => {\r\n  if (totalPages <= maxVisiblePages) {\r\n    return Array.from({ length: totalPages }, (_, i) => i + 1)\r\n  }\r\n\r\n  const pages: PageItem[] = []\r\n  const sidePages = Math.floor((maxVisiblePages - 3) / 2)\r\n\r\n  // Always show first page\r\n  pages.push(1)\r\n\r\n  // Calculate range around current page\r\n  let rangeStart = Math.max(2, currentPage - sidePages)\r\n  let rangeEnd = Math.min(totalPages - 1, currentPage + sidePages)\r\n\r\n  // Adjust range to show more pages on one side if near edges\r\n  if (currentPage <= sidePages + 2) {\r\n    rangeEnd = Math.min(totalPages - 1, maxVisiblePages - 2)\r\n  } else if (currentPage >= totalPages - sidePages - 1) {\r\n    rangeStart = Math.max(2, totalPages - maxVisiblePages + 3)\r\n  }\r\n\r\n  // Add ellipsis or pages after first page\r\n  if (rangeStart > 2) {\r\n    pages.push('ellipsis-start')\r\n  }\r\n\r\n  // Add range pages\r\n  for (let i = rangeStart; i <= rangeEnd; i++) {\r\n    pages.push(i)\r\n  }\r\n\r\n  // Add ellipsis or pages before last page\r\n  if (rangeEnd < totalPages - 1) {\r\n    pages.push('ellipsis-end')\r\n  }\r\n\r\n  // Always show last page\r\n  if (totalPages > 1) {\r\n    pages.push(totalPages)\r\n  }\r\n\r\n  return pages\r\n})\r\n\r\nconst emit = defineEmits<{\r\n  'update:page': [page: number]\r\n  'update:pageSize': [size: number]\r\n}>()\r\n\r\nconst changePage = (page: number) => {\r\n  if (page >= 1 && page <= totalPages && !loading) {\r\n    emit('update:page', page)\r\n  }\r\n}\r\n\r\nconst changePageSize = (event: Event) => {\r\n  const target = event.target as HTMLSelectElement\r\n  emit('update:pageSize', Number(target.value))\r\n}\r\n</script>\r\n\r\n<template>\r\n  <div\r\n    v-if=\"totalPages > 1\"\r\n    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\"\r\n  >\r\n    <!-- Info and page size -->\r\n    <div class=\"flex flex-col sm:flex-row sm:items-center gap-3 sm:gap-4\">\r\n      <div class=\"text-sm text-gray-700 dark:text-gray-300 text-center sm:text-left\">\r\n        {{ pageLabel }} {{ currentPage }} {{ ofLabel }} {{ totalPages }}\r\n      </div>\r\n      <div\r\n        v-if=\"showPageSize\"\r\n        class=\"flex items-center justify-center sm:justify-start gap-2\"\r\n      >\r\n        <label\r\n          class=\"text-sm text-gray-600 dark:text-gray-400 hidden sm:inline\"\r\n          for=\"page-size\"\r\n        >\r\n          {{ itemsPerPageLabel }}\r\n        </label>\r\n        <select\r\n          id=\"page-size\"\r\n          :value=\"pageSize\"\r\n          class=\"focus:border-primary focus:ring-primary rounded border border-gray-300 bg-white px-2 py-1 text-sm text-gray-900 dark:border-gray-600 dark:bg-gray-800 dark:text-gray-100\"\r\n          @change=\"changePageSize\"\r\n        >\r\n          <option\r\n            v-for=\"size in pageSizeOptions\"\r\n            :key=\"size\"\r\n            :value=\"size\"\r\n          >\r\n            {{ size }}\r\n          </option>\r\n        </select>\r\n      </div>\r\n    </div>\r\n\r\n    <!-- Navigation buttons -->\r\n    <div class=\"flex justify-center sm:justify-end items-center gap-1\">\r\n      <!-- Previous button -->\r\n      <button\r\n        :disabled=\"currentPage === 1 || loading\"\r\n        class=\"focus:ring-primary inline-flex items-center gap-1 rounded-lg border border-gray-300 bg-white px-3 py-2 text-sm font-medium text-gray-700 hover:bg-gray-50 disabled:cursor-not-allowed disabled:opacity-50 dark:border-gray-600 dark:bg-gray-800 dark:text-gray-200 dark:hover:bg-gray-700\"\r\n        @click=\"changePage(currentPage - 1)\"\r\n      >\r\n        <Icon\r\n          class=\"size-4\"\r\n          icon=\"lucide:chevron-left\"\r\n        />\r\n        <span class=\"hidden sm:inline\">{{ previousLabel }}</span>\r\n      </button>\r\n\r\n      <!-- Page numbers -->\r\n      <template v-if=\"showPageNumbers\">\r\n        <template\r\n          v-for=\"page in visiblePages\"\r\n          :key=\"page\"\r\n        >\r\n          <!-- Ellipsis -->\r\n          <span\r\n            v-if=\"page === 'ellipsis-start' || page === 'ellipsis-end'\"\r\n            class=\"px-2 py-2 text-sm text-gray-500 dark:text-gray-400\"\r\n          >\r\n            …\r\n          </span>\r\n          <!-- Page number button -->\r\n          <button\r\n            v-else\r\n            :disabled=\"loading\"\r\n            :class=\"[\r\n              'min-w-[40px] px-3 py-2 text-sm font-medium rounded-lg border transition-colors',\r\n              page === currentPage\r\n                ? 'bg-primary-600 text-white border-primary-600 dark:bg-primary-500 dark:border-primary-500'\r\n                : 'bg-white text-gray-700 border-gray-300 hover:bg-gray-50 dark:bg-gray-800 dark:text-gray-200 dark:border-gray-600 dark:hover:bg-gray-700',\r\n              loading ? 'cursor-not-allowed opacity-50' : ''\r\n            ]\"\r\n            @click=\"changePage(page)\"\r\n          >\r\n            {{ page }}\r\n          </button>\r\n        </template>\r\n      </template>\r\n\r\n      <!-- Next button -->\r\n      <button\r\n        :disabled=\"currentPage === totalPages || loading\"\r\n        class=\"focus:ring-primary inline-flex items-center gap-1 rounded-lg border border-gray-300 bg-white px-3 py-2 text-sm font-medium text-gray-700 hover:bg-gray-50 disabled:cursor-not-allowed disabled:opacity-50 dark:border-gray-600 dark:bg-gray-800 dark:text-gray-200 dark:hover:bg-gray-700\"\r\n        @click=\"changePage(currentPage + 1)\"\r\n      >\r\n        <span class=\"hidden sm:inline\">{{ nextLabel }}</span>\r\n        <Icon\r\n          class=\"size-4\"\r\n          icon=\"lucide:chevron-right\"\r\n        />\r\n      </button>\r\n    </div>\r\n  </div>\r\n</template>\r\n","<script lang=\"ts\" setup>\r\nwithDefaults(\r\n  defineProps<{\r\n    /** Number of items */\r\n    items?: number\r\n    /** Show avatar/icon placeholder */\r\n    showAvatar?: boolean\r\n    /** Show secondary text */\r\n    showSecondary?: boolean\r\n    /** Show action button */\r\n    showAction?: boolean\r\n  }>(),\r\n  {\r\n    items: 5,\r\n    showAvatar: true,\r\n    showSecondary: true,\r\n    showAction: false,\r\n  },\r\n)\r\n</script>\r\n\r\n<template>\r\n  <div class=\"divide-y divide-gray-200 dark:divide-gray-700\" aria-hidden=\"true\">\r\n    <div\r\n      v-for=\"item in items\"\r\n      :key=\"item\"\r\n      class=\"flex items-center gap-4 py-4 px-4\"\r\n    >\r\n      <!-- Avatar -->\r\n      <div\r\n        v-if=\"showAvatar\"\r\n        class=\"shrink-0 size-10 rounded-full bg-gray-200 dark:bg-gray-700 animate-pulse\"\r\n      />\r\n\r\n      <!-- Content -->\r\n      <div class=\"flex-1 min-w-0 space-y-2\">\r\n        <div\r\n          class=\"h-4 bg-gray-200 dark:bg-gray-700 rounded animate-pulse\"\r\n          :style=\"{ width: `${60 + Math.random() * 30}%` }\"\r\n        />\r\n        <div\r\n          v-if=\"showSecondary\"\r\n          class=\"h-3 bg-gray-200 dark:bg-gray-700 rounded animate-pulse\"\r\n          :style=\"{ width: `${40 + Math.random() * 20}%` }\"\r\n        />\r\n      </div>\r\n\r\n      <!-- Action -->\r\n      <div\r\n        v-if=\"showAction\"\r\n        class=\"shrink-0 size-8 rounded bg-gray-200 dark:bg-gray-700 animate-pulse\"\r\n      />\r\n    </div>\r\n  </div>\r\n</template>\r\n"],"names":["_openBlock","_createElementBlock","_hoisted_1","_hoisted_2","_createElementVNode","_hoisted_3","_Fragment","_renderList","_normalizeStyle","_hoisted_4","computed","_toDisplayString","_createVNode","_unref","Icon","_normalizeClass"],"mappings":"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"}

package/dist/components/core/AccordionItem.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/core/Breadcrumb.stories.d.ts

@@ -9,3 +9,8 @@ export declare const WithIcons: Story;
 export declare const NoHomeIcon: Story;
 export declare const SingleItem: Story;
 export declare const LongPath: Story;
+export declare const EcommercePath: Story;
+export declare const AdminPath: Story;
+export declare const DocumentationPath: Story;
+export declare const WithMaxItems: Story;
+export declare const StatesDemo: Story;

package/dist/components/core/CardWrapper.stories.d.ts

@@ -0,0 +1,32 @@
+import { Meta, StoryObj } from '@storybook/vue3-vite';
+import { default as CardWrapper } from './CardWrapper.vue';
+declare const meta: Meta<typeof CardWrapper>;
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;
+export declare const WithTitleAndIcon: Story;
+export declare const WithActions: Story;
+export declare const WithFooter: Story;
+export declare const ShadowVariants: Story;
+export declare const RoundedVariants: Story;
+export declare const BorderVariants: Story;
+export declare const Variants: Story;
+export declare const PaddingVariants: Story;
+export declare const HeaderPaddingVariants: Story;
+export declare const NoDividers: Story;
+export declare const CustomClasses: Story;
+export declare const CustomIconSlot: Story;
+export declare const Loading: Story;
+export declare const LoadingWithOptions: Story;
+export declare const AccentVariants: Story;
+export declare const Clickable: Story;
+export declare const Selected: Story;
+export declare const Disabled: Story;
+export declare const ImageTop: Story;
+export declare const ImageLeft: Story;
+export declare const ImageBackground: Story;
+export declare const ImagePositions: Story;
+export declare const InteractiveStates: Story;
+export declare const ProductCard: Story;
+export declare const BlogPostCard: Story;
+export declare const CompleteExample: Story;

package/dist/components/core/CardWrapper.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/core/CardWrapper.vue.d.ts

@@ -0,0 +1,129 @@
+export type CardShadow = 'none' | 'sm' | 'md' | 'lg' | 'xl';
+export type CardRounded = 'none' | 'sm' | 'md' | 'lg' | 'xl' | 'full';
+export type CardPadding = 'none' | 'sm' | 'md' | 'lg';
+export type CardBorder = 'none' | 'default' | 'primary' | 'secondary';
+export type CardVariant = 'default' | 'glass' | 'outline' | 'flat';
+export type CardAccent = 'none' | 'primary' | 'secondary' | 'success' | 'warning' | 'danger' | 'info';
+export type CardImagePosition = 'top' | 'bottom' | 'left' | 'right' | 'background';
+type __VLS_Props = {
+    /** Card title */
+    title?: string;
+    /** Card description */
+    description?: string;
+    /** Header icon (Iconify format) */
+    icon?: string;
+    /** Shadow level */
+    shadow?: CardShadow;
+    /** Border radius */
+    rounded?: CardRounded;
+    /** Content padding (defaults to none for CardComponent compatibility) */
+    padding?: CardPadding;
+    /** Header/footer padding (defaults to md to match CardComponent header) */
+    headerPadding?: CardPadding;
+    /** Border style */
+    border?: CardBorder;
+    /** Visual variant */
+    variant?: CardVariant;
+    /** Colored accent border (top or left depending on layout) */
+    accent?: CardAccent;
+    /** Show header divider */
+    headerDivider?: boolean;
+    /** Show footer divider */
+    footerDivider?: boolean;
+    /** Make card clickable with hover effects */
+    clickable?: boolean;
+    /** Selected state (adds visual indicator) */
+    selected?: boolean;
+    /** Disabled state */
+    disabled?: boolean;
+    /** Image URL for card media */
+    image?: string;
+    /** Image alt text */
+    imageAlt?: string;
+    /** Image position */
+    imagePosition?: CardImagePosition;
+    /** Image height (for top/bottom positions) */
+    imageHeight?: string;
+    /** Image width (for left/right positions) */
+    imageWidth?: string;
+    /** Loading state */
+    loading?: boolean;
+    /** Number of skeleton lines */
+    loadingLines?: number;
+    /** Show avatar in skeleton */
+    loadingAvatar?: boolean;
+    /** Show actions in skeleton */
+    loadingActions?: boolean;
+    /** Custom class for the card container */
+    cardClass?: string;
+    /** Custom class for the header section */
+    headerClass?: string;
+    /** Custom class for the title */
+    titleClass?: string;
+    /** Custom class for the description */
+    descriptionClass?: string;
+    /** Custom class for the icon wrapper */
+    iconClass?: string;
+    /** Custom class for the icon element */
+    iconElementClass?: string;
+    /** Custom class for the content/body */
+    contentClass?: string;
+    /** Custom class for the footer */
+    footerClass?: string;
+    /** Custom class for dividers */
+    dividerClass?: string;
+    /** Custom class for the actions container */
+    actionsClass?: string;
+    /** Custom class for the image */
+    imageClass?: string;
+};
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        image?(_: {}): any;
+        image?(_: {}): any;
+        image?(_: {}): any;
+        header?(_: {}): any;
+        icon?(_: {}): any;
+        title?(_: {}): any;
+        description?(_: {}): any;
+        actions?(_: {}): any;
+        default?(_: {}): any;
+        footer?(_: {}): any;
+    };
+    refs: {};
+    rootEl: any;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    click: (event: MouseEvent) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onClick?: ((event: MouseEvent) => any) | undefined;
+}>, {
+    rounded: CardRounded;
+    loading: boolean;
+    loadingLines: number;
+    loadingAvatar: boolean;
+    loadingActions: boolean;
+    shadow: CardShadow;
+    padding: CardPadding;
+    headerPadding: CardPadding;
+    border: CardBorder;
+    variant: CardVariant;
+    accent: CardAccent;
+    headerDivider: boolean;
+    footerDivider: boolean;
+    clickable: boolean;
+    selected: boolean;
+    disabled: boolean;
+    imagePosition: CardImagePosition;
+    imageHeight: string;
+    imageWidth: string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/core/CollapsibleCard.vue.d.ts

@@ -25,9 +25,9 @@ declare function __VLS_template(): {
 };
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
 declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
-    defaultExpanded: boolean;
     headerClass: string;
     contentClass: string;
+    defaultExpanded: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;

package/dist/components/core/DataTable.stories.d.ts

@@ -0,0 +1,38 @@
+import { Meta, StoryObj } from '@storybook/vue3-vite';
+import { DataTable as TableComponent } from './table';
+declare const meta: Meta<typeof TableComponent>;
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;
+export declare const WithTypes: Story;
+export declare const WithBadge: Story;
+export declare const WithAlignment: Story;
+export declare const Selectable: Story;
+export declare const WithActions: Story;
+export declare const WithCustomSlot: Story;
+export declare const EmptyStateBasic: Story;
+export declare const NestedProperties: Story;
+export declare const Loading: Story;
+export declare const LoadingCustomRows: Story;
+export declare const Striped: Story;
+export declare const Bordered: Story;
+export declare const Compact: Story;
+export declare const NoHover: Story;
+export declare const StickyHeader: Story;
+export declare const ClickableRows: Story;
+export declare const AllFeatures: Story;
+export declare const EmptyState: Story;
+export declare const CustomEmptyState: Story;
+export declare const ErrorState: Story;
+export declare const CustomErrorState: Story;
+export declare const WithColumnVisibility: Story;
+export declare const WithPagination: Story;
+export declare const PaginationCustomPageSize: Story;
+export declare const PaginationControlled: Story;
+export declare const PaginationServerSide: Story;
+export declare const PaginationWithSelection: Story;
+export declare const PaginationNoPageSizeSelector: Story;
+export declare const WithPinnedRows: Story;
+export declare const WithEditableCells: Story;
+export declare const WithVirtualScroll: Story;
+export declare const WithResizableColumns: Story;

package/dist/components/core/Dropdown.vue.d.ts

@@ -40,8 +40,8 @@ declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}
     onSelect?: ((item: DropdownItem) => any) | undefined;
 }>, {
     width: "auto" | "full" | "sm" | "md" | "lg";
-    teleport: boolean;
     align: "left" | "right";
+    teleport: boolean;
     items: DropdownItem[];
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
     triggerRef: HTMLDivElement;

package/dist/components/core/Popover.vue.d.ts

@@ -28,9 +28,9 @@ declare function __VLS_template(): {
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
 declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
     width: "auto" | "sm" | "md" | "lg";
-    teleport: boolean;
-    position: PopoverPosition;
     hover: boolean;
+    position: PopoverPosition;
+    teleport: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
     triggerRef: HTMLDivElement;
     popoverRef: HTMLDivElement;

package/dist/components/core/Tooltip.stories.d.ts

@@ -8,3 +8,6 @@ export declare const Positions: Story;
 export declare const WithDelay: Story;
 export declare const Disabled: Story;
 export declare const OnIcons: Story;
+export declare const AllPositions: Story;
+export declare const LongContent: Story;
+export declare const OnText: Story;

package/dist/components/core/index.cjs

@@ -1,31 +1,48 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const FilterTabs_vue_vue_type_script_setup_true_lang = require("../../FilterTabs.vue_vue_type_script_setup_true_lang-DYxh-wFx.cjs");
+const FilterTabs_vue_vue_type_script_setup_true_lang = require("../../FilterTabs.vue_vue_type_script_setup_true_lang-COkZbeGG.cjs");
 const Dropdown_vue_vue_type_script_setup_true_lang = require("../../Dropdown.vue_vue_type_script_setup_true_lang-BAKGRZIb.cjs");
 const BadgeType_vue_vue_type_script_setup_true_lang = require("../../BadgeType.vue_vue_type_script_setup_true_lang-zs0NXN4g.cjs");
 const Button_vue_vue_type_script_setup_true_lang = require("../../Button.vue_vue_type_script_setup_true_lang-CXRj7LEP.cjs");
-exports.Accordion = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$15;
-exports.AccordionItem = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$16;
-exports.AutocompleteComponent = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$4;
-exports.Avatar = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$6;
-exports.Breadcrumb = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$14;
+exports.Accordion = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$30;
+exports.AccordionItem = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$31;
+exports.AutocompleteComponent = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$19;
+exports.Avatar = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$21;
+exports.Breadcrumb = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$29;
+exports.Caption = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$3;
 exports.CardComponent = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main;
-exports.CollapsibleCard = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$10;
-exports.DarkModeToggle = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$18;
-exports.Drawer = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$13;
-exports.FilterTabs = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$21;
-exports.MobileList = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$2;
-exports.Popover = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$12;
-exports.ResponsiveList = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$3;
-exports.StatsCard = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$19;
-exports.StatsGrid = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$20;
-exports.Stepper = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$9;
-exports.TabPanel = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$8;
-exports.TableAction = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$5;
-exports.TableComponent = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$1;
-exports.Tabs = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$7;
-exports.Timeline = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$17;
-exports.Tooltip = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$11;
+exports.CardWrapper = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$1;
+exports.Col = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$5;
+exports.Colgroup = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$4;
+exports.CollapsibleCard = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$25;
+exports.DarkModeToggle = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$33;
+exports.DataTable = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$16;
+exports.Drawer = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$28;
+exports.ExpandableRow = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$15;
+exports.FilterTabs = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$36;
+exports.MobileList = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$17;
+exports.Popover = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$27;
+exports.ResponsiveList = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$18;
+exports.StatsCard = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$34;
+exports.StatsGrid = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$35;
+exports.Stepper = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$24;
+exports.TabPanel = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$23;
+exports.Table = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$2;
+exports.TableAction = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$20;
+exports.TableComponent = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$16;
+exports.TableContextKey = FilterTabs_vue_vue_type_script_setup_true_lang.TableContextKey;
+exports.TableFooter = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$14;
+exports.TableHeader = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$12;
+exports.TableRow = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$13;
+exports.Tabs = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$22;
+exports.Tbody = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$7;
+exports.Td = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$11;
+exports.Tfoot = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$8;
+exports.Th = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$10;
+exports.Thead = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$6;
+exports.Timeline = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$32;
+exports.Tooltip = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$26;
+exports.Tr = FilterTabs_vue_vue_type_script_setup_true_lang._sfc_main$9;
 exports.Dropdown = Dropdown_vue_vue_type_script_setup_true_lang._sfc_main$1;
 exports.MenuItem = Dropdown_vue_vue_type_script_setup_true_lang._sfc_main;
 exports.StatusBadge = BadgeType_vue_vue_type_script_setup_true_lang._sfc_main;

package/dist/components/core/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/core/index.d.ts

@@ -1,5 +1,8 @@
 export { default as CardComponent } from './CardComponent.vue';
-export { default as TableComponent } from './TableComponent.vue';
+export { default as CardWrapper } from './CardWrapper.vue';
+export type { CardShadow, CardRounded, CardPadding, CardBorder, CardVariant, CardAccent, CardImagePosition, } from './CardWrapper.vue';
+export { Table, TableContextKey, type TableContext, Caption, Colgroup, Col, Thead, Tbody, Tfoot, Tr, Th, type SortDirection, Td, TableHeader, TableRow, TableFooter, ExpandableRow, DataTable, } from './table';
+export { DataTable as TableComponent } from './table';
 export { default as MobileList } from './MobileList.vue';
 export { default as ResponsiveList } from './ResponsiveList.vue';
 export { default as AutocompleteComponent } from './AutocompleteComponent.vue';

package/dist/components/core/index.js

@@ -1,33 +1,50 @@
-import { o, p, d, f, n, _, j, r, m, u, b, l, c, s, t, i, h, e, a, g, q, k } from "../../FilterTabs.vue_vue_type_script_setup_true_lang-BmJHgkBs.js";
+import { D, E, s, u, C, c, _, a, e, d, y, G, p, B, o, J, q, A, r, H, I, x, w, b, t, p as p2, T, n, l, m, v, g, k, h, j, f, F, z, i } from "../../FilterTabs.vue_vue_type_script_setup_true_lang-CzpYHtc5.js";
 import { a as a2, _ as _2 } from "../../Dropdown.vue_vue_type_script_setup_true_lang-GLCX7E3C.js";
 import { _ as _3 } from "../../BadgeType.vue_vue_type_script_setup_true_lang-tHRMWBb-.js";
 import { _ as _4 } from "../../Button.vue_vue_type_script_setup_true_lang-CBYr0Z2_.js";
 export {
-  o as Accordion,
-  p as AccordionItem,
-  d as AutocompleteComponent,
-  f as Avatar,
-  n as Breadcrumb,
+  D as Accordion,
+  E as AccordionItem,
+  s as AutocompleteComponent,
+  u as Avatar,
+  C as Breadcrumb,
   _4 as Button,
+  c as Caption,
   _ as CardComponent,
-  j as CollapsibleCard,
-  r as DarkModeToggle,
-  m as Drawer,
+  a as CardWrapper,
+  e as Col,
+  d as Colgroup,
+  y as CollapsibleCard,
+  G as DarkModeToggle,
+  p as DataTable,
+  B as Drawer,
   a2 as Dropdown,
-  u as FilterTabs,
+  o as ExpandableRow,
+  J as FilterTabs,
   _2 as MenuItem,
-  b as MobileList,
-  l as Popover,
-  c as ResponsiveList,
-  s as StatsCard,
-  t as StatsGrid,
+  q as MobileList,
+  A as Popover,
+  r as ResponsiveList,
+  H as StatsCard,
+  I as StatsGrid,
   _3 as StatusBadge,
-  i as Stepper,
-  h as TabPanel,
-  e as TableAction,
-  a as TableComponent,
-  g as Tabs,
-  q as Timeline,
-  k as Tooltip
+  x as Stepper,
+  w as TabPanel,
+  b as Table,
+  t as TableAction,
+  p2 as TableComponent,
+  T as TableContextKey,
+  n as TableFooter,
+  l as TableHeader,
+  m as TableRow,
+  v as Tabs,
+  g as Tbody,
+  k as Td,
+  h as Tfoot,
+  j as Th,
+  f as Thead,
+  F as Timeline,
+  z as Tooltip,
+  i as Tr
 };
 //# sourceMappingURL=index.js.map

package/dist/components/core/table/DataTable.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/core/{TableComponent.vue.d.ts → table/DataTable.vue.d.ts}

@@ -1,5 +1,5 @@
-import { Property } from '../../types';
-export type SortDirection = 'asc' | 'desc';
+import { Property } from '../../../types';
+import { SortDirection } from './atoms/Th.vue';
 type ItemType = {
     id: number | string;
     [key: string]: unknown;
@@ -15,7 +15,7 @@ type __VLS_Props = {
     selectedItems?: Set<string>;
     /** Filter function to determine if an item is selectable */
     selectableFilter?: (item: ItemType) => boolean;
-    /** Key field for unique identification (default: 'id') */
+    /** Key field for unique identification */
     keyField?: string;
     /** Current sort column */
     sortBy?: string;
@@ -25,18 +25,53 @@ type __VLS_Props = {
     loading?: boolean;
     /** Number of skeleton rows to show when loading */
     loadingRows?: number;
+    /** Whether there is an error to display */
+    error?: boolean;
+    /** Error message to display (if error slot not provided) */
+    errorMessage?: string;
+    /** Enable alternating row colors */
+    striped?: boolean;
+    /** Show cell borders */
+    bordered?: boolean;
+    /** Enable row hover effect */
+    hover?: boolean;
+    /** Use compact padding */
+    compact?: boolean;
+    /** Make header sticky on scroll */
+    stickyHeader?: boolean;
+    /** Make rows clickable */
+    clickableRows?: boolean;
+    /** Enable client-side pagination */
+    paginated?: boolean;
+    /** Number of items per page */
+    pageSize?: number;
+    /** Available page size options */
+    pageSizeOptions?: number[];
+    /** Show page size selector */
+    showPageSize?: boolean;
+    /** Current page (1-indexed, for controlled pagination) */
+    currentPage?: number;
+    /** Total items (for server-side pagination) */
+    totalItems?: number;
 };
 declare function __VLS_template(): {
     attrs: Partial<{}>;
     slots: Partial<Record<string, (_: {
-        property: Property;
+        column: Property;
     }) => any>> & Partial<Record<string, (_: {
-        item: ItemType;
-        property: Property;
+        item: {
+            [key: string]: unknown;
+            id: number | string;
+        };
         value: unknown;
+        column: Property;
     }) => any>> & {
+        error?(_: {}): any;
         action?(_: {
-            item: ItemType;
+            item: {
+                [key: string]: unknown;
+                id: number | string;
+            };
         }): any;
         empty?(_: {}): any;
     };
@@ -48,15 +83,33 @@ declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}
     sort: (column: string, direction: SortDirection) => any;
     select: (id: string) => any;
     selectAll: () => any;
+    "update:pageSize": (size: number) => any;
+    rowClick: (item: ItemType, event: MouseEvent) => any;
+    "update:currentPage": (page: number) => any;
 }, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
     onSort?: ((column: string, direction: SortDirection) => any) | undefined;
     onSelect?: ((id: string) => any) | undefined;
     onSelectAll?: (() => any) | undefined;
+    "onUpdate:pageSize"?: ((size: number) => any) | undefined;
+    onRowClick?: ((item: ItemType, event: MouseEvent) => any) | undefined;
+    "onUpdate:currentPage"?: ((page: number) => any) | undefined;
 }>, {
     loading: boolean;
+    striped: boolean;
+    bordered: boolean;
+    hover: boolean;
+    compact: boolean;
+    stickyHeader: boolean;
+    error: boolean;
     selectable: boolean;
+    pageSize: number;
+    pageSizeOptions: number[];
+    showPageSize: boolean;
     keyField: string;
     loadingRows: number;
+    errorMessage: string;
+    clickableRows: boolean;
+    paginated: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;

package/dist/components/core/table/Table.stories.d.ts

@@ -0,0 +1,27 @@
+import { Meta, StoryObj } from '@storybook/vue3-vite';
+import { Table } from './index';
+declare const meta: Meta<typeof Table>;
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const BasicTable: Story;
+export declare const StripedTable: Story;
+export declare const BorderedTable: Story;
+export declare const CompactTable: Story;
+export declare const SortableHeaders: Story;
+export declare const ClickableRows: Story;
+export declare const SelectableRows: Story;
+export declare const WithFooter: Story;
+export declare const ColumnWidths: Story;
+export declare const TruncatedCells: Story;
+export declare const DisabledRows: Story;
+export declare const ColspanRowspan: Story;
+export declare const MultipleTheadTbody: Story;
+export declare const RowGrouping: Story;
+export declare const WithColgroup: Story;
+export declare const ComplexLayout: Story;
+export declare const WithCaption: Story;
+export declare const CaptionBottom: Story;
+export declare const ScreenReaderOnlyCaption: Story;
+export declare const ExpandableRows: Story;
+export declare const ExpandableRowsControlled: Story;
+export declare const ExpandableRowsOnRowClick: Story;

package/dist/components/core/table/atoms/Caption.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/core/table/atoms/Caption.vue.d.ts

@@ -0,0 +1,26 @@
+type __VLS_Props = {
+    /** Position of the caption */
+    position?: 'top' | 'bottom';
+    /** Visually hide caption but keep for screen readers */
+    srOnly?: boolean;
+};
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: any;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    position: "top" | "bottom";
+    srOnly: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/core/table/atoms/Col.test.d.ts

@@ -0,0 +1 @@
+export {};