@fuf-stack/pixels 0.29.2 → 0.30.0

package/dist/Accordion/index.cjs

@@ -2,11 +2,11 @@
 
 
 
-var _chunkVHEIRVBBcjs = require('../chunk-VHEIRVBB.cjs');
-require('../chunk-DZUJEN5N.cjs');
+var _chunkZXGEK67Fcjs = require('../chunk-ZXGEK67F.cjs');
+require('../chunk-D4TLDLEX.cjs');
 
 
 
 
-exports.Accordion = _chunkVHEIRVBBcjs.Accordion_default; exports.accordionVariants = _chunkVHEIRVBBcjs.accordionVariants; exports.default = _chunkVHEIRVBBcjs.Accordion_default2;
+exports.Accordion = _chunkZXGEK67Fcjs.Accordion_default; exports.accordionVariants = _chunkZXGEK67Fcjs.accordionVariants; exports.default = _chunkZXGEK67Fcjs.Accordion_default2;
 //# sourceMappingURL=index.cjs.map

package/dist/Accordion/index.js

@@ -2,8 +2,8 @@ import {
   Accordion_default,
   Accordion_default2,
   accordionVariants
-} from "../chunk-EIOL2HNA.js";
-import "../chunk-5WRI5ZAA.js";
+} from "../chunk-33DBA7U2.js";
+import "../chunk-J7N2552D.js";
 export {
   Accordion_default as Accordion,
   accordionVariants,

package/dist/Avatar/index.cjs

@@ -2,7 +2,7 @@
 
 
 var _chunkHVLEV6BGcjs = require('../chunk-HVLEV6BG.cjs');
-require('../chunk-DZUJEN5N.cjs');
+require('../chunk-D4TLDLEX.cjs');
 
 
 

package/dist/Avatar/index.js

@@ -2,7 +2,7 @@ import {
   Avatar_default,
   Avatar_default2
 } from "../chunk-N6YMP2DX.js";
-import "../chunk-5WRI5ZAA.js";
+import "../chunk-J7N2552D.js";
 export {
   Avatar_default as Avatar,
   Avatar_default2 as default

package/dist/AvatarGroup/index.cjs

@@ -1,11 +1,11 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});
 
 
-var _chunkOP6ST4KBcjs = require('../chunk-OP6ST4KB.cjs');
+var _chunk7XJHVFT3cjs = require('../chunk-7XJHVFT3.cjs');
 require('../chunk-HVLEV6BG.cjs');
-require('../chunk-DZUJEN5N.cjs');
+require('../chunk-D4TLDLEX.cjs');
 
 
 
-exports.AvatarGroup = _chunkOP6ST4KBcjs.AvatarGroup_default; exports.default = _chunkOP6ST4KBcjs.AvatarGroup_default2;
+exports.AvatarGroup = _chunk7XJHVFT3cjs.AvatarGroup_default; exports.default = _chunk7XJHVFT3cjs.AvatarGroup_default2;
 //# sourceMappingURL=index.cjs.map

package/dist/AvatarGroup/index.js

@@ -1,9 +1,9 @@
 import {
   AvatarGroup_default,
   AvatarGroup_default2
-} from "../chunk-337S7HUF.js";
+} from "../chunk-XVCKJE3P.js";
 import "../chunk-N6YMP2DX.js";
-import "../chunk-5WRI5ZAA.js";
+import "../chunk-J7N2552D.js";
 export {
   AvatarGroup_default as AvatarGroup,
   AvatarGroup_default2 as default

package/dist/Badge/index.cjs

@@ -2,7 +2,7 @@
 
 
 var _chunkU2JEMXXJcjs = require('../chunk-U2JEMXXJ.cjs');
-require('../chunk-DZUJEN5N.cjs');
+require('../chunk-D4TLDLEX.cjs');
 
 
 

package/dist/Badge/index.js

@@ -2,7 +2,7 @@ import {
   Badge_default,
   Badge_default2
 } from "../chunk-QTXKWCDV.js";
-import "../chunk-5WRI5ZAA.js";
+import "../chunk-J7N2552D.js";
 export {
   Badge_default as Badge,
   Badge_default2 as default

package/dist/Breadcrumb/index.cjs

@@ -2,11 +2,11 @@
 
 
 
-var _chunkRJAVAHBKcjs = require('../chunk-RJAVAHBK.cjs');
-require('../chunk-DZUJEN5N.cjs');
+var _chunkNVNT4PMScjs = require('../chunk-NVNT4PMS.cjs');
+require('../chunk-D4TLDLEX.cjs');
 
 
 
 
-exports.Breadcrumb = _chunkRJAVAHBKcjs.Breadcrumb_default; exports.breadcrumbVariants = _chunkRJAVAHBKcjs.breadcrumbVariants; exports.default = _chunkRJAVAHBKcjs.Breadcrumb_default2;
+exports.Breadcrumb = _chunkNVNT4PMScjs.Breadcrumb_default; exports.breadcrumbVariants = _chunkNVNT4PMScjs.breadcrumbVariants; exports.default = _chunkNVNT4PMScjs.Breadcrumb_default2;
 //# sourceMappingURL=index.cjs.map

package/dist/Breadcrumb/index.js

@@ -2,8 +2,8 @@ import {
   Breadcrumb_default,
   Breadcrumb_default2,
   breadcrumbVariants
-} from "../chunk-RMLPCTDU.js";
-import "../chunk-5WRI5ZAA.js";
+} from "../chunk-LPCCBJ2T.js";
+import "../chunk-J7N2552D.js";
 export {
   Breadcrumb_default as Breadcrumb,
   breadcrumbVariants,

package/dist/Button/index.cjs

@@ -4,7 +4,7 @@
 
 
 var _chunk7TIFKRWYcjs = require('../chunk-7TIFKRWY.cjs');
-require('../chunk-DZUJEN5N.cjs');
+require('../chunk-D4TLDLEX.cjs');
 
 
 

package/dist/Button/index.js

@@ -4,7 +4,7 @@ import {
   Button_default2,
   buttonVariants
 } from "../chunk-ODLZQXBE.js";
-import "../chunk-5WRI5ZAA.js";
+import "../chunk-J7N2552D.js";
 export {
   Button_default as Button,
   ButtonGroup_default as ButtonGroup,

package/dist/Card/index.cjs

@@ -2,11 +2,11 @@
 
 
 
-var _chunkJPALSO5Ecjs = require('../chunk-JPALSO5E.cjs');
-require('../chunk-DZUJEN5N.cjs');
+var _chunkAVYWDZ7Xcjs = require('../chunk-AVYWDZ7X.cjs');
+require('../chunk-D4TLDLEX.cjs');
 
 
 
 
-exports.Card = _chunkJPALSO5Ecjs.Card_default; exports.cardVariants = _chunkJPALSO5Ecjs.cardVariants; exports.default = _chunkJPALSO5Ecjs.Card_default2;
+exports.Card = _chunkAVYWDZ7Xcjs.Card_default; exports.cardVariants = _chunkAVYWDZ7Xcjs.cardVariants; exports.default = _chunkAVYWDZ7Xcjs.Card_default2;
 //# sourceMappingURL=index.cjs.map

package/dist/Card/index.js

@@ -2,8 +2,8 @@ import {
   Card_default,
   Card_default2,
   cardVariants
-} from "../chunk-APEDJG3R.js";
-import "../chunk-5WRI5ZAA.js";
+} from "../chunk-CZJKT7IC.js";
+import "../chunk-J7N2552D.js";
 export {
   Card_default as Card,
   cardVariants,

package/dist/Json/index.cjs

@@ -1,11 +1,11 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});
 
 
-var _chunkXFUHF75Zcjs = require('../chunk-XFUHF75Z.cjs');
+var _chunkOLKLIWBEcjs = require('../chunk-OLKLIWBE.cjs');
 require('../chunk-7TIFKRWY.cjs');
-require('../chunk-DZUJEN5N.cjs');
+require('../chunk-D4TLDLEX.cjs');
 
 
 
-exports.Json = _chunkXFUHF75Zcjs.Json_default; exports.default = _chunkXFUHF75Zcjs.Json_default2;
+exports.Json = _chunkOLKLIWBEcjs.Json_default; exports.default = _chunkOLKLIWBEcjs.Json_default2;
 //# sourceMappingURL=index.cjs.map

package/dist/Json/index.d.cts

@@ -1,6 +1,7 @@
-import { J as Json } from '../Json-BbMeuEvE.cjs';
-export { a as JsonProps } from '../Json-BbMeuEvE.cjs';
+import { J as Json } from '../Json-DZue23GO.cjs';
+export { a as JsonProps } from '../Json-DZue23GO.cjs';
 import 'react/jsx-runtime';
+import 'react';
 
 
 

package/dist/Json/index.d.ts

@@ -1,6 +1,7 @@
-import { J as Json } from '../Json-BbMeuEvE.js';
-export { a as JsonProps } from '../Json-BbMeuEvE.js';
+import { J as Json } from '../Json-DZue23GO.js';
+export { a as JsonProps } from '../Json-DZue23GO.js';
 import 'react/jsx-runtime';
+import 'react';
 
 
 

package/dist/Json/index.js

@@ -1,9 +1,9 @@
 import {
   Json_default,
   Json_default2
-} from "../chunk-C2BIHVLT.js";
+} from "../chunk-LCSYN3DI.js";
 import "../chunk-ODLZQXBE.js";
-import "../chunk-5WRI5ZAA.js";
+import "../chunk-J7N2552D.js";
 export {
   Json_default as Json,
   Json_default2 as default

package/dist/Json-DZue23GO.d.cts

@@ -0,0 +1,24 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ReactNode } from 'react';
+
+interface JsonProps {
+    /** CSS class name */
+    className?: string;
+    /** When set to true, all nodes will be collapsed by default. Use an integer value to collapse at a particular depth. */
+    collapsed?: boolean | number;
+    /** Optional custom error renderer */
+    errorRenderer?: (error: Error, data: string | object) => ReactNode;
+    /** Optional maximum height of the JSON viewer */
+    maxHeight?: string | number;
+    /** Callback when copy action is performed */
+    onCopy?: (copiedValue: string) => void;
+    /** Object to be visualized JSON string or object */
+    value: string | object;
+}
+/**
+ * Json renderer based on [react-json-view](https://uiwjs.github.io/react-json-view)
+ * with improved error handling, accessibility, and customization options
+ */
+declare const Json: ({ className, collapsed, value, maxHeight, onCopy, errorRenderer, }: JsonProps) => react_jsx_runtime.JSX.Element;
+
+export { Json as J, type JsonProps as a };

package/dist/Json-DZue23GO.d.ts

@@ -0,0 +1,24 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ReactNode } from 'react';
+
+interface JsonProps {
+    /** CSS class name */
+    className?: string;
+    /** When set to true, all nodes will be collapsed by default. Use an integer value to collapse at a particular depth. */
+    collapsed?: boolean | number;
+    /** Optional custom error renderer */
+    errorRenderer?: (error: Error, data: string | object) => ReactNode;
+    /** Optional maximum height of the JSON viewer */
+    maxHeight?: string | number;
+    /** Callback when copy action is performed */
+    onCopy?: (copiedValue: string) => void;
+    /** Object to be visualized JSON string or object */
+    value: string | object;
+}
+/**
+ * Json renderer based on [react-json-view](https://uiwjs.github.io/react-json-view)
+ * with improved error handling, accessibility, and customization options
+ */
+declare const Json: ({ className, collapsed, value, maxHeight, onCopy, errorRenderer, }: JsonProps) => react_jsx_runtime.JSX.Element;
+
+export { Json as J, type JsonProps as a };

package/dist/Label/index.cjs

@@ -2,7 +2,7 @@
 
 
 var _chunkYTQJ6FZKcjs = require('../chunk-YTQJ6FZK.cjs');
-require('../chunk-DZUJEN5N.cjs');
+require('../chunk-D4TLDLEX.cjs');
 
 
 

package/dist/Label/index.js

@@ -2,7 +2,7 @@ import {
   Label_default,
   Label_default2
 } from "../chunk-7IGL67EH.js";
-import "../chunk-5WRI5ZAA.js";
+import "../chunk-J7N2552D.js";
 export {
   Label_default as Label,
   Label_default2 as default

package/dist/Menu/index.cjs

@@ -1,10 +1,10 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});
 
 
-var _chunk5HEZFVFGcjs = require('../chunk-5HEZFVFG.cjs');
-require('../chunk-DZUJEN5N.cjs');
+var _chunkLY45VQ2Ecjs = require('../chunk-LY45VQ2E.cjs');
+require('../chunk-D4TLDLEX.cjs');
 
 
 
-exports.Menu = _chunk5HEZFVFGcjs.Menu_default; exports.default = _chunk5HEZFVFGcjs.Menu_default2;
+exports.Menu = _chunkLY45VQ2Ecjs.Menu_default; exports.default = _chunkLY45VQ2Ecjs.Menu_default2;
 //# sourceMappingURL=index.cjs.map

package/dist/Menu/index.js

@@ -1,8 +1,8 @@
 import {
   Menu_default,
   Menu_default2
-} from "../chunk-L2RCVUXK.js";
-import "../chunk-5WRI5ZAA.js";
+} from "../chunk-7LABJBKF.js";
+import "../chunk-J7N2552D.js";
 export {
   Menu_default as Menu,
   Menu_default2 as default

package/dist/Modal/index.cjs

@@ -2,11 +2,11 @@
 
 
 
-var _chunkVAJODF7Zcjs = require('../chunk-VAJODF7Z.cjs');
-require('../chunk-DZUJEN5N.cjs');
+var _chunkVG5A2YZEcjs = require('../chunk-VG5A2YZE.cjs');
+require('../chunk-D4TLDLEX.cjs');
 
 
 
 
-exports.Modal = _chunkVAJODF7Zcjs.Modal_default; exports.default = _chunkVAJODF7Zcjs.Modal_default2; exports.modalVariants = _chunkVAJODF7Zcjs.modalVariants;
+exports.Modal = _chunkVG5A2YZEcjs.Modal_default; exports.default = _chunkVG5A2YZEcjs.Modal_default2; exports.modalVariants = _chunkVG5A2YZEcjs.modalVariants;
 //# sourceMappingURL=index.cjs.map

package/dist/Modal/index.d.cts

@@ -1,9 +1,10 @@
-import { M as Modal } from '../Modal-DZHeIvQc.cjs';
-export { a as ModalProps, m as modalVariants } from '../Modal-DZHeIvQc.cjs';
+import { M as Modal } from '../Modal-CSOPzGYj.cjs';
+export { a as ModalProps, m as modalVariants } from '../Modal-CSOPzGYj.cjs';
 import 'react/jsx-runtime';
 import 'tailwind-variants';
 import 'tailwind-variants/dist/config.js';
 import '@fuf-stack/pixel-utils';
+import '@nextui-org/modal';
 import 'react';
 
 

package/dist/Modal/index.d.ts

@@ -1,9 +1,10 @@
-import { M as Modal } from '../Modal-DZHeIvQc.js';
-export { a as ModalProps, m as modalVariants } from '../Modal-DZHeIvQc.js';
+import { M as Modal } from '../Modal-CSOPzGYj.js';
+export { a as ModalProps, m as modalVariants } from '../Modal-CSOPzGYj.js';
 import 'react/jsx-runtime';
 import 'tailwind-variants';
 import 'tailwind-variants/dist/config.js';
 import '@fuf-stack/pixel-utils';
+import '@nextui-org/modal';
 import 'react';
 
 

package/dist/Modal/index.js

@@ -2,8 +2,8 @@ import {
   Modal_default,
   Modal_default2,
   modalVariants
-} from "../chunk-F2SRHLNC.js";
-import "../chunk-5WRI5ZAA.js";
+} from "../chunk-CQW46JPO.js";
+import "../chunk-J7N2552D.js";
 export {
   Modal_default as Modal,
   Modal_default2 as default,

package/dist/{Modal-DZHeIvQc.d.cts → Modal-CSOPzGYj.d.cts}

@@ -2,6 +2,7 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as tailwind_variants from 'tailwind-variants';
 import * as tailwind_variants_dist_config_js from 'tailwind-variants/dist/config.js';
 import { TVProps, TVClassName } from '@fuf-stack/pixel-utils';
+import { ModalProps as ModalProps$1 } from '@nextui-org/modal';
 import { ReactNode } from 'react';
 
 declare const modalVariants: tailwind_variants.TVReturnType<{
@@ -162,6 +163,8 @@ interface ModalProps extends VariantProps {
     children?: ReactNode;
     /** CSS class name */
     className?: ClassName;
+    /** Disable animations completely */
+    disableAnimation?: boolean;
     /** modal footer */
     footer?: ReactNode;
     /** modal header */
@@ -170,6 +173,8 @@ interface ModalProps extends VariantProps {
     isOpen: boolean;
     /** close event handler */
     onClose: () => void;
+    /** The container element in which the overlay portal will be placed */
+    portalContainer?: ModalProps$1['portalContainer'];
     /** modal size */
     size?: VariantProps['size'];
     /** HTML data-testid attribute used in e2e tests */
@@ -178,6 +183,6 @@ interface ModalProps extends VariantProps {
 /**
  * Modal component based on [NextUI Modal](https://nextui.org/docs/components/modal)
  */
-declare const Modal: ({ children, className, footer, header, isOpen, onClose, size, testId, }: ModalProps) => react_jsx_runtime.JSX.Element;
+declare const Modal: ({ children, className, disableAnimation, footer, header, isOpen, onClose, portalContainer, size, testId, }: ModalProps) => react_jsx_runtime.JSX.Element;
 
 export { Modal as M, type ModalProps as a, modalVariants as m };

package/dist/{Modal-DZHeIvQc.d.ts → Modal-CSOPzGYj.d.ts}

@@ -2,6 +2,7 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as tailwind_variants from 'tailwind-variants';
 import * as tailwind_variants_dist_config_js from 'tailwind-variants/dist/config.js';
 import { TVProps, TVClassName } from '@fuf-stack/pixel-utils';
+import { ModalProps as ModalProps$1 } from '@nextui-org/modal';
 import { ReactNode } from 'react';
 
 declare const modalVariants: tailwind_variants.TVReturnType<{
@@ -162,6 +163,8 @@ interface ModalProps extends VariantProps {
     children?: ReactNode;
     /** CSS class name */
     className?: ClassName;
+    /** Disable animations completely */
+    disableAnimation?: boolean;
     /** modal footer */
     footer?: ReactNode;
     /** modal header */
@@ -170,6 +173,8 @@ interface ModalProps extends VariantProps {
     isOpen: boolean;
     /** close event handler */
     onClose: () => void;
+    /** The container element in which the overlay portal will be placed */
+    portalContainer?: ModalProps$1['portalContainer'];
     /** modal size */
     size?: VariantProps['size'];
     /** HTML data-testid attribute used in e2e tests */
@@ -178,6 +183,6 @@ interface ModalProps extends VariantProps {
 /**
  * Modal component based on [NextUI Modal](https://nextui.org/docs/components/modal)
  */
-declare const Modal: ({ children, className, footer, header, isOpen, onClose, size, testId, }: ModalProps) => react_jsx_runtime.JSX.Element;
+declare const Modal: ({ children, className, disableAnimation, footer, header, isOpen, onClose, portalContainer, size, testId, }: ModalProps) => react_jsx_runtime.JSX.Element;
 
 export { Modal as M, type ModalProps as a, modalVariants as m };

package/dist/Popover/index.cjs

@@ -1,11 +1,11 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});
 
 
-var _chunkY3SLMQYAcjs = require('../chunk-Y3SLMQYA.cjs');
-require('../chunk-D5HC5WLB.cjs');
-require('../chunk-DZUJEN5N.cjs');
+var _chunk2WDAJ6ERcjs = require('../chunk-2WDAJ6ER.cjs');
+require('../chunk-BXPBP3PC.cjs');
+require('../chunk-D4TLDLEX.cjs');
 
 
 
-exports.Popover = _chunkY3SLMQYAcjs.Popover_default; exports.default = _chunkY3SLMQYAcjs.Popover_default2;
+exports.Popover = _chunk2WDAJ6ERcjs.Popover_default; exports.default = _chunk2WDAJ6ERcjs.Popover_default2;
 //# sourceMappingURL=index.cjs.map

package/dist/Popover/index.js

@@ -1,9 +1,9 @@
 import {
   Popover_default,
   Popover_default2
-} from "../chunk-VU64Z744.js";
-import "../chunk-BAPBIOOG.js";
-import "../chunk-5WRI5ZAA.js";
+} from "../chunk-3QI2ODV2.js";
+import "../chunk-BUWMLU3E.js";
+import "../chunk-J7N2552D.js";
 export {
   Popover_default as Popover,
   Popover_default2 as default

package/dist/ScrollShadow/index.cjs

@@ -1,12 +1,12 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});
 
-var _chunkD5HC5WLBcjs = require('../chunk-D5HC5WLB.cjs');
-require('../chunk-DZUJEN5N.cjs');
+var _chunkBXPBP3PCcjs = require('../chunk-BXPBP3PC.cjs');
+require('../chunk-D4TLDLEX.cjs');
 
 // src/ScrollShadow/index.ts
-var ScrollShadow_default2 = _chunkD5HC5WLBcjs.ScrollShadow_default;
+var ScrollShadow_default2 = _chunkBXPBP3PCcjs.ScrollShadow_default;
 
 
 
-exports.ScrollShadow = _chunkD5HC5WLBcjs.ScrollShadow_default; exports.default = ScrollShadow_default2;
+exports.ScrollShadow = _chunkBXPBP3PCcjs.ScrollShadow_default; exports.default = ScrollShadow_default2;
 //# sourceMappingURL=index.cjs.map

package/dist/ScrollShadow/index.js

@@ -1,7 +1,7 @@
 import {
   ScrollShadow_default
-} from "../chunk-BAPBIOOG.js";
-import "../chunk-5WRI5ZAA.js";
+} from "../chunk-BUWMLU3E.js";
+import "../chunk-J7N2552D.js";
 
 // src/ScrollShadow/index.ts
 var ScrollShadow_default2 = ScrollShadow_default;

package/dist/Table/index.cjs

@@ -0,0 +1,112 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});require('../chunk-D4TLDLEX.cjs');
+
+// src/Table/Table.tsx
+
+
+
+
+
+
+
+
+var _table = require('@nextui-org/table');
+var _pixelutils = require('@fuf-stack/pixel-utils');
+var _jsxruntime = require('react/jsx-runtime');
+var tableVariants = _pixelutils.tv.call(void 0, {
+  slots: {
+    base: "",
+    wrapper: "",
+    table: "",
+    thead: "",
+    tbody: "",
+    tr: "",
+    th: "bg-content2",
+    td: "",
+    tfoot: "",
+    sortIcon: "",
+    emptyWrapper: "",
+    loadingWrapper: ""
+  },
+  variants: {
+    separation: {
+      divider: {
+        tr: 'divide-x rounded-lg border-b data-[last=true]:border-none [&:first-child:not([data-first="true"])]:border-none'
+      },
+      "divider-x": {
+        tr: "divide-x"
+      },
+      "divider-y": {
+        tr: 'rounded-lg border-b data-[last=true]:border-none [&:first-child:not([data-first="true"])]:border-none'
+      },
+      "striped-divider-x": {
+        tr: "divide-x",
+        th: "border-divider",
+        td: "border-divider first:rounded-s-lg last:rounded-e-lg group-data-[odd=true]:bg-content2"
+      },
+      striped: {
+        tr: "",
+        td: "first:rounded-s-lg last:rounded-e-lg group-data-[odd=true]:bg-content2"
+      },
+      none: {}
+    }
+  }
+});
+var Table = ({
+  ariaLabel = void 0,
+  bottomContent = void 0,
+  className = void 0,
+  columns,
+  emptyContent = "No rows to display.",
+  hasWrapper = false,
+  hideHeader = false,
+  loading = false,
+  loadingContent = void 0,
+  rows = [],
+  separation = "none",
+  stickyHeader = false,
+  testId = void 0
+}) => {
+  const variants = tableVariants({ separation });
+  const classNames = _pixelutils.variantsToClassNames.call(void 0, variants, className, "base");
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+    _table.Table,
+    {
+      "aria-label": ariaLabel,
+      bottomContent,
+      classNames,
+      "data-testid": testId,
+      hideHeader,
+      isHeaderSticky: stickyHeader,
+      isStriped: separation === "striped" || separation === "striped-divider-x",
+      removeWrapper: !hasWrapper,
+      children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _table.TableHeader, { columns, children: (column) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _table.TableColumn, { children: column.label }, column.key) }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+          _table.TableBody,
+          {
+            isLoading: loading,
+            loadingContent: loadingContent || "...",
+            emptyContent,
+            items: rows,
+            children: (item) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+              _table.TableRow,
+              {
+                "data-testid": testId && ((item == null ? void 0 : item.testId) || (item == null ? void 0 : item.key)) && `${testId || "table"}_item_${JSON.stringify(item.testId || item.key)}`,
+                children: (columnKey) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _table.TableCell, { children: _table.getKeyValue.call(void 0, item, columnKey) })
+              },
+              item.key
+            )
+          }
+        )
+      ]
+    }
+  );
+};
+var Table_default = Table;
+
+// src/Table/index.ts
+var Table_default2 = Table_default;
+
+
+exports.default = Table_default2;
+//# sourceMappingURL=index.cjs.map

package/dist/Table/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["/home/runner/work/pixels/pixels/packages/pixels/dist/Table/index.cjs","../../src/Table/Table.tsx","../../src/Table/index.ts"],"names":[],"mappings":"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","file":"/home/runner/work/pixels/pixels/packages/pixels/dist/Table/index.cjs","sourcesContent":[null,"import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { ReactNode } from 'react';\n\nimport {\n  getKeyValue,\n  Table as NextTable,\n  TableBody,\n  TableCell,\n  TableColumn,\n  TableHeader,\n  TableRow,\n} from '@nextui-org/table';\n\nimport { tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\n// import { slugify } from '../helpers';\n\n// table styling variants\nexport const tableVariants = tv({\n  slots: {\n    base: '',\n    wrapper: '',\n    table: '',\n    thead: '',\n    tbody: '',\n    tr: '',\n    th: 'bg-content2',\n    td: '',\n    tfoot: '',\n    sortIcon: '',\n    emptyWrapper: '',\n    loadingWrapper: '',\n  },\n  variants: {\n    separation: {\n      divider: {\n        tr: 'divide-x rounded-lg border-b data-[last=true]:border-none [&:first-child:not([data-first=\"true\"])]:border-none',\n      },\n      'divider-x': {\n        tr: 'divide-x',\n      },\n      'divider-y': {\n        tr: 'rounded-lg border-b data-[last=true]:border-none [&:first-child:not([data-first=\"true\"])]:border-none',\n      },\n      'striped-divider-x': {\n        tr: 'divide-x',\n        th: 'border-divider',\n        td: 'border-divider first:rounded-s-lg last:rounded-e-lg group-data-[odd=true]:bg-content2',\n      },\n      striped: {\n        tr: '',\n        td: 'first:rounded-s-lg last:rounded-e-lg group-data-[odd=true]:bg-content2',\n      },\n      none: {},\n    },\n  },\n});\n\ntype VariantProps = TVProps<typeof tableVariants>;\ntype ClassName = TVClassName<typeof tableVariants>;\n\nexport interface TableColumnProps {\n  key: string;\n  label: ReactNode;\n}\n\ninterface TableRowProps {\n  key: string | number;\n  [key: string | number]: ReactNode;\n}\n\nexport interface TableProps extends VariantProps {\n  /** Aria label for the Table. */\n  ariaLabel?: string;\n  /** Component to display at the bottom of the Table. */\n  bottomContent?: ReactNode;\n  /** CSS class name */\n  className?: ClassName;\n  /** Objects with table data */\n  columns: TableColumnProps[];\n  /** Component to display if there are no rows! */\n  emptyContent?: ReactNode;\n  /** Determine if the Table should have a card like wrapper. */\n  hasWrapper?: boolean;\n  /** remove header */\n  hideHeader?: boolean;\n  /** Tells the Table to show the loading component. */\n  loading?: boolean;\n  /** Loading animation component. */\n  loadingContent?: ReactNode;\n  /** Items displayed as rows in the Table. Should have key-value pair for each column. */\n  rows?: TableRowProps[];\n  /** Separation style for the rows & columns. */\n  separation?:\n    | 'none'\n    | 'striped'\n    | 'striped-divider-x'\n    | 'divider-x'\n    | 'divider-y'\n    | 'divider';\n  /** Keeps the header of the Table in view while scrolling a height limited Table. */\n  stickyHeader?: boolean;\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n}\n\n/**\n * Table component based on [NextUI Table](https://nextui.org/docs/components/table)\n */\nconst Table = ({\n  ariaLabel = undefined,\n  bottomContent = undefined,\n  className = undefined,\n  columns,\n  emptyContent = 'No rows to display.',\n  hasWrapper = false,\n  hideHeader = false,\n  loading = false,\n  loadingContent = undefined,\n  rows = [],\n  separation = 'none',\n  stickyHeader = false,\n  testId = undefined,\n}: TableProps) => {\n  const variants = tableVariants({ separation });\n  const classNames = variantsToClassNames(variants, className, 'base');\n\n  return (\n    <NextTable\n      aria-label={ariaLabel}\n      bottomContent={bottomContent}\n      classNames={classNames}\n      data-testid={testId} // TODO: should we use slugify here? && slugify(testId)\n      hideHeader={hideHeader}\n      isHeaderSticky={stickyHeader}\n      isStriped={separation === 'striped' || separation === 'striped-divider-x'}\n      removeWrapper={!hasWrapper}\n    >\n      <TableHeader columns={columns}>\n        {(column: TableColumnProps) => (\n          <TableColumn key={column.key}>{column.label}</TableColumn>\n        )}\n      </TableHeader>\n      <TableBody\n        isLoading={loading}\n        loadingContent={loadingContent || '...'} // TODO: use future spinner/loading component\n        emptyContent={emptyContent}\n        items={rows}\n      >\n        {(item: TableRowProps) => (\n          <TableRow\n            key={item.key}\n            data-testid={\n              testId &&\n              (item?.testId || item?.key) &&\n              `${testId || 'table'}_item_${JSON.stringify(item.testId || item.key)}`\n            }\n            // TODO: sluggify? data-testid={`${slugify(testId || 'table')}_item_${slugify(JSON.stringify(item.testId || item.key))}`}\n          >\n            {(columnKey) => (\n              <TableCell>{getKeyValue(item, columnKey)}</TableCell>\n            )}\n          </TableRow>\n        )}\n      </TableBody>\n    </NextTable>\n  );\n};\n\nexport default Table;\n","import Table from './Table';\n\nexport default Table;\n"]}