@fuf-stack/pixels 0.32.1 → 0.32.2
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.
- package/dist/Table/index.cjs +4 -106
- package/dist/Table/index.cjs.map +1 -1
- package/dist/Table/index.d.cts +9 -242
- package/dist/Table/index.d.ts +9 -242
- package/dist/Table/index.js +5 -107
- package/dist/Table/index.js.map +1 -1
- package/dist/Table--d9l8Xlk.d.cts +244 -0
- package/dist/Table--d9l8Xlk.d.ts +244 -0
- package/dist/chunk-DQE7D2UZ.js +111 -0
- package/dist/chunk-DQE7D2UZ.js.map +1 -0
- package/dist/chunk-TA3MY4KY.cjs +111 -0
- package/dist/chunk-TA3MY4KY.cjs.map +1 -0
- package/dist/index.cjs +5 -1
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +1 -0
- package/dist/index.d.ts +1 -0
- package/dist/index.js +4 -0
- package/package.json +3 -3
package/dist/Table/index.cjs
CHANGED
|
@@ -1,112 +1,10 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports, "__esModule", {value: true});
|
|
1
|
+
"use strict";Object.defineProperty(exports, "__esModule", {value: true});
|
|
2
2
|
|
|
3
|
-
// src/Table/Table.tsx
|
|
4
3
|
|
|
4
|
+
var _chunkTA3MY4KYcjs = require('../chunk-TA3MY4KY.cjs');
|
|
5
|
+
require('../chunk-D4TLDLEX.cjs');
|
|
5
6
|
|
|
6
7
|
|
|
7
8
|
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
var _table = require('@heroui/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 && _pixelutils.slugify.call(void 0, 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
|
-
children: (columnKey) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _table.TableCell, { children: _table.getKeyValue.call(void 0, item, columnKey) })
|
|
95
|
-
},
|
|
96
|
-
item.key
|
|
97
|
-
)
|
|
98
|
-
}
|
|
99
|
-
)
|
|
100
|
-
]
|
|
101
|
-
}
|
|
102
|
-
);
|
|
103
|
-
};
|
|
104
|
-
var Table_default = Table;
|
|
105
|
-
|
|
106
|
-
// src/Table/index.ts
|
|
107
|
-
var Table_default2 = Table_default;
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
exports.default = Table_default2; exports.tableVariants = tableVariants;
|
|
9
|
+
exports.default = _chunkTA3MY4KYcjs.Table_default; exports.tableVariants = _chunkTA3MY4KYcjs.tableVariants;
|
|
112
10
|
//# sourceMappingURL=index.cjs.map
|
package/dist/Table/index.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["/home/runner/work/pixels/pixels/packages/pixels/dist/Table/index.cjs"
|
|
1
|
+
{"version":3,"sources":["/home/runner/work/pixels/pixels/packages/pixels/dist/Table/index.cjs"],"names":[],"mappings":"AAAA;AACE;AACA;AACF,yDAA8B;AAC9B,iCAA8B;AAC9B;AACE;AACA;AACF,2GAAC","file":"/home/runner/work/pixels/pixels/packages/pixels/dist/Table/index.cjs"}
|
package/dist/Table/index.d.cts
CHANGED
|
@@ -1,244 +1,11 @@
|
|
|
1
|
-
import
|
|
2
|
-
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
import
|
|
1
|
+
import { c as Table } from '../Table--d9l8Xlk.cjs';
|
|
2
|
+
export { b as TableColumnProps, T as TableProps, a as TableRowProps, V as VariantProps, t as tableVariants } from '../Table--d9l8Xlk.cjs';
|
|
3
|
+
import 'react/jsx-runtime';
|
|
4
|
+
import 'tailwind-variants';
|
|
5
|
+
import 'tailwind-variants/dist/config.js';
|
|
6
|
+
import '@fuf-stack/pixel-utils';
|
|
7
|
+
import 'react';
|
|
6
8
|
|
|
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 [HeroUI Table](https://www.heroui.com//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
9
|
|
|
244
|
-
|
|
10
|
+
|
|
11
|
+
export { Table as default };
|
package/dist/Table/index.d.ts
CHANGED
|
@@ -1,244 +1,11 @@
|
|
|
1
|
-
import
|
|
2
|
-
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
import
|
|
1
|
+
import { c as Table } from '../Table--d9l8Xlk.js';
|
|
2
|
+
export { b as TableColumnProps, T as TableProps, a as TableRowProps, V as VariantProps, t as tableVariants } from '../Table--d9l8Xlk.js';
|
|
3
|
+
import 'react/jsx-runtime';
|
|
4
|
+
import 'tailwind-variants';
|
|
5
|
+
import 'tailwind-variants/dist/config.js';
|
|
6
|
+
import '@fuf-stack/pixel-utils';
|
|
7
|
+
import 'react';
|
|
6
8
|
|
|
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 [HeroUI Table](https://www.heroui.com//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
9
|
|
|
244
|
-
|
|
10
|
+
|
|
11
|
+
export { Table as default };
|