npm - @tensor_1/react - Versions diffs - 2.45.0 → 2.46.0 - Mend

@tensor_1/react 2.45.0 → 2.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 (15) hide show

package/README.md +19 -1
package/dist/components/CommandPalette.d.ts +4 -0
package/dist/components/CommandPalette.js +10 -2
package/dist/components/Meter.js +1 -1
package/dist/components/Modal.d.ts +6 -1
package/dist/components/Modal.js +2 -0
package/dist/components/Progress.js +1 -1
package/dist/components/RelationshipGraphLayered.js +16 -14
package/dist/hooks/useReducedMotion.d.ts +6 -0
package/dist/hooks/useReducedMotion.js +20 -0
package/dist/index.cjs +797 -764
package/dist/index.d.cts +16 -2
package/dist/index.d.ts +1 -0
package/dist/index.js +3 -0
package/package.json +1 -1

package/dist/index.cjs CHANGED Viewed

@@ -321,6 +321,7 @@ __export(src_exports, {
   placeSpan: () => placeSpan,
   placesInTopLane: () => placesInTopLane,
   predictionBand: () => predictionBand,
+  prefersReducedMotion: () => prefersReducedMotion,
   proposeMove: () => proposeMove,
   quantiles: () => quantiles,
   rankOverflow: () => rankOverflow,
@@ -367,6 +368,7 @@ __export(src_exports, {
   treeNav: () => treeNav,
   useAnchoredPosition: () => useAnchoredPosition,
   useDialog: () => useDialog,
+  useReducedMotion: () => useReducedMotion,
   useTable: () => useTable,
   useUixLabels: () => useUixLabels,
   useVirtualRows: () => useVirtualRows,
@@ -1138,8 +1140,25 @@ function useAnchoredPosition(anchor, floatingRef, { open, placement = "bottom-st
   return reposition;
 }
+// src/hooks/useReducedMotion.ts
+var import_react5 = require("react");
+var QUERY = "(prefers-reduced-motion: reduce)";
+function subscribe(onChange) {
+  if (typeof matchMedia === "undefined") return () => {
+  };
+  const mql = matchMedia(QUERY);
+  mql.addEventListener("change", onChange);
+  return () => mql.removeEventListener("change", onChange);
+}
+function prefersReducedMotion() {
+  return typeof matchMedia !== "undefined" && matchMedia(QUERY).matches;
+}
+function useReducedMotion() {
+  return (0, import_react5.useSyncExternalStore)(subscribe, prefersReducedMotion, () => false);
+}
 // src/components/Button.tsx
-var import_react7 = require("react");
+var import_react8 = require("react");
 // src/link.tsx
 var import_jsx_runtime = require("react/jsx-runtime");
@@ -1149,11 +1168,11 @@ function renderUixLink(renderLink, props) {
 }
 // src/components/ShortcutHint.tsx
-var import_react6 = require("react");
+var import_react7 = require("react");
 var import_react_dom = require("react-dom");
 // src/components/Kbd.tsx
-var import_react5 = require("react");
+var import_react6 = require("react");
 var import_jsx_runtime2 = require("react/jsx-runtime");
 function Kbd({ className, children, ...props }) {
   return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("kbd", { className: cx("uix-kbd", className), ...props, children });
@@ -1186,7 +1205,7 @@ var noSubscription = () => () => {
 };
 var serverPlatform = () => "other";
 function useKbdPlatform(platform) {
-  const detected = (0, import_react5.useSyncExternalStore)(noSubscription, detectPlatform, serverPlatform);
+  const detected = (0, import_react6.useSyncExternalStore)(noSubscription, detectPlatform, serverPlatform);
   return platform ?? detected;
 }
 var ARIA_KEYS = {
@@ -1215,7 +1234,7 @@ function KbdCombo({ keys, platform, keyLabels, className, ...props }) {
 // src/components/ShortcutHint.tsx
 var import_jsx_runtime3 = require("react/jsx-runtime");
-var useIsomorphicLayoutEffect2 = typeof document !== "undefined" ? import_react6.useLayoutEffect : import_react6.useEffect;
+var useIsomorphicLayoutEffect2 = typeof document !== "undefined" ? import_react7.useLayoutEffect : import_react7.useEffect;
 var isShown = (el) => {
   try {
     return !!el?.matches(":popover-open");
@@ -1232,11 +1251,11 @@ var focusVisible = (el) => {
 };
 var stop = (event) => event.stopPropagation();
 function ShortcutHint({ keys, label, ownsAria }) {
-  const markerRef = (0, import_react6.useRef)(null);
-  const bubbleRef = (0, import_react6.useRef)(null);
-  const anchorRef = (0, import_react6.useRef)(null);
-  const [host, setHost] = (0, import_react6.useState)(null);
-  const [open, setOpen] = (0, import_react6.useState)(false);
+  const markerRef = (0, import_react7.useRef)(null);
+  const bubbleRef = (0, import_react7.useRef)(null);
+  const anchorRef = (0, import_react7.useRef)(null);
+  const [host, setHost] = (0, import_react7.useState)(null);
+  const [open, setOpen] = (0, import_react7.useState)(false);
   const platform = useKbdPlatform();
   const shortcuts = ariaKeyShortcuts(keys, platform);
   useAnchoredPosition(anchorRef, bubbleRef, { open, placement: "top", offset: 6 });
@@ -1260,7 +1279,7 @@ function ShortcutHint({ keys, label, ownsAria }) {
     }
     setHost(button.closest("dialog") ?? button.ownerDocument.body);
   }, []);
-  (0, import_react6.useEffect)(() => {
+  (0, import_react7.useEffect)(() => {
     const button = anchorRef.current;
     const bubble = bubbleRef.current;
     if (!host || !button || !bubble) return void 0;
@@ -1367,7 +1386,7 @@ var buttonClasses = (variant, size, icon, wrap, className) => cx(
   className
 );
 var warnedIconButton = false;
-var Button = (0, import_react7.forwardRef)(
+var Button = (0, import_react8.forwardRef)(
   ({ variant = "secondary", size = "md", icon = false, loading = false, wrap = false, shortcut, className, children, disabled, onClick, ...props }, ref) => {
     if (!warnedIconButton && icon && children == null && !props["aria-label"] && !props["aria-labelledby"] && typeof process !== "undefined" && process.env.NODE_ENV !== "production") {
       warnedIconButton = true;
@@ -1411,12 +1430,12 @@ function ButtonGroup({ children, className }) {
 }
 // src/labels-context.tsx
-var import_react8 = require("react");
+var import_react9 = require("react");
 var import_jsx_runtime5 = require("react/jsx-runtime");
-var UixLabelsContext = (0, import_react8.createContext)({});
+var UixLabelsContext = (0, import_react9.createContext)({});
 function UixLabelsProvider({ labels, children }) {
-  const parent = (0, import_react8.useContext)(UixLabelsContext);
-  const value = (0, import_react8.useMemo)(() => {
+  const parent = (0, import_react9.useContext)(UixLabelsContext);
+  const value = (0, import_react9.useMemo)(() => {
     const merged = { ...parent };
     for (const [key, entry] of Object.entries(labels)) {
       const inherited = parent[key];
@@ -1427,13 +1446,13 @@ function UixLabelsProvider({ labels, children }) {
   return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(UixLabelsContext.Provider, { value, children });
 }
 function useUixLabels() {
-  return (0, import_react8.useContext)(UixLabelsContext);
+  return (0, import_react9.useContext)(UixLabelsContext);
 }
 // src/components/Input.tsx
-var import_react9 = require("react");
+var import_react10 = require("react");
 var import_jsx_runtime6 = require("react/jsx-runtime");
-var Input = (0, import_react9.forwardRef)(
+var Input = (0, import_react10.forwardRef)(
   ({ size = "md", invalid, valid, warning, className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
     "input",
     {
@@ -1457,7 +1476,7 @@ function InputGroup({
   "aria-invalid": invalid,
   "aria-required": required
 }) {
-  const control = (0, import_react9.isValidElement)(children) && (id ?? describedBy ?? invalid ?? required) != null ? (0, import_react9.cloneElement)(children, {
+  const control = (0, import_react10.isValidElement)(children) && (id ?? describedBy ?? invalid ?? required) != null ? (0, import_react10.cloneElement)(children, {
     id: children.props.id ?? id,
     "aria-describedby": children.props["aria-describedby"] ?? describedBy,
     "aria-invalid": children.props["aria-invalid"] ?? invalid,
@@ -1482,7 +1501,7 @@ function InputGroup({
 }
 // src/components/Combobox.tsx
-var import_react10 = require("react");
+var import_react11 = require("react");
 // src/combobox-model.ts
 function filterComboboxOptions(options, query) {
@@ -1508,18 +1527,18 @@ function Combobox({
   className,
   ...props
 }) {
-  const generatedId = (0, import_react10.useId)();
+  const generatedId = (0, import_react11.useId)();
   const listboxId = `${generatedId}-listbox`;
-  const rootRef = (0, import_react10.useRef)(null);
-  const [internalValue, setInternalValue] = (0, import_react10.useState)(defaultValue ?? "");
+  const rootRef = (0, import_react11.useRef)(null);
+  const [internalValue, setInternalValue] = (0, import_react11.useState)(defaultValue ?? "");
   const selectedValue = value ?? internalValue;
   const selected = options.find((option) => option.value === selectedValue);
-  const [query, setQuery] = (0, import_react10.useState)(selected?.label ?? "");
-  const [open, setOpen] = (0, import_react10.useState)(false);
-  const [activeIndex, setActiveIndex] = (0, import_react10.useState)(0);
-  const filtered = (0, import_react10.useMemo)(() => filterComboboxOptions(options, open ? query : ""), [open, options, query]);
+  const [query, setQuery] = (0, import_react11.useState)(selected?.label ?? "");
+  const [open, setOpen] = (0, import_react11.useState)(false);
+  const [activeIndex, setActiveIndex] = (0, import_react11.useState)(0);
+  const filtered = (0, import_react11.useMemo)(() => filterComboboxOptions(options, open ? query : ""), [open, options, query]);
   const activeOption = filtered[activeIndex];
-  (0, import_react10.useEffect)(() => {
+  (0, import_react11.useEffect)(() => {
     if (!open) setQuery(options.find((option) => option.value === selectedValue)?.label ?? "");
   }, [open, options, selectedValue]);
   const select = (option) => {
@@ -1609,7 +1628,7 @@ function Combobox({
 }
 // src/components/SearchSuggest.tsx
-var import_react11 = require("react");
+var import_react12 = require("react");
 // src/search-suggest-model.ts
 var COMBINING_MARK = /\p{M}/u;
@@ -1710,7 +1729,7 @@ function Emphasised({ text, query }) {
   ) });
 }
 var keepFocus = (event) => event.preventDefault();
-var useIsomorphicLayoutEffect3 = typeof document !== "undefined" ? import_react11.useLayoutEffect : import_react11.useEffect;
+var useIsomorphicLayoutEffect3 = typeof document !== "undefined" ? import_react12.useLayoutEffect : import_react12.useEffect;
 function SearchSuggest({
   value,
   onValueChange,
@@ -1746,31 +1765,31 @@ function SearchSuggest({
 }) {
   const uixLabels = useUixLabels();
   const clearLabel = clearLabelProp ?? uixLabels.searchSuggest?.clear ?? "Clear search";
-  const id = (0, import_react11.useId)();
+  const id = (0, import_react12.useId)();
   const listboxId = `${id}-listbox`;
   const headingId = `${id}-heading`;
-  const rootRef = (0, import_react11.useRef)(null);
-  const fieldRef = (0, import_react11.useRef)(null);
-  (0, import_react11.useImperativeHandle)(inputRef, () => fieldRef.current, []);
-  const [openState, setOpenState] = (0, import_react11.useState)(false);
+  const rootRef = (0, import_react12.useRef)(null);
+  const fieldRef = (0, import_react12.useRef)(null);
+  (0, import_react12.useImperativeHandle)(inputRef, () => fieldRef.current, []);
+  const [openState, setOpenState] = (0, import_react12.useState)(false);
   const open = openProp ?? openState;
   const setOpen = (next) => {
     if (openProp === void 0) setOpenState(next);
     if (next !== open) onOpenChange?.(next);
   };
-  const [focused, setFocused] = (0, import_react11.useState)(false);
-  const [activeState, setActive] = (0, import_react11.useState)(-1);
+  const [focused, setFocused] = (0, import_react12.useState)(false);
+  const [activeState, setActive] = (0, import_react12.useState)(-1);
   const itemCount = options.length + (footer ? 1 : 0);
   const active = activeState < itemCount ? activeState : -1;
   const optionKey = options.map((option) => option.id).join("|");
-  (0, import_react11.useEffect)(() => setActive(-1), [optionKey]);
+  (0, import_react12.useEffect)(() => setActive(-1), [optionKey]);
   const hasText = value.trim().length > 0;
   const showEmpty = hasText && !loading && !error && options.length === 0 && empty != null;
   const showLoading = loading && options.length === 0;
   const showIdle = idle != null && itemCount === 0 && !loading && error == null && !showEmpty;
   const visible = open && (itemCount > 0 || showLoading || showEmpty || showIdle || error != null);
   const optionId = (index) => `${id}-option-${index}`;
-  (0, import_react11.useEffect)(() => {
+  (0, import_react12.useEffect)(() => {
     if (!visible || active < 0) return;
     const node = document.getElementById(optionId(active));
     node?.scrollIntoView?.({ block: "nearest" });
@@ -1853,8 +1872,8 @@ function SearchSuggest({
     fieldRef.current?.focus();
   };
   const activeId = visible && active >= 0 ? optionId(active) : void 0;
-  const fieldBoxRef = (0, import_react11.useRef)(null);
-  const popupRef = (0, import_react11.useRef)(null);
+  const fieldBoxRef = (0, import_react12.useRef)(null);
+  const popupRef = (0, import_react12.useRef)(null);
   const floating = strategy === "fixed";
   useIsomorphicLayoutEffect3(() => {
     const popup = popupRef.current;
@@ -2001,7 +2020,7 @@ function SearchSuggest({
 }
 // src/components/SearchBar.tsx
-var import_react12 = require("react");
+var import_react13 = require("react");
 var import_jsx_runtime10 = require("react/jsx-runtime");
 var DEFAULT_SEARCH_BAR_LABELS = { clear: "Clear search", submit: "Search" };
 var SearchIcon2 = () => /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", focusable: "false", children: [
@@ -2033,11 +2052,11 @@ function SearchBar({
 }) {
   const uixLabels = useUixLabels();
   const labels = { ...DEFAULT_SEARCH_BAR_LABELS, ...uixLabels.searchBar, ...labelsProp };
-  const id = (0, import_react12.useId)();
+  const id = (0, import_react13.useId)();
   const fieldId = inputId ?? `${id}-field`;
   const labelId = `${id}-label`;
-  const field = (0, import_react12.useRef)(null);
-  const [own, setOwn] = (0, import_react12.useState)(defaultValue);
+  const field = (0, import_react13.useRef)(null);
+  const [own, setOwn] = (0, import_react13.useState)(defaultValue);
   const value = valueProp ?? own;
   const change = (next) => {
     setOwn(next);
@@ -2059,7 +2078,7 @@ function SearchBar({
       clear();
     }
   };
-  const setField = (0, import_react12.useCallback)((node) => {
+  const setField = (0, import_react13.useCallback)((node) => {
     field.current = node;
     if (typeof inputRef === "function") inputRef(node);
     else if (inputRef) inputRef.current = node;
@@ -2113,7 +2132,7 @@ function SearchBar({
 }
 // src/components/EntityPicker.tsx
-var import_react13 = require("react");
+var import_react14 = require("react");
 // src/fill-label.ts
 function fillLabel(template, values) {
@@ -2158,21 +2177,21 @@ function EntityPicker({
   className
 }) {
   const labels = { ...DEFAULT_ENTITY_PICKER_LABELS, ...useUixLabels().entityPicker, ...labelOverrides };
-  const [editing, setEditing] = (0, import_react13.useState)(value == null);
-  const [query, setQuery] = (0, import_react13.useState)("");
-  const [results, setResults] = (0, import_react13.useState)([]);
-  const [hasMore, setHasMore] = (0, import_react13.useState)(false);
-  const [status, setStatus] = (0, import_react13.useState)("idle");
-  const [attempt, setAttempt] = (0, import_react13.useState)(0);
-  const latest = (0, import_react13.useRef)(0);
-  const inputRef = (0, import_react13.useRef)(null);
-  const valueButtonRef = (0, import_react13.useRef)(null);
-  const returnFocus = (0, import_react13.useRef)(false);
-  (0, import_react13.useEffect)(() => {
+  const [editing, setEditing] = (0, import_react14.useState)(value == null);
+  const [query, setQuery] = (0, import_react14.useState)("");
+  const [results, setResults] = (0, import_react14.useState)([]);
+  const [hasMore, setHasMore] = (0, import_react14.useState)(false);
+  const [status, setStatus] = (0, import_react14.useState)("idle");
+  const [attempt, setAttempt] = (0, import_react14.useState)(0);
+  const latest = (0, import_react14.useRef)(0);
+  const inputRef = (0, import_react14.useRef)(null);
+  const valueButtonRef = (0, import_react14.useRef)(null);
+  const returnFocus = (0, import_react14.useRef)(false);
+  (0, import_react14.useEffect)(() => {
     if (value) setEditing(false);
     else setEditing(true);
   }, [value?.id]);
-  (0, import_react13.useEffect)(() => {
+  (0, import_react14.useEffect)(() => {
     if (!editing || disabled) return;
     const q = query.trim();
     if (q.length < minQueryLength) {
@@ -2203,7 +2222,7 @@ function EntityPicker({
     }, delay);
     return () => window.clearTimeout(timer);
   }, [editing, query, attempt, minQueryLength, delay, disabled]);
-  (0, import_react13.useEffect)(() => {
+  (0, import_react14.useEffect)(() => {
     if (!returnFocus.current) return;
     returnFocus.current = false;
     (editing ? inputRef.current : valueButtonRef.current)?.focus();
@@ -2296,9 +2315,9 @@ function EntityPicker({
 }
 // src/components/Textarea.tsx
-var import_react14 = require("react");
+var import_react15 = require("react");
 var import_jsx_runtime12 = require("react/jsx-runtime");
-var Textarea = (0, import_react14.forwardRef)(
+var Textarea = (0, import_react15.forwardRef)(
   ({ invalid, className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
     "textarea",
     {
@@ -2312,15 +2331,15 @@ var Textarea = (0, import_react14.forwardRef)(
 Textarea.displayName = "Textarea";
 // src/components/InlineEdit.tsx
-var import_react16 = require("react");
+var import_react17 = require("react");
 // src/icons/Icon.tsx
-var import_react15 = require("react");
+var import_react16 = require("react");
 var SIZES = /* @__PURE__ */ new Set(["sm", "md", "lg"]);
 function renderIcon(node, { size = "md", tone = "current", label, strokeWidth = 2, className, style, ...rest }, ref) {
   const tokenSize = typeof size === "string" && SIZES.has(size);
   const length = typeof size === "number" ? `${size}px` : tokenSize ? void 0 : size;
-  return (0, import_react15.createElement)(
+  return (0, import_react16.createElement)(
     "svg",
     {
       ref,
@@ -2339,11 +2358,11 @@ function renderIcon(node, { size = "md", tone = "current", label, strokeWidth =
       "aria-hidden": label ? void 0 : true,
       ...rest
     },
-    node.map(([tag, attrs], i) => (0, import_react15.createElement)(tag, { key: i, ...attrs }))
+    node.map(([tag, attrs], i) => (0, import_react16.createElement)(tag, { key: i, ...attrs }))
   );
 }
 function createIcon(displayName, node) {
-  const Component = (0, import_react15.forwardRef)((props, ref) => renderIcon(node, props, ref));
+  const Component = (0, import_react16.forwardRef)((props, ref) => renderIcon(node, props, ref));
   Component.displayName = displayName;
   return Component;
 }
@@ -2413,24 +2432,24 @@ function InlineEdit({
   className
 }) {
   const labels = { ...DEFAULT_INLINE_EDIT_LABELS, ...useUixLabels().inlineEdit, ...labelOverrides };
-  const id = (0, import_react16.useId)();
+  const id = (0, import_react17.useId)();
   const errorId = `${id}-error`;
-  const [editing, setEditing] = (0, import_react16.useState)(false);
-  const [draft, setDraft] = (0, import_react16.useState)(value);
-  const [pending, setPending] = (0, import_react16.useState)(false);
-  const [error, setError] = (0, import_react16.useState)();
-  const [status, setStatus] = (0, import_react16.useState)("");
-  const viewRef = (0, import_react16.useRef)(null);
-  const editorRef = (0, import_react16.useRef)(null);
-  const focusNext = (0, import_react16.useRef)(null);
-  const mounted = (0, import_react16.useRef)(true);
-  (0, import_react16.useEffect)(() => {
+  const [editing, setEditing] = (0, import_react17.useState)(false);
+  const [draft, setDraft] = (0, import_react17.useState)(value);
+  const [pending, setPending] = (0, import_react17.useState)(false);
+  const [error, setError] = (0, import_react17.useState)();
+  const [status, setStatus] = (0, import_react17.useState)("");
+  const viewRef = (0, import_react17.useRef)(null);
+  const editorRef = (0, import_react17.useRef)(null);
+  const focusNext = (0, import_react17.useRef)(null);
+  const mounted = (0, import_react17.useRef)(true);
+  (0, import_react17.useEffect)(() => {
     mounted.current = true;
     return () => {
       mounted.current = false;
     };
   }, []);
-  (0, import_react16.useEffect)(() => {
+  (0, import_react17.useEffect)(() => {
     const target = focusNext.current;
     if (!target) return;
     focusNext.current = null;
@@ -2554,10 +2573,10 @@ function InlineEdit({
 }
 // src/components/Select.tsx
-var import_react20 = require("react");
+var import_react21 = require("react");
 // src/components/Drawer.tsx
-var import_react19 = require("react");
+var import_react20 = require("react");
 // src/hooks/backdropDismiss.ts
 function isBackdropClick(e) {
@@ -2574,12 +2593,12 @@ function backdropDismiss(onClose, onClick, enabled = true) {
 }
 // src/components/DiscardPrompt.tsx
-var import_react18 = require("react");
+var import_react19 = require("react");
 // src/components/Popover.tsx
-var import_react17 = require("react");
+var import_react18 = require("react");
 var import_jsx_runtime14 = require("react/jsx-runtime");
-var useIsomorphicLayoutEffect4 = typeof document !== "undefined" ? import_react17.useLayoutEffect : import_react17.useEffect;
+var useIsomorphicLayoutEffect4 = typeof document !== "undefined" ? import_react18.useLayoutEffect : import_react18.useEffect;
 var PLACING = "data-uix-placing";
 var isPopoverOpen = (el) => {
   try {
@@ -2610,10 +2629,10 @@ function Popover({
   const popover = popoverProp ?? (hover ? "manual" : "auto");
   const openDelay = typeof openOnHover === "object" ? openOnHover.openDelay ?? 300 : 300;
   const closeDelay = typeof openOnHover === "object" ? openOnHover.closeDelay ?? 150 : 150;
-  const ref = (0, import_react17.useRef)(null);
-  const [open, setOpen] = (0, import_react17.useState)(false);
-  const openRef = (0, import_react17.useRef)(false);
-  const onAnchorHiddenRef = (0, import_react17.useRef)(onAnchorHidden);
+  const ref = (0, import_react18.useRef)(null);
+  const [open, setOpen] = (0, import_react18.useState)(false);
+  const openRef = (0, import_react18.useRef)(false);
+  const onAnchorHiddenRef = (0, import_react18.useRef)(onAnchorHidden);
   onAnchorHiddenRef.current = onAnchorHidden;
   const popoverAttr = { popover };
   const reposition = useAnchoredPosition(anchor ?? null, ref, {
@@ -2630,7 +2649,7 @@ function Popover({
       el.hidePopover();
     } : void 0
   });
-  (0, import_react17.useEffect)(() => {
+  (0, import_react18.useEffect)(() => {
     const el = ref.current;
     if (!el || !anchor) return;
     const hold = (event) => {
@@ -2663,7 +2682,7 @@ function Popover({
       el.removeAttribute(PLACING);
     };
   }, [anchor, reposition]);
-  (0, import_react17.useEffect)(() => {
+  (0, import_react18.useEffect)(() => {
     const el = ref.current;
     const anchorEl = resolveAnchor(anchor);
     if (!hover || !el || !anchorEl) return;
@@ -2749,7 +2768,7 @@ function Popover({
 // src/components/DiscardPrompt.tsx
 var import_jsx_runtime15 = require("react/jsx-runtime");
-var useIsomorphicLayoutEffect5 = typeof document !== "undefined" ? import_react18.useLayoutEffect : import_react18.useEffect;
+var useIsomorphicLayoutEffect5 = typeof document !== "undefined" ? import_react19.useLayoutEffect : import_react19.useEffect;
 var anyAutoPopoverOpen = () => {
   try {
     return !!document.querySelector('[popover]:not([popover="manual"]):popover-open');
@@ -2763,9 +2782,9 @@ var DEFAULT_DISCARD_LABELS = {
   keepEditing: "Keep editing",
   discard: "Discard"
 };
-var DialogCloseContext = (0, import_react18.createContext)(null);
-var DialogClose = (0, import_react18.forwardRef)(({ onClick, type = "button", ...props }, ref) => {
-  const dialog = (0, import_react18.useContext)(DialogCloseContext);
+var DialogCloseContext = (0, import_react19.createContext)(null);
+var DialogClose = (0, import_react19.forwardRef)(({ onClick, type = "button", ...props }, ref) => {
+  const dialog = (0, import_react19.useContext)(DialogCloseContext);
   const pending = !!dialog?.pending;
   return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
     Button,
@@ -2790,18 +2809,18 @@ DialogClose.displayName = "DialogClose";
 function useGuardedDialog({ open, onClose, dirty = false, pending = false, labels: labelsProp, closeRef }) {
   const uixLabels = useUixLabels();
   const labels = { ...DEFAULT_DISCARD_LABELS, ...uixLabels.discardPrompt, ...labelsProp };
-  const panelId = `${(0, import_react18.useId)()}-discard`;
-  const [prompt, setPromptState] = (0, import_react18.useState)(null);
-  const latest = (0, import_react18.useRef)({ open, onClose, dirty, pending, prompt });
+  const panelId = `${(0, import_react19.useId)()}-discard`;
+  const [prompt, setPromptState] = (0, import_react19.useState)(null);
+  const latest = (0, import_react19.useRef)({ open, onClose, dirty, pending, prompt });
   useIsomorphicLayoutEffect5(() => {
     latest.current = { ...latest.current, open, onClose, dirty, pending };
   });
-  const setPrompt = (0, import_react18.useCallback)((next) => {
+  const setPrompt = (0, import_react19.useCallback)((next) => {
     latest.current.prompt = next;
     setPromptState(next);
   }, []);
   const guarded = () => !!latest.current.onClose && (latest.current.dirty || latest.current.pending);
-  const requestClose = (0, import_react18.useCallback)((anchor, event) => {
+  const requestClose = (0, import_react19.useCallback)((anchor, event) => {
     const { open: isOpen2, onClose: close, dirty: isDirty, pending: isPending, prompt: asking } = latest.current;
     if (!isOpen2 || !close || isPending || asking) return;
     if (!isDirty) {
@@ -2811,9 +2830,9 @@ function useGuardedDialog({ open, onClose, dirty = false, pending = false, label
     const active = document.activeElement;
     setPrompt({ anchor: anchor ?? closeRef.current, returnTo: active instanceof HTMLElement ? active : null });
   }, [closeRef, setPrompt]);
-  const dialogRef = (0, import_react18.useRef)(null);
-  const backOut = (0, import_react18.useRef)({ focus: null, forced: false });
-  const keepEditing = (0, import_react18.useCallback)(() => {
+  const dialogRef = (0, import_react19.useRef)(null);
+  const backOut = (0, import_react19.useRef)({ focus: null, forced: false });
+  const keepEditing = (0, import_react19.useCallback)(() => {
     const asked = latest.current.prompt;
     setPrompt(null);
     const target = asked?.returnTo;
@@ -2833,17 +2852,17 @@ function useGuardedDialog({ open, onClose, dirty = false, pending = false, label
     return true;
   });
   dialogRef.current = ref.current;
-  const discard = (0, import_react18.useCallback)((event) => {
+  const discard = (0, import_react19.useCallback)((event) => {
     setPrompt(null);
     latest.current.onClose?.(event);
   }, [setPrompt]);
-  (0, import_react18.useEffect)(() => {
+  (0, import_react19.useEffect)(() => {
     if (open && dirty && !pending) return;
     if (!latest.current.prompt) return;
     if (open && document.getElementById(panelId)?.contains(document.activeElement)) keepEditing();
     else setPrompt(null);
   }, [open, dirty, pending, panelId, keepEditing, setPrompt]);
-  (0, import_react18.useEffect)(() => {
+  (0, import_react19.useEffect)(() => {
     const el = ref.current;
     dialogRef.current = el;
     if (!el || !open) return;
@@ -2920,9 +2939,9 @@ function useGuardedDialog({ open, onClose, dirty = false, pending = false, label
   return { ref, requestClose, onKeyDown, prompt: element, provide };
 }
 function DiscardPrompt({ id, prompt, labels, onKeepEditing, onDismiss, onDiscard }) {
-  const keepRef = (0, import_react18.useRef)(null);
+  const keepRef = (0, import_react19.useRef)(null);
   const open = prompt != null;
-  (0, import_react18.useEffect)(() => {
+  (0, import_react19.useEffect)(() => {
     const panel = document.getElementById(id);
     if (!panel) return;
     const shown = () => {
@@ -3006,9 +3025,9 @@ function Drawer({
 }) {
   const uixLabels = useUixLabels();
   const closeLabel = closeLabelProp ?? uixLabels.drawer?.close ?? "Close drawer";
-  const closeRef = (0, import_react19.useRef)(null);
+  const closeRef = (0, import_react20.useRef)(null);
   const guard = useGuardedDialog({ open, onClose, dirty, pending, labels: discardLabels, closeRef });
-  const titleId = (0, import_react19.useId)();
+  const titleId = (0, import_react20.useId)();
   return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
     "dialog",
     {
@@ -3151,7 +3170,7 @@ function toggleValue(values, value) {
 // src/components/Select.tsx
 var import_jsx_runtime17 = require("react/jsx-runtime");
-var useIsomorphicLayoutEffect6 = typeof document !== "undefined" ? import_react20.useLayoutEffect : import_react20.useEffect;
+var useIsomorphicLayoutEffect6 = typeof document !== "undefined" ? import_react21.useLayoutEffect : import_react21.useEffect;
 var DEFAULT_LABELS = {
   search: "Search options",
   searchPlaceholder: "Search\u2026",
@@ -3170,7 +3189,7 @@ function textOf(node) {
   if (node == null || typeof node === "boolean") return "";
   if (typeof node === "string" || typeof node === "number") return String(node);
   if (Array.isArray(node)) return node.map(textOf).join("");
-  if ((0, import_react20.isValidElement)(node)) return textOf(node.props.children);
+  if ((0, import_react21.isValidElement)(node)) return textOf(node.props.children);
   return "";
 }
 function parseOption(el) {
@@ -3186,9 +3205,9 @@ function parseOption(el) {
 function parseChildren(children) {
   const out = [];
   const walk = (nodes, into) => {
-    import_react20.Children.forEach(nodes, (child) => {
-      if (!(0, import_react20.isValidElement)(child)) return;
-      if (child.type === import_react20.Fragment) walk(child.props.children, into);
+    import_react21.Children.forEach(nodes, (child) => {
+      if (!(0, import_react21.isValidElement)(child)) return;
+      if (child.type === import_react21.Fragment) walk(child.props.children, into);
       else if (child.type === "option") (into ?? out).push(parseOption(child));
       else if (child.type === "optgroup" && !into) {
         const p = child.props;
@@ -3268,7 +3287,7 @@ function labelText(trigger, own, ariaLabel, labelledBy) {
   return labels ? Array.from(labels).map(read).join(" ").trim() : "";
 }
 var CheckIcon2 = () => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2.5, strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("path", { d: "M20 6 9 17l-5-5" }) });
-var Select = (0, import_react20.forwardRef)(function Select2(props, forwardedRef) {
+var Select = (0, import_react21.forwardRef)(function Select2(props, forwardedRef) {
   const {
     size = "md",
     className,
@@ -3307,18 +3326,18 @@ var Select = (0, import_react20.forwardRef)(function Select2(props, forwardedRef
   } = props;
   const uixLabels = useUixLabels();
   const labels = { ...DEFAULT_LABELS, ...uixLabels.select, ...labelsProp };
-  const uid = (0, import_react20.useId)();
+  const uid = (0, import_react21.useId)();
   const listId = `${uid}-listbox`;
   const optionId = (index) => `${uid}-option-${index}`;
-  const triggerRef = (0, import_react20.useRef)(null);
-  const proxyRef = (0, import_react20.useRef)(null);
-  const popupRef = (0, import_react20.useRef)(null);
-  const listRef = (0, import_react20.useRef)(null);
-  const searchRef = (0, import_react20.useRef)(null);
-  const staticItems = (0, import_react20.useMemo)(() => options ? [...options] : parseChildren(children), [options, children]);
-  const formModel = (0, import_react20.useMemo)(() => buildSelectModel(staticItems), [staticItems]);
+  const triggerRef = (0, import_react21.useRef)(null);
+  const proxyRef = (0, import_react21.useRef)(null);
+  const popupRef = (0, import_react21.useRef)(null);
+  const listRef = (0, import_react21.useRef)(null);
+  const searchRef = (0, import_react21.useRef)(null);
+  const staticItems = (0, import_react21.useMemo)(() => options ? [...options] : parseChildren(children), [options, children]);
+  const formModel = (0, import_react21.useMemo)(() => buildSelectModel(staticItems), [staticItems]);
   const controlled = value !== void 0;
-  const [internal, setInternal] = (0, import_react20.useState)(() => {
+  const [internal, setInternal] = (0, import_react21.useState)(() => {
     if (defaultValue !== void 0) return toValueList(defaultValue);
     const marked = formModel.all.filter((e) => e.option.selected).map((e) => e.option.value);
     if (multiple) return marked;
@@ -3329,25 +3348,25 @@ var Select = (0, import_react20.forwardRef)(function Select2(props, forwardedRef
   });
   const values = controlled ? toValueList(value) : internal;
   const current = values[0] ?? "";
-  const valuesRef = (0, import_react20.useRef)(values);
+  const valuesRef = (0, import_react21.useRef)(values);
   valuesRef.current = values;
-  const controlledRef = (0, import_react20.useRef)(controlled);
+  const controlledRef = (0, import_react21.useRef)(controlled);
   controlledRef.current = controlled;
-  const [initialDefault] = (0, import_react20.useState)(() => multiple ? values : current);
-  const [open, setOpen] = (0, import_react20.useState)(false);
-  const [mode, setMode] = (0, import_react20.useState)("popover");
-  const [active, setActive] = (0, import_react20.useState)(-1);
-  const [query, setQuery] = (0, import_react20.useState)("");
-  const [listLabel, setListLabel] = (0, import_react20.useState)("");
-  const [formInvalid, setFormInvalid] = (0, import_react20.useState)(false);
-  const snapshot = (0, import_react20.useRef)([]);
-  const typed = (0, import_react20.useRef)({ text: "", timer: null });
-  const loadRef = (0, import_react20.useRef)(loadOptions);
+  const [initialDefault] = (0, import_react21.useState)(() => multiple ? values : current);
+  const [open, setOpen] = (0, import_react21.useState)(false);
+  const [mode, setMode] = (0, import_react21.useState)("popover");
+  const [active, setActive] = (0, import_react21.useState)(-1);
+  const [query, setQuery] = (0, import_react21.useState)("");
+  const [listLabel, setListLabel] = (0, import_react21.useState)("");
+  const [formInvalid, setFormInvalid] = (0, import_react21.useState)(false);
+  const snapshot = (0, import_react21.useRef)([]);
+  const typed = (0, import_react21.useRef)({ text: "", timer: null });
+  const loadRef = (0, import_react21.useRef)(loadOptions);
   loadRef.current = loadOptions;
   const hasLoader = !!loadOptions;
-  const [asyncState, setAsyncState] = (0, import_react20.useState)({ status: "idle", items: [], seen: /* @__PURE__ */ new Map() });
-  const request = (0, import_react20.useRef)(null);
-  const load = (0, import_react20.useCallback)((q) => {
+  const [asyncState, setAsyncState] = (0, import_react21.useState)({ status: "idle", items: [], seen: /* @__PURE__ */ new Map() });
+  const request = (0, import_react21.useRef)(null);
+  const load = (0, import_react21.useCallback)((q) => {
     const loader = loadRef.current;
     if (!loader) return;
     request.current?.abort();
@@ -3366,23 +3385,23 @@ var Select = (0, import_react20.forwardRef)(function Select2(props, forwardedRef
       setAsyncState((s) => ({ ...s, status: "error", items: [] }));
     });
   }, []);
-  (0, import_react20.useEffect)(() => {
+  (0, import_react21.useEffect)(() => {
     if (!open || !hasLoader) return void 0;
     request.current?.abort();
     const timer = setTimeout(() => load(query), query ? 200 : 0);
     return () => clearTimeout(timer);
   }, [open, query, hasLoader, load]);
-  (0, import_react20.useEffect)(() => {
+  (0, import_react21.useEffect)(() => {
     if (!open) request.current?.abort();
   }, [open]);
-  (0, import_react20.useEffect)(() => () => request.current?.abort(), []);
+  (0, import_react21.useEffect)(() => () => request.current?.abort(), []);
   const isSearchable = searchable === true || searchable === "auto" && countSelectOptions(staticItems) > 12;
   const listItems = hasLoader ? asyncState.items : isSearchable ? filterSelectItems(staticItems, query) : staticItems;
-  const listModel = (0, import_react20.useMemo)(() => buildSelectModel(listItems), [listItems]);
+  const listModel = (0, import_react21.useMemo)(() => buildSelectModel(listItems), [listItems]);
   const entries = listModel.entries;
   const activeEntry = active >= 0 ? entries[active] : void 0;
   const known = (v) => formModel.all.find((e) => e.option.value === v)?.option ?? asyncState.seen.get(v);
-  const proxyOptions = (0, import_react20.useMemo)(() => {
+  const proxyOptions = (0, import_react21.useMemo)(() => {
     const list = [];
     const have = /* @__PURE__ */ new Set();
     for (const e of formModel.all) {
@@ -3403,7 +3422,7 @@ var Select = (0, import_react20.forwardRef)(function Select2(props, forwardedRef
     }
     return list;
   }, [formModel, asyncState.seen, values, multiple, placeholder]);
-  const syncProxy = (0, import_react20.useCallback)(() => {
+  const syncProxy = (0, import_react21.useCallback)(() => {
     const proxy = proxyRef.current;
     if (!proxy) return;
     const now = readProxy(proxy);
@@ -3414,7 +3433,7 @@ var Select = (0, import_react20.forwardRef)(function Select2(props, forwardedRef
   useIsomorphicLayoutEffect6(() => {
     syncProxy();
   });
-  const fromOutside = (0, import_react20.useCallback)(() => {
+  const fromOutside = (0, import_react21.useCallback)(() => {
     const proxy = proxyRef.current;
     if (!proxy || controlledRef.current) return;
     const read = readProxy(proxy);
@@ -3422,7 +3441,7 @@ var Select = (0, import_react20.forwardRef)(function Select2(props, forwardedRef
     valuesRef.current = next;
     setInternal(next);
   }, [multiple]);
-  const setProxyRef = (0, import_react20.useCallback)((el) => {
+  const setProxyRef = (0, import_react21.useCallback)((el) => {
     proxyRef.current = el;
     if (el) {
       watchWrites(el, ["value", "selectedIndex"], selectProto, fromOutside);
@@ -3435,7 +3454,7 @@ var Select = (0, import_react20.forwardRef)(function Select2(props, forwardedRef
     const el = proxyRef.current;
     if (el) for (const o of Array.from(el.options)) watchWrites(o, ["selected"], optionProto, fromOutside);
   });
-  (0, import_react20.useEffect)(() => {
+  (0, import_react21.useEffect)(() => {
     const proxy = proxyRef.current;
     if (!proxy) return void 0;
     const doc = proxy.ownerDocument;
@@ -3459,7 +3478,7 @@ var Select = (0, import_react20.forwardRef)(function Select2(props, forwardedRef
       proxy.removeEventListener("focus", onProxyFocus);
     };
   }, [multiple, syncProxy]);
-  const changed = (0, import_react20.useRef)(void 0);
+  const changed = (0, import_react21.useRef)(void 0);
   const commit = (next, option) => {
     const proxy = proxyRef.current;
     changed.current = option;
@@ -3537,7 +3556,7 @@ var Select = (0, import_react20.forwardRef)(function Select2(props, forwardedRef
     }, TYPEAHEAD_MS);
     return typeahead(list, state.text, from);
   };
-  (0, import_react20.useEffect)(() => () => {
+  (0, import_react21.useEffect)(() => () => {
     if (typed.current.timer) clearTimeout(typed.current.timer);
   }, []);
   const printable = (e) => e.key.length === 1 && !e.ctrlKey && !e.metaKey && !e.altKey;
@@ -3689,7 +3708,7 @@ var Select = (0, import_react20.forwardRef)(function Select2(props, forwardedRef
     }
   }, [showing, isSearchable]);
   useAnchoredPosition(triggerRef, popupRef, { open: showing, placement, offset: OFFSET, padding: EDGE });
-  (0, import_react20.useEffect)(() => {
+  (0, import_react21.useEffect)(() => {
     if (open && mode === "sheet") (isSearchable ? searchRef.current : listRef.current)?.focus({ preventScroll: true });
   }, [open, mode, isSearchable]);
   useIsomorphicLayoutEffect6(() => {
@@ -3702,7 +3721,7 @@ var Select = (0, import_react20.forwardRef)(function Select2(props, forwardedRef
     if (top < list.scrollTop) list.scrollTop = top;
     else if (bottom > list.scrollTop + list.clientHeight) list.scrollTop = bottom - list.clientHeight;
   }, [open, active, mode]);
-  (0, import_react20.useEffect)(() => {
+  (0, import_react21.useEffect)(() => {
     if (!showing) return void 0;
     const doc = triggerRef.current?.ownerDocument;
     if (!doc) return void 0;
@@ -3810,7 +3829,7 @@ var Select = (0, import_react20.forwardRef)(function Select2(props, forwardedRef
       children: listModel.sections.map((section, i) => section.label != null ? /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { role: "group", className: "uix-listbox__group", "aria-labelledby": `${uid}-group-${i}`, "aria-disabled": section.disabled || void 0, children: [
         /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { id: `${uid}-group-${i}`, role: "presentation", className: "uix-listbox__group-label", children: section.label }),
         section.entries.map(renderEntry)
-      ] }, `g${i}`) : /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_react20.Fragment, { children: section.entries.map(renderEntry) }, `s${i}`))
+      ] }, `g${i}`) : /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_react21.Fragment, { children: section.entries.map(renderEntry) }, `s${i}`))
     }
   );
   const stateRow = status === "loading" && empty ? /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "uix-select__state", role: "status", children: [
@@ -3939,14 +3958,14 @@ var Select = (0, import_react20.forwardRef)(function Select2(props, forwardedRef
 Select.displayName = "Select";
 // src/components/Checkbox.tsx
-var import_react21 = require("react");
+var import_react22 = require("react");
 var import_jsx_runtime18 = require("react/jsx-runtime");
 var CheckIcon3 = () => /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("svg", { viewBox: "0 0 12 12", fill: "none", stroke: "currentColor", strokeWidth: 2.5, strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("polyline", { points: "1.5,6 4.5,9 10.5,3" }) });
 var IndeterminateIcon = () => /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("svg", { viewBox: "0 0 12 12", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("rect", { x: "2", y: "5", width: "8", height: "2", rx: "1", fill: "currentColor" }) });
-var Checkbox = (0, import_react21.forwardRef)(
+var Checkbox = (0, import_react22.forwardRef)(
   ({ label, indeterminate, className, ...props }, forwardedRef) => {
-    const innerRef = (0, import_react21.useRef)(null);
-    (0, import_react21.useEffect)(() => {
+    const innerRef = (0, import_react22.useRef)(null);
+    (0, import_react22.useEffect)(() => {
       const el = innerRef.current;
       if (el) el.indeterminate = !!indeterminate;
     }, [indeterminate]);
@@ -3971,9 +3990,9 @@ var Checkbox = (0, import_react21.forwardRef)(
 Checkbox.displayName = "Checkbox";
 // src/components/Radio.tsx
-var import_react22 = require("react");
+var import_react23 = require("react");
 var import_jsx_runtime19 = require("react/jsx-runtime");
-var Radio = (0, import_react22.forwardRef)(
+var Radio = (0, import_react23.forwardRef)(
   ({ label, className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("label", { className: cx("uix-radio", className), children: [
     /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("input", { type: "radio", ref, ...props }),
     /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { className: "uix-radio__dot" }),
@@ -3981,7 +4000,7 @@ var Radio = (0, import_react22.forwardRef)(
   ] })
 );
 Radio.displayName = "Radio";
-var RadioCard = (0, import_react22.forwardRef)(
+var RadioCard = (0, import_react23.forwardRef)(
   ({ title, description, media, className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("label", { className: cx("uix-radio-card", className), children: [
     /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("input", { type: "radio", ref, ...props }),
     media != null && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { className: "uix-radio-card__media", "aria-hidden": "true", children: media }),
@@ -4003,9 +4022,9 @@ function RadioGroup({ children, className, label, variant = "list" }) {
 }
 // src/components/Switch.tsx
-var import_react23 = require("react");
+var import_react24 = require("react");
 var import_jsx_runtime20 = require("react/jsx-runtime");
-var Switch = (0, import_react23.forwardRef)(
+var Switch = (0, import_react24.forwardRef)(
   ({ label, className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("label", { className: cx("uix-switch", className), children: [
     /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("input", { type: "checkbox", role: "switch", ref, ...props }),
     /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "uix-switch__track" }),
@@ -4015,10 +4034,10 @@ var Switch = (0, import_react23.forwardRef)(
 Switch.displayName = "Switch";
 // src/components/Field.tsx
-var import_react25 = require("react");
+var import_react26 = require("react");
 // src/components/InfoTip.tsx
-var import_react24 = require("react");
+var import_react25 = require("react");
 // src/info-tip-model.ts
 var helpParagraphs = (content) => typeof content === "string" ? content.replace(/\r\n?/g, "\n").split(/\n\s*\n/).map((p) => p.trim()).filter(Boolean) : [];
@@ -4049,15 +4068,15 @@ function InfoTipControl({
   className,
   ...props
 }) {
-  const wrapRef = (0, import_react24.useRef)(null);
-  const buttonRef = (0, import_react24.useRef)(null);
-  const timer = (0, import_react24.useRef)(null);
-  const openRef = (0, import_react24.useRef)(false);
-  const pinned = (0, import_react24.useRef)(false);
-  const pressing = (0, import_react24.useRef)(false);
-  const refocusing = (0, import_react24.useRef)(false);
-  const [open, setOpen] = (0, import_react24.useState)(false);
-  const panelId = `${(0, import_react24.useId)()}-panel`;
+  const wrapRef = (0, import_react25.useRef)(null);
+  const buttonRef = (0, import_react25.useRef)(null);
+  const timer = (0, import_react25.useRef)(null);
+  const openRef = (0, import_react25.useRef)(false);
+  const pinned = (0, import_react25.useRef)(false);
+  const pressing = (0, import_react25.useRef)(false);
+  const refocusing = (0, import_react25.useRef)(false);
+  const [open, setOpen] = (0, import_react25.useState)(false);
+  const panelId = `${(0, import_react25.useId)()}-panel`;
   const panel = () => document.getElementById(panelId);
   const clearTimer = () => {
     if (timer.current != null) {
@@ -4116,7 +4135,7 @@ function InfoTipControl({
       refocusing.current = false;
     }
   };
-  (0, import_react24.useEffect)(() => {
+  (0, import_react25.useEffect)(() => {
     if (!open) return;
     const onKey = (e) => {
       if (e.key === "Escape") escape();
@@ -4131,7 +4150,7 @@ function InfoTipControl({
       document.removeEventListener("pointerdown", onPointer, true);
     };
   }, [open]);
-  (0, import_react24.useEffect)(() => () => {
+  (0, import_react25.useEffect)(() => () => {
     clearTimer();
     const p = panel();
     if (p && isShown2(p)) {
@@ -4207,11 +4226,11 @@ function InfoTipControl({
 // src/components/Field.tsx
 var import_jsx_runtime22 = require("react/jsx-runtime");
 function Field({ label, hint, error, warning, success, required, help, helpLabel, children, className, htmlFor }) {
-  const uid = (0, import_react25.useId)();
+  const uid = (0, import_react26.useId)();
   const msgId = `${uid}-msg`;
   const describedBy = error || warning || success || hint ? msgId : void 0;
-  const controlId = (0, import_react25.isValidElement)(children) ? children.props.id ?? `${uid}-ctl` : void 0;
-  const control = (0, import_react25.isValidElement)(children) ? (0, import_react25.cloneElement)(children, {
+  const controlId = (0, import_react26.isValidElement)(children) ? children.props.id ?? `${uid}-ctl` : void 0;
+  const control = (0, import_react26.isValidElement)(children) ? (0, import_react26.cloneElement)(children, {
     id: controlId,
     "aria-describedby": [children.props["aria-describedby"], describedBy].filter(Boolean).join(" ") || void 0,
     "aria-invalid": error ? true : children.props["aria-invalid"],
@@ -4230,7 +4249,7 @@ function Field({ label, hint, error, warning, success, required, help, helpLabel
 }
 // src/components/Modal.tsx
-var import_react26 = require("react");
+var import_react27 = require("react");
 var import_jsx_runtime23 = require("react/jsx-runtime");
 var CloseIcon2 = () => /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: 1.5, strokeLinecap: "round", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("path", { d: "M4 4l8 8M12 4l-8 8" }) });
 function Modal({
@@ -4245,14 +4264,15 @@ function Modal({
   className,
   closeLabel: closeLabelProp,
   role = "dialog",
+  instant = false,
   onKeyDown,
   ...rest
 }) {
   const uixLabels = useUixLabels();
   const closeLabel = closeLabelProp ?? uixLabels.modal?.close ?? "Close dialog";
-  const closeRef = (0, import_react26.useRef)(null);
+  const closeRef = (0, import_react27.useRef)(null);
   const guard = useGuardedDialog({ open, onClose, dirty, pending, labels: discardLabels, closeRef });
-  const titleId = (0, import_react26.useId)();
+  const titleId = (0, import_react27.useId)();
   return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
     "dialog",
     {
@@ -4260,6 +4280,7 @@ function Modal({
       className: cx("uix-dialog", className),
       role,
       "aria-labelledby": title != null ? titleId : void 0,
+      "data-uix-instant": instant ? "" : void 0,
       ...rest,
       onKeyDown: (event) => {
         onKeyDown?.(event);
@@ -4294,7 +4315,7 @@ function Modal({
 }
 // src/components/Dialogs.tsx
-var import_react27 = require("react");
+var import_react28 = require("react");
 var import_jsx_runtime24 = require("react/jsx-runtime");
 function ConfirmDialog({
   open,
@@ -4320,19 +4341,19 @@ function ConfirmDialog({
   const uixLabels = useUixLabels();
   const typeToConfirmLabel = typeToConfirmLabelProp ?? uixLabels.confirmDialog?.typeToConfirm ?? "Type {value} to confirm";
   const compensationLabel = compensationLabelProp ?? uixLabels.confirmDialog?.compensation ?? "How to undo this";
-  const id = (0, import_react27.useId)();
+  const id = (0, import_react28.useId)();
   const bodyId = `${id}-body`;
   const typedId = `${id}-typed`;
-  const cancelRef = (0, import_react27.useRef)(null);
-  const confirmRef = (0, import_react27.useRef)(null);
-  const typedRef = (0, import_react27.useRef)(null);
-  const [typed, setTyped] = (0, import_react27.useState)("");
+  const cancelRef = (0, import_react28.useRef)(null);
+  const confirmRef = (0, import_react28.useRef)(null);
+  const typedRef = (0, import_react28.useRef)(null);
+  const [typed, setTyped] = (0, import_react28.useState)("");
   const typedMatches = typeToConfirm == null || typed === typeToConfirm;
   const hasBody = description != null || children != null || compensation != null;
-  (0, import_react27.useEffect)(() => {
+  (0, import_react28.useEffect)(() => {
     if (open) setTyped("");
   }, [open, typeToConfirm]);
-  (0, import_react27.useEffect)(() => {
+  (0, import_react28.useEffect)(() => {
     if (!open) return;
     const focus = initialFocus ?? (destructive ? "cancel" : void 0);
     const target = typeToConfirm != null ? typedRef.current : focus === "cancel" ? cancelRef.current : focus === "confirm" ? confirmRef.current : null;
@@ -4389,13 +4410,13 @@ function Popconfirm({
 }) {
   const uixLabels = useUixLabels();
   const compensationLabel = compensationLabelProp ?? uixLabels.confirmDialog?.compensation ?? "How to undo this";
-  const id = (0, import_react27.useId)();
+  const id = (0, import_react28.useId)();
   const panelId = `${id}-popconfirm`;
-  const cancelRef = (0, import_react27.useRef)(null);
-  const onCancelRef = (0, import_react27.useRef)(onCancel);
+  const cancelRef = (0, import_react28.useRef)(null);
+  const onCancelRef = (0, import_react28.useRef)(onCancel);
   onCancelRef.current = onCancel;
   const hasBody = description != null || compensation != null;
-  (0, import_react27.useEffect)(() => {
+  (0, import_react28.useEffect)(() => {
     const panel = document.getElementById(panelId);
     if (!panel) return;
     const shown = () => {
@@ -4488,18 +4509,18 @@ function PromptDialog({
   error: submitError,
   role
 }) {
-  const inputId = (0, import_react27.useId)();
+  const inputId = (0, import_react28.useId)();
   const errorId = `${inputId}-error`;
   const descriptionId = `${inputId}-description`;
-  const formRef = (0, import_react27.useRef)(null);
-  const fieldRef = (0, import_react27.useRef)(null);
-  const [value, setValue] = (0, import_react27.useState)(defaultValue);
-  const [issue, setIssue] = (0, import_react27.useState)();
+  const formRef = (0, import_react28.useRef)(null);
+  const fieldRef = (0, import_react28.useRef)(null);
+  const [value, setValue] = (0, import_react28.useState)(defaultValue);
+  const [issue, setIssue] = (0, import_react28.useState)();
   const error = issue ?? submitError;
-  (0, import_react27.useEffect)(() => {
+  (0, import_react28.useEffect)(() => {
     if (open) fieldRef.current?.focus();
   }, [open]);
-  (0, import_react27.useEffect)(() => {
+  (0, import_react28.useEffect)(() => {
     if (open) {
       setValue(defaultValue);
       setIssue(void 0);
@@ -4556,7 +4577,7 @@ function PromptDialog({
 }
 // src/components/Peek.tsx
-var import_react28 = require("react");
+var import_react29 = require("react");
 var import_jsx_runtime25 = require("react/jsx-runtime");
 var CloseIcon3 = () => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: 1.5, strokeLinecap: "round", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("path", { d: "M4 4l8 8M12 4l-8 8" }) });
 var ChevronUp = () => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", stroke: "currentColor", strokeWidth: 1.5, strokeLinecap: "round", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("path", { d: "M2 8l4-4 4 4" }) });
@@ -4568,7 +4589,7 @@ function Peek({ open, onClose, title, children, footer, onNavPrev, onNavNext, hi
   const closeLabel = closeLabelProp ?? uixLabels.peek?.close ?? "Close preview";
   const ref = useDialog(open, onClose);
   const hasNav = onNavPrev != null || onNavNext != null;
-  const titleId = (0, import_react28.useId)();
+  const titleId = (0, import_react29.useId)();
   return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("dialog", { ref, className: cx("uix-peek", className), "aria-labelledby": title ? titleId : void 0, ...rest, onClick: backdropDismiss(onClose, onClick), children: [
     /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "uix-peek__header", children: [
       hasNav && /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "uix-peek__nav", children: [
@@ -4585,7 +4606,7 @@ function Peek({ open, onClose, title, children, footer, onNavPrev, onNavNext, hi
 }
 // src/components/Lightbox.tsx
-var import_react29 = require("react");
+var import_react30 = require("react");
 var import_jsx_runtime26 = require("react/jsx-runtime");
 var DEFAULT_LIGHTBOX_LABELS = {
   region: "Media viewer",
@@ -4600,15 +4621,15 @@ var Chevron = ({ dir }) => /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("svg",
 function Lightbox({ items, index, onIndexChange, open, onClose, loop = false, labels: labelOverrides, className }) {
   const labels = { ...DEFAULT_LIGHTBOX_LABELS, ...labelOverrides };
   const ref = useDialog(open, onClose);
-  const closeRef = (0, import_react29.useRef)(null);
-  const returnTo = (0, import_react29.useRef)(null);
-  const swipe = (0, import_react29.useRef)(null);
-  const [zoomed, setZoomed] = (0, import_react29.useState)(false);
+  const closeRef = (0, import_react30.useRef)(null);
+  const returnTo = (0, import_react30.useRef)(null);
+  const swipe = (0, import_react30.useRef)(null);
+  const [zoomed, setZoomed] = (0, import_react30.useState)(false);
   const total = items.length;
   const current = items[Math.min(Math.max(index, 0), Math.max(total - 1, 0))];
   const hasPrev = loop ? total > 1 : index > 0;
   const hasNext = loop ? total > 1 : index < total - 1;
-  (0, import_react29.useEffect)(() => {
+  (0, import_react30.useEffect)(() => {
     if (open) {
       returnTo.current = document.activeElement;
       closeRef.current?.focus();
@@ -4617,7 +4638,7 @@ function Lightbox({ items, index, onIndexChange, open, onClose, loop = false, la
       returnTo.current = null;
     }
   }, [open]);
-  (0, import_react29.useEffect)(() => {
+  (0, import_react30.useEffect)(() => {
     setZoomed(false);
   }, [index]);
   const go = (to) => {
@@ -4716,7 +4737,7 @@ function CardLink({ title, subtitle, headerAction, footer, children, className,
 }
 // src/components/DashboardGrid.tsx
-var import_react30 = require("react");
+var import_react31 = require("react");
 var import_jsx_runtime28 = require("react/jsx-runtime");
 var BREAKPOINTS = ["sm", "md", "lg", "xl"];
 var count = (value, fallback) => {
@@ -4742,16 +4763,16 @@ function dashboardGridItemClassName(span = 1) {
   if (span === 2) return "uix-dashboard-grid__item uix-dashboard-grid__item--span-2";
   return "uix-dashboard-grid__item";
 }
-var DashboardGridItem = (0, import_react30.forwardRef)(function DashboardGridItem2({ span = 1, className, ...props }, ref) {
+var DashboardGridItem = (0, import_react31.forwardRef)(function DashboardGridItem2({ span = 1, className, ...props }, ref) {
   return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { ref, className: cx(dashboardGridItemClassName(span), className), ...props });
 });
-var DashboardGridRoot = (0, import_react30.forwardRef)(function DashboardGrid({ columns, gap = "md", className, ...props }, ref) {
+var DashboardGridRoot = (0, import_react31.forwardRef)(function DashboardGrid({ columns, gap = "md", className, ...props }, ref) {
   return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { ref, className: cx(dashboardGridClassName(columns, gap), className), ...props });
 });
 var DashboardGrid2 = Object.assign(DashboardGridRoot, { Item: DashboardGridItem });
 // src/components/DashboardCanvas.tsx
-var import_react31 = require("react");
+var import_react32 = require("react");
 // src/dashboard-canvas-model.ts
 var DASHBOARD_CANVAS_COLUMNS = 12;
@@ -4891,16 +4912,16 @@ function DashboardCanvas({
   ...props
 }) {
   const labels = { ...DEFAULT_DASHBOARD_CANVAS_LABELS, ...labelOverrides };
-  const instructionsId = (0, import_react31.useId)();
-  const gridRef = (0, import_react31.useRef)(null);
-  const dragRef = (0, import_react31.useRef)(null);
-  const [preview, setPreview] = (0, import_react31.useState)(null);
-  const [announcement, setAnnouncement] = (0, import_react31.useState)("");
-  const layout = (0, import_react31.useMemo)(() => normalizeCanvas(items), [items]);
-  const order = (0, import_react31.useMemo)(() => new Map(canvasReadingOrder(layout).map((item, index) => [item.id, index])), [layout]);
-  const live = (0, import_react31.useRef)({ layout, onLayoutChange, labels, itemLabel });
+  const instructionsId = (0, import_react32.useId)();
+  const gridRef = (0, import_react32.useRef)(null);
+  const dragRef = (0, import_react32.useRef)(null);
+  const [preview, setPreview] = (0, import_react32.useState)(null);
+  const [announcement, setAnnouncement] = (0, import_react32.useState)("");
+  const layout = (0, import_react32.useMemo)(() => normalizeCanvas(items), [items]);
+  const order = (0, import_react32.useMemo)(() => new Map(canvasReadingOrder(layout).map((item, index) => [item.id, index])), [layout]);
+  const live = (0, import_react32.useRef)({ layout, onLayoutChange, labels, itemLabel });
   live.current = { layout, onLayoutChange, labels, itemLabel };
-  (0, import_react31.useEffect)(() => () => dragRef.current?.stop(), []);
+  (0, import_react32.useEffect)(() => () => dragRef.current?.stop(), []);
   const describe = (item, kind) => kind === "move" ? fillLabel(labels.moved, { label: itemLabel(item), col: item.col + 1, row: item.row + 1 }) : fillLabel(labels.resized, { label: itemLabel(item), w: item.w, h: item.h });
   const commit = (id, placement, kind, source) => {
     const state = live.current;
@@ -5066,12 +5087,12 @@ function DashboardCanvas({
 }
 // src/components/Breadcrumbs.tsx
-var import_react32 = require("react");
+var import_react33 = require("react");
 var import_jsx_runtime30 = require("react/jsx-runtime");
 function Breadcrumbs({ items, label, separator = "/", className, ...props }) {
   return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("nav", { "aria-label": label, className, ...props, children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("ol", { className: "uix-breadcrumbs", children: items.map((item, index) => {
     const current = item.current ?? index === items.length - 1;
-    return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_react32.Fragment, { children: [
+    return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_react33.Fragment, { children: [
       index > 0 && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("li", { className: "uix-breadcrumbs__sep", "aria-hidden": "true", children: separator }),
       /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("li", { children: item.href && !current ? /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("a", { href: item.href, children: item.label }) : /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("span", { "aria-current": current ? "page" : void 0, children: item.label }) })
     ] }, item.id ?? `${item.href ?? "current"}-${index}`);
@@ -5105,7 +5126,7 @@ function DetailLayout({ side, children, className, ...props }) {
 }
 // src/components/DetailPage.tsx
-var import_react33 = require("react");
+var import_react34 = require("react");
 var import_jsx_runtime33 = require("react/jsx-runtime");
 var plainLink = ({ href, className, children, onClick, ...rest }) => /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("a", { href, className, onClick, ...rest, children });
 var isPlainLeftClick = (e) => e.button === 0 && !e.metaKey && !e.ctrlKey && !e.shiftKey && !e.altKey;
@@ -5132,7 +5153,7 @@ function DetailPage({
       /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("dt", { children: metric.label }),
       /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("dd", { children: metric.value })
     ] }, metric.id)) }),
-    tabs && tabs.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("nav", { className: "uix-tabs", "aria-label": tabsLabel, children: tabs.map((tab) => /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_react33.Fragment, { children: renderLink({
+    tabs && tabs.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("nav", { className: "uix-tabs", "aria-label": tabsLabel, children: tabs.map((tab) => /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_react34.Fragment, { children: renderLink({
       href: tab.href,
       className: "uix-tab",
       children: tab.label,
@@ -5162,10 +5183,10 @@ function RelatedLinks({ title, items, className, ...props }) {
 }
 // src/components/ToggleRow.tsx
-var import_react34 = require("react");
+var import_react35 = require("react");
 var import_jsx_runtime35 = require("react/jsx-runtime");
 function ToggleRow({ label, description, checked, onCheckedChange, disabled, accessibleLabel, className, ...props }) {
-  const id = (0, import_react34.useId)();
+  const id = (0, import_react35.useId)();
   const switchId = `${id}-switch`;
   const descriptionId = `${id}-description`;
   return /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: cx("uix-toggle-row", className), ...props, children: [
@@ -5188,7 +5209,7 @@ function ToggleRow({ label, description, checked, onCheckedChange, disabled, acc
 }
 // src/components/CollapsibleSection.tsx
-var import_react36 = require("react");
+var import_react37 = require("react");
 // src/components/CollapsibleParts.tsx
 var import_jsx_runtime36 = require("react/jsx-runtime");
@@ -5206,9 +5227,9 @@ function CollapsibleSummary({ title, summary, headingLevel, titleId, summaryRef
 }
 // src/components/CollapsibleSectionState.tsx
-var import_react35 = require("react");
+var import_react36 = require("react");
 var import_jsx_runtime37 = require("react/jsx-runtime");
-var useIsomorphicLayoutEffect7 = typeof document !== "undefined" ? import_react35.useLayoutEffect : import_react35.useEffect;
+var useIsomorphicLayoutEffect7 = typeof document !== "undefined" ? import_react36.useLayoutEffect : import_react36.useEffect;
 var STORAGE_PREFIX = "uix:collapsible:";
 var storageOf = (kind) => kind === "local" ? window.localStorage : window.sessionStorage;
 var readStored = (kind, key) => {
@@ -5241,15 +5262,15 @@ function CollapsibleSectionState({
   onToggle,
   ...props
 }) {
-  const ref = (0, import_react35.useRef)(null);
-  const summaryRef = (0, import_react35.useRef)(null);
-  const titleId = (0, import_react35.useId)();
+  const ref = (0, import_react36.useRef)(null);
+  const summaryRef = (0, import_react36.useRef)(null);
+  const titleId = (0, import_react36.useId)();
   const initial = open ?? defaultOpen ?? false;
-  const [isOpen2, setIsOpen] = (0, import_react35.useState)(initial);
-  const [hasOpened, setHasOpened] = (0, import_react35.useState)(initial);
-  const lastOpen = (0, import_react35.useRef)(open);
-  const lastRequest = (0, import_react35.useRef)(openRequest ? void 0 : openRequest);
-  (0, import_react35.useEffect)(() => {
+  const [isOpen2, setIsOpen] = (0, import_react36.useState)(initial);
+  const [hasOpened, setHasOpened] = (0, import_react36.useState)(initial);
+  const lastOpen = (0, import_react36.useRef)(open);
+  const lastRequest = (0, import_react36.useRef)(openRequest ? void 0 : openRequest);
+  (0, import_react36.useEffect)(() => {
     if (!persistKey) return;
     const stored = readStored(persistStorage, persistKey);
     if (stored !== void 0) {
@@ -5257,14 +5278,14 @@ function CollapsibleSectionState({
       if (stored) setHasOpened(true);
     }
   }, [persistKey, persistStorage]);
-  (0, import_react35.useEffect)(() => {
+  (0, import_react36.useEffect)(() => {
     if (open === lastOpen.current) return;
     lastOpen.current = open;
     if (open === void 0) return;
     setIsOpen(open);
     if (open) setHasOpened(true);
   }, [open]);
-  (0, import_react35.useEffect)(() => {
+  (0, import_react36.useEffect)(() => {
     if (openRequest === void 0 || openRequest === lastRequest.current) return;
     lastRequest.current = openRequest;
     setIsOpen(true);
@@ -5275,7 +5296,7 @@ function CollapsibleSectionState({
       summaryRef.current?.focus({ preventScroll: true });
     });
   }, [openRequest, persistKey, persistStorage]);
-  const renderedOpen = (0, import_react35.useRef)(isOpen2);
+  const renderedOpen = (0, import_react36.useRef)(isOpen2);
   useIsomorphicLayoutEffect7(() => {
     renderedOpen.current = isOpen2;
   }, [isOpen2]);
@@ -5300,7 +5321,7 @@ function CollapsibleSectionState({
 var import_jsx_runtime38 = require("react/jsx-runtime");
 function CollapsibleSection(props) {
   const { title, summary, children, className, lazy, persistKey, persistStorage, openRequest, open, defaultOpen, compact, headingLevel, ...rest } = props;
-  const titleId = (0, import_react36.useId)();
+  const titleId = (0, import_react37.useId)();
   if (lazy || persistKey !== void 0 || openRequest !== void 0) return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(CollapsibleSectionState, { ...props });
   return /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("details", { className: collapsibleClass(compact, className), ...rest, open: open ?? defaultOpen, children: [
     /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(CollapsibleSummary, { title, summary, headingLevel, titleId }),
@@ -5309,7 +5330,7 @@ function CollapsibleSection(props) {
 }
 // src/components/ListRoving.tsx
-var import_react37 = require("react");
+var import_react38 = require("react");
 // src/roving.ts
 function syncRovingStop(all, stop2, next) {
@@ -5329,18 +5350,18 @@ function rovingStep(all, from, key) {
 // src/components/ListRoving.tsx
 var import_jsx_runtime39 = require("react/jsx-runtime");
 function RovingList({ children, className, onKeyDown, onFocus, ...props }) {
-  const ref = (0, import_react37.useRef)(null);
-  const stop2 = (0, import_react37.useRef)({ node: null, index: 0 });
+  const ref = (0, import_react38.useRef)(null);
+  const stop2 = (0, import_react38.useRef)({ node: null, index: 0 });
   const items = () => Array.from(ref.current?.querySelectorAll(".uix-list__item") ?? []).filter((element) => element.closest(".uix-list") === ref.current);
   const sync = (next) => {
     const all = items();
     for (const element of all) if (!element.hasAttribute("role")) element.setAttribute("role", "listitem");
     stop2.current = syncRovingStop(all, stop2.current, next);
   };
-  (0, import_react37.useEffect)(() => {
+  (0, import_react38.useEffect)(() => {
     sync();
   });
-  (0, import_react37.useEffect)(() => {
+  (0, import_react38.useEffect)(() => {
     const list = ref.current;
     if (!list || typeof MutationObserver === "undefined") return;
     const observer = new MutationObserver(() => sync());
@@ -5392,11 +5413,11 @@ function ListItem({ title, meta, trail, leading, children, className, ...props }
 }
 // src/components/DescriptionList.tsx
-var import_react38 = require("react");
+var import_react39 = require("react");
 var import_jsx_runtime41 = require("react/jsx-runtime");
 function DescriptionList({ items, children, className, ...props }) {
   return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("dl", { className: cx("uix-dl", className), ...props, children: [
-    items?.map((item, i) => /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(import_react38.Fragment, { children: [
+    items?.map((item, i) => /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(import_react39.Fragment, { children: [
       /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("dt", { ...item.termProps, children: item.term }),
       /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("dd", { ...item.descriptionProps, children: item.description })
     ] }, item.id ?? i)),
@@ -5411,9 +5432,9 @@ function DescriptionItem({ term, children, termProps, descriptionProps }) {
 }
 // src/components/Tabs.tsx
-var import_react39 = require("react");
+var import_react40 = require("react");
 var import_jsx_runtime42 = require("react/jsx-runtime");
-var TabsCtx = (0, import_react39.createContext)({});
+var TabsCtx = (0, import_react40.createContext)({});
 var Chevron2 = ({ d }) => /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("path", { d }) });
 var inlineOffset = (el, rtl) => rtl ? -el.scrollLeft : el.scrollLeft;
 function Tabs({
@@ -5427,15 +5448,15 @@ function Tabs({
   onKeyDown: onKeyDownProp,
   ...listProps
 }) {
-  const baseId = (0, import_react39.useId)();
-  const listRef = (0, import_react39.useRef)(null);
-  const contextValue = (0, import_react39.useMemo)(() => ({ value, onChange, baseId }), [value, onChange, baseId]);
+  const baseId = (0, import_react40.useId)();
+  const listRef = (0, import_react40.useRef)(null);
+  const contextValue = (0, import_react40.useMemo)(() => ({ value, onChange, baseId }), [value, onChange, baseId]);
   const scroll = overflow === "scroll";
-  const [hidden, setHidden] = (0, import_react39.useState)({ start: false, end: false });
-  const kids = import_react39.Children.toArray(children);
-  const panels = kids.filter((k) => (0, import_react39.isValidElement)(k) && k.type === TabPanel);
-  const tabs = kids.filter((k) => !((0, import_react39.isValidElement)(k) && k.type === TabPanel));
-  (0, import_react39.useEffect)(() => {
+  const [hidden, setHidden] = (0, import_react40.useState)({ start: false, end: false });
+  const kids = import_react40.Children.toArray(children);
+  const panels = kids.filter((k) => (0, import_react40.isValidElement)(k) && k.type === TabPanel);
+  const tabs = kids.filter((k) => !((0, import_react40.isValidElement)(k) && k.type === TabPanel));
+  (0, import_react40.useEffect)(() => {
     const list2 = listRef.current;
     if (!list2) return;
     const all = Array.from(list2.querySelectorAll('[role="tab"]'));
@@ -5443,7 +5464,7 @@ function Tabs({
     const active = enabled.find((t) => t.getAttribute("aria-selected") === "true") ?? enabled[0];
     for (const t of all) t.tabIndex = t === active ? 0 : -1;
   });
-  (0, import_react39.useEffect)(() => {
+  (0, import_react40.useEffect)(() => {
     const list2 = listRef.current;
     if (!scroll || !list2) return;
     const measure2 = () => {
@@ -5464,7 +5485,7 @@ function Tabs({
       observer.disconnect();
     };
   });
-  (0, import_react39.useEffect)(() => {
+  (0, import_react40.useEffect)(() => {
     const list2 = listRef.current;
     const tab = list2?.querySelector('[role="tab"][aria-selected="true"]');
     if (!scroll || !list2 || !tab) return;
@@ -5557,7 +5578,7 @@ function Tabs({
   ] });
 }
 function Tab({ value, children, disabled, className, onClick, ...props }) {
-  const ctx = (0, import_react39.useContext)(TabsCtx);
+  const ctx = (0, import_react40.useContext)(TabsCtx);
   const selected = ctx.value === value;
   return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
     "button",
@@ -5579,7 +5600,7 @@ function Tab({ value, children, disabled, className, onClick, ...props }) {
   );
 }
 function TabPanel({ value, children, keepMounted, ...props }) {
-  const ctx = (0, import_react39.useContext)(TabsCtx);
+  const ctx = (0, import_react40.useContext)(TabsCtx);
   const selected = ctx.value === value;
   if (!selected && !keepMounted) return null;
   return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
@@ -5597,7 +5618,7 @@ function TabPanel({ value, children, keepMounted, ...props }) {
 }
 // src/components/AppShell.tsx
-var import_react40 = require("react");
+var import_react41 = require("react");
 var import_jsx_runtime43 = require("react/jsx-runtime");
 function AppShell({
   nav,
@@ -5618,7 +5639,7 @@ function AppShell({
   const skipToContentLabel = skipToContentLabelProp ?? uixLabels.appShell?.skipToContent ?? "Skip to content";
   const exitFocusLabel = exitFocusLabelProp ?? uixLabels.appShell?.exitFocus ?? "Esc \xB7 Exit focus";
   const navState = nav ?? (collapsed ? "rail" : "full");
-  (0, import_react40.useEffect)(() => {
+  (0, import_react41.useEffect)(() => {
     if (!focus || !onExitFocus) return;
     const onKey = (e) => {
       if (e.key === "Escape") onExitFocus();
@@ -5646,7 +5667,7 @@ function AppShell({
 }
 // src/components/Sidebar.tsx
-var import_react41 = require("react");
+var import_react42 = require("react");
 var import_jsx_runtime44 = require("react/jsx-runtime");
 var ChevronIcon = () => /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("svg", { className: "uix-navgroup__chevron", viewBox: "0 0 12 12", fill: "none", stroke: "currentColor", strokeWidth: 1.5, strokeLinecap: "round", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("path", { d: "M2 4l4 4 4-4" }) });
 function Sidebar({ collapsed, nav, onToggle, brand, toggleIcon, children, expandLabel: expandLabelProp, collapseLabel: collapseLabelProp, className, ...props }) {
@@ -5712,12 +5733,12 @@ function NavItem({ icon, badge, active, as: Tag = "a", description, children, cl
   );
 }
 function NavGroup({ icon, label, children, defaultExpanded = true, expanded: controlledExpanded, onExpandedChange }) {
-  const [internalExpanded, setInternalExpanded] = (0, import_react41.useState)(defaultExpanded);
+  const [internalExpanded, setInternalExpanded] = (0, import_react42.useState)(defaultExpanded);
   const expanded = controlledExpanded ?? internalExpanded;
-  const panelId = (0, import_react41.useId)();
-  const triggerRef = (0, import_react41.useRef)(null);
-  const panelRef = (0, import_react41.useRef)(null);
-  (0, import_react41.useEffect)(() => {
+  const panelId = (0, import_react42.useId)();
+  const triggerRef = (0, import_react42.useRef)(null);
+  const panelRef = (0, import_react42.useRef)(null);
+  (0, import_react42.useEffect)(() => {
     panelRef.current?.toggleAttribute("inert", !expanded);
     if (!expanded && panelRef.current?.contains(document.activeElement)) triggerRef.current?.focus();
   }, [expanded]);
@@ -5796,7 +5817,7 @@ function StarButton({
 }
 // src/components/CopyButton.tsx
-var import_react42 = require("react");
+var import_react43 = require("react");
 // src/copy-model.ts
 async function copyText(value, clipboard = globalThis.navigator?.clipboard) {
@@ -5818,11 +5839,11 @@ var CopyGlyph = () => /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("svg", { vi
 ] });
 var CheckGlyph = () => /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("path", { d: "M20 6 9 17l-5-5" }) });
 function CopyButton({ value, label, copiedLabel, failedLabel, className }) {
-  const [outcome, setOutcome] = (0, import_react42.useState)("idle");
+  const [outcome, setOutcome] = (0, import_react43.useState)("idle");
   const copied = outcome === "copied";
-  const timer = (0, import_react42.useRef)(void 0);
-  const mounted = (0, import_react42.useRef)(true);
-  (0, import_react42.useEffect)(() => {
+  const timer = (0, import_react43.useRef)(void 0);
+  const mounted = (0, import_react43.useRef)(true);
+  (0, import_react43.useEffect)(() => {
     mounted.current = true;
     return () => {
       mounted.current = false;
@@ -5857,7 +5878,7 @@ function CopyButton({ value, label, copiedLabel, failedLabel, className }) {
 }
 // src/components/NavFavourites.tsx
-var import_react43 = require("react");
+var import_react44 = require("react");
 var import_jsx_runtime47 = require("react/jsx-runtime");
 var ChevronDownIcon2 = () => /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
   "svg",
@@ -5920,14 +5941,14 @@ function NavFavourites({
   emptyReason,
   className
 }) {
-  const regionId = (0, import_react43.useId)();
-  const headerRef = (0, import_react43.useRef)(null);
-  const regionRef = (0, import_react43.useRef)(null);
-  const [announcement, setAnnouncement] = (0, import_react43.useState)("");
-  const focusAfterRef = (0, import_react43.useRef)(null);
-  const triggerRefs = (0, import_react43.useRef)(/* @__PURE__ */ new Map());
-  const order = (0, import_react43.useMemo)(() => items.map((item) => item.id), [items]);
-  (0, import_react43.useEffect)(() => {
+  const regionId = (0, import_react44.useId)();
+  const headerRef = (0, import_react44.useRef)(null);
+  const regionRef = (0, import_react44.useRef)(null);
+  const [announcement, setAnnouncement] = (0, import_react44.useState)("");
+  const focusAfterRef = (0, import_react44.useRef)(null);
+  const triggerRefs = (0, import_react44.useRef)(/* @__PURE__ */ new Map());
+  const order = (0, import_react44.useMemo)(() => items.map((item) => item.id), [items]);
+  (0, import_react44.useEffect)(() => {
     const id = focusAfterRef.current;
     if (!id) return;
     focusAfterRef.current = null;
@@ -5944,7 +5965,7 @@ function NavFavourites({
     }
     onToggleCollapsed?.();
   };
-  const move = (0, import_react43.useCallback)((id, dir) => {
+  const move = (0, import_react44.useCallback)((id, dir) => {
     const idx = order.indexOf(id);
     const next = idx + dir;
     if (idx < 0 || next < 0 || next >= order.length) return;
@@ -5957,13 +5978,13 @@ function NavFavourites({
     if (moved) setAnnouncement(`${moved.label} moved to position ${next + 1} of ${order.length}`);
     onReorder(reordered);
   }, [onReorder, order]);
-  const remove = (0, import_react43.useCallback)((id) => {
+  const remove = (0, import_react44.useCallback)((id) => {
     const idx = order.indexOf(id);
     const neighbour = order[idx + 1] ?? order[idx - 1] ?? null;
     focusAfterRef.current = neighbour;
     onRemove(id);
   }, [onRemove, order]);
-  const registerTrigger = (0, import_react43.useCallback)((id, element) => {
+  const registerTrigger = (0, import_react44.useCallback)((id, element) => {
     if (element) triggerRefs.current.set(id, element);
     else triggerRefs.current.delete(id);
   }, []);
@@ -6015,7 +6036,7 @@ function NavFavourites({
     )
   ] });
 }
-var FavouriteRow = (0, import_react43.memo)(function FavouriteRow2({
+var FavouriteRow = (0, import_react44.memo)(function FavouriteRow2({
   item,
   isFirst,
   isLast,
@@ -6024,17 +6045,17 @@ var FavouriteRow = (0, import_react43.memo)(function FavouriteRow2({
   onRemove,
   registerTrigger
 }) {
-  const [open, setOpen] = (0, import_react43.useState)(false);
-  const menuId = (0, import_react43.useId)();
-  const triggerRef = (0, import_react43.useRef)(null);
-  const itemRefs = (0, import_react43.useRef)([]);
+  const [open, setOpen] = (0, import_react44.useState)(false);
+  const menuId = (0, import_react44.useId)();
+  const triggerRef = (0, import_react44.useRef)(null);
+  const itemRefs = (0, import_react44.useRef)([]);
   const optionsTemplate = labels.options ?? "{label} favourite options";
   const actions = [
     ...isFirst ? [] : [{ label: labels.moveUp, onSelect: () => onMove(item.id, -1) }],
     ...isLast ? [] : [{ label: labels.moveDown, onSelect: () => onMove(item.id, 1) }],
     { label: labels.remove.replace("{label}", item.label), onSelect: () => onRemove(item.id) }
   ];
-  (0, import_react43.useEffect)(() => {
+  (0, import_react44.useEffect)(() => {
     if (open) itemRefs.current[0]?.focus();
   }, [open]);
   const closeAndReturnFocus = () => {
@@ -6144,7 +6165,7 @@ var FavouriteRow = (0, import_react43.memo)(function FavouriteRow2({
 });
 // src/components/FileUpload.tsx
-var import_react44 = require("react");
+var import_react45 = require("react");
 // src/file-model.ts
 var UNITS = ["B", "KB", "MB", "GB", "TB"];
@@ -6209,7 +6230,7 @@ function Progress({ value = 0, max = 100, indeterminate, label, className, ...pr
       "aria-label": label,
       className: cx("uix-progress", indeterminate && "uix-progress--indeterminate", className),
       ...props,
-      children: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("div", { className: "uix-progress__bar", style: indeterminate ? void 0 : { width: `${pct}%` } })
+      children: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("div", { className: "uix-progress__bar", style: indeterminate ? void 0 : { "--val": pct / 100 } })
     }
   );
 }
@@ -6270,11 +6291,11 @@ function FileUpload({
 }) {
   const labels = { ...DEFAULT_FILE_UPLOAD_LABELS, ...useUixLabels().fileUpload, ...labelOverrides };
   const sizeText = (bytes) => formatSize ? formatSize(bytes, locale) : formatFileSize(bytes, locale, { base: sizeBase });
-  const id = (0, import_react44.useId)();
-  const inputRef = (0, import_react44.useRef)(null);
-  const [over, setOver] = (0, import_react44.useState)(false);
-  const [messages, setMessages] = (0, import_react44.useState)([]);
-  const [announce, setAnnounce] = (0, import_react44.useState)("");
+  const id = (0, import_react45.useId)();
+  const inputRef = (0, import_react45.useRef)(null);
+  const [over, setOver] = (0, import_react45.useState)(false);
+  const [messages, setMessages] = (0, import_react45.useState)([]);
+  const [announce, setAnnounce] = (0, import_react45.useState)("");
   const take = (list) => {
     if (!list || disabled) return;
     const files = Array.from(list);
@@ -6444,7 +6465,7 @@ function AttachmentList({ label, className, children, ...props }) {
 }
 // src/components/Alert.tsx
-var import_react45 = require("react");
+var import_react46 = require("react");
 // src/components/AlertDismiss.tsx
 var import_jsx_runtime53 = require("react/jsx-runtime");
@@ -6455,7 +6476,7 @@ function AlertDismissButton({ label, onDismiss }) {
 // src/components/Alert.tsx
 var import_jsx_runtime54 = require("react/jsx-runtime");
-var Alert = (0, import_react45.forwardRef)(function Alert2({ tone, title, icon, children, actions, onDismiss, dismissLabel, className, ...props }, ref) {
+var Alert = (0, import_react46.forwardRef)(function Alert2({ tone, title, icon, children, actions, onDismiss, dismissLabel, className, ...props }, ref) {
   return /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(
     "div",
     {
@@ -6502,7 +6523,7 @@ function LiveIndicator({ state = "live", children, className, ...props }) {
 }
 // src/components/Toast.tsx
-var import_react46 = require("react");
+var import_react47 = require("react");
 // src/toast-store.ts
 var DEFAULT_DURATION = {
@@ -6612,14 +6633,14 @@ var toast = createToastApi(createToastStore());
 // src/components/Toast.tsx
 var import_jsx_runtime56 = require("react/jsx-runtime");
-var ToasterContext = (0, import_react46.createContext)(null);
+var ToasterContext = (0, import_react47.createContext)(null);
 function Toast({ title, message, tone, icon, action, onClose, leaving, dismissLabel: dismissLabelProp, className, ...props }) {
   const uixLabels = useUixLabels();
   const dismissLabel = dismissLabelProp ?? uixLabels.toast?.dismiss ?? "Dismiss";
   const assertive = tone === "danger";
-  const toaster = (0, import_react46.useContext)(ToasterContext);
-  const bodyRef = (0, import_react46.useRef)(null);
-  (0, import_react46.useEffect)(() => {
+  const toaster = (0, import_react47.useContext)(ToasterContext);
+  const bodyRef = (0, import_react47.useRef)(null);
+  (0, import_react47.useEffect)(() => {
     if (assertive || !toaster) return;
     const text = bodyRef.current?.textContent?.trim();
     if (text) toaster.announce(text);
@@ -6714,8 +6735,8 @@ function StoreToast({ record, store }) {
   );
 }
 function useToastTimers(store, visible, paused) {
-  const timers = (0, import_react46.useRef)(/* @__PURE__ */ new Map());
-  (0, import_react46.useEffect)(() => {
+  const timers = (0, import_react47.useRef)(/* @__PURE__ */ new Map());
+  (0, import_react47.useEffect)(() => {
     const now = Date.now();
     const map = timers.current;
     const live = new Map(visible.filter((r) => !r.leaving && r.duration != null).map((r) => [r.id, r]));
@@ -6745,7 +6766,7 @@ function useToastTimers(store, visible, paused) {
       }
     }
   });
-  (0, import_react46.useEffect)(() => () => {
+  (0, import_react47.useEffect)(() => () => {
     for (const timer of timers.current.values()) if (timer.handle != null) clearTimeout(timer.handle);
     timers.current.clear();
   }, []);
@@ -6753,23 +6774,23 @@ function useToastTimers(store, visible, paused) {
 function Toaster({ children, regionLabel: regionLabelProp, store = toast.store, limit = 3, position = "bottom-end", className, onMouseEnter, onMouseLeave, onFocus, onBlur, onKeyDown, ...props }) {
   const uixLabels = useUixLabels();
   const regionLabel = regionLabelProp ?? uixLabels.toaster?.region ?? "Notifications";
-  const [announced, setAnnounced] = (0, import_react46.useState)("");
-  const clearTimer = (0, import_react46.useRef)(null);
-  const announce = (0, import_react46.useCallback)((text) => {
+  const [announced, setAnnounced] = (0, import_react47.useState)("");
+  const clearTimer = (0, import_react47.useRef)(null);
+  const announce = (0, import_react47.useCallback)((text) => {
     setAnnounced((cur) => cur ? `${cur} ${text}` : text);
     if (clearTimer.current != null) clearTimeout(clearTimer.current);
     clearTimer.current = window.setTimeout(() => setAnnounced(""), 3e3);
   }, []);
-  (0, import_react46.useEffect)(() => () => {
+  (0, import_react47.useEffect)(() => () => {
     if (clearTimer.current != null) clearTimeout(clearTimer.current);
   }, []);
-  const ctx = (0, import_react46.useMemo)(() => ({ announce }), [announce]);
-  const records = (0, import_react46.useSyncExternalStore)(store.subscribe, store.getSnapshot, store.getSnapshot);
-  const visible = (0, import_react46.useMemo)(() => records.slice(-Math.max(1, limit)), [records, limit]);
-  const [hovered, setHovered] = (0, import_react46.useState)(false);
-  const [focused, setFocused] = (0, import_react46.useState)(false);
-  const [hidden, setHidden] = (0, import_react46.useState)(false);
-  (0, import_react46.useEffect)(() => {
+  const ctx = (0, import_react47.useMemo)(() => ({ announce }), [announce]);
+  const records = (0, import_react47.useSyncExternalStore)(store.subscribe, store.getSnapshot, store.getSnapshot);
+  const visible = (0, import_react47.useMemo)(() => records.slice(-Math.max(1, limit)), [records, limit]);
+  const [hovered, setHovered] = (0, import_react47.useState)(false);
+  const [focused, setFocused] = (0, import_react47.useState)(false);
+  const [hidden, setHidden] = (0, import_react47.useState)(false);
+  (0, import_react47.useEffect)(() => {
     const sync = () => setHidden(document.visibilityState === "hidden");
     sync();
     document.addEventListener("visibilitychange", sync);
@@ -6820,9 +6841,9 @@ function Toaster({ children, regionLabel: regionLabelProp, store = toast.store,
 }
 // src/components/Table.tsx
-var import_react47 = require("react");
+var import_react48 = require("react");
 var import_jsx_runtime57 = require("react/jsx-runtime");
-var TableWrap = (0, import_react47.forwardRef)(function TableWrap2({ announcement, children, className, ...props }, ref) {
+var TableWrap = (0, import_react48.forwardRef)(function TableWrap2({ announcement, children, className, ...props }, ref) {
   return /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { ref, className: cx("uix-table-wrap", className), ...props, children: [
     announcement != null && /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { role: "status", className: "uix-visually-hidden", children: announcement }),
     children
@@ -6931,7 +6952,7 @@ function Highlighted({ text, query }) {
 }
 // src/components/Pagination.tsx
-var import_react48 = require("react");
+var import_react49 = require("react");
 var import_jsx_runtime58 = require("react/jsx-runtime");
 function getPageNumbers(page, total) {
   if (total <= 7) return Array.from({ length: total }, (_, i) => i + 1);
@@ -6973,7 +6994,7 @@ function Pagination({
   const labels = { ...DEFAULT_PAGINATION_LABELS, ...labelOverrides };
   const render = ({ key, content, label, current, disabled, href, onClick }) => {
     if (href != null && !disabled) {
-      return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_react48.Fragment, { children: renderUixLink(renderLink, {
+      return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_react49.Fragment, { children: renderUixLink(renderLink, {
         href,
         className: "uix-pagination__btn",
         "aria-label": label,
@@ -7051,7 +7072,7 @@ function Meter({ value = 0, tone, label, toneLabels, className, ...props }) {
         "div",
         {
           className: "uix-meter__fill",
-          style: { width: `${pct}%` },
+          style: { "--val": pct / 100 },
           ...tone && tone !== "success" ? { "data-tone": tone } : {}
         }
       )
@@ -7060,11 +7081,11 @@ function Meter({ value = 0, tone, label, toneLabels, className, ...props }) {
 }
 // src/components/Stat.tsx
-var import_react49 = require("react");
+var import_react50 = require("react");
 var import_jsx_runtime61 = require("react/jsx-runtime");
 var Chevron3 = () => /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("span", { className: "uix-stat__chevron", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("path", { d: "m6 9 6 6 6-6" }) }) });
-var Stat = (0, import_react49.forwardRef)(function Stat2({ label, value, icon, meta, trend, tone = "neutral", size = "hero", onActivate, activateLabel, expanded, trendLabels, haspopup = "dialog", href, current, renderLink, className, onClick, onKeyDown, pending = false, ...props }, ref) {
-  const id = (0, import_react49.useId)();
+var Stat = (0, import_react50.forwardRef)(function Stat2({ label, value, icon, meta, trend, tone = "neutral", size = "hero", onActivate, activateLabel, expanded, trendLabels, haspopup = "dialog", href, current, renderLink, className, onClick, onKeyDown, pending = false, ...props }, ref) {
+  const id = (0, import_react50.useId)();
   const interactive = onActivate != null;
   const linked = !interactive && href != null;
   const classes = cx(
@@ -7327,7 +7348,7 @@ function predictionBand(fit, xs, level = 0.8) {
 }
 // src/components/Chip.tsx
-var import_react50 = require("react");
+var import_react51 = require("react");
 // src/components/ChipRemove.tsx
 var import_jsx_runtime63 = require("react/jsx-runtime");
@@ -7339,7 +7360,7 @@ function ChipRemoveButton({ label, text, disabled, onRemove }) {
 // src/components/Chip.tsx
 var import_jsx_runtime64 = require("react/jsx-runtime");
-var Chip = (0, import_react50.forwardRef)(function Chip2({
+var Chip = (0, import_react51.forwardRef)(function Chip2({
   children,
   icon,
   count: count2,
@@ -7429,7 +7450,7 @@ function ChipGroup({ label, children, className, ...props }) {
 }
 // src/components/Steps.tsx
-var import_react51 = require("react");
+var import_react52 = require("react");
 var import_jsx_runtime65 = require("react/jsx-runtime");
 var DEFAULT_STEP_STATE_LABELS = {
   complete: "Completed",
@@ -7442,9 +7463,9 @@ var CSS_STATE = { complete: "done", current: "active", upcoming: void 0, waiting
 var Check = () => /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("svg", { viewBox: "0 0 16 16", width: "12", height: "12", fill: "none", stroke: "currentColor", strokeWidth: 2.25, strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("path", { d: "M3.5 8.5l3 3 6-7" }) });
 function Steps({ orientation = "horizontal", progress = true, headingLevel, label, stateLabels, className, children, ...props }) {
   const labels = { ...DEFAULT_STEP_STATE_LABELS, ...stateLabels };
-  const steps = import_react51.Children.toArray(children).filter(import_react51.isValidElement);
+  const steps = import_react52.Children.toArray(children).filter(import_react52.isValidElement);
   const direction = progress ? orientation : "vertical";
-  return /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("ol", { "aria-label": label, className: cx("uix-steps", "uix-steps--list", `uix-steps--${direction}`, !progress && "uix-steps--sections", className), ...props, children: steps.map((step, index) => (0, import_react51.cloneElement)(step, { index, last: index === steps.length - 1, stateLabels: labels, progress, headingLevel })) });
+  return /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("ol", { "aria-label": label, className: cx("uix-steps", "uix-steps--list", `uix-steps--${direction}`, !progress && "uix-steps--sections", className), ...props, children: steps.map((step, index) => (0, import_react52.cloneElement)(step, { index, last: index === steps.length - 1, stateLabels: labels, progress, headingLevel })) });
 }
 function Step({
   title,
@@ -7463,7 +7484,7 @@ function Step({
   className,
   ...props
 }) {
-  const titleId = (0, import_react51.useId)();
+  const titleId = (0, import_react52.useId)();
   const glyph = marker ?? (!progress ? index + 1 : state === "complete" ? /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(Check, {}) : state === "error" ? "!" : index + 1);
   const Title = headingLevel ? `h${headingLevel}` : "span";
   const name = /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)(import_jsx_runtime65.Fragment, { children: [
@@ -7496,16 +7517,16 @@ function Step({
 }
 // src/components/Tooltip.tsx
-var import_react52 = require("react");
+var import_react53 = require("react");
 var import_jsx_runtime66 = require("react/jsx-runtime");
 function Tooltip({ label, content, placement = "top", shortcut, className, children, ...props }) {
-  const triggerRef = (0, import_react52.useRef)(null);
-  const bubbleRef = (0, import_react52.useRef)(null);
-  const closeTimer = (0, import_react52.useRef)(null);
-  const [open, setOpen] = (0, import_react52.useState)(false);
-  const id = (0, import_react52.useId)();
+  const triggerRef = (0, import_react53.useRef)(null);
+  const bubbleRef = (0, import_react53.useRef)(null);
+  const closeTimer = (0, import_react53.useRef)(null);
+  const [open, setOpen] = (0, import_react53.useState)(false);
+  const id = (0, import_react53.useId)();
   const platform = useKbdPlatform();
-  const childShortcut = (0, import_react52.isValidElement)(children) ? children.props.shortcut : void 0;
+  const childShortcut = (0, import_react53.isValidElement)(children) ? children.props.shortcut : void 0;
   const own = shortcut ?? (isKeyShortcut(childShortcut) ? childShortcut : void 0);
   const keys = own && own.length > 0 ? own : null;
   const keyshortcuts = keys ? ariaKeyShortcuts(keys, platform) : void 0;
@@ -7542,7 +7563,7 @@ function Tooltip({ label, content, placement = "top", shortcut, className, child
     cancelClose();
     closeTimer.current = window.setTimeout(hide, 100);
   };
-  (0, import_react52.useEffect)(() => {
+  (0, import_react53.useEffect)(() => {
     if (!open) return;
     const onKey = (e) => {
       if (e.key === "Escape") hide();
@@ -7550,7 +7571,7 @@ function Tooltip({ label, content, placement = "top", shortcut, className, child
     document.addEventListener("keydown", onKey);
     return () => document.removeEventListener("keydown", onKey);
   }, [open]);
-  (0, import_react52.useEffect)(() => () => {
+  (0, import_react53.useEffect)(() => () => {
     if (closeTimer.current != null) clearTimeout(closeTimer.current);
     const b = bubbleRef.current;
     if (b && b.matches(":popover-open")) {
@@ -7561,8 +7582,8 @@ function Tooltip({ label, content, placement = "top", shortcut, className, child
     }
   }, []);
   const bubbleAttr = { popover: "manual" };
-  const single = (0, import_react52.isValidElement)(children);
-  const child = single ? (0, import_react52.cloneElement)(children, {
+  const single = (0, import_react53.isValidElement)(children);
+  const child = single ? (0, import_react53.cloneElement)(children, {
     "aria-describedby": [children.props["aria-describedby"], id].filter(Boolean).join(" "),
     ...keyshortcuts ? { "aria-keyshortcuts": keyshortcuts } : {}
   }) : children;
@@ -7669,7 +7690,7 @@ function LoadingState({ rows = 3, density = "comfortable", label, className, ...
 }
 // src/components/RelativeTime.tsx
-var import_react53 = require("react");
+var import_react54 = require("react");
 // src/relative-time-model.ts
 function parseDateValue(value) {
@@ -7732,12 +7753,12 @@ function RelativeTime({
 }) {
   const interval = refreshInterval === false ? 0 : Math.max(0, refreshInterval);
   const fixedNow = now == null ? void 0 : new Date(now).getTime();
-  const subscribe = (0, import_react53.useCallback)((listener) => fixedNow == null ? subscribeRelativeClock(interval, listener) : () => {
+  const subscribe2 = (0, import_react54.useCallback)((listener) => fixedNow == null ? subscribeRelativeClock(interval, listener) : () => {
   }, [fixedNow, interval]);
-  const getSnapshot = (0, import_react53.useCallback)(() => fixedNow ?? readRelativeClock(interval), [fixedNow, interval]);
-  const getServerSnapshot = (0, import_react53.useCallback)(() => fixedNow ?? Date.now(), [fixedNow]);
-  const clock = (0, import_react53.useSyncExternalStore)(subscribe, getSnapshot, getServerSnapshot);
-  const date = (0, import_react53.useMemo)(() => parseDateValue(value), [value]);
+  const getSnapshot = (0, import_react54.useCallback)(() => fixedNow ?? readRelativeClock(interval), [fixedNow, interval]);
+  const getServerSnapshot = (0, import_react54.useCallback)(() => fixedNow ?? Date.now(), [fixedNow]);
+  const clock = (0, import_react54.useSyncExternalStore)(subscribe2, getSnapshot, getServerSnapshot);
+  const date = (0, import_react54.useMemo)(() => parseDateValue(value), [value]);
   if (!date) return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("time", { "data-invalid": "true", suppressHydrationWarning: true, ...props, children: invalidLabel });
   const current = new Date(clock);
   const content = formatter ? formatter({ date, now: current, locale, timeZone }) : (() => {
@@ -7889,13 +7910,13 @@ function SaveStatus({ state, labels, onRetry, className, ...props }) {
 }
 // src/components/Composer.tsx
-var import_react54 = require("react");
+var import_react55 = require("react");
 var import_jsx_runtime74 = require("react/jsx-runtime");
 function Composer({ children, className, label = "Add a comment", ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("div", { className: cx("uix-composer", className), ...props, children: import_react54.Children.map(children, (child) => {
-    if (!(0, import_react54.isValidElement)(child) || child.type !== "textarea") return child;
+  return /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("div", { className: cx("uix-composer", className), ...props, children: import_react55.Children.map(children, (child) => {
+    if (!(0, import_react55.isValidElement)(child) || child.type !== "textarea") return child;
     const p = child.props;
-    return p["aria-label"] || p["aria-labelledby"] || p.id ? child : (0, import_react54.cloneElement)(child, { "aria-label": label });
+    return p["aria-label"] || p["aria-labelledby"] || p.id ? child : (0, import_react55.cloneElement)(child, { "aria-label": label });
   }) });
 }
 function ComposerBar({ children, className, ...props }) {
@@ -7903,14 +7924,14 @@ function ComposerBar({ children, className, ...props }) {
 }
 // src/components/Segmented.tsx
-var import_react55 = require("react");
+var import_react56 = require("react");
 var import_jsx_runtime75 = require("react/jsx-runtime");
-var SegmentedCtx = (0, import_react55.createContext)({});
+var SegmentedCtx = (0, import_react56.createContext)({});
 var OPTION = ".uix-segmented__option";
 function Segmented({ value, onChange, selection = "toggle", children, className, onKeyDown, ...props }) {
-  const ref = (0, import_react55.useRef)(null);
-  const contextValue = (0, import_react55.useMemo)(() => ({ value, onChange, selection }), [value, onChange, selection]);
-  (0, import_react55.useEffect)(() => {
+  const ref = (0, import_react56.useRef)(null);
+  const contextValue = (0, import_react56.useMemo)(() => ({ value, onChange, selection }), [value, onChange, selection]);
+  (0, import_react56.useEffect)(() => {
     const group = ref.current;
     if (!group) return;
     const all = Array.from(group.querySelectorAll(OPTION));
@@ -7967,7 +7988,7 @@ function SegmentedOption({
   onClick,
   ...props
 }) {
-  const ctx = (0, import_react55.useContext)(SegmentedCtx);
+  const ctx = (0, import_react56.useContext)(SegmentedCtx);
   const selected = ctx.value === value;
   const radio = ctx.selection === "radio";
   return /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
@@ -7990,7 +8011,7 @@ function SegmentedOption({
 }
 // src/components/TableControls.tsx
-var import_react56 = require("react");
+var import_react57 = require("react");
 // src/components/EditorIcons.tsx
 var import_jsx_runtime76 = require("react/jsx-runtime");
@@ -8066,11 +8087,11 @@ var isPopoverOpen2 = (el) => {
   }
 };
 function ColumnRowMenu({ label, actions, triggerRef }) {
-  const [open, setOpen] = (0, import_react56.useState)(false);
-  const menuId = (0, import_react56.useId)();
-  const button = (0, import_react56.useRef)(null);
-  const items = (0, import_react56.useRef)([]);
-  const wasOpenAtPress = (0, import_react56.useRef)(false);
+  const [open, setOpen] = (0, import_react57.useState)(false);
+  const menuId = (0, import_react57.useId)();
+  const button = (0, import_react57.useRef)(null);
+  const items = (0, import_react57.useRef)([]);
+  const wasOpenAtPress = (0, import_react57.useRef)(false);
   const enabled = () => items.current.filter((el) => !!el && !el.disabled);
   const close = (returnFocus) => {
     const el = document.getElementById(menuId);
@@ -8078,7 +8099,7 @@ function ColumnRowMenu({ label, actions, triggerRef }) {
     setOpen(false);
     if (returnFocus) button.current?.focus();
   };
-  (0, import_react56.useEffect)(() => {
+  (0, import_react57.useEffect)(() => {
     if (!open) return;
     const el = document.getElementById(menuId);
     if (el && typeof el.showPopover === "function" && !isPopoverOpen2(el)) {
@@ -8181,25 +8202,25 @@ function ViewMenu({
   footer,
   className
 }) {
-  const baseId = (0, import_react56.useId)();
+  const baseId = (0, import_react57.useId)();
   const densityLabelId = `${baseId}-density`;
   const zebraLabelId = `${baseId}-zebra`;
   const freezeLabelId = `${baseId}-freeze`;
   const columnsLabelId = `${baseId}-columns`;
   const labels = { ...VIEW_MENU_COLUMN_LABELS, ...columnLabels };
   const list = columns ?? [];
-  const [draft, setDraft] = (0, import_react56.useState)(null);
-  const [announcement, setAnnouncement] = (0, import_react56.useState)("");
-  const dragStart = (0, import_react56.useRef)(null);
-  const listRef = (0, import_react56.useRef)(null);
-  const triggers = (0, import_react56.useRef)(/* @__PURE__ */ new Map());
-  const refocus = (0, import_react56.useRef)(null);
+  const [draft, setDraft] = (0, import_react57.useState)(null);
+  const [announcement, setAnnouncement] = (0, import_react57.useState)("");
+  const dragStart = (0, import_react57.useRef)(null);
+  const listRef = (0, import_react57.useRef)(null);
+  const triggers = (0, import_react57.useRef)(/* @__PURE__ */ new Map());
+  const refocus = (0, import_react57.useRef)(null);
   const orderKey = JSON.stringify(list.map((column) => column.id));
-  (0, import_react56.useEffect)(() => setDraft(null), [orderKey]);
+  (0, import_react57.useEffect)(() => setDraft(null), [orderKey]);
   const order = draft ?? list.map((column) => column.id);
   const byId = new Map(list.map((column) => [column.id, column]));
   const ordered = order.map((id) => byId.get(id)).filter((column) => !!column);
-  (0, import_react56.useEffect)(() => {
+  (0, import_react57.useEffect)(() => {
     const target = refocus.current;
     refocus.current = null;
     if (!target) return;
@@ -8321,7 +8342,7 @@ function ViewMenu({
   ] });
 }
 function FilterPopover({ label, type = "text", value, onValueChange, options, applyLabel, clearLabel, onApply, onClear, placeholder }) {
-  const controlId = (0, import_react56.useId)();
+  const controlId = (0, import_react57.useId)();
   return /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("div", { className: "uix-filter-popover", children: [
     /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("div", { className: "uix-field", children: [
       /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("label", { className: "uix-field__label", htmlFor: controlId, children: label }),
@@ -8344,11 +8365,11 @@ function dropIndex(rows, dragged, clientY) {
   return index;
 }
 function useRowDrag(rowSelector, handlers) {
-  const [dragging, setDragging] = (0, import_react56.useState)(null);
-  const drag = (0, import_react56.useRef)(null);
-  const latest = (0, import_react56.useRef)(handlers);
+  const [dragging, setDragging] = (0, import_react57.useState)(null);
+  const drag = (0, import_react57.useRef)(null);
+  const latest = (0, import_react57.useRef)(handlers);
   latest.current = handlers;
-  (0, import_react56.useEffect)(() => {
+  (0, import_react57.useEffect)(() => {
     if (!dragging) return;
     const move = (event) => {
       const current = drag.current;
@@ -8388,13 +8409,13 @@ function placeId(ids, id, index) {
   return next;
 }
 function SavedViewMenu({ items, sections, onSelect, onPinChange, pinLabel, unpinLabel, onReorder, reorderLabel, emptyLabel, actions, footer }) {
-  const baseId = (0, import_react56.useId)();
+  const baseId = (0, import_react57.useId)();
   const groups = sections ?? [{ id: void 0, items: items ?? [] }];
-  const [draft, setDraft] = (0, import_react56.useState)(null);
-  const dragStart = (0, import_react56.useRef)(null);
-  const dragGroup = (0, import_react56.useRef)(void 0);
+  const [draft, setDraft] = (0, import_react57.useState)(null);
+  const dragStart = (0, import_react57.useRef)(null);
+  const dragGroup = (0, import_react57.useRef)(void 0);
   const orderKey = JSON.stringify(groups.map((group) => [group.id, group.items.map((item) => item.id)]));
-  (0, import_react56.useEffect)(() => setDraft(null), [orderKey]);
+  (0, import_react57.useEffect)(() => setDraft(null), [orderKey]);
   const orderOf = (group) => draft && draft.group === group.id ? draft.ids : group.items.map((item) => item.id);
   const move = (group, id, delta) => {
     const current = orderOf(group);
@@ -8471,7 +8492,7 @@ function SavedViewMenu({ items, sections, onSelect, onPinChange, pinLabel, unpin
 }
 // src/components/FilterEditor.tsx
-var import_react57 = require("react");
+var import_react58 = require("react");
 // src/filter-model.ts
 var DEFAULT_FILTER_SUMMARY_LABELS = {
@@ -8615,7 +8636,7 @@ function FilterEditor({ field, value: valueProp, onValueChange, onApply, onClear
     ...labelOverrides,
     operators: { ...DEFAULT_FILTER_EDITOR_LABELS.operators, ...provided?.operators, ...labelOverrides?.operators }
   };
-  const id = (0, import_react57.useId)();
+  const id = (0, import_react58.useId)();
   const value = valueProp?.kind === field.kind ? valueProp : emptyFilterValue(field.kind);
   let body = null;
   switch (value.kind) {
@@ -8681,9 +8702,9 @@ function FilterEditor({ field, value: valueProp, onValueChange, onApply, onClear
   ] });
 }
 function EnumBody({ field, value, onChange, labels, threshold }) {
-  const [query, setQuery] = (0, import_react57.useState)("");
+  const [query, setQuery] = (0, import_react58.useState)("");
   const options = field.options ?? [];
-  const shown = (0, import_react57.useMemo)(() => {
+  const shown = (0, import_react58.useMemo)(() => {
     const q = foldForSearch(query.trim()).text;
     return q ? options.filter((o) => foldForSearch(o.label).text.includes(q)) : options;
   }, [options, query]);
@@ -8703,11 +8724,11 @@ function EnumBody({ field, value, onChange, labels, threshold }) {
   ] });
 }
 function ReferenceBody({ field, value, onChange, labels, delay }) {
-  const [query, setQuery] = (0, import_react57.useState)("");
-  const [state, setState] = (0, import_react57.useState)({ status: "idle", results: [] });
-  const [attempt, setAttempt] = (0, import_react57.useState)(0);
-  const latest = (0, import_react57.useRef)(0);
-  (0, import_react57.useEffect)(() => {
+  const [query, setQuery] = (0, import_react58.useState)("");
+  const [state, setState] = (0, import_react58.useState)({ status: "idle", results: [] });
+  const [attempt, setAttempt] = (0, import_react58.useState)(0);
+  const latest = (0, import_react58.useRef)(0);
+  (0, import_react58.useEffect)(() => {
     if (!field.onSearch) return;
     const run = ++latest.current;
     const timer = window.setTimeout(() => {
@@ -8760,10 +8781,10 @@ function TimelineItem({ node, meta, children, className, ...props }) {
 }
 // src/components/Pipeline.tsx
-var import_react58 = require("react");
+var import_react59 = require("react");
 var import_jsx_runtime80 = require("react/jsx-runtime");
 function Pipeline({ detailed = false, children, className, tabIndex, ...props }) {
-  const stages = detailed ? import_react58.Children.map(children, (child) => (0, import_react58.isValidElement)(child) && child.type === PipelineStage ? (0, import_react58.cloneElement)(child, { detailed: child.props.detailed ?? true }) : child) : children;
+  const stages = detailed ? import_react59.Children.map(children, (child) => (0, import_react59.isValidElement)(child) && child.type === PipelineStage ? (0, import_react59.cloneElement)(child, { detailed: child.props.detailed ?? true }) : child) : children;
   return /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
     "ol",
     {
@@ -8879,7 +8900,7 @@ function Note({ tone, icon, children, className, ...props }) {
 }
 // src/components/Menu.tsx
-var import_react59 = require("react");
+var import_react60 = require("react");
 var import_jsx_runtime83 = require("react/jsx-runtime");
 function useRowShortcut(shortcut) {
   const platform = useKbdPlatform();
@@ -8890,8 +8911,8 @@ function useRowShortcut(shortcut) {
     aria: { "aria-keyshortcuts": ariaKeyShortcuts(shortcut, platform) }
   };
 }
-var MenuContext = (0, import_react59.createContext)(null);
-var MenuRadioContext = (0, import_react59.createContext)(null);
+var MenuContext = (0, import_react60.createContext)(null);
+var MenuRadioContext = (0, import_react60.createContext)(null);
 var ITEM = '[role^="menuitem"]:not([aria-disabled="true"])';
 var itemAttributes = (rest) => {
   const out = {};
@@ -8899,14 +8920,14 @@ var itemAttributes = (rest) => {
   return out;
 };
 function Menu({ trigger, children, open: controlledOpen, defaultOpen = false, onOpenChange, label, placement = "bottom-start", className }) {
-  const id = (0, import_react59.useId)();
+  const id = (0, import_react60.useId)();
   const menuId = `${id}-menu`;
   const triggerId = `${id}-trigger`;
-  const triggerRef = (0, import_react59.useRef)(null);
-  const [internalOpen, setInternalOpen] = (0, import_react59.useState)(defaultOpen);
+  const triggerRef = (0, import_react60.useRef)(null);
+  const [internalOpen, setInternalOpen] = (0, import_react60.useState)(defaultOpen);
   const open = controlledOpen ?? internalOpen;
-  const focusOnOpen = (0, import_react59.useRef)("first");
-  const typeahead2 = (0, import_react59.useRef)({ text: "", at: 0 });
+  const focusOnOpen = (0, import_react60.useRef)("first");
+  const typeahead2 = (0, import_react60.useRef)({ text: "", at: 0 });
   const setOpen = (next) => {
     if (controlledOpen === void 0) setInternalOpen(next);
     onOpenChange?.(next);
@@ -8917,7 +8938,7 @@ function Menu({ trigger, children, open: controlledOpen, defaultOpen = false, on
     setOpen(false);
     if (refocus) triggerRef.current?.focus();
   };
-  (0, import_react59.useEffect)(() => {
+  (0, import_react60.useEffect)(() => {
     const el = menu();
     if (!el) return;
     const shown = () => {
@@ -8977,8 +8998,8 @@ function Menu({ trigger, children, open: controlledOpen, defaultOpen = false, on
       order.find((item) => (item.textContent ?? "").trim().toLowerCase().startsWith(typeahead2.current.text))?.focus();
     }
   };
-  const triggerProps = (0, import_react59.isValidElement)(trigger) ? trigger.props : {};
-  const triggerElement = (0, import_react59.isValidElement)(trigger) ? (0, import_react59.cloneElement)(trigger, {
+  const triggerProps = (0, import_react60.isValidElement)(trigger) ? trigger.props : {};
+  const triggerElement = (0, import_react60.isValidElement)(trigger) ? (0, import_react60.cloneElement)(trigger, {
     ref: (node) => {
       triggerRef.current = node;
     },
@@ -9032,7 +9053,7 @@ function Menu({ trigger, children, open: controlledOpen, defaultOpen = false, on
   ] });
 }
 function MenuItem({ children, onSelect, href, renderLink, icon, shortcut, tone = "default", disabled, className, ...rest }) {
-  const menu = (0, import_react59.useContext)(MenuContext);
+  const menu = (0, import_react60.useContext)(MenuContext);
   const classes = cx("uix-menu__item", tone === "danger" && "uix-menu__item--danger", className);
   const attributes = itemAttributes(rest);
   const keys = useRowShortcut(shortcut);
@@ -9075,7 +9096,7 @@ function CheckableItem({
   className,
   ...rest
 }) {
-  const menu = (0, import_react59.useContext)(MenuContext);
+  const menu = (0, import_react60.useContext)(MenuContext);
   const keys = useRowShortcut(shortcut);
   return /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)(
     "button",
@@ -9111,14 +9132,14 @@ function CheckableItem({
   );
 }
 function MenuRadioGroup({ value, onValueChange, label, "aria-label": ariaLabel, children }) {
-  const id = (0, import_react59.useId)();
+  const id = (0, import_react60.useId)();
   return /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(MenuRadioContext.Provider, { value: { value, onValueChange }, children: /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)("div", { role: "group", "aria-labelledby": label != null ? id : void 0, "aria-label": label != null ? void 0 : ariaLabel, children: [
     label != null && /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("div", { id, className: "uix-menu__label", children: label }),
     children
   ] }) });
 }
 function MenuItemRadio({ value, checked, onSelect, closeOnSelect = true, ...rest }) {
-  const group = (0, import_react59.useContext)(MenuRadioContext);
+  const group = (0, import_react60.useContext)(MenuRadioContext);
   return /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(
     CheckableItem,
     {
@@ -9146,7 +9167,7 @@ function MenuItemCheckbox({ checked, onCheckedChange, closeOnSelect = false, ...
   );
 }
 function MenuGroup({ label, children }) {
-  const id = (0, import_react59.useId)();
+  const id = (0, import_react60.useId)();
   return /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)("div", { role: "group", "aria-labelledby": id, children: [
     /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("div", { id, className: "uix-menu__label", children: label }),
     children
@@ -9157,34 +9178,42 @@ function MenuSeparator() {
 }
 // src/components/CommandPalette.tsx
-var import_react60 = require("react");
+var import_react61 = require("react");
 var import_jsx_runtime84 = require("react/jsx-runtime");
-var CmdkContext = (0, import_react60.createContext)(null);
+var CmdkContext = (0, import_react61.createContext)(null);
+var useIsomorphicLayoutEffect8 = typeof document !== "undefined" ? import_react61.useLayoutEffect : import_react61.useEffect;
 function CommandPalette({ inputProps, children, inputLabel: inputLabelProp, resultsLabel, className, ...props }) {
   const uixLabels = useUixLabels();
   const inputLabel = inputLabelProp ?? uixLabels.commandPalette?.input ?? "Command palette";
   const resultsOne = uixLabels.commandPalette?.resultsOne ?? "{count} result";
   const resultsMany = uixLabels.commandPalette?.resultsMany ?? "{count} results";
   const resultsText = (count3) => resultsLabel?.(count3) ?? fillLabel(count3 === 1 ? resultsOne : resultsMany, { count: count3 });
-  const resultsTextRef = (0, import_react60.useRef)(resultsText);
+  const resultsTextRef = (0, import_react61.useRef)(resultsText);
   resultsTextRef.current = resultsText;
-  const listId = (0, import_react60.useId)();
-  const [activeId, setActiveId] = (0, import_react60.useState)(null);
-  const [count2, setCount] = (0, import_react60.useState)(0);
-  const [announced, setAnnounced] = (0, import_react60.useState)("");
-  const setActive = (0, import_react60.useCallback)((id, active) => {
+  const listId = (0, import_react61.useId)();
+  const rootRef = (0, import_react61.useRef)(null);
+  useIsomorphicLayoutEffect8(() => {
+    const overlay = rootRef.current?.closest("dialog, [popover]");
+    if (!overlay || overlay.hasAttribute("data-uix-instant")) return;
+    overlay.setAttribute("data-uix-instant", "");
+    return () => overlay.removeAttribute("data-uix-instant");
+  }, []);
+  const [activeId, setActiveId] = (0, import_react61.useState)(null);
+  const [count2, setCount] = (0, import_react61.useState)(0);
+  const [announced, setAnnounced] = (0, import_react61.useState)("");
+  const setActive = (0, import_react61.useCallback)((id, active) => {
     setActiveId((cur) => active ? id : cur === id ? null : cur);
   }, []);
-  const registerItem = (0, import_react60.useCallback)(() => {
+  const registerItem = (0, import_react61.useCallback)(() => {
     setCount((c) => c + 1);
     return () => setCount((c) => c - 1);
   }, []);
-  (0, import_react60.useEffect)(() => {
+  (0, import_react61.useEffect)(() => {
     const t = window.setTimeout(() => setAnnounced(resultsTextRef.current(count2)), 150);
     return () => clearTimeout(t);
   }, [count2]);
-  const ctx = (0, import_react60.useMemo)(() => ({ listId, setActive, registerItem }), [listId, setActive, registerItem]);
-  return /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(CmdkContext.Provider, { value: ctx, children: /* @__PURE__ */ (0, import_jsx_runtime84.jsxs)("div", { className: cx("uix-cmdk", className), ...props, children: [
+  const ctx = (0, import_react61.useMemo)(() => ({ listId, setActive, registerItem }), [listId, setActive, registerItem]);
+  return /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(CmdkContext.Provider, { value: ctx, children: /* @__PURE__ */ (0, import_jsx_runtime84.jsxs)("div", { ref: rootRef, className: cx("uix-cmdk", className), ...props, children: [
     /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(
       "input",
       {
@@ -9203,18 +9232,18 @@ function CommandPalette({ inputProps, children, inputLabel: inputLabelProp, resu
   ] }) });
 }
 function CommandGroup({ label, children }) {
-  const labelId = (0, import_react60.useId)();
+  const labelId = (0, import_react61.useId)();
   return /* @__PURE__ */ (0, import_jsx_runtime84.jsxs)("div", { role: "group", "aria-labelledby": label != null ? labelId : void 0, children: [
     label != null && /* @__PURE__ */ (0, import_jsx_runtime84.jsx)("div", { className: "uix-cmdk__group", id: labelId, children: label }),
     children
   ] });
 }
 function CommandItem({ icon, shortcut, active, children, className, id, ...props }) {
-  const ctx = (0, import_react60.useContext)(CmdkContext);
-  const autoId = (0, import_react60.useId)();
+  const ctx = (0, import_react61.useContext)(CmdkContext);
+  const autoId = (0, import_react61.useId)();
   const itemId = id ?? autoId;
-  (0, import_react60.useEffect)(() => ctx?.registerItem(), [ctx]);
-  (0, import_react60.useEffect)(() => {
+  (0, import_react61.useEffect)(() => ctx?.registerItem(), [ctx]);
+  (0, import_react61.useEffect)(() => {
     if (!ctx || !active) return;
     ctx.setActive(itemId, true);
     return () => ctx.setActive(itemId, false);
@@ -9238,16 +9267,16 @@ function CommandItem({ icon, shortcut, active, children, className, id, ...props
 }
 // src/components/Inbox.tsx
-var import_react61 = require("react");
+var import_react62 = require("react");
 var import_jsx_runtime85 = require("react/jsx-runtime");
 function Inbox({ view, children, className, ...props }) {
   return /* @__PURE__ */ (0, import_jsx_runtime85.jsx)("div", { className: cx("uix-inbox", className), "data-view": view, ...props, children });
 }
-var InboxListCtx = (0, import_react61.createContext)({});
+var InboxListCtx = (0, import_react62.createContext)({});
 function InboxList({ children, listLabel = "Inbox", className, ...props }) {
-  const listRef = (0, import_react61.useRef)(null);
-  const [activeId, setActiveId] = (0, import_react61.useState)(void 0);
-  const ctx = (0, import_react61.useMemo)(() => ({ activeId }), [activeId]);
+  const listRef = (0, import_react62.useRef)(null);
+  const [activeId, setActiveId] = (0, import_react62.useState)(void 0);
+  const ctx = (0, import_react62.useMemo)(() => ({ activeId }), [activeId]);
   const onKeyDown = (e) => {
     const opts = Array.from(listRef.current?.querySelectorAll('[role="option"]') ?? []);
     if (opts.length === 0) return;
@@ -9308,9 +9337,9 @@ function InboxItem({
   id,
   ...props
 }) {
-  const autoId = (0, import_react61.useId)();
+  const autoId = (0, import_react62.useId)();
   const itemId = id ?? autoId;
-  const { activeId } = (0, import_react61.useContext)(InboxListCtx);
+  const { activeId } = (0, import_react62.useContext)(InboxListCtx);
   return /* @__PURE__ */ (0, import_jsx_runtime85.jsxs)(
     "div",
     {
@@ -9335,7 +9364,7 @@ function InboxDetail({ children, className, ...props }) {
 }
 // src/components/Kanban.tsx
-var import_react62 = require("react");
+var import_react63 = require("react");
 var import_jsx_runtime86 = require("react/jsx-runtime");
 function Kanban({ announcement, children, className, ...props }) {
   return /* @__PURE__ */ (0, import_jsx_runtime86.jsxs)("div", { className: cx("uix-kanban", className), ...props, children: [
@@ -9344,7 +9373,7 @@ function Kanban({ announcement, children, className, ...props }) {
   ] });
 }
 function KanbanColumn({ title, count: count2, children, className, ...props }) {
-  const headId = (0, import_react62.useId)();
+  const headId = (0, import_react63.useId)();
   const hasHead = title != null || count2 != null;
   return /* @__PURE__ */ (0, import_jsx_runtime86.jsxs)("div", { className: cx("uix-kanban__col", className), ...props, children: [
     hasHead && /* @__PURE__ */ (0, import_jsx_runtime86.jsxs)("div", { className: "uix-kanban__head", id: headId, children: [
@@ -9388,7 +9417,7 @@ function KanbanCard({ title, meta, children, className, onMove, onKeyDown, ...pr
 }
 // src/components/Tree.tsx
-var import_react63 = require("react");
+var import_react64 = require("react");
 // src/tree-model.ts
 function flattenTree(nodes, expanded, level = 1) {
@@ -9542,22 +9571,22 @@ function Tree({
   className,
   ...props
 }) {
-  const [internalExpanded, setInternalExpanded] = (0, import_react63.useState)(defaultExpanded ?? /* @__PURE__ */ new Set());
+  const [internalExpanded, setInternalExpanded] = (0, import_react64.useState)(defaultExpanded ?? /* @__PURE__ */ new Set());
   const expanded = controlledExpanded ?? internalExpanded;
-  const rootRef = (0, import_react63.useRef)(null);
-  const [focusedId, setFocusedId] = (0, import_react63.useState)(void 0);
+  const rootRef = (0, import_react64.useRef)(null);
+  const [focusedId, setFocusedId] = (0, import_react64.useState)(void 0);
   const selectable = selected !== void 0 || onSelectProp != null;
   const rowToggles = toggleOnRowClick ?? !selectable;
   const labels = { ...DEFAULT_TREE_LABELS, ...useUixLabels().tree, ...labelOverrides };
-  const treeId = (0, import_react63.useId)();
-  const [loaded, setLoaded] = (0, import_react63.useState)(() => /* @__PURE__ */ new Map());
-  const [failed, setFailed] = (0, import_react63.useState)(() => /* @__PURE__ */ new Set());
-  const [loading, setLoading] = (0, import_react63.useState)(() => /* @__PURE__ */ new Set());
-  const inFlight = (0, import_react63.useRef)(/* @__PURE__ */ new Set());
-  const loadRef = (0, import_react63.useRef)(loadChildren);
+  const treeId = (0, import_react64.useId)();
+  const [loaded, setLoaded] = (0, import_react64.useState)(() => /* @__PURE__ */ new Map());
+  const [failed, setFailed] = (0, import_react64.useState)(() => /* @__PURE__ */ new Set());
+  const [loading, setLoading] = (0, import_react64.useState)(() => /* @__PURE__ */ new Set());
+  const inFlight = (0, import_react64.useRef)(/* @__PURE__ */ new Set());
+  const loadRef = (0, import_react64.useRef)(loadChildren);
   loadRef.current = loadChildren;
-  const refocus = (0, import_react63.useRef)(null);
-  const nodes = (0, import_react63.useMemo)(() => {
+  const refocus = (0, import_react64.useRef)(null);
+  const nodes = (0, import_react64.useMemo)(() => {
     const row = (parent, kind) => ({
       id: parent.id + (kind === "error" ? FAILED : LOADING),
       typeaheadLabel: "",
@@ -9580,7 +9609,7 @@ function Tree({
       return !!n.hasChildren || !!n.children?.some(lazy);
     }) ? decorate(nodesProp) : nodesProp;
   }, [nodesProp, loaded, failed, loadChildren, labels.error, labels.retry, labels.loading]);
-  const load = (0, import_react63.useCallback)((node) => {
+  const load = (0, import_react64.useCallback)((node) => {
     const run = loadRef.current;
     if (!run || inFlight.current.has(node.id)) return;
     inFlight.current.add(node.id);
@@ -9607,7 +9636,7 @@ function Tree({
       () => settle3(() => setFailed((prev) => new Set(prev).add(node.id)), node.id + FAILED)
     );
   }, []);
-  (0, import_react63.useEffect)(() => {
+  (0, import_react64.useEffect)(() => {
     if (!loadChildren) return;
     const visit = (list) => {
       for (const node of list) {
@@ -9618,7 +9647,7 @@ function Tree({
     };
     visit(nodesProp);
   }, [nodesProp, expanded, loaded, failed, loadChildren, load]);
-  (0, import_react63.useEffect)(() => {
+  (0, import_react64.useEffect)(() => {
     const id = refocus.current;
     if (id == null) return;
     refocus.current = null;
@@ -9651,7 +9680,7 @@ function Tree({
     load(parent);
   };
   const onSelect = selectable || loadChildren ? handleSelect : void 0;
-  const handleToggle = (0, import_react63.useCallback)((id) => {
+  const handleToggle = (0, import_react64.useCallback)((id) => {
     if (!controlledExpanded) {
       setInternalExpanded((prev) => {
         const next = new Set(prev);
@@ -9662,7 +9691,7 @@ function Tree({
     }
     onToggle?.(id);
   }, [controlledExpanded, onToggle]);
-  const flat = (0, import_react63.useMemo)(() => flattenTree(nodes, expanded), [nodes, expanded]);
+  const flat = (0, import_react64.useMemo)(() => flattenTree(nodes, expanded), [nodes, expanded]);
   const useVirtual = virtualize ?? shouldVirtualize(flat.length);
   const tabbableId = focusedId ?? selected ?? nodes[0]?.id;
   if (useVirtual) {
@@ -9781,14 +9810,14 @@ function VirtualTreeView({
   className,
   ...props
 }) {
-  const scrollRef = (0, import_react63.useRef)(null);
-  const [scrollTop, setScrollTop] = (0, import_react63.useState)(0);
-  const pendingFocus = (0, import_react63.useRef)(false);
-  const hadFocus = (0, import_react63.useRef)(false);
+  const scrollRef = (0, import_react64.useRef)(null);
+  const [scrollTop, setScrollTop] = (0, import_react64.useState)(0);
+  const pendingFocus = (0, import_react64.useRef)(false);
+  const hadFocus = (0, import_react64.useRef)(false);
   const win = virtualWindow(scrollTop, maxHeight, rowHeight, flat.length);
   const rows = flat.slice(win.start, win.end);
   const windowHasTabbable = tabbableId != null && rows.some((f) => f.node.id === tabbableId);
-  (0, import_react63.useEffect)(() => {
+  (0, import_react64.useEffect)(() => {
     if (!pendingFocus.current || focusedId == null) return;
     const el = scrollRef.current?.querySelector(`[role="treeitem"][data-id="${CSS.escape(focusedId)}"]`);
     if (el) {
@@ -9796,7 +9825,7 @@ function VirtualTreeView({
       pendingFocus.current = false;
     }
   }, [focusedId, win.start, win.end]);
-  (0, import_react63.useEffect)(() => {
+  (0, import_react64.useEffect)(() => {
     if (!hadFocus.current || pendingFocus.current) return;
     const active = document.activeElement;
     if (active === document.body || active == null) scrollRef.current?.focus({ preventScroll: true });
@@ -9913,7 +9942,7 @@ function VirtualTreeView({
 }
 // src/components/OrgChart.tsx
-var import_react64 = require("react");
+var import_react65 = require("react");
 var import_jsx_runtime88 = require("react/jsx-runtime");
 var DEFAULT_ORG_CHART_LABELS = {
   chart: "Org chart",
@@ -9962,7 +9991,7 @@ var ChevronIcon3 = () => /* @__PURE__ */ (0, import_jsx_runtime88.jsx)("svg", {
 var PlusIcon2 = () => /* @__PURE__ */ (0, import_jsx_runtime88.jsx)("svg", { viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: 1.5, strokeLinecap: "round", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime88.jsx)("path", { d: "M8 3v10M3 8h10" }) });
 var MinusIcon2 = () => /* @__PURE__ */ (0, import_jsx_runtime88.jsx)("svg", { viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: 1.5, strokeLinecap: "round", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime88.jsx)("path", { d: "M3 8h10" }) });
 var FitIcon = () => /* @__PURE__ */ (0, import_jsx_runtime88.jsx)("svg", { viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: 1.5, strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime88.jsx)("path", { d: "M2 6V2h4M14 6V2h-4M2 10v4h4M14 10v4h-4" }) });
-var useIsoLayoutEffect = typeof window === "undefined" ? import_react64.useEffect : import_react64.useLayoutEffect;
+var useIsoLayoutEffect = typeof window === "undefined" ? import_react65.useEffect : import_react65.useLayoutEffect;
 var Ring2 = () => /* @__PURE__ */ (0, import_jsx_runtime88.jsx)("span", { className: "uix-spinner uix-spinner--sm", "aria-hidden": "true" });
 function StatusItem({ parent, kind, level, ctx }) {
   const id = parent + (kind === "error" ? FAILED2 : LOADING2);
@@ -10084,16 +10113,16 @@ function OrgChart({
   ...props
 }) {
   const labels = { ...DEFAULT_ORG_CHART_LABELS, ...useUixLabels().orgChart, ...labelOverrides };
-  const chartId = (0, import_react64.useId)().replace(/[^A-Za-z0-9_-]/g, "");
-  const [internalExpanded, setInternalExpanded] = (0, import_react64.useState)(() => defaultExpanded ?? /* @__PURE__ */ new Set());
+  const chartId = (0, import_react65.useId)().replace(/[^A-Za-z0-9_-]/g, "");
+  const [internalExpanded, setInternalExpanded] = (0, import_react65.useState)(() => defaultExpanded ?? /* @__PURE__ */ new Set());
   const expanded = controlledExpanded ?? internalExpanded;
-  const treeRef = (0, import_react64.useRef)(null);
-  const viewportRef = (0, import_react64.useRef)(null);
-  const [focusedId, setFocusedId] = (0, import_react64.useState)(void 0);
+  const treeRef = (0, import_react65.useRef)(null);
+  const viewportRef = (0, import_react65.useRef)(null);
+  const [focusedId, setFocusedId] = (0, import_react65.useState)(void 0);
   const selectable = selected !== void 0 || onSelect != null;
   const lazy = Boolean(loadChildren);
-  const userMoved = (0, import_react64.useRef)(false);
-  const placed = (0, import_react64.useRef)(null);
+  const userMoved = (0, import_react65.useRef)(false);
+  const placed = (0, import_react65.useRef)(null);
   const scrollFrame = (left, top) => {
     const viewport = viewportRef.current;
     if (!viewport) return;
@@ -10101,17 +10130,17 @@ function OrgChart({
     viewport.scrollTop = top;
     placed.current = { left: viewport.scrollLeft, top: viewport.scrollTop };
   };
-  const [loaded, setLoaded] = (0, import_react64.useState)(() => /* @__PURE__ */ new Map());
-  const [failed, setFailed] = (0, import_react64.useState)(() => /* @__PURE__ */ new Set());
-  const [loading, setLoading] = (0, import_react64.useState)(() => /* @__PURE__ */ new Set());
-  const [announcement, setAnnouncement] = (0, import_react64.useState)("");
-  const inFlight = (0, import_react64.useRef)(/* @__PURE__ */ new Set());
-  const loadRef = (0, import_react64.useRef)(loadChildren);
+  const [loaded, setLoaded] = (0, import_react65.useState)(() => /* @__PURE__ */ new Map());
+  const [failed, setFailed] = (0, import_react65.useState)(() => /* @__PURE__ */ new Set());
+  const [loading, setLoading] = (0, import_react65.useState)(() => /* @__PURE__ */ new Set());
+  const [announcement, setAnnouncement] = (0, import_react65.useState)("");
+  const inFlight = (0, import_react65.useRef)(/* @__PURE__ */ new Set());
+  const loadRef = (0, import_react65.useRef)(loadChildren);
   loadRef.current = loadChildren;
-  const errorWord = (0, import_react64.useRef)(labels.error);
+  const errorWord = (0, import_react65.useRef)(labels.error);
   errorWord.current = labels.error;
-  const refocus = (0, import_react64.useRef)(null);
-  const load = (0, import_react64.useCallback)((node) => {
+  const refocus = (0, import_react65.useRef)(null);
+  const load = (0, import_react65.useCallback)((node) => {
     const run = loadRef.current;
     if (!run || inFlight.current.has(node.id)) return;
     inFlight.current.add(node.id);
@@ -10143,7 +10172,7 @@ function OrgChart({
       }, node.id + FAILED2)
     );
   }, []);
-  (0, import_react64.useEffect)(() => {
+  (0, import_react65.useEffect)(() => {
     if (!loadChildren) return;
     const visit = (list) => {
       for (const node of list) {
@@ -10155,16 +10184,16 @@ function OrgChart({
     };
     visit(nodes);
   }, [nodes, expanded, loaded, failed, loadChildren, load]);
-  const itemEl = (0, import_react64.useCallback)((id) => treeRef.current?.querySelector(`[role="treeitem"][data-id="${CSS.escape(id)}"]`) ?? null, []);
+  const itemEl = (0, import_react65.useCallback)((id) => treeRef.current?.querySelector(`[role="treeitem"][data-id="${CSS.escape(id)}"]`) ?? null, []);
   const cardOf = (el) => el?.querySelector(":scope > .uix-org-chart__node, :scope > .uix-org-chart__status") ?? el;
-  (0, import_react64.useEffect)(() => {
+  (0, import_react65.useEffect)(() => {
     const id = refocus.current;
     if (id == null) return;
     refocus.current = null;
     setFocusedId(id);
     itemEl(id)?.focus();
   }, [loaded, failed, loading, itemEl]);
-  const findPath = (0, import_react64.useCallback)((id, list = nodes, path = []) => {
+  const findPath = (0, import_react65.useCallback)((id, list = nodes, path = []) => {
     for (const node of list) {
       if (node.id === id) return [...path, node];
       const inside = findPath(id, node.children ?? loaded.get(node.id) ?? [], [...path, node]);
@@ -10172,7 +10201,7 @@ function OrgChart({
     }
     return null;
   }, [nodes, loaded]);
-  const anchor = (0, import_react64.useRef)(null);
+  const anchor = (0, import_react65.useRef)(null);
   const viewportBox = () => viewportRef.current?.getBoundingClientRect();
   const holdInPlace = (id) => {
     const card = cardOf(itemEl(id));
@@ -10196,7 +10225,7 @@ function OrgChart({
     }
     if (!card || !inFlight.current.has(a.id) && !itemEl(a.id + LOADING2)) anchor.current = null;
   });
-  const toggle = (0, import_react64.useCallback)((id) => {
+  const toggle = (0, import_react65.useCallback)((id) => {
     const opening = !expanded.has(id);
     userMoved.current = true;
     holdInPlace(id);
@@ -10216,7 +10245,7 @@ function OrgChart({
     }
     onToggle?.(id, opening);
   }, [expanded, controlledExpanded, onToggle, itemEl]);
-  const retry = (0, import_react64.useCallback)((parentId) => {
+  const retry = (0, import_react65.useCallback)((parentId) => {
     const path = findPath(parentId);
     const parent = path ? path[path.length - 1] : void 0;
     if (!parent) return;
@@ -10228,7 +10257,7 @@ function OrgChart({
     });
     load(parent);
   }, [findPath, load]);
-  const select = (0, import_react64.useCallback)((id) => {
+  const select = (0, import_react65.useCallback)((id) => {
     const synthetic = syntheticOf2(id);
     if (!synthetic) {
       onSelect?.(id);
@@ -10236,7 +10265,7 @@ function OrgChart({
     }
     if (synthetic.kind === "error") retry(synthetic.parent);
   }, [onSelect, retry]);
-  const rendered = (0, import_react64.useMemo)(() => {
+  const rendered = (0, import_react65.useMemo)(() => {
     const ids = /* @__PURE__ */ new Set();
     const visit = (list) => {
       for (const node of list) {
@@ -10263,13 +10292,13 @@ function OrgChart({
       itemEl(visible.id)?.focus();
     }
   }, [rendered]);
-  const activate = (0, import_react64.useCallback)((id) => {
+  const activate = (0, import_react65.useCallback)((id) => {
     setFocusedId(id);
     itemEl(id)?.focus({ preventScroll: true });
     select(id);
   }, [itemEl, select]);
-  const revealed = (0, import_react64.useRef)(null);
-  (0, import_react64.useEffect)(() => {
+  const revealed = (0, import_react65.useRef)(null);
+  (0, import_react65.useEffect)(() => {
     if (!revealId) {
       revealed.current = null;
       return;
@@ -10284,8 +10313,8 @@ function OrgChart({
     setFocusedId(revealId);
     onReveal?.(revealId);
   });
-  const [zoom, setZoom] = (0, import_react64.useState)(() => typeof defaultZoom === "number" ? clampZoom(defaultZoom) : 1);
-  const zoomCentre = (0, import_react64.useRef)(null);
+  const [zoom, setZoom] = (0, import_react65.useState)(() => typeof defaultZoom === "number" ? clampZoom(defaultZoom) : 1);
+  const zoomCentre = (0, import_react65.useRef)(null);
   const zoomTo = (next) => {
     const viewport = viewportRef.current;
     if (viewport) {
@@ -10304,7 +10333,7 @@ function OrgChart({
     zoomCentre.current = null;
     scrollFrame(c.x * zoom - viewport.clientWidth / 2, c.y * zoom - viewport.clientHeight / 2);
   }, [zoom]);
-  const fitZoom = (0, import_react64.useCallback)((current) => {
+  const fitZoom = (0, import_react65.useCallback)((current) => {
     const viewport = viewportRef.current;
     const tree = treeRef.current;
     if (!viewport || !tree) return null;
@@ -10314,7 +10343,7 @@ function OrgChart({
     if (!(room > 0) || !(width > 0)) return null;
     return clampZoom(Math.min(1, room / width));
   }, []);
-  const settledWidth = (0, import_react64.useRef)(-1);
+  const settledWidth = (0, import_react65.useRef)(-1);
   useIsoLayoutEffect(() => {
     const viewport = viewportRef.current;
     const tree = treeRef.current;
@@ -10338,8 +10367,8 @@ function OrgChart({
     if (at && Math.abs(viewport.scrollLeft - at.left) <= 1 && Math.abs(viewport.scrollTop - at.top) <= 1) return;
     userMoved.current = true;
   };
-  const pan = (0, import_react64.useRef)(null);
-  const [panning, setPanning] = (0, import_react64.useState)(false);
+  const pan = (0, import_react65.useRef)(null);
+  const [panning, setPanning] = (0, import_react65.useState)(false);
   const onPointerDown = (e) => {
     if (e.button !== 0 || e.pointerType === "touch") return;
     if (e.target.closest(".uix-org-chart__node, .uix-org-chart__status")) return;
@@ -11153,7 +11182,7 @@ function RuleBuilder({
 }
 // src/components/BuilderCanvas.tsx
-var import_react65 = require("react");
+var import_react66 = require("react");
 var import_jsx_runtime91 = require("react/jsx-runtime");
 var DEFAULT_BUILDER_CANVAS_LABELS = {
   region: "Builder canvas",
@@ -11193,13 +11222,13 @@ function BuilderCanvas({
   labels: labelOverrides
 }) {
   const labels = { ...DEFAULT_BUILDER_CANVAS_LABELS, ...labelOverrides };
-  const [internalSelectedId, setInternalSelectedId] = (0, import_react65.useState)();
-  const [draggedId, setDraggedId] = (0, import_react65.useState)();
-  const propertyHeadingRef = (0, import_react65.useRef)(null);
-  const shouldFocusProperties = (0, import_react65.useRef)(false);
+  const [internalSelectedId, setInternalSelectedId] = (0, import_react66.useState)();
+  const [draggedId, setDraggedId] = (0, import_react66.useState)();
+  const propertyHeadingRef = (0, import_react66.useRef)(null);
+  const shouldFocusProperties = (0, import_react66.useRef)(false);
   const selectedId = controlledSelectedId ?? internalSelectedId;
   const selected = items.find((item) => item.id === selectedId);
-  (0, import_react65.useEffect)(() => {
+  (0, import_react66.useEffect)(() => {
     if (shouldFocusProperties.current && selected) {
       propertyHeadingRef.current?.focus();
       shouldFocusProperties.current = false;
@@ -11287,7 +11316,7 @@ function BuilderCanvas({
 }
 // src/components/SchedulingCalendar.tsx
-var import_react69 = require("react");
+var import_react70 = require("react");
 // src/calendar-model.ts
 function fromDateKey(value) {
@@ -11715,14 +11744,14 @@ function proposeMove(span, delta, timeZone) {
 }
 // src/components/SchedulingAgenda.tsx
-var import_react67 = require("react");
+var import_react68 = require("react");
 // src/hooks/usePrinting.ts
-var import_react66 = require("react");
+var import_react67 = require("react");
 var import_react_dom2 = require("react-dom");
 function usePrinting(enabled = true) {
-  const [printing, setPrinting] = (0, import_react66.useState)(false);
-  (0, import_react66.useEffect)(() => {
+  const [printing, setPrinting] = (0, import_react67.useState)(false);
+  (0, import_react67.useEffect)(() => {
     if (!enabled || typeof window === "undefined") return void 0;
     const set = (next) => {
       (0, import_react_dom2.flushSync)(() => setPrinting(next));
@@ -11797,11 +11826,11 @@ function AgendaBody({
       if ((group.continuesCount ?? 0) > 0) flatRows.push({ kind: "continues", key: `c-${groupKey}`, group });
     });
   }
-  const [narrow, setNarrow] = (0, import_react67.useState)(false);
+  const [narrow, setNarrow] = (0, import_react68.useState)(false);
   const printing = usePrinting(flat);
   const virtual = useVirtualRows(flatRows, { rowHeight: narrow ? AGENDA_NARROW_ROW : AGENDA_VIRTUAL_ROW, threshold: 0, estimatedViewportHeight: AGENDA_VIRTUAL_VIEWPORT, enabled: !printing });
   const scroller = virtual.containerRef;
-  (0, import_react67.useLayoutEffect)(() => {
+  (0, import_react68.useLayoutEffect)(() => {
     const box = scroller.current;
     if (!box) return;
     const measure2 = () => setNarrow(box.clientWidth > 0 && box.clientWidth <= AGENDA_NARROW_WIDTH);
@@ -11810,8 +11839,8 @@ function AgendaBody({
     observer.observe(box);
     return () => observer.disconnect();
   }, [scroller]);
-  const grouped = (0, import_react67.useRef)(null);
-  (0, import_react67.useLayoutEffect)(() => {
+  const grouped = (0, import_react68.useRef)(null);
+  (0, import_react68.useLayoutEffect)(() => {
     const box = grouped.current;
     if (!box) return;
     const observer = new ResizeObserver((entries) => {
@@ -11823,7 +11852,7 @@ function AgendaBody({
     box.querySelectorAll(":scope > section > .uix-scheduling-calendar__agenda-head").forEach((head) => observer.observe(head));
     return () => observer.disconnect();
   }, [groups]);
-  const stop2 = (0, import_react67.useRef)({ node: null, index: 0 });
+  const stop2 = (0, import_react68.useRef)({ node: null, index: 0 });
   const container = () => flat ? scroller.current : grouped.current;
   const controls = () => Array.from(container()?.querySelectorAll("button") ?? []);
   const focusStop = (target) => {
@@ -11848,7 +11877,7 @@ function AgendaBody({
   const scrollToRow = (box, index) => {
     box.scrollTop = Math.max(0, index * rowHeight - (box.clientHeight - rowHeight) / 2);
   };
-  const landing = (0, import_react67.useRef)(null);
+  const landing = (0, import_react68.useRef)(null);
   const land = () => {
     const wanted = landing.current;
     if (!wanted) return;
@@ -11869,7 +11898,7 @@ function AgendaBody({
       scrollToRow(box, index);
     }
   };
-  (0, import_react67.useEffect)(() => {
+  (0, import_react68.useEffect)(() => {
     const all = controls();
     stop2.current = syncRovingStop(all, stop2.current);
     const box = flat ? scroller.current : null;
@@ -11925,7 +11954,7 @@ function AgendaBody({
     overlay.scopeLabel && /* @__PURE__ */ (0, import_jsx_runtime92.jsx)("span", { className: "uix-scheduling-calendar__window-scope", children: overlay.scopeLabel })
   ] }) });
   const heading = (group, withNotes) => /* @__PURE__ */ (0, import_jsx_runtime92.jsxs)("div", { className: "uix-scheduling-calendar__agenda-head", children: [
-    (0, import_react67.createElement)(`h${headingLevel}`, { className: "uix-scheduling-calendar__agenda-heading" }, group.heading ?? dateText(group.date, "day")),
+    (0, import_react68.createElement)(`h${headingLevel}`, { className: "uix-scheduling-calendar__agenda-heading" }, group.heading ?? dateText(group.date, "day")),
     withNotes && group.annotations && group.annotations.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime92.jsx)("ul", { className: "uix-scheduling-calendar__agenda-notes", children: uniqueKeys(group.annotations.map((overlay) => overlay.id)).map((key, at) => /* @__PURE__ */ (0, import_jsx_runtime92.jsx)("li", { children: note(group.annotations[at]) }, key)) })
   ] });
   const timeText = (entry, date) => {
@@ -11995,7 +12024,7 @@ function AgendaBody({
 }
 // src/components/SchedulingTimeGrid.tsx
-var import_react68 = require("react");
+var import_react69 = require("react");
 var import_jsx_runtime93 = require("react/jsx-runtime");
 var HOUR_MS2 = 36e5;
 var MINUTES_PER_HOUR = 60;
@@ -12009,7 +12038,7 @@ function uniqueById(items) {
   const seen = /* @__PURE__ */ new Set();
   return items.filter((item) => seen.has(item.id) ? false : (seen.add(item.id), true));
 }
-var GridItem = (0, import_react68.memo)(function GridItem2({ entry, segment, column, alone, name, status, movable, hintId, timeZone, continuesFrom, markers, renderEntry, renderMarker: renderMarker2, handlers }) {
+var GridItem = (0, import_react69.memo)(function GridItem2({ entry, segment, column, alone, name, status, movable, hintId, timeZone, continuesFrom, markers, renderEntry, renderMarker: renderMarker2, handlers }) {
   const lines = linesFor(segment);
   const continuation = segment.part === "continuation";
   const style = vars({
@@ -12094,20 +12123,20 @@ function SchedulingTimeGrid({
   emptyNote,
   nothingToShow
 }) {
-  const rootRef = (0, import_react68.useRef)(null);
-  const hintId = (0, import_react68.useId)();
-  const [widthCap, setWidthCap] = (0, import_react68.useState)(Infinity);
-  const [ghost, setGhost] = (0, import_react68.useState)(null);
-  const [announcement, setAnnouncement] = (0, import_react68.useState)("");
-  const [activeDay, setActiveDay] = (0, import_react68.useState)(days[0]);
-  const enteredFrom = (0, import_react68.useRef)(null);
+  const rootRef = (0, import_react69.useRef)(null);
+  const hintId = (0, import_react69.useId)();
+  const [widthCap, setWidthCap] = (0, import_react69.useState)(Infinity);
+  const [ghost, setGhost] = (0, import_react69.useState)(null);
+  const [announcement, setAnnouncement] = (0, import_react69.useState)("");
+  const [activeDay, setActiveDay] = (0, import_react69.useState)(days[0]);
+  const enteredFrom = (0, import_react69.useRef)(null);
   const tabStop = days.includes(activeDay) ? activeDay : days[0];
   const moving = canMove && onProposeMove !== void 0;
   const step = Number.isFinite(givenStep) && givenStep > 0 ? givenStep : DEFAULT_STEP;
-  const laneOptions = (0, import_react68.useMemo)(() => ({ crossMidnightMinutes: topLaneCrossMidnightMinutes }), [topLaneCrossMidnightMinutes]);
-  const entries = (0, import_react68.useMemo)(() => uniqueById(givenEntries), [givenEntries]);
-  const overlays = (0, import_react68.useMemo)(() => uniqueById(givenOverlays), [givenOverlays]);
-  (0, import_react68.useEffect)(() => {
+  const laneOptions = (0, import_react69.useMemo)(() => ({ crossMidnightMinutes: topLaneCrossMidnightMinutes }), [topLaneCrossMidnightMinutes]);
+  const entries = (0, import_react69.useMemo)(() => uniqueById(givenEntries), [givenEntries]);
+  const overlays = (0, import_react69.useMemo)(() => uniqueById(givenOverlays), [givenOverlays]);
+  (0, import_react69.useEffect)(() => {
     const root = rootRef.current;
     if (!root || typeof ResizeObserver === "undefined") return void 0;
     const column = root.querySelector("[data-tg-column]");
@@ -12132,17 +12161,17 @@ function SchedulingTimeGrid({
     };
   }, [days]);
   const lanes = Math.max(1, Math.min(maxLanes, widthCap));
-  const entryById = (0, import_react68.useMemo)(() => new Map(entries.map((entry) => [entry.id, entry])), [entries]);
-  const overlayById = (0, import_react68.useMemo)(() => new Map(overlays.map((overlay) => [overlay.id, overlay])), [overlays]);
-  const columns = (0, import_react68.useMemo)(() => days.map((date) => layoutTimeGridDay(entries, date, timeZone, { ...laneOptions, maxLanes: lanes })), [days, entries, timeZone, laneOptions, lanes]);
-  const slots = (0, import_react68.useMemo)(() => days.map((date) => zonedHourSlots(date, timeZone)), [days, timeZone]);
-  const top = (0, import_react68.useMemo)(() => layoutDaySpans(entries.filter((entry) => placesInTopLane(entry, timeZone, laneOptions)), days, { timeZone, laneCap: Math.max(0, topLaneCap) }), [entries, days, timeZone, laneOptions, topLaneCap]);
-  const drawable = (0, import_react68.useMemo)(() => overlays.filter((overlay) => new Date(overlay.end).getTime() >= new Date(overlay.start).getTime()), [overlays]);
-  const strip = (0, import_react68.useMemo)(() => layoutDaySpans(drawable, days, { timeZone, laneCap: Math.max(0, windowLaneCap) }), [drawable, days, timeZone, windowLaneCap]);
-  const shades = (0, import_react68.useMemo)(() => layoutDaySpans(drawable.filter((overlay) => overlay.global), days, { timeZone }).placed, [drawable, days, timeZone]);
+  const entryById = (0, import_react69.useMemo)(() => new Map(entries.map((entry) => [entry.id, entry])), [entries]);
+  const overlayById = (0, import_react69.useMemo)(() => new Map(overlays.map((overlay) => [overlay.id, overlay])), [overlays]);
+  const columns = (0, import_react69.useMemo)(() => days.map((date) => layoutTimeGridDay(entries, date, timeZone, { ...laneOptions, maxLanes: lanes })), [days, entries, timeZone, laneOptions, lanes]);
+  const slots = (0, import_react69.useMemo)(() => days.map((date) => zonedHourSlots(date, timeZone)), [days, timeZone]);
+  const top = (0, import_react69.useMemo)(() => layoutDaySpans(entries.filter((entry) => placesInTopLane(entry, timeZone, laneOptions)), days, { timeZone, laneCap: Math.max(0, topLaneCap) }), [entries, days, timeZone, laneOptions, topLaneCap]);
+  const drawable = (0, import_react69.useMemo)(() => overlays.filter((overlay) => new Date(overlay.end).getTime() >= new Date(overlay.start).getTime()), [overlays]);
+  const strip = (0, import_react69.useMemo)(() => layoutDaySpans(drawable, days, { timeZone, laneCap: Math.max(0, windowLaneCap) }), [drawable, days, timeZone, windowLaneCap]);
+  const shades = (0, import_react69.useMemo)(() => layoutDaySpans(drawable.filter((overlay) => overlay.global), days, { timeZone }).placed, [drawable, days, timeZone]);
   const lanesIn = (placed) => placed.reduce((max, span) => Math.max(max, span.lane + 1), 0);
   const maxHours = Math.max(...columns.map((column) => column.dayHours));
-  const gutterIndex = (0, import_react68.useMemo)(() => {
+  const gutterIndex = (0, import_react69.useMemo)(() => {
     const signatures = slots.map(slotSignature);
     const count2 = /* @__PURE__ */ new Map();
     for (const signature of signatures) count2.set(signature, (count2.get(signature) ?? 0) + 1);
@@ -12167,15 +12196,15 @@ function SchedulingTimeGrid({
     slot.instant.getTime()
   ));
   const movable = (entry) => moving && entry.movable !== false;
-  const live = (0, import_react68.useRef)({ ghost, entryById, timeZone, step, onProposeMove, onSelectEntry, labels, formatInstant, days, columns, movable });
+  const live = (0, import_react69.useRef)({ ghost, entryById, timeZone, step, onProposeMove, onSelectEntry, labels, formatInstant, days, columns, movable });
   live.current = { ghost, entryById, timeZone, step, onProposeMove, onSelectEntry, labels, formatInstant, days, columns, movable };
-  const dragRef = (0, import_react68.useRef)(null);
-  const suppressClick = (0, import_react68.useRef)(false);
-  const refocus = (0, import_react68.useRef)(null);
-  (0, import_react68.useEffect)(() => {
+  const dragRef = (0, import_react69.useRef)(null);
+  const suppressClick = (0, import_react69.useRef)(false);
+  const refocus = (0, import_react69.useRef)(null);
+  (0, import_react69.useEffect)(() => {
     if (ghost && !entryById.has(ghost.id)) setGhost(null);
   }, [ghost, entryById]);
-  (0, import_react68.useEffect)(() => {
+  (0, import_react69.useEffect)(() => {
     const id = refocus.current;
     const root = rootRef.current;
     if (!id || !root) return;
@@ -12192,7 +12221,7 @@ function SchedulingTimeGrid({
       }
     }
   });
-  const send = (0, import_react68.useCallback)((id, delta) => {
+  const send = (0, import_react69.useCallback)((id, delta) => {
     const state = live.current;
     const entry = state.entryById.get(id);
     if (!entry || !state.onProposeMove || !state.movable(entry) || delta.days === 0 && delta.minutes === 0) {
@@ -12207,7 +12236,7 @@ function SchedulingTimeGrid({
       result.then(clear, clear);
     } else setGhost(null);
   }, []);
-  const handlers = (0, import_react68.useMemo)(() => ({
+  const handlers = (0, import_react69.useMemo)(() => ({
     click: (entry) => {
       live.current.onSelectEntry?.(entry);
     },
@@ -12330,7 +12359,7 @@ function SchedulingTimeGrid({
       };
     }
   }), [send]);
-  (0, import_react68.useEffect)(() => () => {
+  (0, import_react69.useEffect)(() => () => {
     dragRef.current?.stop();
     dragRef.current = null;
   }, []);
@@ -12743,27 +12772,27 @@ function SchedulingCalendar({
   };
   const stateLabel = labels.states;
   const viewLabel = { month: labels.viewMonth, week: labels.viewWeek, day: labels.viewDay, agenda: labels.viewAgenda };
-  const [internalView, setInternalView] = (0, import_react69.useState)("month");
+  const [internalView, setInternalView] = (0, import_react70.useState)("month");
   const view = controlledView ?? internalView;
-  const [activeDate, setActiveDate] = (0, import_react69.useState)(anchorDate);
-  const [expandedDates, setExpandedDates] = (0, import_react69.useState)(() => /* @__PURE__ */ new Set());
+  const [activeDate, setActiveDate] = (0, import_react70.useState)(anchorDate);
+  const [expandedDates, setExpandedDates] = (0, import_react70.useState)(() => /* @__PURE__ */ new Set());
   const dateText = (date, part) => formatDate?.(date, part) ?? cachedDateTimeFormat(locale, INTL_PARTS[part]).format(utcDate(date));
   const formatInstant = (instant) => formatInstantProp?.(instant) ?? `${dateText(zonedDateKey(instant, timeZone), "day")} ${zonedTimeOfDay(instant, timeZone)}`;
-  const gridRef = (0, import_react69.useRef)(null);
+  const gridRef = (0, import_react70.useRef)(null);
   const picksGiven = dayEntries !== void 0;
   const controlled = picksGiven || dayInfo !== void 0;
   const countsOnly = monthDensity === "counts" && view === "month";
   const fixed = controlled || maxEntriesPerDay !== void 0 && onShowMore !== void 0 || countsOnly;
   const windowCap = Math.max(0, windowLaneCap ?? (fixed ? DEFAULT_LANE_CAP2 : Infinity));
   const spanCap = Math.max(0, spanLaneCap ?? (fixed ? DEFAULT_LANE_CAP2 : Infinity));
-  const visibleEntries = (0, import_react69.useMemo)(() => entries.filter((entry) => filter?.(entry) ?? true), [entries, filter]);
-  const monthDays = (0, import_react69.useMemo)(() => buildMonthGrid(startOfMonth(anchorDate), weekStartsOn), [anchorDate, weekStartsOn]);
+  const visibleEntries = (0, import_react70.useMemo)(() => entries.filter((entry) => filter?.(entry) ?? true), [entries, filter]);
+  const monthDays = (0, import_react70.useMemo)(() => buildMonthGrid(startOfMonth(anchorDate), weekStartsOn), [anchorDate, weekStartsOn]);
   const weekday = (utcDate(anchorDate).getUTCDay() - weekStartsOn + 7) % 7;
   const weekStart = addCalendarDays(anchorDate, -weekday);
-  const weekDays = (0, import_react69.useMemo)(() => Array.from({ length: 7 }, (_, index) => addCalendarDays(weekStart, index)), [weekStart]);
-  const days = (0, import_react69.useMemo)(() => view === "month" ? monthDays.map((day) => day.date) : view === "day" ? [anchorDate] : weekDays, [view, monthDays, weekDays, anchorDate]);
+  const weekDays = (0, import_react70.useMemo)(() => Array.from({ length: 7 }, (_, index) => addCalendarDays(weekStart, index)), [weekStart]);
+  const days = (0, import_react70.useMemo)(() => view === "month" ? monthDays.map((day) => day.date) : view === "day" ? [anchorDate] : weekDays, [view, monthDays, weekDays, anchorDate]);
   const timeGridView = view === "day" || view === "week" && timeGrid;
-  const { singles, multiDay, coverage } = (0, import_react69.useMemo)(() => {
+  const { singles, multiDay, coverage } = (0, import_react70.useMemo)(() => {
     const byDay = /* @__PURE__ */ new Map();
     const spans = [];
     const every = [];
@@ -12778,9 +12807,9 @@ function SchedulingCalendar({
     }
     return { singles: byDay, multiDay: spans, coverage: every };
   }, [visibleEntries, timeZone]);
-  const entryById = (0, import_react69.useMemo)(() => new Map([...multiDay].reverse().map(({ entry }) => [entry.id, entry])), [multiDay]);
-  const overlayById = (0, import_react69.useMemo)(() => new Map([...overlays].reverse().map((overlay) => [overlay.id, overlay])), [overlays]);
-  const layout = (0, import_react69.useMemo)(() => {
+  const entryById = (0, import_react70.useMemo)(() => new Map([...multiDay].reverse().map(({ entry }) => [entry.id, entry])), [multiDay]);
+  const overlayById = (0, import_react70.useMemo)(() => new Map([...overlays].reverse().map((overlay) => [overlay.id, overlay])), [overlays]);
+  const layout = (0, import_react70.useMemo)(() => {
     if (spanLayout) return spanLayout;
     if (view === "agenda" || timeGridView) return { placed: [], hiddenByRow: {}, firstHiddenDayByRow: {} };
     const inputs = [];
@@ -12798,7 +12827,7 @@ function SchedulingCalendar({
     }
     return layoutMonthSpans(inputs, days, { timeZone, laneCap: { window: windowCap, item: spanCap } });
   }, [spanLayout, view, timeGridView, overlays, multiDay, days, timeZone, windowCap, spanCap, countsOnly]);
-  const placedByRow = (0, import_react69.useMemo)(() => {
+  const placedByRow = (0, import_react70.useMemo)(() => {
     const rows = /* @__PURE__ */ new Map();
     for (const placed of layout.placed) {
       const row = rows.get(placed.weekRow);
@@ -12809,7 +12838,7 @@ function SchedulingCalendar({
   }, [layout]);
   const lanesUsed = (row, group) => (placedByRow.get(row) ?? []).reduce((max, placed) => placed.group === group ? Math.max(max, placed.lane + 1) : max, 0);
   const lanesUsedAnywhere = (group) => layout.placed.reduce((max, placed) => placed.group === group ? Math.max(max, placed.lane + 1) : max, 0);
-  (0, import_react69.useEffect)(() => {
+  (0, import_react70.useEffect)(() => {
     if (view !== "agenda" && !days.includes(activeDate)) setActiveDate(days[0]);
   }, [activeDate, days, view]);
   const setView = (next) => {
@@ -12825,7 +12854,7 @@ function SchedulingCalendar({
     setActiveDate(date);
     requestAnimationFrame(() => gridRef.current?.querySelector(`[data-calendar-date="${date}"]`)?.focus());
   };
-  const enteredFrom = (0, import_react69.useRef)(null);
+  const enteredFrom = (0, import_react70.useRef)(null);
   const cellOf = (date) => gridRef.current?.querySelector(`[data-calendar-date="${date}"]`)?.closest(".uix-scheduling-calendar__day") ?? null;
   const dayRing = (date) => {
     const cell = cellOf(date);
@@ -12895,10 +12924,10 @@ function SchedulingCalendar({
     const date = dayOfItem(item);
     if (date && dayRing(date).includes(item)) setActiveDate(date);
   };
-  const flatAgendaRef = (0, import_react69.useRef)(null);
-  const flatAgendaStop = (0, import_react69.useRef)({ node: null, index: 0 });
+  const flatAgendaRef = (0, import_react70.useRef)(null);
+  const flatAgendaStop = (0, import_react70.useRef)({ node: null, index: 0 });
   const flatAgendaRows = () => Array.from(flatAgendaRef.current?.querySelectorAll(":scope > ol > li > button") ?? []);
-  (0, import_react69.useEffect)(() => {
+  (0, import_react70.useEffect)(() => {
     flatAgendaStop.current = syncRovingStop(flatAgendaRows(), flatAgendaStop.current);
   });
   const onFlatAgendaFocus = (event) => {
@@ -13140,7 +13169,7 @@ function SchedulingCalendar({
 }
 // src/components/SchedulingTimeline.tsx
-var import_react70 = require("react");
+var import_react71 = require("react");
 // src/scheduling-timeline-model.ts
 var HOUR = 36e5;
@@ -13368,7 +13397,7 @@ var DEFAULT_UNITS = { row: 36, pad: 16, head: 40 };
 var ESTIMATED_VIEWPORT = 720;
 var OVERSCAN_ROWS = 4;
 var BAR_MIN_FALLBACK = 1.5 * 16;
-var useIsomorphicLayoutEffect8 = typeof document !== "undefined" ? import_react70.useLayoutEffect : import_react70.useEffect;
+var useIsomorphicLayoutEffect9 = typeof document !== "undefined" ? import_react71.useLayoutEffect : import_react71.useEffect;
 var sameExtent = (a, b) => a.subRows === b.subRows && a.lanes === b.lanes && a.heads === b.heads;
 var IN_LANE = { scope: "lane", labelTops: ["0%"] };
 var vars2 = (values) => values;
@@ -13434,29 +13463,29 @@ function SchedulingTimeline({
     overlays: { ...DEFAULT_SCHEDULING_TIMELINE_LABELS.overlays, ...uixLabels.schedulingTimeline?.overlays, ...labelOverrides?.overlays },
     statuses: { ...DEFAULT_SCHEDULING_TIMELINE_LABELS.statuses, ...uixLabels.schedulingTimeline?.statuses, ...labelOverrides?.statuses }
   };
-  const id = (0, import_react70.useId)();
+  const id = (0, import_react71.useId)();
   const hintId = `${id}-hint`;
   const step = stepProp !== void 0 && Number.isFinite(stepProp) && stepProp > 0 ? stepProp : defaultTimelineStep(scale);
-  const rootRef = (0, import_react70.useRef)(null);
-  const [scroller, setScroller] = (0, import_react70.useState)(null);
-  const [layerTrack, setLayerTrack] = (0, import_react70.useState)(null);
-  const probeRef = (0, import_react70.useRef)(null);
-  const bodyRef = (0, import_react70.useRef)(null);
-  const barMinRef = (0, import_react70.useRef)(null);
-  const [barShare, setBarShare] = (0, import_react70.useState)(0);
-  const barShareRef = (0, import_react70.useRef)(0);
-  const anchorRef = (0, import_react70.useRef)(null);
-  const [anchorKey, setAnchorKey] = (0, import_react70.useState)(null);
-  const [focusRowKey, setFocusRowKey] = (0, import_react70.useState)(null);
-  const [activeId, setActiveId] = (0, import_react70.useState)();
-  const [focusRequest, setFocusRequest] = (0, import_react70.useState)(null);
-  const [stepDrag, setStepDrag] = (0, import_react70.useState)(null);
-  const [ghost, setGhost] = (0, import_react70.useState)(null);
-  const [announcement, setAnnouncement] = (0, import_react70.useState)("");
-  const [selfCollapsed, setSelfCollapsed] = (0, import_react70.useState)({});
-  const [units, setUnits] = (0, import_react70.useState)(DEFAULT_UNITS);
-  const [view, setView] = (0, import_react70.useState)({ top: 0, height: ESTIMATED_VIEWPORT });
-  const measureViewRef = (0, import_react70.useRef)(null);
+  const rootRef = (0, import_react71.useRef)(null);
+  const [scroller, setScroller] = (0, import_react71.useState)(null);
+  const [layerTrack, setLayerTrack] = (0, import_react71.useState)(null);
+  const probeRef = (0, import_react71.useRef)(null);
+  const bodyRef = (0, import_react71.useRef)(null);
+  const barMinRef = (0, import_react71.useRef)(null);
+  const [barShare, setBarShare] = (0, import_react71.useState)(0);
+  const barShareRef = (0, import_react71.useRef)(0);
+  const anchorRef = (0, import_react71.useRef)(null);
+  const [anchorKey, setAnchorKey] = (0, import_react71.useState)(null);
+  const [focusRowKey, setFocusRowKey] = (0, import_react71.useState)(null);
+  const [activeId, setActiveId] = (0, import_react71.useState)();
+  const [focusRequest, setFocusRequest] = (0, import_react71.useState)(null);
+  const [stepDrag, setStepDrag] = (0, import_react71.useState)(null);
+  const [ghost, setGhost] = (0, import_react71.useState)(null);
+  const [announcement, setAnnouncement] = (0, import_react71.useState)("");
+  const [selfCollapsed, setSelfCollapsed] = (0, import_react71.useState)({});
+  const [units, setUnits] = (0, import_react71.useState)(DEFAULT_UNITS);
+  const [view, setView] = (0, import_react71.useState)({ top: 0, height: ESTIMATED_VIEWPORT });
+  const measureViewRef = (0, import_react71.useRef)(null);
   const proposing = onProposeMove !== void 0;
   const stepping = !proposing && onMoveItem !== void 0;
   const resizing = onResizeItem !== void 0;
@@ -13471,14 +13500,14 @@ function SchedulingTimeline({
     return offset ? `${text} ${offset}` : text;
   };
   const fmtTick = (at) => formatTick?.(new Date(at), scale) ?? cachedDateTimeFormat(locale, { timeZone, ...TICK_FORMAT[scale] }).format(new Date(at));
-  const ticks = (0, import_react70.useMemo)(() => timelineTicks(range, scale, timeZone, weekStartsOn), [range.start, range.end, scale, timeZone, weekStartsOn]);
-  const minorTicks = (0, import_react70.useMemo)(
+  const ticks = (0, import_react71.useMemo)(() => timelineTicks(range, scale, timeZone, weekStartsOn), [range.start, range.end, scale, timeZone, weekStartsOn]);
+  const minorTicks = (0, import_react71.useMemo)(
     () => scale === "day" && subTicks && subTicks.length > 0 ? timelineSubTicks(range, subTicks, timeZone) : [],
     [range.start, range.end, scale, timeZone, subTicks]
     // eslint-disable-line react-hooks/exhaustive-deps
   );
   const tickCount = ticks.length;
-  useIsomorphicLayoutEffect8(() => {
+  useIsomorphicLayoutEffect9(() => {
     if (!layerTrack) return void 0;
     const measure2 = () => {
       const width = layerTrack.getBoundingClientRect().width;
@@ -13501,7 +13530,7 @@ function SchedulingTimeline({
   const minSpan = Math.max(0, (Date.parse(range.end) - Date.parse(range.start)) * barShare) || 0;
   const isCollapsed = (group) => onToggleGroup ? !!group.collapsed : selfCollapsed[group.id] ?? !!group.collapsed;
   const collapsedSignature = groups?.map((group) => isCollapsed(group) ? "1" : "0").join("") ?? "";
-  const itemsByLane = (0, import_react70.useMemo)(() => {
+  const itemsByLane = (0, import_react71.useMemo)(() => {
     const byLane = /* @__PURE__ */ new Map();
     for (const item of items) {
       const list = byLane.get(item.laneId);
@@ -13510,7 +13539,7 @@ function SchedulingTimeline({
     }
     return byLane;
   }, [items]);
-  const rows = (0, import_react70.useMemo)(() => {
+  const rows = (0, import_react71.useMemo)(() => {
     const laneRow = (lane, laneIndex, groupIndex) => {
       const placed = layoutLane(itemsByLane.get(lane.id) ?? EMPTY_ITEMS, range, { flagOverlaps, minSpan });
       return { kind: "lane", key: `lane-${laneIndex}`, lane, laneIndex, groupIndex, placed, keys: uniqueKeys2(placed.map((p) => p.item.id)), subRows: placed.reduce((max, p) => Math.max(max, p.row + 1), 1) };
@@ -13542,8 +13571,8 @@ function SchedulingTimeline({
     });
     return list;
   }, [lanes, groups, collapsedSignature, itemsByLane, range.start, range.end, flagOverlaps, minSpan]);
-  const laneRows = (0, import_react70.useMemo)(() => rows.filter((row) => row.kind === "lane"), [rows]);
-  const { ordered, rowOfItem } = (0, import_react70.useMemo)(() => {
+  const laneRows = (0, import_react71.useMemo)(() => rows.filter((row) => row.kind === "lane"), [rows]);
+  const { ordered, rowOfItem } = (0, import_react71.useMemo)(() => {
     const ids = [];
     const rowOf = /* @__PURE__ */ new Map();
     rows.forEach((row, rowIndex) => {
@@ -13555,13 +13584,13 @@ function SchedulingTimeline({
     });
     return { ordered: ids, rowOfItem: rowOf };
   }, [rows]);
-  const nothingToShow = (0, import_react70.useMemo)(() => {
+  const nothingToShow = (0, import_react71.useMemo)(() => {
     if (ordered.length > 0) return false;
     const laneIds = new Set(lanes.map((lane) => lane.id));
     return !items.some((item) => laneIds.has(item.laneId) && placeSpan(item, range) !== null);
   }, [ordered, lanes, items, range.start, range.end]);
   const focusId = activeId !== void 0 && rowOfItem.has(activeId) ? activeId : ordered[0];
-  const strips = (0, import_react70.useMemo)(() => {
+  const strips = (0, import_react71.useMemo)(() => {
     const set = /* @__PURE__ */ new Set();
     const shown = overlays.filter((overlay) => placeSpan(overlay, range) !== null).map(lanesOf);
     if (shown.length === 0) return set;
@@ -13571,12 +13600,12 @@ function SchedulingTimeline({
     });
     return set;
   }, [rows, overlays, range.start, range.end]);
-  const extents = (0, import_react70.useMemo)(() => timelineRowExtents(rows.map((row, index) => row.kind === "head" ? { kind: "head", subRows: strips.has(index) ? 1 : 0 } : { kind: "lane", subRows: row.subRows })), [rows, strips]);
+  const extents = (0, import_react71.useMemo)(() => timelineRowExtents(rows.map((row, index) => row.kind === "head" ? { kind: "head", subRows: strips.has(index) ? 1 : 0 } : { kind: "lane", subRows: row.subRows })), [rows, strips]);
   const windowed = lanes.length + (groups?.length ?? 0) > virtualizeAbove;
   const printing = usePrinting(windowed);
   const virtual = windowed && !printing;
   const fixed = windowed || groups !== void 0 || overlays.some((overlay) => overlay.laneIds !== void 0) || markers.some((marker) => marker.laneIds !== void 0);
-  (0, import_react70.useEffect)(() => {
+  (0, import_react71.useEffect)(() => {
     if (!virtual || !scroller) return void 0;
     let frame = 0;
     const measure2 = () => {
@@ -13616,12 +13645,12 @@ function SchedulingTimeline({
     };
   }, [virtual, scroller]);
   const px = (extent) => extent.subRows * units.row + extent.lanes * units.pad + extent.heads * units.head;
-  const offsets = (0, import_react70.useMemo)(() => virtual ? extents.map(px) : [], [virtual, extents, units]);
+  const offsets = (0, import_react71.useMemo)(() => virtual ? extents.map(px) : [], [virtual, extents, units]);
   const overscan = OVERSCAN_ROWS * units.row;
   const pinned = focusId === void 0 ? -1 : rowOfItem.get(focusId) ?? -1;
-  const focusedRow = (0, import_react70.useMemo)(() => focusRowKey === null ? -1 : rows.findIndex((row) => row.key === focusRowKey), [rows, focusRowKey]);
-  const anchorRow = (0, import_react70.useMemo)(() => anchorKey === null ? -1 : rows.findIndex((row) => row.key === anchorKey), [rows, anchorKey]);
-  const { mounted, windowStart } = (0, import_react70.useMemo)(() => {
+  const focusedRow = (0, import_react71.useMemo)(() => focusRowKey === null ? -1 : rows.findIndex((row) => row.key === focusRowKey), [rows, focusRowKey]);
+  const anchorRow = (0, import_react71.useMemo)(() => anchorKey === null ? -1 : rows.findIndex((row) => row.key === anchorKey), [rows, anchorKey]);
+  const { mounted, windowStart } = (0, import_react71.useMemo)(() => {
     if (!virtual) return { mounted: rows.map((_, index) => index), windowStart: 0 };
     const window_ = timelineWindow(offsets, view.top, view.top + view.height, { overscan });
     const list = [];
@@ -13632,7 +13661,7 @@ function SchedulingTimeline({
     list.sort((a, b) => a - b);
     return { mounted: list, windowStart: window_.start };
   }, [virtual, rows, offsets, view, overscan, pinned, focusedRow, anchorRow]);
-  useIsomorphicLayoutEffect8(() => {
+  useIsomorphicLayoutEffect9(() => {
     const anchor = anchorRef.current;
     if (anchorKey === null || !anchor || anchor.key !== anchorKey) return;
     anchorRef.current = null;
@@ -13669,10 +13698,10 @@ function SchedulingTimeline({
     setActiveId(itemId);
     setFocusRequest({ id: itemId });
   };
-  (0, import_react70.useEffect)(() => {
+  (0, import_react71.useEffect)(() => {
     if (focusRequest) findBar(focusRequest.id)?.focus();
   }, [focusRequest]);
-  const itemById = (0, import_react70.useMemo)(() => {
+  const itemById = (0, import_react71.useMemo)(() => {
     const map = /* @__PURE__ */ new Map();
     for (const row of laneRows) for (const p of row.placed) if (!map.has(p.item.id)) map.set(p.item.id, p.item);
     return map;
@@ -13682,15 +13711,15 @@ function SchedulingTimeline({
     const steps = Math.round(ms / step);
     return { days: steps * stepDelta.days, minutes: steps * stepDelta.minutes };
   };
-  const live = (0, import_react70.useRef)({ itemById, timeZone, range, step, onProposeMove, canMove, deltaFor, labels, fmtInstant });
+  const live = (0, import_react71.useRef)({ itemById, timeZone, range, step, onProposeMove, canMove, deltaFor, labels, fmtInstant });
   live.current = { itemById, timeZone, range, step, onProposeMove, canMove, deltaFor, labels, fmtInstant };
-  const dragRef = (0, import_react70.useRef)(null);
-  const suppressClick = (0, import_react70.useRef)(false);
-  const refocus = (0, import_react70.useRef)(null);
-  (0, import_react70.useEffect)(() => {
+  const dragRef = (0, import_react71.useRef)(null);
+  const suppressClick = (0, import_react71.useRef)(false);
+  const refocus = (0, import_react71.useRef)(null);
+  (0, import_react71.useEffect)(() => {
     if (ghost && !itemById.has(ghost.id)) setGhost(null);
   }, [ghost, itemById]);
-  (0, import_react70.useEffect)(() => {
+  (0, import_react71.useEffect)(() => {
     const wanted = refocus.current;
     if (!wanted || !rootRef.current) return;
     const active = document.activeElement;
@@ -13701,11 +13730,11 @@ function SchedulingTimeline({
     }
     findBar(wanted)?.focus();
   });
-  (0, import_react70.useEffect)(() => () => {
+  (0, import_react71.useEffect)(() => () => {
     dragRef.current?.stop();
     dragRef.current = null;
   }, []);
-  (0, import_react70.useEffect)(() => {
+  (0, import_react71.useEffect)(() => {
     if (proposing) return;
     dragRef.current?.stop();
     dragRef.current = null;
@@ -14186,7 +14215,7 @@ function SchedulingTimeline({
 }
 // src/components/DateRangePicker.tsx
-var import_react72 = require("react");
+var import_react73 = require("react");
 // src/date-field-model.ts
 var pad = (n, width = 2) => String(n).padStart(width, "0");
@@ -14260,7 +14289,7 @@ function timeZoneName(timeZone, date, locale) {
 }
 // src/components/DateFieldParts.tsx
-var import_react71 = require("react");
+var import_react72 = require("react");
 var import_jsx_runtime96 = require("react/jsx-runtime");
 var localDateKey = (now = /* @__PURE__ */ new Date()) => `${now.getFullYear().toString().padStart(4, "0")}-${(now.getMonth() + 1).toString().padStart(2, "0")}-${now.getDate().toString().padStart(2, "0")}`;
 var utc = (date) => /* @__PURE__ */ new Date(`${date}T00:00:00Z`);
@@ -14278,15 +14307,15 @@ var isOpen = (el) => {
   }
 };
 function useFieldPopover(popoverId, restoreFocus, onOpenChange) {
-  const [open, setOpen] = (0, import_react71.useState)(false);
-  const pointerWasOpen = (0, import_react71.useRef)(null);
-  const restoreRef = (0, import_react71.useRef)(restoreFocus);
+  const [open, setOpen] = (0, import_react72.useState)(false);
+  const pointerWasOpen = (0, import_react72.useRef)(null);
+  const restoreRef = (0, import_react72.useRef)(restoreFocus);
   restoreRef.current = restoreFocus;
-  const onOpenChangeRef = (0, import_react71.useRef)(onOpenChange);
+  const onOpenChangeRef = (0, import_react72.useRef)(onOpenChange);
   onOpenChangeRef.current = onOpenChange;
-  const skipRestore = (0, import_react71.useRef)(false);
+  const skipRestore = (0, import_react72.useRef)(false);
   const popoverEl = () => typeof document === "undefined" ? null : document.getElementById(popoverId);
-  (0, import_react71.useEffect)(() => {
+  (0, import_react72.useEffect)(() => {
     const el = popoverEl();
     if (!el) return;
     const onToggle = (event) => {
@@ -14370,14 +14399,14 @@ function MonthCalendar({
   autoFocus = false
 }) {
   const clamp3 = (date) => min && date < min ? min : max && date > max ? max : date;
-  const [active, setActive] = (0, import_react71.useState)(() => clamp3(initialDate));
-  const gridRef = (0, import_react71.useRef)(null);
-  const pendingFocus = (0, import_react71.useRef)(autoFocus);
+  const [active, setActive] = (0, import_react72.useState)(() => clamp3(initialDate));
+  const gridRef = (0, import_react72.useRef)(null);
+  const pendingFocus = (0, import_react72.useRef)(autoFocus);
   const month = startOfMonth(active);
-  const days = (0, import_react71.useMemo)(() => buildMonthGrid(month, weekStartsOn).filter((day) => day.inMonth), [month, weekStartsOn]);
+  const days = (0, import_react72.useMemo)(() => buildMonthGrid(month, weekStartsOn).filter((day) => day.inMonth), [month, weekStartsOn]);
   const blanks = (utc(month).getUTCDay() - weekStartsOn + 7) % 7;
-  const weekdays = (0, import_react71.useMemo)(() => weekdayNames(locale, weekStartsOn), [locale, weekStartsOn]);
-  (0, import_react71.useEffect)(() => {
+  const weekdays = (0, import_react72.useMemo)(() => weekdayNames(locale, weekStartsOn), [locale, weekStartsOn]);
+  (0, import_react72.useEffect)(() => {
     if (!pendingFocus.current) return;
     pendingFocus.current = false;
     gridRef.current?.querySelector(`[data-date="${active}"]`)?.focus({ preventScroll: true });
@@ -14484,27 +14513,27 @@ function RangeCalendar({
   weekStartsOn = 1,
   autoFocus = false
 }) {
-  const id = (0, import_react72.useId)();
-  const weekdays = (0, import_react72.useMemo)(() => weekdayNames(locale, weekStartsOn), [locale, weekStartsOn]);
-  const [internalMonth, setInternalMonth] = (0, import_react72.useState)(() => startOfMonth(controlledMonth ?? value.start ?? (/* @__PURE__ */ new Date()).toISOString().slice(0, 10)));
+  const id = (0, import_react73.useId)();
+  const weekdays = (0, import_react73.useMemo)(() => weekdayNames(locale, weekStartsOn), [locale, weekStartsOn]);
+  const [internalMonth, setInternalMonth] = (0, import_react73.useState)(() => startOfMonth(controlledMonth ?? value.start ?? (/* @__PURE__ */ new Date()).toISOString().slice(0, 10)));
   const visibleMonth = startOfMonth(controlledMonth ?? internalMonth);
-  const [activeDate, setActiveDate] = (0, import_react72.useState)(value.end ?? value.start ?? visibleMonth);
-  const rootRef = (0, import_react72.useRef)(null);
-  const pendingFocus = (0, import_react72.useRef)(autoFocus);
+  const [activeDate, setActiveDate] = (0, import_react73.useState)(value.end ?? value.start ?? visibleMonth);
+  const rootRef = (0, import_react73.useRef)(null);
+  const pendingFocus = (0, import_react73.useRef)(autoFocus);
   const count2 = Math.max(1, Math.min(3, months));
-  const calendars = (0, import_react72.useMemo)(() => Array.from({ length: count2 }, (_, index) => {
+  const calendars = (0, import_react73.useMemo)(() => Array.from({ length: count2 }, (_, index) => {
     const month = startOfMonth(addCalendarMonths(visibleMonth, index));
     return { month, days: buildMonthGrid(month).filter((day) => day.inMonth) };
   }), [visibleMonth, count2]);
   const todayDate = today === void 0 ? localDateKey() : today;
   const rangeInvalid = invalid || !!value.start && !!value.end && value.start > value.end;
-  (0, import_react72.useEffect)(() => {
+  (0, import_react73.useEffect)(() => {
     const first = calendars[0]?.days[0]?.date;
     const finalDays = calendars[calendars.length - 1]?.days;
     const last = finalDays?.[finalDays.length - 1]?.date;
     if (first && last && (activeDate < first || activeDate > last)) setActiveDate(first);
   }, [activeDate, calendars]);
-  (0, import_react72.useEffect)(() => {
+  (0, import_react73.useEffect)(() => {
     if (!pendingFocus.current) return;
     rootRef.current?.querySelector(`[data-date="${activeDate}"]`)?.focus({ preventScroll: autoFocus });
     pendingFocus.current = false;
@@ -14608,15 +14637,15 @@ function DateRangeField(props) {
     "aria-describedby": ariaDescribedBy,
     "aria-invalid": ariaInvalid
   } = props;
-  const uid = (0, import_react72.useId)();
+  const uid = (0, import_react73.useId)();
   const id = idProp ?? `${uid}-trigger`;
   const popoverId = `${uid}-months`;
   const valueId = `${uid}-value`;
-  const anchorRef = (0, import_react72.useRef)(null);
-  const triggerRef = (0, import_react72.useRef)(null);
+  const anchorRef = (0, import_react73.useRef)(null);
+  const triggerRef = (0, import_react73.useRef)(null);
   const { open, hide, triggerProps } = useFieldPopover(popoverId, () => triggerRef.current?.focus({ preventScroll: true }), onOpenChange);
-  const [labelled, setLabelled] = (0, import_react72.useState)(false);
-  (0, import_react72.useEffect)(() => {
+  const [labelled, setLabelled] = (0, import_react73.useState)(false);
+  (0, import_react73.useEffect)(() => {
     setLabelled((triggerRef.current?.labels?.length ?? 0) > 0);
   }, [id]);
   const format = (date) => formatDate?.(date) ?? formatDateKey(date, locale);
@@ -14687,7 +14716,7 @@ function DateRangeField(props) {
 }
 // src/components/DatePicker.tsx
-var import_react73 = require("react");
+var import_react74 = require("react");
 var import_jsx_runtime98 = require("react/jsx-runtime");
 var DEFAULT_DATE_PICKER_LABELS = {
   open: "Choose date",
@@ -14699,7 +14728,7 @@ var DEFAULT_DATE_PICKER_LABELS = {
   notADate: "That is not a date.",
   unavailable: "That date is not available."
 };
-var DatePicker = (0, import_react73.forwardRef)(function DatePicker2({
+var DatePicker = (0, import_react74.forwardRef)(function DatePicker2({
   value,
   onValueChange,
   min,
@@ -14730,18 +14759,18 @@ var DatePicker = (0, import_react73.forwardRef)(function DatePicker2({
   className,
   style
 }, forwardedRef) {
-  const uid = (0, import_react73.useId)();
+  const uid = (0, import_react74.useId)();
   const id = idProp ?? `${uid}-input`;
   const popoverId = `${uid}-calendar`;
   const errorId = `${uid}-error`;
   const labels = { ...DEFAULT_DATE_PICKER_LABELS, ...useUixLabels().datePicker, ...labelOverrides };
-  const anchorRef = (0, import_react73.useRef)(null);
-  const inputRef = (0, import_react73.useRef)(null);
-  (0, import_react73.useImperativeHandle)(forwardedRef, () => inputRef.current);
+  const anchorRef = (0, import_react74.useRef)(null);
+  const inputRef = (0, import_react74.useRef)(null);
+  (0, import_react74.useImperativeHandle)(forwardedRef, () => inputRef.current);
   const format = (date) => formatDate?.(date) ?? formatDateKey(date, locale);
-  const [text, setText] = (0, import_react73.useState)(() => value ? format(value) : "");
-  const [problem, setProblemState] = (0, import_react73.useState)(null);
-  const reported = (0, import_react73.useRef)(null);
+  const [text, setText] = (0, import_react74.useState)(() => value ? format(value) : "");
+  const [problem, setProblemState] = (0, import_react74.useState)(null);
+  const reported = (0, import_react74.useRef)(null);
   const setProblem = (next) => {
     if (next !== reported.current) {
       reported.current = next;
@@ -14749,7 +14778,7 @@ var DatePicker = (0, import_react73.forwardRef)(function DatePicker2({
     }
     setProblemState(next);
   };
-  (0, import_react73.useEffect)(() => {
+  (0, import_react74.useEffect)(() => {
     setText(value ? format(value) : "");
     setProblem(null);
   }, [value, locale]);
@@ -14899,7 +14928,7 @@ var DEFAULT_DATE_TIME_PICKER_LABELS = {
   timeOf: "{label}, time",
   timeZone: "Time zone: {zone}"
 };
-var DateTimePicker = (0, import_react73.forwardRef)(function DateTimePicker2({
+var DateTimePicker = (0, import_react74.forwardRef)(function DateTimePicker2({
   value,
   onValueChange,
   timeZone,
@@ -14923,19 +14952,19 @@ var DateTimePicker = (0, import_react73.forwardRef)(function DateTimePicker2({
   style,
   ...dateProps
 }, forwardedRef) {
-  const uid = (0, import_react73.useId)();
+  const uid = (0, import_react74.useId)();
   const id = idProp ?? `${uid}-date`;
   const zoneId = `${uid}-zone`;
   const labels = { ...DEFAULT_DATE_TIME_PICKER_LABELS, ...useUixLabels().dateTimePicker, ...labelOverrides };
   const { date, time } = splitDateTime(value);
-  const dateRef = (0, import_react73.useRef)(null);
-  (0, import_react73.useImperativeHandle)(forwardedRef, () => dateRef.current);
-  const [pendingTime, setPendingTime] = (0, import_react73.useState)("");
+  const dateRef = (0, import_react74.useRef)(null);
+  (0, import_react74.useImperativeHandle)(forwardedRef, () => dateRef.current);
+  const [pendingTime, setPendingTime] = (0, import_react74.useState)("");
   const shownTime = date ? time : pendingTime;
-  const [fieldLabel, setFieldLabel] = (0, import_react73.useState)("");
-  const [viewerZone, setViewerZone] = (0, import_react73.useState)(null);
+  const [fieldLabel, setFieldLabel] = (0, import_react74.useState)("");
+  const [viewerZone, setViewerZone] = (0, import_react74.useState)(null);
   const grouped = !!ariaLabel || !!ariaLabelledBy;
-  (0, import_react73.useEffect)(() => {
+  (0, import_react74.useEffect)(() => {
     if (!grouped) setFieldLabel(dateRef.current?.labels?.[0]?.textContent?.trim() ?? "");
     if (!timeZone) {
       try {
@@ -15014,7 +15043,7 @@ var DateTimePicker = (0, import_react73.forwardRef)(function DateTimePicker2({
 });
 // src/components/RelationshipGraph.tsx
-var import_react75 = require("react");
+var import_react76 = require("react");
 // src/relationship-graph-model.ts
 function boundRelationshipGraph(nodes, edges, maxNodes = 40) {
@@ -15495,7 +15524,7 @@ function layeredNeighbor(layout, currentId, key) {
 }
 // src/components/RelationshipGraphLayered.tsx
-var import_react74 = require("react");
+var import_react75 = require("react");
 // src/components/RelationshipGraphList.tsx
 var import_jsx_runtime99 = require("react/jsx-runtime");
@@ -15585,13 +15614,13 @@ function LayeredRelationshipGraph({
   controls = "full",
   initialView: initialViewMode = "readable"
 }) {
-  const hintId = (0, import_react74.useId)();
-  const viewportHintId = (0, import_react74.useId)();
+  const hintId = (0, import_react75.useId)();
+  const viewportHintId = (0, import_react75.useId)();
   const compact = controls === "compact";
-  const bounded = (0, import_react74.useMemo)(() => boundRelationshipGraph(nodes, edges, maxNodes), [nodes, edges, maxNodes]);
-  const [localExpanded, setLocalExpanded] = (0, import_react74.useState)(EMPTY_IDS2);
+  const bounded = (0, import_react75.useMemo)(() => boundRelationshipGraph(nodes, edges, maxNodes), [nodes, edges, maxNodes]);
+  const [localExpanded, setLocalExpanded] = (0, import_react75.useState)(EMPTY_IDS2);
   const expanded = expandedClusterIds ?? localExpanded;
-  const layout = (0, import_react74.useMemo)(
+  const layout = (0, import_react75.useMemo)(
     () => layoutLayeredGraph(bounded.nodes, bounded.edges, {
       ...rootId !== void 0 ? { rootId } : {},
       ...clusterThreshold !== void 0 ? { clusterThreshold } : {},
@@ -15600,43 +15629,43 @@ function LayeredRelationshipGraph({
     }),
     [bounded, rootId, clusterThreshold, expanded, density]
   );
-  const itemById = (0, import_react74.useMemo)(() => new Map(layout.items.map((item) => [item.id, item])), [layout]);
-  const startView = (0, import_react74.useCallback)(
+  const itemById = (0, import_react75.useMemo)(() => new Map(layout.items.map((item) => [item.id, item])), [layout]);
+  const startView = (0, import_react75.useCallback)(
     (forLayout, forSize) => initialViewMode === "fit" ? fitView(forLayout, forSize) : initialView(forLayout, forSize),
     [initialViewMode]
   );
-  const viewportRef = (0, import_react74.useRef)(null);
-  const itemRefs = (0, import_react74.useRef)(/* @__PURE__ */ new Map());
-  const fullscreenButtonRef = (0, import_react74.useRef)(null);
-  const [size, setSize] = (0, import_react74.useState)({ width: 0, height: 0 });
-  const [view, setView] = (0, import_react74.useState)({ x: 0, y: 0, zoom: 1 });
-  const [animate, setAnimate] = (0, import_react74.useState)(false);
-  const [localFocus, setLocalFocus] = (0, import_react74.useState)(void 0);
-  const [hoverId, setHoverId] = (0, import_react74.useState)(void 0);
-  const [fullscreen, setFullscreen] = (0, import_react74.useState)(false);
-  const [wheelHint, setWheelHint] = (0, import_react74.useState)(false);
-  const viewRef = (0, import_react74.useRef)(view);
+  const viewportRef = (0, import_react75.useRef)(null);
+  const itemRefs = (0, import_react75.useRef)(/* @__PURE__ */ new Map());
+  const fullscreenButtonRef = (0, import_react75.useRef)(null);
+  const [size, setSize] = (0, import_react75.useState)({ width: 0, height: 0 });
+  const [view, setView] = (0, import_react75.useState)({ x: 0, y: 0, zoom: 1 });
+  const [animate, setAnimate] = (0, import_react75.useState)(false);
+  const [localFocus, setLocalFocus] = (0, import_react75.useState)(void 0);
+  const [hoverId, setHoverId] = (0, import_react75.useState)(void 0);
+  const [fullscreen, setFullscreen] = (0, import_react75.useState)(false);
+  const [wheelHint, setWheelHint] = (0, import_react75.useState)(false);
+  const viewRef = (0, import_react75.useRef)(view);
   viewRef.current = view;
-  const layoutRef = (0, import_react74.useRef)(layout);
+  const layoutRef = (0, import_react75.useRef)(layout);
   layoutRef.current = layout;
-  const fullscreenRef = (0, import_react74.useRef)(fullscreen);
+  const fullscreenRef = (0, import_react75.useRef)(fullscreen);
   fullscreenRef.current = fullscreen;
-  const compactRef = (0, import_react74.useRef)(compact);
+  const compactRef = (0, import_react75.useRef)(compact);
   compactRef.current = compact;
-  const pendingFocus = (0, import_react74.useRef)(void 0);
-  const initialisedFor = (0, import_react74.useRef)(void 0);
-  const refitOnResize = (0, import_react74.useRef)(false);
-  const hintTimer = (0, import_react74.useRef)(void 0);
+  const pendingFocus = (0, import_react75.useRef)(void 0);
+  const initialisedFor = (0, import_react75.useRef)(void 0);
+  const refitOnResize = (0, import_react75.useRef)(false);
+  const hintTimer = (0, import_react75.useRef)(void 0);
   const modifier = useKbdPlatform() === "mac" ? "\u2318" : "Ctrl";
   const rootItemId = layout.rootId !== void 0 ? layout.itemOf[layout.rootId] : layout.items[0]?.id;
   const requestedFocus = focusId !== void 0 ? layout.itemOf[focusId] ?? focusId : localFocus;
   const focusedId = requestedFocus !== void 0 && itemById.has(requestedFocus) ? requestedFocus : rootItemId;
   const selectedItemId = selectedId !== void 0 ? layout.itemOf[selectedId] : void 0;
-  const activeIds = (0, import_react74.useMemo)(
+  const activeIds = (0, import_react75.useMemo)(
     () => new Set([hoverId, selectedItemId].filter((id) => id !== void 0)),
     [hoverId, selectedItemId]
   );
-  (0, import_react74.useEffect)(() => {
+  (0, import_react75.useEffect)(() => {
     const element = viewportRef.current;
     if (!element) return;
     const measure2 = () => setSize({ width: element.clientWidth, height: element.clientHeight });
@@ -15646,20 +15675,20 @@ function LayeredRelationshipGraph({
     observer.observe(element);
     return () => observer.disconnect();
   }, []);
-  (0, import_react74.useEffect)(() => {
+  (0, import_react75.useEffect)(() => {
     if (size.width === 0) return;
     const key = `${layout.rootId ?? ""}`;
     if (initialisedFor.current === key) return;
     initialisedFor.current = key;
     setView(startView(layout, size));
   }, [layout, size, startView]);
-  (0, import_react74.useEffect)(() => {
+  (0, import_react75.useEffect)(() => {
     if (!refitOnResize.current || size.width === 0) return;
     refitOnResize.current = false;
     setAnimate(false);
     setView(startView(layoutRef.current, size));
   }, [size, startView]);
-  (0, import_react74.useEffect)(() => {
+  (0, import_react75.useEffect)(() => {
     if (!fullscreen) return;
     const root = document.documentElement;
     const previous = root.style.overflow;
@@ -15668,12 +15697,12 @@ function LayeredRelationshipGraph({
       root.style.overflow = previous;
     };
   }, [fullscreen]);
-  (0, import_react74.useEffect)(() => () => clearTimeout(hintTimer.current), []);
-  const moveView = (0, import_react74.useCallback)((next, smooth) => {
+  (0, import_react75.useEffect)(() => () => clearTimeout(hintTimer.current), []);
+  const moveView = (0, import_react75.useCallback)((next, smooth) => {
     setAnimate(smooth);
     setView(next);
   }, []);
-  const ensureVisible = (0, import_react74.useCallback)((id, smooth) => {
+  const ensureVisible = (0, import_react75.useCallback)((id, smooth) => {
     const element = viewportRef.current;
     const item = layoutRef.current.items.find((candidate) => candidate.id === id);
     if (!element || !item) return;
@@ -15692,7 +15721,7 @@ function LayeredRelationshipGraph({
     else if (bottom > heightPx - FOCUS_MARGIN) nextY -= bottom - (heightPx - FOCUS_MARGIN);
     if (nextX !== x || nextY !== y) moveView({ x: nextX, y: nextY, zoom }, smooth);
   }, [moveView]);
-  const focusItem = (0, import_react74.useCallback)((id) => {
+  const focusItem = (0, import_react75.useCallback)((id) => {
     setLocalFocus(id);
     onFocusChange?.(id);
     requestAnimationFrame(() => {
@@ -15700,7 +15729,7 @@ function LayeredRelationshipGraph({
       ensureVisible(id, true);
     });
   }, [ensureVisible, onFocusChange]);
-  (0, import_react74.useEffect)(() => {
+  (0, import_react75.useEffect)(() => {
     const wanted = pendingFocus.current;
     if (wanted !== void 0 && itemById.has(wanted)) {
       pendingFocus.current = void 0;
@@ -15710,8 +15739,8 @@ function LayeredRelationshipGraph({
   const controlledTarget = focusId !== void 0 ? layout.itemOf[focusId] ?? focusId : void 0;
   const controlledPresent = controlledTarget !== void 0 && itemById.has(controlledTarget);
   const controlledKey = `${controlledTarget ?? ""}|${controlledPresent}`;
-  const lastControlledKey = (0, import_react74.useRef)(controlledKey);
-  (0, import_react74.useEffect)(() => {
+  const lastControlledKey = (0, import_react75.useRef)(controlledKey);
+  (0, import_react75.useEffect)(() => {
     if (lastControlledKey.current === controlledKey) return;
     lastControlledKey.current = controlledKey;
     if (!controlledPresent || controlledTarget === void 0) return;
@@ -15720,7 +15749,7 @@ function LayeredRelationshipGraph({
       ensureVisible(controlledTarget, true);
     });
   }, [controlledKey, controlledTarget, controlledPresent, ensureVisible]);
-  (0, import_react74.useEffect)(() => {
+  (0, import_react75.useEffect)(() => {
     const element = viewportRef.current;
     if (!element) return;
     const onWheel = (event) => {
@@ -15745,8 +15774,8 @@ function LayeredRelationshipGraph({
     element.addEventListener("wheel", onWheel, { passive: false });
     return () => element.removeEventListener("wheel", onWheel);
   }, []);
-  const pointers = (0, import_react74.useRef)(/* @__PURE__ */ new Map());
-  const pinchDistance = (0, import_react74.useRef)(void 0);
+  const pointers = (0, import_react75.useRef)(/* @__PURE__ */ new Map());
+  const pinchDistance = (0, import_react75.useRef)(void 0);
   const onPointerDown = (event) => {
     if (event.target.closest("button")) return;
     event.currentTarget.setPointerCapture?.(event.pointerId);
@@ -16008,21 +16037,23 @@ function LayeredRelationshipGraph({
                 })
               ] }),
               compact && /* @__PURE__ */ (0, import_jsx_runtime100.jsxs)(import_jsx_runtime100.Fragment, { children: [
-                /* @__PURE__ */ (0, import_jsx_runtime100.jsx)("p", { className: "uix-relationship-graph__hint", "aria-hidden": "true", children: labels.navigationHint(modifier) }),
                 wheelHint && /* @__PURE__ */ (0, import_jsx_runtime100.jsx)("p", { className: "uix-relationship-graph__toast", role: "status", children: labels.navigationHint(modifier) }),
-                /* @__PURE__ */ (0, import_jsx_runtime100.jsxs)("div", { className: "uix-relationship-graph__controls", role: "group", "aria-label": labels.controls, children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime100.jsx)("span", { className: "uix-relationship-graph__zoom-level", "aria-live": "polite", children: labels.zoomLevel(zoomPercent) }),
-                  /* @__PURE__ */ (0, import_jsx_runtime100.jsxs)("div", { className: "uix-relationship-graph__control-cluster", children: [
-                    control(labels.zoomIn, /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(PlusIcon, { "aria-hidden": "true" }), () => zoomBy(ZOOM_STEP), { disabled: view.zoom >= MAX_ZOOM2, keys: ["+"] }),
-                    control(labels.zoomOut, /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(MinusIcon, { "aria-hidden": "true" }), () => zoomBy(1 / ZOOM_STEP), { disabled: view.zoom <= MIN_ZOOM2, keys: ["\u2212"] }),
-                    control(labels.fit, /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(ScanIcon, { "aria-hidden": "true" }), () => moveView(fitView(layout, size), true)),
-                    control(labels.reset, /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(RotateCcwIcon, { "aria-hidden": "true" }), resetView, { keys: ["0"] }),
-                    control(
-                      fullscreen ? labels.exitFullscreen : labels.fullscreen,
-                      fullscreen ? /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(Minimize2Icon, { "aria-hidden": "true" }) : /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(Maximize2Icon, { "aria-hidden": "true" }),
-                      toggleFullscreen,
-                      { ref: fullscreenButtonRef, ...fullscreen ? { keys: ["Esc"] } : {} }
-                    )
+                /* @__PURE__ */ (0, import_jsx_runtime100.jsxs)("div", { className: "uix-relationship-graph__footer", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime100.jsx)("p", { className: "uix-relationship-graph__hint", "aria-hidden": "true", children: labels.navigationHint(modifier) }),
+                  /* @__PURE__ */ (0, import_jsx_runtime100.jsxs)("div", { className: "uix-relationship-graph__controls", role: "group", "aria-label": labels.controls, children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime100.jsx)("span", { className: "uix-relationship-graph__zoom-level", "aria-live": "polite", children: labels.zoomLevel(zoomPercent) }),
+                    /* @__PURE__ */ (0, import_jsx_runtime100.jsxs)("div", { className: "uix-relationship-graph__control-cluster", children: [
+                      control(labels.zoomIn, /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(PlusIcon, { "aria-hidden": "true" }), () => zoomBy(ZOOM_STEP), { disabled: view.zoom >= MAX_ZOOM2, keys: ["+"] }),
+                      control(labels.zoomOut, /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(MinusIcon, { "aria-hidden": "true" }), () => zoomBy(1 / ZOOM_STEP), { disabled: view.zoom <= MIN_ZOOM2, keys: ["\u2212"] }),
+                      control(labels.fit, /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(ScanIcon, { "aria-hidden": "true" }), () => moveView(fitView(layout, size), true)),
+                      control(labels.reset, /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(RotateCcwIcon, { "aria-hidden": "true" }), resetView, { keys: ["0"] }),
+                      control(
+                        fullscreen ? labels.exitFullscreen : labels.fullscreen,
+                        fullscreen ? /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(Minimize2Icon, { "aria-hidden": "true" }) : /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(Maximize2Icon, { "aria-hidden": "true" }),
+                        toggleFullscreen,
+                        { ref: fullscreenButtonRef, ...fullscreen ? { keys: ["Esc"] } : {} }
+                      )
+                    ] })
                   ] })
                 ] })
               ] })
@@ -16117,7 +16148,7 @@ function radialViewBox(nodes) {
   return `${round(minX)} ${round(minY)} ${width} ${height}`;
 }
 function RelationshipGraph(props) {
-  const labels = (0, import_react75.useMemo)(() => ({ ...DEFAULT_RELATIONSHIP_GRAPH_LABELS, ...props.labels }), [props.labels]);
+  const labels = (0, import_react76.useMemo)(() => ({ ...DEFAULT_RELATIONSHIP_GRAPH_LABELS, ...props.labels }), [props.labels]);
   const stateClass = cx("uix-relationship-graph uix-relationship-graph--state", props.className);
   if (props.loading) return /* @__PURE__ */ (0, import_jsx_runtime101.jsx)("div", { className: stateClass, role: "status", children: labels.loading });
   if (props.error) {
@@ -16151,17 +16182,17 @@ function RadialRelationshipGraph({
   labels,
   showList = true
 }) {
-  const bounded = (0, import_react75.useMemo)(() => boundRelationshipGraph(nodes, edges, maxNodes), [nodes, edges, maxNodes]);
-  const positioned = (0, import_react75.useMemo)(() => layoutRelationshipGraph(bounded.nodes, bounded.edges, selectedId), [bounded, selectedId]);
-  const typeColor = (0, import_react75.useMemo)(
+  const bounded = (0, import_react76.useMemo)(() => boundRelationshipGraph(nodes, edges, maxNodes), [nodes, edges, maxNodes]);
+  const positioned = (0, import_react76.useMemo)(() => layoutRelationshipGraph(bounded.nodes, bounded.edges, selectedId), [bounded, selectedId]);
+  const typeColor = (0, import_react76.useMemo)(
     () => new Map(legend.map((item, index) => [item.id, `var(--uix-chart-${index % 8 + 1})`])),
     [legend]
   );
-  const positionedById = (0, import_react75.useMemo)(() => new Map(positioned.map((node) => [node.id, node])), [positioned]);
-  const [zoom, setZoom] = (0, import_react75.useState)(1);
-  const [pan, setPan] = (0, import_react75.useState)({ x: 0, y: 0 });
-  const [focusedId, setFocusedId] = (0, import_react75.useState)(selectedId ?? positioned[0]?.id);
-  const svgRef = (0, import_react75.useRef)(null);
+  const positionedById = (0, import_react76.useMemo)(() => new Map(positioned.map((node) => [node.id, node])), [positioned]);
+  const [zoom, setZoom] = (0, import_react76.useState)(1);
+  const [pan, setPan] = (0, import_react76.useState)({ x: 0, y: 0 });
+  const [focusedId, setFocusedId] = (0, import_react76.useState)(selectedId ?? positioned[0]?.id);
+  const svgRef = (0, import_react76.useRef)(null);
   const select = (id) => {
     const node = bounded.nodes.find((item) => item.id === id);
     if (node) onSelect?.(node);
@@ -16232,7 +16263,7 @@ function RadialRelationshipGraph({
 }
 // src/components/MatchReview.tsx
-var import_react76 = require("react");
+var import_react77 = require("react");
 var import_jsx_runtime102 = require("react/jsx-runtime");
 var DEFAULT_MATCH_REVIEW_LABELS = {
   region: "Match review",
@@ -16295,11 +16326,11 @@ function MatchReview({
   const plural = (n, one, many) => fillLabel(n === 1 ? one : many, { count: n });
   const decisionLabel = { accepted: labels.decisionAccepted, dismissed: labels.decisionDismissed, split: labels.decisionSplit, other: labels.decisionOther };
   const actionLabel = { accept: labels.accept, dismiss: labels.dismiss, split: labels.split, "pick-other": labels.pickOther };
-  const [internalSelection, setInternalSelection] = (0, import_react76.useState)(/* @__PURE__ */ new Set());
-  const [announcement, setAnnouncement] = (0, import_react76.useState)("");
-  const [bulkPending, setBulkPending] = (0, import_react76.useState)(false);
+  const [internalSelection, setInternalSelection] = (0, import_react77.useState)(/* @__PURE__ */ new Set());
+  const [announcement, setAnnouncement] = (0, import_react77.useState)("");
+  const [bulkPending, setBulkPending] = (0, import_react77.useState)(false);
   const selection = selectedIds ?? internalSelection;
-  const pending = (0, import_react76.useMemo)(() => candidates.filter((candidate) => candidate.status !== "resolved"), [candidates]);
+  const pending = (0, import_react77.useMemo)(() => candidates.filter((candidate) => candidate.status !== "resolved"), [candidates]);
   const setSelection = (next) => {
     if (selectedIds === void 0) setInternalSelection(next);
     onSelectionChange?.(next);
@@ -16388,7 +16419,7 @@ function MatchReview({
 }
 // src/components/MetricInput.tsx
-var import_react77 = require("react");
+var import_react78 = require("react");
 // src/metric-model.ts
 function decimals(value) {
@@ -16434,14 +16465,14 @@ function MetricInput({
   className,
   id: providedId
 }) {
-  const generatedId = (0, import_react77.useId)();
+  const generatedId = (0, import_react78.useId)();
   const id = providedId ?? generatedId;
   const errorId = `${id}-error`;
   const hintId = `${id}-hint`;
   const showError = Boolean(invalid && errorMessage);
   const describedBy = [hint ? hintId : null, showError ? errorId : null].filter(Boolean).join(" ") || void 0;
-  const [text, setText] = (0, import_react77.useState)(() => format(value));
-  (0, import_react77.useEffect)(() => setText(format(value)), [value, format]);
+  const [text, setText] = (0, import_react78.useState)(() => format(value));
+  (0, import_react78.useEffect)(() => setText(format(value)), [value, format]);
   const commit = (input) => {
     const parsed = parse(input);
     if (input.trim() === "" || parsed !== null) {
@@ -16553,7 +16584,7 @@ function LicensePositionBar({
 }
 // src/components/BrandProfiles.tsx
-var import_react79 = require("react");
+var import_react80 = require("react");
 // src/color-model.ts
 var clamp2 = (value, min, max) => Math.min(max, Math.max(min, value));
@@ -16622,7 +16653,7 @@ function meetsContrast(background, foreground, minimum = 4.5) {
 }
 // src/components/ColorPicker.tsx
-var import_react78 = require("react");
+var import_react79 = require("react");
 var import_jsx_runtime105 = require("react/jsx-runtime");
 var DEFAULT_COLOR_PICKER_LABELS = {
   trigger: "{label}: {color}",
@@ -16654,17 +16685,17 @@ function ColorPicker({
   labels: labelOverrides
 }) {
   const labels = { ...DEFAULT_COLOR_PICKER_LABELS, ...labelOverrides };
-  const id = (0, import_react78.useId)();
-  const triggerRef = (0, import_react78.useRef)(null);
-  const dialogRef = (0, import_react78.useRef)(null);
-  const [open, setOpen] = (0, import_react78.useState)(false);
+  const id = (0, import_react79.useId)();
+  const triggerRef = (0, import_react79.useRef)(null);
+  const dialogRef = (0, import_react79.useRef)(null);
+  const [open, setOpen] = (0, import_react79.useState)(false);
   const normalized = normalizeHex(value) ?? "#000000";
-  const [hexText, setHexText] = (0, import_react78.useState)(normalized);
-  const hsv = (0, import_react78.useMemo)(() => rgbToHsv(hexToRgb(normalized)), [normalized]);
+  const [hexText, setHexText] = (0, import_react79.useState)(normalized);
+  const hsv = (0, import_react79.useMemo)(() => rgbToHsv(hexToRgb(normalized)), [normalized]);
   const ratio = contrastRatio(normalized, foreground) ?? 0;
   const passes = ratio >= minimumContrast;
-  (0, import_react78.useEffect)(() => setHexText(normalized), [normalized]);
-  (0, import_react78.useEffect)(() => {
+  (0, import_react79.useEffect)(() => setHexText(normalized), [normalized]);
+  (0, import_react79.useEffect)(() => {
     if (!open) return;
     const dialog = dialogRef.current;
     dialog?.querySelector("input,button")?.focus();
@@ -16884,7 +16915,7 @@ function BrandProfileEditor({
   labels: labelOverrides
 }) {
   const labels = { ...DEFAULT_BRAND_PROFILE_EDITOR_LABELS, ...labelOverrides };
-  const [announcement, setAnnouncement] = (0, import_react79.useState)("");
+  const [announcement, setAnnouncement] = (0, import_react80.useState)("");
   const update = (patch) => onChange({ ...value, ...patch });
   const apply = () => {
     if (applyTarget !== null) applyBrandProfile(value, applyTarget);
@@ -16956,7 +16987,7 @@ function BrandProfileEditor({
 var BrandProfiles = BrandProfileEditor;
 // src/components/DiffViewer.tsx
-var import_react80 = require("react");
+var import_react81 = require("react");
 // src/diff-model.ts
 function isJsonObject(value) {
@@ -17052,9 +17083,9 @@ function DiffViewer({
   const labels = { ...DEFAULT_DIFF_VIEWER_LABELS, ...labelOverrides };
   const resolutionLabel = { accept: labels.resolutionAccept, skip: labels.resolutionSkip, pending: labels.resolutionPending };
   const buttonSize = controlSize === "md" ? void 0 : `uix-btn--${controlSize}`;
-  const id = (0, import_react80.useId)();
-  const entries = (0, import_react80.useMemo)(() => providedEntries ?? buildThreeWayDiff(base, current, incoming), [providedEntries, base, current, incoming]);
-  const [internalResolutions, setInternalResolutions] = (0, import_react80.useState)({});
+  const id = (0, import_react81.useId)();
+  const entries = (0, import_react81.useMemo)(() => providedEntries ?? buildThreeWayDiff(base, current, incoming), [providedEntries, base, current, incoming]);
+  const [internalResolutions, setInternalResolutions] = (0, import_react81.useState)({});
   const resolutions = controlledResolutions ?? internalResolutions;
   const summary = summarizeDiff(entries, resolutions);
   const resolve = (path, resolution) => {
@@ -17117,7 +17148,7 @@ function DiffViewer({
 }
 // src/components/TextDiff.tsx
-var import_react81 = require("react");
+var import_react82 = require("react");
 // src/text-diff-model.ts
 var WORD_TOKENS = /\s+|[\p{L}\p{M}\p{N}_]+|[^\s\p{L}\p{M}\p{N}_]/gu;
@@ -17396,7 +17427,7 @@ function Marked({ segments, side, labels, whole: whole2 }) {
       ": "
     ] }),
     segment.text
-  ] }, i) : /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(import_react81.Fragment, { children: segment.text }, i)) });
+  ] }, i) : /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(import_react82.Fragment, { children: segment.text }, i)) });
 }
 function Cell({ line, side, kind, labels }) {
   if (!line) return /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("div", { className: "uix-text-diff__cell", "data-side": side, "data-empty": "", "aria-hidden": "true" });
@@ -17408,9 +17439,9 @@ function Cell({ line, side, kind, labels }) {
   ] });
 }
 function Rows({ rows, view, labels, focusFirst }) {
-  const [open, setOpen] = (0, import_react81.useState)(() => /* @__PURE__ */ new Set());
-  const first = (0, import_react81.useRef)(null);
-  (0, import_react81.useEffect)(() => {
+  const [open, setOpen] = (0, import_react82.useState)(() => /* @__PURE__ */ new Set());
+  const first = (0, import_react82.useRef)(null);
+  (0, import_react82.useEffect)(() => {
     if (focusFirst) first.current?.focus();
   }, [focusFirst]);
   const firstProps = (index) => focusFirst && index === 0 ? { ref: first, tabIndex: -1 } : {};
@@ -17423,7 +17454,7 @@ function Rows({ rows, view, labels, focusFirst }) {
     const after = row.kind === "delete" ? void 0 : row.after;
     if (view === "unified") {
       if (row.kind === "equal") return /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("div", { className: "uix-text-diff__row", "data-kind": "equal", ...firstProps(index), children: /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(Cell, { line: after, side: "after", kind: "equal", labels }) }, index);
-      return /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)(import_react81.Fragment, { children: [
+      return /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)(import_react82.Fragment, { children: [
         before && /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("div", { className: "uix-text-diff__row", "data-kind": "delete", children: /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(Cell, { line: before, side: "before", kind: row.kind, labels }) }),
         after && /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("div", { className: "uix-text-diff__row", "data-kind": "insert", children: /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(Cell, { line: after, side: "after", kind: row.kind, labels }) })
       ] }, index);
@@ -17452,8 +17483,8 @@ function TextDiff({
 }) {
   const uixLabels = useUixLabels();
   const labels = { ...DEFAULT_TEXT_DIFF_LABELS, ...uixLabels.textDiff, ...labelOverrides };
-  const result = (0, import_react81.useMemo)(() => diffText(before, after, { granularity, maxTokens, maxEdits }), [before, after, granularity, maxTokens, maxEdits]);
-  const rows = (0, import_react81.useMemo)(() => granularity === "line" && result.status === "ok" ? textDiffRows(result, { context }) : [], [result, granularity, context]);
+  const result = (0, import_react82.useMemo)(() => diffText(before, after, { granularity, maxTokens, maxEdits }), [before, after, granularity, maxTokens, maxEdits]);
+  const rows = (0, import_react82.useMemo)(() => granularity === "line" && result.status === "ok" ? textDiffRows(result, { context }) : [], [result, granularity, context]);
   const heads = /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("div", { className: "uix-text-diff__heads", "aria-hidden": view === "unified" || void 0, children: [
     /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("span", { className: "uix-text-diff__head", "data-side": "before", children: [
       view === "unified" && /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("span", { "aria-hidden": "true", children: "\u2212 " }),
@@ -17471,7 +17502,7 @@ function TextDiff({
   else {
     const prose = (side2) => /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("div", { className: "uix-text-diff__prose", "data-side": side2, children: result.ops.map((op, i) => {
       const text = op.tokens.join("");
-      if (op.type === "equal") return /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(import_react81.Fragment, { children: text }, i);
+      if (op.type === "equal") return /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(import_react82.Fragment, { children: text }, i);
       if (op.type === "delete" && side2 === "after") return null;
       if (op.type === "insert" && side2 === "before") return null;
       return /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(Marked, { segments: [{ text, changed: true }], side: op.type === "delete" ? "before" : "after", labels }, i);
@@ -17794,6 +17825,7 @@ function TextDiff({
   placeSpan,
   placesInTopLane,
   predictionBand,
+  prefersReducedMotion,
   proposeMove,
   quantiles,
   rankOverflow,
@@ -17840,6 +17872,7 @@ function TextDiff({
   treeNav,
   useAnchoredPosition,
   useDialog,
+  useReducedMotion,
   useTable,
   useUixLabels,
   useVirtualRows,