@salt-ds/lab 1.0.0-alpha.16 → 1.0.0-alpha.17

package/dist-es/combo-box-deprecated/internal/useMultiSelectComboBox.js.map

@@ -1 +1 @@
-{"version":3,"file":"useMultiSelectComboBox.js","sources":["../src/combo-box-deprecated/internal/useMultiSelectComboBox.ts"],"sourcesContent":["import {\n  useControlled,\n  useForkRef,\n  useId,\n  useIsFocusVisible,\n  useIsomorphicLayoutEffect,\n} from \"@salt-ds/core\";\nimport {\n  ChangeEvent,\n  FocusEvent,\n  KeyboardEvent,\n  KeyboardEventHandler,\n  MouseEvent,\n  RefObject,\n  SyntheticEvent,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\nimport { useList } from \"../../list-deprecated\";\nimport { ExpandButtonProps, useTokenizedInput } from \"../../tokenized-input\";\nimport { defaultItemToString } from \"../../tokenized-input/internal/defaultItemToString\";\nimport { usePrevious } from \"@salt-ds/core\";\nimport { getDefaultFilter, getDefaultFilterRegex } from \"../filterHelpers\";\nimport { MultiSelectComboBoxProps } from \"./MultiSelectComboBox\";\nimport { isToggleList, usePopperStatus } from \"./usePopperStatus\";\n\nconst REQUIRE_PREV_HIGHLIGHT = [\"ArrowUp\", \"ArrowDown\", \"PageUp\", \"PageDown\"];\n\nexport type UseMultiSelectComboBoxProps<Item> = Omit<\n  MultiSelectComboBoxProps<Item>,\n  \"inputRef\" | \"listContext\" | \"inputHelpers\" | \"inputProps\" | \"listProps\"\n> & { expandButtonRef: RefObject<HTMLElement> };\n\nexport const useMultiSelectComboBox = <Item>(\n  props: Omit<UseMultiSelectComboBoxProps<Item>, \"rootRef\" | \"classes\">\n) => {\n  // Deconstruct valid props for List, everything else will be passed to `useTokenizedInput` using `restProps`\n  const {\n    allowFreeText,\n    displayedItemCount,\n    virtualized,\n    disabled,\n    expandButtonRef,\n    onBlur,\n    onFocus,\n    onChange,\n    onSelect,\n    onInputChange,\n    onInputFocus,\n    onInputBlur,\n    onInputSelect,\n    id: idProp,\n    source: sourceProp,\n    selectedItem: selectedItemProp,\n    inputValue: inputValueProp,\n    initialOpen,\n    initialSelectedItem: initialSelectedItems,\n    \"aria-labelledby\": ariaLabelledBy,\n    getFilterRegex = getDefaultFilterRegex,\n    itemToString = defaultItemToString,\n    stringToItem: stringToItemProp = (_: any, value: string) => value.trim(),\n    InputProps = {\n      onBlur,\n      onFocus,\n      onInputBlur,\n      onInputFocus,\n      onInputChange,\n      onInputSelect,\n    },\n    ListProps = {},\n    ...restProps\n  } = props;\n\n  const id = useId(idProp);\n  const inputId = `${id}-input`;\n  const listId = `${id}-list`;\n\n  const [inputValue, setInputValue] = useControlled({\n    controlled: inputValueProp,\n    default: \"\",\n    name: \"MultiSelectComboBox\",\n    state: \"inputValue\",\n  });\n\n  const { isOpen: isListOpen, notifyPopper } = usePopperStatus({\n    initialOpen,\n    isMultiSelect: true,\n  });\n\n  const [selectionChanged, setSelectionChanged] = useState(false);\n  const inputBlurTimeout = useRef<number>(null);\n\n  const [allowAnnouncement, setAllowAnnouncement] = useState(false);\n\n  const labels = useMemo(\n    () => sourceProp.map(itemToString),\n    [sourceProp, itemToString]\n  );\n\n  const source = useMemo(() => {\n    if (inputValue && inputValue.trim().length) {\n      const itemFilter = getDefaultFilter(inputValue, getFilterRegex);\n      return sourceProp.filter((item: Item) => itemFilter(itemToString(item)));\n    }\n    return sourceProp;\n  }, [inputValue, sourceProp, getFilterRegex, itemToString]);\n\n  const itemTextHighlightPattern = useMemo(\n    () =>\n      inputValue && inputValue.trim().length\n        ? getFilterRegex(inputValue)\n        : undefined,\n    [inputValue, getFilterRegex]\n  );\n\n  const {\n    focusedRef,\n    listProps,\n    state: listState,\n    helpers: listHelpers,\n  } = useList<Item, \"multiple\">({\n    ...ListProps,\n    source,\n    disabled,\n    virtualized,\n    itemToString,\n    displayedItemCount,\n    onChange,\n    onSelect,\n    id: listId,\n    disableFocus: true,\n    disableMouseDown: true,\n    selectionVariant: \"multiple\",\n    initialSelectedItem: initialSelectedItems,\n    selectedItem: selectedItemProp,\n    \"aria-labelledby\": ariaLabelledBy,\n  });\n\n  const { \"aria-activedescendant\": ariaActiveDescendant, ...restListProps } =\n    listProps;\n  const { selectedItem } = listState;\n  const [quickSelection, setQuickSelection] = useState(false);\n  const {\n    isFocusVisibleRef,\n    onFocus: handleFocusVisible,\n    onBlur: handleBlurVisible,\n    ref: focusVisibleRef,\n  } = useIsFocusVisible();\n  const selectedItems = selectedItem as Item[];\n  const {\n    setSelectedItem: setSelectedItems,\n    setHighlightedIndex: setHighlightedListIndex,\n  } = listHelpers;\n\n  const handleInputFocus = (event: FocusEvent<HTMLInputElement>) => {\n    handleFocusVisible(event);\n    if (isFocusVisibleRef.current) {\n      listHelpers.setFocusVisible(true);\n    }\n\n    if (InputProps.onInputFocus) {\n      InputProps.onInputFocus(event);\n    }\n\n    notifyPopper(event);\n  };\n\n  const handleInputBlur = (\n    event: FocusEvent<HTMLDivElement | HTMLInputElement>\n  ) => {\n    handleBlurVisible();\n    setAllowAnnouncement(false);\n    setInputValue(\"\");\n\n    if (restListProps.onBlur) {\n      restListProps.onBlur(event);\n    }\n\n    if (InputProps.onInputBlur) {\n      InputProps.onInputBlur(event as FocusEvent<HTMLInputElement>);\n    }\n\n    notifyPopper(event);\n  };\n\n  const handleInputChange = (event: ChangeEvent<HTMLInputElement>) => {\n    setInputValue(event.target.value);\n\n    setQuickSelection(event.target.value.length > 0 && !allowFreeText);\n\n    if (InputProps.onInputChange) {\n      InputProps.onInputChange(event);\n    }\n  };\n\n  const handleItemsChange = (newItems: Item[] | undefined) => {\n    const uniqueItems = Array.from(new Set(newItems));\n    setSelectedItems(uniqueItems);\n    onChange && onChange(null as unknown as ChangeEvent, uniqueItems);\n  };\n\n  const handleInputSelect = (event: SyntheticEvent<HTMLInputElement>) => {\n    event.persist();\n    setSelectionChanged(true);\n\n    if (InputProps.onInputSelect) {\n      InputProps.onInputSelect(event);\n    }\n  };\n\n  const handleClear = () => {\n    setSelectedItems([]);\n  };\n\n  const stringToItem = (selected: Item[], value: string): Item | null => {\n    const trimmed = value.trim();\n    const item = stringToItemProp(selected, trimmed);\n    const isSelected = selected.map(itemToString).indexOf(trimmed) !== -1;\n\n    // Either allow free text item OR the item has to be in the source list\n    return !isSelected && (allowFreeText || labels.indexOf(trimmed) !== -1)\n      ? (item as Item)\n      : null;\n  };\n\n  // Reuse selectItem from list state for a controlled version of tokenized input\n  const {\n    inputRef,\n    inputProps,\n    state: inputState,\n    helpers: inputHelpers,\n  } = useTokenizedInput({\n    ...restProps,\n    ...InputProps,\n    disabled,\n    itemToString,\n    stringToItem,\n    selectedItems,\n    initialSelectedItems,\n    onInputFocus: handleInputFocus,\n    onInputBlur: handleInputBlur,\n    onInputChange: handleInputChange,\n    onInputSelect: handleInputSelect,\n    onChange: handleItemsChange,\n    onClear: handleClear,\n    onKeyDown: InputProps.onKeyDown as KeyboardEventHandler<\n      HTMLInputElement | HTMLButtonElement\n    >,\n  });\n\n  const handleFocusVisibleRef = useForkRef(focusVisibleRef, focusedRef);\n  const handleInputRef = useForkRef(inputRef, handleFocusVisibleRef);\n\n  const { setHighlightedIndex: setHighlightedPillIndex } = inputHelpers;\n\n  // Reset highlight when list closes\n  useEffect(() => {\n    if (!isListOpen) {\n      setHighlightedListIndex(undefined);\n      setQuickSelection(false);\n    }\n  }, [isListOpen, setHighlightedListIndex, setQuickSelection]);\n\n  const previousSelectedItems = usePrevious(selectedItems);\n\n  // Reset list highlight when selectItems change\n  useIsomorphicLayoutEffect(() => {\n    if (\n      selectedItems.some(\n        (item) => !(previousSelectedItems || []).includes(item)\n      )\n    ) {\n      setInputValue(\"\");\n    }\n\n    if (!selectedItems.length) {\n      setHighlightedListIndex(undefined);\n    }\n  }, [\n    selectedItems,\n    previousSelectedItems,\n    setInputValue,\n    setHighlightedListIndex,\n  ]);\n\n  // Remove highlight from list if a pill is highlighted\n  useEffect(() => {\n    if (\n      inputState.highlightedIndex != null &&\n      inputState.highlightedIndex >= 0\n    ) {\n      setHighlightedListIndex(undefined);\n      setQuickSelection(false);\n    }\n  }, [inputState.highlightedIndex, setHighlightedListIndex, setQuickSelection]);\n\n  const highlightedIndex = listState && listState.highlightedIndex;\n\n  // Remove highlight from pills if a list item is highlighted\n  useEffect(() => {\n    if (highlightedIndex != null && highlightedIndex >= 0) {\n      setHighlightedPillIndex(undefined);\n    }\n  }, [highlightedIndex, setHighlightedPillIndex]);\n\n  // Keep highlighted index in sync with the filtered source\n  useEffect(() => {\n    setHighlightedListIndex(undefined);\n  }, [source, setHighlightedListIndex]);\n\n  const handleFirstItemSelection = (event: KeyboardEvent | ChangeEvent) => {\n    if (\n      !allowFreeText &&\n      (event as KeyboardEvent).key === \"Enter\" &&\n      quickSelection\n    ) {\n      const newItem = source[0];\n      const newSelectedItems =\n        selectedItems.indexOf(newItem) === -1\n          ? selectedItems.concat(source.slice(0, 1))\n          : selectedItems.filter((item) => item !== newItem);\n      setSelectedItems(newSelectedItems);\n      onSelect && onSelect(event, newItem);\n      onChange && onChange(event as ChangeEvent, newSelectedItems);\n    }\n  };\n\n  const handleListOpenKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n    if (\"Escape\" === event.key && inputProps.expanded) {\n      setTimeout(() => {\n        if (expandButtonRef.current) {\n          expandButtonRef.current.focus();\n        }\n      }, 250);\n    }\n\n    handleFirstItemSelection(event);\n\n    if (\n      \"Home\" !== event.key &&\n      \"End\" !== event.key &&\n      !(\" \" === event.key && !event.ctrlKey)\n    ) {\n      if (restListProps.onKeyDown) {\n        restListProps.onKeyDown(event);\n      }\n      setSelectionChanged(false);\n    }\n  };\n\n  const handleInputKeyDown = (\n    event: KeyboardEvent<HTMLInputElement | HTMLButtonElement | HTMLDivElement>\n  ) => {\n    if (\"Escape\" === event.key) {\n      setInputValue(\"\");\n      setHighlightedListIndex(undefined);\n    }\n\n    // Space key clashes with the remove action of TokenizedInput\n    // For combo box, pressing a space key should just add a space\n    if (\" \" === event.key && !event.ctrlKey) {\n      setHighlightedPillIndex(undefined);\n    } else {\n      if (inputProps.onKeyDown) {\n        inputProps.onKeyDown(\n          event as KeyboardEvent<HTMLInputElement | HTMLButtonElement>\n        );\n      }\n    }\n\n    if (\n      !isToggleList(event) &&\n      listState.highlightedIndex == null &&\n      REQUIRE_PREV_HIGHLIGHT.indexOf(event.key) !== -1\n    ) {\n      event.preventDefault();\n      // Initialize list highlight if there's no previous value\n      setHighlightedListIndex(\n        Math.min(quickSelection ? 1 : 0, source.length - 1)\n      );\n      setQuickSelection(false);\n      setSelectionChanged(false);\n    } else if (isListOpen) {\n      handleListOpenKeyDown(event as KeyboardEvent<HTMLDivElement>);\n    }\n\n    // Don't announce for deleting values\n    setAllowAnnouncement(\"Backspace\" !== event.key);\n    notifyPopper(event);\n  };\n\n  const handleListClick = (event: MouseEvent<HTMLDivElement>) => {\n    clearTimeout(\n      inputBlurTimeout.current == null ? undefined : inputBlurTimeout.current\n    );\n    const inputEl = inputRef && (inputRef as RefObject<HTMLElement>).current;\n    if (inputEl) {\n      inputEl.focus();\n    }\n\n    if (restListProps.onClick) {\n      restListProps.onClick(event);\n    }\n  };\n\n  const mergedInputProps = {\n    ...inputProps.InputProps,\n    inputProps: {\n      ...(inputProps.InputProps || {}).inputProps,\n      role: \"textbox\",\n      \"aria-roledescription\": \"MultiSelect Combobox\",\n    },\n  };\n\n  if (ariaActiveDescendant && !selectionChanged) {\n    // either null or undefined will prevent tokenized-input from\n    // setting active-descendant based on pill selection.\n    mergedInputProps.inputProps[\"aria-activedescendant\"] = ariaActiveDescendant;\n  }\n\n  const expandButtonProps = {\n    accessibleText: undefined,\n    role: \"button\",\n    \"aria-roledescription\": \"Expand combobox button\",\n    \"aria-labelledby\": [ariaLabelledBy, `${inputId}-input`]\n      .filter(Boolean)\n      .join(\" \"),\n  } as ExpandButtonProps;\n\n  return {\n    inputHelpers,\n    inputRef: handleInputRef,\n    listContext: {\n      state: listState,\n      helpers: listHelpers,\n    },\n    inputProps: {\n      ...inputProps,\n      selectedItems,\n      allowAnnouncement,\n      id: inputId,\n      value: inputValue,\n      ExpandButtonProps: expandButtonProps,\n      InputProps: mergedInputProps,\n      onKeyDown: handleInputKeyDown,\n    },\n    listProps: {\n      ...restListProps,\n      source,\n      itemToString,\n      itemTextHighlightPattern,\n      onClick: handleListClick,\n      isListOpen: isListOpen && Boolean(source.length),\n    },\n  };\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;AA4BA,MAAM,sBAAyB,GAAA,CAAC,SAAW,EAAA,WAAA,EAAa,UAAU,UAAU,CAAA,CAAA;AAO/D,MAAA,sBAAA,GAAyB,CACpC,KACG,KAAA;AAEH,EAAM,MAAA;AAAA,IACJ,aAAA;AAAA,IACA,kBAAA;AAAA,IACA,WAAA;AAAA,IACA,QAAA;AAAA,IACA,eAAA;AAAA,IACA,MAAA;AAAA,IACA,OAAA;AAAA,IACA,QAAA;AAAA,IACA,QAAA;AAAA,IACA,aAAA;AAAA,IACA,YAAA;AAAA,IACA,WAAA;AAAA,IACA,aAAA;AAAA,IACA,EAAI,EAAA,MAAA;AAAA,IACJ,MAAQ,EAAA,UAAA;AAAA,IACR,YAAc,EAAA,gBAAA;AAAA,IACd,UAAY,EAAA,cAAA;AAAA,IACZ,WAAA;AAAA,IACA,mBAAqB,EAAA,oBAAA;AAAA,IACrB,iBAAmB,EAAA,cAAA;AAAA,IACnB,cAAiB,GAAA,qBAAA;AAAA,IACjB,YAAe,GAAA,mBAAA;AAAA,IACf,cAAc,gBAAmB,GAAA,CAAC,CAAQ,EAAA,KAAA,KAAkB,MAAM,IAAK,EAAA;AAAA,IACvE,UAAa,GAAA;AAAA,MACX,MAAA;AAAA,MACA,OAAA;AAAA,MACA,WAAA;AAAA,MACA,YAAA;AAAA,MACA,aAAA;AAAA,MACA,aAAA;AAAA,KACF;AAAA,IACA,YAAY,EAAC;AAAA,IACV,GAAA,SAAA;AAAA,GACD,GAAA,KAAA,CAAA;AAEJ,EAAM,MAAA,EAAA,GAAK,MAAM,MAAM,CAAA,CAAA;AACvB,EAAA,MAAM,UAAU,CAAG,EAAA,EAAA,CAAA,MAAA,CAAA,CAAA;AACnB,EAAA,MAAM,SAAS,CAAG,EAAA,EAAA,CAAA,KAAA,CAAA,CAAA;AAElB,EAAA,MAAM,CAAC,UAAA,EAAY,aAAa,CAAA,GAAI,aAAc,CAAA;AAAA,IAChD,UAAY,EAAA,cAAA;AAAA,IACZ,OAAS,EAAA,EAAA;AAAA,IACT,IAAM,EAAA,qBAAA;AAAA,IACN,KAAO,EAAA,YAAA;AAAA,GACR,CAAA,CAAA;AAED,EAAA,MAAM,EAAE,MAAA,EAAQ,UAAY,EAAA,YAAA,KAAiB,eAAgB,CAAA;AAAA,IAC3D,WAAA;AAAA,IACA,aAAe,EAAA,IAAA;AAAA,GAChB,CAAA,CAAA;AAED,EAAA,MAAM,CAAC,gBAAA,EAAkB,mBAAmB,CAAA,GAAI,SAAS,KAAK,CAAA,CAAA;AAC9D,EAAM,MAAA,gBAAA,GAAmB,OAAe,IAAI,CAAA,CAAA;AAE5C,EAAA,MAAM,CAAC,iBAAA,EAAmB,oBAAoB,CAAA,GAAI,SAAS,KAAK,CAAA,CAAA;AAEhE,EAAA,MAAM,MAAS,GAAA,OAAA;AAAA,IACb,MAAM,UAAW,CAAA,GAAA,CAAI,YAAY,CAAA;AAAA,IACjC,CAAC,YAAY,YAAY,CAAA;AAAA,GAC3B,CAAA;AAEA,EAAM,MAAA,MAAA,GAAS,QAAQ,MAAM;AAC3B,IAAA,IAAI,UAAc,IAAA,UAAA,CAAW,IAAK,EAAA,CAAE,MAAQ,EAAA;AAC1C,MAAM,MAAA,UAAA,GAAa,gBAAiB,CAAA,UAAA,EAAY,cAAc,CAAA,CAAA;AAC9D,MAAO,OAAA,UAAA,CAAW,OAAO,CAAC,IAAA,KAAe,WAAW,YAAa,CAAA,IAAI,CAAC,CAAC,CAAA,CAAA;AAAA,KACzE;AACA,IAAO,OAAA,UAAA,CAAA;AAAA,KACN,CAAC,UAAA,EAAY,UAAY,EAAA,cAAA,EAAgB,YAAY,CAAC,CAAA,CAAA;AAEzD,EAAA,MAAM,wBAA2B,GAAA,OAAA;AAAA,IAC/B,MACE,cAAc,UAAW,CAAA,IAAA,GAAO,MAC5B,GAAA,cAAA,CAAe,UAAU,CACzB,GAAA,KAAA,CAAA;AAAA,IACN,CAAC,YAAY,cAAc,CAAA;AAAA,GAC7B,CAAA;AAEA,EAAM,MAAA;AAAA,IACJ,UAAA;AAAA,IACA,SAAA;AAAA,IACA,KAAO,EAAA,SAAA;AAAA,IACP,OAAS,EAAA,WAAA;AAAA,MACP,OAA0B,CAAA;AAAA,IAC5B,GAAG,SAAA;AAAA,IACH,MAAA;AAAA,IACA,QAAA;AAAA,IACA,WAAA;AAAA,IACA,YAAA;AAAA,IACA,kBAAA;AAAA,IACA,QAAA;AAAA,IACA,QAAA;AAAA,IACA,EAAI,EAAA,MAAA;AAAA,IACJ,YAAc,EAAA,IAAA;AAAA,IACd,gBAAkB,EAAA,IAAA;AAAA,IAClB,gBAAkB,EAAA,UAAA;AAAA,IAClB,mBAAqB,EAAA,oBAAA;AAAA,IACrB,YAAc,EAAA,gBAAA;AAAA,IACd,iBAAmB,EAAA,cAAA;AAAA,GACpB,CAAA,CAAA;AAED,EAAA,MAAM,EAAE,uBAAA,EAAyB,oBAAyB,EAAA,GAAA,aAAA,EACxD,GAAA,SAAA,CAAA;AACF,EAAM,MAAA,EAAE,cAAiB,GAAA,SAAA,CAAA;AACzB,EAAA,MAAM,CAAC,cAAA,EAAgB,iBAAiB,CAAA,GAAI,SAAS,KAAK,CAAA,CAAA;AAC1D,EAAM,MAAA;AAAA,IACJ,iBAAA;AAAA,IACA,OAAS,EAAA,kBAAA;AAAA,IACT,MAAQ,EAAA,iBAAA;AAAA,IACR,GAAK,EAAA,eAAA;AAAA,MACH,iBAAkB,EAAA,CAAA;AACtB,EAAA,MAAM,aAAgB,GAAA,YAAA,CAAA;AACtB,EAAM,MAAA;AAAA,IACJ,eAAiB,EAAA,gBAAA;AAAA,IACjB,mBAAqB,EAAA,uBAAA;AAAA,GACnB,GAAA,WAAA,CAAA;AAEJ,EAAM,MAAA,gBAAA,GAAmB,CAAC,KAAwC,KAAA;AAChE,IAAA,kBAAA,CAAmB,KAAK,CAAA,CAAA;AACxB,IAAA,IAAI,kBAAkB,OAAS,EAAA;AAC7B,MAAA,WAAA,CAAY,gBAAgB,IAAI,CAAA,CAAA;AAAA,KAClC;AAEA,IAAA,IAAI,WAAW,YAAc,EAAA;AAC3B,MAAA,UAAA,CAAW,aAAa,KAAK,CAAA,CAAA;AAAA,KAC/B;AAEA,IAAA,YAAA,CAAa,KAAK,CAAA,CAAA;AAAA,GACpB,CAAA;AAEA,EAAM,MAAA,eAAA,GAAkB,CACtB,KACG,KAAA;AACH,IAAkB,iBAAA,EAAA,CAAA;AAClB,IAAA,oBAAA,CAAqB,KAAK,CAAA,CAAA;AAC1B,IAAA,aAAA,CAAc,EAAE,CAAA,CAAA;AAEhB,IAAA,IAAI,cAAc,MAAQ,EAAA;AACxB,MAAA,aAAA,CAAc,OAAO,KAAK,CAAA,CAAA;AAAA,KAC5B;AAEA,IAAA,IAAI,WAAW,WAAa,EAAA;AAC1B,MAAA,UAAA,CAAW,YAAY,KAAqC,CAAA,CAAA;AAAA,KAC9D;AAEA,IAAA,YAAA,CAAa,KAAK,CAAA,CAAA;AAAA,GACpB,CAAA;AAEA,EAAM,MAAA,iBAAA,GAAoB,CAAC,KAAyC,KAAA;AAClE,IAAc,aAAA,CAAA,KAAA,CAAM,OAAO,KAAK,CAAA,CAAA;AAEhC,IAAA,iBAAA,CAAkB,MAAM,MAAO,CAAA,KAAA,CAAM,MAAS,GAAA,CAAA,IAAK,CAAC,aAAa,CAAA,CAAA;AAEjE,IAAA,IAAI,WAAW,aAAe,EAAA;AAC5B,MAAA,UAAA,CAAW,cAAc,KAAK,CAAA,CAAA;AAAA,KAChC;AAAA,GACF,CAAA;AAEA,EAAM,MAAA,iBAAA,GAAoB,CAAC,QAAiC,KAAA;AAC1D,IAAA,MAAM,cAAc,KAAM,CAAA,IAAA,CAAK,IAAI,GAAA,CAAI,QAAQ,CAAC,CAAA,CAAA;AAChD,IAAA,gBAAA,CAAiB,WAAW,CAAA,CAAA;AAC5B,IAAY,QAAA,IAAA,QAAA,CAAS,MAAgC,WAAW,CAAA,CAAA;AAAA,GAClE,CAAA;AAEA,EAAM,MAAA,iBAAA,GAAoB,CAAC,KAA4C,KAAA;AACrE,IAAA,KAAA,CAAM,OAAQ,EAAA,CAAA;AACd,IAAA,mBAAA,CAAoB,IAAI,CAAA,CAAA;AAExB,IAAA,IAAI,WAAW,aAAe,EAAA;AAC5B,MAAA,UAAA,CAAW,cAAc,KAAK,CAAA,CAAA;AAAA,KAChC;AAAA,GACF,CAAA;AAEA,EAAA,MAAM,cAAc,MAAM;AACxB,IAAA,gBAAA,CAAiB,EAAE,CAAA,CAAA;AAAA,GACrB,CAAA;AAEA,EAAM,MAAA,YAAA,GAAe,CAAC,QAAA,EAAkB,KAA+B,KAAA;AACrE,IAAM,MAAA,OAAA,GAAU,MAAM,IAAK,EAAA,CAAA;AAC3B,IAAM,MAAA,IAAA,GAAO,gBAAiB,CAAA,QAAA,EAAU,OAAO,CAAA,CAAA;AAC/C,IAAA,MAAM,aAAa,QAAS,CAAA,GAAA,CAAI,YAAY,CAAE,CAAA,OAAA,CAAQ,OAAO,CAAM,KAAA,CAAA,CAAA,CAAA;AAGnE,IAAO,OAAA,CAAC,eAAe,aAAiB,IAAA,MAAA,CAAO,QAAQ,OAAO,CAAA,KAAM,MAC/D,IACD,GAAA,IAAA,CAAA;AAAA,GACN,CAAA;AAGA,EAAM,MAAA;AAAA,IACJ,QAAA;AAAA,IACA,UAAA;AAAA,IACA,KAAO,EAAA,UAAA;AAAA,IACP,OAAS,EAAA,YAAA;AAAA,MACP,iBAAkB,CAAA;AAAA,IACpB,GAAG,SAAA;AAAA,IACH,GAAG,UAAA;AAAA,IACH,QAAA;AAAA,IACA,YAAA;AAAA,IACA,YAAA;AAAA,IACA,aAAA;AAAA,IACA,oBAAA;AAAA,IACA,YAAc,EAAA,gBAAA;AAAA,IACd,WAAa,EAAA,eAAA;AAAA,IACb,aAAe,EAAA,iBAAA;AAAA,IACf,aAAe,EAAA,iBAAA;AAAA,IACf,QAAU,EAAA,iBAAA;AAAA,IACV,OAAS,EAAA,WAAA;AAAA,IACT,WAAW,UAAW,CAAA,SAAA;AAAA,GAGvB,CAAA,CAAA;AAED,EAAM,MAAA,qBAAA,GAAwB,UAAW,CAAA,eAAA,EAAiB,UAAU,CAAA,CAAA;AACpE,EAAM,MAAA,cAAA,GAAiB,UAAW,CAAA,QAAA,EAAU,qBAAqB,CAAA,CAAA;AAEjE,EAAM,MAAA,EAAE,mBAAqB,EAAA,uBAAA,EAA4B,GAAA,YAAA,CAAA;AAGzD,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,CAAC,UAAY,EAAA;AACf,MAAA,uBAAA,CAAwB,KAAS,CAAA,CAAA,CAAA;AACjC,MAAA,iBAAA,CAAkB,KAAK,CAAA,CAAA;AAAA,KACzB;AAAA,GACC,EAAA,CAAC,UAAY,EAAA,uBAAA,EAAyB,iBAAiB,CAAC,CAAA,CAAA;AAE3D,EAAM,MAAA,qBAAA,GAAwB,YAAY,aAAa,CAAA,CAAA;AAGvD,EAAA,yBAAA,CAA0B,MAAM;AAC9B,IAAA,IACE,aAAc,CAAA,IAAA;AAAA,MACZ,CAAC,IAAS,KAAA,CAAA,CAAE,yBAAyB,EAAC,EAAG,SAAS,IAAI,CAAA;AAAA,KAExD,EAAA;AACA,MAAA,aAAA,CAAc,EAAE,CAAA,CAAA;AAAA,KAClB;AAEA,IAAI,IAAA,CAAC,cAAc,MAAQ,EAAA;AACzB,MAAA,uBAAA,CAAwB,KAAS,CAAA,CAAA,CAAA;AAAA,KACnC;AAAA,GACC,EAAA;AAAA,IACD,aAAA;AAAA,IACA,qBAAA;AAAA,IACA,aAAA;AAAA,IACA,uBAAA;AAAA,GACD,CAAA,CAAA;AAGD,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IACE,UAAW,CAAA,gBAAA,IAAoB,IAC/B,IAAA,UAAA,CAAW,oBAAoB,CAC/B,EAAA;AACA,MAAA,uBAAA,CAAwB,KAAS,CAAA,CAAA,CAAA;AACjC,MAAA,iBAAA,CAAkB,KAAK,CAAA,CAAA;AAAA,KACzB;AAAA,KACC,CAAC,UAAA,CAAW,gBAAkB,EAAA,uBAAA,EAAyB,iBAAiB,CAAC,CAAA,CAAA;AAE5E,EAAM,MAAA,gBAAA,GAAmB,aAAa,SAAU,CAAA,gBAAA,CAAA;AAGhD,EAAA,SAAA,CAAU,MAAM;AACd,IAAI,IAAA,gBAAA,IAAoB,IAAQ,IAAA,gBAAA,IAAoB,CAAG,EAAA;AACrD,MAAA,uBAAA,CAAwB,KAAS,CAAA,CAAA,CAAA;AAAA,KACnC;AAAA,GACC,EAAA,CAAC,gBAAkB,EAAA,uBAAuB,CAAC,CAAA,CAAA;AAG9C,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,uBAAA,CAAwB,KAAS,CAAA,CAAA,CAAA;AAAA,GAChC,EAAA,CAAC,MAAQ,EAAA,uBAAuB,CAAC,CAAA,CAAA;AAEpC,EAAM,MAAA,wBAAA,GAA2B,CAAC,KAAuC,KAAA;AACvE,IAAA,IACE,CAAC,aAAA,IACA,KAAwB,CAAA,GAAA,KAAQ,WACjC,cACA,EAAA;AACA,MAAA,MAAM,UAAU,MAAO,CAAA,CAAA,CAAA,CAAA;AACvB,MAAA,MAAM,mBACJ,aAAc,CAAA,OAAA,CAAQ,OAAO,CAAM,KAAA,CAAA,CAAA,GAC/B,cAAc,MAAO,CAAA,MAAA,CAAO,MAAM,CAAG,EAAA,CAAC,CAAC,CACvC,GAAA,aAAA,CAAc,OAAO,CAAC,IAAA,KAAS,SAAS,OAAO,CAAA,CAAA;AACrD,MAAA,gBAAA,CAAiB,gBAAgB,CAAA,CAAA;AACjC,MAAY,QAAA,IAAA,QAAA,CAAS,OAAO,OAAO,CAAA,CAAA;AACnC,MAAY,QAAA,IAAA,QAAA,CAAS,OAAsB,gBAAgB,CAAA,CAAA;AAAA,KAC7D;AAAA,GACF,CAAA;AAEA,EAAM,MAAA,qBAAA,GAAwB,CAAC,KAAyC,KAAA;AACtE,IAAA,IAAI,QAAa,KAAA,KAAA,CAAM,GAAO,IAAA,UAAA,CAAW,QAAU,EAAA;AACjD,MAAA,UAAA,CAAW,MAAM;AACf,QAAA,IAAI,gBAAgB,OAAS,EAAA;AAC3B,UAAA,eAAA,CAAgB,QAAQ,KAAM,EAAA,CAAA;AAAA,SAChC;AAAA,SACC,GAAG,CAAA,CAAA;AAAA,KACR;AAEA,IAAA,wBAAA,CAAyB,KAAK,CAAA,CAAA;AAE9B,IAAA,IACE,MAAW,KAAA,KAAA,CAAM,GACjB,IAAA,KAAA,KAAU,KAAM,CAAA,GAAA,IAChB,EAAE,GAAA,KAAQ,KAAM,CAAA,GAAA,IAAO,CAAC,KAAA,CAAM,OAC9B,CAAA,EAAA;AACA,MAAA,IAAI,cAAc,SAAW,EAAA;AAC3B,QAAA,aAAA,CAAc,UAAU,KAAK,CAAA,CAAA;AAAA,OAC/B;AACA,MAAA,mBAAA,CAAoB,KAAK,CAAA,CAAA;AAAA,KAC3B;AAAA,GACF,CAAA;AAEA,EAAM,MAAA,kBAAA,GAAqB,CACzB,KACG,KAAA;AACH,IAAI,IAAA,QAAA,KAAa,MAAM,GAAK,EAAA;AAC1B,MAAA,aAAA,CAAc,EAAE,CAAA,CAAA;AAChB,MAAA,uBAAA,CAAwB,KAAS,CAAA,CAAA,CAAA;AAAA,KACnC;AAIA,IAAA,IAAI,GAAQ,KAAA,KAAA,CAAM,GAAO,IAAA,CAAC,MAAM,OAAS,EAAA;AACvC,MAAA,uBAAA,CAAwB,KAAS,CAAA,CAAA,CAAA;AAAA,KAC5B,MAAA;AACL,MAAA,IAAI,WAAW,SAAW,EAAA;AACxB,QAAW,UAAA,CAAA,SAAA;AAAA,UACT,KAAA;AAAA,SACF,CAAA;AAAA,OACF;AAAA,KACF;AAEA,IAAA,IACE,CAAC,YAAA,CAAa,KAAK,CAAA,IACnB,SAAU,CAAA,gBAAA,IAAoB,IAC9B,IAAA,sBAAA,CAAuB,OAAQ,CAAA,KAAA,CAAM,GAAG,CAAA,KAAM,CAC9C,CAAA,EAAA;AACA,MAAA,KAAA,CAAM,cAAe,EAAA,CAAA;AAErB,MAAA,uBAAA;AAAA,QACE,KAAK,GAAI,CAAA,cAAA,GAAiB,IAAI,CAAG,EAAA,MAAA,CAAO,SAAS,CAAC,CAAA;AAAA,OACpD,CAAA;AACA,MAAA,iBAAA,CAAkB,KAAK,CAAA,CAAA;AACvB,MAAA,mBAAA,CAAoB,KAAK,CAAA,CAAA;AAAA,eAChB,UAAY,EAAA;AACrB,MAAA,qBAAA,CAAsB,KAAsC,CAAA,CAAA;AAAA,KAC9D;AAGA,IAAqB,oBAAA,CAAA,WAAA,KAAgB,MAAM,GAAG,CAAA,CAAA;AAC9C,IAAA,YAAA,CAAa,KAAK,CAAA,CAAA;AAAA,GACpB,CAAA;AAEA,EAAM,MAAA,eAAA,GAAkB,CAAC,KAAsC,KAAA;AAC7D,IAAA,YAAA;AAAA,MACE,gBAAiB,CAAA,OAAA,IAAW,IAAO,GAAA,KAAA,CAAA,GAAY,gBAAiB,CAAA,OAAA;AAAA,KAClE,CAAA;AACA,IAAM,MAAA,OAAA,GAAU,YAAa,QAAoC,CAAA,OAAA,CAAA;AACjE,IAAA,IAAI,OAAS,EAAA;AACX,MAAA,OAAA,CAAQ,KAAM,EAAA,CAAA;AAAA,KAChB;AAEA,IAAA,IAAI,cAAc,OAAS,EAAA;AACzB,MAAA,aAAA,CAAc,QAAQ,KAAK,CAAA,CAAA;AAAA,KAC7B;AAAA,GACF,CAAA;AAEA,EAAA,MAAM,gBAAmB,GAAA;AAAA,IACvB,GAAG,UAAW,CAAA,UAAA;AAAA,IACd,UAAY,EAAA;AAAA,MACV,GAAI,CAAA,UAAA,CAAW,UAAc,IAAA,EAAI,EAAA,UAAA;AAAA,MACjC,IAAM,EAAA,SAAA;AAAA,MACN,sBAAwB,EAAA,sBAAA;AAAA,KAC1B;AAAA,GACF,CAAA;AAEA,EAAI,IAAA,oBAAA,IAAwB,CAAC,gBAAkB,EAAA;AAG7C,IAAA,gBAAA,CAAiB,WAAW,uBAA2B,CAAA,GAAA,oBAAA,CAAA;AAAA,GACzD;AAEA,EAAA,MAAM,iBAAoB,GAAA;AAAA,IACxB,cAAgB,EAAA,KAAA,CAAA;AAAA,IAChB,IAAM,EAAA,QAAA;AAAA,IACN,sBAAwB,EAAA,wBAAA;AAAA,IACxB,iBAAA,EAAmB,CAAC,cAAA,EAAgB,CAAG,EAAA,OAAA,CAAA,MAAA,CAAe,EACnD,MAAO,CAAA,OAAO,CACd,CAAA,IAAA,CAAK,GAAG,CAAA;AAAA,GACb,CAAA;AAEA,EAAO,OAAA;AAAA,IACL,YAAA;AAAA,IACA,QAAU,EAAA,cAAA;AAAA,IACV,WAAa,EAAA;AAAA,MACX,KAAO,EAAA,SAAA;AAAA,MACP,OAAS,EAAA,WAAA;AAAA,KACX;AAAA,IACA,UAAY,EAAA;AAAA,MACV,GAAG,UAAA;AAAA,MACH,aAAA;AAAA,MACA,iBAAA;AAAA,MACA,EAAI,EAAA,OAAA;AAAA,MACJ,KAAO,EAAA,UAAA;AAAA,MACP,iBAAmB,EAAA,iBAAA;AAAA,MACnB,UAAY,EAAA,gBAAA;AAAA,MACZ,SAAW,EAAA,kBAAA;AAAA,KACb;AAAA,IACA,SAAW,EAAA;AAAA,MACT,GAAG,aAAA;AAAA,MACH,MAAA;AAAA,MACA,YAAA;AAAA,MACA,wBAAA;AAAA,MACA,OAAS,EAAA,eAAA;AAAA,MACT,UAAY,EAAA,UAAA,IAAc,OAAQ,CAAA,MAAA,CAAO,MAAM,CAAA;AAAA,KACjD;AAAA,GACF,CAAA;AACF;;;;"}
+{"version":3,"file":"useMultiSelectComboBox.js","sources":["../src/combo-box-deprecated/internal/useMultiSelectComboBox.ts"],"sourcesContent":["import {\n  useControlled,\n  useForkRef,\n  useId,\n  useIsFocusVisible,\n  useIsomorphicLayoutEffect,\n  usePrevious,\n} from \"@salt-ds/core\";\nimport {\n  ChangeEvent,\n  FocusEvent,\n  KeyboardEvent,\n  KeyboardEventHandler,\n  MouseEvent,\n  RefObject,\n  SyntheticEvent,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\nimport { useList } from \"../../list-deprecated\";\nimport { ExpandButtonProps, useTokenizedInput } from \"../../tokenized-input\";\nimport { defaultItemToString } from \"../../tokenized-input/internal/defaultItemToString\";\n\nimport { getDefaultFilter, getDefaultFilterRegex } from \"../filterHelpers\";\nimport { MultiSelectComboBoxProps } from \"./MultiSelectComboBox\";\nimport { isToggleList, usePopperStatus } from \"./usePopperStatus\";\n\nconst REQUIRE_PREV_HIGHLIGHT = [\"ArrowUp\", \"ArrowDown\", \"PageUp\", \"PageDown\"];\n\nexport type UseMultiSelectComboBoxProps<Item> = Omit<\n  MultiSelectComboBoxProps<Item>,\n  \"inputRef\" | \"listContext\" | \"inputHelpers\" | \"inputProps\" | \"listProps\"\n> & { expandButtonRef: RefObject<HTMLElement> };\n\nexport const useMultiSelectComboBox = <Item>(\n  props: Omit<UseMultiSelectComboBoxProps<Item>, \"rootRef\" | \"classes\">\n) => {\n  // Deconstruct valid props for List, everything else will be passed to `useTokenizedInput` using `restProps`\n  const {\n    allowFreeText,\n    displayedItemCount,\n    virtualized,\n    disabled,\n    expandButtonRef,\n    onBlur,\n    onFocus,\n    onChange,\n    onSelect,\n    onInputChange,\n    onInputFocus,\n    onInputBlur,\n    onInputSelect,\n    id: idProp,\n    source: sourceProp,\n    selectedItem: selectedItemProp,\n    inputValue: inputValueProp,\n    initialOpen,\n    initialSelectedItem: initialSelectedItems,\n    \"aria-labelledby\": ariaLabelledBy,\n    getFilterRegex = getDefaultFilterRegex,\n    itemToString = defaultItemToString,\n    stringToItem: stringToItemProp = (_: any, value: string) => value.trim(),\n    InputProps = {\n      onBlur,\n      onFocus,\n      onInputBlur,\n      onInputFocus,\n      onInputChange,\n      onInputSelect,\n    },\n    ListProps = {},\n    ...restProps\n  } = props;\n\n  const id = useId(idProp);\n  const inputId = `${id}-input`;\n  const listId = `${id}-list`;\n\n  const [inputValue, setInputValue] = useControlled({\n    controlled: inputValueProp,\n    default: \"\",\n    name: \"MultiSelectComboBox\",\n    state: \"inputValue\",\n  });\n\n  const { isOpen: isListOpen, notifyPopper } = usePopperStatus({\n    initialOpen,\n    isMultiSelect: true,\n  });\n\n  const [selectionChanged, setSelectionChanged] = useState(false);\n  const inputBlurTimeout = useRef<number>(null);\n\n  const [allowAnnouncement, setAllowAnnouncement] = useState(false);\n\n  const labels = useMemo(\n    () => sourceProp.map(itemToString),\n    [sourceProp, itemToString]\n  );\n\n  const source = useMemo(() => {\n    if (inputValue && inputValue.trim().length) {\n      const itemFilter = getDefaultFilter(inputValue, getFilterRegex);\n      return sourceProp.filter((item: Item) => itemFilter(itemToString(item)));\n    }\n    return sourceProp;\n  }, [inputValue, sourceProp, getFilterRegex, itemToString]);\n\n  const itemTextHighlightPattern = useMemo(\n    () =>\n      inputValue && inputValue.trim().length\n        ? getFilterRegex(inputValue)\n        : undefined,\n    [inputValue, getFilterRegex]\n  );\n\n  const {\n    focusedRef,\n    listProps,\n    state: listState,\n    helpers: listHelpers,\n  } = useList<Item, \"multiple\">({\n    ...ListProps,\n    source,\n    disabled,\n    virtualized,\n    itemToString,\n    displayedItemCount,\n    onChange,\n    onSelect,\n    id: listId,\n    disableFocus: true,\n    disableMouseDown: true,\n    selectionVariant: \"multiple\",\n    initialSelectedItem: initialSelectedItems,\n    selectedItem: selectedItemProp,\n    \"aria-labelledby\": ariaLabelledBy,\n  });\n\n  const { \"aria-activedescendant\": ariaActiveDescendant, ...restListProps } =\n    listProps;\n  const { selectedItem } = listState;\n  const [quickSelection, setQuickSelection] = useState(false);\n  const {\n    isFocusVisibleRef,\n    onFocus: handleFocusVisible,\n    onBlur: handleBlurVisible,\n    ref: focusVisibleRef,\n  } = useIsFocusVisible();\n  const selectedItems = selectedItem as Item[];\n  const {\n    setSelectedItem: setSelectedItems,\n    setHighlightedIndex: setHighlightedListIndex,\n  } = listHelpers;\n\n  const handleInputFocus = (event: FocusEvent<HTMLInputElement>) => {\n    handleFocusVisible(event);\n    if (isFocusVisibleRef.current) {\n      listHelpers.setFocusVisible(true);\n    }\n\n    if (InputProps.onInputFocus) {\n      InputProps.onInputFocus(event);\n    }\n\n    notifyPopper(event);\n  };\n\n  const handleInputBlur = (\n    event: FocusEvent<HTMLDivElement | HTMLInputElement>\n  ) => {\n    handleBlurVisible();\n    setAllowAnnouncement(false);\n    setInputValue(\"\");\n\n    if (restListProps.onBlur) {\n      restListProps.onBlur(event);\n    }\n\n    if (InputProps.onInputBlur) {\n      InputProps.onInputBlur(event as FocusEvent<HTMLInputElement>);\n    }\n\n    notifyPopper(event);\n  };\n\n  const handleInputChange = (event: ChangeEvent<HTMLInputElement>) => {\n    setInputValue(event.target.value);\n\n    setQuickSelection(event.target.value.length > 0 && !allowFreeText);\n\n    if (InputProps.onInputChange) {\n      InputProps.onInputChange(event);\n    }\n  };\n\n  const handleItemsChange = (newItems: Item[] | undefined) => {\n    const uniqueItems = Array.from(new Set(newItems));\n    setSelectedItems(uniqueItems);\n    onChange && onChange(null as unknown as ChangeEvent, uniqueItems);\n  };\n\n  const handleInputSelect = (event: SyntheticEvent<HTMLInputElement>) => {\n    event.persist();\n    setSelectionChanged(true);\n\n    if (InputProps.onInputSelect) {\n      InputProps.onInputSelect(event);\n    }\n  };\n\n  const handleClear = () => {\n    setSelectedItems([]);\n  };\n\n  const stringToItem = (selected: Item[], value: string): Item | null => {\n    const trimmed = value.trim();\n    const item = stringToItemProp(selected, trimmed);\n    const isSelected = selected.map(itemToString).indexOf(trimmed) !== -1;\n\n    // Either allow free text item OR the item has to be in the source list\n    return !isSelected && (allowFreeText || labels.indexOf(trimmed) !== -1)\n      ? (item as Item)\n      : null;\n  };\n\n  // Reuse selectItem from list state for a controlled version of tokenized input\n  const {\n    inputRef,\n    inputProps,\n    state: inputState,\n    helpers: inputHelpers,\n  } = useTokenizedInput({\n    ...restProps,\n    ...InputProps,\n    disabled,\n    itemToString,\n    stringToItem,\n    selectedItems,\n    initialSelectedItems,\n    onInputFocus: handleInputFocus,\n    onInputBlur: handleInputBlur,\n    onInputChange: handleInputChange,\n    onInputSelect: handleInputSelect,\n    onChange: handleItemsChange,\n    onClear: handleClear,\n    onKeyDown: InputProps.onKeyDown as KeyboardEventHandler<\n      HTMLInputElement | HTMLButtonElement\n    >,\n  });\n\n  const handleFocusVisibleRef = useForkRef(focusVisibleRef, focusedRef);\n  const handleInputRef = useForkRef(inputRef, handleFocusVisibleRef);\n\n  const { setHighlightedIndex: setHighlightedPillIndex } = inputHelpers;\n\n  // Reset highlight when list closes\n  useEffect(() => {\n    if (!isListOpen) {\n      setHighlightedListIndex(undefined);\n      setQuickSelection(false);\n    }\n  }, [isListOpen, setHighlightedListIndex, setQuickSelection]);\n\n  const previousSelectedItems = usePrevious(selectedItems);\n\n  // Reset list highlight when selectItems change\n  useIsomorphicLayoutEffect(() => {\n    if (\n      selectedItems.some(\n        (item) => !(previousSelectedItems || []).includes(item)\n      )\n    ) {\n      setInputValue(\"\");\n    }\n\n    if (!selectedItems.length) {\n      setHighlightedListIndex(undefined);\n    }\n  }, [\n    selectedItems,\n    previousSelectedItems,\n    setInputValue,\n    setHighlightedListIndex,\n  ]);\n\n  // Remove highlight from list if a pill is highlighted\n  useEffect(() => {\n    if (\n      inputState.highlightedIndex != null &&\n      inputState.highlightedIndex >= 0\n    ) {\n      setHighlightedListIndex(undefined);\n      setQuickSelection(false);\n    }\n  }, [inputState.highlightedIndex, setHighlightedListIndex, setQuickSelection]);\n\n  const highlightedIndex = listState && listState.highlightedIndex;\n\n  // Remove highlight from pills if a list item is highlighted\n  useEffect(() => {\n    if (highlightedIndex != null && highlightedIndex >= 0) {\n      setHighlightedPillIndex(undefined);\n    }\n  }, [highlightedIndex, setHighlightedPillIndex]);\n\n  // Keep highlighted index in sync with the filtered source\n  useEffect(() => {\n    setHighlightedListIndex(undefined);\n  }, [source, setHighlightedListIndex]);\n\n  const handleFirstItemSelection = (event: KeyboardEvent | ChangeEvent) => {\n    if (\n      !allowFreeText &&\n      (event as KeyboardEvent).key === \"Enter\" &&\n      quickSelection\n    ) {\n      const newItem = source[0];\n      const newSelectedItems =\n        selectedItems.indexOf(newItem) === -1\n          ? selectedItems.concat(source.slice(0, 1))\n          : selectedItems.filter((item) => item !== newItem);\n      setSelectedItems(newSelectedItems);\n      onSelect && onSelect(event, newItem);\n      onChange && onChange(event as ChangeEvent, newSelectedItems);\n    }\n  };\n\n  const handleListOpenKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n    if (\"Escape\" === event.key && inputProps.expanded) {\n      setTimeout(() => {\n        if (expandButtonRef.current) {\n          expandButtonRef.current.focus();\n        }\n      }, 250);\n    }\n\n    handleFirstItemSelection(event);\n\n    if (\n      \"Home\" !== event.key &&\n      \"End\" !== event.key &&\n      !(\" \" === event.key && !event.ctrlKey)\n    ) {\n      if (restListProps.onKeyDown) {\n        restListProps.onKeyDown(event);\n      }\n      setSelectionChanged(false);\n    }\n  };\n\n  const handleInputKeyDown = (\n    event: KeyboardEvent<HTMLInputElement | HTMLButtonElement | HTMLDivElement>\n  ) => {\n    if (\"Escape\" === event.key) {\n      setInputValue(\"\");\n      setHighlightedListIndex(undefined);\n    }\n\n    // Space key clashes with the remove action of TokenizedInput\n    // For combo box, pressing a space key should just add a space\n    if (\" \" === event.key && !event.ctrlKey) {\n      setHighlightedPillIndex(undefined);\n    } else {\n      if (inputProps.onKeyDown) {\n        inputProps.onKeyDown(\n          event as KeyboardEvent<HTMLInputElement | HTMLButtonElement>\n        );\n      }\n    }\n\n    if (\n      !isToggleList(event) &&\n      listState.highlightedIndex == null &&\n      REQUIRE_PREV_HIGHLIGHT.indexOf(event.key) !== -1\n    ) {\n      event.preventDefault();\n      // Initialize list highlight if there's no previous value\n      setHighlightedListIndex(\n        Math.min(quickSelection ? 1 : 0, source.length - 1)\n      );\n      setQuickSelection(false);\n      setSelectionChanged(false);\n    } else if (isListOpen) {\n      handleListOpenKeyDown(event as KeyboardEvent<HTMLDivElement>);\n    }\n\n    // Don't announce for deleting values\n    setAllowAnnouncement(\"Backspace\" !== event.key);\n    notifyPopper(event);\n  };\n\n  const handleListClick = (event: MouseEvent<HTMLDivElement>) => {\n    clearTimeout(\n      inputBlurTimeout.current == null ? undefined : inputBlurTimeout.current\n    );\n    const inputEl = inputRef && (inputRef as RefObject<HTMLElement>).current;\n    if (inputEl) {\n      inputEl.focus();\n    }\n\n    if (restListProps.onClick) {\n      restListProps.onClick(event);\n    }\n  };\n\n  const mergedInputProps = {\n    ...inputProps.InputProps,\n    inputProps: {\n      ...(inputProps.InputProps || {}).inputProps,\n      role: \"textbox\",\n      \"aria-roledescription\": \"MultiSelect Combobox\",\n    },\n  };\n\n  if (ariaActiveDescendant && !selectionChanged) {\n    // either null or undefined will prevent tokenized-input from\n    // setting active-descendant based on pill selection.\n    mergedInputProps.inputProps[\"aria-activedescendant\"] = ariaActiveDescendant;\n  }\n\n  const expandButtonProps = {\n    accessibleText: undefined,\n    role: \"button\",\n    \"aria-roledescription\": \"Expand combobox button\",\n    \"aria-labelledby\": [ariaLabelledBy, `${inputId}-input`]\n      .filter(Boolean)\n      .join(\" \"),\n  } as ExpandButtonProps;\n\n  return {\n    inputHelpers,\n    inputRef: handleInputRef,\n    listContext: {\n      state: listState,\n      helpers: listHelpers,\n    },\n    inputProps: {\n      ...inputProps,\n      selectedItems,\n      allowAnnouncement,\n      id: inputId,\n      value: inputValue,\n      ExpandButtonProps: expandButtonProps,\n      InputProps: mergedInputProps,\n      onKeyDown: handleInputKeyDown,\n    },\n    listProps: {\n      ...restListProps,\n      source,\n      itemToString,\n      itemTextHighlightPattern,\n      onClick: handleListClick,\n      isListOpen: isListOpen && Boolean(source.length),\n    },\n  };\n};\n"],"names":[],"mappings":"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"}

package/dist-es/combo-box-next/ComboBoxNext.css.js

@@ -1,4 +1,4 @@
-var css_248z = ".saltComboBoxNext-highlight {\n  font-weight: var(--salt-text-fontWeight-strong);\n}\n\n.saltComboBoxNext-input:hover {\n  --saltInput-borderColor: var(--salt-focused-outlineColor);\n}\n\n.saltComboBoxNext-list {\n  border-color: var(--salt-selectable-borderColor-selected);\n  box-shadow: var(--salt-overlayable-shadow-popout);\n  max-height: calc((var(--salt-size-base) + var(--salt-spacing-100)) * var(--comboBoxNext-itemCount, 5));\n}\n";
+var css_248z = ".saltComboBoxNext-highlight {\n  font-weight: var(--salt-text-fontWeight-strong);\n}\n\n.saltComboBoxNext-input:hover {\n  --saltInput-borderColor: var(--salt-focused-outlineColor);\n}\n\n.saltComboBoxNext-list.saltListNext {\n  border-color: var(--salt-selectable-borderColor-selected);\n  box-shadow: var(--salt-overlayable-shadow-popout);\n  max-height: calc((var(--salt-size-base) + var(--salt-spacing-100)) * var(--comboBoxNext-itemCount, 5));\n  z-index: calc(var(--salt-zIndex-appHeader) - 1);\n}\n";
 
 export { css_248z as default };
 //# sourceMappingURL=ComboBoxNext.css.js.map

package/dist-es/combo-box-next/ComboBoxNext.js

@@ -14,23 +14,26 @@ import { clsx } from 'clsx';
 
 const withBaseName = makePrefixer("saltComboBoxNext");
 const ComboBoxNext = forwardRef(function ComboBoxNext2({
-  InputProps: InputProps2 = {},
   ListProps = {},
   PortalProps = {},
-  disabled,
+  inputValue: inputValueProp,
   highlightedItem: highlightedItemProp,
-  selected,
+  selected: selectedProp,
+  defaultInputValue,
   defaultSelected,
-  onKeyDown,
-  onChange,
-  onBlur,
-  onFocus,
-  onMouseOver,
+  disabled,
+  variant = "primary",
   source,
+  listRef: listRefProp,
   ListItem = DefaultListItem,
   itemFilter = defaultFilter,
-  variant = "primary",
-  listRef: listRefProp,
+  onMouseOver,
+  onBlur,
+  onFocus,
+  onKeyDown,
+  onSelect,
+  onListChange,
+  onChange: onInputChange,
   ...rest
 }, ref) {
   const targetWindow = useWindow();
@@ -43,10 +46,12 @@ const ComboBoxNext = forwardRef(function ComboBoxNext2({
   const listRef = useRef(null);
   const setListRef = useForkRef(listRefProp, listRef);
   const listProps = {
+    disabled,
     highlightedItem: highlightedItemProp,
-    selected,
+    selected: selectedProp,
     defaultSelected,
-    onChange,
+    onChange: onListChange,
+    onSelect,
     id: listId,
     ref: listRef
   };
@@ -65,6 +70,8 @@ const ComboBoxNext = forwardRef(function ComboBoxNext2({
     setHighlightedItem,
     mouseOverHandler
   } = useComboBox({
+    defaultInputValue,
+    inputValue: inputValueProp,
     onBlur,
     onFocus,
     onMouseOver,
@@ -85,12 +92,12 @@ const ComboBoxNext = forwardRef(function ComboBoxNext2({
   const getFilteredSource = () => {
     if (!source)
       return null;
-    if (selectedItem)
+    if (selectedItem && inputValue === selectedItem)
       return source;
     return itemFilter && itemFilter(source, inputValue);
   };
   const filteredSource = getFilteredSource();
-  const onInputChange = (event) => {
+  const onChange = (event) => {
     const value = event.target.value;
     setInputValue(value);
     if (value === "") {
@@ -104,7 +111,7 @@ const ComboBoxNext = forwardRef(function ComboBoxNext2({
         setHighlightedItem(filteredSource[0]);
       }
     }
-    onChange == null ? void 0 : onChange(event, { value: inputValue || "" });
+    onInputChange == null ? void 0 : onInputChange(event, { value: inputValue || "" });
   };
   const adornment = open ? /* @__PURE__ */ jsx(ChevronUpIcon, {
     className: withBaseName("chevron")
@@ -112,7 +119,7 @@ const ComboBoxNext = forwardRef(function ComboBoxNext2({
     className: withBaseName("chevron")
   });
   const { className: listClassName, ...restListProps } = ListProps;
-  const { className: inputClassName, ...restInputProps } = InputProps2;
+  const { className: inputClassName, ...restInputProps } = rest;
   return /* @__PURE__ */ jsxs(Fragment, {
     children: [
       /* @__PURE__ */ jsx(Input, {
@@ -121,7 +128,7 @@ const ComboBoxNext = forwardRef(function ComboBoxNext2({
         className: clsx(withBaseName("input"), inputClassName),
         disabled,
         endAdornment: adornment,
-        onChange: onInputChange,
+        onChange,
         onBlur: blurHandler,
         inputRef,
         inputProps: {
@@ -155,7 +162,7 @@ const ComboBoxNext = forwardRef(function ComboBoxNext2({
                   setSelectedItem((_a = event.currentTarget) == null ? void 0 : _a.dataset.value);
                   setInputValue((_b = event.currentTarget) == null ? void 0 : _b.dataset.value);
                 };
-                return /* @__PURE__ */ jsx(ListItem, {
+                return ListItem && /* @__PURE__ */ jsx(ListItem, {
                   value,
                   matchPattern: inputValue,
                   onMouseDown

package/dist-es/combo-box-next/ComboBoxNext.js.map

@@ -1 +1 @@
-{"version":3,"file":"ComboBoxNext.js","sources":["../src/combo-box-next/ComboBoxNext.tsx"],"sourcesContent":["import {\n  ChangeEvent,\n  ComponentPropsWithoutRef,\n  FocusEvent,\n  ForwardedRef,\n  forwardRef,\n  KeyboardEvent,\n  ReactElement,\n  Ref,\n  SyntheticEvent,\n  useRef,\n} from \"react\";\nimport {\n  Input,\n  makePrefixer,\n  SaltProvider,\n  useForkRef,\n  useId,\n  InputProps,\n} from \"@salt-ds/core\";\nimport { ListNext, ListNextProps } from \"../list-next\";\nimport { FloatingPortal } from \"@floating-ui/react\";\nimport { useComboBox } from \"./useComboBox\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport comboBoxNextCss from \"./ComboBoxNext.css\";\nimport { ChevronDownIcon, ChevronUpIcon } from \"@salt-ds/icons\";\nimport { DefaultListItem, defaultFilter, ComboBoxItemProps } from \"./utils\";\nimport { clsx } from \"clsx\";\nimport { UseComboBoxPortalProps } from \"./useComboboxPortal\";\n\nconst withBaseName = makePrefixer(\"saltComboBoxNext\");\n\nexport interface ComboBoxNextProps<T>\n  extends Omit<ComponentPropsWithoutRef<\"input\">, \"onChange\"> {\n  /**\n   * Additional props for the input component.\n   */\n  InputProps?: InputProps;\n  /**\n   * Additional props for the list component.\n   */\n  ListProps?: ListNextProps;\n  /**\n   * Additional props for the portal.\n   */\n  PortalProps?: UseComboBoxPortalProps;\n  /**\n   * If `true`, the component will be disabled.\n   */\n  disabled: boolean;\n  /* Highlighted index for when the list is controlled. */\n  highlightedItem?: string;\n  /* Selected value for when the list is controlled. */\n  selected?: string;\n  /* Initial selected value for when the list is controlled. */\n  defaultSelected?: string;\n  /**\n   * The source of combobox items.\n   */\n  source: T[];\n  /**\n   * Callback for blur event\n   */\n  onBlur?: (event: FocusEvent<HTMLInputElement>) => void;\n  /**\n   * Callback for focus event\n   */\n  onFocus?: (event: FocusEvent<HTMLInputElement>) => void;\n  /**\n   * Callback for keyDown event\n   */\n  onKeyDown?: (event: KeyboardEvent<HTMLInputElement>) => void;\n  /**\n   * Callback for mouse over event\n   */\n  onMouseOver?: (event: SyntheticEvent) => void;\n  /**\n   * Optional ref for the input component\n   */\n  inputRef?: Ref<HTMLInputElement>;\n  /**\n   * Optional ref for the list component\n   */\n  listRef?: Ref<HTMLUListElement>;\n  /**\n   * The component used for item instead of the default.\n   */\n  ListItem: (props: ComboBoxItemProps<T>) => ReactElement<ComboBoxItemProps<T>>;\n  /**\n   * Function to be used as filter.\n   */\n  itemFilter?: (source: T[], filterValue?: string) => T[];\n  /* Callback for change event in input. */\n  onChange?: (event: SyntheticEvent, data: { value: string }) => void;\n  /**\n   * Styling variant. Defaults to \"primary\".\n   */\n  variant?: \"primary\" | \"secondary\";\n}\n\nexport const ComboBoxNext = forwardRef(function ComboBoxNext<T>(\n  {\n    InputProps = {},\n    ListProps = {},\n    PortalProps = {},\n    disabled,\n    highlightedItem: highlightedItemProp,\n    selected,\n    defaultSelected,\n    onKeyDown,\n    onChange,\n    onBlur,\n    onFocus,\n    onMouseOver,\n    source,\n    ListItem = DefaultListItem as unknown as ComboBoxNextProps<T>[\"ListItem\"],\n    itemFilter = defaultFilter as unknown as ComboBoxNextProps<T>[\"itemFilter\"],\n    variant = \"primary\",\n    listRef: listRefProp,\n    ...rest\n  }: ComboBoxNextProps<T>,\n  ref?: ForwardedRef<HTMLInputElement>\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-combo-box-next\",\n    css: comboBoxNextCss,\n    window: targetWindow,\n  });\n  const listId = useId(ListProps?.id);\n  const listRef = useRef<HTMLUListElement>(null);\n\n  const setListRef = useForkRef(listRefProp, listRef);\n  const listProps = {\n    highlightedItem: highlightedItemProp,\n    selected,\n    defaultSelected,\n    onChange,\n    id: listId,\n    ref: listRef,\n  };\n\n  const {\n    inputValue,\n    setInputValue,\n    portalProps,\n    selectedItem,\n    highlightedItem,\n    activeDescendant,\n    focusVisibleRef,\n    keyDownHandler,\n    focusHandler,\n    blurHandler,\n    setSelectedItem,\n    setHighlightedItem,\n    mouseOverHandler,\n  } = useComboBox({\n    onBlur,\n    onFocus,\n    onMouseOver,\n    onKeyDown,\n    listProps,\n    PortalProps,\n  });\n\n  const {\n    open,\n    setOpen,\n    floating,\n    reference,\n    getTriggerProps,\n    getPortalProps,\n  } = portalProps;\n\n  // floating references\n  const triggerRef = useForkRef(ref, reference);\n  const inputRef = useForkRef(triggerRef, focusVisibleRef);\n\n  const getFilteredSource = () => {\n    if (!source) return null;\n    if (selectedItem) return source;\n    return itemFilter && itemFilter(source, inputValue);\n  };\n  const filteredSource = getFilteredSource();\n\n  const onInputChange = (event: ChangeEvent<HTMLInputElement>) => {\n    const value = event.target.value;\n    setInputValue(value);\n    if (value === \"\") {\n      setHighlightedItem(undefined);\n      setSelectedItem(value);\n    } else {\n      if (!open) {\n        setOpen(true);\n      }\n      if (filteredSource) {\n        setHighlightedItem(filteredSource[0] as unknown as string);\n      }\n    }\n    onChange?.(event, { value: inputValue || \"\" });\n  };\n\n  const adornment = open ? (\n    <ChevronUpIcon className={withBaseName(\"chevron\")} />\n  ) : (\n    <ChevronDownIcon className={withBaseName(\"chevron\")} />\n  );\n\n  const { className: listClassName, ...restListProps } = ListProps;\n  const { className: inputClassName, ...restInputProps } = InputProps;\n\n  return (\n    <>\n      <Input\n        aria-controls={listId}\n        aria-activedescendant={disabled ? undefined : activeDescendant}\n        className={clsx(withBaseName(\"input\"), inputClassName)}\n        disabled={disabled}\n        endAdornment={adornment}\n        onChange={onInputChange}\n        onBlur={blurHandler}\n        inputRef={inputRef as Ref<HTMLInputElement>}\n        inputProps={{\n          \"aria-expanded\": open,\n          tabIndex: disabled ? -1 : 0,\n          onFocus: focusHandler,\n          onKeyDown: keyDownHandler,\n        }}\n        role=\"combobox\"\n        variant={variant}\n        value={inputValue}\n        {...getTriggerProps()}\n        {...restInputProps}\n      />\n      {open && filteredSource && (\n        <FloatingPortal>\n          {/* The provider is needed to support the use case where an app has nested modes. The portal element needs to have the same style as the current scope */}\n          <SaltProvider>\n            <div ref={floating} {...getPortalProps()}>\n              <ListNext\n                className={clsx(withBaseName(\"list\"), listClassName)}\n                disableFocus\n                highlightedItem={highlightedItem}\n                onMouseOver={mouseOverHandler}\n                selected={selectedItem}\n                {...restListProps}\n                ref={setListRef}\n              >\n                {filteredSource.map((value, index) => {\n                  const onMouseDown = (\n                    event: SyntheticEvent<HTMLLIElement>\n                  ) => {\n                    setSelectedItem(event.currentTarget?.dataset.value);\n                    setInputValue(event.currentTarget?.dataset.value);\n                  };\n                  return (\n                    <ListItem\n                      key={index}\n                      value={value}\n                      matchPattern={inputValue}\n                      onMouseDown={onMouseDown}\n                    />\n                  );\n                })}\n              </ListNext>\n            </div>\n          </SaltProvider>\n        </FloatingPortal>\n      )}\n    </>\n  );\n});\n"],"names":["ComboBoxNext","InputProps","comboBoxNextCss"],"mappings":"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"}
+{"version":3,"file":"ComboBoxNext.js","sources":["../src/combo-box-next/ComboBoxNext.tsx"],"sourcesContent":["import {\n  ChangeEvent,\n  ComponentPropsWithoutRef,\n  ForwardedRef,\n  forwardRef,\n  ReactElement,\n  Ref,\n  SyntheticEvent,\n  useRef,\n} from \"react\";\nimport {\n  Input,\n  makePrefixer,\n  SaltProvider,\n  useForkRef,\n  useId,\n} from \"@salt-ds/core\";\nimport { ListNext, ListNextProps } from \"../list-next\";\nimport { FloatingPortal } from \"@floating-ui/react\";\nimport { useComboBox } from \"./useComboBox\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport comboBoxNextCss from \"./ComboBoxNext.css\";\nimport { ChevronDownIcon, ChevronUpIcon } from \"@salt-ds/icons\";\nimport { DefaultListItem, defaultFilter, ComboBoxItemProps } from \"./utils\";\nimport { clsx } from \"clsx\";\nimport { UseComboBoxPortalProps } from \"./useComboboxPortal\";\n\nconst withBaseName = makePrefixer(\"saltComboBoxNext\");\n\nexport interface ComboBoxNextProps<T>\n  extends Omit<ComponentPropsWithoutRef<\"input\">, \"onChange\" | \"onSelect\"> {\n  /**\n   * Additional props for the list component.\n   */\n  ListProps?: ListNextProps;\n  /**\n   * Additional props for the portal.\n   */\n  PortalProps?: UseComboBoxPortalProps;\n  /**\n   * Controlled prop. Controls the Input value in the Combo Box Input.\n   */\n  inputValue?: string;\n  /**\n   * Controlled prop. Controls the Highlighted item in the Combo Box list.\n   */\n  highlightedItem?: string;\n  /**\n   * Controlled prop. Controls the Selected value in the Combo Box list.\n   */\n  selected?: string;\n  /**\n   * Initial input value for when the list is uncontrolled.\n   */\n  defaultInputValue?: string;\n  /**\n   * Initial selected value for when the list is uncontrolled.\n   */\n  defaultSelected?: string;\n  /**\n   * If `true`, the component will be disabled.\n   */\n  disabled?: boolean;\n  /**\n   * Styling variant. Defaults to \"primary\".\n   */\n  variant?: \"primary\" | \"secondary\";\n  /**\n  /**\n   * The source of combobox items.\n   */\n  source: T[];\n  /**\n   * Optional ref for the list component\n   */\n  listRef?: Ref<HTMLUListElement>;\n  /**\n   * The component used for item instead of the default.\n   */\n  ListItem?: (\n    props: ComboBoxItemProps<T>\n  ) => ReactElement<ComboBoxItemProps<T>>;\n  /**\n   * Function to be used as filter.\n   */\n  itemFilter?: (source: T[], filterValue?: string) => T[];\n  /**\n   * Callback for mouse over event\n   */\n  onMouseOver?: (event: SyntheticEvent) => void;\n  /**\n   * Callback for list selection event\n   */\n  onSelect?: (event: SyntheticEvent, data: { value: string }) => void;\n  /**\n  /**\n   * Callback for list change event\n   */\n  onListChange?: (\n    event: SyntheticEvent,\n    data: { value: string | undefined }\n  ) => void;\n  /**\n   * Callback for input change event\n   */\n  onChange?: (event: SyntheticEvent, data: { value: string }) => void;\n}\n\nexport const ComboBoxNext = forwardRef(function ComboBoxNext<T>(\n  {\n    ListProps = {},\n    PortalProps = {},\n    inputValue: inputValueProp,\n    highlightedItem: highlightedItemProp,\n    selected: selectedProp,\n    defaultInputValue,\n    defaultSelected,\n    disabled,\n    variant = \"primary\",\n    source,\n    listRef: listRefProp,\n    ListItem = DefaultListItem as unknown as ComboBoxNextProps<T>[\"ListItem\"],\n    itemFilter = defaultFilter as unknown as ComboBoxNextProps<T>[\"itemFilter\"],\n    onMouseOver,\n    onBlur,\n    onFocus,\n    onKeyDown,\n    onSelect,\n    onListChange,\n    onChange: onInputChange,\n    ...rest\n  }: ComboBoxNextProps<T>,\n  ref?: ForwardedRef<HTMLInputElement>\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-combo-box-next\",\n    css: comboBoxNextCss,\n    window: targetWindow,\n  });\n  const listId = useId(ListProps?.id);\n  const listRef = useRef<HTMLUListElement>(null);\n\n  const setListRef = useForkRef(listRefProp, listRef);\n  const listProps = {\n    disabled,\n    highlightedItem: highlightedItemProp,\n    selected: selectedProp,\n    defaultSelected,\n    onChange: onListChange,\n    onSelect: onSelect,\n    id: listId,\n    ref: listRef,\n  };\n\n  const {\n    inputValue,\n    setInputValue,\n    portalProps,\n    selectedItem,\n    highlightedItem,\n    activeDescendant,\n    focusVisibleRef,\n    keyDownHandler,\n    focusHandler,\n    blurHandler,\n    setSelectedItem,\n    setHighlightedItem,\n    mouseOverHandler,\n  } = useComboBox({\n    defaultInputValue,\n    inputValue: inputValueProp,\n    onBlur,\n    onFocus,\n    onMouseOver,\n    onKeyDown,\n    listProps,\n    PortalProps,\n  });\n\n  const {\n    open,\n    setOpen,\n    floating,\n    reference,\n    getTriggerProps,\n    getPortalProps,\n  } = portalProps;\n\n  // floating references\n  const triggerRef = useForkRef(ref, reference);\n  const inputRef = useForkRef(triggerRef, focusVisibleRef);\n\n  const getFilteredSource = () => {\n    if (!source) return null;\n    if (selectedItem && inputValue === selectedItem) return source;\n    return itemFilter && itemFilter(source, inputValue);\n  };\n  const filteredSource = getFilteredSource();\n\n  const onChange = (event: ChangeEvent<HTMLInputElement>) => {\n    const value = event.target.value;\n    setInputValue(value);\n    if (value === \"\") {\n      setHighlightedItem(undefined);\n      setSelectedItem(value);\n    } else {\n      if (!open) {\n        setOpen(true);\n      }\n      if (filteredSource) {\n        setHighlightedItem(filteredSource[0] as unknown as string);\n      }\n    }\n    onInputChange?.(event, { value: inputValue || \"\" });\n  };\n\n  const adornment = open ? (\n    <ChevronUpIcon className={withBaseName(\"chevron\")} />\n  ) : (\n    <ChevronDownIcon className={withBaseName(\"chevron\")} />\n  );\n\n  const { className: listClassName, ...restListProps } = ListProps;\n  const { className: inputClassName, ...restInputProps } = rest;\n\n  return (\n    <>\n      <Input\n        aria-controls={listId}\n        aria-activedescendant={disabled ? undefined : activeDescendant}\n        className={clsx(withBaseName(\"input\"), inputClassName)}\n        disabled={disabled}\n        endAdornment={adornment}\n        onChange={onChange}\n        onBlur={blurHandler}\n        inputRef={inputRef as Ref<HTMLInputElement>}\n        inputProps={{\n          \"aria-expanded\": open,\n          tabIndex: disabled ? -1 : 0,\n          onFocus: focusHandler,\n          onKeyDown: keyDownHandler,\n        }}\n        role=\"combobox\"\n        variant={variant}\n        value={inputValue}\n        {...getTriggerProps()}\n        {...restInputProps}\n      />\n      {open && filteredSource && (\n        <FloatingPortal>\n          {/* The provider is needed to support the use case where an app has nested modes. The portal element needs to have the same style as the current scope */}\n          <SaltProvider>\n            <div ref={floating} {...getPortalProps()}>\n              <ListNext\n                className={clsx(withBaseName(\"list\"), listClassName)}\n                disableFocus\n                highlightedItem={highlightedItem}\n                onMouseOver={mouseOverHandler}\n                selected={selectedItem}\n                {...restListProps}\n                ref={setListRef}\n              >\n                {filteredSource.map((value, index) => {\n                  const onMouseDown = (\n                    event: SyntheticEvent<HTMLLIElement>\n                  ) => {\n                    setSelectedItem(event.currentTarget?.dataset.value);\n                    setInputValue(event.currentTarget?.dataset.value);\n                  };\n                  return (\n                    ListItem && (\n                      <ListItem\n                        key={index}\n                        value={value}\n                        matchPattern={inputValue}\n                        onMouseDown={onMouseDown}\n                      />\n                    )\n                  );\n                })}\n              </ListNext>\n            </div>\n          </SaltProvider>\n        </FloatingPortal>\n      )}\n    </>\n  );\n});\n"],"names":["ComboBoxNext","comboBoxNextCss"],"mappings":"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"}

package/dist-es/combo-box-next/useComboBox.js

@@ -1,19 +1,24 @@
-import { useState } from 'react';
+import { useEffect } from 'react';
 import { useList } from '../list-next/useList.js';
 import { useComboboxPortal } from './useComboboxPortal.js';
+import { useControlled } from '@salt-ds/core';
 
 const useComboBox = ({
+  defaultInputValue,
   onFocus,
   onBlur,
   onMouseOver,
   onKeyDown,
+  inputValue: inputValueProp,
   PortalProps,
   listProps
 }) => {
-  const { defaultSelected, ...restListProps } = listProps;
-  const [inputValue, setInputValue] = useState(
-    defaultSelected
-  );
+  const [inputValue, setInputValue] = useControlled({
+    controlled: inputValueProp,
+    default: defaultInputValue,
+    name: "Combo Box",
+    state: "inputValue"
+  });
   const {
     open,
     setOpen,
@@ -32,8 +37,15 @@ const useComboBox = ({
     setHighlightedItem,
     highlightedItem
   } = useList({
-    ...restListProps
+    ...listProps
   });
+  const setSelected = (value) => {
+    setSelectedItem(value);
+    setInputValue(value);
+  };
+  useEffect(() => {
+    setInputValue(selectedItem);
+  }, [selectedItem]);
   const focusHandler = (event) => {
     setOpen(true);
     listFocusHandler(event);
@@ -42,8 +54,7 @@ const useComboBox = ({
   const blurHandler = (event) => {
     setOpen(false);
     if (!selectedItem) {
-      setSelectedItem(void 0);
-      setInputValue(void 0);
+      setSelected(void 0);
       setHighlightedItem(void 0);
     }
     onBlur == null ? void 0 : onBlur(event);
@@ -60,8 +71,7 @@ const useComboBox = ({
         if (altKey) {
           event.preventDefault();
           if (open && !selectedItem) {
-            setSelectedItem(void 0);
-            setInputValue(void 0);
+            setSelected(void 0);
           }
           setOpen(!open);
           break;
@@ -83,8 +93,7 @@ const useComboBox = ({
         if (!open) {
           setOpen(true);
         } else {
-          setSelectedItem(highlightedItem);
-          setInputValue(highlightedItem);
+          setSelected(highlightedItem);
           setOpen(false);
         }
         break;
@@ -92,8 +101,7 @@ const useComboBox = ({
         if (open) {
           setOpen(false);
           if (!selectedItem) {
-            setSelectedItem(void 0);
-            setInputValue(void 0);
+            setSelected(void 0);
           }
         }
         break;
@@ -106,6 +114,8 @@ const useComboBox = ({
     onKeyDown == null ? void 0 : onKeyDown(event);
   };
   return {
+    inputValue,
+    setInputValue,
     portalProps: {
       open,
       setOpen,
@@ -114,8 +124,6 @@ const useComboBox = ({
       getTriggerProps,
       getPortalProps
     },
-    inputValue,
-    setInputValue,
     selectedItem,
     setSelectedItem,
     highlightedItem,

package/dist-es/combo-box-next/useComboBox.js.map

@@ -1 +1 @@
-{"version":3,"file":"useComboBox.js","sources":["../src/combo-box-next/useComboBox.tsx"],"sourcesContent":["import { FocusEvent, KeyboardEvent, SyntheticEvent, useState } from \"react\";\nimport { useList, UseListProps } from \"../list-next/useList\";\nimport { useComboboxPortal, UseComboBoxPortalProps } from \"./useComboboxPortal\";\n\ninterface UseComboBoxProps {\n  onBlur?: (event: FocusEvent<HTMLInputElement>) => void;\n  onFocus?: (event: FocusEvent<HTMLInputElement>) => void;\n  onMouseOver?: (event: SyntheticEvent) => void;\n  onKeyDown?: (event: KeyboardEvent<HTMLInputElement>) => void;\n  PortalProps?: UseComboBoxPortalProps;\n  listProps: UseListProps;\n}\n\nexport const useComboBox = ({\n  onFocus,\n  onBlur,\n  onMouseOver,\n  onKeyDown,\n  PortalProps,\n  listProps,\n}: UseComboBoxProps) => {\n  const { defaultSelected, ...restListProps } = listProps;\n  const [inputValue, setInputValue] = useState<string | undefined>(\n    defaultSelected\n  );\n\n  const {\n    open,\n    setOpen,\n    floating,\n    reference,\n    getPortalProps,\n    getTriggerProps,\n  } = useComboboxPortal(PortalProps);\n\n  const {\n    keyDownHandler: listKeyDownHandler,\n    focusHandler: listFocusHandler,\n    activeDescendant,\n    focusVisibleRef,\n    selectedItem,\n    setSelectedItem,\n    setHighlightedItem,\n    highlightedItem,\n  } = useList({\n    ...restListProps,\n  });\n\n  const focusHandler = (event: FocusEvent<HTMLInputElement>) => {\n    setOpen(true);\n    listFocusHandler(event);\n    onFocus?.(event);\n  };\n\n  const blurHandler = (event: FocusEvent<HTMLInputElement>) => {\n    setOpen(false);\n    if (!selectedItem) {\n      setSelectedItem(undefined);\n      setInputValue(undefined);\n      setHighlightedItem(undefined);\n    }\n    onBlur?.(event);\n  };\n\n  const mouseOverHandler = (event: SyntheticEvent<HTMLElement>) => {\n    setHighlightedItem(event.currentTarget.dataset.value);\n    onMouseOver?.(event);\n  };\n\n  const keyDownHandler = (event: KeyboardEvent<HTMLInputElement>) => {\n    const { key, altKey } = event;\n    switch (key) {\n      case \"ArrowDown\":\n      case \"ArrowUp\":\n        if (altKey) {\n          event.preventDefault();\n          if (open && !selectedItem) {\n            setSelectedItem(undefined);\n            setInputValue(undefined);\n          }\n          setOpen(!open);\n          break;\n        }\n        if (!open) {\n          setOpen(true);\n        }\n        listKeyDownHandler(event);\n        break;\n      case \"PageDown\":\n      case \"PageUp\":\n      case \"Home\":\n      case \"End\":\n        if (open) {\n          listKeyDownHandler(event);\n        }\n        break;\n      case \"Enter\":\n        if (!open) {\n          setOpen(true);\n        } else {\n          setSelectedItem(highlightedItem);\n          setInputValue(highlightedItem);\n          setOpen(false);\n        }\n        break;\n      case \"Escape\":\n        if (open) {\n          setOpen(false);\n          if (!selectedItem) {\n            setSelectedItem(undefined);\n            setInputValue(undefined);\n          }\n        }\n        break;\n      case \"Backspace\":\n        if (!open) {\n          setOpen(true);\n        }\n        break;\n      default:\n        break;\n    }\n    onKeyDown?.(event);\n  };\n\n  return {\n    // portal\n    portalProps: {\n      open,\n      setOpen,\n      floating,\n      reference,\n      getTriggerProps,\n      getPortalProps,\n    },\n    // list\n    inputValue,\n    setInputValue,\n    selectedItem,\n    setSelectedItem,\n    highlightedItem,\n    setHighlightedItem,\n    activeDescendant,\n    focusVisibleRef,\n    keyDownHandler,\n    focusHandler,\n    blurHandler,\n    mouseOverHandler,\n  };\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"useComboBox.js","sources":["../src/combo-box-next/useComboBox.tsx"],"sourcesContent":["import { FocusEvent, KeyboardEvent, SyntheticEvent, useEffect } from \"react\";\nimport { useList, UseListProps } from \"../list-next/useList\";\nimport { useComboboxPortal, UseComboBoxPortalProps } from \"./useComboboxPortal\";\nimport { useControlled } from \"@salt-ds/core\";\n\ninterface UseComboBoxProps {\n  inputValue?: string;\n  defaultInputValue?: string;\n  onBlur?: (event: FocusEvent<HTMLInputElement>) => void;\n  onFocus?: (event: FocusEvent<HTMLInputElement>) => void;\n  onMouseOver?: (event: SyntheticEvent) => void;\n  onKeyDown?: (event: KeyboardEvent<HTMLInputElement>) => void;\n  PortalProps?: UseComboBoxPortalProps;\n  listProps: UseListProps;\n}\n\nexport const useComboBox = ({\n  defaultInputValue,\n  onFocus,\n  onBlur,\n  onMouseOver,\n  onKeyDown,\n  inputValue: inputValueProp,\n  PortalProps,\n  listProps,\n}: UseComboBoxProps) => {\n  const [inputValue, setInputValue] = useControlled({\n    controlled: inputValueProp,\n    default: defaultInputValue,\n    name: \"Combo Box\",\n    state: \"inputValue\",\n  });\n\n  const {\n    open,\n    setOpen,\n    floating,\n    reference,\n    getPortalProps,\n    getTriggerProps,\n  } = useComboboxPortal(PortalProps);\n\n  const {\n    keyDownHandler: listKeyDownHandler,\n    focusHandler: listFocusHandler,\n    activeDescendant,\n    focusVisibleRef,\n    selectedItem,\n    setSelectedItem,\n    setHighlightedItem,\n    highlightedItem,\n  } = useList({\n    ...listProps,\n  });\n\n  const setSelected = (value: string | undefined) => {\n    setSelectedItem(value);\n    setInputValue(value);\n  };\n\n  useEffect(() => {\n    setInputValue(selectedItem);\n  }, [selectedItem]);\n\n  const focusHandler = (event: FocusEvent<HTMLInputElement>) => {\n    setOpen(true);\n    listFocusHandler(event);\n    onFocus?.(event);\n  };\n\n  const blurHandler = (event: FocusEvent<HTMLInputElement>) => {\n    setOpen(false);\n    if (!selectedItem) {\n      setSelected(undefined);\n      setHighlightedItem(undefined);\n    }\n    onBlur?.(event);\n  };\n\n  const mouseOverHandler = (event: SyntheticEvent<HTMLElement>) => {\n    setHighlightedItem(event.currentTarget.dataset.value);\n    onMouseOver?.(event);\n  };\n\n  const keyDownHandler = (event: KeyboardEvent<HTMLInputElement>) => {\n    const { key, altKey } = event;\n    switch (key) {\n      case \"ArrowDown\":\n      case \"ArrowUp\":\n        if (altKey) {\n          event.preventDefault();\n          if (open && !selectedItem) {\n            setSelected(undefined);\n          }\n          setOpen(!open);\n          break;\n        }\n        if (!open) {\n          setOpen(true);\n        }\n        listKeyDownHandler(event);\n        break;\n      case \"PageDown\":\n      case \"PageUp\":\n      case \"Home\":\n      case \"End\":\n        if (open) {\n          listKeyDownHandler(event);\n        }\n        break;\n      case \"Enter\":\n        if (!open) {\n          setOpen(true);\n        } else {\n          setSelected(highlightedItem);\n          setOpen(false);\n        }\n        break;\n      case \"Escape\":\n        if (open) {\n          setOpen(false);\n          if (!selectedItem) {\n            setSelected(undefined);\n          }\n        }\n        break;\n      case \"Backspace\":\n        if (!open) {\n          setOpen(true);\n        }\n        break;\n      default:\n        break;\n    }\n    onKeyDown?.(event);\n  };\n\n  return {\n    inputValue,\n    setInputValue,\n    // portal\n    portalProps: {\n      open,\n      setOpen,\n      floating,\n      reference,\n      getTriggerProps,\n      getPortalProps,\n    },\n    // list\n    selectedItem,\n    setSelectedItem,\n    highlightedItem,\n    setHighlightedItem,\n    activeDescendant,\n    focusVisibleRef,\n    keyDownHandler,\n    focusHandler,\n    blurHandler,\n    mouseOverHandler,\n  };\n};\n"],"names":[],"mappings":";;;;;AAgBO,MAAM,cAAc,CAAC;AAAA,EAC1B,iBAAA;AAAA,EACA,OAAA;AAAA,EACA,MAAA;AAAA,EACA,WAAA;AAAA,EACA,SAAA;AAAA,EACA,UAAY,EAAA,cAAA;AAAA,EACZ,WAAA;AAAA,EACA,SAAA;AACF,CAAwB,KAAA;AACtB,EAAA,MAAM,CAAC,UAAA,EAAY,aAAa,CAAA,GAAI,aAAc,CAAA;AAAA,IAChD,UAAY,EAAA,cAAA;AAAA,IACZ,OAAS,EAAA,iBAAA;AAAA,IACT,IAAM,EAAA,WAAA;AAAA,IACN,KAAO,EAAA,YAAA;AAAA,GACR,CAAA,CAAA;AAED,EAAM,MAAA;AAAA,IACJ,IAAA;AAAA,IACA,OAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA;AAAA,IACA,cAAA;AAAA,IACA,eAAA;AAAA,GACF,GAAI,kBAAkB,WAAW,CAAA,CAAA;AAEjC,EAAM,MAAA;AAAA,IACJ,cAAgB,EAAA,kBAAA;AAAA,IAChB,YAAc,EAAA,gBAAA;AAAA,IACd,gBAAA;AAAA,IACA,eAAA;AAAA,IACA,YAAA;AAAA,IACA,eAAA;AAAA,IACA,kBAAA;AAAA,IACA,eAAA;AAAA,MACE,OAAQ,CAAA;AAAA,IACV,GAAG,SAAA;AAAA,GACJ,CAAA,CAAA;AAED,EAAM,MAAA,WAAA,GAAc,CAAC,KAA8B,KAAA;AACjD,IAAA,eAAA,CAAgB,KAAK,CAAA,CAAA;AACrB,IAAA,aAAA,CAAc,KAAK,CAAA,CAAA;AAAA,GACrB,CAAA;AAEA,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,aAAA,CAAc,YAAY,CAAA,CAAA;AAAA,GAC5B,EAAG,CAAC,YAAY,CAAC,CAAA,CAAA;AAEjB,EAAM,MAAA,YAAA,GAAe,CAAC,KAAwC,KAAA;AAC5D,IAAA,OAAA,CAAQ,IAAI,CAAA,CAAA;AACZ,IAAA,gBAAA,CAAiB,KAAK,CAAA,CAAA;AACtB,IAAU,OAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,OAAA,CAAA,KAAA,CAAA,CAAA;AAAA,GACZ,CAAA;AAEA,EAAM,MAAA,WAAA,GAAc,CAAC,KAAwC,KAAA;AAC3D,IAAA,OAAA,CAAQ,KAAK,CAAA,CAAA;AACb,IAAA,IAAI,CAAC,YAAc,EAAA;AACjB,MAAA,WAAA,CAAY,KAAS,CAAA,CAAA,CAAA;AACrB,MAAA,kBAAA,CAAmB,KAAS,CAAA,CAAA,CAAA;AAAA,KAC9B;AACA,IAAS,MAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,MAAA,CAAA,KAAA,CAAA,CAAA;AAAA,GACX,CAAA;AAEA,EAAM,MAAA,gBAAA,GAAmB,CAAC,KAAuC,KAAA;AAC/D,IAAmB,kBAAA,CAAA,KAAA,CAAM,aAAc,CAAA,OAAA,CAAQ,KAAK,CAAA,CAAA;AACpD,IAAc,WAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,WAAA,CAAA,KAAA,CAAA,CAAA;AAAA,GAChB,CAAA;AAEA,EAAM,MAAA,cAAA,GAAiB,CAAC,KAA2C,KAAA;AACjE,IAAM,MAAA,EAAE,GAAK,EAAA,MAAA,EAAW,GAAA,KAAA,CAAA;AACxB,IAAQ,QAAA,GAAA;AAAA,MACD,KAAA,WAAA,CAAA;AAAA,MACA,KAAA,SAAA;AACH,QAAA,IAAI,MAAQ,EAAA;AACV,UAAA,KAAA,CAAM,cAAe,EAAA,CAAA;AACrB,UAAI,IAAA,IAAA,IAAQ,CAAC,YAAc,EAAA;AACzB,YAAA,WAAA,CAAY,KAAS,CAAA,CAAA,CAAA;AAAA,WACvB;AACA,UAAA,OAAA,CAAQ,CAAC,IAAI,CAAA,CAAA;AACb,UAAA,MAAA;AAAA,SACF;AACA,QAAA,IAAI,CAAC,IAAM,EAAA;AACT,UAAA,OAAA,CAAQ,IAAI,CAAA,CAAA;AAAA,SACd;AACA,QAAA,kBAAA,CAAmB,KAAK,CAAA,CAAA;AACxB,QAAA,MAAA;AAAA,MACG,KAAA,UAAA,CAAA;AAAA,MACA,KAAA,QAAA,CAAA;AAAA,MACA,KAAA,MAAA,CAAA;AAAA,MACA,KAAA,KAAA;AACH,QAAA,IAAI,IAAM,EAAA;AACR,UAAA,kBAAA,CAAmB,KAAK,CAAA,CAAA;AAAA,SAC1B;AACA,QAAA,MAAA;AAAA,MACG,KAAA,OAAA;AACH,QAAA,IAAI,CAAC,IAAM,EAAA;AACT,UAAA,OAAA,CAAQ,IAAI,CAAA,CAAA;AAAA,SACP,MAAA;AACL,UAAA,WAAA,CAAY,eAAe,CAAA,CAAA;AAC3B,UAAA,OAAA,CAAQ,KAAK,CAAA,CAAA;AAAA,SACf;AACA,QAAA,MAAA;AAAA,MACG,KAAA,QAAA;AACH,QAAA,IAAI,IAAM,EAAA;AACR,UAAA,OAAA,CAAQ,KAAK,CAAA,CAAA;AACb,UAAA,IAAI,CAAC,YAAc,EAAA;AACjB,YAAA,WAAA,CAAY,KAAS,CAAA,CAAA,CAAA;AAAA,WACvB;AAAA,SACF;AACA,QAAA,MAAA;AAAA,MACG,KAAA,WAAA;AACH,QAAA,IAAI,CAAC,IAAM,EAAA;AACT,UAAA,OAAA,CAAQ,IAAI,CAAA,CAAA;AAAA,SACd;AACA,QAAA,MAAA;AAEA,KAAA;AAEJ,IAAY,SAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,SAAA,CAAA,KAAA,CAAA,CAAA;AAAA,GACd,CAAA;AAEA,EAAO,OAAA;AAAA,IACL,UAAA;AAAA,IACA,aAAA;AAAA,IAEA,WAAa,EAAA;AAAA,MACX,IAAA;AAAA,MACA,OAAA;AAAA,MACA,QAAA;AAAA,MACA,SAAA;AAAA,MACA,eAAA;AAAA,MACA,cAAA;AAAA,KACF;AAAA,IAEA,YAAA;AAAA,IACA,eAAA;AAAA,IACA,eAAA;AAAA,IACA,kBAAA;AAAA,IACA,gBAAA;AAAA,IACA,eAAA;AAAA,IACA,cAAA;AAAA,IACA,YAAA;AAAA,IACA,WAAA;AAAA,IACA,gBAAA;AAAA,GACF,CAAA;AACF;;;;"}

package/dist-es/combo-box-next/utils.js

@@ -4,7 +4,7 @@ import { ListItemNext } from '../list-next/ListItemNext.js';
 import { Highlighter } from '../list/Highlighter.js';
 import '../list/ListItem.js';
 import '../list/List.js';
-import 'react';
+import { forwardRef } from 'react';
 import '@salt-ds/core';
 import '../common-hooks/collectionProvider.js';
 import '../common-hooks/keyUtils.js';
@@ -14,12 +14,12 @@ import '../list/VirtualizedList.js';
 const defaultFilter = (source, filterValue) => source.filter(
   (item) => !filterValue ? item : item.toLowerCase().includes(filterValue.toLowerCase())
 );
-const DefaultListItem = ({
+const DefaultListItem = forwardRef(function DefaultListItem2({
   value,
   matchPattern,
   onMouseDown,
   ...rest
-}) => {
+}) {
   return /* @__PURE__ */ jsx(ListItemNext, {
     value,
     onMouseDown,
@@ -29,7 +29,7 @@ const DefaultListItem = ({
       text: value
     })
   });
-};
+});
 
 export { DefaultListItem, defaultFilter };
 //# sourceMappingURL=utils.js.map

package/dist-es/combo-box-next/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","sources":["../src/combo-box-next/utils.tsx"],"sourcesContent":["import { ListItemNext, ListItemNextProps } from \"../list-next\";\nimport { Highlighter } from \"../list\";\n\nexport const defaultFilter = (source: string[], filterValue?: string) =>\n  source.filter((item: string) =>\n    !filterValue ? item : item.toLowerCase().includes(filterValue.toLowerCase())\n  );\n\nexport interface ComboBoxItemProps<T> extends Omit<ListItemNextProps, \"value\"> {\n  value: T;\n  matchPattern?: RegExp | string;\n}\n\nexport const DefaultListItem = ({\n  value,\n  matchPattern,\n  onMouseDown,\n  ...rest\n}: ComboBoxItemProps<string>) => {\n  return (\n    <ListItemNext value={value} onMouseDown={onMouseDown} {...rest}>\n      <Highlighter matchPattern={matchPattern} text={value} />\n    </ListItemNext>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;AAGO,MAAM,aAAgB,GAAA,CAAC,MAAkB,EAAA,WAAA,KAC9C,MAAO,CAAA,MAAA;AAAA,EAAO,CAAC,IACb,KAAA,CAAC,WAAc,GAAA,IAAA,GAAO,IAAK,CAAA,WAAA,EAAc,CAAA,QAAA,CAAS,WAAY,CAAA,WAAA,EAAa,CAAA;AAC7E,EAAA;AAOK,MAAM,kBAAkB,CAAC;AAAA,EAC9B,KAAA;AAAA,EACA,YAAA;AAAA,EACA,WAAA;AAAA,EACG,GAAA,IAAA;AACL,CAAiC,KAAA;AAC/B,EAAA,uBACG,GAAA,CAAA,YAAA,EAAA;AAAA,IAAa,KAAA;AAAA,IAAc,WAAA;AAAA,IAA2B,GAAG,IAAA;AAAA,IACxD,QAAC,kBAAA,GAAA,CAAA,WAAA,EAAA;AAAA,MAAY,YAAA;AAAA,MAA4B,IAAM,EAAA,KAAA;AAAA,KAAO,CAAA;AAAA,GACxD,CAAA,CAAA;AAEJ;;;;"}
+{"version":3,"file":"utils.js","sources":["../src/combo-box-next/utils.tsx"],"sourcesContent":["import { ListItemNext, ListItemNextProps } from \"../list-next\";\nimport { Highlighter } from \"../list\";\nimport { forwardRef } from \"react\";\n\nexport const defaultFilter = (source: string[], filterValue?: string) =>\n  source.filter((item: string) =>\n    !filterValue ? item : item.toLowerCase().includes(filterValue.toLowerCase())\n  );\n\nexport interface ComboBoxItemProps<T> extends Omit<ListItemNextProps, \"value\"> {\n  value: T;\n  matchPattern?: RegExp | string;\n}\nexport const DefaultListItem = forwardRef(function DefaultListItem({\n  value,\n  matchPattern,\n  onMouseDown,\n  ...rest\n}: ComboBoxItemProps<string>) {\n  return (\n    <ListItemNext value={value} onMouseDown={onMouseDown} {...rest}>\n      <Highlighter matchPattern={matchPattern} text={value} />\n    </ListItemNext>\n  );\n});\n"],"names":["DefaultListItem"],"mappings":";;;;;;;;;;;;;AAIO,MAAM,aAAgB,GAAA,CAAC,MAAkB,EAAA,WAAA,KAC9C,MAAO,CAAA,MAAA;AAAA,EAAO,CAAC,IACb,KAAA,CAAC,WAAc,GAAA,IAAA,GAAO,IAAK,CAAA,WAAA,EAAc,CAAA,QAAA,CAAS,WAAY,CAAA,WAAA,EAAa,CAAA;AAC7E,EAAA;AAMW,MAAA,eAAA,GAAkB,UAAW,CAAA,SAASA,gBAAgB,CAAA;AAAA,EACjE,KAAA;AAAA,EACA,YAAA;AAAA,EACA,WAAA;AAAA,EACG,GAAA,IAAA;AACL,CAA8B,EAAA;AAC5B,EAAA,uBACG,GAAA,CAAA,YAAA,EAAA;AAAA,IAAa,KAAA;AAAA,IAAc,WAAA;AAAA,IAA2B,GAAG,IAAA;AAAA,IACxD,QAAC,kBAAA,GAAA,CAAA,WAAA,EAAA;AAAA,MAAY,YAAA;AAAA,MAA4B,IAAM,EAAA,KAAA;AAAA,KAAO,CAAA;AAAA,GACxD,CAAA,CAAA;AAEJ,CAAC;;;;"}

package/dist-es/dialog/Dialog.js

@@ -2,7 +2,7 @@ import { jsx } from 'react/jsx-runtime';
 import { forwardRef, useState, useEffect, useMemo } from 'react';
 import { clsx } from 'clsx';
 import { FloatingPortal, FloatingOverlay, FloatingFocusManager } from '@floating-ui/react';
-import { makePrefixer, useId, useForkRef } from '@salt-ds/core';
+import { makePrefixer, useId, useForkRef, SaltProvider } from '@salt-ds/core';
 import { useWindow } from '@salt-ds/window';
 import { useComponentCssInjection } from '@salt-ds/styles';
 import { useDialog } from './useDialog.js';
@@ -43,39 +43,41 @@ const Dialog = forwardRef(function Dialog2(props, ref) {
     [dialogId, status]
   );
   return /* @__PURE__ */ jsx(FloatingPortal, {
-    children: showComponent && /* @__PURE__ */ jsx(FloatingOverlay, {
-      className: withBaseName("overlay"),
-      lockScroll: true,
-      children: /* @__PURE__ */ jsx(FloatingFocusManager, {
-        context,
-        modal: true,
-        initialFocus,
-        children: /* @__PURE__ */ jsx(DialogContext.Provider, {
-          value: contextValue,
-          children: /* @__PURE__ */ jsx("div", {
-            id: dialogId,
-            className: clsx(
-              withBaseName(),
-              {
-                [withBaseName("enterAnimation")]: open,
-                [withBaseName("exitAnimation")]: !open,
-                [withBaseName("withStatus")]: status,
-                [withBaseName(status)]: status
+    children: /* @__PURE__ */ jsx(SaltProvider, {
+      children: showComponent && /* @__PURE__ */ jsx(FloatingOverlay, {
+        className: withBaseName("overlay"),
+        lockScroll: true,
+        children: /* @__PURE__ */ jsx(FloatingFocusManager, {
+          context,
+          modal: true,
+          initialFocus,
+          children: /* @__PURE__ */ jsx(DialogContext.Provider, {
+            value: contextValue,
+            children: /* @__PURE__ */ jsx("div", {
+              id: dialogId,
+              className: clsx(
+                withBaseName(),
+                {
+                  [withBaseName("enterAnimation")]: open,
+                  [withBaseName("exitAnimation")]: !open,
+                  [withBaseName("withStatus")]: status,
+                  [withBaseName(status)]: status
+                },
+                className
+              ),
+              onAnimationEnd: () => {
+                if (!open && showComponent) {
+                  setShowComponent(false);
+                }
               },
-              className
-            ),
-            onAnimationEnd: () => {
-              if (!open && showComponent) {
-                setShowComponent(false);
-              }
-            },
-            ref: floatingRef,
-            "aria-labelledby": `${dialogId}-heading`,
-            "aria-describedby": `${dialogId}-description`,
-            "aria-modal": "true",
-            ...getFloatingProps(),
-            ...rest,
-            children
+              ref: floatingRef,
+              "aria-labelledby": `${dialogId}-heading`,
+              "aria-describedby": `${dialogId}-description`,
+              "aria-modal": "true",
+              ...getFloatingProps(),
+              ...rest,
+              children
+            })
           })
         })
       })

package/dist-es/dialog/Dialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"Dialog.js","sources":["../src/dialog/Dialog.tsx"],"sourcesContent":["import {\n  forwardRef,\n  HTMLAttributes,\n  useEffect,\n  useMemo,\n  useState,\n  ComponentProps,\n} from \"react\";\nimport { clsx } from \"clsx\";\nimport {\n  FloatingFocusManager,\n  FloatingOverlay,\n  FloatingPortal,\n} from \"@floating-ui/react\";\nimport {\n  makePrefixer,\n  useForkRef,\n  useId,\n  ValidationStatus,\n} from \"@salt-ds/core\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport { useDialog } from \"./useDialog\";\nimport dialogCss from \"./Dialog.css\";\nimport { DialogContext } from \"./DialogContext\";\n\nexport interface DialogProps extends HTMLAttributes<HTMLDivElement> {\n  /**\n   * Display or hide the component.\n   */\n  open?: boolean;\n  /**\n   * Callback function triggered when open state changes.\n   */\n  onOpenChange?: (open: boolean) => void;\n  /**\n   * Status indicator\n   * */\n  status?: ValidationStatus;\n  /**\n   * Which element to initially focus. Can be either a number (tabbable index as specified by the order) or a ref.\n   * Default value is 0 (first tabbable element).\n   * */\n  initialFocus?: ComponentProps<typeof FloatingFocusManager>[\"initialFocus\"];\n}\n\nconst withBaseName = makePrefixer(\"saltDialog\");\n\nexport const Dialog = forwardRef<HTMLDivElement, DialogProps>(function Dialog(\n  props,\n  ref\n) {\n  const {\n    children,\n    className,\n    open = true,\n    onOpenChange,\n    status,\n    initialFocus,\n    ...rest\n  } = props;\n  const dialogId = useId() || \"dialog\";\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-dialog\",\n    css: dialogCss,\n    window: targetWindow,\n  });\n\n  const [showComponent, setShowComponent] = useState(false);\n\n  const { floating, context, getFloatingProps } = useDialog({\n    open,\n    onOpenChange,\n  });\n\n  const floatingRef = useForkRef<HTMLDivElement>(floating, ref);\n\n  useEffect(() => {\n    if (open && !showComponent) {\n      setShowComponent(true);\n    }\n  }, [open, showComponent]);\n\n  const contextValue = useMemo(\n    () => ({ dialogId, status }),\n    [dialogId, status]\n  );\n\n  return (\n    <FloatingPortal>\n      {showComponent && (\n        <FloatingOverlay className={withBaseName(\"overlay\")} lockScroll>\n          <FloatingFocusManager\n            context={context}\n            modal\n            initialFocus={initialFocus}\n          >\n            <DialogContext.Provider value={contextValue}>\n              <div\n                id={dialogId}\n                className={clsx(\n                  withBaseName(),\n                  {\n                    [withBaseName(\"enterAnimation\")]: open,\n                    [withBaseName(\"exitAnimation\")]: !open,\n                    [withBaseName(\"withStatus\")]: status,\n                    [withBaseName(status as string)]: status,\n                  },\n                  className\n                )}\n                onAnimationEnd={() => {\n                  if (!open && showComponent) {\n                    setShowComponent(false);\n                  }\n                }}\n                ref={floatingRef}\n                aria-labelledby={`${dialogId}-heading`}\n                aria-describedby={`${dialogId}-description`}\n                aria-modal=\"true\"\n                {...getFloatingProps()}\n                {...rest}\n              >\n                {children}\n              </div>\n            </DialogContext.Provider>\n          </FloatingFocusManager>\n        </FloatingOverlay>\n      )}\n    </FloatingPortal>\n  );\n});\n"],"names":["Dialog","dialogCss"],"mappings":"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"}
+{"version":3,"file":"Dialog.js","sources":["../src/dialog/Dialog.tsx"],"sourcesContent":["import {\n  forwardRef,\n  HTMLAttributes,\n  useEffect,\n  useMemo,\n  useState,\n  ComponentProps,\n} from \"react\";\nimport { clsx } from \"clsx\";\nimport {\n  FloatingFocusManager,\n  FloatingOverlay,\n  FloatingPortal,\n} from \"@floating-ui/react\";\nimport {\n  makePrefixer,\n  SaltProvider,\n  useForkRef,\n  useId,\n  ValidationStatus,\n} from \"@salt-ds/core\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport { useDialog } from \"./useDialog\";\nimport dialogCss from \"./Dialog.css\";\nimport { DialogContext } from \"./DialogContext\";\n\nexport interface DialogProps extends HTMLAttributes<HTMLDivElement> {\n  /**\n   * Display or hide the component.\n   */\n  open?: boolean;\n  /**\n   * Callback function triggered when open state changes.\n   */\n  onOpenChange?: (open: boolean) => void;\n  /**\n   * Status indicator\n   * */\n  status?: ValidationStatus;\n  /**\n   * Which element to initially focus. Can be either a number (tabbable index as specified by the order) or a ref.\n   * Default value is 0 (first tabbable element).\n   * */\n  initialFocus?: ComponentProps<typeof FloatingFocusManager>[\"initialFocus\"];\n}\n\nconst withBaseName = makePrefixer(\"saltDialog\");\n\nexport const Dialog = forwardRef<HTMLDivElement, DialogProps>(function Dialog(\n  props,\n  ref\n) {\n  const {\n    children,\n    className,\n    open = true,\n    onOpenChange,\n    status,\n    initialFocus,\n    ...rest\n  } = props;\n  const dialogId = useId() || \"dialog\";\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-dialog\",\n    css: dialogCss,\n    window: targetWindow,\n  });\n\n  const [showComponent, setShowComponent] = useState(false);\n\n  const { floating, context, getFloatingProps } = useDialog({\n    open,\n    onOpenChange,\n  });\n\n  const floatingRef = useForkRef<HTMLDivElement>(floating, ref);\n\n  useEffect(() => {\n    if (open && !showComponent) {\n      setShowComponent(true);\n    }\n  }, [open, showComponent]);\n\n  const contextValue = useMemo(\n    () => ({ dialogId, status }),\n    [dialogId, status]\n  );\n\n  return (\n    <FloatingPortal>\n      {/* The provider is needed to support the use case where an app has nested modes. The element that is portalled needs to have the same style as the current scope */}\n      <SaltProvider>\n        {showComponent && (\n          <FloatingOverlay className={withBaseName(\"overlay\")} lockScroll>\n            <FloatingFocusManager\n              context={context}\n              modal\n              initialFocus={initialFocus}\n            >\n              <DialogContext.Provider value={contextValue}>\n                <div\n                  id={dialogId}\n                  className={clsx(\n                    withBaseName(),\n                    {\n                      [withBaseName(\"enterAnimation\")]: open,\n                      [withBaseName(\"exitAnimation\")]: !open,\n                      [withBaseName(\"withStatus\")]: status,\n                      [withBaseName(status as string)]: status,\n                    },\n                    className\n                  )}\n                  onAnimationEnd={() => {\n                    if (!open && showComponent) {\n                      setShowComponent(false);\n                    }\n                  }}\n                  ref={floatingRef}\n                  aria-labelledby={`${dialogId}-heading`}\n                  aria-describedby={`${dialogId}-description`}\n                  aria-modal=\"true\"\n                  {...getFloatingProps()}\n                  {...rest}\n                >\n                  {children}\n                </div>\n              </DialogContext.Provider>\n            </FloatingFocusManager>\n          </FloatingOverlay>\n        )}\n      </SaltProvider>\n    </FloatingPortal>\n  );\n});\n"],"names":["Dialog","dialogCss"],"mappings":"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"}

package/dist-es/dialog/DialogContent.css.js

@@ -1,4 +1,4 @@
-var css_248z = ".saltDialogContent {\n  color: var(--salt-text-primary-foreground);\n  padding-inline: var(--salt-spacing-300);\n  flex: 1 1 auto;\n  min-height: var(--salt-text-lineHeight);\n  font-size: var(--salt-text-fontSize);\n  line-height: var(--salt-text-lineHeight);\n  overflow-y: auto;\n}\n";
+var css_248z = ".saltDialogContent {\n  color: var(--salt-text-primary-foreground);\n  padding-left: var(--salt-spacing-300);\n  padding-right: var(--salt-spacing-300);\n  flex: 1 1 auto;\n  min-height: var(--salt-text-lineHeight);\n  font-size: var(--salt-text-fontSize);\n  line-height: var(--salt-text-lineHeight);\n  overflow-y: auto;\n}\n";
 
 export { css_248z as default };
 //# sourceMappingURL=DialogContent.css.js.map