@versini/ui-table 6.3.9 → 6.4.1

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 (3) hide show
  1. package/dist/components/Table/Table.js +207 -185
  2. package/dist/index.js +3 -3
  3. package/package.json +2 -2
package/dist/components/Table/Table.js CHANGED
@@ -1,7 +1,7 @@
1
- import { jsxs as g, jsx as l } from "react/jsx-runtime";
2
- import { ButtonSort_private as f } from "@versini/ui-button/private";
3
- import n from "clsx";
4
- import C, { useContext as p } from "react";
1
+ import { jsxs as _, jsx as l, Fragment as w } from "react/jsx-runtime";
2
+ import { ButtonSort_private as C } from "@versini/ui-button/private";
3
+ import o from "clsx";
4
+ import N, { useContext as y } from "react";
5
5
  import { TableCellSortDirections as k } from "../TableConstants/TableConstants.js";
6
6
  /*!
7
7
  @versini/ui-icons v4.15.1
@@ -29,102 +29,121 @@ try {
29
29
  });
30
30
  } catch {
31
31
  }
32
- const x = ({ children: t, fill: a, viewBox: e, className: s, defaultViewBox: r, size: c, title: o, semantic: h = !1, ...i }) => {
33
- const d = n(c, s);
34
- return /* @__PURE__ */ g("svg", {
32
+ const x = ({ children: t, fill: r, viewBox: e, className: a, defaultViewBox: s, size: n, title: c, semantic: b = !1, ...i }) => {
33
+ const h = o(n, a);
34
+ return /* @__PURE__ */ _("svg", {
35
35
  xmlns: "http://www.w3.org/2000/svg",
36
- className: d,
37
- viewBox: e || r,
38
- fill: a || "currentColor",
36
+ className: h,
37
+ viewBox: e || s,
38
+ fill: r || "currentColor",
39
39
  role: "img",
40
- "aria-hidden": !h,
40
+ "aria-hidden": !b,
41
41
  focusable: !1,
42
42
  ...i,
43
43
  children: [
44
- o && h && /* @__PURE__ */ l("title", {
45
- children: o
44
+ c && b && /* @__PURE__ */ l("title", {
45
+ children: c
46
46
  }),
47
47
  t
48
48
  ]
49
49
  });
50
- }, N = ({ className: t, viewBox: a, title: e, monotone: s, ...r }) => /* @__PURE__ */ g(x, {
50
+ }, S = ({ className: t, viewBox: r, title: e, monotone: a, ...s }) => /* @__PURE__ */ _(x, {
51
51
  defaultViewBox: "0 0 576 512",
52
52
  size: "size-5",
53
- viewBox: a,
53
+ viewBox: r,
54
54
  className: t,
55
55
  title: e || "Sort",
56
- ...r,
56
+ ...s,
57
57
  children: [
58
58
  /* @__PURE__ */ l("path", {
59
59
  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",
60
- opacity: s ? "1" : "0.4"
60
+ opacity: a ? "1" : "0.4"
61
61
  }),
62
62
  /* @__PURE__ */ l("path", {
63
63
  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"
64
64
  })
65
65
  ]
66
- }), S = ({ className: t, viewBox: a, title: e, monotone: s, ...r }) => /* @__PURE__ */ g(x, {
66
+ }), T = ({ className: t, viewBox: r, title: e, monotone: a, ...s }) => /* @__PURE__ */ _(x, {
67
67
  defaultViewBox: "0 0 576 512",
68
68
  size: "size-5",
69
- viewBox: a,
69
+ viewBox: r,
70
70
  className: t,
71
71
  title: e || "Sort Down",
72
- ...r,
72
+ ...s,
73
73
  children: [
74
74
  /* @__PURE__ */ l("path", {
75
75
  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",
76
- opacity: s ? "1" : "0.4"
76
+ opacity: a ? "1" : "0.4"
77
77
  }),
78
78
  /* @__PURE__ */ l("path", {
79
79
  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"
80
80
  })
81
81
  ]
82
- }), T = ({ className: t, viewBox: a, title: e, monotone: s, ...r }) => /* @__PURE__ */ g(x, {
82
+ }), I = ({ className: t, viewBox: r, title: e, monotone: a, ...s }) => /* @__PURE__ */ _(x, {
83
83
  defaultViewBox: "0 0 576 512",
84
84
  size: "size-5",
85
- viewBox: a,
85
+ viewBox: r,
86
86
  className: t,
87
87
  title: e || "Sort Up",
88
- ...r,
88
+ ...s,
89
89
  children: [
90
90
  /* @__PURE__ */ l("path", {
91
91
  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",
92
- opacity: s ? "1" : "0.4"
92
+ opacity: a ? "1" : "0.4"
93
93
  }),
94
94
  /* @__PURE__ */ l("path", {
95
95
  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"
96
96
  })
97
97
  ]
98
- }), y = C.createContext({
98
+ }), g = N.createContext({
99
99
  mode: "light",
100
100
  cellWrapper: "thead",
101
101
  stickyHeader: !1,
102
102
  stickyFooter: !1,
103
103
  compact: !1
104
- }), u = "thead", v = "tfoot", w = "tbody", I = () => ({
104
+ }), u = "thead", v = "tfoot", f = "tbody", z = ({ mode: t }) => o(
105
+ "size-8",
106
+ "align-[-0.125em]",
107
+ "border-4",
108
+ "inline-block animate-spin rounded-full border-solid border-current border-r-transparent motion-reduce:animate-[spin_1.5s_linear_infinite]",
109
+ {
110
+ "text-copy-dark": t === "light",
111
+ "text-copy-light": t === "dark",
112
+ "text-copy-dark dark:text-copy-light": t === "alt-system",
113
+ "text-copy-light dark:text-copy-dark": t === "system"
114
+ }
115
+ ), E = ({ mode: t }) => ({
105
116
  inner: "relative",
106
- overlay: n(
117
+ overlay: o(
107
118
  "absolute inset-0 z-20 cursor-not-allowed",
108
119
  "backdrop-blur-sm bg-white/30 dark:bg-black/30"
109
- )
110
- }), E = ({
120
+ ),
121
+ spinnerWrapper: o(
122
+ "absolute z-30 top-0 left-0 right-0 h-[min(100%,100vh)]",
123
+ "flex items-center justify-center",
124
+ "pointer-events-none"
125
+ ),
126
+ spinner: z({ mode: t })
127
+ }), R = ({
111
128
  mode: t,
112
- className: a,
129
+ className: r,
113
130
  wrapperClassName: e,
114
- stickyHeader: s,
115
- stickyFooter: r,
116
- disabled: c
131
+ stickyHeader: a,
132
+ stickyFooter: s,
133
+ disabled: n
117
134
  }) => {
118
- const o = c ? I() : null;
135
+ const c = n ? E({ mode: t }) : null;
119
136
  return {
120
- overlay: o?.overlay ?? "",
121
- inner: o?.inner ?? "",
122
- wrapper: n(
137
+ overlay: c?.overlay ?? "",
138
+ inner: c?.inner ?? "",
139
+ spinnerWrapper: c?.spinnerWrapper ?? "",
140
+ spinner: c?.spinner ?? "",
141
+ wrapper: o(
123
142
  "not-prose relative w-full rounded-lg shadow-md",
124
143
  {
125
- "overflow-x-auto": !s && !r && !c,
126
- "overflow-y-scroll": (s || r) && !c,
127
- "overflow-hidden": c,
144
+ "overflow-x-auto": !a && !s && !n,
145
+ "overflow-y-scroll": (a || s) && !n,
146
+ "overflow-hidden": n,
128
147
  "bg-surface-darker": t === "dark" || t === "system",
129
148
  "bg-surface-light": t === "light" || t === "alt-system",
130
149
  "dark:bg-surface-light": t === "system",
@@ -136,62 +155,62 @@ const x = ({ children: t, fill: a, viewBox: e, className: s, defaultViewBox: r,
136
155
  },
137
156
  e
138
157
  ),
139
- table: n("my-0 w-full text-left text-sm", a, {
158
+ table: o("my-0 w-full text-left text-sm", r, {
140
159
  "text-copy-light": t === "dark",
141
160
  "text-copy-dark": t === "light",
142
161
  "text-copy-light dark:text-copy-dark": t === "system",
143
162
  "text-copy-dark dark:text-copy-light": t === "alt-system"
144
163
  }),
145
- caption: n("py-2 text-sm font-bold", {
164
+ caption: o("py-2 text-sm font-bold", {
146
165
  "text-copy-light": t === "dark",
147
166
  "text-copy-dark": t === "light",
148
167
  "text-copy-light dark:text-copy-dark": t === "system",
149
168
  "text-copy-dark dark:text-copy-light": t === "alt-system"
150
169
  })
151
170
  };
152
- }, R = ({
171
+ }, V = ({
153
172
  className: t,
154
- stickyHeader: a,
173
+ stickyHeader: r,
155
174
  mode: e
156
- }) => n(
175
+ }) => o(
157
176
  {
158
- "sticky top-0 z-10": a,
159
- "shadow-[rgb(190_190_190_/20%)_0_0.5rem_1rem]": a && e === "dark",
160
- "shadow-[rgb(190_190_190_/20%)_0_0.5rem_1rem] dark:shadow-[rgb(65_65_65_/30%)_0_0.5rem_1rem]": a && e === "system",
161
- "shadow-[rgb(65_65_65_/30%)_0_0.5rem_1rem]": a && e === "light",
162
- "shadow-[rgb(65_65_65_/30%)_0_0.5rem_1rem] dark:shadow-[rgb(190_190_190_/20%)_0_0.5rem_1rem]": a && e === "alt-system"
177
+ "sticky top-0 z-10": r,
178
+ "shadow-[rgb(190_190_190_/20%)_0_0.5rem_1rem]": r && e === "dark",
179
+ "shadow-[rgb(190_190_190_/20%)_0_0.5rem_1rem] dark:shadow-[rgb(65_65_65_/30%)_0_0.5rem_1rem]": r && e === "system",
180
+ "shadow-[rgb(65_65_65_/30%)_0_0.5rem_1rem]": r && e === "light",
181
+ "shadow-[rgb(65_65_65_/30%)_0_0.5rem_1rem] dark:shadow-[rgb(190_190_190_/20%)_0_0.5rem_1rem]": r && e === "alt-system"
163
182
  },
164
183
  t
165
- ), V = ({
184
+ ), W = ({
166
185
  className: t,
167
- stickyFooter: a,
186
+ stickyFooter: r,
168
187
  mode: e
169
- }) => n(
188
+ }) => o(
170
189
  {
171
- "sticky bottom-0 z-10": a,
172
- "shadow-[rgb(190_190_190_/20%)_0_-0.5rem_1rem]": a && e === "dark",
173
- "shadow-[rgb(190_190_190_/20%)_0_-0.5rem_1rem] dark:shadow-[rgb(65_65_65_/30%)_0_-0.5rem_1rem]": a && e === "system",
174
- "shadow-[rgb(65_65_65_/30%)_0_-0.5rem_1rem]": a && e === "light",
175
- "shadow-[rgb(65_65_65_/30%)_-0_0.5rem_1rem] dark:shadow-[rgb(190_190_190_/20%)_0_-0.5rem_1rem]": a && e === "alt-system"
190
+ "sticky bottom-0 z-10": r,
191
+ "shadow-[rgb(190_190_190_/20%)_0_-0.5rem_1rem]": r && e === "dark",
192
+ "shadow-[rgb(190_190_190_/20%)_0_-0.5rem_1rem] dark:shadow-[rgb(65_65_65_/30%)_0_-0.5rem_1rem]": r && e === "system",
193
+ "shadow-[rgb(65_65_65_/30%)_0_-0.5rem_1rem]": r && e === "light",
194
+ "shadow-[rgb(65_65_65_/30%)_-0_0.5rem_1rem] dark:shadow-[rgb(190_190_190_/20%)_0_-0.5rem_1rem]": r && e === "alt-system"
176
195
  },
177
196
  t
178
- ), z = ({
197
+ ), B = ({
179
198
  mode: t,
180
- className: a,
199
+ className: r,
181
200
  cellWrapper: e
182
- }) => e === u || e === v ? n(
201
+ }) => e === u || e === v ? o(
183
202
  {
184
203
  "bg-table-head-dark": t === "dark" || t === "system",
185
204
  "bg-table-head-light": t === "light" || t === "alt-system",
186
205
  "dark:bg-table-head-light": t === "system",
187
206
  "dark:bg-table-head-dark": t === "alt-system"
188
207
  },
189
- a
190
- ) : n(
208
+ r
209
+ ) : o(
191
210
  "border-b last:border-0",
192
211
  {
193
- "hover:!bg-table-dark-odd/50 hover:dark:!bg-table-light-odd/50": t === "alt-system" || t === "light",
194
- "hover:!bg-table-light-odd/50 hover:dark:!bg-table-dark-odd/50": t === "system" || t === "dark",
212
+ "hover:bg-table-dark-odd/50! hover:dark:bg-table-light-odd/50!": t === "alt-system" || t === "light",
213
+ "hover:bg-table-light-odd/50! hover:dark:bg-table-dark-odd/50!": t === "system" || t === "dark",
195
214
  "border-table-dark": t === "dark" || t === "system",
196
215
  "odd:bg-table-dark-odd even:bg-table-dark-even": t === "dark",
197
216
  "border-table-light": t === "light" || t === "alt-system",
@@ -201,191 +220,194 @@ const x = ({ children: t, fill: a, viewBox: e, className: s, defaultViewBox: r,
201
220
  "dark:border-table-dark": t === "alt-system",
202
221
  "odd:bg-table-light-odd even:bg-table-light-even dark:odd:bg-table-dark-odd dark:even:bg-table-dark-even": t === "alt-system"
203
222
  },
204
- a
205
- ), B = ({
223
+ r
224
+ ), L = ({
206
225
  cellWrapper: t,
207
- className: a,
226
+ className: r,
208
227
  compact: e,
209
- mode: s,
210
- align: r
228
+ mode: a,
229
+ align: s
211
230
  }) => ({
212
- alignClasses: n({
213
- "flex justify-start text-left": r === "left",
214
- "flex justify-center text-center": r === "center",
215
- "flex justify-end text-right": r === "right"
231
+ alignClasses: o({
232
+ "flex justify-start text-left": s === "left",
233
+ "flex justify-center text-center": s === "center",
234
+ "flex justify-end text-right": s === "right"
216
235
  }),
217
- mainClasses: n(
236
+ mainClasses: o(
218
237
  {
219
- "text-copy-light": s === "dark" || s === "system",
220
- "text-copy-dark": s === "light" || s === "alt-system",
221
- "dark:text-copy-dark": s === "system",
222
- "dark:text-copy-light": s === "alt-system",
238
+ "text-copy-light": a === "dark" || a === "system",
239
+ "text-copy-dark": a === "light" || a === "alt-system",
240
+ "dark:text-copy-dark": a === "system",
241
+ "dark:text-copy-light": a === "alt-system",
223
242
  "px-4 py-3": !e && (t === u || t === v),
224
- "p-4": !e && t === w,
243
+ "p-4": !e && t === f,
225
244
  "px-2 py-1.5": e
226
245
  },
227
- a
246
+ r
228
247
  )
229
248
  }), M = ({
230
249
  buttonClassName: t
231
- }) => n("rounded-none text-sm", t), j = ({
250
+ }) => o("rounded-none text-sm", t), H = ({
232
251
  children: t,
233
- mode: a = "system",
252
+ mode: r = "system",
234
253
  caption: e,
235
- compact: s,
236
- disabled: r = !1,
237
- summary: c,
238
- className: o,
239
- wrapperClassName: h,
254
+ compact: a,
255
+ disabled: s = !1,
256
+ summary: n,
257
+ className: c,
258
+ wrapperClassName: b,
240
259
  maxHeight: i,
241
- stickyHeader: d,
242
- stickyFooter: _,
260
+ stickyHeader: h,
261
+ stickyFooter: p,
243
262
  ...m
244
263
  }) => {
245
- const b = E({
246
- mode: a,
247
- className: o,
248
- wrapperClassName: h,
249
- stickyHeader: d,
250
- stickyFooter: _,
251
- disabled: r
264
+ const d = R({
265
+ mode: r,
266
+ className: c,
267
+ wrapperClassName: b,
268
+ stickyHeader: h,
269
+ stickyFooter: p,
270
+ disabled: s
252
271
  });
253
272
  return /* @__PURE__ */ l(
254
- y.Provider,
273
+ g.Provider,
255
274
  {
256
- value: { mode: a, stickyHeader: d, stickyFooter: _, compact: s },
275
+ value: { mode: r, stickyHeader: h, stickyFooter: p, compact: a },
257
276
  children: /* @__PURE__ */ l(
258
277
  "div",
259
278
  {
260
- className: b.wrapper,
279
+ className: d.wrapper,
261
280
  ...i && {
262
281
  style: { maxHeight: i }
263
282
  },
264
- children: r ? /* @__PURE__ */ g("div", { className: b.inner, children: [
265
- /* @__PURE__ */ l("div", { className: b.overlay }),
266
- /* @__PURE__ */ g(
267
- "table",
268
- {
269
- className: b.table,
270
- summary: c,
271
- ...r && { "aria-disabled": "true" },
272
- ...m,
273
- children: [
274
- e && /* @__PURE__ */ l("caption", { className: b.caption, children: e }),
275
- t
276
- ]
277
- }
278
- )
279
- ] }) : /* @__PURE__ */ g("table", { className: b.table, summary: c, ...m, children: [
280
- e && /* @__PURE__ */ l("caption", { className: b.caption, children: e }),
283
+ children: s ? /* @__PURE__ */ _(w, { children: [
284
+ /* @__PURE__ */ l("div", { className: d.spinnerWrapper, children: /* @__PURE__ */ l("div", { className: d.spinner, role: "status", children: /* @__PURE__ */ l("span", { className: "sr-only", children: "Loading..." }) }) }),
285
+ /* @__PURE__ */ _("div", { className: d.inner, children: [
286
+ /* @__PURE__ */ l("div", { className: d.overlay }),
287
+ /* @__PURE__ */ _(
288
+ "table",
289
+ {
290
+ className: d.table,
291
+ summary: n,
292
+ ...s && { "aria-disabled": "true" },
293
+ ...m,
294
+ children: [
295
+ e && /* @__PURE__ */ l("caption", { className: d.caption, children: e }),
296
+ t
297
+ ]
298
+ }
299
+ )
300
+ ] })
301
+ ] }) : /* @__PURE__ */ _("table", { className: d.table, summary: n, ...m, children: [
302
+ e && /* @__PURE__ */ l("caption", { className: d.caption, children: e }),
281
303
  t
282
304
  ] })
283
305
  }
284
306
  )
285
307
  }
286
308
  );
287
- }, D = ({
309
+ }, F = ({
288
310
  children: t,
289
- className: a,
311
+ className: r,
290
312
  ...e
291
313
  }) => {
292
- const s = p(y);
293
- s.cellWrapper = u;
294
- const r = R({
295
- className: a,
296
- mode: s.mode,
297
- stickyHeader: s.stickyHeader
314
+ const a = y(g);
315
+ a.cellWrapper = u;
316
+ const s = V({
317
+ className: r,
318
+ mode: a.mode,
319
+ stickyHeader: a.stickyHeader
298
320
  });
299
- return /* @__PURE__ */ l("thead", { className: r, ...e, children: t });
300
- }, H = ({
321
+ return /* @__PURE__ */ l("thead", { className: s, ...e, children: t });
322
+ }, G = ({
301
323
  children: t,
302
- className: a,
324
+ className: r,
303
325
  ...e
304
326
  }) => {
305
- const s = p(y);
306
- s.cellWrapper = v;
307
- const r = V({
308
- className: a,
309
- mode: s.mode,
310
- stickyFooter: s.stickyFooter
327
+ const a = y(g);
328
+ a.cellWrapper = v;
329
+ const s = W({
330
+ className: r,
331
+ mode: a.mode,
332
+ stickyFooter: a.stickyFooter
311
333
  });
312
- return /* @__PURE__ */ l("tfoot", { className: r, ...e, children: t });
313
- }, G = ({ children: t, ...a }) => {
314
- const e = p(y);
315
- return e.cellWrapper = w, /* @__PURE__ */ l("tbody", { ...a, children: t });
316
- }, F = ({
334
+ return /* @__PURE__ */ l("tfoot", { className: s, ...e, children: t });
335
+ }, Y = ({ children: t, ...r }) => {
336
+ const e = y(g);
337
+ return e.cellWrapper = f, /* @__PURE__ */ l("tbody", { ...r, children: t });
338
+ }, q = ({
317
339
  children: t,
318
- className: a,
340
+ className: r,
319
341
  ...e
320
342
  }) => {
321
- const s = p(y), r = z({
322
- mode: s.mode,
323
- cellWrapper: s.cellWrapper,
324
- className: a
343
+ const a = y(g), s = B({
344
+ mode: a.mode,
345
+ cellWrapper: a.cellWrapper,
346
+ className: r
325
347
  });
326
- return /* @__PURE__ */ l("tr", { className: r, ...e, children: t });
327
- }, W = ({
348
+ return /* @__PURE__ */ l("tr", { className: s, ...e, children: t });
349
+ }, O = ({
328
350
  children: t,
329
- component: a,
351
+ component: r,
330
352
  className: e,
331
- align: s,
332
- ...r
353
+ align: a,
354
+ ...s
333
355
  }) => {
334
- const c = p(y), o = a || (c.cellWrapper === u ? "th" : "td"), { mainClasses: h, alignClasses: i } = B({
335
- cellWrapper: c.cellWrapper,
356
+ const n = y(g), c = r || (n.cellWrapper === u ? "th" : "td"), { mainClasses: b, alignClasses: i } = L({
357
+ cellWrapper: n.cellWrapper,
336
358
  className: e,
337
- mode: c.mode,
338
- compact: c.compact,
339
- align: s
359
+ mode: n.mode,
360
+ compact: n.compact,
361
+ align: a
340
362
  });
341
- return s ? /* @__PURE__ */ l(o, { className: h, ...r, children: /* @__PURE__ */ l("div", { className: i, children: t }) }) : /* @__PURE__ */ l(o, { className: h, ...r, children: t });
342
- }, Y = ({
363
+ return a ? /* @__PURE__ */ l(c, { className: b, ...s, children: /* @__PURE__ */ l("div", { className: i, children: t }) }) : /* @__PURE__ */ l(c, { className: b, ...s, children: t });
364
+ }, J = ({
343
365
  align: t,
344
- children: a,
366
+ children: r,
345
367
  buttonClassName: e,
346
- className: s,
347
- component: r,
348
- focusMode: c = "alt-system",
349
- mode: o = "alt-system",
350
- onClick: h,
368
+ className: a,
369
+ component: s,
370
+ focusMode: n = "alt-system",
371
+ mode: c = "alt-system",
372
+ onClick: b,
351
373
  sortDirection: i,
352
- sortedCell: d,
353
- cellId: _,
374
+ sortedCell: h,
375
+ cellId: p,
354
376
  ...m
355
377
  }) => {
356
- const b = M({ buttonClassName: e });
378
+ const d = M({ buttonClassName: e });
357
379
  return /* @__PURE__ */ l(
358
- W,
380
+ O,
359
381
  {
360
- component: r,
361
- className: s,
382
+ component: s,
383
+ className: a,
362
384
  role: "columnheader",
363
- "aria-sort": i === k.ASC && d === _ ? "ascending" : i === k.DESC && d === _ ? "descending" : "other",
385
+ "aria-sort": i === k.ASC && h === p ? "ascending" : i === k.DESC && h === p ? "descending" : "other",
364
386
  ...m,
365
387
  children: /* @__PURE__ */ l(
366
- f,
388
+ C,
367
389
  {
368
- active: d === _,
369
- className: b,
370
- onClick: h,
390
+ active: h === p,
391
+ className: d,
392
+ onClick: b,
371
393
  align: t,
372
394
  noBorder: !0,
373
- focusMode: c,
374
- mode: o,
395
+ focusMode: n,
396
+ mode: c,
375
397
  fullWidth: !0,
376
- labelRight: a,
377
- children: i === k.ASC && d === _ ? /* @__PURE__ */ l(T, { className: "size-4", monotone: !0 }) : i === k.DESC && d === _ ? /* @__PURE__ */ l(S, { className: "size-4", monotone: !0 }) : /* @__PURE__ */ l(N, { className: "size-4", monotone: !0 })
398
+ labelRight: r,
399
+ children: i === k.ASC && h === p ? /* @__PURE__ */ l(I, { className: "size-4", monotone: !0 }) : i === k.DESC && h === p ? /* @__PURE__ */ l(T, { className: "size-4", monotone: !0 }) : /* @__PURE__ */ l(S, { className: "size-4", monotone: !0 })
378
400
  }
379
401
  )
380
402
  }
381
403
  );
382
404
  };
383
405
  export {
384
- j as Table,
385
- G as TableBody,
386
- W as TableCell,
387
- Y as TableCellSort,
388
- H as TableFooter,
389
- D as TableHead,
390
- F as TableRow
406
+ H as Table,
407
+ Y as TableBody,
408
+ O as TableCell,
409
+ J as TableCellSort,
410
+ G as TableFooter,
411
+ F as TableHead,
412
+ q as TableRow
391
413
  };
package/dist/index.js CHANGED
@@ -1,13 +1,13 @@
1
1
  import { Table as a, TableBody as r, TableCell as T, TableCellSort as i, TableFooter as _, TableHead as t, TableRow as b } from "./components/Table/Table.js";
2
2
  import { TableCellSortDirections as n } from "./components/TableConstants/TableConstants.js";
3
3
  /*!
4
- @versini/ui-table v6.3.9
4
+ @versini/ui-table v6.4.1
5
5
  © 2025 gizmette.com
6
6
  */
7
7
  try {
8
8
  window.__VERSINI_UI_TABLE__ || (window.__VERSINI_UI_TABLE__ = {
9
- version: "6.3.9",
10
- buildTime: "12/16/2025 06:22 PM EST",
9
+ version: "6.4.1",
10
+ buildTime: "12/20/2025 01:32 PM EST",
11
11
  homepage: "https://www.npmjs.com/package/@versini/ui-table",
12
12
  license: "MIT"
13
13
  });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@versini/ui-table",
3
- "version": "6.3.9",
3
+ "version": "6.4.1",
4
4
  "license": "MIT",
5
5
  "author": "Arno Versini",
6
6
  "publishConfig": {
@@ -58,5 +58,5 @@
58
58
  "sideEffects": [
59
59
  "**/*.css"
60
60
  ],
61
- "gitHead": "30d86d13d4369cc841fc267c970cca423d27bf2f"
61
+ "gitHead": "bc9806c9b49ea85a82da3832ae9d22d1981c2e72"
62
62
  }