@vuu-ui/vuu-ui-controls 0.9.2 → 0.10.0

package/esm/toolbar/useSelection.js.map

@@ -1 +1 @@
-{"version":3,"file":"useSelection.js","sources":["../../src/toolbar/useSelection.ts"],"sourcesContent":["import { KeyboardEvent, MouseEvent, RefObject, useCallback } from \"react\";\nimport {\n  SelectionStrategy,\n  SpecialKeyMultipleSelection,\n  allowMultipleSelection,\n  deselectionIsAllowed,\n  selectionIsDisallowed,\n} from \"../common-hooks\";\nimport { useControlled } from \"@salt-ds/core\";\nimport { getClosestIndexItem, isSelectableElement } from \"@vuu-ui/vuu-utils\";\n\nconst defaultSelectionKeys = [\"Enter\", \" \"];\n\nexport interface SelectionHookProps {\n  containerRef: RefObject<HTMLElement>;\n  defaultSelected?: number[];\n  highlightedIdx: number;\n  itemQuery: string;\n  onSelectionChange?: (selectedIndices: number[]) => void;\n  selected?: number[];\n  selectionStrategy: SelectionStrategy | SpecialKeyMultipleSelection;\n}\n\nexport interface ItemHandlers {\n  onClick?: (e: MouseEvent, itemIndex: number) => void;\n  onKeyDown?: (event: React.KeyboardEvent) => void;\n}\n\nconst NO_SELECTION_HANDLERS: ItemHandlers = {};\n\nexport interface SelectionHookResult {\n  activateItem: (tabIndex: number) => void;\n  itemHandlers: ItemHandlers;\n  isControlled: boolean;\n  selected: number[];\n}\n\n// TODO use SelectionProps\nexport const useSelection = ({\n  defaultSelected,\n  highlightedIdx,\n  onSelectionChange,\n  selected: selectedProp,\n  selectionStrategy,\n}: SelectionHookProps): SelectionHookResult => {\n  const [selected, setSelected, isControlled] = useControlled({\n    controlled: selectedProp,\n    default: defaultSelected ?? [],\n    name: \"useSelection\",\n    state: \"selected\",\n  });\n\n  // const isSelectableElement = useMemo(\n  //   () =>\n  //     (el: HTMLElement): boolean =>\n  //       el && el.matches(`[class*=\"${itemQuery} \"]`),\n  //   [itemQuery]\n  // );\n\n  const isSelectionEvent = useCallback(\n    (evt: KeyboardEvent) => defaultSelectionKeys.includes(evt.key),\n    [],\n  );\n\n  const selectItem = useCallback(\n    (itemIndex: number, specialKey = false) => {\n      const newSelected = allowMultipleSelection(selectionStrategy, specialKey)\n        ? selected.concat(itemIndex)\n        : [itemIndex];\n\n      setSelected(newSelected);\n      onSelectionChange?.(newSelected);\n    },\n    [onSelectionChange, selected, selectionStrategy, setSelected],\n  );\n\n  const deselectItem = useCallback(\n    (itemIndex: number, specialKey = false) => {\n      const newSelected =\n        selectionStrategy === \"deselectable\" ||\n        (selectionStrategy === \"multiple-special-key\" && !specialKey)\n          ? []\n          : selected.filter((index) => index !== itemIndex);\n      setSelected(newSelected);\n      onSelectionChange?.(newSelected);\n    },\n    [onSelectionChange, selected, selectionStrategy, setSelected],\n  );\n\n  const handleKeyDown = useCallback(\n    (e: KeyboardEvent) => {\n      if (isSelectionEvent(e) && isSelectableElement(e.target as HTMLElement)) {\n        if (!selected.includes(highlightedIdx)) {\n          e.stopPropagation();\n          e.preventDefault();\n          selectItem(highlightedIdx, e.shiftKey);\n        } else if (deselectionIsAllowed(selectionStrategy)) {\n          e.stopPropagation();\n          e.preventDefault();\n          deselectItem(highlightedIdx, e.shiftKey);\n        }\n      }\n    },\n    [\n      isSelectionEvent,\n      selected,\n      highlightedIdx,\n      selectionStrategy,\n      selectItem,\n      deselectItem,\n    ],\n  );\n\n  const handleClick = useCallback(\n    (e: MouseEvent, itemIndex: number) => {\n      const element = getClosestIndexItem(e.target as HTMLElement);\n      if (isSelectableElement(element)) {\n        if (!selected.includes(itemIndex)) {\n          selectItem(itemIndex, e.shiftKey);\n        } else if (deselectionIsAllowed(selectionStrategy)) {\n          deselectItem(itemIndex, e.shiftKey);\n        }\n      }\n    },\n    [deselectItem, selectItem, selected, selectionStrategy],\n  );\n\n  const itemHandlers = selectionIsDisallowed(selectionStrategy)\n    ? NO_SELECTION_HANDLERS\n    : {\n        onClick: handleClick,\n        onKeyDown: handleKeyDown,\n      };\n\n  return {\n    activateItem: selectItem,\n    itemHandlers,\n    isControlled,\n    selected,\n  };\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"useSelection.js","sources":["../../src/toolbar/useSelection.ts"],"sourcesContent":["import { KeyboardEvent, MouseEvent, RefObject, useCallback } from \"react\";\nimport {\n  SelectionStrategy,\n  SpecialKeyMultipleSelection,\n  allowMultipleSelection,\n  deselectionIsAllowed,\n  selectionIsDisallowed,\n} from \"../common-hooks\";\nimport { useControlled } from \"@salt-ds/core\";\nimport { getClosestIndexItem, isSelectableElement } from \"@vuu-ui/vuu-utils\";\n\nconst defaultSelectionKeys = [\"Enter\", \" \"];\n\nexport interface SelectionHookProps {\n  containerRef: RefObject<HTMLElement>;\n  defaultSelected?: number[];\n  highlightedIdx: number;\n  itemQuery: string;\n  onSelectionChange?: (selectedIndices: number[]) => void;\n  selected?: number[];\n  selectionStrategy: SelectionStrategy | SpecialKeyMultipleSelection;\n}\n\nexport interface ItemHandlers {\n  onClick?: (e: MouseEvent, itemIndex: number) => void;\n  onKeyDown?: (event: React.KeyboardEvent) => void;\n}\n\nconst NO_SELECTION_HANDLERS: ItemHandlers = {};\n\nexport interface SelectionHookResult {\n  activateItem: (tabIndex: number) => void;\n  itemHandlers: ItemHandlers;\n  isControlled: boolean;\n  selected: number[];\n}\n\n// TODO use SelectionProps\nexport const useSelection = ({\n  defaultSelected,\n  highlightedIdx,\n  onSelectionChange,\n  selected: selectedProp,\n  selectionStrategy,\n}: SelectionHookProps): SelectionHookResult => {\n  const [selected, setSelected, isControlled] = useControlled({\n    controlled: selectedProp,\n    default: defaultSelected ?? [],\n    name: \"useSelection\",\n    state: \"selected\",\n  });\n\n  // const isSelectableElement = useMemo(\n  //   () =>\n  //     (el: HTMLElement): boolean =>\n  //       el && el.matches(`[class*=\"${itemQuery} \"]`),\n  //   [itemQuery]\n  // );\n\n  const isSelectionEvent = useCallback(\n    (evt: KeyboardEvent) => defaultSelectionKeys.includes(evt.key),\n    [],\n  );\n\n  const selectItem = useCallback(\n    (itemIndex: number, specialKey = false) => {\n      const newSelected = allowMultipleSelection(selectionStrategy, specialKey)\n        ? selected.concat(itemIndex)\n        : [itemIndex];\n\n      setSelected(newSelected);\n      onSelectionChange?.(newSelected);\n    },\n    [onSelectionChange, selected, selectionStrategy, setSelected],\n  );\n\n  const deselectItem = useCallback(\n    (itemIndex: number, specialKey = false) => {\n      const newSelected =\n        selectionStrategy === \"deselectable\" ||\n        (selectionStrategy === \"multiple-special-key\" && !specialKey)\n          ? []\n          : selected.filter((index) => index !== itemIndex);\n      setSelected(newSelected);\n      onSelectionChange?.(newSelected);\n    },\n    [onSelectionChange, selected, selectionStrategy, setSelected],\n  );\n\n  const handleKeyDown = useCallback(\n    (e: KeyboardEvent) => {\n      if (isSelectionEvent(e) && isSelectableElement(e.target as HTMLElement)) {\n        if (!selected.includes(highlightedIdx)) {\n          e.stopPropagation();\n          e.preventDefault();\n          selectItem(highlightedIdx, e.shiftKey);\n        } else if (deselectionIsAllowed(selectionStrategy)) {\n          e.stopPropagation();\n          e.preventDefault();\n          deselectItem(highlightedIdx, e.shiftKey);\n        }\n      }\n    },\n    [\n      isSelectionEvent,\n      selected,\n      highlightedIdx,\n      selectionStrategy,\n      selectItem,\n      deselectItem,\n    ],\n  );\n\n  const handleClick = useCallback(\n    (e: MouseEvent, itemIndex: number) => {\n      const element = getClosestIndexItem(e.target as HTMLElement);\n      if (isSelectableElement(element)) {\n        if (!selected.includes(itemIndex)) {\n          selectItem(itemIndex, e.shiftKey);\n        } else if (deselectionIsAllowed(selectionStrategy)) {\n          deselectItem(itemIndex, e.shiftKey);\n        }\n      }\n    },\n    [deselectItem, selectItem, selected, selectionStrategy],\n  );\n\n  const itemHandlers = selectionIsDisallowed(selectionStrategy)\n    ? NO_SELECTION_HANDLERS\n    : {\n        onClick: handleClick,\n        onKeyDown: handleKeyDown,\n      };\n\n  return {\n    activateItem: selectItem,\n    itemHandlers,\n    isControlled,\n    selected,\n  };\n};\n"],"names":[],"mappings":"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"}

package/esm/toolbar/useToolbar.js.map

@@ -1 +1 @@
-{"version":3,"file":"useToolbar.js","sources":["../../src/toolbar/useToolbar.ts"],"sourcesContent":["import { isValidNumber } from \"@vuu-ui/vuu-utils\";\nimport {\n  KeyboardEvent,\n  MouseEvent as ReactMouseEvent,\n  RefObject,\n  useCallback,\n  useRef,\n} from \"react\";\nimport { OverflowItem } from \"../overflow-container\";\nimport { ToolbarProps } from \"./Toolbar\";\nimport { useKeyboardNavigation } from \"./useKeyboardNavigation\";\nimport { useSelection } from \"./useSelection\";\n\nexport interface ToolbarHookProps\n  extends Pick<\n      ToolbarProps,\n      | \"activeItemIndex\"\n      | \"defaultActiveItemIndex\"\n      | \"onActiveChange\"\n      | \"onNavigateOutOfBounds\"\n    >,\n    Required<Pick<ToolbarProps, \"orientation\" | \"selectionStrategy\">> {\n  containerRef: RefObject<HTMLElement>;\n  itemQuery?: string;\n}\n\nexport const useToolbar = ({\n  activeItemIndex: activeItemIndexProp,\n  defaultActiveItemIndex,\n  containerRef,\n  itemQuery = \"vuuToolbarItem\",\n  onActiveChange,\n  onNavigateOutOfBounds,\n  orientation,\n  selectionStrategy,\n}: ToolbarHookProps) => {\n  const lastSelection = useRef(activeItemIndexProp);\n\n  const {\n    focusItem: keyboardHookFocusItem,\n    highlightedIdx,\n    onClick: keyboardHookHandleClick,\n    onKeyDown: keyboardHookHandleKeyDown,\n    setHighlightedIdx: keyboardHookSetHighlightedIndex,\n    ...keyboardHook\n  } = useKeyboardNavigation({\n    containerRef,\n    onNavigateOutOfBounds,\n    orientation,\n  });\n\n  const {\n    activateItem: selectionHookActivateItem,\n    itemHandlers: { onClick, onKeyDown },\n    selected: selectionHookSelected,\n  } = useSelection({\n    containerRef,\n    defaultSelected: defaultActiveItemIndex,\n    highlightedIdx,\n    itemQuery,\n    onSelectionChange: onActiveChange,\n    selected: activeItemIndexProp,\n    selectionStrategy,\n  });\n  // We need this on reEntry for navigation hook to handle focus and for dragDropHook\n  // to re-apply selection after drag drop. For some reason the value is stale if we\n  // directly use selectionHookSelected within the drag, even though all dependencies\n  //appear to be correctly declared.\n  lastSelection.current = selectionHookSelected;\n\n  const handleClick = useCallback(\n    (evt: ReactMouseEvent<HTMLElement>) => {\n      const target = evt.target as HTMLElement;\n      const toolbarItem = target.closest(\"[data-index]\") as HTMLElement;\n      if (toolbarItem) {\n        const index = parseInt(toolbarItem.dataset.index ?? \"-1\");\n        if (index !== -1 && isValidNumber(index)) {\n          keyboardHookHandleClick(evt, index);\n          onClick?.(evt, index);\n        }\n      }\n    },\n    [keyboardHookHandleClick, onClick],\n  );\n\n  const handleKeyDown = useCallback(\n    (evt: KeyboardEvent) => {\n      keyboardHookHandleKeyDown(evt);\n      if (!evt.defaultPrevented) {\n        onKeyDown?.(evt);\n      }\n    },\n    [keyboardHookHandleKeyDown, onKeyDown],\n  );\n\n  const onSwitchWrappedItemIntoView = useCallback(\n    (item: OverflowItem) => {\n      const index = parseInt(item.index);\n      if (!isNaN(index)) {\n        //TODO need to be able to reset the overflow-priority without selecting the item\n        selectionHookActivateItem(index);\n        keyboardHookFocusItem(index);\n      }\n    },\n    [keyboardHookFocusItem, selectionHookActivateItem],\n  );\n\n  const itemProps = {\n    onClick: handleClick,\n    onFocus: keyboardHook.onFocus,\n    onKeyDown: handleKeyDown,\n  };\n\n  return {\n    activeItemIndex: selectionHookSelected,\n    focusableIdx: keyboardHook.focusableIdx,\n    focusVisible: keyboardHook.focusVisible,\n    containerProps: {\n      PopupMenuProps: {\n        onKeyDown: handleKeyDown,\n        onMenuClose: keyboardHook.onOverflowMenuClose,\n      },\n      ...keyboardHook.containerProps,\n      onSwitchWrappedItemIntoView,\n    },\n    itemProps,\n  };\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"useToolbar.js","sources":["../../src/toolbar/useToolbar.ts"],"sourcesContent":["import { isValidNumber } from \"@vuu-ui/vuu-utils\";\nimport {\n  KeyboardEvent,\n  MouseEvent as ReactMouseEvent,\n  RefObject,\n  useCallback,\n  useRef,\n} from \"react\";\nimport { OverflowItem } from \"../overflow-container\";\nimport { ToolbarProps } from \"./Toolbar\";\nimport { useKeyboardNavigation } from \"./useKeyboardNavigation\";\nimport { useSelection } from \"./useSelection\";\n\nexport interface ToolbarHookProps\n  extends Pick<\n      ToolbarProps,\n      | \"activeItemIndex\"\n      | \"defaultActiveItemIndex\"\n      | \"onActiveChange\"\n      | \"onNavigateOutOfBounds\"\n    >,\n    Required<Pick<ToolbarProps, \"orientation\" | \"selectionStrategy\">> {\n  containerRef: RefObject<HTMLElement>;\n  itemQuery?: string;\n}\n\nexport const useToolbar = ({\n  activeItemIndex: activeItemIndexProp,\n  defaultActiveItemIndex,\n  containerRef,\n  itemQuery = \"vuuToolbarItem\",\n  onActiveChange,\n  onNavigateOutOfBounds,\n  orientation,\n  selectionStrategy,\n}: ToolbarHookProps) => {\n  const lastSelection = useRef(activeItemIndexProp);\n\n  const {\n    focusItem: keyboardHookFocusItem,\n    highlightedIdx,\n    onClick: keyboardHookHandleClick,\n    onKeyDown: keyboardHookHandleKeyDown,\n    setHighlightedIdx: keyboardHookSetHighlightedIndex,\n    ...keyboardHook\n  } = useKeyboardNavigation({\n    containerRef,\n    onNavigateOutOfBounds,\n    orientation,\n  });\n\n  const {\n    activateItem: selectionHookActivateItem,\n    itemHandlers: { onClick, onKeyDown },\n    selected: selectionHookSelected,\n  } = useSelection({\n    containerRef,\n    defaultSelected: defaultActiveItemIndex,\n    highlightedIdx,\n    itemQuery,\n    onSelectionChange: onActiveChange,\n    selected: activeItemIndexProp,\n    selectionStrategy,\n  });\n  // We need this on reEntry for navigation hook to handle focus and for dragDropHook\n  // to re-apply selection after drag drop. For some reason the value is stale if we\n  // directly use selectionHookSelected within the drag, even though all dependencies\n  //appear to be correctly declared.\n  lastSelection.current = selectionHookSelected;\n\n  const handleClick = useCallback(\n    (evt: ReactMouseEvent<HTMLElement>) => {\n      const target = evt.target as HTMLElement;\n      const toolbarItem = target.closest(\"[data-index]\") as HTMLElement;\n      if (toolbarItem) {\n        const index = parseInt(toolbarItem.dataset.index ?? \"-1\");\n        if (index !== -1 && isValidNumber(index)) {\n          keyboardHookHandleClick(evt, index);\n          onClick?.(evt, index);\n        }\n      }\n    },\n    [keyboardHookHandleClick, onClick],\n  );\n\n  const handleKeyDown = useCallback(\n    (evt: KeyboardEvent) => {\n      keyboardHookHandleKeyDown(evt);\n      if (!evt.defaultPrevented) {\n        onKeyDown?.(evt);\n      }\n    },\n    [keyboardHookHandleKeyDown, onKeyDown],\n  );\n\n  const onSwitchWrappedItemIntoView = useCallback(\n    (item: OverflowItem) => {\n      const index = parseInt(item.index);\n      if (!isNaN(index)) {\n        //TODO need to be able to reset the overflow-priority without selecting the item\n        selectionHookActivateItem(index);\n        keyboardHookFocusItem(index);\n      }\n    },\n    [keyboardHookFocusItem, selectionHookActivateItem],\n  );\n\n  const itemProps = {\n    onClick: handleClick,\n    onFocus: keyboardHook.onFocus,\n    onKeyDown: handleKeyDown,\n  };\n\n  return {\n    activeItemIndex: selectionHookSelected,\n    focusableIdx: keyboardHook.focusableIdx,\n    focusVisible: keyboardHook.focusVisible,\n    containerProps: {\n      PopupMenuProps: {\n        onKeyDown: handleKeyDown,\n        onMenuClose: keyboardHook.onOverflowMenuClose,\n      },\n      ...keyboardHook.containerProps,\n      onSwitchWrappedItemIntoView,\n    },\n    itemProps,\n  };\n};\n"],"names":[],"mappings":"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"}

package/esm/utils/escapeRegExp.js.map

@@ -1 +1 @@
-{"version":3,"file":"escapeRegExp.js","sources":["../../src/utils/escapeRegExp.ts"],"sourcesContent":["const regExp = /[.*+?^${}()|[\\]\\\\]/g;\n\nexport function escapeRegExp(string: string): string {\n  return string.replace(regExp, \"\\\\$&\");\n}\n"],"names":[],"mappings":"AAAA,MAAM,MAAS,GAAA,qBAAA,CAAA;AAER,SAAS,aAAa,MAAwB,EAAA;AACnD,EAAO,OAAA,MAAA,CAAO,OAAQ,CAAA,MAAA,EAAQ,MAAM,CAAA,CAAA;AACtC;;;;"}
+{"version":3,"file":"escapeRegExp.js","sources":["../../src/utils/escapeRegExp.ts"],"sourcesContent":["const regExp = /[.*+?^${}()|[\\]\\\\]/g;\n\nexport function escapeRegExp(string: string): string {\n  return string.replace(regExp, \"\\\\$&\");\n}\n"],"names":[],"mappings":"AAAA,MAAM,MAAS,GAAA,qBAAA;AAER,SAAS,aAAa,MAAwB,EAAA;AACnD,EAAO,OAAA,MAAA,CAAO,OAAQ,CAAA,MAAA,EAAQ,MAAM,CAAA;AACtC;;;;"}

package/esm/utils/forwardCallbackProps.js.map

@@ -1 +1 @@
-{"version":3,"file":"forwardCallbackProps.js","sources":["../../src/utils/forwardCallbackProps.ts"],"sourcesContent":["/*\n  When we clone a React element and inject props, if any of these are\n  callback props, make sure original callback props are also invoked.\n\n React.cloneElement(\n    element,\n    forwardCallbackProps(element.props, overrideProps)\n  )\n */\n\ntype Props = Record<string, unknown>;\n\nexport const forwardCallbackProps = <P1 extends Props, P2 extends Props>(\n  ownProps: P1,\n  overrideProps: P2\n): P1 & P2 => {\n  const props = Object.keys(ownProps).reduce<Props>(\n    (map, name) => {\n      const ownProp = ownProps[name];\n      const overrideProp = overrideProps[name];\n      if (typeof ownProp === \"function\" && typeof overrideProp === \"function\") {\n        map[name] = (...args: unknown[]) => {\n          ownProp(...args);\n          overrideProp(...args);\n        };\n      }\n      return map;\n    },\n    { ...overrideProps }\n  );\n\n  return props as P1 & P2;\n};\n"],"names":[],"mappings":"AAYa,MAAA,oBAAA,GAAuB,CAClC,QAAA,EACA,aACY,KAAA;AACZ,EAAA,MAAM,KAAQ,GAAA,MAAA,CAAO,IAAK,CAAA,QAAQ,CAAE,CAAA,MAAA;AAAA,IAClC,CAAC,KAAK,IAAS,KAAA;AACb,MAAM,MAAA,OAAA,GAAU,SAAS,IAAI,CAAA,CAAA;AAC7B,MAAM,MAAA,YAAA,GAAe,cAAc,IAAI,CAAA,CAAA;AACvC,MAAA,IAAI,OAAO,OAAA,KAAY,UAAc,IAAA,OAAO,iBAAiB,UAAY,EAAA;AACvE,QAAI,GAAA,CAAA,IAAI,CAAI,GAAA,CAAA,GAAI,IAAoB,KAAA;AAClC,UAAA,OAAA,CAAQ,GAAG,IAAI,CAAA,CAAA;AACf,UAAA,YAAA,CAAa,GAAG,IAAI,CAAA,CAAA;AAAA,SACtB,CAAA;AAAA,OACF;AACA,MAAO,OAAA,GAAA,CAAA;AAAA,KACT;AAAA,IACA,EAAE,GAAG,aAAc,EAAA;AAAA,GACrB,CAAA;AAEA,EAAO,OAAA,KAAA,CAAA;AACT;;;;"}
+{"version":3,"file":"forwardCallbackProps.js","sources":["../../src/utils/forwardCallbackProps.ts"],"sourcesContent":["/*\n  When we clone a React element and inject props, if any of these are\n  callback props, make sure original callback props are also invoked.\n\n React.cloneElement(\n    element,\n    forwardCallbackProps(element.props, overrideProps)\n  )\n */\n\ntype Props = Record<string, unknown>;\n\nexport const forwardCallbackProps = <P1 extends Props, P2 extends Props>(\n  ownProps: P1,\n  overrideProps: P2\n): P1 & P2 => {\n  const props = Object.keys(ownProps).reduce<Props>(\n    (map, name) => {\n      const ownProp = ownProps[name];\n      const overrideProp = overrideProps[name];\n      if (typeof ownProp === \"function\" && typeof overrideProp === \"function\") {\n        map[name] = (...args: unknown[]) => {\n          ownProp(...args);\n          overrideProp(...args);\n        };\n      }\n      return map;\n    },\n    { ...overrideProps }\n  );\n\n  return props as P1 & P2;\n};\n"],"names":[],"mappings":"AAYa,MAAA,oBAAA,GAAuB,CAClC,QAAA,EACA,aACY,KAAA;AACZ,EAAA,MAAM,KAAQ,GAAA,MAAA,CAAO,IAAK,CAAA,QAAQ,CAAE,CAAA,MAAA;AAAA,IAClC,CAAC,KAAK,IAAS,KAAA;AACb,MAAM,MAAA,OAAA,GAAU,SAAS,IAAI,CAAA;AAC7B,MAAM,MAAA,YAAA,GAAe,cAAc,IAAI,CAAA;AACvC,MAAA,IAAI,OAAO,OAAA,KAAY,UAAc,IAAA,OAAO,iBAAiB,UAAY,EAAA;AACvE,QAAI,GAAA,CAAA,IAAI,CAAI,GAAA,CAAA,GAAI,IAAoB,KAAA;AAClC,UAAA,OAAA,CAAQ,GAAG,IAAI,CAAA;AACf,UAAA,YAAA,CAAa,GAAG,IAAI,CAAA;AAAA,SACtB;AAAA;AAEF,MAAO,OAAA,GAAA;AAAA,KACT;AAAA,IACA,EAAE,GAAG,aAAc;AAAA,GACrB;AAEA,EAAO,OAAA,KAAA;AACT;;;;"}

package/esm/utils/isOverflowElement.js.map

@@ -1 +1 @@
-{"version":3,"file":"isOverflowElement.js","sources":["../../src/utils/isOverflowElement.ts"],"sourcesContent":["// TODO this is very fragile\nexport const isOverflowElement = (element: HTMLElement | null) =>\n  element !== null &&\n  element.dataset.index === \"overflow\" &&\n  element.parentElement !== null &&\n  element.parentElement.classList.contains(\n    \"vuuOverflowContainer-wrapContainer-overflowed\"\n  );\n"],"names":[],"mappings":"AACO,MAAM,iBAAoB,GAAA,CAAC,OAChC,KAAA,OAAA,KAAY,QACZ,OAAQ,CAAA,OAAA,CAAQ,KAAU,KAAA,UAAA,IAC1B,OAAQ,CAAA,aAAA,KAAkB,IAC1B,IAAA,OAAA,CAAQ,cAAc,SAAU,CAAA,QAAA;AAAA,EAC9B,+CAAA;AACF;;;;"}
+{"version":3,"file":"isOverflowElement.js","sources":["../../src/utils/isOverflowElement.ts"],"sourcesContent":["// TODO this is very fragile\nexport const isOverflowElement = (element: HTMLElement | null) =>\n  element !== null &&\n  element.dataset.index === \"overflow\" &&\n  element.parentElement !== null &&\n  element.parentElement.classList.contains(\n    \"vuuOverflowContainer-wrapContainer-overflowed\"\n  );\n"],"names":[],"mappings":"AACO,MAAM,iBAAoB,GAAA,CAAC,OAChC,KAAA,OAAA,KAAY,QACZ,OAAQ,CAAA,OAAA,CAAQ,KAAU,KAAA,UAAA,IAC1B,OAAQ,CAAA,aAAA,KAAkB,IAC1B,IAAA,OAAA,CAAQ,cAAc,SAAU,CAAA,QAAA;AAAA,EAC9B;AACF;;;;"}

package/esm/vuu-date-picker/VuuDatePicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"VuuDatePicker.js","sources":["../../src/vuu-date-picker/VuuDatePicker.tsx"],"sourcesContent":["import { CommitHandler } from \"@vuu-ui/vuu-utils\";\nimport {\n  DateValue,\n  getLocalTimeZone,\n  isSameDay,\n  isSameMonth,\n  isSameYear,\n} from \"@internationalized/date\";\nimport cx from \"clsx\";\nimport {\n  ChangeEvent,\n  KeyboardEvent,\n  SyntheticEvent,\n  useCallback,\n  useRef,\n  useState,\n} from \"react\";\nimport { SingleSelectionValueType } from \"../calendar\";\nimport { DatePicker, DatePickerProps } from \"../date-picker\";\n\nconst classBase = \"VuuDatePicker\";\n\nconst isSameDate = (d1: DateValue, d2?: DateValue) =>\n  d2 !== undefined &&\n  isSameDay(d1, d2) &&\n  isSameMonth(d1, d2) &&\n  isSameYear(d1, d2);\n\nconst datePattern = /^\\d{1,2} [a-z]{3} \\d{4}$/i;\nconst isValidDate = (value?: string) =>\n  value !== undefined &&\n  value?.match(datePattern) !== null &&\n  !Number.isNaN(new Date(value).getDay());\n\nconst localTimeZone = getLocalTimeZone();\n\nconst toEpochMillis = (\n  date: DateValue,\n  timezone: string = getLocalTimeZone(),\n): number => date.toDate(timezone).getTime();\n\ntype DateState =\n  | {\n      datePickerKey: \"controlled\";\n      defaultDate: undefined;\n      selectedDate: DateValue;\n    }\n  | {\n      datePickerKey: \"uncontrolled\";\n      defaultDate: DateValue | undefined;\n      selectedDate: undefined;\n    };\n\nconst getDates = (selectedDate: DateValue | undefined): DateState => {\n  if (selectedDate) {\n    return {\n      datePickerKey: \"controlled\",\n      defaultDate: undefined,\n      selectedDate,\n    };\n  } else {\n    return {\n      datePickerKey: \"uncontrolled\",\n      defaultDate: undefined,\n      selectedDate,\n    };\n  }\n};\n\nexport const VuuDatePicker = ({\n  className,\n  onSelectionChange,\n  selectedDate: selectedDateProp,\n  onCommit,\n  preserveFocusOnSelect,\n  ...props\n}: Omit<DatePickerProps<SingleSelectionValueType>, \"defaultSelectedDate\"> & {\n  onCommit?: CommitHandler<HTMLElement, number>;\n  preserveFocusOnSelect?: boolean;\n}) => {\n  const [open, _setOpen] = useState(false);\n  const valueRef = useRef(\"\");\n  const datePickerRef = useRef<HTMLDivElement>(null);\n\n  const dateState = useRef<DateState>(getDates(selectedDateProp));\n\n  const setOpen = (o: boolean) => {\n    console.log(`setOpen ${o}`);\n    _setOpen(o);\n  };\n\n  const commitDateChange = useCallback(\n    (e: SyntheticEvent<Element>, date: DateValue) => {\n      onSelectionChange?.(e, date);\n      setOpen(false);\n      onCommit?.(\n        e as SyntheticEvent<HTMLElement>,\n        toEpochMillis(date, localTimeZone),\n      );\n\n      if (preserveFocusOnSelect) {\n        requestAnimationFrame(() => {\n          datePickerRef.current?.querySelector(\"input\")?.focus();\n        });\n      }\n    },\n    [onCommit, onSelectionChange, preserveFocusOnSelect],\n  );\n\n  const handleSelectionChange = useCallback(\n    (e: SyntheticEvent<Element>, date: DateValue) => {\n      const { selectedDate } = dateState.current;\n      // id date is undefined, we're openung the picker on an empty field\n      if (date) {\n        if (selectedDate === undefined) {\n          dateState.current = getDates(date);\n          commitDateChange(e, date);\n        } else if (!isSameDate(date, selectedDate)) {\n          dateState.current.selectedDate = date;\n          commitDateChange(e, date);\n        }\n      }\n    },\n    [commitDateChange],\n  );\n\n  const handleChange = (evt: ChangeEvent<HTMLInputElement>, value = \"\") => {\n    console.log(`handleChange`, {\n      evt,\n      value,\n    });\n    valueRef.current = value;\n    console.log(`is '${value}' a valid date ? ${isValidDate(value)}`);\n  };\n\n  const handleKeyDown = (e: KeyboardEvent<HTMLDivElement>) => {\n    if (e.key === \"ArrowDown\") {\n      setOpen(true);\n    }\n  };\n\n  const handleKeyDownCapture = (e: KeyboardEvent<HTMLDivElement>) => {\n    if (e.key === \"Enter\") {\n      if (isValidDate(valueRef.current)) {\n        console.log(`committayaface (${valueRef.current})`);\n      } else {\n        console.log(\n          `nice try cowboy, but '${valueRef.current}' is nota valid date`,\n        );\n        e.stopPropagation();\n      }\n    }\n  };\n\n  const { datePickerKey, defaultDate, selectedDate } = dateState.current;\n\n  return (\n    <DatePicker\n      {...props}\n      className={cx(classBase, className)}\n      defaultSelectedDate={defaultDate}\n      key={datePickerKey}\n      open={open}\n      onChange={handleChange}\n      onKeyDown={handleKeyDown}\n      onKeyDownCapture={handleKeyDownCapture}\n      onOpenChange={setOpen}\n      ref={datePickerRef}\n      onSelectionChange={(e, date) =>\n        handleSelectionChange(e, date as DateValue)\n      }\n      selectedDate={selectedDate}\n    />\n  );\n};\n"],"names":["selectedDate"],"mappings":"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"}
+{"version":3,"file":"VuuDatePicker.js","sources":["../../src/vuu-date-picker/VuuDatePicker.tsx"],"sourcesContent":["import { CommitHandler } from \"@vuu-ui/vuu-utils\";\nimport {\n  DateValue,\n  getLocalTimeZone,\n  isSameDay,\n  isSameMonth,\n  isSameYear,\n} from \"@internationalized/date\";\nimport cx from \"clsx\";\nimport {\n  ChangeEvent,\n  KeyboardEvent,\n  SyntheticEvent,\n  useCallback,\n  useRef,\n  useState,\n} from \"react\";\nimport { SingleSelectionValueType } from \"../calendar\";\nimport { DatePicker, DatePickerProps } from \"../date-picker\";\n\nconst classBase = \"VuuDatePicker\";\n\nconst isSameDate = (d1: DateValue, d2?: DateValue) =>\n  d2 !== undefined &&\n  isSameDay(d1, d2) &&\n  isSameMonth(d1, d2) &&\n  isSameYear(d1, d2);\n\nconst datePattern = /^\\d{1,2} [a-z]{3} \\d{4}$/i;\nconst isValidDate = (value?: string) =>\n  value !== undefined &&\n  value?.match(datePattern) !== null &&\n  !Number.isNaN(new Date(value).getDay());\n\nconst localTimeZone = getLocalTimeZone();\n\nconst toEpochMillis = (\n  date: DateValue,\n  timezone: string = getLocalTimeZone(),\n): number => date.toDate(timezone).getTime();\n\ntype DateState =\n  | {\n      datePickerKey: \"controlled\";\n      defaultDate: undefined;\n      selectedDate: DateValue;\n    }\n  | {\n      datePickerKey: \"uncontrolled\";\n      defaultDate: DateValue | undefined;\n      selectedDate: undefined;\n    };\n\nconst getDates = (selectedDate: DateValue | undefined): DateState => {\n  if (selectedDate) {\n    return {\n      datePickerKey: \"controlled\",\n      defaultDate: undefined,\n      selectedDate,\n    };\n  } else {\n    return {\n      datePickerKey: \"uncontrolled\",\n      defaultDate: undefined,\n      selectedDate,\n    };\n  }\n};\n\nexport const VuuDatePicker = ({\n  className,\n  onSelectionChange,\n  selectedDate: selectedDateProp,\n  onCommit,\n  preserveFocusOnSelect,\n  ...props\n}: Omit<DatePickerProps<SingleSelectionValueType>, \"defaultSelectedDate\"> & {\n  onCommit?: CommitHandler<HTMLElement, number>;\n  preserveFocusOnSelect?: boolean;\n}) => {\n  const [open, _setOpen] = useState(false);\n  const valueRef = useRef(\"\");\n  const datePickerRef = useRef<HTMLDivElement>(null);\n\n  const dateState = useRef<DateState>(getDates(selectedDateProp));\n\n  const setOpen = (o: boolean) => {\n    console.log(`setOpen ${o}`);\n    _setOpen(o);\n  };\n\n  const commitDateChange = useCallback(\n    (e: SyntheticEvent<Element>, date: DateValue) => {\n      onSelectionChange?.(e, date);\n      setOpen(false);\n      onCommit?.(\n        e as SyntheticEvent<HTMLElement>,\n        toEpochMillis(date, localTimeZone),\n      );\n\n      if (preserveFocusOnSelect) {\n        requestAnimationFrame(() => {\n          datePickerRef.current?.querySelector(\"input\")?.focus();\n        });\n      }\n    },\n    [onCommit, onSelectionChange, preserveFocusOnSelect],\n  );\n\n  const handleSelectionChange = useCallback(\n    (e: SyntheticEvent<Element>, date: DateValue) => {\n      const { selectedDate } = dateState.current;\n      // id date is undefined, we're openung the picker on an empty field\n      if (date) {\n        if (selectedDate === undefined) {\n          dateState.current = getDates(date);\n          commitDateChange(e, date);\n        } else if (!isSameDate(date, selectedDate)) {\n          dateState.current.selectedDate = date;\n          commitDateChange(e, date);\n        }\n      }\n    },\n    [commitDateChange],\n  );\n\n  const handleChange = (evt: ChangeEvent<HTMLInputElement>, value = \"\") => {\n    console.log(`handleChange`, {\n      evt,\n      value,\n    });\n    valueRef.current = value;\n    console.log(`is '${value}' a valid date ? ${isValidDate(value)}`);\n  };\n\n  const handleKeyDown = (e: KeyboardEvent<HTMLDivElement>) => {\n    if (e.key === \"ArrowDown\") {\n      setOpen(true);\n    }\n  };\n\n  const handleKeyDownCapture = (e: KeyboardEvent<HTMLDivElement>) => {\n    if (e.key === \"Enter\") {\n      if (isValidDate(valueRef.current)) {\n        console.log(`committayaface (${valueRef.current})`);\n      } else {\n        console.log(\n          `nice try cowboy, but '${valueRef.current}' is nota valid date`,\n        );\n        e.stopPropagation();\n      }\n    }\n  };\n\n  const { datePickerKey, defaultDate, selectedDate } = dateState.current;\n\n  return (\n    <DatePicker\n      {...props}\n      className={cx(classBase, className)}\n      defaultSelectedDate={defaultDate}\n      key={datePickerKey}\n      open={open}\n      onChange={handleChange}\n      onKeyDown={handleKeyDown}\n      onKeyDownCapture={handleKeyDownCapture}\n      onOpenChange={setOpen}\n      ref={datePickerRef}\n      onSelectionChange={(e, date) =>\n        handleSelectionChange(e, date as DateValue)\n      }\n      selectedDate={selectedDate}\n    />\n  );\n};\n"],"names":["selectedDate"],"mappings":"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"}

package/esm/vuu-input/VuuInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"VuuInput.js","sources":["../../src/vuu-input/VuuInput.tsx"],"sourcesContent":["import { VuuRowDataItemType } from \"@vuu-ui/vuu-protocol-types\";\nimport { CommitHandler, isValidNumber, useId } from \"@vuu-ui/vuu-utils\";\nimport { Input, InputProps, Tooltip } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport cx from \"clsx\";\nimport {\n  ChangeEventHandler,\n  FocusEventHandler,\n  ForwardedRef,\n  KeyboardEventHandler,\n  ReactElement,\n  ReactNode,\n  forwardRef,\n  useCallback,\n} from \"react\";\n\nimport vuuInputCss from \"./VuuInput.css\";\n\nconst classBase = \"vuuInput\";\n\nexport interface VuuInputProps<T extends VuuRowDataItemType = string>\n  extends Omit<InputProps, \"validationStatus\"> {\n  commitWhenCleared?: boolean;\n  errorMessage?: ReactNode;\n  onCommit: CommitHandler<HTMLInputElement, T | undefined>;\n  type?: T;\n}\n\n/**\n * A variant of Salt Input that provides a commit callback prop,\n * TODO along with cancel behaviour ?\n */\nexport const VuuInput = forwardRef(function VuuInput<\n  T extends VuuRowDataItemType = string,\n>(\n  {\n    className,\n    commitWhenCleared = false,\n    errorMessage,\n    id: idProp,\n    onCommit,\n    onKeyDown,\n    type,\n    ...props\n  }: VuuInputProps<T>,\n  forwardedRef: ForwardedRef<HTMLDivElement>,\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-input\",\n    css: vuuInputCss,\n    window: targetWindow,\n  });\n\n  const id = useId(idProp);\n\n  const commitValue = useCallback<CommitHandler>(\n    (evt, value) => {\n      if (type === \"number\") {\n        const numericValue = parseFloat(value);\n        if (isValidNumber(numericValue)) {\n          onCommit(evt, numericValue as T, \"text-input\");\n        } else {\n          //TODO add validation logic\n          throw Error(\"Invalid value\");\n        }\n      } else if (type === \"boolean\") {\n        onCommit(evt, Boolean(value) as T, \"text-input\");\n      } else {\n        onCommit(evt, value as T, \"text-input\");\n      }\n    },\n    [onCommit, type],\n  );\n\n  const handleChange = useCallback<ChangeEventHandler<HTMLInputElement>>(\n    (evt) => {\n      const value = evt.target.value;\n      if (value.trim() === \"\" && commitWhenCleared) {\n        onCommit?.(evt, value as T);\n      }\n      props.inputProps?.onChange?.(evt);\n    },\n    [commitWhenCleared, onCommit, props.inputProps],\n  );\n\n  const handleKeyDown = useCallback<KeyboardEventHandler<HTMLInputElement>>(\n    (evt) => {\n      if (evt.key === \"Enter\") {\n        evt.preventDefault();\n        evt.stopPropagation();\n        const { value } = evt.target as HTMLInputElement;\n        commitValue(evt, value);\n      }\n      onKeyDown?.(evt);\n    },\n    [commitValue, onKeyDown],\n  );\n\n  const handleBlur = useCallback<FocusEventHandler<HTMLInputElement>>(\n    (evt) => {\n      const { value } = evt.target as HTMLInputElement;\n      commitValue(evt, value);\n    },\n    [commitValue],\n  );\n\n  const endAdornment = errorMessage ? (\n    <Tooltip content={errorMessage} status=\"error\">\n      <span className={`${classBase}-errorIcon`} data-icon=\"error\" />\n    </Tooltip>\n  ) : undefined;\n\n  return (\n    <>\n      <Input\n        {...props}\n        endAdornment={endAdornment}\n        id={id}\n        inputProps={{\n          autoComplete: \"off\",\n          ...props.inputProps,\n          onChange: handleChange,\n        }}\n        className={cx(classBase, className, {\n          [`${classBase}-error`]: errorMessage,\n        })}\n        onBlur={handleBlur}\n        ref={forwardedRef}\n        onKeyDown={handleKeyDown}\n      />\n    </>\n  );\n}) as <T extends VuuRowDataItemType = string>(\n  props: VuuInputProps<T> & {\n    ref?: ForwardedRef<HTMLDivElement>;\n  },\n) => ReactElement<VuuInputProps<T>>;\n"],"names":["VuuInput"],"mappings":"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"}
+{"version":3,"file":"VuuInput.js","sources":["../../src/vuu-input/VuuInput.tsx"],"sourcesContent":["import { VuuRowDataItemType } from \"@vuu-ui/vuu-protocol-types\";\nimport { CommitHandler, isValidNumber, useId } from \"@vuu-ui/vuu-utils\";\nimport { Input, InputProps, Tooltip } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport cx from \"clsx\";\nimport {\n  ChangeEventHandler,\n  FocusEventHandler,\n  ForwardedRef,\n  KeyboardEventHandler,\n  ReactElement,\n  ReactNode,\n  forwardRef,\n  useCallback,\n} from \"react\";\n\nimport vuuInputCss from \"./VuuInput.css\";\n\nconst classBase = \"vuuInput\";\n\nexport interface VuuInputProps<T extends VuuRowDataItemType = string>\n  extends Omit<InputProps, \"validationStatus\"> {\n  commitWhenCleared?: boolean;\n  errorMessage?: ReactNode;\n  onCommit: CommitHandler;\n  type?: T;\n}\n\n/**\n * A variant of Salt Input that provides a commit callback prop,\n * TODO along with cancel behaviour ?\n */\nexport const VuuInput = forwardRef(function VuuInput<\n  T extends VuuRowDataItemType = string,\n>(\n  {\n    className,\n    commitWhenCleared = false,\n    errorMessage,\n    id: idProp,\n    onCommit,\n    onKeyDown,\n    type,\n    ...props\n  }: VuuInputProps<T>,\n  forwardedRef: ForwardedRef<HTMLDivElement>,\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-input\",\n    css: vuuInputCss,\n    window: targetWindow,\n  });\n\n  const id = useId(idProp);\n\n  const commitValue = useCallback<CommitHandler<HTMLInputElement, string>>(\n    (evt, value) => {\n      if (type === \"number\") {\n        const numericValue = parseFloat(value);\n        if (isValidNumber(numericValue)) {\n          onCommit(evt, numericValue as T, \"text-input\");\n        } else {\n          //TODO add validation logic\n          throw Error(\"Invalid value\");\n        }\n      } else if (type === \"boolean\") {\n        onCommit(evt, Boolean(value) as T, \"text-input\");\n      } else {\n        onCommit(evt, value as T, \"text-input\");\n      }\n    },\n    [onCommit, type],\n  );\n\n  const handleChange = useCallback<ChangeEventHandler<HTMLInputElement>>(\n    (evt) => {\n      const value = evt.target.value;\n      if (value.trim() === \"\" && commitWhenCleared) {\n        onCommit?.(evt, value as T);\n      }\n      props.inputProps?.onChange?.(evt);\n    },\n    [commitWhenCleared, onCommit, props.inputProps],\n  );\n\n  const handleKeyDown = useCallback<KeyboardEventHandler<HTMLInputElement>>(\n    (evt) => {\n      if (evt.key === \"Enter\") {\n        evt.preventDefault();\n        evt.stopPropagation();\n        const { value } = evt.target as HTMLInputElement;\n        commitValue(evt, value);\n      }\n      onKeyDown?.(evt);\n    },\n    [commitValue, onKeyDown],\n  );\n\n  const handleBlur = useCallback<FocusEventHandler<HTMLInputElement>>(\n    (evt) => {\n      const { value } = evt.target as HTMLInputElement;\n      commitValue(evt, value);\n    },\n    [commitValue],\n  );\n\n  const endAdornment = errorMessage ? (\n    <Tooltip content={errorMessage} status=\"error\">\n      <span className={`${classBase}-errorIcon`} data-icon=\"error\" />\n    </Tooltip>\n  ) : undefined;\n\n  return (\n    <>\n      <Input\n        {...props}\n        endAdornment={endAdornment}\n        id={id}\n        inputProps={{\n          autoComplete: \"off\",\n          ...props.inputProps,\n          onChange: handleChange,\n        }}\n        className={cx(classBase, className, {\n          [`${classBase}-error`]: errorMessage,\n        })}\n        onBlur={handleBlur}\n        ref={forwardedRef}\n        onKeyDown={handleKeyDown}\n      />\n    </>\n  );\n}) as <T extends VuuRowDataItemType = string>(\n  props: VuuInputProps<T> & {\n    ref?: ForwardedRef<HTMLDivElement>;\n  },\n) => ReactElement<VuuInputProps<T>>;\n"],"names":["VuuInput"],"mappings":"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"}

package/esm/vuu-typeahead-input/VuuTypeaheadInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"VuuTypeaheadInput.js","sources":["../../src/vuu-typeahead-input/VuuTypeaheadInput.tsx"],"sourcesContent":["import type { TableSchemaTable } from \"@vuu-ui/vuu-data-types\";\nimport { NO_DATA_MATCH, type CommitHandler } from \"@vuu-ui/vuu-utils\";\nimport { ComboBox, Option } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useVuuTypeaheadInput } from \"./useVuuTypeaheadInput\";\n\nimport vuuTypeaheadInputCss from \"./VuuTypeaheadInput.css\";\nimport { PillInputProps } from \"@salt-ds/core/dist-types/pill-input\";\n\nconst classBase = \"vuuTypeaheadInput\";\nconst [noMatchingData] = NO_DATA_MATCH;\n\nexport interface VuuTypeaheadInputProps {\n  /**\n   * Allows a text string to be submitted that does not match any suggestion\n   * Defaults to true\n   */\n  allowFreeInput?: boolean;\n  column: string;\n  /**\n   * A warning to display to the user if allowFreeText is false and they attempt\n   * to commit text which does not match any suggestions. A default message will\n   * be shown if not provided\n   */\n  freeTextWarning?: string;\n  /**\n   * When suggestions are displayed, should first option be highlighted ?\n   * Highlighted option will be selected if Enter pressed. If this option\n   * is not applied and no suggestion is highlighted, Enter will commit\n   * current text. This will be desirable if filter operator  will be\n   * 'contains', not if filter operator will be '='.\n   */\n  highlightFirstSuggestion?: boolean;\n  inputProps?: PillInputProps[\"inputProps\"];\n  onCommit: CommitHandler<HTMLInputElement>;\n  table: TableSchemaTable;\n}\n\nexport const VuuTypeaheadInput = ({\n  allowFreeInput,\n  column,\n  freeTextWarning,\n  highlightFirstSuggestion,\n  inputProps: inputPropsProp,\n  onCommit,\n  table,\n}: VuuTypeaheadInputProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-typeahead-input\",\n    css: vuuTypeaheadInputCss,\n    window: targetWindow,\n  });\n\n  const {\n    inputProps,\n    noFreeText,\n    onChange,\n    onKeyDown,\n    onOpenChange,\n    onSelectionChange,\n    open,\n    ref,\n    typeaheadValues,\n    value,\n  } = useVuuTypeaheadInput({\n    allowFreeInput,\n    column,\n    freeTextWarning,\n    highlightFirstSuggestion,\n    inputProps: inputPropsProp,\n    onCommit,\n    table,\n  });\n\n  // need latest version of salt combobox\n  // const defaultHighlightedIndex =\n  //   highlightFirstSuggestion === false ? -1 : undefined;\n\n  return (\n    <ComboBox\n      className={classBase}\n      // defaultHighlightedIndex={defaultHighlightedIndex}\n      inputProps={inputProps}\n      onChange={onChange}\n      onKeyDown={onKeyDown}\n      onOpenChange={onOpenChange}\n      onSelectionChange={onSelectionChange}\n      open={open}\n      ref={ref}\n      value={value}\n    >\n      {typeaheadValues.map((state) => (\n        <Option\n          className=\"vuuTypeaheadOption\"\n          value={state}\n          key={state}\n          disabled={state === noMatchingData || state === noFreeText}\n        />\n      ))}\n    </ComboBox>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;AAUA,MAAM,SAAY,GAAA,mBAAA,CAAA;AAClB,MAAM,CAAC,cAAc,CAAI,GAAA,aAAA,CAAA;AA4BlB,MAAM,oBAAoB,CAAC;AAAA,EAChC,cAAA;AAAA,EACA,MAAA;AAAA,EACA,eAAA;AAAA,EACA,wBAAA;AAAA,EACA,UAAY,EAAA,cAAA;AAAA,EACZ,QAAA;AAAA,EACA,KAAA;AACF,CAA8B,KAAA;AAC5B,EAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,qBAAA;AAAA,IACR,GAAK,EAAA,oBAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAM,MAAA;AAAA,IACJ,UAAA;AAAA,IACA,UAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA;AAAA,IACA,YAAA;AAAA,IACA,iBAAA;AAAA,IACA,IAAA;AAAA,IACA,GAAA;AAAA,IACA,eAAA;AAAA,IACA,KAAA;AAAA,MACE,oBAAqB,CAAA;AAAA,IACvB,cAAA;AAAA,IACA,MAAA;AAAA,IACA,eAAA;AAAA,IACA,wBAAA;AAAA,IACA,UAAY,EAAA,cAAA;AAAA,IACZ,QAAA;AAAA,IACA,KAAA;AAAA,GACD,CAAA,CAAA;AAMD,EACE,uBAAA,GAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACC,SAAW,EAAA,SAAA;AAAA,MAEX,UAAA;AAAA,MACA,QAAA;AAAA,MACA,SAAA;AAAA,MACA,YAAA;AAAA,MACA,iBAAA;AAAA,MACA,IAAA;AAAA,MACA,GAAA;AAAA,MACA,KAAA;AAAA,MAEC,QAAA,EAAA,eAAA,CAAgB,GAAI,CAAA,CAAC,KACpB,qBAAA,GAAA;AAAA,QAAC,MAAA;AAAA,QAAA;AAAA,UACC,SAAU,EAAA,oBAAA;AAAA,UACV,KAAO,EAAA,KAAA;AAAA,UAEP,QAAA,EAAU,KAAU,KAAA,cAAA,IAAkB,KAAU,KAAA,UAAA;AAAA,SAAA;AAAA,QAD3C,KAAA;AAAA,OAGR,CAAA;AAAA,KAAA;AAAA,GACH,CAAA;AAEJ;;;;"}
+{"version":3,"file":"VuuTypeaheadInput.js","sources":["../../src/vuu-typeahead-input/VuuTypeaheadInput.tsx"],"sourcesContent":["import type { TableSchemaTable } from \"@vuu-ui/vuu-data-types\";\nimport { NO_DATA_MATCH, type CommitHandler } from \"@vuu-ui/vuu-utils\";\nimport { ComboBox, Option } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useVuuTypeaheadInput } from \"./useVuuTypeaheadInput\";\n\nimport vuuTypeaheadInputCss from \"./VuuTypeaheadInput.css\";\nimport { PillInputProps } from \"@salt-ds/core/dist-types/pill-input\";\n\nconst classBase = \"vuuTypeaheadInput\";\nconst [noMatchingData] = NO_DATA_MATCH;\n\nexport interface VuuTypeaheadInputProps {\n  /**\n   * Allows a text string to be submitted that does not match any suggestion\n   * Defaults to true\n   */\n  allowFreeInput?: boolean;\n  column: string;\n  /**\n   * A warning to display to the user if allowFreeText is false and they attempt\n   * to commit text which does not match any suggestions. A default message will\n   * be shown if not provided\n   */\n  freeTextWarning?: string;\n  /**\n   * When suggestions are displayed, should first option be highlighted ?\n   * Highlighted option will be selected if Enter pressed. If this option\n   * is not applied and no suggestion is highlighted, Enter will commit\n   * current text. This will be desirable if filter operator  will be\n   * 'contains', not if filter operator will be '='.\n   */\n  highlightFirstSuggestion?: boolean;\n  inputProps?: PillInputProps[\"inputProps\"];\n  onCommit: CommitHandler<HTMLInputElement>;\n  table: TableSchemaTable;\n}\n\nexport const VuuTypeaheadInput = ({\n  allowFreeInput,\n  column,\n  freeTextWarning,\n  highlightFirstSuggestion,\n  inputProps: inputPropsProp,\n  onCommit,\n  table,\n}: VuuTypeaheadInputProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-typeahead-input\",\n    css: vuuTypeaheadInputCss,\n    window: targetWindow,\n  });\n\n  const {\n    inputProps,\n    noFreeText,\n    onChange,\n    onKeyDown,\n    onOpenChange,\n    onSelectionChange,\n    open,\n    ref,\n    typeaheadValues,\n    value,\n  } = useVuuTypeaheadInput({\n    allowFreeInput,\n    column,\n    freeTextWarning,\n    highlightFirstSuggestion,\n    inputProps: inputPropsProp,\n    onCommit,\n    table,\n  });\n\n  // need latest version of salt combobox\n  // const defaultHighlightedIndex =\n  //   highlightFirstSuggestion === false ? -1 : undefined;\n\n  return (\n    <ComboBox\n      className={classBase}\n      // defaultHighlightedIndex={defaultHighlightedIndex}\n      inputProps={inputProps}\n      onChange={onChange}\n      onKeyDown={onKeyDown}\n      onOpenChange={onOpenChange}\n      onSelectionChange={onSelectionChange}\n      open={open}\n      ref={ref}\n      value={value}\n    >\n      {typeaheadValues.map((state) => (\n        <Option\n          className=\"vuuTypeaheadOption\"\n          value={state}\n          key={state}\n          disabled={state === noMatchingData || state === noFreeText}\n        />\n      ))}\n    </ComboBox>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;AAUA,MAAM,SAAY,GAAA,mBAAA;AAClB,MAAM,CAAC,cAAc,CAAI,GAAA,aAAA;AA4BlB,MAAM,oBAAoB,CAAC;AAAA,EAChC,cAAA;AAAA,EACA,MAAA;AAAA,EACA,eAAA;AAAA,EACA,wBAAA;AAAA,EACA,UAAY,EAAA,cAAA;AAAA,EACZ,QAAA;AAAA,EACA;AACF,CAA8B,KAAA;AAC5B,EAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,qBAAA;AAAA,IACR,GAAK,EAAA,oBAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAM,MAAA;AAAA,IACJ,UAAA;AAAA,IACA,UAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA;AAAA,IACA,YAAA;AAAA,IACA,iBAAA;AAAA,IACA,IAAA;AAAA,IACA,GAAA;AAAA,IACA,eAAA;AAAA,IACA;AAAA,MACE,oBAAqB,CAAA;AAAA,IACvB,cAAA;AAAA,IACA,MAAA;AAAA,IACA,eAAA;AAAA,IACA,wBAAA;AAAA,IACA,UAAY,EAAA,cAAA;AAAA,IACZ,QAAA;AAAA,IACA;AAAA,GACD,CAAA;AAMD,EACE,uBAAA,GAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACC,SAAW,EAAA,SAAA;AAAA,MAEX,UAAA;AAAA,MACA,QAAA;AAAA,MACA,SAAA;AAAA,MACA,YAAA;AAAA,MACA,iBAAA;AAAA,MACA,IAAA;AAAA,MACA,GAAA;AAAA,MACA,KAAA;AAAA,MAEC,QAAA,EAAA,eAAA,CAAgB,GAAI,CAAA,CAAC,KACpB,qBAAA,GAAA;AAAA,QAAC,MAAA;AAAA,QAAA;AAAA,UACC,SAAU,EAAA,oBAAA;AAAA,UACV,KAAO,EAAA,KAAA;AAAA,UAEP,QAAA,EAAU,KAAU,KAAA,cAAA,IAAkB,KAAU,KAAA;AAAA,SAAA;AAAA,QAD3C;AAAA,OAGR;AAAA;AAAA,GACH;AAEJ;;;;"}

package/esm/vuu-typeahead-input/useVuuTypeaheadInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"useVuuTypeaheadInput.js","sources":["../../src/vuu-typeahead-input/useVuuTypeaheadInput.ts"],"sourcesContent":["import { useTypeaheadSuggestions } from \"@vuu-ui/vuu-data-react\";\nimport type { TypeaheadParams } from \"@vuu-ui/vuu-protocol-types\";\nimport {\n  dispatchKeyboardEvent,\n  getVuuTable,\n  useStateRef,\n  NO_DATA_MATCH,\n} from \"@vuu-ui/vuu-utils\";\nimport {\n  ComponentPropsWithoutRef,\n  KeyboardEventHandler,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n  type ChangeEventHandler,\n  type RefCallback,\n  type SyntheticEvent,\n} from \"react\";\nimport type { VuuTypeaheadInputProps } from \"./VuuTypeaheadInput\";\n\nexport type VuuTypeaheadInputHookProps = Pick<\n  VuuTypeaheadInputProps,\n  | \"allowFreeInput\"\n  | \"column\"\n  | \"freeTextWarning\"\n  | \"highlightFirstSuggestion\"\n  | \"inputProps\"\n  | \"onCommit\"\n  | \"table\"\n>;\n\nconst defaultFreeTextWarning =\n  \"Please select a value from the list of suggestions. If no suggestions match your text, then the value is not valid. If you believe this should be a valid value, please reach out to the support team\";\n\nexport const useVuuTypeaheadInput = ({\n  allowFreeInput = true,\n  column,\n  freeTextWarning,\n  highlightFirstSuggestion = true,\n  inputProps: inputPropsProp,\n  onCommit,\n  table,\n}: VuuTypeaheadInputHookProps) => {\n  const NO_FREE_TEXT = useMemo(\n    () => [freeTextWarning ?? defaultFreeTextWarning],\n    [freeTextWarning],\n  );\n  const [valueRef, setValue] = useStateRef(\"\");\n  const [open, setOpen] = useState(false);\n  const inputRef = useRef<HTMLInputElement | null>(null);\n  const rootRef = useRef<HTMLDivElement | null>(null);\n  const [typeaheadValues, setTypeaheadValues] = useState<string[]>([]);\n  const getSuggestions = useTypeaheadSuggestions();\n  const pendingListFocusRef = useRef(false);\n\n  const { current: value } = valueRef;\n\n  const handleKeyDown = useCallback<KeyboardEventHandler<HTMLInputElement>>(\n    (evt) => {\n      const { current: value } = valueRef;\n      if (evt.key === \"Enter\" && value !== \"\") {\n        if (allowFreeInput) {\n          onCommit?.(evt, value, \"text-input\");\n          setOpen(false);\n        } else {\n          setTypeaheadValues(NO_FREE_TEXT);\n        }\n      }\n    },\n    [NO_FREE_TEXT, allowFreeInput, onCommit, valueRef],\n  );\n\n  const callbackRef = useCallback<RefCallback<HTMLDivElement>>((el) => {\n    rootRef.current = el;\n    const input = el?.querySelector(\"input\") ?? null;\n    inputRef.current = input;\n  }, []);\n\n  useEffect(() => {\n    if (table) {\n      const vuuTable = getVuuTable(table);\n      if (value) {\n        const params: TypeaheadParams = value\n          ? [vuuTable, column, value]\n          : [vuuTable, column];\n        getSuggestions(params)\n          .then((suggestions) => {\n            if (suggestions === false) {\n              // TODO is this right\n              setTypeaheadValues([]);\n            } else if (suggestions.length === 0 && value) {\n              setTypeaheadValues((values) =>\n                // Do not update if we have already set suggestions to the no free text warning\n                values === NO_FREE_TEXT ? NO_FREE_TEXT : NO_DATA_MATCH,\n              );\n            } else {\n              setTypeaheadValues(suggestions);\n              if (pendingListFocusRef.current && inputRef.current) {\n                // This is a workaround for the fact that ComboBox does not automatically\n                // highlight first list item when items have been populated dynamically.\n                // This has been raised as a bug.\n                dispatchKeyboardEvent(inputRef.current, \"keydown\", \"ArrowUp\");\n              }\n            }\n            pendingListFocusRef.current = false;\n          })\n          .catch((err) => {\n            console.error(\"Error getting suggestions\", err);\n          });\n      } else {\n        setTypeaheadValues([]);\n      }\n    }\n  }, [table, column, getSuggestions, value, NO_FREE_TEXT]);\n\n  const handleChange: ChangeEventHandler<HTMLInputElement> = (evt) => {\n    const { value: newValue } = evt.target;\n    const { current: value } = valueRef;\n    if (value === \"\" && newValue) {\n      setOpen(true);\n      const input = rootRef.current?.querySelector(\"input\");\n      if (input && highlightFirstSuggestion) {\n        pendingListFocusRef.current = true;\n      }\n    } else if (newValue === \"\" && value) {\n      // treat clear value as a commit event\n      onCommit(evt, \"\");\n    }\n    setValue(newValue);\n  };\n\n  const handleSelectionChange = (\n    evt: SyntheticEvent,\n    [newSelected]: string[],\n  ) => {\n    setValue(newSelected);\n    onCommit(\n      evt as SyntheticEvent<HTMLInputElement>,\n      newSelected,\n      \"typeahead-suggestion\",\n    );\n  };\n\n  const handleOpenChange = (newOpen: boolean) => {\n    if (newOpen && valueRef.current === \"\") {\n      // ignore this, don't open dropdown unless user has typed at least one character\n    } else {\n      setOpen(newOpen);\n    }\n  };\n\n  const inputProps: ComponentPropsWithoutRef<\"input\"> = {\n    ...inputPropsProp,\n    autoComplete: \"off\",\n  };\n\n  const [noFreeText] = NO_FREE_TEXT;\n  return {\n    inputProps,\n    noFreeText,\n    onChange: handleChange,\n    onKeyDown: handleKeyDown,\n    onOpenChange: handleOpenChange,\n    onSelectionChange: handleSelectionChange,\n    open,\n    ref: callbackRef,\n    typeaheadValues,\n    value: valueRef.current,\n  };\n};\n"],"names":["value"],"mappings":"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"}
+{"version":3,"file":"useVuuTypeaheadInput.js","sources":["../../src/vuu-typeahead-input/useVuuTypeaheadInput.ts"],"sourcesContent":["import { useTypeaheadSuggestions } from \"@vuu-ui/vuu-data-react\";\nimport type { TypeaheadParams } from \"@vuu-ui/vuu-protocol-types\";\nimport {\n  dispatchKeyboardEvent,\n  getVuuTable,\n  useStateRef,\n  NO_DATA_MATCH,\n} from \"@vuu-ui/vuu-utils\";\nimport {\n  ComponentPropsWithoutRef,\n  KeyboardEventHandler,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n  type ChangeEventHandler,\n  type RefCallback,\n  type SyntheticEvent,\n} from \"react\";\nimport type { VuuTypeaheadInputProps } from \"./VuuTypeaheadInput\";\n\nexport type VuuTypeaheadInputHookProps = Pick<\n  VuuTypeaheadInputProps,\n  | \"allowFreeInput\"\n  | \"column\"\n  | \"freeTextWarning\"\n  | \"highlightFirstSuggestion\"\n  | \"inputProps\"\n  | \"onCommit\"\n  | \"table\"\n>;\n\nconst defaultFreeTextWarning =\n  \"Please select a value from the list of suggestions. If no suggestions match your text, then the value is not valid. If you believe this should be a valid value, please reach out to the support team\";\n\nexport const useVuuTypeaheadInput = ({\n  allowFreeInput = true,\n  column,\n  freeTextWarning,\n  highlightFirstSuggestion = true,\n  inputProps: inputPropsProp,\n  onCommit,\n  table,\n}: VuuTypeaheadInputHookProps) => {\n  const NO_FREE_TEXT = useMemo(\n    () => [freeTextWarning ?? defaultFreeTextWarning],\n    [freeTextWarning],\n  );\n  const [valueRef, setValue] = useStateRef(\"\");\n  const [open, setOpen] = useState(false);\n  const inputRef = useRef<HTMLInputElement | null>(null);\n  const rootRef = useRef<HTMLDivElement | null>(null);\n  const [typeaheadValues, setTypeaheadValues] = useState<string[]>([]);\n  const getSuggestions = useTypeaheadSuggestions();\n  const pendingListFocusRef = useRef(false);\n\n  const { current: value } = valueRef;\n\n  const handleKeyDown = useCallback<KeyboardEventHandler<HTMLInputElement>>(\n    (evt) => {\n      const { current: value } = valueRef;\n      if (evt.key === \"Enter\" && value !== \"\") {\n        if (allowFreeInput) {\n          onCommit?.(evt, value, \"text-input\");\n          setOpen(false);\n        } else {\n          setTypeaheadValues(NO_FREE_TEXT);\n        }\n      }\n    },\n    [NO_FREE_TEXT, allowFreeInput, onCommit, valueRef],\n  );\n\n  const callbackRef = useCallback<RefCallback<HTMLDivElement>>((el) => {\n    rootRef.current = el;\n    const input = el?.querySelector(\"input\") ?? null;\n    inputRef.current = input;\n  }, []);\n\n  useEffect(() => {\n    if (table) {\n      const vuuTable = getVuuTable(table);\n      if (value) {\n        const params: TypeaheadParams = value\n          ? [vuuTable, column, value]\n          : [vuuTable, column];\n        getSuggestions(params)\n          .then((suggestions) => {\n            if (suggestions === false) {\n              // TODO is this right\n              setTypeaheadValues([]);\n            } else if (suggestions.length === 0 && value) {\n              setTypeaheadValues((values) =>\n                // Do not update if we have already set suggestions to the no free text warning\n                values === NO_FREE_TEXT ? NO_FREE_TEXT : NO_DATA_MATCH,\n              );\n            } else {\n              setTypeaheadValues(suggestions);\n              if (pendingListFocusRef.current && inputRef.current) {\n                // This is a workaround for the fact that ComboBox does not automatically\n                // highlight first list item when items have been populated dynamically.\n                // This has been raised as a bug.\n                //TODO this is failing to work correctly in new version of cypress\n                dispatchKeyboardEvent(inputRef.current, \"keydown\", \"ArrowUp\");\n              }\n            }\n            pendingListFocusRef.current = false;\n          })\n          .catch((err) => {\n            console.error(\"Error getting suggestions\", err);\n          });\n      } else {\n        setTypeaheadValues([]);\n      }\n    }\n  }, [table, column, getSuggestions, value, NO_FREE_TEXT]);\n\n  const handleChange: ChangeEventHandler<HTMLInputElement> = (evt) => {\n    const { value: newValue } = evt.target;\n    const { current: value } = valueRef;\n    if (value === \"\" && newValue) {\n      setOpen(true);\n      const input = rootRef.current?.querySelector(\"input\");\n      if (input && highlightFirstSuggestion) {\n        pendingListFocusRef.current = true;\n      }\n    } else if (newValue === \"\" && value) {\n      // treat clear value as a commit event\n      onCommit(evt, \"\");\n    }\n    setValue(newValue);\n  };\n\n  const handleSelectionChange = (\n    evt: SyntheticEvent,\n    [newSelected]: string[],\n  ) => {\n    setValue(newSelected);\n    onCommit(\n      evt as SyntheticEvent<HTMLInputElement>,\n      newSelected,\n      \"typeahead-suggestion\",\n    );\n  };\n\n  const handleOpenChange = (newOpen: boolean) => {\n    if (newOpen && valueRef.current === \"\") {\n      // ignore this, don't open dropdown unless user has typed at least one character\n    } else {\n      setOpen(newOpen);\n    }\n  };\n\n  const inputProps: ComponentPropsWithoutRef<\"input\"> = {\n    ...inputPropsProp,\n    autoComplete: \"off\",\n  };\n\n  const [noFreeText] = NO_FREE_TEXT;\n  return {\n    inputProps,\n    noFreeText,\n    onChange: handleChange,\n    onKeyDown: handleKeyDown,\n    onOpenChange: handleOpenChange,\n    onSelectionChange: handleSelectionChange,\n    open,\n    ref: callbackRef,\n    typeaheadValues,\n    value: valueRef.current,\n  };\n};\n"],"names":["value"],"mappings":"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"}

package/package.json

@@ -1,29 +1,30 @@
 {
-  "version": "0.9.2",
+  "version": "0.10.0",
   "description": "VUU UI Controls",
   "author": "heswell",
   "license": "Apache-2.0",
   "devDependencies": {
-    "@vuu-ui/vuu-data-types": "0.9.2",
-    "@vuu-ui/vuu-table-types": "0.9.2"
+    "@vuu-ui/vuu-data-types": "0.10.0",
+    "@vuu-ui/vuu-table-types": "0.10.0"
   },
   "dependencies": {
-    "@vuu-ui/vuu-data-react": "0.9.2",
-    "@vuu-ui/vuu-layout": "0.9.2",
-    "@vuu-ui/vuu-popups": "0.9.2",
-    "@vuu-ui/vuu-table": "0.9.2",
-    "@vuu-ui/vuu-utils": "0.9.2",
-    "@floating-ui/react": "^0.26.5",
-    "@salt-ds/core": "1.34.0",
-    "@salt-ds/icons": "1.12.1",
+    "@vuu-ui/vuu-data-react": "0.10.0",
+    "@vuu-ui/vuu-layout": "0.10.0",
+    "@vuu-ui/vuu-popups": "0.10.0",
+    "@vuu-ui/vuu-table": "0.10.0",
+    "@vuu-ui/vuu-utils": "0.10.0",
+    "@floating-ui/react": "^0.26.28",
+    "@salt-ds/core": "1.43.0",
+    "@salt-ds/icons": "1.13.2",
     "@salt-ds/styles": "0.2.1",
-    "@salt-ds/window": "0.1.1"
+    "@salt-ds/window": "0.1.1",
+    "tabbable": "^6.0.0"
   },
   "peerDependencies": {
     "@internationalized/date": "^3.0.0",
     "clsx": "^2.0.0",
-    "react": ">=17.0.2",
-    "react-dom": ">=17.0.2"
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1"
   },
   "sideEffects": false,
   "type": "module",

package/types/calendar/Calendar.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { type CalendarCarouselProps } from "./internal/CalendarCarousel";
 import { type CalendarNavigationProps } from "./internal/CalendarNavigation";
 import { type useCalendarProps } from "./useCalendar";

package/types/calendar/internal/CalendarCarousel.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { type CalendarMonthProps } from "./CalendarMonth";
 export type CalendarCarouselProps = Omit<CalendarMonthProps, "date">;
 export declare const CalendarCarousel: import("react").ForwardRefExoticComponent<Omit<CalendarCarouselProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;

package/types/calendar/internal/CalendarContext.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { useCalendar } from "../useCalendar";
 interface CalendarState {
     state: ReturnType<typeof useCalendar>["state"];

package/types/calendar/internal/CalendarWeekHeader.d.ts

@@ -1,5 +1,5 @@
 import { type ComponentPropsWithRef } from "react";
 export type CalendarWeekHeaderProps = ComponentPropsWithRef<"div">;
 export declare const CalendarWeekHeader: import("react").ForwardRefExoticComponent<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
 }, "ref"> & import("react").RefAttributes<HTMLDivElement>>;

package/types/calendar/useCalendar.d.ts

@@ -17,8 +17,8 @@ export type useCalendarProps = (Omit<UseSingleSelectionCalendarProps, "isDaySele
 export declare function useCalendar(props: useCalendarProps): {
     state: {
         selectedDate: DateValue | import("./useSelection").RangeSelectionValueType | {
-            startDate?: DateValue | undefined;
-            endDate?: DateValue | undefined;
+            startDate?: DateValue;
+            endDate?: DateValue;
         } | DateValue[] | null | undefined;
         hoveredDate: import("@internationalized/date").CalendarDate | import("@internationalized/date").CalendarDateTime | import("@internationalized/date").ZonedDateTime | null | undefined;
         visibleMonth: DateValue;
@@ -30,9 +30,9 @@ export declare function useCalendar(props: useCalendarProps): {
         calendarFocused: boolean;
     };
     helpers: {
-        setSelectedDate: (event: SyntheticEvent<HTMLButtonElement, Event>, newSelectedDate: DateValue) => void;
+        setSelectedDate: (event: SyntheticEvent<HTMLButtonElement>, newSelectedDate: DateValue) => void;
         isSelected: (date: DateValue) => boolean;
-        setHoveredDate: (event: SyntheticEvent<Element, Event>, date: DateValue | null) => void;
+        setHoveredDate: (event: SyntheticEvent, date: DateValue | null) => void;
         isHovered: (date: DateValue) => boolean;
         isSelectedSpan: (date: DateValue) => boolean;
         isHoveredSpan: (date: DateValue) => boolean;

package/types/calendar/useCalendarDay.d.ts

@@ -1,5 +1,5 @@
 import { type DateValue } from "@internationalized/date";
-import { type RefObject } from "react";
+import { type ComponentPropsWithoutRef, type RefObject } from "react";
 export interface DayStatus {
     outOfRange?: boolean;
     selected?: boolean;
@@ -16,7 +16,7 @@ export interface useCalendarDayProps {
 }
 export declare function useCalendarDay({ date, month }: useCalendarDayProps, ref: RefObject<HTMLElement>): {
     status: DayStatus;
-    dayProps: Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref">;
+    dayProps: ComponentPropsWithoutRef<"button">;
     unselectableReason: string | false | undefined;
     highlightedReason: string | false | undefined;
 };

package/types/column-picker/ColumnPicker.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { IconButtonProps } from "../icon-button";
 import { ColumnSearchProps } from "./ColumnSearch";
 export interface ColumnPickerProps extends Omit<IconButtonProps, "icon">, Pick<ColumnSearchProps, "columns" | "onSelectionChange" | "selected"> {

package/types/common-hooks/collectionProvider.d.ts

@@ -8,6 +8,6 @@ interface ContextProviderProps<Item> {
     children: ReactElement;
     collectionHook: CollectionHookResult<Item>;
 }
-export declare function CollectionProvider<Item>({ children, collectionHook, ...props }: ContextProviderProps<Item>): JSX.Element;
+export declare function CollectionProvider<Item>({ children, collectionHook, ...props }: ContextProviderProps<Item>): import("react/jsx-runtime").JSX.Element;
 export declare function useCollection<Item>(): CollectionHookResult<Item> | undefined;
 export {};

package/types/common-hooks/selectionTypes.d.ts

@@ -12,7 +12,7 @@ export type SelectionStrategy = SelectionDisallowed | SingleSelectionStrategy |
 export declare const isSingleSelection: (s?: SelectionStrategy) => s is SingleSelectionStrategy;
 export declare const isMultiSelection: (s?: SelectionStrategy) => s is MultiSelectionStrategy;
 export type SelectHandler<Item = string> = (event: SyntheticEvent, selectedItem: Item) => void;
-export declare const selectionIsDisallowed: (selection?: SelectionStrategy | SpecialKeyMultipleSelection) => selection is "none";
+export declare const selectionIsDisallowed: (selection?: SelectionStrategy | SpecialKeyMultipleSelection) => selection is SelectionDisallowed;
 export declare const allowMultipleSelection: (selectionStrategy: SelectionStrategy | SpecialKeyMultipleSelection, specialKey?: boolean) => boolean;
 export declare const deselectionIsAllowed: (selection?: SelectionStrategy | SpecialKeyMultipleSelection) => selection is "deselectable" | MultiSelectionStrategy;
 export declare const hasSelection: <Item = unknown>(selected?: Item[]) => boolean;

package/types/cycle-state-button/CycleStateButton.d.ts

@@ -1,9 +1,9 @@
-/// <reference types="react" />
 import { ButtonProps } from "@salt-ds/core";
 import type { VuuRowDataItemType } from "@vuu-ui/vuu-protocol-types";
 import { CommitHandler } from "@vuu-ui/vuu-utils";
+export type CycleStateButtonChangeHandler = (value: VuuRowDataItemType) => void;
 export interface CycleStateButtonProps extends Omit<ButtonProps, "onChange"> {
-    onChange?: (value: VuuRowDataItemType) => void;
+    onChange?: CycleStateButtonChangeHandler;
     onCommit?: CommitHandler<HTMLButtonElement>;
     values: string[];
     value: string;

package/types/date-picker/DatePickerContext.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { DateValue } from "@internationalized/date";
 import { type UseFloatingUIReturn } from "@salt-ds/core";
 import type { RangeSelectionValueType } from "../calendar";

package/types/drag-drop/DragDropProvider.d.ts

@@ -27,7 +27,7 @@ export type MeasuredTarget = {
     right: number;
     top: number;
 };
-export declare const DragDropProvider: ({ children, dragSources: dragSourcesProp, }: DragDropProviderProps) => JSX.Element;
+export declare const DragDropProvider: ({ children, dragSources: dragSourcesProp, }: DragDropProviderProps) => import("react/jsx-runtime").JSX.Element;
 export interface DragDropProviderResult {
     isDragSource?: boolean;
     isDropTarget?: boolean;

package/types/drag-drop/DropIndicator.d.ts

@@ -1,6 +1,5 @@
-/// <reference types="react" />
 import { Rect } from "./dragDropTypes";
 export declare const DropIndicator: import("react").ForwardRefExoticComponent<{
-    className?: string | undefined;
+    className?: string;
     rect: Rect;
 } & import("react").RefAttributes<HTMLDivElement>>;

package/types/drag-drop/drop-target-utils.d.ts

@@ -28,35 +28,39 @@ export type targetType = {
 };
 /** clones and removes id */
 export declare const cloneElement: <T extends HTMLElement>(element: T) => T;
+type MousePosKey = keyof Pick<MouseEvent, "clientX" | "clientY">;
+type DOMRectKey = keyof Omit<DOMRect, "toJSON">;
+type DOMRectDimensionKey = keyof Pick<DOMRect, "width" | "height">;
 type Dimension = keyof Pick<DOMRect, "width" | "height">;
+type ElementDimension = keyof Pick<HTMLElement, "scrollHeight" | "scrollWidth" | "clientHeight" | "clientWidth" | "scrollTop" | "scrollLeft">;
 type ElementPosition = "x" | "y";
 export declare const measureElementSizeAndPosition: (element: HTMLElement, dimension?: Dimension, includeAutoMargin?: boolean) => number[];
 export declare const dimensions: (orientation: orientationType) => {
-    CLIENT_POS: "clientX" | "clientY";
-    CLIENT_SIZE: "clientHeight" | "clientWidth" | "scrollHeight" | "scrollWidth" | "scrollTop" | "scrollLeft";
-    CONTRA: "top" | "right" | "bottom" | "left" | "x" | "y" | "height" | "width";
-    CONTRA_CLIENT_POS: "clientX" | "clientY";
-    CONTRA_END: "height" | "width";
+    CLIENT_POS: MousePosKey;
+    CLIENT_SIZE: ElementDimension;
+    CONTRA: DOMRectKey;
+    CONTRA_CLIENT_POS: MousePosKey;
+    CONTRA_END: DOMRectDimensionKey;
     CONTRA_POS: ElementPosition;
-    DIMENSION: "height" | "width";
-    END: "top" | "right" | "bottom" | "left" | "x" | "y" | "height" | "width";
+    DIMENSION: DOMRectDimensionKey;
+    END: DOMRectKey;
     POS: ElementPosition;
-    SCROLL_POS: "clientHeight" | "clientWidth" | "scrollHeight" | "scrollWidth" | "scrollTop" | "scrollLeft";
-    SCROLL_SIZE: "clientHeight" | "clientWidth" | "scrollHeight" | "scrollWidth" | "scrollTop" | "scrollLeft";
-    START: "top" | "right" | "bottom" | "left" | "x" | "y" | "height" | "width";
+    SCROLL_POS: ElementDimension;
+    SCROLL_SIZE: ElementDimension;
+    START: DOMRectKey;
 } | {
-    CLIENT_POS: "clientX" | "clientY";
-    CLIENT_SIZE: "clientHeight" | "clientWidth" | "scrollHeight" | "scrollWidth" | "scrollTop" | "scrollLeft";
-    CONTRA: "top" | "right" | "bottom" | "left" | "x" | "y" | "height" | "width";
-    CONTRA_CLIENT_POS: "clientX" | "clientY";
-    CONTRA_END: "height" | "width";
+    CLIENT_POS: MousePosKey;
+    CLIENT_SIZE: ElementDimension;
+    CONTRA: DOMRectKey;
+    CONTRA_CLIENT_POS: MousePosKey;
+    CONTRA_END: DOMRectDimensionKey;
     CONTRA_POS: ElementPosition;
-    DIMENSION: "height" | "width";
-    END: "top" | "right" | "bottom" | "left" | "x" | "y" | "height" | "width";
+    DIMENSION: DOMRectDimensionKey;
+    END: DOMRectKey;
     POS: ElementPosition;
-    SCROLL_POS: "clientHeight" | "clientWidth" | "scrollHeight" | "scrollWidth" | "scrollTop" | "scrollLeft";
-    SCROLL_SIZE: "clientHeight" | "clientWidth" | "scrollHeight" | "scrollWidth" | "scrollTop" | "scrollLeft";
-    START: "top" | "right" | "bottom" | "left" | "x" | "y" | "height" | "width";
+    SCROLL_POS: ElementDimension;
+    SCROLL_SIZE: ElementDimension;
+    START: DOMRectKey;
 };
 export declare const getItemById: (measuredItems: MeasuredDropTarget[], id: string) => MeasuredDropTarget | undefined;
 export declare const removeDraggedItem: (measuredItems: MeasuredDropTarget[], index: number) => void;

package/types/drag-drop/useAutoScroll.d.ts

@@ -2,10 +2,10 @@ import { RefObject } from "react";
 export type ScrollStopHandler = (scrollDirection: "fwd" | "bwd", scrollPos: number, atEnd: boolean) => void;
 export declare const useAutoScroll: ({ containerRef, onScrollingStopped, orientation, }: {
     containerRef: RefObject<HTMLElement>;
-    onScrollingStopped?: ScrollStopHandler | undefined;
-    orientation?: "horizontal" | "vertical" | undefined;
+    onScrollingStopped?: ScrollStopHandler;
+    orientation?: "horizontal" | "vertical";
 }) => {
     isScrolling: import("react").MutableRefObject<boolean>;
-    startScrolling: (direction: "fwd" | "bwd", scrollRate: number, scrollUnit?: any) => void;
-    stopScrolling: (atEnd?: any) => void;
+    startScrolling: (direction: "fwd" | "bwd", scrollRate: number, scrollUnit?: number) => void;
+    stopScrolling: (atEnd?: boolean) => void;
 };

package/types/drag-drop/useGlobalDragDrop.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { MeasuredTarget } from "./DragDropProvider";
 import { DragDropState } from "./DragDropState";
 export type ResumeDragHandler = (dragDropState: DragDropState) => boolean;

package/types/expando-input/ExpandoInput.d.ts

@@ -1,6 +1,6 @@
-/// <reference types="react" />
+import { CommitHandler } from "@vuu-ui/vuu-utils";
 import { VuuInputProps } from "../vuu-input";
 export interface ExpandoInputProps extends Omit<VuuInputProps, "onCommit"> {
-    onCommit?: VuuInputProps["onCommit"];
+    onCommit?: CommitHandler;
 }
 export declare const ExpandoInput: import("react").ForwardRefExoticComponent<ExpandoInputProps & import("react").RefAttributes<HTMLDivElement>>;

package/types/icon-button/Icon.d.ts

@@ -3,4 +3,4 @@ export interface IconProps extends HTMLAttributes<HTMLSpanElement> {
     name: string;
     size?: number;
 }
-export declare const Icon: ({ className, name, size, style: styleProp, ...htmlAttributes }: IconProps) => JSX.Element;
+export declare const Icon: ({ className, name, size, style: styleProp, ...htmlAttributes }: IconProps) => import("react/jsx-runtime").JSX.Element;

package/types/icon-button/IconButton.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { ButtonProps } from "@salt-ds/core";
 export interface IconButtonProps extends Omit<ButtonProps, "children"> {
     icon: string;

package/types/icon-button/ToggleIconButton.d.ts

@@ -1,6 +1,5 @@
-/// <reference types="react" />
 import { IconButtonProps } from "./IconButton";
 export interface ToggleIconButtonProps extends Omit<IconButtonProps, "icon"> {
     isExpanded: boolean;
 }
-export declare const ToggleIconButton: ({ className, isExpanded, size, variant, ...props }: ToggleIconButtonProps) => JSX.Element;
+export declare const ToggleIconButton: ({ className, isExpanded, size, variant, ...props }: ToggleIconButtonProps) => import("react/jsx-runtime").JSX.Element;

package/types/index.d.ts

@@ -18,9 +18,9 @@ export * from "./overflow-container";
 export * from "./price-ticker";
 export * from "./price-ticker";
 export * from "./split-button";
+export * from "./tabs-next";
 export * from "./tabstrip";
 export * from "./toolbar";
-export * from "./tree";
 export * from "./utils";
 export * from "./vuu-date-picker";
 export * from "./vuu-input";

package/types/instrument-picker/SearchCell.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { TableCellRendererProps } from "@vuu-ui/vuu-table-types";
-export declare const SearchCell: ({ column, columnMap, row, }: TableCellRendererProps) => JSX.Element;
+export declare const SearchCell: ({ column, columnMap, row, }: TableCellRendererProps) => import("react/jsx-runtime").JSX.Element;

package/types/instrument-picker/TablePicker.d.ts

@@ -7,4 +7,4 @@ export interface TablePickerProps extends Omit<HTMLAttributes<HTMLElement>, "onS
     schema: TableSchema;
     searchColumns?: string[];
 }
-export declare const TablePicker: ({ TableProps, onSelect, rowToString, schema, searchColumns, ...htmlAttributes }: TablePickerProps) => JSX.Element;
+export declare const TablePicker: ({ TableProps, onSelect, rowToString, schema, searchColumns, ...htmlAttributes }: TablePickerProps) => import("react/jsx-runtime").JSX.Element;