@versini/ui-table 4.0.8 → 4.0.10

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 (4) hide show
  1. package/README.md +43 -1
  2. package/dist/components/Table/Table.js +472 -442
  3. package/dist/index.js +3 -3
  4. package/package.json +6 -4
package/dist/components/Table/Table.js CHANGED
@@ -1,181 +1,66 @@
1
- import s from "clsx";
2
- import { jsx as i, jsxs as N, Fragment as ne } from "react/jsx-runtime";
3
- import S, { useRef as w, useLayoutEffect as G, useEffect as U, useState as ce, useMemo as J, useCallback as de, useContext as B } from "react";
4
- const z = "thead", W = "tfoot", x = "tbody", R = {
5
- ASC: "asc",
6
- DESC: "desc"
7
- }, ge = ({
8
- mode: e,
9
- className: r,
10
- wrapperClassName: t,
11
- stickyHeader: a,
12
- stickyFooter: l
13
- }) => ({
14
- wrapper: s(
15
- "not-prose relative w-full rounded-lg shadow-md",
16
- {
17
- "overflow-x-auto": !a && !l,
18
- "overflow-y-scroll": a || l,
19
- "bg-surface-darker": e === "dark" || e === "system",
20
- "bg-surface-light": e === "light" || e === "alt-system",
21
- "dark:bg-surface-light": e === "system",
22
- "dark:bg-surface-darker": e === "alt-system",
23
- "text-copy-light": e === "dark",
24
- "text-copy-dark": e === "light",
25
- "text-copy-light dark:text-copy-dark": e === "system",
26
- "text-copy-dark dark:text-copy-light": e === "alt-system"
27
- },
28
- t
29
- ),
30
- table: s("my-0 w-full text-left text-sm", r, {
31
- "text-copy-light": e === "dark",
32
- "text-copy-dark": e === "light",
33
- "text-copy-light dark:text-copy-dark": e === "system",
34
- "text-copy-dark dark:text-copy-light": e === "alt-system"
35
- }),
36
- caption: s("py-2 text-sm font-bold", {
37
- "text-copy-light": e === "dark",
38
- "text-copy-dark": e === "light",
39
- "text-copy-light dark:text-copy-dark": e === "system",
40
- "text-copy-dark dark:text-copy-light": e === "alt-system"
41
- })
42
- }), he = ({
43
- className: e,
44
- stickyHeader: r,
45
- mode: t
46
- }) => s(
47
- {
48
- "sticky top-0 z-10": r,
49
- "shadow-[rgb(190_190_190_/20%)_0_0.5rem_1rem]": r && t === "dark",
50
- "shadow-[rgb(190_190_190_/20%)_0_0.5rem_1rem] dark:shadow-[rgb(65_65_65_/30%)_0_0.5rem_1rem]": r && t === "system",
51
- "shadow-[rgb(65_65_65_/30%)_0_0.5rem_1rem]": r && t === "light",
52
- "shadow-[rgb(65_65_65_/30%)_0_0.5rem_1rem] dark:shadow-[rgb(190_190_190_/20%)_0_0.5rem_1rem]": r && t === "alt-system"
53
- },
54
- e
55
- ), be = ({
56
- className: e,
57
- stickyFooter: r,
58
- mode: t
59
- }) => s(
60
- {
61
- "sticky bottom-0 z-10": r,
62
- "shadow-[rgb(190_190_190_/20%)_0_-0.5rem_1rem]": r && t === "dark",
63
- "shadow-[rgb(190_190_190_/20%)_0_-0.5rem_1rem] dark:shadow-[rgb(65_65_65_/30%)_0_-0.5rem_1rem]": r && t === "system",
64
- "shadow-[rgb(65_65_65_/30%)_0_-0.5rem_1rem]": r && t === "light",
65
- "shadow-[rgb(65_65_65_/30%)_-0_0.5rem_1rem] dark:shadow-[rgb(190_190_190_/20%)_0_-0.5rem_1rem]": r && t === "alt-system"
66
- },
67
- e
68
- ), ue = ({
69
- mode: e,
70
- className: r,
71
- cellWrapper: t
72
- }) => t === z || t === W ? s(
73
- {
74
- "bg-table-head-dark": e === "dark" || e === "system",
75
- "bg-table-head-light": e === "light" || e === "alt-system",
76
- "dark:bg-table-head-light": e === "system",
77
- "dark:bg-table-head-dark": e === "alt-system"
78
- },
79
- r
80
- ) : s(
81
- "border-b last:border-0",
82
- {
83
- "border-table-dark": e === "dark" || e === "system",
84
- "odd:bg-table-dark-odd even:bg-table-dark-even": t === x && e === "dark",
85
- "border-table-light": e === "light" || e === "alt-system",
86
- "odd:bg-table-light-odd even:bg-table-light-even": t === x && e === "light",
87
- "dark:border-table-light": e === "system",
88
- "odd:bg-table-dark-odd even:bg-table-dark-even dark:odd:bg-table-light-odd dark:even:bg-table-light-even": t === x && e === "system",
89
- "dark:border-table-dark": e === "alt-system",
90
- "odd:bg-table-light-odd even:bg-table-light-even dark:odd:bg-table-dark-odd dark:even:bg-table-dark-even": t === x && e === "alt-system"
91
- },
92
- r
93
- ), me = ({
94
- cellWrapper: e,
95
- className: r,
96
- compact: t,
97
- mode: a,
98
- align: l
99
- }) => ({
100
- alignClasses: s({
101
- "flex justify-start text-left": l === "left",
102
- "flex justify-center text-center": l === "center",
103
- "flex justify-end text-right": l === "right"
104
- }),
105
- mainClasses: s(
106
- {
107
- "text-copy-light": a === "dark" || a === "system",
108
- "text-copy-dark": a === "light" || a === "alt-system",
109
- "dark:text-copy-dark": a === "system",
110
- "dark:text-copy-light": a === "alt-system",
111
- "px-4 py-3": !t && (e === z || e === W),
112
- "p-4": !t && e === x,
113
- "px-2 py-1.5": t
114
- },
115
- r
116
- )
117
- }), ye = ({
118
- buttonClassName: e
119
- }) => s("rounded-none text-sm", e), q = "av-button", D = "icon", K = "button", P = "link", fe = ({
1
+ import { jsx as o, jsxs as N, Fragment as ce } from "react/jsx-runtime";
2
+ import S, { useRef as w, useLayoutEffect as q, useEffect as U, useState as ne, useMemo as K, useCallback as de, useContext as B } from "react";
3
+ import l from "clsx";
4
+ const Y = "av-button", W = "icon", Q = "button", P = "link", he = ({
120
5
  type: e,
121
6
  size: r,
122
7
  labelRight: t,
123
8
  labelLeft: a,
124
- align: l,
125
- animated: o
9
+ align: s,
10
+ animated: i
126
11
  }) => {
127
- const n = "max-h-8 py-0 px-2", d = "max-h-9 h-8 px-3", c = "max-h-12 py-2 px-4";
12
+ const c = "max-h-8 py-0 px-2", d = "max-h-9 h-8 px-3", n = "max-h-12 py-2 px-4";
128
13
  switch (e) {
129
- case K:
14
+ case Q:
130
15
  case P:
131
- return s({
132
- [n]: r === "small",
16
+ return l({
17
+ [c]: r === "small",
133
18
  [d]: r === "medium",
134
- [c]: r === "large"
19
+ [n]: r === "large"
135
20
  });
136
- case D:
137
- return s("flex items-center", {
138
- "justify-center": l === "center",
139
- "justify-start": l === "left",
140
- "justify-end": l === "right",
141
- "h-6 w-6 p-0": r === "small" && !o && !(t || a),
142
- "h-6 px-2": r === "small" && !o && (t || a),
143
- "h-8 w-8 p-1": r === "medium" && !o && !(t || a),
144
- "h-8 px-3": r === "medium" && !o && (t || a),
145
- "h-12 w-12 p-2": r === "large" && !o && !(t || a),
146
- "h-12 px-4": r === "large" && !o && (t || a),
147
- "h-6 py-0": r === "small" && o && !(t || a),
148
- "h-6": r === "small" && o && (t || a),
149
- "h-8 py-1": r === "medium" && o && !(t || a),
150
- "h-8": r === "medium" && o && (t || a),
151
- "h-12 py-2": r === "large" && o && !(t || a),
152
- "h-12": r === "large" && o && (t || a)
21
+ case W:
22
+ return l("flex items-center", {
23
+ "justify-center": s === "center",
24
+ "justify-start": s === "left",
25
+ "justify-end": s === "right",
26
+ "h-6 w-6 p-0": r === "small" && !i && !(t || a),
27
+ "h-6 px-2": r === "small" && !i && (t || a),
28
+ "h-8 w-8 p-1": r === "medium" && !i && !(t || a),
29
+ "h-8 px-3": r === "medium" && !i && (t || a),
30
+ "h-12 w-12 p-2": r === "large" && !i && !(t || a),
31
+ "h-12 px-4": r === "large" && !i && (t || a),
32
+ "h-6 py-0": r === "small" && i && !(t || a),
33
+ "h-6": r === "small" && i && (t || a),
34
+ "h-8 py-1": r === "medium" && i && !(t || a),
35
+ "h-8": r === "medium" && i && (t || a),
36
+ "h-12 py-2": r === "large" && i && !(t || a),
37
+ "h-12": r === "large" && i && (t || a)
153
38
  });
154
39
  }
155
- }, ke = ({
40
+ }, ge = ({
156
41
  type: e,
157
42
  size: r,
158
43
  labelRight: t,
159
44
  labelLeft: a
160
45
  }) => {
161
- const l = "text-sm font-medium", o = "text-base font-medium", n = "text-lg font-medium";
46
+ const s = "text-sm font-medium", i = "text-base font-medium", c = "text-lg font-medium";
162
47
  switch (e) {
163
- case K:
48
+ case Q:
164
49
  case P:
165
- return s({
50
+ return l({
166
51
  "text-center": e === P,
167
- [l]: r === "small",
168
- [o]: r === "medium",
169
- [n]: r === "large"
52
+ [s]: r === "small",
53
+ [i]: r === "medium",
54
+ [c]: r === "large"
170
55
  });
171
- case D:
172
- return s({
173
- [l]: r === "small" && (t || a),
174
- [o]: r === "medium" && (t || a),
175
- [n]: r === "large" && (t || a)
56
+ case W:
57
+ return l({
58
+ [s]: r === "small" && (t || a),
59
+ [i]: r === "medium" && (t || a),
60
+ [c]: r === "large" && (t || a)
176
61
  });
177
62
  }
178
- }, ve = ({
63
+ }, me = ({
179
64
  mode: e,
180
65
  noBackground: r,
181
66
  truncate: t,
@@ -184,23 +69,23 @@ const z = "thead", W = "tfoot", x = "tbody", R = {
184
69
  if (r)
185
70
  return "not-prose";
186
71
  if (a === "primary")
187
- return s("not-prose", {
72
+ return l("not-prose", {
188
73
  truncate: t,
189
- "text-copy-light": e === "dark" || e === "system",
190
- "text-copy-lighter": e === "light" || e === "alt-system",
191
- "dark:text-copy-lighter": e === "system",
192
- "dark:text-copy-light": e === "alt-system"
74
+ "text-copy-dark": e === "dark" || e === "system",
75
+ "text-copy-light": e === "light" || e === "alt-system",
76
+ "dark:text-copy-light": e === "system",
77
+ "dark:text-copy-dark": e === "alt-system"
193
78
  });
194
79
  if (a === "secondary")
195
- return s("not-prose", {
80
+ return l("not-prose", {
196
81
  truncate: t,
197
- "text-copy-light": e === "light" || e === "system",
198
- "text-copy-lighter": e === "dark" || e === "alt-system",
199
- "dark:text-copy-lighter": e === "alt-system",
200
- "dark:text-copy-light": e === "system"
82
+ "text-copy-light": e === "dark" || e === "system",
83
+ "text-copy-dark": e === "light" || e === "alt-system",
84
+ "dark:text-copy-dark": e === "system",
85
+ "dark:text-copy-light": e === "alt-system"
201
86
  });
202
87
  if (a === "danger")
203
- return s("not-prose", {
88
+ return l("not-prose", {
204
89
  truncate: t,
205
90
  "text-copy-light": e === "dark" || e === "system",
206
91
  "text-copy-lighter": e === "light" || e === "alt-system",
@@ -208,31 +93,31 @@ const z = "thead", W = "tfoot", x = "tbody", R = {
208
93
  "dark:text-copy-light": e === "alt-system"
209
94
  });
210
95
  if (a === "selected")
211
- return s("not-prose text-copy-lighter", {
96
+ return l("not-prose text-copy-lighter", {
212
97
  truncate: t
213
98
  });
214
- }, pe = ({
99
+ }, be = ({
215
100
  mode: e,
216
101
  noBackground: r,
217
102
  variant: t
218
103
  }) => {
219
104
  if (!r) {
220
105
  if (t === "primary")
221
- return s({
222
- "bg-action-dark": e === "dark",
223
- "bg-action-light": e === "light",
224
- "bg-action-dark dark:bg-action-light": e === "system",
225
- "bg-action-light dark:bg-action-dark": e === "alt-system"
106
+ return l({
107
+ "bg-action-light": e === "dark",
108
+ "bg-action-dark": e === "light",
109
+ "bg-action-light dark:bg-action-dark": e === "system",
110
+ "bg-action-dark dark:bg-action-light": e === "alt-system"
226
111
  });
227
112
  if (t === "secondary")
228
- return s({
229
- "bg-action-dark": e === "light",
230
- "bg-action-light": e === "dark",
231
- "bg-action-dark dark:bg-action-light": e === "alt-system",
232
- "bg-action-light dark:bg-action-dark": e === "system"
113
+ return l({
114
+ "bg-action-light": e === "light",
115
+ "bg-action-dark": e === "dark",
116
+ "bg-action-light dark:bg-action-dark": e === "alt-system",
117
+ "bg-action-dark dark:bg-action-light": e === "system"
233
118
  });
234
119
  if (t === "danger")
235
- return s({
120
+ return l({
236
121
  "bg-action-danger-dark": e === "dark",
237
122
  "bg-action-danger-light": e === "light",
238
123
  "bg-action-danger-dark dark:bg-action-danger-light": e === "system",
@@ -241,13 +126,13 @@ const z = "thead", W = "tfoot", x = "tbody", R = {
241
126
  if (t === "selected")
242
127
  return "bg-action-selected-dark";
243
128
  }
244
- }, _e = ({
129
+ }, ue = ({
245
130
  radius: e
246
- }) => s({
131
+ }) => l({
247
132
  "rounded-full": e === "large",
248
133
  "rounded-md": e === "medium",
249
134
  "rounded-xs": e === "small"
250
- }), xe = ({
135
+ }), ye = ({
251
136
  mode: e,
252
137
  disabled: r,
253
138
  variant: t
@@ -255,21 +140,29 @@ const z = "thead", W = "tfoot", x = "tbody", R = {
255
140
  if (r)
256
141
  return "";
257
142
  if (t === "primary")
258
- return s("hover:text-copy-light-hover", {
259
- "hover:bg-action-dark-hover": e === "dark",
260
- "hover:bg-action-light-hover": e === "light",
261
- "hover:bg-action-dark-hover dark:hover:bg-action-light-hover": e === "system",
262
- "hover:bg-action-light-hover dark:hover:bg-action-dark-hover": e === "alt-system"
143
+ return l({
144
+ "hover:text-copy-dark-hover": e === "dark" || e === "system",
145
+ "hover:text-copy-light-hover": e === "light" || e === "alt-system",
146
+ "dark:hover:text-copy-light-hover": e === "system",
147
+ "dark:hover:text-copy-dark-hover": e === "alt-system",
148
+ "hover:bg-action-light-hover": e === "dark",
149
+ "hover:bg-action-dark-hover": e === "light",
150
+ "hover:bg-action-light-hover dark:hover:bg-action-dark-hover": e === "system",
151
+ "hover:bg-action-dark-hover dark:hover:bg-action-light-hover": e === "alt-system"
263
152
  });
264
153
  if (t === "secondary")
265
- return s("hover:text-copy-light-hover", {
266
- "hover:bg-action-dark-hover": e === "light",
267
- "hover:bg-action-light-hover": e === "dark",
268
- "hover:bg-action-dark-hover dark:hover:bg-action-light-hover": e === "alt-system",
269
- "hover:bg-action-light-hover dark:hover:bg-action-dark-hover": e === "system"
154
+ return l({
155
+ "hover:text-copy-light-hover": e === "dark" || e === "system",
156
+ "hover:text-copy-dark-hover": e === "light" || e === "alt-system",
157
+ "dark:hover:text-copy-dark-hover": e === "system",
158
+ "dark:hover:text-copy-light-hover": e === "alt-system",
159
+ "hover:bg-action-light-hover": e === "light",
160
+ "hover:bg-action-dark-hover": e === "dark",
161
+ "hover:bg-action-light-hover dark:hover:bg-action-dark-hover": e === "alt-system",
162
+ "hover:bg-action-dark-hover dark:hover:bg-action-light-hover": e === "system"
270
163
  });
271
164
  if (t === "danger")
272
- return s("hover:text-copy-light-hover", {
165
+ return l("hover:text-copy-light-hover", {
273
166
  "hover:bg-action-danger-dark-hover": e === "dark",
274
167
  "hover:bg-action-danger-light-hover": e === "light",
275
168
  "hover:bg-action-danger-dark-hover dark:hover:bg-action-danger-light-hover": e === "system",
@@ -277,7 +170,7 @@ const z = "thead", W = "tfoot", x = "tbody", R = {
277
170
  });
278
171
  if (t === "selected")
279
172
  return "hover:text-copy-light-hover hover:bg-action-selected-dark-hover";
280
- }, we = ({
173
+ }, ke = ({
281
174
  mode: e,
282
175
  disabled: r,
283
176
  variant: t
@@ -285,21 +178,29 @@ const z = "thead", W = "tfoot", x = "tbody", R = {
285
178
  if (r)
286
179
  return "";
287
180
  if (t === "primary")
288
- return s("active:text-copy-light-active", {
289
- "active:bg-action-dark-active": e === "dark",
290
- "active:bg-action-light-active": e === "light",
291
- "active:bg-action-dark-active dark:active:bg-action-light-active": e === "system",
292
- "active:bg-action-light-active dark:active:bg-action-dark-active": e === "alt-system"
181
+ return l({
182
+ "active:text-copy-dark-active": e === "dark" || e === "system",
183
+ "active:text-copy-light-active": e === "light" || e === "alt-system",
184
+ "dark:active:text-copy-light-active": e === "system",
185
+ "dark:active:text-copy-dark-active": e === "alt-system",
186
+ "active:bg-action-light-active": e === "dark",
187
+ "active:bg-action-dark-active": e === "light",
188
+ "active:bg-action-light-active dark:active:bg-action-dark-active": e === "system",
189
+ "active:bg-action-dark-active dark:active:bg-action-light-active": e === "alt-system"
293
190
  });
294
191
  if (t === "secondary")
295
- return s("active:text-copy-light-active", {
296
- "active:bg-action-dark-active": e === "light",
297
- "active:bg-action-light-active": e === "dark",
298
- "active:bg-action-dark-active dark:active:bg-action-light-active": e === "alt-system",
299
- "active:bg-action-light-active dark:active:bg-action-dark-active": e === "system"
192
+ return l({
193
+ "active:text-copy-light-active": e === "dark" || e === "system",
194
+ "active:text-copy-dark-active": e === "light" || e === "alt-system",
195
+ "dark:active:text-copy-dark-active": e === "system",
196
+ "dark:active:text-copy-light-active": e === "alt-system",
197
+ "active:bg-action-light-active": e === "light",
198
+ "active:bg-action-dark-active": e === "dark",
199
+ "active:bg-action-light-active dark:active:bg-action-dark-active": e === "alt-system",
200
+ "active:bg-action-dark-active dark:active:bg-action-light-active": e === "system"
300
201
  });
301
202
  if (t === "danger")
302
- return s("active:text-copy-lighter-active", {
203
+ return l("active:text-copy-lighter-active", {
303
204
  "active:bg-action-danger-dark-active": e === "dark",
304
205
  "active:bg-action-danger-light-active": e === "light",
305
206
  "active:bg-action-danger-dark-active dark:active:bg-action-danger-light-active": e === "system",
@@ -307,7 +208,7 @@ const z = "thead", W = "tfoot", x = "tbody", R = {
307
208
  });
308
209
  if (t === "selected")
309
210
  return "active:text-copy-lighter-active active:bg-action-selected-dark-active";
310
- }, Ne = ({
211
+ }, ve = ({
311
212
  mode: e,
312
213
  noBorder: r,
313
214
  variant: t
@@ -315,21 +216,21 @@ const z = "thead", W = "tfoot", x = "tbody", R = {
315
216
  if (r)
316
217
  return "border border-transparent";
317
218
  if (t === "primary")
318
- return s("border", {
319
- "border-border-dark": e === "dark",
219
+ return l("border", {
220
+ "border-border-medium": e === "dark",
320
221
  "border-border-accent": e === "light",
321
- "border-border-dark dark:border-border-accent": e === "system",
322
- "border-border-accent dark:border-border-dark": e === "alt-system"
222
+ "border-border-medium dark:border-border-accent": e === "system",
223
+ "border-border-accent dark:border-border-medium": e === "alt-system"
323
224
  });
324
225
  if (t === "secondary")
325
- return s("border", {
326
- "border-border-dark": e === "light",
226
+ return l("border", {
227
+ "border-border-medium": e === "light",
327
228
  "border-border-accent": e === "dark",
328
- "border-border-dark dark:border-border-accent": e === "alt-system",
329
- "border-border-accent dark:border-border-dark": e === "system"
229
+ "border-border-medium dark:border-border-accent": e === "alt-system",
230
+ "border-border-accent dark:border-border-medium": e === "system"
330
231
  });
331
232
  if (t === "danger")
332
- return s("border", {
233
+ return l("border", {
333
234
  "border-border-danger-dark": e === "dark",
334
235
  "border-border-danger-medium": e === "light",
335
236
  "border-border-danger-dark dark:border-border-danger-medium": e === "system",
@@ -337,110 +238,124 @@ const z = "thead", W = "tfoot", x = "tbody", R = {
337
238
  });
338
239
  if (t === "selected")
339
240
  return "border border-border-selected-dark";
340
- }, Ce = ({
241
+ }, pe = ({
341
242
  focusMode: e
342
- }) => s("focus:outline", "focus:outline-2", "focus:outline-offset-2", {
243
+ }) => l("focus:outline", "focus:outline-2", "focus:outline-offset-2", {
343
244
  "focus:outline-focus-dark": e === "dark",
344
245
  "focus:outline-focus-light": e === "light",
345
246
  "focus:outline-focus-light dark:focus:outline-focus-dark": e === "alt-system",
346
247
  "focus:outline-focus-dark dark:focus:outline-focus-light": e === "system"
347
- }), Be = ({
248
+ }), fe = ({
348
249
  mode: e,
349
250
  raw: r,
350
- iconClassName: t
351
- }) => r ? "" : s(
352
- {
353
- "text-copy-accent-dark": e === "light" || e === "alt-system",
251
+ iconClassName: t,
252
+ variant: a = "primary"
253
+ }) => {
254
+ if (r)
255
+ return "";
256
+ let s = {};
257
+ return a === "primary" ? s = {
258
+ "text-copy-dark": e === "dark" || e === "system",
259
+ "text-copy-light": e === "light" || e === "alt-system",
260
+ "dark:text-copy-light": e === "system",
261
+ "dark:text-copy-dark": e === "alt-system"
262
+ } : a === "secondary" ? s = {
354
263
  "text-copy-light": e === "dark" || e === "system",
355
- "dark:text-copy-light": e === "alt-system",
356
- "dark:text-copy-accent-dark": e === "system"
357
- },
358
- t
359
- ), Te = ({
264
+ "text-copy-dark": e === "light" || e === "alt-system",
265
+ "dark:text-copy-dark": e === "system",
266
+ "dark:text-copy-light": e === "alt-system"
267
+ } : a === "danger" ? s = {
268
+ "text-copy-light": e === "dark" || e === "system",
269
+ "text-copy-lighter": e === "light" || e === "alt-system",
270
+ "dark:text-copy-lighter": e === "system",
271
+ "dark:text-copy-light": e === "alt-system"
272
+ } : a === "selected" && (s = {
273
+ "text-copy-lighter": !0
274
+ }), l(s, t);
275
+ }, xe = ({
360
276
  animated: e
361
- }) => s({
277
+ }) => l({
362
278
  "transition-opacity duration-300 ease-in-out": e
363
- }), Ie = ({
279
+ }), _e = ({
364
280
  type: e,
365
281
  className: r,
366
282
  raw: t,
367
283
  mode: a,
368
- focusMode: l,
369
- disabled: o,
370
- fullWidth: n,
284
+ focusMode: s,
285
+ disabled: i,
286
+ fullWidth: c,
371
287
  size: d,
372
- noBorder: c,
373
- labelRight: h,
374
- labelLeft: u,
375
- noBackground: g,
376
- variant: b,
377
- truncate: v,
288
+ noBorder: n,
289
+ labelRight: g,
290
+ labelLeft: b,
291
+ noBackground: h,
292
+ variant: m,
293
+ truncate: p,
378
294
  align: L,
379
295
  radius: M,
380
296
  animated: T
381
- }) => (b || (b = "primary"), t ? s(q, r) : s(
382
- q,
383
- ve({
297
+ }) => (m || (m = "primary"), t ? l(Y, r) : l(
298
+ Y,
299
+ me({
384
300
  mode: a,
385
- variant: b,
386
- noBackground: g,
387
- truncate: v
301
+ variant: m,
302
+ noBackground: h,
303
+ truncate: p
388
304
  }),
389
- pe({ mode: a, noBackground: g, variant: b }),
390
- _e({ radius: M }),
391
- fe({
305
+ be({ mode: a, noBackground: h, variant: m }),
306
+ ue({ radius: M }),
307
+ he({
392
308
  type: e,
393
309
  size: d,
394
- labelRight: h,
395
- labelLeft: u,
310
+ labelRight: g,
311
+ labelLeft: b,
396
312
  align: L,
397
313
  animated: T
398
314
  }),
399
- ke({ type: e, size: d, labelRight: h, labelLeft: u }),
400
- Ne({ mode: a, variant: b, noBorder: c }),
401
- Ce({ focusMode: l }),
402
- xe({ mode: a, variant: b, disabled: o }),
403
- we({ mode: a, variant: b, disabled: o }),
315
+ ge({ type: e, size: d, labelRight: g, labelLeft: b }),
316
+ ve({ mode: a, variant: m, noBorder: n }),
317
+ pe({ focusMode: s }),
318
+ ye({ mode: a, variant: m, disabled: i }),
319
+ ke({ mode: a, variant: m, disabled: i }),
404
320
  {
405
- "w-full": n,
406
- "disabled:cursor-not-allowed disabled:opacity-50": o
321
+ "w-full": c,
322
+ "disabled:cursor-not-allowed disabled:opacity-50": i
407
323
  },
408
- s({
324
+ l({
409
325
  "transition-[width] duration-300 ease-in": T
410
326
  }),
411
327
  r
412
- )), Re = (e, r, t) => {
413
- var a;
414
- !r && (!document.activeElement || document.activeElement !== e.currentTarget) && typeof ((a = e == null ? void 0 : e.currentTarget) == null ? void 0 : a.focus) == "function" && e.currentTarget.focus(), typeof t == "function" && t(e);
415
- }, Q = S.forwardRef((e, r) => {
416
- const { onClick: t, noInternalClick: a = !1, ...l } = e;
417
- return /* @__PURE__ */ i(
328
+ )), we = (e, r, t) => {
329
+ !r && (!document.activeElement || document.activeElement !== e.currentTarget) && typeof e?.currentTarget?.focus == "function" && e.currentTarget.focus(), typeof t == "function" && t(e);
330
+ }, X = S.forwardRef((e, r) => {
331
+ const { onClick: t, noInternalClick: a = !1, ...s } = e;
332
+ return /* @__PURE__ */ o(
418
333
  "button",
419
334
  {
420
335
  ref: r,
421
- onClick: (o) => {
422
- Re(o, a, t);
336
+ onClick: (i) => {
337
+ we(i, a, t);
423
338
  },
424
- ...l
339
+ ...s
425
340
  }
426
341
  );
427
342
  });
428
- Q.displayName = "BaseButton";
429
- function Ee() {
343
+ X.displayName = "BaseButton";
344
+ function Ne() {
430
345
  const e = w(!1);
431
346
  return U(() => (e.current = !0, () => {
432
347
  e.current = !1;
433
348
  }), []), de(() => e.current, []);
434
349
  }
435
- function Se(e) {
436
- return J(() => e.every((r) => r == null) ? () => {
350
+ function Ce(e) {
351
+ return K(() => e.every((r) => r == null) ? () => {
437
352
  } : (r) => {
438
353
  e.forEach((t) => {
439
354
  typeof t == "function" ? t(r) : t != null && (t.current = r);
440
355
  });
441
356
  }, [...e]);
442
357
  }
443
- const ze = {
358
+ const Be = {
444
359
  x: 0,
445
360
  y: 0,
446
361
  width: 0,
@@ -451,165 +366,165 @@ const ze = {
451
366
  right: 0
452
367
  };
453
368
  function A(e) {
454
- const r = Ee(), t = w(0), a = w(null), [l, o] = ce(ze), n = J(() => typeof ResizeObserver > "u" ? null : new ResizeObserver((d) => {
455
- const c = d[0];
456
- c && (cancelAnimationFrame(t.current), t.current = requestAnimationFrame(() => {
457
- a.current && r() && o(c.contentRect);
369
+ const r = Ne(), t = w(0), a = w(null), [s, i] = ne(Be), c = K(() => typeof ResizeObserver > "u" ? null : new ResizeObserver((d) => {
370
+ const n = d[0];
371
+ n && (cancelAnimationFrame(t.current), t.current = requestAnimationFrame(() => {
372
+ a.current && r() && i(n.contentRect);
458
373
  }));
459
374
  }), [r]);
460
- return U(() => (a.current && (n == null || n.observe(a.current, e)), () => {
461
- n == null || n.disconnect(), t.current && cancelAnimationFrame(t.current);
462
- }), [n, e]), [a, l];
375
+ return U(() => (a.current && c?.observe(a.current, e), () => {
376
+ c?.disconnect(), t.current && cancelAnimationFrame(t.current);
377
+ }), [c, e]), [a, s];
463
378
  }
464
- const E = {
379
+ const R = {
465
380
  small: 24,
466
381
  // w-6
467
382
  medium: 32,
468
383
  // w-8
469
384
  large: 48
470
385
  // w-12
471
- }, Le = {
472
- small: 8 * 2,
386
+ }, Te = {
387
+ small: 16,
473
388
  // px-2 x 2
474
- medium: 12 * 2,
389
+ medium: 24,
475
390
  // px-3 x 2
476
- large: 16 * 2
391
+ large: 32
477
392
  // px-4 x 2
478
- }, Me = 2, Ve = 300, X = S.forwardRef(
393
+ }, Ie = 2, Re = 300, Z = S.forwardRef(
479
394
  ({
480
395
  children: e,
481
396
  disabled: r = !1,
482
397
  mode: t = "system",
483
398
  focusMode: a = "system",
484
- fullWidth: l = !1,
485
- className: o,
486
- type: n = "button",
399
+ fullWidth: s = !1,
400
+ className: i,
401
+ type: c = "button",
487
402
  raw: d = !1,
488
- noBorder: c = !1,
489
- "aria-label": h,
490
- label: u,
491
- size: g = "medium",
492
- labelRight: b,
493
- labelLeft: v,
403
+ noBorder: n = !1,
404
+ "aria-label": g,
405
+ label: b,
406
+ size: h = "medium",
407
+ labelRight: m,
408
+ labelLeft: p,
494
409
  noBackground: L = !1,
495
410
  align: M = "center",
496
411
  radius: T = "large",
497
- variant: ee = "primary",
412
+ variant: H = "secondary",
498
413
  iconClassName: te,
499
- animated: f = !1,
414
+ animated: k = !1,
500
415
  ...re
501
416
  }, ae) => {
502
- const le = Ie({
503
- type: D,
417
+ const se = _e({
418
+ type: W,
504
419
  mode: t,
505
420
  focusMode: a,
506
- fullWidth: l,
421
+ fullWidth: s,
507
422
  disabled: r,
508
423
  raw: d,
509
- className: o,
510
- noBorder: c,
511
- size: g,
512
- labelRight: b,
513
- labelLeft: v,
424
+ className: i,
425
+ noBorder: n,
426
+ size: h,
427
+ labelRight: m,
428
+ labelLeft: p,
514
429
  noBackground: L,
515
430
  align: M,
516
431
  radius: T,
517
- variant: ee,
518
- animated: f
519
- }), se = Be({ mode: t, raw: d, iconClassName: te }), $ = Te({ animated: f }), oe = "flex items-center justify-center relative w-full h-full overflow-hidden", [m, V] = A(), [y, O] = A(), [I, F] = A(), j = w(0), k = w(null), p = w(null), ie = Se([ae, k]);
520
- return G(() => {
521
- I && I.current && f && (j.current = F.width + Le[g] + (c ? 0 : Me), k.current && !k.current.style.width && (k.current.style.width = `${E[g]}px`));
522
- }, [F, I, g, c, f]), G(() => {
523
- if (k && k.current && f) {
524
- let _ = E[g];
525
- b && m && V.width > 0 ? _ = V.width + j.current : v && y && O.width > 0 && (_ = O.width + j.current), p.current && clearTimeout(p.current), _ !== parseInt(k.current.style.width || "0", 10) && (m.current && (m.current.style.opacity = "0"), y.current && (y.current.style.opacity = "0"), k.current.style.width = `${_}px`, _ > E[g] && (p.current = setTimeout(() => {
526
- m.current && b && (m.current.style.opacity = "1"), y.current && v && (y.current.style.opacity = "1"), p.current = null;
527
- }, Ve * 0.8))), _ === E[g] && (m.current && (m.current.style.opacity = "0"), y.current && (y.current.style.opacity = "0"));
432
+ variant: H,
433
+ animated: k
434
+ }), le = fe({ mode: t, raw: d, iconClassName: te, variant: H }), F = xe({ animated: k }), ie = "flex items-center justify-center relative w-full h-full overflow-hidden", [u, V] = A(), [y, O] = A(), [I, G] = A(), j = w(0), v = w(null), f = w(null), oe = Ce([ae, v]);
435
+ return q(() => {
436
+ I && I.current && k && (j.current = G.width + Te[h] + (n ? 0 : Ie), v.current && !v.current.style.width && (v.current.style.width = `${R[h]}px`));
437
+ }, [G, I, h, n, k]), q(() => {
438
+ if (v && v.current && k) {
439
+ let x = R[h];
440
+ m && u && V.width > 0 ? x = V.width + j.current : p && y && O.width > 0 && (x = O.width + j.current), f.current && clearTimeout(f.current), x !== parseInt(v.current.style.width || "0", 10) && (u.current && (u.current.style.opacity = "0"), y.current && (y.current.style.opacity = "0"), v.current.style.width = `${x}px`, x > R[h] && (f.current = setTimeout(() => {
441
+ u.current && m && (u.current.style.opacity = "1"), y.current && p && (y.current.style.opacity = "1"), f.current = null;
442
+ }, Re * 0.8))), x === R[h] && (u.current && (u.current.style.opacity = "0"), y.current && (y.current.style.opacity = "0"));
528
443
  }
529
444
  }, [
530
445
  V,
531
- b,
532
446
  m,
447
+ u,
533
448
  O,
534
- v,
449
+ p,
535
450
  y,
536
- g,
537
- f
451
+ h,
452
+ k
538
453
  ]), U(() => () => {
539
- p.current && clearTimeout(p.current);
540
- }, []), /* @__PURE__ */ i(
541
- Q,
454
+ f.current && clearTimeout(f.current);
455
+ }, []), /* @__PURE__ */ o(
456
+ X,
542
457
  {
543
- ref: ie,
544
- className: le,
458
+ ref: oe,
459
+ className: se,
545
460
  disabled: r,
546
- type: n,
547
- "aria-label": h || u,
461
+ type: c,
462
+ "aria-label": g || b,
548
463
  ...re,
549
- children: /* @__PURE__ */ N("div", { className: oe, children: [
550
- /* @__PURE__ */ i(
551
- Y,
464
+ children: /* @__PURE__ */ N("div", { className: ie, children: [
465
+ /* @__PURE__ */ o(
466
+ J,
552
467
  {
553
- label: v,
468
+ label: p,
554
469
  labelRef: y,
555
- labelClass: $,
470
+ labelClass: F,
556
471
  labelInnerClass: "pr-2",
557
- initiallyHidden: f
472
+ initiallyHidden: k
558
473
  }
559
474
  ),
560
- /* @__PURE__ */ i("span", { ref: I, className: se, children: e }),
561
- /* @__PURE__ */ i(
562
- Y,
475
+ /* @__PURE__ */ o("span", { ref: I, className: le, children: e }),
476
+ /* @__PURE__ */ o(
477
+ J,
563
478
  {
564
- label: b,
565
- labelRef: m,
566
- labelClass: $,
479
+ label: m,
480
+ labelRef: u,
481
+ labelClass: F,
567
482
  labelInnerClass: "pl-2",
568
- initiallyHidden: f
483
+ initiallyHidden: k
569
484
  }
570
485
  )
571
486
  ] })
572
487
  }
573
488
  );
574
489
  }
575
- ), Y = ({
490
+ ), J = ({
576
491
  labelRef: e,
577
492
  labelClass: r,
578
493
  label: t,
579
494
  labelInnerClass: a,
580
- initiallyHidden: l = !1
581
- }) => /* @__PURE__ */ i(
495
+ initiallyHidden: s = !1
496
+ }) => /* @__PURE__ */ o(
582
497
  "span",
583
498
  {
584
499
  ref: e,
585
500
  className: r,
586
- style: l ? { opacity: 0 } : void 0,
587
- children: t && /* @__PURE__ */ i("span", { className: a, children: t })
501
+ style: s ? { opacity: 0 } : void 0,
502
+ children: t && /* @__PURE__ */ o("span", { className: a, children: t })
588
503
  }
589
504
  );
590
- X.displayName = "ButtonIcon";
505
+ Z.displayName = "ButtonIcon";
591
506
  /*!
592
- @versini/ui-button v6.0.8
507
+ @versini/ui-button v7.0.0
593
508
  © 2025 gizmette.com
594
509
  */
595
510
  try {
596
511
  window.__VERSINI_UI_BUTTON__ || (window.__VERSINI_UI_BUTTON__ = {
597
- version: "6.0.8",
598
- buildTime: "06/28/2025 08:58 PM EDT",
512
+ version: "7.0.0",
513
+ buildTime: "08/07/2025 04:11 PM EDT",
599
514
  homepage: "https://github.com/aversini/ui-components",
600
515
  license: "MIT"
601
516
  });
602
517
  } catch {
603
518
  }
604
- const Z = S.forwardRef(
519
+ const ee = S.forwardRef(
605
520
  ({
606
521
  children: e,
607
522
  mode: r = "system",
608
523
  className: t,
609
524
  active: a = !1,
610
- ...l
611
- }, o) => {
612
- const n = a ? s(
525
+ ...s
526
+ }, i) => {
527
+ const c = a ? l(
613
528
  "relative",
614
529
  "focus-within:static",
615
530
  "focus-within:after:border-transparent",
@@ -626,45 +541,45 @@ const Z = S.forwardRef(
626
541
  "after:border-table-light dark:after:border-table-dark": r === "alt-system"
627
542
  }
628
543
  ) : "";
629
- return /* @__PURE__ */ i("div", { className: n, children: /* @__PURE__ */ i(
630
- X,
544
+ return /* @__PURE__ */ o("div", { className: c, children: /* @__PURE__ */ o(
545
+ Z,
631
546
  {
632
- className: s("justify-center", t),
633
- ref: o,
547
+ className: l("justify-center", t),
548
+ ref: i,
634
549
  mode: r,
635
550
  radius: "small",
636
- ...l,
551
+ ...s,
637
552
  children: e
638
553
  }
639
554
  ) });
640
555
  }
641
556
  );
642
- Z.displayName = "ButtonSort";
643
- const H = ({
557
+ ee.displayName = "ButtonSort";
558
+ const $ = ({
644
559
  children: e,
645
560
  fill: r,
646
561
  viewBox: t,
647
562
  className: a,
648
- defaultViewBox: l,
649
- size: o,
650
- title: n,
563
+ defaultViewBox: s,
564
+ size: i,
565
+ title: c,
651
566
  semantic: d = !1,
652
- ...c
567
+ ...n
653
568
  }) => {
654
- const h = s(o, a);
655
- return /* @__PURE__ */ i(ne, { children: /* @__PURE__ */ N(
569
+ const g = l(i, a);
570
+ return /* @__PURE__ */ o(ce, { children: /* @__PURE__ */ N(
656
571
  "svg",
657
572
  {
658
573
  xmlns: "http://www.w3.org/2000/svg",
659
- className: h,
660
- viewBox: t || l,
574
+ className: g,
575
+ viewBox: t || s,
661
576
  fill: r || "currentColor",
662
577
  role: "img",
663
578
  "aria-hidden": !d,
664
579
  focusable: !1,
665
- ...c,
580
+ ...n,
666
581
  children: [
667
- n && d && /* @__PURE__ */ i("title", { children: n }),
582
+ c && d && /* @__PURE__ */ o("title", { children: c }),
668
583
  e
669
584
  ]
670
585
  }
@@ -683,82 +598,82 @@ try {
683
598
  });
684
599
  } catch {
685
600
  }
686
- const Oe = ({
601
+ const Ee = ({
687
602
  className: e,
688
603
  viewBox: r,
689
604
  title: t,
690
605
  monotone: a,
691
- ...l
606
+ ...s
692
607
  }) => /* @__PURE__ */ N(
693
- H,
608
+ $,
694
609
  {
695
610
  defaultViewBox: "0 0 576 512",
696
611
  size: "size-5",
697
612
  viewBox: r,
698
613
  className: e,
699
614
  title: t || "Sort",
700
- ...l,
615
+ ...s,
701
616
  children: [
702
- /* @__PURE__ */ i(
617
+ /* @__PURE__ */ o(
703
618
  "path",
704
619
  {
705
620
  d: "M297.4 137.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l41.3-41.4V448c0 17.7 14.3 32 32 32s32-14.3 32-32V141.3l41.4 41.4c12.5 12.5 32.8 12.5 45.3 0 6.2-6.2 9.4-14.4 9.4-22.6s-3.1-16.4-9.4-22.6l-96-96c-6.3-6.4-14.5-9.5-22.7-9.5s-16.4 3.1-22.6 9.4z",
706
621
  opacity: a ? "1" : "0.4"
707
622
  }
708
623
  ),
709
- /* @__PURE__ */ i("path", { d: "M137.4 470.6c12.5 12.5 32.8 12.5 45.3 0l96-96c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L192 370.7V64c0-17.7-14.3-32-32-32s-32 14.3-32 32v306.7l-41.4-41.3c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l96 96z" })
624
+ /* @__PURE__ */ o("path", { d: "M137.4 470.6c12.5 12.5 32.8 12.5 45.3 0l96-96c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L192 370.7V64c0-17.7-14.3-32-32-32s-32 14.3-32 32v306.7l-41.4-41.3c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l96 96z" })
710
625
  ]
711
626
  }
712
- ), je = ({
627
+ ), Se = ({
713
628
  className: e,
714
629
  viewBox: r,
715
630
  title: t,
716
631
  monotone: a,
717
- ...l
632
+ ...s
718
633
  }) => /* @__PURE__ */ N(
719
- H,
634
+ $,
720
635
  {
721
636
  defaultViewBox: "0 0 576 512",
722
637
  size: "size-5",
723
638
  viewBox: r,
724
639
  className: e,
725
640
  title: t || "Sort Down",
726
- ...l,
641
+ ...s,
727
642
  children: [
728
- /* @__PURE__ */ i(
643
+ /* @__PURE__ */ o(
729
644
  "path",
730
645
  {
731
646
  d: "M288 64c0-17.7 14.3-32 32-32h224c17.7 0 32 14.3 32 32s-14.3 32-32 32H320c-17.7 0-32-14.3-32-32m0 128c0-17.7 14.3-32 32-32h160c17.7 0 32 14.3 32 32s-14.3 32-32 32H320c-17.7 0-32-14.3-32-32m0 128c0-17.7 14.3-32 32-32h96c17.7 0 32 14.3 32 32s-14.3 32-32 32h-96c-17.7 0-32-14.3-32-32m0 128c0-17.7 14.3-32 32-32h32c17.7 0 32 14.3 32 32s-14.3 32-32 32h-32c-17.7 0-32-14.3-32-32",
732
647
  opacity: a ? "1" : "0.4"
733
648
  }
734
649
  ),
735
- /* @__PURE__ */ i("path", { d: "M128 480c9 0 17.5-3.8 23.6-10.4l88-96c11.9-13 11.1-33.3-2-45.2s-33.3-11.1-45.2 2L160 365.7V64c0-17.7-14.3-32-32-32S96 46.3 96 64v301.7l-32.4-35.3c-11.9-13-32.2-13.9-45.2-2s-13.9 32.2-2 45.2l88 96c6.1 6.6 14.6 10.4 23.6 10.4" })
650
+ /* @__PURE__ */ o("path", { d: "M128 480c9 0 17.5-3.8 23.6-10.4l88-96c11.9-13 11.1-33.3-2-45.2s-33.3-11.1-45.2 2L160 365.7V64c0-17.7-14.3-32-32-32S96 46.3 96 64v301.7l-32.4-35.3c-11.9-13-32.2-13.9-45.2-2s-13.9 32.2-2 45.2l88 96c6.1 6.6 14.6 10.4 23.6 10.4" })
736
651
  ]
737
652
  }
738
- ), Ae = ({
653
+ ), ze = ({
739
654
  className: e,
740
655
  viewBox: r,
741
656
  title: t,
742
657
  monotone: a,
743
- ...l
658
+ ...s
744
659
  }) => /* @__PURE__ */ N(
745
- H,
660
+ $,
746
661
  {
747
662
  defaultViewBox: "0 0 576 512",
748
663
  size: "size-5",
749
664
  viewBox: r,
750
665
  className: e,
751
666
  title: t || "Sort Up",
752
- ...l,
667
+ ...s,
753
668
  children: [
754
- /* @__PURE__ */ i(
669
+ /* @__PURE__ */ o(
755
670
  "path",
756
671
  {
757
672
  d: "M288 64c0-17.7 14.3-32 32-32h32c17.7 0 32 14.3 32 32s-14.3 32-32 32h-32c-17.7 0-32-14.3-32-32m0 128c0-17.7 14.3-32 32-32h96c17.7 0 32 14.3 32 32s-14.3 32-32 32h-96c-17.7 0-32-14.3-32-32m0 128c0-17.7 14.3-32 32-32h160c17.7 0 32 14.3 32 32s-14.3 32-32 32H320c-17.7 0-32-14.3-32-32m0 128c0-17.7 14.3-32 32-32h224c17.7 0 32 14.3 32 32s-14.3 32-32 32H320c-17.7 0-32-14.3-32-32",
758
673
  opacity: a ? "1" : "0.4"
759
674
  }
760
675
  ),
761
- /* @__PURE__ */ i("path", { d: "M128 32c9 0 17.5 3.8 23.6 10.4l88 96c11.9 13 11.1 33.3-2 45.2s-33.3 11.1-45.2-2L160 146.3V448c0 17.7-14.3 32-32 32s-32-14.3-32-32V146.3l-32.4 35.3c-11.9 13-32.2 13.9-45.2 2s-13.9-32.2-2-45.2l88-96C110.5 35.8 119 32 128 32" })
676
+ /* @__PURE__ */ o("path", { d: "M128 32c9 0 17.5 3.8 23.6 10.4l88 96c11.9 13 11.1 33.3-2 45.2s-33.3 11.1-45.2-2L160 146.3V448c0 17.7-14.3 32-32 32s-32-14.3-32-32V146.3l-32.4 35.3c-11.9 13-32.2 13.9-45.2 2s-13.9-32.2-2-45.2l88-96C110.5 35.8 119 32 128 32" })
762
677
  ]
763
678
  }
764
679
  );
@@ -781,148 +696,263 @@ const C = S.createContext({
781
696
  stickyHeader: !1,
782
697
  stickyFooter: !1,
783
698
  compact: !1
784
- }), He = ({
699
+ }), z = "thead", D = "tfoot", _ = "tbody", E = {
700
+ ASC: "asc",
701
+ DESC: "desc"
702
+ }, Le = ({
703
+ mode: e,
704
+ className: r,
705
+ wrapperClassName: t,
706
+ stickyHeader: a,
707
+ stickyFooter: s
708
+ }) => ({
709
+ wrapper: l(
710
+ "not-prose relative w-full rounded-lg shadow-md",
711
+ {
712
+ "overflow-x-auto": !a && !s,
713
+ "overflow-y-scroll": a || s,
714
+ "bg-surface-darker": e === "dark" || e === "system",
715
+ "bg-surface-light": e === "light" || e === "alt-system",
716
+ "dark:bg-surface-light": e === "system",
717
+ "dark:bg-surface-darker": e === "alt-system",
718
+ "text-copy-light": e === "dark",
719
+ "text-copy-dark": e === "light",
720
+ "text-copy-light dark:text-copy-dark": e === "system",
721
+ "text-copy-dark dark:text-copy-light": e === "alt-system"
722
+ },
723
+ t
724
+ ),
725
+ table: l("my-0 w-full text-left text-sm", r, {
726
+ "text-copy-light": e === "dark",
727
+ "text-copy-dark": e === "light",
728
+ "text-copy-light dark:text-copy-dark": e === "system",
729
+ "text-copy-dark dark:text-copy-light": e === "alt-system"
730
+ }),
731
+ caption: l("py-2 text-sm font-bold", {
732
+ "text-copy-light": e === "dark",
733
+ "text-copy-dark": e === "light",
734
+ "text-copy-light dark:text-copy-dark": e === "system",
735
+ "text-copy-dark dark:text-copy-light": e === "alt-system"
736
+ })
737
+ }), Me = ({
738
+ className: e,
739
+ stickyHeader: r,
740
+ mode: t
741
+ }) => l(
742
+ {
743
+ "sticky top-0 z-10": r,
744
+ "shadow-[rgb(190_190_190_/20%)_0_0.5rem_1rem]": r && t === "dark",
745
+ "shadow-[rgb(190_190_190_/20%)_0_0.5rem_1rem] dark:shadow-[rgb(65_65_65_/30%)_0_0.5rem_1rem]": r && t === "system",
746
+ "shadow-[rgb(65_65_65_/30%)_0_0.5rem_1rem]": r && t === "light",
747
+ "shadow-[rgb(65_65_65_/30%)_0_0.5rem_1rem] dark:shadow-[rgb(190_190_190_/20%)_0_0.5rem_1rem]": r && t === "alt-system"
748
+ },
749
+ e
750
+ ), Ve = ({
751
+ className: e,
752
+ stickyFooter: r,
753
+ mode: t
754
+ }) => l(
755
+ {
756
+ "sticky bottom-0 z-10": r,
757
+ "shadow-[rgb(190_190_190_/20%)_0_-0.5rem_1rem]": r && t === "dark",
758
+ "shadow-[rgb(190_190_190_/20%)_0_-0.5rem_1rem] dark:shadow-[rgb(65_65_65_/30%)_0_-0.5rem_1rem]": r && t === "system",
759
+ "shadow-[rgb(65_65_65_/30%)_0_-0.5rem_1rem]": r && t === "light",
760
+ "shadow-[rgb(65_65_65_/30%)_-0_0.5rem_1rem] dark:shadow-[rgb(190_190_190_/20%)_0_-0.5rem_1rem]": r && t === "alt-system"
761
+ },
762
+ e
763
+ ), Oe = ({
764
+ mode: e,
765
+ className: r,
766
+ cellWrapper: t
767
+ }) => t === z || t === D ? l(
768
+ {
769
+ "bg-table-head-dark": e === "dark" || e === "system",
770
+ "bg-table-head-light": e === "light" || e === "alt-system",
771
+ "dark:bg-table-head-light": e === "system",
772
+ "dark:bg-table-head-dark": e === "alt-system"
773
+ },
774
+ r
775
+ ) : l(
776
+ "border-b last:border-0",
777
+ {
778
+ "border-table-dark": e === "dark" || e === "system",
779
+ "odd:bg-table-dark-odd even:bg-table-dark-even": t === _ && e === "dark",
780
+ "border-table-light": e === "light" || e === "alt-system",
781
+ "odd:bg-table-light-odd even:bg-table-light-even": t === _ && e === "light",
782
+ "dark:border-table-light": e === "system",
783
+ "odd:bg-table-dark-odd even:bg-table-dark-even dark:odd:bg-table-light-odd dark:even:bg-table-light-even": t === _ && e === "system",
784
+ "dark:border-table-dark": e === "alt-system",
785
+ "odd:bg-table-light-odd even:bg-table-light-even dark:odd:bg-table-dark-odd dark:even:bg-table-dark-even": t === _ && e === "alt-system"
786
+ },
787
+ r
788
+ ), je = ({
789
+ cellWrapper: e,
790
+ className: r,
791
+ compact: t,
792
+ mode: a,
793
+ align: s
794
+ }) => ({
795
+ alignClasses: l({
796
+ "flex justify-start text-left": s === "left",
797
+ "flex justify-center text-center": s === "center",
798
+ "flex justify-end text-right": s === "right"
799
+ }),
800
+ mainClasses: l(
801
+ {
802
+ "text-copy-light": a === "dark" || a === "system",
803
+ "text-copy-dark": a === "light" || a === "alt-system",
804
+ "dark:text-copy-dark": a === "system",
805
+ "dark:text-copy-light": a === "alt-system",
806
+ "px-4 py-3": !t && (e === z || e === D),
807
+ "p-4": !t && e === _,
808
+ "px-2 py-1.5": t
809
+ },
810
+ r
811
+ )
812
+ }), Ae = ({
813
+ buttonClassName: e
814
+ }) => l("rounded-none text-sm", e), De = ({
785
815
  children: e,
786
816
  mode: r = "system",
787
817
  caption: t,
788
818
  compact: a,
789
- summary: l,
790
- className: o,
791
- wrapperClassName: n,
819
+ summary: s,
820
+ className: i,
821
+ wrapperClassName: c,
792
822
  maxHeight: d,
793
- stickyHeader: c,
794
- stickyFooter: h,
795
- ...u
823
+ stickyHeader: n,
824
+ stickyFooter: g,
825
+ ...b
796
826
  }) => {
797
- const g = ge({
827
+ const h = Le({
798
828
  mode: r,
799
- className: o,
800
- wrapperClassName: n,
801
- stickyHeader: c,
802
- stickyFooter: h
829
+ className: i,
830
+ wrapperClassName: c,
831
+ stickyHeader: n,
832
+ stickyFooter: g
803
833
  });
804
- return /* @__PURE__ */ i(
834
+ return /* @__PURE__ */ o(
805
835
  C.Provider,
806
836
  {
807
- value: { mode: r, stickyHeader: c, stickyFooter: h, compact: a },
808
- children: /* @__PURE__ */ i(
837
+ value: { mode: r, stickyHeader: n, stickyFooter: g, compact: a },
838
+ children: /* @__PURE__ */ o(
809
839
  "div",
810
840
  {
811
- className: g.wrapper,
841
+ className: h.wrapper,
812
842
  ...d && {
813
843
  style: { maxHeight: d }
814
844
  },
815
- children: /* @__PURE__ */ N("table", { className: g.table, summary: l, ...u, children: [
816
- t && /* @__PURE__ */ i("caption", { className: g.caption, children: t }),
845
+ children: /* @__PURE__ */ N("table", { className: h.table, summary: s, ...b, children: [
846
+ t && /* @__PURE__ */ o("caption", { className: h.caption, children: t }),
817
847
  e
818
848
  ] })
819
849
  }
820
850
  )
821
851
  }
822
852
  );
823
- }, $e = ({
853
+ }, He = ({
824
854
  children: e,
825
855
  className: r,
826
856
  ...t
827
857
  }) => {
828
858
  const a = B(C);
829
859
  a.cellWrapper = z;
830
- const l = he({
860
+ const s = Me({
831
861
  className: r,
832
862
  mode: a.mode,
833
863
  stickyHeader: a.stickyHeader
834
864
  });
835
- return /* @__PURE__ */ i("thead", { className: l, ...t, children: e });
865
+ return /* @__PURE__ */ o("thead", { className: s, ...t, children: e });
836
866
  }, Fe = ({
837
867
  children: e,
838
868
  className: r,
839
869
  ...t
840
870
  }) => {
841
871
  const a = B(C);
842
- a.cellWrapper = W;
843
- const l = be({
872
+ a.cellWrapper = D;
873
+ const s = Ve({
844
874
  className: r,
845
875
  mode: a.mode,
846
876
  stickyFooter: a.stickyFooter
847
877
  });
848
- return /* @__PURE__ */ i("tfoot", { className: l, ...t, children: e });
878
+ return /* @__PURE__ */ o("tfoot", { className: s, ...t, children: e });
849
879
  }, Ge = ({ children: e, ...r }) => {
850
880
  const t = B(C);
851
- return t.cellWrapper = x, /* @__PURE__ */ i("tbody", { ...r, children: e });
881
+ return t.cellWrapper = _, /* @__PURE__ */ o("tbody", { ...r, children: e });
852
882
  }, qe = ({
853
883
  children: e,
854
884
  className: r,
855
885
  ...t
856
886
  }) => {
857
- const a = B(C), l = ue({
887
+ const a = B(C), s = Oe({
858
888
  mode: a.mode,
859
889
  cellWrapper: a.cellWrapper,
860
890
  className: r
861
891
  });
862
- return /* @__PURE__ */ i("tr", { className: l, ...t, children: e });
892
+ return /* @__PURE__ */ o("tr", { className: s, ...t, children: e });
863
893
  }, Pe = ({
864
894
  children: e,
865
895
  component: r,
866
896
  className: t,
867
897
  align: a,
868
- ...l
898
+ ...s
869
899
  }) => {
870
- const o = B(C), n = r || (o.cellWrapper === z ? "th" : "td"), { mainClasses: d, alignClasses: c } = me({
871
- cellWrapper: o.cellWrapper,
900
+ const i = B(C), c = r || (i.cellWrapper === z ? "th" : "td"), { mainClasses: d, alignClasses: n } = je({
901
+ cellWrapper: i.cellWrapper,
872
902
  className: t,
873
- mode: o.mode,
874
- compact: o.compact,
903
+ mode: i.mode,
904
+ compact: i.compact,
875
905
  align: a
876
906
  });
877
- return a ? /* @__PURE__ */ i(n, { className: d, ...l, children: /* @__PURE__ */ i("div", { className: c, children: e }) }) : /* @__PURE__ */ i(n, { className: d, ...l, children: e });
907
+ return a ? /* @__PURE__ */ o(c, { className: d, ...s, children: /* @__PURE__ */ o("div", { className: n, children: e }) }) : /* @__PURE__ */ o(c, { className: d, ...s, children: e });
878
908
  }, Ye = ({
879
909
  align: e,
880
910
  children: r,
881
911
  buttonClassName: t,
882
912
  className: a,
883
- component: l,
884
- focusMode: o = "alt-system",
885
- mode: n = "alt-system",
913
+ component: s,
914
+ focusMode: i = "alt-system",
915
+ mode: c = "alt-system",
886
916
  onClick: d,
887
- sortDirection: c,
888
- sortedCell: h,
889
- cellId: u,
890
- ...g
917
+ sortDirection: n,
918
+ sortedCell: g,
919
+ cellId: b,
920
+ ...h
891
921
  }) => {
892
- const b = ye({ buttonClassName: t });
893
- return /* @__PURE__ */ i(
922
+ const m = Ae({ buttonClassName: t });
923
+ return /* @__PURE__ */ o(
894
924
  Pe,
895
925
  {
896
- component: l,
926
+ component: s,
897
927
  className: a,
898
928
  role: "columnheader",
899
- "aria-sort": c === R.ASC && h === u ? "ascending" : c === R.DESC && h === u ? "descending" : "other",
900
- ...g,
901
- children: /* @__PURE__ */ i(
902
- Z,
929
+ "aria-sort": n === E.ASC && g === b ? "ascending" : n === E.DESC && g === b ? "descending" : "other",
930
+ ...h,
931
+ children: /* @__PURE__ */ o(
932
+ ee,
903
933
  {
904
- active: h === u,
905
- className: b,
934
+ active: g === b,
935
+ className: m,
906
936
  onClick: d,
907
937
  align: e,
908
938
  noBorder: !0,
909
- focusMode: o,
910
- mode: n,
939
+ focusMode: i,
940
+ mode: c,
911
941
  fullWidth: !0,
912
942
  labelRight: r,
913
- children: c === R.ASC && h === u ? /* @__PURE__ */ i(Ae, { className: "size-4", monotone: !0 }) : c === R.DESC && h === u ? /* @__PURE__ */ i(je, { className: "size-4", monotone: !0 }) : /* @__PURE__ */ i(Oe, { className: "size-4", monotone: !0 })
943
+ children: n === E.ASC && g === b ? /* @__PURE__ */ o(ze, { className: "size-4", monotone: !0 }) : n === E.DESC && g === b ? /* @__PURE__ */ o(Se, { className: "size-4", monotone: !0 }) : /* @__PURE__ */ o(Ee, { className: "size-4", monotone: !0 })
914
944
  }
915
945
  )
916
946
  }
917
947
  );
918
948
  };
919
949
  export {
920
- He as Table,
950
+ De as Table,
921
951
  Ge as TableBody,
922
952
  Pe as TableCell,
923
953
  Ye as TableCellSort,
924
- R as TableCellSortDirections,
954
+ E as TableCellSortDirections,
925
955
  Fe as TableFooter,
926
- $e as TableHead,
956
+ He as TableHead,
927
957
  qe as TableRow
928
958
  };