twico-ui 1.44.0 → 1.45.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.
package/dist/index.cjs CHANGED
@@ -1,7 +1,7 @@
1
1
  "use client";
2
2
  'use strict';
3
3
 
4
- var React54 = require('react');
4
+ var React55 = require('react');
5
5
  var jsxRuntime = require('react/jsx-runtime');
6
6
  var reactDom = require('react-dom');
7
7
 
@@ -23,14 +23,14 @@ function _interopNamespace(e) {
23
23
  return Object.freeze(n);
24
24
  }
25
25
 
26
- var React54__namespace = /*#__PURE__*/_interopNamespace(React54);
26
+ var React55__namespace = /*#__PURE__*/_interopNamespace(React55);
27
27
 
28
28
  // components/TwicoProvider.jsx
29
- var SUPPORTS_STYLE_HOIST = parseInt(String(React54__namespace.version), 10) >= 19;
30
- var NonceContext = React54__namespace.createContext(void 0);
29
+ var SUPPORTS_STYLE_HOIST = parseInt(String(React55__namespace.version), 10) >= 19;
30
+ var NonceContext = React55__namespace.createContext(void 0);
31
31
  function useScopedStyles(id, css) {
32
- const nonce = React54__namespace.useContext(NonceContext);
33
- React54__namespace.useInsertionEffect(() => {
32
+ const nonce = React55__namespace.useContext(NonceContext);
33
+ React55__namespace.useInsertionEffect(() => {
34
34
  if (SUPPORTS_STYLE_HOIST) return;
35
35
  if (typeof document === "undefined") return;
36
36
  if (!css) return;
@@ -46,12 +46,12 @@ function useScopedStyles(id, css) {
46
46
  }
47
47
  if (el.textContent !== css) el.textContent = css;
48
48
  }, [id, css, nonce]);
49
- return SUPPORTS_STYLE_HOIST && css ? React54__namespace.createElement("style", { href: id, precedence: "twc-ui" }, css) : null;
49
+ return SUPPORTS_STYLE_HOIST && css ? React55__namespace.createElement("style", { href: id, precedence: "twc-ui" }, css) : null;
50
50
  }
51
51
 
52
52
  // components/TwicoProvider.jsx
53
53
  function TwicoProvider({ nonce, children }) {
54
- return React54__namespace.default.createElement(NonceContext.Provider, { value: nonce }, children);
54
+ return React55__namespace.default.createElement(NonceContext.Provider, { value: nonce }, children);
55
55
  }
56
56
  var GROUPS = { colors: "color", space: "space", radius: "radius", font: "font", shadow: "shadow", motion: "" };
57
57
  function createTheme(partial = {}) {
@@ -71,8 +71,8 @@ function toVars(theme) {
71
71
  return Object.keys(theme).some((k) => k.startsWith("--")) ? theme : createTheme(theme);
72
72
  }
73
73
  function ThemeProvider({ theme, mode = "inline", className = "", style, children, ...rest }) {
74
- const vars = React54__namespace.default.useMemo(() => toVars(theme), [theme]);
75
- const uid = React54__namespace.default.useId();
74
+ const vars = React55__namespace.default.useMemo(() => toVars(theme), [theme]);
75
+ const uid = React55__namespace.default.useId();
76
76
  const scopeId = `twc-theme-${uid.replace(/[^a-zA-Z0-9]/g, "")}`;
77
77
  const css = mode === "stylesheet" ? `[data-twc-theme="${scopeId}"] { ${Object.entries(vars).map(([k, v]) => `${k}: ${v};`).join(" ")} }` : "";
78
78
  const __twcStyles = useScopedStyles(mode === "stylesheet" ? scopeId : "twc-theme-noop", css);
@@ -94,7 +94,7 @@ var FORM_CSS = `
94
94
  .twc-form { display: flex; flex-direction: column; gap: var(--space-4); font-family: var(--font-sans); }
95
95
  .twc-form__fieldset { border: 0; margin: 0; padding: 0; min-width: 0; display: flex; flex-direction: column; gap: inherit; }
96
96
  `;
97
- var Form = React54__namespace.default.forwardRef(function Form2({
97
+ var Form = /* @__PURE__ */ React55__namespace.default.forwardRef(function Form2({
98
98
  onSubmit,
99
99
  preventDefault = true,
100
100
  loading = false,
@@ -125,18 +125,16 @@ var Form = React54__namespace.default.forwardRef(function Form2({
125
125
  }
126
126
  );
127
127
  });
128
- Form.displayName = "Form";
129
128
  var VH_CSS = `
130
129
  .twc-visually-hidden { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0; }
131
130
  `;
132
- var VisuallyHidden = React54__namespace.default.forwardRef(function VisuallyHidden2({ as: Tag2 = "span", className = "", children, ...rest }, ref) {
131
+ var VisuallyHidden = /* @__PURE__ */ React55__namespace.default.forwardRef(function VisuallyHidden2({ as: Tag2 = "span", className = "", children, ...rest }, ref) {
133
132
  const __twcStyles = useScopedStyles("twc-visually-hidden-styles", VH_CSS);
134
133
  return /* @__PURE__ */ jsxRuntime.jsxs(Tag2, { ref, className: `twc-visually-hidden ${className}`.trim(), ...rest, children: [
135
134
  __twcStyles,
136
135
  children
137
136
  ] });
138
137
  });
139
- VisuallyHidden.displayName = "VisuallyHidden";
140
138
 
141
139
  // components/_warn.js
142
140
  var seen = /* @__PURE__ */ new Set();
@@ -149,7 +147,7 @@ function warnOnce(key, message) {
149
147
 
150
148
  // components/_overlay.js
151
149
  var canUseDOM = typeof window !== "undefined" && typeof document !== "undefined";
152
- var useIsoLayoutEffect = canUseDOM ? React54__namespace.default.useLayoutEffect : React54__namespace.default.useEffect;
150
+ var useIsoLayoutEffect = canUseDOM ? React55__namespace.default.useLayoutEffect : React55__namespace.default.useEffect;
153
151
  var FOCUSABLE = 'a[href]:not([tabindex="-1"]), button:not([disabled]):not([tabindex="-1"]), textarea:not([disabled]):not([tabindex="-1"]), input:not([disabled]):not([tabindex="-1"]), select:not([disabled]):not([tabindex="-1"]), [tabindex]:not([tabindex="-1"])';
154
152
  var CONTROL_TAGS = "|button|input|select|textarea|";
155
153
  var ROLE_OK = "|button|link|menuitem|menuitemcheckbox|menuitemradio|combobox|tab|treeitem|checkbox|switch|option|";
@@ -163,7 +161,7 @@ function triggerIsControl(el) {
163
161
  }
164
162
  var NATIVE_CONTROL = "button,a[href],summary,input,select,textarea";
165
163
  function useTriggerAudit(ref, name) {
166
- React54__namespace.default.useEffect(() => {
164
+ React55__namespace.default.useEffect(() => {
167
165
  const el = ref.current && ref.current.firstElementChild;
168
166
  if (!el) return;
169
167
  if (el.classList.contains("twc-tooltip-wrap")) {
@@ -178,7 +176,7 @@ function useTriggerAudit(ref, name) {
178
176
  }, []);
179
177
  }
180
178
  function useFocusTrap(ref, active = true, { restoreFocus = true, initialFocus } = {}) {
181
- React54__namespace.default.useEffect(() => {
179
+ React55__namespace.default.useEffect(() => {
182
180
  if (!active || !canUseDOM) return void 0;
183
181
  const node = ref.current;
184
182
  if (!node) return void 0;
@@ -189,7 +187,7 @@ function useFocusTrap(ref, active = true, { restoreFocus = true, initialFocus }
189
187
  if (restoreFocus && prevFocused && typeof prevFocused.focus === "function") prevFocused.focus();
190
188
  };
191
189
  }, [active]);
192
- React54__namespace.default.useEffect(() => {
190
+ React55__namespace.default.useEffect(() => {
193
191
  if (!active || !canUseDOM) return void 0;
194
192
  const node = ref.current;
195
193
  const onKey = (e) => {
@@ -216,7 +214,7 @@ function useFocusTrap(ref, active = true, { restoreFocus = true, initialFocus }
216
214
  }, [active]);
217
215
  }
218
216
  function usePortal() {
219
- return React54__namespace.default.useCallback((node) => {
217
+ return React55__namespace.default.useCallback((node) => {
220
218
  if (typeof document === "undefined") return null;
221
219
  return typeof reactDom.createPortal === "function" ? reactDom.createPortal(node, document.body) : node;
222
220
  }, []);
@@ -246,8 +244,8 @@ function useScrollLock(locked = true) {
246
244
  var __layerSeq = 0;
247
245
  var __openLayers = /* @__PURE__ */ new Set();
248
246
  function useLayer(active) {
249
- const depth = React54__namespace.default.useRef(0);
250
- React54__namespace.default.useEffect(() => {
247
+ const depth = React55__namespace.default.useRef(0);
248
+ React55__namespace.default.useEffect(() => {
251
249
  if (!active) return void 0;
252
250
  const d = ++__layerSeq;
253
251
  depth.current = d;
@@ -256,10 +254,10 @@ function useLayer(active) {
256
254
  __openLayers.delete(d);
257
255
  };
258
256
  }, [active]);
259
- return React54__namespace.default.useCallback(() => __openLayers.size === 0 || depth.current === Math.max(...__openLayers), []);
257
+ return React55__namespace.default.useCallback(() => __openLayers.size === 0 || depth.current === Math.max(...__openLayers), []);
260
258
  }
261
259
  function useInertBackground(ref, active) {
262
- React54__namespace.default.useEffect(() => {
260
+ React55__namespace.default.useEffect(() => {
263
261
  if (!active || !canUseDOM) return void 0;
264
262
  const node = ref.current;
265
263
  if (!node) return void 0;
@@ -294,7 +292,7 @@ function getColorSchemeScript({ storageKey = "twico-theme", attribute = "class",
294
292
  return `(function(){try{var k=${k},a=${a},d=${d},t=localStorage.getItem(k);if(t!=='light'){if(t!=='dark'){t=d?d:(window.matchMedia('(prefers-color-scheme: dark)').matches?'dark':'light');}}if(a==='class'){document.documentElement.classList.toggle('dark',t==='dark');}else{document.documentElement.setAttribute(a,t);}}catch(e){}})();`;
295
293
  }
296
294
  function ColorSchemeScript({ storageKey = "twico-theme", attribute = "class", nonce, defaultScheme }) {
297
- return React54__namespace.default.createElement("script", { nonce }, getColorSchemeScript({ storageKey, attribute, defaultScheme }));
295
+ return React55__namespace.default.createElement("script", { nonce }, getColorSchemeScript({ storageKey, attribute, defaultScheme }));
298
296
  }
299
297
  var KBD_CSS = `
300
298
  .twc-kbd { display: inline-flex; align-items: center; justify-content: center; min-width: 20px; padding: 2px 6px;
@@ -302,14 +300,13 @@ var KBD_CSS = `
302
300
  background: var(--color-surface-sunken); border: var(--border-thin) solid var(--color-border);
303
301
  border-bottom-width: 2px; border-radius: var(--radius-sm); }
304
302
  `;
305
- var Kbd = React54__namespace.default.forwardRef(function Kbd2({ className = "", children, ...rest }, ref) {
303
+ var Kbd = /* @__PURE__ */ React55__namespace.default.forwardRef(function Kbd2({ className = "", children, ...rest }, ref) {
306
304
  const __twcStyles = useScopedStyles("twc-kbd-styles", KBD_CSS);
307
305
  return /* @__PURE__ */ jsxRuntime.jsxs("kbd", { ref, className: `twc-kbd ${className}`.trim(), ...rest, children: [
308
306
  __twcStyles,
309
307
  children
310
308
  ] });
311
309
  });
312
- Kbd.displayName = "Kbd";
313
310
  var PRE_CSS = `
314
311
  .twc-pre { margin: 0; padding: var(--space-4); overflow-x: auto; max-width: 100%;
315
312
  font-family: var(--font-mono); font-size: var(--text-sm); line-height: var(--leading-normal);
@@ -317,14 +314,13 @@ var PRE_CSS = `
317
314
  border: var(--border-thin) solid var(--color-border); border-radius: var(--radius-lg);
318
315
  white-space: pre; -webkit-overflow-scrolling: touch; }
319
316
  `;
320
- var Pre = React54__namespace.default.forwardRef(function Pre2({ className = "", children, ...rest }, ref) {
317
+ var Pre = /* @__PURE__ */ React55__namespace.default.forwardRef(function Pre2({ className = "", children, ...rest }, ref) {
321
318
  const __twcStyles = useScopedStyles("twc-pre-styles", PRE_CSS);
322
319
  return /* @__PURE__ */ jsxRuntime.jsxs("pre", { ref, className: `twc-pre ${className}`.trim(), ...rest, children: [
323
320
  __twcStyles,
324
321
  children
325
322
  ] });
326
323
  });
327
- Pre.displayName = "Pre";
328
324
  var ANCHOR_CSS = `
329
325
  .twc-anchor { color: var(--color-primary-subtle-fg); text-decoration: none; border-radius: var(--radius-sm);
330
326
  transition: color var(--duration-fast) var(--ease-standard); }
@@ -337,7 +333,7 @@ function safeHref(url) {
337
333
  const s = String(url).replace(/[\x00-\x20]+/g, "").toLowerCase();
338
334
  return s.startsWith("javascript:") || s.startsWith("data:") || s.startsWith("vbscript:") ? void 0 : url;
339
335
  }
340
- var Anchor = React54__namespace.default.forwardRef(function Anchor2({ as: Tag2 = "a", href, external = false, className = "", children, ...rest }, ref) {
336
+ var Anchor = /* @__PURE__ */ React55__namespace.default.forwardRef(function Anchor2({ as: Tag2 = "a", href, external = false, className = "", children, ...rest }, ref) {
341
337
  const __twcStyles = useScopedStyles("twc-anchor-styles", ANCHOR_CSS);
342
338
  const extra = external ? { target: "_blank", rel: "noopener noreferrer" } : {};
343
339
  return /* @__PURE__ */ jsxRuntime.jsxs(Tag2, { ref, className: `twc-anchor ${className}`.trim(), href: Tag2 === "a" ? safeHref(href) : href, ...extra, ...rest, children: [
@@ -346,14 +342,13 @@ var Anchor = React54__namespace.default.forwardRef(function Anchor2({ as: Tag2 =
346
342
  external ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "twc-anchor__ext", "aria-hidden": "true", children: "\u2197" }) : null
347
343
  ] });
348
344
  });
349
- Anchor.displayName = "Anchor";
350
345
  var LABEL_CSS = `
351
346
  .twc-label { font-size: var(--text-sm); font-weight: var(--font-semibold); color: var(--color-text); display: inline-flex; gap: 4px; align-items: center; }
352
347
  .twc-label[data-size="sm"] { font-size: var(--text-xs); }
353
348
  .twc-label[data-size="lg"] { font-size: var(--text-base); }
354
349
  .twc-label__req { color: var(--color-danger); }
355
350
  `;
356
- var Label = React54__namespace.default.forwardRef(function Label2({ htmlFor, required = false, size = "md", className = "", children, ...rest }, ref) {
351
+ var Label = /* @__PURE__ */ React55__namespace.default.forwardRef(function Label2({ htmlFor, required = false, size = "md", className = "", children, ...rest }, ref) {
357
352
  const __twcStyles = useScopedStyles("twc-label-styles", LABEL_CSS);
358
353
  return /* @__PURE__ */ jsxRuntime.jsxs("label", { ref, htmlFor, className: `twc-label ${className}`.trim(), "data-size": size, ...rest, children: [
359
354
  __twcStyles,
@@ -361,12 +356,11 @@ var Label = React54__namespace.default.forwardRef(function Label2({ htmlFor, req
361
356
  required ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "twc-label__req", "aria-hidden": "true", children: "*" }) : null
362
357
  ] });
363
358
  });
364
- Label.displayName = "Label";
365
359
  var IMAGE_CSS = `
366
360
  .twc-image { display: block; max-width: 100%; }
367
361
  .twc-image[data-fit] { width: 100%; height: 100%; }
368
362
  `;
369
- var Image = React54__namespace.default.forwardRef(function Image2({
363
+ var Image = /* @__PURE__ */ React55__namespace.default.forwardRef(function Image2({
370
364
  src,
371
365
  alt,
372
366
  fit,
@@ -382,7 +376,7 @@ var Image = React54__namespace.default.forwardRef(function Image2({
382
376
  ...rest
383
377
  }, ref) {
384
378
  const __twcStyles = useScopedStyles("twc-image-styles", IMAGE_CSS);
385
- const [failed, setFailed] = React54__namespace.default.useState(false);
379
+ const [failed, setFailed] = React55__namespace.default.useState(false);
386
380
  const shownSrc = failed && fallback ? fallback : src;
387
381
  const s = {
388
382
  objectFit: fit,
@@ -421,7 +415,6 @@ var Image = React54__namespace.default.forwardRef(function Image2({
421
415
  )
422
416
  ] });
423
417
  });
424
- Image.displayName = "Image";
425
418
  var ICONBTN_CSS = `
426
419
  .twc-iconbtn {
427
420
  --_sz: var(--control-h-md);
@@ -491,7 +484,7 @@ function safeHref2(url) {
491
484
  const s = String(url).replace(/[\x00-\x20]+/g, "").toLowerCase();
492
485
  return s.startsWith("javascript:") || s.startsWith("data:") || s.startsWith("vbscript:") ? void 0 : url;
493
486
  }
494
- function IconButton({
487
+ var IconButton = /* @__PURE__ */ React55__namespace.default.forwardRef(function IconButton2({
495
488
  children,
496
489
  icon,
497
490
  variant = "ghost",
@@ -508,7 +501,7 @@ function IconButton({
508
501
  "aria-label": ariaLabel,
509
502
  onClick,
510
503
  ...rest
511
- }) {
504
+ }, ref) {
512
505
  const __twcStyles = useScopedStyles("twc-iconbtn-styles", ICONBTN_CSS);
513
506
  const Tag2 = as;
514
507
  const inert = Tag2 === "a" && disabled;
@@ -516,6 +509,7 @@ function IconButton({
516
509
  return /* @__PURE__ */ jsxRuntime.jsxs(
517
510
  Tag2,
518
511
  {
512
+ ref,
519
513
  className: `twc-iconbtn ${className}`,
520
514
  "data-variant": variant,
521
515
  "data-tone": tone,
@@ -537,7 +531,7 @@ function IconButton({
537
531
  ]
538
532
  }
539
533
  );
540
- }
534
+ });
541
535
 
542
536
  // components/_compose.js
543
537
  function compose(theirs, ours) {
@@ -613,14 +607,14 @@ function Tooltip({
613
607
  }) {
614
608
  const __twcStyles = useScopedStyles("twc-tooltip-styles", TOOLTIP_CSS);
615
609
  const anchored = anchor !== void 0;
616
- const id = React54__namespace.default.useId();
617
- const [showU, setShowU] = React54__namespace.default.useState(false);
610
+ const id = React55__namespace.default.useId();
611
+ const [showU, setShowU] = React55__namespace.default.useState(false);
618
612
  const show = anchored ? !!openProp : showU;
619
- const [coords, setCoords] = React54__namespace.default.useState(null);
620
- const timer = React54__namespace.default.useRef(null);
621
- const closeTimer = React54__namespace.default.useRef(null);
622
- const wrapRef = React54__namespace.default.useRef(null);
623
- const tipRef = React54__namespace.default.useRef(null);
613
+ const [coords, setCoords] = React55__namespace.default.useState(null);
614
+ const timer = React55__namespace.default.useRef(null);
615
+ const closeTimer = React55__namespace.default.useRef(null);
616
+ const wrapRef = React55__namespace.default.useRef(null);
617
+ const tipRef = React55__namespace.default.useRef(null);
624
618
  const open = () => {
625
619
  clearTimeout(closeTimer.current);
626
620
  clearTimeout(timer.current);
@@ -631,11 +625,11 @@ function Tooltip({
631
625
  clearTimeout(closeTimer.current);
632
626
  closeTimer.current = setTimeout(() => setShowU(false), 120);
633
627
  };
634
- React54__namespace.default.useEffect(() => () => {
628
+ React55__namespace.default.useEffect(() => () => {
635
629
  clearTimeout(timer.current);
636
630
  clearTimeout(closeTimer.current);
637
631
  }, []);
638
- const place = React54__namespace.default.useCallback(() => {
632
+ const place = React55__namespace.default.useCallback(() => {
639
633
  const el = anchored ? anchor : wrapRef.current;
640
634
  if (!el || !el.getBoundingClientRect) return;
641
635
  const r2 = el.getBoundingClientRect();
@@ -670,10 +664,10 @@ function Tooltip({
670
664
  setCoords({ ...base, left: c, bottom: Math.round(vh - r2.top + gap), arrowX: arrowX(c) });
671
665
  }
672
666
  }, [placement, anchored, anchor]);
673
- React54__namespace.default.useEffect(() => {
667
+ React55__namespace.default.useEffect(() => {
674
668
  place();
675
669
  }, [place]);
676
- React54__namespace.default.useEffect(() => {
670
+ React55__namespace.default.useEffect(() => {
677
671
  if (!show) return void 0;
678
672
  place();
679
673
  const onMove = () => place();
@@ -684,7 +678,7 @@ function Tooltip({
684
678
  window.removeEventListener("resize", onMove);
685
679
  };
686
680
  }, [show, place]);
687
- React54__namespace.default.useEffect(() => {
681
+ React55__namespace.default.useEffect(() => {
688
682
  if (!show || anchored) return;
689
683
  const onKeyDown = (e) => {
690
684
  if (e.key === "Escape") {
@@ -728,7 +722,7 @@ function Tooltip({
728
722
  bubble
729
723
  ] });
730
724
  const describedBy = show ? id : void 0;
731
- const trigger = React54__namespace.default.isValidElement(children) && children.type !== React54__namespace.default.Fragment ? React54__namespace.default.cloneElement(children, {
725
+ const trigger = React55__namespace.default.isValidElement(children) && children.type !== React55__namespace.default.Fragment ? React55__namespace.default.cloneElement(children, {
732
726
  "aria-describedby": [children.props["aria-describedby"], describedBy].filter(Boolean).join(" ") || void 0
733
727
  }) : /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-describedby": describedBy, children });
734
728
  return /* @__PURE__ */ jsxRuntime.jsxs(
@@ -777,7 +771,7 @@ var IcoReset = /* @__PURE__ */ jsxRuntime.jsxs("svg", { viewBox: "0 0 24 24", fi
777
771
  /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M3 12a9 9 0 1 0 9-9 9 9 0 0 0-6.3 2.6L3 8" }),
778
772
  /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M3 3v5h5" })
779
773
  ] });
780
- var ImageViewer = /* @__PURE__ */ React54__namespace.default.forwardRef(function ImageViewer2({
774
+ var ImageViewer = /* @__PURE__ */ React55__namespace.default.forwardRef(function ImageViewer2({
781
775
  src,
782
776
  alt,
783
777
  minZoom = 1,
@@ -796,16 +790,16 @@ var ImageViewer = /* @__PURE__ */ React54__namespace.default.forwardRef(function
796
790
  ...rest
797
791
  }, ref) {
798
792
  const __twcStyles = useScopedStyles("twc-imageviewer-styles", IV_CSS);
799
- const stageRef = React54__namespace.default.useRef(null);
800
- const natRef = React54__namespace.default.useRef({ w: 0, h: 0 });
801
- const [internalZoom, setInternalZoom] = React54__namespace.default.useState(clamp(defaultZoom, minZoom, maxZoom));
793
+ const stageRef = React55__namespace.default.useRef(null);
794
+ const natRef = React55__namespace.default.useRef({ w: 0, h: 0 });
795
+ const [internalZoom, setInternalZoom] = React55__namespace.default.useState(clamp(defaultZoom, minZoom, maxZoom));
802
796
  const zoomControlled = zoomProp !== void 0;
803
797
  const zoom = clamp(zoomControlled ? zoomProp : internalZoom, minZoom, maxZoom);
804
- const [offset, setOffset] = React54__namespace.default.useState({ x: 0, y: 0 });
805
- const [dragging, setDragging] = React54__namespace.default.useState(false);
806
- const zoomRef = React54__namespace.default.useRef(zoom);
798
+ const [offset, setOffset] = React55__namespace.default.useState({ x: 0, y: 0 });
799
+ const [dragging, setDragging] = React55__namespace.default.useState(false);
800
+ const zoomRef = React55__namespace.default.useRef(zoom);
807
801
  zoomRef.current = zoom;
808
- const offsetRef = React54__namespace.default.useRef(offset);
802
+ const offsetRef = React55__namespace.default.useRef(offset);
809
803
  offsetRef.current = offset;
810
804
  const applyZoom = (next) => {
811
805
  const z = clamp(next, minZoom, maxZoom);
@@ -855,12 +849,12 @@ var ImageViewer = /* @__PURE__ */ React54__namespace.default.forwardRef(function
855
849
  if (r2) zoomAt(r2.left + r2.width / 2, r2.top + r2.height / 2, next);
856
850
  else if (applyZoom(next) <= minZoom) setOffset({ x: 0, y: 0 });
857
851
  };
858
- const mountedRef = React54__namespace.default.useRef(false);
859
- React54__namespace.default.useEffect(() => {
852
+ const mountedRef = React55__namespace.default.useRef(false);
853
+ React55__namespace.default.useEffect(() => {
860
854
  if (mountedRef.current) reset();
861
855
  else mountedRef.current = true;
862
856
  }, [src]);
863
- React54__namespace.default.useEffect(() => {
857
+ React55__namespace.default.useEffect(() => {
864
858
  const stage = stageRef.current;
865
859
  if (!stage) return void 0;
866
860
  const onWheel = (e) => {
@@ -871,9 +865,9 @@ var ImageViewer = /* @__PURE__ */ React54__namespace.default.forwardRef(function
871
865
  stage.addEventListener("wheel", onWheel, { passive: false });
872
866
  return () => stage.removeEventListener("wheel", onWheel);
873
867
  }, [step, minZoom, maxZoom, fit]);
874
- const pointers = React54__namespace.default.useRef(/* @__PURE__ */ new Map());
875
- const pinchRef = React54__namespace.default.useRef(null);
876
- const panRef = React54__namespace.default.useRef(null);
868
+ const pointers = React55__namespace.default.useRef(/* @__PURE__ */ new Map());
869
+ const pinchRef = React55__namespace.default.useRef(null);
870
+ const panRef = React55__namespace.default.useRef(null);
877
871
  const onPointerDown = (e) => {
878
872
  pointers.current.set(e.pointerId, { x: e.clientX, y: e.clientY });
879
873
  e.currentTarget.setPointerCapture?.(e.pointerId);
@@ -925,13 +919,13 @@ var ImageViewer = /* @__PURE__ */ React54__namespace.default.forwardRef(function
925
919
  };
926
920
  const canZoomIn = zoom < maxZoom, canZoomOut = zoom > minZoom;
927
921
  const api = { zoom, zoomIn: () => zoomFromCenter(zoom + step), zoomOut: () => zoomFromCenter(zoom - step), reset, canZoomIn, canZoomOut };
928
- React54__namespace.default.useImperativeHandle(ref, () => api);
929
- const onStateChangeRef = React54__namespace.default.useRef(onStateChange);
922
+ React55__namespace.default.useImperativeHandle(ref, () => api);
923
+ const onStateChangeRef = React55__namespace.default.useRef(onStateChange);
930
924
  onStateChangeRef.current = onStateChange;
931
- React54__namespace.default.useEffect(() => {
925
+ React55__namespace.default.useEffect(() => {
932
926
  onStateChangeRef.current?.({ zoom, canZoomIn, canZoomOut });
933
927
  }, [zoom, canZoomIn, canZoomOut]);
934
- React54__namespace.default.useEffect(() => {
928
+ React55__namespace.default.useEffect(() => {
935
929
  setOffset((o) => clampOffset(o, zoomRef.current));
936
930
  }, [fit]);
937
931
  const defaultControls = /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "twc-iv__controls", children: [
@@ -1025,11 +1019,11 @@ function Accordion({
1025
1019
  ...rest
1026
1020
  }) {
1027
1021
  const __twcStyles = useScopedStyles("twc-accordion-styles", ACCORDION_CSS);
1028
- const rootRef = React54__namespace.default.useRef(null);
1029
- const [internal, setInternal] = React54__namespace.default.useState(() => new Set(defaultOpen));
1022
+ const rootRef = React55__namespace.default.useRef(null);
1023
+ const [internal, setInternal] = React55__namespace.default.useState(() => new Set(defaultOpen));
1030
1024
  const open = openProp !== void 0 ? new Set(openProp) : internal;
1031
- const baseId = React54__namespace.default.useId();
1032
- const [ever, setEver] = React54__namespace.default.useState(() => new Set(open));
1025
+ const baseId = React55__namespace.default.useId();
1026
+ const [ever, setEver] = React55__namespace.default.useState(() => new Set(open));
1033
1027
  const defer = mountOnOpen || unmountOnClose;
1034
1028
  let mounted = ever;
1035
1029
  if (defer) {
@@ -1041,7 +1035,7 @@ function Accordion({
1041
1035
  }
1042
1036
  }
1043
1037
  const openKey = defer ? JSON.stringify([...open].sort()) : "";
1044
- React54__namespace.default.useEffect(() => {
1038
+ React55__namespace.default.useEffect(() => {
1045
1039
  if (!unmountOnClose) return void 0;
1046
1040
  const drop = [...ever].filter((v) => !open.has(v));
1047
1041
  if (!drop.length) return void 0;
@@ -1246,7 +1240,7 @@ function Avatar({
1246
1240
  ...rest
1247
1241
  }) {
1248
1242
  const __twcStyles = useScopedStyles("twc-avatar-styles", AVATAR_CSS);
1249
- const [errored, setErrored] = React54__namespace.default.useState(false);
1243
+ const [errored, setErrored] = React55__namespace.default.useState(false);
1250
1244
  const cleanSrc = safeSrc(src);
1251
1245
  const showImg = cleanSrc && !errored;
1252
1246
  const _statusLabel = status ? statusLabel ?? statusLabels?.[status] ?? STATUS_LABELS[status] : void 0;
@@ -1328,28 +1322,28 @@ function Menu({
1328
1322
  ...rest
1329
1323
  }) {
1330
1324
  const __twcStyles = useScopedStyles("twc-menu-styles", MENU_CSS);
1331
- const _tp = React54__namespace.default.isValidElement(trigger) ? trigger.props : {};
1325
+ const _tp = React55__namespace.default.isValidElement(trigger) ? trigger.props : {};
1332
1326
  const triggerDisabled = _tp.disabled === true || _tp["aria-disabled"] === true || _tp["aria-disabled"] === "true";
1333
- const [openState, setOpenState] = React54__namespace.default.useState(defaultOpen);
1334
- const [render, setRender] = React54__namespace.default.useState(false);
1335
- const [pos, setPos] = React54__namespace.default.useState(null);
1336
- const [active, setActive] = React54__namespace.default.useState(-1);
1337
- const wrapRef = React54__namespace.default.useRef(null);
1327
+ const [openState, setOpenState] = React55__namespace.default.useState(defaultOpen);
1328
+ const [render, setRender] = React55__namespace.default.useState(false);
1329
+ const [pos, setPos] = React55__namespace.default.useState(null);
1330
+ const [active, setActive] = React55__namespace.default.useState(-1);
1331
+ const wrapRef = React55__namespace.default.useRef(null);
1338
1332
  useTriggerAudit(wrapRef, "Menu");
1339
- const menuRef = React54__namespace.default.useRef(null);
1340
- const typeBufRef = React54__namespace.default.useRef("");
1341
- const typeTimerRef = React54__namespace.default.useRef(null);
1342
- const menuId = React54__namespace.default.useId();
1333
+ const menuRef = React55__namespace.default.useRef(null);
1334
+ const typeBufRef = React55__namespace.default.useRef("");
1335
+ const typeTimerRef = React55__namespace.default.useRef(null);
1336
+ const menuId = React55__namespace.default.useId();
1343
1337
  const headerId = `${menuId}-header`;
1344
1338
  const controlled = openProp !== void 0;
1345
1339
  const open = controlled ? !!openProp : openState;
1346
- const openRef = React54__namespace.default.useRef(open);
1340
+ const openRef = React55__namespace.default.useRef(open);
1347
1341
  openRef.current = open;
1348
- const controlledRef = React54__namespace.default.useRef(controlled);
1342
+ const controlledRef = React55__namespace.default.useRef(controlled);
1349
1343
  controlledRef.current = controlled;
1350
- const onOpenChangeRef = React54__namespace.default.useRef(onOpenChange);
1344
+ const onOpenChangeRef = React55__namespace.default.useRef(onOpenChange);
1351
1345
  onOpenChangeRef.current = onOpenChange;
1352
- const setOpen = React54__namespace.default.useCallback((next) => {
1346
+ const setOpen = React55__namespace.default.useCallback((next) => {
1353
1347
  const value = typeof next === "function" ? next(openRef.current) : next;
1354
1348
  if (value === openRef.current) return;
1355
1349
  if (!controlledRef.current) setOpenState(value);
@@ -1357,7 +1351,7 @@ function Menu({
1357
1351
  }, []);
1358
1352
  const RD = { createPortal: typeof reactDom.createPortal === "function" ? reactDom.createPortal : typeof window !== "undefined" && window.ReactDOM && window.ReactDOM.createPortal };
1359
1353
  const interactiveIdx = items.map((it, i) => !it.separator && !it.heading ? i : -1).filter((i) => i >= 0);
1360
- const place = React54__namespace.default.useCallback(() => {
1354
+ const place = React55__namespace.default.useCallback(() => {
1361
1355
  const t = wrapRef.current;
1362
1356
  if (!t) return;
1363
1357
  const r2 = t.getBoundingClientRect();
@@ -1373,7 +1367,7 @@ function Menu({
1373
1367
  setPos({ top, bottom, left, width: w, flip, maxHeight: Math.max(120, avail) });
1374
1368
  }, [align, width]);
1375
1369
  const isTop = useLayer(open && render);
1376
- React54__namespace.default.useEffect(() => {
1370
+ React55__namespace.default.useEffect(() => {
1377
1371
  if (!open) return;
1378
1372
  place();
1379
1373
  const onMove = () => place();
@@ -1392,18 +1386,18 @@ function Menu({
1392
1386
  document.removeEventListener("mousedown", onDown);
1393
1387
  };
1394
1388
  }, [open, place, isTop]);
1395
- const kbdRef = React54__namespace.default.useRef(false);
1396
- React54__namespace.default.useEffect(() => {
1389
+ const kbdRef = React55__namespace.default.useRef(false);
1390
+ React55__namespace.default.useEffect(() => {
1397
1391
  if (!open || !render || active < 0 || !kbdRef.current) return;
1398
1392
  kbdRef.current = false;
1399
1393
  const el = document.getElementById(`${menuId}-item-${active}`);
1400
1394
  if (el) el.focus();
1401
1395
  }, [open, render, active, menuId]);
1402
- const focusTrigger = React54__namespace.default.useCallback(() => {
1396
+ const focusTrigger = React55__namespace.default.useCallback(() => {
1403
1397
  const t = wrapRef.current && wrapRef.current.querySelector('button, a[href], [role="button"], [tabindex]');
1404
1398
  if (t) t.focus();
1405
1399
  }, []);
1406
- React54__namespace.default.useEffect(() => {
1400
+ React55__namespace.default.useEffect(() => {
1407
1401
  if (open) return;
1408
1402
  kbdRef.current = false;
1409
1403
  setActive(-1);
@@ -1411,7 +1405,7 @@ function Menu({
1411
1405
  if (!m || typeof document === "undefined" || !m.contains(document.activeElement)) return;
1412
1406
  focusTrigger();
1413
1407
  }, [open, focusTrigger]);
1414
- React54__namespace.default.useEffect(() => {
1408
+ React55__namespace.default.useEffect(() => {
1415
1409
  if (open) {
1416
1410
  setRender(true);
1417
1411
  return;
@@ -1544,8 +1538,8 @@ function Menu({
1544
1538
  ]
1545
1539
  }
1546
1540
  ) : null;
1547
- const fix = React54__namespace.default.isValidElement(trigger) && !triggerIsControl(trigger) ? { role: "button" } : null;
1548
- const triggerEl = React54__namespace.default.isValidElement(trigger) ? React54__namespace.default.cloneElement(trigger, {
1541
+ const fix = React55__namespace.default.isValidElement(trigger) && !triggerIsControl(trigger) ? { role: "button" } : null;
1542
+ const triggerEl = React55__namespace.default.isValidElement(trigger) ? React55__namespace.default.cloneElement(trigger, {
1549
1543
  onClick: (e) => {
1550
1544
  trigger.props.onClick?.(e);
1551
1545
  toggle();
@@ -1736,7 +1730,7 @@ function Breadcrumb({
1736
1730
  ...rest
1737
1731
  }) {
1738
1732
  const __twcStyles = useScopedStyles("twc-breadcrumb-styles", BREADCRUMB_CSS);
1739
- const [expanded, setExpanded] = React54__namespace.default.useState(false);
1733
+ const [expanded, setExpanded] = React55__namespace.default.useState(false);
1740
1734
  const sep = separator || /* @__PURE__ */ jsxRuntime.jsx(ChevronSep, {});
1741
1735
  let display = items;
1742
1736
  if (maxItems > 0 && items.length > maxItems && !expanded) {
@@ -1749,7 +1743,7 @@ function Breadcrumb({
1749
1743
  __twcStyles,
1750
1744
  display.map((it, i) => {
1751
1745
  const last = i === display.length - 1;
1752
- return /* @__PURE__ */ jsxRuntime.jsxs(React54__namespace.default.Fragment, { children: [
1746
+ return /* @__PURE__ */ jsxRuntime.jsxs(React55__namespace.default.Fragment, { children: [
1753
1747
  it.ellipsis ? /* @__PURE__ */ jsxRuntime.jsx("button", { className: "twc-breadcrumb__ellipsis", "aria-label": "Show more", onClick: () => setExpanded(true), children: "\u2026" }) : last ? /* @__PURE__ */ jsxRuntime.jsxs(
1754
1748
  "span",
1755
1749
  {
@@ -1898,7 +1892,7 @@ function safeHref5(url) {
1898
1892
  const s = String(url).replace(/[\x00-\x20]+/g, "").toLowerCase();
1899
1893
  return s.startsWith("javascript:") || s.startsWith("data:") || s.startsWith("vbscript:") ? void 0 : url;
1900
1894
  }
1901
- function Button({
1895
+ var Button = /* @__PURE__ */ React55__namespace.default.forwardRef(function Button2({
1902
1896
  children,
1903
1897
  variant = "solid",
1904
1898
  tone = "primary",
@@ -1916,9 +1910,9 @@ function Button({
1916
1910
  className = "",
1917
1911
  onClick,
1918
1912
  ...rest
1919
- }) {
1913
+ }, ref) {
1920
1914
  const __twcStyles = useScopedStyles("twc-btn-styles", CSS2);
1921
- const [ripples, setRipples] = React54__namespace.default.useState([]);
1915
+ const [ripples, setRipples] = React55__namespace.default.useState([]);
1922
1916
  const Tag2 = as;
1923
1917
  const inert = Tag2 === "a" && (disabled || loading);
1924
1918
  const softDisabled = disabled && focusableWhenDisabled && !loading && Tag2 === "button";
@@ -1940,6 +1934,7 @@ function Button({
1940
1934
  return /* @__PURE__ */ jsxRuntime.jsxs(
1941
1935
  Tag2,
1942
1936
  {
1937
+ ref,
1943
1938
  className: `twc-btn ${className}`,
1944
1939
  "data-variant": variant,
1945
1940
  "data-tone": tone,
@@ -1975,7 +1970,7 @@ function Button({
1975
1970
  ]
1976
1971
  }
1977
1972
  );
1978
- }
1973
+ });
1979
1974
  var UNITLESS = /* @__PURE__ */ new Set([
1980
1975
  "animationIterationCount",
1981
1976
  "aspectRatio",
@@ -2148,9 +2143,9 @@ function buildSx(sx, uid) {
2148
2143
  return { flatStyle, css };
2149
2144
  }
2150
2145
  function useSx(sx) {
2151
- const rawId = React54__namespace.default.useId();
2146
+ const rawId = React55__namespace.default.useId();
2152
2147
  const uid = `sx${rawId.replace(/[^a-zA-Z0-9]/g, "")}`;
2153
- const { flatStyle, css } = React54__namespace.default.useMemo(() => buildSx(sx, uid), [sx, uid]);
2148
+ const { flatStyle, css } = React55__namespace.default.useMemo(() => buildSx(sx, uid), [sx, uid]);
2154
2149
  const styleNode = useScopedStyles(`twc-sx-${uid}`, css);
2155
2150
  return { flatStyle, styleNode, sxAttr: css ? uid : void 0 };
2156
2151
  }
@@ -2286,14 +2281,14 @@ function Carousel({
2286
2281
  ...rest
2287
2282
  }) {
2288
2283
  const __twcStyles = useScopedStyles("twc-carousel-styles", CAROUSEL_CSS);
2289
- const slides = React54__namespace.default.Children.toArray(children);
2284
+ const slides = React55__namespace.default.Children.toArray(children);
2290
2285
  const count = slides.length;
2291
- const [internal, setInternal] = React54__namespace.default.useState(defaultIndex);
2286
+ const [internal, setInternal] = React55__namespace.default.useState(defaultIndex);
2292
2287
  const index = indexProp !== void 0 ? indexProp : internal;
2293
- const [paused, setPaused] = React54__namespace.default.useState(false);
2294
- const [userPaused, setUserPaused] = React54__namespace.default.useState(false);
2295
- const [prefersReduced, setPrefersReduced] = React54__namespace.default.useState(false);
2296
- React54__namespace.default.useEffect(() => {
2288
+ const [paused, setPaused] = React55__namespace.default.useState(false);
2289
+ const [userPaused, setUserPaused] = React55__namespace.default.useState(false);
2290
+ const [prefersReduced, setPrefersReduced] = React55__namespace.default.useState(false);
2291
+ React55__namespace.default.useEffect(() => {
2297
2292
  if (typeof window === "undefined" || !window.matchMedia) return void 0;
2298
2293
  const mql = window.matchMedia("(prefers-reduced-motion: reduce)");
2299
2294
  const on = () => setPrefersReduced(mql.matches);
@@ -2301,16 +2296,16 @@ function Carousel({
2301
2296
  mql.addEventListener("change", on);
2302
2297
  return () => mql.removeEventListener("change", on);
2303
2298
  }, []);
2304
- const setIndex = React54__namespace.default.useCallback((i) => {
2299
+ const setIndex = React55__namespace.default.useCallback((i) => {
2305
2300
  if (indexProp === void 0) setInternal(i);
2306
2301
  onIndexChange?.(i);
2307
2302
  }, [indexProp, onIndexChange]);
2308
- const go = React54__namespace.default.useCallback((i) => {
2303
+ const go = React55__namespace.default.useCallback((i) => {
2309
2304
  if (count <= 0) return;
2310
2305
  setIndex(loop ? (i % count + count) % count : Math.min(Math.max(i, 0), count - 1));
2311
2306
  }, [count, loop, setIndex]);
2312
2307
  const autoRotating = autoPlay && !paused && !userPaused && !prefersReduced && count > 1;
2313
- React54__namespace.default.useEffect(() => {
2308
+ React55__namespace.default.useEffect(() => {
2314
2309
  if (!autoRotating) return void 0;
2315
2310
  const t = setInterval(() => {
2316
2311
  const next = loop ? (index + 1) % count : index + 1 >= count ? index : index + 1;
@@ -2570,7 +2565,7 @@ var CHART_BASE_CSS = `
2570
2565
  }
2571
2566
  `;
2572
2567
  function ChartTable({ id, caption, columns, rows }) {
2573
- const h = React54__namespace.default.createElement;
2568
+ const h = React55__namespace.default.createElement;
2574
2569
  return h(
2575
2570
  "table",
2576
2571
  { className: "twc-chart__sr", id },
@@ -2600,7 +2595,7 @@ function ChartTable({ id, caption, columns, rows }) {
2600
2595
  );
2601
2596
  }
2602
2597
  function ChartLegend({ items, onToggle, hidden, onFocus, onBlur }) {
2603
- const h = React54__namespace.default.createElement;
2598
+ const h = React55__namespace.default.createElement;
2604
2599
  return h(
2605
2600
  "div",
2606
2601
  { className: "twc-chart__legend" },
@@ -2631,23 +2626,23 @@ function ChartLegend({ items, onToggle, hidden, onFocus, onBlur }) {
2631
2626
  );
2632
2627
  }
2633
2628
  function useChartTooltip() {
2634
- const containerRef = React54__namespace.default.useRef(null);
2635
- const [tip, setTip] = React54__namespace.default.useState(null);
2636
- const show = React54__namespace.default.useCallback((content, e) => {
2629
+ const containerRef = React55__namespace.default.useRef(null);
2630
+ const [tip, setTip] = React55__namespace.default.useState(null);
2631
+ const show = React55__namespace.default.useCallback((content, e) => {
2637
2632
  const el = containerRef.current;
2638
2633
  const rect = el && el.getBoundingClientRect ? el.getBoundingClientRect() : null;
2639
2634
  const left = rect ? e.clientX - rect.left : 0;
2640
2635
  const top = rect ? e.clientY - rect.top : 0;
2641
2636
  setTip({ title: content.title, items: content.items || [], left, top });
2642
2637
  }, []);
2643
- const hide = React54__namespace.default.useCallback(() => setTip(null), []);
2638
+ const hide = React55__namespace.default.useCallback(() => setTip(null), []);
2644
2639
  return { containerRef, tip, show, hide };
2645
2640
  }
2646
2641
  function ChartTooltip({ tip }) {
2647
- const h = React54__namespace.default.createElement;
2648
- const ref = React54__namespace.default.useRef(null);
2649
- const [pos, setPos] = React54__namespace.default.useState({ dx: 0, below: false });
2650
- React54__namespace.default.useLayoutEffect(() => {
2642
+ const h = React55__namespace.default.createElement;
2643
+ const ref = React55__namespace.default.useRef(null);
2644
+ const [pos, setPos] = React55__namespace.default.useState({ dx: 0, below: false });
2645
+ React55__namespace.default.useLayoutEffect(() => {
2651
2646
  const el = ref.current;
2652
2647
  if (!tip || !el) return;
2653
2648
  const parent = el.offsetParent;
@@ -2724,17 +2719,17 @@ function Chart({
2724
2719
  }) {
2725
2720
  const baseStyles = useScopedStyles("twc-chart-base", CHART_BASE_CSS);
2726
2721
  const styles = useScopedStyles("twc-chart-styles", CHART_CSS);
2727
- const uid = React54__namespace.default.useId();
2722
+ const uid = React55__namespace.default.useId();
2728
2723
  const gid = uid.replace(/[^a-zA-Z0-9]/g, "");
2729
2724
  const tableId = tableFallback ? `${uid}-table` : void 0;
2730
2725
  const { containerRef, tip, show, hide } = useChartTooltip();
2731
- const [hidden, setHidden] = React54__namespace.default.useState(() => /* @__PURE__ */ new Set());
2732
- const [focusSeries, setFocusSeries] = React54__namespace.default.useState(null);
2733
- const [selected, setSelected] = React54__namespace.default.useState(null);
2734
- const [hoverIdx, setHoverIdx] = React54__namespace.default.useState(null);
2735
- const [zoom, setZoom] = React54__namespace.default.useState(null);
2736
- const [drag, setDrag] = React54__namespace.default.useState(null);
2737
- const svgRef = React54__namespace.default.useRef(null);
2726
+ const [hidden, setHidden] = React55__namespace.default.useState(() => /* @__PURE__ */ new Set());
2727
+ const [focusSeries, setFocusSeries] = React55__namespace.default.useState(null);
2728
+ const [selected, setSelected] = React55__namespace.default.useState(null);
2729
+ const [hoverIdx, setHoverIdx] = React55__namespace.default.useState(null);
2730
+ const [zoom, setZoom] = React55__namespace.default.useState(null);
2731
+ const [drag, setDrag] = React55__namespace.default.useState(null);
2732
+ const svgRef = React55__namespace.default.useRef(null);
2738
2733
  const isBar = type === "bar" || type === "column";
2739
2734
  const isArea = type === "area";
2740
2735
  const crv = smooth ? "smooth" : curve;
@@ -2839,7 +2834,7 @@ function Chart({
2839
2834
  onDataClick({ label: d.label, series: null, seriesIndex: -1, value: void 0, index: baseIdx + idx, row: d });
2840
2835
  selectMark(`${idx}:*`);
2841
2836
  };
2842
- React54__namespace.default.useEffect(() => {
2837
+ React55__namespace.default.useEffect(() => {
2843
2838
  if (!zoomable) return void 0;
2844
2839
  const svg = svgRef.current;
2845
2840
  if (!svg) return void 0;
@@ -3149,12 +3144,12 @@ function PieChart({
3149
3144
  }) {
3150
3145
  const baseStyles = useScopedStyles("twc-chart-base", CHART_BASE_CSS);
3151
3146
  const styles = useScopedStyles("twc-piechart-styles", CHART_CSS2);
3152
- const uid = React54__namespace.default.useId();
3147
+ const uid = React55__namespace.default.useId();
3153
3148
  const tableId = tableFallback ? `${uid}-table` : void 0;
3154
3149
  const { containerRef, tip, show, hide } = useChartTooltip();
3155
- const [active, setActive] = React54__namespace.default.useState(null);
3156
- const [focus, setFocus] = React54__namespace.default.useState(null);
3157
- const [selected, setSelected] = React54__namespace.default.useState(null);
3150
+ const [active, setActive] = React55__namespace.default.useState(null);
3151
+ const [focus, setFocus] = React55__namespace.default.useState(null);
3152
+ const [selected, setSelected] = React55__namespace.default.useState(null);
3158
3153
  const clickable = !!onDataClick;
3159
3154
  const rows = data || [];
3160
3155
  const fmt = valueFormat || fmtNumber;
@@ -3303,11 +3298,11 @@ function Gauge({
3303
3298
  }) {
3304
3299
  const baseStyles = useScopedStyles("twc-chart-base", CHART_BASE_CSS);
3305
3300
  const styles = useScopedStyles("twc-gauge-styles", GAUGE_CSS);
3306
- const uid = React54__namespace.default.useId();
3301
+ const uid = React55__namespace.default.useId();
3307
3302
  const tableId = tableFallback ? `${uid}-table` : void 0;
3308
3303
  const { containerRef, tip, show, hide } = useChartTooltip();
3309
- const [selected, setSelected] = React54__namespace.default.useState(null);
3310
- const [focus, setFocus] = React54__namespace.default.useState(null);
3304
+ const [selected, setSelected] = React55__namespace.default.useState(null);
3305
+ const [focus, setFocus] = React55__namespace.default.useState(null);
3311
3306
  const fmt = valueFormat || ((n) => String(Math.round(Number(n) || 0)));
3312
3307
  const cx = size / 2, cy = size / 2;
3313
3308
  const span = endAngle - startAngle;
@@ -3468,11 +3463,11 @@ function Sparkline({
3468
3463
  }) {
3469
3464
  const baseStyles = useScopedStyles("twc-chart-base", CHART_BASE_CSS);
3470
3465
  const styles = useScopedStyles("twc-sparkline-styles", SPARK_CSS);
3471
- const uid = React54__namespace.default.useId();
3466
+ const uid = React55__namespace.default.useId();
3472
3467
  const tableId = tableFallback ? `${uid}-table` : void 0;
3473
3468
  const { containerRef, tip, show, hide } = useChartTooltip();
3474
- const [hover, setHover] = React54__namespace.default.useState(null);
3475
- const [selected, setSelected] = React54__namespace.default.useState(null);
3469
+ const [hover, setHover] = React55__namespace.default.useState(null);
3470
+ const [selected, setSelected] = React55__namespace.default.useState(null);
3476
3471
  const clickable = !!onDataClick;
3477
3472
  const kind = area ? "area" : type;
3478
3473
  const isBar = kind === "bar";
@@ -3672,17 +3667,17 @@ function ScatterChart({
3672
3667
  }) {
3673
3668
  const baseStyles = useScopedStyles("twc-chart-base", CHART_BASE_CSS);
3674
3669
  const styles = useScopedStyles("twc-scatter-styles", SCATTER_CSS);
3675
- const uid = React54__namespace.default.useId();
3670
+ const uid = React55__namespace.default.useId();
3676
3671
  const gid = uid.replace(/[^a-zA-Z0-9]/g, "");
3677
3672
  const clipId = `twc-sc-clip-${gid}`;
3678
3673
  const tableId = tableFallback ? `${uid}-table` : void 0;
3679
3674
  const { containerRef, tip, show, hide } = useChartTooltip();
3680
- const [focus, setFocus] = React54__namespace.default.useState(null);
3681
- const [selected, setSelected] = React54__namespace.default.useState(null);
3682
- const [zoom, setZoom] = React54__namespace.default.useState(null);
3683
- const [drag, setDrag] = React54__namespace.default.useState(null);
3684
- const svgRef = React54__namespace.default.useRef(null);
3685
- const movedRef = React54__namespace.default.useRef(false);
3675
+ const [focus, setFocus] = React55__namespace.default.useState(null);
3676
+ const [selected, setSelected] = React55__namespace.default.useState(null);
3677
+ const [zoom, setZoom] = React55__namespace.default.useState(null);
3678
+ const [drag, setDrag] = React55__namespace.default.useState(null);
3679
+ const svgRef = React55__namespace.default.useRef(null);
3680
+ const movedRef = React55__namespace.default.useRef(false);
3686
3681
  const list = Array.isArray(series) ? series : [];
3687
3682
  const vFmt = valueFormat || fmtNumber;
3688
3683
  const xFmt = xFormat || vFmt;
@@ -3855,7 +3850,7 @@ function ScatterChart({
3855
3850
  selectPoint(hit.key);
3856
3851
  }
3857
3852
  };
3858
- React54__namespace.default.useEffect(() => {
3853
+ React55__namespace.default.useEffect(() => {
3859
3854
  if (!canZoom) return void 0;
3860
3855
  const svg = svgRef.current;
3861
3856
  if (!svg) return void 0;
@@ -4041,11 +4036,11 @@ function RadarChart({
4041
4036
  }) {
4042
4037
  const baseStyles = useScopedStyles("twc-chart-base", CHART_BASE_CSS);
4043
4038
  const styles = useScopedStyles("twc-radarchart-styles", CHART_CSS3);
4044
- const uid = React54__namespace.default.useId();
4039
+ const uid = React55__namespace.default.useId();
4045
4040
  const tableId = tableFallback ? `${uid}-table` : void 0;
4046
4041
  const { containerRef, tip, show, hide } = useChartTooltip();
4047
- const [focus, setFocus] = React54__namespace.default.useState(null);
4048
- const [selected, setSelected] = React54__namespace.default.useState(null);
4042
+ const [focus, setFocus] = React55__namespace.default.useState(null);
4043
+ const [selected, setSelected] = React55__namespace.default.useState(null);
4049
4044
  const rows = data || [];
4050
4045
  const keys = series && series.length ? series : ["value"];
4051
4046
  const fmt = valueFormat || fmtNumber;
@@ -4195,12 +4190,12 @@ function PolarAreaChart({
4195
4190
  }) {
4196
4191
  const baseStyles = useScopedStyles("twc-chart-base", CHART_BASE_CSS);
4197
4192
  const styles = useScopedStyles("twc-polar-styles", CHART_CSS4);
4198
- const uid = React54__namespace.default.useId();
4193
+ const uid = React55__namespace.default.useId();
4199
4194
  const tableId = tableFallback ? `${uid}-table` : void 0;
4200
4195
  const { containerRef, tip, show, hide } = useChartTooltip();
4201
- const [active, setActive] = React54__namespace.default.useState(null);
4202
- const [focus, setFocus] = React54__namespace.default.useState(null);
4203
- const [selected, setSelected] = React54__namespace.default.useState(null);
4196
+ const [active, setActive] = React55__namespace.default.useState(null);
4197
+ const [focus, setFocus] = React55__namespace.default.useState(null);
4198
+ const [selected, setSelected] = React55__namespace.default.useState(null);
4204
4199
  const rows = data || [];
4205
4200
  const n = rows.length;
4206
4201
  const fmt = valueFormat || fmtNumber;
@@ -4350,15 +4345,15 @@ function Heatmap({
4350
4345
  }) {
4351
4346
  const baseStyles = useScopedStyles("twc-chart-base", CHART_BASE_CSS);
4352
4347
  const styles = useScopedStyles("twc-heatmap-styles", HEATMAP_CSS);
4353
- const uid = React54__namespace.default.useId();
4348
+ const uid = React55__namespace.default.useId();
4354
4349
  const tableId = tableFallback ? `${uid}-table` : void 0;
4355
4350
  const { containerRef, tip, show, hide } = useChartTooltip();
4356
- const [hovered, setHovered] = React54__namespace.default.useState(null);
4357
- const [selected, setSelected] = React54__namespace.default.useState(null);
4358
- const [zoom, setZoom] = React54__namespace.default.useState(null);
4359
- const [drag, setDrag] = React54__namespace.default.useState(null);
4360
- const svgRef = React54__namespace.default.useRef(null);
4361
- const movedRef = React54__namespace.default.useRef(false);
4351
+ const [hovered, setHovered] = React55__namespace.default.useState(null);
4352
+ const [selected, setSelected] = React55__namespace.default.useState(null);
4353
+ const [zoom, setZoom] = React55__namespace.default.useState(null);
4354
+ const [drag, setDrag] = React55__namespace.default.useState(null);
4355
+ const svgRef = React55__namespace.default.useRef(null);
4356
+ const movedRef = React55__namespace.default.useRef(false);
4362
4357
  const clickable = !!onDataClick;
4363
4358
  const selectMark = (key) => setSelected((s) => s === key ? null : key);
4364
4359
  const rows = Array.isArray(data) ? data : [];
@@ -4521,7 +4516,7 @@ function Heatmap({
4521
4516
  selectMark(cell.key);
4522
4517
  }
4523
4518
  };
4524
- React54__namespace.default.useEffect(() => {
4519
+ React55__namespace.default.useEffect(() => {
4525
4520
  if (!canZoom) return void 0;
4526
4521
  const svg = svgRef.current;
4527
4522
  if (!svg) return void 0;
@@ -4691,11 +4686,11 @@ function FunnelChart({
4691
4686
  }) {
4692
4687
  const baseStyles = useScopedStyles("twc-chart-base", CHART_BASE_CSS);
4693
4688
  const styles = useScopedStyles("twc-funnel-styles", FUNNEL_CSS);
4694
- const uid = React54__namespace.default.useId();
4689
+ const uid = React55__namespace.default.useId();
4695
4690
  const tableId = tableFallback ? `${uid}-table` : void 0;
4696
4691
  const { containerRef, tip, show, hide } = useChartTooltip();
4697
- const [active, setActive] = React54__namespace.default.useState(null);
4698
- const [selected, setSelected] = React54__namespace.default.useState(null);
4692
+ const [active, setActive] = React55__namespace.default.useState(null);
4693
+ const [selected, setSelected] = React55__namespace.default.useState(null);
4699
4694
  const clickable = !!onDataClick;
4700
4695
  const rows = data || [];
4701
4696
  const n = rows.length;
@@ -4813,11 +4808,11 @@ function Treemap({
4813
4808
  }) {
4814
4809
  const baseStyles = useScopedStyles("twc-chart-base", CHART_BASE_CSS);
4815
4810
  const styles = useScopedStyles("twc-treemap-styles", TREEMAP_CSS);
4816
- const uid = React54__namespace.default.useId();
4811
+ const uid = React55__namespace.default.useId();
4817
4812
  const tableId = tableFallback ? `${uid}-table` : void 0;
4818
4813
  const { containerRef, tip, show, hide } = useChartTooltip();
4819
- const [hovered, setHovered] = React54__namespace.default.useState(null);
4820
- const [selected, setSelected] = React54__namespace.default.useState(null);
4814
+ const [hovered, setHovered] = React55__namespace.default.useState(null);
4815
+ const [selected, setSelected] = React55__namespace.default.useState(null);
4821
4816
  const rows = data || [];
4822
4817
  const fmt = valueFormat || fmtNumber;
4823
4818
  const svgAriaLabel = ariaLabelProp ?? ariaLabel ?? "treemap";
@@ -4975,13 +4970,13 @@ function Candlestick({
4975
4970
  }) {
4976
4971
  const baseStyles = useScopedStyles("twc-chart-base", CHART_BASE_CSS);
4977
4972
  const styles = useScopedStyles("twc-candlestick-styles", CANDLE_CSS);
4978
- const uid = React54__namespace.default.useId();
4973
+ const uid = React55__namespace.default.useId();
4979
4974
  const tableId = tableFallback ? `${uid}-table` : void 0;
4980
4975
  const { containerRef, tip, show, hide } = useChartTooltip();
4981
- const [selected, setSelected] = React54__namespace.default.useState(null);
4982
- const [zoom, setZoom] = React54__namespace.default.useState(null);
4983
- const [drag, setDrag] = React54__namespace.default.useState(null);
4984
- const svgRef = React54__namespace.default.useRef(null);
4976
+ const [selected, setSelected] = React55__namespace.default.useState(null);
4977
+ const [zoom, setZoom] = React55__namespace.default.useState(null);
4978
+ const [drag, setDrag] = React55__namespace.default.useState(null);
4979
+ const svgRef = React55__namespace.default.useRef(null);
4985
4980
  const fmt = valueFormat || fmtNumber;
4986
4981
  const clickable = !!onDataClick;
4987
4982
  const allRows = data || [];
@@ -5082,7 +5077,7 @@ function Candlestick({
5082
5077
  clickCandle(rows[idx], baseIdx + idx);
5083
5078
  selectMark(baseIdx + idx);
5084
5079
  };
5085
- React54__namespace.default.useEffect(() => {
5080
+ React55__namespace.default.useEffect(() => {
5086
5081
  if (!zoomable) return void 0;
5087
5082
  const svg = svgRef.current;
5088
5083
  if (!svg) return void 0;
@@ -5278,13 +5273,13 @@ function Boxplot({
5278
5273
  }) {
5279
5274
  const baseStyles = useScopedStyles("twc-chart-base", CHART_BASE_CSS);
5280
5275
  const styles = useScopedStyles("twc-boxplot-styles", CHART_CSS5);
5281
- const uid = React54__namespace.default.useId();
5276
+ const uid = React55__namespace.default.useId();
5282
5277
  const tableId = tableFallback ? `${uid}-table` : void 0;
5283
5278
  const { containerRef, tip, show, hide } = useChartTooltip();
5284
- const [selected, setSelected] = React54__namespace.default.useState(null);
5285
- const [zoom, setZoom] = React54__namespace.default.useState(null);
5286
- const [drag, setDrag] = React54__namespace.default.useState(null);
5287
- const svgRef = React54__namespace.default.useRef(null);
5279
+ const [selected, setSelected] = React55__namespace.default.useState(null);
5280
+ const [zoom, setZoom] = React55__namespace.default.useState(null);
5281
+ const [drag, setDrag] = React55__namespace.default.useState(null);
5282
+ const svgRef = React55__namespace.default.useRef(null);
5288
5283
  const allRows = data || [];
5289
5284
  const baseIdx = zoom ? zoom.s : 0;
5290
5285
  const rows = zoom ? allRows.slice(zoom.s, zoom.e + 1) : allRows;
@@ -5384,7 +5379,7 @@ function Boxplot({
5384
5379
  if (idx == null) return;
5385
5380
  clickBox(rows[idx], idx);
5386
5381
  };
5387
- React54__namespace.default.useEffect(() => {
5382
+ React55__namespace.default.useEffect(() => {
5388
5383
  if (!zoomable) return void 0;
5389
5384
  const svg = svgRef.current;
5390
5385
  if (!svg) return void 0;
@@ -5545,13 +5540,13 @@ function RangeChart({
5545
5540
  }) {
5546
5541
  const baseStyles = useScopedStyles("twc-chart-base", CHART_BASE_CSS);
5547
5542
  const styles = useScopedStyles("twc-rangechart-styles", RANGE_CSS);
5548
- const uid = React54__namespace.default.useId();
5543
+ const uid = React55__namespace.default.useId();
5549
5544
  const tableId = tableFallback ? `${uid}-table` : void 0;
5550
5545
  const { containerRef, tip, show, hide } = useChartTooltip();
5551
- const [selected, setSelected] = React54__namespace.default.useState(null);
5552
- const [zoom, setZoom] = React54__namespace.default.useState(null);
5553
- const [drag, setDrag] = React54__namespace.default.useState(null);
5554
- const svgRef = React54__namespace.default.useRef(null);
5546
+ const [selected, setSelected] = React55__namespace.default.useState(null);
5547
+ const [zoom, setZoom] = React55__namespace.default.useState(null);
5548
+ const [drag, setDrag] = React55__namespace.default.useState(null);
5549
+ const svgRef = React55__namespace.default.useRef(null);
5555
5550
  const isArea = type === "area";
5556
5551
  const clickable = !!onDataClick;
5557
5552
  const fmt = valueFormat || fmtNumber;
@@ -5646,7 +5641,7 @@ function RangeChart({
5646
5641
  if (idx == null) return;
5647
5642
  clickAt(idx);
5648
5643
  };
5649
- React54__namespace.default.useEffect(() => {
5644
+ React55__namespace.default.useEffect(() => {
5650
5645
  if (!zoomable) return void 0;
5651
5646
  const svg = svgRef.current;
5652
5647
  if (!svg) return void 0;
@@ -5834,7 +5829,25 @@ function RangeChart({
5834
5829
  function labelText7(label) {
5835
5830
  return typeof label === "string" || typeof label === "number" ? String(label) : "";
5836
5831
  }
5837
- function Checkbox({
5832
+ function useMergedRef(...refs) {
5833
+ return React55__namespace.useCallback((node) => {
5834
+ const cleanups = [];
5835
+ for (const r2 of refs) {
5836
+ if (typeof r2 === "function") {
5837
+ const cleanup = r2(node);
5838
+ if (typeof cleanup === "function") cleanups.push(cleanup);
5839
+ } else if (r2 && typeof r2 === "object") {
5840
+ r2.current = node;
5841
+ }
5842
+ }
5843
+ if (cleanups.length === 0) return void 0;
5844
+ return () => {
5845
+ for (const r2 of refs) if (r2 && typeof r2 === "object") r2.current = null;
5846
+ for (const cleanup of cleanups) cleanup();
5847
+ };
5848
+ }, refs);
5849
+ }
5850
+ var Checkbox = /* @__PURE__ */ React55__namespace.default.forwardRef(function Checkbox2({
5838
5851
  label,
5839
5852
  description,
5840
5853
  error,
@@ -5849,7 +5862,7 @@ function Checkbox({
5849
5862
  className = "",
5850
5863
  onChange,
5851
5864
  ...rest
5852
- }) {
5865
+ }, forwardedRef) {
5853
5866
  const __twcStyles = useScopedStyles("twc-checkbox-styles", `
5854
5867
  .twc-check { display: inline-flex; align-items: flex-start; gap: var(--space-2-5); cursor: pointer; font-family: var(--font-sans); }
5855
5868
  /* tone \u2192 accent set (default primary). Mirrors Button's --_accent model; Badge's tone vocabulary. */
@@ -5890,13 +5903,14 @@ function Checkbox({
5890
5903
  .twc-field { display: flex; flex-direction: column; gap: var(--space-1-5); font-family: var(--font-sans); }
5891
5904
  .twc-field__error { font-size: var(--text-xs); color: var(--color-danger-subtle-fg); font-weight: var(--font-medium); }
5892
5905
  `);
5893
- const autoId = React54__namespace.default.useId();
5906
+ const autoId = React55__namespace.default.useId();
5894
5907
  const fieldId = id || autoId;
5895
5908
  const errId = `${fieldId}-error`;
5896
5909
  const invalid = Boolean(error);
5897
- const ref = React54__namespace.default.useRef(null);
5910
+ const ref = React55__namespace.default.useRef(null);
5911
+ const setRef = useMergedRef(ref, forwardedRef);
5898
5912
  const mixed = indeterminate && !checked;
5899
- React54__namespace.default.useEffect(() => {
5913
+ React55__namespace.default.useEffect(() => {
5900
5914
  if (ref.current) ref.current.indeterminate = mixed;
5901
5915
  }, [mixed]);
5902
5916
  if (process.env.NODE_ENV !== "production" && !label && !description && !rest["aria-label"] && !rest["aria-labelledby"]) {
@@ -5908,7 +5922,7 @@ function Checkbox({
5908
5922
  /* @__PURE__ */ jsxRuntime.jsx(
5909
5923
  "input",
5910
5924
  {
5911
- ref,
5925
+ ref: setRef,
5912
5926
  id: fieldId,
5913
5927
  type: "checkbox",
5914
5928
  className: "twc-check__input",
@@ -5938,7 +5952,7 @@ function Checkbox({
5938
5952
  control,
5939
5953
  /* @__PURE__ */ jsxRuntime.jsx("span", { id: errId, className: "twc-field__error", children: error })
5940
5954
  ] });
5941
- }
5955
+ });
5942
5956
  var FIELD_CSS = `
5943
5957
  .twc-field { display: flex; flex-direction: column; gap: var(--space-1-5); font-family: var(--font-sans); }
5944
5958
  .twc-field__label { font-size: var(--text-sm); font-weight: var(--font-semibold); color: var(--color-text); display: flex; gap: 4px; align-items: center; }
@@ -6056,22 +6070,22 @@ function ColorPicker({
6056
6070
  }) {
6057
6071
  const __twcStyles0 = useScopedStyles("twc-field-styles", FIELD_CSS);
6058
6072
  const __twcStyles1 = useScopedStyles("twc-colorpicker-styles", COLORPICKER_CSS);
6059
- const [internal, setInternal] = React54__namespace.default.useState(defaultValue);
6073
+ const [internal, setInternal] = React55__namespace.default.useState(defaultValue);
6060
6074
  const hex = (value !== void 0 ? value : internal) || "#000000";
6061
6075
  const hexRe = alpha ? /^#([0-9a-f]{3}|[0-9a-f]{6}|[0-9a-f]{8})$/i : /^#([0-9a-f]{3}|[0-9a-f]{6})$/i;
6062
- const lastValidRef = React54__namespace.default.useRef(hex);
6076
+ const lastValidRef = React55__namespace.default.useRef(hex);
6063
6077
  if (hexRe.test(hex)) lastValidRef.current = hex;
6064
- const [open, setOpen] = React54__namespace.default.useState(false);
6065
- const [hsv, setHsv] = React54__namespace.default.useState(() => hexToHsv(hex) || { h: 239, s: 60, v: 94, a: 1 });
6066
- const [coords, setCoords] = React54__namespace.default.useState(null);
6067
- const wrapRef = React54__namespace.default.useRef(null);
6068
- const triggerRef = React54__namespace.default.useRef(null);
6069
- const popRef = React54__namespace.default.useRef(null);
6070
- const areaRef = React54__namespace.default.useRef(null);
6071
- const hueRef = React54__namespace.default.useRef(null);
6072
- const alphaRef = React54__namespace.default.useRef(null);
6078
+ const [open, setOpen] = React55__namespace.default.useState(false);
6079
+ const [hsv, setHsv] = React55__namespace.default.useState(() => hexToHsv(hex) || { h: 239, s: 60, v: 94, a: 1 });
6080
+ const [coords, setCoords] = React55__namespace.default.useState(null);
6081
+ const wrapRef = React55__namespace.default.useRef(null);
6082
+ const triggerRef = React55__namespace.default.useRef(null);
6083
+ const popRef = React55__namespace.default.useRef(null);
6084
+ const areaRef = React55__namespace.default.useRef(null);
6085
+ const hueRef = React55__namespace.default.useRef(null);
6086
+ const alphaRef = React55__namespace.default.useRef(null);
6073
6087
  const POP_W = 240;
6074
- const place = React54__namespace.default.useCallback(() => {
6088
+ const place = React55__namespace.default.useCallback(() => {
6075
6089
  const el = triggerRef.current;
6076
6090
  if (!el) return;
6077
6091
  const r2 = el.getBoundingClientRect();
@@ -6082,7 +6096,7 @@ function ColorPicker({
6082
6096
  left = Math.max(8, left);
6083
6097
  setCoords({ left, top: flip ? void 0 : Math.round(r2.bottom + 6), bottom: flip ? Math.round(vh - r2.top + 6) : void 0 });
6084
6098
  }, []);
6085
- React54__namespace.default.useEffect(() => {
6099
+ React55__namespace.default.useEffect(() => {
6086
6100
  if (!open) return void 0;
6087
6101
  place();
6088
6102
  const onMove = () => place();
@@ -6100,17 +6114,17 @@ function ColorPicker({
6100
6114
  ro?.disconnect();
6101
6115
  };
6102
6116
  }, [open, place]);
6103
- const labelId = React54__namespace.default.useId();
6117
+ const labelId = React55__namespace.default.useId();
6104
6118
  const descId = `${labelId}-desc`;
6105
6119
  const invalid = Boolean(error);
6106
- React54__namespace.default.useEffect(() => {
6120
+ React55__namespace.default.useEffect(() => {
6107
6121
  if (disabled) setOpen(false);
6108
6122
  }, [disabled]);
6109
- React54__namespace.default.useEffect(() => {
6123
+ React55__namespace.default.useEffect(() => {
6110
6124
  const v = hexToHsv(hex);
6111
6125
  if (v && hsvToHex(v.h, v.s, v.v).toLowerCase() !== hsvToHex(hsv.h, hsv.s, hsv.v).toLowerCase()) setHsv(v);
6112
6126
  }, [hex]);
6113
- React54__namespace.default.useEffect(() => {
6127
+ React55__namespace.default.useEffect(() => {
6114
6128
  if (!open) return;
6115
6129
  const onDown = (e) => {
6116
6130
  if (wrapRef.current && wrapRef.current.contains(e.target)) return;
@@ -6460,7 +6474,7 @@ function ensureVisible(list, el) {
6460
6474
  if (top < list.scrollTop) list.scrollTop = top - 4;
6461
6475
  else if (bottom > list.scrollTop + list.clientHeight) list.scrollTop = bottom - list.clientHeight + 4;
6462
6476
  }
6463
- function Combobox({
6477
+ var Combobox = /* @__PURE__ */ React55__namespace.default.forwardRef(function Combobox2({
6464
6478
  label,
6465
6479
  hint,
6466
6480
  error,
@@ -6493,38 +6507,39 @@ function Combobox({
6493
6507
  onFocus,
6494
6508
  onKeyDown,
6495
6509
  ...rest
6496
- }) {
6510
+ }, ref) {
6497
6511
  const __twcStyles = useScopedStyles("twc-combo-styles", COMBO_CSS);
6498
6512
  if (virtualizedProp && (wrapOptions || renderOption)) warnOnce("combobox-var-height-virtualized", "twico-ui Combobox: `wrapOptions`/`renderOption` disable `virtualized` \u2014 those rows aren't a fixed height.");
6499
6513
  const virtualized = virtualizedProp && !wrapOptions && !renderOption;
6500
- const groups = React54__namespace.default.useMemo(() => normalizeGroups(options), [options]);
6501
- const flat = React54__namespace.default.useMemo(() => groups.flatMap((g) => g.options), [groups]);
6502
- const autoId = React54__namespace.default.useId();
6514
+ const groups = React55__namespace.default.useMemo(() => normalizeGroups(options), [options]);
6515
+ const flat = React55__namespace.default.useMemo(() => groups.flatMap((g) => g.options), [groups]);
6516
+ const autoId = React55__namespace.default.useId();
6503
6517
  const fieldId = id || autoId;
6504
- const [internal, setInternal] = React54__namespace.default.useState(defaultValue);
6518
+ const [internal, setInternal] = React55__namespace.default.useState(defaultValue);
6505
6519
  const current = value !== void 0 ? value : internal;
6506
6520
  const selected = flat.find((o) => o.value === current);
6507
- const [open, setOpen] = React54__namespace.default.useState(false);
6508
- const [query, setQuery] = React54__namespace.default.useState("");
6509
- const [active, setActive] = React54__namespace.default.useState(0);
6510
- const [coords, setCoords] = React54__namespace.default.useState(null);
6511
- const [scrollTop, setScrollTop] = React54__namespace.default.useState(0);
6512
- const [listH, setListH] = React54__namespace.default.useState(260);
6513
- const wrapRef = React54__namespace.default.useRef(null);
6514
- const controlRef = React54__namespace.default.useRef(null);
6515
- const inputRef = React54__namespace.default.useRef(null);
6516
- const popRef = React54__namespace.default.useRef(null);
6517
- const listRef = React54__namespace.default.useRef(null);
6518
- const activeRef = React54__namespace.default.useRef(null);
6519
- const fGroups = React54__namespace.default.useMemo(() => {
6521
+ const [open, setOpen] = React55__namespace.default.useState(false);
6522
+ const [query, setQuery] = React55__namespace.default.useState("");
6523
+ const [active, setActive] = React55__namespace.default.useState(0);
6524
+ const [coords, setCoords] = React55__namespace.default.useState(null);
6525
+ const [scrollTop, setScrollTop] = React55__namespace.default.useState(0);
6526
+ const [listH, setListH] = React55__namespace.default.useState(260);
6527
+ const wrapRef = React55__namespace.default.useRef(null);
6528
+ const controlRef = React55__namespace.default.useRef(null);
6529
+ const inputRef = React55__namespace.default.useRef(null);
6530
+ const setInputRef = useMergedRef(inputRef, ref);
6531
+ const popRef = React55__namespace.default.useRef(null);
6532
+ const listRef = React55__namespace.default.useRef(null);
6533
+ const activeRef = React55__namespace.default.useRef(null);
6534
+ const fGroups = React55__namespace.default.useMemo(() => {
6520
6535
  const q = query.trim();
6521
6536
  const fn = filter === false ? null : typeof filter === "function" ? filter : matches;
6522
6537
  return groups.map((g) => ({ group: g.group, options: fn ? g.options.filter((o) => fn(o, q)) : g.options })).filter((g) => g.options.length);
6523
6538
  }, [groups, query, filter]);
6524
- const visible = React54__namespace.default.useMemo(() => fGroups.flatMap((g) => g.options), [fGroups]);
6525
- const rowH = React54__namespace.default.useMemo(() => visible.some((o) => o.description) ? 48 : 36, [visible]);
6539
+ const visible = React55__namespace.default.useMemo(() => fGroups.flatMap((g) => g.options), [fGroups]);
6540
+ const rowH = React55__namespace.default.useMemo(() => visible.some((o) => o.description) ? 48 : 36, [visible]);
6526
6541
  const GROUP_H = 30;
6527
- const { rows, totalH } = React54__namespace.default.useMemo(() => {
6542
+ const { rows, totalH } = React55__namespace.default.useMemo(() => {
6528
6543
  if (!virtualized) return { rows: [], totalH: 0 };
6529
6544
  const rows2 = [];
6530
6545
  let off = 0;
@@ -6550,7 +6565,7 @@ function Combobox({
6550
6565
  }
6551
6566
  return from;
6552
6567
  };
6553
- const place = React54__namespace.default.useCallback(() => {
6568
+ const place = React55__namespace.default.useCallback(() => {
6554
6569
  const el = controlRef.current;
6555
6570
  if (!el) return;
6556
6571
  const r2 = el.getBoundingClientRect();
@@ -6565,7 +6580,7 @@ function Combobox({
6565
6580
  flip
6566
6581
  });
6567
6582
  }, [placement, minWidth]);
6568
- React54__namespace.default.useEffect(() => {
6583
+ React55__namespace.default.useEffect(() => {
6569
6584
  if (!open || !portal) return;
6570
6585
  place();
6571
6586
  const onMove = () => place();
@@ -6583,7 +6598,7 @@ function Combobox({
6583
6598
  ro?.disconnect();
6584
6599
  };
6585
6600
  }, [open, portal, place]);
6586
- React54__namespace.default.useEffect(() => {
6601
+ React55__namespace.default.useEffect(() => {
6587
6602
  if (!open) return;
6588
6603
  const onDown = (e) => {
6589
6604
  if (wrapRef.current && wrapRef.current.contains(e.target)) return;
@@ -6593,33 +6608,33 @@ function Combobox({
6593
6608
  document.addEventListener("mousedown", onDown);
6594
6609
  return () => document.removeEventListener("mousedown", onDown);
6595
6610
  }, [open]);
6596
- React54__namespace.default.useEffect(() => {
6611
+ React55__namespace.default.useEffect(() => {
6597
6612
  setActive(0);
6598
6613
  }, [query]);
6599
- React54__namespace.default.useEffect(() => {
6614
+ React55__namespace.default.useEffect(() => {
6600
6615
  if (visible.length === 0) return;
6601
6616
  setActive((a) => Math.min(a, visible.length - 1));
6602
6617
  }, [visible.length]);
6603
- const onOpenChangeRef = React54__namespace.default.useRef(onOpenChange);
6618
+ const onOpenChangeRef = React55__namespace.default.useRef(onOpenChange);
6604
6619
  onOpenChangeRef.current = onOpenChange;
6605
- const prevOpenRef = React54__namespace.default.useRef(open);
6606
- React54__namespace.default.useEffect(() => {
6620
+ const prevOpenRef = React55__namespace.default.useRef(open);
6621
+ React55__namespace.default.useEffect(() => {
6607
6622
  if (prevOpenRef.current !== open) {
6608
6623
  prevOpenRef.current = open;
6609
6624
  onOpenChangeRef.current?.(open);
6610
6625
  }
6611
6626
  }, [open]);
6612
- React54__namespace.default.useEffect(() => {
6627
+ React55__namespace.default.useEffect(() => {
6613
6628
  if (!open) return;
6614
6629
  const idx = visible.findIndex((o) => o.value === current);
6615
6630
  setActive(idx >= 0 ? idx : 0);
6616
6631
  }, [open]);
6617
- React54__namespace.default.useEffect(() => {
6632
+ React55__namespace.default.useEffect(() => {
6618
6633
  if (!open || !virtualized) return;
6619
6634
  const el = listRef.current;
6620
6635
  if (el && el.clientHeight) setListH(el.clientHeight);
6621
6636
  }, [open, virtualized]);
6622
- React54__namespace.default.useEffect(() => {
6637
+ React55__namespace.default.useEffect(() => {
6623
6638
  if (!open) return;
6624
6639
  if (!virtualized) {
6625
6640
  ensureVisible(listRef.current, activeRef.current);
@@ -6748,7 +6763,7 @@ function Combobox({
6748
6763
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "twc-pop__group", role: "presentation", children: r2.label }, `g${r2.gi}`)
6749
6764
  ) : renderRow(r2.o, r2.idx)),
6750
6765
  vBottom > 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", { "aria-hidden": "true", style: { height: vBottom } }) : null
6751
- ] }) : fGroups.map((g, gi) => /* @__PURE__ */ jsxRuntime.jsxs(React54__namespace.default.Fragment, { children: [
6766
+ ] }) : fGroups.map((g, gi) => /* @__PURE__ */ jsxRuntime.jsxs(React55__namespace.default.Fragment, { children: [
6752
6767
  g.group ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "twc-pop__group", role: "presentation", children: g.group }) : null,
6753
6768
  g.options.map((o) => {
6754
6769
  counter += 1;
@@ -6806,7 +6821,7 @@ function Combobox({
6806
6821
  /* @__PURE__ */ jsxRuntime.jsx(
6807
6822
  "input",
6808
6823
  {
6809
- ref: inputRef,
6824
+ ref: setInputRef,
6810
6825
  id: fieldId,
6811
6826
  className: "twc-cb__input",
6812
6827
  role: "combobox",
@@ -6861,7 +6876,7 @@ function Combobox({
6861
6876
  ] }),
6862
6877
  error ? /* @__PURE__ */ jsxRuntime.jsx("span", { id: descId, className: "twc-field__error", children: error }) : hint ? /* @__PURE__ */ jsxRuntime.jsx("span", { id: descId, className: "twc-field__hint", children: hint }) : null
6863
6878
  ] });
6864
- }
6879
+ });
6865
6880
  var COMMAND_CSS = `
6866
6881
  .twc-cmdk__overlay { position: fixed; inset: 0; z-index: var(--z-modal); background: var(--color-overlay); backdrop-filter: blur(3px);
6867
6882
  display: flex; align-items: flex-start; justify-content: center; padding-top: 12vh; }
@@ -6912,14 +6927,14 @@ function CommandPalette({
6912
6927
  }) {
6913
6928
  const __twcStyles = useScopedStyles("twc-cmdk-styles", COMMAND_CSS);
6914
6929
  const renderPortal = usePortal();
6915
- const [query, setQuery] = React54__namespace.default.useState("");
6916
- const [active, setActive] = React54__namespace.default.useState(0);
6917
- const inputRef = React54__namespace.default.useRef(null);
6918
- const listRef = React54__namespace.default.useRef(null);
6919
- const paletteRef = React54__namespace.default.useRef(null);
6920
- const baseId = React54__namespace.default.useId();
6921
- const [mounted, setMounted] = React54__namespace.default.useState(open);
6922
- React54__namespace.default.useEffect(() => {
6930
+ const [query, setQuery] = React55__namespace.default.useState("");
6931
+ const [active, setActive] = React55__namespace.default.useState(0);
6932
+ const inputRef = React55__namespace.default.useRef(null);
6933
+ const listRef = React55__namespace.default.useRef(null);
6934
+ const paletteRef = React55__namespace.default.useRef(null);
6935
+ const baseId = React55__namespace.default.useId();
6936
+ const [mounted, setMounted] = React55__namespace.default.useState(open);
6937
+ React55__namespace.default.useEffect(() => {
6923
6938
  if (open) {
6924
6939
  setMounted(true);
6925
6940
  return;
@@ -6928,7 +6943,7 @@ function CommandPalette({
6928
6943
  return () => clearTimeout(t);
6929
6944
  }, [open]);
6930
6945
  useScrollLock(open);
6931
- React54__namespace.default.useEffect(() => {
6946
+ React55__namespace.default.useEffect(() => {
6932
6947
  if (open) {
6933
6948
  setQuery("");
6934
6949
  setActive(0);
@@ -6936,7 +6951,7 @@ function CommandPalette({
6936
6951
  }, [open]);
6937
6952
  useFocusTrap(paletteRef, open && mounted);
6938
6953
  const isTop = useLayer(open && mounted);
6939
- React54__namespace.default.useEffect(() => {
6954
+ React55__namespace.default.useEffect(() => {
6940
6955
  if (!open) return void 0;
6941
6956
  const onKey = (e) => {
6942
6957
  if (e.defaultPrevented || !isTop()) return;
@@ -6949,7 +6964,7 @@ function CommandPalette({
6949
6964
  return () => document.removeEventListener("keydown", onKey);
6950
6965
  }, [open, onClose, isTop]);
6951
6966
  const q = query.trim().toLowerCase();
6952
- const filtered = React54__namespace.default.useMemo(() => commands.filter(
6967
+ const filtered = React55__namespace.default.useMemo(() => commands.filter(
6953
6968
  (c) => !q || c.label.toLowerCase().includes(q) || (c.keywords || "").toLowerCase().includes(q) || (c.group || "").toLowerCase().includes(q)
6954
6969
  ), [commands, q]);
6955
6970
  const groups = [];
@@ -6964,7 +6979,7 @@ function CommandPalette({
6964
6979
  g.items.push(c);
6965
6980
  flat.push(c);
6966
6981
  });
6967
- React54__namespace.default.useEffect(() => {
6982
+ React55__namespace.default.useEffect(() => {
6968
6983
  setActive(0);
6969
6984
  }, [query]);
6970
6985
  const run = (cmd) => {
@@ -6984,7 +6999,7 @@ function CommandPalette({
6984
6999
  if (cmd) run(cmd);
6985
7000
  }
6986
7001
  }
6987
- React54__namespace.default.useEffect(() => {
7002
+ React55__namespace.default.useEffect(() => {
6988
7003
  const node = listRef.current?.querySelector('[data-active="true"]');
6989
7004
  if (node) node.scrollIntoView({ block: "nearest" });
6990
7005
  }, [active]);
@@ -7174,13 +7189,13 @@ function Currency({
7174
7189
  const prec = precision != null ? precision : meta.precision;
7175
7190
  const sym = symbol != null ? symbol : meta.symbol;
7176
7191
  const cur = code != null ? code : meta.code;
7177
- const autoId = React54__namespace.default.useId();
7192
+ const autoId = React55__namespace.default.useId();
7178
7193
  const fieldId = id || autoId;
7179
7194
  const invalid = Boolean(error);
7180
7195
  const controlled = value !== void 0;
7181
- const [internal, setInternal] = React54__namespace.default.useState(() => clampPrecision(String(defaultValue ?? ""), prec));
7196
+ const [internal, setInternal] = React55__namespace.default.useState(() => clampPrecision(String(defaultValue ?? ""), prec));
7182
7197
  const shown = controlled ? clampPrecision(String(value ?? ""), prec) : internal;
7183
- React54__namespace.default.useEffect(() => {
7198
+ React55__namespace.default.useEffect(() => {
7184
7199
  if (!controlled) return;
7185
7200
  const raw = String(value ?? "");
7186
7201
  if (shown !== raw) {
@@ -7188,7 +7203,7 @@ function Currency({
7188
7203
  onValueChange?.(shown === "" || Number.isNaN(n) ? null : n, shown);
7189
7204
  }
7190
7205
  }, [controlled, shown, value]);
7191
- React54__namespace.default.useEffect(() => {
7206
+ React55__namespace.default.useEffect(() => {
7192
7207
  if (controlled) return;
7193
7208
  const next = clampPrecision(internal, prec);
7194
7209
  if (next === internal) return;
@@ -7247,8 +7262,8 @@ function Currency({
7247
7262
  ] });
7248
7263
  }
7249
7264
  function useFallbackName(ref, hasOwnName) {
7250
- const [needsFallback, setNeedsFallback] = React54__namespace.default.useState(false);
7251
- const useIso2 = typeof document !== "undefined" ? React54__namespace.default.useLayoutEffect : React54__namespace.default.useEffect;
7265
+ const [needsFallback, setNeedsFallback] = React55__namespace.default.useState(false);
7266
+ const useIso2 = typeof document !== "undefined" ? React55__namespace.default.useLayoutEffect : React55__namespace.default.useEffect;
7252
7267
  useIso2(() => {
7253
7268
  if (hasOwnName) {
7254
7269
  setNeedsFallback(false);
@@ -7375,7 +7390,7 @@ function ensureVisible2(list, el) {
7375
7390
  if (top < list.scrollTop) list.scrollTop = top - 4;
7376
7391
  else if (bottom > list.scrollTop + list.clientHeight) list.scrollTop = bottom - list.clientHeight + 4;
7377
7392
  }
7378
- function Select({
7393
+ var Select = /* @__PURE__ */ React55__namespace.default.forwardRef(function Select2({
7379
7394
  label,
7380
7395
  hint,
7381
7396
  error,
@@ -7406,46 +7421,47 @@ function Select({
7406
7421
  onClick,
7407
7422
  onKeyDown,
7408
7423
  ...rest
7409
- }) {
7424
+ }, ref) {
7410
7425
  const __twcStyles = useScopedStyles("twc-select-styles", SELECT_CSS);
7411
7426
  if (virtualizedProp && renderOption) warnOnce("select-renderoption-virtualized", "twico-ui Select: `renderOption` disables `virtualized` \u2014 custom rows aren't a fixed height.");
7412
7427
  const virtualized = virtualizedProp && !renderOption;
7413
- const bufferRef = React54__namespace.default.useRef("");
7414
- const bufferTimerRef = React54__namespace.default.useRef(null);
7415
- const groups = React54__namespace.default.useMemo(() => normalizeGroups2(options), [options]);
7416
- const flat = React54__namespace.default.useMemo(() => groups.flatMap((g) => g.options), [groups]);
7417
- const autoId = React54__namespace.default.useId();
7428
+ const bufferRef = React55__namespace.default.useRef("");
7429
+ const bufferTimerRef = React55__namespace.default.useRef(null);
7430
+ const groups = React55__namespace.default.useMemo(() => normalizeGroups2(options), [options]);
7431
+ const flat = React55__namespace.default.useMemo(() => groups.flatMap((g) => g.options), [groups]);
7432
+ const autoId = React55__namespace.default.useId();
7418
7433
  const fieldId = id || autoId;
7419
- const [internal, setInternal] = React54__namespace.default.useState(defaultValue);
7434
+ const [internal, setInternal] = React55__namespace.default.useState(defaultValue);
7420
7435
  const current = value !== void 0 ? value : internal;
7421
- const [open, setOpen] = React54__namespace.default.useState(false);
7422
- const [render, setRender] = React54__namespace.default.useState(false);
7423
- const [active, setActive] = React54__namespace.default.useState(0);
7424
- const [coords, setCoords] = React54__namespace.default.useState(null);
7425
- const [query, setQuery] = React54__namespace.default.useState("");
7426
- const [scrollTop, setScrollTop] = React54__namespace.default.useState(0);
7427
- const [listH, setListH] = React54__namespace.default.useState(260);
7428
- const wrapRef = React54__namespace.default.useRef(null);
7429
- const triggerRef = React54__namespace.default.useRef(null);
7430
- const popRef = React54__namespace.default.useRef(null);
7431
- const listRef = React54__namespace.default.useRef(null);
7432
- const activeRef = React54__namespace.default.useRef(null);
7433
- const searchRef = React54__namespace.default.useRef(null);
7436
+ const [open, setOpen] = React55__namespace.default.useState(false);
7437
+ const [render, setRender] = React55__namespace.default.useState(false);
7438
+ const [active, setActive] = React55__namespace.default.useState(0);
7439
+ const [coords, setCoords] = React55__namespace.default.useState(null);
7440
+ const [query, setQuery] = React55__namespace.default.useState("");
7441
+ const [scrollTop, setScrollTop] = React55__namespace.default.useState(0);
7442
+ const [listH, setListH] = React55__namespace.default.useState(260);
7443
+ const wrapRef = React55__namespace.default.useRef(null);
7444
+ const triggerRef = React55__namespace.default.useRef(null);
7445
+ const setTriggerRef = useMergedRef(triggerRef, ref);
7446
+ const popRef = React55__namespace.default.useRef(null);
7447
+ const listRef = React55__namespace.default.useRef(null);
7448
+ const activeRef = React55__namespace.default.useRef(null);
7449
+ const searchRef = React55__namespace.default.useRef(null);
7434
7450
  const showSearch = searchable === void 0 ? flat.length > 5 : searchable;
7435
- const fGroupsLive = React54__namespace.default.useMemo(() => {
7451
+ const fGroupsLive = React55__namespace.default.useMemo(() => {
7436
7452
  const q = query.trim().toLowerCase();
7437
7453
  if (!q) return groups;
7438
7454
  return groups.map((g) => ({ group: g.group, options: g.options.filter((o) => o.label.toLowerCase().includes(q) || o.description && o.description.toLowerCase().includes(q)) })).filter((g) => g.options.length);
7439
7455
  }, [groups, query]);
7440
- const fGroupsFrozen = React54__namespace.default.useRef(fGroupsLive);
7441
- React54__namespace.default.useEffect(() => {
7456
+ const fGroupsFrozen = React55__namespace.default.useRef(fGroupsLive);
7457
+ React55__namespace.default.useEffect(() => {
7442
7458
  if (open) fGroupsFrozen.current = fGroupsLive;
7443
7459
  }, [open, fGroupsLive]);
7444
7460
  const fGroups = open ? fGroupsLive : fGroupsFrozen.current;
7445
- const visible = React54__namespace.default.useMemo(() => fGroups.flatMap((g) => g.options), [fGroups]);
7446
- const rowH = React54__namespace.default.useMemo(() => visible.some((o) => o.description) ? 48 : 36, [visible]);
7461
+ const visible = React55__namespace.default.useMemo(() => fGroups.flatMap((g) => g.options), [fGroups]);
7462
+ const rowH = React55__namespace.default.useMemo(() => visible.some((o) => o.description) ? 48 : 36, [visible]);
7447
7463
  const GROUP_H = 30;
7448
- const { rows, totalH } = React54__namespace.default.useMemo(() => {
7464
+ const { rows, totalH } = React55__namespace.default.useMemo(() => {
7449
7465
  if (!virtualized) return { rows: [], totalH: 0 };
7450
7466
  const rows2 = [];
7451
7467
  let off = 0;
@@ -7472,7 +7488,7 @@ function Select({
7472
7488
  }
7473
7489
  return from;
7474
7490
  };
7475
- const place = React54__namespace.default.useCallback(() => {
7491
+ const place = React55__namespace.default.useCallback(() => {
7476
7492
  const el = triggerRef.current;
7477
7493
  if (!el) return;
7478
7494
  const r2 = el.getBoundingClientRect();
@@ -7488,7 +7504,7 @@ function Select({
7488
7504
  flip
7489
7505
  });
7490
7506
  }, [placement, minWidth, matchTriggerWidth]);
7491
- React54__namespace.default.useEffect(() => {
7507
+ React55__namespace.default.useEffect(() => {
7492
7508
  if (!open || !portal) return;
7493
7509
  place();
7494
7510
  const onMove = () => place();
@@ -7506,7 +7522,7 @@ function Select({
7506
7522
  ro?.disconnect();
7507
7523
  };
7508
7524
  }, [open, portal, place]);
7509
- React54__namespace.default.useEffect(() => {
7525
+ React55__namespace.default.useEffect(() => {
7510
7526
  if (!open) return;
7511
7527
  const idx = flat.findIndex((o) => o.value === current);
7512
7528
  setActive(idx >= 0 ? idx : 0);
@@ -7521,19 +7537,19 @@ function Select({
7521
7537
  document.addEventListener("mousedown", onDown);
7522
7538
  return () => document.removeEventListener("mousedown", onDown);
7523
7539
  }, [open]);
7524
- React54__namespace.default.useEffect(() => {
7540
+ React55__namespace.default.useEffect(() => {
7525
7541
  setActive(0);
7526
7542
  }, [query]);
7527
- React54__namespace.default.useEffect(() => {
7543
+ React55__namespace.default.useEffect(() => {
7528
7544
  if (visible.length === 0) return;
7529
7545
  setActive((a) => Math.min(a, visible.length - 1));
7530
7546
  }, [visible.length]);
7531
- React54__namespace.default.useEffect(() => {
7547
+ React55__namespace.default.useEffect(() => {
7532
7548
  if (!open || !virtualized) return;
7533
7549
  const el = listRef.current;
7534
7550
  if (el && el.clientHeight) setListH(el.clientHeight);
7535
7551
  }, [open, virtualized, render]);
7536
- React54__namespace.default.useEffect(() => {
7552
+ React55__namespace.default.useEffect(() => {
7537
7553
  if (!open) return;
7538
7554
  if (!virtualized) {
7539
7555
  ensureVisible2(listRef.current, activeRef.current);
@@ -7550,7 +7566,7 @@ function Select({
7550
7566
  if (next !== el.scrollTop) el.scrollTop = next;
7551
7567
  setScrollTop(next);
7552
7568
  }, [active, open, virtualized, rows, listH]);
7553
- React54__namespace.default.useEffect(() => {
7569
+ React55__namespace.default.useEffect(() => {
7554
7570
  if (open) {
7555
7571
  setRender(true);
7556
7572
  return;
@@ -7559,8 +7575,8 @@ function Select({
7559
7575
  const t = setTimeout(() => setRender(false), 170);
7560
7576
  return () => clearTimeout(t);
7561
7577
  }, [open]);
7562
- const prevOpen = React54__namespace.default.useRef(false);
7563
- React54__namespace.default.useEffect(() => {
7578
+ const prevOpen = React55__namespace.default.useRef(false);
7579
+ React55__namespace.default.useEffect(() => {
7564
7580
  if (prevOpen.current && !open) {
7565
7581
  const ae = typeof document !== "undefined" ? document.activeElement : null;
7566
7582
  if (popRef.current && ae && popRef.current.contains(ae)) triggerRef.current?.focus();
@@ -7713,7 +7729,7 @@ function Select({
7713
7729
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "twc-pop__group", role: "presentation", children: r2.label }, `g${r2.gi}`)
7714
7730
  ) : renderRow(r2.o, r2.idx)),
7715
7731
  vBottom > 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", { "aria-hidden": "true", style: { height: vBottom } }) : null
7716
- ] }) : fGroups.map((g, gi) => /* @__PURE__ */ jsxRuntime.jsxs(React54__namespace.default.Fragment, { children: [
7732
+ ] }) : fGroups.map((g, gi) => /* @__PURE__ */ jsxRuntime.jsxs(React55__namespace.default.Fragment, { children: [
7717
7733
  g.group ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "twc-pop__group", role: "presentation", children: g.group }) : null,
7718
7734
  g.options.map((o) => {
7719
7735
  counter += 1;
@@ -7760,7 +7776,7 @@ function Select({
7760
7776
  {
7761
7777
  type: "button",
7762
7778
  id: fieldId,
7763
- ref: triggerRef,
7779
+ ref: setTriggerRef,
7764
7780
  className: "twc-sel__trigger",
7765
7781
  "data-size": size,
7766
7782
  "data-tone": tone,
@@ -7798,7 +7814,7 @@ function Select({
7798
7814
  ] }),
7799
7815
  error ? /* @__PURE__ */ jsxRuntime.jsx("span", { id: descId, className: "twc-field__error", children: error }) : hint ? /* @__PURE__ */ jsxRuntime.jsx("span", { id: descId, className: "twc-field__hint", children: hint }) : null
7800
7816
  ] });
7801
- }
7817
+ });
7802
7818
  var CURF_CSS = `
7803
7819
  /* Shared input shell (self-contained \u2014 CurrencyField must not depend on the
7804
7820
  Currency component being rendered on the same page to get these styles). */
@@ -7875,21 +7891,21 @@ function CurrencyField({
7875
7891
  ...rest
7876
7892
  }) {
7877
7893
  const __twcStyles = useScopedStyles("twc-curf-styles", CURF_CSS);
7878
- const autoId = React54__namespace.default.useId();
7894
+ const autoId = React55__namespace.default.useId();
7879
7895
  const fieldId = id || autoId;
7880
7896
  const invalid = Boolean(error);
7881
7897
  const curControlled = currency !== void 0;
7882
- const [curInternal, setCurInternal] = React54__namespace.default.useState(defaultCurrency);
7898
+ const [curInternal, setCurInternal] = React55__namespace.default.useState(defaultCurrency);
7883
7899
  const cur = curControlled ? currency : curInternal;
7884
7900
  const meta = CURRENCIES[cur] || CURRENCIES.USD;
7885
7901
  const prec = meta.precision;
7886
7902
  const valControlled = value !== void 0;
7887
- const [valInternal, setValInternal] = React54__namespace.default.useState(() => clampPrecision(String(defaultValue ?? ""), prec));
7903
+ const [valInternal, setValInternal] = React55__namespace.default.useState(() => clampPrecision(String(defaultValue ?? ""), prec));
7888
7904
  const shown = valControlled ? clampPrecision(String(value ?? ""), prec) : valInternal;
7889
7905
  const descId = `${fieldId}-desc`;
7890
7906
  const describedBy = [error || hint ? descId : null, rest["aria-describedby"]].filter(Boolean).join(" ") || void 0;
7891
7907
  const ariaInvalid = invalid ? true : rest["aria-invalid"] ?? void 0;
7892
- React54__namespace.default.useEffect(() => {
7908
+ React55__namespace.default.useEffect(() => {
7893
7909
  if (!valControlled) {
7894
7910
  const clamped = clampPrecision(valInternal, prec);
7895
7911
  if (clamped !== valInternal) {
@@ -7905,7 +7921,7 @@ function CurrencyField({
7905
7921
  }
7906
7922
  }
7907
7923
  }, [prec, cur, shown, value, valControlled, valInternal]);
7908
- const options = React54__namespace.default.useMemo(() => {
7924
+ const options = React55__namespace.default.useMemo(() => {
7909
7925
  if (!currencies) return CURRENCY_OPTIONS;
7910
7926
  return currencies.map((c) => typeof c === "string" ? { value: c, label: `${c} \u2014 ${(CURRENCIES[c] || {}).label || c}` } : c);
7911
7927
  }, [currencies]);
@@ -8053,7 +8069,7 @@ var INPUT_EXTRA_CSS = `
8053
8069
  .twc-field__count { margin-inline-start: auto; font-size: var(--text-xs); color: var(--color-text-muted); font-variant-numeric: tabular-nums; flex: none; }
8054
8070
  .twc-field__count[data-danger="true"] { color: var(--color-danger-subtle-fg); }
8055
8071
  `;
8056
- function Input({
8072
+ var Input = /* @__PURE__ */ React55__namespace.default.forwardRef(function Input2({
8057
8073
  label,
8058
8074
  hint,
8059
8075
  error,
@@ -8071,16 +8087,16 @@ function Input({
8071
8087
  id,
8072
8088
  className = "",
8073
8089
  ...rest
8074
- }) {
8090
+ }, ref) {
8075
8091
  const __twcStyles = useScopedStyles("twc-field-styles", FIELD_CSS2);
8076
8092
  const __twcExtra = useScopedStyles("twc-input-extra-styles", INPUT_EXTRA_CSS);
8077
- const autoId = React54__namespace.default.useId();
8093
+ const autoId = React55__namespace.default.useId();
8078
8094
  const fieldId = id || autoId;
8079
8095
  const descId = `${fieldId}-desc`;
8080
8096
  const countId = `${fieldId}-count`;
8081
8097
  const invalid = Boolean(error);
8082
8098
  const countControlled = rest.value !== void 0;
8083
- const [len2, setLen] = React54__namespace.default.useState(() => String(rest.defaultValue ?? "").length);
8099
+ const [len2, setLen] = React55__namespace.default.useState(() => String(rest.defaultValue ?? "").length);
8084
8100
  const count = countControlled ? String(rest.value ?? "").length : len2;
8085
8101
  const max = rest.maxLength;
8086
8102
  const showCounter = showCount && max != null;
@@ -8089,13 +8105,20 @@ function Input({
8089
8105
  rest.onChange?.(e);
8090
8106
  if ((showCount || clearable) && !countControlled) setLen(e.target.value.length);
8091
8107
  };
8092
- const inputRef = React54__namespace.default.useRef(null);
8093
- const userRef = rest.ref;
8094
- const setRef = React54__namespace.default.useCallback((node) => {
8108
+ const inputRef = React55__namespace.default.useRef(null);
8109
+ const setRef = React55__namespace.default.useCallback((node) => {
8095
8110
  inputRef.current = node;
8096
- if (typeof userRef === "function") userRef(node);
8097
- else if (userRef && typeof userRef === "object") userRef.current = node;
8098
- }, [userRef]);
8111
+ if (typeof ref === "function") {
8112
+ const cleanup = ref(node);
8113
+ if (typeof cleanup === "function") return () => {
8114
+ inputRef.current = null;
8115
+ cleanup();
8116
+ };
8117
+ } else if (ref && typeof ref === "object") {
8118
+ ref.current = node;
8119
+ }
8120
+ return void 0;
8121
+ }, [ref]);
8099
8122
  const clearField = () => {
8100
8123
  const el = inputRef.current;
8101
8124
  if (!el) return;
@@ -8109,7 +8132,7 @@ function Input({
8109
8132
  const ariaInvalid = invalid ? true : rest["aria-invalid"] ?? void 0;
8110
8133
  const describedBy = [error || hint ? descId : null, showCounter ? countId : null, rest["aria-describedby"]].filter(Boolean).join(" ") || void 0;
8111
8134
  const isPassword = type === "password";
8112
- const [revealed, setRevealed] = React54__namespace.default.useState(false);
8135
+ const [revealed, setRevealed] = React55__namespace.default.useState(false);
8113
8136
  const effectiveType = isPassword && revealed ? "text" : type;
8114
8137
  const suffix = rightIcon ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "twc-input__affix", children: rightIcon }) : isPassword ? /* @__PURE__ */ jsxRuntime.jsx(
8115
8138
  "button",
@@ -8174,7 +8197,7 @@ function Input({
8174
8197
  ] }) : null
8175
8198
  ] }) : null
8176
8199
  ] });
8177
- }
8200
+ });
8178
8201
  var MULTI_CSS = `
8179
8202
  .twc-field { display: flex; flex-direction: column; gap: var(--space-1-5); font-family: var(--font-sans); }
8180
8203
  .twc-field__label { font-size: var(--text-sm); font-weight: var(--font-semibold); color: var(--color-text); display: flex; gap: 4px; align-items: center; }
@@ -8291,7 +8314,7 @@ function ensureVisible3(list, el) {
8291
8314
  if (top < list.scrollTop) list.scrollTop = top - 4;
8292
8315
  else if (bottom > list.scrollTop + list.clientHeight) list.scrollTop = bottom - list.clientHeight + 4;
8293
8316
  }
8294
- function MultiSelect({
8317
+ var MultiSelect = /* @__PURE__ */ React55__namespace.default.forwardRef(function MultiSelect2({
8295
8318
  label,
8296
8319
  hint,
8297
8320
  error,
@@ -8323,37 +8346,38 @@ function MultiSelect({
8323
8346
  onFocus,
8324
8347
  onKeyDown,
8325
8348
  ...rest
8326
- }) {
8349
+ }, ref) {
8327
8350
  const __twcStyles = useScopedStyles("twc-ms-styles", MULTI_CSS);
8328
8351
  if (virtualizedProp && renderOption) warnOnce("multiselect-renderoption-virtualized", "twico-ui MultiSelect: `renderOption` disables `virtualized` \u2014 custom rows aren't a fixed height.");
8329
8352
  const virtualized = virtualizedProp && !renderOption;
8330
- const groups = React54__namespace.default.useMemo(() => normalizeGroups3(options), [options]);
8331
- const flat = React54__namespace.default.useMemo(() => groups.flatMap((g) => g.options), [groups]);
8332
- const autoId = React54__namespace.default.useId();
8353
+ const groups = React55__namespace.default.useMemo(() => normalizeGroups3(options), [options]);
8354
+ const flat = React55__namespace.default.useMemo(() => groups.flatMap((g) => g.options), [groups]);
8355
+ const autoId = React55__namespace.default.useId();
8333
8356
  const fieldId = id || autoId;
8334
- const [internal, setInternal] = React54__namespace.default.useState(defaultValue);
8357
+ const [internal, setInternal] = React55__namespace.default.useState(defaultValue);
8335
8358
  const selected = value !== void 0 ? value : internal;
8336
- const [open, setOpen] = React54__namespace.default.useState(false);
8337
- const [query, setQuery] = React54__namespace.default.useState("");
8338
- const [active, setActive] = React54__namespace.default.useState(0);
8339
- const [coords, setCoords] = React54__namespace.default.useState(null);
8340
- const [scrollTop, setScrollTop] = React54__namespace.default.useState(0);
8341
- const [listH, setListH] = React54__namespace.default.useState(260);
8342
- const wrapRef = React54__namespace.default.useRef(null);
8343
- const controlRef = React54__namespace.default.useRef(null);
8344
- const inputRef = React54__namespace.default.useRef(null);
8345
- const popRef = React54__namespace.default.useRef(null);
8346
- const listRef = React54__namespace.default.useRef(null);
8347
- const activeRef = React54__namespace.default.useRef(null);
8348
- const fGroups = React54__namespace.default.useMemo(() => {
8359
+ const [open, setOpen] = React55__namespace.default.useState(false);
8360
+ const [query, setQuery] = React55__namespace.default.useState("");
8361
+ const [active, setActive] = React55__namespace.default.useState(0);
8362
+ const [coords, setCoords] = React55__namespace.default.useState(null);
8363
+ const [scrollTop, setScrollTop] = React55__namespace.default.useState(0);
8364
+ const [listH, setListH] = React55__namespace.default.useState(260);
8365
+ const wrapRef = React55__namespace.default.useRef(null);
8366
+ const controlRef = React55__namespace.default.useRef(null);
8367
+ const inputRef = React55__namespace.default.useRef(null);
8368
+ const setInputRef = useMergedRef(inputRef, ref);
8369
+ const popRef = React55__namespace.default.useRef(null);
8370
+ const listRef = React55__namespace.default.useRef(null);
8371
+ const activeRef = React55__namespace.default.useRef(null);
8372
+ const fGroups = React55__namespace.default.useMemo(() => {
8349
8373
  const q = query.trim();
8350
8374
  const fn = filter === false ? null : typeof filter === "function" ? filter : matches2;
8351
8375
  return groups.map((g) => ({ group: g.group, options: fn ? g.options.filter((o) => fn(o, q)) : g.options })).filter((g) => g.options.length);
8352
8376
  }, [groups, query, filter]);
8353
- const visible = React54__namespace.default.useMemo(() => fGroups.flatMap((g) => g.options), [fGroups]);
8354
- const rowH = React54__namespace.default.useMemo(() => visible.some((o) => o.description) ? 48 : 36, [visible]);
8377
+ const visible = React55__namespace.default.useMemo(() => fGroups.flatMap((g) => g.options), [fGroups]);
8378
+ const rowH = React55__namespace.default.useMemo(() => visible.some((o) => o.description) ? 48 : 36, [visible]);
8355
8379
  const GROUP_H = 30;
8356
- const { rows, totalH } = React54__namespace.default.useMemo(() => {
8380
+ const { rows, totalH } = React55__namespace.default.useMemo(() => {
8357
8381
  if (!virtualized) return { rows: [], totalH: 0 };
8358
8382
  const rows2 = [];
8359
8383
  let off = 0;
@@ -8381,7 +8405,7 @@ function MultiSelect({
8381
8405
  }
8382
8406
  return from;
8383
8407
  };
8384
- const place = React54__namespace.default.useCallback(() => {
8408
+ const place = React55__namespace.default.useCallback(() => {
8385
8409
  const el = controlRef.current;
8386
8410
  if (!el) return;
8387
8411
  const r2 = el.getBoundingClientRect();
@@ -8396,7 +8420,7 @@ function MultiSelect({
8396
8420
  flip
8397
8421
  });
8398
8422
  }, [placement, minWidth]);
8399
- React54__namespace.default.useEffect(() => {
8423
+ React55__namespace.default.useEffect(() => {
8400
8424
  if (!open || !portal) return;
8401
8425
  place();
8402
8426
  const onMove = () => place();
@@ -8414,7 +8438,7 @@ function MultiSelect({
8414
8438
  ro?.disconnect();
8415
8439
  };
8416
8440
  }, [open, portal, place]);
8417
- React54__namespace.default.useEffect(() => {
8441
+ React55__namespace.default.useEffect(() => {
8418
8442
  if (!open) return;
8419
8443
  const onDown = (e) => {
8420
8444
  if (wrapRef.current && wrapRef.current.contains(e.target)) return;
@@ -8425,19 +8449,19 @@ function MultiSelect({
8425
8449
  document.addEventListener("mousedown", onDown);
8426
8450
  return () => document.removeEventListener("mousedown", onDown);
8427
8451
  }, [open]);
8428
- React54__namespace.default.useEffect(() => {
8452
+ React55__namespace.default.useEffect(() => {
8429
8453
  setActive(0);
8430
8454
  }, [query]);
8431
- React54__namespace.default.useEffect(() => {
8455
+ React55__namespace.default.useEffect(() => {
8432
8456
  if (visible.length === 0) return;
8433
8457
  setActive((a) => Math.min(a, visible.length - 1));
8434
8458
  }, [visible.length]);
8435
- React54__namespace.default.useEffect(() => {
8459
+ React55__namespace.default.useEffect(() => {
8436
8460
  if (!open || !virtualized) return;
8437
8461
  const el = listRef.current;
8438
8462
  if (el && el.clientHeight) setListH(el.clientHeight);
8439
8463
  }, [open, virtualized]);
8440
- React54__namespace.default.useEffect(() => {
8464
+ React55__namespace.default.useEffect(() => {
8441
8465
  if (!open) return;
8442
8466
  if (!virtualized) {
8443
8467
  ensureVisible3(listRef.current, activeRef.current);
@@ -8561,7 +8585,7 @@ function MultiSelect({
8561
8585
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "twc-pop__group", role: "presentation", children: r2.label }, `g${r2.gi}`)
8562
8586
  ) : renderRow(r2.o, r2.idx)),
8563
8587
  vBottom > 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", { "aria-hidden": "true", style: { height: vBottom } }) : null
8564
- ] }) : fGroups.map((g, gi) => /* @__PURE__ */ jsxRuntime.jsxs(React54__namespace.default.Fragment, { children: [
8588
+ ] }) : fGroups.map((g, gi) => /* @__PURE__ */ jsxRuntime.jsxs(React55__namespace.default.Fragment, { children: [
8565
8589
  g.group ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "twc-pop__group", role: "presentation", children: g.group }) : null,
8566
8590
  g.options.map((o) => {
8567
8591
  counter += 1;
@@ -8634,7 +8658,7 @@ function MultiSelect({
8634
8658
  /* @__PURE__ */ jsxRuntime.jsx(
8635
8659
  "input",
8636
8660
  {
8637
- ref: inputRef,
8661
+ ref: setInputRef,
8638
8662
  id: fieldId,
8639
8663
  className: "twc-ms__input",
8640
8664
  role: "combobox",
@@ -8693,7 +8717,7 @@ function MultiSelect({
8693
8717
  ] }),
8694
8718
  error ? /* @__PURE__ */ jsxRuntime.jsx("span", { id: descId, className: "twc-field__error", children: error }) : hint ? /* @__PURE__ */ jsxRuntime.jsx("span", { id: descId, className: "twc-field__hint", children: hint }) : null
8695
8719
  ] });
8696
- }
8720
+ });
8697
8721
  var PAGINATION_CSS = `
8698
8722
  .twc-pagination { display: inline-flex; align-items: center; gap: 4px; font-family: var(--font-sans); }
8699
8723
  .twc-page {
@@ -8768,7 +8792,7 @@ function Pagination({
8768
8792
  }
8769
8793
  const jumperEnabled = showPageJumper ?? showJumper;
8770
8794
  const __twcStyles = useScopedStyles("twc-pagination-styles", PAGINATION_CSS);
8771
- const [internal, setInternal] = React54__namespace.default.useState(defaultPage);
8795
+ const [internal, setInternal] = React55__namespace.default.useState(defaultPage);
8772
8796
  const page = pageProp !== void 0 ? pageProp : internal;
8773
8797
  const pages = buildPages(page, total, siblings, boundaries);
8774
8798
  const go = (p) => {
@@ -8776,7 +8800,7 @@ function Pagination({
8776
8800
  if (pageProp === void 0) setInternal(p);
8777
8801
  onChange?.(p);
8778
8802
  };
8779
- const [jump, setJump] = React54__namespace.default.useState("");
8803
+ const [jump, setJump] = React55__namespace.default.useState("");
8780
8804
  const submitJump = () => {
8781
8805
  const n = parseInt(jump, 10);
8782
8806
  if (!Number.isNaN(n)) go(Math.min(Math.max(n, 1), total));
@@ -9252,8 +9276,22 @@ var DT_CSS = `
9252
9276
  .twc-dt__row:hover .twc-dt__row-resizer::after { background: var(--color-border-strong); }
9253
9277
  .twc-dt__row-resizer:hover::after { background: var(--color-primary); }
9254
9278
 
9279
+ /* #481: the cell background reads --twc-dt-row-bg, which getRowStyle sets on the <tr>. It has to come
9280
+ through a custom property rather than straight off the row, because this rule paints an OPAQUE
9281
+ --color-surface on every cell: a background set on the <tr> would sit behind it and never show,
9282
+ which would make the commonest use of a row-style hook silently do nothing. Cells in a pinned
9283
+ COLUMN inherit it too, so a tinted row does not develop a hole where a sticky column scrolls over
9284
+ it.
9285
+ Layering: this rule is (0,1,0), the LOWEST specificity of any background in this sheet, so the
9286
+ row tint is the bottom layer above the plain surface and every built-in state covers it - hover,
9287
+ row selection, data-active, data-pinned-row, data-row-grabbed, the diff data-op washes, cell
9288
+ selection/active, inline editing (each (0,3,0), (0,4,0) for the pinned-column twins, or (0,2,0)
9289
+ for the cell-level ones) - and an inline per-cell cellStyle
9290
+ covers them all. That is the intended rule, not an accident of ordering: a row tint is a
9291
+ data-derived wash, and no data wash should be able to hide an interaction state. Consumers who
9292
+ need a tint that outranks those use getRowClassName and a rule of their own. */
9255
9293
  .twc-dt__td { padding: 0 12px; height: var(--_rowh, 44px); border-bottom: var(--border-thin) solid var(--color-divider);
9256
- font-size: var(--text-sm); color: var(--color-text); background: var(--color-surface);
9294
+ font-size: var(--text-sm); color: var(--color-text); background: var(--twc-dt-row-bg, var(--color-surface));
9257
9295
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 0; }
9258
9296
  /* Wrap-text columns: content flows onto multiple lines (the row grows down) instead of
9259
9297
  clipping to one line. height stays a per-row minimum, so single-line cells are unchanged. */
@@ -9639,27 +9677,27 @@ function renderCombined(srcCols, row, cfg) {
9639
9677
  const v = getColVal(sc, row);
9640
9678
  if (v == null || v === "") return;
9641
9679
  const disp = sc.valueFormatter ? sc.valueFormatter(v, row) : v;
9642
- const label = cfg.labels ? React54__namespace.default.createElement("span", { className: "twc-dt__combine-label" }, colLabel(sc) + ": ") : null;
9643
- if (count > 0 && cfg.layout !== "stack") nodes.push(React54__namespace.default.createElement("span", { key: "sep" + idx, className: "twc-dt__combine-sep", "aria-hidden": "true" }, cfg.separator));
9644
- nodes.push(React54__namespace.default.createElement("span", { key: idx, className: "twc-dt__combine-item" }, label, disp));
9680
+ const label = cfg.labels ? React55__namespace.default.createElement("span", { className: "twc-dt__combine-label" }, colLabel(sc) + ": ") : null;
9681
+ if (count > 0 && cfg.layout !== "stack") nodes.push(React55__namespace.default.createElement("span", { key: "sep" + idx, className: "twc-dt__combine-sep", "aria-hidden": "true" }, cfg.separator));
9682
+ nodes.push(React55__namespace.default.createElement("span", { key: idx, className: "twc-dt__combine-item" }, label, disp));
9645
9683
  count++;
9646
9684
  });
9647
9685
  if (!nodes.length) return "";
9648
- return React54__namespace.default.createElement("span", { className: cfg.layout === "stack" ? "twc-dt__combine twc-dt__combine--stack" : "twc-dt__combine" }, nodes);
9686
+ return React55__namespace.default.createElement("span", { className: cfg.layout === "stack" ? "twc-dt__combine twc-dt__combine--stack" : "twc-dt__combine" }, nodes);
9649
9687
  }
9650
9688
  var diffValueNode = (col, v, row) => col.renderCell ? col.renderCell(v, row) : col.valueFormatter ? col.valueFormatter(v, row) : v == null ? "" : v;
9651
9689
  function renderDiffCell(col, val, row) {
9652
9690
  const meta = row && row.__diffMeta;
9653
9691
  if (!meta) return diffValueNode(col, val, row);
9654
- if (meta.op === "removed") return React54__namespace.default.createElement("span", { className: "twc-dt__diff-old" }, diffValueNode(col, getColVal(col, meta.from), meta.from));
9655
- if (meta.op === "added") return React54__namespace.default.createElement("span", { className: "twc-dt__diff-new" }, diffValueNode(col, getColVal(col, meta.to), meta.to));
9692
+ if (meta.op === "removed") return React55__namespace.default.createElement("span", { className: "twc-dt__diff-old" }, diffValueNode(col, getColVal(col, meta.from), meta.from));
9693
+ if (meta.op === "added") return React55__namespace.default.createElement("span", { className: "twc-dt__diff-new" }, diffValueNode(col, getColVal(col, meta.to), meta.to));
9656
9694
  if (meta.op === "modified" && meta.changed.has(col.field)) {
9657
- return React54__namespace.default.createElement(
9695
+ return React55__namespace.default.createElement(
9658
9696
  "span",
9659
9697
  { className: "twc-dt__diff-change" },
9660
- React54__namespace.default.createElement("span", { className: "twc-dt__diff-old" }, diffValueNode(col, getColVal(col, meta.from), meta.from)),
9661
- React54__namespace.default.createElement("span", { className: "twc-dt__diff-arrow", "aria-hidden": "true" }, "\u2192"),
9662
- React54__namespace.default.createElement("span", { className: "twc-dt__diff-new" }, diffValueNode(col, getColVal(col, meta.to), meta.to))
9698
+ React55__namespace.default.createElement("span", { className: "twc-dt__diff-old" }, diffValueNode(col, getColVal(col, meta.from), meta.from)),
9699
+ React55__namespace.default.createElement("span", { className: "twc-dt__diff-arrow", "aria-hidden": "true" }, "\u2192"),
9700
+ React55__namespace.default.createElement("span", { className: "twc-dt__diff-new" }, diffValueNode(col, getColVal(col, meta.to), meta.to))
9663
9701
  );
9664
9702
  }
9665
9703
  return diffValueNode(col, val, row);
@@ -9676,7 +9714,7 @@ var DIFF_OP_COLUMN = {
9676
9714
  resizable: true,
9677
9715
  wrappable: false,
9678
9716
  hideable: false,
9679
- renderCell: (v) => v && DIFF_OPS[v] ? React54__namespace.default.createElement(Badge, { size: "sm", variant: "soft", tone: DIFF_OPS[v].tone }, DIFF_OPS[v].label) : null,
9717
+ renderCell: (v) => v && DIFF_OPS[v] ? React55__namespace.default.createElement(Badge, { size: "sm", variant: "soft", tone: DIFF_OPS[v].tone }, DIFF_OPS[v].label) : null,
9680
9718
  exportValue: (v) => v && DIFF_OPS[v] ? DIFF_OPS[v].label : ""
9681
9719
  };
9682
9720
  function testFilter(raw, op, target, type) {
@@ -9749,9 +9787,9 @@ function runDatatableQuery(rows, query, options = {}) {
9749
9787
  return { rows: page, total, filtered: out };
9750
9788
  }
9751
9789
  function useFloating() {
9752
- const [pos, setPos] = React54__namespace.default.useState(null);
9753
- const cfg = React54__namespace.default.useRef(null);
9754
- const place = React54__namespace.default.useCallback(() => {
9790
+ const [pos, setPos] = React55__namespace.default.useState(null);
9791
+ const cfg = React55__namespace.default.useRef(null);
9792
+ const place = React55__namespace.default.useCallback(() => {
9755
9793
  const c = cfg.current;
9756
9794
  if (!c || !c.el || !c.el.isConnected) return null;
9757
9795
  const r2 = c.el.getBoundingClientRect();
@@ -9762,17 +9800,17 @@ function useFloating() {
9762
9800
  const top = r2.bottom + 6;
9763
9801
  return { top, left, width: c.width, anchorX: r2.left + r2.width / 2, maxHeight: Math.max(180, vh - top - M) };
9764
9802
  }, []);
9765
- const open = React54__namespace.default.useCallback((el, align = "left", width = 220) => {
9803
+ const open = React55__namespace.default.useCallback((el, align = "left", width = 220) => {
9766
9804
  cfg.current = { el, align, width };
9767
9805
  const p = place();
9768
9806
  if (p) setPos(p);
9769
9807
  }, [place]);
9770
- const close = React54__namespace.default.useCallback(() => {
9808
+ const close = React55__namespace.default.useCallback(() => {
9771
9809
  cfg.current = null;
9772
9810
  setPos(null);
9773
9811
  }, []);
9774
9812
  const isOpen = pos != null;
9775
- React54__namespace.default.useEffect(() => {
9813
+ React55__namespace.default.useEffect(() => {
9776
9814
  if (!isOpen) return void 0;
9777
9815
  const update = () => {
9778
9816
  const p = place();
@@ -9796,11 +9834,11 @@ function Caret({ pos }) {
9796
9834
  return /* @__PURE__ */ jsxRuntime.jsx("span", { className: "twc-dt__caret", style: { left } });
9797
9835
  }
9798
9836
  function AsyncFilterValue({ col, value, onChange }) {
9799
- const [opts, setOpts] = React54__namespace.default.useState([]);
9800
- const [loading, setLoading] = React54__namespace.default.useState(false);
9801
- const reqRef = React54__namespace.default.useRef(0);
9802
- const debRef = React54__namespace.default.useRef();
9803
- const load = React54__namespace.default.useCallback((query) => {
9837
+ const [opts, setOpts] = React55__namespace.default.useState([]);
9838
+ const [loading, setLoading] = React55__namespace.default.useState(false);
9839
+ const reqRef = React55__namespace.default.useRef(0);
9840
+ const debRef = React55__namespace.default.useRef();
9841
+ const load = React55__namespace.default.useCallback((query) => {
9804
9842
  const id = ++reqRef.current;
9805
9843
  setLoading(true);
9806
9844
  Promise.resolve(col.loadValueOptions(query)).then(
@@ -9815,16 +9853,16 @@ function AsyncFilterValue({ col, value, onChange }) {
9815
9853
  }
9816
9854
  );
9817
9855
  }, [col]);
9818
- React54__namespace.default.useEffect(() => {
9856
+ React55__namespace.default.useEffect(() => {
9819
9857
  load("");
9820
9858
  return () => clearTimeout(debRef.current);
9821
9859
  }, [load]);
9822
- const onInput = React54__namespace.default.useCallback((q) => {
9860
+ const onInput = React55__namespace.default.useCallback((q) => {
9823
9861
  clearTimeout(debRef.current);
9824
9862
  debRef.current = setTimeout(() => load(q), 250);
9825
9863
  }, [load]);
9826
9864
  const selected = Array.isArray(value) ? value : [];
9827
- const merged = React54__namespace.default.useMemo(() => {
9865
+ const merged = React55__namespace.default.useMemo(() => {
9828
9866
  const seen2 = new Set(opts.map((o) => o.value));
9829
9867
  return [...selected.filter((v) => !seen2.has(v)).map((v) => ({ value: v, label: String(v) })), ...opts];
9830
9868
  }, [opts, selected]);
@@ -9843,9 +9881,9 @@ function AsyncFilterValue({ col, value, onChange }) {
9843
9881
  );
9844
9882
  }
9845
9883
  function EditCell({ col, value, options, onChange, onCommit, onCommitValue, onCancel, onKeyDown }) {
9846
- const ref = React54__namespace.default.useRef(null);
9884
+ const ref = React55__namespace.default.useRef(null);
9847
9885
  const isSelect = col.editType === "select" || options && col.editType !== "text";
9848
- React54__namespace.default.useEffect(() => {
9886
+ React55__namespace.default.useEffect(() => {
9849
9887
  if (isSelect) {
9850
9888
  const t = setTimeout(() => ref.current?.querySelector(".twc-sel__trigger")?.click(), 0);
9851
9889
  return () => clearTimeout(t);
@@ -10020,6 +10058,8 @@ function Datatable({
10020
10058
  onColumnVisibilityChange,
10021
10059
  batchActions = [],
10022
10060
  onRowSelectionChange,
10061
+ getRowStyle,
10062
+ getRowClassName,
10023
10063
  showExport = false,
10024
10064
  showDensity = false,
10025
10065
  showPivot = false,
@@ -10108,21 +10148,21 @@ function Datatable({
10108
10148
  }) {
10109
10149
  const __twcStyles = useScopedStyles("twc-dt-styles", DT_CSS);
10110
10150
  const isDiff = !!diff;
10111
- const [diffOnly, setDiffOnly] = React54__namespace.default.useState(diff && diff.onlyChanged !== void 0 ? diff.onlyChanged : true);
10151
+ const [diffOnly, setDiffOnly] = React55__namespace.default.useState(diff && diff.onlyChanged !== void 0 ? diff.onlyChanged : true);
10112
10152
  const diffRowKey = diff && diff.rowKey || rowKeyProp || ((r2) => r2 == null ? r2 : r2.id);
10113
- const diffData = React54__namespace.default.useMemo(
10153
+ const diffData = React55__namespace.default.useMemo(
10114
10154
  () => isDiff ? classifyDiff(diff.from || [], diff.to || [], columnsProp, diffRowKey, { moveDetection: diff.moveDetection, compare: diff.compare }) : null,
10115
10155
  [isDiff, diff, columnsProp]
10116
10156
  // eslint-disable-line react-hooks/exhaustive-deps
10117
10157
  );
10118
- const onClassifiedRef = React54__namespace.default.useRef(diff && diff.onClassified);
10158
+ const onClassifiedRef = React55__namespace.default.useRef(diff && diff.onClassified);
10119
10159
  onClassifiedRef.current = diff && diff.onClassified;
10120
- React54__namespace.default.useEffect(() => {
10160
+ React55__namespace.default.useEffect(() => {
10121
10161
  if (diffData && onClassifiedRef.current) onClassifiedRef.current(diffData.counts);
10122
10162
  }, [diffData]);
10123
- const diffRowKeyFn = React54__namespace.default.useCallback((r2) => r2.__diffKey, []);
10124
- const [userCombine, setUserCombine] = React54__namespace.default.useState({});
10125
- const columns = React54__namespace.default.useMemo(
10163
+ const diffRowKeyFn = React55__namespace.default.useCallback((r2) => r2.__diffKey, []);
10164
+ const [userCombine, setUserCombine] = React55__namespace.default.useState({});
10165
+ const columns = React55__namespace.default.useMemo(
10126
10166
  () => {
10127
10167
  if (!isDiff) return columnsProp;
10128
10168
  const byField = {};
@@ -10135,12 +10175,12 @@ function Datatable({
10135
10175
  },
10136
10176
  [isDiff, columnsProp, userCombine]
10137
10177
  );
10138
- const rows = React54__namespace.default.useMemo(
10178
+ const rows = React55__namespace.default.useMemo(
10139
10179
  () => isDiff ? diffData.rows.filter((r2) => !diffOnly || r2.op !== "unchanged").map((r2) => ({ ...r2.to || r2.from, __diffop: r2.op, __diffMeta: r2, __diffKey: r2.key })) : rowsProp,
10140
10180
  [isDiff, diffData, diffOnly, rowsProp]
10141
10181
  );
10142
10182
  const rowKey = isDiff ? diffRowKeyFn : rowKeyProp;
10143
- const cols = React54__namespace.default.useMemo(() => {
10183
+ const cols = React55__namespace.default.useMemo(() => {
10144
10184
  const seenFields = /* @__PURE__ */ new Map();
10145
10185
  for (const c of columns) {
10146
10186
  if (!c || c.field == null) continue;
@@ -10208,9 +10248,9 @@ function Datatable({
10208
10248
  }
10209
10249
  return out;
10210
10250
  }, [columns, rowPinning, userCombine, defaultColumn]);
10211
- const _autoKey = React54__namespace.default.useRef();
10251
+ const _autoKey = React55__namespace.default.useRef();
10212
10252
  if (!_autoKey.current) _autoKey.current = { map: /* @__PURE__ */ new WeakMap(), n: 0 };
10213
- const keyOf = React54__namespace.default.useCallback(rowKey || ((r2, i) => {
10253
+ const keyOf = React55__namespace.default.useCallback(rowKey || ((r2, i) => {
10214
10254
  if (r2 != null && r2.id != null) return r2.id;
10215
10255
  if (r2 != null && typeof r2 === "object") {
10216
10256
  const m = _autoKey.current.map;
@@ -10223,19 +10263,19 @@ function Datatable({
10223
10263
  }
10224
10264
  return i;
10225
10265
  }), [rowKey]);
10226
- const [sort, setSort] = React54__namespace.default.useState(null);
10227
- const [filters, setFilters] = React54__namespace.default.useState([]);
10266
+ const [sort, setSort] = React55__namespace.default.useState(null);
10267
+ const [filters, setFilters] = React55__namespace.default.useState([]);
10228
10268
  const filterLogicControlled = filterLogicProp !== void 0;
10229
- const [filterLogicInternal, setFilterLogicInternal] = React54__namespace.default.useState(defaultFilterLogic === "or" ? "or" : "and");
10269
+ const [filterLogicInternal, setFilterLogicInternal] = React55__namespace.default.useState(defaultFilterLogic === "or" ? "or" : "and");
10230
10270
  const filterLogic = filterLogicControlled ? filterLogicProp === "or" ? "or" : "and" : filterLogicInternal;
10231
10271
  const setFilterLogic = (next) => {
10232
10272
  const v = next === "or" ? "or" : "and";
10233
10273
  if (!filterLogicControlled) setFilterLogicInternal(v);
10234
10274
  onFilterLogicChange?.(v);
10235
10275
  };
10236
- const [hidden, setHidden] = React54__namespace.default.useState(() => /* @__PURE__ */ new Set());
10237
- const [showRowNum, setShowRowNum] = React54__namespace.default.useState(rowNumbers);
10238
- const [wrapped, setWrapped] = React54__namespace.default.useState(() => new Set((columns || []).filter((c) => c.wrapText).map((c) => c.field)));
10276
+ const [hidden, setHidden] = React55__namespace.default.useState(() => /* @__PURE__ */ new Set());
10277
+ const [showRowNum, setShowRowNum] = React55__namespace.default.useState(rowNumbers);
10278
+ const [wrapped, setWrapped] = React55__namespace.default.useState(() => new Set((columns || []).filter((c) => c.wrapText).map((c) => c.field)));
10239
10279
  const toggleWrap = (field) => setWrapped((w) => {
10240
10280
  const n = new Set(w);
10241
10281
  n.has(field) ? n.delete(field) : n.add(field);
@@ -10277,7 +10317,7 @@ function Datatable({
10277
10317
  });
10278
10318
  closeCombineEditor();
10279
10319
  };
10280
- const [pins, setPins] = React54__namespace.default.useState(() => {
10320
+ const [pins, setPins] = React55__namespace.default.useState(() => {
10281
10321
  const left = [], right = [];
10282
10322
  columns.forEach((c) => {
10283
10323
  if (c.pinned === "left") left.push(c.field);
@@ -10285,23 +10325,23 @@ function Datatable({
10285
10325
  });
10286
10326
  return { left, right };
10287
10327
  });
10288
- const [density, setDensity] = React54__namespace.default.useState(densityProp);
10289
- const [internalQuick, setInternalQuick] = React54__namespace.default.useState("");
10328
+ const [density, setDensity] = React55__namespace.default.useState(densityProp);
10329
+ const [internalQuick, setInternalQuick] = React55__namespace.default.useState("");
10290
10330
  const quick = quickFilter !== void 0 ? quickFilter : internalQuick;
10291
10331
  const commitQuick = (v) => {
10292
10332
  onQuickFilterChange?.(v);
10293
10333
  if (quickFilter === void 0) setInternalQuick(v);
10294
10334
  commitPage(0);
10295
10335
  };
10296
- const [selected, setSelected] = React54__namespace.default.useState(() => /* @__PURE__ */ new Set());
10297
- const [activeRow, setActiveRow] = React54__namespace.default.useState(null);
10336
+ const [selected, setSelected] = React55__namespace.default.useState(() => /* @__PURE__ */ new Set());
10337
+ const [activeRow, setActiveRow] = React55__namespace.default.useState(null);
10298
10338
  const activeRowControlled = activeRowId !== void 0;
10299
10339
  const activeRowVal = activeRowControlled ? activeRowId : activeRow;
10300
- const [internalActiveCell, setInternalActiveCell] = React54__namespace.default.useState(null);
10340
+ const [internalActiveCell, setInternalActiveCell] = React55__namespace.default.useState(null);
10301
10341
  const activeCellControlled = activeCell !== void 0;
10302
10342
  const activeCellVal = activeCellControlled ? activeCell : internalActiveCell;
10303
- const selfCellSigRef = React54__namespace.default.useRef(null);
10304
- const jumpAppliedRef = React54__namespace.default.useRef(null);
10343
+ const selfCellSigRef = React55__namespace.default.useRef(null);
10344
+ const jumpAppliedRef = React55__namespace.default.useRef(null);
10305
10345
  const commitActiveCell = (next) => {
10306
10346
  const sig = next ? next.key + "\0" + next.field : null;
10307
10347
  selfCellSigRef.current = sig;
@@ -10309,10 +10349,10 @@ function Datatable({
10309
10349
  onActiveCellChange?.(next);
10310
10350
  if (!activeCellControlled) setInternalActiveCell(next);
10311
10351
  };
10312
- const [anchorCell, setAnchorCell] = React54__namespace.default.useState(null);
10313
- const gridId = React54__namespace.default.useId();
10314
- const [internalPage, setInternalPage] = React54__namespace.default.useState(0);
10315
- const [internalRpp, setInternalRpp] = React54__namespace.default.useState(pageSize > 0 ? pageSize : 10);
10352
+ const [anchorCell, setAnchorCell] = React55__namespace.default.useState(null);
10353
+ const gridId = React55__namespace.default.useId();
10354
+ const [internalPage, setInternalPage] = React55__namespace.default.useState(0);
10355
+ const [internalRpp, setInternalRpp] = React55__namespace.default.useState(pageSize > 0 ? pageSize : 10);
10316
10356
  const pageControlled = page !== void 0;
10317
10357
  const pageSizeControlled = onPageSizeChange !== void 0;
10318
10358
  const pageVal = pageControlled ? page : internalPage;
@@ -10326,42 +10366,42 @@ function Datatable({
10326
10366
  if (!pageSizeControlled) setInternalRpp(next);
10327
10367
  commitPage(0);
10328
10368
  };
10329
- const [colQuery, setColQuery] = React54__namespace.default.useState("");
10330
- const [widths, setWidths] = React54__namespace.default.useState({});
10331
- const [order, setOrder] = React54__namespace.default.useState(() => columns.map((c) => c.field));
10332
- const [drag, setDrag] = React54__namespace.default.useState({ from: null, over: null, after: false });
10333
- const [aggOn, setAggOn] = React54__namespace.default.useState(showAggregation);
10334
- const [focus, setFocus] = React54__namespace.default.useState({ r: 0, c: 0 });
10335
- const [interacting, setInteracting] = React54__namespace.default.useState(null);
10336
- const gridRef = React54__namespace.default.useRef(null);
10337
- const [groupBy, setGroupBy] = React54__namespace.default.useState(rowGrouping || []);
10338
- const [internalCollapsed, setInternalCollapsed] = React54__namespace.default.useState(() => new Set(defaultCollapsedGroups));
10369
+ const [colQuery, setColQuery] = React55__namespace.default.useState("");
10370
+ const [widths, setWidths] = React55__namespace.default.useState({});
10371
+ const [order, setOrder] = React55__namespace.default.useState(() => columns.map((c) => c.field));
10372
+ const [drag, setDrag] = React55__namespace.default.useState({ from: null, over: null, after: false });
10373
+ const [aggOn, setAggOn] = React55__namespace.default.useState(showAggregation);
10374
+ const [focus, setFocus] = React55__namespace.default.useState({ r: 0, c: 0 });
10375
+ const [interacting, setInteracting] = React55__namespace.default.useState(null);
10376
+ const gridRef = React55__namespace.default.useRef(null);
10377
+ const [groupBy, setGroupBy] = React55__namespace.default.useState(rowGrouping || []);
10378
+ const [internalCollapsed, setInternalCollapsed] = React55__namespace.default.useState(() => new Set(defaultCollapsedGroups));
10339
10379
  const collapsedControlled = collapsedGroups !== void 0;
10340
- const collapsedSet = React54__namespace.default.useMemo(() => new Set(collapsedControlled ? collapsedGroups : internalCollapsed), [collapsedControlled, collapsedGroups, internalCollapsed]);
10341
- const collapsedKey = React54__namespace.default.useMemo(() => [...collapsedSet].sort().join("\0"), [collapsedSet]);
10342
- const [internalExpanded, setInternalExpanded] = React54__namespace.default.useState(() => /* @__PURE__ */ new Set());
10380
+ const collapsedSet = React55__namespace.default.useMemo(() => new Set(collapsedControlled ? collapsedGroups : internalCollapsed), [collapsedControlled, collapsedGroups, internalCollapsed]);
10381
+ const collapsedKey = React55__namespace.default.useMemo(() => [...collapsedSet].sort().join("\0"), [collapsedSet]);
10382
+ const [internalExpanded, setInternalExpanded] = React55__namespace.default.useState(() => /* @__PURE__ */ new Set());
10343
10383
  const expandControlled = expandedRowIds !== void 0;
10344
- const expandedSet = React54__namespace.default.useMemo(
10384
+ const expandedSet = React55__namespace.default.useMemo(
10345
10385
  () => new Set(expandControlled ? expandedRowIds : internalExpanded),
10346
10386
  [expandControlled, expandedRowIds, internalExpanded]
10347
10387
  );
10348
- const expandedKey = React54__namespace.default.useMemo(() => JSON.stringify([...expandedSet].sort()), [expandedSet]);
10349
- const [pinnedRows, setPinnedRows] = React54__namespace.default.useState({ top: [], bottom: [] });
10350
- const [headH, setHeadH] = React54__namespace.default.useState(41);
10351
- const theadRef = React54__namespace.default.useRef(null);
10352
- const [rowOrder, setRowOrder] = React54__namespace.default.useState(null);
10353
- React54__namespace.default.useEffect(() => {
10388
+ const expandedKey = React55__namespace.default.useMemo(() => JSON.stringify([...expandedSet].sort()), [expandedSet]);
10389
+ const [pinnedRows, setPinnedRows] = React55__namespace.default.useState({ top: [], bottom: [] });
10390
+ const [headH, setHeadH] = React55__namespace.default.useState(41);
10391
+ const theadRef = React55__namespace.default.useRef(null);
10392
+ const [rowOrder, setRowOrder] = React55__namespace.default.useState(null);
10393
+ React55__namespace.default.useEffect(() => {
10354
10394
  if (serverMode) setRowOrder(null);
10355
10395
  }, [rows, serverMode]);
10356
- const [rowHeights, setRowHeights] = React54__namespace.default.useState({});
10357
- const [rowDrag, setRowDrag] = React54__namespace.default.useState({ from: null, over: null, after: false });
10358
- const [rowGrab, setRowGrab] = React54__namespace.default.useState(null);
10359
- const [reorderMsg, setReorderMsg] = React54__namespace.default.useState("");
10360
- const rowFocusRef = React54__namespace.default.useRef(null);
10361
- const [fWidths, setFWidths] = React54__namespace.default.useState({});
10362
- const [fPanelSize, setFPanelSize] = React54__namespace.default.useState(null);
10363
- const [batchNameW, setBatchNameW] = React54__namespace.default.useState(null);
10364
- const [popSizes, setPopSizes] = React54__namespace.default.useState({});
10396
+ const [rowHeights, setRowHeights] = React55__namespace.default.useState({});
10397
+ const [rowDrag, setRowDrag] = React55__namespace.default.useState({ from: null, over: null, after: false });
10398
+ const [rowGrab, setRowGrab] = React55__namespace.default.useState(null);
10399
+ const [reorderMsg, setReorderMsg] = React55__namespace.default.useState("");
10400
+ const rowFocusRef = React55__namespace.default.useRef(null);
10401
+ const [fWidths, setFWidths] = React55__namespace.default.useState({});
10402
+ const [fPanelSize, setFPanelSize] = React55__namespace.default.useState(null);
10403
+ const [batchNameW, setBatchNameW] = React55__namespace.default.useState(null);
10404
+ const [popSizes, setPopSizes] = React55__namespace.default.useState({});
10365
10405
  const serializeState = () => ({
10366
10406
  filters: filters.map(({ id, ...f }) => f),
10367
10407
  // strip the internal row id
@@ -10446,11 +10486,11 @@ function Datatable({
10446
10486
  if (Array.isArray(s.grouping)) setGroupBy(s.grouping.filter((f) => known.has(f)));
10447
10487
  if (Array.isArray(s.collapsedGroups) && !collapsedControlled) setInternalCollapsed(new Set(s.collapsedGroups.filter((k) => typeof k === "string")));
10448
10488
  };
10449
- const stateReadyRef = React54__namespace.default.useRef(false);
10450
- const stateRestoredRef = React54__namespace.default.useRef(false);
10451
- const onStateChangeRef = React54__namespace.default.useRef(onStateChange);
10489
+ const stateReadyRef = React55__namespace.default.useRef(false);
10490
+ const stateRestoredRef = React55__namespace.default.useRef(false);
10491
+ const onStateChangeRef = React55__namespace.default.useRef(onStateChange);
10452
10492
  onStateChangeRef.current = onStateChange;
10453
- React54__namespace.default.useEffect(() => {
10493
+ React55__namespace.default.useEffect(() => {
10454
10494
  if (!stateReadyRef.current) return void 0;
10455
10495
  if (!stateKey && !onStateChange) return void 0;
10456
10496
  const state = serializeState();
@@ -10476,7 +10516,7 @@ function Datatable({
10476
10516
  if (saved) applyState(saved);
10477
10517
  stateRestoredRef.current = true;
10478
10518
  };
10479
- React54__namespace.default.useEffect(() => {
10519
+ React55__namespace.default.useEffect(() => {
10480
10520
  if (columns.length) {
10481
10521
  restoreState();
10482
10522
  stateReadyRef.current = true;
@@ -10485,14 +10525,14 @@ function Datatable({
10485
10525
  stateReadyRef.current = false;
10486
10526
  };
10487
10527
  }, []);
10488
- React54__namespace.default.useEffect(() => {
10528
+ React55__namespace.default.useEffect(() => {
10489
10529
  if (stateRestoredRef.current || !columns.length) return;
10490
10530
  restoreState();
10491
10531
  stateReadyRef.current = true;
10492
10532
  }, [columns.length]);
10493
- const rootRef = React54__namespace.default.useRef(null);
10494
- const [compact, setCompact] = React54__namespace.default.useState(false);
10495
- React54__namespace.default.useEffect(() => {
10533
+ const rootRef = React55__namespace.default.useRef(null);
10534
+ const [compact, setCompact] = React55__namespace.default.useState(false);
10535
+ React55__namespace.default.useEffect(() => {
10496
10536
  const el = rootRef.current;
10497
10537
  if (!el) return void 0;
10498
10538
  const measure = () => setCompact((el.clientWidth || 0) < 720);
@@ -10505,13 +10545,13 @@ function Datatable({
10505
10545
  else if (typeof window !== "undefined") window.removeEventListener("resize", measure);
10506
10546
  };
10507
10547
  }, []);
10508
- const scrollRef = React54__namespace.default.useRef(null);
10509
- const filterPanelRef = React54__namespace.default.useRef(null);
10510
- const measureCanvas = React54__namespace.default.useRef(null);
10511
- const [scrollTop, setScrollTop] = React54__namespace.default.useState(0);
10512
- const [viewportH, setViewportH] = React54__namespace.default.useState(0);
10513
- const [ovTip, setOvTip] = React54__namespace.default.useState(null);
10514
- const ovTimer = React54__namespace.default.useRef(null);
10548
+ const scrollRef = React55__namespace.default.useRef(null);
10549
+ const filterPanelRef = React55__namespace.default.useRef(null);
10550
+ const measureCanvas = React55__namespace.default.useRef(null);
10551
+ const [scrollTop, setScrollTop] = React55__namespace.default.useState(0);
10552
+ const [viewportH, setViewportH] = React55__namespace.default.useState(0);
10553
+ const [ovTip, setOvTip] = React55__namespace.default.useState(null);
10554
+ const ovTimer = React55__namespace.default.useRef(null);
10515
10555
  const hideOverflowTip = () => {
10516
10556
  clearTimeout(ovTimer.current);
10517
10557
  setOvTip((t) => t ? null : t);
@@ -10535,8 +10575,8 @@ function Datatable({
10535
10575
  if (el && el.scrollWidth > el.clientWidth + 1) setOvTip({ anchor: el, text: el.getAttribute("data-ovtext") });
10536
10576
  else hideOverflowTip();
10537
10577
  };
10538
- React54__namespace.default.useEffect(() => () => clearTimeout(ovTimer.current), []);
10539
- React54__namespace.default.useEffect(() => {
10578
+ React55__namespace.default.useEffect(() => () => clearTimeout(ovTimer.current), []);
10579
+ React55__namespace.default.useEffect(() => {
10540
10580
  if (!ovTip) return void 0;
10541
10581
  const onKey = (e) => {
10542
10582
  if (e.key === "Escape") setOvTip(null);
@@ -10544,8 +10584,8 @@ function Datatable({
10544
10584
  document.addEventListener("keydown", onKey);
10545
10585
  return () => document.removeEventListener("keydown", onKey);
10546
10586
  }, [ovTip]);
10547
- const [pivotOn, setPivotOn] = React54__namespace.default.useState(pivotMode);
10548
- const [aggConfig, setAggConfig] = React54__namespace.default.useState(() => {
10587
+ const [pivotOn, setPivotOn] = React55__namespace.default.useState(pivotMode);
10588
+ const [aggConfig, setAggConfig] = React55__namespace.default.useState(() => {
10549
10589
  const m = {};
10550
10590
  (columns || []).forEach((c) => {
10551
10591
  if (typeof c.aggregation === "string") m[c.field] = c.aggregation;
@@ -10553,26 +10593,26 @@ function Datatable({
10553
10593
  return m;
10554
10594
  });
10555
10595
  const aggOf = (c) => aggConfig[c.field] || (typeof c.aggregation === "function" ? c.aggregation : null);
10556
- const [pivotConfig, setPivotConfig] = React54__namespace.default.useState(() => ({
10596
+ const [pivotConfig, setPivotConfig] = React55__namespace.default.useState(() => ({
10557
10597
  rows: pivot && pivot.rows || [],
10558
10598
  columns: pivot && pivot.columns || [],
10559
10599
  values: pivot && pivot.values || []
10560
10600
  }));
10561
10601
  const pivotActive = pivotOn && pivotConfig.rows.length > 0 && pivotConfig.values.length > 0;
10562
- React54__namespace.default.useEffect(() => {
10602
+ React55__namespace.default.useEffect(() => {
10563
10603
  setOrder((prev) => mergeColOrder(prev, columns.map((c) => c.field).filter(Boolean)));
10564
10604
  }, [columns]);
10565
- const densityPropRef = React54__namespace.default.useRef(densityProp);
10566
- React54__namespace.default.useEffect(() => {
10605
+ const densityPropRef = React55__namespace.default.useRef(densityProp);
10606
+ React55__namespace.default.useEffect(() => {
10567
10607
  if (densityPropRef.current === densityProp) return;
10568
10608
  densityPropRef.current = densityProp;
10569
10609
  setDensity(densityProp);
10570
10610
  }, [densityProp]);
10571
- React54__namespace.default.useEffect(() => {
10611
+ React55__namespace.default.useEffect(() => {
10572
10612
  setAggOn(showAggregation);
10573
10613
  }, [showAggregation]);
10574
- const pageSizePropRef = React54__namespace.default.useRef(pageSize);
10575
- React54__namespace.default.useEffect(() => {
10614
+ const pageSizePropRef = React55__namespace.default.useRef(pageSize);
10615
+ React55__namespace.default.useEffect(() => {
10576
10616
  if (pageSizePropRef.current === pageSize) return;
10577
10617
  pageSizePropRef.current = pageSize;
10578
10618
  if (pageSizeControlled) return;
@@ -10580,8 +10620,8 @@ function Datatable({
10580
10620
  setInternalPage(0);
10581
10621
  }, [pageSize]);
10582
10622
  const rowGroupingKey = (rowGrouping || []).join("\0");
10583
- const rowGroupingKeyRef = React54__namespace.default.useRef(rowGroupingKey);
10584
- React54__namespace.default.useEffect(() => {
10623
+ const rowGroupingKeyRef = React55__namespace.default.useRef(rowGroupingKey);
10624
+ React55__namespace.default.useEffect(() => {
10585
10625
  if (rowGroupingKeyRef.current === rowGroupingKey) return;
10586
10626
  rowGroupingKeyRef.current = rowGroupingKey;
10587
10627
  setGroupBy(rowGrouping || []);
@@ -10599,29 +10639,29 @@ function Datatable({
10599
10639
  };
10600
10640
  const intrinsicWidth = (c) => c.width === "auto" ? autoWidth(c) : typeof c.width === "number" ? c.width : 160;
10601
10641
  const widthOf = (c) => clampWidth(widths[c.field] ?? intrinsicWidth(c), c);
10602
- const [colMenu, setColMenu] = React54__namespace.default.useState(null);
10642
+ const [colMenu, setColMenu] = React55__namespace.default.useState(null);
10603
10643
  const [menuPos, openMenu, closeMenu] = useFloating();
10604
- const [panel, setPanel] = React54__namespace.default.useState(null);
10644
+ const [panel, setPanel] = React55__namespace.default.useState(null);
10605
10645
  const [panelPos, openPanel, closePanel] = useFloating();
10606
- const [combineTarget, setCombineTarget] = React54__namespace.default.useState(null);
10607
- const [combineDraft, setCombineDraft] = React54__namespace.default.useState(null);
10608
- const combinePanelRef = React54__namespace.default.useRef(null);
10609
- React54__namespace.default.useEffect(() => {
10646
+ const [combineTarget, setCombineTarget] = React55__namespace.default.useState(null);
10647
+ const [combineDraft, setCombineDraft] = React55__namespace.default.useState(null);
10648
+ const combinePanelRef = React55__namespace.default.useRef(null);
10649
+ React55__namespace.default.useEffect(() => {
10610
10650
  if (panel === "combine" && combinePanelRef.current) {
10611
10651
  const el = combinePanelRef.current.querySelector('[role="switch"], button, [tabindex]');
10612
10652
  (el || combinePanelRef.current).focus?.();
10613
10653
  }
10614
10654
  }, [panel]);
10615
- const [rowMenu, setRowMenu] = React54__namespace.default.useState(null);
10655
+ const [rowMenu, setRowMenu] = React55__namespace.default.useState(null);
10616
10656
  const [rowMenuPos, openRowMenu, closeRowMenu] = useFloating();
10617
- const [exportOpen, setExportOpen] = React54__namespace.default.useState(false);
10657
+ const [exportOpen, setExportOpen] = React55__namespace.default.useState(false);
10618
10658
  const [exportPos, openExport, closeExport] = useFloating();
10619
- const menuTriggerRef = React54__namespace.default.useRef(null);
10620
- const colMenuRef = React54__namespace.default.useRef(null);
10621
- const rowMenuRef = React54__namespace.default.useRef(null);
10622
- const exportMenuRef = React54__namespace.default.useRef(null);
10623
- const quickSearchRef = React54__namespace.default.useRef(null);
10624
- const colSearchRef = React54__namespace.default.useRef(null);
10659
+ const menuTriggerRef = React55__namespace.default.useRef(null);
10660
+ const colMenuRef = React55__namespace.default.useRef(null);
10661
+ const rowMenuRef = React55__namespace.default.useRef(null);
10662
+ const exportMenuRef = React55__namespace.default.useRef(null);
10663
+ const quickSearchRef = React55__namespace.default.useRef(null);
10664
+ const colSearchRef = React55__namespace.default.useRef(null);
10625
10665
  function focusFirstItem(container) {
10626
10666
  if (!container) return;
10627
10667
  const first = container.querySelector('[role="menuitem"]:not([disabled])');
@@ -10660,16 +10700,16 @@ function Datatable({
10660
10700
  restoreTriggerFocus();
10661
10701
  }
10662
10702
  }
10663
- React54__namespace.default.useEffect(() => {
10703
+ React55__namespace.default.useEffect(() => {
10664
10704
  if (colMenu) focusFirstItem(colMenuRef.current);
10665
10705
  }, [colMenu]);
10666
- React54__namespace.default.useEffect(() => {
10706
+ React55__namespace.default.useEffect(() => {
10667
10707
  if (rowMenu) focusFirstItem(rowMenuRef.current);
10668
10708
  }, [rowMenu]);
10669
- React54__namespace.default.useEffect(() => {
10709
+ React55__namespace.default.useEffect(() => {
10670
10710
  if (exportOpen) focusFirstItem(exportMenuRef.current);
10671
10711
  }, [exportOpen]);
10672
- React54__namespace.default.useEffect(() => {
10712
+ React55__namespace.default.useEffect(() => {
10673
10713
  if (!colMenu && !panel && !rowMenu) return;
10674
10714
  const closeAll = () => {
10675
10715
  setColMenu(null);
@@ -10692,7 +10732,7 @@ function Datatable({
10692
10732
  document.removeEventListener("keydown", onKey);
10693
10733
  };
10694
10734
  }, [colMenu, panel, rowMenu]);
10695
- React54__namespace.default.useEffect(() => {
10735
+ React55__namespace.default.useEffect(() => {
10696
10736
  if (!exportOpen) return;
10697
10737
  const close = () => {
10698
10738
  setExportOpen(false);
@@ -10711,37 +10751,37 @@ function Datatable({
10711
10751
  document.removeEventListener("keydown", onKey);
10712
10752
  };
10713
10753
  }, [exportOpen]);
10714
- const colByField = React54__namespace.default.useMemo(() => Object.fromEntries(cols.map((c) => [c.field, c])), [cols]);
10754
+ const colByField = React55__namespace.default.useMemo(() => Object.fromEntries(cols.map((c) => [c.field, c])), [cols]);
10715
10755
  const fieldLabel = (f) => colLabel(colByField[f] || { field: f });
10716
- const combineSources = React54__namespace.default.useMemo(() => {
10756
+ const combineSources = React55__namespace.default.useMemo(() => {
10717
10757
  const s = /* @__PURE__ */ new Set();
10718
10758
  for (const cfg of Object.values(userCombine)) (cfg && cfg.fields ? cfg.fields : []).slice(1).forEach((f) => s.add(f));
10719
10759
  return s;
10720
10760
  }, [userCombine]);
10721
- const stackCombineTargets = React54__namespace.default.useMemo(
10761
+ const stackCombineTargets = React55__namespace.default.useMemo(
10722
10762
  () => new Set(cols.filter((c) => {
10723
10763
  const cfg = combineCfg(userCombine[c.field] || c.combine);
10724
10764
  return cfg && cfg.layout === "stack";
10725
10765
  }).map((c) => c.field)),
10726
10766
  [cols, userCombine]
10727
10767
  );
10728
- const effectiveHidden = React54__namespace.default.useMemo(() => combineSources.size ? /* @__PURE__ */ new Set([...hidden, ...combineSources]) : hidden, [hidden, combineSources]);
10729
- const effectiveWrapped = React54__namespace.default.useMemo(() => stackCombineTargets.size ? /* @__PURE__ */ new Set([...wrapped, ...stackCombineTargets]) : wrapped, [wrapped, stackCombineTargets]);
10730
- const visibleCols = React54__namespace.default.useMemo(() => cols.filter((c) => !effectiveHidden.has(c.field)), [cols, effectiveHidden]);
10768
+ const effectiveHidden = React55__namespace.default.useMemo(() => combineSources.size ? /* @__PURE__ */ new Set([...hidden, ...combineSources]) : hidden, [hidden, combineSources]);
10769
+ const effectiveWrapped = React55__namespace.default.useMemo(() => stackCombineTargets.size ? /* @__PURE__ */ new Set([...wrapped, ...stackCombineTargets]) : wrapped, [wrapped, stackCombineTargets]);
10770
+ const visibleCols = React55__namespace.default.useMemo(() => cols.filter((c) => !effectiveHidden.has(c.field)), [cols, effectiveHidden]);
10731
10771
  const colFieldsKey = JSON.stringify(
10732
10772
  cols.filter((c) => typeof c.field === "string" && c.type !== "actions").map((c) => c.field)
10733
10773
  );
10734
- const colFields = React54__namespace.default.useMemo(() => JSON.parse(colFieldsKey), [colFieldsKey]);
10774
+ const colFields = React55__namespace.default.useMemo(() => JSON.parse(colFieldsKey), [colFieldsKey]);
10735
10775
  const hiddenKey = JSON.stringify([...hidden].filter((f) => typeof f === "string").sort());
10736
- const visibleColumns = React54__namespace.default.useMemo(() => {
10776
+ const visibleColumns = React55__namespace.default.useMemo(() => {
10737
10777
  const h = new Set(JSON.parse(hiddenKey));
10738
10778
  return colFields.filter((f) => !h.has(f));
10739
10779
  }, [colFields, hiddenKey]);
10740
- const hiddenColumns = React54__namespace.default.useMemo(() => {
10780
+ const hiddenColumns = React55__namespace.default.useMemo(() => {
10741
10781
  const h = new Set(JSON.parse(hiddenKey));
10742
10782
  return colFields.filter((f) => h.has(f));
10743
10783
  }, [colFields, hiddenKey]);
10744
- const ordered = React54__namespace.default.useMemo(() => {
10784
+ const ordered = React55__namespace.default.useMemo(() => {
10745
10785
  const orderIdx = (f) => {
10746
10786
  const i = order.indexOf(f);
10747
10787
  return i === -1 ? 9999 : i;
@@ -10760,8 +10800,8 @@ function Datatable({
10760
10800
  const EXP_W = hasExpandCol ? 44 : 0;
10761
10801
  const numLeft = EXP_W + CHK_W;
10762
10802
  const leadW = numLeft + (showRowNum ? NUM_W : 0);
10763
- const visLeft = React54__namespace.default.useMemo(() => pins.left.filter((f) => colByField[f] && !effectiveHidden.has(f)), [pins.left, colByField, effectiveHidden]);
10764
- const visRight = React54__namespace.default.useMemo(() => pins.right.filter((f) => colByField[f] && !effectiveHidden.has(f)), [pins.right, colByField, effectiveHidden]);
10803
+ const visLeft = React55__namespace.default.useMemo(() => pins.left.filter((f) => colByField[f] && !effectiveHidden.has(f)), [pins.left, colByField, effectiveHidden]);
10804
+ const visRight = React55__namespace.default.useMemo(() => pins.right.filter((f) => colByField[f] && !effectiveHidden.has(f)), [pins.right, colByField, effectiveHidden]);
10765
10805
  const stickyOf = (field) => {
10766
10806
  if (visLeft.includes(field)) {
10767
10807
  let off = leadW;
@@ -10784,7 +10824,7 @@ function Datatable({
10784
10824
  }
10785
10825
  return {};
10786
10826
  };
10787
- const processed = React54__namespace.default.useMemo(() => {
10827
+ const processed = React55__namespace.default.useMemo(() => {
10788
10828
  if (serverMode) {
10789
10829
  if (rowOrder) {
10790
10830
  const idx = new Map(rowOrder.map((k, i) => [k, i]));
@@ -10826,14 +10866,14 @@ function Datatable({
10826
10866
  const serverTotal = rowCount == null ? processed.length : rowCount;
10827
10867
  const totalRows = serverMode ? serverTotal : processed.length;
10828
10868
  const totalPages = paginated ? Math.max(1, Math.ceil(totalRows / sizeVal)) : 1;
10829
- const paged = React54__namespace.default.useMemo(
10869
+ const paged = React55__namespace.default.useMemo(
10830
10870
  () => !paginated || serverMode ? processed : processed.slice(pageVal * sizeVal, pageVal * sizeVal + sizeVal),
10831
10871
  [processed, paginated, serverMode, pageVal, sizeVal]
10832
10872
  );
10833
- React54__namespace.default.useEffect(() => {
10873
+ React55__namespace.default.useEffect(() => {
10834
10874
  if (pageVal > totalPages - 1) commitPage(0);
10835
10875
  }, [totalPages]);
10836
- const treeRows = React54__namespace.default.useMemo(() => {
10876
+ const treeRows = React55__namespace.default.useMemo(() => {
10837
10877
  if (serverMode || typeof getSubRows !== "function") return null;
10838
10878
  const out = [];
10839
10879
  const seen2 = /* @__PURE__ */ new Set();
@@ -10847,12 +10887,12 @@ function Datatable({
10847
10887
  for (const r2 of paged) walk(r2, 0);
10848
10888
  return out;
10849
10889
  }, [serverMode, getSubRows, paged, expandedSet, keyOf]);
10850
- const depthByKey = React54__namespace.default.useMemo(() => {
10890
+ const depthByKey = React55__namespace.default.useMemo(() => {
10851
10891
  const m = /* @__PURE__ */ new Map();
10852
10892
  if (treeRows) for (const t of treeRows) m.set(keyOf(t.row), t.depth);
10853
10893
  return m;
10854
10894
  }, [treeRows, keyOf]);
10855
- const treeSeqByKey = React54__namespace.default.useMemo(() => {
10895
+ const treeSeqByKey = React55__namespace.default.useMemo(() => {
10856
10896
  if (!treeRows) return null;
10857
10897
  const m = /* @__PURE__ */ new Map();
10858
10898
  const seen2 = /* @__PURE__ */ new Set();
@@ -10867,7 +10907,7 @@ function Datatable({
10867
10907
  for (const r2 of processed) walk(r2);
10868
10908
  return m;
10869
10909
  }, [treeRows, processed, expandedSet, getSubRows, keyOf]);
10870
- const activeGroupBy = React54__namespace.default.useMemo(() => groupBy.filter((f) => colByField[f]), [groupBy, colByField]);
10910
+ const activeGroupBy = React55__namespace.default.useMemo(() => groupBy.filter((f) => colByField[f]), [groupBy, colByField]);
10871
10911
  function subtotalText(rowsIn) {
10872
10912
  const parts = [];
10873
10913
  for (const c of ordered) {
@@ -10894,7 +10934,7 @@ function Datatable({
10894
10934
  if (agg === "max") return Math.max(...nums);
10895
10935
  return null;
10896
10936
  }
10897
- const displayItems = React54__namespace.default.useMemo(() => {
10937
+ const displayItems = React55__namespace.default.useMemo(() => {
10898
10938
  if (!activeGroupBy.length) return null;
10899
10939
  const build = (rowsIn, depth, prefix) => {
10900
10940
  if (depth >= activeGroupBy.length) return rowsIn.map((row) => ({ kind: "leaf", row }));
@@ -10917,7 +10957,7 @@ function Datatable({
10917
10957
  };
10918
10958
  return build(paged, 0, "");
10919
10959
  }, [activeGroupBy, collapsedSet, paged, ordered, aggOn]);
10920
- const leafRows = React54__namespace.default.useMemo(
10960
+ const leafRows = React55__namespace.default.useMemo(
10921
10961
  () => displayItems ? displayItems.filter((i) => i.kind === "leaf").map((i) => i.row) : treeRows ? treeRows.map((t) => t.row) : paged,
10922
10962
  [displayItems, treeRows, paged]
10923
10963
  );
@@ -10947,7 +10987,7 @@ function Datatable({
10947
10987
  return { top, bottom };
10948
10988
  });
10949
10989
  }
10950
- React54__namespace.default.useEffect(() => {
10990
+ React55__namespace.default.useEffect(() => {
10951
10991
  if (!rowPinning) return;
10952
10992
  const measure = () => {
10953
10993
  if (theadRef.current) setHeadH(theadRef.current.offsetHeight || 41);
@@ -10961,18 +11001,18 @@ function Datatable({
10961
11001
  const pinnedTopRows = canPinRows ? pinnedRows.top.map((k) => leafRows.find((r2, i) => keyOf(r2, i) === k)).filter(Boolean) : [];
10962
11002
  const pinnedBottomRows = canPinRows ? pinnedRows.bottom.map((k) => leafRows.find((r2, i) => keyOf(r2, i) === k)).filter(Boolean) : [];
10963
11003
  const middleRows = canPinRows ? leafRows.filter((r2, i) => !pinSideOf(keyOf(r2, i))) : leafRows;
10964
- const keyIndex = React54__namespace.default.useMemo(() => {
11004
+ const keyIndex = React55__namespace.default.useMemo(() => {
10965
11005
  const m = /* @__PURE__ */ new Map();
10966
11006
  leafRows.forEach((r2, i) => m.set(keyOf(r2, i), i));
10967
11007
  return m;
10968
11008
  }, [leafRows]);
10969
- const keyIndexMid = React54__namespace.default.useMemo(() => {
11009
+ const keyIndexMid = React55__namespace.default.useMemo(() => {
10970
11010
  const m = /* @__PURE__ */ new Map();
10971
11011
  middleRows.forEach((r2, i) => m.set(keyOf(r2, keyIndex.get(keyOf(r2)) ?? i), i));
10972
11012
  return m;
10973
11013
  }, [middleRows, keyIndex]);
10974
- const cellColIndex = React54__namespace.default.useCallback((field) => ordered.findIndex((c) => c.field === field), [ordered]);
10975
- const cellRect = React54__namespace.default.useMemo(() => {
11014
+ const cellColIndex = React55__namespace.default.useCallback((field) => ordered.findIndex((c) => c.field === field), [ordered]);
11015
+ const cellRect = React55__namespace.default.useMemo(() => {
10976
11016
  if (selectionMode !== "cell" || !activeCellVal) return null;
10977
11017
  const ar = keyIndex.get(activeCellVal.key), ac = cellColIndex(activeCellVal.field);
10978
11018
  if (ar == null || ac < 0) return null;
@@ -10982,15 +11022,15 @@ function Datatable({
10982
11022
  const c0 = nc < 0 ? ac : Math.min(ac, nc), c1 = nc < 0 ? ac : Math.max(ac, nc);
10983
11023
  return { r0, r1, c0, c1 };
10984
11024
  }, [selectionMode, activeCellVal, anchorCell, keyIndex, cellColIndex]);
10985
- const activeCellId = React54__namespace.default.useMemo(() => {
11025
+ const activeCellId = React55__namespace.default.useMemo(() => {
10986
11026
  if (selectionMode !== "cell" || !activeCellVal) return void 0;
10987
11027
  const ar = keyIndex.get(activeCellVal.key), ac = cellColIndex(activeCellVal.field);
10988
11028
  return ar == null || ac < 0 ? void 0 : `${gridId}-${ar}-${ac}`;
10989
11029
  }, [selectionMode, activeCellVal, keyIndex, cellColIndex, gridId]);
10990
- const onCellSelRef = React54__namespace.default.useRef(onCellSelectionChange);
11030
+ const onCellSelRef = React55__namespace.default.useRef(onCellSelectionChange);
10991
11031
  onCellSelRef.current = onCellSelectionChange;
10992
- const prevSelSigRef = React54__namespace.default.useRef("");
10993
- React54__namespace.default.useEffect(() => {
11032
+ const prevSelSigRef = React55__namespace.default.useRef("");
11033
+ React55__namespace.default.useEffect(() => {
10994
11034
  const cb = onCellSelRef.current;
10995
11035
  if (selectionMode !== "cell" || !cb) return;
10996
11036
  const cells = [];
@@ -11083,7 +11123,7 @@ function Datatable({
11083
11123
  setReorderMsg("Reorder cancelled.");
11084
11124
  }
11085
11125
  }
11086
- React54__namespace.default.useEffect(() => {
11126
+ React55__namespace.default.useEffect(() => {
11087
11127
  if (rowFocusRef.current == null) return;
11088
11128
  const key = rowFocusRef.current;
11089
11129
  rowFocusRef.current = null;
@@ -11095,7 +11135,7 @@ function Datatable({
11095
11135
  });
11096
11136
  const estRowH = rowHeight ?? (density === "compact" ? 36 : density === "comfortable" ? 56 : 44);
11097
11137
  const virtualizing = virtualized && !paginated && !activeGroupBy.length && !loading;
11098
- React54__namespace.default.useEffect(() => {
11138
+ React55__namespace.default.useEffect(() => {
11099
11139
  if (!virtualizing) return;
11100
11140
  const el = scrollRef.current;
11101
11141
  if (!el) return;
@@ -11105,13 +11145,13 @@ function Datatable({
11105
11145
  if (ro) ro.observe(el);
11106
11146
  return () => ro && ro.disconnect();
11107
11147
  }, [virtualizing, height]);
11108
- const onScrollVirtual = React54__namespace.default.useCallback((e) => {
11148
+ const onScrollVirtual = React55__namespace.default.useCallback((e) => {
11109
11149
  setScrollTop(e.currentTarget.scrollTop);
11110
11150
  }, []);
11111
11151
  const vh = viewportH || (typeof height === "number" ? height : 440);
11112
- const rowHRef = React54__namespace.default.useRef(/* @__PURE__ */ new Map());
11113
- const [measureTick, setMeasureTick] = React54__namespace.default.useState(0);
11114
- const offsets = React54__namespace.default.useMemo(() => {
11152
+ const rowHRef = React55__namespace.default.useRef(/* @__PURE__ */ new Map());
11153
+ const [measureTick, setMeasureTick] = React55__namespace.default.useState(0);
11154
+ const offsets = React55__namespace.default.useMemo(() => {
11115
11155
  if (!virtualizing) return null;
11116
11156
  const total = middleRows.length;
11117
11157
  const arr = new Float64Array(total + 1);
@@ -11121,7 +11161,7 @@ function Datatable({
11121
11161
  }
11122
11162
  return arr;
11123
11163
  }, [virtualizing, middleRows, estRowH, measureTick]);
11124
- const vWindow = React54__namespace.default.useMemo(() => {
11164
+ const vWindow = React55__namespace.default.useMemo(() => {
11125
11165
  if (!virtualizing || !offsets) return null;
11126
11166
  const total = middleRows.length;
11127
11167
  const totalH = offsets[total];
@@ -11150,7 +11190,7 @@ function Datatable({
11150
11190
  if (start > end) start = end;
11151
11191
  return { start, end, padTop: offsets[start], padBottom: Math.max(0, totalH - offsets[end]) };
11152
11192
  }, [virtualizing, offsets, middleRows.length, vh, scrollTop, overscan]);
11153
- React54__namespace.default.useLayoutEffect(() => {
11193
+ React55__namespace.default.useLayoutEffect(() => {
11154
11194
  if (!virtualizing) return;
11155
11195
  const el = scrollRef.current;
11156
11196
  if (!el) return;
@@ -11165,9 +11205,9 @@ function Datatable({
11165
11205
  }
11166
11206
  if (changed) setMeasureTick((t) => t + 1);
11167
11207
  });
11168
- const onServerChangeRef = React54__namespace.default.useRef(onServerChange);
11208
+ const onServerChangeRef = React55__namespace.default.useRef(onServerChange);
11169
11209
  onServerChangeRef.current = onServerChange;
11170
- React54__namespace.default.useEffect(() => {
11210
+ React55__namespace.default.useEffect(() => {
11171
11211
  if (!serverMode) return;
11172
11212
  const t = setTimeout(() => {
11173
11213
  onServerChangeRef.current?.({
@@ -11187,10 +11227,10 @@ function Datatable({
11187
11227
  }, 250);
11188
11228
  return () => clearTimeout(t);
11189
11229
  }, [serverMode, pageVal, sizeVal, sort, filters, filterLogic, quick, visibleColumns, hiddenColumns, treeExpandedKey]);
11190
- const onColVisRef = React54__namespace.default.useRef(onColumnVisibilityChange);
11230
+ const onColVisRef = React55__namespace.default.useRef(onColumnVisibilityChange);
11191
11231
  onColVisRef.current = onColumnVisibilityChange;
11192
- const lastVisibleKey = React54__namespace.default.useRef(null);
11193
- React54__namespace.default.useEffect(() => {
11232
+ const lastVisibleKey = React55__namespace.default.useRef(null);
11233
+ React55__namespace.default.useEffect(() => {
11194
11234
  const key = JSON.stringify(visibleColumns);
11195
11235
  if (lastVisibleKey.current === null) {
11196
11236
  lastVisibleKey.current = key;
@@ -11222,7 +11262,7 @@ function Datatable({
11222
11262
  return n;
11223
11263
  });
11224
11264
  }
11225
- const movableMidFields = React54__namespace.default.useMemo(
11265
+ const movableMidFields = React55__namespace.default.useMemo(
11226
11266
  () => ordered.filter((c) => !pins.left.includes(c.field) && !pins.right.includes(c.field) && c.reorderable !== false).map((c) => c.field),
11227
11267
  [ordered, pins]
11228
11268
  );
@@ -11257,7 +11297,7 @@ function Datatable({
11257
11297
  }
11258
11298
  return [...seen2.values()].sort((a, b) => String(a.label).localeCompare(String(b.label)));
11259
11299
  }
11260
- const [resizing, setResizing] = React54__namespace.default.useState(false);
11300
+ const [resizing, setResizing] = React55__namespace.default.useState(false);
11261
11301
  function startResize(e, field) {
11262
11302
  e.preventDefault();
11263
11303
  e.stopPropagation();
@@ -11364,7 +11404,7 @@ function Datatable({
11364
11404
  if (!agg) return null;
11365
11405
  if (aggregationValues && col.field in aggregationValues) {
11366
11406
  const pre = aggregationValues[col.field];
11367
- if (pre && typeof pre === "object" && !React54__namespace.default.isValidElement(pre)) {
11407
+ if (pre && typeof pre === "object" && !React55__namespace.default.isValidElement(pre)) {
11368
11408
  if (typeof agg === "string" && agg in pre) return pre[agg];
11369
11409
  } else {
11370
11410
  return pre;
@@ -11569,10 +11609,10 @@ function Datatable({
11569
11609
  }
11570
11610
  }
11571
11611
  }
11572
- React54__namespace.default.useEffect(() => {
11612
+ React55__namespace.default.useEffect(() => {
11573
11613
  setFocus((f) => ({ r: Math.min(f.r, Math.max(0, leafRows.length - 1)), c: Math.min(f.c, Math.max(0, ordered.length - 1)) }));
11574
11614
  }, [leafRows.length, ordered.length, pageVal]);
11575
- React54__namespace.default.useLayoutEffect(() => {
11615
+ React55__namespace.default.useLayoutEffect(() => {
11576
11616
  if (cellNavigation !== "widget") return;
11577
11617
  const grid = gridRef.current;
11578
11618
  if (!grid) return;
@@ -11587,12 +11627,12 @@ function Datatable({
11587
11627
  td.tabIndex = active && ws.length === 0 ? 0 : -1;
11588
11628
  });
11589
11629
  }, [cellNavigation, focus.r, focus.c, leafRows, ordered, pageVal, interacting, hidden, pins, scrollTop, loading, measureTick, viewportH, pinnedRows]);
11590
- const selectedRows = React54__namespace.default.useMemo(() => rows.filter((r2, i) => selected.has(keyOf(r2, i))), [rows, selected]);
11591
- const selKeys = React54__namespace.default.useMemo(() => [...selected], [selected]);
11592
- const onRowSelRef = React54__namespace.default.useRef(onRowSelectionChange);
11630
+ const selectedRows = React55__namespace.default.useMemo(() => rows.filter((r2, i) => selected.has(keyOf(r2, i))), [rows, selected]);
11631
+ const selKeys = React55__namespace.default.useMemo(() => [...selected], [selected]);
11632
+ const onRowSelRef = React55__namespace.default.useRef(onRowSelectionChange);
11593
11633
  onRowSelRef.current = onRowSelectionChange;
11594
- const prevRowSelSigRef = React54__namespace.default.useRef("");
11595
- React54__namespace.default.useEffect(() => {
11634
+ const prevRowSelSigRef = React55__namespace.default.useRef("");
11635
+ React55__namespace.default.useEffect(() => {
11596
11636
  const cb = onRowSelRef.current;
11597
11637
  if (!cb) return;
11598
11638
  const sig = selKeys.join(",");
@@ -11601,7 +11641,7 @@ function Datatable({
11601
11641
  cb(selKeys, selectedRows);
11602
11642
  }, [selKeys, selectedRows]);
11603
11643
  const revealRowRi = activeRowVal != null ? keyIndex.get(activeRowVal) : void 0;
11604
- React54__namespace.default.useEffect(() => {
11644
+ React55__namespace.default.useEffect(() => {
11605
11645
  if (!activeRowControlled || !scrollActiveRowIntoView || activeRowId == null) return;
11606
11646
  const el = gridRef.current && gridRef.current.querySelector('.twc-dt__row[data-active="true"]');
11607
11647
  if (el && el.scrollIntoView) el.scrollIntoView({ block: "nearest" });
@@ -11611,11 +11651,11 @@ function Datatable({
11611
11651
  const revealInline = scrollActiveCellIntoView && typeof scrollActiveCellIntoView === "object" && scrollActiveCellIntoView.inline === "center" ? "center" : "nearest";
11612
11652
  const revealRi = activeCellVal ? keyIndex.get(activeCellVal.key) : void 0;
11613
11653
  const revealCi = activeCellVal ? cellColIndex(activeCellVal.field) : -1;
11614
- const revealOffsetsRef = React54__namespace.default.useRef(offsets);
11654
+ const revealOffsetsRef = React55__namespace.default.useRef(offsets);
11615
11655
  revealOffsetsRef.current = offsets;
11616
- const revealMidRef = React54__namespace.default.useRef(keyIndexMid);
11656
+ const revealMidRef = React55__namespace.default.useRef(keyIndexMid);
11617
11657
  revealMidRef.current = keyIndexMid;
11618
- React54__namespace.default.useEffect(() => {
11658
+ React55__namespace.default.useEffect(() => {
11619
11659
  if (!revealOn || !activeCellVal) return void 0;
11620
11660
  const block = revealBlock, inline = revealInline;
11621
11661
  const ri = revealRi, ci = revealCi;
@@ -11661,7 +11701,7 @@ function Datatable({
11661
11701
  if (raf) cancelAnimationFrame(raf);
11662
11702
  };
11663
11703
  }, [activeCellVal?.key, activeCellVal?.field, revealOn, revealBlock, revealInline, revealRi, revealCi, virtualizing, headH, loading]);
11664
- React54__namespace.default.useEffect(() => {
11704
+ React55__namespace.default.useEffect(() => {
11665
11705
  if (!activeCellControlled || !activeCellVal) {
11666
11706
  jumpAppliedRef.current = null;
11667
11707
  return;
@@ -11679,11 +11719,11 @@ function Datatable({
11679
11719
  function clearSelection() {
11680
11720
  setSelected(/* @__PURE__ */ new Set());
11681
11721
  }
11682
- const [editing, setEditing] = React54__namespace.default.useState(null);
11683
- const stagedEditRef = React54__namespace.default.useRef(null);
11684
- const onEditingChangeRef = React54__namespace.default.useRef(onEditingChange);
11722
+ const [editing, setEditing] = React55__namespace.default.useState(null);
11723
+ const stagedEditRef = React55__namespace.default.useRef(null);
11724
+ const onEditingChangeRef = React55__namespace.default.useRef(onEditingChange);
11685
11725
  onEditingChangeRef.current = onEditingChange;
11686
- const editStoppedRef = React54__namespace.default.useRef(false);
11726
+ const editStoppedRef = React55__namespace.default.useRef(false);
11687
11727
  const isColEditable = (c) => c.type !== "actions" && c.editable !== false && (c.editable === true || typeof c.editable === "function" || c.renderEditCell != null || editMode);
11688
11728
  const isCellEditable = (c, row) => isColEditable(c) && (typeof c.editable !== "function" || !!c.editable(row, { field: c.field }));
11689
11729
  function applyRowUpdate(rowKey2, updated, orig, field) {
@@ -11744,7 +11784,7 @@ function Datatable({
11744
11784
  }
11745
11785
  }
11746
11786
  const batchEditKey = batchEditFields ? batchEditFields.join("\0") : "";
11747
- const batchEditableCols = React54__namespace.default.useMemo(
11787
+ const batchEditableCols = React55__namespace.default.useMemo(
11748
11788
  () => {
11749
11789
  const base = cols.filter((c) => c.type !== "actions" && (c.editable ?? (editMode && c.editable !== false)));
11750
11790
  return batchEditFields ? base.filter((c) => batchEditFields.includes(c.field)) : base;
@@ -11752,7 +11792,7 @@ function Datatable({
11752
11792
  [cols, editMode, batchEditKey]
11753
11793
  // eslint-disable-line react-hooks/exhaustive-deps
11754
11794
  );
11755
- const batchSel = React54__namespace.default.useMemo(() => {
11795
+ const batchSel = React55__namespace.default.useMemo(() => {
11756
11796
  if (!selected.size) return EMPTY_BATCH_SEL;
11757
11797
  const testable = [], resolved = /* @__PURE__ */ new Set();
11758
11798
  const take = (r2, i) => {
@@ -11773,18 +11813,18 @@ function Datatable({
11773
11813
  }
11774
11814
  return { testable, hasUntestable };
11775
11815
  }, [rows, leafRows, selected, serverMode]);
11776
- const batchEditableColsSel = React54__namespace.default.useMemo(
11816
+ const batchEditableColsSel = React55__namespace.default.useMemo(
11777
11817
  () => batchEditableCols.filter((c) => typeof c.editable !== "function" || batchSel.hasUntestable || batchSel.testable.some((r2) => c.editable(r2, { field: c.field }))),
11778
11818
  [batchEditableCols, batchSel]
11779
11819
  );
11780
11820
  const hasBatchEditor = showBatchEdit && batchEditableCols.length > 0;
11781
- const [batchEdit, setBatchEdit] = React54__namespace.default.useState(null);
11821
+ const [batchEdit, setBatchEdit] = React55__namespace.default.useState(null);
11782
11822
  const [batchEditPos, openBatchEdit, closeBatchEdit] = useFloating();
11783
11823
  function openBatchEditor(el) {
11784
11824
  setBatchEdit({ fields: {}, values: {} });
11785
11825
  openBatchEdit(el, "left", 320);
11786
11826
  }
11787
- React54__namespace.default.useEffect(() => {
11827
+ React55__namespace.default.useEffect(() => {
11788
11828
  if (!batchEdit) return;
11789
11829
  const close = () => {
11790
11830
  setBatchEdit(null);
@@ -11803,7 +11843,7 @@ function Datatable({
11803
11843
  document.removeEventListener("keydown", onKey);
11804
11844
  };
11805
11845
  }, [batchEdit]);
11806
- React54__namespace.default.useEffect(() => {
11846
+ React55__namespace.default.useEffect(() => {
11807
11847
  if (batchEdit && selected.size === 0) {
11808
11848
  setBatchEdit(null);
11809
11849
  closeBatchEdit();
@@ -11873,17 +11913,17 @@ function Datatable({
11873
11913
  setBatchEdit(null);
11874
11914
  closeBatchEdit();
11875
11915
  }
11876
- const [clipboardMsg, setClipboardMsg] = React54__namespace.default.useState("");
11877
- const clipboardRef = React54__namespace.default.useRef(null);
11878
- const [clipFx, setClipFx] = React54__namespace.default.useState(null);
11879
- const clipFxTimer = React54__namespace.default.useRef(null);
11880
- const onCellsCopyRef = React54__namespace.default.useRef(onCellsCopy);
11916
+ const [clipboardMsg, setClipboardMsg] = React55__namespace.default.useState("");
11917
+ const clipboardRef = React55__namespace.default.useRef(null);
11918
+ const [clipFx, setClipFx] = React55__namespace.default.useState(null);
11919
+ const clipFxTimer = React55__namespace.default.useRef(null);
11920
+ const onCellsCopyRef = React55__namespace.default.useRef(onCellsCopy);
11881
11921
  onCellsCopyRef.current = onCellsCopy;
11882
- const onCellsPasteRef = React54__namespace.default.useRef(onCellsPaste);
11922
+ const onCellsPasteRef = React55__namespace.default.useRef(onCellsPaste);
11883
11923
  onCellsPasteRef.current = onCellsPaste;
11884
- const onCellsCommitRef = React54__namespace.default.useRef(onCellsCommit);
11924
+ const onCellsCommitRef = React55__namespace.default.useRef(onCellsCommit);
11885
11925
  onCellsCommitRef.current = onCellsCommit;
11886
- React54__namespace.default.useEffect(() => () => {
11926
+ React55__namespace.default.useEffect(() => () => {
11887
11927
  if (clipFxTimer.current) clearTimeout(clipFxTimer.current);
11888
11928
  }, []);
11889
11929
  const announceClip = (msg, rect) => {
@@ -12052,7 +12092,7 @@ function Datatable({
12052
12092
  e.preventDefault();
12053
12093
  applyPastedText(text);
12054
12094
  };
12055
- React54__namespace.default.useEffect(() => {
12095
+ React55__namespace.default.useEffect(() => {
12056
12096
  if (!editing) return;
12057
12097
  const onDown = (e) => {
12058
12098
  if (e.target.closest(".twc-dt__editor-wrap") || e.target.closest(".twc-pop")) return;
@@ -12144,10 +12184,10 @@ function Datatable({
12144
12184
  ] });
12145
12185
  }
12146
12186
  const tableMinWidth = leadW + ordered.reduce((a, c) => a + widthOf(c), 0);
12147
- const filterableCols = React54__namespace.default.useMemo(() => cols.filter((c) => c.filterable), [cols]);
12187
+ const filterableCols = React55__namespace.default.useMemo(() => cols.filter((c) => c.filterable), [cols]);
12148
12188
  const columnsShown = showColumns !== void 0 ? showColumns : cols.some((c) => c.hideable) || rowNumbers;
12149
12189
  const filtersShown = showFilters !== void 0 ? showFilters : filterableCols.length > 0;
12150
- React54__namespace.default.useEffect(() => {
12190
+ React55__namespace.default.useEffect(() => {
12151
12191
  const el = filterPanelRef.current;
12152
12192
  if (panel !== "filters" || !el || typeof document === "undefined") return void 0;
12153
12193
  const measure = () => {
@@ -12595,15 +12635,25 @@ function Datatable({
12595
12635
  const rowActive = selectionMode === "row" && activeRowVal === k;
12596
12636
  const stickyStyle = pinSide === "top" ? { position: "sticky", top: headH, zIndex: 5 } : pinSide === "bottom" ? { position: "sticky", bottom: 0, zIndex: 5 } : void 0;
12597
12637
  const h = rowHeights[k];
12598
- const rowStyle = { ...stickyStyle || {}, ...h ? { height: h } : {} };
12638
+ const userRowStyle = getRowStyle ? getRowStyle(row, ri) : void 0;
12639
+ const userRowClass = getRowClassName ? getRowClassName(row, ri) : void 0;
12640
+ const { background: _rowBgShorthand, backgroundColor: _rowBgColor, ...restRowStyle } = userRowStyle || {};
12641
+ const usable = (v) => typeof v === "string" && v.trim() !== "" ? v : void 0;
12642
+ const rowBg = usable(_rowBgShorthand) ?? usable(_rowBgColor);
12643
+ const rowStyle = {
12644
+ ...restRowStyle,
12645
+ ...rowBg != null ? { "--twc-dt-row-bg": rowBg } : {},
12646
+ ...stickyStyle || {},
12647
+ ...h ? { height: h } : {}
12648
+ };
12599
12649
  const reorderable = canReorderRows && !pinSide;
12600
12650
  const grabbed = rowGrab && rowGrab.key === k;
12601
12651
  const grabTarget = rowGrab && !grabbed && midIdx != null && rowGrab.index === midIdx ? rowGrab.index >= keyIndexMid.get(rowGrab.key) ? "after" : "before" : void 0;
12602
- return /* @__PURE__ */ jsxRuntime.jsxs(React54__namespace.default.Fragment, { children: [
12652
+ return /* @__PURE__ */ jsxRuntime.jsxs(React55__namespace.default.Fragment, { children: [
12603
12653
  /* @__PURE__ */ jsxRuntime.jsxs(
12604
12654
  "tr",
12605
12655
  {
12606
- className: "twc-dt__row",
12656
+ className: userRowClass ? `twc-dt__row ${userRowClass}` : "twc-dt__row",
12607
12657
  role: "row",
12608
12658
  "aria-rowindex": treeSeqByKey ? treeSeqByKey.get(k) + 2 : (paginated && !serverMode ? pageVal * sizeVal : 0) + ri + 2,
12609
12659
  "aria-selected": (checkboxSelection ? sel : rowActive) || void 0,
@@ -14257,7 +14307,7 @@ function safeHref7(url) {
14257
14307
  const s = String(url).replace(/[\x00-\x20]+/g, "").toLowerCase();
14258
14308
  return s.startsWith("javascript:") || s.startsWith("data:") || s.startsWith("vbscript:") ? void 0 : url;
14259
14309
  }
14260
- var Grid = React54__namespace.default.forwardRef(function Grid2({
14310
+ var Grid = /* @__PURE__ */ React55__namespace.default.forwardRef(function Grid2({
14261
14311
  as: Tag2 = "div",
14262
14312
  columns,
14263
14313
  minChildWidth,
@@ -14277,7 +14327,7 @@ var Grid = React54__namespace.default.forwardRef(function Grid2({
14277
14327
  }, ref) {
14278
14328
  const { flatStyle, styleNode, sxAttr } = useSx(sx);
14279
14329
  const responsive = columns != null && typeof columns === "object";
14280
- const uid = React54__namespace.default.useId();
14330
+ const uid = React55__namespace.default.useId();
14281
14331
  const gridId = responsive ? `g${uid.replace(/[^a-zA-Z0-9]/g, "")}` : null;
14282
14332
  let css = "";
14283
14333
  if (responsive) {
@@ -14323,7 +14373,6 @@ var Grid = React54__namespace.default.forwardRef(function Grid2({
14323
14373
  }
14324
14374
  );
14325
14375
  });
14326
- Grid.displayName = "Grid";
14327
14376
  var CARDGRID_CSS = `
14328
14377
  .twc-cardgrid { font-family: var(--font-sans); display: flex; flex-direction: column; gap: var(--space-3); }
14329
14378
  .twc-cardgrid__label { font-size: var(--text-sm); font-weight: var(--font-semibold); color: var(--color-text); }
@@ -14434,15 +14483,15 @@ function CardGrid({
14434
14483
  ...rest
14435
14484
  }) {
14436
14485
  const styles = useScopedStyles("twc-cardgrid-styles", CARDGRID_CSS);
14437
- const autoId = React54__namespace.default.useId();
14486
+ const autoId = React55__namespace.default.useId();
14438
14487
  const fieldId = id || autoId;
14439
- const [internalPage, setInternalPage] = React54__namespace.default.useState(defaultPage);
14488
+ const [internalPage, setInternalPage] = React55__namespace.default.useState(defaultPage);
14440
14489
  const pageVal = page !== void 0 ? page : internalPage;
14441
14490
  const commitPage = (p) => {
14442
14491
  onPageChange?.(p);
14443
14492
  if (page === void 0) setInternalPage(p);
14444
14493
  };
14445
- const [internalSize, setInternalSize] = React54__namespace.default.useState(pageSize > 0 ? pageSize : 12);
14494
+ const [internalSize, setInternalSize] = React55__namespace.default.useState(pageSize > 0 ? pageSize : 12);
14446
14495
  const sizeControlled = onPageSizeChange !== void 0;
14447
14496
  const sizeVal = sizeControlled ? pageSize > 0 ? pageSize : 12 : internalSize;
14448
14497
  const commitSize = (n) => {
@@ -14450,17 +14499,17 @@ function CardGrid({
14450
14499
  if (!sizeControlled) setInternalSize(n);
14451
14500
  commitPage(0);
14452
14501
  };
14453
- React54__namespace.default.useEffect(() => {
14502
+ React55__namespace.default.useEffect(() => {
14454
14503
  if (!sizeControlled) setInternalSize(pageSize > 0 ? pageSize : 12);
14455
14504
  }, [pageSize]);
14456
- const [internalQuick, setInternalQuick] = React54__namespace.default.useState(defaultQuickFilter);
14505
+ const [internalQuick, setInternalQuick] = React55__namespace.default.useState(defaultQuickFilter);
14457
14506
  const quickVal = quickFilter !== void 0 ? quickFilter : internalQuick;
14458
14507
  const commitQuick = (q) => {
14459
14508
  onQuickFilterChange?.(q);
14460
14509
  if (quickFilter === void 0) setInternalQuick(q);
14461
14510
  commitPage(0);
14462
14511
  };
14463
- const [internalSort, setInternalSort] = React54__namespace.default.useState(defaultSort);
14512
+ const [internalSort, setInternalSort] = React55__namespace.default.useState(defaultSort);
14464
14513
  const sortVal = sort !== void 0 ? sort : internalSort;
14465
14514
  const commitSort = (s) => {
14466
14515
  onSortChange?.(s);
@@ -14468,8 +14517,8 @@ function CardGrid({
14468
14517
  commitPage(0);
14469
14518
  };
14470
14519
  const filtersKey = JSON.stringify(filters);
14471
- const mounted = React54__namespace.default.useRef(false);
14472
- React54__namespace.default.useEffect(() => {
14520
+ const mounted = React55__namespace.default.useRef(false);
14521
+ React55__namespace.default.useEffect(() => {
14473
14522
  if (!mounted.current) {
14474
14523
  mounted.current = true;
14475
14524
  return;
@@ -14486,36 +14535,36 @@ function CardGrid({
14486
14535
  const pageKnowable = !(serverMode && rowCount == null) && !loading;
14487
14536
  const shownPage = pageKnowable ? Math.min(pageVal, lastPage) : pageVal;
14488
14537
  const pageRows = serverMode ? rows : paginated && shownPage !== pageVal ? client.filtered.slice(shownPage * sizeVal, shownPage * sizeVal + sizeVal) : client.rows;
14489
- const clampedFiltersKey = React54__namespace.default.useRef(filtersKey);
14490
- React54__namespace.default.useEffect(() => {
14538
+ const clampedFiltersKey = React55__namespace.default.useRef(filtersKey);
14539
+ React55__namespace.default.useEffect(() => {
14491
14540
  if (clampedFiltersKey.current !== filtersKey) {
14492
14541
  clampedFiltersKey.current = filtersKey;
14493
14542
  return;
14494
14543
  }
14495
14544
  if (pageKnowable && pageVal > lastPage) commitPage(lastPage);
14496
14545
  }, [lastPage, pageVal, pageKnowable, filtersKey]);
14497
- const onServerChangeRef = React54__namespace.default.useRef(onServerChange);
14546
+ const onServerChangeRef = React55__namespace.default.useRef(onServerChange);
14498
14547
  onServerChangeRef.current = onServerChange;
14499
14548
  const queryKey = JSON.stringify(query);
14500
- React54__namespace.default.useEffect(() => {
14549
+ React55__namespace.default.useEffect(() => {
14501
14550
  if (!serverMode) return void 0;
14502
14551
  const t = setTimeout(() => onServerChangeRef.current?.(JSON.parse(queryKey)), 250);
14503
14552
  return () => clearTimeout(t);
14504
14553
  }, [serverMode, queryKey]);
14505
14554
  const keyOf = typeof rowKey === "function" ? rowKey : (r2) => r2 && r2[rowKey];
14506
- const [selected, setSelected] = React54__namespace.default.useState(() => /* @__PURE__ */ new Set());
14555
+ const [selected, setSelected] = React55__namespace.default.useState(() => /* @__PURE__ */ new Set());
14507
14556
  const retainCap = retainSelectedRows === true ? 1e3 : retainSelectedRows || 0;
14508
- const retainedRef = React54__namespace.default.useRef(/* @__PURE__ */ new Map());
14509
- const selKeys = React54__namespace.default.useMemo(() => [...selected], [selected]);
14510
- const selectedRows = React54__namespace.default.useMemo(() => {
14557
+ const retainedRef = React55__namespace.default.useRef(/* @__PURE__ */ new Map());
14558
+ const selKeys = React55__namespace.default.useMemo(() => [...selected], [selected]);
14559
+ const selectedRows = React55__namespace.default.useMemo(() => {
14511
14560
  const onPage = new Map(pageRows.map((r2, i) => [keyOf(r2, i), r2]));
14512
14561
  return selKeys.map((k) => onPage.get(k) ?? retainedRef.current.get(k)).filter((r2) => r2 !== void 0);
14513
14562
  }, [selKeys, pageRows]);
14514
- const clearSelection = React54__namespace.default.useCallback(() => {
14563
+ const clearSelection = React55__namespace.default.useCallback(() => {
14515
14564
  retainedRef.current.clear();
14516
14565
  setSelected(/* @__PURE__ */ new Set());
14517
14566
  }, []);
14518
- const toggleKey = React54__namespace.default.useCallback((key, row) => {
14567
+ const toggleKey = React55__namespace.default.useCallback((key, row) => {
14519
14568
  setSelected((prev) => {
14520
14569
  const next = new Set(prev);
14521
14570
  if (next.has(key)) {
@@ -14548,10 +14597,10 @@ function CardGrid({
14548
14597
  return next;
14549
14598
  });
14550
14599
  };
14551
- const onSelRef = React54__namespace.default.useRef(onRowSelectionChange);
14600
+ const onSelRef = React55__namespace.default.useRef(onRowSelectionChange);
14552
14601
  onSelRef.current = onRowSelectionChange;
14553
- const prevSelSigRef = React54__namespace.default.useRef(null);
14554
- React54__namespace.default.useEffect(() => {
14602
+ const prevSelSigRef = React55__namespace.default.useRef(null);
14603
+ React55__namespace.default.useEffect(() => {
14555
14604
  const cb = onSelRef.current;
14556
14605
  if (!cb) return;
14557
14606
  const sig = selKeys.join(",");
@@ -14764,8 +14813,8 @@ function DiffTable({
14764
14813
  className = "",
14765
14814
  ...rest
14766
14815
  }) {
14767
- const dtColumns = React54__namespace.default.useMemo(() => columns.map(toDatatableColumn), [columns]);
14768
- const diff = React54__namespace.default.useMemo(
14816
+ const dtColumns = React55__namespace.default.useMemo(() => columns.map(toDatatableColumn), [columns]);
14817
+ const diff = React55__namespace.default.useMemo(
14769
14818
  () => ({ from, to, rowKey, onlyChanged, showToggle, showSummary, moveDetection, compare, toggleLabel }),
14770
14819
  [from, to, rowKey, onlyChanged, showToggle, showSummary, moveDetection, compare, toggleLabel]
14771
14820
  );
@@ -14922,26 +14971,26 @@ function DatePicker({
14922
14971
  }) {
14923
14972
  const __twcStyles0 = useScopedStyles("twc-field-styles", FIELD_CSS3);
14924
14973
  const __twcStyles1 = useScopedStyles("twc-datepicker-styles", DATEPICKER_CSS);
14925
- const autoId = React54__namespace.default.useId();
14974
+ const autoId = React55__namespace.default.useId();
14926
14975
  const fieldId = id || autoId;
14927
14976
  const descId = `${fieldId}-desc`;
14928
14977
  const invalid = Boolean(error);
14929
- const [internal, setInternal] = React54__namespace.default.useState(defaultValue);
14978
+ const [internal, setInternal] = React55__namespace.default.useState(defaultValue);
14930
14979
  const selected = value !== void 0 ? value : internal;
14931
- const [open, setOpen] = React54__namespace.default.useState(false);
14932
- const [view, setView] = React54__namespace.default.useState(selected || /* @__PURE__ */ new Date());
14933
- const [mode, setMode] = React54__namespace.default.useState("days");
14934
- const [focusDate, setFocusDate] = React54__namespace.default.useState(null);
14935
- const [focusMonth, setFocusMonth] = React54__namespace.default.useState(null);
14936
- const [focusYear, setFocusYear] = React54__namespace.default.useState(null);
14937
- const [editText, setEditText] = React54__namespace.default.useState(null);
14938
- const [coords, setCoords] = React54__namespace.default.useState(null);
14939
- const wrapRef = React54__namespace.default.useRef(null);
14940
- const triggerRef = React54__namespace.default.useRef(null);
14941
- const popRef = React54__namespace.default.useRef(null);
14942
- const gridRef = React54__namespace.default.useRef(null);
14980
+ const [open, setOpen] = React55__namespace.default.useState(false);
14981
+ const [view, setView] = React55__namespace.default.useState(selected || /* @__PURE__ */ new Date());
14982
+ const [mode, setMode] = React55__namespace.default.useState("days");
14983
+ const [focusDate, setFocusDate] = React55__namespace.default.useState(null);
14984
+ const [focusMonth, setFocusMonth] = React55__namespace.default.useState(null);
14985
+ const [focusYear, setFocusYear] = React55__namespace.default.useState(null);
14986
+ const [editText, setEditText] = React55__namespace.default.useState(null);
14987
+ const [coords, setCoords] = React55__namespace.default.useState(null);
14988
+ const wrapRef = React55__namespace.default.useRef(null);
14989
+ const triggerRef = React55__namespace.default.useRef(null);
14990
+ const popRef = React55__namespace.default.useRef(null);
14991
+ const gridRef = React55__namespace.default.useRef(null);
14943
14992
  const POP_W = 280;
14944
- const place = React54__namespace.default.useCallback(() => {
14993
+ const place = React55__namespace.default.useCallback(() => {
14945
14994
  const el = triggerRef.current;
14946
14995
  if (!el) return;
14947
14996
  const r2 = el.getBoundingClientRect();
@@ -14952,7 +15001,7 @@ function DatePicker({
14952
15001
  left = Math.max(8, left);
14953
15002
  setCoords({ left, top: flip ? void 0 : Math.round(r2.bottom + 6), bottom: flip ? Math.round(vh - r2.top + 6) : void 0 });
14954
15003
  }, []);
14955
- React54__namespace.default.useEffect(() => {
15004
+ React55__namespace.default.useEffect(() => {
14956
15005
  if (!open) return void 0;
14957
15006
  place();
14958
15007
  const onMove = () => place();
@@ -14970,7 +15019,7 @@ function DatePicker({
14970
15019
  ro?.disconnect();
14971
15020
  };
14972
15021
  }, [open, place]);
14973
- React54__namespace.default.useEffect(() => {
15022
+ React55__namespace.default.useEffect(() => {
14974
15023
  if (!open) return;
14975
15024
  setView(selected || /* @__PURE__ */ new Date());
14976
15025
  setMode("days");
@@ -14991,9 +15040,9 @@ function DatePicker({
14991
15040
  };
14992
15041
  }, [open]);
14993
15042
  useFocusTrap(popRef, open && !!coords, { initialFocus: () => gridRef.current?.querySelector('[tabindex="0"]') });
14994
- const months = React54__namespace.default.useMemo(() => locale === void 0 ? MONTHS : monthNames(locale), [locale]);
14995
- const monthsShort = React54__namespace.default.useMemo(() => locale === void 0 ? MONTHS.map((n) => n.slice(0, 3)) : monthShortNames(locale), [locale]);
14996
- const dows = React54__namespace.default.useMemo(
15043
+ const months = React55__namespace.default.useMemo(() => locale === void 0 ? MONTHS : monthNames(locale), [locale]);
15044
+ const monthsShort = React55__namespace.default.useMemo(() => locale === void 0 ? MONTHS.map((n) => n.slice(0, 3)) : monthShortNames(locale), [locale]);
15045
+ const dows = React55__namespace.default.useMemo(
14997
15046
  () => locale === void 0 ? Array.from({ length: 7 }, (_, i) => DOW[(i + weekStartsOn) % 7]) : weekdayNames(locale, weekStartsOn),
14998
15047
  [locale, weekStartsOn]
14999
15048
  );
@@ -15048,11 +15097,11 @@ function DatePicker({
15048
15097
  };
15049
15098
  const cells = Array.from({ length: 42 }, (_, i) => new Date(gridStart.getFullYear(), gridStart.getMonth(), gridStart.getDate() + i));
15050
15099
  const tabbableDate = (focusDate && cells.some((c) => sameDay(c, focusDate)) ? focusDate : null) || (selected && cells.some((c) => sameDay(c, selected)) ? selected : null) || (cells.some((c) => sameDay(c, today)) ? today : null) || new Date(y, m, 1);
15051
- React54__namespace.default.useEffect(() => {
15100
+ React55__namespace.default.useEffect(() => {
15052
15101
  if (!open || mode !== "days" || !focusDate) return;
15053
15102
  gridRef.current?.querySelector(`[data-key="${keyOf(focusDate)}"]`)?.focus();
15054
15103
  }, [focusDate, open, mode]);
15055
- React54__namespace.default.useEffect(() => {
15104
+ React55__namespace.default.useEffect(() => {
15056
15105
  if (!open || mode !== "months" || focusMonth == null) return;
15057
15106
  gridRef.current?.querySelector(`[data-mo="${focusMonth}"]`)?.focus();
15058
15107
  }, [focusMonth, open, mode]);
@@ -15076,7 +15125,7 @@ function DatePicker({
15076
15125
  }
15077
15126
  setFocusMonth(next);
15078
15127
  };
15079
- React54__namespace.default.useEffect(() => {
15128
+ React55__namespace.default.useEffect(() => {
15080
15129
  if (!open || mode !== "years" || focusYear == null) return;
15081
15130
  gridRef.current?.querySelector(`[data-yr="${focusYear}"]`)?.focus();
15082
15131
  }, [focusYear, open, mode]);
@@ -15483,29 +15532,29 @@ function DateRangePicker({
15483
15532
  }) {
15484
15533
  const __twcStyles0 = useScopedStyles("twc-field-styles", FIELD_CSS4);
15485
15534
  const __twcStyles1 = useScopedStyles("twc-drp-styles", RANGE_CSS2);
15486
- const [internal, setInternal] = React54__namespace.default.useState(defaultValue);
15535
+ const [internal, setInternal] = React55__namespace.default.useState(defaultValue);
15487
15536
  const range2 = value !== void 0 ? value : internal;
15488
- const [open, setOpen] = React54__namespace.default.useState(false);
15489
- const [view, setView] = React54__namespace.default.useState(range2.start || /* @__PURE__ */ new Date());
15490
- const [hover, setHover] = React54__namespace.default.useState(null);
15491
- const [focusDate, setFocusDate] = React54__namespace.default.useState(null);
15492
- const [mode, setMode] = React54__namespace.default.useState("days");
15493
- const [focusMonth, setFocusMonth] = React54__namespace.default.useState(null);
15494
- const [focusYear, setFocusYear] = React54__namespace.default.useState(null);
15495
- const [editText, setEditText] = React54__namespace.default.useState(null);
15496
- const [coords, setCoords] = React54__namespace.default.useState(null);
15497
- const wrapRef = React54__namespace.default.useRef(null);
15498
- const triggerRef = React54__namespace.default.useRef(null);
15499
- const popRef = React54__namespace.default.useRef(null);
15500
- const gridRef = React54__namespace.default.useRef(null);
15501
- const labelId = React54__namespace.default.useId();
15537
+ const [open, setOpen] = React55__namespace.default.useState(false);
15538
+ const [view, setView] = React55__namespace.default.useState(range2.start || /* @__PURE__ */ new Date());
15539
+ const [hover, setHover] = React55__namespace.default.useState(null);
15540
+ const [focusDate, setFocusDate] = React55__namespace.default.useState(null);
15541
+ const [mode, setMode] = React55__namespace.default.useState("days");
15542
+ const [focusMonth, setFocusMonth] = React55__namespace.default.useState(null);
15543
+ const [focusYear, setFocusYear] = React55__namespace.default.useState(null);
15544
+ const [editText, setEditText] = React55__namespace.default.useState(null);
15545
+ const [coords, setCoords] = React55__namespace.default.useState(null);
15546
+ const wrapRef = React55__namespace.default.useRef(null);
15547
+ const triggerRef = React55__namespace.default.useRef(null);
15548
+ const popRef = React55__namespace.default.useRef(null);
15549
+ const gridRef = React55__namespace.default.useRef(null);
15550
+ const labelId = React55__namespace.default.useId();
15502
15551
  const descId = `${labelId}-desc`;
15503
15552
  const invalid = Boolean(error);
15504
- React54__namespace.default.useEffect(() => {
15553
+ React55__namespace.default.useEffect(() => {
15505
15554
  if (disabled) setOpen(false);
15506
15555
  }, [disabled]);
15507
15556
  const POP_W = 420;
15508
- const place = React54__namespace.default.useCallback(() => {
15557
+ const place = React55__namespace.default.useCallback(() => {
15509
15558
  const el = triggerRef.current;
15510
15559
  if (!el) return;
15511
15560
  const r2 = el.getBoundingClientRect();
@@ -15516,7 +15565,7 @@ function DateRangePicker({
15516
15565
  left = Math.max(8, left);
15517
15566
  setCoords({ left, top: flip ? void 0 : Math.round(r2.bottom + 6), bottom: flip ? Math.round(vh - r2.top + 6) : void 0 });
15518
15567
  }, []);
15519
- React54__namespace.default.useEffect(() => {
15568
+ React55__namespace.default.useEffect(() => {
15520
15569
  if (!open) return void 0;
15521
15570
  place();
15522
15571
  const onMove = () => place();
@@ -15534,7 +15583,7 @@ function DateRangePicker({
15534
15583
  ro?.disconnect();
15535
15584
  };
15536
15585
  }, [open, place]);
15537
- React54__namespace.default.useEffect(() => {
15586
+ React55__namespace.default.useEffect(() => {
15538
15587
  if (!open) return;
15539
15588
  const onDown = (e) => {
15540
15589
  if (wrapRef.current && wrapRef.current.contains(e.target)) return;
@@ -15598,20 +15647,20 @@ function DateRangePicker({
15598
15647
  const last = new Date(d.getFullYear(), d.getMonth() + n + 1, 0);
15599
15648
  return new Date(last.getFullYear(), last.getMonth(), Math.min(d.getDate(), last.getDate()));
15600
15649
  };
15601
- React54__namespace.default.useEffect(() => {
15650
+ React55__namespace.default.useEffect(() => {
15602
15651
  if (!open) {
15603
15652
  setFocusDate(null);
15604
15653
  setHover(null);
15605
15654
  setMode("days");
15606
15655
  }
15607
15656
  }, [open]);
15608
- React54__namespace.default.useEffect(() => {
15657
+ React55__namespace.default.useEffect(() => {
15609
15658
  if (open && mode === "months" && focusMonth != null) gridRef.current?.querySelector(`[data-mo="${focusMonth}"]`)?.focus();
15610
15659
  }, [focusMonth, open, mode]);
15611
- React54__namespace.default.useEffect(() => {
15660
+ React55__namespace.default.useEffect(() => {
15612
15661
  if (open && mode === "years" && focusYear != null) gridRef.current?.querySelector(`[data-yr="${focusYear}"]`)?.focus();
15613
15662
  }, [focusYear, open, mode]);
15614
- React54__namespace.default.useEffect(() => {
15663
+ React55__namespace.default.useEffect(() => {
15615
15664
  if (!open || !focusDate) return;
15616
15665
  gridRef.current?.querySelector(`[data-key="${keyOf(focusDate)}"]`)?.focus();
15617
15666
  }, [focusDate, open]);
@@ -15696,9 +15745,9 @@ function DateRangePicker({
15696
15745
  if (r2.start) setView(r2.start);
15697
15746
  setOpen(false);
15698
15747
  };
15699
- const months = React54__namespace.default.useMemo(() => locale === void 0 ? MONTHS2 : monthNames2(locale), [locale]);
15700
- const monthsShort = React54__namespace.default.useMemo(() => months.map((n) => n.slice(0, 3)), [months]);
15701
- const dows = React54__namespace.default.useMemo(
15748
+ const months = React55__namespace.default.useMemo(() => locale === void 0 ? MONTHS2 : monthNames2(locale), [locale]);
15749
+ const monthsShort = React55__namespace.default.useMemo(() => months.map((n) => n.slice(0, 3)), [months]);
15750
+ const dows = React55__namespace.default.useMemo(
15702
15751
  () => locale === void 0 ? Array.from({ length: 7 }, (_, i) => DOW2[(i + weekStartsOn) % 7]) : weekdayNames2(locale, weekStartsOn),
15703
15752
  [locale, weekStartsOn]
15704
15753
  );
@@ -16053,19 +16102,19 @@ function TimePicker({
16053
16102
  }) {
16054
16103
  const __twcStyles0 = useScopedStyles("twc-field-styles", FIELD_CSS5);
16055
16104
  const __twcStyles1 = useScopedStyles("twc-timepicker-styles", TIMEPICKER_CSS);
16056
- const autoId = React54__namespace.default.useId();
16105
+ const autoId = React55__namespace.default.useId();
16057
16106
  const fieldId = id || autoId;
16058
16107
  const descId = `${fieldId}-desc`;
16059
16108
  const invalid = Boolean(error);
16060
- const [internal, setInternal] = React54__namespace.default.useState(defaultValue);
16109
+ const [internal, setInternal] = React55__namespace.default.useState(defaultValue);
16061
16110
  const selected = value !== void 0 ? value : internal;
16062
- const [open, setOpen] = React54__namespace.default.useState(false);
16063
- const [editText, setEditText] = React54__namespace.default.useState(null);
16064
- const [coords, setCoords] = React54__namespace.default.useState(null);
16065
- const wrapRef = React54__namespace.default.useRef(null);
16066
- const triggerRef = React54__namespace.default.useRef(null);
16067
- const popRef = React54__namespace.default.useRef(null);
16068
- const place = React54__namespace.default.useCallback(() => {
16111
+ const [open, setOpen] = React55__namespace.default.useState(false);
16112
+ const [editText, setEditText] = React55__namespace.default.useState(null);
16113
+ const [coords, setCoords] = React55__namespace.default.useState(null);
16114
+ const wrapRef = React55__namespace.default.useRef(null);
16115
+ const triggerRef = React55__namespace.default.useRef(null);
16116
+ const popRef = React55__namespace.default.useRef(null);
16117
+ const place = React55__namespace.default.useCallback(() => {
16069
16118
  const el = triggerRef.current;
16070
16119
  if (!el) return;
16071
16120
  const r2 = el.getBoundingClientRect();
@@ -16076,7 +16125,7 @@ function TimePicker({
16076
16125
  left = Math.max(8, left);
16077
16126
  setCoords({ left, top: flip ? void 0 : Math.round(r2.bottom + 6), bottom: flip ? Math.round(vh - r2.top + 6) : void 0 });
16078
16127
  }, []);
16079
- React54__namespace.default.useEffect(() => {
16128
+ React55__namespace.default.useEffect(() => {
16080
16129
  if (!open) return void 0;
16081
16130
  place();
16082
16131
  const onMove = () => place();
@@ -16094,7 +16143,7 @@ function TimePicker({
16094
16143
  ro?.disconnect();
16095
16144
  };
16096
16145
  }, [open, place]);
16097
- React54__namespace.default.useEffect(() => {
16146
+ React55__namespace.default.useEffect(() => {
16098
16147
  if (!open) return void 0;
16099
16148
  const onDown = (e) => {
16100
16149
  if (wrapRef.current && wrapRef.current.contains(e.target)) return;
@@ -16114,7 +16163,7 @@ function TimePicker({
16114
16163
  useFocusTrap(popRef, open && !!coords, {
16115
16164
  initialFocus: () => popRef.current?.querySelector('.twc-tp__opt[data-selected="true"]') || popRef.current?.querySelector('.twc-tp__opt[tabindex="0"]')
16116
16165
  });
16117
- React54__namespace.default.useEffect(() => {
16166
+ React55__namespace.default.useEffect(() => {
16118
16167
  if (!open || !coords) return;
16119
16168
  popRef.current?.querySelectorAll('.twc-tp__opt[data-selected="true"]').forEach((el) => el.scrollIntoView({ block: "center" }));
16120
16169
  }, [open, coords]);
@@ -16462,10 +16511,10 @@ function DateTimePicker({
16462
16511
  }) {
16463
16512
  const __twcStyles0 = useScopedStyles("twc-field-styles", FIELD_CSS6);
16464
16513
  const __twcStyles1 = useScopedStyles("twc-datetimepicker-styles", DTP_CSS);
16465
- const autoId = React54__namespace.default.useId();
16514
+ const autoId = React55__namespace.default.useId();
16466
16515
  const fieldId = id || autoId;
16467
16516
  const descId = `${fieldId}-desc`;
16468
- const [internal, setInternal] = React54__namespace.default.useState(defaultValue);
16517
+ const [internal, setInternal] = React55__namespace.default.useState(defaultValue);
16469
16518
  const selected = value !== void 0 ? value : internal;
16470
16519
  const commitVal = (d) => {
16471
16520
  if (value === void 0) setInternal(d);
@@ -16609,11 +16658,11 @@ function FilterBar({
16609
16658
  ...rest
16610
16659
  }) {
16611
16660
  const styles = useScopedStyles("twc-filterbar-styles", FILTERBAR_CSS);
16612
- const autoId = React54__namespace.default.useId();
16661
+ const autoId = React55__namespace.default.useId();
16613
16662
  const fieldId = id || autoId;
16614
- const [internal, setInternal] = React54__namespace.default.useState(defaultValue);
16663
+ const [internal, setInternal] = React55__namespace.default.useState(defaultValue);
16615
16664
  const clauses = value !== void 0 ? value : internal;
16616
- const values = React54__namespace.default.useMemo(() => clausesToValues(fields, clauses), [fields, clauses]);
16665
+ const values = React55__namespace.default.useMemo(() => clausesToValues(fields, clauses), [fields, clauses]);
16617
16666
  const emit = (nextValues) => {
16618
16667
  const next = valuesToClauses(fields, nextValues);
16619
16668
  if (value === void 0) setInternal(next);
@@ -16797,14 +16846,14 @@ function Dialog({
16797
16846
  className = "",
16798
16847
  ...rest
16799
16848
  }) {
16800
- const autoId = React54__namespace.default.useId();
16849
+ const autoId = React55__namespace.default.useId();
16801
16850
  const titleId = `${autoId}-title`;
16802
16851
  const descId = `${autoId}-desc`;
16803
- const dialogRef = React54__namespace.default.useRef(null);
16852
+ const dialogRef = React55__namespace.default.useRef(null);
16804
16853
  const __twcStyles = useScopedStyles("twc-dialog-styles", DIALOG_CSS);
16805
16854
  const renderPortal = usePortal();
16806
- const [mounted, setMounted] = React54__namespace.default.useState(open);
16807
- React54__namespace.default.useEffect(() => {
16855
+ const [mounted, setMounted] = React55__namespace.default.useState(open);
16856
+ React55__namespace.default.useEffect(() => {
16808
16857
  if (open) {
16809
16858
  setMounted(true);
16810
16859
  return;
@@ -16816,7 +16865,7 @@ function Dialog({
16816
16865
  useInertBackground(dialogRef, open && mounted);
16817
16866
  useFocusTrap(dialogRef, open && mounted);
16818
16867
  const isTop = useLayer(open && mounted);
16819
- React54__namespace.default.useEffect(() => {
16868
+ React55__namespace.default.useEffect(() => {
16820
16869
  if (!open) return void 0;
16821
16870
  const onKey = (e) => {
16822
16871
  if (e.defaultPrevented || !isTop()) return;
@@ -16969,14 +17018,14 @@ function Drawer({
16969
17018
  style,
16970
17019
  ...rest
16971
17020
  }) {
16972
- const autoId = React54__namespace.default.useId();
17021
+ const autoId = React55__namespace.default.useId();
16973
17022
  const titleId = `${autoId}-title`;
16974
17023
  const descId = `${autoId}-desc`;
16975
- const panelRef = React54__namespace.default.useRef(null);
17024
+ const panelRef = React55__namespace.default.useRef(null);
16976
17025
  const __twcStyles = useScopedStyles("twc-drawer-styles", DRAWER_CSS);
16977
17026
  const renderPortal = usePortal();
16978
- const [mounted, setMounted] = React54__namespace.default.useState(open);
16979
- React54__namespace.default.useEffect(() => {
17027
+ const [mounted, setMounted] = React55__namespace.default.useState(open);
17028
+ React55__namespace.default.useEffect(() => {
16980
17029
  if (open) {
16981
17030
  setMounted(true);
16982
17031
  return;
@@ -16988,7 +17037,7 @@ function Drawer({
16988
17037
  useInertBackground(panelRef, open && mounted);
16989
17038
  useFocusTrap(panelRef, open && mounted);
16990
17039
  const isTop = useLayer(open && mounted);
16991
- React54__namespace.default.useEffect(() => {
17040
+ React55__namespace.default.useEffect(() => {
16992
17041
  if (!open) return void 0;
16993
17042
  const onKey = (e) => {
16994
17043
  if (e.defaultPrevented || !isTop()) return;
@@ -17078,11 +17127,11 @@ function Field({
17078
17127
  ...rest
17079
17128
  }) {
17080
17129
  const __twcStyles = useScopedStyles("twc-field-styles", FIELD_CSS7);
17081
- const autoId = React54__namespace.default.useId();
17130
+ const autoId = React55__namespace.default.useId();
17082
17131
  const fieldId = id || autoId;
17083
17132
  const descId = `${fieldId}-desc`;
17084
17133
  const hasMsg = Boolean(error || hint);
17085
- const control = React54__namespace.default.isValidElement(children) ? React54__namespace.default.cloneElement(children, {
17134
+ const control = React55__namespace.default.isValidElement(children) ? React55__namespace.default.cloneElement(children, {
17086
17135
  "aria-describedby": [children.props["aria-describedby"], hasMsg ? descId : null].filter(Boolean).join(" ") || void 0,
17087
17136
  "aria-invalid": children.props["aria-invalid"] !== void 0 ? children.props["aria-invalid"] : error ? true : void 0
17088
17137
  }) : children;
@@ -17182,7 +17231,7 @@ function fmtSize(bytes) {
17182
17231
  if (bytes < 1024 * 1024) return (bytes / 1024).toFixed(1) + " KB";
17183
17232
  return (bytes / (1024 * 1024)).toFixed(1) + " MB";
17184
17233
  }
17185
- var FileUpload = React54__namespace.default.forwardRef(function FileUpload2({
17234
+ var FileUpload = /* @__PURE__ */ React55__namespace.default.forwardRef(function FileUpload2({
17186
17235
  accept,
17187
17236
  multiple = false,
17188
17237
  disabled = false,
@@ -17207,12 +17256,12 @@ var FileUpload = React54__namespace.default.forwardRef(function FileUpload2({
17207
17256
  ...rest
17208
17257
  }, ref) {
17209
17258
  const __twcStyles = useScopedStyles("twc-upload-styles", UPLOAD_CSS);
17210
- const [internal, setInternal] = React54__namespace.default.useState(defaultValue);
17259
+ const [internal, setInternal] = React55__namespace.default.useState(defaultValue);
17211
17260
  const files = value !== void 0 ? value : internal;
17212
- const [drag, setDrag] = React54__namespace.default.useState(false);
17213
- const inputRef = React54__namespace.default.useRef(null);
17214
- React54__namespace.default.useImperativeHandle(ref, () => ({ open: () => inputRef.current?.click() }), []);
17215
- const autoId = React54__namespace.default.useId();
17261
+ const [drag, setDrag] = React55__namespace.default.useState(false);
17262
+ const inputRef = React55__namespace.default.useRef(null);
17263
+ React55__namespace.default.useImperativeHandle(ref, () => ({ open: () => inputRef.current?.click() }), []);
17264
+ const autoId = React55__namespace.default.useId();
17216
17265
  const fieldId = id || autoId;
17217
17266
  const descId = `${fieldId}-desc`;
17218
17267
  const labelId = `${fieldId}-label`;
@@ -17255,7 +17304,7 @@ var FileUpload = React54__namespace.default.forwardRef(function FileUpload2({
17255
17304
  )
17256
17305
  );
17257
17306
  if (trigger) {
17258
- const triggerEl = React54__namespace.default.isValidElement(trigger) && error ? React54__namespace.default.cloneElement(trigger, {
17307
+ const triggerEl = React55__namespace.default.isValidElement(trigger) && error ? React55__namespace.default.cloneElement(trigger, {
17259
17308
  "aria-describedby": [trigger.props["aria-describedby"], descId].filter(Boolean).join(" ") || void 0
17260
17309
  }) : trigger;
17261
17310
  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `twc-upload ${className}`, "data-size": size, ...rest, children: [
@@ -17349,7 +17398,6 @@ var FileUpload = React54__namespace.default.forwardRef(function FileUpload2({
17349
17398
  error ? /* @__PURE__ */ jsxRuntime.jsx("span", { id: descId, className: "twc-field__error", children: error }) : null
17350
17399
  ] });
17351
17400
  });
17352
- FileUpload.displayName = "FileUpload";
17353
17401
  var TOGGLEGROUP_CSS = `
17354
17402
  .twc-togglegroup { display: inline-flex; gap: var(--space-1); }
17355
17403
  .twc-togglegroup[data-orientation="vertical"] { flex-direction: column; align-items: stretch; }
@@ -17371,10 +17419,10 @@ function ToggleGroup({
17371
17419
  ...rest
17372
17420
  }) {
17373
17421
  const __twcStyles = useScopedStyles("twc-togglegroup-styles", TOGGLEGROUP_CSS);
17374
- const groupRef = React54__namespace.default.useRef(null);
17422
+ const groupRef = React55__namespace.default.useRef(null);
17375
17423
  const multiple = type === "multiple";
17376
- const [focusedIdx, setFocusedIdx] = React54__namespace.default.useState(null);
17377
- const [internal, setInternal] = React54__namespace.default.useState(defaultValue !== void 0 ? defaultValue : multiple ? [] : null);
17424
+ const [focusedIdx, setFocusedIdx] = React55__namespace.default.useState(null);
17425
+ const [internal, setInternal] = React55__namespace.default.useState(defaultValue !== void 0 ? defaultValue : multiple ? [] : null);
17378
17426
  const current = value !== void 0 ? value : internal;
17379
17427
  const isSelected = (v) => multiple ? Array.isArray(current) && current.includes(v) : current === v;
17380
17428
  const commit = (next) => {
@@ -17495,15 +17543,15 @@ function Kanban({
17495
17543
  ...rest
17496
17544
  }) {
17497
17545
  const __twcStyles = useScopedStyles("twc-kanban-styles", KANBAN_CSS);
17498
- const [internal, setInternal] = React54__namespace.default.useState(cards ?? defaultCards ?? []);
17546
+ const [internal, setInternal] = React55__namespace.default.useState(cards ?? defaultCards ?? []);
17499
17547
  const items = cards !== void 0 ? cards : internal;
17500
- const [drag, setDrag] = React54__namespace.default.useState(null);
17501
- const [overCol, setOverCol] = React54__namespace.default.useState(null);
17502
- const [grab, setGrab] = React54__namespace.default.useState(null);
17503
- const [announce, setAnnounce] = React54__namespace.default.useState("");
17504
- const rootRef = React54__namespace.default.useRef(null);
17505
- const focusIdRef = React54__namespace.default.useRef(null);
17506
- React54__namespace.default.useEffect(() => {
17548
+ const [drag, setDrag] = React55__namespace.default.useState(null);
17549
+ const [overCol, setOverCol] = React55__namespace.default.useState(null);
17550
+ const [grab, setGrab] = React55__namespace.default.useState(null);
17551
+ const [announce, setAnnounce] = React55__namespace.default.useState("");
17552
+ const rootRef = React55__namespace.default.useRef(null);
17553
+ const focusIdRef = React55__namespace.default.useRef(null);
17554
+ React55__namespace.default.useEffect(() => {
17507
17555
  if (focusIdRef.current == null) return void 0;
17508
17556
  const raf = requestAnimationFrame(() => {
17509
17557
  const id = focusIdRef.current;
@@ -17822,22 +17870,22 @@ function Popover({
17822
17870
  ...rest
17823
17871
  }) {
17824
17872
  const __twcStyles = useScopedStyles("twc-popover-styles", POPOVER_CSS);
17825
- const [openState, setOpenState] = React54__namespace.default.useState(defaultOpen);
17826
- const [render, setRender] = React54__namespace.default.useState(false);
17827
- const [pos, setPos] = React54__namespace.default.useState(null);
17828
- const wrapRef = React54__namespace.default.useRef(null);
17873
+ const [openState, setOpenState] = React55__namespace.default.useState(defaultOpen);
17874
+ const [render, setRender] = React55__namespace.default.useState(false);
17875
+ const [pos, setPos] = React55__namespace.default.useState(null);
17876
+ const wrapRef = React55__namespace.default.useRef(null);
17829
17877
  useTriggerAudit(wrapRef, "Popover");
17830
- const popRef = React54__namespace.default.useRef(null);
17831
- const popId = React54__namespace.default.useId();
17878
+ const popRef = React55__namespace.default.useRef(null);
17879
+ const popId = React55__namespace.default.useId();
17832
17880
  const controlled = openProp !== void 0;
17833
17881
  const open = controlled ? !!openProp : openState;
17834
- const openRef = React54__namespace.default.useRef(open);
17882
+ const openRef = React55__namespace.default.useRef(open);
17835
17883
  openRef.current = open;
17836
- const controlledRef = React54__namespace.default.useRef(controlled);
17884
+ const controlledRef = React55__namespace.default.useRef(controlled);
17837
17885
  controlledRef.current = controlled;
17838
- const onOpenChangeRef = React54__namespace.default.useRef(onOpenChange);
17886
+ const onOpenChangeRef = React55__namespace.default.useRef(onOpenChange);
17839
17887
  onOpenChangeRef.current = onOpenChange;
17840
- const setOpen = React54__namespace.default.useCallback((next) => {
17888
+ const setOpen = React55__namespace.default.useCallback((next) => {
17841
17889
  const value = typeof next === "function" ? next(openRef.current) : next;
17842
17890
  if (value === openRef.current) return;
17843
17891
  if (!controlledRef.current) setOpenState(value);
@@ -17845,7 +17893,7 @@ function Popover({
17845
17893
  }, []);
17846
17894
  const toggle = () => setOpen((o) => !o);
17847
17895
  const RD = { createPortal: typeof reactDom.createPortal === "function" ? reactDom.createPortal : typeof window !== "undefined" && window.ReactDOM && window.ReactDOM.createPortal };
17848
- const place = React54__namespace.default.useCallback(() => {
17896
+ const place = React55__namespace.default.useCallback(() => {
17849
17897
  const t = wrapRef.current;
17850
17898
  if (!t) return;
17851
17899
  const r2 = t.getBoundingClientRect();
@@ -17883,7 +17931,7 @@ function Popover({
17883
17931
  setPos({ top, left, width: w, flip: false, arrow, maxHeight: vh - 2 * M });
17884
17932
  }, [placement, align, width]);
17885
17933
  const isTop = useLayer(open && render);
17886
- React54__namespace.default.useEffect(() => {
17934
+ React55__namespace.default.useEffect(() => {
17887
17935
  if (!open) return;
17888
17936
  place();
17889
17937
  const onMove = () => place();
@@ -17910,7 +17958,7 @@ function Popover({
17910
17958
  document.removeEventListener("keydown", onKey);
17911
17959
  };
17912
17960
  }, [open, place, isTop]);
17913
- React54__namespace.default.useEffect(() => {
17961
+ React55__namespace.default.useEffect(() => {
17914
17962
  if (open) {
17915
17963
  setRender(true);
17916
17964
  return;
@@ -17918,12 +17966,12 @@ function Popover({
17918
17966
  const t = setTimeout(() => setRender(false), 170);
17919
17967
  return () => clearTimeout(t);
17920
17968
  }, [open]);
17921
- React54__namespace.default.useEffect(() => {
17969
+ React55__namespace.default.useEffect(() => {
17922
17970
  if (render && open) place();
17923
17971
  }, [render, place]);
17924
- const restoreRef = React54__namespace.default.useRef(null);
17925
- const needFocusRef = React54__namespace.default.useRef(false);
17926
- React54__namespace.default.useEffect(() => {
17972
+ const restoreRef = React55__namespace.default.useRef(null);
17973
+ const needFocusRef = React55__namespace.default.useRef(false);
17974
+ React55__namespace.default.useEffect(() => {
17927
17975
  if (open) {
17928
17976
  restoreRef.current = document.activeElement;
17929
17977
  needFocusRef.current = true;
@@ -17959,7 +18007,7 @@ function Popover({
17959
18007
  }
17960
18008
  ) : null;
17961
18009
  const fix = {};
17962
- if (React54__namespace.default.isValidElement(trigger)) {
18010
+ if (React55__namespace.default.isValidElement(trigger)) {
17963
18011
  if (!triggerIsControl(trigger)) fix.role = "button";
17964
18012
  fix.onKeyDown = (e) => {
17965
18013
  trigger.props.onKeyDown?.(e);
@@ -17971,7 +18019,7 @@ function Popover({
17971
18019
  }
17972
18020
  };
17973
18021
  }
17974
- const triggerEl = React54__namespace.default.isValidElement(trigger) ? React54__namespace.default.cloneElement(trigger, {
18022
+ const triggerEl = React55__namespace.default.isValidElement(trigger) ? React55__namespace.default.cloneElement(trigger, {
17975
18023
  onClick: (e) => {
17976
18024
  trigger.props.onClick?.(e);
17977
18025
  toggle();
@@ -18018,7 +18066,7 @@ function Progress({
18018
18066
  className = "",
18019
18067
  ...rest
18020
18068
  }) {
18021
- const labelId = React54__namespace.default.useId();
18069
+ const labelId = React55__namespace.default.useId();
18022
18070
  const { "aria-label": ariaLabel, "aria-labelledby": ariaLabelledby, ...restProps } = rest;
18023
18071
  const __twcStyles = useScopedStyles("twc-progress-styles", `
18024
18072
  .twc-progress-wrap { display: flex; flex-direction: column; gap: 6px; font-family: var(--font-sans); }
@@ -18089,7 +18137,7 @@ function Progress({
18089
18137
  ] })
18090
18138
  );
18091
18139
  }
18092
- function Radio({
18140
+ var Radio = /* @__PURE__ */ React55__namespace.default.forwardRef(function Radio2({
18093
18141
  label,
18094
18142
  description,
18095
18143
  error,
@@ -18105,7 +18153,7 @@ function Radio({
18105
18153
  className = "",
18106
18154
  onChange,
18107
18155
  ...rest
18108
- }) {
18156
+ }, ref) {
18109
18157
  const __twcStyles = useScopedStyles("twc-radio-styles", `
18110
18158
  .twc-radio { display: inline-flex; align-items: flex-start; gap: var(--space-2-5); cursor: pointer; font-family: var(--font-sans); }
18111
18159
  /* tone \u2192 accent set (default primary). Mirrors Button's --_accent model; Badge's tone vocabulary. */
@@ -18145,7 +18193,7 @@ function Radio({
18145
18193
  .twc-field { display: flex; flex-direction: column; gap: var(--space-1-5); font-family: var(--font-sans); }
18146
18194
  .twc-field__error { font-size: var(--text-xs); color: var(--color-danger-subtle-fg); font-weight: var(--font-medium); }
18147
18195
  `);
18148
- const autoId = React54__namespace.default.useId();
18196
+ const autoId = React55__namespace.default.useId();
18149
18197
  const fieldId = id || autoId;
18150
18198
  const errId = `${fieldId}-error`;
18151
18199
  const invalid = Boolean(error);
@@ -18158,6 +18206,7 @@ function Radio({
18158
18206
  /* @__PURE__ */ jsxRuntime.jsx(
18159
18207
  "input",
18160
18208
  {
18209
+ ref,
18161
18210
  id: fieldId,
18162
18211
  type: "radio",
18163
18212
  className: "twc-radio__input",
@@ -18188,7 +18237,7 @@ function Radio({
18188
18237
  control,
18189
18238
  /* @__PURE__ */ jsxRuntime.jsx("span", { id: errId, className: "twc-field__error", children: error })
18190
18239
  ] });
18191
- }
18240
+ });
18192
18241
  var RADIO_GROUP_CSS = `
18193
18242
  .twc-field { display: flex; flex-direction: column; gap: var(--space-1-5); font-family: var(--font-sans); }
18194
18243
  .twc-field__label { font-size: var(--text-sm); font-weight: var(--font-semibold); color: var(--color-text); display: flex; gap: 4px; align-items: center; }
@@ -18218,13 +18267,13 @@ function RadioGroup({
18218
18267
  ...rest
18219
18268
  }) {
18220
18269
  const __twcStyles = useScopedStyles("twc-radio-group-styles", RADIO_GROUP_CSS);
18221
- const autoId = React54__namespace.default.useId();
18270
+ const autoId = React55__namespace.default.useId();
18222
18271
  const fieldId = id || autoId;
18223
18272
  const labelId = `${fieldId}-label`;
18224
18273
  const descId = `${fieldId}-desc`;
18225
18274
  const groupName = name || `${fieldId}-name`;
18226
18275
  const invalid = Boolean(error);
18227
- const [internal, setInternal] = React54__namespace.default.useState(defaultValue);
18276
+ const [internal, setInternal] = React55__namespace.default.useState(defaultValue);
18228
18277
  const current = value !== void 0 ? value : internal;
18229
18278
  const select = (v) => {
18230
18279
  if (value === void 0) setInternal(v);
@@ -18245,10 +18294,10 @@ function RadioGroup({
18245
18294
  tone
18246
18295
  },
18247
18296
  o.value
18248
- )) : React54__namespace.default.Children.map(children, (child) => {
18249
- if (!React54__namespace.default.isValidElement(child)) return child;
18297
+ )) : React55__namespace.default.Children.map(children, (child) => {
18298
+ if (!React55__namespace.default.isValidElement(child)) return child;
18250
18299
  const v = child.props.value;
18251
- return React54__namespace.default.cloneElement(child, {
18300
+ return React55__namespace.default.cloneElement(child, {
18252
18301
  name: child.props.name ?? groupName,
18253
18302
  checked: child.props.checked ?? current === v,
18254
18303
  onChange: child.props.onChange ?? (() => select(v)),
@@ -18328,12 +18377,12 @@ function Rating({
18328
18377
  ...rest
18329
18378
  }) {
18330
18379
  const __twcStyles = useScopedStyles("twc-rating-styles", RATING_CSS);
18331
- const [internal, setInternal] = React54__namespace.default.useState(defaultValue);
18332
- const [hover, setHover] = React54__namespace.default.useState(0);
18380
+ const [internal, setInternal] = React55__namespace.default.useState(defaultValue);
18381
+ const [hover, setHover] = React55__namespace.default.useState(0);
18333
18382
  const val = value !== void 0 ? value : internal;
18334
18383
  const shown = hover || val;
18335
18384
  const interactive = !readOnly && !disabled;
18336
- const btnRefs = React54__namespace.default.useRef([]);
18385
+ const btnRefs = React55__namespace.default.useRef([]);
18337
18386
  const tabStar = Math.min(count, Math.max(1, Math.round(val) || 1));
18338
18387
  const fmt = (v) => format ? format(v) : Number.isInteger(v) ? String(v) : v.toFixed(1);
18339
18388
  if (process.env.NODE_ENV !== "production" && interactive && !Number.isInteger(val)) {
@@ -18538,24 +18587,24 @@ function Sidebar({
18538
18587
  ...rest
18539
18588
  }) {
18540
18589
  const __twcStyles = useScopedStyles("twc-sidebar-styles", SIDEBAR_CSS);
18541
- const navId = React54__namespace.default.useId();
18542
- const panelRef = React54__namespace.default.useRef(null);
18590
+ const navId = React55__namespace.default.useId();
18591
+ const panelRef = React55__namespace.default.useRef(null);
18543
18592
  const renderPortal = usePortal();
18544
- const [internal, setInternal] = React54__namespace.default.useState(defaultCollapsed);
18593
+ const [internal, setInternal] = React55__namespace.default.useState(defaultCollapsed);
18545
18594
  const collapsed = collapsedProp !== void 0 ? collapsedProp : internal;
18546
18595
  const toggle = () => {
18547
18596
  const next = !collapsed;
18548
18597
  if (collapsedProp === void 0) setInternal(next);
18549
18598
  onCollapsedChange?.(next);
18550
18599
  };
18551
- const [openInternal, setOpenInternal] = React54__namespace.default.useState(defaultOpen);
18600
+ const [openInternal, setOpenInternal] = React55__namespace.default.useState(defaultOpen);
18552
18601
  const open = openProp !== void 0 ? openProp : openInternal;
18553
18602
  const setOpen = (next) => {
18554
18603
  if (openProp === void 0) setOpenInternal(next);
18555
18604
  onOpenChange?.(next);
18556
18605
  };
18557
- const [mounted, setMounted] = React54__namespace.default.useState(open);
18558
- React54__namespace.default.useEffect(() => {
18606
+ const [mounted, setMounted] = React55__namespace.default.useState(open);
18607
+ React55__namespace.default.useEffect(() => {
18559
18608
  if (!overlay) return void 0;
18560
18609
  if (open) {
18561
18610
  setMounted(true);
@@ -18564,7 +18613,7 @@ function Sidebar({
18564
18613
  const t = setTimeout(() => setMounted(false), 170);
18565
18614
  return () => clearTimeout(t);
18566
18615
  }, [overlay, open]);
18567
- React54__namespace.default.useEffect(() => {
18616
+ React55__namespace.default.useEffect(() => {
18568
18617
  if (!overlay || !open) return void 0;
18569
18618
  const prev = document.body.style.overflow;
18570
18619
  document.body.style.overflow = "hidden";
@@ -18573,7 +18622,7 @@ function Sidebar({
18573
18622
  };
18574
18623
  }, [overlay, open]);
18575
18624
  useFocusTrap(panelRef, overlay && open && mounted);
18576
- React54__namespace.default.useEffect(() => {
18625
+ React55__namespace.default.useEffect(() => {
18577
18626
  if (!overlay || !open) return void 0;
18578
18627
  const onKey = (e) => {
18579
18628
  if (e.key === "Escape") {
@@ -18625,7 +18674,7 @@ function Sidebar({
18625
18674
  const body = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
18626
18675
  __twcStyles,
18627
18676
  brand ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "twc-sidebar__head", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "twc-sidebar__brand", children: brand }) }) : null,
18628
- /* @__PURE__ */ jsxRuntime.jsx("nav", { id: navId, className: "twc-sidebar__nav", "aria-label": navLabel, children: groups.map((g, gi) => /* @__PURE__ */ jsxRuntime.jsxs(React54__namespace.default.Fragment, { children: [
18677
+ /* @__PURE__ */ jsxRuntime.jsx("nav", { id: navId, className: "twc-sidebar__nav", "aria-label": navLabel, children: groups.map((g, gi) => /* @__PURE__ */ jsxRuntime.jsxs(React55__namespace.default.Fragment, { children: [
18629
18678
  g.section != null ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "twc-sidebar__section", id: g.sid, children: g.section }) : null,
18630
18679
  /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "twc-sidebar__list", ...g.section != null ? { "aria-labelledby": g.sid } : {}, children: g.entries.map(({ it, i }) => /* @__PURE__ */ jsxRuntime.jsx("li", { children: renderItem(it) }, i)) })
18631
18680
  ] }, gi)) }),
@@ -18811,10 +18860,10 @@ function Slider({
18811
18860
  return Math.min(max, Math.max(min, Math.round(stepped * 1e6) / 1e6));
18812
18861
  };
18813
18862
  const __twcStyles = useScopedStyles("twc-slider-styles", SLIDER_CSS);
18814
- const autoId = React54__namespace.default.useId();
18863
+ const autoId = React55__namespace.default.useId();
18815
18864
  const fieldId = id || autoId;
18816
18865
  const isRange = range2 || Array.isArray(value) || Array.isArray(defaultValue);
18817
- const [internal, setInternal] = React54__namespace.default.useState(() => {
18866
+ const [internal, setInternal] = React55__namespace.default.useState(() => {
18818
18867
  if (isRange) {
18819
18868
  const dv = Array.isArray(defaultValue) ? defaultValue : [min, max];
18820
18869
  return [clampSnap(dv[0]), clampSnap(dv[1])];
@@ -18824,9 +18873,9 @@ function Slider({
18824
18873
  const rawVal = value !== void 0 ? value : internal;
18825
18874
  const clampedVals = (isRange ? [Number(rawVal[0]), Number(rawVal[1])] : [Number(rawVal)]).map((v) => Math.min(max, Math.max(min, Number.isFinite(v) ? v : min)));
18826
18875
  const indices = isRange ? [0, 1] : [0];
18827
- const trackRef = React54__namespace.default.useRef(null);
18828
- const [dragging, setDragging] = React54__namespace.default.useState(false);
18829
- const [typed, setTyped] = React54__namespace.default.useState({});
18876
+ const trackRef = React55__namespace.default.useRef(null);
18877
+ const [dragging, setDragging] = React55__namespace.default.useState(false);
18878
+ const [typed, setTyped] = React55__namespace.default.useState({});
18830
18879
  const fmt = (v) => formatValue ? formatValue(v) : v.toFixed(decimals);
18831
18880
  const valueTextFor = (v) => {
18832
18881
  if (getAriaValueText) return getAriaValueText(v);
@@ -18878,8 +18927,8 @@ function Slider({
18878
18927
  const ratio = Math.min(1, Math.max(0, (clientX - r2.left) / r2.width));
18879
18928
  return clampSnap(min + ratio * (max - min));
18880
18929
  };
18881
- const dragCleanupRef = React54__namespace.default.useRef(null);
18882
- React54__namespace.default.useEffect(() => () => dragCleanupRef.current?.(), []);
18930
+ const dragCleanupRef = React55__namespace.default.useRef(null);
18931
+ React55__namespace.default.useEffect(() => () => dragCleanupRef.current?.(), []);
18883
18932
  function onPointerDown(e) {
18884
18933
  if (disabled) return;
18885
18934
  e.preventDefault();
@@ -18928,7 +18977,7 @@ function Slider({
18928
18977
  name ? clampedVals.map((v, i) => /* @__PURE__ */ jsxRuntime.jsx("input", { type: "hidden", name, value: v, disabled: disabled || void 0 }, i)) : null,
18929
18978
  label || showValue || editable ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "twc-slider__head", children: [
18930
18979
  label ? /* @__PURE__ */ jsxRuntime.jsx("label", { className: "twc-slider__label", id: labelId, children: label }) : /* @__PURE__ */ jsxRuntime.jsx("span", {}),
18931
- editable ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "twc-slider__inputs", children: indices.map((i) => /* @__PURE__ */ jsxRuntime.jsxs(React54__namespace.default.Fragment, { children: [
18980
+ editable ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "twc-slider__inputs", children: indices.map((i) => /* @__PURE__ */ jsxRuntime.jsxs(React55__namespace.default.Fragment, { children: [
18932
18981
  i > 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "twc-slider__input-sep", "aria-hidden": "true", children: "\u2013" }) : null,
18933
18982
  /* @__PURE__ */ jsxRuntime.jsx(
18934
18983
  "input",
@@ -19141,7 +19190,7 @@ function Stepper({
19141
19190
  ...rest
19142
19191
  }) {
19143
19192
  const __twcStyles = useScopedStyles("twc-stepper-styles", STEPPER_CSS);
19144
- const [activeInternal, setActiveInternal] = React54__namespace.default.useState(defaultActive);
19193
+ const [activeInternal, setActiveInternal] = React55__namespace.default.useState(defaultActive);
19145
19194
  const active = activeProp !== void 0 ? activeProp : activeInternal;
19146
19195
  const handleStep = (i) => {
19147
19196
  if (activeProp === void 0) setActiveInternal(i);
@@ -19221,7 +19270,7 @@ function Stepper({
19221
19270
  })
19222
19271
  ] });
19223
19272
  }
19224
- function Switch({
19273
+ var Switch = /* @__PURE__ */ React55__namespace.default.forwardRef(function Switch2({
19225
19274
  label,
19226
19275
  description,
19227
19276
  error,
@@ -19235,7 +19284,7 @@ function Switch({
19235
19284
  className = "",
19236
19285
  onChange,
19237
19286
  ...rest
19238
- }) {
19287
+ }, ref) {
19239
19288
  const __twcStyles = useScopedStyles("twc-switch-styles", `
19240
19289
  /* tone \u2192 accent set (default primary). Mirrors Button's --_accent model; Badge's tone vocabulary. */
19241
19290
  .twc-switch { --_accent: var(--color-primary); --_accent-fg: var(--color-primary-fg); --_accent-subtle: var(--color-primary-subtle); --_accent-subtle-fg: var(--color-primary-subtle-fg); --_accent-border: var(--color-primary-border); }
@@ -19288,7 +19337,7 @@ function Switch({
19288
19337
  .twc-field { display: flex; flex-direction: column; gap: var(--space-1-5); font-family: var(--font-sans); }
19289
19338
  .twc-field__error { font-size: var(--text-xs); color: var(--color-danger-subtle-fg); font-weight: var(--font-medium); }
19290
19339
  `);
19291
- const autoId = React54__namespace.default.useId();
19340
+ const autoId = React55__namespace.default.useId();
19292
19341
  const fieldId = id || autoId;
19293
19342
  const errId = `${fieldId}-error`;
19294
19343
  const invalid = Boolean(error);
@@ -19301,6 +19350,7 @@ function Switch({
19301
19350
  /* @__PURE__ */ jsxRuntime.jsx(
19302
19351
  "input",
19303
19352
  {
19353
+ ref,
19304
19354
  id: fieldId,
19305
19355
  type: "checkbox",
19306
19356
  role: "switch",
@@ -19330,7 +19380,7 @@ function Switch({
19330
19380
  control,
19331
19381
  /* @__PURE__ */ jsxRuntime.jsx("span", { id: errId, className: "twc-field__error", children: error })
19332
19382
  ] });
19333
- }
19383
+ });
19334
19384
  var TABLE_CSS = `
19335
19385
  .twc-table-wrap { width: 100%; overflow-x: auto; border-radius: var(--radius-lg); border: var(--border-thin) solid var(--color-border); background: var(--color-surface); }
19336
19386
  .twc-table { width: 100%; border-collapse: collapse; font-family: var(--font-sans); font-size: var(--text-sm); color: var(--color-text); }
@@ -19396,14 +19446,14 @@ function Table({
19396
19446
  ...rest
19397
19447
  }) {
19398
19448
  const __twcStyles = useScopedStyles("twc-table-styles", TABLE_CSS);
19399
- const cols = React54__namespace.default.useMemo(
19449
+ const cols = React55__namespace.default.useMemo(
19400
19450
  () => (columns || []).map((c) => ({ ...c, header: c.headerName, render: c.renderCell })),
19401
19451
  [columns]
19402
19452
  );
19403
19453
  const dataRows = rowsProp || [];
19404
- const [internalSort, setInternalSort] = React54__namespace.default.useState(defaultSort || { field: null, dir: "asc" });
19454
+ const [internalSort, setInternalSort] = React55__namespace.default.useState(defaultSort || { field: null, dir: "asc" });
19405
19455
  const sort = (sortProp !== void 0 ? sortProp : internalSort) || { field: null, dir: "asc" };
19406
- const rows = React54__namespace.default.useMemo(() => {
19456
+ const rows = React55__namespace.default.useMemo(() => {
19407
19457
  if (!sortable || !sort.field) return dataRows;
19408
19458
  const col = cols.find((c) => c.field === sort.field);
19409
19459
  if (!col) return dataRows;
@@ -19555,15 +19605,15 @@ function Tabs({
19555
19605
  }) {
19556
19606
  const vertical = orientation === "vertical";
19557
19607
  const __twcStyles = useScopedStyles("twc-tabs-styles", TABS_CSS);
19558
- const [internal, setInternal] = React54__namespace.default.useState(defaultValue ?? items[0]?.value);
19608
+ const [internal, setInternal] = React55__namespace.default.useState(defaultValue ?? items[0]?.value);
19559
19609
  const active = value ?? internal;
19560
- const listRef = React54__namespace.default.useRef(null);
19561
- const [ind, setInd] = React54__namespace.default.useState({ left: 0, width: 0, top: 0, height: 0 });
19562
- const baseId = React54__namespace.default.useId();
19610
+ const listRef = React55__namespace.default.useRef(null);
19611
+ const [ind, setInd] = React55__namespace.default.useState({ left: 0, width: 0, top: 0, height: 0 });
19612
+ const baseId = React55__namespace.default.useId();
19563
19613
  const tabIdAt = (i) => `${baseId}-tab-${i}`;
19564
19614
  const panelId = `${baseId}-panel`;
19565
19615
  const activeIndex = items.findIndex((it) => it.value === active);
19566
- const updateIndicator = React54__namespace.default.useCallback(() => {
19616
+ const updateIndicator = React55__namespace.default.useCallback(() => {
19567
19617
  const list = listRef.current;
19568
19618
  if (!list) return;
19569
19619
  const el = list.querySelector('[data-active="true"]');
@@ -19572,10 +19622,10 @@ function Tabs({
19572
19622
  if (!vertical) el.scrollIntoView?.({ inline: "nearest", block: "nearest" });
19573
19623
  }
19574
19624
  }, [vertical]);
19575
- React54__namespace.default.useEffect(() => {
19625
+ React55__namespace.default.useEffect(() => {
19576
19626
  updateIndicator();
19577
19627
  }, [active, updateIndicator, items, orientation]);
19578
- React54__namespace.default.useEffect(() => {
19628
+ React55__namespace.default.useEffect(() => {
19579
19629
  const r2 = () => updateIndicator();
19580
19630
  window.addEventListener("resize", r2);
19581
19631
  if (typeof document !== "undefined" && document.fonts && document.fonts.ready) {
@@ -19721,7 +19771,7 @@ function Tag({
19721
19771
  }, "aria-label": _removeLabel, type: "button", children: /* @__PURE__ */ jsxRuntime.jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.4", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M18 6 6 18M6 6l12 12" }) }) }) : null
19722
19772
  ] });
19723
19773
  }
19724
- var useIso = typeof document !== "undefined" ? React54__namespace.default.useLayoutEffect : React54__namespace.default.useEffect;
19774
+ var useIso = typeof document !== "undefined" ? React55__namespace.default.useLayoutEffect : React55__namespace.default.useEffect;
19725
19775
  var TEXTAREA_CSS = `
19726
19776
  .twc-field { display: flex; flex-direction: column; gap: var(--space-1-5); font-family: var(--font-sans); }
19727
19777
  .twc-field__label { font-size: var(--text-sm); font-weight: var(--font-semibold); color: var(--color-text); display: flex; gap: 4px; align-items: center; }
@@ -19770,7 +19820,7 @@ var TEXTAREA_CSS = `
19770
19820
  .twc-field__count { margin-inline-start: auto; font-size: var(--text-xs); color: var(--color-text-muted); font-variant-numeric: tabular-nums; flex: none; }
19771
19821
  .twc-field__count[data-danger="true"] { color: var(--color-danger-subtle-fg); }
19772
19822
  `;
19773
- var Textarea = React54__namespace.default.forwardRef(function Textarea2({
19823
+ var Textarea = /* @__PURE__ */ React55__namespace.default.forwardRef(function Textarea2({
19774
19824
  label,
19775
19825
  hint,
19776
19826
  error,
@@ -19789,19 +19839,19 @@ var Textarea = React54__namespace.default.forwardRef(function Textarea2({
19789
19839
  ...rest
19790
19840
  }, ref) {
19791
19841
  const __twcStyles = useScopedStyles("twc-textarea-styles", TEXTAREA_CSS);
19792
- const autoId = React54__namespace.default.useId();
19842
+ const autoId = React55__namespace.default.useId();
19793
19843
  const fieldId = id || autoId;
19794
19844
  const descId = `${fieldId}-desc`;
19795
19845
  const countId = `${fieldId}-count`;
19796
19846
  const invalid = Boolean(error);
19797
- const innerRef = React54__namespace.default.useRef(null);
19847
+ const innerRef = React55__namespace.default.useRef(null);
19798
19848
  const setRef = (el) => {
19799
19849
  innerRef.current = el;
19800
19850
  if (typeof ref === "function") ref(el);
19801
19851
  else if (ref) ref.current = el;
19802
19852
  };
19803
19853
  const countControlled = rest.value !== void 0;
19804
- const [len2, setLen] = React54__namespace.default.useState(() => String(rest.defaultValue ?? "").length);
19854
+ const [len2, setLen] = React55__namespace.default.useState(() => String(rest.defaultValue ?? "").length);
19805
19855
  const count = countControlled ? String(rest.value ?? "").length : len2;
19806
19856
  const max = rest.maxLength;
19807
19857
  const showCounter = showCount && max != null;
@@ -20003,19 +20053,19 @@ function Toast({
20003
20053
  }) {
20004
20054
  const resolvedTone = tone === "neutral" ? "default" : tone;
20005
20055
  const __twcStyles = useScopedStyles("twc-toast-styles", TOAST_CSS);
20006
- const onCloseRef = React54__namespace.default.useRef(onClose);
20007
- React54__namespace.default.useEffect(() => {
20056
+ const onCloseRef = React55__namespace.default.useRef(onClose);
20057
+ React55__namespace.default.useEffect(() => {
20008
20058
  onCloseRef.current = onClose;
20009
20059
  }, [onClose]);
20010
- const timer = React54__namespace.default.useRef();
20011
- const stop = React54__namespace.default.useCallback(() => clearTimeout(timer.current), []);
20012
- const start = React54__namespace.default.useCallback(() => {
20060
+ const timer = React55__namespace.default.useRef();
20061
+ const stop = React55__namespace.default.useCallback(() => clearTimeout(timer.current), []);
20062
+ const start = React55__namespace.default.useCallback(() => {
20013
20063
  stop();
20014
20064
  if (duration && duration !== Infinity && onCloseRef.current) {
20015
20065
  timer.current = setTimeout(() => onCloseRef.current && onCloseRef.current(), duration);
20016
20066
  }
20017
20067
  }, [duration, stop]);
20018
- React54__namespace.default.useEffect(() => {
20068
+ React55__namespace.default.useEffect(() => {
20019
20069
  start();
20020
20070
  return stop;
20021
20071
  }, [start, stop]);
@@ -20060,32 +20110,32 @@ function Toast({
20060
20110
  }
20061
20111
  function ToastViewport({ children, limit, className = "", ...rest }) {
20062
20112
  const __twcStyles = useScopedStyles("twc-toast-styles", TOAST_CSS);
20063
- const shown = limit && limit > 0 ? React54__namespace.default.Children.toArray(children).slice(-limit) : children;
20113
+ const shown = limit && limit > 0 ? React55__namespace.default.Children.toArray(children).slice(-limit) : children;
20064
20114
  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `twc-toast-viewport ${className}`, role: "region", "aria-label": "Notifications", ...rest, children: [
20065
20115
  __twcStyles,
20066
20116
  shown
20067
20117
  ] });
20068
20118
  }
20069
- var ToastContext = React54__namespace.default.createContext(null);
20119
+ var ToastContext = React55__namespace.default.createContext(null);
20070
20120
  function useToast() {
20071
- const ctx = React54__namespace.default.useContext(ToastContext);
20121
+ const ctx = React55__namespace.default.useContext(ToastContext);
20072
20122
  if (!ctx) throw new Error("useToast must be used within a <ToastProvider>.");
20073
20123
  return ctx;
20074
20124
  }
20075
20125
  function ToastProvider({ children, limit = 4, duration = 4500, ...viewportProps }) {
20076
- const [toasts, setToasts] = React54__namespace.default.useState([]);
20077
- const [politeMsg, setPoliteMsg] = React54__namespace.default.useState("");
20078
- const [assertiveMsg, setAssertiveMsg] = React54__namespace.default.useState("");
20079
- const idRef = React54__namespace.default.useRef(0);
20080
- const limitRef = React54__namespace.default.useRef(limit);
20081
- React54__namespace.default.useEffect(() => {
20126
+ const [toasts, setToasts] = React55__namespace.default.useState([]);
20127
+ const [politeMsg, setPoliteMsg] = React55__namespace.default.useState("");
20128
+ const [assertiveMsg, setAssertiveMsg] = React55__namespace.default.useState("");
20129
+ const idRef = React55__namespace.default.useRef(0);
20130
+ const limitRef = React55__namespace.default.useRef(limit);
20131
+ React55__namespace.default.useEffect(() => {
20082
20132
  limitRef.current = limit;
20083
20133
  }, [limit]);
20084
- const dismiss = React54__namespace.default.useCallback((id) => {
20134
+ const dismiss = React55__namespace.default.useCallback((id) => {
20085
20135
  setToasts((s) => s.filter((t) => t.id !== id));
20086
20136
  }, []);
20087
- const clear = React54__namespace.default.useCallback(() => setToasts([]), []);
20088
- const api = React54__namespace.default.useMemo(() => {
20137
+ const clear = React55__namespace.default.useCallback(() => setToasts([]), []);
20138
+ const api = React55__namespace.default.useMemo(() => {
20089
20139
  const push = (opts) => {
20090
20140
  const id = idRef.current += 1;
20091
20141
  const next = typeof opts === "string" ? { title: opts } : opts && typeof opts === "object" ? opts : {};
@@ -20112,7 +20162,7 @@ function ToastProvider({ children, limit = 4, duration = 4500, ...viewportProps
20112
20162
  toast.show = withTone("default");
20113
20163
  return { toast, dismiss, clear };
20114
20164
  }, [dismiss, clear]);
20115
- const value = React54__namespace.default.useMemo(() => ({ ...api, toasts }), [api, toasts]);
20165
+ const value = React55__namespace.default.useMemo(() => ({ ...api, toasts }), [api, toasts]);
20116
20166
  return /* @__PURE__ */ jsxRuntime.jsxs(ToastContext.Provider, { value, children: [
20117
20167
  children,
20118
20168
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "twc-toast-sr", "aria-live": "polite", "aria-atomic": "true", children: politeMsg }),
@@ -20226,13 +20276,13 @@ function TreeView({
20226
20276
  }) {
20227
20277
  const nodes = items;
20228
20278
  const __twcStyles = useScopedStyles("twc-tree-styles", TREE_CSS);
20229
- const [expInternal, setExpInternal] = React54__namespace.default.useState(() => new Set(defaultExpanded));
20279
+ const [expInternal, setExpInternal] = React55__namespace.default.useState(() => new Set(defaultExpanded));
20230
20280
  const expanded = expandedProp !== void 0 ? new Set(expandedProp) : expInternal;
20231
- const [selInternal, setSelInternal] = React54__namespace.default.useState(defaultSelectedId);
20281
+ const [selInternal, setSelInternal] = React55__namespace.default.useState(defaultSelectedId);
20232
20282
  const selectedId = selectedProp !== void 0 ? selectedProp : selInternal;
20233
- const [focusId, setFocusId] = React54__namespace.default.useState(null);
20234
- const rowRefs = React54__namespace.default.useRef(/* @__PURE__ */ new Map());
20235
- const taRef = React54__namespace.default.useRef({ str: "", t: 0 });
20283
+ const [focusId, setFocusId] = React55__namespace.default.useState(null);
20284
+ const rowRefs = React55__namespace.default.useRef(/* @__PURE__ */ new Map());
20285
+ const taRef = React55__namespace.default.useRef({ str: "", t: 0 });
20236
20286
  const toggle = (id) => {
20237
20287
  const n = new Set(expanded);
20238
20288
  n.has(id) ? n.delete(id) : n.add(id);
@@ -20370,7 +20420,7 @@ function AppShell({
20370
20420
  ...rest
20371
20421
  }) {
20372
20422
  const __twcStyles = useScopedStyles("twc-shell-styles", SHELL_CSS);
20373
- const wiredSidebar = React54__namespace.default.isValidElement(sidebar) && (sidebarOpen !== void 0 || onSidebarOpenChange !== void 0) ? React54__namespace.default.cloneElement(sidebar, {
20423
+ const wiredSidebar = React55__namespace.default.isValidElement(sidebar) && (sidebarOpen !== void 0 || onSidebarOpenChange !== void 0) ? React55__namespace.default.cloneElement(sidebar, {
20374
20424
  overlay: sidebar.props.overlay !== void 0 ? sidebar.props.overlay : true,
20375
20425
  open: sidebar.props.open !== void 0 ? sidebar.props.open : sidebarOpen,
20376
20426
  onOpenChange: sidebar.props.onOpenChange !== void 0 ? sidebar.props.onOpenChange : onSidebarOpenChange
@@ -20405,7 +20455,7 @@ function safeHref9(url) {
20405
20455
  const s = String(url).replace(/[\x00-\x20]+/g, "").toLowerCase();
20406
20456
  return s.startsWith("javascript:") || s.startsWith("data:") || s.startsWith("vbscript:") ? void 0 : url;
20407
20457
  }
20408
- var Box = React54__namespace.default.forwardRef(function Box2({
20458
+ var Box = /* @__PURE__ */ React55__namespace.default.forwardRef(function Box2({
20409
20459
  as: Tag2 = "div",
20410
20460
  p,
20411
20461
  px,
@@ -20454,14 +20504,13 @@ var Box = React54__namespace.default.forwardRef(function Box2({
20454
20504
  children
20455
20505
  ] });
20456
20506
  });
20457
- Box.displayName = "Box";
20458
20507
  var SIZES = { sm: 640, md: 768, lg: 1024, xl: 1280, full: "100%" };
20459
20508
  function safeHref10(url) {
20460
20509
  if (url == null) return void 0;
20461
20510
  const s = String(url).replace(/[\x00-\x20]+/g, "").toLowerCase();
20462
20511
  return s.startsWith("javascript:") || s.startsWith("data:") || s.startsWith("vbscript:") ? void 0 : url;
20463
20512
  }
20464
- var Container = React54__namespace.default.forwardRef(function Container2({
20513
+ var Container = /* @__PURE__ */ React55__namespace.default.forwardRef(function Container2({
20465
20514
  as: Tag2 = "div",
20466
20515
  size = "lg",
20467
20516
  padded = true,
@@ -20498,7 +20547,6 @@ var Container = React54__namespace.default.forwardRef(function Container2({
20498
20547
  }
20499
20548
  );
20500
20549
  });
20501
- Container.displayName = "Container";
20502
20550
  function space2(v) {
20503
20551
  if (v == null) return void 0;
20504
20552
  if (typeof v === "number") return `var(--space-${String(v).replace(".", "-")})`;
@@ -20509,7 +20557,7 @@ function safeHref11(url) {
20509
20557
  const s = String(url).replace(/[\x00-\x20]+/g, "").toLowerCase();
20510
20558
  return s.startsWith("javascript:") || s.startsWith("data:") || s.startsWith("vbscript:") ? void 0 : url;
20511
20559
  }
20512
- var Stack = React54__namespace.default.forwardRef(function Stack2({
20560
+ var Stack = /* @__PURE__ */ React55__namespace.default.forwardRef(function Stack2({
20513
20561
  as: Tag2 = "div",
20514
20562
  direction = "column",
20515
20563
  gap = 4,
@@ -20533,7 +20581,7 @@ var Stack = React54__namespace.default.forwardRef(function Stack2({
20533
20581
  }, ref) {
20534
20582
  const { flatStyle, styleNode, sxAttr } = useSx(sx);
20535
20583
  if (Tag2 === "a" && rest.href != null) rest.href = safeHref11(rest.href);
20536
- const kids = divider != null ? React54__namespace.default.Children.toArray(children).flatMap((child, i, arr) => i < arr.length - 1 ? [child, /* @__PURE__ */ jsxRuntime.jsx(React54__namespace.default.Fragment, { children: divider }, `twc-stack-div-${i}`)] : [child]) : children;
20584
+ const kids = divider != null ? React55__namespace.default.Children.toArray(children).flatMap((child, i, arr) => i < arr.length - 1 ? [child, /* @__PURE__ */ jsxRuntime.jsx(React55__namespace.default.Fragment, { children: divider }, `twc-stack-div-${i}`)] : [child]) : children;
20537
20585
  return /* @__PURE__ */ jsxRuntime.jsxs(
20538
20586
  Tag2,
20539
20587
  {
@@ -20563,7 +20611,6 @@ var Stack = React54__namespace.default.forwardRef(function Stack2({
20563
20611
  }
20564
20612
  );
20565
20613
  });
20566
- Stack.displayName = "Stack";
20567
20614
  var CODE_CSS = `
20568
20615
  .twc-code {
20569
20616
  font-family: var(--font-mono); font-size: 0.875em;
@@ -20592,7 +20639,7 @@ function safeHref12(url) {
20592
20639
  const s = String(url).replace(/[\x00-\x20]+/g, "").toLowerCase();
20593
20640
  return s.startsWith("javascript:") || s.startsWith("data:") || s.startsWith("vbscript:") ? void 0 : url;
20594
20641
  }
20595
- function Code({
20642
+ var Code = /* @__PURE__ */ React55__namespace.default.forwardRef(function Code2({
20596
20643
  as,
20597
20644
  block = false,
20598
20645
  copyable = false,
@@ -20601,14 +20648,15 @@ function Code({
20601
20648
  className = "",
20602
20649
  children,
20603
20650
  ...rest
20604
- }) {
20651
+ }, ref) {
20605
20652
  const __twcStyles = useScopedStyles("twc-code-styles", CODE_CSS);
20606
20653
  const Tag2 = as ?? (block ? "pre" : "code");
20607
20654
  if (Tag2 === "a" && rest.href != null) rest.href = safeHref12(rest.href);
20608
- const rootRef = React54__namespace.default.useRef(null);
20609
- const [copied, setCopied] = React54__namespace.default.useState(false);
20610
- const timerRef = React54__namespace.default.useRef(null);
20611
- React54__namespace.default.useEffect(() => () => clearTimeout(timerRef.current), []);
20655
+ const rootRef = React55__namespace.default.useRef(null);
20656
+ const setRootRef = useMergedRef(rootRef, ref);
20657
+ const [copied, setCopied] = React55__namespace.default.useState(false);
20658
+ const timerRef = React55__namespace.default.useRef(null);
20659
+ React55__namespace.default.useEffect(() => () => clearTimeout(timerRef.current), []);
20612
20660
  const doCopy = () => {
20613
20661
  const text = typeof children === "string" ? children : rootRef.current?.textContent ?? "";
20614
20662
  const flash = () => {
@@ -20641,7 +20689,7 @@ function Code({
20641
20689
  }
20642
20690
  execFallback();
20643
20691
  };
20644
- return /* @__PURE__ */ jsxRuntime.jsxs(Tag2, { ref: rootRef, className: `twc-code ${className}`.trim(), "data-block": block || void 0, ...rest, children: [
20692
+ return /* @__PURE__ */ jsxRuntime.jsxs(Tag2, { ref: setRootRef, className: `twc-code ${className}`.trim(), "data-block": block || void 0, ...rest, children: [
20645
20693
  __twcStyles,
20646
20694
  copyable ? /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", className: "twc-code__copy", "aria-label": copied ? copiedLabel : copyLabel, onClick: doCopy, children: copied ? /* @__PURE__ */ jsxRuntime.jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.4", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m20 6-11 11-5-5" }) }) : /* @__PURE__ */ jsxRuntime.jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
20647
20695
  /* @__PURE__ */ jsxRuntime.jsx("rect", { x: "9", y: "9", width: "13", height: "13", rx: "2" }),
@@ -20649,14 +20697,14 @@ function Code({
20649
20697
  ] }) }) : null,
20650
20698
  children
20651
20699
  ] });
20652
- }
20700
+ });
20653
20701
  var LEVEL_SIZE = { 1: "4xl", 2: "2xl", 3: "xl", 4: "lg", 5: "base", 6: "sm" };
20654
20702
  function safeHref13(url) {
20655
20703
  if (url == null) return void 0;
20656
20704
  const s = String(url).replace(/[\x00-\x20]+/g, "").toLowerCase();
20657
20705
  return s.startsWith("javascript:") || s.startsWith("data:") || s.startsWith("vbscript:") ? void 0 : url;
20658
20706
  }
20659
- var Heading = React54__namespace.default.forwardRef(function Heading2({
20707
+ var Heading = /* @__PURE__ */ React55__namespace.default.forwardRef(function Heading2({
20660
20708
  as,
20661
20709
  level = 2,
20662
20710
  size,
@@ -20704,7 +20752,6 @@ var Heading = React54__namespace.default.forwardRef(function Heading2({
20704
20752
  }
20705
20753
  );
20706
20754
  });
20707
- Heading.displayName = "Heading";
20708
20755
  var TONE = {
20709
20756
  default: "--color-text",
20710
20757
  muted: "--color-text-muted",
@@ -20725,7 +20772,7 @@ function safeHref14(url) {
20725
20772
  const s = String(url).replace(/[\x00-\x20]+/g, "").toLowerCase();
20726
20773
  return s.startsWith("javascript:") || s.startsWith("data:") || s.startsWith("vbscript:") ? void 0 : url;
20727
20774
  }
20728
- var Text = React54__namespace.default.forwardRef(function Text2({
20775
+ var Text = /* @__PURE__ */ React55__namespace.default.forwardRef(function Text2({
20729
20776
  as: Tag2 = "p",
20730
20777
  size = "base",
20731
20778
  tone = "default",
@@ -20771,47 +20818,46 @@ var Text = React54__namespace.default.forwardRef(function Text2({
20771
20818
  }
20772
20819
  );
20773
20820
  });
20774
- Text.displayName = "Text";
20775
20821
  var canUseDOM2 = typeof window !== "undefined" && typeof document !== "undefined";
20776
- var useIsomorphicLayoutEffect = canUseDOM2 ? React54__namespace.default.useLayoutEffect : React54__namespace.default.useEffect;
20822
+ var useIsomorphicLayoutEffect = canUseDOM2 ? React55__namespace.default.useLayoutEffect : React55__namespace.default.useEffect;
20777
20823
  function useMounted() {
20778
- const [mounted, setMounted] = React54__namespace.default.useState(false);
20779
- React54__namespace.default.useEffect(() => {
20824
+ const [mounted, setMounted] = React55__namespace.default.useState(false);
20825
+ React55__namespace.default.useEffect(() => {
20780
20826
  setMounted(true);
20781
20827
  }, []);
20782
20828
  return mounted;
20783
20829
  }
20784
20830
  function usePrevious(value) {
20785
- const ref = React54__namespace.default.useRef(void 0);
20786
- React54__namespace.default.useEffect(() => {
20831
+ const ref = React55__namespace.default.useRef(void 0);
20832
+ React55__namespace.default.useEffect(() => {
20787
20833
  ref.current = value;
20788
20834
  }, [value]);
20789
20835
  return ref.current;
20790
20836
  }
20791
20837
  function useToggle(initial = false) {
20792
- const [on, setOn] = React54__namespace.default.useState(initial);
20793
- const toggle = React54__namespace.default.useCallback((next) => {
20838
+ const [on, setOn] = React55__namespace.default.useState(initial);
20839
+ const toggle = React55__namespace.default.useCallback((next) => {
20794
20840
  setOn((prev) => typeof next === "boolean" ? next : !prev);
20795
20841
  }, []);
20796
20842
  return [on, toggle, setOn];
20797
20843
  }
20798
20844
  function useDisclosure(initial = false) {
20799
- const [open, setOpen] = React54__namespace.default.useState(initial);
20800
- const onOpen = React54__namespace.default.useCallback(() => setOpen(true), []);
20801
- const onClose = React54__namespace.default.useCallback(() => setOpen(false), []);
20802
- const onToggle = React54__namespace.default.useCallback(() => setOpen((p) => !p), []);
20845
+ const [open, setOpen] = React55__namespace.default.useState(initial);
20846
+ const onOpen = React55__namespace.default.useCallback(() => setOpen(true), []);
20847
+ const onClose = React55__namespace.default.useCallback(() => setOpen(false), []);
20848
+ const onToggle = React55__namespace.default.useCallback(() => setOpen((p) => !p), []);
20803
20849
  return { open, onOpen, onClose, onToggle, setOpen };
20804
20850
  }
20805
20851
  function useControllableState({ value, defaultValue, onChange } = {}) {
20806
20852
  const isControlled = value !== void 0;
20807
- const [uncontrolled, setUncontrolled] = React54__namespace.default.useState(defaultValue);
20853
+ const [uncontrolled, setUncontrolled] = React55__namespace.default.useState(defaultValue);
20808
20854
  const current = isControlled ? value : uncontrolled;
20809
- const ref = React54__namespace.default.useRef({ current, isControlled, onChange });
20855
+ const ref = React55__namespace.default.useRef({ current, isControlled, onChange });
20810
20856
  useIsomorphicLayoutEffect(() => {
20811
20857
  ref.current = { current, isControlled, onChange };
20812
20858
  });
20813
- const wasControlled = React54__namespace.default.useRef(isControlled);
20814
- React54__namespace.default.useEffect(() => {
20859
+ const wasControlled = React55__namespace.default.useRef(isControlled);
20860
+ React55__namespace.default.useEffect(() => {
20815
20861
  if (wasControlled.current !== isControlled) {
20816
20862
  warnOnce(
20817
20863
  "useControllableState:switch",
@@ -20820,7 +20866,7 @@ function useControllableState({ value, defaultValue, onChange } = {}) {
20820
20866
  wasControlled.current = isControlled;
20821
20867
  }
20822
20868
  });
20823
- const setValue = React54__namespace.default.useCallback((next) => {
20869
+ const setValue = React55__namespace.default.useCallback((next) => {
20824
20870
  const { current: cur, isControlled: ctrl, onChange: cb } = ref.current;
20825
20871
  const resolved = typeof next === "function" ? next(cur) : next;
20826
20872
  if (resolved === cur) return;
@@ -20831,7 +20877,7 @@ function useControllableState({ value, defaultValue, onChange } = {}) {
20831
20877
  }
20832
20878
  function useMediaQuery(query, { defaultValue = false, initializeWithValue = false } = {}) {
20833
20879
  const get = () => canUseDOM2 ? window.matchMedia(query).matches : defaultValue;
20834
- const [matches3, setMatches] = React54__namespace.default.useState(initializeWithValue ? get : defaultValue);
20880
+ const [matches3, setMatches] = React55__namespace.default.useState(initializeWithValue ? get : defaultValue);
20835
20881
  useIsomorphicLayoutEffect(() => {
20836
20882
  if (!canUseDOM2) return void 0;
20837
20883
  const mql = window.matchMedia(query);
@@ -20847,7 +20893,7 @@ function usePrefersReducedMotion() {
20847
20893
  }
20848
20894
  function useColorScheme({ storageKey = "twico-theme", attribute = "class", element, disableTransitionsOnChange = true, initializeWithValue = false } = {}) {
20849
20895
  const getTarget = () => element || (canUseDOM2 ? document.documentElement : null);
20850
- const firstApply = React54__namespace.default.useRef(true);
20896
+ const firstApply = React55__namespace.default.useRef(true);
20851
20897
  const read = () => {
20852
20898
  if (!canUseDOM2) return "light";
20853
20899
  try {
@@ -20857,8 +20903,8 @@ function useColorScheme({ storageKey = "twico-theme", attribute = "class", eleme
20857
20903
  }
20858
20904
  return window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
20859
20905
  };
20860
- const [theme, setThemeState] = React54__namespace.default.useState(initializeWithValue ? read : "light");
20861
- const apply = React54__namespace.default.useCallback(
20906
+ const [theme, setThemeState] = React55__namespace.default.useState(initializeWithValue ? read : "light");
20907
+ const apply = React55__namespace.default.useCallback(
20862
20908
  (t) => {
20863
20909
  const target = getTarget();
20864
20910
  if (!target) return;
@@ -20881,7 +20927,7 @@ function useColorScheme({ storageKey = "twico-theme", attribute = "class", eleme
20881
20927
  },
20882
20928
  [attribute, element, disableTransitionsOnChange]
20883
20929
  );
20884
- const resolved = React54__namespace.default.useRef(false);
20930
+ const resolved = React55__namespace.default.useRef(false);
20885
20931
  useIsomorphicLayoutEffect(() => {
20886
20932
  if (!resolved.current) {
20887
20933
  resolved.current = true;
@@ -20894,11 +20940,11 @@ function useColorScheme({ storageKey = "twico-theme", attribute = "class", eleme
20894
20940
  }
20895
20941
  apply(theme);
20896
20942
  }, [theme, apply]);
20897
- const themeRef = React54__namespace.default.useRef(theme);
20943
+ const themeRef = React55__namespace.default.useRef(theme);
20898
20944
  useIsomorphicLayoutEffect(() => {
20899
20945
  themeRef.current = theme;
20900
20946
  }, [theme]);
20901
- const setTheme = React54__namespace.default.useCallback(
20947
+ const setTheme = React55__namespace.default.useCallback(
20902
20948
  (t) => {
20903
20949
  setThemeState(t);
20904
20950
  try {
@@ -20909,10 +20955,10 @@ function useColorScheme({ storageKey = "twico-theme", attribute = "class", eleme
20909
20955
  },
20910
20956
  [storageKey]
20911
20957
  );
20912
- const toggle = React54__namespace.default.useCallback(() => {
20958
+ const toggle = React55__namespace.default.useCallback(() => {
20913
20959
  setTheme(themeRef.current === "dark" ? "light" : "dark");
20914
20960
  }, [setTheme]);
20915
- React54__namespace.default.useEffect(() => {
20961
+ React55__namespace.default.useEffect(() => {
20916
20962
  if (!canUseDOM2) return void 0;
20917
20963
  const sync = () => setThemeState(read());
20918
20964
  const onStorage = (e) => {
@@ -20928,14 +20974,14 @@ function useColorScheme({ storageKey = "twico-theme", attribute = "class", eleme
20928
20974
  return { theme, setTheme, toggle, isDark: theme === "dark" };
20929
20975
  }
20930
20976
  function useEventListener(eventName, handler, element, options) {
20931
- const saved = React54__namespace.default.useRef(handler);
20977
+ const saved = React55__namespace.default.useRef(handler);
20932
20978
  useIsomorphicLayoutEffect(() => {
20933
20979
  saved.current = handler;
20934
20980
  }, [handler]);
20935
20981
  const capture = typeof options === "boolean" ? options : options && options.capture;
20936
20982
  const passive = typeof options === "object" && options ? options.passive : void 0;
20937
20983
  const once = typeof options === "object" && options ? options.once : void 0;
20938
- React54__namespace.default.useEffect(() => {
20984
+ React55__namespace.default.useEffect(() => {
20939
20985
  const target = element && element.current || element || (canUseDOM2 ? window : null);
20940
20986
  if (!target || !target.addEventListener) return void 0;
20941
20987
  const opts = typeof options === "boolean" ? options : { capture, passive, once };
@@ -20945,11 +20991,11 @@ function useEventListener(eventName, handler, element, options) {
20945
20991
  }, [eventName, element, capture, passive, once]);
20946
20992
  }
20947
20993
  function useClickOutside(ref, handler, events = ["mousedown", "touchstart"]) {
20948
- const saved = React54__namespace.default.useRef(handler);
20994
+ const saved = React55__namespace.default.useRef(handler);
20949
20995
  useIsomorphicLayoutEffect(() => {
20950
20996
  saved.current = handler;
20951
20997
  }, [handler]);
20952
- React54__namespace.default.useEffect(() => {
20998
+ React55__namespace.default.useEffect(() => {
20953
20999
  if (!canUseDOM2) return void 0;
20954
21000
  const listener = (e) => {
20955
21001
  const el = ref && ref.current;
@@ -20984,12 +21030,12 @@ function useLocalStorage(key, initialValue, { initializeWithValue = false } = {}
20984
21030
  return initialValue;
20985
21031
  }
20986
21032
  };
20987
- const [stored, setStored] = React54__namespace.default.useState(initializeWithValue ? read : initialValue);
21033
+ const [stored, setStored] = React55__namespace.default.useState(initializeWithValue ? read : initialValue);
20988
21034
  useIsomorphicLayoutEffect(() => {
20989
21035
  if (!canUseDOM2) return;
20990
21036
  setStored(read());
20991
21037
  }, [key]);
20992
- const setValue = React54__namespace.default.useCallback(
21038
+ const setValue = React55__namespace.default.useCallback(
20993
21039
  (value) => {
20994
21040
  setStored((prev) => {
20995
21041
  const next = typeof value === "function" ? value(prev) : value;
@@ -21028,9 +21074,9 @@ function legacyCopy(text) {
21028
21074
  }
21029
21075
  }
21030
21076
  function useCopyToClipboard(timeout = 1500) {
21031
- const [copied, setCopied] = React54__namespace.default.useState(false);
21032
- const [copyTick, setCopyTick] = React54__namespace.default.useState(0);
21033
- const copy = React54__namespace.default.useCallback(async (text) => {
21077
+ const [copied, setCopied] = React55__namespace.default.useState(false);
21078
+ const [copyTick, setCopyTick] = React55__namespace.default.useState(0);
21079
+ const copy = React55__namespace.default.useCallback(async (text) => {
21034
21080
  if (!canUseDOM2) {
21035
21081
  setCopied(false);
21036
21082
  return false;
@@ -21049,7 +21095,7 @@ function useCopyToClipboard(timeout = 1500) {
21049
21095
  if (ok) setCopyTick((t) => t + 1);
21050
21096
  return ok;
21051
21097
  }, []);
21052
- React54__namespace.default.useEffect(() => {
21098
+ React55__namespace.default.useEffect(() => {
21053
21099
  if (!copied) return void 0;
21054
21100
  const t = setTimeout(() => setCopied(false), timeout);
21055
21101
  return () => clearTimeout(t);
@@ -21057,23 +21103,23 @@ function useCopyToClipboard(timeout = 1500) {
21057
21103
  return { copied, copy };
21058
21104
  }
21059
21105
  function useDebouncedValue(value, delay = 200) {
21060
- const [debounced, setDebounced] = React54__namespace.default.useState(value);
21061
- React54__namespace.default.useEffect(() => {
21106
+ const [debounced, setDebounced] = React55__namespace.default.useState(value);
21107
+ React55__namespace.default.useEffect(() => {
21062
21108
  const t = setTimeout(() => setDebounced(value), delay);
21063
21109
  return () => clearTimeout(t);
21064
21110
  }, [value, delay]);
21065
21111
  return debounced;
21066
21112
  }
21067
21113
  function useDebouncedCallback(callback, delay = 200) {
21068
- const saved = React54__namespace.default.useRef(callback);
21069
- const timer = React54__namespace.default.useRef(null);
21114
+ const saved = React55__namespace.default.useRef(callback);
21115
+ const timer = React55__namespace.default.useRef(null);
21070
21116
  useIsomorphicLayoutEffect(() => {
21071
21117
  saved.current = callback;
21072
21118
  }, [callback]);
21073
- React54__namespace.default.useEffect(() => () => {
21119
+ React55__namespace.default.useEffect(() => () => {
21074
21120
  if (timer.current) clearTimeout(timer.current);
21075
21121
  }, []);
21076
- return React54__namespace.default.useCallback(
21122
+ return React55__namespace.default.useCallback(
21077
21123
  (...args) => {
21078
21124
  if (timer.current) clearTimeout(timer.current);
21079
21125
  timer.current = setTimeout(() => saved.current(...args), delay);
@@ -21082,22 +21128,22 @@ function useDebouncedCallback(callback, delay = 200) {
21082
21128
  );
21083
21129
  }
21084
21130
  function useInterval(callback, delay) {
21085
- const saved = React54__namespace.default.useRef(callback);
21131
+ const saved = React55__namespace.default.useRef(callback);
21086
21132
  useIsomorphicLayoutEffect(() => {
21087
21133
  saved.current = callback;
21088
21134
  }, [callback]);
21089
- React54__namespace.default.useEffect(() => {
21135
+ React55__namespace.default.useEffect(() => {
21090
21136
  if (delay == null) return void 0;
21091
21137
  const id = setInterval(() => saved.current(), delay);
21092
21138
  return () => clearInterval(id);
21093
21139
  }, [delay]);
21094
21140
  }
21095
21141
  function useTimeout(callback, delay) {
21096
- const saved = React54__namespace.default.useRef(callback);
21142
+ const saved = React55__namespace.default.useRef(callback);
21097
21143
  useIsomorphicLayoutEffect(() => {
21098
21144
  saved.current = callback;
21099
21145
  }, [callback]);
21100
- React54__namespace.default.useEffect(() => {
21146
+ React55__namespace.default.useEffect(() => {
21101
21147
  if (delay == null) return void 0;
21102
21148
  const id = setTimeout(() => saved.current(), delay);
21103
21149
  return () => clearTimeout(id);
@@ -21108,7 +21154,7 @@ function useWindowSize({ initializeWithValue = false } = {}) {
21108
21154
  width: canUseDOM2 ? window.innerWidth : 0,
21109
21155
  height: canUseDOM2 ? window.innerHeight : 0
21110
21156
  });
21111
- const [size, setSize] = React54__namespace.default.useState(initializeWithValue ? get : { width: 0, height: 0 });
21157
+ const [size, setSize] = React55__namespace.default.useState(initializeWithValue ? get : { width: 0, height: 0 });
21112
21158
  useIsomorphicLayoutEffect(() => {
21113
21159
  if (!canUseDOM2) return void 0;
21114
21160
  const onResize = () => setSize({ width: window.innerWidth, height: window.innerHeight });
@@ -21119,8 +21165,8 @@ function useWindowSize({ initializeWithValue = false } = {}) {
21119
21165
  return size;
21120
21166
  }
21121
21167
  function useHover(ref) {
21122
- const [hovered, setHovered] = React54__namespace.default.useState(false);
21123
- React54__namespace.default.useEffect(() => {
21168
+ const [hovered, setHovered] = React55__namespace.default.useState(false);
21169
+ React55__namespace.default.useEffect(() => {
21124
21170
  const el = ref && ref.current;
21125
21171
  if (!el) return void 0;
21126
21172
  const on = () => setHovered(true);
@@ -21136,8 +21182,8 @@ function useHover(ref) {
21136
21182
  }
21137
21183
  function useIntersectionObserver(ref, options = {}) {
21138
21184
  const { root = null, rootMargin = "0px", threshold = 0 } = options;
21139
- const [entry, setEntry] = React54__namespace.default.useState(null);
21140
- React54__namespace.default.useEffect(() => {
21185
+ const [entry, setEntry] = React55__namespace.default.useState(null);
21186
+ React55__namespace.default.useEffect(() => {
21141
21187
  const el = ref && ref.current;
21142
21188
  if (!canUseDOM2 || !el || typeof IntersectionObserver === "undefined") return void 0;
21143
21189
  const obs = new IntersectionObserver(([e]) => setEntry(e), { root, rootMargin, threshold });
@@ -21147,20 +21193,20 @@ function useIntersectionObserver(ref, options = {}) {
21147
21193
  return entry;
21148
21194
  }
21149
21195
  function useId(prefix = "twc") {
21150
- const raw = React54__namespace.default.useId();
21196
+ const raw = React55__namespace.default.useId();
21151
21197
  return prefix ? `${prefix}-${raw.replace(/:/g, "")}` : raw;
21152
21198
  }
21153
21199
  var useFocusTrap2 = useFocusTrap;
21154
21200
  var usePortal2 = usePortal;
21155
21201
  var useScrollLock2 = useScrollLock;
21156
21202
  function useFilePicker({ accept, multiple = false, maxSize, maxFiles, onFiles, onReject } = {}) {
21157
- const inputRef = React54__namespace.default.useRef(null);
21158
- const cbRef = React54__namespace.default.useRef({ onFiles, onReject });
21203
+ const inputRef = React55__namespace.default.useRef(null);
21204
+ const cbRef = React55__namespace.default.useRef({ onFiles, onReject });
21159
21205
  cbRef.current = { onFiles, onReject };
21160
- const open = React54__namespace.default.useCallback(() => {
21206
+ const open = React55__namespace.default.useCallback(() => {
21161
21207
  inputRef.current?.click();
21162
21208
  }, []);
21163
- const getInputProps = React54__namespace.default.useCallback(() => ({
21209
+ const getInputProps = React55__namespace.default.useCallback(() => ({
21164
21210
  ref: inputRef,
21165
21211
  type: "file",
21166
21212
  accept,