@vuu-ui/vuu-ui-controls 0.8.16-debug → 0.8.17-debug

package/cjs/index.js

@@ -175,7 +175,7 @@ module.exports = __toCommonJS(src_exports);
 // src/combo-box/ComboBox.tsx
 var import_vuu_layout7 = require("@vuu-ui/vuu-layout");
 var import_core14 = require("@salt-ds/core");
-var import_react39 = require("react");
+var import_react40 = require("react");
 
 // src/common-hooks/collectionProvider.tsx
 var import_react = require("react");
@@ -1289,7 +1289,7 @@ var DropdownButton = (0, import_react10.forwardRef)(function DropdownButton2({
 
 // src/dropdown/Dropdown.tsx
 var import_core12 = require("@salt-ds/core");
-var import_react37 = require("react");
+var import_react38 = require("react");
 var import_vuu_layout5 = require("@vuu-ui/vuu-layout");
 
 // src/list/common-hooks/keyUtils.ts
@@ -2200,18 +2200,18 @@ var Highlighter = (props) => {
 };
 
 // src/list/ListItem.tsx
-var import_react17 = require("react");
+var import_react18 = require("react");
 var import_classnames4 = __toESM(require("classnames"));
 
 // src/list/CheckboxIcon.tsx
+var import_react17 = __toESM(require("react"));
 var import_classnames3 = __toESM(require("classnames"));
-var import_jsx_runtime5 = require("react/jsx-runtime");
 var classBase3 = "vuuCheckboxIcon";
 var CheckboxIcon = ({
   checked = false,
   disabled = false,
   ...htmlAttributes
-}) => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+}) => /* @__PURE__ */ import_react17.default.createElement(
   "span",
   {
     ...htmlAttributes,
@@ -2222,13 +2222,13 @@ var CheckboxIcon = ({
 );
 
 // src/list/ListItem.tsx
-var import_jsx_runtime6 = require("react/jsx-runtime");
+var import_jsx_runtime5 = require("react/jsx-runtime");
 var classBase4 = "vuuListItem";
-var ListItemProxy = (0, import_react17.forwardRef)(function ListItemNextProxy({
+var ListItemProxy = (0, import_react18.forwardRef)(function ListItemNextProxy({
   height,
   ...htmlAttributes
 }, forwardedRef) {
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
     "div",
     {
       ...htmlAttributes,
@@ -2239,7 +2239,7 @@ var ListItemProxy = (0, import_react17.forwardRef)(function ListItemNextProxy({
     }
   );
 });
-var ListItem = (0, import_react17.forwardRef)(
+var ListItem = (0, import_react18.forwardRef)(
   function ListItem2({
     children,
     className: classNameProp,
@@ -2263,7 +2263,7 @@ var ListItem = (0, import_react17.forwardRef)(
       ...styleProp,
       height: itemHeight
     } : styleProp;
-    return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
       "div",
       {
         className,
@@ -2273,8 +2273,8 @@ var ListItem = (0, import_react17.forwardRef)(
         ref: forwardedRef,
         style,
         children: [
-          showCheckbox && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(CheckboxIcon, { "aria-hidden": true, checked: selected }),
-          children && typeof children !== "string" ? children : itemTextHighlightPattern == null ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: `${classBase4}-textWrapper`, children: label || children }) : /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+          showCheckbox && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(CheckboxIcon, { "aria-hidden": true, checked: selected }),
+          children && typeof children !== "string" ? children : itemTextHighlightPattern == null ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: `${classBase4}-textWrapper`, children: label || children }) : /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
             Highlighter,
             {
               matchPattern: itemTextHighlightPattern,
@@ -2291,31 +2291,31 @@ var ListItem = (0, import_react17.forwardRef)(
 var import_vuu_layout4 = require("@vuu-ui/vuu-layout");
 var import_core9 = require("@salt-ds/core");
 var import_classnames6 = __toESM(require("classnames"));
-var import_react32 = require("react");
+var import_react33 = require("react");
 
 // src/list/useList.ts
 var import_vuu_layout3 = require("@vuu-ui/vuu-layout");
-var import_react29 = require("react");
+var import_react30 = require("react");
 
 // src/drag-drop/dragDropTypesNext.ts
 var FWD = "fwd";
 var BWD = "bwd";
 
 // src/drag-drop/DragDropProvider.tsx
-var import_react19 = require("react");
+var import_react20 = require("react");
 
 // src/drag-drop/useGlobalDragDrop.ts
 var import_vuu_utils3 = require("@vuu-ui/vuu-utils");
-var import_react18 = require("react");
+var import_react19 = require("react");
 var useGlobalDragDrop = ({
   onDragOverDropTarget,
   onDrop
 }) => {
-  const dropTargetRef = (0, import_react18.useRef)();
-  const measuredDropTargetsRef = (0, import_react18.useRef)();
-  const dragDropStateRef = (0, import_react18.useRef)(null);
-  const mousePosRef = (0, import_react18.useRef)({ x: 0, y: 0 });
-  const overDropTarget = (0, import_react18.useCallback)((x, y) => {
+  const dropTargetRef = (0, import_react19.useRef)();
+  const measuredDropTargetsRef = (0, import_react19.useRef)();
+  const dragDropStateRef = (0, import_react19.useRef)(null);
+  const mousePosRef = (0, import_react19.useRef)({ x: 0, y: 0 });
+  const overDropTarget = (0, import_react19.useCallback)((x, y) => {
     const { current: dropTargets } = measuredDropTargetsRef;
     if (dropTargets) {
       for (const [id, measuredTarget] of Object.entries(dropTargets)) {
@@ -2326,7 +2326,7 @@ var useGlobalDragDrop = ({
     }
     return void 0;
   }, []);
-  const dragMouseMoveHandler = (0, import_react18.useCallback)(
+  const dragMouseMoveHandler = (0, import_react19.useCallback)(
     (evt) => {
       const { clientX, clientY } = evt;
       const { current: dragDropState } = dragDropStateRef;
@@ -2360,7 +2360,7 @@ var useGlobalDragDrop = ({
     // eslint-disable-next-line react-hooks/exhaustive-deps
     []
   );
-  const dragMouseUpHandler = (0, import_react18.useCallback)(() => {
+  const dragMouseUpHandler = (0, import_react19.useCallback)(() => {
     document.removeEventListener("mousemove", dragMouseMoveHandler, false);
     document.removeEventListener("mouseup", dragMouseUpHandler, false);
     const { current: dragDropState } = dragDropStateRef;
@@ -2374,7 +2374,7 @@ var useGlobalDragDrop = ({
       }
     }
   }, [dragMouseMoveHandler, onDrop]);
-  const resumeDrag = (0, import_react18.useCallback)(
+  const resumeDrag = (0, import_react19.useCallback)(
     (dragDropState) => {
       console.log(`resume drag of `, {
         el: dragDropState.draggableElement
@@ -2393,14 +2393,14 @@ var useGlobalDragDrop = ({
 };
 
 // src/drag-drop/DragDropProvider.tsx
-var import_jsx_runtime7 = require("react/jsx-runtime");
+var import_jsx_runtime6 = require("react/jsx-runtime");
 var NO_DRAG_CONTEXT = {
   isDragSource: void 0,
   isDropTarget: void 0,
   register: () => void 0
 };
 var unconfiguredRegistrationCall = () => console.log(`have you forgotten to provide a DragDrop Provider ?`);
-var DragDropContext = (0, import_react19.createContext)({
+var DragDropContext = (0, import_react20.createContext)({
   registerDragDropParty: unconfiguredRegistrationCall
 });
 var measureDropTargets = (dropTargetIds = []) => {
@@ -2417,12 +2417,12 @@ var DragDropProvider = ({
   children,
   dragSources: dragSourcesProp
 }) => {
-  const resumeDragHandlers = (0, import_react19.useMemo)(
+  const resumeDragHandlers = (0, import_react20.useMemo)(
     () => /* @__PURE__ */ new Map(),
     []
   );
-  const dropHandlers = (0, import_react19.useMemo)(() => /* @__PURE__ */ new Map(), []);
-  const handleDragOverDropTarget = (0, import_react19.useCallback)(
+  const dropHandlers = (0, import_react20.useMemo)(() => /* @__PURE__ */ new Map(), []);
+  const handleDragOverDropTarget = (0, import_react20.useCallback)(
     (dropTargetId, dragDropState) => {
       const resumeDrag2 = resumeDragHandlers.get(dropTargetId);
       if (resumeDrag2) {
@@ -2433,7 +2433,7 @@ var DragDropProvider = ({
     },
     [resumeDragHandlers]
   );
-  const handleDrop = (0, import_react19.useCallback)(
+  const handleDrop = (0, import_react20.useCallback)(
     (dropTargetId, dragDropState) => {
       const handleDrop2 = dropHandlers.get(dropTargetId);
       if (handleDrop2) {
@@ -2446,7 +2446,7 @@ var DragDropProvider = ({
     onDragOverDropTarget: handleDragOverDropTarget,
     onDrop: handleDrop
   });
-  const [dragSources, dropTargets] = (0, import_react19.useMemo)(() => {
+  const [dragSources, dropTargets] = (0, import_react20.useMemo)(() => {
     const sources = /* @__PURE__ */ new Map();
     const targets = /* @__PURE__ */ new Map();
     for (const [sourceId, { dropTargets: dropTargets2 }] of Object.entries(dragSourcesProp)) {
@@ -2468,7 +2468,7 @@ var DragDropProvider = ({
     }
     return [sources, targets];
   }, [dragSourcesProp]);
-  const onDragOut = (0, import_react19.useCallback)(
+  const onDragOut = (0, import_react20.useCallback)(
     (id, dragDropState) => {
       measuredDropTargetsRef.current = measureDropTargets(dragSources.get(id));
       resumeDrag(dragDropState);
@@ -2476,10 +2476,10 @@ var DragDropProvider = ({
     },
     [dragSources, measuredDropTargetsRef, resumeDrag]
   );
-  const onEndOfDragOperation = (0, import_react19.useCallback)((id) => {
+  const onEndOfDragOperation = (0, import_react20.useCallback)((id) => {
     console.log(`end of drag operation, id= ${id}`);
   }, []);
-  const registerDragDropParty = (0, import_react19.useCallback)(
+  const registerDragDropParty = (0, import_react20.useCallback)(
     (id, resumeDrag2, onDrop) => {
       if (resumeDrag2) {
         resumeDragHandlers.set(id, resumeDrag2);
@@ -2489,7 +2489,7 @@ var DragDropProvider = ({
     },
     [dropHandlers, resumeDragHandlers]
   );
-  const contextValue = (0, import_react19.useMemo)(
+  const contextValue = (0, import_react20.useMemo)(
     () => ({
       dragSources,
       dropTargets,
@@ -2505,7 +2505,7 @@ var DragDropProvider = ({
       registerDragDropParty
     ]
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(DragDropContext.Provider, { value: contextValue, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(DragDropContext.Provider, { value: contextValue, children });
 };
 var useDragDropProvider = (id) => {
   var _a2, _b;
@@ -2515,7 +2515,7 @@ var useDragDropProvider = (id) => {
     onDragOut,
     onEndOfDragOperation,
     registerDragDropParty
-  } = (0, import_react19.useContext)(DragDropContext);
+  } = (0, import_react20.useContext)(DragDropContext);
   if (id && (dragSources || dropTargets)) {
     const isDragSource = (_a2 = dragSources == null ? void 0 : dragSources.has(id)) != null ? _a2 : false;
     const isDropTarget = (_b = dropTargets == null ? void 0 : dropTargets.has(id)) != null ? _b : false;
@@ -2534,7 +2534,7 @@ var useDragDropProvider = (id) => {
 // src/drag-drop/useDragDropNext.tsx
 var import_vuu_layout2 = require("@vuu-ui/vuu-layout");
 var import_vuu_utils5 = require("@vuu-ui/vuu-utils");
-var import_react27 = require("react");
+var import_react28 = require("react");
 
 // src/drag-drop/DragDropState.ts
 var DragDropState = class {
@@ -2565,16 +2565,16 @@ var DragDropState = class {
 // src/drag-drop/Draggable.tsx
 var import_core7 = require("@salt-ds/core");
 var import_classnames5 = __toESM(require("classnames"));
-var import_react20 = require("react");
+var import_react21 = require("react");
 var import_vuu_popups2 = require("@vuu-ui/vuu-popups");
-var import_jsx_runtime8 = require("react/jsx-runtime");
+var import_jsx_runtime7 = require("react/jsx-runtime");
 var makeClassNames = (classNames) => classNames.split(" ").map((className) => `vuuDraggable-${className}`);
-var Draggable = (0, import_react20.forwardRef)(
+var Draggable = (0, import_react21.forwardRef)(
   function Draggable2({ wrapperClassName, element, onDropped, onTransitionEnd, style, scale = 1 }, forwardedRef) {
-    const handleVuuDrop = (0, import_react20.useCallback)(() => {
+    const handleVuuDrop = (0, import_react21.useCallback)(() => {
       onDropped == null ? void 0 : onDropped();
     }, [onDropped]);
-    const callbackRef = (0, import_react20.useCallback)(
+    const callbackRef = (0, import_react21.useCallback)(
       (el) => {
         if (el) {
           el.innerHTML = "";
@@ -2588,20 +2588,20 @@ var Draggable = (0, import_react20.forwardRef)(
       [element, handleVuuDrop, scale]
     );
     const forkedRef = (0, import_core7.useForkRef)(forwardedRef, callbackRef);
-    const position = (0, import_react20.useMemo)(
+    const position = (0, import_react21.useMemo)(
       () => ({
         left: 0,
         top: 0
       }),
       []
     );
-    return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_vuu_popups2.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_vuu_popups2.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
       import_vuu_popups2.PopupComponent,
       {
         anchorElement: { current: document.body },
         placement: "absolute",
         position,
-        children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
           "div",
           {
             className: (0, import_classnames5.default)("vuuDraggable", ...makeClassNames(wrapperClassName)),
@@ -2871,17 +2871,17 @@ var isContainerScrollable = (scrollableContainer, orientation) => {
 };
 
 // src/drag-drop/useAutoScroll.ts
-var import_react21 = require("react");
+var import_react22 = require("react");
 var useAutoScroll = ({
   containerRef,
   onScrollingStopped,
   orientation = "vertical"
 }) => {
-  const scrollTimer = (0, import_react21.useRef)(null);
-  const isScrolling = (0, import_react21.useRef)(false);
-  const scrollPosRef = (0, import_react21.useRef)(0);
-  const lastScrollDirectionRef = (0, import_react21.useRef)("fwd");
-  const stopScrolling = (0, import_react21.useCallback)(
+  const scrollTimer = (0, import_react22.useRef)(null);
+  const isScrolling = (0, import_react22.useRef)(false);
+  const scrollPosRef = (0, import_react22.useRef)(0);
+  const lastScrollDirectionRef = (0, import_react22.useRef)("fwd");
+  const stopScrolling = (0, import_react22.useCallback)(
     (atEnd = false) => {
       console.log("[useAutoScroll] stopScrolling");
       if (scrollTimer.current !== null) {
@@ -2897,7 +2897,7 @@ var useAutoScroll = ({
     },
     [onScrollingStopped]
   );
-  const startScrolling = (0, import_react21.useCallback)(
+  const startScrolling = (0, import_react22.useCallback)(
     (direction, scrollRate, scrollUnit = 30) => {
       const { current: container } = containerRef;
       if (container) {
@@ -2936,14 +2936,14 @@ var useAutoScroll = ({
 };
 
 // src/drag-drop/useDragDropCopy.ts
-var import_react22 = require("react");
+var import_react23 = require("react");
 var useDragDropCopy = ({
   selected,
   viewportRange
 }) => {
-  const rangeRef = (0, import_react22.useRef)();
+  const rangeRef = (0, import_react23.useRef)();
   rangeRef.current = viewportRange;
-  const beginDrag = (0, import_react22.useCallback)(
+  const beginDrag = (0, import_react23.useCallback)(
     (dragElement) => {
       if (dragElement.ariaSelected && Array.isArray(selected) && selected.length > 1) {
         console.log("its a selected element, and we have a multi select");
@@ -2951,8 +2951,8 @@ var useDragDropCopy = ({
     },
     [selected]
   );
-  const drag = (0, import_react22.useCallback)(() => void 0, []);
-  const drop = (0, import_react22.useCallback)(() => void 0, []);
+  const drag = (0, import_react23.useCallback)(() => void 0, []);
+  const drop = (0, import_react23.useCallback)(() => void 0, []);
   return {
     beginDrag,
     drag,
@@ -2961,14 +2961,14 @@ var useDragDropCopy = ({
 };
 
 // src/drag-drop/useDragDropIndicator.tsx
-var import_react24 = require("react");
+var import_react25 = require("react");
 
 // src/drag-drop/useDropIndicator.ts
-var import_react23 = require("react");
+var import_react24 = require("react");
 var useDropIndicator = () => {
-  const spacer = (0, import_react23.useMemo)(() => createDropIndicatorPosition(), []);
-  const clearSpacer = (0, import_react23.useCallback)(() => spacer.remove(), [spacer]);
-  const positionDropIndicator = (0, import_react23.useCallback)(
+  const spacer = (0, import_react24.useMemo)(() => createDropIndicatorPosition(), []);
+  const clearSpacer = (0, import_react24.useCallback)(() => spacer.remove(), [spacer]);
+  const positionDropIndicator = (0, import_react24.useCallback)(
     (dropTarget, dropZone2 = "end") => {
       if (dropZone2 === "end") {
         dropTarget.element.after(spacer);
@@ -2986,7 +2986,7 @@ var useDropIndicator = () => {
 };
 
 // src/drag-drop/useDragDropIndicator.tsx
-var import_jsx_runtime9 = require("react/jsx-runtime");
+var import_jsx_runtime8 = require("react/jsx-runtime");
 var NOT_OVERFLOWED2 = ':not([data-overflowed="true"])';
 var NOT_HIDDEN2 = ':not([aria-hidden="true"])';
 var useDragDropIndicator = ({
@@ -2997,18 +2997,18 @@ var useDragDropIndicator = ({
   selected,
   viewportRange
 }) => {
-  const dragDirectionRef = (0, import_react24.useRef)();
-  const dropIndicatorRef = (0, import_react24.useRef)(null);
-  const dropTargetRef = (0, import_react24.useRef)(null);
-  const dropZoneRef = (0, import_react24.useRef)("");
-  const isScrollable = (0, import_react24.useRef)(false);
-  const dragPosRef = (0, import_react24.useRef)(-1);
-  const measuredDropTargets = (0, import_react24.useRef)([]);
-  const overflowMenuShowingRef = (0, import_react24.useRef)(false);
-  const [showOverflow, setShowOverflow] = (0, import_react24.useState)(false);
-  const [dropIndicator, setDropIndicator] = (0, import_react24.useState)();
+  const dragDirectionRef = (0, import_react25.useRef)();
+  const dropIndicatorRef = (0, import_react25.useRef)(null);
+  const dropTargetRef = (0, import_react25.useRef)(null);
+  const dropZoneRef = (0, import_react25.useRef)("");
+  const isScrollable = (0, import_react25.useRef)(false);
+  const dragPosRef = (0, import_react25.useRef)(-1);
+  const measuredDropTargets = (0, import_react25.useRef)([]);
+  const overflowMenuShowingRef = (0, import_react25.useRef)(false);
+  const [showOverflow, setShowOverflow] = (0, import_react25.useState)(false);
+  const [dropIndicator, setDropIndicator] = (0, import_react25.useState)();
   const { clearSpacer, positionDropIndicator } = useDropIndicator();
-  const draggedItemRef = (0, import_react24.useRef)();
+  const draggedItemRef = (0, import_react25.useRef)();
   const fullItemQuery = `:is(${itemQuery}${NOT_OVERFLOWED2}${NOT_HIDDEN2},[data-overflow-indicator])`;
   const indexOf = (dropTarget) => measuredDropTargets.current.findIndex((d) => d.id === dropTarget.id);
   const reposition = (dropTarget, distance, indexShift) => {
@@ -3019,12 +3019,12 @@ var useDragDropIndicator = ({
       dropTarget.currentIndex += indexShift;
     }
   };
-  const rangeRef = (0, import_react24.useRef)();
+  const rangeRef = (0, import_react25.useRef)();
   rangeRef.current = viewportRange;
-  const handleScrollStart = (0, import_react24.useCallback)(() => {
+  const handleScrollStart = (0, import_react25.useCallback)(() => {
     clearSpacer();
   }, [clearSpacer]);
-  const handleScrollStop = (0, import_react24.useCallback)(
+  const handleScrollStop = (0, import_react25.useCallback)(
     (scrollDirection, _scrollPos, atEnd) => {
       const { current: container } = containerRef;
       const { current: draggedItem } = draggedItemRef;
@@ -3062,7 +3062,7 @@ var useDragDropIndicator = ({
       // setVizData,
     ]
   );
-  const beginDrag = (0, import_react24.useCallback)(
+  const beginDrag = (0, import_react25.useCallback)(
     (dragElement) => {
       if (dragElement.ariaSelected && Array.isArray(selected) && selected.length > 1) {
         console.log("its a selected element, and we have a multi select");
@@ -3108,7 +3108,7 @@ var useDragDropIndicator = ({
             height: 2
           };
           setDropIndicator(
-            /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
               Draggable,
               {
                 wrapperClassName: "dropIndicatorContainer",
@@ -3130,7 +3130,7 @@ var useDragDropIndicator = ({
       positionDropIndicator
     ]
   );
-  const drag = (0, import_react24.useCallback)(
+  const drag = (0, import_react25.useCallback)(
     (dragPos, mouseMoveDirection) => {
       const { current: currentDropTarget } = dropTargetRef;
       const { current: draggedItem } = draggedItemRef;
@@ -3176,7 +3176,7 @@ var useDragDropIndicator = ({
     },
     [containerRef, orientation, positionDropIndicator]
   );
-  const drop = (0, import_react24.useCallback)(() => {
+  const drop = (0, import_react25.useCallback)(() => {
     clearSpacer();
     const { current: draggedItem } = draggedItemRef;
     const { current: dropTarget } = dropTargetRef;
@@ -3221,7 +3221,7 @@ var useDragDropIndicator = ({
     }
     setShowOverflow(false);
   }, [clearSpacer, onDrop]);
-  const releaseDrag = (0, import_react24.useCallback)(() => {
+  const releaseDrag = (0, import_react25.useCallback)(() => {
   }, []);
   return {
     beginDrag,
@@ -3236,19 +3236,19 @@ var useDragDropIndicator = ({
 };
 
 // src/drag-drop/useDragDropNaturalMovementNext.tsx
-var import_react26 = require("react");
+var import_react27 = require("react");
 
 // src/drag-drop/useDragDisplacers.ts
-var import_react25 = require("react");
+var import_react26 = require("react");
 var useDragDisplacers = (orientation = "horizontal") => {
-  const animationFrame = (0, import_react25.useRef)(0);
-  const transitioning = (0, import_react25.useRef)(false);
-  const spacers = (0, import_react25.useMemo)(
+  const animationFrame = (0, import_react26.useRef)(0);
+  const transitioning = (0, import_react26.useRef)(false);
+  const spacers = (0, import_react26.useMemo)(
     // We only need to listen for transition end on one of the spacers
     () => [createDragSpacer(transitioning), createDragSpacer()],
     []
   );
-  const animateTransition = (0, import_react25.useCallback)(
+  const animateTransition = (0, import_react26.useCallback)(
     (size, propertyName = "width") => {
       const [spacer1, spacer2] = spacers;
       animationFrame.current = requestAnimationFrame(() => {
@@ -3261,7 +3261,7 @@ var useDragDisplacers = (orientation = "horizontal") => {
     },
     [spacers]
   );
-  const clearSpacers = (0, import_react25.useCallback)(
+  const clearSpacers = (0, import_react26.useCallback)(
     (useTransition = false) => {
       if (useTransition === true) {
         const [spacer] = spacers;
@@ -3278,13 +3278,13 @@ var useDragDisplacers = (orientation = "horizontal") => {
     },
     [animateTransition, orientation, spacers]
   );
-  const cancelAnyPendingAnimation = (0, import_react25.useCallback)(() => {
+  const cancelAnyPendingAnimation = (0, import_react26.useCallback)(() => {
     if (animationFrame.current) {
       cancelAnimationFrame(animationFrame.current);
       animationFrame.current = 0;
     }
   }, []);
-  const displaceItem = (0, import_react25.useCallback)(
+  const displaceItem = (0, import_react26.useCallback)(
     (dropTargets, dropTarget, size, useTransition = false, direction = "static") => {
       if (dropTarget) {
         const propertyName = orientation === "horizontal" ? "width" : "height";
@@ -3331,7 +3331,7 @@ var useDragDisplacers = (orientation = "horizontal") => {
       spacers
     ]
   );
-  const displaceLastItem = (0, import_react25.useCallback)(
+  const displaceLastItem = (0, import_react26.useCallback)(
     (dropTargets, dropTarget, size, useTransition = false, direction = "static") => {
       const propertyName = orientation === "horizontal" ? "width" : "height";
       const [spacer1, spacer2] = spacers;
@@ -3384,22 +3384,22 @@ var useDragDropNaturalMovement = ({
   selected,
   viewportRange
 }) => {
-  const dragDirectionRef = (0, import_react26.useRef)();
-  const isScrollable = (0, import_react26.useRef)(false);
-  const dragPosRef = (0, import_react26.useRef)(-1);
-  const measuredDropTargets = (0, import_react26.useRef)([]);
-  const overflowMenuShowingRef = (0, import_react26.useRef)(false);
-  const [showOverflow, setShowOverflow] = (0, import_react26.useState)(false);
+  const dragDirectionRef = (0, import_react27.useRef)();
+  const isScrollable = (0, import_react27.useRef)(false);
+  const dragPosRef = (0, import_react27.useRef)(-1);
+  const measuredDropTargets = (0, import_react27.useRef)([]);
+  const overflowMenuShowingRef = (0, import_react27.useRef)(false);
+  const [showOverflow, setShowOverflow] = (0, import_react27.useState)(false);
   const { clearSpacers, displaceItem, displaceLastItem } = useDragDisplacers(orientation);
-  const draggedItemRef = (0, import_react26.useRef)();
+  const draggedItemRef = (0, import_react27.useRef)();
   const fullItemQuery = `:is(${itemQuery}${NOT_OVERFLOWED}${NOT_HIDDEN},.vuuOverflowContainer-OverflowIndicator)`;
   const indexOf = (dropTarget) => measuredDropTargets.current.findIndex((d) => d.id === dropTarget.id);
-  const rangeRef = (0, import_react26.useRef)();
+  const rangeRef = (0, import_react27.useRef)();
   rangeRef.current = viewportRange;
-  const handleScrollStart = (0, import_react26.useCallback)(() => {
+  const handleScrollStart = (0, import_react27.useCallback)(() => {
     clearSpacers();
   }, [clearSpacers]);
-  const handleScrollStop = (0, import_react26.useCallback)(
+  const handleScrollStop = (0, import_react27.useCallback)(
     (scrollDirection, _scrollPos, atEnd) => {
       const { current: container } = containerRef;
       const { current: draggedItem } = draggedItemRef;
@@ -3440,7 +3440,7 @@ var useDragDropNaturalMovement = ({
     },
     [containerRef, displaceItem, displaceLastItem, fullItemQuery, orientation]
   );
-  const beginDrag = (0, import_react26.useCallback)(
+  const beginDrag = (0, import_react27.useCallback)(
     (dragElement) => {
       if (
         //TODO need a different check for selected
@@ -3519,7 +3519,7 @@ var useDragDropNaturalMovement = ({
       viewportRange
     ]
   );
-  const [showPopup, hidePopup] = (0, import_react26.useMemo)(() => {
+  const [showPopup, hidePopup] = (0, import_react27.useMemo)(() => {
     let popupShowing = false;
     const show = (dropTarget) => {
       if (!popupShowing) {
@@ -3545,7 +3545,7 @@ var useDragDropNaturalMovement = ({
     };
     return [show, hide];
   }, []);
-  const drag = (0, import_react26.useCallback)(
+  const drag = (0, import_react27.useCallback)(
     (dragPos, mouseMoveDirection) => {
       const { current: draggedItem } = draggedItemRef;
       if (draggedItem) {
@@ -3586,7 +3586,7 @@ var useDragDropNaturalMovement = ({
     },
     [containerRef, displaceItem, displaceLastItem, hidePopup, showPopup]
   );
-  const drop = (0, import_react26.useCallback)(() => {
+  const drop = (0, import_react27.useCallback)(() => {
     var _a2;
     clearSpacers();
     const { current: dropTargets } = measuredDropTargets;
@@ -3620,7 +3620,7 @@ var useDragDropNaturalMovement = ({
       }
     }
   }, [clearSpacers, containerRef, onDrop]);
-  const releaseDrag = (0, import_react26.useCallback)(() => {
+  const releaseDrag = (0, import_react27.useCallback)(() => {
     clearSpacers(true);
   }, [clearSpacers]);
   return {
@@ -3635,7 +3635,7 @@ var useDragDropNaturalMovement = ({
 };
 
 // src/drag-drop/useDragDropNext.tsx
-var import_jsx_runtime10 = require("react/jsx-runtime");
+var import_jsx_runtime9 = require("react/jsx-runtime");
 var NULL_DRAG_DROP_RESULT = {
   beginDrag: () => void 0,
   drag: () => void 0,
@@ -3675,27 +3675,27 @@ var useDragDropNext = ({
   orientation,
   ...dragDropProps
 }) => {
-  const dragBoundaries = (0, import_react27.useRef)({
+  const dragBoundaries = (0, import_react28.useRef)({
     start: 0,
     end: 0,
     contraStart: 0,
     contraEnd: 0
   });
-  const [draggableStatus, setDraggableStatus] = (0, import_react27.useState)({
+  const [draggableStatus, setDraggableStatus] = (0, import_react28.useState)({
     draggable: void 0,
     draggedItemIndex: -1,
     isDragging: false
   });
-  const dragDropStateRef = (0, import_react27.useRef)(null);
-  const mouseDownTimer = (0, import_react27.useRef)(null);
-  const isScrollableRef = (0, import_react27.useRef)(false);
-  const mousePosRef = (0, import_react27.useRef)({ x: 0, y: 0 });
-  const startPosRef = (0, import_react27.useRef)({ x: 0, y: 0 });
-  const settlingItemRef = (0, import_react27.useRef)(null);
-  const scrollableContainerRef = (0, import_react27.useRef)(null);
-  const dropPosRef = (0, import_react27.useRef)(-1);
-  const dropIndexRef = (0, import_react27.useRef)(-1);
-  const handleScrollStopRef = (0, import_react27.useRef)();
+  const dragDropStateRef = (0, import_react28.useRef)(null);
+  const mouseDownTimer = (0, import_react28.useRef)(null);
+  const isScrollableRef = (0, import_react28.useRef)(false);
+  const mousePosRef = (0, import_react28.useRef)({ x: 0, y: 0 });
+  const startPosRef = (0, import_react28.useRef)({ x: 0, y: 0 });
+  const settlingItemRef = (0, import_react28.useRef)(null);
+  const scrollableContainerRef = (0, import_react28.useRef)(null);
+  const dropPosRef = (0, import_react28.useRef)(-1);
+  const dropIndexRef = (0, import_react28.useRef)(-1);
+  const handleScrollStopRef = (0, import_react28.useRef)();
   const {
     isDragSource,
     isDropTarget,
@@ -3703,9 +3703,9 @@ var useDragDropNext = ({
     onEndOfDragOperation,
     register
   } = useDragDropProvider(id);
-  const dragMouseMoveHandlerRef = (0, import_react27.useRef)();
-  const dragMouseUpHandlerRef = (0, import_react27.useRef)();
-  const attachDragHandlers = (0, import_react27.useCallback)(() => {
+  const dragMouseMoveHandlerRef = (0, import_react28.useRef)();
+  const dragMouseUpHandlerRef = (0, import_react28.useRef)();
+  const attachDragHandlers = (0, import_react28.useCallback)(() => {
     const { current: dragMove } = dragMouseMoveHandlerRef;
     const { current: dragUp } = dragMouseUpHandlerRef;
     if (dragMove && dragUp) {
@@ -3713,7 +3713,7 @@ var useDragDropNext = ({
       document.addEventListener("mouseup", dragUp, false);
     }
   }, []);
-  const removeDragHandlers = (0, import_react27.useCallback)(() => {
+  const removeDragHandlers = (0, import_react28.useCallback)(() => {
     const { current: dragMove } = dragMouseMoveHandlerRef;
     const { current: dragUp } = dragMouseUpHandlerRef;
     if (dragMove && dragUp) {
@@ -3721,7 +3721,7 @@ var useDragDropNext = ({
       document.removeEventListener("mouseup", dragUp, false);
     }
   }, []);
-  const setDragBoundaries = (0, import_react27.useCallback)(
+  const setDragBoundaries = (0, import_react28.useCallback)(
     (containerRect, draggableRect) => {
       const { current: container } = containerRef;
       if (container) {
@@ -3740,7 +3740,7 @@ var useDragDropNext = ({
     },
     [containerRef, itemQuery, orientation]
   );
-  const terminateDrag = (0, import_react27.useCallback)(() => {
+  const terminateDrag = (0, import_react28.useCallback)(() => {
     var _a2;
     const { current: settlingItem2 } = settlingItemRef;
     settlingItemRef.current = null;
@@ -3761,7 +3761,7 @@ var useDragDropNext = ({
       (0, import_vuu_utils5.dispatchCustomEvent)(settlingItem2, "vuu-dropped");
     }
   }, [containerRef, itemQuery, onDropSettle]);
-  const getScrollDirection = (0, import_react27.useCallback)(
+  const getScrollDirection = (0, import_react28.useCallback)(
     (mousePos) => {
       if (scrollableContainerRef.current && dragDropStateRef.current) {
         const { mouseOffset } = dragDropStateRef.current;
@@ -3782,7 +3782,7 @@ var useDragDropNext = ({
     [scrollableContainerRef, orientation]
   );
   const useDragDropHook = allowDragDrop === true || allowDragDrop === "natural-movement" ? useDragDropNaturalMovement : allowDragDrop === "drop-indicator" ? useDragDropIndicator : allowDragDrop === "drag-copy" ? useDragDropCopy : noDragDrop;
-  const onScrollingStopped = (0, import_react27.useCallback)(
+  const onScrollingStopped = (0, import_react28.useCallback)(
     (scrollDirection, scrollPos, atEnd) => {
       var _a2;
       (_a2 = handleScrollStopRef.current) == null ? void 0 : _a2.call(handleScrollStopRef, scrollDirection, scrollPos, atEnd);
@@ -3794,7 +3794,7 @@ var useDragDropNext = ({
     onScrollingStopped,
     orientation
   });
-  const handleDrop = (0, import_react27.useCallback)(
+  const handleDrop = (0, import_react28.useCallback)(
     (fromIndex, toIndex, options) => {
       var _a2;
       dropPosRef.current = toIndex;
@@ -3833,7 +3833,7 @@ var useDragDropNext = ({
     orientation
   });
   handleScrollStopRef.current = handleScrollStop;
-  const dragHandedOvertoProvider = (0, import_react27.useCallback)(
+  const dragHandedOvertoProvider = (0, import_react28.useCallback)(
     (dragDistance, clientContraPos) => {
       const { CONTRA_POS } = dimensions(orientation);
       const lastClientContraPos = mousePosRef.current[CONTRA_POS];
@@ -3863,7 +3863,7 @@ var useDragDropNext = ({
       removeDragHandlers
     ]
   );
-  const dragMouseMoveHandler = (0, import_react27.useCallback)(
+  const dragMouseMoveHandler = (0, import_react28.useCallback)(
     (evt) => {
       const { CLIENT_POS, CONTRA_CLIENT_POS, POS } = dimensions(orientation);
       const { clientX, clientY } = evt;
@@ -3918,7 +3918,7 @@ var useDragDropNext = ({
       stopScrolling
     ]
   );
-  const dragMouseUpHandler = (0, import_react27.useCallback)(() => {
+  const dragMouseUpHandler = (0, import_react28.useCallback)(() => {
     removeDragHandlers();
     if (dragDropStateRef.current) {
       settlingItemRef.current = dragDropStateRef.current.draggableElement;
@@ -3932,7 +3932,7 @@ var useDragDropNext = ({
   }, [drop, removeDragHandlers]);
   dragMouseMoveHandlerRef.current = dragMouseMoveHandler;
   dragMouseUpHandlerRef.current = dragMouseUpHandler;
-  const resumeDrag = (0, import_react27.useCallback)(
+  const resumeDrag = (0, import_react28.useCallback)(
     (dragDropState) => {
       dragDropStateRef.current = dragDropState;
       const { draggableElement, mouseOffset } = dragDropState;
@@ -3952,7 +3952,7 @@ var useDragDropNext = ({
     },
     [attachDragHandlers, beginDrag, containerRef, setDragBoundaries]
   );
-  const dragStart = (0, import_react27.useCallback)(
+  const dragStart = (0, import_react28.useCallback)(
     (evt) => {
       const { target } = evt;
       const dragElement = getDraggableElement(target, itemQuery);
@@ -3980,7 +3980,7 @@ var useDragDropNext = ({
         } = dragElement;
         setDraggableStatus({
           isDragging: true,
-          draggable: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+          draggable: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
             Draggable,
             {
               element: cloneElement3(dragElement),
@@ -4009,7 +4009,7 @@ var useDragDropNext = ({
       terminateDrag
     ]
   );
-  const preDragMouseMoveHandler = (0, import_react27.useCallback)(
+  const preDragMouseMoveHandler = (0, import_react28.useCallback)(
     (evt) => {
       const { CLIENT_POS, POS } = dimensions(orientation);
       const { [CLIENT_POS]: clientPos } = evt;
@@ -4027,7 +4027,7 @@ var useDragDropNext = ({
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [containerRef, beginDrag, orientation]
   );
-  const preDragMouseUpHandler = (0, import_react27.useCallback)(() => {
+  const preDragMouseUpHandler = (0, import_react28.useCallback)(() => {
     if (mouseDownTimer.current) {
       window.clearTimeout(mouseDownTimer.current);
       mouseDownTimer.current = null;
@@ -4035,7 +4035,7 @@ var useDragDropNext = ({
     document.removeEventListener("mousemove", preDragMouseMoveHandler, false);
     document.removeEventListener("mouseup", preDragMouseUpHandler, false);
   }, [preDragMouseMoveHandler]);
-  const mouseDownHandler = (0, import_react27.useCallback)(
+  const mouseDownHandler = (0, import_react28.useCallback)(
     (evt) => {
       const { current: container } = containerRef;
       evt.stopPropagation();
@@ -4060,7 +4060,7 @@ var useDragDropNext = ({
     [containerRef, dragStart, preDragMouseMoveHandler, preDragMouseUpHandler]
   );
   const { current: settlingItem } = settlingItemRef;
-  (0, import_react27.useLayoutEffect)(() => {
+  (0, import_react28.useLayoutEffect)(() => {
     if (settlingItem && containerRef.current) {
       const dropPos = dropPosRef.current;
       const droppedItem = containerRef.current.querySelector(
@@ -4084,7 +4084,7 @@ var useDragDropNext = ({
       }
     }
   }, [containerRef, itemQuery, settlingItem, terminateDrag]);
-  (0, import_react27.useEffect)(() => {
+  (0, import_react28.useEffect)(() => {
     if (id && (isDragSource || isDropTarget)) {
       register(id, allowDragDrop === "drop-only" ? false : resumeDrag, onDrop);
     }
@@ -4106,7 +4106,7 @@ var useDragDropNext = ({
 };
 
 // src/list/useListDrop.ts
-var import_react28 = require("react");
+var import_react29 = require("react");
 var useListDrop = ({
   dataHook,
   onDrop,
@@ -4115,10 +4115,10 @@ var useListDrop = ({
   setHighlightedIndex,
   setSelected
 }) => {
-  const selectedByIndexRef = (0, import_react28.useRef)([]);
-  const dataHookRef = (0, import_react28.useRef)(dataHook);
+  const selectedByIndexRef = (0, import_react29.useRef)([]);
+  const dataHookRef = (0, import_react29.useRef)(dataHook);
   dataHookRef.current = dataHook;
-  const adjustIndex = (0, import_react28.useCallback)(
+  const adjustIndex = (0, import_react29.useCallback)(
     (index, fromIndex, toIndex) => {
       if (index === fromIndex) {
         return toIndex;
@@ -4133,7 +4133,7 @@ var useListDrop = ({
     },
     []
   );
-  const reorderSelectedIndices = (0, import_react28.useCallback)(
+  const reorderSelectedIndices = (0, import_react29.useCallback)(
     (selected2, fromIndex, toIndex) => {
       const selectedIndices = selected2.map(
         (id) => dataHookRef.current.indexOfItemById(id)
@@ -4144,7 +4144,7 @@ var useListDrop = ({
     },
     [adjustIndex]
   );
-  const handleDrop = (0, import_react28.useCallback)(
+  const handleDrop = (0, import_react29.useCallback)(
     (fromIndex, toIndex, options) => {
       if (hasSelection(selected)) {
         selectedByIndexRef.current = reorderSelectedIndices(
@@ -4168,13 +4168,13 @@ var useListDrop = ({
       onMoveListItem
     ]
   );
-  const handleDropSettle = (0, import_react28.useCallback)(
+  const handleDropSettle = (0, import_react29.useCallback)(
     (toIndex) => {
       setHighlightedIndex(toIndex);
     },
     [setHighlightedIndex]
   );
-  (0, import_react28.useEffect)(() => {
+  (0, import_react29.useEffect)(() => {
     const { current: selectedByIndex } = selectedByIndexRef;
     if (hasSelection(selectedByIndex)) {
       selectedByIndexRef.current = [];
@@ -4224,7 +4224,7 @@ var useList = ({
   tabToSelect,
   viewportRange
 }) => {
-  const lastSelection = (0, import_react29.useRef)(
+  const lastSelection = (0, import_react30.useRef)(
     selected || defaultSelected
   );
   const handleKeyboardNavigation = (evt, nextIndex) => {
@@ -4232,7 +4232,7 @@ var useList = ({
     (_b = (_a2 = selectionHook.listHandlers).onKeyboardNavigation) == null ? void 0 : _b.call(_a2, evt, nextIndex);
     onKeyboardNavigation == null ? void 0 : onKeyboardNavigation(evt, nextIndex);
   };
-  const handleSelect = (0, import_react29.useCallback)(
+  const handleSelect = (0, import_react30.useCallback)(
     (evt, selectedId) => {
       if (onSelect) {
         if (selectedId !== null) {
@@ -4242,7 +4242,7 @@ var useList = ({
     },
     [dataHook, onSelect]
   );
-  const scrollContainer = (0, import_react29.useMemo)(() => {
+  const scrollContainer = (0, import_react30.useMemo)(() => {
     var _a2, _b;
     if (scrollContainerRef) {
       return scrollContainerRef;
@@ -4252,7 +4252,7 @@ var useList = ({
       };
     }
   }, [containerRef, scrollContainerRef]);
-  const handleSelectionChange = (0, import_react29.useCallback)(
+  const handleSelectionChange = (0, import_react30.useCallback)(
     (evt, selected2) => {
       if (onSelectionChange) {
         if (isSingleSelection(selectionStrategy)) {
@@ -4299,7 +4299,7 @@ var useList = ({
     highlightedIdx: highlightedIndex,
     collectionHook: dataHook
   });
-  const handleDragStart = (0, import_react29.useCallback)(
+  const handleDragStart = (0, import_react30.useCallback)(
     (dragDropState) => {
       setHighlightedIndex(-1);
       onDragStart == null ? void 0 : onDragStart(dragDropState);
@@ -4358,7 +4358,7 @@ var useList = ({
     typeToNavigate: true,
     items: dataHook.data
   });
-  const handleKeyDown = (0, import_react29.useCallback)(
+  const handleKeyDown = (0, import_react30.useCallback)(
     (evt) => {
       var _a2, _b, _c;
       if (!evt.defaultPrevented) {
@@ -4391,7 +4391,7 @@ var useList = ({
     stickyHeaders
   });
   const isScrolling = isViewportScrolling.current || isDragDropScrolling.current;
-  const handleMouseMove = (0, import_react29.useCallback)(
+  const handleMouseMove = (0, import_react30.useCallback)(
     (evt) => {
       if (!isScrolling && !disabled && !isDragging) {
         navigationMouseMove();
@@ -4456,7 +4456,7 @@ var useList = ({
 };
 
 // src/list/useListHeight.ts
-var import_react30 = require("react");
+var import_react31 = require("react");
 var getContentHeight = (itemCount, itemHeight, itemGapSize = 0) => {
   if (itemCount === 0) {
     return 0;
@@ -4476,10 +4476,10 @@ var useListHeight = ({
   itemHeight: itemHeightProp = 36,
   size
 }) => {
-  const [measuredItemHeight, setMeasuredItemHeight] = (0, import_react30.useState)(itemHeightProp);
-  const [, forceUpdate] = (0, import_react30.useState)({});
-  const proxyItemRef = (0, import_react30.useRef)(null);
-  const [contentHeight, computedListHeight] = (0, import_react30.useMemo)(() => {
+  const [measuredItemHeight, setMeasuredItemHeight] = (0, import_react31.useState)(itemHeightProp);
+  const [, forceUpdate] = (0, import_react31.useState)({});
+  const proxyItemRef = (0, import_react31.useRef)(null);
+  const [contentHeight, computedListHeight] = (0, import_react31.useMemo)(() => {
     let result = 0;
     const itemHeight = measuredItemHeight != null ? measuredItemHeight : itemHeightProp;
     const contentHeight2 = getContentHeight(itemCount, itemHeight, itemGapSize);
@@ -4507,12 +4507,12 @@ var useListHeight = ({
     itemHeightProp,
     measuredItemHeight
   ]);
-  const handleRowHeight = (0, import_react30.useCallback)(({ height: height2 }) => {
+  const handleRowHeight = (0, import_react31.useCallback)(({ height: height2 }) => {
     if (typeof height2 === "number") {
       setMeasuredItemHeight(height2);
     }
   }, []);
-  const rowHeightProxyRef = (0, import_react30.useCallback)((el) => {
+  const rowHeightProxyRef = (0, import_react31.useCallback)((el) => {
     proxyItemRef.current = el;
     forceUpdate({});
   }, []);
@@ -4528,7 +4528,7 @@ var useListHeight = ({
 
 // src/list/useScrollPosition.ts
 var import_core8 = require("@salt-ds/core");
-var import_react31 = require("react");
+var import_react32 = require("react");
 var getRange = (scrollPos, height, itemCount, itemHeight) => {
   const viewportRowCount = Math.ceil(height / itemHeight);
   const from = Math.floor(scrollPos / itemHeight);
@@ -4547,10 +4547,10 @@ var useScrollPosition = ({
   itemSize: listItemHeight,
   onViewportScroll
 }) => {
-  const firstVisibleRowRef = (0, import_react31.useRef)(0);
-  const lastVisibleRowRef = (0, import_react31.useRef)(0);
-  const scrollPosRef = (0, import_react31.useRef)(0);
-  const range = (0, import_react31.useMemo)(() => {
+  const firstVisibleRowRef = (0, import_react32.useRef)(0);
+  const lastVisibleRowRef = (0, import_react32.useRef)(0);
+  const scrollPosRef = (0, import_react32.useRef)(0);
+  const range = (0, import_react32.useMemo)(() => {
     return getRange(
       scrollPosRef.current,
       listHeight,
@@ -4558,11 +4558,11 @@ var useScrollPosition = ({
       listItemHeight + listItemGapSize
     );
   }, [listHeight, listItemCount, listItemHeight, listItemGapSize]);
-  const [viewportRange, setViewportRange] = (0, import_react31.useState)(range);
+  const [viewportRange, setViewportRange] = (0, import_react32.useState)(range);
   (0, import_core8.useIsomorphicLayoutEffect)(() => {
     setViewportRange(range);
   }, [range]);
-  const handleVerticalScroll = (0, import_react31.useCallback)(
+  const handleVerticalScroll = (0, import_react32.useCallback)(
     (e) => {
       const scrollTop = e.target.scrollTop;
       if (scrollTop !== scrollPosRef.current) {
@@ -4597,11 +4597,11 @@ var useScrollPosition = ({
 };
 
 // src/list/List.tsx
-var import_jsx_runtime11 = require("react/jsx-runtime");
-var import_react33 = require("react");
+var import_jsx_runtime10 = require("react/jsx-runtime");
+var import_react34 = require("react");
 var defaultEmptyMessage = "No data to display";
 var classBase5 = "vuuList";
-var List = (0, import_react32.forwardRef)(function List2({
+var List = (0, import_react33.forwardRef)(function List2({
   ListItem: ListItem4 = ListItem,
   ListPlaceholder,
   allowDragDrop,
@@ -4654,11 +4654,11 @@ var List = (0, import_react32.forwardRef)(function List2({
 }, forwardedRef) {
   var _a2, _b;
   const id = (0, import_vuu_layout4.useId)(idProp);
-  const containerRef = (0, import_react32.useRef)(null);
-  const scrollContainerRef = (0, import_react32.useRef)(null);
-  const contentContainerRef = (0, import_react32.useRef)(null);
-  const [size, setSize] = (0, import_react32.useState)();
-  const handleResize = (0, import_react32.useCallback)((size2) => {
+  const containerRef = (0, import_react33.useRef)(null);
+  const scrollContainerRef = (0, import_react33.useRef)(null);
+  const contentContainerRef = (0, import_react33.useRef)(null);
+  const [size, setSize] = (0, import_react33.useState)();
+  const handleResize = (0, import_react33.useCallback)((size2) => {
     setSize(size2);
   }, []);
   const collectionHook = useCollectionItems({
@@ -4747,7 +4747,7 @@ var List = (0, import_react32.forwardRef)(function List2({
   });
   const appliedFocusVisible = focusVisibleProp != null ? focusVisibleProp : focusVisible;
   const createHeader = function createHeader2(idx, headerId, title, expanded) {
-    const header = /* @__PURE__ */ (0, import_react33.createElement)(
+    const header = /* @__PURE__ */ (0, import_react34.createElement)(
       ListItem4,
       {
         ...listItemHeaderHandlers,
@@ -4772,7 +4772,7 @@ var List = (0, import_react32.forwardRef)(function List2({
   function renderCollectionItem(list, item, idx) {
     var _a3, _b2;
     const { disabled, value, id: itemId, label } = item;
-    const isChildItem = (0, import_react32.isValidElement)(value);
+    const isChildItem = (0, import_react33.isValidElement)(value);
     const listItemProps = {
       // eslint-disable-next-line @typescript-eslint/ban-ts-comment
       // @ts-ignore until we refactor this whole section
@@ -4794,7 +4794,7 @@ var List = (0, import_react32.forwardRef)(function List2({
       showCheckbox: checkable
     };
     list.push(
-      isChildItem ? (0, import_react32.cloneElement)(value, listItemProps) : /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(ListItem4, { ...listItemProps })
+      isChildItem ? (0, import_react33.cloneElement)(value, listItemProps) : /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(ListItem4, { ...listItemProps })
     );
     idx.value += 1;
   }
@@ -4805,7 +4805,7 @@ var List = (0, import_react32.forwardRef)(function List2({
       renderCollectionItems(items, idx, idx.value + count) || []
     ) : header;
     list.push(
-      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { role: "group", children: childItems2 }, id2)
+      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { role: "group", children: childItems2 }, id2)
     );
   };
   const renderCollectionItems = (items, idx = { value: 0 }, end = items.length) => {
@@ -4826,7 +4826,7 @@ var List = (0, import_react32.forwardRef)(function List2({
   };
   function renderEmpty() {
     if (emptyMessage || showEmptyMessage) {
-      return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { className: `${classBase5}-empty-message`, children: emptyMessage != null ? emptyMessage : defaultEmptyMessage });
+      return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { className: `${classBase5}-empty-message`, children: emptyMessage != null ? emptyMessage : defaultEmptyMessage });
     } else {
       return null;
     }
@@ -4850,7 +4850,7 @@ var List = (0, import_react32.forwardRef)(function List2({
     maxWidth,
     maxHeight
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
     import_vuu_layout4.MeasuredContainer,
     {
       "aria-multiselectable": selectionStrategy === "multiple" || selectionStrategy === "extended" || selectionStrategy === "extended-multi-range" || void 0,
@@ -4872,8 +4872,8 @@ var List = (0, import_react32.forwardRef)(function List2({
       style: { ...styleProp, ...sizeStyles },
       tabIndex: listDisabled || disableFocus ? void 0 : tabIndex,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(ListItemProxy, { ref: rowHeightProxyRef, height: itemHeightProp }),
-        collectionHook.data.length === 0 && ListPlaceholder !== void 0 ? /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_jsx_runtime11.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(ListPlaceholder, {}) }) : /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: `${classBase5}-viewport`, ref: scrollContainerRef, children: /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(ListItemProxy, { ref: rowHeightProxyRef, height: itemHeightProp }),
+        collectionHook.data.length === 0 && ListPlaceholder !== void 0 ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_jsx_runtime10.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(ListPlaceholder, {}) }) : /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: `${classBase5}-viewport`, ref: scrollContainerRef, children: /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
           "div",
           {
             className: `${classBase5}-scrollingContentContainer`,
@@ -4915,10 +4915,10 @@ function clsx() {
 }
 
 // src/list/VirtualizedList.tsx
-var import_react35 = require("react");
+var import_react36 = require("react");
 
 // src/list/useVirtualization.ts
-var import_react34 = require("react");
+var import_react35 = require("react");
 
 // src/list/keyset.ts
 var KeySet = class {
@@ -4967,7 +4967,7 @@ var useVirtualization = ({
   listItemHeight,
   viewportRange
 }) => {
-  const keys = (0, import_react34.useMemo)(() => new KeySet(0, 1), []);
+  const keys = (0, import_react35.useMemo)(() => new KeySet(0, 1), []);
   const rowHeightWithGap = listItemHeight + listItemGapSize;
   const lo = Math.max(0, viewportRange.from - renderBuffer);
   const hi = Math.min(data.length, viewportRange.to + renderBuffer);
@@ -4984,11 +4984,11 @@ var useVirtualization = ({
 };
 
 // src/list/VirtualizedList.tsx
-var import_jsx_runtime12 = require("react/jsx-runtime");
+var import_jsx_runtime11 = require("react/jsx-runtime");
 var defaultEmptyMessage2 = "No data to display";
 var withBaseName2 = (0, import_core10.makePrefixer)("saltList");
-var ListItem3 = (0, import_react35.memo)(ListItem);
-var VirtualizedList = (0, import_react35.forwardRef)(function List3({
+var ListItem3 = (0, import_react36.memo)(ListItem);
+var VirtualizedList = (0, import_react36.forwardRef)(function List3({
   borderless,
   children,
   className,
@@ -5034,8 +5034,8 @@ var VirtualizedList = (0, import_react35.forwardRef)(function List3({
   ...htmlAttributes
 }, forwardedRef) {
   const id = (0, import_core10.useIdMemo)(idProp);
-  const rootRef = (0, import_react35.useRef)(null);
-  const rowHeightProxyRef = (0, import_react35.useRef)(null);
+  const rootRef = (0, import_react36.useRef)(null);
+  const rowHeightProxyRef = (0, import_react36.useRef)(null);
   const collectionHook = useCollectionItems({
     id,
     label: "List",
@@ -5109,7 +5109,7 @@ var VirtualizedList = (0, import_react35.forwardRef)(function List3({
     const [key, offset, pos, item] = row;
     const index = pos - 1;
     list.push(
-      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
         ListItem3,
         {
           "aria-setsize": collectionHook.data.length,
@@ -5142,7 +5142,7 @@ var VirtualizedList = (0, import_react35.forwardRef)(function List3({
   }
   function renderEmpty() {
     if (emptyMessage || showEmptyMessage) {
-      return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: withBaseName2("empty-message"), children: emptyMessage != null ? emptyMessage : defaultEmptyMessage2 });
+      return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { className: withBaseName2("empty-message"), children: emptyMessage != null ? emptyMessage : defaultEmptyMessage2 });
     } else {
       return null;
     }
@@ -5163,7 +5163,7 @@ var VirtualizedList = (0, import_react35.forwardRef)(function List3({
     maxWidth: maxWidth != null ? maxWidth : width,
     maxHeight: maxHeight != null ? maxHeight : listHeight
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
     "div",
     {
       ...htmlAttributes,
@@ -5176,13 +5176,13 @@ var VirtualizedList = (0, import_react35.forwardRef)(function List3({
       onScroll: onVerticalScroll,
       style: { ...styleProp, ...sizeStyles },
       tabIndex: listDisabled || disableFocus ? void 0 : 0,
-      children: /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
         "div",
         {
           className: withBaseName2("scrollingContentContainer"),
           style: { height: contentHeight },
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(ListItemProxy, { ref: rowHeightProxyRef }),
+            /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(ListItemProxy, { ref: rowHeightProxyRef }),
             renderContent()
           ]
         }
@@ -5193,12 +5193,12 @@ var VirtualizedList = (0, import_react35.forwardRef)(function List3({
 
 // src/list/RadioIcon.tsx
 var import_classnames7 = __toESM(require("classnames"));
-var import_jsx_runtime13 = require("react/jsx-runtime");
+var import_jsx_runtime12 = require("react/jsx-runtime");
 var classBase6 = "vuuRadioIcon";
 var RadioIcon = ({
   checked = false,
   ...htmlAttributes
-}) => /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+}) => /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
   "span",
   {
     ...htmlAttributes,
@@ -5208,7 +5208,7 @@ var RadioIcon = ({
 
 // src/dropdown/useDropdown.ts
 var import_core11 = require("@salt-ds/core");
-var import_react36 = require("react");
+var import_react37 = require("react");
 var useDropdown = ({
   collectionHook,
   defaultHighlightedIndex: defaultHighlightedIndexProp,
@@ -5231,7 +5231,7 @@ var useDropdown = ({
     default: defaultIsOpen != null ? defaultIsOpen : false,
     name: "useDropdownList"
   });
-  const handleSelectionChange = (0, import_react36.useCallback)(
+  const handleSelectionChange = (0, import_react37.useCallback)(
     (evt, selected2) => {
       if (!isMultiSelect) {
         setIsOpen(false);
@@ -5251,7 +5251,7 @@ var useDropdown = ({
     },
     [isMultiSelect, onOpenChange, onSelectionChange, setIsOpen]
   );
-  const handleSelect = (0, import_react36.useCallback)(
+  const handleSelect = (0, import_react37.useCallback)(
     (evt, selected2) => {
       if (!isMultiSelect) {
         setIsOpen(false);
@@ -5275,14 +5275,14 @@ var useDropdown = ({
     selectionStrategy,
     tabToSelect: !isMultiSelect
   });
-  const handleOpenChange = (0, import_react36.useCallback)(
+  const handleOpenChange = (0, import_react37.useCallback)(
     (open) => {
       setIsOpen(open);
       onOpenChange == null ? void 0 : onOpenChange(open);
     },
     [onOpenChange, setIsOpen]
   );
-  const triggerLabel = (0, import_react36.useMemo)(() => {
+  const triggerLabel = (0, import_react37.useMemo)(() => {
     if (Array.isArray(listHook.selected)) {
       const selectedItems = listHook.selected.map(
         (id) => collectionHook.itemById(id)
@@ -5306,8 +5306,8 @@ var useDropdown = ({
 };
 
 // src/dropdown/Dropdown.tsx
-var import_jsx_runtime14 = require("react/jsx-runtime");
-var Dropdown2 = (0, import_react37.forwardRef)(function Dropdown3({
+var import_jsx_runtime13 = require("react/jsx-runtime");
+var Dropdown2 = (0, import_react38.forwardRef)(function Dropdown3({
   "aria-label": ariaLabel,
   children,
   defaultIsOpen,
@@ -5328,8 +5328,8 @@ var Dropdown2 = (0, import_react37.forwardRef)(function Dropdown3({
   ...props
 }, forwardedRef) {
   const id = (0, import_vuu_layout5.useId)(idProp);
-  const rootRef = (0, import_react37.useRef)(null);
-  const listRef = (0, import_react37.useRef)(null);
+  const rootRef = (0, import_react38.useRef)(null);
+  const listRef = (0, import_react38.useRef)(null);
   const forkedRef = (0, import_core12.useForkRef)(rootRef, forwardedRef);
   const collectionHook = useCollectionItems({
     id,
@@ -5362,7 +5362,7 @@ var Dropdown2 = (0, import_react37.forwardRef)(function Dropdown3({
     selected: collectionHook.itemToCollectionItemId(selectedProp),
     selectionStrategy
   });
-  const itemIdToItem = (0, import_react37.useCallback)(
+  const itemIdToItem = (0, import_react38.useCallback)(
     (itemId) => {
       if (Array.isArray(itemId)) {
         const items = itemId.map((id2) => collectionHook.itemById(id2));
@@ -5380,7 +5380,7 @@ var Dropdown2 = (0, import_react37.forwardRef)(function Dropdown3({
     };
     if (triggerComponent) {
       const ownProps = triggerComponent.props;
-      return (0, import_react37.cloneElement)(
+      return (0, import_react38.cloneElement)(
         triggerComponent,
         forwardCallbackProps(ownProps, {
           ...dropdownListHook.isOpen ? listControlProps : {},
@@ -5388,7 +5388,7 @@ var Dropdown2 = (0, import_react37.forwardRef)(function Dropdown3({
         })
       );
     } else {
-      return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
         DropdownButton,
         {
           label: triggerLabel,
@@ -5398,7 +5398,7 @@ var Dropdown2 = (0, import_react37.forwardRef)(function Dropdown3({
       );
     }
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(CollectionProvider, { collectionHook, children: /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(CollectionProvider, { collectionHook, children: /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
     DropdownBase,
     {
       ...props,
@@ -5410,7 +5410,7 @@ var Dropdown2 = (0, import_react37.forwardRef)(function Dropdown3({
       width,
       children: [
         getTriggerComponent(),
-        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
           List,
           {
             ListItem: ListItem4,
@@ -5433,7 +5433,7 @@ var Dropdown2 = (0, import_react37.forwardRef)(function Dropdown3({
 // src/combo-box/useCombobox.ts
 var import_core13 = require("@salt-ds/core");
 var import_vuu_layout6 = require("@vuu-ui/vuu-layout");
-var import_react38 = require("react");
+var import_react39 = require("react");
 var EnterOnly = ["Enter"];
 var useCombobox = ({
   allowBackspaceClearsSelection,
@@ -5471,9 +5471,9 @@ var useCombobox = ({
 }) => {
   const isMultiSelect = isMultiSelection(selectionStrategy);
   const { data, setFilterPattern } = collectionHook;
-  const setHighlightedIndexRef = (0, import_react38.useRef)(null);
-  const selectedRef = (0, import_react38.useRef)(isMultiSelect ? [] : null);
-  const ignoreSelectOnFocus = (0, import_react38.useRef)(true);
+  const setHighlightedIndexRef = (0, import_react39.useRef)(null);
+  const selectedRef = (0, import_react39.useRef)(isMultiSelect ? [] : null);
+  const ignoreSelectOnFocus = (0, import_react39.useRef)(true);
   const [isOpen, setIsOpen] = (0, import_core13.useControlled)({
     controlled: isOpenProp,
     default: defaultIsOpen != null ? defaultIsOpen : false,
@@ -5485,15 +5485,15 @@ var useCombobox = ({
     name: "ComboBox",
     state: "value"
   });
-  const [disableAriaActiveDescendant, setDisableAriaActiveDescendant] = (0, import_react38.useState)(true);
-  const highlightSelectedItem = (0, import_react38.useCallback)((selected2) => {
+  const [disableAriaActiveDescendant, setDisableAriaActiveDescendant] = (0, import_react39.useState)(true);
+  const highlightSelectedItem = (0, import_react39.useCallback)((selected2) => {
     var _a2;
     if (Array.isArray(selected2)) {
     } else if (selected2 == null) {
       (_a2 = setHighlightedIndexRef.current) == null ? void 0 : _a2.call(setHighlightedIndexRef, -1);
     }
   }, []);
-  const setTextValue = (0, import_react38.useCallback)(
+  const setTextValue = (0, import_react39.useCallback)(
     (value2, applyFilter = true) => {
       setValue(value2);
       if (applyFilter) {
@@ -5502,7 +5502,7 @@ var useCombobox = ({
     },
     [setFilterPattern, setValue]
   );
-  const reconcileInput = (0, import_react38.useCallback)(
+  const reconcileInput = (0, import_react39.useCallback)(
     (selected2) => {
       let newValue = allowFreeText ? value != null ? value : "" : "";
       if (Array.isArray(selected2)) {
@@ -5532,7 +5532,7 @@ var useCombobox = ({
       value
     ]
   );
-  const applySelection = (0, import_react38.useCallback)(() => {
+  const applySelection = (0, import_react39.useCallback)(() => {
     const { current: selected2 } = selectedRef;
     if (reconcileInput(selected2)) {
       if (selected2) {
@@ -5550,7 +5550,7 @@ var useCombobox = ({
       }
     }
   }, [onSelectionChange, reconcileInput]);
-  const selectFreeTextInputValue = (0, import_react38.useCallback)(() => {
+  const selectFreeTextInputValue = (0, import_react39.useCallback)(() => {
     if (allowFreeText) {
       const text = value == null ? void 0 : value.trim();
       const { current: selected2 } = selectedRef;
@@ -5580,7 +5580,7 @@ var useCombobox = ({
     onSelectionChange,
     itemToString2
   ]);
-  const handleOpenChange = (0, import_react38.useCallback)(
+  const handleOpenChange = (0, import_react39.useCallback)(
     (open, closeReason) => {
       if (open && isMultiSelect) {
         setTextValue("", false);
@@ -5602,7 +5602,7 @@ var useCombobox = ({
       setTextValue
     ]
   );
-  const handleSelectionChange = (0, import_react38.useCallback)(
+  const handleSelectionChange = (0, import_react39.useCallback)(
     (evt, selected2) => {
       selectedRef.current = selected2;
       if (!isMultiSelect) {
@@ -5611,7 +5611,7 @@ var useCombobox = ({
     },
     [handleOpenChange, isMultiSelect]
   );
-  const handleKeyboardNavigation = (0, import_react38.useCallback)(() => {
+  const handleKeyboardNavigation = (0, import_react39.useCallback)(() => {
     setDisableAriaActiveDescendant(false);
   }, []);
   const {
@@ -5639,7 +5639,7 @@ var useCombobox = ({
   });
   setHighlightedIndexRef.current = setHighlightedIndex;
   const { onClick: listHandlersOnClick } = listHookListHandlers;
-  const handleListClick = (0, import_react38.useCallback)(
+  const handleListClick = (0, import_react39.useCallback)(
     (evt) => {
       var _a2;
       (_a2 = document.getElementById(`${id}-input`)) == null ? void 0 : _a2.focus();
@@ -5647,7 +5647,7 @@ var useCombobox = ({
     },
     [id, listHandlersOnClick]
   );
-  const handleInputChange = (0, import_react38.useCallback)(
+  const handleInputChange = (0, import_react39.useCallback)(
     (evt) => {
       const newValue = evt.target.value;
       setValue(newValue);
@@ -5660,7 +5660,7 @@ var useCombobox = ({
     },
     [setFilterPattern, setIsOpen, setValue]
   );
-  const handleInputKeyDown = (0, import_react38.useCallback)(
+  const handleInputKeyDown = (0, import_react39.useCallback)(
     (e) => {
       if (e.key === "Backspace" && allowBackspaceClearsSelection) {
         selectedRef.current = null;
@@ -5671,7 +5671,7 @@ var useCombobox = ({
   );
   const { onFocus: inputOnFocus = onFocus } = inputProps;
   const { onFocus: listOnFocus } = listControlProps;
-  const handleInputFocus = (0, import_react38.useCallback)(
+  const handleInputFocus = (0, import_react39.useCallback)(
     (evt) => {
       setDisableAriaActiveDescendant(false);
       listOnFocus == null ? void 0 : listOnFocus(evt);
@@ -5679,7 +5679,7 @@ var useCombobox = ({
     },
     [inputOnFocus, listOnFocus]
   );
-  const listFocused = (0, import_react38.useCallback)(
+  const listFocused = (0, import_react39.useCallback)(
     (evt) => {
       const element = evt.relatedTarget;
       return (element == null ? void 0 : element.id) === `${id}-list`;
@@ -5688,7 +5688,7 @@ var useCombobox = ({
   );
   const { onBlur: inputOnBlur = onBlur } = inputProps;
   const { onBlur: listOnBlur } = listControlProps;
-  const handleInputBlur = (0, import_react38.useCallback)(
+  const handleInputBlur = (0, import_react39.useCallback)(
     (evt) => {
       if (listFocused(evt)) {
       } else {
@@ -5701,7 +5701,7 @@ var useCombobox = ({
     [listFocused, listOnBlur, inputOnBlur]
   );
   const { onSelect: inputOnSelect } = inputProps;
-  const handleInputSelect = (0, import_react38.useCallback)(
+  const handleInputSelect = (0, import_react39.useCallback)(
     (event) => {
       if (ignoreSelectOnFocus.current) {
         ignoreSelectOnFocus.current = false;
@@ -5763,16 +5763,16 @@ var useCombobox = ({
 
 // src/list/ChevronIcon.tsx
 var import_classnames8 = __toESM(require("classnames"));
-var import_jsx_runtime15 = require("react/jsx-runtime");
+var import_jsx_runtime14 = require("react/jsx-runtime");
 var classBase7 = "vuuChevronIcon";
 var ChevronIcon = (props) => {
   const { direction, ...htmlAttributes } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { ...htmlAttributes, className: (0, import_classnames8.default)(classBase7, direction) });
+  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { ...htmlAttributes, className: (0, import_classnames8.default)(classBase7, direction) });
 };
 
 // src/combo-box/ComboBox.tsx
-var import_jsx_runtime16 = require("react/jsx-runtime");
-var ComboBox = (0, import_react39.forwardRef)(function Combobox({
+var import_jsx_runtime15 = require("react/jsx-runtime");
+var ComboBox = (0, import_react40.forwardRef)(function Combobox({
   InputProps: InputProps4,
   ListProps: ListProps3,
   PopupProps,
@@ -5809,7 +5809,7 @@ var ComboBox = (0, import_react39.forwardRef)(function Combobox({
   ...props
 }, forwardedRef) {
   const id = (0, import_vuu_layout7.useId)(idProp);
-  const listRef = (0, import_react39.useRef)(null);
+  const listRef = (0, import_react40.useRef)(null);
   const valueFromSelected = (item) => {
     return Array.isArray(item) && item.length > 0 ? item[0] : void 0;
   };
@@ -5869,21 +5869,21 @@ var ComboBox = (0, import_react39.forwardRef)(function Combobox({
     selectionStrategy,
     value: initialValue
   });
-  const handleDropdownIconClick = (0, import_react39.useCallback)(() => {
+  const handleDropdownIconClick = (0, import_react40.useCallback)(() => {
     if (isOpen) {
       onOpenChange(false, "toggle");
     } else {
       onOpenChange(true);
     }
   }, [isOpen, onOpenChange]);
-  const endAdornment = endAdornmentProp === null ? null : /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+  const endAdornment = endAdornmentProp === null ? null : /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
     ChevronIcon,
     {
       direction: isOpen ? "up" : "down",
       onClick: handleDropdownIconClick
     }
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(CollectionProvider, { collectionHook, children: /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(CollectionProvider, { collectionHook, children: /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
     DropdownBase,
     {
       ...props,
@@ -5895,7 +5895,7 @@ var ComboBox = (0, import_react39.forwardRef)(function Combobox({
       ref: forwardedRef,
       width,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
           import_core14.Input,
           {
             ...inputProps,
@@ -5904,7 +5904,7 @@ var ComboBox = (0, import_react39.forwardRef)(function Combobox({
             endAdornment
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
           List,
           {
             ...ListProps3,
@@ -5929,8 +5929,8 @@ var ComboBox = (0, import_react39.forwardRef)(function Combobox({
 // src/cycle-state-button/CycleStateButton.tsx
 var import_core15 = require("@salt-ds/core");
 var import_classnames9 = __toESM(require("classnames"));
-var import_react40 = require("react");
-var import_jsx_runtime17 = require("react/jsx-runtime");
+var import_react41 = require("react");
+var import_jsx_runtime16 = require("react/jsx-runtime");
 var classBase8 = "vuuCycleStateButton";
 var getNextValue = (value, valueList) => {
   const index = valueList.indexOf(value.toUpperCase());
@@ -5940,14 +5940,14 @@ var getNextValue = (value, valueList) => {
     return valueList[index + 1];
   }
 };
-var CycleStateButton = (0, import_react40.forwardRef)(function CycleStateButton2({
+var CycleStateButton = (0, import_react41.forwardRef)(function CycleStateButton2({
   className,
   onCommit,
   value = "",
   values,
   ...buttonProps
 }, forwardedRef) {
-  const handleClick = (0, import_react40.useCallback)(
+  const handleClick = (0, import_react41.useCallback)(
     (evt) => {
       const nextValue = getNextValue(value, values);
       onCommit(evt, nextValue).then((response) => {
@@ -5958,7 +5958,7 @@ var CycleStateButton = (0, import_react40.forwardRef)(function CycleStateButton2
     },
     [onCommit, value, values]
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
     import_core15.Button,
     {
       ...buttonProps,
@@ -6010,7 +6010,7 @@ function applyRules(rules, value) {
 // src/editable/useEditableText.ts
 var import_vuu_layout8 = require("@vuu-ui/vuu-layout");
 var import_vuu_utils7 = require("@vuu-ui/vuu-utils");
-var import_react41 = require("react");
+var import_react42 = require("react");
 var WarnCommit = () => {
   console.warn(
     "onCommit handler has not been provided to InputCell cell renderer"
@@ -6023,15 +6023,15 @@ var useEditableText = ({
   onCommit,
   type
 }) => {
-  const [message, setMessage] = (0, import_react41.useState)();
-  const [value, setValue] = (0, import_react41.useState)(initialValue);
-  const initialValueRef = (0, import_react41.useRef)(initialValue);
-  const isDirtyRef = (0, import_react41.useRef)(false);
-  const hasCommittedRef = (0, import_react41.useRef)(false);
+  const [message, setMessage] = (0, import_react42.useState)();
+  const [value, setValue] = (0, import_react42.useState)(initialValue);
+  const initialValueRef = (0, import_react42.useRef)(initialValue);
+  const isDirtyRef = (0, import_react42.useRef)(false);
+  const hasCommittedRef = (0, import_react42.useRef)(false);
   (0, import_vuu_layout8.useLayoutEffectSkipFirst)(() => {
     setValue(initialValue);
   }, [initialValue]);
-  const commit = (0, import_react41.useCallback)(
+  const commit = (0, import_react42.useCallback)(
     (target) => {
       if (isDirtyRef.current) {
         hasCommittedRef.current = true;
@@ -6057,7 +6057,7 @@ var useEditableText = ({
     },
     [clientSideEditValidationCheck, onCommit, value]
   );
-  const handleKeyDown = (0, import_react41.useCallback)(
+  const handleKeyDown = (0, import_react42.useCallback)(
     (evt) => {
       if (evt.key === "Enter") {
         commit(evt.target);
@@ -6073,7 +6073,7 @@ var useEditableText = ({
     },
     [commit]
   );
-  const handleBlur = (0, import_react41.useCallback)(
+  const handleBlur = (0, import_react42.useCallback)(
     (evt) => {
       if (isDirtyRef.current) {
         commit(evt.target);
@@ -6081,7 +6081,7 @@ var useEditableText = ({
     },
     [commit]
   );
-  const handleChange = (0, import_react41.useCallback)(
+  const handleChange = (0, import_react42.useCallback)(
     (evt) => {
       let typedValue = evt.target.value;
       if (type === "number" && !isNaN(parseFloat(typedValue))) {
@@ -6111,11 +6111,11 @@ var useEditableText = ({
 
 // src/editable-label/EditableLabel.tsx
 var import_classnames10 = __toESM(require("classnames"));
-var import_react42 = require("react");
+var import_react43 = require("react");
 var import_core16 = require("@salt-ds/core");
-var import_jsx_runtime18 = require("react/jsx-runtime");
+var import_jsx_runtime17 = require("react/jsx-runtime");
 var classBase9 = "vuuEditableLabel";
-var EditableLabel = (0, import_react42.forwardRef)(function EditableLabel2({
+var EditableLabel = (0, import_react43.forwardRef)(function EditableLabel2({
   className: classNameProp,
   defaultEditing,
   defaultValue,
@@ -6126,8 +6126,8 @@ var EditableLabel = (0, import_react42.forwardRef)(function EditableLabel2({
   value: valueProp,
   ...restProps
 }, forwardedRef) {
-  const inputRef = (0, import_react42.useRef)(null);
-  const editingRef = (0, import_react42.useRef)(false);
+  const inputRef = (0, import_react43.useRef)(null);
+  const editingRef = (0, import_react43.useRef)(false);
   const [value, setValue] = (0, import_core16.useControlled)({
     controlled: valueProp,
     default: defaultValue != null ? defaultValue : "",
@@ -6140,14 +6140,14 @@ var EditableLabel = (0, import_react42.forwardRef)(function EditableLabel2({
     name: "EditableLabel",
     state: "editing"
   });
-  const setEditing = (0, import_react42.useCallback)(
+  const setEditing = (0, import_react43.useCallback)(
     (value2) => {
       _setEditing(editingRef.current = value2);
     },
     [_setEditing]
   );
-  const initialValue = (0, import_react42.useRef)(value);
-  (0, import_react42.useLayoutEffect)(() => {
+  const initialValue = (0, import_react43.useRef)(value);
+  (0, import_react43.useLayoutEffect)(() => {
     if (editing) {
       if (inputRef.current !== null) {
         inputRef.current.select();
@@ -6155,7 +6155,7 @@ var EditableLabel = (0, import_react42.forwardRef)(function EditableLabel2({
       }
     }
   }, [editing, inputRef]);
-  const enterEditMode = (0, import_react42.useCallback)(() => {
+  const enterEditMode = (0, import_react43.useCallback)(() => {
     setEditing(true);
     onEnterEditMode && onEnterEditMode();
   }, [onEnterEditMode, setEditing]);
@@ -6200,7 +6200,7 @@ var EditableLabel = (0, import_react42.forwardRef)(function EditableLabel2({
   const className = (0, import_classnames10.default)(classBase9, classNameProp, {
     [`${classBase9}-editing`]: editing
   });
-  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
     "div",
     {
       ...restProps,
@@ -6208,7 +6208,7 @@ var EditableLabel = (0, import_react42.forwardRef)(function EditableLabel2({
       onDoubleClick: handleDoubleClick,
       "data-text": value,
       ref: forwardedRef,
-      children: editing ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+      children: editing ? /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
         import_core16.Input,
         {
           inputProps: { className: `${classBase9}-input`, spellCheck: false },
@@ -6221,18 +6221,18 @@ var EditableLabel = (0, import_react42.forwardRef)(function EditableLabel2({
           textAlign: "left",
           variant: "secondary"
         }
-      ) : /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { className: `${classBase9}-label`, children: value })
+      ) : /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: `${classBase9}-label`, children: value })
     }
   );
 });
 
 // src/expando-input/ExpandoInput.tsx
 var import_classnames11 = __toESM(require("classnames"));
-var import_react43 = require("react");
-var import_jsx_runtime19 = require("react/jsx-runtime");
+var import_react44 = require("react");
+var import_jsx_runtime18 = require("react/jsx-runtime");
 var classBase10 = "vuuExpandoInput";
 var noop = () => void 0;
-var ExpandoInput = (0, import_react43.forwardRef)(function ExpandoInput2({
+var ExpandoInput = (0, import_react44.forwardRef)(function ExpandoInput2({
   className: classNameProp,
   errorMessage,
   value,
@@ -6240,14 +6240,14 @@ var ExpandoInput = (0, import_react43.forwardRef)(function ExpandoInput2({
   onCommit = noop,
   ...props
 }, forwardedRef) {
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
     "div",
     {
       className: (0, import_classnames11.default)(classBase10, classNameProp, {
         [`${classBase10}-error`]: errorMessage
       }),
       "data-text": value,
-      children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
         VuuInput,
         {
           ...props,
@@ -6266,17 +6266,17 @@ var ExpandoInput = (0, import_react43.forwardRef)(function ExpandoInput2({
 });
 
 // src/inputs/Checkbox.tsx
-var import_jsx_runtime20 = require("react/jsx-runtime");
+var import_jsx_runtime19 = require("react/jsx-runtime");
 var Checkbox = (props) => {
   const { onToggle, checked, label } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
     "div",
     {
       className: "vuuCheckbox",
       onClick: onToggle,
       onKeyUp: (e) => e.key === " " && onToggle(),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(CheckboxIcon, { tabIndex: 0, checked }),
+        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(CheckboxIcon, { tabIndex: 0, checked }),
         label
       ]
     }
@@ -6284,13 +6284,13 @@ var Checkbox = (props) => {
 };
 
 // src/inputs/RadioButton.tsx
-var import_jsx_runtime21 = require("react/jsx-runtime");
+var import_jsx_runtime20 = require("react/jsx-runtime");
 var RadioButton = (props) => {
   const { onClick, checked, label, groupName } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "vuuRadioButton", onClick, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "radio", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("input", { type: "radio", name: groupName }),
-      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(RadioIcon, { checked })
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "vuuRadioButton", onClick, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "radio", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("input", { type: "radio", name: groupName }),
+      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(RadioIcon, { checked })
     ] }),
     label
   ] });
@@ -6300,11 +6300,11 @@ var RadioButton = (props) => {
 var import_vuu_layout9 = require("@vuu-ui/vuu-layout");
 var import_vuu_table2 = require("@vuu-ui/vuu-table");
 var import_core17 = require("@salt-ds/core");
-var import_react45 = require("react");
+var import_react46 = require("react");
 
 // src/instrument-picker/SearchCell.tsx
 var import_vuu_utils8 = require("@vuu-ui/vuu-utils");
-var import_jsx_runtime22 = require("react/jsx-runtime");
+var import_jsx_runtime21 = require("react/jsx-runtime");
 var classBase11 = "vuuSearchCell";
 var SearchCell = ({
   column,
@@ -6313,8 +6313,8 @@ var SearchCell = ({
 }) => {
   const key = columnMap[column.name];
   const value = row[key];
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: classBase11, tabIndex: -1, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { "data-icon": "draggable" }),
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: classBase11, tabIndex: -1, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { "data-icon": "draggable" }),
     value
   ] });
 };
@@ -6324,7 +6324,7 @@ var SearchCell = ({
 
 // src/instrument-picker/useInstrumentPicker.ts
 var import_vuu_table = require("@vuu-ui/vuu-table");
-var import_react44 = require("react");
+var import_react45 = require("react");
 var defaultItemToString = (columns, columnMap) => (row) => {
   return columns.map(({ name }) => row[columnMap[name]]).join(" ");
 };
@@ -6339,26 +6339,26 @@ var useInstrumentPicker = ({
   onSelect,
   searchColumns
 }) => {
-  const [value, setValue] = (0, import_react44.useState)("");
+  const [value, setValue] = (0, import_react45.useState)("");
   const [isOpen, setIsOpen] = useControlled({
     controlled: isOpenProp,
     default: defaultIsOpen != null ? defaultIsOpen : false,
     name: "useDropdownList"
   });
   const { highlightedIndexRef, onKeyDown, tableRef } = (0, import_vuu_table.useControlledTableNavigation)(-1, dataSource.size);
-  const baseFilterPattern = (0, import_react44.useMemo)(
+  const baseFilterPattern = (0, import_react45.useMemo)(
     // TODO make this contains once server supports it
     () => searchColumns.map((col) => `${col} starts "__VALUE__"`).join(" or "),
     [searchColumns]
   );
-  const handleOpenChange = (0, import_react44.useCallback)(
+  const handleOpenChange = (0, import_react45.useCallback)(
     (open, closeReason) => {
       setIsOpen(open);
       onOpenChange == null ? void 0 : onOpenChange(open, closeReason);
     },
     [onOpenChange, setIsOpen]
   );
-  const handleInputChange = (0, import_react44.useCallback)(
+  const handleInputChange = (0, import_react45.useCallback)(
     (evt) => {
       const { value: value2 } = evt.target;
       setValue(value2);
@@ -6376,7 +6376,7 @@ var useInstrumentPicker = ({
     },
     [baseFilterPattern, dataSource, setIsOpen]
   );
-  const handleSelectRow = (0, import_react44.useCallback)(
+  const handleSelectRow = (0, import_react45.useCallback)(
     (row) => {
       const value2 = itemToString2(row);
       setValue(value2);
@@ -6407,9 +6407,9 @@ var useInstrumentPicker = ({
 };
 
 // src/instrument-picker/InstrumentPicker.tsx
-var import_jsx_runtime23 = require("react/jsx-runtime");
+var import_jsx_runtime22 = require("react/jsx-runtime");
 var classBase12 = "vuuInstrumentPicker";
-var InstrumentPicker = (0, import_react45.forwardRef)(function InstrumentPicker2({
+var InstrumentPicker = (0, import_react46.forwardRef)(function InstrumentPicker2({
   TableProps: { dataSource, ...TableProps3 },
   className,
   columnMap,
@@ -6441,7 +6441,7 @@ var InstrumentPicker = (0, import_react45.forwardRef)(function InstrumentPicker2
     onSelect,
     searchColumns
   });
-  const endAdornment = (0, import_react45.useMemo)(() => /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { "data-icon": "chevron-down" }), []);
+  const endAdornment = (0, import_react46.useMemo)(() => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { "data-icon": "chevron-down" }), []);
   const tableProps = {
     ...TableProps3,
     config: {
@@ -6449,7 +6449,7 @@ var InstrumentPicker = (0, import_react45.forwardRef)(function InstrumentPicker2
       zebraStripes: false
     }
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
     DropdownBase,
     {
       ...htmlAttributes,
@@ -6462,7 +6462,7 @@ var InstrumentPicker = (0, import_react45.forwardRef)(function InstrumentPicker2
       ref: forwardedRef,
       width,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
           import_core17.Input,
           {
             ...inputProps,
@@ -6471,7 +6471,7 @@ var InstrumentPicker = (0, import_react45.forwardRef)(function InstrumentPicker2
             value
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
           import_vuu_table2.Table,
           {
             rowHeight: 25,
@@ -6497,11 +6497,11 @@ var import_vuu_layout20 = require("@vuu-ui/vuu-layout");
 var import_vuu_table3 = require("@vuu-ui/vuu-table");
 var import_core25 = require("@salt-ds/core");
 var import_classnames23 = __toESM(require("classnames"));
-var import_react73 = require("react");
+var import_react74 = require("react");
 
 // src/instrument-search/SearchCell.tsx
 var import_vuu_utils9 = require("@vuu-ui/vuu-utils");
-var import_jsx_runtime24 = require("react/jsx-runtime");
+var import_jsx_runtime23 = require("react/jsx-runtime");
 var classBase13 = "vuuSearchCell";
 var SearchCell2 = ({
   column,
@@ -6510,8 +6510,8 @@ var SearchCell2 = ({
 }) => {
   const key = columnMap[column.name];
   const value = row[key];
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: classBase13, tabIndex: -1, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { "data-icon": "draggable" }),
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: classBase13, tabIndex: -1, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { "data-icon": "draggable" }),
     value
   ] });
 };
@@ -6524,54 +6524,54 @@ var import_vuu_data8 = require("@vuu-ui/vuu-data");
 
 // ../vuu-data-react/src/hooks/useDataSource.ts
 var import_vuu_utils10 = require("@vuu-ui/vuu-utils");
-var import_react46 = require("react");
+var import_react47 = require("react");
 var { SELECTED } = import_vuu_utils10.metadataKeys;
 
 // ../vuu-data-react/src/hooks/useLookupValues.ts
 var import_vuu_data3 = require("@vuu-ui/vuu-data");
 
 // ../vuu-shell/src/app-header/AppHeader.tsx
-var import_react49 = require("react");
+var import_react50 = require("react");
 var import_classnames13 = __toESM(require("classnames"));
 var import_vuu_layout10 = require("@vuu-ui/vuu-layout");
 
 // ../vuu-shell/src/login/LoginPanel.tsx
-var import_react48 = require("react");
+var import_react49 = require("react");
 var import_core18 = require("@salt-ds/core");
 
 // ../vuu-shell/src/login/VuuLogo.tsx
-var import_react47 = require("react");
-var import_jsx_runtime25 = require("react/jsx-runtime");
+var import_react48 = require("react");
+var import_jsx_runtime24 = require("react/jsx-runtime");
 
 // ../vuu-shell/src/login/LoginPanel.tsx
 var import_classnames12 = __toESM(require("classnames"));
-var import_jsx_runtime26 = require("react/jsx-runtime");
+var import_jsx_runtime25 = require("react/jsx-runtime");
 
 // ../vuu-shell/src/login/login-utils.ts
 var import_vuu_utils11 = require("@vuu-ui/vuu-utils");
 
 // ../vuu-shell/src/app-header/AppHeader.tsx
 var import_core19 = require("@salt-ds/core");
-var import_jsx_runtime27 = require("react/jsx-runtime");
+var import_jsx_runtime26 = require("react/jsx-runtime");
 
 // ../vuu-shell/src/connection-status/ConnectionStatusIcon.tsx
-var import_react50 = __toESM(require("react"));
+var import_react51 = __toESM(require("react"));
 var import_classnames14 = __toESM(require("classnames"));
-var import_jsx_runtime28 = require("react/jsx-runtime");
+var import_jsx_runtime27 = require("react/jsx-runtime");
 
 // ../vuu-shell/src/density-switch/DensitySwitch.tsx
-var import_react51 = require("react");
+var import_react52 = require("react");
 var import_classnames15 = __toESM(require("classnames"));
-var import_jsx_runtime29 = require("react/jsx-runtime");
+var import_jsx_runtime28 = require("react/jsx-runtime");
 
 // ../vuu-shell/src/feature/Feature.tsx
-var import_react53 = __toESM(require("react"));
+var import_react54 = __toESM(require("react"));
 var import_vuu_layout11 = require("@vuu-ui/vuu-layout");
 
 // ../vuu-shell/src/feature/FeatureErrorBoundary.tsx
-var import_react52 = __toESM(require("react"));
-var import_jsx_runtime30 = require("react/jsx-runtime");
-var FeatureErrorBoundary = class extends import_react52.default.Component {
+var import_react53 = __toESM(require("react"));
+var import_jsx_runtime29 = require("react/jsx-runtime");
+var FeatureErrorBoundary = class extends import_react53.default.Component {
   constructor(props) {
     super(props);
     this.state = { errorMessage: null };
@@ -6585,9 +6585,9 @@ var FeatureErrorBoundary = class extends import_react52.default.Component {
   }
   render() {
     if (this.state.errorMessage) {
-      return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_jsx_runtime30.Fragment, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("h1", { children: "An error occured while creating component." }),
-        /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("p", { children: this.state.errorMessage })
+      return /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(import_jsx_runtime29.Fragment, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("h1", { children: "An error occured while creating component." }),
+        /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("p", { children: this.state.errorMessage })
       ] });
     }
     return this.props.children;
@@ -6595,8 +6595,8 @@ var FeatureErrorBoundary = class extends import_react52.default.Component {
 };
 
 // ../vuu-shell/src/feature/Loader.tsx
-var import_jsx_runtime31 = require("react/jsx-runtime");
-var Loader = () => /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("div", { className: "hwLoader" });
+var import_jsx_runtime30 = require("react/jsx-runtime");
+var Loader = () => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("div", { className: "hwLoader" });
 
 // ../vuu-shell/src/feature/css-module-loader.ts
 var importCSS = async (path) => {
@@ -6605,10 +6605,10 @@ var importCSS = async (path) => {
 };
 
 // ../vuu-shell/src/feature/Feature.tsx
-var import_jsx_runtime32 = require("react/jsx-runtime");
+var import_jsx_runtime31 = require("react/jsx-runtime");
 var componentsMap = /* @__PURE__ */ new Map();
 var useCachedFeature = (url) => {
-  (0, import_react53.useEffect)(
+  (0, import_react54.useEffect)(
     () => () => {
       componentsMap.delete(url);
     },
@@ -6617,7 +6617,7 @@ var useCachedFeature = (url) => {
   if (!componentsMap.has(url)) {
     componentsMap.set(
       url,
-      import_react53.default.lazy(() => import(
+      import_react54.default.lazy(() => import(
         /* @vite-ignore */
         url
       ))
@@ -6645,26 +6645,26 @@ function RawFeature({
     });
   }
   const LazyFeature = useCachedFeature(url);
-  return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(FeatureErrorBoundary, { url, children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react53.Suspense, { fallback: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(Loader, {}), children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(LazyFeature, { ...props, ...params }) }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(FeatureErrorBoundary, { url, children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react54.Suspense, { fallback: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(Loader, {}), children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(LazyFeature, { ...props, ...params }) }) });
 }
-var Feature = import_react53.default.memo(RawFeature);
+var Feature = import_react54.default.memo(RawFeature);
 Feature.displayName = "Feature";
 (0, import_vuu_layout11.registerComponent)("Feature", Feature, "view");
 
 // ../vuu-shell/src/layout-management/SaveLayoutPanel.tsx
-var import_react54 = require("react");
+var import_react55 = require("react");
 var import_core20 = require("@salt-ds/core");
 var import_vuu_utils12 = require("@vuu-ui/vuu-utils");
-var import_jsx_runtime33 = require("react/jsx-runtime");
+var import_jsx_runtime32 = require("react/jsx-runtime");
 var classBase14 = "saveLayoutPanel";
 var formField = `${classBase14}-formField`;
 
 // ../vuu-shell/src/layout-management/useLayoutManager.tsx
-var import_react55 = __toESM(require("react"));
+var import_react56 = __toESM(require("react"));
 var import_vuu_layout12 = require("@vuu-ui/vuu-layout");
 var import_vuu_popups3 = require("@vuu-ui/vuu-popups");
-var import_jsx_runtime34 = require("react/jsx-runtime");
-var LayoutManagementContext = import_react55.default.createContext({
+var import_jsx_runtime33 = require("react/jsx-runtime");
+var LayoutManagementContext = import_react56.default.createContext({
   getApplicationSettings: () => void 0,
   layoutMetadata: [],
   saveLayout: () => void 0,
@@ -6676,13 +6676,13 @@ var LayoutManagementContext = import_react55.default.createContext({
 });
 
 // ../vuu-shell/src/layout-management/LayoutList.tsx
-var import_jsx_runtime35 = require("react/jsx-runtime");
+var import_jsx_runtime34 = require("react/jsx-runtime");
 
 // ../vuu-icons/src/VuuLogo.tsx
-var import_react56 = require("react");
-var import_jsx_runtime36 = require("react/jsx-runtime");
-var VuuLogo2 = (0, import_react56.memo)(() => {
-  return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(
+var import_react57 = require("react");
+var import_jsx_runtime35 = require("react/jsx-runtime");
+var VuuLogo2 = (0, import_react57.memo)(() => {
+  return /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(
     "svg",
     {
       width: "44",
@@ -6691,44 +6691,44 @@ var VuuLogo2 = (0, import_react56.memo)(() => {
       fill: "none",
       xmlns: "http://www.w3.org/2000/svg",
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("g", { clipPath: "url(#clip0_217_6990)", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("g", { clipPath: "url(#clip0_217_6990)", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
             "path",
             {
               d: "M39.8642 15.5509L35.9196 7.58974L34.3369 6.85464L24.6235 22.0825L39.1628 30.618L42.3152 25.6347L39.8642 15.5509Z",
               fill: "url(#paint0_linear_217_6990)"
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
             "path",
             {
               d: "M42.6246 24.8716C41.9199 25.9157 40.9625 26.824 39.767 27.4905C38.424 28.2396 36.9563 28.597 35.5081 28.597C32.7541 28.597 30.0715 27.3094 28.4466 24.9855L15.772 3.90967L15.7655 3.9206C13.3615 0.137431 8.25372 -1.13143 4.24754 1.10507C0.178173 3.37435 -1.20852 8.39359 1.14854 12.3125L18.3445 40.9095C19.1108 42.1846 20.1816 43.1834 21.4144 43.8764C21.4241 43.8826 21.4338 43.8889 21.4435 43.8951C21.4484 43.8982 21.4549 43.9013 21.4597 43.9045C22.0332 44.2228 22.6423 44.471 23.2725 44.6536C23.3194 44.6677 23.368 44.6817 23.415 44.6942C23.6418 44.7551 23.8702 44.8097 24.1019 44.8534C24.1456 44.8612 24.1894 44.8659 24.2331 44.8737C24.4194 44.9049 24.6073 44.9314 24.7952 44.9501C24.8698 44.9579 24.9443 44.9658 25.0188 44.9704C25.2342 44.9876 25.4497 44.9985 25.6668 45.0001C25.6781 45.0001 25.6895 45.0001 25.6992 45.0001C25.7024 45.0001 25.704 45.0001 25.7073 45.0001C25.7105 45.0001 25.7121 45.0001 25.7154 45.0001C25.9503 45.0001 26.1868 44.9876 26.4217 44.9689C26.4751 44.9642 26.5286 44.9595 26.5837 44.9533C26.8137 44.9299 27.0438 44.9002 27.2738 44.8596C27.277 44.8596 27.2803 44.8596 27.2835 44.8596C27.5362 44.8144 27.7889 44.7551 28.0384 44.6864C28.0546 44.6817 28.0692 44.677 28.0854 44.6723C28.4483 44.5709 28.8063 44.4445 29.1594 44.2931C29.1659 44.29 29.174 44.2868 29.1805 44.2837C29.4494 44.1682 29.7151 44.0418 29.9759 43.8967C30.24 43.75 30.491 43.5908 30.7308 43.4206C30.9398 43.2739 31.1407 43.1179 31.3367 42.9524C31.5748 42.7495 31.8 42.5373 32.009 42.3141C32.1661 42.1471 32.3168 41.9723 32.4609 41.7913C32.5079 41.732 32.5517 41.6711 32.5954 41.6118C32.6942 41.4807 32.7882 41.3465 32.8789 41.2091C32.9259 41.1373 32.9728 41.0671 33.0182 40.9953C33.036 40.9672 33.0555 40.9407 33.0717 40.9126L42.7153 24.8763H42.6214L42.6246 24.8716Z",
               fill: "url(#paint1_linear_217_6990)"
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
             "path",
             {
               d: "M42.8402 16.4218L42.1112 15.2232L38.9636 9.58433L37.504 7.19644C37.2286 6.56123 36.579 6.11331 35.8176 6.11331C34.8083 6.11331 33.9919 6.90147 33.9919 7.87223C33.9919 8.20154 34.0907 8.50432 34.2543 8.76808L34.2349 8.78056L39.9048 18.0808C40.5884 19.2186 40.7715 20.5437 40.4199 21.8141C40.0684 23.0845 39.226 24.1458 38.045 24.806C37.2675 25.2398 36.3846 25.4693 35.4936 25.4693C33.6727 25.4693 31.9766 24.5281 31.0662 23.0143L22.9161 9.63271H22.9323L19.4899 3.90958L19.4834 3.92051C19.4235 3.8253 19.3538 3.73947 19.2907 3.64738L19.1935 3.48663C19.1935 3.48663 19.1854 3.49131 19.1821 3.49443C17.5654 1.27666 14.9799 0.0390178 12.3118 0.00936427V0H7.91199V0.02185C10.9851 -0.184164 14.0582 1.23296 15.7656 3.92051L15.7721 3.90958L28.4451 24.987C30.0699 27.3093 32.7542 28.5985 35.5066 28.5985C36.9548 28.5985 38.4225 28.2426 39.7655 27.4919C40.961 26.8255 41.9168 25.9156 42.6231 24.8731H42.717L42.6846 24.9261C43.1366 24.2347 43.4833 23.4731 43.7068 22.6615C44.2916 20.5452 43.9871 18.3352 42.8369 16.4234L42.8402 16.4218Z",
               fill: "#F37880"
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("g", { opacity: "0.86", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("g", { opacity: "0.86", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
               "path",
               {
                 d: "M34.2332 8.78212L39.9031 18.0824C40.5868 19.2202 40.7698 20.5452 40.4183 21.8156C40.2044 22.5897 39.8059 23.2858 39.2616 23.8617C39.9744 23.2343 40.4879 22.4243 40.7423 21.5035C41.0938 20.2331 40.9107 18.908 40.2271 17.7703L34.5572 8.46998L34.5767 8.4575C34.413 8.19374 34.3142 7.89096 34.3142 7.56165C34.3142 7.15586 34.4584 6.78285 34.6982 6.48476C34.2672 6.80626 33.9902 7.30881 33.9902 7.87379C33.9902 8.2031 34.0891 8.50588 34.2527 8.76964L34.2332 8.78212Z",
                 fill: "white"
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
               "path",
               {
                 d: "M42.6917 24.9169L42.6863 24.9256C42.6863 24.9256 42.6899 24.9187 42.6935 24.9152C42.6935 24.9152 42.6935 24.9152 42.6935 24.9169H42.6917Z",
                 fill: "white"
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
               "path",
               {
                 d: "M40.0911 27.1798C38.7481 27.9289 37.2804 28.2863 35.8322 28.2863C33.0782 28.2863 30.3955 26.9988 28.7707 24.6749L16.0961 3.59744L16.0896 3.60837C14.9281 1.78077 13.1364 0.543128 11.1422 0H7.91199V0.02185C10.9851 -0.184164 14.0582 1.23296 15.7656 3.92051L15.7721 3.90958L28.4451 24.987C30.0699 27.3093 32.7542 28.5985 35.5066 28.5985C36.9548 28.5985 38.4225 28.2426 39.7655 27.4919C40.4815 27.0924 41.1084 26.6055 41.6511 26.0561C41.1862 26.479 40.6662 26.8583 40.0894 27.1798H40.0911Z",
@@ -6737,8 +6737,8 @@ var VuuLogo2 = (0, import_react56.memo)(() => {
             )
           ] })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("defs", { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("defs", { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(
             "linearGradient",
             {
               id: "paint0_linear_217_6990",
@@ -6748,12 +6748,12 @@ var VuuLogo2 = (0, import_react56.memo)(() => {
               y2: "18.7363",
               gradientUnits: "userSpaceOnUse",
               children: [
-                /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("stop", { stopColor: "#4906A5" }),
-                /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("stop", { offset: "1", stopColor: "#D3423A" })
+                /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("stop", { stopColor: "#4906A5" }),
+                /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("stop", { offset: "1", stopColor: "#D3423A" })
               ]
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(
+          /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(
             "linearGradient",
             {
               id: "paint1_linear_217_6990",
@@ -6763,12 +6763,12 @@ var VuuLogo2 = (0, import_react56.memo)(() => {
               y2: "22.5009",
               gradientUnits: "userSpaceOnUse",
               children: [
-                /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("stop", { stopColor: "#7C06A5" }),
-                /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("stop", { offset: "1", stopColor: "#D3423A" })
+                /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("stop", { stopColor: "#7C06A5" }),
+                /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("stop", { offset: "1", stopColor: "#D3423A" })
               ]
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("clipPath", { id: "clip0_217_6990", children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("rect", { width: "44", height: "45", fill: "white" }) })
+          /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("clipPath", { id: "clip0_217_6990", children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("rect", { width: "44", height: "45", fill: "white" }) })
         ] })
       ]
     }
@@ -6779,28 +6779,28 @@ VuuLogo2.displayName = "VuuLogo";
 // ../vuu-shell/src/left-nav/LeftNav.tsx
 var import_vuu_layout14 = require("@vuu-ui/vuu-layout");
 var import_classnames17 = __toESM(require("classnames"));
-var import_react58 = require("react");
+var import_react59 = require("react");
 
 // ../vuu-shell/src/feature-list/FeatureList.tsx
 var import_vuu_layout13 = require("@vuu-ui/vuu-layout");
-var import_jsx_runtime37 = require("react/jsx-runtime");
+var import_jsx_runtime36 = require("react/jsx-runtime");
 
 // ../vuu-shell/src/theme-provider/ThemeProvider.tsx
-var import_react57 = require("react");
+var import_react58 = require("react");
 var import_classnames16 = __toESM(require("classnames"));
-var import_jsx_runtime38 = require("react/jsx-runtime");
+var import_jsx_runtime37 = require("react/jsx-runtime");
 var DEFAULT_DENSITY = "medium";
 var DEFAULT_THEME = "salt-theme";
 var DEFAULT_THEME_MODE = "light";
-var ThemeContext = (0, import_react57.createContext)({
+var ThemeContext = (0, import_react58.createContext)({
   density: "high",
   theme: "vuu",
   themeMode: "light"
 });
 var createThemedChildren = (children, theme, themeMode, density) => {
   var _a2;
-  if ((0, import_react57.isValidElement)(children)) {
-    return (0, import_react57.cloneElement)(children, {
+  if ((0, import_react58.isValidElement)(children)) {
+    return (0, import_react58.cloneElement)(children, {
       className: (0, import_classnames16.default)(
         // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
         (_a2 = children.props) == null ? void 0 : _a2.className,
@@ -6832,88 +6832,88 @@ var ThemeProvider = ({
     density: inheritedDensity,
     themeMode: inheritedThemeMode,
     theme: inheritedTheme
-  } = (0, import_react57.useContext)(ThemeContext);
+  } = (0, import_react58.useContext)(ThemeContext);
   const density = (_a2 = densityProp != null ? densityProp : inheritedDensity) != null ? _a2 : DEFAULT_DENSITY;
   const themeMode = (_b = themeModeProp != null ? themeModeProp : inheritedThemeMode) != null ? _b : DEFAULT_THEME_MODE;
   const theme = (_c = themeProp != null ? themeProp : inheritedTheme) != null ? _c : DEFAULT_THEME;
   const themedChildren = applyThemeClasses ? createThemedChildren(children, theme, themeMode, density) : children;
-  return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(ThemeContext.Provider, { value: { themeMode, density, theme }, children: themedChildren });
+  return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(ThemeContext.Provider, { value: { themeMode, density, theme }, children: themedChildren });
 };
 ThemeProvider.displayName = "ThemeProvider";
 
 // ../vuu-shell/src/left-nav/LeftNav.tsx
-var import_jsx_runtime39 = require("react/jsx-runtime");
+var import_jsx_runtime38 = require("react/jsx-runtime");
 
 // ../vuu-shell/src/session-editing-form/SessionEditingForm.tsx
-var import_react59 = require("react");
+var import_react60 = require("react");
 var import_classnames18 = __toESM(require("classnames"));
 var import_core21 = require("@salt-ds/core");
 var import_core22 = require("@salt-ds/core");
 var import_vuu_data = require("@vuu-ui/vuu-data");
 var import_vuu_utils13 = require("@vuu-ui/vuu-utils");
-var import_jsx_runtime40 = require("react/jsx-runtime");
+var import_jsx_runtime39 = require("react/jsx-runtime");
 
 // ../vuu-shell/src/shell.tsx
 var import_vuu_data2 = require("@vuu-ui/vuu-data");
 var import_vuu_layout18 = require("@vuu-ui/vuu-layout");
 var import_vuu_utils14 = require("@vuu-ui/vuu-utils");
 var import_classnames21 = __toESM(require("classnames"));
-var import_react63 = require("react");
+var import_react64 = require("react");
 
 // ../vuu-shell/src/shell-layouts/context-panel/ContextPanel.tsx
 var import_core23 = require("@salt-ds/core");
 var import_classnames19 = __toESM(require("classnames"));
-var import_react60 = require("react");
+var import_react61 = require("react");
 var import_vuu_layout15 = require("@vuu-ui/vuu-layout");
-var import_jsx_runtime41 = require("react/jsx-runtime");
+var import_jsx_runtime40 = require("react/jsx-runtime");
 
 // ../vuu-shell/src/shell-layouts/useFullHeightLeftPanel.tsx
 var import_vuu_layout16 = require("@vuu-ui/vuu-layout");
 
 // ../vuu-shell/src/shell-layouts/side-panel/SidePanel.tsx
-var import_react61 = require("react");
+var import_react62 = require("react");
 var import_classnames20 = __toESM(require("classnames"));
-var import_jsx_runtime42 = require("react/jsx-runtime");
+var import_jsx_runtime41 = require("react/jsx-runtime");
 
 // ../vuu-shell/src/shell-layouts/useFullHeightLeftPanel.tsx
-var import_jsx_runtime43 = require("react/jsx-runtime");
+var import_jsx_runtime42 = require("react/jsx-runtime");
 
 // ../vuu-shell/src/shell-layouts/useInlayLeftPanel.tsx
 var import_vuu_layout17 = require("@vuu-ui/vuu-layout");
-var import_react62 = require("react");
-var import_jsx_runtime44 = require("react/jsx-runtime");
+var import_react63 = require("react");
+var import_jsx_runtime43 = require("react/jsx-runtime");
 
 // ../vuu-shell/src/shell.tsx
 var import_vuu_popups4 = require("@vuu-ui/vuu-popups");
-var import_jsx_runtime45 = require("react/jsx-runtime");
+var import_jsx_runtime44 = require("react/jsx-runtime");
 var { error } = (0, import_vuu_utils14.logger)("Shell");
 
 // ../vuu-shell/src/ShellContextProvider.tsx
-var import_react64 = require("react");
-var import_jsx_runtime46 = require("react/jsx-runtime");
+var import_react65 = require("react");
+var import_jsx_runtime45 = require("react/jsx-runtime");
 var defaultConfig = {};
-var ShellContext = (0, import_react64.createContext)(defaultConfig);
+var ShellContext = (0, import_react65.createContext)(defaultConfig);
 
 // ../vuu-shell/src/theme-switch/ThemeSwitch.tsx
 var import_classnames22 = __toESM(require("classnames"));
 var import_core24 = require("@salt-ds/core");
-var import_react65 = require("react");
-var import_jsx_runtime47 = require("react/jsx-runtime");
+var import_react66 = require("react");
+var import_jsx_runtime46 = require("react/jsx-runtime");
 
 // ../vuu-data-react/src/hooks/useLookupValues.ts
 var import_vuu_utils15 = require("@vuu-ui/vuu-utils");
-var import_react66 = require("react");
+var import_react67 = require("react");
 
 // ../vuu-data-react/src/hooks/useServerConnectionStatus.ts
-var import_react67 = require("react");
+var import_react68 = require("react");
 var import_vuu_data4 = require("@vuu-ui/vuu-data");
 
 // ../vuu-data-react/src/hooks/useServerConnectionQuality.ts
-var import_react68 = require("react");
+var import_react69 = require("react");
 var import_vuu_data5 = require("@vuu-ui/vuu-data");
 
 // ../vuu-data-react/src/hooks/useTypeaheadSuggestions.ts
-var import_react69 = require("react");
+var import_react70 = require("react");
 var import_vuu_data6 = require("@vuu-ui/vuu-data");
 
 // ../../node_modules/@lezer/common/dist/index.js
@@ -9978,31 +9978,31 @@ var strictParser = parser.configure({ strict: true });
 
 // ../vuu-data-react/src/hooks/useVuuMenuActions.ts
 var import_vuu_utils17 = require("@vuu-ui/vuu-utils");
-var import_react70 = require("react");
+var import_react71 = require("react");
 var { KEY } = import_vuu_utils17.metadataKeys;
 
 // ../vuu-data-react/src/hooks/useVuuTables.ts
 var import_vuu_data7 = require("@vuu-ui/vuu-data");
-var import_react71 = require("react");
+var import_react72 = require("react");
 var getVuuTableSchema = (table) => (0, import_vuu_data7.getServerAPI)().then((server) => server.getTableSchema(table));
 
 // src/instrument-search/useInstrumentSearch.ts
 var import_vuu_layout19 = require("@vuu-ui/vuu-layout");
-var import_react72 = require("react");
+var import_react73 = require("react");
 var useInstrumentSearch = ({
   dataSource: dataSourceProp,
   searchColumns = ["description"],
   table
 }) => {
-  const [dataSource, setDataSource] = (0, import_react72.useState)(dataSourceProp);
+  const [dataSource, setDataSource] = (0, import_react73.useState)(dataSourceProp);
   const { loadSession, saveSession } = (0, import_vuu_layout19.useViewContext)();
-  const [searchState, setSearchState] = (0, import_react72.useState)({ searchText: "", filter: "" });
-  const baseFilterPattern = (0, import_react72.useMemo)(
+  const [searchState, setSearchState] = (0, import_react73.useState)({ searchText: "", filter: "" });
+  const baseFilterPattern = (0, import_react73.useMemo)(
     // TODO make this contains once server supports it
     () => searchColumns.map((col) => `${col} starts "__VALUE__"`).join(" or "),
     [searchColumns]
   );
-  (0, import_react72.useMemo)(() => {
+  (0, import_react73.useMemo)(() => {
     if (dataSourceProp === void 0) {
       if (table) {
         const sessionKey = `instrument-search-${table.module}-${table.table}`;
@@ -10027,7 +10027,7 @@ var useInstrumentSearch = ({
       }
     }
   }, [dataSourceProp, loadSession, saveSession, table]);
-  const handleChange = (0, import_react72.useCallback)(
+  const handleChange = (0, import_react73.useCallback)(
     (evt) => {
       const { value } = evt.target;
       const filter = baseFilterPattern.replaceAll("__VALUE__", value);
@@ -10051,7 +10051,7 @@ var useInstrumentSearch = ({
 };
 
 // src/instrument-search/InstrumentSearch.tsx
-var import_jsx_runtime48 = require("react/jsx-runtime");
+var import_jsx_runtime47 = require("react/jsx-runtime");
 var classBase15 = "vuuInstrumentSearch";
 var defaultTableConfig = {
   columns: [
@@ -10069,7 +10069,7 @@ var defaultTableConfig = {
   ],
   rowSeparators: true
 };
-var searchIcon = /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("span", { "data-icon": "search" });
+var searchIcon = /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("span", { "data-icon": "search" });
 var InstrumentSearch = ({
   TableProps: TableProps3,
   autoFocus = false,
@@ -10087,14 +10087,14 @@ var InstrumentSearch = ({
     table
   });
   const { highlightedIndexRef, onHighlight, onKeyDown, tableRef } = (0, import_vuu_table3.useControlledTableNavigation)(-1, (_a2 = dataSource == null ? void 0 : dataSource.size) != null ? _a2 : 0);
-  const searchCallbackRef = (0, import_react73.useCallback)((el) => {
+  const searchCallbackRef = (0, import_react74.useCallback)((el) => {
     setTimeout(() => {
       var _a3;
       (_a3 = el == null ? void 0 : el.querySelector("input")) == null ? void 0 : _a3.focus();
     }, 100);
   }, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)("div", { ...htmlAttributes, className: (0, import_classnames23.default)(classBase15, className), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("div", { className: `${classBase15}-inputField`, children: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("div", { ...htmlAttributes, className: (0, import_classnames23.default)(classBase15, className), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("div", { className: `${classBase15}-inputField`, children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
       import_core25.Input,
       {
         inputProps: { onKeyDown },
@@ -10105,7 +10105,7 @@ var InstrumentSearch = ({
         onChange
       }
     ) }),
-    dataSource ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
+    dataSource ? /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
       import_vuu_table3.Table,
       {
         disableFocus: true,
@@ -10130,9 +10130,9 @@ var _a;
 
 // src/price-ticker/PriceTicker.tsx
 var import_vuu_utils18 = require("@vuu-ui/vuu-utils");
-var import_react74 = require("react");
+var import_react75 = require("react");
 var import_classnames24 = __toESM(require("classnames"));
-var import_jsx_runtime49 = require("react/jsx-runtime");
+var import_jsx_runtime48 = require("react/jsx-runtime");
 var classBase16 = "vuuPriceTicker";
 var getValueFormatter = (decimals) => (0, import_vuu_utils18.numericFormatter)({
   type: {
@@ -10144,7 +10144,7 @@ var getValueFormatter = (decimals) => (0, import_vuu_utils18.numericFormatter)({
   }
 });
 var INITIAL_VALUE = [void 0, void 0];
-var PriceTicker = (0, import_react74.memo)(
+var PriceTicker = (0, import_react75.memo)(
   ({
     className,
     decimals = 2,
@@ -10152,14 +10152,14 @@ var PriceTicker = (0, import_react74.memo)(
     showArrow,
     ...htmlAttributes
   }) => {
-    const ref = (0, import_react74.useRef)(INITIAL_VALUE);
+    const ref = (0, import_react75.useRef)(INITIAL_VALUE);
     const [prevValue, prevDirection] = ref.current;
-    const formatNumber = (0, import_react74.useMemo)(() => getValueFormatter(decimals), [decimals]);
+    const formatNumber = (0, import_react75.useMemo)(() => getValueFormatter(decimals), [decimals]);
     const direction = (0, import_vuu_utils18.isValidNumber)(prevValue) ? (0, import_vuu_utils18.getMovingValueDirection)(price, prevDirection, prevValue, decimals) : "";
     ref.current = [price, direction];
-    return /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("div", { ...htmlAttributes, className: (0, import_classnames24.default)(classBase16, className, direction), children: [
+    return /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)("div", { ...htmlAttributes, className: (0, import_classnames24.default)(classBase16, className, direction), children: [
       formatNumber(price),
-      showArrow ? /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("span", { "data-icon": "price-arrow" }) : null
+      showArrow ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("span", { "data-icon": "price-arrow" }) : null
     ] });
   }
 );
@@ -10169,11 +10169,11 @@ PriceTicker.displayName = "PriceTicker";
 var import_vuu_layout21 = require("@vuu-ui/vuu-layout");
 var import_core28 = require("@salt-ds/core");
 var import_classnames25 = __toESM(require("classnames"));
-var import_react79 = __toESM(require("react"));
+var import_react80 = __toESM(require("react"));
 
 // src/tabstrip/useTabstrip.ts
 var import_vuu_utils23 = require("@vuu-ui/vuu-utils");
-var import_react78 = require("react");
+var import_react79 = require("react");
 
 // src/tabstrip/TabMenuOptions.ts
 var isTabMenuOptions = (options) => typeof options === "object" && options !== null && "tabIndex" in options && typeof options.tabIndex === "number";
@@ -10206,22 +10206,22 @@ var getIndexOfEditedItem = (container) => getIndexOfItem(container, ".vuuEditabl
 
 // src/tabstrip/useAnimatedSelectionThumb.ts
 var import_vuu_utils20 = require("@vuu-ui/vuu-utils");
-var import_react75 = require("react");
+var import_react76 = require("react");
 var useAnimatedSelectionThumb = (containerRef, activeTabIndex, orientation = "horizontal") => {
-  const animationSuspendedRef = (0, import_react75.useRef)(false);
-  const suspendAnimation = (0, import_react75.useCallback)(() => {
+  const animationSuspendedRef = (0, import_react76.useRef)(false);
+  const suspendAnimation = (0, import_react76.useCallback)(() => {
     animationSuspendedRef.current = true;
   }, []);
-  const resumeAnimation = (0, import_react75.useCallback)(() => {
+  const resumeAnimation = (0, import_react76.useCallback)(() => {
     animationSuspendedRef.current = false;
   }, []);
-  const onTransitionEnd = (0, import_react75.useCallback)(() => {
+  const onTransitionEnd = (0, import_react76.useCallback)(() => {
     var _a2, _b;
     (_a2 = containerRef.current) == null ? void 0 : _a2.style.setProperty("--tab-thumb-transition", "none");
     (_b = containerRef.current) == null ? void 0 : _b.removeEventListener("transitionend", onTransitionEnd);
   }, [containerRef]);
-  const lastSelectedRef = (0, import_react75.useRef)(-1);
-  return (0, import_react75.useMemo)(() => {
+  const lastSelectedRef = (0, import_react76.useRef)(-1);
+  return (0, import_react76.useMemo)(() => {
     var _a2, _b;
     let offset = 0;
     let size = 0;
@@ -10291,7 +10291,7 @@ var useAnimatedSelectionThumb = (containerRef, activeTabIndex, orientation = "ho
 // src/tabstrip/useKeyboardNavigation.ts
 var import_core26 = require("@salt-ds/core");
 var import_vuu_utils21 = require("@vuu-ui/vuu-utils");
-var import_react76 = require("react");
+var import_react77 = require("react");
 var import_vuu_utils22 = require("@vuu-ui/vuu-utils");
 var navigation = {
   horizontal: {
@@ -10341,23 +10341,23 @@ var useKeyboardNavigation2 = ({
   selectedIndex: selectedTabIndex = 0
 }) => {
   const manualActivation = keyBoardActivation === "manual";
-  const mouseClickPending = (0, import_react76.useRef)(false);
-  const focusedRef = (0, import_react76.useRef)(-1);
-  const [hasFocus, setHasFocus] = (0, import_react76.useState)(false);
-  const [, forceRefresh] = (0, import_react76.useState)({});
+  const mouseClickPending = (0, import_react77.useRef)(false);
+  const focusedRef = (0, import_react77.useRef)(-1);
+  const [hasFocus, setHasFocus] = (0, import_react77.useState)(false);
+  const [, forceRefresh] = (0, import_react77.useState)({});
   const [highlightedIdx, _setHighlightedIdx] = (0, import_core26.useControlled)({
     controlled: highlightedIdxProp,
     default: defaultHighlightedIdx,
     name: "UseKeyboardNavigation"
   });
-  const setHighlightedIdx = (0, import_react76.useCallback)(
+  const setHighlightedIdx = (0, import_react77.useCallback)(
     (value) => {
       _setHighlightedIdx(focusedRef.current = value);
     },
     [_setHighlightedIdx]
   );
-  const keyboardNavigation = (0, import_react76.useRef)(false);
-  const focusTab = (0, import_react76.useCallback)(
+  const keyboardNavigation = (0, import_react77.useRef)(false);
+  const focusTab = (0, import_react77.useCallback)(
     (tabIndex, immediateFocus = false, withKeyboard, delay = 70) => {
       setHighlightedIdx(tabIndex);
       if (withKeyboard === true && !keyboardNavigation.current) {
@@ -10397,14 +10397,14 @@ var useKeyboardNavigation2 = ({
       }
     }
   };
-  const getIndexCount = (0, import_react76.useCallback)(
+  const getIndexCount = (0, import_react77.useCallback)(
     () => {
       var _a2, _b;
       return (_b = (_a2 = containerRef.current) == null ? void 0 : _a2.querySelectorAll(`[data-index]`).length) != null ? _b : 0;
     },
     [containerRef]
   );
-  const nextFocusableItemIdx = (0, import_react76.useCallback)(
+  const nextFocusableItemIdx = (0, import_react77.useCallback)(
     (direction = "fwd", idx) => {
       const indexCount = getIndexCount();
       const index = typeof idx === "number" ? idx : indexCount;
@@ -10424,7 +10424,7 @@ var useKeyboardNavigation2 = ({
     },
     [containerRef, getIndexCount]
   );
-  const navigateChildItems = (0, import_react76.useCallback)(
+  const navigateChildItems = (0, import_react77.useCallback)(
     (e, forceFocusVisible = false) => {
       const direction = navigation[orientation][e.key];
       const nextIdx = nextFocusableItemIdx(direction, highlightedIdx);
@@ -10446,14 +10446,14 @@ var useKeyboardNavigation2 = ({
       orientation
     ]
   );
-  const highlightedTabHasMenu = (0, import_react76.useCallback)(() => {
+  const highlightedTabHasMenu = (0, import_react77.useCallback)(() => {
     const el = getElementByPosition(containerRef.current, highlightedIdx);
     if (el) {
       return el.querySelector(".vuuPopupMenu") != null;
     }
     return false;
   }, [containerRef, highlightedIdx]);
-  const activateTabMenu = (0, import_react76.useCallback)(() => {
+  const activateTabMenu = (0, import_react77.useCallback)(() => {
     const el = getElementByPosition(containerRef.current, highlightedIdx);
     const menuEl = el == null ? void 0 : el.querySelector(".vuuPopupMenu");
     if (menuEl) {
@@ -10461,7 +10461,7 @@ var useKeyboardNavigation2 = ({
     }
     return false;
   }, [containerRef, highlightedIdx]);
-  const handleKeyDown = (0, import_react76.useCallback)(
+  const handleKeyDown = (0, import_react77.useCallback)(
     (e) => {
       if (getIndexCount() > 0 && isNavigationKey2(e.key, orientation)) {
         e.preventDefault();
@@ -10486,7 +10486,7 @@ var useKeyboardNavigation2 = ({
   const handleItemClick = (_, tabIndex) => {
     setHighlightedIdx(tabIndex);
   };
-  const handleFocus = (0, import_react76.useCallback)(() => {
+  const handleFocus = (0, import_react77.useCallback)(() => {
     if (!hasFocus) {
       setHasFocus(true);
       if (!mouseClickPending.current) {
@@ -10496,7 +10496,7 @@ var useKeyboardNavigation2 = ({
       }
     }
   }, [hasFocus]);
-  const handleContainerMouseDown = (0, import_react76.useCallback)(() => {
+  const handleContainerMouseDown = (0, import_react77.useCallback)(() => {
     if (!hasFocus) {
       mouseClickPending.current = true;
     }
@@ -10534,7 +10534,7 @@ var useKeyboardNavigation2 = ({
 
 // src/tabstrip/useSelection.ts
 var import_core27 = require("@salt-ds/core");
-var import_react77 = require("react");
+var import_react78 = require("react");
 var defaultSelectionKeys2 = ["Enter", " "];
 var isTabElement = (el) => el && el.matches('[class*="vuuTab "]');
 var useSelection2 = ({
@@ -10549,18 +10549,18 @@ var useSelection2 = ({
     name: "Tabstrip",
     state: "value"
   });
-  const isSelectionEvent = (0, import_react77.useCallback)(
+  const isSelectionEvent = (0, import_react78.useCallback)(
     (evt) => defaultSelectionKeys2.includes(evt.key),
     []
   );
-  const selectItem = (0, import_react77.useCallback)(
+  const selectItem = (0, import_react78.useCallback)(
     (tabIndex) => {
       setSelected(tabIndex);
       onSelectionChange == null ? void 0 : onSelectionChange(tabIndex);
     },
     [onSelectionChange, setSelected]
   );
-  const handleKeyDown = (0, import_react77.useCallback)(
+  const handleKeyDown = (0, import_react78.useCallback)(
     (e) => {
       const targetElement = e.target;
       if (isSelectionEvent(e) && highlightedIdx !== selected && isTabElement(targetElement)) {
@@ -10571,7 +10571,7 @@ var useSelection2 = ({
     },
     [isSelectionEvent, highlightedIdx, selected, selectItem]
   );
-  const onClick = (0, import_react77.useCallback)(
+  const onClick = (0, import_react78.useCallback)(
     (e, tabIndex) => {
       if (tabIndex !== selected) {
         selectItem(tabIndex);
@@ -10611,7 +10611,7 @@ var useTabstrip = ({
   orientation,
   keyBoardActivation
 }) => {
-  const lastSelection = (0, import_react78.useRef)(activeTabIndexProp);
+  const lastSelection = (0, import_react79.useRef)(activeTabIndexProp);
   const {
     focusTab: keyboardHookFocusTab,
     highlightedIdx,
@@ -10641,7 +10641,7 @@ var useTabstrip = ({
     animateSelectionThumb ? selectionHookSelected : -1,
     orientation
   );
-  const handleDrop = (0, import_react78.useCallback)(
+  const handleDrop = (0, import_react79.useCallback)(
     (fromIndex, toIndex) => {
       const { current: selected } = lastSelection;
       console.log(
@@ -10683,7 +10683,7 @@ var useTabstrip = ({
     orientation: "horizontal",
     itemQuery: ".vuuOverflowContainer-item"
   });
-  const handleExitEditMode = (0, import_react78.useCallback)(
+  const handleExitEditMode = (0, import_react79.useCallback)(
     (originalValue, editedValue, allowDeactivation, tabIndex) => {
       console.log(
         `handleExitEditMode ${originalValue} ${editedValue} ${allowDeactivation} ${tabIndex}`
@@ -10695,7 +10695,7 @@ var useTabstrip = ({
     },
     [keyboardHookFocusTab, onExitEditMode]
   );
-  const handleClick = (0, import_react78.useCallback)(
+  const handleClick = (0, import_react79.useCallback)(
     (evt, tabIndex) => {
       keyboardHookHandleClick(evt, tabIndex);
       selectionHookHandleClick(evt, tabIndex);
@@ -10703,7 +10703,7 @@ var useTabstrip = ({
     // [dragDropHook.isDragging, keyboardHook, selectionHook]
     [keyboardHookHandleClick, selectionHookHandleClick]
   );
-  const getEditableLabel = (0, import_react78.useCallback)(
+  const getEditableLabel = (0, import_react79.useCallback)(
     (tabIndex = highlightedIdx) => {
       const targetEl = getElementWithIndex(containerRef.current, tabIndex);
       if (targetEl) {
@@ -10712,7 +10712,7 @@ var useTabstrip = ({
     },
     [containerRef, highlightedIdx]
   );
-  const tabInEditMode = (0, import_react78.useCallback)(
+  const tabInEditMode = (0, import_react79.useCallback)(
     (tabIndex = highlightedIdx) => {
       const editableLabel = getEditableLabel(tabIndex);
       if (editableLabel) {
@@ -10722,7 +10722,7 @@ var useTabstrip = ({
     },
     [getEditableLabel, highlightedIdx]
   );
-  const editTab = (0, import_react78.useCallback)(
+  const editTab = (0, import_react79.useCallback)(
     (tabIndex = highlightedIdx) => {
       const editableLabelEl = getEditableLabel(tabIndex);
       if (editableLabelEl) {
@@ -10731,7 +10731,7 @@ var useTabstrip = ({
     },
     [getEditableLabel, highlightedIdx]
   );
-  const handleKeyDown = (0, import_react78.useCallback)(
+  const handleKeyDown = (0, import_react79.useCallback)(
     (evt) => {
       keyboardHookHandleKeyDown(evt);
       if (!evt.defaultPrevented) {
@@ -10743,7 +10743,7 @@ var useTabstrip = ({
     },
     [editTab, keyboardHookHandleKeyDown, selectionHookHandleKeyDown]
   );
-  const handleCloseTabFromMenu = (0, import_react78.useCallback)(
+  const handleCloseTabFromMenu = (0, import_react79.useCallback)(
     (tabIndex) => {
       const selectedTabIndex = getIndexOfSelectedTab(containerRef.current);
       const newActiveTabIndex = selectedTabIndex > tabIndex ? selectedTabIndex - 1 : selectedTabIndex === tabIndex ? 0 : selectedTabIndex;
@@ -10756,14 +10756,14 @@ var useTabstrip = ({
     },
     [containerRef, onCloseTab, resumeAnimation, suspendAnimation]
   );
-  const handleRenameTabFromMenu = (0, import_react78.useCallback)(
+  const handleRenameTabFromMenu = (0, import_react79.useCallback)(
     (tabIndex) => {
       editTab(tabIndex);
       return true;
     },
     [editTab]
   );
-  const handleTabMenuAction = (0, import_react78.useCallback)(
+  const handleTabMenuAction = (0, import_react79.useCallback)(
     (action) => {
       if (isTabMenuOptions(action.options)) {
         switch (action.menuId) {
@@ -10779,7 +10779,7 @@ var useTabstrip = ({
     },
     [handleCloseTabFromMenu, handleRenameTabFromMenu]
   );
-  const handleTabMenuClose = (0, import_react78.useCallback)(() => {
+  const handleTabMenuClose = (0, import_react79.useCallback)(() => {
     if (!tabInEditMode()) {
       keyboardHookFocusTab(highlightedIdx);
     } else {
@@ -10791,7 +10791,7 @@ var useTabstrip = ({
     keyboardHookSetHighlightedIndex,
     tabInEditMode
   ]);
-  const onSwitchWrappedItemIntoView = (0, import_react78.useCallback)(
+  const onSwitchWrappedItemIntoView = (0, import_react79.useCallback)(
     (item) => {
       const index = parseInt(item.index);
       if (!isNaN(index)) {
@@ -10804,7 +10804,7 @@ var useTabstrip = ({
     onFocus: keyboardHook.onFocus,
     onKeyDown: handleKeyDown
   };
-  const handleAddTabClick = (0, import_react78.useCallback)(() => {
+  const handleAddTabClick = (0, import_react79.useCallback)(() => {
     onAddTab == null ? void 0 : onAddTab();
     requestAnimationFrame(() => {
       const selectedTabIndex = getIndexOfSelectedTab(containerRef.current);
@@ -10837,8 +10837,8 @@ var useTabstrip = ({
 };
 
 // src/tabstrip/Tabstrip.tsx
-var import_jsx_runtime50 = require("react/jsx-runtime");
-var import_react80 = require("react");
+var import_jsx_runtime49 = require("react/jsx-runtime");
+var import_react81 = require("react");
 var classBase17 = "vuuTabstrip";
 var Tabstrip = ({
   activeTabIndex: activeTabIndexProp,
@@ -10863,7 +10863,7 @@ var Tabstrip = ({
   tabClassName,
   ...htmlAttributes
 }) => {
-  const rootRef = (0, import_react79.useRef)(null);
+  const rootRef = (0, import_react80.useRef)(null);
   const {
     activeTabIndex,
     focusVisible,
@@ -10891,7 +10891,7 @@ var Tabstrip = ({
     ...styleProp,
     ...containerStyle
   } : void 0;
-  const tabs = (0, import_react79.useMemo)(
+  const tabs = (0, import_react80.useMemo)(
     () => (0, import_vuu_layout21.asReactElements)(children).map((child, index) => {
       const {
         id: tabId = `${id}-tab-${index}`,
@@ -10902,7 +10902,7 @@ var Tabstrip = ({
         showMenuButton = showTabMenuButton
       } = child.props;
       const selected = index === activeTabIndex;
-      return import_react79.default.cloneElement(child, {
+      return import_react80.default.cloneElement(child, {
         ...tabProps,
         ...tabstripHook.navigationProps,
         className: (0, import_classnames25.default)(className2, tabClassName),
@@ -10920,7 +10920,7 @@ var Tabstrip = ({
         tabIndex: selected ? 0 : -1
       });
     }).concat(
-      allowAddTab ? /* @__PURE__ */ (0, import_react80.createElement)(
+      allowAddTab ? /* @__PURE__ */ (0, import_react81.createElement)(
         import_core28.Button,
         {
           ...tabstripHook.navigationProps,
@@ -10952,8 +10952,8 @@ var Tabstrip = ({
       location
     ]
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(import_jsx_runtime50.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(import_jsx_runtime49.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
       import_vuu_layout21.OverflowContainer,
       {
         ...htmlAttributes,
@@ -10975,13 +10975,13 @@ var Tabstrip = ({
 // src/tabstrip/Tab.tsx
 var import_core29 = require("@salt-ds/core");
 var import_classnames27 = __toESM(require("classnames"));
-var import_react82 = require("react");
+var import_react83 = require("react");
 
 // src/tabstrip/TabMenu.tsx
 var import_vuu_popups5 = require("@vuu-ui/vuu-popups");
-var import_react81 = require("react");
+var import_react82 = require("react");
 var import_classnames26 = __toESM(require("classnames"));
-var import_jsx_runtime51 = require("react/jsx-runtime");
+var import_jsx_runtime50 = require("react/jsx-runtime");
 var classBase18 = "vuuTabMenu";
 var TabMenu = ({
   allowClose,
@@ -10993,7 +10993,7 @@ var TabMenu = ({
   onMenuClose,
   index
 }) => {
-  const [menuBuilder, menuOptions] = (0, import_react81.useMemo)(
+  const [menuBuilder, menuOptions] = (0, import_react82.useMemo)(
     () => [
       (_location, options) => {
         const menuItems = [];
@@ -11013,7 +11013,7 @@ var TabMenu = ({
     ],
     [allowClose, allowRename, controlledComponentId, index]
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
     import_vuu_popups5.PopupMenu,
     {
       className: classBase18,
@@ -11028,10 +11028,10 @@ var TabMenu = ({
 };
 
 // src/tabstrip/Tab.tsx
-var import_jsx_runtime52 = require("react/jsx-runtime");
+var import_jsx_runtime51 = require("react/jsx-runtime");
 var classBase19 = "vuuTab";
 var noop2 = () => void 0;
-var Tab = (0, import_react82.forwardRef)(function Tab2({
+var Tab = (0, import_react83.forwardRef)(function Tab2({
   ariaControls,
   children,
   className,
@@ -11060,10 +11060,10 @@ var Tab = (0, import_react82.forwardRef)(function Tab2({
   if (showMenuButton && typeof onMenuAction !== "function") {
     throw Error("Tab onMenuAction must be provided if showMenuButton is set");
   }
-  const rootRef = (0, import_react82.useRef)(null);
-  const editableRef = (0, import_react82.useRef)(null);
+  const rootRef = (0, import_react83.useRef)(null);
+  const editableRef = (0, import_react83.useRef)(null);
   const setForkRef = (0, import_core29.useForkRef)(ref, rootRef);
-  const handleClick = (0, import_react82.useCallback)(
+  const handleClick = (0, import_react83.useCallback)(
     (e) => {
       if (!editing) {
         e.preventDefault();
@@ -11088,7 +11088,7 @@ var Tab = (0, import_react82.forwardRef)(function Tab2({
   };
   const getLabel = () => {
     if (editable) {
-      return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
         EditableLabel,
         {
           editing,
@@ -11113,7 +11113,7 @@ var Tab = (0, import_react82.forwardRef)(function Tab2({
     }
     onFocusProp == null ? void 0 : onFocusProp(evt);
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(
     "div",
     {
       ...props,
@@ -11134,7 +11134,7 @@ var Tab = (0, import_react82.forwardRef)(function Tab2({
       role: "tab",
       tabIndex,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { className: `${classBase19}-main`, children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("div", { className: `${classBase19}-main`, children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
           "span",
           {
             className: `${classBase19}-text`,
@@ -11142,7 +11142,7 @@ var Tab = (0, import_react82.forwardRef)(function Tab2({
             children: children != null ? children : getLabel()
           }
         ) }),
-        showMenuButton ? /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+        showMenuButton ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
           TabMenu,
           {
             allowClose: closeable,
@@ -11163,7 +11163,7 @@ var Tab = (0, import_react82.forwardRef)(function Tab2({
 // src/tree/Tree.tsx
 var import_core32 = require("@salt-ds/core");
 var import_classnames28 = __toESM(require("classnames"));
-var import_react91 = require("react");
+var import_react92 = require("react");
 
 // src/tree/list-dom-utils.ts
 function listItemIndex2(listItemEl) {
@@ -11181,7 +11181,7 @@ var closestListItem2 = (el) => el.closest("[data-idx],[aria-posinset]");
 var closestListItemIndex2 = (el) => listItemIndex2(closestListItem2(el));
 
 // src/tree/use-items-with-ids.ts
-var import_react83 = require("react");
+var import_react84 = require("react");
 var PathSeparators2 = /* @__PURE__ */ new Set(["/", "-", "."]);
 var isPathSeparator2 = (char) => PathSeparators2.has(char);
 var isParentPath2 = (parentPath, childPath) => childPath.startsWith(parentPath) && isPathSeparator2(childPath[parentPath.length]);
@@ -11205,7 +11205,7 @@ var useItemsWithIds = (sourceProp, idRoot = "root", {
       return 0;
     }
   };
-  const isExpanded2 = (0, import_react83.useCallback)(
+  const isExpanded2 = (0, import_react84.useCallback)(
     (path) => {
       if (Array.isArray(revealSelected)) {
         return revealSelected.some((id) => isParentPath2(path, id));
@@ -11214,7 +11214,7 @@ var useItemsWithIds = (sourceProp, idRoot = "root", {
     },
     [defaultExpanded, revealSelected]
   );
-  const normalizeItems = (0, import_react83.useCallback)(
+  const normalizeItems = (0, import_react84.useCallback)(
     (items, indexer, level = 1, path = "", results = [], flattenedSource2 = []) => {
       let count2 = 0;
       items.forEach((item, i, all) => {
@@ -11258,10 +11258,10 @@ var useItemsWithIds = (sourceProp, idRoot = "root", {
     },
     [collapsibleHeaders, idRoot, isExpanded2]
   );
-  const [count, sourceWithIds, flattenedSource] = (0, import_react83.useMemo)(() => {
+  const [count, sourceWithIds, flattenedSource] = (0, import_react84.useMemo)(() => {
     return normalizeItems(sourceProp, { index: 0 });
   }, [normalizeItems, sourceProp]);
-  const sourceItemById = (0, import_react83.useCallback)(
+  const sourceItemById = (0, import_react84.useCallback)(
     (id, target = sourceWithIds) => {
       const sourceWithId = target.find(
         (i) => {
@@ -11281,7 +11281,7 @@ var useItemsWithIds = (sourceProp, idRoot = "root", {
 };
 
 // src/tree/use-selection.ts
-var import_react84 = require("react");
+var import_react85 = require("react");
 var import_core30 = require("@salt-ds/core");
 var SINGLE = "single";
 var CHECKBOX2 = "checkbox";
@@ -11303,8 +11303,8 @@ var useSelection3 = ({
   const singleSelect = selection === SINGLE;
   const multiSelect = selection === MULTI || selection.startsWith(CHECKBOX2);
   const extendedSelect = selection === EXTENDED;
-  const lastActive = (0, import_react84.useRef)(-1);
-  const isSelectionEvent = (0, import_react84.useCallback)(
+  const lastActive = (0, import_react85.useRef)(-1);
+  const isSelectionEvent = (0, import_react85.useCallback)(
     (evt) => selectionKeys.includes(evt.key),
     [selectionKeys]
   );
@@ -11313,7 +11313,7 @@ var useSelection3 = ({
     default: defaultSelected != null ? defaultSelected : [],
     name: "selected"
   });
-  const selectItemAtIndex = (0, import_react84.useCallback)(
+  const selectItemAtIndex = (0, import_react85.useCallback)(
     (evt, idx, id, rangeSelect, preserveExistingSelection = false) => {
       const { current: active } = lastActive;
       const isSelected2 = selected == null ? void 0 : selected.includes(id);
@@ -11354,7 +11354,7 @@ var useSelection3 = ({
       singleSelect
     ]
   );
-  const handleKeyDown = (0, import_react84.useCallback)(
+  const handleKeyDown = (0, import_react85.useCallback)(
     (evt) => {
       if (~highlightedIdx && isSelectionEvent(evt)) {
         evt.preventDefault();
@@ -11379,7 +11379,7 @@ var useSelection3 = ({
       selectItemAtIndex
     ]
   );
-  const handleKeyboardNavigation = (0, import_react84.useCallback)(
+  const handleKeyboardNavigation = (0, import_react85.useCallback)(
     (evt, currentIndex) => {
       if (extendedSelect && evt.shiftKey) {
         const item = treeNodes[currentIndex];
@@ -11392,7 +11392,7 @@ var useSelection3 = ({
     onKeyDown: handleKeyDown,
     onKeyboardNavigation: handleKeyboardNavigation
   };
-  const handleClick = (0, import_react84.useCallback)(
+  const handleClick = (0, import_react85.useCallback)(
     (evt) => {
       if (highlightedIdx !== -1) {
         const item = treeNodes[highlightedIdx];
@@ -11426,14 +11426,14 @@ var useSelection3 = ({
 };
 
 // src/tree/use-viewport-tracking.ts
-var import_react85 = require("react");
+var import_react86 = require("react");
 var HeightOnly3 = ["height", "scrollHeight"];
 var useViewportTracking2 = (root, highlightedIdx, stickyHeaders = false) => {
-  const scrollTop = (0, import_react85.useRef)(0);
-  const scrolling = (0, import_react85.useRef)(false);
-  const rootHeight = (0, import_react85.useRef)(0);
-  const rootScrollHeight = (0, import_react85.useRef)(0);
-  const scrollIntoView = (0, import_react85.useCallback)(
+  const scrollTop = (0, import_react86.useRef)(0);
+  const scrolling = (0, import_react86.useRef)(false);
+  const rootHeight = (0, import_react86.useRef)(0);
+  const rootScrollHeight = (0, import_react86.useRef)(0);
+  const scrollIntoView = (0, import_react86.useCallback)(
     (el) => {
       const targetEl = el.ariaExpanded ? el.firstChild : el;
       const headerHeight = stickyHeaders ? 30 : 0;
@@ -11454,10 +11454,10 @@ var useViewportTracking2 = (root, highlightedIdx, stickyHeaders = false) => {
     },
     [root, stickyHeaders]
   );
-  const scrollHandler = (0, import_react85.useCallback)((e) => {
+  const scrollHandler = (0, import_react86.useCallback)((e) => {
     scrollTop.current = e.target.scrollTop;
   }, []);
-  (0, import_react85.useEffect)(() => {
+  (0, import_react86.useEffect)(() => {
     const { current: rootEl } = root;
     if (rootEl) {
       rootEl.addEventListener("scroll", scrollHandler);
@@ -11468,7 +11468,7 @@ var useViewportTracking2 = (root, highlightedIdx, stickyHeaders = false) => {
       }
     };
   }, [root, scrollHandler]);
-  (0, import_react85.useLayoutEffect)(() => {
+  (0, import_react86.useLayoutEffect)(() => {
     if (highlightedIdx !== -1 && rootScrollHeight.current > rootHeight.current) {
       if (root.current) {
         const item = root.current.querySelector(`
@@ -11485,9 +11485,9 @@ var useViewportTracking2 = (root, highlightedIdx, stickyHeaders = false) => {
       }
     }
   }, [highlightedIdx, root, scrollIntoView]);
-  (0, import_react85.useEffect)(() => {
+  (0, import_react86.useEffect)(() => {
   }, [stickyHeaders]);
-  const onResize = (0, import_react85.useCallback)(({ height, scrollHeight }) => {
+  const onResize = (0, import_react86.useCallback)(({ height, scrollHeight }) => {
     rootHeight.current = height;
     rootScrollHeight.current = scrollHeight;
   }, []);
@@ -11496,10 +11496,10 @@ var useViewportTracking2 = (root, highlightedIdx, stickyHeaders = false) => {
 };
 
 // src/tree/useTree.ts
-var import_react90 = require("react");
+var import_react91 = require("react");
 
 // src/tree/use-keyboard-navigation.ts
-var import_react86 = require("react");
+var import_react87 = require("react");
 
 // src/tree/hierarchical-data-utils.ts
 var getNodeParentPath = ({ id }) => {
@@ -11649,7 +11649,7 @@ var useKeyboardNavigation3 = ({
   onKeyboardNavigation,
   selected = []
 }) => {
-  const { bwd: ArrowBwd, fwd: ArrowFwd } = (0, import_react86.useMemo)(
+  const { bwd: ArrowBwd, fwd: ArrowFwd } = (0, import_react87.useMemo)(
     () => ({
       bwd: ArrowUp3,
       fwd: ArrowDown3
@@ -11661,14 +11661,14 @@ var useKeyboardNavigation3 = ({
     default: defaultHighlightedIdx,
     name: "highlightedIdx"
   });
-  const setHighlightedIndex = (0, import_react86.useCallback)(
+  const setHighlightedIndex = (0, import_react87.useCallback)(
     (idx) => {
       onHighlight == null ? void 0 : onHighlight(idx);
       setHighlightedIdx(idx);
     },
     [onHighlight, setHighlightedIdx]
   );
-  const nextFocusableItemIdx = (0, import_react86.useCallback)(
+  const nextFocusableItemIdx = (0, import_react87.useCallback)(
     (key = ArrowFwd, idx = key === ArrowFwd ? -1 : treeNodes.length) => {
       let nextIdx = nextItemIdx3(treeNodes.length, key, idx);
       while (nextIdx !== -1 && (key === ArrowFwd && nextIdx < treeNodes.length || key === ArrowBwd && nextIdx > 0) && !isFocusable3(treeNodes[nextIdx])) {
@@ -11678,10 +11678,10 @@ var useKeyboardNavigation3 = ({
     },
     [ArrowBwd, ArrowFwd, treeNodes]
   );
-  const keyBoardNavigation = (0, import_react86.useRef)(true);
-  const ignoreFocus = (0, import_react86.useRef)(false);
+  const keyBoardNavigation = (0, import_react87.useRef)(true);
+  const ignoreFocus = (0, import_react87.useRef)(false);
   const setIgnoreFocus = (value) => ignoreFocus.current = value;
-  const handleFocus = (0, import_react86.useCallback)(() => {
+  const handleFocus = (0, import_react87.useCallback)(() => {
     if (ignoreFocus.current) {
       ignoreFocus.current = false;
     } else if (selected.length > 0) {
@@ -11694,7 +11694,7 @@ var useKeyboardNavigation3 = ({
       setHighlightedIndex(nextFocusableItemIdx());
     }
   }, [treeNodes, nextFocusableItemIdx, selected, setHighlightedIndex]);
-  const navigateChildItems = (0, import_react86.useCallback)(
+  const navigateChildItems = (0, import_react87.useCallback)(
     (e) => {
       const nextIdx = nextFocusableItemIdx(e.key, highlightedIdx);
       if (nextIdx !== highlightedIdx) {
@@ -11709,7 +11709,7 @@ var useKeyboardNavigation3 = ({
       setHighlightedIndex
     ]
   );
-  const handleKeyDown = (0, import_react86.useCallback)(
+  const handleKeyDown = (0, import_react87.useCallback)(
     (e) => {
       if (treeNodes.length > 0 && isNavigationKey3(e, "vertical")) {
         e.preventDefault();
@@ -11720,7 +11720,7 @@ var useKeyboardNavigation3 = ({
     },
     [treeNodes, navigateChildItems]
   );
-  const listProps = (0, import_react86.useMemo)(
+  const listProps = (0, import_react87.useMemo)(
     () => ({
       onBlur: () => {
         setHighlightedIndex(-1);
@@ -11758,7 +11758,7 @@ var useKeyboardNavigation3 = ({
 };
 
 // src/tree/use-hierarchical-data.ts
-var import_react87 = require("react");
+var import_react88 = require("react");
 var populateIndices = (nodes, results = [], idx = { value: 0 }) => {
   let skipToNextHeader = false;
   for (const node of nodes) {
@@ -11780,10 +11780,10 @@ var populateIndices = (nodes, results = [], idx = { value: 0 }) => {
   return results;
 };
 var useHierarchicalData = (source) => {
-  const externalSource = (0, import_react87.useRef)(source);
-  const statefulSource = (0, import_react87.useRef)(source);
-  const indexPositions = (0, import_react87.useRef)(populateIndices(source));
-  const [, forceUpdate] = (0, import_react87.useState)({});
+  const externalSource = (0, import_react88.useRef)(source);
+  const statefulSource = (0, import_react88.useRef)(source);
+  const indexPositions = (0, import_react88.useRef)(populateIndices(source));
+  const [, forceUpdate] = (0, import_react88.useState)({});
   if (source !== externalSource.current) {
     externalSource.current = source;
     statefulSource.current = source;
@@ -11803,7 +11803,7 @@ var useHierarchicalData = (source) => {
 };
 
 // src/tree/use-collapsible-groups.ts
-var import_react88 = require("react");
+var import_react89 = require("react");
 var NO_HANDLERS4 = {};
 var isToggleElement = (element) => element && element.hasAttribute("aria-expanded");
 var useCollapsibleGroups2 = ({
@@ -11813,23 +11813,23 @@ var useCollapsibleGroups2 = ({
   setVisibleData,
   source
 }) => {
-  const fullSource = (0, import_react88.useRef)(source);
-  const stateSource = (0, import_react88.useRef)(fullSource.current);
-  const setSource = (0, import_react88.useCallback)(
+  const fullSource = (0, import_react89.useRef)(source);
+  const stateSource = (0, import_react89.useRef)(fullSource.current);
+  const setSource = (0, import_react89.useCallback)(
     (value) => {
       setVisibleData(stateSource.current = value);
     },
     [setVisibleData]
   );
-  const expandNode = (0, import_react88.useCallback)(
+  const expandNode = (0, import_react89.useCallback)(
     (nodeList, { id }) => replaceNode(nodeList, id, { expanded: true }),
     []
   );
-  const collapseNode = (0, import_react88.useCallback)(
+  const collapseNode = (0, import_react89.useCallback)(
     (nodeList, { id }) => replaceNode(nodeList, id, { expanded: false }),
     []
   );
-  const handleKeyDown = (0, import_react88.useCallback)(
+  const handleKeyDown = (0, import_react89.useCallback)(
     (e) => {
       if (e.key === ArrowRight3 || e.key === Enter2) {
         const node = treeNodes[highlightedIdx];
@@ -11855,7 +11855,7 @@ var useCollapsibleGroups2 = ({
   const listHandlers = collapsibleHeaders ? {
     onKeyDown: handleKeyDown
   } : NO_HANDLERS4;
-  const handleClick = (0, import_react88.useCallback)(
+  const handleClick = (0, import_react89.useCallback)(
     (evt) => {
       const el = closestListItem2(evt.target);
       if (isToggleElement(el)) {
@@ -11881,14 +11881,14 @@ var useCollapsibleGroups2 = ({
 };
 
 // src/tree/use-tree-keyboard-navigation.ts
-var import_react89 = require("react");
+var import_react90 = require("react");
 var useTreeKeyboardNavigation = ({
   highlightedIdx,
   hiliteItemAtIndex,
   indexPositions,
   source
 }) => {
-  const handleKeyDown = (0, import_react89.useCallback)(
+  const handleKeyDown = (0, import_react90.useCallback)(
     (e) => {
       if (e.key === ArrowLeft3) {
         const node = indexPositions[highlightedIdx];
@@ -11925,7 +11925,7 @@ var useTree = ({
   selected: selectedProp,
   selection
 }) => {
-  const lastSelection = (0, import_react90.useRef)(EMPTY_ARRAY2);
+  const lastSelection = (0, import_react91.useRef)(EMPTY_ARRAY2);
   const dataHook = useHierarchicalData(sourceWithIds);
   const handleKeyboardNavigation = (evt, nextIdx) => {
     var _a2, _b;
@@ -11958,7 +11958,7 @@ var useTree = ({
     hiliteItemAtIndex: keyboardHook.hiliteItemAtIndex,
     indexPositions: dataHook.indexPositions
   });
-  const handleClick = (0, import_react90.useCallback)(
+  const handleClick = (0, import_react91.useCallback)(
     (evt) => {
       var _a2, _b, _c;
       (_a2 = collapsibleHook.listItemHandlers) == null ? void 0 : _a2.onClick(evt);
@@ -11968,7 +11968,7 @@ var useTree = ({
     },
     [collapsibleHook, selectionHook]
   );
-  const handleKeyDown = (0, import_react90.useCallback)(
+  const handleKeyDown = (0, import_react91.useCallback)(
     (evt) => {
       var _a2, _b, _c, _d, _e, _f, _g, _h;
       (_b = (_a2 = keyboardHook.listProps).onKeyDown) == null ? void 0 : _b.call(_a2, evt);
@@ -12018,14 +12018,14 @@ var useTree = ({
 };
 
 // src/tree/Tree.tsx
-var import_jsx_runtime53 = require("react/jsx-runtime");
-var import_react92 = require("react");
+var import_jsx_runtime52 = require("react/jsx-runtime");
+var import_react93 = require("react");
 var classBase20 = "vuuTree";
 var isExpanded = (node) => node.expanded === true;
 var TreeNode2 = ({ children, idx, ...props }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("li", { ...props, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("li", { ...props, children });
 };
-var Tree2 = (0, import_react91.forwardRef)(function Tree3({
+var Tree2 = (0, import_react92.forwardRef)(function Tree3({
   allowDragDrop,
   className,
   defaultSelected,
@@ -12041,7 +12041,7 @@ var Tree2 = (0, import_react91.forwardRef)(function Tree3({
 }, forwardedRef) {
   var _a2;
   const id = (0, import_core32.useIdMemo)(idProp);
-  const rootRef = (0, import_react91.useRef)(null);
+  const rootRef = (0, import_react92.useRef)(null);
   const [, sourceWithIds, sourceItemById] = useItemsWithIds(source, id, {
     revealSelected: revealSelected ? (_a2 = selectedProp != null ? selectedProp : defaultSelected) != null ? _a2 : false : void 0
   });
@@ -12084,14 +12084,14 @@ var Tree2 = (0, import_react91.forwardRef)(function Tree3({
   const allowGroupSelect = groupSelectionEnabled2(groupSelection);
   function addLeafNode(list, item, idx) {
     list.push(
-      /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(
+      /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(
         TreeNode2,
         {
           ...propsCommonToAllListItems,
           ...getListItemProps(item, idx, highlightedIdx, selected, focusVisible),
           children: [
-            item.icon ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("span", { className: `${classBase20}Node-icon`, "data-icon": item.icon }) : null,
-            /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("span", { children: item.label })
+            item.icon ? /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("span", { className: `${classBase20}Node-icon`, "data-icon": item.icon }) : null,
+            /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("span", { children: item.label })
           ]
         }
       )
@@ -12102,7 +12102,7 @@ var Tree2 = (0, import_react91.forwardRef)(function Tree3({
     const { value: i } = idx;
     idx.value += 1;
     list.push(
-      /* @__PURE__ */ (0, import_react92.createElement)(
+      /* @__PURE__ */ (0, import_react93.createElement)(
         TreeNode2,
         {
           ...listItemHandlers,
@@ -12119,20 +12119,20 @@ var Tree2 = (0, import_react91.forwardRef)(function Tree3({
           id: id2,
           key: `header-${i}`
         },
-        allowGroupSelect ? /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: `${classBase20}Node-label`, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("span", { className: `${classBase20}Node-toggle` }),
+        allowGroupSelect ? /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { className: `${classBase20}Node-label`, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("span", { className: `${classBase20}Node-toggle` }),
           title
-        ] }) : /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: `${classBase20}Node-label`, children: [
-          child.icon ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
+        ] }) : /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { className: `${classBase20}Node-label`, children: [
+          child.icon ? /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
             "span",
             {
               className: `${classBase20}Node-icon`,
               "data-icon": child.icon
             }
           ) : null,
-          /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("span", { children: title })
+          /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("span", { children: title })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("ul", { role: "group", children: isExpanded(child) ? renderSourceContent(child.childNodes, idx) : "" })
+        /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("ul", { role: "group", children: isExpanded(child) ? renderSourceContent(child.childNodes, idx) : "" })
       )
     );
   }
@@ -12149,7 +12149,7 @@ var Tree2 = (0, import_react91.forwardRef)(function Tree3({
       return listItems;
     }
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
     "ul",
     {
       ...htmlAttributes,
@@ -12181,15 +12181,15 @@ var Tree_default = Tree2;
 var import_vuu_utils24 = require("@vuu-ui/vuu-utils");
 var import_core33 = require("@salt-ds/core");
 var import_classnames29 = __toESM(require("classnames"));
-var import_react93 = require("react");
+var import_react94 = require("react");
 var import_vuu_popups6 = require("@vuu-ui/vuu-popups");
 var import_vuu_layout22 = require("@vuu-ui/vuu-layout");
-var import_jsx_runtime54 = require("react/jsx-runtime");
+var import_jsx_runtime53 = require("react/jsx-runtime");
 var classBase21 = "vuuInput";
 var constantInputProps = {
   autoComplete: "off"
 };
-var VuuInput = (0, import_react93.forwardRef)(function VuuInput2({
+var VuuInput = (0, import_react94.forwardRef)(function VuuInput2({
   className,
   errorMessage,
   id: idProp,
@@ -12203,7 +12203,7 @@ var VuuInput = (0, import_react93.forwardRef)(function VuuInput2({
     id,
     tooltipContent: errorMessage
   });
-  const commitValue = (0, import_react93.useCallback)(
+  const commitValue = (0, import_react94.useCallback)(
     (evt, value) => {
       if (type === "number") {
         const numericValue = parseFloat(value);
@@ -12220,7 +12220,7 @@ var VuuInput = (0, import_react93.forwardRef)(function VuuInput2({
     },
     [onCommit, type]
   );
-  const handleKeyDown = (0, import_react93.useCallback)(
+  const handleKeyDown = (0, import_react94.useCallback)(
     (evt) => {
       if (evt.key === "Enter") {
         evt.preventDefault();
@@ -12232,14 +12232,14 @@ var VuuInput = (0, import_react93.forwardRef)(function VuuInput2({
     },
     [commitValue, onKeyDown]
   );
-  const handleBlur = (0, import_react93.useCallback)(
+  const handleBlur = (0, import_react94.useCallback)(
     (evt) => {
       const { value } = evt.target;
       commitValue(evt, value);
     },
     [commitValue]
   );
-  const endAdornment = errorMessage ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
+  const endAdornment = errorMessage ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
     "span",
     {
       ...anchorProps,
@@ -12247,8 +12247,8 @@ var VuuInput = (0, import_react93.forwardRef)(function VuuInput2({
       "data-icon": "error"
     }
   ) : void 0;
-  return /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(import_jsx_runtime54.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(import_jsx_runtime53.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
       import_core33.Input,
       {
         ...props,
@@ -12266,7 +12266,7 @@ var VuuInput = (0, import_react93.forwardRef)(function VuuInput2({
         onKeyDown: handleKeyDown
       }
     ),
-    tooltipProps ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_vuu_popups6.Tooltip, { ...tooltipProps, status: "error" }) : null
+    tooltipProps ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_vuu_popups6.Tooltip, { ...tooltipProps, status: "error" }) : null
   ] });
 });
 //# sourceMappingURL=index.js.map