@zentauri-ui/zentauri-components 2.1.6 → 2.1.8

package/cli/props.json

@@ -5308,6 +5308,279 @@
         }
       ]
     },
+    "data-table": {
+      "slug": "data-table",
+      "subcomponents": [
+        {
+          "name": "static:DataTable",
+          "displayName": "DataTable",
+          "propsType": "DataTableProps",
+          "source": "static",
+          "props": [
+            {
+              "name": "appearance",
+              "type": "'default' | 'ghost' | 'blue' | 'cyan' | 'green' | 'lime' | 'mint' | 'ocean' | 'sapphire' | 'lavender' | 'ruby' | 'red' | 'slate' | 'zinc' | 'stone' | 'royal' | 'electric' | 'forest' | 'sunset' | 'magenta' | 'crimson' | 'aqua' | 'plum' | 'sky' | 'rose' | 'purple' | 'pink' | 'orange' | 'yellow' | 'teal' | 'indigo' | 'emerald' | 'gray' | 'violet' | 'amber' | 'striped' | 'bordered' | null | undefined",
+              "required": false,
+              "group": "behavior",
+              "deprecated": false
+            },
+            {
+              "name": "bulkActions",
+              "type": "readonly DataTableBulkAction<TData>[] | undefined",
+              "required": false,
+              "group": "behavior",
+              "deprecated": false
+            },
+            {
+              "name": "caption",
+              "type": "ReactNode",
+              "required": false,
+              "group": "behavior",
+              "deprecated": false
+            },
+            {
+              "name": "columns",
+              "type": "readonly DataTableColumn<TData, TKey>[]",
+              "required": true,
+              "group": "behavior",
+              "deprecated": false
+            },
+            {
+              "name": "data",
+              "type": "readonly TData[]",
+              "required": true,
+              "group": "behavior",
+              "deprecated": false
+            },
+            {
+              "name": "defaultSelectedRowIds",
+              "type": "readonly string[] | undefined",
+              "required": false,
+              "group": "behavior",
+              "deprecated": false
+            },
+            {
+              "name": "defaultSortDirection",
+              "type": "TableSortDirection | undefined",
+              "required": false,
+              "group": "behavior",
+              "deprecated": false
+            },
+            {
+              "name": "defaultSortKey",
+              "type": "TKey | undefined",
+              "required": false,
+              "group": "behavior",
+              "deprecated": false
+            },
+            {
+              "name": "defaultVisibleColumnIds",
+              "type": "readonly TKey[] | undefined",
+              "required": false,
+              "group": "behavior",
+              "deprecated": false
+            },
+            {
+              "name": "emptyContent",
+              "type": "ReactNode",
+              "required": false,
+              "group": "behavior",
+              "deprecated": false
+            },
+            {
+              "name": "enableColumnVisibility",
+              "type": "boolean | undefined",
+              "required": false,
+              "group": "behavior",
+              "deprecated": false
+            },
+            {
+              "name": "enableRowSelection",
+              "type": "boolean | undefined",
+              "required": false,
+              "group": "behavior",
+              "deprecated": false
+            },
+            {
+              "name": "getRowId",
+              "type": "((row: TData, index: number) => string) | undefined",
+              "required": false,
+              "group": "behavior",
+              "deprecated": false
+            },
+            {
+              "name": "loading",
+              "type": "boolean | undefined",
+              "required": false,
+              "group": "behavior",
+              "deprecated": false
+            },
+            {
+              "name": "loadingContent",
+              "type": "ReactNode",
+              "required": false,
+              "group": "behavior",
+              "deprecated": false
+            },
+            {
+              "name": "onColumnVisibilityChange",
+              "type": "((visibleColumnIds: TKey[]) => void) | undefined",
+              "required": false,
+              "group": "behavior",
+              "deprecated": false
+            },
+            {
+              "name": "onRowSelectionChange",
+              "type": "((selectedRowIds: string[], selectedRows: TData[]) => void) | undefined",
+              "required": false,
+              "group": "behavior",
+              "deprecated": false
+            },
+            {
+              "name": "onSortChange",
+              "type": "((sort: { sortKey?: TKey; sortDirection: TableSortDirection; }) => void) | undefined",
+              "required": false,
+              "group": "behavior",
+              "deprecated": false
+            },
+            {
+              "name": "pagination",
+              "type": "boolean | DataTablePaginationOptions | undefined",
+              "required": false,
+              "group": "behavior",
+              "deprecated": false
+            },
+            {
+              "name": "ref",
+              "type": "Ref<HTMLElement> | undefined",
+              "required": false,
+              "group": "behavior",
+              "description": "Allows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).",
+              "deprecated": false
+            },
+            {
+              "name": "search",
+              "type": "boolean | DataTableSearchOptions<TKey> | undefined",
+              "required": false,
+              "group": "behavior",
+              "deprecated": false
+            },
+            {
+              "name": "selectedRowIds",
+              "type": "readonly string[] | undefined",
+              "required": false,
+              "group": "behavior",
+              "deprecated": false
+            },
+            {
+              "name": "showRowCount",
+              "type": "boolean | undefined",
+              "required": false,
+              "group": "behavior",
+              "deprecated": false
+            },
+            {
+              "name": "size",
+              "type": "'md' | 'sm' | 'lg' | null | undefined",
+              "required": false,
+              "group": "behavior",
+              "deprecated": false
+            },
+            {
+              "name": "sortDirection",
+              "type": "TableSortDirection | undefined",
+              "required": false,
+              "group": "behavior",
+              "deprecated": false
+            },
+            {
+              "name": "sortKey",
+              "type": "TKey | undefined",
+              "required": false,
+              "group": "behavior",
+              "deprecated": false
+            },
+            {
+              "name": "stickyHeader",
+              "type": "boolean | null | undefined",
+              "required": false,
+              "group": "behavior",
+              "deprecated": false
+            },
+            {
+              "name": "tableClassName",
+              "type": "string | undefined",
+              "required": false,
+              "group": "behavior",
+              "deprecated": false
+            },
+            {
+              "name": "tableScrollAreaAriaLabel",
+              "type": "string | undefined",
+              "required": false,
+              "group": "behavior",
+              "deprecated": false
+            },
+            {
+              "name": "textAlign",
+              "type": "'center' | 'left' | 'right' | undefined",
+              "required": false,
+              "group": "behavior",
+              "deprecated": false
+            },
+            {
+              "name": "virtualization",
+              "type": "DataTableVirtualizationOptions | undefined",
+              "required": false,
+              "group": "behavior",
+              "deprecated": false
+            },
+            {
+              "name": "visibleColumnIds",
+              "type": "readonly TKey[] | undefined",
+              "required": false,
+              "group": "behavior",
+              "deprecated": false
+            },
+            {
+              "name": "className",
+              "type": "string | undefined",
+              "required": false,
+              "group": "dom",
+              "deprecated": false
+            },
+            {
+              "name": "id",
+              "type": "string | undefined",
+              "required": false,
+              "group": "dom",
+              "deprecated": false
+            },
+            {
+              "name": "onClick",
+              "type": "MouseEventHandler<HTMLElement> | undefined",
+              "required": false,
+              "group": "dom",
+              "deprecated": false
+            },
+            {
+              "name": "style",
+              "type": "CSSProperties | undefined",
+              "required": false,
+              "group": "dom",
+              "deprecated": false
+            },
+            {
+              "name": "title",
+              "type": "string | undefined",
+              "required": false,
+              "group": "dom",
+              "deprecated": false
+            }
+          ]
+        }
+      ]
+    },
     "divider": {
       "slug": "divider",
       "subcomponents": [
@@ -5979,9 +6252,44 @@
             {
               "name": "children",
               "type": "ReactNode",
-              "required": true,
+              "required": false,
               "group": "content",
               "deprecated": false
+            },
+            {
+              "name": "className",
+              "type": "string | undefined",
+              "required": false,
+              "group": "dom",
+              "deprecated": false
+            },
+            {
+              "name": "id",
+              "type": "string | undefined",
+              "required": false,
+              "group": "dom",
+              "deprecated": false
+            },
+            {
+              "name": "onClick",
+              "type": "MouseEventHandler<HTMLDivElement> | undefined",
+              "required": false,
+              "group": "dom",
+              "deprecated": false
+            },
+            {
+              "name": "style",
+              "type": "CSSProperties | undefined",
+              "required": false,
+              "group": "dom",
+              "deprecated": false
+            },
+            {
+              "name": "title",
+              "type": "string | undefined",
+              "required": false,
+              "group": "dom",
+              "deprecated": false
             }
           ]
         },
@@ -6064,8 +6372,8 @@
           "props": [
             {
               "name": "value",
-              "type": "string",
-              "required": true,
+              "type": "string | undefined",
+              "required": false,
               "group": "controlled",
               "deprecated": false
             },
@@ -12455,6 +12763,157 @@
         }
       ]
     },
+    "split-button": {
+      "slug": "split-button",
+      "subcomponents": [
+        {
+          "name": "static:SplitButton",
+          "displayName": "SplitButton",
+          "propsType": "SplitButtonProps",
+          "source": "static",
+          "props": [
+            {
+              "name": "fullWidth",
+              "type": "enum",
+              "required": false,
+              "group": "variant",
+              "isVariant": true,
+              "options": [
+                "true"
+              ],
+              "variantGroup": "fullWidth",
+              "deprecated": false
+            },
+            {
+              "name": "defaultOpen",
+              "type": "boolean | undefined",
+              "required": false,
+              "group": "controlled",
+              "deprecated": false
+            },
+            {
+              "name": "onOpenChange",
+              "type": "((open: boolean) => void) | undefined",
+              "required": false,
+              "group": "controlled",
+              "deprecated": false
+            },
+            {
+              "name": "open",
+              "type": "boolean | undefined",
+              "required": false,
+              "group": "controlled",
+              "deprecated": false
+            },
+            {
+              "name": "appearance",
+              "type": "'default' | 'outline' | 'ghost' | 'blue' | 'cyan' | 'green' | 'lime' | 'mint' | 'ocean' | 'sapphire' | 'lavender' | 'ruby' | 'red' | 'slate' | 'zinc' | 'stone' | 'royal' | 'electric' | 'forest' | 'sunset' | 'magenta' | 'crimson' | 'aqua' | 'plum' | 'sky' | 'rose' | 'purple' | 'pink' | 'orange' | 'yellow' | 'teal' | 'indigo' | 'emerald' | 'gradient-blue' | 'gradient-green' | 'gradient-red' | 'gradient-yellow' | 'gradient-purple' | 'gradient-teal' | 'gradient-indigo' | 'gradient-pink' | 'gradient-orange' | 'link' | 'gray' | 'violet' | 'secondary' | 'destructive' | 'amber' | 'glass' | null | undefined",
+              "required": false,
+              "group": "behavior",
+              "deprecated": false
+            },
+            {
+              "name": "disabled",
+              "type": "boolean | undefined",
+              "required": false,
+              "group": "behavior",
+              "deprecated": false
+            },
+            {
+              "name": "items",
+              "type": "SplitButtonItem[]",
+              "required": true,
+              "group": "behavior",
+              "deprecated": false
+            },
+            {
+              "name": "label",
+              "type": "string",
+              "required": true,
+              "group": "behavior",
+              "deprecated": false
+            },
+            {
+              "name": "loading",
+              "type": "boolean | undefined",
+              "required": false,
+              "group": "behavior",
+              "deprecated": false
+            },
+            {
+              "name": "onClick",
+              "type": "MouseEventHandler<HTMLButtonElement> | undefined",
+              "required": false,
+              "group": "behavior",
+              "deprecated": false
+            },
+            {
+              "name": "size",
+              "type": "SplitButtonSize | undefined",
+              "required": false,
+              "group": "behavior",
+              "deprecated": false
+            },
+            {
+              "name": "startIcon",
+              "type": "ReactNode",
+              "required": false,
+              "group": "behavior",
+              "deprecated": false
+            },
+            {
+              "name": "triggerLabel",
+              "type": "string | undefined",
+              "required": false,
+              "group": "behavior",
+              "deprecated": false
+            },
+            {
+              "name": "triggerOn",
+              "type": "'hover' | 'click' | undefined",
+              "required": false,
+              "group": "behavior",
+              "deprecated": false
+            },
+            {
+              "name": "variant",
+              "type": "SplitButtonVariant | undefined",
+              "required": false,
+              "group": "behavior",
+              "deprecated": false
+            },
+            {
+              "name": "className",
+              "type": "string | undefined",
+              "required": false,
+              "group": "dom",
+              "deprecated": false
+            },
+            {
+              "name": "id",
+              "type": "string | undefined",
+              "required": false,
+              "group": "dom",
+              "deprecated": false
+            },
+            {
+              "name": "style",
+              "type": "CSSProperties | undefined",
+              "required": false,
+              "group": "dom",
+              "deprecated": false
+            },
+            {
+              "name": "title",
+              "type": "string | undefined",
+              "required": false,
+              "group": "dom",
+              "deprecated": false
+            }
+          ]
+        }
+      ]
+    },
     "table": {
       "slug": "table",
       "subcomponents": [

package/cli/registry.json

@@ -16,6 +16,7 @@
     "command",
     "context-menu",
     "copy-button",
+    "data-table",
     "divider",
     "drawer",
     "dropdown",
@@ -37,6 +38,7 @@
     "select",
     "skeleton",
     "slider",
+    "split-button",
     "table",
     "tabs",
     "timeline",
@@ -151,6 +153,7 @@
     "command",
     "context-menu",
     "copy-button",
+    "data-table",
     "divider",
     "drawer",
     "dropdown",
@@ -173,6 +176,7 @@
     "skeleton",
     "slider",
     "spinner",
+    "split-button",
     "table",
     "tabs",
     "timeline",
@@ -268,6 +272,28 @@
     "useVirtualList",
     "useWindowSize"
   ],
+  "componentDependencies": {
+    "data-table": [
+      "buttons",
+      "checkbox",
+      "inputs",
+      "pagination",
+      "table"
+    ],
+    "dynamic-stepper": [
+      "buttons"
+    ],
+    "pagination": [
+      "buttons"
+    ],
+    "search": [
+      "inputs"
+    ],
+    "split-button": [
+      "buttons",
+      "dropdown"
+    ]
+  },
   "peerHints": {
     "accordion": [
       "framer-motion"
@@ -341,6 +367,9 @@
     "skeleton": [
       "framer-motion"
     ],
+    "split-button": [
+      "react-icons"
+    ],
     "table": [
       "framer-motion"
     ],

package/cli/rewrite-imports.mjs

@@ -2,12 +2,14 @@
  * Rewrites internal package-relative imports to app aliases.
  *
  * @param {string} source
- * @param {{ utilsAlias: string; hooksAlias: string; uiAlias?: string }} options
- * @returns {{ code: string; usedHooks: string[] }}
+ * @param {{ utilsAlias: string; hooksAlias: string; uiAlias?: string; uiComponents?: string[] }} options
+ * @returns {{ code: string; usedHooks: string[]; usedUiComponents: string[] }}
  */
 export function rewriteImports(source, options) {
-  const { utilsAlias, hooksAlias, uiAlias } = options;
+  const { utilsAlias, hooksAlias, uiAlias, uiComponents = [] } = options;
   const usedHooks = new Set();
+  const usedUiComponents = new Set();
+  const uiComponentSet = new Set(uiComponents);
 
   const collectHooks = (text) => {
     const re = /from\s+(["'])((?:\.\.\/)+)hooks\/([^'"]+)\1/g;
@@ -24,6 +26,25 @@ export function rewriteImports(source, options) {
 
   let code = source;
 
+  if (uiAlias) {
+    // Single-parent imports (`../<name>`) point at a sibling UI component.
+    // The leading `[^'"./]` excludes deeper relatives like `../../lib/utils`,
+    // which are rewritten by the dedicated blocks below. When a `uiComponents`
+    // allowlist is supplied, only those siblings are rewritten; otherwise every
+    // sibling import is treated as a UI component.
+    code = code.replace(
+      /from\s+(["'])\.\.\/([^'"./][^'"]*)\1/g,
+      (match, quote, rest) => {
+        const componentName = rest.split("/")[0];
+        if (uiComponentSet.size > 0 && !uiComponentSet.has(componentName)) {
+          return match;
+        }
+        usedUiComponents.add(componentName);
+        return `from ${quote}${uiAlias}/${rest}${quote}`;
+      },
+    );
+  }
+
   code = code.replace(
     /from\s+(["'])((?:\.\.\/)+)lib\/utils\1/g,
     (_, quote) => `from ${quote}${utilsAlias}${quote}`,
@@ -47,7 +68,11 @@ export function rewriteImports(source, options) {
     );
   }
 
-  return { code, usedHooks: [...usedHooks] };
+  return {
+    code,
+    usedHooks: [...usedHooks],
+    usedUiComponents: [...usedUiComponents],
+  };
 }
 
 /**

package/cli/rewrite-imports.test.ts

@@ -42,11 +42,46 @@ import { useFocusManagement as u } from "../../../hooks/useFocusManagement";
       utilsAlias: "@/lib/utils",
       hooksAlias: "@/hooks",
       uiAlias: "@/components/ui",
+      uiComponents: ["buttons", "pagination"],
     });
     expect(code).toContain('from "@/components/ui/pagination/types"');
     expect(code).not.toContain("../../ui/");
   });
 
+  it("should rewrite sibling ui paths when uiAlias is set", () => {
+    const input = `
+import { Button } from "../buttons";
+import type { PaginationAppearance } from "../pagination";
+`;
+    const { code } = rewriteImports(input, {
+      utilsAlias: "@/lib/utils",
+      hooksAlias: "@/hooks",
+      uiAlias: "@/components/ui",
+    });
+    expect(code).toContain('from "@/components/ui/buttons"');
+    expect(code).toContain('from "@/components/ui/pagination"');
+    expect(code).not.toContain("../buttons");
+  });
+
+  it("should collect sibling ui imports", () => {
+    const input = `
+import { Button } from "../buttons";
+import { Checkbox } from "../checkbox";
+import type { PaginationAppearance } from "../pagination";
+`;
+    const { usedUiComponents } = rewriteImports(input, {
+      utilsAlias: "@/lib/utils",
+      hooksAlias: "@/hooks",
+      uiAlias: "@/components/ui",
+      uiComponents: ["buttons", "checkbox", "pagination"],
+    });
+    expect(usedUiComponents.sort()).toEqual([
+      "buttons",
+      "checkbox",
+      "pagination",
+    ]);
+  });
+
   it("should preserve single-quote import style", () => {
     const input = `import { cn } from '../../lib/utils';\n`;
     const { code } = rewriteImports(input, {

package/dist/{chunk-WWKAJHIV.mjs → chunk-4PAHLHYF.mjs}

@@ -1,4 +1,4 @@
-import { zuiButtonBase, zuiButtonSizes, zuiButtonAppearances } from './chunk-A4IB3C23.mjs';
+import { zuiButtonBase, zuiButtonSizes, zuiButtonAppearances } from './chunk-UVP3MUBU.mjs';
 import { cva } from 'class-variance-authority';
 
 var buttonVariants = cva(zuiButtonBase, {
@@ -13,5 +13,5 @@ var buttonVariants = cva(zuiButtonBase, {
 });
 
 export { buttonVariants };
-//# sourceMappingURL=chunk-WWKAJHIV.mjs.map
-//# sourceMappingURL=chunk-WWKAJHIV.mjs.map
+//# sourceMappingURL=chunk-4PAHLHYF.mjs.map
+//# sourceMappingURL=chunk-4PAHLHYF.mjs.map

package/dist/{chunk-WWKAJHIV.mjs.map → chunk-4PAHLHYF.mjs.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/ui/buttons/variants.ts"],"names":[],"mappings":";;;AAQO,IAAM,cAAA,GAAiB,IAAI,aAAA,EAAe;AAAA,EAC/C,QAAA,EAAU;AAAA,IACR,UAAA,EAAY,oBAAA;AAAA,IACZ,IAAA,EAAM;AAAA,GACR;AAAA,EACA,eAAA,EAAiB;AAAA,IACf,UAAA,EAAY,SAAA;AAAA,IACZ,IAAA,EAAM;AAAA;AAEV,CAAC","file":"chunk-WWKAJHIV.mjs","sourcesContent":["import { cva } from \"class-variance-authority\";\n\nimport {\n  zuiButtonAppearances,\n  zuiButtonBase,\n  zuiButtonSizes,\n} from \"../../design-system\";\n\nexport const buttonVariants = cva(zuiButtonBase, {\n  variants: {\n    appearance: zuiButtonAppearances,\n    size: zuiButtonSizes,\n  },\n  defaultVariants: {\n    appearance: \"default\",\n    size: \"md\",\n  },\n});\n"]}
+{"version":3,"sources":["../src/ui/buttons/variants.ts"],"names":[],"mappings":";;;AAQO,IAAM,cAAA,GAAiB,IAAI,aAAA,EAAe;AAAA,EAC/C,QAAA,EAAU;AAAA,IACR,UAAA,EAAY,oBAAA;AAAA,IACZ,IAAA,EAAM;AAAA,GACR;AAAA,EACA,eAAA,EAAiB;AAAA,IACf,UAAA,EAAY,SAAA;AAAA,IACZ,IAAA,EAAM;AAAA;AAEV,CAAC","file":"chunk-4PAHLHYF.mjs","sourcesContent":["import { cva } from \"class-variance-authority\";\n\nimport {\n  zuiButtonAppearances,\n  zuiButtonBase,\n  zuiButtonSizes,\n} from \"../../design-system\";\n\nexport const buttonVariants = cva(zuiButtonBase, {\n  variants: {\n    appearance: zuiButtonAppearances,\n    size: zuiButtonSizes,\n  },\n  defaultVariants: {\n    appearance: \"default\",\n    size: \"md\",\n  },\n});\n"]}