@oprt/react 0.3.0 → 0.4.0

package/dist/index.cjs

@@ -5813,7 +5813,7 @@ var import_clsx27 = __toESM(require("clsx"), 1);
 // src/Skeleton/Skeleton.manifest.ts
 var SkeletonManifest = {
   Skeleton: {
-    description: "Loading placeholder. block renders one pulsing bar; text stacks `lines` bars with a shortened last line. Bars fill their container and never widen it, whatever width the caller asks for, and are drawn in a system color in forced-colors mode.",
+    description: 'Loading placeholder, purely visual and silent: hidden from assistive technology, with no role, name or text, so a screen of placeholders does not say "Loading" once each. block renders one pulsing bar; text stacks `lines` bars with a shortened last line. Bars fill their container and never widen it, whatever width the caller asks for, and are drawn in a system color in forced-colors mode. The area that is loading says it: mark the area `aria-busy`, keep one polite status outside it (on the page before it has anything to say) that says "Loading <what>" and then that the content has arrived.',
     props: {
       variant: { type: "enum", values: ["block", "text"], default: "block" },
       width: {
@@ -5830,11 +5830,19 @@ var SkeletonManifest = {
         type: "number",
         default: 3,
         description: "Number of stacked bars in the text variant, rounded down with a minimum of 1. Non-finite values fall back to 3."
+      },
+      "aria-label": {
+        type: "string",
+        description: 'Deprecated and not applied. A Skeleton used to be a status named "Loading" (or this label); it is decorative now. In development a structured error says so, once. Name the loading area instead. The same holds for aria-labelledby, aria-describedby, role, aria-live and aria-busy.'
+      },
+      role: {
+        type: "string",
+        description: "Deprecated and not applied: a Skeleton is decorative and has no role. See aria-label."
       }
     },
     composable_with: ["Card", "DataTable"],
     never_inside: ["Button", "Badge"],
-    example: '<Skeleton variant="text" lines={3} />'
+    example: '<section aria-labelledby="tracks-title">\n  <h2 id="tracks-title">Tracks</h2>\n  <p role="status" className="sr-only">{note}</p>\n  <div aria-busy={loading}>\n    {loading ? <Skeleton variant="text" lines={3} /> : <TrackList tracks={tracks} />}\n  </div>\n</section>'
   }
 };
 
@@ -5852,26 +5860,55 @@ var barStyles = (0, import_class_variance_authority16.cva)(
     defaultVariants: { variant: "block" }
   }
 );
+var NOT_APPLIED2 = [
+  "aria-label",
+  "aria-labelledby",
+  "aria-describedby",
+  "role",
+  "aria-live",
+  "aria-busy"
+];
+var reportedNotApplied2 = /* @__PURE__ */ new Set();
+function reportNotApplied2(prop, received) {
+  if (process.env.NODE_ENV === "production" || reportedNotApplied2.has(prop)) return;
+  reportedNotApplied2.add(prop);
+  console.error(
+    JSON.stringify(
+      {
+        component: "Skeleton",
+        error: "PROP_NOT_APPLIED",
+        prop,
+        received: typeof received === "string" ? received : String(received),
+        suggestion: 'Skeleton is decorative: hidden from assistive technology, with no role or name, so it stays silent and a page of them does not say "Loading" once each. Mark the area that is loading aria-busy and say "Loading <what>" once in a status that is already on the page (see the Skeleton page).'
+      },
+      null,
+      2
+    )
+  );
+}
 var Skeleton = (0, import_react42.forwardRef)((allProps, ref) => {
-  const { className, variant = "block", width, height, lines = 3, ...props } = allProps;
+  const { className, variant = "block", width, height, lines = 3, ...rest } = allProps;
+  const props = { ...rest };
   if (process.env.NODE_ENV !== "production") {
     devValidate("Skeleton", SkeletonManifest.Skeleton.props, { ...allProps });
+    for (const name of NOT_APPLIED2) {
+      if (props[name] !== void 0) reportNotApplied2(name, props[name]);
+    }
   }
+  for (const name of NOT_APPLIED2) delete props[name];
+  delete props["aria-hidden"];
   if (variant === "text") {
     const count2 = Number.isFinite(lines) ? Math.max(1, Math.floor(lines)) : 3;
     return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
       "div",
       {
+        ...props,
         ref,
-        role: "status",
-        "aria-busy": "true",
-        "aria-label": "Loading",
+        "aria-hidden": "true",
         className: (0, import_clsx27.default)("flex flex-col gap-1u", className),
-        ...props,
         children: Array.from({ length: count2 }, (_, i) => /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
           "div",
           {
-            "aria-hidden": "true",
             className: (0, import_clsx27.default)(barStyles({ variant: "text" }), i === count2 - 1 && "w-2/3")
           },
           i
@@ -5883,25 +5920,7 @@ var Skeleton = (0, import_react42.forwardRef)((allProps, ref) => {
   if (width !== void 0) style.width = width;
   if (height !== void 0) style.height = height;
   const hasStyle = width !== void 0 || height !== void 0;
-  return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
-    "div",
-    {
-      ref,
-      role: "status",
-      "aria-busy": "true",
-      "aria-label": "Loading",
-      className: (0, import_clsx27.default)("flex flex-col", className),
-      ...props,
-      children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
-        "div",
-        {
-          "aria-hidden": "true",
-          className: barStyles({ variant: "block" }),
-          ...hasStyle ? { style } : {}
-        }
-      )
-    }
-  );
+  return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { ...props, ref, "aria-hidden": "true", className: (0, import_clsx27.default)("flex flex-col", className), children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: barStyles({ variant: "block" }), ...hasStyle ? { style } : {} }) });
 });
 Skeleton.displayName = "Skeleton";
 
@@ -9407,9 +9426,34 @@ var Sparkline = (0, import_react55.forwardRef)((allProps, ref) => {
 Sparkline.displayName = "Sparkline";
 
 // src/DataGrid/DataGrid.tsx
-var import_react56 = require("react");
+var import_react57 = require("react");
 var import_clsx39 = __toESM(require("clsx"), 1);
 
+// src/_internal/loadingStatus.ts
+var import_react56 = require("react");
+function useLoadingStatusText({
+  loading,
+  loadingText,
+  loadedText
+}) {
+  const held = useHoldBackNewText(true);
+  const [seen2, setSeen] = (0, import_react56.useState)({ loading, first: loading, arrival: "" });
+  let current = seen2;
+  if (seen2.loading !== loading) {
+    current = {
+      loading,
+      first: false,
+      arrival: loading || seen2.first ? "" : loadedText
+    };
+    setSeen(current);
+  } else if (!loading && seen2.arrival !== "" && seen2.arrival !== loadedText) {
+    current = { ...seen2, arrival: "" };
+    setSeen(current);
+  }
+  if (held || current.first) return "";
+  return loading ? loadingText : current.arrival;
+}
+
 // src/DataGrid/DataGrid.manifest.ts
 var DataGridManifest = {
   DataGrid: {
@@ -9446,7 +9490,7 @@ var DataGridManifest = {
       caption: {
         type: "string",
         default: "Data grid",
-        description: "Accessible native table caption and controls group name."
+        description: "Accessible native table caption and controls group name. Also names what is loading in the loading and loaded messages."
       },
       selectedRowIds: {
         type: "array",
@@ -9523,7 +9567,7 @@ var DataGridManifest = {
       loading: {
         type: "boolean",
         default: false,
-        description: "Marks the table busy, announces loading, and disables grid-owned controls and row activation while retaining supplied data."
+        description: 'Marks the table busy and disables grid-owned controls and row activation while retaining supplied data. A load the person asks for (a reload, a page, a filter: `loading` turns on after the grid has rendered) says "Loading <caption>." once (or "Loading results." when no caption is given) and, when it ends, "<caption> loaded. N rows." once. The load that is under way when the grid first renders is busy but silent, as is the arrival of its rows.'
       },
       disabled: {
         type: "boolean",
@@ -9591,8 +9635,8 @@ function ColumnWidthInput({
   label,
   onCommit
 }) {
-  const [draft, setDraft] = (0, import_react56.useState)(null);
-  (0, import_react56.useEffect)(() => setDraft(null), [value]);
+  const [draft, setDraft] = (0, import_react57.useState)(null);
+  (0, import_react57.useEffect)(() => setDraft(null), [value]);
   const text = draft?.base === value ? draft.text : String(value);
   const commit = (requested) => {
     setDraft(null);
@@ -9633,12 +9677,12 @@ function withoutPage(selection, pageIds) {
   const onPage = new Set(pageIds);
   return selection.filter((id) => !onPage.has(id));
 }
-var DataGrid = (0, import_react56.forwardRef)((allProps, ref) => {
+var DataGrid = (0, import_react57.forwardRef)((allProps, ref) => {
   const {
     columns,
     data,
     getRowId,
-    caption = "Data grid",
+    caption: captionProp,
     selectedRowIds,
     onSelectionChange,
     sort,
@@ -9668,18 +9712,19 @@ var DataGrid = (0, import_react56.forwardRef)((allProps, ref) => {
   if (process.env.NODE_ENV !== "production") {
     devValidate("DataGrid", DataGridManifest.DataGrid.props, allProps);
   }
-  const [localSelection, setLocalSelection] = (0, import_react56.useState)([]);
-  const [localSort, setLocalSort] = (0, import_react56.useState)(null);
-  const [localPage, setLocalPage] = (0, import_react56.useState)(1);
-  const [hiddenColumns, setHiddenColumns] = (0, import_react56.useState)([]);
-  const [columnsOpen, setColumnsOpen] = (0, import_react56.useState)(false);
-  const [localWidths, setLocalWidths] = (0, import_react56.useState)({});
-  const [localPinned, setLocalPinned] = (0, import_react56.useState)([]);
-  const [localView, setLocalView] = (0, import_react56.useState)("virtualized");
-  const columnsId = (0, import_react56.useId)();
+  const caption = captionProp ?? "Data grid";
+  const [localSelection, setLocalSelection] = (0, import_react57.useState)([]);
+  const [localSort, setLocalSort] = (0, import_react57.useState)(null);
+  const [localPage, setLocalPage] = (0, import_react57.useState)(1);
+  const [hiddenColumns, setHiddenColumns] = (0, import_react57.useState)([]);
+  const [columnsOpen, setColumnsOpen] = (0, import_react57.useState)(false);
+  const [localWidths, setLocalWidths] = (0, import_react57.useState)({});
+  const [localPinned, setLocalPinned] = (0, import_react57.useState)([]);
+  const [localView, setLocalView] = (0, import_react57.useState)("virtualized");
+  const columnsId = (0, import_react57.useId)();
   const blocked = disabled || loading;
   const selection = selectedRowIds ?? localSelection;
-  const selectionSet = (0, import_react56.useMemo)(() => new Set(selection), [selection]);
+  const selectionSet = (0, import_react57.useMemo)(() => new Set(selection), [selection]);
   const selectionEnabled = selectedRowIds !== void 0 || Boolean(onSelectionChange);
   const effectiveSort = sort === void 0 ? localSort : sort;
   const visibleKeys = visibleColumnKeys ?? columns.filter((column) => !hiddenColumns.includes(column.key)).map((column) => column.key);
@@ -9714,13 +9759,20 @@ var DataGrid = (0, import_react56.forwardRef)((allProps, ref) => {
   const safePageSize = Number.isFinite(pageSize) && pageSize >= 1 ? Math.floor(pageSize) : 10;
   const count2 = mode === "server" && rowCount !== void 0 && Number.isFinite(rowCount) ? Math.max(0, Math.floor(rowCount)) : data.length;
   const pageCount = Math.max(1, Math.ceil(count2 / safePageSize));
+  const what = captionProp ?? "results";
+  const loadingNote = `Loading ${what}.`;
+  const loadingStatus = useLoadingStatusText({
+    loading,
+    loadingText: loadingNote,
+    loadedText: `${captionProp ?? "Results"} loaded. ${count2} ${count2 === 1 ? "row" : "rows"}.`
+  });
   const requestedPage = page ?? localPage;
   const currentPage = Math.min(
     pageCount,
     Math.max(1, Number.isFinite(requestedPage) ? Math.floor(requestedPage) : 1)
   );
-  const correction = (0, import_react56.useRef)(null);
-  (0, import_react56.useEffect)(() => {
+  const correction = (0, import_react57.useRef)(null);
+  (0, import_react57.useEffect)(() => {
     if (requestedPage === currentPage) {
       correction.current = null;
       return;
@@ -9752,7 +9804,7 @@ var DataGrid = (0, import_react56.forwardRef)((allProps, ref) => {
   const sortKey = sortColumn?.key;
   const sortCompare = sortColumn?.compare;
   const direction = effectiveSort?.direction;
-  const sorted = (0, import_react56.useMemo)(() => {
+  const sorted = (0, import_react57.useMemo)(() => {
     if (mode !== "client" || sortKey === void 0 || direction === void 0) return data;
     return sortedOrder(
       data.map((row) => row[sortKey]),
@@ -9762,17 +9814,17 @@ var DataGrid = (0, import_react56.forwardRef)((allProps, ref) => {
   }, [data, mode, sortKey, direction, sortCompare]);
   const pageStart = (currentPage - 1) * safePageSize;
   const paged = mode === "client" && !virtual;
-  const pageRows = (0, import_react56.useMemo)(
+  const pageRows = (0, import_react57.useMemo)(
     () => paged ? sorted.slice(pageStart, pageStart + safePageSize) : sorted,
     [sorted, paged, pageStart, safePageSize]
   );
-  const latestGetRowId = (0, import_react56.useRef)(getRowId);
+  const latestGetRowId = (0, import_react57.useRef)(getRowId);
   latestGetRowId.current = getRowId;
-  const pageIdsOf = (0, import_react56.useMemo)(() => {
+  const pageIdsOf = (0, import_react57.useMemo)(() => {
     let ids = null;
     return () => ids ??= pageRows.map((row) => latestGetRowId.current(row));
   }, [pageRows]);
-  const { allSelected, someSelected } = (0, import_react56.useMemo)(() => {
+  const { allSelected, someSelected } = (0, import_react57.useMemo)(() => {
     if (selectionSet.size === 0) return { allSelected: false, someSelected: false };
     const pageIds = pageIdsOf();
     let selected = 0;
@@ -9993,7 +10045,8 @@ var DataGrid = (0, import_react56.forwardRef)((allProps, ref) => {
             } : {}
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("p", { role: "status", className: loading ? "m-0 text-oprt-text-dim" : "sr-only", children: loading ? "Loading results." : "" }),
+        /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("p", { role: "status", className: "sr-only", children: loadingStatus }),
+        loading && /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("p", { "aria-hidden": "true", className: "m-0 text-oprt-text-dim", children: loadingNote }),
         /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: "flex flex-wrap items-center justify-between gap-2u", children: [
           /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("p", { className: "m-0 font-mono tabular-nums text-oprt-text-dim", children: [
             count2,
@@ -10018,7 +10071,7 @@ var DataGrid = (0, import_react56.forwardRef)((allProps, ref) => {
 DataGrid.displayName = "DataGrid";
 
 // src/ComboBox/ComboBox.tsx
-var import_react57 = require("react");
+var import_react58 = require("react");
 var import_class_variance_authority24 = require("class-variance-authority");
 var import_clsx40 = __toESM(require("clsx"), 1);
 var import_react_aria_components19 = require("react-aria-components");
@@ -10144,7 +10197,7 @@ function reportUnknownValue(received, options) {
     )
   );
 }
-var ComboBox = (0, import_react57.forwardRef)((props, ref) => {
+var ComboBox = (0, import_react58.forwardRef)((props, ref) => {
   const {
     motion = "auto",
     options,
@@ -10169,7 +10222,7 @@ var ComboBox = (0, import_react57.forwardRef)((props, ref) => {
     className
   } = props;
   const motionState = useMotion(motion);
-  const editing = (0, import_react57.useRef)(false);
+  const editing = (0, import_react58.useRef)(false);
   const {
     id: inputId,
     labelledBy,
@@ -10261,7 +10314,15 @@ var ComboBox = (0, import_react57.forwardRef)((props, ref) => {
             }
           )
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("p", { role: "status", className: loading ? "m-0 text-oprt-text-dim" : "sr-only", children: loading ? "Loading options." : null }),
+        /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+          "p",
+          {
+            role: "status",
+            "data-react-aria-top-layer": "",
+            className: loading ? "m-0 text-oprt-text-dim" : "sr-only",
+            children: loading ? "Loading options." : null
+          }
+        ),
         /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
           MotionPopover,
           {
@@ -10303,7 +10364,7 @@ ComboBox.displayName = "ComboBox";
 var import_icons16 = require("@oprt/icons");
 var import_class_variance_authority25 = require("class-variance-authority");
 var import_clsx41 = __toESM(require("clsx"), 1);
-var import_react58 = require("react");
+var import_react59 = require("react");
 
 // src/SplitPane/SplitPane.manifest.ts
 var SplitPaneManifest = {
@@ -10409,8 +10470,8 @@ var paneStyles = "min-w-0 min-h-0 overflow-auto focus-visible:outline-hidden foc
 var BUTTON_STEP = 10;
 var clamp = (value, min, max) => Math.min(max, Math.max(min, value));
 function usePaneScrolls(pane) {
-  const [scrolls, setScrolls] = (0, import_react58.useState)(false);
-  (0, import_react58.useEffect)(() => {
+  const [scrolls, setScrolls] = (0, import_react59.useState)(false);
+  (0, import_react59.useEffect)(() => {
     const node = pane.current;
     if (!node) return;
     const measure = () => setScrolls(
@@ -10446,7 +10507,7 @@ function usePaneScrolls(pane) {
   }, [pane]);
   return scrolls;
 }
-var SplitPane = (0, import_react58.forwardRef)(
+var SplitPane = (0, import_react59.forwardRef)(
   ({
     primary,
     secondary,
@@ -10472,15 +10533,15 @@ var SplitPane = (0, import_react58.forwardRef)(
     }
     const vertical = orientation === "vertical";
     const axis = vertical ? "vertical" : "horizontal";
-    const rootRef = (0, import_react58.useRef)(null);
-    const primaryRef = (0, import_react58.useRef)(null);
-    const secondaryRef = (0, import_react58.useRef)(null);
-    const separatorRef = (0, import_react58.useRef)(null);
+    const rootRef = (0, import_react59.useRef)(null);
+    const primaryRef = (0, import_react59.useRef)(null);
+    const secondaryRef = (0, import_react59.useRef)(null);
+    const separatorRef = (0, import_react59.useRef)(null);
     const ownChild = (selector) => () => Array.from(rootRef.current?.children ?? []).find((child) => child.matches(selector))?.id;
     const primaryId = useHydratedId(ownChild('[data-pane="primary"]'));
     const helpId = useHydratedId(ownChild("[data-oprt-split-help]"));
-    const [internalSize, setInternalSize] = (0, import_react58.useState)(defaultSize);
-    const drag = (0, import_react58.useRef)(null);
+    const [internalSize, setInternalSize] = (0, import_react59.useState)(defaultSize);
+    const drag = (0, import_react59.useRef)(null);
     const lower = clamp(Number.isFinite(minSize) ? minSize : 20, 0, 100);
     const upper = clamp(Number.isFinite(maxSize) ? maxSize : 80, lower, 100);
     const rawSize = size ?? internalSize;
@@ -10489,7 +10550,7 @@ var SplitPane = (0, import_react58.forwardRef)(
     const buttonStep = Math.max(BUTTON_STEP, increment);
     const threshold = Number.isFinite(stackBelow) ? Math.max(0, stackBelow) : 640;
     const setRef2 = useMergedRefs(rootRef, forwardedRef);
-    const isNarrow = (0, import_react58.useCallback)((width) => width < threshold, [threshold]);
+    const isNarrow = (0, import_react59.useCallback)((width) => width < threshold, [threshold]);
     const narrow = useElementWidth(rootRef, {
       initial: false,
       select: isNarrow
@@ -10501,7 +10562,7 @@ var SplitPane = (0, import_react58.forwardRef)(
       track: (element) => element.closest("[data-oprt-split-divider]")?.parentElement === rootRef.current ? true : null,
       findTarget: () => separatorRef.current?.isConnected ? separatorRef.current : primaryRef.current
     });
-    (0, import_react58.useEffect)(() => {
+    (0, import_react59.useEffect)(() => {
       drag.current = null;
     }, [disabled, stacked, orientation]);
     const resize = (next) => {
@@ -10681,7 +10742,7 @@ SplitPane.displayName = "SplitPane";
 // src/TimeRange/TimeRange.tsx
 var import_class_variance_authority26 = require("class-variance-authority");
 var import_clsx42 = __toESM(require("clsx"), 1);
-var import_react59 = require("react");
+var import_react60 = require("react");
 
 // src/_internal/timestamp.ts
 var MAX_TIME = 864e13;
@@ -10751,7 +10812,7 @@ function describeRange(start, end) {
   const sameDay = from.slice(0, 10) === to.slice(0, 10);
   return `${from} to ${sameDay ? to.slice(11) : to}`;
 }
-var TimeRange = (0, import_react59.forwardRef)(
+var TimeRange = (0, import_react60.forwardRef)(
   ({
     value,
     onValueChange,
@@ -10764,7 +10825,7 @@ var TimeRange = (0, import_react59.forwardRef)(
     className,
     ...props
   }, ref) => {
-    const root = (0, import_react59.useRef)(null);
+    const root = (0, import_react60.useRef)(null);
     const setRoot = useMergedRefs(root, ref);
     const ids = usePartIds(
       ["start-date", "start-time", "end-date", "end-time", "error", "range", "status"],
@@ -10772,15 +10833,15 @@ var TimeRange = (0, import_react59.forwardRef)(
     );
     const base = `${value.start}|${value.end}`;
     const applied = draftOf(value);
-    const [draft, setDraft] = (0, import_react59.useState)(() => ({ base, ...applied }));
+    const [draft, setDraft] = (0, import_react60.useState)(() => ({ base, ...applied }));
     const current = draft.base === base ? draft : applied;
     const parsed = { start: parseEndpoint(current.start), end: parseEndpoint(current.end) };
     const error = validate(parsed, min, max);
     const pending = !(unchanged(current.start, parsed.start, applied.start, value.start) && unchanged(current.end, parsed.end, applied.end, value.end));
     const valid = !error && !pending;
-    const callback = (0, import_react59.useRef)(onDraftValidityChange);
+    const callback = (0, import_react60.useRef)(onDraftValidityChange);
     callback.current = onDraftValidityChange;
-    (0, import_react59.useEffect)(() => callback.current?.(valid, { pending }), [valid, pending]);
+    (0, import_react60.useEffect)(() => callback.current?.(valid, { pending }), [valid, pending]);
     const readout = Number.isNaN(parsed.start) || Number.isNaN(parsed.end) ? null : describeRange(parsed.start, parsed.end);
     const unapplied = !error && pending;
     const edit = (part, field, next) => setDraft({ ...current, base, [part]: { ...current[part], [field]: next } });
@@ -10926,7 +10987,7 @@ var TimeRangeManifest = {
 // src/EventTimeline/EventTimeline.tsx
 var import_class_variance_authority27 = require("class-variance-authority");
 var import_clsx43 = __toESM(require("clsx"), 1);
-var import_react60 = require("react");
+var import_react61 = require("react");
 var import_jsx_runtime45 = require("react/jsx-runtime");
 var timelineStyles = (0, import_class_variance_authority27.cva)("flex min-w-0 flex-col gap-2u font-sans text-oprt-text");
 var markStyles = (0, import_class_variance_authority27.cva)("fill-current", {
@@ -10946,7 +11007,7 @@ var eventValid = (event) => isValidTimestamp(event.start) && (event.end === void
 var laneOf = (event) => event.lane || "Events";
 var DEFAULT_WIDTH = 1e3;
 var MIN_WIDTH = 16;
-var Marker2 = (0, import_react60.memo)(function Marker3({ id, severity, x, width, selected }) {
+var Marker2 = (0, import_react61.memo)(function Marker3({ id, severity, x, width, selected }) {
   const classes = (0, import_clsx43.default)(
     markStyles({ severity: severity ?? "neutral" }),
     selected && "stroke-oprt-text"
@@ -10972,7 +11033,7 @@ var Marker2 = (0, import_react60.memo)(function Marker3({ id, severity, x, width
     }
   );
 });
-var TimelineRow = (0, import_react60.memo)(function TimelineRow2({
+var TimelineRow = (0, import_react61.memo)(function TimelineRow2({
   event,
   selected,
   selectable,
@@ -11026,7 +11087,7 @@ var TimelineRow = (0, import_react60.memo)(function TimelineRow2({
     }
   );
 });
-var EventTimeline = (0, import_react60.forwardRef)(
+var EventTimeline = (0, import_react61.forwardRef)(
   ({
     events,
     start,
@@ -11039,21 +11100,21 @@ var EventTimeline = (0, import_react60.forwardRef)(
     className,
     ...props
   }, forwardedRef) => {
-    const id = (0, import_react60.useId)();
-    const rootRef = (0, import_react60.useRef)(null);
+    const id = (0, import_react61.useId)();
+    const rootRef = (0, import_react61.useRef)(null);
     const setRef2 = useMergedRefs(rootRef, forwardedRef);
     const observed = useElementWidth(rootRef, {
       initial: null,
       min: MIN_WIDTH
     });
-    const [firstWidth, setFirstWidth] = (0, import_react60.useState)(null);
+    const [firstWidth, setFirstWidth] = (0, import_react61.useState)(null);
     useIsomorphicLayoutEffect(() => {
       const width = rootRef.current?.getBoundingClientRect().width;
       if (width !== void 0 && Number.isFinite(width) && width > MIN_WIDTH) setFirstWidth(width);
     }, []);
     const plotWidth = observed ?? firstWidth ?? DEFAULT_WIDTH;
     const validRange = isValidTimestamp(start) && isValidTimestamp(end) && start < end;
-    const { visible, omitted, lanes } = (0, import_react60.useMemo)(() => {
+    const { visible, omitted, lanes } = (0, import_react61.useMemo)(() => {
       const validEvents = events.filter(eventValid);
       const inWindow = validRange ? validEvents.filter((event) => event.start <= end && (event.end ?? event.start) >= start).sort((a, b) => a.start - b.start) : [];
       const byLane = /* @__PURE__ */ new Map();
@@ -11065,11 +11126,11 @@ var EventTimeline = (0, import_react60.forwardRef)(
       }
       return { visible: inWindow, omitted: events.length - validEvents.length, lanes: byLane };
     }, [events, start, end, validRange]);
-    const selectionRef = (0, import_react60.useRef)(onSelectionChange);
+    const selectionRef = (0, import_react61.useRef)(onSelectionChange);
     useIsomorphicLayoutEffect(() => {
       selectionRef.current = onSelectionChange;
     });
-    const select = (0, import_react60.useCallback)((eventId) => selectionRef.current?.(eventId), []);
+    const select = (0, import_react61.useCallback)((eventId) => selectionRef.current?.(eventId), []);
     const extent2 = plotWidth - 16;
     const position = (time) => 8 + Math.max(0, Math.min(extent2, (time - start) / (end - start) * extent2));
     return /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(
@@ -11218,7 +11279,7 @@ var EventTimelineManifest = {
 };
 
 // src/AppShell/AppShell.tsx
-var import_react61 = require("react");
+var import_react62 = require("react");
 var import_class_variance_authority28 = require("class-variance-authority");
 var import_clsx44 = __toESM(require("clsx"), 1);
 
@@ -11301,7 +11362,7 @@ var connectionVariants = {
 function connectionVariant(connection) {
   return Object.prototype.hasOwnProperty.call(connectionVariants, connection) ? connectionVariants[connection] : "neutral";
 }
-var AppShell = (0, import_react61.forwardRef)(
+var AppShell = (0, import_react62.forwardRef)(
   ({
     title = "Workspace",
     identity,
@@ -11316,7 +11377,7 @@ var AppShell = (0, import_react61.forwardRef)(
     className,
     ...props
   }, ref) => {
-    const id = (0, import_react61.useId)();
+    const id = (0, import_react62.useId)();
     if (process.env.NODE_ENV !== "production") {
       devValidate("AppShell", AppShellManifest.AppShell.props, { mode, connection });
     }
@@ -11378,14 +11439,14 @@ var AppShell = (0, import_react61.forwardRef)(
 AppShell.displayName = "AppShell";
 
 // src/Inspector/Inspector.tsx
-var import_react62 = require("react");
+var import_react63 = require("react");
 var import_class_variance_authority29 = require("class-variance-authority");
 var import_clsx45 = __toESM(require("clsx"), 1);
 var import_jsx_runtime47 = require("react/jsx-runtime");
 var inspectorStyles = (0, import_class_variance_authority29.cva)(
   "flex min-w-0 flex-col gap-2u break-words border border-oprt-border bg-oprt-surface-1 p-2u font-sans text-oprt-base normal-case text-oprt-text"
 );
-var Inspector = (0, import_react62.forwardRef)(
+var Inspector = (0, import_react63.forwardRef)(
   ({
     open = true,
     title,
@@ -11397,7 +11458,7 @@ var Inspector = (0, import_react62.forwardRef)(
     "aria-describedby": describedBy,
     ...props
   }, ref) => {
-    const root = (0, import_react62.useRef)(null);
+    const root = (0, import_react63.useRef)(null);
     const setRef2 = useMergedRefs(root, ref);
     const ids = usePartIds(["title", "description"], {
       readRendered: () => root.current?.getAttribute("data-oprt-ids")
@@ -11467,7 +11528,7 @@ var InspectorManifest = {
 };
 
 // src/TreeView/TreeView.tsx
-var import_react63 = require("react");
+var import_react64 = require("react");
 var import_react_aria_components20 = require("react-aria-components");
 var import_icons17 = require("@oprt/icons");
 var import_class_variance_authority30 = require("class-variance-authority");
@@ -11496,7 +11557,7 @@ function aimAtLabel(tree, row) {
   row.style.scrollMarginLeft = `${Math.min(0, box.left - left)}px`;
   row.style.scrollMarginRight = `${Math.min(0, right - box.right)}px`;
 }
-var TreeView = (0, import_react63.forwardRef)(
+var TreeView = (0, import_react64.forwardRef)(
   ({
     items,
     label = "Navigation",
@@ -11510,12 +11571,12 @@ var TreeView = (0, import_react63.forwardRef)(
     className,
     ...attributes
   }, ref) => {
-    const [localSelection, setLocalSelection] = (0, import_react63.useState)(null);
-    const [localExpanded, setLocalExpanded] = (0, import_react63.useState)(defaultExpandedIds);
+    const [localSelection, setLocalSelection] = (0, import_react64.useState)(null);
+    const [localExpanded, setLocalExpanded] = (0, import_react64.useState)(defaultExpandedIds);
     const selection = selectedId === void 0 ? localSelection : selectedId;
-    const treeRef = (0, import_react63.useRef)(null);
+    const treeRef = (0, import_react64.useRef)(null);
     const setRef2 = useMergedRefs(treeRef, ref);
-    (0, import_react63.useEffect)(() => {
+    (0, import_react64.useEffect)(() => {
       const tree = treeRef.current;
       if (!tree) return;
       const aim = (event) => {
@@ -11640,14 +11701,14 @@ var TreeViewManifest = {
 };
 
 // src/OperationalStatus/OperationalStatus.tsx
-var import_react65 = require("react");
+var import_react66 = require("react");
 var import_class_variance_authority32 = require("class-variance-authority");
 var import_clsx48 = __toESM(require("clsx"), 1);
 
 // src/DescriptionList/DescriptionList.tsx
 var import_class_variance_authority31 = require("class-variance-authority");
 var import_clsx47 = __toESM(require("clsx"), 1);
-var import_react64 = require("react");
+var import_react65 = require("react");
 
 // src/DescriptionList/DescriptionList.manifest.ts
 var DescriptionListManifest = {
@@ -11728,13 +11789,13 @@ var valueStyles2 = (0, import_class_variance_authority31.cva)(
   }
 );
 var isMissing = (value) => value === null || value === void 0 || value === "";
-var DescriptionList = (0, import_react64.forwardRef)(
+var DescriptionList = (0, import_react65.forwardRef)(
   ({ items, layout = "stacked", className, ...props }, ref) => {
     if (process.env.NODE_ENV !== "production") {
       devValidate("DescriptionList", DescriptionListManifest.DescriptionList.props, { layout });
     }
-    const reported3 = (0, import_react64.useRef)(/* @__PURE__ */ new Set());
-    (0, import_react64.useEffect)(() => {
+    const reported3 = (0, import_react65.useRef)(/* @__PURE__ */ new Set());
+    (0, import_react65.useEffect)(() => {
       if (process.env.NODE_ENV === "production") return;
       const fresh = items.filter(({ id, value }) => isMissing(value) && !reported3.current.has(id)).map(({ id }) => id);
       if (fresh.length === 0) return;
@@ -11819,10 +11880,10 @@ var variants = {
   unavailable: "error",
   unknown: "neutral"
 };
-var OperationalStatus = (0, import_react65.forwardRef)(
+var OperationalStatus = (0, import_react66.forwardRef)(
   (allProps, ref) => {
     const { state = "unknown", source, updatedAt, detail, className, ...props } = allProps;
-    const qualityId = `${(0, import_react65.useId)()}-quality`;
+    const qualityId = `${(0, import_react66.useId)()}-quality`;
     if (process.env.NODE_ENV !== "production") {
       devValidate("OperationalStatus", OperationalStatusManifest.OperationalStatus.props, {
         ...allProps
@@ -11885,15 +11946,15 @@ var OperationalStatus = (0, import_react65.forwardRef)(
 OperationalStatus.displayName = "OperationalStatus";
 
 // src/ActionStatus/ActionStatus.tsx
-var import_react67 = require("react");
+var import_react68 = require("react");
 var import_class_variance_authority33 = require("class-variance-authority");
 var import_clsx49 = __toESM(require("clsx"), 1);
 
 // src/_internal/useActionFocus.ts
-var import_react66 = require("react");
+var import_react67 = require("react");
 function useActionFocus(ref, { onFocusCapture, onBlurCapture } = {}) {
-  const root = (0, import_react66.useRef)(null);
-  (0, import_react66.useImperativeHandle)(ref, () => root.current, []);
+  const root = (0, import_react67.useRef)(null);
+  (0, import_react67.useImperativeHandle)(ref, () => root.current, []);
   const restore = useRestoreFocusOnRemoval(root);
   return {
     ref: root,
@@ -12026,7 +12087,7 @@ function ActionStatusLine({
     }
   );
 }
-var ActionStatus = (0, import_react67.forwardRef)((allProps, ref) => {
+var ActionStatus = (0, import_react68.forwardRef)((allProps, ref) => {
   const {
     state,
     label,
@@ -12072,7 +12133,7 @@ var ActionStatus = (0, import_react67.forwardRef)((allProps, ref) => {
 ActionStatus.displayName = "ActionStatus";
 
 // src/MultiSelect/MultiSelect.tsx
-var import_react68 = require("react");
+var import_react69 = require("react");
 var import_class_variance_authority34 = require("class-variance-authority");
 var import_clsx50 = __toESM(require("clsx"), 1);
 var import_icons18 = require("@oprt/icons");
@@ -12081,7 +12142,7 @@ var styles = (0, import_class_variance_authority34.cva)("m-0 min-w-0 border p-2u
   variants: { invalid: { true: "border-oprt-error", false: "border-oprt-border" } },
   defaultVariants: { invalid: false }
 });
-var MultiSelect = (0, import_react68.forwardRef)(
+var MultiSelect = (0, import_react69.forwardRef)(
   ({
     label,
     options,
@@ -12096,12 +12157,12 @@ var MultiSelect = (0, import_react68.forwardRef)(
     "aria-describedby": describedBy,
     ...props
   }, ref) => {
-    const fieldset = (0, import_react68.useRef)(null);
+    const fieldset = (0, import_react69.useRef)(null);
     const fieldsetRef = useMergedRefs(fieldset, ref);
     const ids = usePartIds(["description", "error"], {
       readRendered: () => fieldset.current?.getAttribute("data-oprt-ids")
     });
-    const [local, setLocal] = (0, import_react68.useState)(defaultValue);
+    const [local, setLocal] = (0, import_react69.useState)(defaultValue);
     const selected = value ?? local;
     const descriptions = joinIds(describedBy, description && ids.description, error && ids.error);
     return /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(
@@ -12228,7 +12289,7 @@ var MultiSelectManifest = {
 };
 
 // src/NumberInput/NumberInput.tsx
-var import_react69 = require("react");
+var import_react70 = require("react");
 var import_class_variance_authority35 = require("class-variance-authority");
 var import_clsx51 = __toESM(require("clsx"), 1);
 
@@ -12334,7 +12395,7 @@ function validate2(text, unit, min, max, step, required) {
 function plainDecimal(value) {
   return value.toLocaleString("en-US", { useGrouping: false, maximumFractionDigits: 20 });
 }
-var NumberInput = (0, import_react69.forwardRef)((allProps, ref) => {
+var NumberInput = (0, import_react70.forwardRef)((allProps, ref) => {
   const {
     label,
     unit,
@@ -12361,22 +12422,22 @@ var NumberInput = (0, import_react69.forwardRef)((allProps, ref) => {
   if (process.env.NODE_ENV !== "production") {
     devValidate("NumberInput", NumberInputManifest.NumberInput.props, { ...allProps });
   }
-  const labelRef = (0, import_react69.useRef)(null);
+  const labelRef = (0, import_react70.useRef)(null);
   const ids = usePartIds(["unit", "description", "error", "unknown"], {
     id,
     readRendered: () => labelRef.current?.htmlFor
   });
   const inputId = ids.base;
-  const inputRef = (0, import_react69.useRef)(null);
+  const inputRef = (0, import_react70.useRef)(null);
   const mergedRef = useMergedRefs(inputRef, ref);
-  const [local, setLocal] = (0, import_react69.useState)(defaultValue);
+  const [local, setLocal] = (0, import_react70.useState)(defaultValue);
   const numeric = value === void 0 ? local : value;
-  const [draft, setDraft] = (0, import_react69.useState)(null);
+  const [draft, setDraft] = (0, import_react70.useState)(null);
   const text = draft && Object.is(draft.base, numeric) ? draft.text : numeric === null ? "" : String(numeric);
   const validation = error || validate2(text, unit, min, max, step, required);
-  const validationRef = (0, import_react69.useRef)(onValidationChange);
+  const validationRef = (0, import_react70.useRef)(onValidationChange);
   validationRef.current = onValidationChange;
-  (0, import_react69.useEffect)(() => {
+  (0, import_react70.useEffect)(() => {
     inputRef.current?.setCustomValidity(validation ?? "");
     validationRef.current?.(validation ?? null);
   }, [validation]);
@@ -12485,11 +12546,11 @@ var NumberInput = (0, import_react69.forwardRef)((allProps, ref) => {
 NumberInput.displayName = "NumberInput";
 
 // src/CoordinateInput/CoordinateInput.tsx
-var import_react70 = require("react");
+var import_react71 = require("react");
 var import_clsx52 = __toESM(require("clsx"), 1);
 var import_jsx_runtime54 = require("react/jsx-runtime");
 var unknown = { latitude: null, longitude: null };
-var CoordinateInput = (0, import_react70.forwardRef)(
+var CoordinateInput = (0, import_react71.forwardRef)(
   ({
     label = "Coordinates",
     value,
@@ -12505,18 +12566,18 @@ var CoordinateInput = (0, import_react70.forwardRef)(
     "aria-describedby": describedBy,
     ...props
   }, ref) => {
-    const fieldset = (0, import_react70.useRef)(null);
+    const fieldset = (0, import_react71.useRef)(null);
     const fieldsetRef = useMergedRefs(fieldset, ref);
     const ids = usePartIds(["status", "description", "error"], {
       readRendered: () => fieldset.current?.getAttribute("data-oprt-ids")
     });
-    const [local, setLocal] = (0, import_react70.useState)(defaultValue);
-    const [invalidAxes, setInvalidAxes] = (0, import_react70.useState)({ latitude: false, longitude: false });
+    const [local, setLocal] = (0, import_react71.useState)(defaultValue);
+    const [invalidAxes, setInvalidAxes] = (0, import_react71.useState)({ latitude: false, longitude: false });
     const position = value ?? local;
     const invalid = Boolean(error) || invalidAxes.latitude || invalidAxes.longitude || position.latitude !== null && (!Number.isFinite(position.latitude) || Math.abs(position.latitude) > 90) || position.longitude !== null && (!Number.isFinite(position.longitude) || Math.abs(position.longitude) > 180);
-    const validationRef = (0, import_react70.useRef)(onValidationChange);
+    const validationRef = (0, import_react71.useRef)(onValidationChange);
     validationRef.current = onValidationChange;
-    (0, import_react70.useEffect)(() => {
+    (0, import_react71.useEffect)(() => {
       validationRef.current?.(invalid);
     }, [invalid]);
     const status = invalid ? "Position invalid" : position.latitude === null || position.longitude === null ? "Position unknown" : "Decimal degrees";
@@ -12655,7 +12716,7 @@ var CoordinateInputManifest = {
 // src/Link/Link.tsx
 var import_class_variance_authority36 = require("class-variance-authority");
 var import_clsx53 = __toESM(require("clsx"), 1);
-var import_react71 = require("react");
+var import_react72 = require("react");
 var import_jsx_runtime55 = require("react/jsx-runtime");
 var linkStyles = (0, import_class_variance_authority36.cva)(
   "min-h-oprt-sm min-w-oprt-sm border border-transparent py-[calc((var(--oprt-height-sm)-2px-var(--oprt-line-base))/2)] box-decoration-clone font-sans text-oprt-base font-medium text-oprt-accent underline underline-offset-2 oprt-wrap-anywhere [&_svg]:inline-block hover:text-oprt-accent-hover aria-disabled:text-[color:inherit] aria-disabled:hover:text-[color:inherit] aria-disabled:no-underline aria-disabled:cursor-default focus-visible:outline-hidden focus-visible:border-oprt-border-focus focus-visible:shadow-oprt-focus forced-colors:focus-visible:outline-solid forced-colors:focus-visible:outline-2 forced-colors:focus-visible:outline-[CanvasText]",
@@ -12668,11 +12729,11 @@ var linkStyles = (0, import_class_variance_authority36.cva)(
   }
 );
 function isIconOnly(children) {
-  const parts = import_react71.Children.toArray(children).filter(
+  const parts = import_react72.Children.toArray(children).filter(
     (part) => !(typeof part === "string" && part.trim() === "")
   );
   const [only] = parts;
-  if (parts.length !== 1 || !(0, import_react71.isValidElement)(only)) return false;
+  if (parts.length !== 1 || !(0, import_react72.isValidElement)(only)) return false;
   const hidden = only.props["aria-hidden"];
   return only.type === "svg" || hidden === true || hidden === "true" || typeof only.type !== "string" && only.props.children == null;
 }
@@ -12709,7 +12770,7 @@ function reportUnsafeHref(destination) {
     )
   );
 }
-var Link = (0, import_react71.forwardRef)(
+var Link = (0, import_react72.forwardRef)(
   ({ className, href, children, ...props }, ref) => {
     const safe = typeof href !== "string" || isSafeHref(href, props.download !== void 0 && props.download !== false);
     if (!safe) reportUnsafeHref(href);
@@ -12763,7 +12824,7 @@ var LinkManifest = {
 };
 
 // src/CopyButton/CopyButton.tsx
-var import_react73 = require("react");
+var import_react74 = require("react");
 var import_class_variance_authority37 = require("class-variance-authority");
 var import_icons19 = require("@oprt/icons");
 
@@ -12801,16 +12862,16 @@ var CopyButtonManifest = {
 };
 
 // src/_internal/useIsMounted.ts
-var import_react72 = require("react");
+var import_react73 = require("react");
 function useIsMounted() {
-  const mounted = (0, import_react72.useRef)(false);
+  const mounted = (0, import_react73.useRef)(false);
   useIsomorphicLayoutEffect(() => {
     mounted.current = true;
     return () => {
       mounted.current = false;
     };
   }, []);
-  return (0, import_react72.useCallback)(() => mounted.current, []);
+  return (0, import_react73.useCallback)(() => mounted.current, []);
 }
 
 // src/CopyButton/CopyButton.tsx
@@ -12844,14 +12905,14 @@ function reportLabelWithoutVisibleText(label) {
     )
   );
 }
-var CopyButton = (0, import_react73.forwardRef)((allProps, ref) => {
+var CopyButton = (0, import_react74.forwardRef)((allProps, ref) => {
   const { value, label, onCopy, onCopyError, disabled = false, size = "md", className } = allProps;
-  const [pending, setPending] = (0, import_react73.useState)(false);
+  const [pending, setPending] = (0, import_react74.useState)(false);
   if (!/copy/i.test(label)) reportLabelWithoutVisibleText(label);
-  const [feedback, setFeedback] = (0, import_react73.useState)(null);
-  const pendingRef = (0, import_react73.useRef)(false);
+  const [feedback, setFeedback] = (0, import_react74.useState)(null);
+  const pendingRef = (0, import_react74.useRef)(false);
   const isMounted = useIsMounted();
-  const context = (0, import_react73.useRef)({ value, label, revision: 0 });
+  const context = (0, import_react74.useRef)({ value, label, revision: 0 });
   if (process.env.NODE_ENV !== "production") {
     devValidate("CopyButton", CopyButtonManifest.CopyButton.props, { ...allProps });
   }
@@ -12932,7 +12993,7 @@ CopyButton.displayName = "CopyButton";
 
 // src/Popover/Popover.tsx
 var import_react_aria_components21 = require("react-aria-components");
-var import_react74 = require("react");
+var import_react75 = require("react");
 var import_class_variance_authority38 = require("class-variance-authority");
 var import_clsx54 = __toESM(require("clsx"), 1);
 
@@ -12996,7 +13057,7 @@ function topSurface() {
   );
   return surfaces[surfaces.length - 1];
 }
-var Popover2 = (0, import_react74.forwardRef)(
+var Popover2 = (0, import_react75.forwardRef)(
   ({
     children,
     content,
@@ -13016,38 +13077,38 @@ var Popover2 = (0, import_react74.forwardRef)(
     id: suppliedId,
     ...dialogProps
   }, ref) => {
-    const [localOpen, setLocalOpen] = (0, import_react74.useState)(defaultOpen);
+    const [localOpen, setLocalOpen] = (0, import_react75.useState)(defaultOpen);
     const isOpen = open ?? localOpen;
-    const [positioning, setPositioning] = (0, import_react74.useState)(true);
-    const [tooltipOpen, setTooltipOpen] = (0, import_react74.useState)(false);
+    const [positioning, setPositioning] = (0, import_react75.useState)(true);
+    const [tooltipOpen, setTooltipOpen] = (0, import_react75.useState)(false);
     const motionState = useMotion(motion);
     if (process.env.NODE_ENV !== "production") {
       devValidate("Popover", PopoverManifest.Popover.props, { ...dialogProps, side, align });
     }
-    const generatedId = (0, import_react74.useId)();
+    const generatedId = (0, import_react75.useId)();
     const id = suppliedId ?? `oprt-popover-${generatedId}`;
-    const trigger = (0, import_react74.useRef)(null);
-    const lastTrigger = (0, import_react74.useRef)(null);
-    const dialog = (0, import_react74.useRef)(null);
-    const lastDialog = (0, import_react74.useRef)(null);
-    const wasOpen = (0, import_react74.useRef)(false);
-    const focusFrame = (0, import_react74.useRef)(void 0);
-    const focusScrollClose = (0, import_react74.useRef)(false);
-    const current = (0, import_react74.useRef)({ isOpen, onCloseAutoFocus, returnFocusRef });
+    const trigger = (0, import_react75.useRef)(null);
+    const lastTrigger = (0, import_react75.useRef)(null);
+    const dialog = (0, import_react75.useRef)(null);
+    const lastDialog = (0, import_react75.useRef)(null);
+    const wasOpen = (0, import_react75.useRef)(false);
+    const focusFrame = (0, import_react75.useRef)(void 0);
+    const focusScrollClose = (0, import_react75.useRef)(false);
+    const current = (0, import_react75.useRef)({ isOpen, onCloseAutoFocus, returnFocusRef });
     current.current = { isOpen, onCloseAutoFocus, returnFocusRef };
     const triggerChild = children;
-    const childRef = parseInt(import_react74.version, 10) < 19 ? triggerChild.ref : triggerChild.props.ref;
-    const rememberTrigger = (0, import_react74.useCallback)((node) => {
+    const childRef = parseInt(import_react75.version, 10) < 19 ? triggerChild.ref : triggerChild.props.ref;
+    const rememberTrigger = (0, import_react75.useCallback)((node) => {
       trigger.current = node;
       if (node) lastTrigger.current = node;
     }, []);
     const setTrigger = useMergedRefs(rememberTrigger, childRef);
-    const rememberDialog = (0, import_react74.useCallback)((node) => {
+    const rememberDialog = (0, import_react75.useCallback)((node) => {
       dialog.current = node;
       if (node) lastDialog.current = node;
     }, []);
     const setDialog = useMergedRefs(rememberDialog, ref);
-    const restoreFocus = (0, import_react74.useCallback)(() => {
+    const restoreFocus = (0, import_react75.useCallback)(() => {
       const event = new Event("popovercloseautofocus", { cancelable: true });
       current.current.onCloseAutoFocus?.(event);
       if (event.defaultPrevented) return;
@@ -13062,7 +13123,7 @@ var Popover2 = (0, import_react74.forwardRef)(
         if (target?.isConnected) target.focus({ preventScroll: true });
       });
     }, []);
-    (0, import_react74.useEffect)(() => {
+    (0, import_react75.useEffect)(() => {
       if (isOpen && !wasOpen.current) {
         if (focusFrame.current !== void 0) cancelAnimationFrame(focusFrame.current);
         setTooltipOpen(false);
@@ -13071,13 +13132,13 @@ var Popover2 = (0, import_react74.forwardRef)(
       if (!isOpen && wasOpen.current) restoreFocus();
       wasOpen.current = isOpen;
     }, [isOpen, restoreFocus]);
-    (0, import_react74.useEffect)(
+    (0, import_react75.useEffect)(
       () => () => {
         if (wasOpen.current && !dialog.current?.isConnected) restoreFocus();
       },
       [restoreFocus]
     );
-    const requestOpen = (0, import_react74.useCallback)(
+    const requestOpen = (0, import_react75.useCallback)(
       (next) => {
         if (next && disabled) return;
         if (!next && focusScrollClose.current) return;
@@ -13145,7 +13206,7 @@ var Popover2 = (0, import_react74.forwardRef)(
           window.removeEventListener(event, interact, true);
       };
     }, [isOpen]);
-    (0, import_react74.useEffect)(() => {
+    (0, import_react75.useEffect)(() => {
       if (!isOpen) return;
       let startedOutside = false;
       const start = (event) => {
@@ -13172,7 +13233,7 @@ var Popover2 = (0, import_react74.forwardRef)(
         document.removeEventListener("pointercancel", cancel, true);
       };
     }, [isOpen, requestOpen]);
-    const triggerElement = (0, import_react74.cloneElement)(triggerChild, {
+    const triggerElement = (0, import_react75.cloneElement)(triggerChild, {
       ref: setTrigger,
       disabled: disabled || triggerChild.props.disabled,
       "aria-disabled": disabled || triggerChild.props["aria-disabled"],
@@ -13262,16 +13323,16 @@ var Popover2 = (0, import_react74.forwardRef)(
 Popover2.displayName = "Popover";
 
 // src/EntityPreview/EntityPreview.tsx
-var import_react75 = require("react");
+var import_react76 = require("react");
 var import_class_variance_authority39 = require("class-variance-authority");
 var import_clsx55 = __toESM(require("clsx"), 1);
 var import_jsx_runtime58 = require("react/jsx-runtime");
 var previewStyles = (0, import_class_variance_authority39.cva)(
   "flex min-w-0 flex-col gap-2u font-sans text-oprt-base normal-case tracking-normal text-oprt-text"
 );
-var EntityPreview = (0, import_react75.forwardRef)(
+var EntityPreview = (0, import_react76.forwardRef)(
   ({ entity, media, actions: actions2, headingLevel = 3, className, ...props }, ref) => {
-    const instanceId = (0, import_react75.useId)();
+    const instanceId = (0, import_react76.useId)();
     const headingId = `${instanceId}-name`;
     const conditionId = `${instanceId}-condition`;
     const Heading5 = `h${headingLevel}`;
@@ -13376,16 +13437,16 @@ var EntityPreviewManifest = {
 };
 
 // src/FormSection/FormSection.tsx
-var import_react76 = require("react");
+var import_react77 = require("react");
 var import_class_variance_authority40 = require("class-variance-authority");
 var import_clsx56 = __toESM(require("clsx"), 1);
 var import_jsx_runtime59 = require("react/jsx-runtime");
 var sectionStyles = (0, import_class_variance_authority40.cva)(
   "m-0 min-w-0 border border-oprt-border bg-oprt-surface-1 p-3u font-sans text-oprt-base normal-case tracking-normal text-oprt-text"
 );
-var FormSection = (0, import_react76.forwardRef)(
+var FormSection = (0, import_react77.forwardRef)(
   ({ legend, description, children, className, "aria-describedby": describedBy, ...props }, ref) => {
-    const root = (0, import_react76.useRef)(null);
+    const root = (0, import_react77.useRef)(null);
     const mergedRef = useMergedRefs(root, ref);
     const ids = usePartIds(["description"], {
       id: props.id,
@@ -13449,7 +13510,7 @@ var FormSectionManifest = {
 };
 
 // src/FormErrorSummary/FormErrorSummary.tsx
-var import_react77 = require("react");
+var import_react78 = require("react");
 var import_class_variance_authority41 = require("class-variance-authority");
 var import_clsx57 = __toESM(require("clsx"), 1);
 var import_jsx_runtime60 = require("react/jsx-runtime");
@@ -13459,7 +13520,7 @@ var summaryStyles = (0, import_class_variance_authority41.cva)(
 var errorStyles = (0, import_class_variance_authority41.cva)(
   "inline-flex min-h-3u min-w-3u max-w-full items-center border border-transparent px-1u py-0.5u text-left text-oprt-base font-medium normal-case tracking-normal text-oprt-text underline underline-offset-2 hover:text-oprt-accent outline-hidden focus-visible:border-oprt-border-focus focus-visible:shadow-oprt-focus oprt-wrap-anywhere"
 );
-var FormErrorSummary = (0, import_react77.forwardRef)(
+var FormErrorSummary = (0, import_react78.forwardRef)(
   ({
     errors,
     title = "Check these fields",
@@ -13469,7 +13530,7 @@ var FormErrorSummary = (0, import_react77.forwardRef)(
     "aria-labelledby": labelledBy,
     ...props
   }, ref) => {
-    const root = (0, import_react77.useRef)(null);
+    const root = (0, import_react78.useRef)(null);
     const mergedRef = useMergedRefs(root, ref);
     const ids = usePartIds(["title"], {
       id: props.id,
@@ -13540,7 +13601,7 @@ var FormErrorSummaryManifest = {
 };
 
 // src/Calendar/Calendar.tsx
-var import_react78 = require("react");
+var import_react79 = require("react");
 var import_date2 = require("@internationalized/date");
 var import_react_aria_components22 = require("react-aria-components");
 var import_class_variance_authority42 = require("class-variance-authority");
@@ -13726,7 +13787,7 @@ function CalendarContent() {
     ] })
   ] });
 }
-var Calendar2 = (0, import_react78.forwardRef)(
+var Calendar2 = (0, import_react79.forwardRef)(
   ({
     label,
     value,
@@ -13739,10 +13800,10 @@ var Calendar2 = (0, import_react78.forwardRef)(
     id,
     className
   }, ref) => {
-    const generated = (0, import_react78.useId)();
+    const generated = (0, import_react79.useId)();
     const errorId = `${id ?? generated}-error`;
     const hydration = useHydrationRoot(id);
-    const config = (0, import_react78.useMemo)(() => dateConfiguration(value, min, max), [value, min, max]);
+    const config = (0, import_react79.useMemo)(() => dateConfiguration(value, min, max), [value, min, max]);
     const error = config.error ?? (required && value === null ? "A date is required." : null);
     return (
       // The key remounts the error with the calendar, so both take the client's ids when hydration
@@ -13817,7 +13878,7 @@ var CalendarManifest = {
 };
 
 // src/DatePicker/DatePicker.tsx
-var import_react80 = require("react");
+var import_react81 = require("react");
 var import_react_aria_components23 = require("react-aria-components");
 var import_date4 = require("@internationalized/date");
 var import_icons21 = require("@oprt/icons");
@@ -13825,12 +13886,12 @@ var import_class_variance_authority43 = require("class-variance-authority");
 var import_clsx59 = __toESM(require("clsx"), 1);
 
 // src/_internal/segmentField.ts
-var import_react79 = require("react");
+var import_react80 = require("react");
 function sameSnapshot(a, b) {
   return a.value === b.value && a.empty === b.empty && a.valid === b.valid;
 }
 function useReportSegments(segments2, read, report2) {
-  const last = (0, import_react79.useRef)(null);
+  const last = (0, import_react80.useRef)(null);
   useIsomorphicLayoutEffect(() => {
     const snapshot = read(segments2);
     const previous = last.current;
@@ -13877,11 +13938,11 @@ function useSegmentDraft({
     rejected: false,
     rejection: null
   };
-  const [draft, setDraft] = (0, import_react79.useState)(initial);
+  const [draft, setDraft] = (0, import_react80.useState)(initial);
   const current = draft.base === value ? draft : initial;
-  const raw = (0, import_react79.useRef)(current.snapshot);
-  const rejectBlur = (0, import_react79.useRef)(false);
-  const report2 = (0, import_react79.useCallback)(
+  const raw = (0, import_react80.useRef)(current.snapshot);
+  const rejectBlur = (0, import_react80.useRef)(false);
+  const report2 = (0, import_react80.useCallback)(
     (snapshot) => {
       raw.current = snapshot;
       setDraft(
@@ -13928,7 +13989,7 @@ function useSegmentDraft({
     accept: () => setDraft((previous) => ({ ...previous, rejected: false, rejection: null }))
   };
 }
-var SegmentGroupContext = (0, import_react79.createContext)(null);
+var SegmentGroupContext = (0, import_react80.createContext)(null);
 
 // src/DatePicker/DatePicker.tsx
 var import_jsx_runtime62 = require("react/jsx-runtime");
@@ -13937,11 +13998,11 @@ function ObservedYear({
   segment,
   report: report2
 }) {
-  const state = (0, import_react80.useContext)(import_react_aria_components23.DateFieldStateContext);
+  const state = (0, import_react81.useContext)(import_react_aria_components23.DateFieldStateContext);
   useReportSegments(state.segments, readDateSegments, report2);
   return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_react_aria_components23.DateSegment, { segment, className: SEGMENT_STYLES });
 }
-var DatePicker = (0, import_react80.forwardRef)(
+var DatePicker = (0, import_react81.forwardRef)(
   ({
     label,
     value,
@@ -13956,19 +14017,19 @@ var DatePicker = (0, import_react80.forwardRef)(
     className,
     motion = "auto"
   }, ref) => {
-    const generated = (0, import_react80.useId)();
+    const generated = (0, import_react81.useId)();
     const inputId = id ?? `oprt-date-${generated}`;
     const hydration = useHydrationRoot(inputId);
     const { locale } = (0, import_react_aria_components23.useLocale)();
-    const gregorianLocale = (0, import_react80.useMemo)(
+    const gregorianLocale = (0, import_react81.useMemo)(
       () => new Intl.Locale(locale, { calendar: "gregory" }).toString(),
       [locale]
     );
-    const config = (0, import_react80.useMemo)(() => dateConfiguration(value, min, max), [value, min, max]);
+    const config = (0, import_react81.useMemo)(() => dateConfiguration(value, min, max), [value, min, max]);
     const displayedValue = config.date?.toString() ?? null;
     const motionState = useMotion(motion);
-    const calendarButton = (0, import_react80.useRef)(null);
-    const group = (0, import_react80.useContext)(SegmentGroupContext);
+    const calendarButton = (0, import_react81.useRef)(null);
+    const group = (0, import_react81.useContext)(SegmentGroupContext);
     const calendarMin = parseDateOnly(group?.calendar?.min);
     const calendarMax = parseDateOnly(group?.calendar?.max);
     const minValue = calendarMin && calendarMin.compare(config.min) > 0 ? calendarMin : config.min;
@@ -13985,10 +14046,10 @@ var DatePicker = (0, import_react80.forwardRef)(
       // The bound an edit crossed, named as for a supplied value (DatePicker-R6).
       draft.rejection ?? "Enter a complete, valid date within the allowed bounds."
     ) : null);
-    const validityCallback = (0, import_react80.useRef)(onDraftValidityChange);
+    const validityCallback = (0, import_react81.useRef)(onDraftValidityChange);
     validityCallback.current = onDraftValidityChange;
     const pending = draft.pending;
-    (0, import_react80.useEffect)(() => validityCallback.current?.(!error, { pending }), [error, pending]);
+    (0, import_react81.useEffect)(() => validityCallback.current?.(!error, { pending }), [error, pending]);
     return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_react_aria_components23.I18nProvider, { locale: gregorianLocale, children: /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(
       import_react_aria_components23.DatePicker,
       {
@@ -14113,7 +14174,7 @@ var DatePickerManifest = {
 };
 
 // src/InlineEdit/InlineEdit.tsx
-var import_react81 = require("react");
+var import_react82 = require("react");
 var import_class_variance_authority44 = require("class-variance-authority");
 var import_clsx60 = __toESM(require("clsx"), 1);
 var import_jsx_runtime63 = require("react/jsx-runtime");
@@ -14124,35 +14185,35 @@ function matchesAttempt(attempt, value, label) {
   const acceptedReplacement = value === attempt.submitted && value !== attempt.session.baseline;
   return (label === attempt.session.label || acceptedReplacement) && (value === attempt.session.baseline || value === attempt.submitted);
 }
-var InlineEdit = (0, import_react81.forwardRef)(
+var InlineEdit = (0, import_react82.forwardRef)(
   ({ label, value, onSave, disabled = false, readOnly = false, validate: validate3, className, ...props }, ref) => {
-    const [editing, setEditing] = (0, import_react81.useState)(false);
-    const [draft, setDraft] = (0, import_react81.useState)(value);
-    const [error, setError] = (0, import_react81.useState)(null);
-    const [pending, setPending] = (0, import_react81.useState)(false);
-    const [multiline, setMultiline] = (0, import_react81.useState)(false);
-    const [returnFocus, setReturnFocus] = (0, import_react81.useState)(null);
-    const [changedTo, setChangedTo] = (0, import_react81.useState)(null);
-    const rootRef = (0, import_react81.useRef)(null);
+    const [editing, setEditing] = (0, import_react82.useState)(false);
+    const [draft, setDraft] = (0, import_react82.useState)(value);
+    const [error, setError] = (0, import_react82.useState)(null);
+    const [pending, setPending] = (0, import_react82.useState)(false);
+    const [multiline, setMultiline] = (0, import_react82.useState)(false);
+    const [returnFocus, setReturnFocus] = (0, import_react82.useState)(null);
+    const [changedTo, setChangedTo] = (0, import_react82.useState)(null);
+    const rootRef = (0, import_react82.useRef)(null);
     const mergedRef = useMergedRefs(rootRef, ref);
-    const inputRef = (0, import_react81.useRef)(null);
-    const editRef = (0, import_react81.useRef)(null);
-    const refocusInput = (0, import_react81.useRef)(false);
-    const session = (0, import_react81.useRef)(null);
-    const request = (0, import_react81.useRef)(null);
-    const composing = (0, import_react81.useRef)(false);
+    const inputRef = (0, import_react82.useRef)(null);
+    const editRef = (0, import_react82.useRef)(null);
+    const refocusInput = (0, import_react82.useRef)(false);
+    const session = (0, import_react82.useRef)(null);
+    const request = (0, import_react82.useRef)(null);
+    const composing = (0, import_react82.useRef)(false);
     const isMounted = useIsMounted();
-    const latest = (0, import_react81.useRef)({ label, value, disabled, readOnly });
+    const latest = (0, import_react82.useRef)({ label, value, disabled, readOnly });
     latest.current = { label, value, disabled, readOnly };
     const ids = usePartIds(["error", "changed"]);
-    (0, import_react81.useEffect)(
+    (0, import_react82.useEffect)(
       () => () => {
         session.current = null;
         request.current = null;
       },
       []
     );
-    (0, import_react81.useEffect)(() => {
+    (0, import_react82.useEffect)(() => {
       const current = session.current;
       if (!current) return;
       const attempt = request.current;
@@ -14170,17 +14231,17 @@ var InlineEdit = (0, import_react81.forwardRef)(
       session.current = { baseline: value, label };
       if (current.baseline !== value) setChangedTo(value);
     }, [value, label, disabled, readOnly]);
-    (0, import_react81.useEffect)(() => {
+    (0, import_react82.useEffect)(() => {
       if (editing) inputRef.current?.focus();
     }, [editing]);
-    (0, import_react81.useEffect)(() => {
+    (0, import_react82.useEffect)(() => {
       if (pending || !refocusInput.current) return;
       refocusInput.current = false;
       const active = document.activeElement;
       if (active === null || active === document.body || rootRef.current?.contains(active))
         inputRef.current?.focus();
     }, [pending]);
-    (0, import_react81.useEffect)(() => {
+    (0, import_react82.useEffect)(() => {
       if (!returnFocus || editing) return;
       if (!disabled && !readOnly && matchesAttempt(returnFocus, value, label))
         editRef.current?.focus();
@@ -14402,7 +14463,7 @@ var InlineEditManifest = {
 };
 
 // src/ContextMenu/ContextMenu.tsx
-var import_react82 = require("react");
+var import_react83 = require("react");
 var import_react_aria_components24 = require("react-aria-components");
 var import_react_aria6 = require("react-aria");
 var import_class_variance_authority45 = require("class-variance-authority");
@@ -14421,7 +14482,7 @@ function ContextSurface({
   disabled,
   children
 }) {
-  const surfaceRef = (0, import_react82.useRef)(null);
+  const surfaceRef = (0, import_react83.useRef)(null);
   const { pressProps } = (0, import_react_aria6.usePress)({ ref: surfaceRef, isDisabled: disabled });
   return /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
     "div",
@@ -14458,7 +14519,7 @@ function ContextSurface({
     }
   );
 }
-var ContextMenu = (0, import_react82.forwardRef)(
+var ContextMenu = (0, import_react83.forwardRef)(
   ({
     label,
     items,
@@ -14469,10 +14530,10 @@ var ContextMenu = (0, import_react82.forwardRef)(
     className,
     ...props
   }, ref) => {
-    const [open, setOpen] = (0, import_react82.useState)(null);
+    const [open, setOpen] = (0, import_react83.useState)(null);
     const hydration = useHydrationRoot();
     const motionState = useMotion("auto", "ContextMenu");
-    (0, import_react82.useEffect)(() => {
+    (0, import_react83.useEffect)(() => {
       if (disabled) setOpen(null);
     }, [disabled]);
     const menu = () => /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
@@ -14608,18 +14669,18 @@ var ContextMenuManifest = {
 };
 
 // src/TimeField/TimeField.tsx
-var import_react83 = require("react");
+var import_react84 = require("react");
 var import_react_aria_components25 = require("react-aria-components");
 var import_class_variance_authority46 = require("class-variance-authority");
 var import_clsx62 = __toESM(require("clsx"), 1);
 var import_jsx_runtime65 = require("react/jsx-runtime");
 var fieldStyles3 = (0, import_class_variance_authority46.cva)("flex min-w-0 flex-col gap-1u font-sans text-oprt-base text-oprt-text");
 function DraftObserver({ report: report2 }) {
-  const state = (0, import_react83.useContext)(import_react_aria_components25.TimeFieldStateContext);
+  const state = (0, import_react84.useContext)(import_react_aria_components25.TimeFieldStateContext);
   useReportSegments(state.segments, readTimeSegments, report2);
   return null;
 }
-var TimeField = (0, import_react83.forwardRef)(
+var TimeField = (0, import_react84.forwardRef)(
   ({
     label,
     value,
@@ -14633,12 +14694,12 @@ var TimeField = (0, import_react83.forwardRef)(
     id,
     className
   }, ref) => {
-    const generated = (0, import_react83.useId)();
+    const generated = (0, import_react84.useId)();
     const inputId = id ?? `oprt-time-${generated}`;
     const hydration = useHydrationRoot(inputId);
-    const config = (0, import_react83.useMemo)(() => timeConfiguration(value, min, max), [value, min, max]);
+    const config = (0, import_react84.useMemo)(() => timeConfiguration(value, min, max), [value, min, max]);
     const displayedValue = config.time ? formatTimeOnly(config.time) : null;
-    const group = (0, import_react83.useContext)(SegmentGroupContext);
+    const group = (0, import_react84.useContext)(SegmentGroupContext);
     const draft = useSegmentDraft({
       value,
       displayed: displayedValue,
@@ -14651,10 +14712,10 @@ var TimeField = (0, import_react83.forwardRef)(
       // The bound an edit crossed, named as for a supplied value (TimeField-R1).
       draft.rejection ?? "Enter a complete, valid time within the allowed bounds."
     ) : null);
-    const callback = (0, import_react83.useRef)(onDraftValidityChange);
+    const callback = (0, import_react84.useRef)(onDraftValidityChange);
     callback.current = onDraftValidityChange;
     const pending = draft.pending;
-    (0, import_react83.useEffect)(() => callback.current?.(!error, { pending }), [error, pending]);
+    (0, import_react84.useEffect)(() => callback.current?.(!error, { pending }), [error, pending]);
     return /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("div", { ...draft.editProps, children: /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)(
       import_react_aria_components25.TimeField,
       {
@@ -14739,14 +14800,14 @@ var TimeFieldManifest = {
 };
 
 // src/DateTimePicker/DateTimePicker.tsx
-var import_react84 = require("react");
+var import_react85 = require("react");
 var import_class_variance_authority47 = require("class-variance-authority");
 var import_clsx63 = __toESM(require("clsx"), 1);
 var import_jsx_runtime66 = require("react/jsx-runtime");
 var pickerStyles = (0, import_class_variance_authority47.cva)(
   "flex min-w-0 flex-col gap-2u font-sans text-oprt-base text-oprt-text focus-visible:outline-hidden focus-visible:shadow-oprt-focus"
 );
-var DateTimePicker = (0, import_react84.forwardRef)(
+var DateTimePicker = (0, import_react85.forwardRef)(
   ({
     label,
     value,
@@ -14761,7 +14822,7 @@ var DateTimePicker = (0, import_react84.forwardRef)(
     id,
     className
   }, ref) => {
-    const root = (0, import_react84.useRef)(null);
+    const root = (0, import_react85.useRef)(null);
     const setRoot = useMergedRefs(root, ref);
     const ids = usePartIds(["label", "zone", "error", "status"], {
       id,
@@ -14769,7 +14830,7 @@ var DateTimePicker = (0, import_react84.forwardRef)(
     });
     const zoneName = typeof timeZone === "string" ? timeZone : "invalid";
     const base = `${String(value)}|${String(timeZone)}`;
-    const wall = (0, import_react84.useMemo)(() => instantWallTime(value, timeZone), [value, timeZone]);
+    const wall = (0, import_react85.useMemo)(() => instantWallTime(value, timeZone), [value, timeZone]);
     const initial = {
       base,
       date: wall.date,
@@ -14779,7 +14840,7 @@ var DateTimePicker = (0, import_react84.forwardRef)(
       timeValid: true,
       dirty: false
     };
-    const [draft, setDraft] = (0, import_react84.useState)(initial);
+    const [draft, setDraft] = (0, import_react85.useState)(initial);
     const current = draft.base === base ? draft : initial;
     const zoneValid = validTimeZone(timeZone);
     const boundsValid = (min === void 0 || validInstant(min)) && (max === void 0 || validInstant(max)) && !(min !== void 0 && max !== void 0 && min > max);
@@ -14789,11 +14850,11 @@ var DateTimePicker = (0, import_react84.forwardRef)(
     const empty = current.date === null && current.time === null;
     const checkedInstant = current.dirty ? candidate : value;
     const error = !zoneValid ? "Invalid time zone. Supply an IANA time zone." : !boundsValid ? "Invalid instant bounds. Supply finite epoch milliseconds in ascending order." : !current.dirty && wall.error ? wall.error : !current.dateValid || !current.timeValid ? "Complete the date and time before applying this change." : empty ? required ? "A date and time are required." : null : !current.date || !current.time ? "Enter both a date and a time." : resolution?.status === "invalid" ? resolution.error : ambiguous && current.occurrence === null ? "Choose the earlier or later occurrence of this repeated time." : checkedInstant !== null && min !== void 0 && checkedInstant < min ? `Choose an instant at or after ${formatUtcTimestamp(min)}.` : checkedInstant !== null && max !== void 0 && checkedInstant > max ? `Choose an instant at or before ${formatUtcTimestamp(max)}.` : null;
-    const group = (0, import_react84.useMemo)(() => {
+    const group = (0, import_react85.useMemo)(() => {
       const dayOf = (bound) => bound !== void 0 && zoneValid && boundsValid ? instantWallTime(bound, timeZone).date ?? void 0 : void 0;
       return { required, calendar: { min: dayOf(min), max: dayOf(max) } };
     }, [required, min, max, timeZone, zoneValid, boundsValid]);
-    const restoring = (0, import_react84.useRef)(false);
+    const restoring = (0, import_react85.useRef)(false);
     const restore = useRestoreFocusOnRemoval(root, {
       findTarget: () => {
         restoring.current = true;
@@ -14811,9 +14872,9 @@ var DateTimePicker = (0, import_react84.forwardRef)(
       const from = event.relatedTarget;
       return from instanceof Node && event.currentTarget.contains(from);
     };
-    const callback = (0, import_react84.useRef)(onDraftValidityChange);
+    const callback = (0, import_react85.useRef)(onDraftValidityChange);
     callback.current = onDraftValidityChange;
-    (0, import_react84.useEffect)(
+    (0, import_react85.useEffect)(
       () => callback.current?.(!error && !current.dirty, { pending: current.dirty }),
       [error, current.dirty]
     );
@@ -14975,7 +15036,7 @@ var DateTimePickerManifest = {
 };
 
 // src/DateRangePicker/DateRangePicker.tsx
-var import_react85 = require("react");
+var import_react86 = require("react");
 var import_class_variance_authority48 = require("class-variance-authority");
 var import_clsx64 = __toESM(require("clsx"), 1);
 var import_jsx_runtime67 = require("react/jsx-runtime");
@@ -14984,7 +15045,7 @@ var rangeStyles3 = (0, import_class_variance_authority48.cva)(
 );
 var REQUIRED_GROUP = { required: true };
 var keyOf = (value) => value === null ? "null" : JSON.stringify([value.start, value.end]);
-var DateRangePicker = (0, import_react85.forwardRef)(
+var DateRangePicker = (0, import_react86.forwardRef)(
   ({
     label,
     value,
@@ -15000,14 +15061,14 @@ var DateRangePicker = (0, import_react85.forwardRef)(
     id,
     className
   }, ref) => {
-    const root = (0, import_react85.useRef)(null);
+    const root = (0, import_react86.useRef)(null);
     const setRoot = useMergedRefs(root, ref);
     const ids = usePartIds(["label", "error", "status"], {
       id,
       readRendered: () => root.current?.id
     });
     const base = keyOf(value);
-    const [replacement, setReplacement] = (0, import_react85.useState)({ base, generation: 0, requested: null });
+    const [replacement, setReplacement] = (0, import_react86.useState)({ base, generation: 0, requested: null });
     if (replacement.base !== base) {
       setReplacement({
         base,
@@ -15029,7 +15090,7 @@ var DateRangePicker = (0, import_react85.forwardRef)(
       startPending: false,
       endPending: false
     };
-    const [draft, setDraft] = (0, import_react85.useState)(initial);
+    const [draft, setDraft] = (0, import_react86.useState)(initial);
     const current = draft.base === base ? draft : initial;
     const start = parseDateOnly(current.start);
     const end = parseDateOnly(current.end);
@@ -15038,9 +15099,9 @@ var DateRangePicker = (0, import_react85.forwardRef)(
     const empty = current.start === null && current.end === null;
     const pending = current.startPending || current.endPending || current.start !== (value?.start ?? null) || current.end !== (value?.end ?? null);
     const error = startConfig.error || endConfig.error || (!current.startValid || !current.endValid ? "Complete both date fields before continuing." : empty ? required ? "A date range is required." : null : !start || !end ? "Enter both a start date and an end date." : start.compare(end) > 0 ? "Start date must be on or before end date." : null);
-    const callback = (0, import_react85.useRef)(onDraftValidityChange);
+    const callback = (0, import_react86.useRef)(onDraftValidityChange);
     callback.current = onDraftValidityChange;
-    (0, import_react85.useEffect)(() => callback.current?.(!error && !pending, { pending }), [error, pending]);
+    (0, import_react86.useEffect)(() => callback.current?.(!error && !pending, { pending }), [error, pending]);
     const setEndpoint = (part, next) => {
       if (disabled || readOnly) return;
       const nextDraft = { ...current, [part]: next };
@@ -15155,7 +15216,7 @@ var DateRangePickerManifest = {
 };
 
 // src/FileUpload/FileUpload.tsx
-var import_react86 = require("react");
+var import_react87 = require("react");
 var import_react_aria_components26 = require("react-aria-components");
 var import_class_variance_authority49 = require("class-variance-authority");
 var import_clsx65 = __toESM(require("clsx"), 1);
@@ -15183,7 +15244,7 @@ var dropStyles = (0, import_class_variance_authority49.cva)(
   "flex min-w-0 flex-col items-start gap-2u border border-dashed border-oprt-border bg-oprt-surface-1 p-3u data-[drop-target]:border-oprt-accent data-[focus-visible]:border-oprt-border-focus data-[focus-visible]:shadow-oprt-focus"
 );
 var validAccept = (token) => /^\.[a-z0-9][a-z0-9._+-]*$/i.test(token) || /^(?:[a-z0-9!#$&^_.+-]+\/(?:[a-z0-9!#$&^_.+-]+|\*)|\*\/\*)$/i.test(token);
-var FileUpload = (0, import_react86.forwardRef)(
+var FileUpload = (0, import_react87.forwardRef)(
   ({
     label,
     description,
@@ -15199,29 +15260,29 @@ var FileUpload = (0, import_react86.forwardRef)(
     "aria-describedby": describedBy,
     ...props
   }, ref) => {
-    const root = (0, import_react86.useRef)(null);
+    const root = (0, import_react87.useRef)(null);
     const mergedRef = useMergedRefs(root, ref);
     const ids = usePartIds(["label", "description", "configuration"], {
       id: props.id,
       readRendered: () => root.current?.getAttribute("data-oprt-ids")
     });
-    const [issues, setIssues] = (0, import_react86.useState)([]);
-    const [reading, setReading] = (0, import_react86.useState)(false);
-    const [feedback, setFeedback] = (0, import_react86.useState)("");
+    const [issues, setIssues] = (0, import_react87.useState)([]);
+    const [reading, setReading] = (0, import_react87.useState)(false);
+    const [feedback, setFeedback] = (0, import_react87.useState)("");
     const isMounted = useIsMounted();
-    const generation = (0, import_react86.useRef)(0);
+    const generation = (0, import_react87.useRef)(0);
     const types = accept?.map((token) => token.trim().toLowerCase()) ?? [];
     const configurationError = accept?.some((token) => !validAccept(token.trim())) ? "Invalid accept configuration. Use file extensions or MIME types." : maxFiles !== void 0 && (!Number.isSafeInteger(maxFiles) || maxFiles < 1) ? "Invalid maxFiles configuration. Supply a positive integer." : maxFileSizeBytes !== void 0 && (!Number.isSafeInteger(maxFileSizeBytes) || maxFileSizeBytes < 0) ? "Invalid maxFileSizeBytes configuration. Supply a nonnegative integer." : "";
     const signature = JSON.stringify([types, multiple, String(maxFiles), String(maxFileSizeBytes)]);
-    const latest = (0, import_react86.useRef)({ disabled, configurationError, signature, onFiles, onReject });
+    const latest = (0, import_react87.useRef)({ disabled, configurationError, signature, onFiles, onReject });
     latest.current = { disabled, configurationError, signature, onFiles, onReject };
-    (0, import_react86.useEffect)(() => {
+    (0, import_react87.useEffect)(() => {
       const requests = generation;
       return () => {
         requests.current++;
       };
     }, []);
-    (0, import_react86.useEffect)(() => {
+    (0, import_react87.useEffect)(() => {
       generation.current++;
       setReading(false);
     }, [signature, disabled]);
@@ -15418,7 +15479,7 @@ var FileUploadManifest = {
 };
 
 // src/UploadQueue/UploadQueue.tsx
-var import_react87 = require("react");
+var import_react88 = require("react");
 var import_class_variance_authority50 = require("class-variance-authority");
 var import_clsx66 = __toESM(require("clsx"), 1);
 var import_jsx_runtime70 = require("react/jsx-runtime");
@@ -15500,7 +15561,7 @@ function describeChanges(before, after) {
   if (after.length === 0 && before.length > 0) parts.push("No files selected.");
   return parts.join(" ");
 }
-var UploadQueue = (0, import_react87.forwardRef)(
+var UploadQueue = (0, import_react88.forwardRef)(
   ({
     label,
     items,
@@ -15514,13 +15575,13 @@ var UploadQueue = (0, import_react87.forwardRef)(
     "aria-labelledby": labelledBy,
     ...props
   }, ref) => {
-    const root = (0, import_react87.useRef)(null);
+    const root = (0, import_react88.useRef)(null);
     const ids = usePartIds(["label"], {
       id: props.id,
       readRendered: () => root.current?.getAttribute("data-oprt-ids")
     });
-    const rows = (0, import_react87.useRef)(/* @__PURE__ */ new Map());
-    (0, import_react87.useImperativeHandle)(ref, () => root.current, []);
+    const rows = (0, import_react88.useRef)(/* @__PURE__ */ new Map());
+    (0, import_react88.useImperativeHandle)(ref, () => root.current, []);
     const invalidIdentity = hasInvalidIdentity(items);
     const restoreFocus = useRestoreFocusOnRemoval(root, {
       track: (element) => {
@@ -15535,17 +15596,17 @@ var UploadQueue = (0, import_react87.forwardRef)(
       }
     });
     const signature = JSON.stringify(rowsOf(items));
-    const announced = (0, import_react87.useRef)(null);
-    const [announcement, setAnnouncement] = (0, import_react87.useState)("");
-    const lastAnnouncement = (0, import_react87.useRef)("");
-    const repeatFrame = (0, import_react87.useRef)(null);
-    (0, import_react87.useEffect)(
+    const announced = (0, import_react88.useRef)(null);
+    const [announcement, setAnnouncement] = (0, import_react88.useState)("");
+    const lastAnnouncement = (0, import_react88.useRef)("");
+    const repeatFrame = (0, import_react88.useRef)(null);
+    (0, import_react88.useEffect)(
       () => () => {
         if (repeatFrame.current !== null) cancelAnimationFrame(repeatFrame.current);
       },
       []
     );
-    (0, import_react87.useEffect)(() => {
+    (0, import_react88.useEffect)(() => {
       const after = JSON.parse(signature);
       const before = announced.current;
       announced.current = after;
@@ -15569,7 +15630,7 @@ var UploadQueue = (0, import_react87.forwardRef)(
     }, [signature]);
     const unknownStates = items.filter((item) => !isKnownState(item.state)).map((item) => item.state);
     const unknownKey = JSON.stringify(unknownStates);
-    (0, import_react87.useEffect)(() => {
+    (0, import_react88.useEffect)(() => {
       if (process.env.NODE_ENV === "production") return;
       for (const state of JSON.parse(unknownKey)) reportUnknownState(state);
     }, [unknownKey]);
@@ -15730,7 +15791,7 @@ var UploadQueueManifest = {
 };
 
 // src/AttachmentPreview/AttachmentPreview.tsx
-var import_react88 = require("react");
+var import_react89 = require("react");
 var import_class_variance_authority51 = require("class-variance-authority");
 var import_clsx67 = __toESM(require("clsx"), 1);
 var import_jsx_runtime71 = require("react/jsx-runtime");
@@ -15753,7 +15814,7 @@ function safeImageSource(src) {
     return false;
   }
 }
-var AttachmentPreview = (0, import_react88.forwardRef)(
+var AttachmentPreview = (0, import_react89.forwardRef)(
   ({
     label,
     attachment,
@@ -15765,14 +15826,14 @@ var AttachmentPreview = (0, import_react88.forwardRef)(
     "aria-labelledby": labelledBy,
     ...props
   }, ref) => {
-    const root = (0, import_react88.useRef)(null);
+    const root = (0, import_react89.useRef)(null);
     const mergedRef = useMergedRefs(root, ref);
     const ids = usePartIds(["label"], {
       id: props.id,
       readRendered: () => root.current?.getAttribute("data-oprt-ids")
     });
     const imageKey = `${attachment.id}\0${preview.kind === "image" ? preview.src : ""}`;
-    const [imageState, setImageState] = (0, import_react88.useState)({ key: imageKey, failed: false });
+    const [imageState, setImageState] = (0, import_react89.useState)({ key: imageKey, failed: false });
     if (imageState.key !== imageKey) setImageState({ key: imageKey, failed: false });
     const imageError = preview.kind === "image" ? !safeImageSource(preview.src) ? "Image preview source is not supported." : imageState.key === imageKey && imageState.failed ? "Image preview could not be loaded." : null : null;
     return /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(
@@ -15910,7 +15971,7 @@ var AttachmentPreviewManifest = {
 };
 
 // src/JobStatus/JobStatus.tsx
-var import_react89 = require("react");
+var import_react90 = require("react");
 var import_class_variance_authority52 = require("class-variance-authority");
 var import_clsx68 = __toESM(require("clsx"), 1);
 
@@ -15970,7 +16031,7 @@ var import_jsx_runtime72 = require("react/jsx-runtime");
 var jobStyles = (0, import_class_variance_authority52.cva)(
   "flex min-w-0 flex-col gap-2u border border-oprt-border p-2u font-sans text-oprt-base normal-case text-oprt-text outline-hidden focus-visible:shadow-oprt-focus"
 );
-var JobStatus = (0, import_react89.forwardRef)((allProps, ref) => {
+var JobStatus = (0, import_react90.forwardRef)((allProps, ref) => {
   const {
     jobId,
     label,
@@ -15996,8 +16057,8 @@ var JobStatus = (0, import_react89.forwardRef)((allProps, ref) => {
   const canRetry = !!onRetryRequest && ["failed", "partial", "canceled"].includes(state);
   const blocked = disabled || requestPending !== null;
   const pendingText = requestPending ? `${requestPending === "cancel" ? "Cancellation" : "Retry"} request pending. Awaiting an application update.` : "";
-  const [spokenText, setSpokenText] = (0, import_react89.useState)(pendingText);
-  (0, import_react89.useEffect)(() => {
+  const [spokenText, setSpokenText] = (0, import_react90.useState)(pendingText);
+  (0, import_react90.useEffect)(() => {
     let second = 0;
     const first = requestAnimationFrame(() => {
       second = requestAnimationFrame(() => setSpokenText(pendingText));
@@ -16071,7 +16132,7 @@ var JobStatus = (0, import_react89.forwardRef)((allProps, ref) => {
 JobStatus.displayName = "JobStatus";
 
 // src/BulkActionBar/BulkActionBar.tsx
-var import_react90 = require("react");
+var import_react91 = require("react");
 var import_class_variance_authority53 = require("class-variance-authority");
 var import_clsx69 = __toESM(require("clsx"), 1);
 
@@ -16118,7 +16179,7 @@ var import_jsx_runtime73 = require("react/jsx-runtime");
 var barStyles2 = (0, import_class_variance_authority53.cva)(
   "flex min-w-0 flex-col gap-2u border border-oprt-border bg-oprt-surface-1 p-2u font-sans text-oprt-base text-oprt-text outline-hidden focus-visible:shadow-oprt-focus"
 );
-var BulkActionBar = (0, import_react90.forwardRef)(
+var BulkActionBar = (0, import_react91.forwardRef)(
   ({
     label,
     selection,
@@ -16130,7 +16191,7 @@ var BulkActionBar = (0, import_react90.forwardRef)(
     headingLevel = 3,
     className
   }, ref) => {
-    const id = (0, import_react90.useId)();
+    const id = (0, import_react91.useId)();
     const focus = useActionFocus(ref);
     const Heading5 = `h${headingLevel}`;
     const invalidSelection = selectionError(selection);
@@ -16291,7 +16352,7 @@ var BulkActionBarManifest = {
 };
 
 // src/BulkResults/BulkResults.tsx
-var import_react91 = require("react");
+var import_react92 = require("react");
 var import_class_variance_authority54 = require("class-variance-authority");
 var import_clsx70 = __toESM(require("clsx"), 1);
 var import_jsx_runtime74 = require("react/jsx-runtime");
@@ -16314,7 +16375,7 @@ var COLUMNS = [
   { heading: "Details", width: "min-w-16u" },
   { heading: "Actions", width: "" }
 ];
-var BulkResults = (0, import_react91.forwardRef)(
+var BulkResults = (0, import_react92.forwardRef)(
   ({
     label,
     selection,
@@ -16327,10 +16388,10 @@ var BulkResults = (0, import_react91.forwardRef)(
     className
   }, ref) => {
     const Heading5 = `h${headingLevel}`;
-    const root = (0, import_react91.useRef)(null);
-    (0, import_react91.useImperativeHandle)(ref, () => root.current, []);
+    const root = (0, import_react92.useRef)(null);
+    (0, import_react92.useImperativeHandle)(ref, () => root.current, []);
     const [box, scrolls] = useScrollsSideways();
-    const rows = (0, import_react91.useRef)(/* @__PURE__ */ new Map());
+    const rows = (0, import_react92.useRef)(/* @__PURE__ */ new Map());
     const invalidSelection = selectionError(selection);
     const selected = new Set(invalidSelection ? [] : selection.ids);
     const invalidResults = idsError(items.map((item) => item.id)) || (items.some((item) => !selected.has(item.id)) ? "A result ID is outside the selection snapshot." : null) || (items.some(
@@ -16338,13 +16399,13 @@ var BulkResults = (0, import_react91.forwardRef)(
     ) ? "Every result needs a valid state, label, and message." : null);
     const invalidRetries = idsError(pendingRetryIds) || (pendingRetryIds.some((item) => !selected.has(item)) ? "A pending retry ID is outside the selection snapshot." : null);
     const resultMap = new Map((invalidResults ? [] : items).map((item) => [item.id, item]));
-    const pending = (0, import_react91.useMemo)(() => new Set(pendingRetryIds), [pendingRetryIds]);
+    const pending = (0, import_react92.useMemo)(() => new Set(pendingRetryIds), [pendingRetryIds]);
     const missing = invalidSelection ? 0 : selection.ids.filter((item) => !resultMap.has(item)).length;
     const succeeded = invalidResults ? 0 : items.filter((item) => item.state === "succeeded").length;
     const ids = invalidSelection ? NO_IDS : selection.ids;
     const size = Number.isFinite(pageSize) && pageSize >= 1 ? Math.floor(pageSize) : DEFAULT_PAGE_SIZE;
     const pageCount = Math.max(1, Math.ceil(ids.length / size));
-    const [paging, setPaging] = (0, import_react91.useState)({ snapshot: selection.id, page: 1 });
+    const [paging, setPaging] = (0, import_react92.useState)({ snapshot: selection.id, page: 1 });
     const requestedPage = paging.snapshot === selection.id ? paging.page : 1;
     const page = Math.min(pageCount, Math.max(1, requestedPage));
     const pageIds = ids.length > size ? ids.slice((page - 1) * size, page * size) : ids;
@@ -16362,14 +16423,14 @@ var BulkResults = (0, import_react91.forwardRef)(
         return next?.querySelector("button:not(:disabled)") ?? next?.querySelector("th") ?? root.current;
       }
     });
-    const [spoken, setSpoken] = (0, import_react91.useState)("");
-    const announced = (0, import_react91.useRef)(new Set(invalidRetries ? [] : pendingRetryIds));
-    const latest = (0, import_react91.useRef)({ results: resultMap, pending: pendingRetryIds });
+    const [spoken, setSpoken] = (0, import_react92.useState)("");
+    const announced = (0, import_react92.useRef)(new Set(invalidRetries ? [] : pendingRetryIds));
+    const latest = (0, import_react92.useRef)({ results: resultMap, pending: pendingRetryIds });
     useIsomorphicLayoutEffect(() => {
       latest.current = { results: resultMap, pending: pendingRetryIds };
     });
     const pendingKey = JSON.stringify(pendingRetryIds);
-    (0, import_react91.useEffect)(() => {
+    (0, import_react92.useEffect)(() => {
       const current = invalidRetries ? [] : latest.current.pending;
       for (const itemId of [...announced.current])
         if (!current.includes(itemId)) announced.current.delete(itemId);
@@ -16591,7 +16652,7 @@ var BulkResultsManifest = {
 };
 
 // src/MapControls/MapControls.tsx
-var import_react92 = require("react");
+var import_react93 = require("react");
 var import_react_aria7 = require("react-aria");
 var import_class_variance_authority55 = require("class-variance-authority");
 var import_clsx71 = __toESM(require("clsx"), 1);
@@ -16611,7 +16672,7 @@ var actions = [
   { id: "reset-north", label: "Reset north" },
   { id: "fit", label: "Fit map" }
 ];
-var MapControls = (0, import_react92.forwardRef)(
+var MapControls = (0, import_react93.forwardRef)(
   ({
     label = "Map controls",
     zoom = null,
@@ -16627,15 +16688,15 @@ var MapControls = (0, import_react92.forwardRef)(
     onBlurCapture,
     ...props
   }, ref) => {
-    const root = (0, import_react92.useRef)(null);
-    (0, import_react92.useImperativeHandle)(ref, () => root.current, []);
-    const labelRef = (0, import_react92.useRef)(null);
+    const root = (0, import_react93.useRef)(null);
+    (0, import_react93.useImperativeHandle)(ref, () => root.current, []);
+    const labelRef = (0, import_react93.useRef)(null);
     const ids = usePartIds(["label"], {
       id,
       readRendered: () => labelRef.current?.id.replace(/-label$/, "")
     });
     const readout = (0, import_react_aria7.useNumberFormatter)(READOUT);
-    const buttons = (0, import_react92.useRef)(/* @__PURE__ */ new Map());
+    const buttons = (0, import_react93.useRef)(/* @__PURE__ */ new Map());
     const limitsValid = Number.isFinite(minZoom) && Number.isFinite(maxZoom) && minZoom <= maxZoom;
     const validZoom = typeof zoom === "number" && Number.isFinite(zoom) && limitsValid && zoom >= minZoom && zoom <= maxZoom;
     const validBearing = typeof bearing === "number" && Number.isFinite(bearing) && bearing >= 0 && bearing < 360;
@@ -16735,7 +16796,7 @@ var MapControlsManifest = {
 };
 
 // src/LayerControl/LayerControl.tsx
-var import_react93 = require("react");
+var import_react94 = require("react");
 var import_class_variance_authority56 = require("class-variance-authority");
 var import_clsx72 = __toESM(require("clsx"), 1);
 var import_jsx_runtime76 = require("react/jsx-runtime");
@@ -16745,7 +16806,7 @@ var controlStyles3 = (0, import_class_variance_authority56.cva)(
 var rowStyles = (0, import_class_variance_authority56.cva)(
   "flex min-w-0 flex-col gap-2u border border-oprt-border p-2u outline-hidden focus-visible:shadow-oprt-focus"
 );
-var LayerControl = (0, import_react93.forwardRef)(
+var LayerControl = (0, import_react94.forwardRef)(
   ({
     label = "Map layers",
     layers,
@@ -16758,14 +16819,14 @@ var LayerControl = (0, import_react93.forwardRef)(
     "aria-labelledby": labelledBy,
     ...props
   }, ref) => {
-    const root = (0, import_react93.useRef)(null);
-    const labelRef = (0, import_react93.useRef)(null);
+    const root = (0, import_react94.useRef)(null);
+    const labelRef = (0, import_react94.useRef)(null);
     const ids = usePartIds(["label"], {
       id,
       readRendered: () => labelRef.current?.id.replace(/-label$/, "")
     });
-    const rows = (0, import_react93.useRef)(/* @__PURE__ */ new Map());
-    (0, import_react93.useImperativeHandle)(ref, () => root.current, []);
+    const rows = (0, import_react94.useRef)(/* @__PURE__ */ new Map());
+    (0, import_react94.useImperativeHandle)(ref, () => root.current, []);
     const invalidIds = layers.some(
       (item, index) => !item.id.trim() || layers.findIndex((other) => other.id === item.id) !== index
     );
@@ -16956,7 +17017,7 @@ var LayerControlManifest = {
 };
 
 // src/MapLegend/MapLegend.tsx
-var import_react94 = require("react");
+var import_react95 = require("react");
 var import_class_variance_authority57 = require("class-variance-authority");
 var import_clsx73 = __toESM(require("clsx"), 1);
 var import_jsx_runtime77 = require("react/jsx-runtime");
@@ -16981,9 +17042,9 @@ var symbolStyles = (0, import_class_variance_authority57.cva)("block shrink-0 fo
   defaultVariants: { variant: "neutral", pattern: "solid" }
 });
 var kinds = { point: "Point", line: "Line", area: "Area" };
-var MapLegend = (0, import_react94.forwardRef)(
+var MapLegend = (0, import_react95.forwardRef)(
   ({ label = "Map legend", items, className, id, "aria-labelledby": labelledBy, ...props }, ref) => {
-    const labelRef = (0, import_react94.useRef)(null);
+    const labelRef = (0, import_react95.useRef)(null);
     const ids = usePartIds(["label"], {
       id,
       readRendered: () => labelRef.current?.id.replace(/-label$/, "")
@@ -17067,7 +17128,7 @@ var MapLegendManifest = {
 };
 
 // src/MapScale/MapScale.tsx
-var import_react95 = require("react");
+var import_react96 = require("react");
 var import_react_aria8 = require("react-aria");
 var import_class_variance_authority58 = require("class-variance-authority");
 var import_clsx74 = __toESM(require("clsx"), 1);
@@ -17118,7 +17179,7 @@ function scale2(metersPerPixel, width, units) {
   if (!Number.isFinite(pixels) || pixels <= 0 || pixels > width) return null;
   return { pixels, distance, unit };
 }
-var MapScale = (0, import_react95.forwardRef)((allProps, ref) => {
+var MapScale = (0, import_react96.forwardRef)((allProps, ref) => {
   const {
     label = "Map scale",
     metersPerPixel = null,
@@ -17132,13 +17193,13 @@ var MapScale = (0, import_react95.forwardRef)((allProps, ref) => {
   if (process.env.NODE_ENV !== "production") {
     devValidate("MapScale", MapScaleManifest.MapScale.props, { ...allProps });
   }
-  const labelRef = (0, import_react95.useRef)(null);
+  const labelRef = (0, import_react96.useRef)(null);
   const ids = usePartIds(["label"], {
     id,
     readRendered: () => labelRef.current?.id.replace(/-label$/, "")
   });
   const format = (0, import_react_aria8.useNumberFormatter)(DISTANCE);
-  const available = (0, import_react95.useRef)(null);
+  const available = (0, import_react96.useRef)(null);
   const measuredWidth = useElementWidth(available, {
     initial: null
   });
@@ -17185,7 +17246,7 @@ var MapScale = (0, import_react95.forwardRef)((allProps, ref) => {
 MapScale.displayName = "MapScale";
 
 // src/MediaFrame/MediaFrame.tsx
-var import_react96 = require("react");
+var import_react97 = require("react");
 var import_react_aria9 = require("react-aria");
 var import_class_variance_authority59 = require("class-variance-authority");
 var import_clsx75 = __toESM(require("clsx"), 1);
@@ -17251,7 +17312,7 @@ var EXACT_NUMBER2 = { maximumSignificantDigits: 21 };
 var frameStyles = (0, import_class_variance_authority59.cva)(
   "flex min-w-0 flex-col border border-oprt-border bg-oprt-surface-1 font-sans text-oprt-base normal-case text-oprt-text"
 );
-var MediaFrame = (0, import_react96.forwardRef)((allProps, ref) => {
+var MediaFrame = (0, import_react97.forwardRef)((allProps, ref) => {
   const {
     label,
     state,
@@ -17271,7 +17332,7 @@ var MediaFrame = (0, import_react96.forwardRef)((allProps, ref) => {
   if (process.env.NODE_ENV !== "production") {
     devValidate("MediaFrame", MediaFrameManifest.MediaFrame.props, { ...allProps });
   }
-  const labelRef = (0, import_react96.useRef)(null);
+  const labelRef = (0, import_react97.useRef)(null);
   const ids = usePartIds(["label"], {
     id,
     readRendered: () => labelRef.current?.id.replace(/-label$/, "")
@@ -17347,7 +17408,7 @@ MediaFrame.displayName = "MediaFrame";
 // src/PlaybackControls/PlaybackControls.tsx
 var import_class_variance_authority60 = require("class-variance-authority");
 var import_clsx76 = __toESM(require("clsx"), 1);
-var import_react97 = require("react");
+var import_react98 = require("react");
 var import_react_aria_components27 = require("react-aria-components");
 var import_jsx_runtime80 = require("react/jsx-runtime");
 var rootStyles8 = (0, import_class_variance_authority60.cva)(
@@ -17402,7 +17463,7 @@ function arrowDirection(key, rightToLeft) {
   if (key === "ArrowLeft" || key === "Left") return rightToLeft ? 1 : -1;
   return 0;
 }
-var PlaybackControls = (0, import_react97.forwardRef)(
+var PlaybackControls = (0, import_react98.forwardRef)(
   ({
     start,
     end,
@@ -17426,12 +17487,12 @@ var PlaybackControls = (0, import_react97.forwardRef)(
     onBlurCapture,
     ...props
   }, ref) => {
-    const descriptionId = (0, import_react97.useId)();
-    const root = (0, import_react97.useRef)(null);
-    (0, import_react97.useImperativeHandle)(ref, () => root.current, []);
-    const previousRef = (0, import_react97.useRef)(null);
-    const playRef = (0, import_react97.useRef)(null);
-    const nextRef = (0, import_react97.useRef)(null);
+    const descriptionId = (0, import_react98.useId)();
+    const root = (0, import_react98.useRef)(null);
+    (0, import_react98.useImperativeHandle)(ref, () => root.current, []);
+    const previousRef = (0, import_react98.useRef)(null);
+    const playRef = (0, import_react98.useRef)(null);
+    const nextRef = (0, import_react98.useRef)(null);
     const { direction } = (0, import_react_aria_components27.useLocale)();
     const validBounds = validTime(start) && validTime(end);
     const validRange = validBounds && start < end;
@@ -17443,7 +17504,7 @@ var PlaybackControls = (0, import_react97.forwardRef)(
     const sliderEnd = validRange ? end : 1;
     const displayValue = validRange && validCursor ? Math.min(end, Math.max(start, value)) : sliderStart;
     const positionText = validRange && validCursor ? formatTime(displayValue) : validBounds && start === end ? formatTime(start) : "Unknown playback position";
-    const events = (0, import_react97.useMemo)(
+    const events = (0, import_react98.useMemo)(
       () => [
         ...new Set(
           (eventTimes ?? []).filter((time) => validTime(time) && time >= start && time <= end)
@@ -17701,7 +17762,7 @@ var PlaybackControlsManifest = {
 };
 
 // package.json
-var version3 = "0.3.0";
+var version3 = "0.4.0";
 
 // src/version.ts
 var VERSION = version3;