@nova-design-system/nova-react 3.15.0 → 3.17.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (62) hide show
  1. package/dist/cjs/generated/components.server.js +826 -0
  2. package/dist/cjs/{index-BK1_MpRZ.js → index-B0fvq6nd.js} +4818 -1376
  3. package/dist/cjs/index.js +3 -2
  4. package/dist/cjs/{nv-accordion-item.entry-BPaDkIFa.js → nv-accordion-item.entry-DSXSMuOt.js} +2 -2
  5. package/dist/cjs/{nv-accordion.entry-BaHER2iL.js → nv-accordion.entry-D2GTCEoF.js} +6 -6
  6. package/dist/cjs/{nv-alert.entry-Hv-y3Bwl.js → nv-alert.entry-CxrdJWzE.js} +2 -2
  7. package/dist/cjs/nv-avatar.entry-Boe2Bp39.js +68 -0
  8. package/dist/cjs/{nv-badge_2.entry-CwlWa72m.js → nv-badge_2.entry-Cvu8cWAm.js} +1 -1
  9. package/dist/cjs/{nv-breadcrumb.entry-BvHgDgxV.js → nv-breadcrumb.entry-IBd49U13.js} +2 -2
  10. package/dist/cjs/{nv-breadcrumbs.entry-BdptRKYA.js → nv-breadcrumbs.entry-CxDCe3pi.js} +1 -1
  11. package/dist/cjs/nv-button.entry-veszqyTF.js +159 -0
  12. package/dist/cjs/{nv-buttongroup.entry-Bh0f3bAn.js → nv-buttongroup.entry-BoqH0Kje.js} +1 -1
  13. package/dist/cjs/{nv-calendar.entry-BZLITXEC.js → nv-calendar.entry-D-Wl56-6.js} +1 -1
  14. package/dist/cjs/{nv-col.entry-I3bCSLB5.js → nv-col.entry-BhKZwFpL.js} +1 -1
  15. package/dist/cjs/{nv-datagrid.entry-BzIkgOV6.js → nv-datagrid.entry-DnMZbymp.js} +177 -10
  16. package/dist/cjs/{nv-datagridcolumn.entry-BuFhEECG.js → nv-datagridcolumn.entry-U38uoM6D.js} +1 -1
  17. package/dist/cjs/{nv-dialog.entry-DIbIIXo2.js → nv-dialog.entry-BF4VplVi.js} +32 -29
  18. package/dist/cjs/{nv-dialogfooter_2.entry-Thzk1kVd.js → nv-dialogfooter_2.entry-TqO3Mryg.js} +2 -2
  19. package/dist/cjs/{nv-fieldcheckbox.entry-mkas423y.js → nv-fieldcheckbox.entry-C_rJ7Jrf.js} +2 -2
  20. package/dist/cjs/{nv-fielddate.entry-Cek70TQM.js → nv-fielddate.entry-DZdztKCP.js} +51 -26
  21. package/dist/cjs/{nv-fielddaterange.entry-C3BYAnVq.js → nv-fielddaterange.entry-CMxpi6X9.js} +68 -42
  22. package/dist/cjs/{nv-fielddropdown.entry-Djz5-R1T.js → nv-fielddropdown.entry-T-qNo0gM.js} +33 -7
  23. package/dist/cjs/{nv-fielddropdownitem.entry-B2z13jEI.js → nv-fielddropdownitem.entry-BfIqaxW3.js} +1 -1
  24. package/dist/cjs/{nv-fieldmultiselect.entry-uJ9i2gtz.js → nv-fieldmultiselect.entry-rtKSNZ5F.js} +187 -156
  25. package/dist/cjs/{nv-fieldnumber.entry-zpWCDG_-.js → nv-fieldnumber.entry-BD-xCdb5.js} +2 -2
  26. package/dist/cjs/{nv-fieldpassword.entry-C835HE_i.js → nv-fieldpassword.entry-Dmt91T4y.js} +2 -2
  27. package/dist/cjs/{nv-fieldradio.entry-CzLMbo4W.js → nv-fieldradio.entry-CAoRufTW.js} +2 -2
  28. package/dist/cjs/{nv-fieldselect.entry-BzcYzmqe.js → nv-fieldselect.entry-2YLbIpBO.js} +2 -2
  29. package/dist/cjs/{nv-fieldslider.entry-B5vyrQZw.js → nv-fieldslider.entry-D6g_MrUd.js} +2 -2
  30. package/dist/cjs/{nv-fieldtext.entry-DnPQxVqp.js → nv-fieldtext.entry-D-SS4OPR.js} +2 -2
  31. package/dist/cjs/{nv-fieldtextarea.entry-n2MJK2Jg.js → nv-fieldtextarea.entry-L0XDrdHL.js} +2 -2
  32. package/dist/cjs/{nv-fieldtime.entry-DChhvqKi.js → nv-fieldtime.entry-Hw5VOmpK.js} +25 -12
  33. package/dist/cjs/nv-icon.entry-B7mLhu0c.js +80 -0
  34. package/dist/cjs/{nv-iconbutton_2.entry-u0l16LeW.js → nv-iconbutton_2.entry-iinBJBb6.js} +2 -2
  35. package/dist/cjs/{nv-menu.entry-OYVh6iMu.js → nv-menu.entry-BTW4XauN.js} +24 -9
  36. package/dist/cjs/{nv-menuitem.entry-Dj6N1n9X.js → nv-menuitem.entry-CIT2_Fbe.js} +1 -1
  37. package/dist/cjs/{nv-notification.entry-D1dVSEYZ.js → nv-notification.entry-CVyzCsSh.js} +2 -2
  38. package/dist/cjs/{nv-notificationcontainer.entry-Bp2NR_fe.js → nv-notificationcontainer.entry-CqoyGWAa.js} +1 -1
  39. package/dist/cjs/{nv-popover.entry-Bf2AEn9B.js → nv-popover.entry-Bf5ihsdq.js} +67 -61
  40. package/dist/cjs/{nv-row.entry-Bi9eoQEh.js → nv-row.entry-Chp5QzjD.js} +1 -1
  41. package/dist/cjs/nv-split.entry-DSB_HMU-.js +337 -0
  42. package/dist/cjs/{nv-stack.entry-Dd680LIT.js → nv-stack.entry-D6L6830W.js} +2 -2
  43. package/dist/cjs/nv-table.entry-B-UuWaI5.js +245 -0
  44. package/dist/cjs/{nv-toggle.entry-gBokGnGe.js → nv-toggle.entry-AG7sAORg.js} +2 -2
  45. package/dist/cjs/{nv-togglebutton.entry-ZpltTrQe.js → nv-togglebutton.entry-Btlxm5gO.js} +1 -1
  46. package/dist/cjs/{nv-togglebuttongroup.entry-Bu0C6Iq3.js → nv-togglebuttongroup.entry-CM3nWiUU.js} +2 -2
  47. package/dist/cjs/{nv-tooltip.entry-DR4aj5qF.js → nv-tooltip.entry-m4AYXhW3.js} +1 -1
  48. package/dist/components/NvDatatable.js +45 -0
  49. package/dist/generated/components.js +10 -10
  50. package/dist/generated/components.server.js +10 -16
  51. package/dist/index.js +1 -0
  52. package/dist/types/components/NvDatatable.d.ts +25 -0
  53. package/dist/types/generated/components.d.ts +7 -12
  54. package/dist/types/generated/components.server.d.ts +7 -12
  55. package/dist/types/index.d.ts +1 -0
  56. package/package.json +14 -6
  57. package/dist/cjs/dom.utils-ac71e0ef-CmIwRr6O.js +0 -168
  58. package/dist/cjs/nv-avatar.entry-BTmGyeGF.js +0 -68
  59. package/dist/cjs/nv-button.entry-6O39hBHY.js +0 -165
  60. package/dist/cjs/nv-icon.entry-agdqxUMS.js +0 -80
  61. package/dist/cjs/nv-table.entry-wxn9GDDo.js +0 -339
  62. package/dist/cjs/nv-tablecolumn.entry-Bo0z0XyB.js +0 -19
@@ -0,0 +1,337 @@
1
+ 'use strict';
2
+
3
+ var index = require('./index-B0fvq6nd.js');
4
+ require('react');
5
+ require('react-dom');
6
+
7
+ const nvSplitCss = "nv-split{display:flex;width:100%;height:100%;position:relative}nv-split[direction=horizontal]{flex-direction:row}nv-split[direction=vertical]{flex-direction:column}nv-split .nv-split-gutter{position:absolute;z-index:10;background:transparent;display:flex;align-items:center;justify-content:center;flex:0 0 auto;transition:background-color 0.2s ease}nv-split .nv-split-gutter::after{content:\"\";position:absolute;background:var(--nv-color-neutral-400, #ccc);border-radius:2px;transition:background-color 0.2s ease}nv-split .nv-split-gutter:hover::after{background:var(--nv-color-brand-primary, #0066cc)}nv-split .nv-split-gutter::before{content:\"\";position:absolute;background-repeat:no-repeat;background-position:center;opacity:0.4;transition:opacity 0.2s ease;pointer-events:none}nv-split .nv-split-gutter:hover::before{opacity:0.7}nv-split[direction=horizontal]>.nv-split-gutter{width:var(--nv-split-gutter-size, 24px);top:0;bottom:0;transform:translateX(-50%);cursor:col-resize}nv-split[direction=horizontal]>.nv-split-gutter::after{width:2px;height:60%;left:50%;top:20%;transform:translateX(-50%)}nv-split[direction=horizontal]>.nv-split-gutter::before{width:16px;height:16px}nv-split[direction=vertical]>.nv-split-gutter{height:var(--nv-split-gutter-size, 24px);left:0;right:0;transform:translateY(-50%);cursor:row-resize}nv-split[direction=vertical]>.nv-split-gutter::after{height:2px;width:60%;top:50%;left:20%;transform:translateY(-50%)}nv-split[direction=vertical]>.nv-split-gutter::before{width:16px;height:16px}nv-split[data-dragging=true]>.nv-split-gutter::after{background:var(--nv-color-neutral-500, #9ca3af)}nv-split>[slot=pane]{flex:1 1 auto;overflow:hidden;min-width:0;min-height:0;display:flex;flex-direction:column}nv-split>[slot=pane]>nv-split{flex:1 1 auto;width:100%;height:100%}";
8
+ const NvSplitStyle0 = nvSplitCss;
9
+
10
+ const NvSplit = class {
11
+ constructor(hostRef) {
12
+ index.registerInstance(this, hostRef);
13
+ this.sizesChanged = index.createEvent(this, "sizesChanged");
14
+ /****************************************************************************/
15
+ //#region PROPERTIES
16
+ /**
17
+ * Direction of the split layout.
18
+ * - `horizontal`: panes side by side
19
+ * - `vertical`: panes stacked
20
+ */
21
+ this.direction = 'horizontal';
22
+ /**
23
+ * Initial sizes of the panes in percentages.
24
+ * Example: `[50, 50]` means two equal panes.
25
+ * Explicitly `reflect: false` (array) for framework compatibility.
26
+ */
27
+ this.sizes = [];
28
+ /**
29
+ * Width or height of the gutter (in px) depending on the split direction.
30
+ * Default is 24px to meet WCAG 2.2 target size requirements for touch accessibility.
31
+ */
32
+ this.gutterSize = 24;
33
+ //#endregion
34
+ /****************************************************************************/
35
+ //#region STATE
36
+ this.isDragging = false;
37
+ this.dragIndex = -1;
38
+ this.startPos = 0;
39
+ this.startSizes = [];
40
+ // Handlers stored to be able to detach them
41
+ this.onDocMove = (ev) => this.handleMouseMove(ev);
42
+ this.onDocUp = () => this.stopDragging();
43
+ }
44
+ //#endregion
45
+ /****************************************************************************/
46
+ //#region WATCHERS
47
+ onSizesChanged() {
48
+ // Re-apply sizes if modified from the outside
49
+ this.applySizes();
50
+ }
51
+ onDirectionChanged() {
52
+ // Update the orientation and the cursors of the gutters
53
+ this.ensureGutters();
54
+ this.applySizes();
55
+ }
56
+ //#endregion
57
+ /****************************************************************************/
58
+ //#region LIFECYCLE
59
+ componentDidLoad() {
60
+ // Initialization (once)
61
+ this.ensureGutters();
62
+ this.applySizes();
63
+ this.positionGutters();
64
+ // Observer: reposition gutters when resized (nested or parent split changes)
65
+ this.ro = new ResizeObserver(() => this.positionGutters());
66
+ this.ro.observe(this.el);
67
+ window.addEventListener('resize', () => this.positionGutters());
68
+ }
69
+ disconnectedCallback() {
70
+ var _a;
71
+ // Security cleanup (in case a drag was in progress)
72
+ this.detachDocumentListeners();
73
+ (_a = this.ro) === null || _a === void 0 ? void 0 : _a.disconnect();
74
+ this.ro = undefined;
75
+ }
76
+ //#endregion
77
+ /****************************************************************************/
78
+ //#region PUBLIC METHODS
79
+ /**
80
+ * Programmatically set pane sizes.
81
+ * @param {Array<number>} sizes Array of pane sizes in percentages.
82
+ * @returns {Promise<void>}
83
+ */
84
+ async setSizes(sizes) {
85
+ this.sizes = [...sizes];
86
+ this.applySizes();
87
+ this.sizesChanged.emit([...this.sizes]);
88
+ this.positionGutters();
89
+ }
90
+ /**
91
+ * Returns the current pane sizes.
92
+ * @returns {Promise<number[]>} Array of pane sizes in percentages.
93
+ */
94
+ async getSizes() {
95
+ return [...this.sizes];
96
+ }
97
+ /**
98
+ * Collapse a specific pane to 0 size.
99
+ * @param {number} index Index of the pane to collapse.
100
+ * @returns {Promise<void>}
101
+ */
102
+ async collapse(index) {
103
+ const panes = this.getPanes();
104
+ if (index < 0 || index >= panes.length)
105
+ return;
106
+ // Simple strategy: 0% for the index, the rest (100%) for its nearest neighbor
107
+ const next = new Array(panes.length).fill(0);
108
+ const target = index < panes.length - 1 ? index + 1 : index - 1;
109
+ if (target >= 0)
110
+ next[target] = 100;
111
+ this.sizes = next;
112
+ this.applySizes();
113
+ this.sizesChanged.emit([...this.sizes]);
114
+ this.positionGutters();
115
+ }
116
+ /**
117
+ * Destroy the split instance: removes gutters and resets layout state.
118
+ * @returns {Promise<void>}
119
+ */
120
+ async destroy() {
121
+ var _a;
122
+ this.sizes = [];
123
+ this.isDragging = false;
124
+ this.dragIndex = -1;
125
+ this.removeOwnGutters();
126
+ this.detachDocumentListeners();
127
+ (_a = this.ro) === null || _a === void 0 ? void 0 : _a.disconnect();
128
+ }
129
+ //#endregion
130
+ /****************************************************************************/
131
+ //#region INTERNAL HELPERS
132
+ /**
133
+ * Returns the panes of the split.
134
+ * @returns {HTMLElement[]} The panes of the split.
135
+ */
136
+ getPanes() {
137
+ // Only the direct children slot="pane"
138
+ return Array.from(this.el.querySelectorAll(':scope > [slot="pane"]'));
139
+ }
140
+ /**
141
+ * Returns the own gutters of the split.
142
+ * @returns {HTMLElement[]} The own gutters of the split.
143
+ */
144
+ getOwnGutters() {
145
+ // Only the direct gutters of THIS instance
146
+ return Array.from(this.el.querySelectorAll(':scope > .nv-split-gutter[data-auto="true"]'));
147
+ }
148
+ /**
149
+ * Removes the own gutters of the split.
150
+ */
151
+ removeOwnGutters() {
152
+ this.getOwnGutters().forEach(g => g.remove());
153
+ }
154
+ /**
155
+ * Ensures the gutters of the split.
156
+ */
157
+ ensureGutters() {
158
+ const panes = this.getPanes();
159
+ // 1) Clean ONLY the old direct gutters of THIS instance
160
+ this.removeOwnGutters();
161
+ if (panes.length <= 1)
162
+ return;
163
+ // 2) Add the gutters (directs) between the panes
164
+ panes.forEach((pane, i) => {
165
+ if (i >= panes.length - 1)
166
+ return;
167
+ const g = document.createElement('div');
168
+ g.className = 'nv-split-gutter';
169
+ g.setAttribute('data-auto', 'true');
170
+ if (this.direction === 'horizontal') {
171
+ g.style.width = `${this.gutterSize}px`;
172
+ g.style.cursor = 'col-resize';
173
+ }
174
+ else {
175
+ g.style.height = `${this.gutterSize}px`;
176
+ g.style.cursor = 'row-resize';
177
+ }
178
+ // Customizable internal slot
179
+ const slotEl = document.createElement('slot');
180
+ slotEl.name = 'gutter';
181
+ g.appendChild(slotEl);
182
+ // Listener drag (index = gutter between pane i and i+1)
183
+ g.addEventListener('mousedown', (ev) => this.startDragging(ev, i));
184
+ // Insert just after the pane
185
+ pane.insertAdjacentElement('afterend', g);
186
+ });
187
+ this.positionGutters();
188
+ }
189
+ /**
190
+ * Applies the sizes to the panes.
191
+ */
192
+ applySizes() {
193
+ const panes = this.getPanes();
194
+ const n = panes.length;
195
+ if (n === 0)
196
+ return;
197
+ // Default values if inconsistent
198
+ if (!this.sizes || this.sizes.length !== n) {
199
+ this.sizes = Array(n).fill(100 / n);
200
+ }
201
+ panes.forEach((pane, i) => {
202
+ var _a;
203
+ const size = Math.max(0, (_a = this.sizes[i]) !== null && _a !== void 0 ? _a : 100 / n);
204
+ // Flex-basis via flex shorthand (https://developer.mozilla.org/en-US/docs/Web/CSS/flex)
205
+ pane.style.flex = `0 0 ${size}%`;
206
+ pane.style.minWidth = '0';
207
+ pane.style.minHeight = '0';
208
+ pane.style.overflow = 'hidden'; // let a nv-split child extend
209
+ pane.style.display = 'flex';
210
+ pane.style.flexDirection = 'column';
211
+ });
212
+ this.positionGutters();
213
+ }
214
+ /**
215
+ * Attaches the document listeners.
216
+ */
217
+ attachDocumentListeners() {
218
+ document.addEventListener('mousemove', this.onDocMove);
219
+ document.addEventListener('mouseup', this.onDocUp);
220
+ }
221
+ /**
222
+ * Detaches the document listeners.
223
+ */
224
+ detachDocumentListeners() {
225
+ document.removeEventListener('mousemove', this.onDocMove);
226
+ document.removeEventListener('mouseup', this.onDocUp);
227
+ }
228
+ /**
229
+ * Positions the gutters based on the current sizes of the panes.
230
+ */
231
+ positionGutters() {
232
+ var _a, _b;
233
+ const panes = this.getPanes();
234
+ const gutters = this.getOwnGutters();
235
+ if (panes.length <= 1 || gutters.length === 0)
236
+ return;
237
+ const horizontal = this.direction === 'horizontal';
238
+ let cumPct = 0;
239
+ for (let i = 0; i < gutters.length; i++) {
240
+ const sizePct = (_b = (_a = this.sizes) === null || _a === void 0 ? void 0 : _a[i]) !== null && _b !== void 0 ? _b : 100 / panes.length;
241
+ cumPct += sizePct;
242
+ const g = gutters[i];
243
+ g.style.position = 'absolute';
244
+ if (horizontal) {
245
+ g.style.left = `${cumPct}%`;
246
+ g.style.top = '0';
247
+ g.style.bottom = '0';
248
+ g.style.height = '100%';
249
+ }
250
+ else {
251
+ g.style.top = `${cumPct}%`;
252
+ g.style.left = '0';
253
+ g.style.right = '0';
254
+ g.style.width = '100%';
255
+ }
256
+ }
257
+ }
258
+ /**
259
+ * Starts the dragging process.
260
+ * @param {MouseEvent} ev - The mouse event.
261
+ * @param {number} index - The index of the gutter.
262
+ */
263
+ startDragging(ev, index) {
264
+ this.isDragging = true;
265
+ this.dragIndex = index;
266
+ this.startPos = this.direction === 'horizontal' ? ev.clientX : ev.clientY;
267
+ this.startSizes = [...this.sizes];
268
+ this.attachDocumentListeners();
269
+ }
270
+ /**
271
+ * Handles the mouse movement during dragging.
272
+ * @param {MouseEvent} ev - The mouse event.
273
+ */
274
+ handleMouseMove(ev) {
275
+ var _a, _b, _c, _d;
276
+ if (!this.isDragging || this.dragIndex < 0)
277
+ return;
278
+ const panes = this.getPanes();
279
+ if (panes.length < 2)
280
+ return;
281
+ const rect = this.el.getBoundingClientRect();
282
+ // Ensure we never divide by zero if the element has zero width/height
283
+ const rawSize = this.direction === 'horizontal' ? rect.width : rect.height;
284
+ const totalPx = Math.max(rawSize, 1);
285
+ const deltaPx = (this.direction === 'horizontal' ? ev.clientX : ev.clientY) -
286
+ this.startPos;
287
+ const deltaPct = (deltaPx / totalPx) * 100;
288
+ const i = this.dragIndex;
289
+ const j = i + 1;
290
+ let left = this.startSizes[i] + deltaPct;
291
+ let right = this.startSizes[j] - deltaPct;
292
+ // minSizes (px) -> %
293
+ const minLeftPct = (((_b = (_a = this.minSizes) === null || _a === void 0 ? void 0 : _a[i]) !== null && _b !== void 0 ? _b : 0) / totalPx) * 100;
294
+ const minRightPct = (((_d = (_c = this.minSizes) === null || _c === void 0 ? void 0 : _c[j]) !== null && _d !== void 0 ? _d : 0) / totalPx) * 100;
295
+ left = Math.max(left, minLeftPct);
296
+ right = Math.max(right, minRightPct);
297
+ // Keep the sum of the pair i/j constant
298
+ const pairSum = left + right;
299
+ const targetSum = this.startSizes[i] + this.startSizes[j];
300
+ if (Math.abs(pairSum - targetSum) > 0.0001) {
301
+ const k = targetSum / (pairSum || 1);
302
+ left *= k;
303
+ right *= k;
304
+ }
305
+ const next = [...this.startSizes];
306
+ next[i] = left;
307
+ next[j] = right;
308
+ this.sizes = next;
309
+ this.applySizes();
310
+ this.sizesChanged.emit([...this.sizes]);
311
+ this.positionGutters();
312
+ }
313
+ /**
314
+ * Stops the dragging process.
315
+ */
316
+ stopDragging() {
317
+ if (!this.isDragging)
318
+ return;
319
+ this.isDragging = false;
320
+ this.dragIndex = -1;
321
+ this.detachDocumentListeners();
322
+ }
323
+ //#endregion
324
+ /****************************************************************************/
325
+ //#region RENDER
326
+ render() {
327
+ return (index.h(index.Host, { key: 'e3b158ff1b4f665862079d245c219102d8b8ccda', "data-dragging": this.isDragging.toString() }, index.h("slot", { key: 'baa8105a05bf8446d7a31a23cd5276edb320ea2f', name: "pane" }), index.h("slot", { key: '44afe4f4a220aff45f802218f2618e9305141a9f', name: "gutter" })));
328
+ }
329
+ get el() { return index.getElement(this); }
330
+ static get watchers() { return {
331
+ "sizes": ["onSizesChanged"],
332
+ "direction": ["onDirectionChanged"]
333
+ }; }
334
+ };
335
+ NvSplit.style = NvSplitStyle0;
336
+
337
+ exports.nv_split = NvSplit;
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var index = require('./index-BK1_MpRZ.js');
3
+ var index = require('./index-B0fvq6nd.js');
4
4
  var clsx297c1ffe = require('./clsx-297c1ffe-BtxeOLZW.js');
5
5
  require('react');
6
6
  require('react-dom');
@@ -23,7 +23,7 @@ const NvStack = class {
23
23
  /****************************************************************************/
24
24
  //#region RENDER
25
25
  render() {
26
- return (index.h(index.Host, { key: '8f771805224c769b5a87f5c550ddbcb8f888d002', class: clsx297c1ffe.clsx(this.fill && 'nv-stack-fill', this.flex && 'nv-stack-flex', this.full && 'w-full', this.gutter && !this.vertical && `gap-x-${this.gutter}`, this.gutter && this.vertical && `gap-y-${this.gutter}`, this.vertical && 'nv-stack-vertical') }, index.h("slot", { key: '6fcd46cfd74415d2f07c762b065e3aa0f0194764' })));
26
+ return (index.h(index.Host, { key: '5922efd8652a14d73e812e85dd6770101e22fe46', class: clsx297c1ffe.clsx(this.fill && 'nv-stack-fill', this.flex && 'nv-stack-flex', this.full && 'w-full', this.gutter && !this.vertical && `gap-x-${this.gutter}`, this.gutter && this.vertical && `gap-y-${this.gutter}`, this.vertical && 'nv-stack-vertical') }, index.h("slot", { key: '71daf4ee34bd57d785203f98799b6ea7c66ffa3b' })));
27
27
  }
28
28
  };
29
29
  NvStack.style = NvStackStyle0;
@@ -0,0 +1,245 @@
1
+ 'use strict';
2
+
3
+ var index = require('./index-B0fvq6nd.js');
4
+ require('react');
5
+ require('react-dom');
6
+
7
+ /**
8
+ * Table utility functions and constants for nv-table component
9
+ *
10
+ * This module contains pure utility functions for table column resizing logic,
11
+ * pointer event handling calculations, and related helper functions.
12
+ */
13
+ /**
14
+ * Constants for table column resizing behavior
15
+ */
16
+ const TABLE_CONSTANTS = Object.freeze({
17
+ /** Handle width for fine pointers (mouse) in pixels */
18
+ HANDLE_W: 12,
19
+ /** Handle width for coarse pointers (touch) in pixels */
20
+ HANDLE_W_TOUCH: 24,
21
+ /** Minimum column width in pixels */
22
+ MIN_W: 40,
23
+ });
24
+ /**
25
+ * Determines the appropriate handle width based on the current pointer type
26
+ * @returns {number} Handle width in pixels (10px for fine pointers, 24px for coarse/touch)
27
+ */
28
+ function getHandleWidthForCurrentPointer() {
29
+ // Match the CSS media query: wider handle on coarse pointers (touch)
30
+ return matchMedia('(pointer: coarse)').matches
31
+ ? TABLE_CONSTANTS.HANDLE_W_TOUCH
32
+ : TABLE_CONSTANTS.HANDLE_W;
33
+ }
34
+ /**
35
+ * Calculates the pointer's horizontal offset within a table cell
36
+ * @param {PointerEvent} event - The pointer event
37
+ * @param {HTMLTableCellElement} cell - The table cell element
38
+ * @returns {number} The horizontal offset from the left edge of the cell
39
+ */
40
+ function getPointerOffsetInCell(event, cell) {
41
+ const rect = cell.getBoundingClientRect();
42
+ return event.clientX - rect.left;
43
+ }
44
+ /**
45
+ * Determines if the pointer is within the resize handle area of a table cell
46
+ * @param {number} offsetX - Horizontal offset within the cell
47
+ * @param {number} cellWidth - Total width of the cell
48
+ * @param {number} handleWidth - Width of the resize handle area
49
+ * @returns {boolean} True if the pointer is in the resize handle area
50
+ */
51
+ function isInResizeHandle(offsetX, cellWidth, handleWidth) {
52
+ return offsetX >= cellWidth - handleWidth;
53
+ }
54
+ /**
55
+ * Calculates the new column width based on resize delta and constraints
56
+ * @param {number} startWidth - Original width of the column
57
+ * @param {number} delta - Change in pixels from the start position
58
+ * @param {number} minWidth - Minimum allowed width for the column
59
+ * @returns {number} The calculated new width, constrained by minimum
60
+ */
61
+ function calculateNewWidth(startWidth, delta, minWidth = TABLE_CONSTANTS.MIN_W) {
62
+ return Math.max(minWidth, startWidth + delta);
63
+ }
64
+ /**
65
+ * Validates that a table cell element is suitable for resizing
66
+ * @param {HTMLElement | null} element - The element to check
67
+ * @returns {element is HTMLTableCellElement} Type guard for table cell elements
68
+ */
69
+ function isValidTableCell(element) {
70
+ return (element === null || element === void 0 ? void 0 : element.tagName) === 'TH' || (element === null || element === void 0 ? void 0 : element.tagName) === 'TD';
71
+ }
72
+ /**
73
+ * Finds the closest table cell element from an event target
74
+ * @param {EventTarget | null} target - The event target
75
+ * @returns {HTMLTableCellElement | null} The closest table cell or null
76
+ */
77
+ function getClosestTableCell(target) {
78
+ if (!(target instanceof HTMLElement))
79
+ return null;
80
+ const cell = target.closest('th, td');
81
+ return isValidTableCell(cell) ? cell : null;
82
+ }
83
+ /**
84
+ * Sets up pointer capture for consistent drag behavior across browsers
85
+ * @param {HTMLTableCellElement} cell - The table cell element
86
+ * @param {number} pointerId - The pointer ID from the pointer event
87
+ * @returns {boolean} True if capture was successfully set
88
+ */
89
+ function setPointerCapture(cell, pointerId) {
90
+ var _a;
91
+ try {
92
+ (_a = cell.setPointerCapture) === null || _a === void 0 ? void 0 : _a.call(cell, pointerId);
93
+ return true;
94
+ }
95
+ catch (_b) {
96
+ return false;
97
+ }
98
+ }
99
+ /**
100
+ * Releases pointer capture
101
+ * @param {HTMLTableCellElement} cell - The table cell element
102
+ * @param {number} pointerId - The pointer ID from the pointer event
103
+ * @returns {boolean} True if release was successful
104
+ */
105
+ function releasePointerCapture(cell, pointerId) {
106
+ var _a;
107
+ try {
108
+ (_a = cell.releasePointerCapture) === null || _a === void 0 ? void 0 : _a.call(cell, pointerId);
109
+ return true;
110
+ }
111
+ catch (_b) {
112
+ return false;
113
+ }
114
+ }
115
+ /**
116
+ * Prevents text selection during drag operations
117
+ * @param {boolean} prevent - Whether to prevent selection
118
+ */
119
+ function setUserSelectPrevention(prevent) {
120
+ document.body.style.userSelect = prevent ? 'none' : '';
121
+ }
122
+ /**
123
+ * Gets the current width of a table cell element
124
+ * @param {HTMLTableCellElement} cell - The table cell element
125
+ * @returns {number} The current width in pixels
126
+ */
127
+ function getCellWidth(cell) {
128
+ return cell.offsetWidth;
129
+ }
130
+ /**
131
+ * Applies a width to a table cell element
132
+ * @param {HTMLTableCellElement} cell - The table cell element
133
+ * @param {number} width - The width to apply in pixels
134
+ */
135
+ function setCellWidth(cell, width) {
136
+ cell.style.width = `${width}px`;
137
+ }
138
+ /**
139
+ * Calculates the delta (change) in horizontal position between two pointer events
140
+ * @param {number} currentX - Current clientX position
141
+ * @param {number} startX - Starting clientX position
142
+ * @returns {number} The horizontal delta
143
+ */
144
+ function calculatePointerDelta(currentX, startX) {
145
+ return currentX - startX;
146
+ }
147
+ /**
148
+ * Creates a new resize state object
149
+ * @param {HTMLTableCellElement} cell - The cell being resized
150
+ * @param {PointerEvent} event - The initiating pointer event
151
+ * @returns {ResizeState} A new resize state object
152
+ */
153
+ function createResizeState(cell, event) {
154
+ return {
155
+ resizingCell: cell,
156
+ pointerId: event.pointerId,
157
+ startX: event.clientX,
158
+ startWidth: getCellWidth(cell),
159
+ };
160
+ }
161
+ /**
162
+ * Validates that a resize state is active and matches the given pointer event
163
+ * @param {ResizeState | null} state - The current resize state
164
+ * @param {PointerEvent} event - The pointer event to validate against
165
+ * @returns {boolean} True if the state is valid for this event
166
+ */
167
+ function isValidResizeState(state, event) {
168
+ return state !== null && state.pointerId === event.pointerId;
169
+ }
170
+ /**
171
+ * Updates the width of a cell during a resize operation
172
+ * @param {ResizeState} state - The current resize state
173
+ * @param {PointerEvent} event - The current pointer event
174
+ * @param {number} minWidth - Minimum width constraint
175
+ */
176
+ function updateCellWidthFromResize(state, event, minWidth = TABLE_CONSTANTS.MIN_W) {
177
+ const delta = calculatePointerDelta(event.clientX, state.startX);
178
+ const newWidth = calculateNewWidth(state.startWidth, delta, minWidth);
179
+ setCellWidth(state.resizingCell, newWidth);
180
+ }
181
+
182
+ const nvTableCss = "nv-table table{border-collapse:separate;border-spacing:0;table-layout:fixed;width:max-content;min-width:100%;background:var(--color-level-00-background)}nv-table table thead{background:var(--components-datagrid-header-background)}nv-table table tbody tr:hover td{background:var(--components-datagrid-body-background-hover)}nv-table table tbody tr[data-selected]{background:var(--components-datagrid-body-background-active)}nv-table table td{height:var(--spacing-16);padding:var(--datagrid-cell-body-padding-y) var(--datagrid-cell-body-padding-x) var(--spacing-2) var(--datagrid-cell-body-padding-x);font-size:var(--font-size-md);font-style:normal;font-weight:var(--font-weight-low-emphasis);line-height:var(--line-height-base);background:var(--components-datagrid-body-background-default);border-bottom:1px solid var(--components-datagrid-body-border)}nv-table table th{position:relative;text-align:left;padding:var(--datagrid-cell-header-padding-y) var(--datagrid-cell-header-padding-right) var(--datagrid-cell-header-padding-y) var(--datagrid-cell-header-padding-x);padding-right:calc(var(--datagrid-cell-header-padding-right) + 12px);color:var(--color-content-low-text);font-variant-numeric:lining-nums tabular-nums slashed-zero;font-size:var(--font-size-md);font-style:normal;font-weight:var(--font-weight-high-emphasis);line-height:var(--line-height-base);min-width:40px;border-bottom:1px solid var(--components-datagrid-header-border);background:var(--components-datagrid-header-background)}nv-table table th::after{content:\"\";position:absolute;top:0;right:0;width:12px;height:50%;transform:translateY(50%);cursor:col-resize;background:linear-gradient(90deg, transparent 0%, transparent calc(50% - 1px), var(--components-datagrid-header-border), calc(50% - 1px), var(--components-datagrid-header-border) calc(50% + 1px), transparent calc(50% + 1px), transparent 100%);opacity:0;transition:opacity 0.05s ease-in-out}nv-table table th[data-grow]{width:unset}nv-table table th:hover::after{opacity:1}nv-table table th[data-no-resize]::after{display:none}nv-table [data-sticky-left]{position:sticky;z-index:1;background:var(--color-level-00-background);left:0;top:0}nv-table [data-sticky-right]{position:sticky;z-index:1;background:var(--color-level-00-background);right:0;top:0}nv-table [data-sticky-top] th{position:sticky;z-index:1;background:var(--color-level-00-background);top:0}";
183
+ const NvTableStyle0 = nvTableCss;
184
+
185
+ const NvTable = class {
186
+ constructor(hostRef) {
187
+ index.registerInstance(this, hostRef);
188
+ this.resizeState = null;
189
+ }
190
+ /****************************************************************************/
191
+ //#region PROPERTIES
192
+ //#endregion PROPERTIES
193
+ /****************************************************************************/
194
+ //#region METHODS
195
+ //#endregion METHODS
196
+ /****************************************************************************/
197
+ //#region LISTENERS
198
+ onPointerDown(ev) {
199
+ const th = getClosestTableCell(ev.target);
200
+ if (!th)
201
+ return;
202
+ // Skip resize if the cell has data-no-resize attribute
203
+ if (th.hasAttribute('data-no-resize'))
204
+ return;
205
+ const offsetX = getPointerOffsetInCell(ev, th);
206
+ const handleWidth = getHandleWidthForCurrentPointer();
207
+ const cellWidth = getCellWidth(th);
208
+ // Start only if we're in the resize handle area
209
+ if (!isInResizeHandle(offsetX, cellWidth, handleWidth))
210
+ return;
211
+ this.resizeState = createResizeState(th, ev);
212
+ // Capture so move/up still fire even if the finger leaves the th
213
+ setPointerCapture(th, ev.pointerId);
214
+ // Prevent scrolling/selection during drag
215
+ setUserSelectPrevention(true);
216
+ }
217
+ onPointerMove(ev) {
218
+ if (!isValidResizeState(this.resizeState, ev))
219
+ return;
220
+ updateCellWidthFromResize(this.resizeState, ev, TABLE_CONSTANTS.MIN_W);
221
+ }
222
+ onPointerUp(ev) {
223
+ if (!isValidResizeState(this.resizeState, ev))
224
+ return;
225
+ releasePointerCapture(this.resizeState.resizingCell, this.resizeState.pointerId);
226
+ this.resizeState = null;
227
+ setUserSelectPrevention(false);
228
+ }
229
+ //#endregion LISTENERS
230
+ /****************************************************************************/
231
+ //#region LIFECYCLE
232
+ //#endregion LIFECYCLE
233
+ /****************************************************************************/
234
+ //#region EVENTS
235
+ //#endregion EVENTS
236
+ /****************************************************************************/
237
+ //#region RENDER
238
+ render() {
239
+ return (index.h(index.Host, { key: '16b564cc29e8987d8b3fda3a84c0b19882a733bd' }, index.h("slot", { key: '1305cbc6d29caa60df55bfa01a39a3417a27ec01' })));
240
+ }
241
+ get host() { return index.getElement(this); }
242
+ };
243
+ NvTable.style = NvTableStyle0;
244
+
245
+ exports.nv_table = NvTable;
@@ -1,12 +1,12 @@
1
1
  'use strict';
2
2
 
3
- var index = require('./index-BK1_MpRZ.js');
3
+ var index = require('./index-B0fvq6nd.js');
4
4
  var clsx297c1ffe = require('./clsx-297c1ffe-BtxeOLZW.js');
5
5
  var v4A79185f4 = require('./v4-a79185f4-2n0dOd_Y.js');
6
6
  require('react');
7
7
  require('react-dom');
8
8
 
9
- const nvToggleCss = "nv-toggle{display:inline-flex;align-items:flex-start;gap:var(--form-gap-x);position:relative}nv-toggle:not([disabled],[readonly]) input,nv-toggle:not([disabled],[readonly]) label{cursor:pointer}nv-toggle.label-placement-before{flex-direction:row-reverse}nv-toggle[disabled]{opacity:0.5}nv-toggle label{align-self:stretch;color:var(--components-form-text-label-default);font-family:\"TT Norms Pro\", sans-serif;font-size:var(--form-label-font-size);font-style:normal;font-weight:500;line-height:var(--form-label-line-height)}nv-toggle label.visually-hidden{position:absolute;padding:0;border:0;overflow:hidden;white-space:nowrap;width:1px;height:1px;margin:-1px;clip:rect(0, 0, 0, 0)}nv-toggle .input-container{position:relative;color:var(--components-form-shape-foreground-default)}nv-toggle .input-container:has(input[type=checkbox]:disabled:not([readonly])){color:var(--components-form-shape-foreground-disabled)}nv-toggle .input-container input[type=checkbox]{appearance:none;position:relative;display:flex;width:var(--form-toggle-width);height:var(--form-toggle-height);flex-direction:column;align-items:flex-start;border-radius:var(--form-toggle-radius);border-width:var(--form-toggle-border-width);border-style:solid;border-color:var(--components-toggle-border-default);background:var(--components-toggle-background-default)}nv-toggle .input-container input[type=checkbox]::after{content:\"\";display:block;width:var(--form-toggle-switch-dot-default);height:var(--form-toggle-switch-dot-default);background-color:var(--components-toggle-shape-default);border-radius:var(--radius-rounded-full);position:absolute;top:50%;left:25%;transform:translate(-50%, -50%)}nv-toggle .input-container input[type=checkbox]:hover{border-color:var(--components-toggle-border-hover)}nv-toggle .input-container input[type=checkbox]:hover::after{background-color:var(--components-toggle-shape-hover)}nv-toggle .input-container input[type=checkbox]:focus{border-color:var(--components-toggle-border-default)}nv-toggle .input-container input[type=checkbox]:focus::after{background-color:var(--components-toggle-shape-default)}nv-toggle .input-container input[type=checkbox]:focus,nv-toggle .input-container input[type=checkbox]:focus-within{outline:none}nv-toggle .input-container input[type=checkbox]:focus-visible,nv-toggle .input-container input[type=checkbox]:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-toggle .input-container input[type=checkbox]:checked{background:var(--components-toggle-background-default-checked);border-color:var(--components-toggle-border-default-checked)}nv-toggle .input-container input[type=checkbox]:checked::after{content:\"\";display:block;width:var(--form-toggle-switch-dot-default);height:var(--form-toggle-switch-dot-default);background-color:var(--components-toggle-shape-default-checked);border-radius:var(--radius-rounded-full);position:absolute;top:50%;left:75%;transform:translate(-50%, -50%)}nv-toggle .input-container input[type=checkbox]:checked:focus{background:var(--components-toggle-background-default-checked);border-color:var(--components-toggle-border-default-checked)}nv-toggle .input-container input[type=checkbox]:disabled:not([readonly]){box-shadow:unset;background:var(--components-toggle-background-disabled);border-color:var(--components-toggle-border-default)}nv-toggle .input-container input[type=checkbox]:disabled:not([readonly]):checked{background:var(--components-toggle-background-disabled-checked);border-color:var(--components-toggle-border-disabled-checked)}nv-toggle .input-container input[type=checkbox]:disabled:not([readonly]):checked::after{background-color:var(--components-toggle-shape-disabled-checked)}nv-toggle .description{align-self:stretch;color:var(--components-form-text-description-default);font-family:\"TT Norms Pro\", sans-serif;font-size:var(--form-description-font-size);font-style:normal;font-weight:450;line-height:var(--form-description-line-height)}nv-toggle .text-container{display:flex;flex-direction:column;align-items:flex-start;flex:1 0 0}";
9
+ const nvToggleCss = "nv-toggle{display:inline-flex;align-items:flex-start;gap:var(--form-gap-x);position:relative}nv-toggle:not([disabled],[readonly]) input,nv-toggle:not([disabled],[readonly]) label{cursor:pointer}nv-toggle.label-placement-before{flex-direction:row-reverse}nv-toggle[disabled]{opacity:0.5}nv-toggle label{align-self:stretch;color:var(--components-form-text-label-default);font-family:var(--font-family-default), var(--font-family-fallback), sans-serif;font-size:var(--form-label-font-size);font-style:normal;font-weight:var(--font-weight-medium-emphasis);line-height:var(--form-label-line-height)}nv-toggle label.visually-hidden{position:absolute;padding:0;border:0;overflow:hidden;white-space:nowrap;width:1px;height:1px;margin:-1px;clip:rect(0, 0, 0, 0)}nv-toggle .input-container{position:relative;color:var(--components-form-shape-foreground-default)}nv-toggle .input-container:has(input[type=checkbox]:disabled:not([readonly])){color:var(--components-form-shape-foreground-disabled)}nv-toggle .input-container input[type=checkbox]{appearance:none;position:relative;display:flex;width:var(--form-toggle-width);height:var(--form-toggle-height);flex-direction:column;align-items:flex-start;border-radius:var(--form-toggle-radius);border-width:var(--form-toggle-border-width);border-style:solid;border-color:var(--components-toggle-border-default);background:var(--components-toggle-background-default)}nv-toggle .input-container input[type=checkbox]::after{content:\"\";display:block;width:var(--form-toggle-switch-dot-default);height:var(--form-toggle-switch-dot-default);background-color:var(--components-toggle-shape-default);border-radius:var(--radius-rounded-full);position:absolute;top:50%;left:25%;transform:translate(-50%, -50%)}nv-toggle .input-container input[type=checkbox]:hover{border-color:var(--components-toggle-border-hover)}nv-toggle .input-container input[type=checkbox]:hover::after{background-color:var(--components-toggle-shape-hover)}nv-toggle .input-container input[type=checkbox]:focus{border-color:var(--components-toggle-border-default)}nv-toggle .input-container input[type=checkbox]:focus::after{background-color:var(--components-toggle-shape-default)}nv-toggle .input-container input[type=checkbox]:focus,nv-toggle .input-container input[type=checkbox]:focus-within{outline:none}nv-toggle .input-container input[type=checkbox]:focus-visible,nv-toggle .input-container input[type=checkbox]:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-toggle .input-container input[type=checkbox]:checked{background:var(--components-toggle-background-default-checked);border-color:var(--components-toggle-border-default-checked)}nv-toggle .input-container input[type=checkbox]:checked::after{content:\"\";display:block;width:var(--form-toggle-switch-dot-default);height:var(--form-toggle-switch-dot-default);background-color:var(--components-toggle-shape-default-checked);border-radius:var(--radius-rounded-full);position:absolute;top:50%;left:75%;transform:translate(-50%, -50%)}nv-toggle .input-container input[type=checkbox]:checked:focus{background:var(--components-toggle-background-default-checked);border-color:var(--components-toggle-border-default-checked)}nv-toggle .input-container input[type=checkbox]:disabled:not([readonly]){box-shadow:unset;background:var(--components-toggle-background-disabled);border-color:var(--components-toggle-border-default)}nv-toggle .input-container input[type=checkbox]:disabled:not([readonly]):checked{background:var(--components-toggle-background-disabled-checked);border-color:var(--components-toggle-border-disabled-checked)}nv-toggle .input-container input[type=checkbox]:disabled:not([readonly]):checked::after{background-color:var(--components-toggle-shape-disabled-checked)}nv-toggle .description{align-self:stretch;color:var(--components-form-text-description-default);font-family:var(--font-family-default), var(--font-family-fallback), sans-serif;font-size:var(--form-description-font-size);font-style:normal;font-weight:450;line-height:var(--form-description-line-height)}nv-toggle .text-container{display:flex;flex-direction:column;align-items:flex-start;flex:1 0 0}";
10
10
  const NvToggleStyle0 = nvToggleCss;
11
11
 
12
12
  const NvToggle = class {
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var index = require('./index-BK1_MpRZ.js');
3
+ var index = require('./index-B0fvq6nd.js');
4
4
  require('react');
5
5
  require('react-dom');
6
6
 
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var index = require('./index-BK1_MpRZ.js');
3
+ var index = require('./index-B0fvq6nd.js');
4
4
  require('react');
5
5
  require('react-dom');
6
6
 
@@ -156,7 +156,7 @@ const NvTogglebuttongroup = class {
156
156
  /****************************************************************************/
157
157
  //#region RENDER
158
158
  render() {
159
- return (index.h(index.Host, { key: 'edb5b3bb7651b482cd02625038e36cdb35743453' }, index.h("slot", { key: '2b0bc4891b885ecf7febdce7062fc02b120ec939' })));
159
+ return (index.h(index.Host, { key: '7aad0160ae8e093765ba42649293e27d7b93ab75' }, index.h("slot", { key: '39364122a5e65b1a454bd782a5daacc7edfee8b0' })));
160
160
  }
161
161
  get el() { return index.getElement(this); }
162
162
  static get watchers() { return {
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var index = require('./index-BK1_MpRZ.js');
3
+ var index = require('./index-B0fvq6nd.js');
4
4
  require('react');
5
5
  require('react-dom');
6
6