@zentauri-ui/zentauri-components 1.2.1 → 1.3.0

package/dist/ui/{spinner.mjs → spinner/animated.mjs}

@@ -1,5 +1,5 @@
 "use client";
-import { cn } from '../chunk-DFEZH7TC.mjs';
+import { cn } from '../../chunk-DFEZH7TC.mjs';
 import { motion } from 'framer-motion';
 import { cva } from 'class-variance-authority';
 import { jsx } from 'react/jsx-runtime';
@@ -186,11 +186,6 @@ function Spinner(props) {
 }
 Spinner.displayName = "Spinner";
 
-// src/ui/spinner/animations.ts
-var spinnerAnimationPresets = {
-  none: {}
-};
-
-export { Spinner, spinnerAnimationPresets, spinnerVariants };
-//# sourceMappingURL=spinner.mjs.map
-//# sourceMappingURL=spinner.mjs.map
+export { Spinner, spinnerVariants };
+//# sourceMappingURL=animated.mjs.map
+//# sourceMappingURL=animated.mjs.map

package/dist/ui/spinner/animated.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/ui/spinner/animated/variants.ts","../../../src/ui/spinner/animated/spinner.tsx"],"names":[],"mappings":"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","file":"animated.mjs","sourcesContent":["import { cva } from \"class-variance-authority\";\n\nconst spinnerAppearances = {\n  default: \"text-slate-50\",\n  secondary: \"text-slate-300\",\n  destructive: \"text-rose-400\",\n  ghost: \"text-slate-300\",\n  emerald: \"text-emerald-400\",\n  indigo: \"text-indigo-400\",\n  purple: \"text-purple-400\",\n  pink: \"text-pink-400\",\n  rose: \"text-rose-400\",\n  sky: \"text-sky-400\",\n  teal: \"text-teal-400\",\n  yellow: \"text-yellow-400\",\n  orange: \"text-orange-400\",\n  \"gradient-blue\": \"text-blue-400\",\n  \"gradient-green\": \"text-green-400\",\n  \"gradient-red\": \"text-red-400\",\n  \"gradient-yellow\": \"text-yellow-400\",\n  \"gradient-purple\": \"text-purple-400\",\n  \"gradient-teal\": \"text-teal-400\",\n  \"gradient-indigo\": \"text-indigo-400\",\n  \"gradient-pink\": \"text-pink-400\",\n  \"gradient-orange\": \"text-orange-400\",\n} as const;\n\nexport const spinnerVariants = cva(\"inline-flex items-center justify-center\", {\n  variants: {\n    appearance: spinnerAppearances,\n    size: {\n      xs: \"size-3\",\n      sm: \"size-4\",\n      md: \"size-6\",\n      lg: \"size-8\",\n      xl: \"size-10\",\n    },\n    variant: {\n      ring: \"\",\n      dots: \"\",\n      pulse: \"\",\n      bars: \"\",\n    },\n  },\n  defaultVariants: {\n    appearance: \"default\",\n    size: \"md\",\n    variant: \"ring\",\n  },\n});\n","\"use client\";\n\nimport { motion } from \"framer-motion\";\n\nimport { cn } from \"../../../lib/utils\";\n\nimport type { SpinnerProps } from \"./types\";\nimport { spinnerVariants } from \"./variants\";\n\nexport function Spinner(props: SpinnerProps) {\n  const {\n    className,\n    appearance,\n    size,\n    variant = \"ring\",\n    ref,\n    \"aria-label\": ariaLabel = \"Loading\",\n    ...rest\n  } = props;\n  const rootClass = cn(\n    spinnerVariants({ appearance, size, variant }),\n    className,\n  );\n\n  if (variant === \"ring\") {\n    return (\n      <motion.span\n        ref={ref}\n        role=\"status\"\n        data-slot=\"spinner\"\n        aria-label={ariaLabel}\n        className={cn(rootClass, \"relative\")}\n        initial={false}\n        {...rest}\n      >\n        <motion.span\n          className=\"block size-full rounded-full border-2 border-current border-t-transparent\"\n          animate={{ rotate: 360 }}\n          transition={{ repeat: Infinity, ease: \"linear\", duration: 0.85 }}\n          aria-hidden\n        />\n      </motion.span>\n    );\n  }\n\n  if (variant === \"dots\") {\n    const dotSizes = {\n      xs: \"size-1\",\n      sm: \"size-1.5\",\n      md: \"size-2\",\n      lg: \"size-2.5\",\n      xl: \"size-3\",\n    };\n    const dotSize = dotSizes[size as keyof typeof dotSizes];\n    return (\n      <motion.span\n        ref={ref}\n        role=\"status\"\n        data-slot=\"spinner\"\n        aria-label={ariaLabel}\n        className={cn(rootClass, \"gap-1\")}\n        initial={false}\n        {...rest}\n      >\n        {[0, 1, 2].map((index) => (\n          <motion.span\n            key={index}\n            className={cn(\"rounded-full bg-current\", dotSize)}\n            animate={{ y: [0, -5, 0], opacity: [0.45, 1, 0.45] }}\n            transition={{\n              repeat: Infinity,\n              duration: 0.55,\n              ease: \"easeInOut\",\n              delay: index * 0.12,\n            }}\n            aria-hidden\n          />\n        ))}\n      </motion.span>\n    );\n  }\n\n  if (variant === \"pulse\") {\n    return (\n      <motion.span\n        ref={ref}\n        role=\"status\"\n        data-slot=\"spinner\"\n        aria-label={ariaLabel}\n        className={cn(rootClass)}\n        initial={false}\n        {...rest}\n      >\n        <motion.span\n          className=\"block size-full rounded-full bg-current\"\n          animate={{ scale: [0.75, 1, 0.75], opacity: [0.45, 1, 0.45] }}\n          transition={{ repeat: Infinity, duration: 0.9, ease: \"easeInOut\" }}\n          aria-hidden\n        />\n      </motion.span>\n    );\n  }\n\n  const barWidths = {\n    xs: \"w-0.5\",\n    sm: \"w-0.5\",\n    md: \"w-1\",\n    lg: \"w-1.5\",\n    xl: \"w-2\",\n  };\n\n  const barWidth =\n    barWidths[size as keyof typeof barWidths];\n    \n  return (\n    <motion.span\n      ref={ref}\n      role=\"status\"\n      data-slot=\"spinner\"\n      aria-label={ariaLabel}\n      className={cn(rootClass, \"gap-1\")}\n      initial={false}\n      {...rest}\n    >\n      {[0, 1, 2, 3].map((index) => (\n        <motion.span\n          key={index}\n          className={cn(\"h-full max-h-[70%] rounded-full bg-current\", barWidth)}\n          animate={{ scaleY: [0.35, 1, 0.35] }}\n          transition={{\n            repeat: Infinity,\n            duration: 0.65,\n            ease: \"easeInOut\",\n            delay: index * 0.1,\n          }}\n          aria-hidden\n        />\n      ))}\n    </motion.span>\n  );\n}\n\nSpinner.displayName = \"Spinner\";\n"]}

package/dist/ui/table/animated.d.mts

@@ -0,0 +1,21 @@
+import { TableSectionProps, TableProps, TableAnimation } from '../table.mjs';
+export { TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader } from '../table.mjs';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { HTMLMotionProps } from 'framer-motion';
+import 'react';
+import 'class-variance-authority';
+import 'class-variance-authority/types';
+
+declare const TableRowAnimated: (props: TableSectionProps & {
+    ref?: React.Ref<HTMLTableRowElement>;
+}) => react_jsx_runtime.JSX.Element;
+
+type TableAnimatedProps = TableProps & {
+    rowAnimation?: TableAnimation;
+};
+type TableRowPresetMotionProps = Pick<HTMLMotionProps<"tr">, "initial" | "animate" | "whileHover" | "transition">;
+type TableRowAnimationPresets = Record<TableAnimation, TableRowPresetMotionProps>;
+
+declare const tableAnimationPresets: TableRowAnimationPresets;
+
+export { type TableAnimatedProps, TableRowAnimated, type TableRowAnimationPresets, type TableRowPresetMotionProps, tableAnimationPresets };

package/dist/ui/table/animated.d.ts

@@ -0,0 +1,21 @@
+import { TableSectionProps, TableProps, TableAnimation } from '../table.js';
+export { TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader } from '../table.js';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { HTMLMotionProps } from 'framer-motion';
+import 'react';
+import 'class-variance-authority';
+import 'class-variance-authority/types';
+
+declare const TableRowAnimated: (props: TableSectionProps & {
+    ref?: React.Ref<HTMLTableRowElement>;
+}) => react_jsx_runtime.JSX.Element;
+
+type TableAnimatedProps = TableProps & {
+    rowAnimation?: TableAnimation;
+};
+type TableRowPresetMotionProps = Pick<HTMLMotionProps<"tr">, "initial" | "animate" | "whileHover" | "transition">;
+type TableRowAnimationPresets = Record<TableAnimation, TableRowPresetMotionProps>;
+
+declare const tableAnimationPresets: TableRowAnimationPresets;
+
+export { type TableAnimatedProps, TableRowAnimated, type TableRowAnimationPresets, type TableRowPresetMotionProps, tableAnimationPresets };

package/dist/ui/table/animated.js

@@ -0,0 +1,50 @@
+"use client";
+'use strict';
+
+var chunk3OR47XMY_js = require('../../chunk-3OR47XMY.js');
+require('../../chunk-UOZYPWDZ.js');
+var framerMotion = require('framer-motion');
+var jsxRuntime = require('react/jsx-runtime');
+
+// src/ui/table/animated/animations.ts
+var tableAnimationPresets = {
+  none: {},
+  hover: {
+    whileHover: { backgroundColor: "rgba(255,255,255,0.05)" },
+    transition: { duration: 0.15 }
+  }
+};
+var TableRowAnimated = (props) => {
+  const { rowAnimation = "hover" } = props;
+  const motionProps = tableAnimationPresets[rowAnimation];
+  return /* @__PURE__ */ jsxRuntime.jsx(chunk3OR47XMY_js.TableRow, { ...props, as: framerMotion.motion.tr, initial: false, ...motionProps });
+};
+
+Object.defineProperty(exports, "TableBody", {
+  enumerable: true,
+  get: function () { return chunk3OR47XMY_js.TableBody; }
+});
+Object.defineProperty(exports, "TableCaption", {
+  enumerable: true,
+  get: function () { return chunk3OR47XMY_js.TableCaption; }
+});
+Object.defineProperty(exports, "TableCell", {
+  enumerable: true,
+  get: function () { return chunk3OR47XMY_js.TableCell; }
+});
+Object.defineProperty(exports, "TableFooter", {
+  enumerable: true,
+  get: function () { return chunk3OR47XMY_js.TableFooter; }
+});
+Object.defineProperty(exports, "TableHead", {
+  enumerable: true,
+  get: function () { return chunk3OR47XMY_js.TableHead; }
+});
+Object.defineProperty(exports, "TableHeader", {
+  enumerable: true,
+  get: function () { return chunk3OR47XMY_js.TableHeader; }
+});
+exports.TableRowAnimated = TableRowAnimated;
+exports.tableAnimationPresets = tableAnimationPresets;
+//# sourceMappingURL=animated.js.map
+//# sourceMappingURL=animated.js.map

package/dist/ui/table/animated.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/ui/table/animated/animations.ts","../../../src/ui/table/animated/table-animated.tsx"],"names":["jsx","TableRow","motion"],"mappings":";;;;;;;;AAEO,IAAM,qBAAA,GAAkD;AAAA,EAC7D,MAAM,EAAC;AAAA,EACP,KAAA,EAAO;AAAA,IACL,UAAA,EAAY,EAAE,eAAA,EAAiB,wBAAA,EAAyB;AAAA,IACxD,UAAA,EAAY,EAAE,QAAA,EAAU,IAAA;AAAK;AAEjC;ACFO,IAAM,gBAAA,GAAmB,CAC9B,KAAA,KACG;AACH,EAAA,MAAM,EAAE,YAAA,GAAe,OAAA,EAAQ,GAAI,KAAA;AACnC,EAAA,MAAM,WAAA,GAAc,sBAAsB,YAAY,CAAA;AACtD,EAAA,uBACEA,cAAA,CAACC,yBAAA,EAAA,EAAU,GAAG,KAAA,EAAO,EAAA,EAAIC,oBAAO,EAAA,EAAI,OAAA,EAAS,KAAA,EAAQ,GAAG,WAAA,EAAa,CAAA;AAEzE","file":"animated.js","sourcesContent":["import type { TableRowAnimationPresets } from \"./types\";\n\nexport const tableAnimationPresets: TableRowAnimationPresets = {\n  none: {},\n  hover: {\n    whileHover: { backgroundColor: \"rgba(255,255,255,0.05)\" },\n    transition: { duration: 0.15 },\n  },\n};\n","\"use client\";\nimport { tableAnimationPresets } from \"./animations\";\nimport type { TableSectionProps } from \"../types\";\nimport { motion } from \"framer-motion\";\nimport { TableRow } from \"../table-base\";\n\nexport const TableRowAnimated = (\n  props: TableSectionProps & { ref?: React.Ref<HTMLTableRowElement> },\n) => {\n  const { rowAnimation = \"hover\" } = props;\n  const motionProps = tableAnimationPresets[rowAnimation];\n  return (\n    <TableRow {...props} as={motion.tr} initial={false} {...motionProps} />\n  );\n};\n"]}

package/dist/ui/table/animated.mjs

@@ -0,0 +1,24 @@
+"use client";
+import { TableRow } from '../../chunk-BVXTOEBI.mjs';
+export { TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader } from '../../chunk-BVXTOEBI.mjs';
+import '../../chunk-DFEZH7TC.mjs';
+import { motion } from 'framer-motion';
+import { jsx } from 'react/jsx-runtime';
+
+// src/ui/table/animated/animations.ts
+var tableAnimationPresets = {
+  none: {},
+  hover: {
+    whileHover: { backgroundColor: "rgba(255,255,255,0.05)" },
+    transition: { duration: 0.15 }
+  }
+};
+var TableRowAnimated = (props) => {
+  const { rowAnimation = "hover" } = props;
+  const motionProps = tableAnimationPresets[rowAnimation];
+  return /* @__PURE__ */ jsx(TableRow, { ...props, as: motion.tr, initial: false, ...motionProps });
+};
+
+export { TableRowAnimated, tableAnimationPresets };
+//# sourceMappingURL=animated.mjs.map
+//# sourceMappingURL=animated.mjs.map

package/dist/ui/table/animated.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/ui/table/animated/animations.ts","../../../src/ui/table/animated/table-animated.tsx"],"names":[],"mappings":";;;;;;;AAEO,IAAM,qBAAA,GAAkD;AAAA,EAC7D,MAAM,EAAC;AAAA,EACP,KAAA,EAAO;AAAA,IACL,UAAA,EAAY,EAAE,eAAA,EAAiB,wBAAA,EAAyB;AAAA,IACxD,UAAA,EAAY,EAAE,QAAA,EAAU,IAAA;AAAK;AAEjC;ACFO,IAAM,gBAAA,GAAmB,CAC9B,KAAA,KACG;AACH,EAAA,MAAM,EAAE,YAAA,GAAe,OAAA,EAAQ,GAAI,KAAA;AACnC,EAAA,MAAM,WAAA,GAAc,sBAAsB,YAAY,CAAA;AACtD,EAAA,uBACE,GAAA,CAAC,QAAA,EAAA,EAAU,GAAG,KAAA,EAAO,EAAA,EAAI,OAAO,EAAA,EAAI,OAAA,EAAS,KAAA,EAAQ,GAAG,WAAA,EAAa,CAAA;AAEzE","file":"animated.mjs","sourcesContent":["import type { TableRowAnimationPresets } from \"./types\";\n\nexport const tableAnimationPresets: TableRowAnimationPresets = {\n  none: {},\n  hover: {\n    whileHover: { backgroundColor: \"rgba(255,255,255,0.05)\" },\n    transition: { duration: 0.15 },\n  },\n};\n","\"use client\";\nimport { tableAnimationPresets } from \"./animations\";\nimport type { TableSectionProps } from \"../types\";\nimport { motion } from \"framer-motion\";\nimport { TableRow } from \"../table-base\";\n\nexport const TableRowAnimated = (\n  props: TableSectionProps & { ref?: React.Ref<HTMLTableRowElement> },\n) => {\n  const { rowAnimation = \"hover\" } = props;\n  const motionProps = tableAnimationPresets[rowAnimation];\n  return (\n    <TableRow {...props} as={motion.tr} initial={false} {...motionProps} />\n  );\n};\n"]}

package/dist/ui/table.d.mts

@@ -1,8 +1,8 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as react from 'react';
+import { HTMLAttributes, ReactNode, Ref, ElementType, TdHTMLAttributes, ThHTMLAttributes } from 'react';
 import { VariantProps } from 'class-variance-authority';
-import { HTMLAttributes, ReactNode, Ref, TdHTMLAttributes, ThHTMLAttributes } from 'react';
 import * as class_variance_authority_types from 'class-variance-authority/types';
-import { HTMLMotionProps } from 'framer-motion';
 
 declare const tableVariants: (props?: ({
     appearance?: "default" | "striped" | "bordered" | "ghost" | "sky" | "rose" | "purple" | "pink" | "orange" | "yellow" | "teal" | "indigo" | "emerald" | "gray" | "amber" | "violet" | null | undefined;
@@ -22,13 +22,14 @@ type TableAnimation = "none" | "hover";
 type TableVariantProps = VariantProps<typeof tableVariants>;
 type TableProps = TableVariantProps & Omit<HTMLAttributes<HTMLTableElement>, "children"> & {
     children?: ReactNode;
-    rowAnimation?: TableAnimation;
     ref?: Ref<HTMLTableElement>;
     textAlign?: "left" | "center" | "right";
 };
 type TableSectionProps = {
+    as?: ElementType;
     className?: string;
     children?: ReactNode;
+    rowAnimation?: TableAnimation;
 };
 type TableHeadCellProps = ThHTMLAttributes<HTMLTableCellElement> & {
     sortDirection?: "ascending" | "descending" | "none";
@@ -38,9 +39,18 @@ type TableCellProps = TdHTMLAttributes<HTMLTableCellElement> & {
     ref?: Ref<HTMLTableCellElement>;
     textAlign?: "left" | "center" | "right";
 };
+type TableCtx = {
+    appearance: NonNullable<TableProps["appearance"]>;
+    size: NonNullable<TableProps["size"]>;
+    stickyHeader: boolean;
+    rowAnimation: TableAnimation;
+    textAlign: NonNullable<TableCellProps["textAlign"]>;
+};
 
-declare function Table(props: TableProps): react_jsx_runtime.JSX.Element;
-declare namespace Table {
+declare const TableContext: react.Context<TableCtx | null>;
+declare function useTableContext(component: string): TableCtx;
+declare function TableBase(props: TableProps): react_jsx_runtime.JSX.Element;
+declare namespace TableBase {
     var displayName: string;
 }
 declare function TableHeader({ className, children }: TableSectionProps): react_jsx_runtime.JSX.Element;
@@ -55,7 +65,7 @@ declare function TableFooter({ className, children }: TableSectionProps): react_
 declare namespace TableFooter {
     var displayName: string;
 }
-declare function TableRow({ className, children, ref, ...rest }: TableSectionProps & {
+declare function TableRow({ className, children, ref, as: Wrapper, ...rest }: TableSectionProps & {
     ref?: React.Ref<HTMLTableRowElement>;
 }): react_jsx_runtime.JSX.Element;
 declare namespace TableRow {
@@ -74,8 +84,4 @@ declare namespace TableCaption {
     var displayName: string;
 }
 
-type TablePresetMotionProps = Pick<HTMLMotionProps<"tr">, "whileHover" | "transition">;
-type TableAnimationPresets = Record<TableAnimation, TablePresetMotionProps>;
-declare const tableAnimationPresets: TableAnimationPresets;
-
-export { Table, type TableAnimation, TableBody, TableCaption, TableCell, type TableCellProps, TableFooter, TableHead, type TableHeadCellProps, TableHeader, type TableProps, TableRow, type TableSectionProps, tableAnimationPresets, tableCellVariants, tableRowVariants, tableVariants };
+export { TableBase as Table, type TableAnimation, TableBody, TableCaption, TableCell, type TableCellProps, TableContext, TableFooter, TableHead, type TableHeadCellProps, TableHeader, type TableProps, TableRow, type TableSectionProps, tableCellVariants, tableRowVariants, tableVariants, useTableContext };

package/dist/ui/table.d.ts

@@ -1,8 +1,8 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as react from 'react';
+import { HTMLAttributes, ReactNode, Ref, ElementType, TdHTMLAttributes, ThHTMLAttributes } from 'react';
 import { VariantProps } from 'class-variance-authority';
-import { HTMLAttributes, ReactNode, Ref, TdHTMLAttributes, ThHTMLAttributes } from 'react';
 import * as class_variance_authority_types from 'class-variance-authority/types';
-import { HTMLMotionProps } from 'framer-motion';
 
 declare const tableVariants: (props?: ({
     appearance?: "default" | "striped" | "bordered" | "ghost" | "sky" | "rose" | "purple" | "pink" | "orange" | "yellow" | "teal" | "indigo" | "emerald" | "gray" | "amber" | "violet" | null | undefined;
@@ -22,13 +22,14 @@ type TableAnimation = "none" | "hover";
 type TableVariantProps = VariantProps<typeof tableVariants>;
 type TableProps = TableVariantProps & Omit<HTMLAttributes<HTMLTableElement>, "children"> & {
     children?: ReactNode;
-    rowAnimation?: TableAnimation;
     ref?: Ref<HTMLTableElement>;
     textAlign?: "left" | "center" | "right";
 };
 type TableSectionProps = {
+    as?: ElementType;
     className?: string;
     children?: ReactNode;
+    rowAnimation?: TableAnimation;
 };
 type TableHeadCellProps = ThHTMLAttributes<HTMLTableCellElement> & {
     sortDirection?: "ascending" | "descending" | "none";
@@ -38,9 +39,18 @@ type TableCellProps = TdHTMLAttributes<HTMLTableCellElement> & {
     ref?: Ref<HTMLTableCellElement>;
     textAlign?: "left" | "center" | "right";
 };
+type TableCtx = {
+    appearance: NonNullable<TableProps["appearance"]>;
+    size: NonNullable<TableProps["size"]>;
+    stickyHeader: boolean;
+    rowAnimation: TableAnimation;
+    textAlign: NonNullable<TableCellProps["textAlign"]>;
+};
 
-declare function Table(props: TableProps): react_jsx_runtime.JSX.Element;
-declare namespace Table {
+declare const TableContext: react.Context<TableCtx | null>;
+declare function useTableContext(component: string): TableCtx;
+declare function TableBase(props: TableProps): react_jsx_runtime.JSX.Element;
+declare namespace TableBase {
     var displayName: string;
 }
 declare function TableHeader({ className, children }: TableSectionProps): react_jsx_runtime.JSX.Element;
@@ -55,7 +65,7 @@ declare function TableFooter({ className, children }: TableSectionProps): react_
 declare namespace TableFooter {
     var displayName: string;
 }
-declare function TableRow({ className, children, ref, ...rest }: TableSectionProps & {
+declare function TableRow({ className, children, ref, as: Wrapper, ...rest }: TableSectionProps & {
     ref?: React.Ref<HTMLTableRowElement>;
 }): react_jsx_runtime.JSX.Element;
 declare namespace TableRow {
@@ -74,8 +84,4 @@ declare namespace TableCaption {
     var displayName: string;
 }
 
-type TablePresetMotionProps = Pick<HTMLMotionProps<"tr">, "whileHover" | "transition">;
-type TableAnimationPresets = Record<TableAnimation, TablePresetMotionProps>;
-declare const tableAnimationPresets: TableAnimationPresets;
-
-export { Table, type TableAnimation, TableBody, TableCaption, TableCell, type TableCellProps, TableFooter, TableHead, type TableHeadCellProps, TableHeader, type TableProps, TableRow, type TableSectionProps, tableAnimationPresets, tableCellVariants, tableRowVariants, tableVariants };
+export { TableBase as Table, type TableAnimation, TableBody, TableCaption, TableCell, type TableCellProps, TableContext, TableFooter, TableHead, type TableHeadCellProps, TableHeader, type TableProps, TableRow, type TableSectionProps, tableCellVariants, tableRowVariants, tableVariants, useTableContext };

package/dist/ui/table.js

@@ -1,285 +1,62 @@
 "use client";
 'use strict';
 
-var chunkUOZYPWDZ_js = require('../chunk-UOZYPWDZ.js');
-var react = require('react');
-var framerMotion = require('framer-motion');
-var classVarianceAuthority = require('class-variance-authority');
-var jsxRuntime = require('react/jsx-runtime');
+var chunk3OR47XMY_js = require('../chunk-3OR47XMY.js');
+require('../chunk-UOZYPWDZ.js');
 
-// src/ui/table/animations.ts
-var tableAnimationPresets = {
-  none: {},
-  hover: {
-    whileHover: { backgroundColor: "rgba(255,255,255,0.05)" },
-    transition: { duration: 0.15 }
-  }
-};
-var tableVariants = classVarianceAuthority.cva(
-  "w-full table-auto border-collapse caption-bottom text-sm text-slate-200 md:table-fixed",
-  {
-    variants: {
-      appearance: {
-        default: "",
-        striped: "",
-        bordered: "border border-white/10",
-        ghost: "",
-        sky: "border border-sky-600",
-        rose: "border border-rose-600",
-        purple: "border border-purple-600",
-        pink: "border border-pink-600",
-        orange: "border border-orange-600",
-        yellow: "border border-yellow-600",
-        teal: "border border-teal-600",
-        indigo: "border border-indigo-600",
-        emerald: "border border-emerald-600",
-        gray: "border border-gray-600",
-        amber: "border border-amber-600",
-        violet: "border border-violet-600"
-      },
-      size: {
-        sm: "text-xs",
-        md: "text-sm",
-        lg: "text-base"
-      },
-      stickyHeader: {
-        true: "",
-        false: ""
-      }
-    },
-    defaultVariants: {
-      appearance: "default",
-      size: "md",
-      stickyHeader: false
-    }
-  }
-);
-var tableRowVariants = classVarianceAuthority.cva(
-  "border-b border-white/5 transition-colors data-[state=selected]:bg-white/[0.06]",
-  {
-    variants: {
-      appearance: {
-        default: "",
-        striped: "odd:bg-white/[0.03]",
-        bordered: "",
-        ghost: "border-transparent hover:bg-white/[0.03]",
-        sky: "border-sky-600 hover:bg-sky-600",
-        rose: "border-rose-600 hover:bg-rose-900",
-        purple: "border-purple-600 hover:bg-purple-900",
-        pink: "border-pink-600 hover:bg-pink-900",
-        orange: "border-orange-600 hover:bg-orange-900",
-        yellow: "border-yellow-600 hover:bg-yellow-900",
-        teal: "border-teal-600 hover:bg-teal-900",
-        indigo: "border-indigo-600 hover:bg-indigo-900",
-        emerald: "border-emerald-600 hover:bg-emerald-900",
-        gray: "border-gray-600 hover:bg-gray-900",
-        amber: "border-amber-600 hover:bg-amber-900",
-        violet: "border-violet-600 hover:bg-violet-900"
-      }
-    },
-    defaultVariants: { appearance: "default" }
-  }
-);
-var tableCellVariants = classVarianceAuthority.cva(
-  "min-w-0 border p-3 align-middle break-words",
-  {
-    variants: {
-      appearance: {
-        default: "border-white/10",
-        striped: "border-white/10",
-        bordered: "border-white/10",
-        ghost: "border-white/10",
-        sky: "border-sky-600",
-        rose: "border-rose-600",
-        purple: "border-purple-600",
-        pink: "border-pink-600",
-        orange: "border-orange-600",
-        yellow: "border-yellow-600",
-        teal: "border-teal-600",
-        indigo: "border-indigo-600",
-        emerald: "border-emerald-600",
-        gray: "border-gray-600",
-        amber: "border-amber-600",
-        violet: "border-violet-600"
-      },
-      size: {
-        sm: "p-2",
-        md: "p-3",
-        lg: "p-4"
-      },
-      textAlign: {
-        left: "text-left",
-        center: "text-center",
-        right: "text-right"
-      }
-    },
-    defaultVariants: { appearance: "default", size: "md" }
-  }
-);
-var TableContext = react.createContext(null);
-function useTableContext(component) {
-  const ctx = react.useContext(TableContext);
-  if (!ctx) {
-    throw new Error(`${component} must be used within <Table>`);
-  }
-  return ctx;
-}
-function Table(props) {
-  const {
-    className,
-    appearance = "default",
-    size = "md",
-    textAlign = "left",
-    stickyHeader = false,
-    rowAnimation = "none",
-    children,
-    ref,
-    ...rest
-  } = props;
-  const ctx = react.useMemo(
-    () => ({
-      appearance: appearance ?? "default",
-      size: size ?? "md",
-      stickyHeader: Boolean(stickyHeader),
-      rowAnimation,
-      textAlign
-    }),
-    [appearance, rowAnimation, size, stickyHeader, textAlign]
-  );
-  return /* @__PURE__ */ jsxRuntime.jsx(TableContext.Provider, { value: ctx, children: /* @__PURE__ */ jsxRuntime.jsx("div", { "data-slot": "table-scroll", className: "relative w-full overflow-auto", children: /* @__PURE__ */ jsxRuntime.jsx(
-    "table",
-    {
-      ref,
-      "data-slot": "table",
-      role: "table",
-      className: chunkUOZYPWDZ_js.cn(
-        tableVariants({ appearance, size, stickyHeader }),
-        "w-full min-w-0 table",
-        className
-      ),
-      ...rest,
-      children
-    }
-  ) }) });
-}
-Table.displayName = "Table";
-function TableHeader({ className, children }) {
-  const { stickyHeader } = useTableContext("TableHeader");
-  const stickyClass = stickyHeader ? "sticky top-0 z-10 bg-slate-950/95 backdrop-blur" : "";
-  return /* @__PURE__ */ jsxRuntime.jsx("thead", { "data-slot": "table-header", className: chunkUOZYPWDZ_js.cn(stickyClass, className), children });
-}
-TableHeader.displayName = "TableHeader";
-function TableBody({ className, children }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("tbody", { "data-slot": "table-body", className: chunkUOZYPWDZ_js.cn(className), children });
-}
-TableBody.displayName = "TableBody";
-function TableFooter({ className, children }) {
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "tfoot",
-    {
-      "data-slot": "table-footer",
-      className: chunkUOZYPWDZ_js.cn(
-        "border-t border-white/10 bg-white/3 font-medium",
-        className
-      ),
-      children
-    }
-  );
-}
-TableFooter.displayName = "TableFooter";
-function TableRow({
-  className,
-  children,
-  ref,
-  ...rest
-}) {
-  const { appearance, rowAnimation } = useTableContext("TableRow");
-  const motionProps = tableAnimationPresets[rowAnimation];
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    framerMotion.motion.tr,
-    {
-      ref,
-      "data-slot": "table-row",
-      className: chunkUOZYPWDZ_js.cn(tableRowVariants({ appearance }), className),
-      initial: false,
-      ...motionProps,
-      ...rest,
-      children
-    }
-  );
-}
-TableRow.displayName = "TableRow";
-function TableHead({
-  className,
-  children,
-  scope = "col",
-  sortDirection,
-  ref,
-  ...rest
-}) {
-  const { appearance, size, textAlign } = useTableContext("TableHead");
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "th",
-    {
-      ref,
-      "data-slot": "table-head",
-      scope,
-      "aria-sort": sortDirection,
-      className: chunkUOZYPWDZ_js.cn(
-        tableCellVariants({ appearance, size, textAlign }),
-        className
-      ),
-      ...rest,
-      children
-    }
-  );
-}
-TableHead.displayName = "TableHead";
-function TableCell({
-  className,
-  children,
-  ref,
-  ...rest
-}) {
-  const { appearance, size, textAlign } = useTableContext("TableCell");
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "td",
-    {
-      ref,
-      "data-slot": "table-cell",
-      className: chunkUOZYPWDZ_js.cn(
-        tableCellVariants({ appearance, size, textAlign }),
-        className
-      ),
-      ...rest,
-      children
-    }
-  );
-}
-TableCell.displayName = "TableCell";
-function TableCaption({ className, children }) {
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "caption",
-    {
-      "data-slot": "table-caption",
-      className: chunkUOZYPWDZ_js.cn("mt-3 text-left text-xs text-slate-500", className),
-      children
-    }
-  );
-}
-TableCaption.displayName = "TableCaption";
 
-exports.Table = Table;
-exports.TableBody = TableBody;
-exports.TableCaption = TableCaption;
-exports.TableCell = TableCell;
-exports.TableFooter = TableFooter;
-exports.TableHead = TableHead;
-exports.TableHeader = TableHeader;
-exports.TableRow = TableRow;
-exports.tableAnimationPresets = tableAnimationPresets;
-exports.tableCellVariants = tableCellVariants;
-exports.tableRowVariants = tableRowVariants;
-exports.tableVariants = tableVariants;
+
+Object.defineProperty(exports, "Table", {
+  enumerable: true,
+  get: function () { return chunk3OR47XMY_js.TableBase; }
+});
+Object.defineProperty(exports, "TableBody", {
+  enumerable: true,
+  get: function () { return chunk3OR47XMY_js.TableBody; }
+});
+Object.defineProperty(exports, "TableCaption", {
+  enumerable: true,
+  get: function () { return chunk3OR47XMY_js.TableCaption; }
+});
+Object.defineProperty(exports, "TableCell", {
+  enumerable: true,
+  get: function () { return chunk3OR47XMY_js.TableCell; }
+});
+Object.defineProperty(exports, "TableContext", {
+  enumerable: true,
+  get: function () { return chunk3OR47XMY_js.TableContext; }
+});
+Object.defineProperty(exports, "TableFooter", {
+  enumerable: true,
+  get: function () { return chunk3OR47XMY_js.TableFooter; }
+});
+Object.defineProperty(exports, "TableHead", {
+  enumerable: true,
+  get: function () { return chunk3OR47XMY_js.TableHead; }
+});
+Object.defineProperty(exports, "TableHeader", {
+  enumerable: true,
+  get: function () { return chunk3OR47XMY_js.TableHeader; }
+});
+Object.defineProperty(exports, "TableRow", {
+  enumerable: true,
+  get: function () { return chunk3OR47XMY_js.TableRow; }
+});
+Object.defineProperty(exports, "tableCellVariants", {
+  enumerable: true,
+  get: function () { return chunk3OR47XMY_js.tableCellVariants; }
+});
+Object.defineProperty(exports, "tableRowVariants", {
+  enumerable: true,
+  get: function () { return chunk3OR47XMY_js.tableRowVariants; }
+});
+Object.defineProperty(exports, "tableVariants", {
+  enumerable: true,
+  get: function () { return chunk3OR47XMY_js.tableVariants; }
+});
+Object.defineProperty(exports, "useTableContext", {
+  enumerable: true,
+  get: function () { return chunk3OR47XMY_js.useTableContext; }
+});
 //# sourceMappingURL=table.js.map
 //# sourceMappingURL=table.js.map