twico-ui 1.45.0 → 1.46.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (9) hide show
  1. package/CHANGELOG.md +20 -0
  2. package/dist/index.cjs +901 -866
  3. package/dist/index.cjs.map +1 -1
  4. package/dist/index.d.cts +136 -10
  5. package/dist/index.d.ts +136 -10
  6. package/dist/index.mjs +901 -866
  7. package/dist/index.mjs.map +1 -1
  8. package/llms.txt +3 -1
  9. package/package.json +3 -3
package/dist/index.mjs CHANGED
@@ -1,15 +1,15 @@
1
1
  "use client";
2
- import * as React54 from 'react';
3
- import React54__default from 'react';
2
+ import * as React55 from 'react';
3
+ import React55__default from 'react';
4
4
  import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
5
5
  import { createPortal } from 'react-dom';
6
6
 
7
7
  // components/TwicoProvider.jsx
8
- var SUPPORTS_STYLE_HOIST = parseInt(String(React54.version), 10) >= 19;
9
- var NonceContext = React54.createContext(void 0);
8
+ var SUPPORTS_STYLE_HOIST = parseInt(String(React55.version), 10) >= 19;
9
+ var NonceContext = React55.createContext(void 0);
10
10
  function useScopedStyles(id, css) {
11
- const nonce = React54.useContext(NonceContext);
12
- React54.useInsertionEffect(() => {
11
+ const nonce = React55.useContext(NonceContext);
12
+ React55.useInsertionEffect(() => {
13
13
  if (SUPPORTS_STYLE_HOIST) return;
14
14
  if (typeof document === "undefined") return;
15
15
  if (!css) return;
@@ -25,12 +25,12 @@ function useScopedStyles(id, css) {
25
25
  }
26
26
  if (el.textContent !== css) el.textContent = css;
27
27
  }, [id, css, nonce]);
28
- return SUPPORTS_STYLE_HOIST && css ? React54.createElement("style", { href: id, precedence: "twc-ui" }, css) : null;
28
+ return SUPPORTS_STYLE_HOIST && css ? React55.createElement("style", { href: id, precedence: "twc-ui" }, css) : null;
29
29
  }
30
30
 
31
31
  // components/TwicoProvider.jsx
32
32
  function TwicoProvider({ nonce, children }) {
33
- return React54__default.createElement(NonceContext.Provider, { value: nonce }, children);
33
+ return React55__default.createElement(NonceContext.Provider, { value: nonce }, children);
34
34
  }
35
35
  var GROUPS = { colors: "color", space: "space", radius: "radius", font: "font", shadow: "shadow", motion: "" };
36
36
  function createTheme(partial = {}) {
@@ -50,8 +50,8 @@ function toVars(theme) {
50
50
  return Object.keys(theme).some((k) => k.startsWith("--")) ? theme : createTheme(theme);
51
51
  }
52
52
  function ThemeProvider({ theme, mode = "inline", className = "", style, children, ...rest }) {
53
- const vars = React54__default.useMemo(() => toVars(theme), [theme]);
54
- const uid = React54__default.useId();
53
+ const vars = React55__default.useMemo(() => toVars(theme), [theme]);
54
+ const uid = React55__default.useId();
55
55
  const scopeId = `twc-theme-${uid.replace(/[^a-zA-Z0-9]/g, "")}`;
56
56
  const css = mode === "stylesheet" ? `[data-twc-theme="${scopeId}"] { ${Object.entries(vars).map(([k, v]) => `${k}: ${v};`).join(" ")} }` : "";
57
57
  const __twcStyles = useScopedStyles(mode === "stylesheet" ? scopeId : "twc-theme-noop", css);
@@ -73,7 +73,7 @@ var FORM_CSS = `
73
73
  .twc-form { display: flex; flex-direction: column; gap: var(--space-4); font-family: var(--font-sans); }
74
74
  .twc-form__fieldset { border: 0; margin: 0; padding: 0; min-width: 0; display: flex; flex-direction: column; gap: inherit; }
75
75
  `;
76
- var Form = React54__default.forwardRef(function Form2({
76
+ var Form = /* @__PURE__ */ React55__default.forwardRef(function Form2({
77
77
  onSubmit,
78
78
  preventDefault = true,
79
79
  loading = false,
@@ -104,18 +104,16 @@ var Form = React54__default.forwardRef(function Form2({
104
104
  }
105
105
  );
106
106
  });
107
- Form.displayName = "Form";
108
107
  var VH_CSS = `
109
108
  .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; }
110
109
  `;
111
- var VisuallyHidden = React54__default.forwardRef(function VisuallyHidden2({ as: Tag2 = "span", className = "", children, ...rest }, ref) {
110
+ var VisuallyHidden = /* @__PURE__ */ React55__default.forwardRef(function VisuallyHidden2({ as: Tag2 = "span", className = "", children, ...rest }, ref) {
112
111
  const __twcStyles = useScopedStyles("twc-visually-hidden-styles", VH_CSS);
113
112
  return /* @__PURE__ */ jsxs(Tag2, { ref, className: `twc-visually-hidden ${className}`.trim(), ...rest, children: [
114
113
  __twcStyles,
115
114
  children
116
115
  ] });
117
116
  });
118
- VisuallyHidden.displayName = "VisuallyHidden";
119
117
 
120
118
  // components/_warn.js
121
119
  var seen = /* @__PURE__ */ new Set();
@@ -128,7 +126,7 @@ function warnOnce(key, message) {
128
126
 
129
127
  // components/_overlay.js
130
128
  var canUseDOM = typeof window !== "undefined" && typeof document !== "undefined";
131
- var useIsoLayoutEffect = canUseDOM ? React54__default.useLayoutEffect : React54__default.useEffect;
129
+ var useIsoLayoutEffect = canUseDOM ? React55__default.useLayoutEffect : React55__default.useEffect;
132
130
  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"])';
133
131
  var CONTROL_TAGS = "|button|input|select|textarea|";
134
132
  var ROLE_OK = "|button|link|menuitem|menuitemcheckbox|menuitemradio|combobox|tab|treeitem|checkbox|switch|option|";
@@ -142,7 +140,7 @@ function triggerIsControl(el) {
142
140
  }
143
141
  var NATIVE_CONTROL = "button,a[href],summary,input,select,textarea";
144
142
  function useTriggerAudit(ref, name) {
145
- React54__default.useEffect(() => {
143
+ React55__default.useEffect(() => {
146
144
  const el = ref.current && ref.current.firstElementChild;
147
145
  if (!el) return;
148
146
  if (el.classList.contains("twc-tooltip-wrap")) {
@@ -157,7 +155,7 @@ function useTriggerAudit(ref, name) {
157
155
  }, []);
158
156
  }
159
157
  function useFocusTrap(ref, active = true, { restoreFocus = true, initialFocus } = {}) {
160
- React54__default.useEffect(() => {
158
+ React55__default.useEffect(() => {
161
159
  if (!active || !canUseDOM) return void 0;
162
160
  const node = ref.current;
163
161
  if (!node) return void 0;
@@ -168,7 +166,7 @@ function useFocusTrap(ref, active = true, { restoreFocus = true, initialFocus }
168
166
  if (restoreFocus && prevFocused && typeof prevFocused.focus === "function") prevFocused.focus();
169
167
  };
170
168
  }, [active]);
171
- React54__default.useEffect(() => {
169
+ React55__default.useEffect(() => {
172
170
  if (!active || !canUseDOM) return void 0;
173
171
  const node = ref.current;
174
172
  const onKey = (e) => {
@@ -195,7 +193,7 @@ function useFocusTrap(ref, active = true, { restoreFocus = true, initialFocus }
195
193
  }, [active]);
196
194
  }
197
195
  function usePortal() {
198
- return React54__default.useCallback((node) => {
196
+ return React55__default.useCallback((node) => {
199
197
  if (typeof document === "undefined") return null;
200
198
  return typeof createPortal === "function" ? createPortal(node, document.body) : node;
201
199
  }, []);
@@ -225,8 +223,8 @@ function useScrollLock(locked = true) {
225
223
  var __layerSeq = 0;
226
224
  var __openLayers = /* @__PURE__ */ new Set();
227
225
  function useLayer(active) {
228
- const depth = React54__default.useRef(0);
229
- React54__default.useEffect(() => {
226
+ const depth = React55__default.useRef(0);
227
+ React55__default.useEffect(() => {
230
228
  if (!active) return void 0;
231
229
  const d = ++__layerSeq;
232
230
  depth.current = d;
@@ -235,10 +233,10 @@ function useLayer(active) {
235
233
  __openLayers.delete(d);
236
234
  };
237
235
  }, [active]);
238
- return React54__default.useCallback(() => __openLayers.size === 0 || depth.current === Math.max(...__openLayers), []);
236
+ return React55__default.useCallback(() => __openLayers.size === 0 || depth.current === Math.max(...__openLayers), []);
239
237
  }
240
238
  function useInertBackground(ref, active) {
241
- React54__default.useEffect(() => {
239
+ React55__default.useEffect(() => {
242
240
  if (!active || !canUseDOM) return void 0;
243
241
  const node = ref.current;
244
242
  if (!node) return void 0;
@@ -273,7 +271,7 @@ function getColorSchemeScript({ storageKey = "twico-theme", attribute = "class",
273
271
  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){}})();`;
274
272
  }
275
273
  function ColorSchemeScript({ storageKey = "twico-theme", attribute = "class", nonce, defaultScheme }) {
276
- return React54__default.createElement("script", { nonce }, getColorSchemeScript({ storageKey, attribute, defaultScheme }));
274
+ return React55__default.createElement("script", { nonce }, getColorSchemeScript({ storageKey, attribute, defaultScheme }));
277
275
  }
278
276
  var KBD_CSS = `
279
277
  .twc-kbd { display: inline-flex; align-items: center; justify-content: center; min-width: 20px; padding: 2px 6px;
@@ -281,14 +279,13 @@ var KBD_CSS = `
281
279
  background: var(--color-surface-sunken); border: var(--border-thin) solid var(--color-border);
282
280
  border-bottom-width: 2px; border-radius: var(--radius-sm); }
283
281
  `;
284
- var Kbd = React54__default.forwardRef(function Kbd2({ className = "", children, ...rest }, ref) {
282
+ var Kbd = /* @__PURE__ */ React55__default.forwardRef(function Kbd2({ className = "", children, ...rest }, ref) {
285
283
  const __twcStyles = useScopedStyles("twc-kbd-styles", KBD_CSS);
286
284
  return /* @__PURE__ */ jsxs("kbd", { ref, className: `twc-kbd ${className}`.trim(), ...rest, children: [
287
285
  __twcStyles,
288
286
  children
289
287
  ] });
290
288
  });
291
- Kbd.displayName = "Kbd";
292
289
  var PRE_CSS = `
293
290
  .twc-pre { margin: 0; padding: var(--space-4); overflow-x: auto; max-width: 100%;
294
291
  font-family: var(--font-mono); font-size: var(--text-sm); line-height: var(--leading-normal);
@@ -296,14 +293,13 @@ var PRE_CSS = `
296
293
  border: var(--border-thin) solid var(--color-border); border-radius: var(--radius-lg);
297
294
  white-space: pre; -webkit-overflow-scrolling: touch; }
298
295
  `;
299
- var Pre = React54__default.forwardRef(function Pre2({ className = "", children, ...rest }, ref) {
296
+ var Pre = /* @__PURE__ */ React55__default.forwardRef(function Pre2({ className = "", children, ...rest }, ref) {
300
297
  const __twcStyles = useScopedStyles("twc-pre-styles", PRE_CSS);
301
298
  return /* @__PURE__ */ jsxs("pre", { ref, className: `twc-pre ${className}`.trim(), ...rest, children: [
302
299
  __twcStyles,
303
300
  children
304
301
  ] });
305
302
  });
306
- Pre.displayName = "Pre";
307
303
  var ANCHOR_CSS = `
308
304
  .twc-anchor { color: var(--color-primary-subtle-fg); text-decoration: none; border-radius: var(--radius-sm);
309
305
  transition: color var(--duration-fast) var(--ease-standard); }
@@ -316,7 +312,7 @@ function safeHref(url) {
316
312
  const s = String(url).replace(/[\x00-\x20]+/g, "").toLowerCase();
317
313
  return s.startsWith("javascript:") || s.startsWith("data:") || s.startsWith("vbscript:") ? void 0 : url;
318
314
  }
319
- var Anchor = React54__default.forwardRef(function Anchor2({ as: Tag2 = "a", href, external = false, className = "", children, ...rest }, ref) {
315
+ var Anchor = /* @__PURE__ */ React55__default.forwardRef(function Anchor2({ as: Tag2 = "a", href, external = false, className = "", children, ...rest }, ref) {
320
316
  const __twcStyles = useScopedStyles("twc-anchor-styles", ANCHOR_CSS);
321
317
  const extra = external ? { target: "_blank", rel: "noopener noreferrer" } : {};
322
318
  return /* @__PURE__ */ jsxs(Tag2, { ref, className: `twc-anchor ${className}`.trim(), href: Tag2 === "a" ? safeHref(href) : href, ...extra, ...rest, children: [
@@ -325,14 +321,13 @@ var Anchor = React54__default.forwardRef(function Anchor2({ as: Tag2 = "a", href
325
321
  external ? /* @__PURE__ */ jsx("span", { className: "twc-anchor__ext", "aria-hidden": "true", children: "\u2197" }) : null
326
322
  ] });
327
323
  });
328
- Anchor.displayName = "Anchor";
329
324
  var LABEL_CSS = `
330
325
  .twc-label { font-size: var(--text-sm); font-weight: var(--font-semibold); color: var(--color-text); display: inline-flex; gap: 4px; align-items: center; }
331
326
  .twc-label[data-size="sm"] { font-size: var(--text-xs); }
332
327
  .twc-label[data-size="lg"] { font-size: var(--text-base); }
333
328
  .twc-label__req { color: var(--color-danger); }
334
329
  `;
335
- var Label = React54__default.forwardRef(function Label2({ htmlFor, required = false, size = "md", className = "", children, ...rest }, ref) {
330
+ var Label = /* @__PURE__ */ React55__default.forwardRef(function Label2({ htmlFor, required = false, size = "md", className = "", children, ...rest }, ref) {
336
331
  const __twcStyles = useScopedStyles("twc-label-styles", LABEL_CSS);
337
332
  return /* @__PURE__ */ jsxs("label", { ref, htmlFor, className: `twc-label ${className}`.trim(), "data-size": size, ...rest, children: [
338
333
  __twcStyles,
@@ -340,12 +335,11 @@ var Label = React54__default.forwardRef(function Label2({ htmlFor, required = fa
340
335
  required ? /* @__PURE__ */ jsx("span", { className: "twc-label__req", "aria-hidden": "true", children: "*" }) : null
341
336
  ] });
342
337
  });
343
- Label.displayName = "Label";
344
338
  var IMAGE_CSS = `
345
339
  .twc-image { display: block; max-width: 100%; }
346
340
  .twc-image[data-fit] { width: 100%; height: 100%; }
347
341
  `;
348
- var Image = React54__default.forwardRef(function Image2({
342
+ var Image = /* @__PURE__ */ React55__default.forwardRef(function Image2({
349
343
  src,
350
344
  alt,
351
345
  fit,
@@ -361,7 +355,7 @@ var Image = React54__default.forwardRef(function Image2({
361
355
  ...rest
362
356
  }, ref) {
363
357
  const __twcStyles = useScopedStyles("twc-image-styles", IMAGE_CSS);
364
- const [failed, setFailed] = React54__default.useState(false);
358
+ const [failed, setFailed] = React55__default.useState(false);
365
359
  const shownSrc = failed && fallback ? fallback : src;
366
360
  const s = {
367
361
  objectFit: fit,
@@ -400,7 +394,6 @@ var Image = React54__default.forwardRef(function Image2({
400
394
  )
401
395
  ] });
402
396
  });
403
- Image.displayName = "Image";
404
397
  var ICONBTN_CSS = `
405
398
  .twc-iconbtn {
406
399
  --_sz: var(--control-h-md);
@@ -470,7 +463,7 @@ function safeHref2(url) {
470
463
  const s = String(url).replace(/[\x00-\x20]+/g, "").toLowerCase();
471
464
  return s.startsWith("javascript:") || s.startsWith("data:") || s.startsWith("vbscript:") ? void 0 : url;
472
465
  }
473
- function IconButton({
466
+ var IconButton = /* @__PURE__ */ React55__default.forwardRef(function IconButton2({
474
467
  children,
475
468
  icon,
476
469
  variant = "ghost",
@@ -487,7 +480,7 @@ function IconButton({
487
480
  "aria-label": ariaLabel,
488
481
  onClick,
489
482
  ...rest
490
- }) {
483
+ }, ref) {
491
484
  const __twcStyles = useScopedStyles("twc-iconbtn-styles", ICONBTN_CSS);
492
485
  const Tag2 = as;
493
486
  const inert = Tag2 === "a" && disabled;
@@ -495,6 +488,7 @@ function IconButton({
495
488
  return /* @__PURE__ */ jsxs(
496
489
  Tag2,
497
490
  {
491
+ ref,
498
492
  className: `twc-iconbtn ${className}`,
499
493
  "data-variant": variant,
500
494
  "data-tone": tone,
@@ -516,7 +510,7 @@ function IconButton({
516
510
  ]
517
511
  }
518
512
  );
519
- }
513
+ });
520
514
 
521
515
  // components/_compose.js
522
516
  function compose(theirs, ours) {
@@ -592,14 +586,14 @@ function Tooltip({
592
586
  }) {
593
587
  const __twcStyles = useScopedStyles("twc-tooltip-styles", TOOLTIP_CSS);
594
588
  const anchored = anchor !== void 0;
595
- const id = React54__default.useId();
596
- const [showU, setShowU] = React54__default.useState(false);
589
+ const id = React55__default.useId();
590
+ const [showU, setShowU] = React55__default.useState(false);
597
591
  const show = anchored ? !!openProp : showU;
598
- const [coords, setCoords] = React54__default.useState(null);
599
- const timer = React54__default.useRef(null);
600
- const closeTimer = React54__default.useRef(null);
601
- const wrapRef = React54__default.useRef(null);
602
- const tipRef = React54__default.useRef(null);
592
+ const [coords, setCoords] = React55__default.useState(null);
593
+ const timer = React55__default.useRef(null);
594
+ const closeTimer = React55__default.useRef(null);
595
+ const wrapRef = React55__default.useRef(null);
596
+ const tipRef = React55__default.useRef(null);
603
597
  const open = () => {
604
598
  clearTimeout(closeTimer.current);
605
599
  clearTimeout(timer.current);
@@ -610,11 +604,11 @@ function Tooltip({
610
604
  clearTimeout(closeTimer.current);
611
605
  closeTimer.current = setTimeout(() => setShowU(false), 120);
612
606
  };
613
- React54__default.useEffect(() => () => {
607
+ React55__default.useEffect(() => () => {
614
608
  clearTimeout(timer.current);
615
609
  clearTimeout(closeTimer.current);
616
610
  }, []);
617
- const place = React54__default.useCallback(() => {
611
+ const place = React55__default.useCallback(() => {
618
612
  const el = anchored ? anchor : wrapRef.current;
619
613
  if (!el || !el.getBoundingClientRect) return;
620
614
  const r2 = el.getBoundingClientRect();
@@ -649,10 +643,10 @@ function Tooltip({
649
643
  setCoords({ ...base, left: c, bottom: Math.round(vh - r2.top + gap), arrowX: arrowX(c) });
650
644
  }
651
645
  }, [placement, anchored, anchor]);
652
- React54__default.useEffect(() => {
646
+ React55__default.useEffect(() => {
653
647
  place();
654
648
  }, [place]);
655
- React54__default.useEffect(() => {
649
+ React55__default.useEffect(() => {
656
650
  if (!show) return void 0;
657
651
  place();
658
652
  const onMove = () => place();
@@ -663,7 +657,7 @@ function Tooltip({
663
657
  window.removeEventListener("resize", onMove);
664
658
  };
665
659
  }, [show, place]);
666
- React54__default.useEffect(() => {
660
+ React55__default.useEffect(() => {
667
661
  if (!show || anchored) return;
668
662
  const onKeyDown = (e) => {
669
663
  if (e.key === "Escape") {
@@ -707,7 +701,7 @@ function Tooltip({
707
701
  bubble
708
702
  ] });
709
703
  const describedBy = show ? id : void 0;
710
- const trigger = React54__default.isValidElement(children) && children.type !== React54__default.Fragment ? React54__default.cloneElement(children, {
704
+ const trigger = React55__default.isValidElement(children) && children.type !== React55__default.Fragment ? React55__default.cloneElement(children, {
711
705
  "aria-describedby": [children.props["aria-describedby"], describedBy].filter(Boolean).join(" ") || void 0
712
706
  }) : /* @__PURE__ */ jsx("span", { "aria-describedby": describedBy, children });
713
707
  return /* @__PURE__ */ jsxs(
@@ -756,7 +750,7 @@ var IcoReset = /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 24 24", fill: "none",
756
750
  /* @__PURE__ */ jsx("path", { d: "M3 12a9 9 0 1 0 9-9 9 9 0 0 0-6.3 2.6L3 8" }),
757
751
  /* @__PURE__ */ jsx("path", { d: "M3 3v5h5" })
758
752
  ] });
759
- var ImageViewer = /* @__PURE__ */ React54__default.forwardRef(function ImageViewer2({
753
+ var ImageViewer = /* @__PURE__ */ React55__default.forwardRef(function ImageViewer2({
760
754
  src,
761
755
  alt,
762
756
  minZoom = 1,
@@ -775,16 +769,16 @@ var ImageViewer = /* @__PURE__ */ React54__default.forwardRef(function ImageView
775
769
  ...rest
776
770
  }, ref) {
777
771
  const __twcStyles = useScopedStyles("twc-imageviewer-styles", IV_CSS);
778
- const stageRef = React54__default.useRef(null);
779
- const natRef = React54__default.useRef({ w: 0, h: 0 });
780
- const [internalZoom, setInternalZoom] = React54__default.useState(clamp(defaultZoom, minZoom, maxZoom));
772
+ const stageRef = React55__default.useRef(null);
773
+ const natRef = React55__default.useRef({ w: 0, h: 0 });
774
+ const [internalZoom, setInternalZoom] = React55__default.useState(clamp(defaultZoom, minZoom, maxZoom));
781
775
  const zoomControlled = zoomProp !== void 0;
782
776
  const zoom = clamp(zoomControlled ? zoomProp : internalZoom, minZoom, maxZoom);
783
- const [offset, setOffset] = React54__default.useState({ x: 0, y: 0 });
784
- const [dragging, setDragging] = React54__default.useState(false);
785
- const zoomRef = React54__default.useRef(zoom);
777
+ const [offset, setOffset] = React55__default.useState({ x: 0, y: 0 });
778
+ const [dragging, setDragging] = React55__default.useState(false);
779
+ const zoomRef = React55__default.useRef(zoom);
786
780
  zoomRef.current = zoom;
787
- const offsetRef = React54__default.useRef(offset);
781
+ const offsetRef = React55__default.useRef(offset);
788
782
  offsetRef.current = offset;
789
783
  const applyZoom = (next) => {
790
784
  const z = clamp(next, minZoom, maxZoom);
@@ -834,12 +828,12 @@ var ImageViewer = /* @__PURE__ */ React54__default.forwardRef(function ImageView
834
828
  if (r2) zoomAt(r2.left + r2.width / 2, r2.top + r2.height / 2, next);
835
829
  else if (applyZoom(next) <= minZoom) setOffset({ x: 0, y: 0 });
836
830
  };
837
- const mountedRef = React54__default.useRef(false);
838
- React54__default.useEffect(() => {
831
+ const mountedRef = React55__default.useRef(false);
832
+ React55__default.useEffect(() => {
839
833
  if (mountedRef.current) reset();
840
834
  else mountedRef.current = true;
841
835
  }, [src]);
842
- React54__default.useEffect(() => {
836
+ React55__default.useEffect(() => {
843
837
  const stage = stageRef.current;
844
838
  if (!stage) return void 0;
845
839
  const onWheel = (e) => {
@@ -850,9 +844,9 @@ var ImageViewer = /* @__PURE__ */ React54__default.forwardRef(function ImageView
850
844
  stage.addEventListener("wheel", onWheel, { passive: false });
851
845
  return () => stage.removeEventListener("wheel", onWheel);
852
846
  }, [step, minZoom, maxZoom, fit]);
853
- const pointers = React54__default.useRef(/* @__PURE__ */ new Map());
854
- const pinchRef = React54__default.useRef(null);
855
- const panRef = React54__default.useRef(null);
847
+ const pointers = React55__default.useRef(/* @__PURE__ */ new Map());
848
+ const pinchRef = React55__default.useRef(null);
849
+ const panRef = React55__default.useRef(null);
856
850
  const onPointerDown = (e) => {
857
851
  pointers.current.set(e.pointerId, { x: e.clientX, y: e.clientY });
858
852
  e.currentTarget.setPointerCapture?.(e.pointerId);
@@ -904,13 +898,13 @@ var ImageViewer = /* @__PURE__ */ React54__default.forwardRef(function ImageView
904
898
  };
905
899
  const canZoomIn = zoom < maxZoom, canZoomOut = zoom > minZoom;
906
900
  const api = { zoom, zoomIn: () => zoomFromCenter(zoom + step), zoomOut: () => zoomFromCenter(zoom - step), reset, canZoomIn, canZoomOut };
907
- React54__default.useImperativeHandle(ref, () => api);
908
- const onStateChangeRef = React54__default.useRef(onStateChange);
901
+ React55__default.useImperativeHandle(ref, () => api);
902
+ const onStateChangeRef = React55__default.useRef(onStateChange);
909
903
  onStateChangeRef.current = onStateChange;
910
- React54__default.useEffect(() => {
904
+ React55__default.useEffect(() => {
911
905
  onStateChangeRef.current?.({ zoom, canZoomIn, canZoomOut });
912
906
  }, [zoom, canZoomIn, canZoomOut]);
913
- React54__default.useEffect(() => {
907
+ React55__default.useEffect(() => {
914
908
  setOffset((o) => clampOffset(o, zoomRef.current));
915
909
  }, [fit]);
916
910
  const defaultControls = /* @__PURE__ */ jsxs("div", { className: "twc-iv__controls", children: [
@@ -1004,11 +998,11 @@ function Accordion({
1004
998
  ...rest
1005
999
  }) {
1006
1000
  const __twcStyles = useScopedStyles("twc-accordion-styles", ACCORDION_CSS);
1007
- const rootRef = React54__default.useRef(null);
1008
- const [internal, setInternal] = React54__default.useState(() => new Set(defaultOpen));
1001
+ const rootRef = React55__default.useRef(null);
1002
+ const [internal, setInternal] = React55__default.useState(() => new Set(defaultOpen));
1009
1003
  const open = openProp !== void 0 ? new Set(openProp) : internal;
1010
- const baseId = React54__default.useId();
1011
- const [ever, setEver] = React54__default.useState(() => new Set(open));
1004
+ const baseId = React55__default.useId();
1005
+ const [ever, setEver] = React55__default.useState(() => new Set(open));
1012
1006
  const defer = mountOnOpen || unmountOnClose;
1013
1007
  let mounted = ever;
1014
1008
  if (defer) {
@@ -1020,7 +1014,7 @@ function Accordion({
1020
1014
  }
1021
1015
  }
1022
1016
  const openKey = defer ? JSON.stringify([...open].sort()) : "";
1023
- React54__default.useEffect(() => {
1017
+ React55__default.useEffect(() => {
1024
1018
  if (!unmountOnClose) return void 0;
1025
1019
  const drop = [...ever].filter((v) => !open.has(v));
1026
1020
  if (!drop.length) return void 0;
@@ -1225,7 +1219,7 @@ function Avatar({
1225
1219
  ...rest
1226
1220
  }) {
1227
1221
  const __twcStyles = useScopedStyles("twc-avatar-styles", AVATAR_CSS);
1228
- const [errored, setErrored] = React54__default.useState(false);
1222
+ const [errored, setErrored] = React55__default.useState(false);
1229
1223
  const cleanSrc = safeSrc(src);
1230
1224
  const showImg = cleanSrc && !errored;
1231
1225
  const _statusLabel = status ? statusLabel ?? statusLabels?.[status] ?? STATUS_LABELS[status] : void 0;
@@ -1307,28 +1301,28 @@ function Menu({
1307
1301
  ...rest
1308
1302
  }) {
1309
1303
  const __twcStyles = useScopedStyles("twc-menu-styles", MENU_CSS);
1310
- const _tp = React54__default.isValidElement(trigger) ? trigger.props : {};
1304
+ const _tp = React55__default.isValidElement(trigger) ? trigger.props : {};
1311
1305
  const triggerDisabled = _tp.disabled === true || _tp["aria-disabled"] === true || _tp["aria-disabled"] === "true";
1312
- const [openState, setOpenState] = React54__default.useState(defaultOpen);
1313
- const [render, setRender] = React54__default.useState(false);
1314
- const [pos, setPos] = React54__default.useState(null);
1315
- const [active, setActive] = React54__default.useState(-1);
1316
- const wrapRef = React54__default.useRef(null);
1306
+ const [openState, setOpenState] = React55__default.useState(defaultOpen);
1307
+ const [render, setRender] = React55__default.useState(false);
1308
+ const [pos, setPos] = React55__default.useState(null);
1309
+ const [active, setActive] = React55__default.useState(-1);
1310
+ const wrapRef = React55__default.useRef(null);
1317
1311
  useTriggerAudit(wrapRef, "Menu");
1318
- const menuRef = React54__default.useRef(null);
1319
- const typeBufRef = React54__default.useRef("");
1320
- const typeTimerRef = React54__default.useRef(null);
1321
- const menuId = React54__default.useId();
1312
+ const menuRef = React55__default.useRef(null);
1313
+ const typeBufRef = React55__default.useRef("");
1314
+ const typeTimerRef = React55__default.useRef(null);
1315
+ const menuId = React55__default.useId();
1322
1316
  const headerId = `${menuId}-header`;
1323
1317
  const controlled = openProp !== void 0;
1324
1318
  const open = controlled ? !!openProp : openState;
1325
- const openRef = React54__default.useRef(open);
1319
+ const openRef = React55__default.useRef(open);
1326
1320
  openRef.current = open;
1327
- const controlledRef = React54__default.useRef(controlled);
1321
+ const controlledRef = React55__default.useRef(controlled);
1328
1322
  controlledRef.current = controlled;
1329
- const onOpenChangeRef = React54__default.useRef(onOpenChange);
1323
+ const onOpenChangeRef = React55__default.useRef(onOpenChange);
1330
1324
  onOpenChangeRef.current = onOpenChange;
1331
- const setOpen = React54__default.useCallback((next) => {
1325
+ const setOpen = React55__default.useCallback((next) => {
1332
1326
  const value = typeof next === "function" ? next(openRef.current) : next;
1333
1327
  if (value === openRef.current) return;
1334
1328
  if (!controlledRef.current) setOpenState(value);
@@ -1336,7 +1330,7 @@ function Menu({
1336
1330
  }, []);
1337
1331
  const RD = { createPortal: typeof createPortal === "function" ? createPortal : typeof window !== "undefined" && window.ReactDOM && window.ReactDOM.createPortal };
1338
1332
  const interactiveIdx = items.map((it, i) => !it.separator && !it.heading ? i : -1).filter((i) => i >= 0);
1339
- const place = React54__default.useCallback(() => {
1333
+ const place = React55__default.useCallback(() => {
1340
1334
  const t = wrapRef.current;
1341
1335
  if (!t) return;
1342
1336
  const r2 = t.getBoundingClientRect();
@@ -1352,7 +1346,7 @@ function Menu({
1352
1346
  setPos({ top, bottom, left, width: w, flip, maxHeight: Math.max(120, avail) });
1353
1347
  }, [align, width]);
1354
1348
  const isTop = useLayer(open && render);
1355
- React54__default.useEffect(() => {
1349
+ React55__default.useEffect(() => {
1356
1350
  if (!open) return;
1357
1351
  place();
1358
1352
  const onMove = () => place();
@@ -1371,18 +1365,18 @@ function Menu({
1371
1365
  document.removeEventListener("mousedown", onDown);
1372
1366
  };
1373
1367
  }, [open, place, isTop]);
1374
- const kbdRef = React54__default.useRef(false);
1375
- React54__default.useEffect(() => {
1368
+ const kbdRef = React55__default.useRef(false);
1369
+ React55__default.useEffect(() => {
1376
1370
  if (!open || !render || active < 0 || !kbdRef.current) return;
1377
1371
  kbdRef.current = false;
1378
1372
  const el = document.getElementById(`${menuId}-item-${active}`);
1379
1373
  if (el) el.focus();
1380
1374
  }, [open, render, active, menuId]);
1381
- const focusTrigger = React54__default.useCallback(() => {
1375
+ const focusTrigger = React55__default.useCallback(() => {
1382
1376
  const t = wrapRef.current && wrapRef.current.querySelector('button, a[href], [role="button"], [tabindex]');
1383
1377
  if (t) t.focus();
1384
1378
  }, []);
1385
- React54__default.useEffect(() => {
1379
+ React55__default.useEffect(() => {
1386
1380
  if (open) return;
1387
1381
  kbdRef.current = false;
1388
1382
  setActive(-1);
@@ -1390,7 +1384,7 @@ function Menu({
1390
1384
  if (!m || typeof document === "undefined" || !m.contains(document.activeElement)) return;
1391
1385
  focusTrigger();
1392
1386
  }, [open, focusTrigger]);
1393
- React54__default.useEffect(() => {
1387
+ React55__default.useEffect(() => {
1394
1388
  if (open) {
1395
1389
  setRender(true);
1396
1390
  return;
@@ -1523,8 +1517,8 @@ function Menu({
1523
1517
  ]
1524
1518
  }
1525
1519
  ) : null;
1526
- const fix = React54__default.isValidElement(trigger) && !triggerIsControl(trigger) ? { role: "button" } : null;
1527
- const triggerEl = React54__default.isValidElement(trigger) ? React54__default.cloneElement(trigger, {
1520
+ const fix = React55__default.isValidElement(trigger) && !triggerIsControl(trigger) ? { role: "button" } : null;
1521
+ const triggerEl = React55__default.isValidElement(trigger) ? React55__default.cloneElement(trigger, {
1528
1522
  onClick: (e) => {
1529
1523
  trigger.props.onClick?.(e);
1530
1524
  toggle();
@@ -1715,7 +1709,7 @@ function Breadcrumb({
1715
1709
  ...rest
1716
1710
  }) {
1717
1711
  const __twcStyles = useScopedStyles("twc-breadcrumb-styles", BREADCRUMB_CSS);
1718
- const [expanded, setExpanded] = React54__default.useState(false);
1712
+ const [expanded, setExpanded] = React55__default.useState(false);
1719
1713
  const sep = separator || /* @__PURE__ */ jsx(ChevronSep, {});
1720
1714
  let display = items;
1721
1715
  if (maxItems > 0 && items.length > maxItems && !expanded) {
@@ -1728,7 +1722,7 @@ function Breadcrumb({
1728
1722
  __twcStyles,
1729
1723
  display.map((it, i) => {
1730
1724
  const last = i === display.length - 1;
1731
- return /* @__PURE__ */ jsxs(React54__default.Fragment, { children: [
1725
+ return /* @__PURE__ */ jsxs(React55__default.Fragment, { children: [
1732
1726
  it.ellipsis ? /* @__PURE__ */ jsx("button", { className: "twc-breadcrumb__ellipsis", "aria-label": "Show more", onClick: () => setExpanded(true), children: "\u2026" }) : last ? /* @__PURE__ */ jsxs(
1733
1727
  "span",
1734
1728
  {
@@ -1877,7 +1871,7 @@ function safeHref5(url) {
1877
1871
  const s = String(url).replace(/[\x00-\x20]+/g, "").toLowerCase();
1878
1872
  return s.startsWith("javascript:") || s.startsWith("data:") || s.startsWith("vbscript:") ? void 0 : url;
1879
1873
  }
1880
- function Button({
1874
+ var Button = /* @__PURE__ */ React55__default.forwardRef(function Button2({
1881
1875
  children,
1882
1876
  variant = "solid",
1883
1877
  tone = "primary",
@@ -1895,9 +1889,9 @@ function Button({
1895
1889
  className = "",
1896
1890
  onClick,
1897
1891
  ...rest
1898
- }) {
1892
+ }, ref) {
1899
1893
  const __twcStyles = useScopedStyles("twc-btn-styles", CSS2);
1900
- const [ripples, setRipples] = React54__default.useState([]);
1894
+ const [ripples, setRipples] = React55__default.useState([]);
1901
1895
  const Tag2 = as;
1902
1896
  const inert = Tag2 === "a" && (disabled || loading);
1903
1897
  const softDisabled = disabled && focusableWhenDisabled && !loading && Tag2 === "button";
@@ -1919,6 +1913,7 @@ function Button({
1919
1913
  return /* @__PURE__ */ jsxs(
1920
1914
  Tag2,
1921
1915
  {
1916
+ ref,
1922
1917
  className: `twc-btn ${className}`,
1923
1918
  "data-variant": variant,
1924
1919
  "data-tone": tone,
@@ -1954,7 +1949,7 @@ function Button({
1954
1949
  ]
1955
1950
  }
1956
1951
  );
1957
- }
1952
+ });
1958
1953
  var UNITLESS = /* @__PURE__ */ new Set([
1959
1954
  "animationIterationCount",
1960
1955
  "aspectRatio",
@@ -2127,9 +2122,9 @@ function buildSx(sx, uid) {
2127
2122
  return { flatStyle, css };
2128
2123
  }
2129
2124
  function useSx(sx) {
2130
- const rawId = React54__default.useId();
2125
+ const rawId = React55__default.useId();
2131
2126
  const uid = `sx${rawId.replace(/[^a-zA-Z0-9]/g, "")}`;
2132
- const { flatStyle, css } = React54__default.useMemo(() => buildSx(sx, uid), [sx, uid]);
2127
+ const { flatStyle, css } = React55__default.useMemo(() => buildSx(sx, uid), [sx, uid]);
2133
2128
  const styleNode = useScopedStyles(`twc-sx-${uid}`, css);
2134
2129
  return { flatStyle, styleNode, sxAttr: css ? uid : void 0 };
2135
2130
  }
@@ -2265,14 +2260,14 @@ function Carousel({
2265
2260
  ...rest
2266
2261
  }) {
2267
2262
  const __twcStyles = useScopedStyles("twc-carousel-styles", CAROUSEL_CSS);
2268
- const slides = React54__default.Children.toArray(children);
2263
+ const slides = React55__default.Children.toArray(children);
2269
2264
  const count = slides.length;
2270
- const [internal, setInternal] = React54__default.useState(defaultIndex);
2265
+ const [internal, setInternal] = React55__default.useState(defaultIndex);
2271
2266
  const index = indexProp !== void 0 ? indexProp : internal;
2272
- const [paused, setPaused] = React54__default.useState(false);
2273
- const [userPaused, setUserPaused] = React54__default.useState(false);
2274
- const [prefersReduced, setPrefersReduced] = React54__default.useState(false);
2275
- React54__default.useEffect(() => {
2267
+ const [paused, setPaused] = React55__default.useState(false);
2268
+ const [userPaused, setUserPaused] = React55__default.useState(false);
2269
+ const [prefersReduced, setPrefersReduced] = React55__default.useState(false);
2270
+ React55__default.useEffect(() => {
2276
2271
  if (typeof window === "undefined" || !window.matchMedia) return void 0;
2277
2272
  const mql = window.matchMedia("(prefers-reduced-motion: reduce)");
2278
2273
  const on = () => setPrefersReduced(mql.matches);
@@ -2280,16 +2275,16 @@ function Carousel({
2280
2275
  mql.addEventListener("change", on);
2281
2276
  return () => mql.removeEventListener("change", on);
2282
2277
  }, []);
2283
- const setIndex = React54__default.useCallback((i) => {
2278
+ const setIndex = React55__default.useCallback((i) => {
2284
2279
  if (indexProp === void 0) setInternal(i);
2285
2280
  onIndexChange?.(i);
2286
2281
  }, [indexProp, onIndexChange]);
2287
- const go = React54__default.useCallback((i) => {
2282
+ const go = React55__default.useCallback((i) => {
2288
2283
  if (count <= 0) return;
2289
2284
  setIndex(loop ? (i % count + count) % count : Math.min(Math.max(i, 0), count - 1));
2290
2285
  }, [count, loop, setIndex]);
2291
2286
  const autoRotating = autoPlay && !paused && !userPaused && !prefersReduced && count > 1;
2292
- React54__default.useEffect(() => {
2287
+ React55__default.useEffect(() => {
2293
2288
  if (!autoRotating) return void 0;
2294
2289
  const t = setInterval(() => {
2295
2290
  const next = loop ? (index + 1) % count : index + 1 >= count ? index : index + 1;
@@ -2549,7 +2544,7 @@ var CHART_BASE_CSS = `
2549
2544
  }
2550
2545
  `;
2551
2546
  function ChartTable({ id, caption, columns, rows }) {
2552
- const h = React54__default.createElement;
2547
+ const h = React55__default.createElement;
2553
2548
  return h(
2554
2549
  "table",
2555
2550
  { className: "twc-chart__sr", id },
@@ -2579,7 +2574,7 @@ function ChartTable({ id, caption, columns, rows }) {
2579
2574
  );
2580
2575
  }
2581
2576
  function ChartLegend({ items, onToggle, hidden, onFocus, onBlur }) {
2582
- const h = React54__default.createElement;
2577
+ const h = React55__default.createElement;
2583
2578
  return h(
2584
2579
  "div",
2585
2580
  { className: "twc-chart__legend" },
@@ -2610,23 +2605,23 @@ function ChartLegend({ items, onToggle, hidden, onFocus, onBlur }) {
2610
2605
  );
2611
2606
  }
2612
2607
  function useChartTooltip() {
2613
- const containerRef = React54__default.useRef(null);
2614
- const [tip, setTip] = React54__default.useState(null);
2615
- const show = React54__default.useCallback((content, e) => {
2608
+ const containerRef = React55__default.useRef(null);
2609
+ const [tip, setTip] = React55__default.useState(null);
2610
+ const show = React55__default.useCallback((content, e) => {
2616
2611
  const el = containerRef.current;
2617
2612
  const rect = el && el.getBoundingClientRect ? el.getBoundingClientRect() : null;
2618
2613
  const left = rect ? e.clientX - rect.left : 0;
2619
2614
  const top = rect ? e.clientY - rect.top : 0;
2620
2615
  setTip({ title: content.title, items: content.items || [], left, top });
2621
2616
  }, []);
2622
- const hide = React54__default.useCallback(() => setTip(null), []);
2617
+ const hide = React55__default.useCallback(() => setTip(null), []);
2623
2618
  return { containerRef, tip, show, hide };
2624
2619
  }
2625
2620
  function ChartTooltip({ tip }) {
2626
- const h = React54__default.createElement;
2627
- const ref = React54__default.useRef(null);
2628
- const [pos, setPos] = React54__default.useState({ dx: 0, below: false });
2629
- React54__default.useLayoutEffect(() => {
2621
+ const h = React55__default.createElement;
2622
+ const ref = React55__default.useRef(null);
2623
+ const [pos, setPos] = React55__default.useState({ dx: 0, below: false });
2624
+ React55__default.useLayoutEffect(() => {
2630
2625
  const el = ref.current;
2631
2626
  if (!tip || !el) return;
2632
2627
  const parent = el.offsetParent;
@@ -2703,17 +2698,17 @@ function Chart({
2703
2698
  }) {
2704
2699
  const baseStyles = useScopedStyles("twc-chart-base", CHART_BASE_CSS);
2705
2700
  const styles = useScopedStyles("twc-chart-styles", CHART_CSS);
2706
- const uid = React54__default.useId();
2701
+ const uid = React55__default.useId();
2707
2702
  const gid = uid.replace(/[^a-zA-Z0-9]/g, "");
2708
2703
  const tableId = tableFallback ? `${uid}-table` : void 0;
2709
2704
  const { containerRef, tip, show, hide } = useChartTooltip();
2710
- const [hidden, setHidden] = React54__default.useState(() => /* @__PURE__ */ new Set());
2711
- const [focusSeries, setFocusSeries] = React54__default.useState(null);
2712
- const [selected, setSelected] = React54__default.useState(null);
2713
- const [hoverIdx, setHoverIdx] = React54__default.useState(null);
2714
- const [zoom, setZoom] = React54__default.useState(null);
2715
- const [drag, setDrag] = React54__default.useState(null);
2716
- const svgRef = React54__default.useRef(null);
2705
+ const [hidden, setHidden] = React55__default.useState(() => /* @__PURE__ */ new Set());
2706
+ const [focusSeries, setFocusSeries] = React55__default.useState(null);
2707
+ const [selected, setSelected] = React55__default.useState(null);
2708
+ const [hoverIdx, setHoverIdx] = React55__default.useState(null);
2709
+ const [zoom, setZoom] = React55__default.useState(null);
2710
+ const [drag, setDrag] = React55__default.useState(null);
2711
+ const svgRef = React55__default.useRef(null);
2717
2712
  const isBar = type === "bar" || type === "column";
2718
2713
  const isArea = type === "area";
2719
2714
  const crv = smooth ? "smooth" : curve;
@@ -2818,7 +2813,7 @@ function Chart({
2818
2813
  onDataClick({ label: d.label, series: null, seriesIndex: -1, value: void 0, index: baseIdx + idx, row: d });
2819
2814
  selectMark(`${idx}:*`);
2820
2815
  };
2821
- React54__default.useEffect(() => {
2816
+ React55__default.useEffect(() => {
2822
2817
  if (!zoomable) return void 0;
2823
2818
  const svg = svgRef.current;
2824
2819
  if (!svg) return void 0;
@@ -3128,12 +3123,12 @@ function PieChart({
3128
3123
  }) {
3129
3124
  const baseStyles = useScopedStyles("twc-chart-base", CHART_BASE_CSS);
3130
3125
  const styles = useScopedStyles("twc-piechart-styles", CHART_CSS2);
3131
- const uid = React54__default.useId();
3126
+ const uid = React55__default.useId();
3132
3127
  const tableId = tableFallback ? `${uid}-table` : void 0;
3133
3128
  const { containerRef, tip, show, hide } = useChartTooltip();
3134
- const [active, setActive] = React54__default.useState(null);
3135
- const [focus, setFocus] = React54__default.useState(null);
3136
- const [selected, setSelected] = React54__default.useState(null);
3129
+ const [active, setActive] = React55__default.useState(null);
3130
+ const [focus, setFocus] = React55__default.useState(null);
3131
+ const [selected, setSelected] = React55__default.useState(null);
3137
3132
  const clickable = !!onDataClick;
3138
3133
  const rows = data || [];
3139
3134
  const fmt = valueFormat || fmtNumber;
@@ -3282,11 +3277,11 @@ function Gauge({
3282
3277
  }) {
3283
3278
  const baseStyles = useScopedStyles("twc-chart-base", CHART_BASE_CSS);
3284
3279
  const styles = useScopedStyles("twc-gauge-styles", GAUGE_CSS);
3285
- const uid = React54__default.useId();
3280
+ const uid = React55__default.useId();
3286
3281
  const tableId = tableFallback ? `${uid}-table` : void 0;
3287
3282
  const { containerRef, tip, show, hide } = useChartTooltip();
3288
- const [selected, setSelected] = React54__default.useState(null);
3289
- const [focus, setFocus] = React54__default.useState(null);
3283
+ const [selected, setSelected] = React55__default.useState(null);
3284
+ const [focus, setFocus] = React55__default.useState(null);
3290
3285
  const fmt = valueFormat || ((n) => String(Math.round(Number(n) || 0)));
3291
3286
  const cx = size / 2, cy = size / 2;
3292
3287
  const span = endAngle - startAngle;
@@ -3447,11 +3442,11 @@ function Sparkline({
3447
3442
  }) {
3448
3443
  const baseStyles = useScopedStyles("twc-chart-base", CHART_BASE_CSS);
3449
3444
  const styles = useScopedStyles("twc-sparkline-styles", SPARK_CSS);
3450
- const uid = React54__default.useId();
3445
+ const uid = React55__default.useId();
3451
3446
  const tableId = tableFallback ? `${uid}-table` : void 0;
3452
3447
  const { containerRef, tip, show, hide } = useChartTooltip();
3453
- const [hover, setHover] = React54__default.useState(null);
3454
- const [selected, setSelected] = React54__default.useState(null);
3448
+ const [hover, setHover] = React55__default.useState(null);
3449
+ const [selected, setSelected] = React55__default.useState(null);
3455
3450
  const clickable = !!onDataClick;
3456
3451
  const kind = area ? "area" : type;
3457
3452
  const isBar = kind === "bar";
@@ -3651,17 +3646,17 @@ function ScatterChart({
3651
3646
  }) {
3652
3647
  const baseStyles = useScopedStyles("twc-chart-base", CHART_BASE_CSS);
3653
3648
  const styles = useScopedStyles("twc-scatter-styles", SCATTER_CSS);
3654
- const uid = React54__default.useId();
3649
+ const uid = React55__default.useId();
3655
3650
  const gid = uid.replace(/[^a-zA-Z0-9]/g, "");
3656
3651
  const clipId = `twc-sc-clip-${gid}`;
3657
3652
  const tableId = tableFallback ? `${uid}-table` : void 0;
3658
3653
  const { containerRef, tip, show, hide } = useChartTooltip();
3659
- const [focus, setFocus] = React54__default.useState(null);
3660
- const [selected, setSelected] = React54__default.useState(null);
3661
- const [zoom, setZoom] = React54__default.useState(null);
3662
- const [drag, setDrag] = React54__default.useState(null);
3663
- const svgRef = React54__default.useRef(null);
3664
- const movedRef = React54__default.useRef(false);
3654
+ const [focus, setFocus] = React55__default.useState(null);
3655
+ const [selected, setSelected] = React55__default.useState(null);
3656
+ const [zoom, setZoom] = React55__default.useState(null);
3657
+ const [drag, setDrag] = React55__default.useState(null);
3658
+ const svgRef = React55__default.useRef(null);
3659
+ const movedRef = React55__default.useRef(false);
3665
3660
  const list = Array.isArray(series) ? series : [];
3666
3661
  const vFmt = valueFormat || fmtNumber;
3667
3662
  const xFmt = xFormat || vFmt;
@@ -3834,7 +3829,7 @@ function ScatterChart({
3834
3829
  selectPoint(hit.key);
3835
3830
  }
3836
3831
  };
3837
- React54__default.useEffect(() => {
3832
+ React55__default.useEffect(() => {
3838
3833
  if (!canZoom) return void 0;
3839
3834
  const svg = svgRef.current;
3840
3835
  if (!svg) return void 0;
@@ -4020,11 +4015,11 @@ function RadarChart({
4020
4015
  }) {
4021
4016
  const baseStyles = useScopedStyles("twc-chart-base", CHART_BASE_CSS);
4022
4017
  const styles = useScopedStyles("twc-radarchart-styles", CHART_CSS3);
4023
- const uid = React54__default.useId();
4018
+ const uid = React55__default.useId();
4024
4019
  const tableId = tableFallback ? `${uid}-table` : void 0;
4025
4020
  const { containerRef, tip, show, hide } = useChartTooltip();
4026
- const [focus, setFocus] = React54__default.useState(null);
4027
- const [selected, setSelected] = React54__default.useState(null);
4021
+ const [focus, setFocus] = React55__default.useState(null);
4022
+ const [selected, setSelected] = React55__default.useState(null);
4028
4023
  const rows = data || [];
4029
4024
  const keys = series && series.length ? series : ["value"];
4030
4025
  const fmt = valueFormat || fmtNumber;
@@ -4174,12 +4169,12 @@ function PolarAreaChart({
4174
4169
  }) {
4175
4170
  const baseStyles = useScopedStyles("twc-chart-base", CHART_BASE_CSS);
4176
4171
  const styles = useScopedStyles("twc-polar-styles", CHART_CSS4);
4177
- const uid = React54__default.useId();
4172
+ const uid = React55__default.useId();
4178
4173
  const tableId = tableFallback ? `${uid}-table` : void 0;
4179
4174
  const { containerRef, tip, show, hide } = useChartTooltip();
4180
- const [active, setActive] = React54__default.useState(null);
4181
- const [focus, setFocus] = React54__default.useState(null);
4182
- const [selected, setSelected] = React54__default.useState(null);
4175
+ const [active, setActive] = React55__default.useState(null);
4176
+ const [focus, setFocus] = React55__default.useState(null);
4177
+ const [selected, setSelected] = React55__default.useState(null);
4183
4178
  const rows = data || [];
4184
4179
  const n = rows.length;
4185
4180
  const fmt = valueFormat || fmtNumber;
@@ -4329,15 +4324,15 @@ function Heatmap({
4329
4324
  }) {
4330
4325
  const baseStyles = useScopedStyles("twc-chart-base", CHART_BASE_CSS);
4331
4326
  const styles = useScopedStyles("twc-heatmap-styles", HEATMAP_CSS);
4332
- const uid = React54__default.useId();
4327
+ const uid = React55__default.useId();
4333
4328
  const tableId = tableFallback ? `${uid}-table` : void 0;
4334
4329
  const { containerRef, tip, show, hide } = useChartTooltip();
4335
- const [hovered, setHovered] = React54__default.useState(null);
4336
- const [selected, setSelected] = React54__default.useState(null);
4337
- const [zoom, setZoom] = React54__default.useState(null);
4338
- const [drag, setDrag] = React54__default.useState(null);
4339
- const svgRef = React54__default.useRef(null);
4340
- const movedRef = React54__default.useRef(false);
4330
+ const [hovered, setHovered] = React55__default.useState(null);
4331
+ const [selected, setSelected] = React55__default.useState(null);
4332
+ const [zoom, setZoom] = React55__default.useState(null);
4333
+ const [drag, setDrag] = React55__default.useState(null);
4334
+ const svgRef = React55__default.useRef(null);
4335
+ const movedRef = React55__default.useRef(false);
4341
4336
  const clickable = !!onDataClick;
4342
4337
  const selectMark = (key) => setSelected((s) => s === key ? null : key);
4343
4338
  const rows = Array.isArray(data) ? data : [];
@@ -4500,7 +4495,7 @@ function Heatmap({
4500
4495
  selectMark(cell.key);
4501
4496
  }
4502
4497
  };
4503
- React54__default.useEffect(() => {
4498
+ React55__default.useEffect(() => {
4504
4499
  if (!canZoom) return void 0;
4505
4500
  const svg = svgRef.current;
4506
4501
  if (!svg) return void 0;
@@ -4670,11 +4665,11 @@ function FunnelChart({
4670
4665
  }) {
4671
4666
  const baseStyles = useScopedStyles("twc-chart-base", CHART_BASE_CSS);
4672
4667
  const styles = useScopedStyles("twc-funnel-styles", FUNNEL_CSS);
4673
- const uid = React54__default.useId();
4668
+ const uid = React55__default.useId();
4674
4669
  const tableId = tableFallback ? `${uid}-table` : void 0;
4675
4670
  const { containerRef, tip, show, hide } = useChartTooltip();
4676
- const [active, setActive] = React54__default.useState(null);
4677
- const [selected, setSelected] = React54__default.useState(null);
4671
+ const [active, setActive] = React55__default.useState(null);
4672
+ const [selected, setSelected] = React55__default.useState(null);
4678
4673
  const clickable = !!onDataClick;
4679
4674
  const rows = data || [];
4680
4675
  const n = rows.length;
@@ -4792,11 +4787,11 @@ function Treemap({
4792
4787
  }) {
4793
4788
  const baseStyles = useScopedStyles("twc-chart-base", CHART_BASE_CSS);
4794
4789
  const styles = useScopedStyles("twc-treemap-styles", TREEMAP_CSS);
4795
- const uid = React54__default.useId();
4790
+ const uid = React55__default.useId();
4796
4791
  const tableId = tableFallback ? `${uid}-table` : void 0;
4797
4792
  const { containerRef, tip, show, hide } = useChartTooltip();
4798
- const [hovered, setHovered] = React54__default.useState(null);
4799
- const [selected, setSelected] = React54__default.useState(null);
4793
+ const [hovered, setHovered] = React55__default.useState(null);
4794
+ const [selected, setSelected] = React55__default.useState(null);
4800
4795
  const rows = data || [];
4801
4796
  const fmt = valueFormat || fmtNumber;
4802
4797
  const svgAriaLabel = ariaLabelProp ?? ariaLabel ?? "treemap";
@@ -4954,13 +4949,13 @@ function Candlestick({
4954
4949
  }) {
4955
4950
  const baseStyles = useScopedStyles("twc-chart-base", CHART_BASE_CSS);
4956
4951
  const styles = useScopedStyles("twc-candlestick-styles", CANDLE_CSS);
4957
- const uid = React54__default.useId();
4952
+ const uid = React55__default.useId();
4958
4953
  const tableId = tableFallback ? `${uid}-table` : void 0;
4959
4954
  const { containerRef, tip, show, hide } = useChartTooltip();
4960
- const [selected, setSelected] = React54__default.useState(null);
4961
- const [zoom, setZoom] = React54__default.useState(null);
4962
- const [drag, setDrag] = React54__default.useState(null);
4963
- const svgRef = React54__default.useRef(null);
4955
+ const [selected, setSelected] = React55__default.useState(null);
4956
+ const [zoom, setZoom] = React55__default.useState(null);
4957
+ const [drag, setDrag] = React55__default.useState(null);
4958
+ const svgRef = React55__default.useRef(null);
4964
4959
  const fmt = valueFormat || fmtNumber;
4965
4960
  const clickable = !!onDataClick;
4966
4961
  const allRows = data || [];
@@ -5061,7 +5056,7 @@ function Candlestick({
5061
5056
  clickCandle(rows[idx], baseIdx + idx);
5062
5057
  selectMark(baseIdx + idx);
5063
5058
  };
5064
- React54__default.useEffect(() => {
5059
+ React55__default.useEffect(() => {
5065
5060
  if (!zoomable) return void 0;
5066
5061
  const svg = svgRef.current;
5067
5062
  if (!svg) return void 0;
@@ -5257,13 +5252,13 @@ function Boxplot({
5257
5252
  }) {
5258
5253
  const baseStyles = useScopedStyles("twc-chart-base", CHART_BASE_CSS);
5259
5254
  const styles = useScopedStyles("twc-boxplot-styles", CHART_CSS5);
5260
- const uid = React54__default.useId();
5255
+ const uid = React55__default.useId();
5261
5256
  const tableId = tableFallback ? `${uid}-table` : void 0;
5262
5257
  const { containerRef, tip, show, hide } = useChartTooltip();
5263
- const [selected, setSelected] = React54__default.useState(null);
5264
- const [zoom, setZoom] = React54__default.useState(null);
5265
- const [drag, setDrag] = React54__default.useState(null);
5266
- const svgRef = React54__default.useRef(null);
5258
+ const [selected, setSelected] = React55__default.useState(null);
5259
+ const [zoom, setZoom] = React55__default.useState(null);
5260
+ const [drag, setDrag] = React55__default.useState(null);
5261
+ const svgRef = React55__default.useRef(null);
5267
5262
  const allRows = data || [];
5268
5263
  const baseIdx = zoom ? zoom.s : 0;
5269
5264
  const rows = zoom ? allRows.slice(zoom.s, zoom.e + 1) : allRows;
@@ -5363,7 +5358,7 @@ function Boxplot({
5363
5358
  if (idx == null) return;
5364
5359
  clickBox(rows[idx], idx);
5365
5360
  };
5366
- React54__default.useEffect(() => {
5361
+ React55__default.useEffect(() => {
5367
5362
  if (!zoomable) return void 0;
5368
5363
  const svg = svgRef.current;
5369
5364
  if (!svg) return void 0;
@@ -5524,13 +5519,13 @@ function RangeChart({
5524
5519
  }) {
5525
5520
  const baseStyles = useScopedStyles("twc-chart-base", CHART_BASE_CSS);
5526
5521
  const styles = useScopedStyles("twc-rangechart-styles", RANGE_CSS);
5527
- const uid = React54__default.useId();
5522
+ const uid = React55__default.useId();
5528
5523
  const tableId = tableFallback ? `${uid}-table` : void 0;
5529
5524
  const { containerRef, tip, show, hide } = useChartTooltip();
5530
- const [selected, setSelected] = React54__default.useState(null);
5531
- const [zoom, setZoom] = React54__default.useState(null);
5532
- const [drag, setDrag] = React54__default.useState(null);
5533
- const svgRef = React54__default.useRef(null);
5525
+ const [selected, setSelected] = React55__default.useState(null);
5526
+ const [zoom, setZoom] = React55__default.useState(null);
5527
+ const [drag, setDrag] = React55__default.useState(null);
5528
+ const svgRef = React55__default.useRef(null);
5534
5529
  const isArea = type === "area";
5535
5530
  const clickable = !!onDataClick;
5536
5531
  const fmt = valueFormat || fmtNumber;
@@ -5625,7 +5620,7 @@ function RangeChart({
5625
5620
  if (idx == null) return;
5626
5621
  clickAt(idx);
5627
5622
  };
5628
- React54__default.useEffect(() => {
5623
+ React55__default.useEffect(() => {
5629
5624
  if (!zoomable) return void 0;
5630
5625
  const svg = svgRef.current;
5631
5626
  if (!svg) return void 0;
@@ -5813,7 +5808,25 @@ function RangeChart({
5813
5808
  function labelText7(label) {
5814
5809
  return typeof label === "string" || typeof label === "number" ? String(label) : "";
5815
5810
  }
5816
- function Checkbox({
5811
+ function useMergedRef(...refs) {
5812
+ return React55.useCallback((node) => {
5813
+ const cleanups = [];
5814
+ for (const r2 of refs) {
5815
+ if (typeof r2 === "function") {
5816
+ const cleanup = r2(node);
5817
+ if (typeof cleanup === "function") cleanups.push(cleanup);
5818
+ } else if (r2 && typeof r2 === "object") {
5819
+ r2.current = node;
5820
+ }
5821
+ }
5822
+ if (cleanups.length === 0) return void 0;
5823
+ return () => {
5824
+ for (const r2 of refs) if (r2 && typeof r2 === "object") r2.current = null;
5825
+ for (const cleanup of cleanups) cleanup();
5826
+ };
5827
+ }, refs);
5828
+ }
5829
+ var Checkbox = /* @__PURE__ */ React55__default.forwardRef(function Checkbox2({
5817
5830
  label,
5818
5831
  description,
5819
5832
  error,
@@ -5828,7 +5841,7 @@ function Checkbox({
5828
5841
  className = "",
5829
5842
  onChange,
5830
5843
  ...rest
5831
- }) {
5844
+ }, forwardedRef) {
5832
5845
  const __twcStyles = useScopedStyles("twc-checkbox-styles", `
5833
5846
  .twc-check { display: inline-flex; align-items: flex-start; gap: var(--space-2-5); cursor: pointer; font-family: var(--font-sans); }
5834
5847
  /* tone \u2192 accent set (default primary). Mirrors Button's --_accent model; Badge's tone vocabulary. */
@@ -5869,13 +5882,14 @@ function Checkbox({
5869
5882
  .twc-field { display: flex; flex-direction: column; gap: var(--space-1-5); font-family: var(--font-sans); }
5870
5883
  .twc-field__error { font-size: var(--text-xs); color: var(--color-danger-subtle-fg); font-weight: var(--font-medium); }
5871
5884
  `);
5872
- const autoId = React54__default.useId();
5885
+ const autoId = React55__default.useId();
5873
5886
  const fieldId = id || autoId;
5874
5887
  const errId = `${fieldId}-error`;
5875
5888
  const invalid = Boolean(error);
5876
- const ref = React54__default.useRef(null);
5889
+ const ref = React55__default.useRef(null);
5890
+ const setRef = useMergedRef(ref, forwardedRef);
5877
5891
  const mixed = indeterminate && !checked;
5878
- React54__default.useEffect(() => {
5892
+ React55__default.useEffect(() => {
5879
5893
  if (ref.current) ref.current.indeterminate = mixed;
5880
5894
  }, [mixed]);
5881
5895
  if (process.env.NODE_ENV !== "production" && !label && !description && !rest["aria-label"] && !rest["aria-labelledby"]) {
@@ -5887,7 +5901,7 @@ function Checkbox({
5887
5901
  /* @__PURE__ */ jsx(
5888
5902
  "input",
5889
5903
  {
5890
- ref,
5904
+ ref: setRef,
5891
5905
  id: fieldId,
5892
5906
  type: "checkbox",
5893
5907
  className: "twc-check__input",
@@ -5917,7 +5931,7 @@ function Checkbox({
5917
5931
  control,
5918
5932
  /* @__PURE__ */ jsx("span", { id: errId, className: "twc-field__error", children: error })
5919
5933
  ] });
5920
- }
5934
+ });
5921
5935
  var FIELD_CSS = `
5922
5936
  .twc-field { display: flex; flex-direction: column; gap: var(--space-1-5); font-family: var(--font-sans); }
5923
5937
  .twc-field__label { font-size: var(--text-sm); font-weight: var(--font-semibold); color: var(--color-text); display: flex; gap: 4px; align-items: center; }
@@ -6035,22 +6049,22 @@ function ColorPicker({
6035
6049
  }) {
6036
6050
  const __twcStyles0 = useScopedStyles("twc-field-styles", FIELD_CSS);
6037
6051
  const __twcStyles1 = useScopedStyles("twc-colorpicker-styles", COLORPICKER_CSS);
6038
- const [internal, setInternal] = React54__default.useState(defaultValue);
6052
+ const [internal, setInternal] = React55__default.useState(defaultValue);
6039
6053
  const hex = (value !== void 0 ? value : internal) || "#000000";
6040
6054
  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;
6041
- const lastValidRef = React54__default.useRef(hex);
6055
+ const lastValidRef = React55__default.useRef(hex);
6042
6056
  if (hexRe.test(hex)) lastValidRef.current = hex;
6043
- const [open, setOpen] = React54__default.useState(false);
6044
- const [hsv, setHsv] = React54__default.useState(() => hexToHsv(hex) || { h: 239, s: 60, v: 94, a: 1 });
6045
- const [coords, setCoords] = React54__default.useState(null);
6046
- const wrapRef = React54__default.useRef(null);
6047
- const triggerRef = React54__default.useRef(null);
6048
- const popRef = React54__default.useRef(null);
6049
- const areaRef = React54__default.useRef(null);
6050
- const hueRef = React54__default.useRef(null);
6051
- const alphaRef = React54__default.useRef(null);
6057
+ const [open, setOpen] = React55__default.useState(false);
6058
+ const [hsv, setHsv] = React55__default.useState(() => hexToHsv(hex) || { h: 239, s: 60, v: 94, a: 1 });
6059
+ const [coords, setCoords] = React55__default.useState(null);
6060
+ const wrapRef = React55__default.useRef(null);
6061
+ const triggerRef = React55__default.useRef(null);
6062
+ const popRef = React55__default.useRef(null);
6063
+ const areaRef = React55__default.useRef(null);
6064
+ const hueRef = React55__default.useRef(null);
6065
+ const alphaRef = React55__default.useRef(null);
6052
6066
  const POP_W = 240;
6053
- const place = React54__default.useCallback(() => {
6067
+ const place = React55__default.useCallback(() => {
6054
6068
  const el = triggerRef.current;
6055
6069
  if (!el) return;
6056
6070
  const r2 = el.getBoundingClientRect();
@@ -6061,7 +6075,7 @@ function ColorPicker({
6061
6075
  left = Math.max(8, left);
6062
6076
  setCoords({ left, top: flip ? void 0 : Math.round(r2.bottom + 6), bottom: flip ? Math.round(vh - r2.top + 6) : void 0 });
6063
6077
  }, []);
6064
- React54__default.useEffect(() => {
6078
+ React55__default.useEffect(() => {
6065
6079
  if (!open) return void 0;
6066
6080
  place();
6067
6081
  const onMove = () => place();
@@ -6079,17 +6093,17 @@ function ColorPicker({
6079
6093
  ro?.disconnect();
6080
6094
  };
6081
6095
  }, [open, place]);
6082
- const labelId = React54__default.useId();
6096
+ const labelId = React55__default.useId();
6083
6097
  const descId = `${labelId}-desc`;
6084
6098
  const invalid = Boolean(error);
6085
- React54__default.useEffect(() => {
6099
+ React55__default.useEffect(() => {
6086
6100
  if (disabled) setOpen(false);
6087
6101
  }, [disabled]);
6088
- React54__default.useEffect(() => {
6102
+ React55__default.useEffect(() => {
6089
6103
  const v = hexToHsv(hex);
6090
6104
  if (v && hsvToHex(v.h, v.s, v.v).toLowerCase() !== hsvToHex(hsv.h, hsv.s, hsv.v).toLowerCase()) setHsv(v);
6091
6105
  }, [hex]);
6092
- React54__default.useEffect(() => {
6106
+ React55__default.useEffect(() => {
6093
6107
  if (!open) return;
6094
6108
  const onDown = (e) => {
6095
6109
  if (wrapRef.current && wrapRef.current.contains(e.target)) return;
@@ -6439,7 +6453,7 @@ function ensureVisible(list, el) {
6439
6453
  if (top < list.scrollTop) list.scrollTop = top - 4;
6440
6454
  else if (bottom > list.scrollTop + list.clientHeight) list.scrollTop = bottom - list.clientHeight + 4;
6441
6455
  }
6442
- function Combobox({
6456
+ var Combobox = /* @__PURE__ */ React55__default.forwardRef(function Combobox2({
6443
6457
  label,
6444
6458
  hint,
6445
6459
  error,
@@ -6472,38 +6486,39 @@ function Combobox({
6472
6486
  onFocus,
6473
6487
  onKeyDown,
6474
6488
  ...rest
6475
- }) {
6489
+ }, ref) {
6476
6490
  const __twcStyles = useScopedStyles("twc-combo-styles", COMBO_CSS);
6477
6491
  if (virtualizedProp && (wrapOptions || renderOption)) warnOnce("combobox-var-height-virtualized", "twico-ui Combobox: `wrapOptions`/`renderOption` disable `virtualized` \u2014 those rows aren't a fixed height.");
6478
6492
  const virtualized = virtualizedProp && !wrapOptions && !renderOption;
6479
- const groups = React54__default.useMemo(() => normalizeGroups(options), [options]);
6480
- const flat = React54__default.useMemo(() => groups.flatMap((g) => g.options), [groups]);
6481
- const autoId = React54__default.useId();
6493
+ const groups = React55__default.useMemo(() => normalizeGroups(options), [options]);
6494
+ const flat = React55__default.useMemo(() => groups.flatMap((g) => g.options), [groups]);
6495
+ const autoId = React55__default.useId();
6482
6496
  const fieldId = id || autoId;
6483
- const [internal, setInternal] = React54__default.useState(defaultValue);
6497
+ const [internal, setInternal] = React55__default.useState(defaultValue);
6484
6498
  const current = value !== void 0 ? value : internal;
6485
6499
  const selected = flat.find((o) => o.value === current);
6486
- const [open, setOpen] = React54__default.useState(false);
6487
- const [query, setQuery] = React54__default.useState("");
6488
- const [active, setActive] = React54__default.useState(0);
6489
- const [coords, setCoords] = React54__default.useState(null);
6490
- const [scrollTop, setScrollTop] = React54__default.useState(0);
6491
- const [listH, setListH] = React54__default.useState(260);
6492
- const wrapRef = React54__default.useRef(null);
6493
- const controlRef = React54__default.useRef(null);
6494
- const inputRef = React54__default.useRef(null);
6495
- const popRef = React54__default.useRef(null);
6496
- const listRef = React54__default.useRef(null);
6497
- const activeRef = React54__default.useRef(null);
6498
- const fGroups = React54__default.useMemo(() => {
6500
+ const [open, setOpen] = React55__default.useState(false);
6501
+ const [query, setQuery] = React55__default.useState("");
6502
+ const [active, setActive] = React55__default.useState(0);
6503
+ const [coords, setCoords] = React55__default.useState(null);
6504
+ const [scrollTop, setScrollTop] = React55__default.useState(0);
6505
+ const [listH, setListH] = React55__default.useState(260);
6506
+ const wrapRef = React55__default.useRef(null);
6507
+ const controlRef = React55__default.useRef(null);
6508
+ const inputRef = React55__default.useRef(null);
6509
+ const setInputRef = useMergedRef(inputRef, ref);
6510
+ const popRef = React55__default.useRef(null);
6511
+ const listRef = React55__default.useRef(null);
6512
+ const activeRef = React55__default.useRef(null);
6513
+ const fGroups = React55__default.useMemo(() => {
6499
6514
  const q = query.trim();
6500
6515
  const fn = filter === false ? null : typeof filter === "function" ? filter : matches;
6501
6516
  return groups.map((g) => ({ group: g.group, options: fn ? g.options.filter((o) => fn(o, q)) : g.options })).filter((g) => g.options.length);
6502
6517
  }, [groups, query, filter]);
6503
- const visible = React54__default.useMemo(() => fGroups.flatMap((g) => g.options), [fGroups]);
6504
- const rowH = React54__default.useMemo(() => visible.some((o) => o.description) ? 48 : 36, [visible]);
6518
+ const visible = React55__default.useMemo(() => fGroups.flatMap((g) => g.options), [fGroups]);
6519
+ const rowH = React55__default.useMemo(() => visible.some((o) => o.description) ? 48 : 36, [visible]);
6505
6520
  const GROUP_H = 30;
6506
- const { rows, totalH } = React54__default.useMemo(() => {
6521
+ const { rows, totalH } = React55__default.useMemo(() => {
6507
6522
  if (!virtualized) return { rows: [], totalH: 0 };
6508
6523
  const rows2 = [];
6509
6524
  let off = 0;
@@ -6529,7 +6544,7 @@ function Combobox({
6529
6544
  }
6530
6545
  return from;
6531
6546
  };
6532
- const place = React54__default.useCallback(() => {
6547
+ const place = React55__default.useCallback(() => {
6533
6548
  const el = controlRef.current;
6534
6549
  if (!el) return;
6535
6550
  const r2 = el.getBoundingClientRect();
@@ -6544,7 +6559,7 @@ function Combobox({
6544
6559
  flip
6545
6560
  });
6546
6561
  }, [placement, minWidth]);
6547
- React54__default.useEffect(() => {
6562
+ React55__default.useEffect(() => {
6548
6563
  if (!open || !portal) return;
6549
6564
  place();
6550
6565
  const onMove = () => place();
@@ -6562,7 +6577,7 @@ function Combobox({
6562
6577
  ro?.disconnect();
6563
6578
  };
6564
6579
  }, [open, portal, place]);
6565
- React54__default.useEffect(() => {
6580
+ React55__default.useEffect(() => {
6566
6581
  if (!open) return;
6567
6582
  const onDown = (e) => {
6568
6583
  if (wrapRef.current && wrapRef.current.contains(e.target)) return;
@@ -6572,33 +6587,33 @@ function Combobox({
6572
6587
  document.addEventListener("mousedown", onDown);
6573
6588
  return () => document.removeEventListener("mousedown", onDown);
6574
6589
  }, [open]);
6575
- React54__default.useEffect(() => {
6590
+ React55__default.useEffect(() => {
6576
6591
  setActive(0);
6577
6592
  }, [query]);
6578
- React54__default.useEffect(() => {
6593
+ React55__default.useEffect(() => {
6579
6594
  if (visible.length === 0) return;
6580
6595
  setActive((a) => Math.min(a, visible.length - 1));
6581
6596
  }, [visible.length]);
6582
- const onOpenChangeRef = React54__default.useRef(onOpenChange);
6597
+ const onOpenChangeRef = React55__default.useRef(onOpenChange);
6583
6598
  onOpenChangeRef.current = onOpenChange;
6584
- const prevOpenRef = React54__default.useRef(open);
6585
- React54__default.useEffect(() => {
6599
+ const prevOpenRef = React55__default.useRef(open);
6600
+ React55__default.useEffect(() => {
6586
6601
  if (prevOpenRef.current !== open) {
6587
6602
  prevOpenRef.current = open;
6588
6603
  onOpenChangeRef.current?.(open);
6589
6604
  }
6590
6605
  }, [open]);
6591
- React54__default.useEffect(() => {
6606
+ React55__default.useEffect(() => {
6592
6607
  if (!open) return;
6593
6608
  const idx = visible.findIndex((o) => o.value === current);
6594
6609
  setActive(idx >= 0 ? idx : 0);
6595
6610
  }, [open]);
6596
- React54__default.useEffect(() => {
6611
+ React55__default.useEffect(() => {
6597
6612
  if (!open || !virtualized) return;
6598
6613
  const el = listRef.current;
6599
6614
  if (el && el.clientHeight) setListH(el.clientHeight);
6600
6615
  }, [open, virtualized]);
6601
- React54__default.useEffect(() => {
6616
+ React55__default.useEffect(() => {
6602
6617
  if (!open) return;
6603
6618
  if (!virtualized) {
6604
6619
  ensureVisible(listRef.current, activeRef.current);
@@ -6727,7 +6742,7 @@ function Combobox({
6727
6742
  /* @__PURE__ */ jsx("div", { className: "twc-pop__group", role: "presentation", children: r2.label }, `g${r2.gi}`)
6728
6743
  ) : renderRow(r2.o, r2.idx)),
6729
6744
  vBottom > 0 ? /* @__PURE__ */ jsx("div", { "aria-hidden": "true", style: { height: vBottom } }) : null
6730
- ] }) : fGroups.map((g, gi) => /* @__PURE__ */ jsxs(React54__default.Fragment, { children: [
6745
+ ] }) : fGroups.map((g, gi) => /* @__PURE__ */ jsxs(React55__default.Fragment, { children: [
6731
6746
  g.group ? /* @__PURE__ */ jsx("div", { className: "twc-pop__group", role: "presentation", children: g.group }) : null,
6732
6747
  g.options.map((o) => {
6733
6748
  counter += 1;
@@ -6785,7 +6800,7 @@ function Combobox({
6785
6800
  /* @__PURE__ */ jsx(
6786
6801
  "input",
6787
6802
  {
6788
- ref: inputRef,
6803
+ ref: setInputRef,
6789
6804
  id: fieldId,
6790
6805
  className: "twc-cb__input",
6791
6806
  role: "combobox",
@@ -6840,7 +6855,7 @@ function Combobox({
6840
6855
  ] }),
6841
6856
  error ? /* @__PURE__ */ jsx("span", { id: descId, className: "twc-field__error", children: error }) : hint ? /* @__PURE__ */ jsx("span", { id: descId, className: "twc-field__hint", children: hint }) : null
6842
6857
  ] });
6843
- }
6858
+ });
6844
6859
  var COMMAND_CSS = `
6845
6860
  .twc-cmdk__overlay { position: fixed; inset: 0; z-index: var(--z-modal); background: var(--color-overlay); backdrop-filter: blur(3px);
6846
6861
  display: flex; align-items: flex-start; justify-content: center; padding-top: 12vh; }
@@ -6891,14 +6906,14 @@ function CommandPalette({
6891
6906
  }) {
6892
6907
  const __twcStyles = useScopedStyles("twc-cmdk-styles", COMMAND_CSS);
6893
6908
  const renderPortal = usePortal();
6894
- const [query, setQuery] = React54__default.useState("");
6895
- const [active, setActive] = React54__default.useState(0);
6896
- const inputRef = React54__default.useRef(null);
6897
- const listRef = React54__default.useRef(null);
6898
- const paletteRef = React54__default.useRef(null);
6899
- const baseId = React54__default.useId();
6900
- const [mounted, setMounted] = React54__default.useState(open);
6901
- React54__default.useEffect(() => {
6909
+ const [query, setQuery] = React55__default.useState("");
6910
+ const [active, setActive] = React55__default.useState(0);
6911
+ const inputRef = React55__default.useRef(null);
6912
+ const listRef = React55__default.useRef(null);
6913
+ const paletteRef = React55__default.useRef(null);
6914
+ const baseId = React55__default.useId();
6915
+ const [mounted, setMounted] = React55__default.useState(open);
6916
+ React55__default.useEffect(() => {
6902
6917
  if (open) {
6903
6918
  setMounted(true);
6904
6919
  return;
@@ -6907,7 +6922,7 @@ function CommandPalette({
6907
6922
  return () => clearTimeout(t);
6908
6923
  }, [open]);
6909
6924
  useScrollLock(open);
6910
- React54__default.useEffect(() => {
6925
+ React55__default.useEffect(() => {
6911
6926
  if (open) {
6912
6927
  setQuery("");
6913
6928
  setActive(0);
@@ -6915,7 +6930,7 @@ function CommandPalette({
6915
6930
  }, [open]);
6916
6931
  useFocusTrap(paletteRef, open && mounted);
6917
6932
  const isTop = useLayer(open && mounted);
6918
- React54__default.useEffect(() => {
6933
+ React55__default.useEffect(() => {
6919
6934
  if (!open) return void 0;
6920
6935
  const onKey = (e) => {
6921
6936
  if (e.defaultPrevented || !isTop()) return;
@@ -6928,7 +6943,7 @@ function CommandPalette({
6928
6943
  return () => document.removeEventListener("keydown", onKey);
6929
6944
  }, [open, onClose, isTop]);
6930
6945
  const q = query.trim().toLowerCase();
6931
- const filtered = React54__default.useMemo(() => commands.filter(
6946
+ const filtered = React55__default.useMemo(() => commands.filter(
6932
6947
  (c) => !q || c.label.toLowerCase().includes(q) || (c.keywords || "").toLowerCase().includes(q) || (c.group || "").toLowerCase().includes(q)
6933
6948
  ), [commands, q]);
6934
6949
  const groups = [];
@@ -6943,7 +6958,7 @@ function CommandPalette({
6943
6958
  g.items.push(c);
6944
6959
  flat.push(c);
6945
6960
  });
6946
- React54__default.useEffect(() => {
6961
+ React55__default.useEffect(() => {
6947
6962
  setActive(0);
6948
6963
  }, [query]);
6949
6964
  const run = (cmd) => {
@@ -6963,7 +6978,7 @@ function CommandPalette({
6963
6978
  if (cmd) run(cmd);
6964
6979
  }
6965
6980
  }
6966
- React54__default.useEffect(() => {
6981
+ React55__default.useEffect(() => {
6967
6982
  const node = listRef.current?.querySelector('[data-active="true"]');
6968
6983
  if (node) node.scrollIntoView({ block: "nearest" });
6969
6984
  }, [active]);
@@ -7153,13 +7168,13 @@ function Currency({
7153
7168
  const prec = precision != null ? precision : meta.precision;
7154
7169
  const sym = symbol != null ? symbol : meta.symbol;
7155
7170
  const cur = code != null ? code : meta.code;
7156
- const autoId = React54__default.useId();
7171
+ const autoId = React55__default.useId();
7157
7172
  const fieldId = id || autoId;
7158
7173
  const invalid = Boolean(error);
7159
7174
  const controlled = value !== void 0;
7160
- const [internal, setInternal] = React54__default.useState(() => clampPrecision(String(defaultValue ?? ""), prec));
7175
+ const [internal, setInternal] = React55__default.useState(() => clampPrecision(String(defaultValue ?? ""), prec));
7161
7176
  const shown = controlled ? clampPrecision(String(value ?? ""), prec) : internal;
7162
- React54__default.useEffect(() => {
7177
+ React55__default.useEffect(() => {
7163
7178
  if (!controlled) return;
7164
7179
  const raw = String(value ?? "");
7165
7180
  if (shown !== raw) {
@@ -7167,7 +7182,7 @@ function Currency({
7167
7182
  onValueChange?.(shown === "" || Number.isNaN(n) ? null : n, shown);
7168
7183
  }
7169
7184
  }, [controlled, shown, value]);
7170
- React54__default.useEffect(() => {
7185
+ React55__default.useEffect(() => {
7171
7186
  if (controlled) return;
7172
7187
  const next = clampPrecision(internal, prec);
7173
7188
  if (next === internal) return;
@@ -7226,8 +7241,8 @@ function Currency({
7226
7241
  ] });
7227
7242
  }
7228
7243
  function useFallbackName(ref, hasOwnName) {
7229
- const [needsFallback, setNeedsFallback] = React54__default.useState(false);
7230
- const useIso2 = typeof document !== "undefined" ? React54__default.useLayoutEffect : React54__default.useEffect;
7244
+ const [needsFallback, setNeedsFallback] = React55__default.useState(false);
7245
+ const useIso2 = typeof document !== "undefined" ? React55__default.useLayoutEffect : React55__default.useEffect;
7231
7246
  useIso2(() => {
7232
7247
  if (hasOwnName) {
7233
7248
  setNeedsFallback(false);
@@ -7354,7 +7369,7 @@ function ensureVisible2(list, el) {
7354
7369
  if (top < list.scrollTop) list.scrollTop = top - 4;
7355
7370
  else if (bottom > list.scrollTop + list.clientHeight) list.scrollTop = bottom - list.clientHeight + 4;
7356
7371
  }
7357
- function Select({
7372
+ var Select = /* @__PURE__ */ React55__default.forwardRef(function Select2({
7358
7373
  label,
7359
7374
  hint,
7360
7375
  error,
@@ -7385,46 +7400,47 @@ function Select({
7385
7400
  onClick,
7386
7401
  onKeyDown,
7387
7402
  ...rest
7388
- }) {
7403
+ }, ref) {
7389
7404
  const __twcStyles = useScopedStyles("twc-select-styles", SELECT_CSS);
7390
7405
  if (virtualizedProp && renderOption) warnOnce("select-renderoption-virtualized", "twico-ui Select: `renderOption` disables `virtualized` \u2014 custom rows aren't a fixed height.");
7391
7406
  const virtualized = virtualizedProp && !renderOption;
7392
- const bufferRef = React54__default.useRef("");
7393
- const bufferTimerRef = React54__default.useRef(null);
7394
- const groups = React54__default.useMemo(() => normalizeGroups2(options), [options]);
7395
- const flat = React54__default.useMemo(() => groups.flatMap((g) => g.options), [groups]);
7396
- const autoId = React54__default.useId();
7407
+ const bufferRef = React55__default.useRef("");
7408
+ const bufferTimerRef = React55__default.useRef(null);
7409
+ const groups = React55__default.useMemo(() => normalizeGroups2(options), [options]);
7410
+ const flat = React55__default.useMemo(() => groups.flatMap((g) => g.options), [groups]);
7411
+ const autoId = React55__default.useId();
7397
7412
  const fieldId = id || autoId;
7398
- const [internal, setInternal] = React54__default.useState(defaultValue);
7413
+ const [internal, setInternal] = React55__default.useState(defaultValue);
7399
7414
  const current = value !== void 0 ? value : internal;
7400
- const [open, setOpen] = React54__default.useState(false);
7401
- const [render, setRender] = React54__default.useState(false);
7402
- const [active, setActive] = React54__default.useState(0);
7403
- const [coords, setCoords] = React54__default.useState(null);
7404
- const [query, setQuery] = React54__default.useState("");
7405
- const [scrollTop, setScrollTop] = React54__default.useState(0);
7406
- const [listH, setListH] = React54__default.useState(260);
7407
- const wrapRef = React54__default.useRef(null);
7408
- const triggerRef = React54__default.useRef(null);
7409
- const popRef = React54__default.useRef(null);
7410
- const listRef = React54__default.useRef(null);
7411
- const activeRef = React54__default.useRef(null);
7412
- const searchRef = React54__default.useRef(null);
7415
+ const [open, setOpen] = React55__default.useState(false);
7416
+ const [render, setRender] = React55__default.useState(false);
7417
+ const [active, setActive] = React55__default.useState(0);
7418
+ const [coords, setCoords] = React55__default.useState(null);
7419
+ const [query, setQuery] = React55__default.useState("");
7420
+ const [scrollTop, setScrollTop] = React55__default.useState(0);
7421
+ const [listH, setListH] = React55__default.useState(260);
7422
+ const wrapRef = React55__default.useRef(null);
7423
+ const triggerRef = React55__default.useRef(null);
7424
+ const setTriggerRef = useMergedRef(triggerRef, ref);
7425
+ const popRef = React55__default.useRef(null);
7426
+ const listRef = React55__default.useRef(null);
7427
+ const activeRef = React55__default.useRef(null);
7428
+ const searchRef = React55__default.useRef(null);
7413
7429
  const showSearch = searchable === void 0 ? flat.length > 5 : searchable;
7414
- const fGroupsLive = React54__default.useMemo(() => {
7430
+ const fGroupsLive = React55__default.useMemo(() => {
7415
7431
  const q = query.trim().toLowerCase();
7416
7432
  if (!q) return groups;
7417
7433
  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);
7418
7434
  }, [groups, query]);
7419
- const fGroupsFrozen = React54__default.useRef(fGroupsLive);
7420
- React54__default.useEffect(() => {
7435
+ const fGroupsFrozen = React55__default.useRef(fGroupsLive);
7436
+ React55__default.useEffect(() => {
7421
7437
  if (open) fGroupsFrozen.current = fGroupsLive;
7422
7438
  }, [open, fGroupsLive]);
7423
7439
  const fGroups = open ? fGroupsLive : fGroupsFrozen.current;
7424
- const visible = React54__default.useMemo(() => fGroups.flatMap((g) => g.options), [fGroups]);
7425
- const rowH = React54__default.useMemo(() => visible.some((o) => o.description) ? 48 : 36, [visible]);
7440
+ const visible = React55__default.useMemo(() => fGroups.flatMap((g) => g.options), [fGroups]);
7441
+ const rowH = React55__default.useMemo(() => visible.some((o) => o.description) ? 48 : 36, [visible]);
7426
7442
  const GROUP_H = 30;
7427
- const { rows, totalH } = React54__default.useMemo(() => {
7443
+ const { rows, totalH } = React55__default.useMemo(() => {
7428
7444
  if (!virtualized) return { rows: [], totalH: 0 };
7429
7445
  const rows2 = [];
7430
7446
  let off = 0;
@@ -7451,7 +7467,7 @@ function Select({
7451
7467
  }
7452
7468
  return from;
7453
7469
  };
7454
- const place = React54__default.useCallback(() => {
7470
+ const place = React55__default.useCallback(() => {
7455
7471
  const el = triggerRef.current;
7456
7472
  if (!el) return;
7457
7473
  const r2 = el.getBoundingClientRect();
@@ -7467,7 +7483,7 @@ function Select({
7467
7483
  flip
7468
7484
  });
7469
7485
  }, [placement, minWidth, matchTriggerWidth]);
7470
- React54__default.useEffect(() => {
7486
+ React55__default.useEffect(() => {
7471
7487
  if (!open || !portal) return;
7472
7488
  place();
7473
7489
  const onMove = () => place();
@@ -7485,7 +7501,7 @@ function Select({
7485
7501
  ro?.disconnect();
7486
7502
  };
7487
7503
  }, [open, portal, place]);
7488
- React54__default.useEffect(() => {
7504
+ React55__default.useEffect(() => {
7489
7505
  if (!open) return;
7490
7506
  const idx = flat.findIndex((o) => o.value === current);
7491
7507
  setActive(idx >= 0 ? idx : 0);
@@ -7500,19 +7516,19 @@ function Select({
7500
7516
  document.addEventListener("mousedown", onDown);
7501
7517
  return () => document.removeEventListener("mousedown", onDown);
7502
7518
  }, [open]);
7503
- React54__default.useEffect(() => {
7519
+ React55__default.useEffect(() => {
7504
7520
  setActive(0);
7505
7521
  }, [query]);
7506
- React54__default.useEffect(() => {
7522
+ React55__default.useEffect(() => {
7507
7523
  if (visible.length === 0) return;
7508
7524
  setActive((a) => Math.min(a, visible.length - 1));
7509
7525
  }, [visible.length]);
7510
- React54__default.useEffect(() => {
7526
+ React55__default.useEffect(() => {
7511
7527
  if (!open || !virtualized) return;
7512
7528
  const el = listRef.current;
7513
7529
  if (el && el.clientHeight) setListH(el.clientHeight);
7514
7530
  }, [open, virtualized, render]);
7515
- React54__default.useEffect(() => {
7531
+ React55__default.useEffect(() => {
7516
7532
  if (!open) return;
7517
7533
  if (!virtualized) {
7518
7534
  ensureVisible2(listRef.current, activeRef.current);
@@ -7529,7 +7545,7 @@ function Select({
7529
7545
  if (next !== el.scrollTop) el.scrollTop = next;
7530
7546
  setScrollTop(next);
7531
7547
  }, [active, open, virtualized, rows, listH]);
7532
- React54__default.useEffect(() => {
7548
+ React55__default.useEffect(() => {
7533
7549
  if (open) {
7534
7550
  setRender(true);
7535
7551
  return;
@@ -7538,8 +7554,8 @@ function Select({
7538
7554
  const t = setTimeout(() => setRender(false), 170);
7539
7555
  return () => clearTimeout(t);
7540
7556
  }, [open]);
7541
- const prevOpen = React54__default.useRef(false);
7542
- React54__default.useEffect(() => {
7557
+ const prevOpen = React55__default.useRef(false);
7558
+ React55__default.useEffect(() => {
7543
7559
  if (prevOpen.current && !open) {
7544
7560
  const ae = typeof document !== "undefined" ? document.activeElement : null;
7545
7561
  if (popRef.current && ae && popRef.current.contains(ae)) triggerRef.current?.focus();
@@ -7692,7 +7708,7 @@ function Select({
7692
7708
  /* @__PURE__ */ jsx("div", { className: "twc-pop__group", role: "presentation", children: r2.label }, `g${r2.gi}`)
7693
7709
  ) : renderRow(r2.o, r2.idx)),
7694
7710
  vBottom > 0 ? /* @__PURE__ */ jsx("div", { "aria-hidden": "true", style: { height: vBottom } }) : null
7695
- ] }) : fGroups.map((g, gi) => /* @__PURE__ */ jsxs(React54__default.Fragment, { children: [
7711
+ ] }) : fGroups.map((g, gi) => /* @__PURE__ */ jsxs(React55__default.Fragment, { children: [
7696
7712
  g.group ? /* @__PURE__ */ jsx("div", { className: "twc-pop__group", role: "presentation", children: g.group }) : null,
7697
7713
  g.options.map((o) => {
7698
7714
  counter += 1;
@@ -7739,7 +7755,7 @@ function Select({
7739
7755
  {
7740
7756
  type: "button",
7741
7757
  id: fieldId,
7742
- ref: triggerRef,
7758
+ ref: setTriggerRef,
7743
7759
  className: "twc-sel__trigger",
7744
7760
  "data-size": size,
7745
7761
  "data-tone": tone,
@@ -7777,7 +7793,7 @@ function Select({
7777
7793
  ] }),
7778
7794
  error ? /* @__PURE__ */ jsx("span", { id: descId, className: "twc-field__error", children: error }) : hint ? /* @__PURE__ */ jsx("span", { id: descId, className: "twc-field__hint", children: hint }) : null
7779
7795
  ] });
7780
- }
7796
+ });
7781
7797
  var CURF_CSS = `
7782
7798
  /* Shared input shell (self-contained \u2014 CurrencyField must not depend on the
7783
7799
  Currency component being rendered on the same page to get these styles). */
@@ -7854,21 +7870,21 @@ function CurrencyField({
7854
7870
  ...rest
7855
7871
  }) {
7856
7872
  const __twcStyles = useScopedStyles("twc-curf-styles", CURF_CSS);
7857
- const autoId = React54__default.useId();
7873
+ const autoId = React55__default.useId();
7858
7874
  const fieldId = id || autoId;
7859
7875
  const invalid = Boolean(error);
7860
7876
  const curControlled = currency !== void 0;
7861
- const [curInternal, setCurInternal] = React54__default.useState(defaultCurrency);
7877
+ const [curInternal, setCurInternal] = React55__default.useState(defaultCurrency);
7862
7878
  const cur = curControlled ? currency : curInternal;
7863
7879
  const meta = CURRENCIES[cur] || CURRENCIES.USD;
7864
7880
  const prec = meta.precision;
7865
7881
  const valControlled = value !== void 0;
7866
- const [valInternal, setValInternal] = React54__default.useState(() => clampPrecision(String(defaultValue ?? ""), prec));
7882
+ const [valInternal, setValInternal] = React55__default.useState(() => clampPrecision(String(defaultValue ?? ""), prec));
7867
7883
  const shown = valControlled ? clampPrecision(String(value ?? ""), prec) : valInternal;
7868
7884
  const descId = `${fieldId}-desc`;
7869
7885
  const describedBy = [error || hint ? descId : null, rest["aria-describedby"]].filter(Boolean).join(" ") || void 0;
7870
7886
  const ariaInvalid = invalid ? true : rest["aria-invalid"] ?? void 0;
7871
- React54__default.useEffect(() => {
7887
+ React55__default.useEffect(() => {
7872
7888
  if (!valControlled) {
7873
7889
  const clamped = clampPrecision(valInternal, prec);
7874
7890
  if (clamped !== valInternal) {
@@ -7884,7 +7900,7 @@ function CurrencyField({
7884
7900
  }
7885
7901
  }
7886
7902
  }, [prec, cur, shown, value, valControlled, valInternal]);
7887
- const options = React54__default.useMemo(() => {
7903
+ const options = React55__default.useMemo(() => {
7888
7904
  if (!currencies) return CURRENCY_OPTIONS;
7889
7905
  return currencies.map((c) => typeof c === "string" ? { value: c, label: `${c} \u2014 ${(CURRENCIES[c] || {}).label || c}` } : c);
7890
7906
  }, [currencies]);
@@ -8032,7 +8048,7 @@ var INPUT_EXTRA_CSS = `
8032
8048
  .twc-field__count { margin-inline-start: auto; font-size: var(--text-xs); color: var(--color-text-muted); font-variant-numeric: tabular-nums; flex: none; }
8033
8049
  .twc-field__count[data-danger="true"] { color: var(--color-danger-subtle-fg); }
8034
8050
  `;
8035
- function Input({
8051
+ var Input = /* @__PURE__ */ React55__default.forwardRef(function Input2({
8036
8052
  label,
8037
8053
  hint,
8038
8054
  error,
@@ -8050,16 +8066,16 @@ function Input({
8050
8066
  id,
8051
8067
  className = "",
8052
8068
  ...rest
8053
- }) {
8069
+ }, ref) {
8054
8070
  const __twcStyles = useScopedStyles("twc-field-styles", FIELD_CSS2);
8055
8071
  const __twcExtra = useScopedStyles("twc-input-extra-styles", INPUT_EXTRA_CSS);
8056
- const autoId = React54__default.useId();
8072
+ const autoId = React55__default.useId();
8057
8073
  const fieldId = id || autoId;
8058
8074
  const descId = `${fieldId}-desc`;
8059
8075
  const countId = `${fieldId}-count`;
8060
8076
  const invalid = Boolean(error);
8061
8077
  const countControlled = rest.value !== void 0;
8062
- const [len2, setLen] = React54__default.useState(() => String(rest.defaultValue ?? "").length);
8078
+ const [len2, setLen] = React55__default.useState(() => String(rest.defaultValue ?? "").length);
8063
8079
  const count = countControlled ? String(rest.value ?? "").length : len2;
8064
8080
  const max = rest.maxLength;
8065
8081
  const showCounter = showCount && max != null;
@@ -8068,13 +8084,20 @@ function Input({
8068
8084
  rest.onChange?.(e);
8069
8085
  if ((showCount || clearable) && !countControlled) setLen(e.target.value.length);
8070
8086
  };
8071
- const inputRef = React54__default.useRef(null);
8072
- const userRef = rest.ref;
8073
- const setRef = React54__default.useCallback((node) => {
8087
+ const inputRef = React55__default.useRef(null);
8088
+ const setRef = React55__default.useCallback((node) => {
8074
8089
  inputRef.current = node;
8075
- if (typeof userRef === "function") userRef(node);
8076
- else if (userRef && typeof userRef === "object") userRef.current = node;
8077
- }, [userRef]);
8090
+ if (typeof ref === "function") {
8091
+ const cleanup = ref(node);
8092
+ if (typeof cleanup === "function") return () => {
8093
+ inputRef.current = null;
8094
+ cleanup();
8095
+ };
8096
+ } else if (ref && typeof ref === "object") {
8097
+ ref.current = node;
8098
+ }
8099
+ return void 0;
8100
+ }, [ref]);
8078
8101
  const clearField = () => {
8079
8102
  const el = inputRef.current;
8080
8103
  if (!el) return;
@@ -8088,7 +8111,7 @@ function Input({
8088
8111
  const ariaInvalid = invalid ? true : rest["aria-invalid"] ?? void 0;
8089
8112
  const describedBy = [error || hint ? descId : null, showCounter ? countId : null, rest["aria-describedby"]].filter(Boolean).join(" ") || void 0;
8090
8113
  const isPassword = type === "password";
8091
- const [revealed, setRevealed] = React54__default.useState(false);
8114
+ const [revealed, setRevealed] = React55__default.useState(false);
8092
8115
  const effectiveType = isPassword && revealed ? "text" : type;
8093
8116
  const suffix = rightIcon ? /* @__PURE__ */ jsx("span", { className: "twc-input__affix", children: rightIcon }) : isPassword ? /* @__PURE__ */ jsx(
8094
8117
  "button",
@@ -8153,7 +8176,7 @@ function Input({
8153
8176
  ] }) : null
8154
8177
  ] }) : null
8155
8178
  ] });
8156
- }
8179
+ });
8157
8180
  var MULTI_CSS = `
8158
8181
  .twc-field { display: flex; flex-direction: column; gap: var(--space-1-5); font-family: var(--font-sans); }
8159
8182
  .twc-field__label { font-size: var(--text-sm); font-weight: var(--font-semibold); color: var(--color-text); display: flex; gap: 4px; align-items: center; }
@@ -8270,7 +8293,7 @@ function ensureVisible3(list, el) {
8270
8293
  if (top < list.scrollTop) list.scrollTop = top - 4;
8271
8294
  else if (bottom > list.scrollTop + list.clientHeight) list.scrollTop = bottom - list.clientHeight + 4;
8272
8295
  }
8273
- function MultiSelect({
8296
+ var MultiSelect = /* @__PURE__ */ React55__default.forwardRef(function MultiSelect2({
8274
8297
  label,
8275
8298
  hint,
8276
8299
  error,
@@ -8302,37 +8325,38 @@ function MultiSelect({
8302
8325
  onFocus,
8303
8326
  onKeyDown,
8304
8327
  ...rest
8305
- }) {
8328
+ }, ref) {
8306
8329
  const __twcStyles = useScopedStyles("twc-ms-styles", MULTI_CSS);
8307
8330
  if (virtualizedProp && renderOption) warnOnce("multiselect-renderoption-virtualized", "twico-ui MultiSelect: `renderOption` disables `virtualized` \u2014 custom rows aren't a fixed height.");
8308
8331
  const virtualized = virtualizedProp && !renderOption;
8309
- const groups = React54__default.useMemo(() => normalizeGroups3(options), [options]);
8310
- const flat = React54__default.useMemo(() => groups.flatMap((g) => g.options), [groups]);
8311
- const autoId = React54__default.useId();
8332
+ const groups = React55__default.useMemo(() => normalizeGroups3(options), [options]);
8333
+ const flat = React55__default.useMemo(() => groups.flatMap((g) => g.options), [groups]);
8334
+ const autoId = React55__default.useId();
8312
8335
  const fieldId = id || autoId;
8313
- const [internal, setInternal] = React54__default.useState(defaultValue);
8336
+ const [internal, setInternal] = React55__default.useState(defaultValue);
8314
8337
  const selected = value !== void 0 ? value : internal;
8315
- const [open, setOpen] = React54__default.useState(false);
8316
- const [query, setQuery] = React54__default.useState("");
8317
- const [active, setActive] = React54__default.useState(0);
8318
- const [coords, setCoords] = React54__default.useState(null);
8319
- const [scrollTop, setScrollTop] = React54__default.useState(0);
8320
- const [listH, setListH] = React54__default.useState(260);
8321
- const wrapRef = React54__default.useRef(null);
8322
- const controlRef = React54__default.useRef(null);
8323
- const inputRef = React54__default.useRef(null);
8324
- const popRef = React54__default.useRef(null);
8325
- const listRef = React54__default.useRef(null);
8326
- const activeRef = React54__default.useRef(null);
8327
- const fGroups = React54__default.useMemo(() => {
8338
+ const [open, setOpen] = React55__default.useState(false);
8339
+ const [query, setQuery] = React55__default.useState("");
8340
+ const [active, setActive] = React55__default.useState(0);
8341
+ const [coords, setCoords] = React55__default.useState(null);
8342
+ const [scrollTop, setScrollTop] = React55__default.useState(0);
8343
+ const [listH, setListH] = React55__default.useState(260);
8344
+ const wrapRef = React55__default.useRef(null);
8345
+ const controlRef = React55__default.useRef(null);
8346
+ const inputRef = React55__default.useRef(null);
8347
+ const setInputRef = useMergedRef(inputRef, ref);
8348
+ const popRef = React55__default.useRef(null);
8349
+ const listRef = React55__default.useRef(null);
8350
+ const activeRef = React55__default.useRef(null);
8351
+ const fGroups = React55__default.useMemo(() => {
8328
8352
  const q = query.trim();
8329
8353
  const fn = filter === false ? null : typeof filter === "function" ? filter : matches2;
8330
8354
  return groups.map((g) => ({ group: g.group, options: fn ? g.options.filter((o) => fn(o, q)) : g.options })).filter((g) => g.options.length);
8331
8355
  }, [groups, query, filter]);
8332
- const visible = React54__default.useMemo(() => fGroups.flatMap((g) => g.options), [fGroups]);
8333
- const rowH = React54__default.useMemo(() => visible.some((o) => o.description) ? 48 : 36, [visible]);
8356
+ const visible = React55__default.useMemo(() => fGroups.flatMap((g) => g.options), [fGroups]);
8357
+ const rowH = React55__default.useMemo(() => visible.some((o) => o.description) ? 48 : 36, [visible]);
8334
8358
  const GROUP_H = 30;
8335
- const { rows, totalH } = React54__default.useMemo(() => {
8359
+ const { rows, totalH } = React55__default.useMemo(() => {
8336
8360
  if (!virtualized) return { rows: [], totalH: 0 };
8337
8361
  const rows2 = [];
8338
8362
  let off = 0;
@@ -8360,7 +8384,7 @@ function MultiSelect({
8360
8384
  }
8361
8385
  return from;
8362
8386
  };
8363
- const place = React54__default.useCallback(() => {
8387
+ const place = React55__default.useCallback(() => {
8364
8388
  const el = controlRef.current;
8365
8389
  if (!el) return;
8366
8390
  const r2 = el.getBoundingClientRect();
@@ -8375,7 +8399,7 @@ function MultiSelect({
8375
8399
  flip
8376
8400
  });
8377
8401
  }, [placement, minWidth]);
8378
- React54__default.useEffect(() => {
8402
+ React55__default.useEffect(() => {
8379
8403
  if (!open || !portal) return;
8380
8404
  place();
8381
8405
  const onMove = () => place();
@@ -8393,7 +8417,7 @@ function MultiSelect({
8393
8417
  ro?.disconnect();
8394
8418
  };
8395
8419
  }, [open, portal, place]);
8396
- React54__default.useEffect(() => {
8420
+ React55__default.useEffect(() => {
8397
8421
  if (!open) return;
8398
8422
  const onDown = (e) => {
8399
8423
  if (wrapRef.current && wrapRef.current.contains(e.target)) return;
@@ -8404,19 +8428,19 @@ function MultiSelect({
8404
8428
  document.addEventListener("mousedown", onDown);
8405
8429
  return () => document.removeEventListener("mousedown", onDown);
8406
8430
  }, [open]);
8407
- React54__default.useEffect(() => {
8431
+ React55__default.useEffect(() => {
8408
8432
  setActive(0);
8409
8433
  }, [query]);
8410
- React54__default.useEffect(() => {
8434
+ React55__default.useEffect(() => {
8411
8435
  if (visible.length === 0) return;
8412
8436
  setActive((a) => Math.min(a, visible.length - 1));
8413
8437
  }, [visible.length]);
8414
- React54__default.useEffect(() => {
8438
+ React55__default.useEffect(() => {
8415
8439
  if (!open || !virtualized) return;
8416
8440
  const el = listRef.current;
8417
8441
  if (el && el.clientHeight) setListH(el.clientHeight);
8418
8442
  }, [open, virtualized]);
8419
- React54__default.useEffect(() => {
8443
+ React55__default.useEffect(() => {
8420
8444
  if (!open) return;
8421
8445
  if (!virtualized) {
8422
8446
  ensureVisible3(listRef.current, activeRef.current);
@@ -8540,7 +8564,7 @@ function MultiSelect({
8540
8564
  /* @__PURE__ */ jsx("div", { className: "twc-pop__group", role: "presentation", children: r2.label }, `g${r2.gi}`)
8541
8565
  ) : renderRow(r2.o, r2.idx)),
8542
8566
  vBottom > 0 ? /* @__PURE__ */ jsx("div", { "aria-hidden": "true", style: { height: vBottom } }) : null
8543
- ] }) : fGroups.map((g, gi) => /* @__PURE__ */ jsxs(React54__default.Fragment, { children: [
8567
+ ] }) : fGroups.map((g, gi) => /* @__PURE__ */ jsxs(React55__default.Fragment, { children: [
8544
8568
  g.group ? /* @__PURE__ */ jsx("div", { className: "twc-pop__group", role: "presentation", children: g.group }) : null,
8545
8569
  g.options.map((o) => {
8546
8570
  counter += 1;
@@ -8613,7 +8637,7 @@ function MultiSelect({
8613
8637
  /* @__PURE__ */ jsx(
8614
8638
  "input",
8615
8639
  {
8616
- ref: inputRef,
8640
+ ref: setInputRef,
8617
8641
  id: fieldId,
8618
8642
  className: "twc-ms__input",
8619
8643
  role: "combobox",
@@ -8672,7 +8696,7 @@ function MultiSelect({
8672
8696
  ] }),
8673
8697
  error ? /* @__PURE__ */ jsx("span", { id: descId, className: "twc-field__error", children: error }) : hint ? /* @__PURE__ */ jsx("span", { id: descId, className: "twc-field__hint", children: hint }) : null
8674
8698
  ] });
8675
- }
8699
+ });
8676
8700
  var PAGINATION_CSS = `
8677
8701
  .twc-pagination { display: inline-flex; align-items: center; gap: 4px; font-family: var(--font-sans); }
8678
8702
  .twc-page {
@@ -8747,7 +8771,7 @@ function Pagination({
8747
8771
  }
8748
8772
  const jumperEnabled = showPageJumper ?? showJumper;
8749
8773
  const __twcStyles = useScopedStyles("twc-pagination-styles", PAGINATION_CSS);
8750
- const [internal, setInternal] = React54__default.useState(defaultPage);
8774
+ const [internal, setInternal] = React55__default.useState(defaultPage);
8751
8775
  const page = pageProp !== void 0 ? pageProp : internal;
8752
8776
  const pages = buildPages(page, total, siblings, boundaries);
8753
8777
  const go = (p) => {
@@ -8755,7 +8779,7 @@ function Pagination({
8755
8779
  if (pageProp === void 0) setInternal(p);
8756
8780
  onChange?.(p);
8757
8781
  };
8758
- const [jump, setJump] = React54__default.useState("");
8782
+ const [jump, setJump] = React55__default.useState("");
8759
8783
  const submitJump = () => {
8760
8784
  const n = parseInt(jump, 10);
8761
8785
  if (!Number.isNaN(n)) go(Math.min(Math.max(n, 1), total));
@@ -9513,6 +9537,12 @@ th.twc-dt__rownum .twc-dt__th-inner { padding-inline: 8px; gap: 2px; justify-con
9513
9537
  .twc-dt__batch-x:hover { background: color-mix(in srgb, var(--color-primary) 20%, transparent); }
9514
9538
  .twc-dt__batch-x svg { width: 16px; height: 16px; }
9515
9539
  .twc-dt__batch-count { font-size: var(--text-sm); font-weight: var(--font-bold); color: var(--color-primary-subtle-fg); white-space: nowrap; }
9540
+ /* #492: the host's running total, sitting with the count it qualifies. Same colour as the count,
9541
+ differentiated by WEIGHT rather than by a lighter token: this bar is --color-primary-subtle, and
9542
+ --color-text-subtle on that is 4.26:1, under the 4.5:1 needed for normal text. */
9543
+ .twc-dt__batch-summary { display: inline-flex; align-items: center; gap: 6px; font-size: var(--text-sm);
9544
+ color: var(--color-primary-subtle-fg); white-space: nowrap; }
9545
+ .twc-dt__batch-summary::before { content: ""; width: var(--border-thin); height: 14px; background: currentColor; opacity: 0.35; }
9516
9546
  .twc-dt__batch-actions { margin-inline-start: auto; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
9517
9547
  .twc-dt__batch-btn { display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 12px;
9518
9548
  border: var(--border-thin) solid var(--color-border); border-radius: var(--radius-md); background: var(--color-surface);
@@ -9632,27 +9662,27 @@ function renderCombined(srcCols, row, cfg) {
9632
9662
  const v = getColVal(sc, row);
9633
9663
  if (v == null || v === "") return;
9634
9664
  const disp = sc.valueFormatter ? sc.valueFormatter(v, row) : v;
9635
- const label = cfg.labels ? React54__default.createElement("span", { className: "twc-dt__combine-label" }, colLabel(sc) + ": ") : null;
9636
- if (count > 0 && cfg.layout !== "stack") nodes.push(React54__default.createElement("span", { key: "sep" + idx, className: "twc-dt__combine-sep", "aria-hidden": "true" }, cfg.separator));
9637
- nodes.push(React54__default.createElement("span", { key: idx, className: "twc-dt__combine-item" }, label, disp));
9665
+ const label = cfg.labels ? React55__default.createElement("span", { className: "twc-dt__combine-label" }, colLabel(sc) + ": ") : null;
9666
+ if (count > 0 && cfg.layout !== "stack") nodes.push(React55__default.createElement("span", { key: "sep" + idx, className: "twc-dt__combine-sep", "aria-hidden": "true" }, cfg.separator));
9667
+ nodes.push(React55__default.createElement("span", { key: idx, className: "twc-dt__combine-item" }, label, disp));
9638
9668
  count++;
9639
9669
  });
9640
9670
  if (!nodes.length) return "";
9641
- return React54__default.createElement("span", { className: cfg.layout === "stack" ? "twc-dt__combine twc-dt__combine--stack" : "twc-dt__combine" }, nodes);
9671
+ return React55__default.createElement("span", { className: cfg.layout === "stack" ? "twc-dt__combine twc-dt__combine--stack" : "twc-dt__combine" }, nodes);
9642
9672
  }
9643
9673
  var diffValueNode = (col, v, row) => col.renderCell ? col.renderCell(v, row) : col.valueFormatter ? col.valueFormatter(v, row) : v == null ? "" : v;
9644
9674
  function renderDiffCell(col, val, row) {
9645
9675
  const meta = row && row.__diffMeta;
9646
9676
  if (!meta) return diffValueNode(col, val, row);
9647
- if (meta.op === "removed") return React54__default.createElement("span", { className: "twc-dt__diff-old" }, diffValueNode(col, getColVal(col, meta.from), meta.from));
9648
- if (meta.op === "added") return React54__default.createElement("span", { className: "twc-dt__diff-new" }, diffValueNode(col, getColVal(col, meta.to), meta.to));
9677
+ if (meta.op === "removed") return React55__default.createElement("span", { className: "twc-dt__diff-old" }, diffValueNode(col, getColVal(col, meta.from), meta.from));
9678
+ if (meta.op === "added") return React55__default.createElement("span", { className: "twc-dt__diff-new" }, diffValueNode(col, getColVal(col, meta.to), meta.to));
9649
9679
  if (meta.op === "modified" && meta.changed.has(col.field)) {
9650
- return React54__default.createElement(
9680
+ return React55__default.createElement(
9651
9681
  "span",
9652
9682
  { className: "twc-dt__diff-change" },
9653
- React54__default.createElement("span", { className: "twc-dt__diff-old" }, diffValueNode(col, getColVal(col, meta.from), meta.from)),
9654
- React54__default.createElement("span", { className: "twc-dt__diff-arrow", "aria-hidden": "true" }, "\u2192"),
9655
- React54__default.createElement("span", { className: "twc-dt__diff-new" }, diffValueNode(col, getColVal(col, meta.to), meta.to))
9683
+ React55__default.createElement("span", { className: "twc-dt__diff-old" }, diffValueNode(col, getColVal(col, meta.from), meta.from)),
9684
+ React55__default.createElement("span", { className: "twc-dt__diff-arrow", "aria-hidden": "true" }, "\u2192"),
9685
+ React55__default.createElement("span", { className: "twc-dt__diff-new" }, diffValueNode(col, getColVal(col, meta.to), meta.to))
9656
9686
  );
9657
9687
  }
9658
9688
  return diffValueNode(col, val, row);
@@ -9669,7 +9699,7 @@ var DIFF_OP_COLUMN = {
9669
9699
  resizable: true,
9670
9700
  wrappable: false,
9671
9701
  hideable: false,
9672
- renderCell: (v) => v && DIFF_OPS[v] ? React54__default.createElement(Badge, { size: "sm", variant: "soft", tone: DIFF_OPS[v].tone }, DIFF_OPS[v].label) : null,
9702
+ renderCell: (v) => v && DIFF_OPS[v] ? React55__default.createElement(Badge, { size: "sm", variant: "soft", tone: DIFF_OPS[v].tone }, DIFF_OPS[v].label) : null,
9673
9703
  exportValue: (v) => v && DIFF_OPS[v] ? DIFF_OPS[v].label : ""
9674
9704
  };
9675
9705
  function testFilter(raw, op, target, type) {
@@ -9742,9 +9772,9 @@ function runDatatableQuery(rows, query, options = {}) {
9742
9772
  return { rows: page, total, filtered: out };
9743
9773
  }
9744
9774
  function useFloating() {
9745
- const [pos, setPos] = React54__default.useState(null);
9746
- const cfg = React54__default.useRef(null);
9747
- const place = React54__default.useCallback(() => {
9775
+ const [pos, setPos] = React55__default.useState(null);
9776
+ const cfg = React55__default.useRef(null);
9777
+ const place = React55__default.useCallback(() => {
9748
9778
  const c = cfg.current;
9749
9779
  if (!c || !c.el || !c.el.isConnected) return null;
9750
9780
  const r2 = c.el.getBoundingClientRect();
@@ -9755,17 +9785,17 @@ function useFloating() {
9755
9785
  const top = r2.bottom + 6;
9756
9786
  return { top, left, width: c.width, anchorX: r2.left + r2.width / 2, maxHeight: Math.max(180, vh - top - M) };
9757
9787
  }, []);
9758
- const open = React54__default.useCallback((el, align = "left", width = 220) => {
9788
+ const open = React55__default.useCallback((el, align = "left", width = 220) => {
9759
9789
  cfg.current = { el, align, width };
9760
9790
  const p = place();
9761
9791
  if (p) setPos(p);
9762
9792
  }, [place]);
9763
- const close = React54__default.useCallback(() => {
9793
+ const close = React55__default.useCallback(() => {
9764
9794
  cfg.current = null;
9765
9795
  setPos(null);
9766
9796
  }, []);
9767
9797
  const isOpen = pos != null;
9768
- React54__default.useEffect(() => {
9798
+ React55__default.useEffect(() => {
9769
9799
  if (!isOpen) return void 0;
9770
9800
  const update = () => {
9771
9801
  const p = place();
@@ -9789,11 +9819,11 @@ function Caret({ pos }) {
9789
9819
  return /* @__PURE__ */ jsx("span", { className: "twc-dt__caret", style: { left } });
9790
9820
  }
9791
9821
  function AsyncFilterValue({ col, value, onChange }) {
9792
- const [opts, setOpts] = React54__default.useState([]);
9793
- const [loading, setLoading] = React54__default.useState(false);
9794
- const reqRef = React54__default.useRef(0);
9795
- const debRef = React54__default.useRef();
9796
- const load = React54__default.useCallback((query) => {
9822
+ const [opts, setOpts] = React55__default.useState([]);
9823
+ const [loading, setLoading] = React55__default.useState(false);
9824
+ const reqRef = React55__default.useRef(0);
9825
+ const debRef = React55__default.useRef();
9826
+ const load = React55__default.useCallback((query) => {
9797
9827
  const id = ++reqRef.current;
9798
9828
  setLoading(true);
9799
9829
  Promise.resolve(col.loadValueOptions(query)).then(
@@ -9808,16 +9838,16 @@ function AsyncFilterValue({ col, value, onChange }) {
9808
9838
  }
9809
9839
  );
9810
9840
  }, [col]);
9811
- React54__default.useEffect(() => {
9841
+ React55__default.useEffect(() => {
9812
9842
  load("");
9813
9843
  return () => clearTimeout(debRef.current);
9814
9844
  }, [load]);
9815
- const onInput = React54__default.useCallback((q) => {
9845
+ const onInput = React55__default.useCallback((q) => {
9816
9846
  clearTimeout(debRef.current);
9817
9847
  debRef.current = setTimeout(() => load(q), 250);
9818
9848
  }, [load]);
9819
9849
  const selected = Array.isArray(value) ? value : [];
9820
- const merged = React54__default.useMemo(() => {
9850
+ const merged = React55__default.useMemo(() => {
9821
9851
  const seen2 = new Set(opts.map((o) => o.value));
9822
9852
  return [...selected.filter((v) => !seen2.has(v)).map((v) => ({ value: v, label: String(v) })), ...opts];
9823
9853
  }, [opts, selected]);
@@ -9836,9 +9866,9 @@ function AsyncFilterValue({ col, value, onChange }) {
9836
9866
  );
9837
9867
  }
9838
9868
  function EditCell({ col, value, options, onChange, onCommit, onCommitValue, onCancel, onKeyDown }) {
9839
- const ref = React54__default.useRef(null);
9869
+ const ref = React55__default.useRef(null);
9840
9870
  const isSelect = col.editType === "select" || options && col.editType !== "text";
9841
- React54__default.useEffect(() => {
9871
+ React55__default.useEffect(() => {
9842
9872
  if (isSelect) {
9843
9873
  const t = setTimeout(() => ref.current?.querySelector(".twc-sel__trigger")?.click(), 0);
9844
9874
  return () => clearTimeout(t);
@@ -10013,6 +10043,7 @@ function Datatable({
10013
10043
  onColumnVisibilityChange,
10014
10044
  batchActions = [],
10015
10045
  onRowSelectionChange,
10046
+ selectionSummary,
10016
10047
  getRowStyle,
10017
10048
  getRowClassName,
10018
10049
  showExport = false,
@@ -10103,21 +10134,21 @@ function Datatable({
10103
10134
  }) {
10104
10135
  const __twcStyles = useScopedStyles("twc-dt-styles", DT_CSS);
10105
10136
  const isDiff = !!diff;
10106
- const [diffOnly, setDiffOnly] = React54__default.useState(diff && diff.onlyChanged !== void 0 ? diff.onlyChanged : true);
10137
+ const [diffOnly, setDiffOnly] = React55__default.useState(diff && diff.onlyChanged !== void 0 ? diff.onlyChanged : true);
10107
10138
  const diffRowKey = diff && diff.rowKey || rowKeyProp || ((r2) => r2 == null ? r2 : r2.id);
10108
- const diffData = React54__default.useMemo(
10139
+ const diffData = React55__default.useMemo(
10109
10140
  () => isDiff ? classifyDiff(diff.from || [], diff.to || [], columnsProp, diffRowKey, { moveDetection: diff.moveDetection, compare: diff.compare }) : null,
10110
10141
  [isDiff, diff, columnsProp]
10111
10142
  // eslint-disable-line react-hooks/exhaustive-deps
10112
10143
  );
10113
- const onClassifiedRef = React54__default.useRef(diff && diff.onClassified);
10144
+ const onClassifiedRef = React55__default.useRef(diff && diff.onClassified);
10114
10145
  onClassifiedRef.current = diff && diff.onClassified;
10115
- React54__default.useEffect(() => {
10146
+ React55__default.useEffect(() => {
10116
10147
  if (diffData && onClassifiedRef.current) onClassifiedRef.current(diffData.counts);
10117
10148
  }, [diffData]);
10118
- const diffRowKeyFn = React54__default.useCallback((r2) => r2.__diffKey, []);
10119
- const [userCombine, setUserCombine] = React54__default.useState({});
10120
- const columns = React54__default.useMemo(
10149
+ const diffRowKeyFn = React55__default.useCallback((r2) => r2.__diffKey, []);
10150
+ const [userCombine, setUserCombine] = React55__default.useState({});
10151
+ const columns = React55__default.useMemo(
10121
10152
  () => {
10122
10153
  if (!isDiff) return columnsProp;
10123
10154
  const byField = {};
@@ -10130,12 +10161,12 @@ function Datatable({
10130
10161
  },
10131
10162
  [isDiff, columnsProp, userCombine]
10132
10163
  );
10133
- const rows = React54__default.useMemo(
10164
+ const rows = React55__default.useMemo(
10134
10165
  () => isDiff ? diffData.rows.filter((r2) => !diffOnly || r2.op !== "unchanged").map((r2) => ({ ...r2.to || r2.from, __diffop: r2.op, __diffMeta: r2, __diffKey: r2.key })) : rowsProp,
10135
10166
  [isDiff, diffData, diffOnly, rowsProp]
10136
10167
  );
10137
10168
  const rowKey = isDiff ? diffRowKeyFn : rowKeyProp;
10138
- const cols = React54__default.useMemo(() => {
10169
+ const cols = React55__default.useMemo(() => {
10139
10170
  const seenFields = /* @__PURE__ */ new Map();
10140
10171
  for (const c of columns) {
10141
10172
  if (!c || c.field == null) continue;
@@ -10203,9 +10234,9 @@ function Datatable({
10203
10234
  }
10204
10235
  return out;
10205
10236
  }, [columns, rowPinning, userCombine, defaultColumn]);
10206
- const _autoKey = React54__default.useRef();
10237
+ const _autoKey = React55__default.useRef();
10207
10238
  if (!_autoKey.current) _autoKey.current = { map: /* @__PURE__ */ new WeakMap(), n: 0 };
10208
- const keyOf = React54__default.useCallback(rowKey || ((r2, i) => {
10239
+ const keyOf = React55__default.useCallback(rowKey || ((r2, i) => {
10209
10240
  if (r2 != null && r2.id != null) return r2.id;
10210
10241
  if (r2 != null && typeof r2 === "object") {
10211
10242
  const m = _autoKey.current.map;
@@ -10218,19 +10249,19 @@ function Datatable({
10218
10249
  }
10219
10250
  return i;
10220
10251
  }), [rowKey]);
10221
- const [sort, setSort] = React54__default.useState(null);
10222
- const [filters, setFilters] = React54__default.useState([]);
10252
+ const [sort, setSort] = React55__default.useState(null);
10253
+ const [filters, setFilters] = React55__default.useState([]);
10223
10254
  const filterLogicControlled = filterLogicProp !== void 0;
10224
- const [filterLogicInternal, setFilterLogicInternal] = React54__default.useState(defaultFilterLogic === "or" ? "or" : "and");
10255
+ const [filterLogicInternal, setFilterLogicInternal] = React55__default.useState(defaultFilterLogic === "or" ? "or" : "and");
10225
10256
  const filterLogic = filterLogicControlled ? filterLogicProp === "or" ? "or" : "and" : filterLogicInternal;
10226
10257
  const setFilterLogic = (next) => {
10227
10258
  const v = next === "or" ? "or" : "and";
10228
10259
  if (!filterLogicControlled) setFilterLogicInternal(v);
10229
10260
  onFilterLogicChange?.(v);
10230
10261
  };
10231
- const [hidden, setHidden] = React54__default.useState(() => /* @__PURE__ */ new Set());
10232
- const [showRowNum, setShowRowNum] = React54__default.useState(rowNumbers);
10233
- const [wrapped, setWrapped] = React54__default.useState(() => new Set((columns || []).filter((c) => c.wrapText).map((c) => c.field)));
10262
+ const [hidden, setHidden] = React55__default.useState(() => /* @__PURE__ */ new Set());
10263
+ const [showRowNum, setShowRowNum] = React55__default.useState(rowNumbers);
10264
+ const [wrapped, setWrapped] = React55__default.useState(() => new Set((columns || []).filter((c) => c.wrapText).map((c) => c.field)));
10234
10265
  const toggleWrap = (field) => setWrapped((w) => {
10235
10266
  const n = new Set(w);
10236
10267
  n.has(field) ? n.delete(field) : n.add(field);
@@ -10272,7 +10303,7 @@ function Datatable({
10272
10303
  });
10273
10304
  closeCombineEditor();
10274
10305
  };
10275
- const [pins, setPins] = React54__default.useState(() => {
10306
+ const [pins, setPins] = React55__default.useState(() => {
10276
10307
  const left = [], right = [];
10277
10308
  columns.forEach((c) => {
10278
10309
  if (c.pinned === "left") left.push(c.field);
@@ -10280,23 +10311,23 @@ function Datatable({
10280
10311
  });
10281
10312
  return { left, right };
10282
10313
  });
10283
- const [density, setDensity] = React54__default.useState(densityProp);
10284
- const [internalQuick, setInternalQuick] = React54__default.useState("");
10314
+ const [density, setDensity] = React55__default.useState(densityProp);
10315
+ const [internalQuick, setInternalQuick] = React55__default.useState("");
10285
10316
  const quick = quickFilter !== void 0 ? quickFilter : internalQuick;
10286
10317
  const commitQuick = (v) => {
10287
10318
  onQuickFilterChange?.(v);
10288
10319
  if (quickFilter === void 0) setInternalQuick(v);
10289
10320
  commitPage(0);
10290
10321
  };
10291
- const [selected, setSelected] = React54__default.useState(() => /* @__PURE__ */ new Set());
10292
- const [activeRow, setActiveRow] = React54__default.useState(null);
10322
+ const [selected, setSelected] = React55__default.useState(() => /* @__PURE__ */ new Set());
10323
+ const [activeRow, setActiveRow] = React55__default.useState(null);
10293
10324
  const activeRowControlled = activeRowId !== void 0;
10294
10325
  const activeRowVal = activeRowControlled ? activeRowId : activeRow;
10295
- const [internalActiveCell, setInternalActiveCell] = React54__default.useState(null);
10326
+ const [internalActiveCell, setInternalActiveCell] = React55__default.useState(null);
10296
10327
  const activeCellControlled = activeCell !== void 0;
10297
10328
  const activeCellVal = activeCellControlled ? activeCell : internalActiveCell;
10298
- const selfCellSigRef = React54__default.useRef(null);
10299
- const jumpAppliedRef = React54__default.useRef(null);
10329
+ const selfCellSigRef = React55__default.useRef(null);
10330
+ const jumpAppliedRef = React55__default.useRef(null);
10300
10331
  const commitActiveCell = (next) => {
10301
10332
  const sig = next ? next.key + "\0" + next.field : null;
10302
10333
  selfCellSigRef.current = sig;
@@ -10304,10 +10335,10 @@ function Datatable({
10304
10335
  onActiveCellChange?.(next);
10305
10336
  if (!activeCellControlled) setInternalActiveCell(next);
10306
10337
  };
10307
- const [anchorCell, setAnchorCell] = React54__default.useState(null);
10308
- const gridId = React54__default.useId();
10309
- const [internalPage, setInternalPage] = React54__default.useState(0);
10310
- const [internalRpp, setInternalRpp] = React54__default.useState(pageSize > 0 ? pageSize : 10);
10338
+ const [anchorCell, setAnchorCell] = React55__default.useState(null);
10339
+ const gridId = React55__default.useId();
10340
+ const [internalPage, setInternalPage] = React55__default.useState(0);
10341
+ const [internalRpp, setInternalRpp] = React55__default.useState(pageSize > 0 ? pageSize : 10);
10311
10342
  const pageControlled = page !== void 0;
10312
10343
  const pageSizeControlled = onPageSizeChange !== void 0;
10313
10344
  const pageVal = pageControlled ? page : internalPage;
@@ -10321,42 +10352,42 @@ function Datatable({
10321
10352
  if (!pageSizeControlled) setInternalRpp(next);
10322
10353
  commitPage(0);
10323
10354
  };
10324
- const [colQuery, setColQuery] = React54__default.useState("");
10325
- const [widths, setWidths] = React54__default.useState({});
10326
- const [order, setOrder] = React54__default.useState(() => columns.map((c) => c.field));
10327
- const [drag, setDrag] = React54__default.useState({ from: null, over: null, after: false });
10328
- const [aggOn, setAggOn] = React54__default.useState(showAggregation);
10329
- const [focus, setFocus] = React54__default.useState({ r: 0, c: 0 });
10330
- const [interacting, setInteracting] = React54__default.useState(null);
10331
- const gridRef = React54__default.useRef(null);
10332
- const [groupBy, setGroupBy] = React54__default.useState(rowGrouping || []);
10333
- const [internalCollapsed, setInternalCollapsed] = React54__default.useState(() => new Set(defaultCollapsedGroups));
10355
+ const [colQuery, setColQuery] = React55__default.useState("");
10356
+ const [widths, setWidths] = React55__default.useState({});
10357
+ const [order, setOrder] = React55__default.useState(() => columns.map((c) => c.field));
10358
+ const [drag, setDrag] = React55__default.useState({ from: null, over: null, after: false });
10359
+ const [aggOn, setAggOn] = React55__default.useState(showAggregation);
10360
+ const [focus, setFocus] = React55__default.useState({ r: 0, c: 0 });
10361
+ const [interacting, setInteracting] = React55__default.useState(null);
10362
+ const gridRef = React55__default.useRef(null);
10363
+ const [groupBy, setGroupBy] = React55__default.useState(rowGrouping || []);
10364
+ const [internalCollapsed, setInternalCollapsed] = React55__default.useState(() => new Set(defaultCollapsedGroups));
10334
10365
  const collapsedControlled = collapsedGroups !== void 0;
10335
- const collapsedSet = React54__default.useMemo(() => new Set(collapsedControlled ? collapsedGroups : internalCollapsed), [collapsedControlled, collapsedGroups, internalCollapsed]);
10336
- const collapsedKey = React54__default.useMemo(() => [...collapsedSet].sort().join("\0"), [collapsedSet]);
10337
- const [internalExpanded, setInternalExpanded] = React54__default.useState(() => /* @__PURE__ */ new Set());
10366
+ const collapsedSet = React55__default.useMemo(() => new Set(collapsedControlled ? collapsedGroups : internalCollapsed), [collapsedControlled, collapsedGroups, internalCollapsed]);
10367
+ const collapsedKey = React55__default.useMemo(() => [...collapsedSet].sort().join("\0"), [collapsedSet]);
10368
+ const [internalExpanded, setInternalExpanded] = React55__default.useState(() => /* @__PURE__ */ new Set());
10338
10369
  const expandControlled = expandedRowIds !== void 0;
10339
- const expandedSet = React54__default.useMemo(
10370
+ const expandedSet = React55__default.useMemo(
10340
10371
  () => new Set(expandControlled ? expandedRowIds : internalExpanded),
10341
10372
  [expandControlled, expandedRowIds, internalExpanded]
10342
10373
  );
10343
- const expandedKey = React54__default.useMemo(() => JSON.stringify([...expandedSet].sort()), [expandedSet]);
10344
- const [pinnedRows, setPinnedRows] = React54__default.useState({ top: [], bottom: [] });
10345
- const [headH, setHeadH] = React54__default.useState(41);
10346
- const theadRef = React54__default.useRef(null);
10347
- const [rowOrder, setRowOrder] = React54__default.useState(null);
10348
- React54__default.useEffect(() => {
10374
+ const expandedKey = React55__default.useMemo(() => JSON.stringify([...expandedSet].sort()), [expandedSet]);
10375
+ const [pinnedRows, setPinnedRows] = React55__default.useState({ top: [], bottom: [] });
10376
+ const [headH, setHeadH] = React55__default.useState(41);
10377
+ const theadRef = React55__default.useRef(null);
10378
+ const [rowOrder, setRowOrder] = React55__default.useState(null);
10379
+ React55__default.useEffect(() => {
10349
10380
  if (serverMode) setRowOrder(null);
10350
10381
  }, [rows, serverMode]);
10351
- const [rowHeights, setRowHeights] = React54__default.useState({});
10352
- const [rowDrag, setRowDrag] = React54__default.useState({ from: null, over: null, after: false });
10353
- const [rowGrab, setRowGrab] = React54__default.useState(null);
10354
- const [reorderMsg, setReorderMsg] = React54__default.useState("");
10355
- const rowFocusRef = React54__default.useRef(null);
10356
- const [fWidths, setFWidths] = React54__default.useState({});
10357
- const [fPanelSize, setFPanelSize] = React54__default.useState(null);
10358
- const [batchNameW, setBatchNameW] = React54__default.useState(null);
10359
- const [popSizes, setPopSizes] = React54__default.useState({});
10382
+ const [rowHeights, setRowHeights] = React55__default.useState({});
10383
+ const [rowDrag, setRowDrag] = React55__default.useState({ from: null, over: null, after: false });
10384
+ const [rowGrab, setRowGrab] = React55__default.useState(null);
10385
+ const [reorderMsg, setReorderMsg] = React55__default.useState("");
10386
+ const rowFocusRef = React55__default.useRef(null);
10387
+ const [fWidths, setFWidths] = React55__default.useState({});
10388
+ const [fPanelSize, setFPanelSize] = React55__default.useState(null);
10389
+ const [batchNameW, setBatchNameW] = React55__default.useState(null);
10390
+ const [popSizes, setPopSizes] = React55__default.useState({});
10360
10391
  const serializeState = () => ({
10361
10392
  filters: filters.map(({ id, ...f }) => f),
10362
10393
  // strip the internal row id
@@ -10441,11 +10472,11 @@ function Datatable({
10441
10472
  if (Array.isArray(s.grouping)) setGroupBy(s.grouping.filter((f) => known.has(f)));
10442
10473
  if (Array.isArray(s.collapsedGroups) && !collapsedControlled) setInternalCollapsed(new Set(s.collapsedGroups.filter((k) => typeof k === "string")));
10443
10474
  };
10444
- const stateReadyRef = React54__default.useRef(false);
10445
- const stateRestoredRef = React54__default.useRef(false);
10446
- const onStateChangeRef = React54__default.useRef(onStateChange);
10475
+ const stateReadyRef = React55__default.useRef(false);
10476
+ const stateRestoredRef = React55__default.useRef(false);
10477
+ const onStateChangeRef = React55__default.useRef(onStateChange);
10447
10478
  onStateChangeRef.current = onStateChange;
10448
- React54__default.useEffect(() => {
10479
+ React55__default.useEffect(() => {
10449
10480
  if (!stateReadyRef.current) return void 0;
10450
10481
  if (!stateKey && !onStateChange) return void 0;
10451
10482
  const state = serializeState();
@@ -10471,7 +10502,7 @@ function Datatable({
10471
10502
  if (saved) applyState(saved);
10472
10503
  stateRestoredRef.current = true;
10473
10504
  };
10474
- React54__default.useEffect(() => {
10505
+ React55__default.useEffect(() => {
10475
10506
  if (columns.length) {
10476
10507
  restoreState();
10477
10508
  stateReadyRef.current = true;
@@ -10480,14 +10511,14 @@ function Datatable({
10480
10511
  stateReadyRef.current = false;
10481
10512
  };
10482
10513
  }, []);
10483
- React54__default.useEffect(() => {
10514
+ React55__default.useEffect(() => {
10484
10515
  if (stateRestoredRef.current || !columns.length) return;
10485
10516
  restoreState();
10486
10517
  stateReadyRef.current = true;
10487
10518
  }, [columns.length]);
10488
- const rootRef = React54__default.useRef(null);
10489
- const [compact, setCompact] = React54__default.useState(false);
10490
- React54__default.useEffect(() => {
10519
+ const rootRef = React55__default.useRef(null);
10520
+ const [compact, setCompact] = React55__default.useState(false);
10521
+ React55__default.useEffect(() => {
10491
10522
  const el = rootRef.current;
10492
10523
  if (!el) return void 0;
10493
10524
  const measure = () => setCompact((el.clientWidth || 0) < 720);
@@ -10500,13 +10531,13 @@ function Datatable({
10500
10531
  else if (typeof window !== "undefined") window.removeEventListener("resize", measure);
10501
10532
  };
10502
10533
  }, []);
10503
- const scrollRef = React54__default.useRef(null);
10504
- const filterPanelRef = React54__default.useRef(null);
10505
- const measureCanvas = React54__default.useRef(null);
10506
- const [scrollTop, setScrollTop] = React54__default.useState(0);
10507
- const [viewportH, setViewportH] = React54__default.useState(0);
10508
- const [ovTip, setOvTip] = React54__default.useState(null);
10509
- const ovTimer = React54__default.useRef(null);
10534
+ const scrollRef = React55__default.useRef(null);
10535
+ const filterPanelRef = React55__default.useRef(null);
10536
+ const measureCanvas = React55__default.useRef(null);
10537
+ const [scrollTop, setScrollTop] = React55__default.useState(0);
10538
+ const [viewportH, setViewportH] = React55__default.useState(0);
10539
+ const [ovTip, setOvTip] = React55__default.useState(null);
10540
+ const ovTimer = React55__default.useRef(null);
10510
10541
  const hideOverflowTip = () => {
10511
10542
  clearTimeout(ovTimer.current);
10512
10543
  setOvTip((t) => t ? null : t);
@@ -10530,8 +10561,8 @@ function Datatable({
10530
10561
  if (el && el.scrollWidth > el.clientWidth + 1) setOvTip({ anchor: el, text: el.getAttribute("data-ovtext") });
10531
10562
  else hideOverflowTip();
10532
10563
  };
10533
- React54__default.useEffect(() => () => clearTimeout(ovTimer.current), []);
10534
- React54__default.useEffect(() => {
10564
+ React55__default.useEffect(() => () => clearTimeout(ovTimer.current), []);
10565
+ React55__default.useEffect(() => {
10535
10566
  if (!ovTip) return void 0;
10536
10567
  const onKey = (e) => {
10537
10568
  if (e.key === "Escape") setOvTip(null);
@@ -10539,8 +10570,8 @@ function Datatable({
10539
10570
  document.addEventListener("keydown", onKey);
10540
10571
  return () => document.removeEventListener("keydown", onKey);
10541
10572
  }, [ovTip]);
10542
- const [pivotOn, setPivotOn] = React54__default.useState(pivotMode);
10543
- const [aggConfig, setAggConfig] = React54__default.useState(() => {
10573
+ const [pivotOn, setPivotOn] = React55__default.useState(pivotMode);
10574
+ const [aggConfig, setAggConfig] = React55__default.useState(() => {
10544
10575
  const m = {};
10545
10576
  (columns || []).forEach((c) => {
10546
10577
  if (typeof c.aggregation === "string") m[c.field] = c.aggregation;
@@ -10548,26 +10579,26 @@ function Datatable({
10548
10579
  return m;
10549
10580
  });
10550
10581
  const aggOf = (c) => aggConfig[c.field] || (typeof c.aggregation === "function" ? c.aggregation : null);
10551
- const [pivotConfig, setPivotConfig] = React54__default.useState(() => ({
10582
+ const [pivotConfig, setPivotConfig] = React55__default.useState(() => ({
10552
10583
  rows: pivot && pivot.rows || [],
10553
10584
  columns: pivot && pivot.columns || [],
10554
10585
  values: pivot && pivot.values || []
10555
10586
  }));
10556
10587
  const pivotActive = pivotOn && pivotConfig.rows.length > 0 && pivotConfig.values.length > 0;
10557
- React54__default.useEffect(() => {
10588
+ React55__default.useEffect(() => {
10558
10589
  setOrder((prev) => mergeColOrder(prev, columns.map((c) => c.field).filter(Boolean)));
10559
10590
  }, [columns]);
10560
- const densityPropRef = React54__default.useRef(densityProp);
10561
- React54__default.useEffect(() => {
10591
+ const densityPropRef = React55__default.useRef(densityProp);
10592
+ React55__default.useEffect(() => {
10562
10593
  if (densityPropRef.current === densityProp) return;
10563
10594
  densityPropRef.current = densityProp;
10564
10595
  setDensity(densityProp);
10565
10596
  }, [densityProp]);
10566
- React54__default.useEffect(() => {
10597
+ React55__default.useEffect(() => {
10567
10598
  setAggOn(showAggregation);
10568
10599
  }, [showAggregation]);
10569
- const pageSizePropRef = React54__default.useRef(pageSize);
10570
- React54__default.useEffect(() => {
10600
+ const pageSizePropRef = React55__default.useRef(pageSize);
10601
+ React55__default.useEffect(() => {
10571
10602
  if (pageSizePropRef.current === pageSize) return;
10572
10603
  pageSizePropRef.current = pageSize;
10573
10604
  if (pageSizeControlled) return;
@@ -10575,8 +10606,8 @@ function Datatable({
10575
10606
  setInternalPage(0);
10576
10607
  }, [pageSize]);
10577
10608
  const rowGroupingKey = (rowGrouping || []).join("\0");
10578
- const rowGroupingKeyRef = React54__default.useRef(rowGroupingKey);
10579
- React54__default.useEffect(() => {
10609
+ const rowGroupingKeyRef = React55__default.useRef(rowGroupingKey);
10610
+ React55__default.useEffect(() => {
10580
10611
  if (rowGroupingKeyRef.current === rowGroupingKey) return;
10581
10612
  rowGroupingKeyRef.current = rowGroupingKey;
10582
10613
  setGroupBy(rowGrouping || []);
@@ -10594,29 +10625,29 @@ function Datatable({
10594
10625
  };
10595
10626
  const intrinsicWidth = (c) => c.width === "auto" ? autoWidth(c) : typeof c.width === "number" ? c.width : 160;
10596
10627
  const widthOf = (c) => clampWidth(widths[c.field] ?? intrinsicWidth(c), c);
10597
- const [colMenu, setColMenu] = React54__default.useState(null);
10628
+ const [colMenu, setColMenu] = React55__default.useState(null);
10598
10629
  const [menuPos, openMenu, closeMenu] = useFloating();
10599
- const [panel, setPanel] = React54__default.useState(null);
10630
+ const [panel, setPanel] = React55__default.useState(null);
10600
10631
  const [panelPos, openPanel, closePanel] = useFloating();
10601
- const [combineTarget, setCombineTarget] = React54__default.useState(null);
10602
- const [combineDraft, setCombineDraft] = React54__default.useState(null);
10603
- const combinePanelRef = React54__default.useRef(null);
10604
- React54__default.useEffect(() => {
10632
+ const [combineTarget, setCombineTarget] = React55__default.useState(null);
10633
+ const [combineDraft, setCombineDraft] = React55__default.useState(null);
10634
+ const combinePanelRef = React55__default.useRef(null);
10635
+ React55__default.useEffect(() => {
10605
10636
  if (panel === "combine" && combinePanelRef.current) {
10606
10637
  const el = combinePanelRef.current.querySelector('[role="switch"], button, [tabindex]');
10607
10638
  (el || combinePanelRef.current).focus?.();
10608
10639
  }
10609
10640
  }, [panel]);
10610
- const [rowMenu, setRowMenu] = React54__default.useState(null);
10641
+ const [rowMenu, setRowMenu] = React55__default.useState(null);
10611
10642
  const [rowMenuPos, openRowMenu, closeRowMenu] = useFloating();
10612
- const [exportOpen, setExportOpen] = React54__default.useState(false);
10643
+ const [exportOpen, setExportOpen] = React55__default.useState(false);
10613
10644
  const [exportPos, openExport, closeExport] = useFloating();
10614
- const menuTriggerRef = React54__default.useRef(null);
10615
- const colMenuRef = React54__default.useRef(null);
10616
- const rowMenuRef = React54__default.useRef(null);
10617
- const exportMenuRef = React54__default.useRef(null);
10618
- const quickSearchRef = React54__default.useRef(null);
10619
- const colSearchRef = React54__default.useRef(null);
10645
+ const menuTriggerRef = React55__default.useRef(null);
10646
+ const colMenuRef = React55__default.useRef(null);
10647
+ const rowMenuRef = React55__default.useRef(null);
10648
+ const exportMenuRef = React55__default.useRef(null);
10649
+ const quickSearchRef = React55__default.useRef(null);
10650
+ const colSearchRef = React55__default.useRef(null);
10620
10651
  function focusFirstItem(container) {
10621
10652
  if (!container) return;
10622
10653
  const first = container.querySelector('[role="menuitem"]:not([disabled])');
@@ -10655,16 +10686,16 @@ function Datatable({
10655
10686
  restoreTriggerFocus();
10656
10687
  }
10657
10688
  }
10658
- React54__default.useEffect(() => {
10689
+ React55__default.useEffect(() => {
10659
10690
  if (colMenu) focusFirstItem(colMenuRef.current);
10660
10691
  }, [colMenu]);
10661
- React54__default.useEffect(() => {
10692
+ React55__default.useEffect(() => {
10662
10693
  if (rowMenu) focusFirstItem(rowMenuRef.current);
10663
10694
  }, [rowMenu]);
10664
- React54__default.useEffect(() => {
10695
+ React55__default.useEffect(() => {
10665
10696
  if (exportOpen) focusFirstItem(exportMenuRef.current);
10666
10697
  }, [exportOpen]);
10667
- React54__default.useEffect(() => {
10698
+ React55__default.useEffect(() => {
10668
10699
  if (!colMenu && !panel && !rowMenu) return;
10669
10700
  const closeAll = () => {
10670
10701
  setColMenu(null);
@@ -10687,7 +10718,7 @@ function Datatable({
10687
10718
  document.removeEventListener("keydown", onKey);
10688
10719
  };
10689
10720
  }, [colMenu, panel, rowMenu]);
10690
- React54__default.useEffect(() => {
10721
+ React55__default.useEffect(() => {
10691
10722
  if (!exportOpen) return;
10692
10723
  const close = () => {
10693
10724
  setExportOpen(false);
@@ -10706,37 +10737,37 @@ function Datatable({
10706
10737
  document.removeEventListener("keydown", onKey);
10707
10738
  };
10708
10739
  }, [exportOpen]);
10709
- const colByField = React54__default.useMemo(() => Object.fromEntries(cols.map((c) => [c.field, c])), [cols]);
10740
+ const colByField = React55__default.useMemo(() => Object.fromEntries(cols.map((c) => [c.field, c])), [cols]);
10710
10741
  const fieldLabel = (f) => colLabel(colByField[f] || { field: f });
10711
- const combineSources = React54__default.useMemo(() => {
10742
+ const combineSources = React55__default.useMemo(() => {
10712
10743
  const s = /* @__PURE__ */ new Set();
10713
10744
  for (const cfg of Object.values(userCombine)) (cfg && cfg.fields ? cfg.fields : []).slice(1).forEach((f) => s.add(f));
10714
10745
  return s;
10715
10746
  }, [userCombine]);
10716
- const stackCombineTargets = React54__default.useMemo(
10747
+ const stackCombineTargets = React55__default.useMemo(
10717
10748
  () => new Set(cols.filter((c) => {
10718
10749
  const cfg = combineCfg(userCombine[c.field] || c.combine);
10719
10750
  return cfg && cfg.layout === "stack";
10720
10751
  }).map((c) => c.field)),
10721
10752
  [cols, userCombine]
10722
10753
  );
10723
- const effectiveHidden = React54__default.useMemo(() => combineSources.size ? /* @__PURE__ */ new Set([...hidden, ...combineSources]) : hidden, [hidden, combineSources]);
10724
- const effectiveWrapped = React54__default.useMemo(() => stackCombineTargets.size ? /* @__PURE__ */ new Set([...wrapped, ...stackCombineTargets]) : wrapped, [wrapped, stackCombineTargets]);
10725
- const visibleCols = React54__default.useMemo(() => cols.filter((c) => !effectiveHidden.has(c.field)), [cols, effectiveHidden]);
10754
+ const effectiveHidden = React55__default.useMemo(() => combineSources.size ? /* @__PURE__ */ new Set([...hidden, ...combineSources]) : hidden, [hidden, combineSources]);
10755
+ const effectiveWrapped = React55__default.useMemo(() => stackCombineTargets.size ? /* @__PURE__ */ new Set([...wrapped, ...stackCombineTargets]) : wrapped, [wrapped, stackCombineTargets]);
10756
+ const visibleCols = React55__default.useMemo(() => cols.filter((c) => !effectiveHidden.has(c.field)), [cols, effectiveHidden]);
10726
10757
  const colFieldsKey = JSON.stringify(
10727
10758
  cols.filter((c) => typeof c.field === "string" && c.type !== "actions").map((c) => c.field)
10728
10759
  );
10729
- const colFields = React54__default.useMemo(() => JSON.parse(colFieldsKey), [colFieldsKey]);
10760
+ const colFields = React55__default.useMemo(() => JSON.parse(colFieldsKey), [colFieldsKey]);
10730
10761
  const hiddenKey = JSON.stringify([...hidden].filter((f) => typeof f === "string").sort());
10731
- const visibleColumns = React54__default.useMemo(() => {
10762
+ const visibleColumns = React55__default.useMemo(() => {
10732
10763
  const h = new Set(JSON.parse(hiddenKey));
10733
10764
  return colFields.filter((f) => !h.has(f));
10734
10765
  }, [colFields, hiddenKey]);
10735
- const hiddenColumns = React54__default.useMemo(() => {
10766
+ const hiddenColumns = React55__default.useMemo(() => {
10736
10767
  const h = new Set(JSON.parse(hiddenKey));
10737
10768
  return colFields.filter((f) => h.has(f));
10738
10769
  }, [colFields, hiddenKey]);
10739
- const ordered = React54__default.useMemo(() => {
10770
+ const ordered = React55__default.useMemo(() => {
10740
10771
  const orderIdx = (f) => {
10741
10772
  const i = order.indexOf(f);
10742
10773
  return i === -1 ? 9999 : i;
@@ -10755,8 +10786,8 @@ function Datatable({
10755
10786
  const EXP_W = hasExpandCol ? 44 : 0;
10756
10787
  const numLeft = EXP_W + CHK_W;
10757
10788
  const leadW = numLeft + (showRowNum ? NUM_W : 0);
10758
- const visLeft = React54__default.useMemo(() => pins.left.filter((f) => colByField[f] && !effectiveHidden.has(f)), [pins.left, colByField, effectiveHidden]);
10759
- const visRight = React54__default.useMemo(() => pins.right.filter((f) => colByField[f] && !effectiveHidden.has(f)), [pins.right, colByField, effectiveHidden]);
10789
+ const visLeft = React55__default.useMemo(() => pins.left.filter((f) => colByField[f] && !effectiveHidden.has(f)), [pins.left, colByField, effectiveHidden]);
10790
+ const visRight = React55__default.useMemo(() => pins.right.filter((f) => colByField[f] && !effectiveHidden.has(f)), [pins.right, colByField, effectiveHidden]);
10760
10791
  const stickyOf = (field) => {
10761
10792
  if (visLeft.includes(field)) {
10762
10793
  let off = leadW;
@@ -10779,7 +10810,7 @@ function Datatable({
10779
10810
  }
10780
10811
  return {};
10781
10812
  };
10782
- const processed = React54__default.useMemo(() => {
10813
+ const processed = React55__default.useMemo(() => {
10783
10814
  if (serverMode) {
10784
10815
  if (rowOrder) {
10785
10816
  const idx = new Map(rowOrder.map((k, i) => [k, i]));
@@ -10821,14 +10852,14 @@ function Datatable({
10821
10852
  const serverTotal = rowCount == null ? processed.length : rowCount;
10822
10853
  const totalRows = serverMode ? serverTotal : processed.length;
10823
10854
  const totalPages = paginated ? Math.max(1, Math.ceil(totalRows / sizeVal)) : 1;
10824
- const paged = React54__default.useMemo(
10855
+ const paged = React55__default.useMemo(
10825
10856
  () => !paginated || serverMode ? processed : processed.slice(pageVal * sizeVal, pageVal * sizeVal + sizeVal),
10826
10857
  [processed, paginated, serverMode, pageVal, sizeVal]
10827
10858
  );
10828
- React54__default.useEffect(() => {
10859
+ React55__default.useEffect(() => {
10829
10860
  if (pageVal > totalPages - 1) commitPage(0);
10830
10861
  }, [totalPages]);
10831
- const treeRows = React54__default.useMemo(() => {
10862
+ const treeRows = React55__default.useMemo(() => {
10832
10863
  if (serverMode || typeof getSubRows !== "function") return null;
10833
10864
  const out = [];
10834
10865
  const seen2 = /* @__PURE__ */ new Set();
@@ -10842,12 +10873,12 @@ function Datatable({
10842
10873
  for (const r2 of paged) walk(r2, 0);
10843
10874
  return out;
10844
10875
  }, [serverMode, getSubRows, paged, expandedSet, keyOf]);
10845
- const depthByKey = React54__default.useMemo(() => {
10876
+ const depthByKey = React55__default.useMemo(() => {
10846
10877
  const m = /* @__PURE__ */ new Map();
10847
10878
  if (treeRows) for (const t of treeRows) m.set(keyOf(t.row), t.depth);
10848
10879
  return m;
10849
10880
  }, [treeRows, keyOf]);
10850
- const treeSeqByKey = React54__default.useMemo(() => {
10881
+ const treeSeqByKey = React55__default.useMemo(() => {
10851
10882
  if (!treeRows) return null;
10852
10883
  const m = /* @__PURE__ */ new Map();
10853
10884
  const seen2 = /* @__PURE__ */ new Set();
@@ -10862,7 +10893,7 @@ function Datatable({
10862
10893
  for (const r2 of processed) walk(r2);
10863
10894
  return m;
10864
10895
  }, [treeRows, processed, expandedSet, getSubRows, keyOf]);
10865
- const activeGroupBy = React54__default.useMemo(() => groupBy.filter((f) => colByField[f]), [groupBy, colByField]);
10896
+ const activeGroupBy = React55__default.useMemo(() => groupBy.filter((f) => colByField[f]), [groupBy, colByField]);
10866
10897
  function subtotalText(rowsIn) {
10867
10898
  const parts = [];
10868
10899
  for (const c of ordered) {
@@ -10889,7 +10920,7 @@ function Datatable({
10889
10920
  if (agg === "max") return Math.max(...nums);
10890
10921
  return null;
10891
10922
  }
10892
- const displayItems = React54__default.useMemo(() => {
10923
+ const displayItems = React55__default.useMemo(() => {
10893
10924
  if (!activeGroupBy.length) return null;
10894
10925
  const build = (rowsIn, depth, prefix) => {
10895
10926
  if (depth >= activeGroupBy.length) return rowsIn.map((row) => ({ kind: "leaf", row }));
@@ -10912,7 +10943,7 @@ function Datatable({
10912
10943
  };
10913
10944
  return build(paged, 0, "");
10914
10945
  }, [activeGroupBy, collapsedSet, paged, ordered, aggOn]);
10915
- const leafRows = React54__default.useMemo(
10946
+ const leafRows = React55__default.useMemo(
10916
10947
  () => displayItems ? displayItems.filter((i) => i.kind === "leaf").map((i) => i.row) : treeRows ? treeRows.map((t) => t.row) : paged,
10917
10948
  [displayItems, treeRows, paged]
10918
10949
  );
@@ -10942,7 +10973,7 @@ function Datatable({
10942
10973
  return { top, bottom };
10943
10974
  });
10944
10975
  }
10945
- React54__default.useEffect(() => {
10976
+ React55__default.useEffect(() => {
10946
10977
  if (!rowPinning) return;
10947
10978
  const measure = () => {
10948
10979
  if (theadRef.current) setHeadH(theadRef.current.offsetHeight || 41);
@@ -10956,18 +10987,18 @@ function Datatable({
10956
10987
  const pinnedTopRows = canPinRows ? pinnedRows.top.map((k) => leafRows.find((r2, i) => keyOf(r2, i) === k)).filter(Boolean) : [];
10957
10988
  const pinnedBottomRows = canPinRows ? pinnedRows.bottom.map((k) => leafRows.find((r2, i) => keyOf(r2, i) === k)).filter(Boolean) : [];
10958
10989
  const middleRows = canPinRows ? leafRows.filter((r2, i) => !pinSideOf(keyOf(r2, i))) : leafRows;
10959
- const keyIndex = React54__default.useMemo(() => {
10990
+ const keyIndex = React55__default.useMemo(() => {
10960
10991
  const m = /* @__PURE__ */ new Map();
10961
10992
  leafRows.forEach((r2, i) => m.set(keyOf(r2, i), i));
10962
10993
  return m;
10963
10994
  }, [leafRows]);
10964
- const keyIndexMid = React54__default.useMemo(() => {
10995
+ const keyIndexMid = React55__default.useMemo(() => {
10965
10996
  const m = /* @__PURE__ */ new Map();
10966
10997
  middleRows.forEach((r2, i) => m.set(keyOf(r2, keyIndex.get(keyOf(r2)) ?? i), i));
10967
10998
  return m;
10968
10999
  }, [middleRows, keyIndex]);
10969
- const cellColIndex = React54__default.useCallback((field) => ordered.findIndex((c) => c.field === field), [ordered]);
10970
- const cellRect = React54__default.useMemo(() => {
11000
+ const cellColIndex = React55__default.useCallback((field) => ordered.findIndex((c) => c.field === field), [ordered]);
11001
+ const cellRect = React55__default.useMemo(() => {
10971
11002
  if (selectionMode !== "cell" || !activeCellVal) return null;
10972
11003
  const ar = keyIndex.get(activeCellVal.key), ac = cellColIndex(activeCellVal.field);
10973
11004
  if (ar == null || ac < 0) return null;
@@ -10977,15 +11008,15 @@ function Datatable({
10977
11008
  const c0 = nc < 0 ? ac : Math.min(ac, nc), c1 = nc < 0 ? ac : Math.max(ac, nc);
10978
11009
  return { r0, r1, c0, c1 };
10979
11010
  }, [selectionMode, activeCellVal, anchorCell, keyIndex, cellColIndex]);
10980
- const activeCellId = React54__default.useMemo(() => {
11011
+ const activeCellId = React55__default.useMemo(() => {
10981
11012
  if (selectionMode !== "cell" || !activeCellVal) return void 0;
10982
11013
  const ar = keyIndex.get(activeCellVal.key), ac = cellColIndex(activeCellVal.field);
10983
11014
  return ar == null || ac < 0 ? void 0 : `${gridId}-${ar}-${ac}`;
10984
11015
  }, [selectionMode, activeCellVal, keyIndex, cellColIndex, gridId]);
10985
- const onCellSelRef = React54__default.useRef(onCellSelectionChange);
11016
+ const onCellSelRef = React55__default.useRef(onCellSelectionChange);
10986
11017
  onCellSelRef.current = onCellSelectionChange;
10987
- const prevSelSigRef = React54__default.useRef("");
10988
- React54__default.useEffect(() => {
11018
+ const prevSelSigRef = React55__default.useRef("");
11019
+ React55__default.useEffect(() => {
10989
11020
  const cb = onCellSelRef.current;
10990
11021
  if (selectionMode !== "cell" || !cb) return;
10991
11022
  const cells = [];
@@ -11078,7 +11109,7 @@ function Datatable({
11078
11109
  setReorderMsg("Reorder cancelled.");
11079
11110
  }
11080
11111
  }
11081
- React54__default.useEffect(() => {
11112
+ React55__default.useEffect(() => {
11082
11113
  if (rowFocusRef.current == null) return;
11083
11114
  const key = rowFocusRef.current;
11084
11115
  rowFocusRef.current = null;
@@ -11090,7 +11121,7 @@ function Datatable({
11090
11121
  });
11091
11122
  const estRowH = rowHeight ?? (density === "compact" ? 36 : density === "comfortable" ? 56 : 44);
11092
11123
  const virtualizing = virtualized && !paginated && !activeGroupBy.length && !loading;
11093
- React54__default.useEffect(() => {
11124
+ React55__default.useEffect(() => {
11094
11125
  if (!virtualizing) return;
11095
11126
  const el = scrollRef.current;
11096
11127
  if (!el) return;
@@ -11100,13 +11131,13 @@ function Datatable({
11100
11131
  if (ro) ro.observe(el);
11101
11132
  return () => ro && ro.disconnect();
11102
11133
  }, [virtualizing, height]);
11103
- const onScrollVirtual = React54__default.useCallback((e) => {
11134
+ const onScrollVirtual = React55__default.useCallback((e) => {
11104
11135
  setScrollTop(e.currentTarget.scrollTop);
11105
11136
  }, []);
11106
11137
  const vh = viewportH || (typeof height === "number" ? height : 440);
11107
- const rowHRef = React54__default.useRef(/* @__PURE__ */ new Map());
11108
- const [measureTick, setMeasureTick] = React54__default.useState(0);
11109
- const offsets = React54__default.useMemo(() => {
11138
+ const rowHRef = React55__default.useRef(/* @__PURE__ */ new Map());
11139
+ const [measureTick, setMeasureTick] = React55__default.useState(0);
11140
+ const offsets = React55__default.useMemo(() => {
11110
11141
  if (!virtualizing) return null;
11111
11142
  const total = middleRows.length;
11112
11143
  const arr = new Float64Array(total + 1);
@@ -11116,7 +11147,7 @@ function Datatable({
11116
11147
  }
11117
11148
  return arr;
11118
11149
  }, [virtualizing, middleRows, estRowH, measureTick]);
11119
- const vWindow = React54__default.useMemo(() => {
11150
+ const vWindow = React55__default.useMemo(() => {
11120
11151
  if (!virtualizing || !offsets) return null;
11121
11152
  const total = middleRows.length;
11122
11153
  const totalH = offsets[total];
@@ -11145,7 +11176,7 @@ function Datatable({
11145
11176
  if (start > end) start = end;
11146
11177
  return { start, end, padTop: offsets[start], padBottom: Math.max(0, totalH - offsets[end]) };
11147
11178
  }, [virtualizing, offsets, middleRows.length, vh, scrollTop, overscan]);
11148
- React54__default.useLayoutEffect(() => {
11179
+ React55__default.useLayoutEffect(() => {
11149
11180
  if (!virtualizing) return;
11150
11181
  const el = scrollRef.current;
11151
11182
  if (!el) return;
@@ -11160,9 +11191,9 @@ function Datatable({
11160
11191
  }
11161
11192
  if (changed) setMeasureTick((t) => t + 1);
11162
11193
  });
11163
- const onServerChangeRef = React54__default.useRef(onServerChange);
11194
+ const onServerChangeRef = React55__default.useRef(onServerChange);
11164
11195
  onServerChangeRef.current = onServerChange;
11165
- React54__default.useEffect(() => {
11196
+ React55__default.useEffect(() => {
11166
11197
  if (!serverMode) return;
11167
11198
  const t = setTimeout(() => {
11168
11199
  onServerChangeRef.current?.({
@@ -11182,10 +11213,10 @@ function Datatable({
11182
11213
  }, 250);
11183
11214
  return () => clearTimeout(t);
11184
11215
  }, [serverMode, pageVal, sizeVal, sort, filters, filterLogic, quick, visibleColumns, hiddenColumns, treeExpandedKey]);
11185
- const onColVisRef = React54__default.useRef(onColumnVisibilityChange);
11216
+ const onColVisRef = React55__default.useRef(onColumnVisibilityChange);
11186
11217
  onColVisRef.current = onColumnVisibilityChange;
11187
- const lastVisibleKey = React54__default.useRef(null);
11188
- React54__default.useEffect(() => {
11218
+ const lastVisibleKey = React55__default.useRef(null);
11219
+ React55__default.useEffect(() => {
11189
11220
  const key = JSON.stringify(visibleColumns);
11190
11221
  if (lastVisibleKey.current === null) {
11191
11222
  lastVisibleKey.current = key;
@@ -11217,7 +11248,7 @@ function Datatable({
11217
11248
  return n;
11218
11249
  });
11219
11250
  }
11220
- const movableMidFields = React54__default.useMemo(
11251
+ const movableMidFields = React55__default.useMemo(
11221
11252
  () => ordered.filter((c) => !pins.left.includes(c.field) && !pins.right.includes(c.field) && c.reorderable !== false).map((c) => c.field),
11222
11253
  [ordered, pins]
11223
11254
  );
@@ -11252,7 +11283,7 @@ function Datatable({
11252
11283
  }
11253
11284
  return [...seen2.values()].sort((a, b) => String(a.label).localeCompare(String(b.label)));
11254
11285
  }
11255
- const [resizing, setResizing] = React54__default.useState(false);
11286
+ const [resizing, setResizing] = React55__default.useState(false);
11256
11287
  function startResize(e, field) {
11257
11288
  e.preventDefault();
11258
11289
  e.stopPropagation();
@@ -11359,7 +11390,7 @@ function Datatable({
11359
11390
  if (!agg) return null;
11360
11391
  if (aggregationValues && col.field in aggregationValues) {
11361
11392
  const pre = aggregationValues[col.field];
11362
- if (pre && typeof pre === "object" && !React54__default.isValidElement(pre)) {
11393
+ if (pre && typeof pre === "object" && !React55__default.isValidElement(pre)) {
11363
11394
  if (typeof agg === "string" && agg in pre) return pre[agg];
11364
11395
  } else {
11365
11396
  return pre;
@@ -11564,10 +11595,10 @@ function Datatable({
11564
11595
  }
11565
11596
  }
11566
11597
  }
11567
- React54__default.useEffect(() => {
11598
+ React55__default.useEffect(() => {
11568
11599
  setFocus((f) => ({ r: Math.min(f.r, Math.max(0, leafRows.length - 1)), c: Math.min(f.c, Math.max(0, ordered.length - 1)) }));
11569
11600
  }, [leafRows.length, ordered.length, pageVal]);
11570
- React54__default.useLayoutEffect(() => {
11601
+ React55__default.useLayoutEffect(() => {
11571
11602
  if (cellNavigation !== "widget") return;
11572
11603
  const grid = gridRef.current;
11573
11604
  if (!grid) return;
@@ -11582,12 +11613,12 @@ function Datatable({
11582
11613
  td.tabIndex = active && ws.length === 0 ? 0 : -1;
11583
11614
  });
11584
11615
  }, [cellNavigation, focus.r, focus.c, leafRows, ordered, pageVal, interacting, hidden, pins, scrollTop, loading, measureTick, viewportH, pinnedRows]);
11585
- const selectedRows = React54__default.useMemo(() => rows.filter((r2, i) => selected.has(keyOf(r2, i))), [rows, selected]);
11586
- const selKeys = React54__default.useMemo(() => [...selected], [selected]);
11587
- const onRowSelRef = React54__default.useRef(onRowSelectionChange);
11616
+ const selectedRows = React55__default.useMemo(() => rows.filter((r2, i) => selected.has(keyOf(r2, i))), [rows, selected]);
11617
+ const selKeys = React55__default.useMemo(() => [...selected], [selected]);
11618
+ const onRowSelRef = React55__default.useRef(onRowSelectionChange);
11588
11619
  onRowSelRef.current = onRowSelectionChange;
11589
- const prevRowSelSigRef = React54__default.useRef("");
11590
- React54__default.useEffect(() => {
11620
+ const prevRowSelSigRef = React55__default.useRef("");
11621
+ React55__default.useEffect(() => {
11591
11622
  const cb = onRowSelRef.current;
11592
11623
  if (!cb) return;
11593
11624
  const sig = selKeys.join(",");
@@ -11596,7 +11627,7 @@ function Datatable({
11596
11627
  cb(selKeys, selectedRows);
11597
11628
  }, [selKeys, selectedRows]);
11598
11629
  const revealRowRi = activeRowVal != null ? keyIndex.get(activeRowVal) : void 0;
11599
- React54__default.useEffect(() => {
11630
+ React55__default.useEffect(() => {
11600
11631
  if (!activeRowControlled || !scrollActiveRowIntoView || activeRowId == null) return;
11601
11632
  const el = gridRef.current && gridRef.current.querySelector('.twc-dt__row[data-active="true"]');
11602
11633
  if (el && el.scrollIntoView) el.scrollIntoView({ block: "nearest" });
@@ -11606,11 +11637,11 @@ function Datatable({
11606
11637
  const revealInline = scrollActiveCellIntoView && typeof scrollActiveCellIntoView === "object" && scrollActiveCellIntoView.inline === "center" ? "center" : "nearest";
11607
11638
  const revealRi = activeCellVal ? keyIndex.get(activeCellVal.key) : void 0;
11608
11639
  const revealCi = activeCellVal ? cellColIndex(activeCellVal.field) : -1;
11609
- const revealOffsetsRef = React54__default.useRef(offsets);
11640
+ const revealOffsetsRef = React55__default.useRef(offsets);
11610
11641
  revealOffsetsRef.current = offsets;
11611
- const revealMidRef = React54__default.useRef(keyIndexMid);
11642
+ const revealMidRef = React55__default.useRef(keyIndexMid);
11612
11643
  revealMidRef.current = keyIndexMid;
11613
- React54__default.useEffect(() => {
11644
+ React55__default.useEffect(() => {
11614
11645
  if (!revealOn || !activeCellVal) return void 0;
11615
11646
  const block = revealBlock, inline = revealInline;
11616
11647
  const ri = revealRi, ci = revealCi;
@@ -11656,7 +11687,7 @@ function Datatable({
11656
11687
  if (raf) cancelAnimationFrame(raf);
11657
11688
  };
11658
11689
  }, [activeCellVal?.key, activeCellVal?.field, revealOn, revealBlock, revealInline, revealRi, revealCi, virtualizing, headH, loading]);
11659
- React54__default.useEffect(() => {
11690
+ React55__default.useEffect(() => {
11660
11691
  if (!activeCellControlled || !activeCellVal) {
11661
11692
  jumpAppliedRef.current = null;
11662
11693
  return;
@@ -11674,11 +11705,11 @@ function Datatable({
11674
11705
  function clearSelection() {
11675
11706
  setSelected(/* @__PURE__ */ new Set());
11676
11707
  }
11677
- const [editing, setEditing] = React54__default.useState(null);
11678
- const stagedEditRef = React54__default.useRef(null);
11679
- const onEditingChangeRef = React54__default.useRef(onEditingChange);
11708
+ const [editing, setEditing] = React55__default.useState(null);
11709
+ const stagedEditRef = React55__default.useRef(null);
11710
+ const onEditingChangeRef = React55__default.useRef(onEditingChange);
11680
11711
  onEditingChangeRef.current = onEditingChange;
11681
- const editStoppedRef = React54__default.useRef(false);
11712
+ const editStoppedRef = React55__default.useRef(false);
11682
11713
  const isColEditable = (c) => c.type !== "actions" && c.editable !== false && (c.editable === true || typeof c.editable === "function" || c.renderEditCell != null || editMode);
11683
11714
  const isCellEditable = (c, row) => isColEditable(c) && (typeof c.editable !== "function" || !!c.editable(row, { field: c.field }));
11684
11715
  function applyRowUpdate(rowKey2, updated, orig, field) {
@@ -11739,7 +11770,7 @@ function Datatable({
11739
11770
  }
11740
11771
  }
11741
11772
  const batchEditKey = batchEditFields ? batchEditFields.join("\0") : "";
11742
- const batchEditableCols = React54__default.useMemo(
11773
+ const batchEditableCols = React55__default.useMemo(
11743
11774
  () => {
11744
11775
  const base = cols.filter((c) => c.type !== "actions" && (c.editable ?? (editMode && c.editable !== false)));
11745
11776
  return batchEditFields ? base.filter((c) => batchEditFields.includes(c.field)) : base;
@@ -11747,7 +11778,7 @@ function Datatable({
11747
11778
  [cols, editMode, batchEditKey]
11748
11779
  // eslint-disable-line react-hooks/exhaustive-deps
11749
11780
  );
11750
- const batchSel = React54__default.useMemo(() => {
11781
+ const batchSel = React55__default.useMemo(() => {
11751
11782
  if (!selected.size) return EMPTY_BATCH_SEL;
11752
11783
  const testable = [], resolved = /* @__PURE__ */ new Set();
11753
11784
  const take = (r2, i) => {
@@ -11768,18 +11799,18 @@ function Datatable({
11768
11799
  }
11769
11800
  return { testable, hasUntestable };
11770
11801
  }, [rows, leafRows, selected, serverMode]);
11771
- const batchEditableColsSel = React54__default.useMemo(
11802
+ const batchEditableColsSel = React55__default.useMemo(
11772
11803
  () => batchEditableCols.filter((c) => typeof c.editable !== "function" || batchSel.hasUntestable || batchSel.testable.some((r2) => c.editable(r2, { field: c.field }))),
11773
11804
  [batchEditableCols, batchSel]
11774
11805
  );
11775
11806
  const hasBatchEditor = showBatchEdit && batchEditableCols.length > 0;
11776
- const [batchEdit, setBatchEdit] = React54__default.useState(null);
11807
+ const [batchEdit, setBatchEdit] = React55__default.useState(null);
11777
11808
  const [batchEditPos, openBatchEdit, closeBatchEdit] = useFloating();
11778
11809
  function openBatchEditor(el) {
11779
11810
  setBatchEdit({ fields: {}, values: {} });
11780
11811
  openBatchEdit(el, "left", 320);
11781
11812
  }
11782
- React54__default.useEffect(() => {
11813
+ React55__default.useEffect(() => {
11783
11814
  if (!batchEdit) return;
11784
11815
  const close = () => {
11785
11816
  setBatchEdit(null);
@@ -11798,7 +11829,7 @@ function Datatable({
11798
11829
  document.removeEventListener("keydown", onKey);
11799
11830
  };
11800
11831
  }, [batchEdit]);
11801
- React54__default.useEffect(() => {
11832
+ React55__default.useEffect(() => {
11802
11833
  if (batchEdit && selected.size === 0) {
11803
11834
  setBatchEdit(null);
11804
11835
  closeBatchEdit();
@@ -11868,17 +11899,17 @@ function Datatable({
11868
11899
  setBatchEdit(null);
11869
11900
  closeBatchEdit();
11870
11901
  }
11871
- const [clipboardMsg, setClipboardMsg] = React54__default.useState("");
11872
- const clipboardRef = React54__default.useRef(null);
11873
- const [clipFx, setClipFx] = React54__default.useState(null);
11874
- const clipFxTimer = React54__default.useRef(null);
11875
- const onCellsCopyRef = React54__default.useRef(onCellsCopy);
11902
+ const [clipboardMsg, setClipboardMsg] = React55__default.useState("");
11903
+ const clipboardRef = React55__default.useRef(null);
11904
+ const [clipFx, setClipFx] = React55__default.useState(null);
11905
+ const clipFxTimer = React55__default.useRef(null);
11906
+ const onCellsCopyRef = React55__default.useRef(onCellsCopy);
11876
11907
  onCellsCopyRef.current = onCellsCopy;
11877
- const onCellsPasteRef = React54__default.useRef(onCellsPaste);
11908
+ const onCellsPasteRef = React55__default.useRef(onCellsPaste);
11878
11909
  onCellsPasteRef.current = onCellsPaste;
11879
- const onCellsCommitRef = React54__default.useRef(onCellsCommit);
11910
+ const onCellsCommitRef = React55__default.useRef(onCellsCommit);
11880
11911
  onCellsCommitRef.current = onCellsCommit;
11881
- React54__default.useEffect(() => () => {
11912
+ React55__default.useEffect(() => () => {
11882
11913
  if (clipFxTimer.current) clearTimeout(clipFxTimer.current);
11883
11914
  }, []);
11884
11915
  const announceClip = (msg, rect) => {
@@ -12047,7 +12078,7 @@ function Datatable({
12047
12078
  e.preventDefault();
12048
12079
  applyPastedText(text);
12049
12080
  };
12050
- React54__default.useEffect(() => {
12081
+ React55__default.useEffect(() => {
12051
12082
  if (!editing) return;
12052
12083
  const onDown = (e) => {
12053
12084
  if (e.target.closest(".twc-dt__editor-wrap") || e.target.closest(".twc-pop")) return;
@@ -12139,10 +12170,10 @@ function Datatable({
12139
12170
  ] });
12140
12171
  }
12141
12172
  const tableMinWidth = leadW + ordered.reduce((a, c) => a + widthOf(c), 0);
12142
- const filterableCols = React54__default.useMemo(() => cols.filter((c) => c.filterable), [cols]);
12173
+ const filterableCols = React55__default.useMemo(() => cols.filter((c) => c.filterable), [cols]);
12143
12174
  const columnsShown = showColumns !== void 0 ? showColumns : cols.some((c) => c.hideable) || rowNumbers;
12144
12175
  const filtersShown = showFilters !== void 0 ? showFilters : filterableCols.length > 0;
12145
- React54__default.useEffect(() => {
12176
+ React55__default.useEffect(() => {
12146
12177
  const el = filterPanelRef.current;
12147
12178
  if (panel !== "filters" || !el || typeof document === "undefined") return void 0;
12148
12179
  const measure = () => {
@@ -12604,7 +12635,7 @@ function Datatable({
12604
12635
  const reorderable = canReorderRows && !pinSide;
12605
12636
  const grabbed = rowGrab && rowGrab.key === k;
12606
12637
  const grabTarget = rowGrab && !grabbed && midIdx != null && rowGrab.index === midIdx ? rowGrab.index >= keyIndexMid.get(rowGrab.key) ? "after" : "before" : void 0;
12607
- return /* @__PURE__ */ jsxs(React54__default.Fragment, { children: [
12638
+ return /* @__PURE__ */ jsxs(React55__default.Fragment, { children: [
12608
12639
  /* @__PURE__ */ jsxs(
12609
12640
  "tr",
12610
12641
  {
@@ -12882,13 +12913,13 @@ function Datatable({
12882
12913
  return /* @__PURE__ */ jsxs("div", { className: `twc-dt ${className}`, ref: rootRef, "data-density": density, "data-resizing": resizing || void 0, "data-editing": editing ? "" : void 0, ...rest, children: [
12883
12914
  __twcStyles,
12884
12915
  /* @__PURE__ */ jsxs("div", { className: "twc-dt__toolbar", "data-compact": compact || void 0, children: [
12885
- toolbarActions != null ? /* @__PURE__ */ jsx("div", { className: "twc-dt__toolbar-actions", children: toolbarActions }) : null,
12886
12916
  (batchActions.length || hasBatchEditor) && selected.size > 0 ? /* @__PURE__ */ jsxs("div", { className: "twc-dt__batch", children: [
12887
12917
  /* @__PURE__ */ jsx("button", { type: "button", className: "twc-dt__batch-x", onClick: clearSelection, "aria-label": "Clear selection", children: /* @__PURE__ */ jsx(Svg, { d: I.x }) }),
12888
12918
  /* @__PURE__ */ jsxs("span", { className: "twc-dt__batch-count", children: [
12889
12919
  selected.size,
12890
12920
  " selected"
12891
12921
  ] }),
12922
+ selectionSummary != null ? /* @__PURE__ */ jsx("span", { className: "twc-dt__batch-summary", children: typeof selectionSummary === "function" ? selectionSummary(selKeys, selectedRows) : selectionSummary }) : null,
12892
12923
  /* @__PURE__ */ jsxs("div", { className: "twc-dt__batch-actions", children: [
12893
12924
  hasBatchEditor ? /* @__PURE__ */ jsxs("button", { type: "button", className: "twc-dt__batch-btn", onClick: (e) => openBatchEditor(e.currentTarget), children: [
12894
12925
  /* @__PURE__ */ jsx(Svg, { d: I.pencil }),
@@ -13083,6 +13114,7 @@ function Datatable({
13083
13114
  }
13084
13115
  )
13085
13116
  ] }) : null,
13117
+ toolbarActions != null ? /* @__PURE__ */ jsx("div", { className: "twc-dt__toolbar-actions", children: toolbarActions }) : null,
13086
13118
  searchable ? /* @__PURE__ */ jsxs("div", { className: "twc-dt__search", children: [
13087
13119
  /* @__PURE__ */ jsx(Svg, { d: I.search }),
13088
13120
  /* @__PURE__ */ jsx("input", { ref: quickSearchRef, placeholder: "Search\u2026", "aria-label": "Search rows", value: quick, onChange: (e) => commitQuick(e.target.value) }),
@@ -14262,7 +14294,7 @@ function safeHref7(url) {
14262
14294
  const s = String(url).replace(/[\x00-\x20]+/g, "").toLowerCase();
14263
14295
  return s.startsWith("javascript:") || s.startsWith("data:") || s.startsWith("vbscript:") ? void 0 : url;
14264
14296
  }
14265
- var Grid = React54__default.forwardRef(function Grid2({
14297
+ var Grid = /* @__PURE__ */ React55__default.forwardRef(function Grid2({
14266
14298
  as: Tag2 = "div",
14267
14299
  columns,
14268
14300
  minChildWidth,
@@ -14282,7 +14314,7 @@ var Grid = React54__default.forwardRef(function Grid2({
14282
14314
  }, ref) {
14283
14315
  const { flatStyle, styleNode, sxAttr } = useSx(sx);
14284
14316
  const responsive = columns != null && typeof columns === "object";
14285
- const uid = React54__default.useId();
14317
+ const uid = React55__default.useId();
14286
14318
  const gridId = responsive ? `g${uid.replace(/[^a-zA-Z0-9]/g, "")}` : null;
14287
14319
  let css = "";
14288
14320
  if (responsive) {
@@ -14328,7 +14360,6 @@ var Grid = React54__default.forwardRef(function Grid2({
14328
14360
  }
14329
14361
  );
14330
14362
  });
14331
- Grid.displayName = "Grid";
14332
14363
  var CARDGRID_CSS = `
14333
14364
  .twc-cardgrid { font-family: var(--font-sans); display: flex; flex-direction: column; gap: var(--space-3); }
14334
14365
  .twc-cardgrid__label { font-size: var(--text-sm); font-weight: var(--font-semibold); color: var(--color-text); }
@@ -14372,6 +14403,11 @@ var CARDGRID_CSS = `
14372
14403
  padding: var(--space-2) var(--space-3); border: var(--border-thin) solid var(--color-primary-border);
14373
14404
  background: var(--color-primary-subtle); border-radius: var(--radius-md); }
14374
14405
  .twc-cardgrid__batch-count { font-size: var(--text-sm); font-weight: var(--font-semibold); color: var(--color-primary-subtle-fg); }
14406
+ /* #492: same slot, same contract as Datatable. Weight, not a lighter token - this bar is
14407
+ --color-primary-subtle, where --color-text-subtle is 4.26:1 and fails normal-text contrast. */
14408
+ .twc-cardgrid__batch-summary { display: inline-flex; align-items: center; gap: var(--space-2);
14409
+ font-size: var(--text-sm); color: var(--color-primary-subtle-fg); }
14410
+ .twc-cardgrid__batch-summary::before { content: ""; width: var(--border-thin); height: 14px; background: currentColor; opacity: 0.35; }
14375
14411
  .twc-cardgrid__batch-actions { display: inline-flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); margin-inline-start: auto; }
14376
14412
  .twc-cardgrid__batch-btn { display: inline-flex; align-items: center; gap: var(--space-2); height: var(--control-h-sm);
14377
14413
  padding-inline: var(--space-3); border: var(--border-thin) solid var(--color-border); background: var(--color-surface);
@@ -14427,6 +14463,7 @@ function CardGrid({
14427
14463
  // the whole point, and it was the only Datatable affordance CardGrid lacked.
14428
14464
  checkboxSelection = false,
14429
14465
  batchActions = [],
14466
+ selectionSummary,
14430
14467
  onRowSelectionChange,
14431
14468
  selectionPlacement = "top-start",
14432
14469
  selectionLabel,
@@ -14439,15 +14476,15 @@ function CardGrid({
14439
14476
  ...rest
14440
14477
  }) {
14441
14478
  const styles = useScopedStyles("twc-cardgrid-styles", CARDGRID_CSS);
14442
- const autoId = React54__default.useId();
14479
+ const autoId = React55__default.useId();
14443
14480
  const fieldId = id || autoId;
14444
- const [internalPage, setInternalPage] = React54__default.useState(defaultPage);
14481
+ const [internalPage, setInternalPage] = React55__default.useState(defaultPage);
14445
14482
  const pageVal = page !== void 0 ? page : internalPage;
14446
14483
  const commitPage = (p) => {
14447
14484
  onPageChange?.(p);
14448
14485
  if (page === void 0) setInternalPage(p);
14449
14486
  };
14450
- const [internalSize, setInternalSize] = React54__default.useState(pageSize > 0 ? pageSize : 12);
14487
+ const [internalSize, setInternalSize] = React55__default.useState(pageSize > 0 ? pageSize : 12);
14451
14488
  const sizeControlled = onPageSizeChange !== void 0;
14452
14489
  const sizeVal = sizeControlled ? pageSize > 0 ? pageSize : 12 : internalSize;
14453
14490
  const commitSize = (n) => {
@@ -14455,17 +14492,17 @@ function CardGrid({
14455
14492
  if (!sizeControlled) setInternalSize(n);
14456
14493
  commitPage(0);
14457
14494
  };
14458
- React54__default.useEffect(() => {
14495
+ React55__default.useEffect(() => {
14459
14496
  if (!sizeControlled) setInternalSize(pageSize > 0 ? pageSize : 12);
14460
14497
  }, [pageSize]);
14461
- const [internalQuick, setInternalQuick] = React54__default.useState(defaultQuickFilter);
14498
+ const [internalQuick, setInternalQuick] = React55__default.useState(defaultQuickFilter);
14462
14499
  const quickVal = quickFilter !== void 0 ? quickFilter : internalQuick;
14463
14500
  const commitQuick = (q) => {
14464
14501
  onQuickFilterChange?.(q);
14465
14502
  if (quickFilter === void 0) setInternalQuick(q);
14466
14503
  commitPage(0);
14467
14504
  };
14468
- const [internalSort, setInternalSort] = React54__default.useState(defaultSort);
14505
+ const [internalSort, setInternalSort] = React55__default.useState(defaultSort);
14469
14506
  const sortVal = sort !== void 0 ? sort : internalSort;
14470
14507
  const commitSort = (s) => {
14471
14508
  onSortChange?.(s);
@@ -14473,8 +14510,8 @@ function CardGrid({
14473
14510
  commitPage(0);
14474
14511
  };
14475
14512
  const filtersKey = JSON.stringify(filters);
14476
- const mounted = React54__default.useRef(false);
14477
- React54__default.useEffect(() => {
14513
+ const mounted = React55__default.useRef(false);
14514
+ React55__default.useEffect(() => {
14478
14515
  if (!mounted.current) {
14479
14516
  mounted.current = true;
14480
14517
  return;
@@ -14491,36 +14528,36 @@ function CardGrid({
14491
14528
  const pageKnowable = !(serverMode && rowCount == null) && !loading;
14492
14529
  const shownPage = pageKnowable ? Math.min(pageVal, lastPage) : pageVal;
14493
14530
  const pageRows = serverMode ? rows : paginated && shownPage !== pageVal ? client.filtered.slice(shownPage * sizeVal, shownPage * sizeVal + sizeVal) : client.rows;
14494
- const clampedFiltersKey = React54__default.useRef(filtersKey);
14495
- React54__default.useEffect(() => {
14531
+ const clampedFiltersKey = React55__default.useRef(filtersKey);
14532
+ React55__default.useEffect(() => {
14496
14533
  if (clampedFiltersKey.current !== filtersKey) {
14497
14534
  clampedFiltersKey.current = filtersKey;
14498
14535
  return;
14499
14536
  }
14500
14537
  if (pageKnowable && pageVal > lastPage) commitPage(lastPage);
14501
14538
  }, [lastPage, pageVal, pageKnowable, filtersKey]);
14502
- const onServerChangeRef = React54__default.useRef(onServerChange);
14539
+ const onServerChangeRef = React55__default.useRef(onServerChange);
14503
14540
  onServerChangeRef.current = onServerChange;
14504
14541
  const queryKey = JSON.stringify(query);
14505
- React54__default.useEffect(() => {
14542
+ React55__default.useEffect(() => {
14506
14543
  if (!serverMode) return void 0;
14507
14544
  const t = setTimeout(() => onServerChangeRef.current?.(JSON.parse(queryKey)), 250);
14508
14545
  return () => clearTimeout(t);
14509
14546
  }, [serverMode, queryKey]);
14510
14547
  const keyOf = typeof rowKey === "function" ? rowKey : (r2) => r2 && r2[rowKey];
14511
- const [selected, setSelected] = React54__default.useState(() => /* @__PURE__ */ new Set());
14548
+ const [selected, setSelected] = React55__default.useState(() => /* @__PURE__ */ new Set());
14512
14549
  const retainCap = retainSelectedRows === true ? 1e3 : retainSelectedRows || 0;
14513
- const retainedRef = React54__default.useRef(/* @__PURE__ */ new Map());
14514
- const selKeys = React54__default.useMemo(() => [...selected], [selected]);
14515
- const selectedRows = React54__default.useMemo(() => {
14550
+ const retainedRef = React55__default.useRef(/* @__PURE__ */ new Map());
14551
+ const selKeys = React55__default.useMemo(() => [...selected], [selected]);
14552
+ const selectedRows = React55__default.useMemo(() => {
14516
14553
  const onPage = new Map(pageRows.map((r2, i) => [keyOf(r2, i), r2]));
14517
14554
  return selKeys.map((k) => onPage.get(k) ?? retainedRef.current.get(k)).filter((r2) => r2 !== void 0);
14518
14555
  }, [selKeys, pageRows]);
14519
- const clearSelection = React54__default.useCallback(() => {
14556
+ const clearSelection = React55__default.useCallback(() => {
14520
14557
  retainedRef.current.clear();
14521
14558
  setSelected(/* @__PURE__ */ new Set());
14522
14559
  }, []);
14523
- const toggleKey = React54__default.useCallback((key, row) => {
14560
+ const toggleKey = React55__default.useCallback((key, row) => {
14524
14561
  setSelected((prev) => {
14525
14562
  const next = new Set(prev);
14526
14563
  if (next.has(key)) {
@@ -14553,10 +14590,10 @@ function CardGrid({
14553
14590
  return next;
14554
14591
  });
14555
14592
  };
14556
- const onSelRef = React54__default.useRef(onRowSelectionChange);
14593
+ const onSelRef = React55__default.useRef(onRowSelectionChange);
14557
14594
  onSelRef.current = onRowSelectionChange;
14558
- const prevSelSigRef = React54__default.useRef(null);
14559
- React54__default.useEffect(() => {
14595
+ const prevSelSigRef = React55__default.useRef(null);
14596
+ React55__default.useEffect(() => {
14560
14597
  const cb = onSelRef.current;
14561
14598
  if (!cb) return;
14562
14599
  const sig = selKeys.join(",");
@@ -14634,6 +14671,7 @@ function CardGrid({
14634
14671
  selected.size,
14635
14672
  " selected"
14636
14673
  ] }),
14674
+ selectionSummary != null ? /* @__PURE__ */ jsx("span", { className: "twc-cardgrid__batch-summary", children: typeof selectionSummary === "function" ? selectionSummary(selKeys, selectedRows) : selectionSummary }) : null,
14637
14675
  showSelectAll && pageRows.length > 0 ? /* @__PURE__ */ jsxs("label", { className: "twc-cardgrid__selall", children: [
14638
14676
  /* @__PURE__ */ jsx(
14639
14677
  Checkbox,
@@ -14769,8 +14807,8 @@ function DiffTable({
14769
14807
  className = "",
14770
14808
  ...rest
14771
14809
  }) {
14772
- const dtColumns = React54__default.useMemo(() => columns.map(toDatatableColumn), [columns]);
14773
- const diff = React54__default.useMemo(
14810
+ const dtColumns = React55__default.useMemo(() => columns.map(toDatatableColumn), [columns]);
14811
+ const diff = React55__default.useMemo(
14774
14812
  () => ({ from, to, rowKey, onlyChanged, showToggle, showSummary, moveDetection, compare, toggleLabel }),
14775
14813
  [from, to, rowKey, onlyChanged, showToggle, showSummary, moveDetection, compare, toggleLabel]
14776
14814
  );
@@ -14927,26 +14965,26 @@ function DatePicker({
14927
14965
  }) {
14928
14966
  const __twcStyles0 = useScopedStyles("twc-field-styles", FIELD_CSS3);
14929
14967
  const __twcStyles1 = useScopedStyles("twc-datepicker-styles", DATEPICKER_CSS);
14930
- const autoId = React54__default.useId();
14968
+ const autoId = React55__default.useId();
14931
14969
  const fieldId = id || autoId;
14932
14970
  const descId = `${fieldId}-desc`;
14933
14971
  const invalid = Boolean(error);
14934
- const [internal, setInternal] = React54__default.useState(defaultValue);
14972
+ const [internal, setInternal] = React55__default.useState(defaultValue);
14935
14973
  const selected = value !== void 0 ? value : internal;
14936
- const [open, setOpen] = React54__default.useState(false);
14937
- const [view, setView] = React54__default.useState(selected || /* @__PURE__ */ new Date());
14938
- const [mode, setMode] = React54__default.useState("days");
14939
- const [focusDate, setFocusDate] = React54__default.useState(null);
14940
- const [focusMonth, setFocusMonth] = React54__default.useState(null);
14941
- const [focusYear, setFocusYear] = React54__default.useState(null);
14942
- const [editText, setEditText] = React54__default.useState(null);
14943
- const [coords, setCoords] = React54__default.useState(null);
14944
- const wrapRef = React54__default.useRef(null);
14945
- const triggerRef = React54__default.useRef(null);
14946
- const popRef = React54__default.useRef(null);
14947
- const gridRef = React54__default.useRef(null);
14974
+ const [open, setOpen] = React55__default.useState(false);
14975
+ const [view, setView] = React55__default.useState(selected || /* @__PURE__ */ new Date());
14976
+ const [mode, setMode] = React55__default.useState("days");
14977
+ const [focusDate, setFocusDate] = React55__default.useState(null);
14978
+ const [focusMonth, setFocusMonth] = React55__default.useState(null);
14979
+ const [focusYear, setFocusYear] = React55__default.useState(null);
14980
+ const [editText, setEditText] = React55__default.useState(null);
14981
+ const [coords, setCoords] = React55__default.useState(null);
14982
+ const wrapRef = React55__default.useRef(null);
14983
+ const triggerRef = React55__default.useRef(null);
14984
+ const popRef = React55__default.useRef(null);
14985
+ const gridRef = React55__default.useRef(null);
14948
14986
  const POP_W = 280;
14949
- const place = React54__default.useCallback(() => {
14987
+ const place = React55__default.useCallback(() => {
14950
14988
  const el = triggerRef.current;
14951
14989
  if (!el) return;
14952
14990
  const r2 = el.getBoundingClientRect();
@@ -14957,7 +14995,7 @@ function DatePicker({
14957
14995
  left = Math.max(8, left);
14958
14996
  setCoords({ left, top: flip ? void 0 : Math.round(r2.bottom + 6), bottom: flip ? Math.round(vh - r2.top + 6) : void 0 });
14959
14997
  }, []);
14960
- React54__default.useEffect(() => {
14998
+ React55__default.useEffect(() => {
14961
14999
  if (!open) return void 0;
14962
15000
  place();
14963
15001
  const onMove = () => place();
@@ -14975,7 +15013,7 @@ function DatePicker({
14975
15013
  ro?.disconnect();
14976
15014
  };
14977
15015
  }, [open, place]);
14978
- React54__default.useEffect(() => {
15016
+ React55__default.useEffect(() => {
14979
15017
  if (!open) return;
14980
15018
  setView(selected || /* @__PURE__ */ new Date());
14981
15019
  setMode("days");
@@ -14996,9 +15034,9 @@ function DatePicker({
14996
15034
  };
14997
15035
  }, [open]);
14998
15036
  useFocusTrap(popRef, open && !!coords, { initialFocus: () => gridRef.current?.querySelector('[tabindex="0"]') });
14999
- const months = React54__default.useMemo(() => locale === void 0 ? MONTHS : monthNames(locale), [locale]);
15000
- const monthsShort = React54__default.useMemo(() => locale === void 0 ? MONTHS.map((n) => n.slice(0, 3)) : monthShortNames(locale), [locale]);
15001
- const dows = React54__default.useMemo(
15037
+ const months = React55__default.useMemo(() => locale === void 0 ? MONTHS : monthNames(locale), [locale]);
15038
+ const monthsShort = React55__default.useMemo(() => locale === void 0 ? MONTHS.map((n) => n.slice(0, 3)) : monthShortNames(locale), [locale]);
15039
+ const dows = React55__default.useMemo(
15002
15040
  () => locale === void 0 ? Array.from({ length: 7 }, (_, i) => DOW[(i + weekStartsOn) % 7]) : weekdayNames(locale, weekStartsOn),
15003
15041
  [locale, weekStartsOn]
15004
15042
  );
@@ -15053,11 +15091,11 @@ function DatePicker({
15053
15091
  };
15054
15092
  const cells = Array.from({ length: 42 }, (_, i) => new Date(gridStart.getFullYear(), gridStart.getMonth(), gridStart.getDate() + i));
15055
15093
  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);
15056
- React54__default.useEffect(() => {
15094
+ React55__default.useEffect(() => {
15057
15095
  if (!open || mode !== "days" || !focusDate) return;
15058
15096
  gridRef.current?.querySelector(`[data-key="${keyOf(focusDate)}"]`)?.focus();
15059
15097
  }, [focusDate, open, mode]);
15060
- React54__default.useEffect(() => {
15098
+ React55__default.useEffect(() => {
15061
15099
  if (!open || mode !== "months" || focusMonth == null) return;
15062
15100
  gridRef.current?.querySelector(`[data-mo="${focusMonth}"]`)?.focus();
15063
15101
  }, [focusMonth, open, mode]);
@@ -15081,7 +15119,7 @@ function DatePicker({
15081
15119
  }
15082
15120
  setFocusMonth(next);
15083
15121
  };
15084
- React54__default.useEffect(() => {
15122
+ React55__default.useEffect(() => {
15085
15123
  if (!open || mode !== "years" || focusYear == null) return;
15086
15124
  gridRef.current?.querySelector(`[data-yr="${focusYear}"]`)?.focus();
15087
15125
  }, [focusYear, open, mode]);
@@ -15488,29 +15526,29 @@ function DateRangePicker({
15488
15526
  }) {
15489
15527
  const __twcStyles0 = useScopedStyles("twc-field-styles", FIELD_CSS4);
15490
15528
  const __twcStyles1 = useScopedStyles("twc-drp-styles", RANGE_CSS2);
15491
- const [internal, setInternal] = React54__default.useState(defaultValue);
15529
+ const [internal, setInternal] = React55__default.useState(defaultValue);
15492
15530
  const range2 = value !== void 0 ? value : internal;
15493
- const [open, setOpen] = React54__default.useState(false);
15494
- const [view, setView] = React54__default.useState(range2.start || /* @__PURE__ */ new Date());
15495
- const [hover, setHover] = React54__default.useState(null);
15496
- const [focusDate, setFocusDate] = React54__default.useState(null);
15497
- const [mode, setMode] = React54__default.useState("days");
15498
- const [focusMonth, setFocusMonth] = React54__default.useState(null);
15499
- const [focusYear, setFocusYear] = React54__default.useState(null);
15500
- const [editText, setEditText] = React54__default.useState(null);
15501
- const [coords, setCoords] = React54__default.useState(null);
15502
- const wrapRef = React54__default.useRef(null);
15503
- const triggerRef = React54__default.useRef(null);
15504
- const popRef = React54__default.useRef(null);
15505
- const gridRef = React54__default.useRef(null);
15506
- const labelId = React54__default.useId();
15531
+ const [open, setOpen] = React55__default.useState(false);
15532
+ const [view, setView] = React55__default.useState(range2.start || /* @__PURE__ */ new Date());
15533
+ const [hover, setHover] = React55__default.useState(null);
15534
+ const [focusDate, setFocusDate] = React55__default.useState(null);
15535
+ const [mode, setMode] = React55__default.useState("days");
15536
+ const [focusMonth, setFocusMonth] = React55__default.useState(null);
15537
+ const [focusYear, setFocusYear] = React55__default.useState(null);
15538
+ const [editText, setEditText] = React55__default.useState(null);
15539
+ const [coords, setCoords] = React55__default.useState(null);
15540
+ const wrapRef = React55__default.useRef(null);
15541
+ const triggerRef = React55__default.useRef(null);
15542
+ const popRef = React55__default.useRef(null);
15543
+ const gridRef = React55__default.useRef(null);
15544
+ const labelId = React55__default.useId();
15507
15545
  const descId = `${labelId}-desc`;
15508
15546
  const invalid = Boolean(error);
15509
- React54__default.useEffect(() => {
15547
+ React55__default.useEffect(() => {
15510
15548
  if (disabled) setOpen(false);
15511
15549
  }, [disabled]);
15512
15550
  const POP_W = 420;
15513
- const place = React54__default.useCallback(() => {
15551
+ const place = React55__default.useCallback(() => {
15514
15552
  const el = triggerRef.current;
15515
15553
  if (!el) return;
15516
15554
  const r2 = el.getBoundingClientRect();
@@ -15521,7 +15559,7 @@ function DateRangePicker({
15521
15559
  left = Math.max(8, left);
15522
15560
  setCoords({ left, top: flip ? void 0 : Math.round(r2.bottom + 6), bottom: flip ? Math.round(vh - r2.top + 6) : void 0 });
15523
15561
  }, []);
15524
- React54__default.useEffect(() => {
15562
+ React55__default.useEffect(() => {
15525
15563
  if (!open) return void 0;
15526
15564
  place();
15527
15565
  const onMove = () => place();
@@ -15539,7 +15577,7 @@ function DateRangePicker({
15539
15577
  ro?.disconnect();
15540
15578
  };
15541
15579
  }, [open, place]);
15542
- React54__default.useEffect(() => {
15580
+ React55__default.useEffect(() => {
15543
15581
  if (!open) return;
15544
15582
  const onDown = (e) => {
15545
15583
  if (wrapRef.current && wrapRef.current.contains(e.target)) return;
@@ -15603,20 +15641,20 @@ function DateRangePicker({
15603
15641
  const last = new Date(d.getFullYear(), d.getMonth() + n + 1, 0);
15604
15642
  return new Date(last.getFullYear(), last.getMonth(), Math.min(d.getDate(), last.getDate()));
15605
15643
  };
15606
- React54__default.useEffect(() => {
15644
+ React55__default.useEffect(() => {
15607
15645
  if (!open) {
15608
15646
  setFocusDate(null);
15609
15647
  setHover(null);
15610
15648
  setMode("days");
15611
15649
  }
15612
15650
  }, [open]);
15613
- React54__default.useEffect(() => {
15651
+ React55__default.useEffect(() => {
15614
15652
  if (open && mode === "months" && focusMonth != null) gridRef.current?.querySelector(`[data-mo="${focusMonth}"]`)?.focus();
15615
15653
  }, [focusMonth, open, mode]);
15616
- React54__default.useEffect(() => {
15654
+ React55__default.useEffect(() => {
15617
15655
  if (open && mode === "years" && focusYear != null) gridRef.current?.querySelector(`[data-yr="${focusYear}"]`)?.focus();
15618
15656
  }, [focusYear, open, mode]);
15619
- React54__default.useEffect(() => {
15657
+ React55__default.useEffect(() => {
15620
15658
  if (!open || !focusDate) return;
15621
15659
  gridRef.current?.querySelector(`[data-key="${keyOf(focusDate)}"]`)?.focus();
15622
15660
  }, [focusDate, open]);
@@ -15701,9 +15739,9 @@ function DateRangePicker({
15701
15739
  if (r2.start) setView(r2.start);
15702
15740
  setOpen(false);
15703
15741
  };
15704
- const months = React54__default.useMemo(() => locale === void 0 ? MONTHS2 : monthNames2(locale), [locale]);
15705
- const monthsShort = React54__default.useMemo(() => months.map((n) => n.slice(0, 3)), [months]);
15706
- const dows = React54__default.useMemo(
15742
+ const months = React55__default.useMemo(() => locale === void 0 ? MONTHS2 : monthNames2(locale), [locale]);
15743
+ const monthsShort = React55__default.useMemo(() => months.map((n) => n.slice(0, 3)), [months]);
15744
+ const dows = React55__default.useMemo(
15707
15745
  () => locale === void 0 ? Array.from({ length: 7 }, (_, i) => DOW2[(i + weekStartsOn) % 7]) : weekdayNames2(locale, weekStartsOn),
15708
15746
  [locale, weekStartsOn]
15709
15747
  );
@@ -16058,19 +16096,19 @@ function TimePicker({
16058
16096
  }) {
16059
16097
  const __twcStyles0 = useScopedStyles("twc-field-styles", FIELD_CSS5);
16060
16098
  const __twcStyles1 = useScopedStyles("twc-timepicker-styles", TIMEPICKER_CSS);
16061
- const autoId = React54__default.useId();
16099
+ const autoId = React55__default.useId();
16062
16100
  const fieldId = id || autoId;
16063
16101
  const descId = `${fieldId}-desc`;
16064
16102
  const invalid = Boolean(error);
16065
- const [internal, setInternal] = React54__default.useState(defaultValue);
16103
+ const [internal, setInternal] = React55__default.useState(defaultValue);
16066
16104
  const selected = value !== void 0 ? value : internal;
16067
- const [open, setOpen] = React54__default.useState(false);
16068
- const [editText, setEditText] = React54__default.useState(null);
16069
- const [coords, setCoords] = React54__default.useState(null);
16070
- const wrapRef = React54__default.useRef(null);
16071
- const triggerRef = React54__default.useRef(null);
16072
- const popRef = React54__default.useRef(null);
16073
- const place = React54__default.useCallback(() => {
16105
+ const [open, setOpen] = React55__default.useState(false);
16106
+ const [editText, setEditText] = React55__default.useState(null);
16107
+ const [coords, setCoords] = React55__default.useState(null);
16108
+ const wrapRef = React55__default.useRef(null);
16109
+ const triggerRef = React55__default.useRef(null);
16110
+ const popRef = React55__default.useRef(null);
16111
+ const place = React55__default.useCallback(() => {
16074
16112
  const el = triggerRef.current;
16075
16113
  if (!el) return;
16076
16114
  const r2 = el.getBoundingClientRect();
@@ -16081,7 +16119,7 @@ function TimePicker({
16081
16119
  left = Math.max(8, left);
16082
16120
  setCoords({ left, top: flip ? void 0 : Math.round(r2.bottom + 6), bottom: flip ? Math.round(vh - r2.top + 6) : void 0 });
16083
16121
  }, []);
16084
- React54__default.useEffect(() => {
16122
+ React55__default.useEffect(() => {
16085
16123
  if (!open) return void 0;
16086
16124
  place();
16087
16125
  const onMove = () => place();
@@ -16099,7 +16137,7 @@ function TimePicker({
16099
16137
  ro?.disconnect();
16100
16138
  };
16101
16139
  }, [open, place]);
16102
- React54__default.useEffect(() => {
16140
+ React55__default.useEffect(() => {
16103
16141
  if (!open) return void 0;
16104
16142
  const onDown = (e) => {
16105
16143
  if (wrapRef.current && wrapRef.current.contains(e.target)) return;
@@ -16119,7 +16157,7 @@ function TimePicker({
16119
16157
  useFocusTrap(popRef, open && !!coords, {
16120
16158
  initialFocus: () => popRef.current?.querySelector('.twc-tp__opt[data-selected="true"]') || popRef.current?.querySelector('.twc-tp__opt[tabindex="0"]')
16121
16159
  });
16122
- React54__default.useEffect(() => {
16160
+ React55__default.useEffect(() => {
16123
16161
  if (!open || !coords) return;
16124
16162
  popRef.current?.querySelectorAll('.twc-tp__opt[data-selected="true"]').forEach((el) => el.scrollIntoView({ block: "center" }));
16125
16163
  }, [open, coords]);
@@ -16467,10 +16505,10 @@ function DateTimePicker({
16467
16505
  }) {
16468
16506
  const __twcStyles0 = useScopedStyles("twc-field-styles", FIELD_CSS6);
16469
16507
  const __twcStyles1 = useScopedStyles("twc-datetimepicker-styles", DTP_CSS);
16470
- const autoId = React54__default.useId();
16508
+ const autoId = React55__default.useId();
16471
16509
  const fieldId = id || autoId;
16472
16510
  const descId = `${fieldId}-desc`;
16473
- const [internal, setInternal] = React54__default.useState(defaultValue);
16511
+ const [internal, setInternal] = React55__default.useState(defaultValue);
16474
16512
  const selected = value !== void 0 ? value : internal;
16475
16513
  const commitVal = (d) => {
16476
16514
  if (value === void 0) setInternal(d);
@@ -16614,11 +16652,11 @@ function FilterBar({
16614
16652
  ...rest
16615
16653
  }) {
16616
16654
  const styles = useScopedStyles("twc-filterbar-styles", FILTERBAR_CSS);
16617
- const autoId = React54__default.useId();
16655
+ const autoId = React55__default.useId();
16618
16656
  const fieldId = id || autoId;
16619
- const [internal, setInternal] = React54__default.useState(defaultValue);
16657
+ const [internal, setInternal] = React55__default.useState(defaultValue);
16620
16658
  const clauses = value !== void 0 ? value : internal;
16621
- const values = React54__default.useMemo(() => clausesToValues(fields, clauses), [fields, clauses]);
16659
+ const values = React55__default.useMemo(() => clausesToValues(fields, clauses), [fields, clauses]);
16622
16660
  const emit = (nextValues) => {
16623
16661
  const next = valuesToClauses(fields, nextValues);
16624
16662
  if (value === void 0) setInternal(next);
@@ -16802,14 +16840,14 @@ function Dialog({
16802
16840
  className = "",
16803
16841
  ...rest
16804
16842
  }) {
16805
- const autoId = React54__default.useId();
16843
+ const autoId = React55__default.useId();
16806
16844
  const titleId = `${autoId}-title`;
16807
16845
  const descId = `${autoId}-desc`;
16808
- const dialogRef = React54__default.useRef(null);
16846
+ const dialogRef = React55__default.useRef(null);
16809
16847
  const __twcStyles = useScopedStyles("twc-dialog-styles", DIALOG_CSS);
16810
16848
  const renderPortal = usePortal();
16811
- const [mounted, setMounted] = React54__default.useState(open);
16812
- React54__default.useEffect(() => {
16849
+ const [mounted, setMounted] = React55__default.useState(open);
16850
+ React55__default.useEffect(() => {
16813
16851
  if (open) {
16814
16852
  setMounted(true);
16815
16853
  return;
@@ -16821,7 +16859,7 @@ function Dialog({
16821
16859
  useInertBackground(dialogRef, open && mounted);
16822
16860
  useFocusTrap(dialogRef, open && mounted);
16823
16861
  const isTop = useLayer(open && mounted);
16824
- React54__default.useEffect(() => {
16862
+ React55__default.useEffect(() => {
16825
16863
  if (!open) return void 0;
16826
16864
  const onKey = (e) => {
16827
16865
  if (e.defaultPrevented || !isTop()) return;
@@ -16974,14 +17012,14 @@ function Drawer({
16974
17012
  style,
16975
17013
  ...rest
16976
17014
  }) {
16977
- const autoId = React54__default.useId();
17015
+ const autoId = React55__default.useId();
16978
17016
  const titleId = `${autoId}-title`;
16979
17017
  const descId = `${autoId}-desc`;
16980
- const panelRef = React54__default.useRef(null);
17018
+ const panelRef = React55__default.useRef(null);
16981
17019
  const __twcStyles = useScopedStyles("twc-drawer-styles", DRAWER_CSS);
16982
17020
  const renderPortal = usePortal();
16983
- const [mounted, setMounted] = React54__default.useState(open);
16984
- React54__default.useEffect(() => {
17021
+ const [mounted, setMounted] = React55__default.useState(open);
17022
+ React55__default.useEffect(() => {
16985
17023
  if (open) {
16986
17024
  setMounted(true);
16987
17025
  return;
@@ -16993,7 +17031,7 @@ function Drawer({
16993
17031
  useInertBackground(panelRef, open && mounted);
16994
17032
  useFocusTrap(panelRef, open && mounted);
16995
17033
  const isTop = useLayer(open && mounted);
16996
- React54__default.useEffect(() => {
17034
+ React55__default.useEffect(() => {
16997
17035
  if (!open) return void 0;
16998
17036
  const onKey = (e) => {
16999
17037
  if (e.defaultPrevented || !isTop()) return;
@@ -17083,11 +17121,11 @@ function Field({
17083
17121
  ...rest
17084
17122
  }) {
17085
17123
  const __twcStyles = useScopedStyles("twc-field-styles", FIELD_CSS7);
17086
- const autoId = React54__default.useId();
17124
+ const autoId = React55__default.useId();
17087
17125
  const fieldId = id || autoId;
17088
17126
  const descId = `${fieldId}-desc`;
17089
17127
  const hasMsg = Boolean(error || hint);
17090
- const control = React54__default.isValidElement(children) ? React54__default.cloneElement(children, {
17128
+ const control = React55__default.isValidElement(children) ? React55__default.cloneElement(children, {
17091
17129
  "aria-describedby": [children.props["aria-describedby"], hasMsg ? descId : null].filter(Boolean).join(" ") || void 0,
17092
17130
  "aria-invalid": children.props["aria-invalid"] !== void 0 ? children.props["aria-invalid"] : error ? true : void 0
17093
17131
  }) : children;
@@ -17187,7 +17225,7 @@ function fmtSize(bytes) {
17187
17225
  if (bytes < 1024 * 1024) return (bytes / 1024).toFixed(1) + " KB";
17188
17226
  return (bytes / (1024 * 1024)).toFixed(1) + " MB";
17189
17227
  }
17190
- var FileUpload = React54__default.forwardRef(function FileUpload2({
17228
+ var FileUpload = /* @__PURE__ */ React55__default.forwardRef(function FileUpload2({
17191
17229
  accept,
17192
17230
  multiple = false,
17193
17231
  disabled = false,
@@ -17212,12 +17250,12 @@ var FileUpload = React54__default.forwardRef(function FileUpload2({
17212
17250
  ...rest
17213
17251
  }, ref) {
17214
17252
  const __twcStyles = useScopedStyles("twc-upload-styles", UPLOAD_CSS);
17215
- const [internal, setInternal] = React54__default.useState(defaultValue);
17253
+ const [internal, setInternal] = React55__default.useState(defaultValue);
17216
17254
  const files = value !== void 0 ? value : internal;
17217
- const [drag, setDrag] = React54__default.useState(false);
17218
- const inputRef = React54__default.useRef(null);
17219
- React54__default.useImperativeHandle(ref, () => ({ open: () => inputRef.current?.click() }), []);
17220
- const autoId = React54__default.useId();
17255
+ const [drag, setDrag] = React55__default.useState(false);
17256
+ const inputRef = React55__default.useRef(null);
17257
+ React55__default.useImperativeHandle(ref, () => ({ open: () => inputRef.current?.click() }), []);
17258
+ const autoId = React55__default.useId();
17221
17259
  const fieldId = id || autoId;
17222
17260
  const descId = `${fieldId}-desc`;
17223
17261
  const labelId = `${fieldId}-label`;
@@ -17260,7 +17298,7 @@ var FileUpload = React54__default.forwardRef(function FileUpload2({
17260
17298
  )
17261
17299
  );
17262
17300
  if (trigger) {
17263
- const triggerEl = React54__default.isValidElement(trigger) && error ? React54__default.cloneElement(trigger, {
17301
+ const triggerEl = React55__default.isValidElement(trigger) && error ? React55__default.cloneElement(trigger, {
17264
17302
  "aria-describedby": [trigger.props["aria-describedby"], descId].filter(Boolean).join(" ") || void 0
17265
17303
  }) : trigger;
17266
17304
  return /* @__PURE__ */ jsxs("div", { className: `twc-upload ${className}`, "data-size": size, ...rest, children: [
@@ -17354,7 +17392,6 @@ var FileUpload = React54__default.forwardRef(function FileUpload2({
17354
17392
  error ? /* @__PURE__ */ jsx("span", { id: descId, className: "twc-field__error", children: error }) : null
17355
17393
  ] });
17356
17394
  });
17357
- FileUpload.displayName = "FileUpload";
17358
17395
  var TOGGLEGROUP_CSS = `
17359
17396
  .twc-togglegroup { display: inline-flex; gap: var(--space-1); }
17360
17397
  .twc-togglegroup[data-orientation="vertical"] { flex-direction: column; align-items: stretch; }
@@ -17376,10 +17413,10 @@ function ToggleGroup({
17376
17413
  ...rest
17377
17414
  }) {
17378
17415
  const __twcStyles = useScopedStyles("twc-togglegroup-styles", TOGGLEGROUP_CSS);
17379
- const groupRef = React54__default.useRef(null);
17416
+ const groupRef = React55__default.useRef(null);
17380
17417
  const multiple = type === "multiple";
17381
- const [focusedIdx, setFocusedIdx] = React54__default.useState(null);
17382
- const [internal, setInternal] = React54__default.useState(defaultValue !== void 0 ? defaultValue : multiple ? [] : null);
17418
+ const [focusedIdx, setFocusedIdx] = React55__default.useState(null);
17419
+ const [internal, setInternal] = React55__default.useState(defaultValue !== void 0 ? defaultValue : multiple ? [] : null);
17383
17420
  const current = value !== void 0 ? value : internal;
17384
17421
  const isSelected = (v) => multiple ? Array.isArray(current) && current.includes(v) : current === v;
17385
17422
  const commit = (next) => {
@@ -17500,15 +17537,15 @@ function Kanban({
17500
17537
  ...rest
17501
17538
  }) {
17502
17539
  const __twcStyles = useScopedStyles("twc-kanban-styles", KANBAN_CSS);
17503
- const [internal, setInternal] = React54__default.useState(cards ?? defaultCards ?? []);
17540
+ const [internal, setInternal] = React55__default.useState(cards ?? defaultCards ?? []);
17504
17541
  const items = cards !== void 0 ? cards : internal;
17505
- const [drag, setDrag] = React54__default.useState(null);
17506
- const [overCol, setOverCol] = React54__default.useState(null);
17507
- const [grab, setGrab] = React54__default.useState(null);
17508
- const [announce, setAnnounce] = React54__default.useState("");
17509
- const rootRef = React54__default.useRef(null);
17510
- const focusIdRef = React54__default.useRef(null);
17511
- React54__default.useEffect(() => {
17542
+ const [drag, setDrag] = React55__default.useState(null);
17543
+ const [overCol, setOverCol] = React55__default.useState(null);
17544
+ const [grab, setGrab] = React55__default.useState(null);
17545
+ const [announce, setAnnounce] = React55__default.useState("");
17546
+ const rootRef = React55__default.useRef(null);
17547
+ const focusIdRef = React55__default.useRef(null);
17548
+ React55__default.useEffect(() => {
17512
17549
  if (focusIdRef.current == null) return void 0;
17513
17550
  const raf = requestAnimationFrame(() => {
17514
17551
  const id = focusIdRef.current;
@@ -17827,22 +17864,22 @@ function Popover({
17827
17864
  ...rest
17828
17865
  }) {
17829
17866
  const __twcStyles = useScopedStyles("twc-popover-styles", POPOVER_CSS);
17830
- const [openState, setOpenState] = React54__default.useState(defaultOpen);
17831
- const [render, setRender] = React54__default.useState(false);
17832
- const [pos, setPos] = React54__default.useState(null);
17833
- const wrapRef = React54__default.useRef(null);
17867
+ const [openState, setOpenState] = React55__default.useState(defaultOpen);
17868
+ const [render, setRender] = React55__default.useState(false);
17869
+ const [pos, setPos] = React55__default.useState(null);
17870
+ const wrapRef = React55__default.useRef(null);
17834
17871
  useTriggerAudit(wrapRef, "Popover");
17835
- const popRef = React54__default.useRef(null);
17836
- const popId = React54__default.useId();
17872
+ const popRef = React55__default.useRef(null);
17873
+ const popId = React55__default.useId();
17837
17874
  const controlled = openProp !== void 0;
17838
17875
  const open = controlled ? !!openProp : openState;
17839
- const openRef = React54__default.useRef(open);
17876
+ const openRef = React55__default.useRef(open);
17840
17877
  openRef.current = open;
17841
- const controlledRef = React54__default.useRef(controlled);
17878
+ const controlledRef = React55__default.useRef(controlled);
17842
17879
  controlledRef.current = controlled;
17843
- const onOpenChangeRef = React54__default.useRef(onOpenChange);
17880
+ const onOpenChangeRef = React55__default.useRef(onOpenChange);
17844
17881
  onOpenChangeRef.current = onOpenChange;
17845
- const setOpen = React54__default.useCallback((next) => {
17882
+ const setOpen = React55__default.useCallback((next) => {
17846
17883
  const value = typeof next === "function" ? next(openRef.current) : next;
17847
17884
  if (value === openRef.current) return;
17848
17885
  if (!controlledRef.current) setOpenState(value);
@@ -17850,7 +17887,7 @@ function Popover({
17850
17887
  }, []);
17851
17888
  const toggle = () => setOpen((o) => !o);
17852
17889
  const RD = { createPortal: typeof createPortal === "function" ? createPortal : typeof window !== "undefined" && window.ReactDOM && window.ReactDOM.createPortal };
17853
- const place = React54__default.useCallback(() => {
17890
+ const place = React55__default.useCallback(() => {
17854
17891
  const t = wrapRef.current;
17855
17892
  if (!t) return;
17856
17893
  const r2 = t.getBoundingClientRect();
@@ -17888,7 +17925,7 @@ function Popover({
17888
17925
  setPos({ top, left, width: w, flip: false, arrow, maxHeight: vh - 2 * M });
17889
17926
  }, [placement, align, width]);
17890
17927
  const isTop = useLayer(open && render);
17891
- React54__default.useEffect(() => {
17928
+ React55__default.useEffect(() => {
17892
17929
  if (!open) return;
17893
17930
  place();
17894
17931
  const onMove = () => place();
@@ -17915,7 +17952,7 @@ function Popover({
17915
17952
  document.removeEventListener("keydown", onKey);
17916
17953
  };
17917
17954
  }, [open, place, isTop]);
17918
- React54__default.useEffect(() => {
17955
+ React55__default.useEffect(() => {
17919
17956
  if (open) {
17920
17957
  setRender(true);
17921
17958
  return;
@@ -17923,12 +17960,12 @@ function Popover({
17923
17960
  const t = setTimeout(() => setRender(false), 170);
17924
17961
  return () => clearTimeout(t);
17925
17962
  }, [open]);
17926
- React54__default.useEffect(() => {
17963
+ React55__default.useEffect(() => {
17927
17964
  if (render && open) place();
17928
17965
  }, [render, place]);
17929
- const restoreRef = React54__default.useRef(null);
17930
- const needFocusRef = React54__default.useRef(false);
17931
- React54__default.useEffect(() => {
17966
+ const restoreRef = React55__default.useRef(null);
17967
+ const needFocusRef = React55__default.useRef(false);
17968
+ React55__default.useEffect(() => {
17932
17969
  if (open) {
17933
17970
  restoreRef.current = document.activeElement;
17934
17971
  needFocusRef.current = true;
@@ -17964,7 +18001,7 @@ function Popover({
17964
18001
  }
17965
18002
  ) : null;
17966
18003
  const fix = {};
17967
- if (React54__default.isValidElement(trigger)) {
18004
+ if (React55__default.isValidElement(trigger)) {
17968
18005
  if (!triggerIsControl(trigger)) fix.role = "button";
17969
18006
  fix.onKeyDown = (e) => {
17970
18007
  trigger.props.onKeyDown?.(e);
@@ -17976,7 +18013,7 @@ function Popover({
17976
18013
  }
17977
18014
  };
17978
18015
  }
17979
- const triggerEl = React54__default.isValidElement(trigger) ? React54__default.cloneElement(trigger, {
18016
+ const triggerEl = React55__default.isValidElement(trigger) ? React55__default.cloneElement(trigger, {
17980
18017
  onClick: (e) => {
17981
18018
  trigger.props.onClick?.(e);
17982
18019
  toggle();
@@ -18023,7 +18060,7 @@ function Progress({
18023
18060
  className = "",
18024
18061
  ...rest
18025
18062
  }) {
18026
- const labelId = React54__default.useId();
18063
+ const labelId = React55__default.useId();
18027
18064
  const { "aria-label": ariaLabel, "aria-labelledby": ariaLabelledby, ...restProps } = rest;
18028
18065
  const __twcStyles = useScopedStyles("twc-progress-styles", `
18029
18066
  .twc-progress-wrap { display: flex; flex-direction: column; gap: 6px; font-family: var(--font-sans); }
@@ -18094,7 +18131,7 @@ function Progress({
18094
18131
  ] })
18095
18132
  );
18096
18133
  }
18097
- function Radio({
18134
+ var Radio = /* @__PURE__ */ React55__default.forwardRef(function Radio2({
18098
18135
  label,
18099
18136
  description,
18100
18137
  error,
@@ -18110,7 +18147,7 @@ function Radio({
18110
18147
  className = "",
18111
18148
  onChange,
18112
18149
  ...rest
18113
- }) {
18150
+ }, ref) {
18114
18151
  const __twcStyles = useScopedStyles("twc-radio-styles", `
18115
18152
  .twc-radio { display: inline-flex; align-items: flex-start; gap: var(--space-2-5); cursor: pointer; font-family: var(--font-sans); }
18116
18153
  /* tone \u2192 accent set (default primary). Mirrors Button's --_accent model; Badge's tone vocabulary. */
@@ -18150,7 +18187,7 @@ function Radio({
18150
18187
  .twc-field { display: flex; flex-direction: column; gap: var(--space-1-5); font-family: var(--font-sans); }
18151
18188
  .twc-field__error { font-size: var(--text-xs); color: var(--color-danger-subtle-fg); font-weight: var(--font-medium); }
18152
18189
  `);
18153
- const autoId = React54__default.useId();
18190
+ const autoId = React55__default.useId();
18154
18191
  const fieldId = id || autoId;
18155
18192
  const errId = `${fieldId}-error`;
18156
18193
  const invalid = Boolean(error);
@@ -18163,6 +18200,7 @@ function Radio({
18163
18200
  /* @__PURE__ */ jsx(
18164
18201
  "input",
18165
18202
  {
18203
+ ref,
18166
18204
  id: fieldId,
18167
18205
  type: "radio",
18168
18206
  className: "twc-radio__input",
@@ -18193,7 +18231,7 @@ function Radio({
18193
18231
  control,
18194
18232
  /* @__PURE__ */ jsx("span", { id: errId, className: "twc-field__error", children: error })
18195
18233
  ] });
18196
- }
18234
+ });
18197
18235
  var RADIO_GROUP_CSS = `
18198
18236
  .twc-field { display: flex; flex-direction: column; gap: var(--space-1-5); font-family: var(--font-sans); }
18199
18237
  .twc-field__label { font-size: var(--text-sm); font-weight: var(--font-semibold); color: var(--color-text); display: flex; gap: 4px; align-items: center; }
@@ -18223,13 +18261,13 @@ function RadioGroup({
18223
18261
  ...rest
18224
18262
  }) {
18225
18263
  const __twcStyles = useScopedStyles("twc-radio-group-styles", RADIO_GROUP_CSS);
18226
- const autoId = React54__default.useId();
18264
+ const autoId = React55__default.useId();
18227
18265
  const fieldId = id || autoId;
18228
18266
  const labelId = `${fieldId}-label`;
18229
18267
  const descId = `${fieldId}-desc`;
18230
18268
  const groupName = name || `${fieldId}-name`;
18231
18269
  const invalid = Boolean(error);
18232
- const [internal, setInternal] = React54__default.useState(defaultValue);
18270
+ const [internal, setInternal] = React55__default.useState(defaultValue);
18233
18271
  const current = value !== void 0 ? value : internal;
18234
18272
  const select = (v) => {
18235
18273
  if (value === void 0) setInternal(v);
@@ -18250,10 +18288,10 @@ function RadioGroup({
18250
18288
  tone
18251
18289
  },
18252
18290
  o.value
18253
- )) : React54__default.Children.map(children, (child) => {
18254
- if (!React54__default.isValidElement(child)) return child;
18291
+ )) : React55__default.Children.map(children, (child) => {
18292
+ if (!React55__default.isValidElement(child)) return child;
18255
18293
  const v = child.props.value;
18256
- return React54__default.cloneElement(child, {
18294
+ return React55__default.cloneElement(child, {
18257
18295
  name: child.props.name ?? groupName,
18258
18296
  checked: child.props.checked ?? current === v,
18259
18297
  onChange: child.props.onChange ?? (() => select(v)),
@@ -18333,12 +18371,12 @@ function Rating({
18333
18371
  ...rest
18334
18372
  }) {
18335
18373
  const __twcStyles = useScopedStyles("twc-rating-styles", RATING_CSS);
18336
- const [internal, setInternal] = React54__default.useState(defaultValue);
18337
- const [hover, setHover] = React54__default.useState(0);
18374
+ const [internal, setInternal] = React55__default.useState(defaultValue);
18375
+ const [hover, setHover] = React55__default.useState(0);
18338
18376
  const val = value !== void 0 ? value : internal;
18339
18377
  const shown = hover || val;
18340
18378
  const interactive = !readOnly && !disabled;
18341
- const btnRefs = React54__default.useRef([]);
18379
+ const btnRefs = React55__default.useRef([]);
18342
18380
  const tabStar = Math.min(count, Math.max(1, Math.round(val) || 1));
18343
18381
  const fmt = (v) => format ? format(v) : Number.isInteger(v) ? String(v) : v.toFixed(1);
18344
18382
  if (process.env.NODE_ENV !== "production" && interactive && !Number.isInteger(val)) {
@@ -18543,24 +18581,24 @@ function Sidebar({
18543
18581
  ...rest
18544
18582
  }) {
18545
18583
  const __twcStyles = useScopedStyles("twc-sidebar-styles", SIDEBAR_CSS);
18546
- const navId = React54__default.useId();
18547
- const panelRef = React54__default.useRef(null);
18584
+ const navId = React55__default.useId();
18585
+ const panelRef = React55__default.useRef(null);
18548
18586
  const renderPortal = usePortal();
18549
- const [internal, setInternal] = React54__default.useState(defaultCollapsed);
18587
+ const [internal, setInternal] = React55__default.useState(defaultCollapsed);
18550
18588
  const collapsed = collapsedProp !== void 0 ? collapsedProp : internal;
18551
18589
  const toggle = () => {
18552
18590
  const next = !collapsed;
18553
18591
  if (collapsedProp === void 0) setInternal(next);
18554
18592
  onCollapsedChange?.(next);
18555
18593
  };
18556
- const [openInternal, setOpenInternal] = React54__default.useState(defaultOpen);
18594
+ const [openInternal, setOpenInternal] = React55__default.useState(defaultOpen);
18557
18595
  const open = openProp !== void 0 ? openProp : openInternal;
18558
18596
  const setOpen = (next) => {
18559
18597
  if (openProp === void 0) setOpenInternal(next);
18560
18598
  onOpenChange?.(next);
18561
18599
  };
18562
- const [mounted, setMounted] = React54__default.useState(open);
18563
- React54__default.useEffect(() => {
18600
+ const [mounted, setMounted] = React55__default.useState(open);
18601
+ React55__default.useEffect(() => {
18564
18602
  if (!overlay) return void 0;
18565
18603
  if (open) {
18566
18604
  setMounted(true);
@@ -18569,7 +18607,7 @@ function Sidebar({
18569
18607
  const t = setTimeout(() => setMounted(false), 170);
18570
18608
  return () => clearTimeout(t);
18571
18609
  }, [overlay, open]);
18572
- React54__default.useEffect(() => {
18610
+ React55__default.useEffect(() => {
18573
18611
  if (!overlay || !open) return void 0;
18574
18612
  const prev = document.body.style.overflow;
18575
18613
  document.body.style.overflow = "hidden";
@@ -18578,7 +18616,7 @@ function Sidebar({
18578
18616
  };
18579
18617
  }, [overlay, open]);
18580
18618
  useFocusTrap(panelRef, overlay && open && mounted);
18581
- React54__default.useEffect(() => {
18619
+ React55__default.useEffect(() => {
18582
18620
  if (!overlay || !open) return void 0;
18583
18621
  const onKey = (e) => {
18584
18622
  if (e.key === "Escape") {
@@ -18630,7 +18668,7 @@ function Sidebar({
18630
18668
  const body = /* @__PURE__ */ jsxs(Fragment, { children: [
18631
18669
  __twcStyles,
18632
18670
  brand ? /* @__PURE__ */ jsx("div", { className: "twc-sidebar__head", children: /* @__PURE__ */ jsx("span", { className: "twc-sidebar__brand", children: brand }) }) : null,
18633
- /* @__PURE__ */ jsx("nav", { id: navId, className: "twc-sidebar__nav", "aria-label": navLabel, children: groups.map((g, gi) => /* @__PURE__ */ jsxs(React54__default.Fragment, { children: [
18671
+ /* @__PURE__ */ jsx("nav", { id: navId, className: "twc-sidebar__nav", "aria-label": navLabel, children: groups.map((g, gi) => /* @__PURE__ */ jsxs(React55__default.Fragment, { children: [
18634
18672
  g.section != null ? /* @__PURE__ */ jsx("div", { className: "twc-sidebar__section", id: g.sid, children: g.section }) : null,
18635
18673
  /* @__PURE__ */ jsx("ul", { className: "twc-sidebar__list", ...g.section != null ? { "aria-labelledby": g.sid } : {}, children: g.entries.map(({ it, i }) => /* @__PURE__ */ jsx("li", { children: renderItem(it) }, i)) })
18636
18674
  ] }, gi)) }),
@@ -18816,10 +18854,10 @@ function Slider({
18816
18854
  return Math.min(max, Math.max(min, Math.round(stepped * 1e6) / 1e6));
18817
18855
  };
18818
18856
  const __twcStyles = useScopedStyles("twc-slider-styles", SLIDER_CSS);
18819
- const autoId = React54__default.useId();
18857
+ const autoId = React55__default.useId();
18820
18858
  const fieldId = id || autoId;
18821
18859
  const isRange = range2 || Array.isArray(value) || Array.isArray(defaultValue);
18822
- const [internal, setInternal] = React54__default.useState(() => {
18860
+ const [internal, setInternal] = React55__default.useState(() => {
18823
18861
  if (isRange) {
18824
18862
  const dv = Array.isArray(defaultValue) ? defaultValue : [min, max];
18825
18863
  return [clampSnap(dv[0]), clampSnap(dv[1])];
@@ -18829,9 +18867,9 @@ function Slider({
18829
18867
  const rawVal = value !== void 0 ? value : internal;
18830
18868
  const clampedVals = (isRange ? [Number(rawVal[0]), Number(rawVal[1])] : [Number(rawVal)]).map((v) => Math.min(max, Math.max(min, Number.isFinite(v) ? v : min)));
18831
18869
  const indices = isRange ? [0, 1] : [0];
18832
- const trackRef = React54__default.useRef(null);
18833
- const [dragging, setDragging] = React54__default.useState(false);
18834
- const [typed, setTyped] = React54__default.useState({});
18870
+ const trackRef = React55__default.useRef(null);
18871
+ const [dragging, setDragging] = React55__default.useState(false);
18872
+ const [typed, setTyped] = React55__default.useState({});
18835
18873
  const fmt = (v) => formatValue ? formatValue(v) : v.toFixed(decimals);
18836
18874
  const valueTextFor = (v) => {
18837
18875
  if (getAriaValueText) return getAriaValueText(v);
@@ -18883,8 +18921,8 @@ function Slider({
18883
18921
  const ratio = Math.min(1, Math.max(0, (clientX - r2.left) / r2.width));
18884
18922
  return clampSnap(min + ratio * (max - min));
18885
18923
  };
18886
- const dragCleanupRef = React54__default.useRef(null);
18887
- React54__default.useEffect(() => () => dragCleanupRef.current?.(), []);
18924
+ const dragCleanupRef = React55__default.useRef(null);
18925
+ React55__default.useEffect(() => () => dragCleanupRef.current?.(), []);
18888
18926
  function onPointerDown(e) {
18889
18927
  if (disabled) return;
18890
18928
  e.preventDefault();
@@ -18933,7 +18971,7 @@ function Slider({
18933
18971
  name ? clampedVals.map((v, i) => /* @__PURE__ */ jsx("input", { type: "hidden", name, value: v, disabled: disabled || void 0 }, i)) : null,
18934
18972
  label || showValue || editable ? /* @__PURE__ */ jsxs("div", { className: "twc-slider__head", children: [
18935
18973
  label ? /* @__PURE__ */ jsx("label", { className: "twc-slider__label", id: labelId, children: label }) : /* @__PURE__ */ jsx("span", {}),
18936
- editable ? /* @__PURE__ */ jsx("span", { className: "twc-slider__inputs", children: indices.map((i) => /* @__PURE__ */ jsxs(React54__default.Fragment, { children: [
18974
+ editable ? /* @__PURE__ */ jsx("span", { className: "twc-slider__inputs", children: indices.map((i) => /* @__PURE__ */ jsxs(React55__default.Fragment, { children: [
18937
18975
  i > 0 ? /* @__PURE__ */ jsx("span", { className: "twc-slider__input-sep", "aria-hidden": "true", children: "\u2013" }) : null,
18938
18976
  /* @__PURE__ */ jsx(
18939
18977
  "input",
@@ -19146,7 +19184,7 @@ function Stepper({
19146
19184
  ...rest
19147
19185
  }) {
19148
19186
  const __twcStyles = useScopedStyles("twc-stepper-styles", STEPPER_CSS);
19149
- const [activeInternal, setActiveInternal] = React54__default.useState(defaultActive);
19187
+ const [activeInternal, setActiveInternal] = React55__default.useState(defaultActive);
19150
19188
  const active = activeProp !== void 0 ? activeProp : activeInternal;
19151
19189
  const handleStep = (i) => {
19152
19190
  if (activeProp === void 0) setActiveInternal(i);
@@ -19226,7 +19264,7 @@ function Stepper({
19226
19264
  })
19227
19265
  ] });
19228
19266
  }
19229
- function Switch({
19267
+ var Switch = /* @__PURE__ */ React55__default.forwardRef(function Switch2({
19230
19268
  label,
19231
19269
  description,
19232
19270
  error,
@@ -19240,7 +19278,7 @@ function Switch({
19240
19278
  className = "",
19241
19279
  onChange,
19242
19280
  ...rest
19243
- }) {
19281
+ }, ref) {
19244
19282
  const __twcStyles = useScopedStyles("twc-switch-styles", `
19245
19283
  /* tone \u2192 accent set (default primary). Mirrors Button's --_accent model; Badge's tone vocabulary. */
19246
19284
  .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); }
@@ -19293,7 +19331,7 @@ function Switch({
19293
19331
  .twc-field { display: flex; flex-direction: column; gap: var(--space-1-5); font-family: var(--font-sans); }
19294
19332
  .twc-field__error { font-size: var(--text-xs); color: var(--color-danger-subtle-fg); font-weight: var(--font-medium); }
19295
19333
  `);
19296
- const autoId = React54__default.useId();
19334
+ const autoId = React55__default.useId();
19297
19335
  const fieldId = id || autoId;
19298
19336
  const errId = `${fieldId}-error`;
19299
19337
  const invalid = Boolean(error);
@@ -19306,6 +19344,7 @@ function Switch({
19306
19344
  /* @__PURE__ */ jsx(
19307
19345
  "input",
19308
19346
  {
19347
+ ref,
19309
19348
  id: fieldId,
19310
19349
  type: "checkbox",
19311
19350
  role: "switch",
@@ -19335,7 +19374,7 @@ function Switch({
19335
19374
  control,
19336
19375
  /* @__PURE__ */ jsx("span", { id: errId, className: "twc-field__error", children: error })
19337
19376
  ] });
19338
- }
19377
+ });
19339
19378
  var TABLE_CSS = `
19340
19379
  .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); }
19341
19380
  .twc-table { width: 100%; border-collapse: collapse; font-family: var(--font-sans); font-size: var(--text-sm); color: var(--color-text); }
@@ -19401,14 +19440,14 @@ function Table({
19401
19440
  ...rest
19402
19441
  }) {
19403
19442
  const __twcStyles = useScopedStyles("twc-table-styles", TABLE_CSS);
19404
- const cols = React54__default.useMemo(
19443
+ const cols = React55__default.useMemo(
19405
19444
  () => (columns || []).map((c) => ({ ...c, header: c.headerName, render: c.renderCell })),
19406
19445
  [columns]
19407
19446
  );
19408
19447
  const dataRows = rowsProp || [];
19409
- const [internalSort, setInternalSort] = React54__default.useState(defaultSort || { field: null, dir: "asc" });
19448
+ const [internalSort, setInternalSort] = React55__default.useState(defaultSort || { field: null, dir: "asc" });
19410
19449
  const sort = (sortProp !== void 0 ? sortProp : internalSort) || { field: null, dir: "asc" };
19411
- const rows = React54__default.useMemo(() => {
19450
+ const rows = React55__default.useMemo(() => {
19412
19451
  if (!sortable || !sort.field) return dataRows;
19413
19452
  const col = cols.find((c) => c.field === sort.field);
19414
19453
  if (!col) return dataRows;
@@ -19560,15 +19599,15 @@ function Tabs({
19560
19599
  }) {
19561
19600
  const vertical = orientation === "vertical";
19562
19601
  const __twcStyles = useScopedStyles("twc-tabs-styles", TABS_CSS);
19563
- const [internal, setInternal] = React54__default.useState(defaultValue ?? items[0]?.value);
19602
+ const [internal, setInternal] = React55__default.useState(defaultValue ?? items[0]?.value);
19564
19603
  const active = value ?? internal;
19565
- const listRef = React54__default.useRef(null);
19566
- const [ind, setInd] = React54__default.useState({ left: 0, width: 0, top: 0, height: 0 });
19567
- const baseId = React54__default.useId();
19604
+ const listRef = React55__default.useRef(null);
19605
+ const [ind, setInd] = React55__default.useState({ left: 0, width: 0, top: 0, height: 0 });
19606
+ const baseId = React55__default.useId();
19568
19607
  const tabIdAt = (i) => `${baseId}-tab-${i}`;
19569
19608
  const panelId = `${baseId}-panel`;
19570
19609
  const activeIndex = items.findIndex((it) => it.value === active);
19571
- const updateIndicator = React54__default.useCallback(() => {
19610
+ const updateIndicator = React55__default.useCallback(() => {
19572
19611
  const list = listRef.current;
19573
19612
  if (!list) return;
19574
19613
  const el = list.querySelector('[data-active="true"]');
@@ -19577,10 +19616,10 @@ function Tabs({
19577
19616
  if (!vertical) el.scrollIntoView?.({ inline: "nearest", block: "nearest" });
19578
19617
  }
19579
19618
  }, [vertical]);
19580
- React54__default.useEffect(() => {
19619
+ React55__default.useEffect(() => {
19581
19620
  updateIndicator();
19582
19621
  }, [active, updateIndicator, items, orientation]);
19583
- React54__default.useEffect(() => {
19622
+ React55__default.useEffect(() => {
19584
19623
  const r2 = () => updateIndicator();
19585
19624
  window.addEventListener("resize", r2);
19586
19625
  if (typeof document !== "undefined" && document.fonts && document.fonts.ready) {
@@ -19726,7 +19765,7 @@ function Tag({
19726
19765
  }, "aria-label": _removeLabel, type: "button", children: /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.4", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsx("path", { d: "M18 6 6 18M6 6l12 12" }) }) }) : null
19727
19766
  ] });
19728
19767
  }
19729
- var useIso = typeof document !== "undefined" ? React54__default.useLayoutEffect : React54__default.useEffect;
19768
+ var useIso = typeof document !== "undefined" ? React55__default.useLayoutEffect : React55__default.useEffect;
19730
19769
  var TEXTAREA_CSS = `
19731
19770
  .twc-field { display: flex; flex-direction: column; gap: var(--space-1-5); font-family: var(--font-sans); }
19732
19771
  .twc-field__label { font-size: var(--text-sm); font-weight: var(--font-semibold); color: var(--color-text); display: flex; gap: 4px; align-items: center; }
@@ -19775,7 +19814,7 @@ var TEXTAREA_CSS = `
19775
19814
  .twc-field__count { margin-inline-start: auto; font-size: var(--text-xs); color: var(--color-text-muted); font-variant-numeric: tabular-nums; flex: none; }
19776
19815
  .twc-field__count[data-danger="true"] { color: var(--color-danger-subtle-fg); }
19777
19816
  `;
19778
- var Textarea = React54__default.forwardRef(function Textarea2({
19817
+ var Textarea = /* @__PURE__ */ React55__default.forwardRef(function Textarea2({
19779
19818
  label,
19780
19819
  hint,
19781
19820
  error,
@@ -19794,19 +19833,19 @@ var Textarea = React54__default.forwardRef(function Textarea2({
19794
19833
  ...rest
19795
19834
  }, ref) {
19796
19835
  const __twcStyles = useScopedStyles("twc-textarea-styles", TEXTAREA_CSS);
19797
- const autoId = React54__default.useId();
19836
+ const autoId = React55__default.useId();
19798
19837
  const fieldId = id || autoId;
19799
19838
  const descId = `${fieldId}-desc`;
19800
19839
  const countId = `${fieldId}-count`;
19801
19840
  const invalid = Boolean(error);
19802
- const innerRef = React54__default.useRef(null);
19841
+ const innerRef = React55__default.useRef(null);
19803
19842
  const setRef = (el) => {
19804
19843
  innerRef.current = el;
19805
19844
  if (typeof ref === "function") ref(el);
19806
19845
  else if (ref) ref.current = el;
19807
19846
  };
19808
19847
  const countControlled = rest.value !== void 0;
19809
- const [len2, setLen] = React54__default.useState(() => String(rest.defaultValue ?? "").length);
19848
+ const [len2, setLen] = React55__default.useState(() => String(rest.defaultValue ?? "").length);
19810
19849
  const count = countControlled ? String(rest.value ?? "").length : len2;
19811
19850
  const max = rest.maxLength;
19812
19851
  const showCounter = showCount && max != null;
@@ -20008,19 +20047,19 @@ function Toast({
20008
20047
  }) {
20009
20048
  const resolvedTone = tone === "neutral" ? "default" : tone;
20010
20049
  const __twcStyles = useScopedStyles("twc-toast-styles", TOAST_CSS);
20011
- const onCloseRef = React54__default.useRef(onClose);
20012
- React54__default.useEffect(() => {
20050
+ const onCloseRef = React55__default.useRef(onClose);
20051
+ React55__default.useEffect(() => {
20013
20052
  onCloseRef.current = onClose;
20014
20053
  }, [onClose]);
20015
- const timer = React54__default.useRef();
20016
- const stop = React54__default.useCallback(() => clearTimeout(timer.current), []);
20017
- const start = React54__default.useCallback(() => {
20054
+ const timer = React55__default.useRef();
20055
+ const stop = React55__default.useCallback(() => clearTimeout(timer.current), []);
20056
+ const start = React55__default.useCallback(() => {
20018
20057
  stop();
20019
20058
  if (duration && duration !== Infinity && onCloseRef.current) {
20020
20059
  timer.current = setTimeout(() => onCloseRef.current && onCloseRef.current(), duration);
20021
20060
  }
20022
20061
  }, [duration, stop]);
20023
- React54__default.useEffect(() => {
20062
+ React55__default.useEffect(() => {
20024
20063
  start();
20025
20064
  return stop;
20026
20065
  }, [start, stop]);
@@ -20065,32 +20104,32 @@ function Toast({
20065
20104
  }
20066
20105
  function ToastViewport({ children, limit, className = "", ...rest }) {
20067
20106
  const __twcStyles = useScopedStyles("twc-toast-styles", TOAST_CSS);
20068
- const shown = limit && limit > 0 ? React54__default.Children.toArray(children).slice(-limit) : children;
20107
+ const shown = limit && limit > 0 ? React55__default.Children.toArray(children).slice(-limit) : children;
20069
20108
  return /* @__PURE__ */ jsxs("div", { className: `twc-toast-viewport ${className}`, role: "region", "aria-label": "Notifications", ...rest, children: [
20070
20109
  __twcStyles,
20071
20110
  shown
20072
20111
  ] });
20073
20112
  }
20074
- var ToastContext = React54__default.createContext(null);
20113
+ var ToastContext = React55__default.createContext(null);
20075
20114
  function useToast() {
20076
- const ctx = React54__default.useContext(ToastContext);
20115
+ const ctx = React55__default.useContext(ToastContext);
20077
20116
  if (!ctx) throw new Error("useToast must be used within a <ToastProvider>.");
20078
20117
  return ctx;
20079
20118
  }
20080
20119
  function ToastProvider({ children, limit = 4, duration = 4500, ...viewportProps }) {
20081
- const [toasts, setToasts] = React54__default.useState([]);
20082
- const [politeMsg, setPoliteMsg] = React54__default.useState("");
20083
- const [assertiveMsg, setAssertiveMsg] = React54__default.useState("");
20084
- const idRef = React54__default.useRef(0);
20085
- const limitRef = React54__default.useRef(limit);
20086
- React54__default.useEffect(() => {
20120
+ const [toasts, setToasts] = React55__default.useState([]);
20121
+ const [politeMsg, setPoliteMsg] = React55__default.useState("");
20122
+ const [assertiveMsg, setAssertiveMsg] = React55__default.useState("");
20123
+ const idRef = React55__default.useRef(0);
20124
+ const limitRef = React55__default.useRef(limit);
20125
+ React55__default.useEffect(() => {
20087
20126
  limitRef.current = limit;
20088
20127
  }, [limit]);
20089
- const dismiss = React54__default.useCallback((id) => {
20128
+ const dismiss = React55__default.useCallback((id) => {
20090
20129
  setToasts((s) => s.filter((t) => t.id !== id));
20091
20130
  }, []);
20092
- const clear = React54__default.useCallback(() => setToasts([]), []);
20093
- const api = React54__default.useMemo(() => {
20131
+ const clear = React55__default.useCallback(() => setToasts([]), []);
20132
+ const api = React55__default.useMemo(() => {
20094
20133
  const push = (opts) => {
20095
20134
  const id = idRef.current += 1;
20096
20135
  const next = typeof opts === "string" ? { title: opts } : opts && typeof opts === "object" ? opts : {};
@@ -20117,7 +20156,7 @@ function ToastProvider({ children, limit = 4, duration = 4500, ...viewportProps
20117
20156
  toast.show = withTone("default");
20118
20157
  return { toast, dismiss, clear };
20119
20158
  }, [dismiss, clear]);
20120
- const value = React54__default.useMemo(() => ({ ...api, toasts }), [api, toasts]);
20159
+ const value = React55__default.useMemo(() => ({ ...api, toasts }), [api, toasts]);
20121
20160
  return /* @__PURE__ */ jsxs(ToastContext.Provider, { value, children: [
20122
20161
  children,
20123
20162
  /* @__PURE__ */ jsx("div", { className: "twc-toast-sr", "aria-live": "polite", "aria-atomic": "true", children: politeMsg }),
@@ -20231,13 +20270,13 @@ function TreeView({
20231
20270
  }) {
20232
20271
  const nodes = items;
20233
20272
  const __twcStyles = useScopedStyles("twc-tree-styles", TREE_CSS);
20234
- const [expInternal, setExpInternal] = React54__default.useState(() => new Set(defaultExpanded));
20273
+ const [expInternal, setExpInternal] = React55__default.useState(() => new Set(defaultExpanded));
20235
20274
  const expanded = expandedProp !== void 0 ? new Set(expandedProp) : expInternal;
20236
- const [selInternal, setSelInternal] = React54__default.useState(defaultSelectedId);
20275
+ const [selInternal, setSelInternal] = React55__default.useState(defaultSelectedId);
20237
20276
  const selectedId = selectedProp !== void 0 ? selectedProp : selInternal;
20238
- const [focusId, setFocusId] = React54__default.useState(null);
20239
- const rowRefs = React54__default.useRef(/* @__PURE__ */ new Map());
20240
- const taRef = React54__default.useRef({ str: "", t: 0 });
20277
+ const [focusId, setFocusId] = React55__default.useState(null);
20278
+ const rowRefs = React55__default.useRef(/* @__PURE__ */ new Map());
20279
+ const taRef = React55__default.useRef({ str: "", t: 0 });
20241
20280
  const toggle = (id) => {
20242
20281
  const n = new Set(expanded);
20243
20282
  n.has(id) ? n.delete(id) : n.add(id);
@@ -20375,7 +20414,7 @@ function AppShell({
20375
20414
  ...rest
20376
20415
  }) {
20377
20416
  const __twcStyles = useScopedStyles("twc-shell-styles", SHELL_CSS);
20378
- const wiredSidebar = React54__default.isValidElement(sidebar) && (sidebarOpen !== void 0 || onSidebarOpenChange !== void 0) ? React54__default.cloneElement(sidebar, {
20417
+ const wiredSidebar = React55__default.isValidElement(sidebar) && (sidebarOpen !== void 0 || onSidebarOpenChange !== void 0) ? React55__default.cloneElement(sidebar, {
20379
20418
  overlay: sidebar.props.overlay !== void 0 ? sidebar.props.overlay : true,
20380
20419
  open: sidebar.props.open !== void 0 ? sidebar.props.open : sidebarOpen,
20381
20420
  onOpenChange: sidebar.props.onOpenChange !== void 0 ? sidebar.props.onOpenChange : onSidebarOpenChange
@@ -20410,7 +20449,7 @@ function safeHref9(url) {
20410
20449
  const s = String(url).replace(/[\x00-\x20]+/g, "").toLowerCase();
20411
20450
  return s.startsWith("javascript:") || s.startsWith("data:") || s.startsWith("vbscript:") ? void 0 : url;
20412
20451
  }
20413
- var Box = React54__default.forwardRef(function Box2({
20452
+ var Box = /* @__PURE__ */ React55__default.forwardRef(function Box2({
20414
20453
  as: Tag2 = "div",
20415
20454
  p,
20416
20455
  px,
@@ -20459,14 +20498,13 @@ var Box = React54__default.forwardRef(function Box2({
20459
20498
  children
20460
20499
  ] });
20461
20500
  });
20462
- Box.displayName = "Box";
20463
20501
  var SIZES = { sm: 640, md: 768, lg: 1024, xl: 1280, full: "100%" };
20464
20502
  function safeHref10(url) {
20465
20503
  if (url == null) return void 0;
20466
20504
  const s = String(url).replace(/[\x00-\x20]+/g, "").toLowerCase();
20467
20505
  return s.startsWith("javascript:") || s.startsWith("data:") || s.startsWith("vbscript:") ? void 0 : url;
20468
20506
  }
20469
- var Container = React54__default.forwardRef(function Container2({
20507
+ var Container = /* @__PURE__ */ React55__default.forwardRef(function Container2({
20470
20508
  as: Tag2 = "div",
20471
20509
  size = "lg",
20472
20510
  padded = true,
@@ -20503,7 +20541,6 @@ var Container = React54__default.forwardRef(function Container2({
20503
20541
  }
20504
20542
  );
20505
20543
  });
20506
- Container.displayName = "Container";
20507
20544
  function space2(v) {
20508
20545
  if (v == null) return void 0;
20509
20546
  if (typeof v === "number") return `var(--space-${String(v).replace(".", "-")})`;
@@ -20514,7 +20551,7 @@ function safeHref11(url) {
20514
20551
  const s = String(url).replace(/[\x00-\x20]+/g, "").toLowerCase();
20515
20552
  return s.startsWith("javascript:") || s.startsWith("data:") || s.startsWith("vbscript:") ? void 0 : url;
20516
20553
  }
20517
- var Stack = React54__default.forwardRef(function Stack2({
20554
+ var Stack = /* @__PURE__ */ React55__default.forwardRef(function Stack2({
20518
20555
  as: Tag2 = "div",
20519
20556
  direction = "column",
20520
20557
  gap = 4,
@@ -20538,7 +20575,7 @@ var Stack = React54__default.forwardRef(function Stack2({
20538
20575
  }, ref) {
20539
20576
  const { flatStyle, styleNode, sxAttr } = useSx(sx);
20540
20577
  if (Tag2 === "a" && rest.href != null) rest.href = safeHref11(rest.href);
20541
- const kids = divider != null ? React54__default.Children.toArray(children).flatMap((child, i, arr) => i < arr.length - 1 ? [child, /* @__PURE__ */ jsx(React54__default.Fragment, { children: divider }, `twc-stack-div-${i}`)] : [child]) : children;
20578
+ const kids = divider != null ? React55__default.Children.toArray(children).flatMap((child, i, arr) => i < arr.length - 1 ? [child, /* @__PURE__ */ jsx(React55__default.Fragment, { children: divider }, `twc-stack-div-${i}`)] : [child]) : children;
20542
20579
  return /* @__PURE__ */ jsxs(
20543
20580
  Tag2,
20544
20581
  {
@@ -20568,7 +20605,6 @@ var Stack = React54__default.forwardRef(function Stack2({
20568
20605
  }
20569
20606
  );
20570
20607
  });
20571
- Stack.displayName = "Stack";
20572
20608
  var CODE_CSS = `
20573
20609
  .twc-code {
20574
20610
  font-family: var(--font-mono); font-size: 0.875em;
@@ -20597,7 +20633,7 @@ function safeHref12(url) {
20597
20633
  const s = String(url).replace(/[\x00-\x20]+/g, "").toLowerCase();
20598
20634
  return s.startsWith("javascript:") || s.startsWith("data:") || s.startsWith("vbscript:") ? void 0 : url;
20599
20635
  }
20600
- function Code({
20636
+ var Code = /* @__PURE__ */ React55__default.forwardRef(function Code2({
20601
20637
  as,
20602
20638
  block = false,
20603
20639
  copyable = false,
@@ -20606,14 +20642,15 @@ function Code({
20606
20642
  className = "",
20607
20643
  children,
20608
20644
  ...rest
20609
- }) {
20645
+ }, ref) {
20610
20646
  const __twcStyles = useScopedStyles("twc-code-styles", CODE_CSS);
20611
20647
  const Tag2 = as ?? (block ? "pre" : "code");
20612
20648
  if (Tag2 === "a" && rest.href != null) rest.href = safeHref12(rest.href);
20613
- const rootRef = React54__default.useRef(null);
20614
- const [copied, setCopied] = React54__default.useState(false);
20615
- const timerRef = React54__default.useRef(null);
20616
- React54__default.useEffect(() => () => clearTimeout(timerRef.current), []);
20649
+ const rootRef = React55__default.useRef(null);
20650
+ const setRootRef = useMergedRef(rootRef, ref);
20651
+ const [copied, setCopied] = React55__default.useState(false);
20652
+ const timerRef = React55__default.useRef(null);
20653
+ React55__default.useEffect(() => () => clearTimeout(timerRef.current), []);
20617
20654
  const doCopy = () => {
20618
20655
  const text = typeof children === "string" ? children : rootRef.current?.textContent ?? "";
20619
20656
  const flash = () => {
@@ -20646,7 +20683,7 @@ function Code({
20646
20683
  }
20647
20684
  execFallback();
20648
20685
  };
20649
- return /* @__PURE__ */ jsxs(Tag2, { ref: rootRef, className: `twc-code ${className}`.trim(), "data-block": block || void 0, ...rest, children: [
20686
+ return /* @__PURE__ */ jsxs(Tag2, { ref: setRootRef, className: `twc-code ${className}`.trim(), "data-block": block || void 0, ...rest, children: [
20650
20687
  __twcStyles,
20651
20688
  copyable ? /* @__PURE__ */ jsx("button", { type: "button", className: "twc-code__copy", "aria-label": copied ? copiedLabel : copyLabel, onClick: doCopy, children: copied ? /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.4", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsx("path", { d: "m20 6-11 11-5-5" }) }) : /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
20652
20689
  /* @__PURE__ */ jsx("rect", { x: "9", y: "9", width: "13", height: "13", rx: "2" }),
@@ -20654,14 +20691,14 @@ function Code({
20654
20691
  ] }) }) : null,
20655
20692
  children
20656
20693
  ] });
20657
- }
20694
+ });
20658
20695
  var LEVEL_SIZE = { 1: "4xl", 2: "2xl", 3: "xl", 4: "lg", 5: "base", 6: "sm" };
20659
20696
  function safeHref13(url) {
20660
20697
  if (url == null) return void 0;
20661
20698
  const s = String(url).replace(/[\x00-\x20]+/g, "").toLowerCase();
20662
20699
  return s.startsWith("javascript:") || s.startsWith("data:") || s.startsWith("vbscript:") ? void 0 : url;
20663
20700
  }
20664
- var Heading = React54__default.forwardRef(function Heading2({
20701
+ var Heading = /* @__PURE__ */ React55__default.forwardRef(function Heading2({
20665
20702
  as,
20666
20703
  level = 2,
20667
20704
  size,
@@ -20709,7 +20746,6 @@ var Heading = React54__default.forwardRef(function Heading2({
20709
20746
  }
20710
20747
  );
20711
20748
  });
20712
- Heading.displayName = "Heading";
20713
20749
  var TONE = {
20714
20750
  default: "--color-text",
20715
20751
  muted: "--color-text-muted",
@@ -20730,7 +20766,7 @@ function safeHref14(url) {
20730
20766
  const s = String(url).replace(/[\x00-\x20]+/g, "").toLowerCase();
20731
20767
  return s.startsWith("javascript:") || s.startsWith("data:") || s.startsWith("vbscript:") ? void 0 : url;
20732
20768
  }
20733
- var Text = React54__default.forwardRef(function Text2({
20769
+ var Text = /* @__PURE__ */ React55__default.forwardRef(function Text2({
20734
20770
  as: Tag2 = "p",
20735
20771
  size = "base",
20736
20772
  tone = "default",
@@ -20776,47 +20812,46 @@ var Text = React54__default.forwardRef(function Text2({
20776
20812
  }
20777
20813
  );
20778
20814
  });
20779
- Text.displayName = "Text";
20780
20815
  var canUseDOM2 = typeof window !== "undefined" && typeof document !== "undefined";
20781
- var useIsomorphicLayoutEffect = canUseDOM2 ? React54__default.useLayoutEffect : React54__default.useEffect;
20816
+ var useIsomorphicLayoutEffect = canUseDOM2 ? React55__default.useLayoutEffect : React55__default.useEffect;
20782
20817
  function useMounted() {
20783
- const [mounted, setMounted] = React54__default.useState(false);
20784
- React54__default.useEffect(() => {
20818
+ const [mounted, setMounted] = React55__default.useState(false);
20819
+ React55__default.useEffect(() => {
20785
20820
  setMounted(true);
20786
20821
  }, []);
20787
20822
  return mounted;
20788
20823
  }
20789
20824
  function usePrevious(value) {
20790
- const ref = React54__default.useRef(void 0);
20791
- React54__default.useEffect(() => {
20825
+ const ref = React55__default.useRef(void 0);
20826
+ React55__default.useEffect(() => {
20792
20827
  ref.current = value;
20793
20828
  }, [value]);
20794
20829
  return ref.current;
20795
20830
  }
20796
20831
  function useToggle(initial = false) {
20797
- const [on, setOn] = React54__default.useState(initial);
20798
- const toggle = React54__default.useCallback((next) => {
20832
+ const [on, setOn] = React55__default.useState(initial);
20833
+ const toggle = React55__default.useCallback((next) => {
20799
20834
  setOn((prev) => typeof next === "boolean" ? next : !prev);
20800
20835
  }, []);
20801
20836
  return [on, toggle, setOn];
20802
20837
  }
20803
20838
  function useDisclosure(initial = false) {
20804
- const [open, setOpen] = React54__default.useState(initial);
20805
- const onOpen = React54__default.useCallback(() => setOpen(true), []);
20806
- const onClose = React54__default.useCallback(() => setOpen(false), []);
20807
- const onToggle = React54__default.useCallback(() => setOpen((p) => !p), []);
20839
+ const [open, setOpen] = React55__default.useState(initial);
20840
+ const onOpen = React55__default.useCallback(() => setOpen(true), []);
20841
+ const onClose = React55__default.useCallback(() => setOpen(false), []);
20842
+ const onToggle = React55__default.useCallback(() => setOpen((p) => !p), []);
20808
20843
  return { open, onOpen, onClose, onToggle, setOpen };
20809
20844
  }
20810
20845
  function useControllableState({ value, defaultValue, onChange } = {}) {
20811
20846
  const isControlled = value !== void 0;
20812
- const [uncontrolled, setUncontrolled] = React54__default.useState(defaultValue);
20847
+ const [uncontrolled, setUncontrolled] = React55__default.useState(defaultValue);
20813
20848
  const current = isControlled ? value : uncontrolled;
20814
- const ref = React54__default.useRef({ current, isControlled, onChange });
20849
+ const ref = React55__default.useRef({ current, isControlled, onChange });
20815
20850
  useIsomorphicLayoutEffect(() => {
20816
20851
  ref.current = { current, isControlled, onChange };
20817
20852
  });
20818
- const wasControlled = React54__default.useRef(isControlled);
20819
- React54__default.useEffect(() => {
20853
+ const wasControlled = React55__default.useRef(isControlled);
20854
+ React55__default.useEffect(() => {
20820
20855
  if (wasControlled.current !== isControlled) {
20821
20856
  warnOnce(
20822
20857
  "useControllableState:switch",
@@ -20825,7 +20860,7 @@ function useControllableState({ value, defaultValue, onChange } = {}) {
20825
20860
  wasControlled.current = isControlled;
20826
20861
  }
20827
20862
  });
20828
- const setValue = React54__default.useCallback((next) => {
20863
+ const setValue = React55__default.useCallback((next) => {
20829
20864
  const { current: cur, isControlled: ctrl, onChange: cb } = ref.current;
20830
20865
  const resolved = typeof next === "function" ? next(cur) : next;
20831
20866
  if (resolved === cur) return;
@@ -20836,7 +20871,7 @@ function useControllableState({ value, defaultValue, onChange } = {}) {
20836
20871
  }
20837
20872
  function useMediaQuery(query, { defaultValue = false, initializeWithValue = false } = {}) {
20838
20873
  const get = () => canUseDOM2 ? window.matchMedia(query).matches : defaultValue;
20839
- const [matches3, setMatches] = React54__default.useState(initializeWithValue ? get : defaultValue);
20874
+ const [matches3, setMatches] = React55__default.useState(initializeWithValue ? get : defaultValue);
20840
20875
  useIsomorphicLayoutEffect(() => {
20841
20876
  if (!canUseDOM2) return void 0;
20842
20877
  const mql = window.matchMedia(query);
@@ -20852,7 +20887,7 @@ function usePrefersReducedMotion() {
20852
20887
  }
20853
20888
  function useColorScheme({ storageKey = "twico-theme", attribute = "class", element, disableTransitionsOnChange = true, initializeWithValue = false } = {}) {
20854
20889
  const getTarget = () => element || (canUseDOM2 ? document.documentElement : null);
20855
- const firstApply = React54__default.useRef(true);
20890
+ const firstApply = React55__default.useRef(true);
20856
20891
  const read = () => {
20857
20892
  if (!canUseDOM2) return "light";
20858
20893
  try {
@@ -20862,8 +20897,8 @@ function useColorScheme({ storageKey = "twico-theme", attribute = "class", eleme
20862
20897
  }
20863
20898
  return window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
20864
20899
  };
20865
- const [theme, setThemeState] = React54__default.useState(initializeWithValue ? read : "light");
20866
- const apply = React54__default.useCallback(
20900
+ const [theme, setThemeState] = React55__default.useState(initializeWithValue ? read : "light");
20901
+ const apply = React55__default.useCallback(
20867
20902
  (t) => {
20868
20903
  const target = getTarget();
20869
20904
  if (!target) return;
@@ -20886,7 +20921,7 @@ function useColorScheme({ storageKey = "twico-theme", attribute = "class", eleme
20886
20921
  },
20887
20922
  [attribute, element, disableTransitionsOnChange]
20888
20923
  );
20889
- const resolved = React54__default.useRef(false);
20924
+ const resolved = React55__default.useRef(false);
20890
20925
  useIsomorphicLayoutEffect(() => {
20891
20926
  if (!resolved.current) {
20892
20927
  resolved.current = true;
@@ -20899,11 +20934,11 @@ function useColorScheme({ storageKey = "twico-theme", attribute = "class", eleme
20899
20934
  }
20900
20935
  apply(theme);
20901
20936
  }, [theme, apply]);
20902
- const themeRef = React54__default.useRef(theme);
20937
+ const themeRef = React55__default.useRef(theme);
20903
20938
  useIsomorphicLayoutEffect(() => {
20904
20939
  themeRef.current = theme;
20905
20940
  }, [theme]);
20906
- const setTheme = React54__default.useCallback(
20941
+ const setTheme = React55__default.useCallback(
20907
20942
  (t) => {
20908
20943
  setThemeState(t);
20909
20944
  try {
@@ -20914,10 +20949,10 @@ function useColorScheme({ storageKey = "twico-theme", attribute = "class", eleme
20914
20949
  },
20915
20950
  [storageKey]
20916
20951
  );
20917
- const toggle = React54__default.useCallback(() => {
20952
+ const toggle = React55__default.useCallback(() => {
20918
20953
  setTheme(themeRef.current === "dark" ? "light" : "dark");
20919
20954
  }, [setTheme]);
20920
- React54__default.useEffect(() => {
20955
+ React55__default.useEffect(() => {
20921
20956
  if (!canUseDOM2) return void 0;
20922
20957
  const sync = () => setThemeState(read());
20923
20958
  const onStorage = (e) => {
@@ -20933,14 +20968,14 @@ function useColorScheme({ storageKey = "twico-theme", attribute = "class", eleme
20933
20968
  return { theme, setTheme, toggle, isDark: theme === "dark" };
20934
20969
  }
20935
20970
  function useEventListener(eventName, handler, element, options) {
20936
- const saved = React54__default.useRef(handler);
20971
+ const saved = React55__default.useRef(handler);
20937
20972
  useIsomorphicLayoutEffect(() => {
20938
20973
  saved.current = handler;
20939
20974
  }, [handler]);
20940
20975
  const capture = typeof options === "boolean" ? options : options && options.capture;
20941
20976
  const passive = typeof options === "object" && options ? options.passive : void 0;
20942
20977
  const once = typeof options === "object" && options ? options.once : void 0;
20943
- React54__default.useEffect(() => {
20978
+ React55__default.useEffect(() => {
20944
20979
  const target = element && element.current || element || (canUseDOM2 ? window : null);
20945
20980
  if (!target || !target.addEventListener) return void 0;
20946
20981
  const opts = typeof options === "boolean" ? options : { capture, passive, once };
@@ -20950,11 +20985,11 @@ function useEventListener(eventName, handler, element, options) {
20950
20985
  }, [eventName, element, capture, passive, once]);
20951
20986
  }
20952
20987
  function useClickOutside(ref, handler, events = ["mousedown", "touchstart"]) {
20953
- const saved = React54__default.useRef(handler);
20988
+ const saved = React55__default.useRef(handler);
20954
20989
  useIsomorphicLayoutEffect(() => {
20955
20990
  saved.current = handler;
20956
20991
  }, [handler]);
20957
- React54__default.useEffect(() => {
20992
+ React55__default.useEffect(() => {
20958
20993
  if (!canUseDOM2) return void 0;
20959
20994
  const listener = (e) => {
20960
20995
  const el = ref && ref.current;
@@ -20989,12 +21024,12 @@ function useLocalStorage(key, initialValue, { initializeWithValue = false } = {}
20989
21024
  return initialValue;
20990
21025
  }
20991
21026
  };
20992
- const [stored, setStored] = React54__default.useState(initializeWithValue ? read : initialValue);
21027
+ const [stored, setStored] = React55__default.useState(initializeWithValue ? read : initialValue);
20993
21028
  useIsomorphicLayoutEffect(() => {
20994
21029
  if (!canUseDOM2) return;
20995
21030
  setStored(read());
20996
21031
  }, [key]);
20997
- const setValue = React54__default.useCallback(
21032
+ const setValue = React55__default.useCallback(
20998
21033
  (value) => {
20999
21034
  setStored((prev) => {
21000
21035
  const next = typeof value === "function" ? value(prev) : value;
@@ -21033,9 +21068,9 @@ function legacyCopy(text) {
21033
21068
  }
21034
21069
  }
21035
21070
  function useCopyToClipboard(timeout = 1500) {
21036
- const [copied, setCopied] = React54__default.useState(false);
21037
- const [copyTick, setCopyTick] = React54__default.useState(0);
21038
- const copy = React54__default.useCallback(async (text) => {
21071
+ const [copied, setCopied] = React55__default.useState(false);
21072
+ const [copyTick, setCopyTick] = React55__default.useState(0);
21073
+ const copy = React55__default.useCallback(async (text) => {
21039
21074
  if (!canUseDOM2) {
21040
21075
  setCopied(false);
21041
21076
  return false;
@@ -21054,7 +21089,7 @@ function useCopyToClipboard(timeout = 1500) {
21054
21089
  if (ok) setCopyTick((t) => t + 1);
21055
21090
  return ok;
21056
21091
  }, []);
21057
- React54__default.useEffect(() => {
21092
+ React55__default.useEffect(() => {
21058
21093
  if (!copied) return void 0;
21059
21094
  const t = setTimeout(() => setCopied(false), timeout);
21060
21095
  return () => clearTimeout(t);
@@ -21062,23 +21097,23 @@ function useCopyToClipboard(timeout = 1500) {
21062
21097
  return { copied, copy };
21063
21098
  }
21064
21099
  function useDebouncedValue(value, delay = 200) {
21065
- const [debounced, setDebounced] = React54__default.useState(value);
21066
- React54__default.useEffect(() => {
21100
+ const [debounced, setDebounced] = React55__default.useState(value);
21101
+ React55__default.useEffect(() => {
21067
21102
  const t = setTimeout(() => setDebounced(value), delay);
21068
21103
  return () => clearTimeout(t);
21069
21104
  }, [value, delay]);
21070
21105
  return debounced;
21071
21106
  }
21072
21107
  function useDebouncedCallback(callback, delay = 200) {
21073
- const saved = React54__default.useRef(callback);
21074
- const timer = React54__default.useRef(null);
21108
+ const saved = React55__default.useRef(callback);
21109
+ const timer = React55__default.useRef(null);
21075
21110
  useIsomorphicLayoutEffect(() => {
21076
21111
  saved.current = callback;
21077
21112
  }, [callback]);
21078
- React54__default.useEffect(() => () => {
21113
+ React55__default.useEffect(() => () => {
21079
21114
  if (timer.current) clearTimeout(timer.current);
21080
21115
  }, []);
21081
- return React54__default.useCallback(
21116
+ return React55__default.useCallback(
21082
21117
  (...args) => {
21083
21118
  if (timer.current) clearTimeout(timer.current);
21084
21119
  timer.current = setTimeout(() => saved.current(...args), delay);
@@ -21087,22 +21122,22 @@ function useDebouncedCallback(callback, delay = 200) {
21087
21122
  );
21088
21123
  }
21089
21124
  function useInterval(callback, delay) {
21090
- const saved = React54__default.useRef(callback);
21125
+ const saved = React55__default.useRef(callback);
21091
21126
  useIsomorphicLayoutEffect(() => {
21092
21127
  saved.current = callback;
21093
21128
  }, [callback]);
21094
- React54__default.useEffect(() => {
21129
+ React55__default.useEffect(() => {
21095
21130
  if (delay == null) return void 0;
21096
21131
  const id = setInterval(() => saved.current(), delay);
21097
21132
  return () => clearInterval(id);
21098
21133
  }, [delay]);
21099
21134
  }
21100
21135
  function useTimeout(callback, delay) {
21101
- const saved = React54__default.useRef(callback);
21136
+ const saved = React55__default.useRef(callback);
21102
21137
  useIsomorphicLayoutEffect(() => {
21103
21138
  saved.current = callback;
21104
21139
  }, [callback]);
21105
- React54__default.useEffect(() => {
21140
+ React55__default.useEffect(() => {
21106
21141
  if (delay == null) return void 0;
21107
21142
  const id = setTimeout(() => saved.current(), delay);
21108
21143
  return () => clearTimeout(id);
@@ -21113,7 +21148,7 @@ function useWindowSize({ initializeWithValue = false } = {}) {
21113
21148
  width: canUseDOM2 ? window.innerWidth : 0,
21114
21149
  height: canUseDOM2 ? window.innerHeight : 0
21115
21150
  });
21116
- const [size, setSize] = React54__default.useState(initializeWithValue ? get : { width: 0, height: 0 });
21151
+ const [size, setSize] = React55__default.useState(initializeWithValue ? get : { width: 0, height: 0 });
21117
21152
  useIsomorphicLayoutEffect(() => {
21118
21153
  if (!canUseDOM2) return void 0;
21119
21154
  const onResize = () => setSize({ width: window.innerWidth, height: window.innerHeight });
@@ -21124,8 +21159,8 @@ function useWindowSize({ initializeWithValue = false } = {}) {
21124
21159
  return size;
21125
21160
  }
21126
21161
  function useHover(ref) {
21127
- const [hovered, setHovered] = React54__default.useState(false);
21128
- React54__default.useEffect(() => {
21162
+ const [hovered, setHovered] = React55__default.useState(false);
21163
+ React55__default.useEffect(() => {
21129
21164
  const el = ref && ref.current;
21130
21165
  if (!el) return void 0;
21131
21166
  const on = () => setHovered(true);
@@ -21141,8 +21176,8 @@ function useHover(ref) {
21141
21176
  }
21142
21177
  function useIntersectionObserver(ref, options = {}) {
21143
21178
  const { root = null, rootMargin = "0px", threshold = 0 } = options;
21144
- const [entry, setEntry] = React54__default.useState(null);
21145
- React54__default.useEffect(() => {
21179
+ const [entry, setEntry] = React55__default.useState(null);
21180
+ React55__default.useEffect(() => {
21146
21181
  const el = ref && ref.current;
21147
21182
  if (!canUseDOM2 || !el || typeof IntersectionObserver === "undefined") return void 0;
21148
21183
  const obs = new IntersectionObserver(([e]) => setEntry(e), { root, rootMargin, threshold });
@@ -21152,20 +21187,20 @@ function useIntersectionObserver(ref, options = {}) {
21152
21187
  return entry;
21153
21188
  }
21154
21189
  function useId(prefix = "twc") {
21155
- const raw = React54__default.useId();
21190
+ const raw = React55__default.useId();
21156
21191
  return prefix ? `${prefix}-${raw.replace(/:/g, "")}` : raw;
21157
21192
  }
21158
21193
  var useFocusTrap2 = useFocusTrap;
21159
21194
  var usePortal2 = usePortal;
21160
21195
  var useScrollLock2 = useScrollLock;
21161
21196
  function useFilePicker({ accept, multiple = false, maxSize, maxFiles, onFiles, onReject } = {}) {
21162
- const inputRef = React54__default.useRef(null);
21163
- const cbRef = React54__default.useRef({ onFiles, onReject });
21197
+ const inputRef = React55__default.useRef(null);
21198
+ const cbRef = React55__default.useRef({ onFiles, onReject });
21164
21199
  cbRef.current = { onFiles, onReject };
21165
- const open = React54__default.useCallback(() => {
21200
+ const open = React55__default.useCallback(() => {
21166
21201
  inputRef.current?.click();
21167
21202
  }, []);
21168
- const getInputProps = React54__default.useCallback(() => ({
21203
+ const getInputProps = React55__default.useCallback(() => ({
21169
21204
  ref: inputRef,
21170
21205
  type: "file",
21171
21206
  accept,