@versini/ui-table 4.0.9 → 4.0.11

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 +475 -443
  3. package/dist/index.js +3 -3
  4. package/package.json +6 -5
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,
@@ -450,166 +365,166 @@ const ze = {
450
365
  bottom: 0,
451
366
  right: 0
452
367
  };
453
- 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);
368
+ function j(e) {
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] = j(), [y, O] = j(), [I, G] = j(), A = w(0), v = w(null), f = w(null), oe = Ce([ae, v]);
435
+ return q(() => {
436
+ I && I.current && k && (A.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 + A.current : p && y && O.width > 0 && (x = O.width + A.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.9
507
+ @versini/ui-button v7.1.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.9",
598
- buildTime: "07/14/2025 12:04 PM EDT",
512
+ version: "7.1.0",
513
+ buildTime: "08/10/2025 12:46 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,47 @@ 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: t,
548
+ ref: i,
634
549
  mode: r,
635
550
  radius: "small",
636
- ...l,
551
+ size: "small",
552
+ align: "center",
553
+ ...s,
637
554
  children: e
638
555
  }
639
556
  ) });
640
557
  }
641
558
  );
642
- Z.displayName = "ButtonSort";
643
- const H = ({
559
+ ee.displayName = "ButtonSort";
560
+ const $ = ({
644
561
  children: e,
645
562
  fill: r,
646
563
  viewBox: t,
647
564
  className: a,
648
- defaultViewBox: l,
649
- size: o,
650
- title: n,
565
+ defaultViewBox: s,
566
+ size: i,
567
+ title: c,
651
568
  semantic: d = !1,
652
- ...c
569
+ ...n
653
570
  }) => {
654
- const h = s(o, a);
655
- return /* @__PURE__ */ i(ne, { children: /* @__PURE__ */ N(
571
+ const g = l(i, a);
572
+ return /* @__PURE__ */ o(ce, { children: /* @__PURE__ */ N(
656
573
  "svg",
657
574
  {
658
575
  xmlns: "http://www.w3.org/2000/svg",
659
- className: h,
660
- viewBox: t || l,
576
+ className: g,
577
+ viewBox: t || s,
661
578
  fill: r || "currentColor",
662
579
  role: "img",
663
580
  "aria-hidden": !d,
664
581
  focusable: !1,
665
- ...c,
582
+ ...n,
666
583
  children: [
667
- n && d && /* @__PURE__ */ i("title", { children: n }),
584
+ c && d && /* @__PURE__ */ o("title", { children: c }),
668
585
  e
669
586
  ]
670
587
  }
@@ -683,82 +600,82 @@ try {
683
600
  });
684
601
  } catch {
685
602
  }
686
- const Oe = ({
603
+ const Ee = ({
687
604
  className: e,
688
605
  viewBox: r,
689
606
  title: t,
690
607
  monotone: a,
691
- ...l
608
+ ...s
692
609
  }) => /* @__PURE__ */ N(
693
- H,
610
+ $,
694
611
  {
695
612
  defaultViewBox: "0 0 576 512",
696
613
  size: "size-5",
697
614
  viewBox: r,
698
615
  className: e,
699
616
  title: t || "Sort",
700
- ...l,
617
+ ...s,
701
618
  children: [
702
- /* @__PURE__ */ i(
619
+ /* @__PURE__ */ o(
703
620
  "path",
704
621
  {
705
622
  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
623
  opacity: a ? "1" : "0.4"
707
624
  }
708
625
  ),
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" })
626
+ /* @__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
627
  ]
711
628
  }
712
- ), je = ({
629
+ ), Se = ({
713
630
  className: e,
714
631
  viewBox: r,
715
632
  title: t,
716
633
  monotone: a,
717
- ...l
634
+ ...s
718
635
  }) => /* @__PURE__ */ N(
719
- H,
636
+ $,
720
637
  {
721
638
  defaultViewBox: "0 0 576 512",
722
639
  size: "size-5",
723
640
  viewBox: r,
724
641
  className: e,
725
642
  title: t || "Sort Down",
726
- ...l,
643
+ ...s,
727
644
  children: [
728
- /* @__PURE__ */ i(
645
+ /* @__PURE__ */ o(
729
646
  "path",
730
647
  {
731
648
  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
649
  opacity: a ? "1" : "0.4"
733
650
  }
734
651
  ),
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" })
652
+ /* @__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
653
  ]
737
654
  }
738
- ), Ae = ({
655
+ ), ze = ({
739
656
  className: e,
740
657
  viewBox: r,
741
658
  title: t,
742
659
  monotone: a,
743
- ...l
660
+ ...s
744
661
  }) => /* @__PURE__ */ N(
745
- H,
662
+ $,
746
663
  {
747
664
  defaultViewBox: "0 0 576 512",
748
665
  size: "size-5",
749
666
  viewBox: r,
750
667
  className: e,
751
668
  title: t || "Sort Up",
752
- ...l,
669
+ ...s,
753
670
  children: [
754
- /* @__PURE__ */ i(
671
+ /* @__PURE__ */ o(
755
672
  "path",
756
673
  {
757
674
  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
675
  opacity: a ? "1" : "0.4"
759
676
  }
760
677
  ),
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" })
678
+ /* @__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
679
  ]
763
680
  }
764
681
  );
@@ -781,148 +698,263 @@ const C = S.createContext({
781
698
  stickyHeader: !1,
782
699
  stickyFooter: !1,
783
700
  compact: !1
784
- }), He = ({
701
+ }), z = "thead", D = "tfoot", _ = "tbody", E = {
702
+ ASC: "asc",
703
+ DESC: "desc"
704
+ }, Le = ({
705
+ mode: e,
706
+ className: r,
707
+ wrapperClassName: t,
708
+ stickyHeader: a,
709
+ stickyFooter: s
710
+ }) => ({
711
+ wrapper: l(
712
+ "not-prose relative w-full rounded-lg shadow-md",
713
+ {
714
+ "overflow-x-auto": !a && !s,
715
+ "overflow-y-scroll": a || s,
716
+ "bg-surface-darker": e === "dark" || e === "system",
717
+ "bg-surface-light": e === "light" || e === "alt-system",
718
+ "dark:bg-surface-light": e === "system",
719
+ "dark:bg-surface-darker": e === "alt-system",
720
+ "text-copy-light": e === "dark",
721
+ "text-copy-dark": e === "light",
722
+ "text-copy-light dark:text-copy-dark": e === "system",
723
+ "text-copy-dark dark:text-copy-light": e === "alt-system"
724
+ },
725
+ t
726
+ ),
727
+ table: l("my-0 w-full text-left text-sm", r, {
728
+ "text-copy-light": e === "dark",
729
+ "text-copy-dark": e === "light",
730
+ "text-copy-light dark:text-copy-dark": e === "system",
731
+ "text-copy-dark dark:text-copy-light": e === "alt-system"
732
+ }),
733
+ caption: l("py-2 text-sm font-bold", {
734
+ "text-copy-light": e === "dark",
735
+ "text-copy-dark": e === "light",
736
+ "text-copy-light dark:text-copy-dark": e === "system",
737
+ "text-copy-dark dark:text-copy-light": e === "alt-system"
738
+ })
739
+ }), Me = ({
740
+ className: e,
741
+ stickyHeader: r,
742
+ mode: t
743
+ }) => l(
744
+ {
745
+ "sticky top-0 z-10": r,
746
+ "shadow-[rgb(190_190_190_/20%)_0_0.5rem_1rem]": r && t === "dark",
747
+ "shadow-[rgb(190_190_190_/20%)_0_0.5rem_1rem] dark:shadow-[rgb(65_65_65_/30%)_0_0.5rem_1rem]": r && t === "system",
748
+ "shadow-[rgb(65_65_65_/30%)_0_0.5rem_1rem]": r && t === "light",
749
+ "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"
750
+ },
751
+ e
752
+ ), Ve = ({
753
+ className: e,
754
+ stickyFooter: r,
755
+ mode: t
756
+ }) => l(
757
+ {
758
+ "sticky bottom-0 z-10": r,
759
+ "shadow-[rgb(190_190_190_/20%)_0_-0.5rem_1rem]": r && t === "dark",
760
+ "shadow-[rgb(190_190_190_/20%)_0_-0.5rem_1rem] dark:shadow-[rgb(65_65_65_/30%)_0_-0.5rem_1rem]": r && t === "system",
761
+ "shadow-[rgb(65_65_65_/30%)_0_-0.5rem_1rem]": r && t === "light",
762
+ "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"
763
+ },
764
+ e
765
+ ), Oe = ({
766
+ mode: e,
767
+ className: r,
768
+ cellWrapper: t
769
+ }) => t === z || t === D ? l(
770
+ {
771
+ "bg-table-head-dark": e === "dark" || e === "system",
772
+ "bg-table-head-light": e === "light" || e === "alt-system",
773
+ "dark:bg-table-head-light": e === "system",
774
+ "dark:bg-table-head-dark": e === "alt-system"
775
+ },
776
+ r
777
+ ) : l(
778
+ "border-b last:border-0",
779
+ {
780
+ "border-table-dark": e === "dark" || e === "system",
781
+ "odd:bg-table-dark-odd even:bg-table-dark-even": t === _ && e === "dark",
782
+ "border-table-light": e === "light" || e === "alt-system",
783
+ "odd:bg-table-light-odd even:bg-table-light-even": t === _ && e === "light",
784
+ "dark:border-table-light": e === "system",
785
+ "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",
786
+ "dark:border-table-dark": e === "alt-system",
787
+ "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"
788
+ },
789
+ r
790
+ ), Ae = ({
791
+ cellWrapper: e,
792
+ className: r,
793
+ compact: t,
794
+ mode: a,
795
+ align: s
796
+ }) => ({
797
+ alignClasses: l({
798
+ "flex justify-start text-left": s === "left",
799
+ "flex justify-center text-center": s === "center",
800
+ "flex justify-end text-right": s === "right"
801
+ }),
802
+ mainClasses: l(
803
+ {
804
+ "text-copy-light": a === "dark" || a === "system",
805
+ "text-copy-dark": a === "light" || a === "alt-system",
806
+ "dark:text-copy-dark": a === "system",
807
+ "dark:text-copy-light": a === "alt-system",
808
+ "px-4 py-3": !t && (e === z || e === D),
809
+ "p-4": !t && e === _,
810
+ "px-2 py-1.5": t
811
+ },
812
+ r
813
+ )
814
+ }), je = ({
815
+ buttonClassName: e
816
+ }) => l("rounded-none text-sm", e), De = ({
785
817
  children: e,
786
818
  mode: r = "system",
787
819
  caption: t,
788
820
  compact: a,
789
- summary: l,
790
- className: o,
791
- wrapperClassName: n,
821
+ summary: s,
822
+ className: i,
823
+ wrapperClassName: c,
792
824
  maxHeight: d,
793
- stickyHeader: c,
794
- stickyFooter: h,
795
- ...u
825
+ stickyHeader: n,
826
+ stickyFooter: g,
827
+ ...b
796
828
  }) => {
797
- const g = ge({
829
+ const h = Le({
798
830
  mode: r,
799
- className: o,
800
- wrapperClassName: n,
801
- stickyHeader: c,
802
- stickyFooter: h
831
+ className: i,
832
+ wrapperClassName: c,
833
+ stickyHeader: n,
834
+ stickyFooter: g
803
835
  });
804
- return /* @__PURE__ */ i(
836
+ return /* @__PURE__ */ o(
805
837
  C.Provider,
806
838
  {
807
- value: { mode: r, stickyHeader: c, stickyFooter: h, compact: a },
808
- children: /* @__PURE__ */ i(
839
+ value: { mode: r, stickyHeader: n, stickyFooter: g, compact: a },
840
+ children: /* @__PURE__ */ o(
809
841
  "div",
810
842
  {
811
- className: g.wrapper,
843
+ className: h.wrapper,
812
844
  ...d && {
813
845
  style: { maxHeight: d }
814
846
  },
815
- children: /* @__PURE__ */ N("table", { className: g.table, summary: l, ...u, children: [
816
- t && /* @__PURE__ */ i("caption", { className: g.caption, children: t }),
847
+ children: /* @__PURE__ */ N("table", { className: h.table, summary: s, ...b, children: [
848
+ t && /* @__PURE__ */ o("caption", { className: h.caption, children: t }),
817
849
  e
818
850
  ] })
819
851
  }
820
852
  )
821
853
  }
822
854
  );
823
- }, $e = ({
855
+ }, He = ({
824
856
  children: e,
825
857
  className: r,
826
858
  ...t
827
859
  }) => {
828
860
  const a = B(C);
829
861
  a.cellWrapper = z;
830
- const l = he({
862
+ const s = Me({
831
863
  className: r,
832
864
  mode: a.mode,
833
865
  stickyHeader: a.stickyHeader
834
866
  });
835
- return /* @__PURE__ */ i("thead", { className: l, ...t, children: e });
867
+ return /* @__PURE__ */ o("thead", { className: s, ...t, children: e });
836
868
  }, Fe = ({
837
869
  children: e,
838
870
  className: r,
839
871
  ...t
840
872
  }) => {
841
873
  const a = B(C);
842
- a.cellWrapper = W;
843
- const l = be({
874
+ a.cellWrapper = D;
875
+ const s = Ve({
844
876
  className: r,
845
877
  mode: a.mode,
846
878
  stickyFooter: a.stickyFooter
847
879
  });
848
- return /* @__PURE__ */ i("tfoot", { className: l, ...t, children: e });
880
+ return /* @__PURE__ */ o("tfoot", { className: s, ...t, children: e });
849
881
  }, Ge = ({ children: e, ...r }) => {
850
882
  const t = B(C);
851
- return t.cellWrapper = x, /* @__PURE__ */ i("tbody", { ...r, children: e });
883
+ return t.cellWrapper = _, /* @__PURE__ */ o("tbody", { ...r, children: e });
852
884
  }, qe = ({
853
885
  children: e,
854
886
  className: r,
855
887
  ...t
856
888
  }) => {
857
- const a = B(C), l = ue({
889
+ const a = B(C), s = Oe({
858
890
  mode: a.mode,
859
891
  cellWrapper: a.cellWrapper,
860
892
  className: r
861
893
  });
862
- return /* @__PURE__ */ i("tr", { className: l, ...t, children: e });
894
+ return /* @__PURE__ */ o("tr", { className: s, ...t, children: e });
863
895
  }, Pe = ({
864
896
  children: e,
865
897
  component: r,
866
898
  className: t,
867
899
  align: a,
868
- ...l
900
+ ...s
869
901
  }) => {
870
- const o = B(C), n = r || (o.cellWrapper === z ? "th" : "td"), { mainClasses: d, alignClasses: c } = me({
871
- cellWrapper: o.cellWrapper,
902
+ const i = B(C), c = r || (i.cellWrapper === z ? "th" : "td"), { mainClasses: d, alignClasses: n } = Ae({
903
+ cellWrapper: i.cellWrapper,
872
904
  className: t,
873
- mode: o.mode,
874
- compact: o.compact,
905
+ mode: i.mode,
906
+ compact: i.compact,
875
907
  align: a
876
908
  });
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 });
909
+ 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
910
  }, Ye = ({
879
911
  align: e,
880
912
  children: r,
881
913
  buttonClassName: t,
882
914
  className: a,
883
- component: l,
884
- focusMode: o = "alt-system",
885
- mode: n = "alt-system",
915
+ component: s,
916
+ focusMode: i = "alt-system",
917
+ mode: c = "alt-system",
886
918
  onClick: d,
887
- sortDirection: c,
888
- sortedCell: h,
889
- cellId: u,
890
- ...g
919
+ sortDirection: n,
920
+ sortedCell: g,
921
+ cellId: b,
922
+ ...h
891
923
  }) => {
892
- const b = ye({ buttonClassName: t });
893
- return /* @__PURE__ */ i(
924
+ const m = je({ buttonClassName: t });
925
+ return /* @__PURE__ */ o(
894
926
  Pe,
895
927
  {
896
- component: l,
928
+ component: s,
897
929
  className: a,
898
930
  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,
931
+ "aria-sort": n === E.ASC && g === b ? "ascending" : n === E.DESC && g === b ? "descending" : "other",
932
+ ...h,
933
+ children: /* @__PURE__ */ o(
934
+ ee,
903
935
  {
904
- active: h === u,
905
- className: b,
936
+ active: g === b,
937
+ className: m,
906
938
  onClick: d,
907
939
  align: e,
908
940
  noBorder: !0,
909
- focusMode: o,
910
- mode: n,
941
+ focusMode: i,
942
+ mode: c,
911
943
  fullWidth: !0,
912
944
  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 })
945
+ 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
946
  }
915
947
  )
916
948
  }
917
949
  );
918
950
  };
919
951
  export {
920
- He as Table,
952
+ De as Table,
921
953
  Ge as TableBody,
922
954
  Pe as TableCell,
923
955
  Ye as TableCellSort,
924
- R as TableCellSortDirections,
956
+ E as TableCellSortDirections,
925
957
  Fe as TableFooter,
926
- $e as TableHead,
958
+ He as TableHead,
927
959
  qe as TableRow
928
960
  };