@fuf-stack/pixels 0.29.3 → 0.31.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (98) hide show
  1. package/dist/Accordion/index.cjs +3 -3
  2. package/dist/Accordion/index.js +2 -2
  3. package/dist/Avatar/index.cjs +1 -1
  4. package/dist/Avatar/index.js +1 -1
  5. package/dist/AvatarGroup/index.cjs +3 -3
  6. package/dist/AvatarGroup/index.js +2 -2
  7. package/dist/Badge/index.cjs +1 -1
  8. package/dist/Badge/index.js +1 -1
  9. package/dist/Breadcrumb/index.cjs +3 -3
  10. package/dist/Breadcrumb/index.js +2 -2
  11. package/dist/Button/index.cjs +1 -1
  12. package/dist/Button/index.js +1 -1
  13. package/dist/Card/index.cjs +3 -3
  14. package/dist/Card/index.js +2 -2
  15. package/dist/Drawer/index.cjs +77 -0
  16. package/dist/Drawer/index.cjs.map +1 -0
  17. package/dist/Drawer/index.d.cts +142 -0
  18. package/dist/Drawer/index.d.ts +142 -0
  19. package/dist/Drawer/index.js +77 -0
  20. package/dist/Drawer/index.js.map +1 -0
  21. package/dist/Json/index.cjs +3 -3
  22. package/dist/Json/index.d.cts +3 -2
  23. package/dist/Json/index.d.ts +3 -2
  24. package/dist/Json/index.js +2 -2
  25. package/dist/Json-DZue23GO.d.cts +24 -0
  26. package/dist/Json-DZue23GO.d.ts +24 -0
  27. package/dist/Label/index.cjs +1 -1
  28. package/dist/Label/index.js +1 -1
  29. package/dist/Menu/index.cjs +3 -3
  30. package/dist/Menu/index.js +2 -2
  31. package/dist/Modal/index.cjs +1 -1
  32. package/dist/Modal/index.js +1 -1
  33. package/dist/Popover/index.cjs +3 -3
  34. package/dist/Popover/index.js +2 -2
  35. package/dist/ScrollShadow/index.cjs +1 -1
  36. package/dist/ScrollShadow/index.js +1 -1
  37. package/dist/Table/index.cjs +112 -0
  38. package/dist/Table/index.cjs.map +1 -0
  39. package/dist/Table/index.d.cts +244 -0
  40. package/dist/Table/index.d.ts +244 -0
  41. package/dist/Table/index.js +112 -0
  42. package/dist/Table/index.js.map +1 -0
  43. package/dist/Tabs/index.cjs +1 -1
  44. package/dist/Tabs/index.js +1 -1
  45. package/dist/Tooltip/index.cjs +1 -1
  46. package/dist/Tooltip/index.js +1 -1
  47. package/dist/{chunk-37C63OKM.cjs → chunk-2WDAJ6ER.cjs} +9 -5
  48. package/dist/chunk-2WDAJ6ER.cjs.map +1 -0
  49. package/dist/{chunk-EIOL2HNA.js → chunk-33DBA7U2.js} +8 -5
  50. package/dist/{chunk-EIOL2HNA.js.map → chunk-33DBA7U2.js.map} +1 -1
  51. package/dist/{chunk-JDLU5AUA.js → chunk-3QI2ODV2.js} +9 -5
  52. package/dist/{chunk-JDLU5AUA.js.map → chunk-3QI2ODV2.js.map} +1 -1
  53. package/dist/{chunk-L2RCVUXK.js → chunk-7LABJBKF.js} +2 -2
  54. package/dist/{chunk-L2RCVUXK.js.map → chunk-7LABJBKF.js.map} +1 -1
  55. package/dist/{chunk-OP6ST4KB.cjs → chunk-7XJHVFT3.cjs} +16 -14
  56. package/dist/chunk-7XJHVFT3.cjs.map +1 -0
  57. package/dist/{chunk-JPALSO5E.cjs → chunk-AVYWDZ7X.cjs} +8 -4
  58. package/dist/chunk-AVYWDZ7X.cjs.map +1 -0
  59. package/dist/{chunk-APEDJG3R.js → chunk-CZJKT7IC.js} +7 -3
  60. package/dist/{chunk-APEDJG3R.js.map → chunk-CZJKT7IC.js.map} +1 -1
  61. package/dist/chunk-D4TLDLEX.cjs +63 -0
  62. package/dist/chunk-D4TLDLEX.cjs.map +1 -0
  63. package/dist/{chunk-5WRI5ZAA.js → chunk-J7N2552D.js} +33 -1
  64. package/dist/{chunk-C2BIHVLT.js → chunk-LCSYN3DI.js} +180 -96
  65. package/dist/chunk-LCSYN3DI.js.map +1 -0
  66. package/dist/{chunk-RMLPCTDU.js → chunk-LPCCBJ2T.js} +8 -5
  67. package/dist/{chunk-RMLPCTDU.js.map → chunk-LPCCBJ2T.js.map} +1 -1
  68. package/dist/{chunk-5HEZFVFG.cjs → chunk-LY45VQ2E.cjs} +3 -3
  69. package/dist/chunk-LY45VQ2E.cjs.map +1 -0
  70. package/dist/{chunk-RJAVAHBK.cjs → chunk-NVNT4PMS.cjs} +9 -6
  71. package/dist/chunk-NVNT4PMS.cjs.map +1 -0
  72. package/dist/{chunk-XFUHF75Z.cjs → chunk-OLKLIWBE.cjs} +213 -129
  73. package/dist/chunk-OLKLIWBE.cjs.map +1 -0
  74. package/dist/{chunk-337S7HUF.js → chunk-XVCKJE3P.js} +14 -12
  75. package/dist/{chunk-337S7HUF.js.map → chunk-XVCKJE3P.js.map} +1 -1
  76. package/dist/{chunk-VHEIRVBB.cjs → chunk-ZXGEK67F.cjs} +9 -6
  77. package/dist/chunk-ZXGEK67F.cjs.map +1 -0
  78. package/dist/hooks/index.cjs +1 -1
  79. package/dist/hooks/index.js +1 -1
  80. package/dist/index.cjs +15 -15
  81. package/dist/index.cjs.map +1 -1
  82. package/dist/index.d.cts +1 -1
  83. package/dist/index.d.ts +1 -1
  84. package/dist/index.js +16 -16
  85. package/package.json +34 -22
  86. package/dist/Json-BbMeuEvE.d.cts +0 -18
  87. package/dist/Json-BbMeuEvE.d.ts +0 -18
  88. package/dist/chunk-37C63OKM.cjs.map +0 -1
  89. package/dist/chunk-5HEZFVFG.cjs.map +0 -1
  90. package/dist/chunk-C2BIHVLT.js.map +0 -1
  91. package/dist/chunk-DZUJEN5N.cjs +0 -31
  92. package/dist/chunk-DZUJEN5N.cjs.map +0 -1
  93. package/dist/chunk-JPALSO5E.cjs.map +0 -1
  94. package/dist/chunk-OP6ST4KB.cjs.map +0 -1
  95. package/dist/chunk-RJAVAHBK.cjs.map +0 -1
  96. package/dist/chunk-VHEIRVBB.cjs.map +0 -1
  97. package/dist/chunk-XFUHF75Z.cjs.map +0 -1
  98. /package/dist/{chunk-5WRI5ZAA.js.map → chunk-J7N2552D.js.map} +0 -0
@@ -1,6 +1,7 @@
1
- import { J as Json } from '../Json-BbMeuEvE.cjs';
2
- export { a as JsonProps } from '../Json-BbMeuEvE.cjs';
1
+ import { J as Json } from '../Json-DZue23GO.cjs';
2
+ export { a as JsonProps } from '../Json-DZue23GO.cjs';
3
3
  import 'react/jsx-runtime';
4
+ import 'react';
4
5
 
5
6
 
6
7
 
@@ -1,6 +1,7 @@
1
- import { J as Json } from '../Json-BbMeuEvE.js';
2
- export { a as JsonProps } from '../Json-BbMeuEvE.js';
1
+ import { J as Json } from '../Json-DZue23GO.js';
2
+ export { a as JsonProps } from '../Json-DZue23GO.js';
3
3
  import 'react/jsx-runtime';
4
+ import 'react';
4
5
 
5
6
 
6
7
 
@@ -1,9 +1,9 @@
1
1
  import {
2
2
  Json_default,
3
3
  Json_default2
4
- } from "../chunk-C2BIHVLT.js";
4
+ } from "../chunk-LCSYN3DI.js";
5
5
  import "../chunk-ODLZQXBE.js";
6
- import "../chunk-5WRI5ZAA.js";
6
+ import "../chunk-J7N2552D.js";
7
7
  export {
8
8
  Json_default as Json,
9
9
  Json_default2 as default
@@ -0,0 +1,24 @@
1
+ import * as react_jsx_runtime from 'react/jsx-runtime';
2
+ import { ReactNode } from 'react';
3
+
4
+ interface JsonProps {
5
+ /** CSS class name */
6
+ className?: string;
7
+ /** When set to true, all nodes will be collapsed by default. Use an integer value to collapse at a particular depth. */
8
+ collapsed?: boolean | number;
9
+ /** Optional custom error renderer */
10
+ errorRenderer?: (error: Error, data: string | object) => ReactNode;
11
+ /** Optional maximum height of the JSON viewer */
12
+ maxHeight?: string | number;
13
+ /** Callback when copy action is performed */
14
+ onCopy?: (copiedValue: string) => void;
15
+ /** Object to be visualized JSON string or object */
16
+ value: string | object;
17
+ }
18
+ /**
19
+ * Json renderer based on [react-json-view](https://uiwjs.github.io/react-json-view)
20
+ * with improved error handling, accessibility, and customization options
21
+ */
22
+ declare const Json: ({ className, collapsed, value, maxHeight, onCopy, errorRenderer, }: JsonProps) => react_jsx_runtime.JSX.Element;
23
+
24
+ export { Json as J, type JsonProps as a };
@@ -0,0 +1,24 @@
1
+ import * as react_jsx_runtime from 'react/jsx-runtime';
2
+ import { ReactNode } from 'react';
3
+
4
+ interface JsonProps {
5
+ /** CSS class name */
6
+ className?: string;
7
+ /** When set to true, all nodes will be collapsed by default. Use an integer value to collapse at a particular depth. */
8
+ collapsed?: boolean | number;
9
+ /** Optional custom error renderer */
10
+ errorRenderer?: (error: Error, data: string | object) => ReactNode;
11
+ /** Optional maximum height of the JSON viewer */
12
+ maxHeight?: string | number;
13
+ /** Callback when copy action is performed */
14
+ onCopy?: (copiedValue: string) => void;
15
+ /** Object to be visualized JSON string or object */
16
+ value: string | object;
17
+ }
18
+ /**
19
+ * Json renderer based on [react-json-view](https://uiwjs.github.io/react-json-view)
20
+ * with improved error handling, accessibility, and customization options
21
+ */
22
+ declare const Json: ({ className, collapsed, value, maxHeight, onCopy, errorRenderer, }: JsonProps) => react_jsx_runtime.JSX.Element;
23
+
24
+ export { Json as J, type JsonProps as a };
@@ -2,7 +2,7 @@
2
2
 
3
3
 
4
4
  var _chunkYTQJ6FZKcjs = require('../chunk-YTQJ6FZK.cjs');
5
- require('../chunk-DZUJEN5N.cjs');
5
+ require('../chunk-D4TLDLEX.cjs');
6
6
 
7
7
 
8
8
 
@@ -2,7 +2,7 @@ import {
2
2
  Label_default,
3
3
  Label_default2
4
4
  } from "../chunk-7IGL67EH.js";
5
- import "../chunk-5WRI5ZAA.js";
5
+ import "../chunk-J7N2552D.js";
6
6
  export {
7
7
  Label_default as Label,
8
8
  Label_default2 as default
@@ -1,10 +1,10 @@
1
1
  "use strict";Object.defineProperty(exports, "__esModule", {value: true});
2
2
 
3
3
 
4
- var _chunk5HEZFVFGcjs = require('../chunk-5HEZFVFG.cjs');
5
- require('../chunk-DZUJEN5N.cjs');
4
+ var _chunkLY45VQ2Ecjs = require('../chunk-LY45VQ2E.cjs');
5
+ require('../chunk-D4TLDLEX.cjs');
6
6
 
7
7
 
8
8
 
9
- exports.Menu = _chunk5HEZFVFGcjs.Menu_default; exports.default = _chunk5HEZFVFGcjs.Menu_default2;
9
+ exports.Menu = _chunkLY45VQ2Ecjs.Menu_default; exports.default = _chunkLY45VQ2Ecjs.Menu_default2;
10
10
  //# sourceMappingURL=index.cjs.map
@@ -1,8 +1,8 @@
1
1
  import {
2
2
  Menu_default,
3
3
  Menu_default2
4
- } from "../chunk-L2RCVUXK.js";
5
- import "../chunk-5WRI5ZAA.js";
4
+ } from "../chunk-7LABJBKF.js";
5
+ import "../chunk-J7N2552D.js";
6
6
  export {
7
7
  Menu_default as Menu,
8
8
  Menu_default2 as default
@@ -3,7 +3,7 @@
3
3
 
4
4
 
5
5
  var _chunkVG5A2YZEcjs = require('../chunk-VG5A2YZE.cjs');
6
- require('../chunk-DZUJEN5N.cjs');
6
+ require('../chunk-D4TLDLEX.cjs');
7
7
 
8
8
 
9
9
 
@@ -3,7 +3,7 @@ import {
3
3
  Modal_default2,
4
4
  modalVariants
5
5
  } from "../chunk-CQW46JPO.js";
6
- import "../chunk-5WRI5ZAA.js";
6
+ import "../chunk-J7N2552D.js";
7
7
  export {
8
8
  Modal_default as Modal,
9
9
  Modal_default2 as default,
@@ -1,11 +1,11 @@
1
1
  "use strict";Object.defineProperty(exports, "__esModule", {value: true});
2
2
 
3
3
 
4
- var _chunk37C63OKMcjs = require('../chunk-37C63OKM.cjs');
4
+ var _chunk2WDAJ6ERcjs = require('../chunk-2WDAJ6ER.cjs');
5
5
  require('../chunk-BXPBP3PC.cjs');
6
- require('../chunk-DZUJEN5N.cjs');
6
+ require('../chunk-D4TLDLEX.cjs');
7
7
 
8
8
 
9
9
 
10
- exports.Popover = _chunk37C63OKMcjs.Popover_default; exports.default = _chunk37C63OKMcjs.Popover_default2;
10
+ exports.Popover = _chunk2WDAJ6ERcjs.Popover_default; exports.default = _chunk2WDAJ6ERcjs.Popover_default2;
11
11
  //# sourceMappingURL=index.cjs.map
@@ -1,9 +1,9 @@
1
1
  import {
2
2
  Popover_default,
3
3
  Popover_default2
4
- } from "../chunk-JDLU5AUA.js";
4
+ } from "../chunk-3QI2ODV2.js";
5
5
  import "../chunk-BUWMLU3E.js";
6
- import "../chunk-5WRI5ZAA.js";
6
+ import "../chunk-J7N2552D.js";
7
7
  export {
8
8
  Popover_default as Popover,
9
9
  Popover_default2 as default
@@ -1,7 +1,7 @@
1
1
  "use strict";Object.defineProperty(exports, "__esModule", {value: true});
2
2
 
3
3
  var _chunkBXPBP3PCcjs = require('../chunk-BXPBP3PC.cjs');
4
- require('../chunk-DZUJEN5N.cjs');
4
+ require('../chunk-D4TLDLEX.cjs');
5
5
 
6
6
  // src/ScrollShadow/index.ts
7
7
  var ScrollShadow_default2 = _chunkBXPBP3PCcjs.ScrollShadow_default;
@@ -1,7 +1,7 @@
1
1
  import {
2
2
  ScrollShadow_default
3
3
  } from "../chunk-BUWMLU3E.js";
4
- import "../chunk-5WRI5ZAA.js";
4
+ import "../chunk-J7N2552D.js";
5
5
 
6
6
  // src/ScrollShadow/index.ts
7
7
  var ScrollShadow_default2 = ScrollShadow_default;
@@ -0,0 +1,112 @@
1
+ "use strict";Object.defineProperty(exports, "__esModule", {value: true});require('../chunk-D4TLDLEX.cjs');
2
+
3
+ // src/Table/Table.tsx
4
+
5
+
6
+
7
+
8
+
9
+
10
+
11
+
12
+ var _table = require('@nextui-org/table');
13
+ var _pixelutils = require('@fuf-stack/pixel-utils');
14
+ var _jsxruntime = require('react/jsx-runtime');
15
+ var tableVariants = _pixelutils.tv.call(void 0, {
16
+ slots: {
17
+ base: "",
18
+ wrapper: "",
19
+ table: "",
20
+ thead: "",
21
+ tbody: "",
22
+ tr: "",
23
+ th: "bg-content2",
24
+ td: "",
25
+ tfoot: "",
26
+ sortIcon: "",
27
+ emptyWrapper: "",
28
+ loadingWrapper: ""
29
+ },
30
+ variants: {
31
+ separation: {
32
+ divider: {
33
+ tr: 'divide-x rounded-lg border-b data-[last=true]:border-none [&:first-child:not([data-first="true"])]:border-none'
34
+ },
35
+ "divider-x": {
36
+ tr: "divide-x"
37
+ },
38
+ "divider-y": {
39
+ tr: 'rounded-lg border-b data-[last=true]:border-none [&:first-child:not([data-first="true"])]:border-none'
40
+ },
41
+ "striped-divider-x": {
42
+ tr: "divide-x",
43
+ th: "border-divider",
44
+ td: "border-divider first:rounded-s-lg last:rounded-e-lg group-data-[odd=true]:bg-content2"
45
+ },
46
+ striped: {
47
+ tr: "",
48
+ td: "first:rounded-s-lg last:rounded-e-lg group-data-[odd=true]:bg-content2"
49
+ },
50
+ none: {}
51
+ }
52
+ }
53
+ });
54
+ var Table = ({
55
+ ariaLabel = void 0,
56
+ bottomContent = void 0,
57
+ className = void 0,
58
+ columns,
59
+ emptyContent = "No rows to display.",
60
+ hasWrapper = false,
61
+ hideHeader = false,
62
+ loading = false,
63
+ loadingContent = void 0,
64
+ rows = [],
65
+ separation = "none",
66
+ stickyHeader = false,
67
+ testId = void 0
68
+ }) => {
69
+ const variants = tableVariants({ separation });
70
+ const classNames = _pixelutils.variantsToClassNames.call(void 0, variants, className, "base");
71
+ return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0,
72
+ _table.Table,
73
+ {
74
+ "aria-label": ariaLabel,
75
+ bottomContent,
76
+ classNames,
77
+ "data-testid": testId,
78
+ hideHeader,
79
+ isHeaderSticky: stickyHeader,
80
+ isStriped: separation === "striped" || separation === "striped-divider-x",
81
+ removeWrapper: !hasWrapper,
82
+ children: [
83
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _table.TableHeader, { columns, children: (column) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _table.TableColumn, { children: column.label }, column.key) }),
84
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
85
+ _table.TableBody,
86
+ {
87
+ isLoading: loading,
88
+ loadingContent: loadingContent || "...",
89
+ emptyContent,
90
+ items: rows,
91
+ children: (item) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
92
+ _table.TableRow,
93
+ {
94
+ "data-testid": testId && ((item == null ? void 0 : item.testId) || (item == null ? void 0 : item.key)) && `${testId || "table"}_item_${JSON.stringify(item.testId || item.key)}`,
95
+ children: (columnKey) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _table.TableCell, { children: _table.getKeyValue.call(void 0, item, columnKey) })
96
+ },
97
+ item.key
98
+ )
99
+ }
100
+ )
101
+ ]
102
+ }
103
+ );
104
+ };
105
+ var Table_default = Table;
106
+
107
+ // src/Table/index.ts
108
+ var Table_default2 = Table_default;
109
+
110
+
111
+ exports.default = Table_default2;
112
+ //# sourceMappingURL=index.cjs.map
@@ -0,0 +1 @@
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"]}
@@ -0,0 +1,244 @@
1
+ import * as react_jsx_runtime from 'react/jsx-runtime';
2
+ import * as tailwind_variants from 'tailwind-variants';
3
+ import * as tailwind_variants_dist_config_js from 'tailwind-variants/dist/config.js';
4
+ import { TVProps, TVClassName } from '@fuf-stack/pixel-utils';
5
+ import { ReactNode } from 'react';
6
+
7
+ declare const tableVariants: tailwind_variants.TVReturnType<{
8
+ separation: {
9
+ divider: {
10
+ tr: string;
11
+ };
12
+ 'divider-x': {
13
+ tr: string;
14
+ };
15
+ 'divider-y': {
16
+ tr: string;
17
+ };
18
+ 'striped-divider-x': {
19
+ tr: string;
20
+ th: string;
21
+ td: string;
22
+ };
23
+ striped: {
24
+ tr: string;
25
+ td: string;
26
+ };
27
+ none: {};
28
+ };
29
+ }, {
30
+ base: string;
31
+ wrapper: string;
32
+ table: string;
33
+ thead: string;
34
+ tbody: string;
35
+ tr: string;
36
+ th: string;
37
+ td: string;
38
+ tfoot: string;
39
+ sortIcon: string;
40
+ emptyWrapper: string;
41
+ loadingWrapper: string;
42
+ }, undefined, tailwind_variants_dist_config_js.TVConfig<{
43
+ separation: {
44
+ divider: {
45
+ tr: string;
46
+ };
47
+ 'divider-x': {
48
+ tr: string;
49
+ };
50
+ 'divider-y': {
51
+ tr: string;
52
+ };
53
+ 'striped-divider-x': {
54
+ tr: string;
55
+ th: string;
56
+ td: string;
57
+ };
58
+ striped: {
59
+ tr: string;
60
+ td: string;
61
+ };
62
+ none: {};
63
+ };
64
+ }, {
65
+ separation: {
66
+ divider: {
67
+ tr: string;
68
+ };
69
+ 'divider-x': {
70
+ tr: string;
71
+ };
72
+ 'divider-y': {
73
+ tr: string;
74
+ };
75
+ 'striped-divider-x': {
76
+ tr: string;
77
+ th: string;
78
+ td: string;
79
+ };
80
+ striped: {
81
+ tr: string;
82
+ td: string;
83
+ };
84
+ none: {};
85
+ };
86
+ }>, {
87
+ separation: {
88
+ divider: {
89
+ tr: string;
90
+ };
91
+ 'divider-x': {
92
+ tr: string;
93
+ };
94
+ 'divider-y': {
95
+ tr: string;
96
+ };
97
+ 'striped-divider-x': {
98
+ tr: string;
99
+ th: string;
100
+ td: string;
101
+ };
102
+ striped: {
103
+ tr: string;
104
+ td: string;
105
+ };
106
+ none: {};
107
+ };
108
+ }, {
109
+ base: string;
110
+ wrapper: string;
111
+ table: string;
112
+ thead: string;
113
+ tbody: string;
114
+ tr: string;
115
+ th: string;
116
+ td: string;
117
+ tfoot: string;
118
+ sortIcon: string;
119
+ emptyWrapper: string;
120
+ loadingWrapper: string;
121
+ }, tailwind_variants.TVReturnType<{
122
+ separation: {
123
+ divider: {
124
+ tr: string;
125
+ };
126
+ 'divider-x': {
127
+ tr: string;
128
+ };
129
+ 'divider-y': {
130
+ tr: string;
131
+ };
132
+ 'striped-divider-x': {
133
+ tr: string;
134
+ th: string;
135
+ td: string;
136
+ };
137
+ striped: {
138
+ tr: string;
139
+ td: string;
140
+ };
141
+ none: {};
142
+ };
143
+ }, {
144
+ base: string;
145
+ wrapper: string;
146
+ table: string;
147
+ thead: string;
148
+ tbody: string;
149
+ tr: string;
150
+ th: string;
151
+ td: string;
152
+ tfoot: string;
153
+ sortIcon: string;
154
+ emptyWrapper: string;
155
+ loadingWrapper: string;
156
+ }, undefined, tailwind_variants_dist_config_js.TVConfig<{
157
+ separation: {
158
+ divider: {
159
+ tr: string;
160
+ };
161
+ 'divider-x': {
162
+ tr: string;
163
+ };
164
+ 'divider-y': {
165
+ tr: string;
166
+ };
167
+ 'striped-divider-x': {
168
+ tr: string;
169
+ th: string;
170
+ td: string;
171
+ };
172
+ striped: {
173
+ tr: string;
174
+ td: string;
175
+ };
176
+ none: {};
177
+ };
178
+ }, {
179
+ separation: {
180
+ divider: {
181
+ tr: string;
182
+ };
183
+ 'divider-x': {
184
+ tr: string;
185
+ };
186
+ 'divider-y': {
187
+ tr: string;
188
+ };
189
+ 'striped-divider-x': {
190
+ tr: string;
191
+ th: string;
192
+ td: string;
193
+ };
194
+ striped: {
195
+ tr: string;
196
+ td: string;
197
+ };
198
+ none: {};
199
+ };
200
+ }>, unknown, unknown, undefined>>;
201
+ type VariantProps = TVProps<typeof tableVariants>;
202
+ type ClassName = TVClassName<typeof tableVariants>;
203
+ interface TableColumnProps {
204
+ key: string;
205
+ label: ReactNode;
206
+ }
207
+ interface TableRowProps {
208
+ key: string | number;
209
+ [key: string | number]: ReactNode;
210
+ }
211
+ interface TableProps extends VariantProps {
212
+ /** Aria label for the Table. */
213
+ ariaLabel?: string;
214
+ /** Component to display at the bottom of the Table. */
215
+ bottomContent?: ReactNode;
216
+ /** CSS class name */
217
+ className?: ClassName;
218
+ /** Objects with table data */
219
+ columns: TableColumnProps[];
220
+ /** Component to display if there are no rows! */
221
+ emptyContent?: ReactNode;
222
+ /** Determine if the Table should have a card like wrapper. */
223
+ hasWrapper?: boolean;
224
+ /** remove header */
225
+ hideHeader?: boolean;
226
+ /** Tells the Table to show the loading component. */
227
+ loading?: boolean;
228
+ /** Loading animation component. */
229
+ loadingContent?: ReactNode;
230
+ /** Items displayed as rows in the Table. Should have key-value pair for each column. */
231
+ rows?: TableRowProps[];
232
+ /** Separation style for the rows & columns. */
233
+ separation?: 'none' | 'striped' | 'striped-divider-x' | 'divider-x' | 'divider-y' | 'divider';
234
+ /** Keeps the header of the Table in view while scrolling a height limited Table. */
235
+ stickyHeader?: boolean;
236
+ /** HTML data-testid attribute used in e2e tests */
237
+ testId?: string;
238
+ }
239
+ /**
240
+ * Table component based on [NextUI Table](https://nextui.org/docs/components/table)
241
+ */
242
+ declare const Table: ({ ariaLabel, bottomContent, className, columns, emptyContent, hasWrapper, hideHeader, loading, loadingContent, rows, separation, stickyHeader, testId, }: TableProps) => react_jsx_runtime.JSX.Element;
243
+
244
+ export { Table as default };