@salt-ds/lab 1.0.0-alpha.52 → 1.0.0-alpha.54

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (223) hide show
  1. package/css/salt-lab.css +280 -38
  2. package/dist-cjs/breadcrumbs/internal/BreadcrumbsCollapsed.js +3 -2
  3. package/dist-cjs/breadcrumbs/internal/BreadcrumbsCollapsed.js.map +1 -1
  4. package/dist-cjs/calendar/Calendar.js +55 -26
  5. package/dist-cjs/calendar/Calendar.js.map +1 -1
  6. package/dist-cjs/calendar/CalendarDateGrid.css.js +6 -0
  7. package/dist-cjs/calendar/CalendarDateGrid.css.js.map +1 -0
  8. package/dist-cjs/calendar/{internal/CalendarCarousel.js → CalendarDateGrid.js} +37 -14
  9. package/dist-cjs/calendar/CalendarDateGrid.js.map +1 -0
  10. package/dist-cjs/calendar/CalendarNavigation.js +7 -5
  11. package/dist-cjs/calendar/CalendarNavigation.js.map +1 -1
  12. package/dist-cjs/calendar/{internal/CalendarWeekHeader.js → CalendarWeekHeader.js} +4 -3
  13. package/dist-cjs/calendar/CalendarWeekHeader.js.map +1 -0
  14. package/dist-cjs/calendar/internal/CalendarDay.css.js +1 -1
  15. package/dist-cjs/calendar/internal/CalendarMonth.js.map +1 -1
  16. package/dist-cjs/calendar/useCalendar.js +2 -4
  17. package/dist-cjs/calendar/useCalendar.js.map +1 -1
  18. package/dist-cjs/calendar/useCalendarSelection.js +16 -43
  19. package/dist-cjs/calendar/useCalendarSelection.js.map +1 -1
  20. package/dist-cjs/carousel/Carousel.js +5 -5
  21. package/dist-cjs/carousel/Carousel.js.map +1 -1
  22. package/dist-cjs/cascading-menu/CascadingMenuItem.js +2 -2
  23. package/dist-cjs/cascading-menu/CascadingMenuItem.js.map +1 -1
  24. package/dist-cjs/contact-details/ContactMetadata.js +2 -2
  25. package/dist-cjs/contact-details/ContactMetadata.js.map +1 -1
  26. package/dist-cjs/date-input/DateInputRange.js +2 -0
  27. package/dist-cjs/date-input/DateInputRange.js.map +1 -1
  28. package/dist-cjs/date-input/DateInputSingle.js +2 -0
  29. package/dist-cjs/date-input/DateInputSingle.js.map +1 -1
  30. package/dist-cjs/date-picker/DatePicker.js +40 -5
  31. package/dist-cjs/date-picker/DatePicker.js.map +1 -1
  32. package/dist-cjs/date-picker/DatePickerActions.js +7 -3
  33. package/dist-cjs/date-picker/DatePickerActions.js.map +1 -1
  34. package/dist-cjs/date-picker/DatePickerRangeInput.js +5 -4
  35. package/dist-cjs/date-picker/DatePickerRangeInput.js.map +1 -1
  36. package/dist-cjs/date-picker/DatePickerRangePanel.js +33 -9
  37. package/dist-cjs/date-picker/DatePickerRangePanel.js.map +1 -1
  38. package/dist-cjs/date-picker/DatePickerSingleInput.js +5 -4
  39. package/dist-cjs/date-picker/DatePickerSingleInput.js.map +1 -1
  40. package/dist-cjs/date-picker/DatePickerSinglePanel.js +19 -5
  41. package/dist-cjs/date-picker/DatePickerSinglePanel.js.map +1 -1
  42. package/dist-cjs/date-picker/useDatePicker.js +91 -63
  43. package/dist-cjs/date-picker/useDatePicker.js.map +1 -1
  44. package/dist-cjs/dropdown/DropdownButton.js +4 -2
  45. package/dist-cjs/dropdown/DropdownButton.js.map +1 -1
  46. package/dist-cjs/index.js +10 -0
  47. package/dist-cjs/index.js.map +1 -1
  48. package/dist-cjs/menu-button/MenuButtonTrigger.js +2 -2
  49. package/dist-cjs/menu-button/MenuButtonTrigger.js.map +1 -1
  50. package/dist-cjs/query-input/internal/CategoryListItem.js +2 -2
  51. package/dist-cjs/query-input/internal/CategoryListItem.js.map +1 -1
  52. package/dist-cjs/query-input/internal/ValueList.js +2 -2
  53. package/dist-cjs/query-input/internal/ValueList.js.map +1 -1
  54. package/dist-cjs/search-input/SearchInput.js +2 -1
  55. package/dist-cjs/search-input/SearchInput.js.map +1 -1
  56. package/dist-cjs/static-list/StaticList.css.js +6 -0
  57. package/dist-cjs/static-list/StaticList.css.js.map +1 -0
  58. package/dist-cjs/static-list/StaticList.js +32 -0
  59. package/dist-cjs/static-list/StaticList.js.map +1 -0
  60. package/dist-cjs/static-list/StaticListItem.css.js +6 -0
  61. package/dist-cjs/static-list/StaticListItem.css.js.map +1 -0
  62. package/dist-cjs/static-list/StaticListItem.js +33 -0
  63. package/dist-cjs/static-list/StaticListItem.js.map +1 -0
  64. package/dist-cjs/static-list/StaticListItemContent.css.js +6 -0
  65. package/dist-cjs/static-list/StaticListItemContent.css.js.map +1 -0
  66. package/dist-cjs/static-list/StaticListItemContent.js +30 -0
  67. package/dist-cjs/static-list/StaticListItemContent.js.map +1 -0
  68. package/dist-cjs/stepped-tracker/TrackerStep/TrackerStep.js +8 -8
  69. package/dist-cjs/stepped-tracker/TrackerStep/TrackerStep.js.map +1 -1
  70. package/dist-cjs/stepper-input/StepperInput.css.js +1 -1
  71. package/dist-cjs/stepper-input/StepperInput.js +214 -29
  72. package/dist-cjs/stepper-input/StepperInput.js.map +1 -1
  73. package/dist-cjs/stepper-input/internal/useActivateWhileMouseDown.js +54 -0
  74. package/dist-cjs/stepper-input/internal/useActivateWhileMouseDown.js.map +1 -0
  75. package/dist-cjs/stepper-input/internal/utils.js +43 -0
  76. package/dist-cjs/stepper-input/internal/utils.js.map +1 -0
  77. package/dist-cjs/stepper-input/useStepperInput.js +88 -172
  78. package/dist-cjs/stepper-input/useStepperInput.js.map +1 -1
  79. package/dist-cjs/tabs/Tab.js +14 -12
  80. package/dist-cjs/tabs/Tab.js.map +1 -1
  81. package/dist-cjs/tabs/Tabstrip.js +2 -1
  82. package/dist-cjs/tabs/Tabstrip.js.map +1 -1
  83. package/dist-cjs/tabs-next/OverflowMenu.js +2 -2
  84. package/dist-cjs/tabs-next/OverflowMenu.js.map +1 -1
  85. package/dist-cjs/tokenized-input/TokenizedInputBase.js +3 -3
  86. package/dist-cjs/tokenized-input/TokenizedInputBase.js.map +1 -1
  87. package/dist-cjs/tokenized-input/internal/InputPill.js +2 -2
  88. package/dist-cjs/tokenized-input/internal/InputPill.js.map +1 -1
  89. package/dist-cjs/tokenized-input-next/TokenizedInputNext.js +3 -3
  90. package/dist-cjs/tokenized-input-next/TokenizedInputNext.js.map +1 -1
  91. package/dist-cjs/tokenized-input-next/internal/InputPill.js +2 -2
  92. package/dist-cjs/tokenized-input-next/internal/InputPill.js.map +1 -1
  93. package/dist-cjs/toolbar/overflow-panel/OverflowPanel.js +2 -2
  94. package/dist-cjs/toolbar/overflow-panel/OverflowPanel.js.map +1 -1
  95. package/dist-es/breadcrumbs/internal/BreadcrumbsCollapsed.js +3 -2
  96. package/dist-es/breadcrumbs/internal/BreadcrumbsCollapsed.js.map +1 -1
  97. package/dist-es/calendar/Calendar.js +57 -28
  98. package/dist-es/calendar/Calendar.js.map +1 -1
  99. package/dist-es/calendar/CalendarDateGrid.css.js +4 -0
  100. package/dist-es/calendar/CalendarDateGrid.css.js.map +1 -0
  101. package/dist-es/calendar/{internal/CalendarCarousel.js → CalendarDateGrid.js} +37 -14
  102. package/dist-es/calendar/CalendarDateGrid.js.map +1 -0
  103. package/dist-es/calendar/CalendarNavigation.js +8 -6
  104. package/dist-es/calendar/CalendarNavigation.js.map +1 -1
  105. package/dist-es/calendar/{internal/CalendarWeekHeader.js → CalendarWeekHeader.js} +4 -3
  106. package/dist-es/calendar/CalendarWeekHeader.js.map +1 -0
  107. package/dist-es/calendar/internal/CalendarDay.css.js +1 -1
  108. package/dist-es/calendar/internal/CalendarMonth.js.map +1 -1
  109. package/dist-es/calendar/useCalendar.js +2 -4
  110. package/dist-es/calendar/useCalendar.js.map +1 -1
  111. package/dist-es/calendar/useCalendarSelection.js +16 -43
  112. package/dist-es/calendar/useCalendarSelection.js.map +1 -1
  113. package/dist-es/carousel/Carousel.js +6 -6
  114. package/dist-es/carousel/Carousel.js.map +1 -1
  115. package/dist-es/cascading-menu/CascadingMenuItem.js +3 -3
  116. package/dist-es/cascading-menu/CascadingMenuItem.js.map +1 -1
  117. package/dist-es/contact-details/ContactMetadata.js +3 -3
  118. package/dist-es/contact-details/ContactMetadata.js.map +1 -1
  119. package/dist-es/date-input/DateInputRange.js +2 -0
  120. package/dist-es/date-input/DateInputRange.js.map +1 -1
  121. package/dist-es/date-input/DateInputSingle.js +2 -0
  122. package/dist-es/date-input/DateInputSingle.js.map +1 -1
  123. package/dist-es/date-picker/DatePicker.js +40 -5
  124. package/dist-es/date-picker/DatePicker.js.map +1 -1
  125. package/dist-es/date-picker/DatePickerActions.js +7 -3
  126. package/dist-es/date-picker/DatePickerActions.js.map +1 -1
  127. package/dist-es/date-picker/DatePickerRangeInput.js +5 -4
  128. package/dist-es/date-picker/DatePickerRangeInput.js.map +1 -1
  129. package/dist-es/date-picker/DatePickerRangePanel.js +33 -9
  130. package/dist-es/date-picker/DatePickerRangePanel.js.map +1 -1
  131. package/dist-es/date-picker/DatePickerSingleInput.js +5 -4
  132. package/dist-es/date-picker/DatePickerSingleInput.js.map +1 -1
  133. package/dist-es/date-picker/DatePickerSinglePanel.js +19 -5
  134. package/dist-es/date-picker/DatePickerSinglePanel.js.map +1 -1
  135. package/dist-es/date-picker/useDatePicker.js +92 -64
  136. package/dist-es/date-picker/useDatePicker.js.map +1 -1
  137. package/dist-es/dropdown/DropdownButton.js +6 -4
  138. package/dist-es/dropdown/DropdownButton.js.map +1 -1
  139. package/dist-es/index.js +5 -0
  140. package/dist-es/index.js.map +1 -1
  141. package/dist-es/menu-button/MenuButtonTrigger.js +3 -3
  142. package/dist-es/menu-button/MenuButtonTrigger.js.map +1 -1
  143. package/dist-es/query-input/internal/CategoryListItem.js +3 -3
  144. package/dist-es/query-input/internal/CategoryListItem.js.map +1 -1
  145. package/dist-es/query-input/internal/ValueList.js +3 -3
  146. package/dist-es/query-input/internal/ValueList.js.map +1 -1
  147. package/dist-es/search-input/SearchInput.js +3 -2
  148. package/dist-es/search-input/SearchInput.js.map +1 -1
  149. package/dist-es/static-list/StaticList.css.js +4 -0
  150. package/dist-es/static-list/StaticList.css.js.map +1 -0
  151. package/dist-es/static-list/StaticList.js +28 -0
  152. package/dist-es/static-list/StaticList.js.map +1 -0
  153. package/dist-es/static-list/StaticListItem.css.js +4 -0
  154. package/dist-es/static-list/StaticListItem.css.js.map +1 -0
  155. package/dist-es/static-list/StaticListItem.js +29 -0
  156. package/dist-es/static-list/StaticListItem.js.map +1 -0
  157. package/dist-es/static-list/StaticListItemContent.css.js +4 -0
  158. package/dist-es/static-list/StaticListItemContent.css.js.map +1 -0
  159. package/dist-es/static-list/StaticListItemContent.js +26 -0
  160. package/dist-es/static-list/StaticListItemContent.js.map +1 -0
  161. package/dist-es/stepped-tracker/TrackerStep/TrackerStep.js +9 -9
  162. package/dist-es/stepped-tracker/TrackerStep/TrackerStep.js.map +1 -1
  163. package/dist-es/stepper-input/StepperInput.css.js +1 -1
  164. package/dist-es/stepper-input/StepperInput.js +216 -31
  165. package/dist-es/stepper-input/StepperInput.js.map +1 -1
  166. package/dist-es/stepper-input/internal/useActivateWhileMouseDown.js +50 -0
  167. package/dist-es/stepper-input/internal/useActivateWhileMouseDown.js.map +1 -0
  168. package/dist-es/stepper-input/internal/utils.js +32 -0
  169. package/dist-es/stepper-input/internal/utils.js.map +1 -0
  170. package/dist-es/stepper-input/useStepperInput.js +88 -172
  171. package/dist-es/stepper-input/useStepperInput.js.map +1 -1
  172. package/dist-es/tabs/Tab.js +15 -13
  173. package/dist-es/tabs/Tab.js.map +1 -1
  174. package/dist-es/tabs/Tabstrip.js +4 -3
  175. package/dist-es/tabs/Tabstrip.js.map +1 -1
  176. package/dist-es/tabs-next/OverflowMenu.js +3 -3
  177. package/dist-es/tabs-next/OverflowMenu.js.map +1 -1
  178. package/dist-es/tokenized-input/TokenizedInputBase.js +3 -3
  179. package/dist-es/tokenized-input/TokenizedInputBase.js.map +1 -1
  180. package/dist-es/tokenized-input/internal/InputPill.js +2 -2
  181. package/dist-es/tokenized-input/internal/InputPill.js.map +1 -1
  182. package/dist-es/tokenized-input-next/TokenizedInputNext.js +3 -3
  183. package/dist-es/tokenized-input-next/TokenizedInputNext.js.map +1 -1
  184. package/dist-es/tokenized-input-next/internal/InputPill.js +2 -2
  185. package/dist-es/tokenized-input-next/internal/InputPill.js.map +1 -1
  186. package/dist-es/toolbar/overflow-panel/OverflowPanel.js +3 -3
  187. package/dist-es/toolbar/overflow-panel/OverflowPanel.js.map +1 -1
  188. package/dist-types/calendar/Calendar.d.ts +2 -15
  189. package/dist-types/calendar/CalendarDateGrid.d.ts +10 -0
  190. package/dist-types/calendar/{internal/CalendarWeekHeader.d.ts → CalendarWeekHeader.d.ts} +1 -1
  191. package/dist-types/calendar/index.d.ts +2 -0
  192. package/dist-types/calendar/internal/CalendarMonth.d.ts +9 -1
  193. package/dist-types/calendar/useCalendarSelection.d.ts +0 -7
  194. package/dist-types/date-picker/DatePickerRangePanel.d.ts +17 -1
  195. package/dist-types/date-picker/DatePickerSinglePanel.d.ts +9 -1
  196. package/dist-types/index.d.ts +1 -0
  197. package/dist-types/static-list/StaticList.d.ts +8 -0
  198. package/dist-types/static-list/StaticListItem.d.ts +4 -0
  199. package/dist-types/static-list/StaticListItemContent.d.ts +8 -0
  200. package/dist-types/static-list/index.d.ts +3 -0
  201. package/dist-types/stepper-input/StepperInput.d.ts +66 -19
  202. package/dist-types/stepper-input/internal/useActivateWhileMouseDown.d.ts +5 -0
  203. package/dist-types/stepper-input/internal/utils.d.ts +8 -0
  204. package/dist-types/stepper-input/useStepperInput.d.ts +21 -8
  205. package/package.json +2 -2
  206. package/dist-cjs/calendar/internal/CalendarCarousel.css.js +0 -6
  207. package/dist-cjs/calendar/internal/CalendarCarousel.css.js.map +0 -1
  208. package/dist-cjs/calendar/internal/CalendarCarousel.js.map +0 -1
  209. package/dist-cjs/calendar/internal/CalendarWeekHeader.js.map +0 -1
  210. package/dist-cjs/stepper-input/internal/useSpinner.js +0 -33
  211. package/dist-cjs/stepper-input/internal/useSpinner.js.map +0 -1
  212. package/dist-es/calendar/internal/CalendarCarousel.css.js +0 -4
  213. package/dist-es/calendar/internal/CalendarCarousel.css.js.map +0 -1
  214. package/dist-es/calendar/internal/CalendarCarousel.js.map +0 -1
  215. package/dist-es/calendar/internal/CalendarWeekHeader.js.map +0 -1
  216. package/dist-es/stepper-input/internal/useSpinner.js +0 -29
  217. package/dist-es/stepper-input/internal/useSpinner.js.map +0 -1
  218. package/dist-types/calendar/internal/CalendarCarousel.d.ts +0 -3
  219. package/dist-types/stepper-input/internal/useSpinner.d.ts +0 -5
  220. /package/dist-cjs/calendar/{internal/CalendarWeekHeader.css.js → CalendarWeekHeader.css.js} +0 -0
  221. /package/dist-cjs/calendar/{internal/CalendarWeekHeader.css.js.map → CalendarWeekHeader.css.js.map} +0 -0
  222. /package/dist-es/calendar/{internal/CalendarWeekHeader.css.js → CalendarWeekHeader.css.js} +0 -0
  223. /package/dist-es/calendar/{internal/CalendarWeekHeader.css.js.map → CalendarWeekHeader.css.js.map} +0 -0
@@ -1 +1 @@
1
- {"version":3,"file":"Tabstrip.js","sources":["../src/tabs/Tabstrip.tsx"],"sourcesContent":["import {\n Button,\n Tooltip,\n makePrefixer,\n useIdMemo,\n useIsomorphicLayoutEffect,\n} from \"@salt-ds/core\";\nimport { AddIcon, OverflowMenuIcon } from \"@salt-ds/icons\";\nimport { clsx } from \"clsx\";\nimport {\n Children,\n type ForwardedRef,\n type KeyboardEvent,\n type MouseEvent,\n type RefObject,\n cloneElement,\n createElement,\n forwardRef,\n isValidElement,\n useCallback,\n useImperativeHandle,\n useRef,\n useState,\n} from \"react\";\nimport type { SelectionChangeHandler } from \"../common-hooks\";\n\nimport { Dropdown } from \"../dropdown\";\nimport {\n type InjectedSourceItem,\n type OverflowItem,\n useOverflowLayout,\n} from \"../responsive\";\nimport { useOverflowCollectionItems } from \"../responsive/useOverflowCollectionItems\";\nimport { Tab } from \"./Tab\";\nimport { TabActivationIndicator } from \"./TabActivationIndicator\";\nimport type {\n FocusAPI,\n TabDescriptor,\n TabElement,\n TabProps,\n TabsSource,\n TabstripProps,\n responsiveDataAttributes,\n} from \"./TabsTypes\";\nimport { useTabstrip } from \"./useTabstrip\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport tabstripCss from \"./Tabstrip.css\";\nimport themeTabstripCss from \"./ThemeTabstrip.css\";\n\nconst withBaseName = makePrefixer(\"saltTabstrip\");\n\nconst ADD_TAB_LABEL = \"Create Tab\";\n\n// Simple strings for tab labels are accepted as input, convert to TabDescriptors internally\nconst tabDescriptors = (\n tabs: TabsSource | undefined,\n): TabDescriptor[] | undefined =>\n tabs?.map((tab: string | TabDescriptor) =>\n typeof tab === \"string\" ? { label: tab } : tab,\n );\n\nexport const Tabstrip = forwardRef(function Tabstrip(\n {\n activeTabIndex: activeTabIndexProp,\n allowDragDrop = false,\n centered = false,\n children,\n className: classNameProp,\n defaultSource,\n defaultActiveTabIndex,\n editing,\n variant,\n enableAddTab = false,\n enableCloseTab,\n enableRenameTab,\n id: idProp,\n keyBoardActivation = \"manual\",\n onAddTab,\n onActiveChange,\n onCloseTab,\n onEnterEditMode,\n onExitEditMode,\n onMouseDown,\n onMoveTab,\n orientation = \"horizontal\",\n overflowMenu: overflowMenuProp = true,\n promptForNewTabName = true,\n showActivationIndicator = true,\n source,\n title,\n ...htmlAttributes\n }: TabstripProps,\n forwardedRef: ForwardedRef<FocusAPI>,\n) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-tab-strip\",\n css: tabstripCss,\n window: targetWindow,\n });\n useComponentCssInjection({\n testId: \"salt-theme-tab-strip\",\n css: themeTabstripCss,\n window: targetWindow,\n });\n\n const root = useRef<HTMLDivElement>(null);\n // can't use forwardedRef here, can we ?\n // const setForkRef = useForkRef(root, forwardedRef);\n const activeRef = useRef<number | null>(\n activeTabIndexProp || defaultActiveTabIndex || 0,\n );\n\n const overflowItemsRef = useRef<OverflowItem[]>([]);\n const [showOverflowMenu, _setShowOverflowMenu] = useState(false);\n\n const setShowOverflowMenu = useCallback((value: boolean) => {\n _setShowOverflowMenu(value);\n }, []);\n\n const tabstripId = useIdMemo(idProp);\n\n const injectedItems = enableAddTab\n ? [\n {\n source: { label: \"Add Tab\", position: -1, priority: 1 },\n } as InjectedSourceItem,\n ]\n : undefined;\n\n const collectionHook = useOverflowCollectionItems({\n children,\n defaultSource: tabDescriptors(defaultSource),\n id: tabstripId,\n injectedItems,\n label: \"Tabstrip\",\n orientation,\n source: tabDescriptors(source),\n options: {\n closeable: enableCloseTab,\n editable: enableRenameTab,\n getPriority: (item, index) => {\n return index === activeRef.current ? 1 : undefined;\n },\n },\n });\n\n const childCount = useRef(Children.count(children));\n\n const getChildren = (): TabElement[] | undefined => {\n if (Children.count(children) === 0) {\n return undefined;\n }\n return Children.toArray(children) as TabElement[];\n };\n\n const [innerContainerRef, switchOverflowPriorities] = useOverflowLayout({\n collectionHook,\n disableOverflow: overflowMenuProp === false,\n id: tabstripId,\n orientation,\n label: \"Tabstrip\",\n });\n overflowItemsRef.current = collectionHook.data;\n const overflowedItems = collectionHook.data.filter((item) => item.overflowed);\n\n const tabMovedHandler = useCallback(\n (fromIndex: number, toIndex: number) => {\n onMoveTab?.(fromIndex, toIndex);\n setTimeout(() => {\n collectionHook.dispatch({\n type: \"reset\",\n });\n }, 50);\n },\n [collectionHook, onMoveTab],\n );\n\n const handleTabSelectionChange = useCallback(\n (tabIndex: number) => {\n const selectedItem = collectionHook.data[tabIndex];\n const prevSelectedItem = collectionHook.data.find(\n (item) => item.priority === 1 && !item.isOverflowIndicator,\n );\n if (selectedItem && prevSelectedItem && overflowMenuProp) {\n switchOverflowPriorities(selectedItem, prevSelectedItem);\n }\n onActiveChange?.(tabIndex);\n setShowOverflowMenu(false);\n },\n [\n collectionHook.data,\n onActiveChange,\n overflowMenuProp,\n setShowOverflowMenu,\n switchOverflowPriorities,\n ],\n );\n\n const {\n activeTabIndex,\n activateTab,\n addTab,\n onMouseDown: tabstripHookMouseDown,\n ...tabstripHook\n } = useTabstrip({\n activeTabIndex: activeTabIndexProp,\n allowDragDrop,\n collectionHook,\n defaultTabs: tabDescriptors(defaultSource),\n defaultActiveTabIndex,\n editing,\n enableAddTab,\n idRoot: tabstripId,\n innerContainerRef,\n keyBoardActivation,\n onActiveChange: handleTabSelectionChange,\n onCloseTab,\n onEnterEditMode,\n onExitEditMode,\n onMoveTab: tabMovedHandler,\n orientation,\n promptForNewTabName,\n tabs: tabDescriptors(source) ?? getChildren(),\n });\n\n activeRef.current = activeTabIndex;\n\n useImperativeHandle(\n forwardedRef,\n () =>\n ({\n focus: () => {\n const { current: tabstrip } = root;\n if (tabstrip) {\n const selectedTab = tabstrip.querySelector(\n '.saltTab[aria-selected=\"true\"]',\n ) as HTMLElement;\n if (selectedTab) {\n selectedTab.focus();\n }\n }\n },\n }) as FocusAPI,\n [],\n );\n\n const handleAddTabClick = useCallback(() => {\n if (!collectionHook.isControlled) {\n addTab();\n }\n onAddTab?.();\n }, [collectionHook.isControlled, onAddTab, addTab]);\n\n const selectedIndex = useRef(activeTabIndex);\n const focusedTabIndex = tabstripHook.highlightedIdx;\n const handleOverflowSelectionChange: SelectionChangeHandler<OverflowItem> =\n useCallback(\n (e, tab) => {\n if (tab !== null) {\n activateTab(tab.index);\n }\n },\n [activateTab],\n );\n\n const handleKeydownOverflowMenu = useCallback(\n (e: KeyboardEvent<HTMLElement>) => {\n tabstripHook.navigationProps?.onKeyDown?.(e);\n },\n [tabstripHook.navigationProps],\n );\n\n const handleOverflowMenuOpen = useCallback(\n (open: boolean) => {\n setShowOverflowMenu(open);\n },\n [setShowOverflowMenu],\n );\n\n const handleMouseDown = useCallback(\n (evt: MouseEvent<HTMLDivElement>) => {\n onMouseDown?.(evt);\n tabstripHookMouseDown?.(evt);\n },\n [onMouseDown, tabstripHookMouseDown],\n );\n\n // shouldn't we use ref for this ?\n useIsomorphicLayoutEffect(() => {\n // We don't care about changes to overflowedItems here, the overflowObserver\n // always does the right thing. We only care about changes to selected tab\n if (selectedIndex.current !== activeTabIndex && overflowMenuProp) {\n // We might want to do this only if the selected tab is overflowed ?\n // TODO\n // resetOverflow();\n selectedIndex.current = activeTabIndex;\n }\n }, [overflowMenuProp, activeTabIndex]);\n\n useIsomorphicLayoutEffect(() => {\n if (Children.count(children) !== childCount.current) {\n childCount.current = Children.count(children);\n // TODO\n // resetOverflow();\n }\n }, [children]);\n\n /*\n * biome-ignore lint/correctness/useExhaustiveDependencies: We only want the effect to run when value changes, not every time focusedTabIndex changes.\n * It doesn't matter if focusedTabIndex is stale in between calls - it will be correct when value changes.\n */\n useIsomorphicLayoutEffect(() => {\n if (\n activeTabIndex !== null &&\n focusedTabIndex !== activeTabIndex &&\n focusedTabIndex !== -1\n ) {\n tabstripHook.focusTab(activeTabIndex);\n }\n }, [activeTabIndex]);\n\n const renderContent = () => {\n const content = collectionHook.data\n .filter((item) => !item.isOverflowIndicator && !item.isInjectedItem)\n .map((item: OverflowItem, index: number) => {\n // TODO sort out typoing\n const tab = item.source as unknown as TabDescriptor;\n const element = item.element as TabElement;\n\n const selected = index === activeTabIndex;\n const focusVisible = tabstripHook.focusVisible === index;\n const overflowed =\n overflowedItems.findIndex(\n (item: OverflowItem) => item.index === index,\n ) !== -1;\n\n const tabIsBeingEdited = tabstripHook.editing && selected;\n const tabIndex = tabIsBeingEdited\n ? undefined\n : selected && !tabstripHook.focusIsWithinComponent\n ? 0\n : -1;\n\n const baseProps: Partial<TabProps> &\n responsiveDataAttributes & {\n ref?: RefObject<HTMLDivElement>;\n key: string | number;\n } = {\n \"data-index\": index,\n \"data-priority\": item.priority,\n \"data-overflowed\": overflowed ? true : undefined,\n ...tabstripHook.navigationProps,\n id: item.id,\n key: index,\n onMouseDown: handleMouseDown,\n tabIndex,\n };\n\n const tabProps = {\n ...tabstripHook.tabProps,\n closeable: item.closeable,\n dragging: tabstripHook.draggedItemIndex === index,\n editable: item.editable,\n editing: tabIsBeingEdited,\n focusVisible,\n index,\n onClose: item.closeable ? tabstripHook.closeTab : undefined,\n orientation,\n selected,\n } as Partial<TabProps>;\n\n if (isValidElement(element)) {\n if (element.type === Tab) {\n return cloneElement(element, { ...baseProps, ...tabProps });\n }\n return cloneElement(element, baseProps);\n }\n\n return createElement(Tab, {\n ...baseProps,\n ...tabProps,\n label: tab.label,\n });\n });\n\n const overflowCount = overflowedItems.length;\n const draggingActiveTab = tabstripHook.draggedItemIndex === activeTabIndex;\n const showOverflow =\n (tabstripHook.revealOverflowedItems && !draggingActiveTab) ||\n showOverflowMenu;\n const showTooltip = tabstripHook.revealOverflowedItems && draggingActiveTab;\n const overflowIndicator = collectionHook.data.find(\n (i) => i.isOverflowIndicator,\n );\n const [injectedItem] = collectionHook.data.filter((i) => i.isInjectedItem);\n\n if (overflowIndicator) {\n content.push(\n <Tooltip\n content=\"Active Tab cannot be moved into overflow list\"\n open\n disabled={!showTooltip}\n status=\"warning\"\n key=\"tooltip\"\n hideArrow\n >\n <Dropdown<OverflowItem>\n className={clsx(withBaseName(\"overflowMenu\"), {\n [withBaseName(\"overflowMenu-open\")]: showOverflow,\n })}\n ListProps={{\n className: clsx({\n [withBaseName(\"overflowMenu-dropTarget\")]:\n tabstripHook.revealOverflowedItems,\n }),\n }}\n data-overflow-indicator\n data-priority={0}\n id={overflowIndicator.id}\n isOpen={showOverflow}\n key=\"overflow\"\n onOpenChange={handleOverflowMenuOpen}\n onKeyDown={handleKeydownOverflowMenu}\n onSelectionChange={handleOverflowSelectionChange}\n placement=\"bottom-end\"\n source={overflowedItems}\n selected={null}\n triggerComponent={\n <Button\n aria-label={`Tabs overflow menu ${overflowCount} item${\n overflowCount === 1 ? \"\" : \"s\"\n }`}\n variant=\"secondary\"\n tabIndex={-1}\n >\n <OverflowMenuIcon />\n </Button>\n }\n width=\"auto\"\n />\n </Tooltip>,\n );\n }\n\n if (injectedItem) {\n content.push(\n <Button\n {...tabstripHook.navigationProps}\n aria-label={ADD_TAB_LABEL}\n data-priority={injectedItem.priority}\n data-overflowed={injectedItem.overflowed}\n id={injectedItem.id}\n key=\"addButton\"\n onClick={handleAddTabClick}\n variant=\"secondary\"\n tabIndex={-1}\n >\n <AddIcon />\n </Button>,\n );\n }\n\n return content;\n };\n\n const selectedTabOverflowed = overflowedItems.some(\n (item: OverflowItem) => item.index === activeTabIndex,\n );\n const className = clsx(\n withBaseName(),\n withBaseName(orientation),\n classNameProp,\n {\n [withBaseName(\"centered\")]: centered,\n [withBaseName(\"draggingTab\")]: tabstripHook.isDragging,\n [withBaseName(\"tertiary\")]: variant === \"tertiary\",\n },\n );\n\n const selectedTabId =\n activeTabIndex !== null ? collectionHook.data[activeTabIndex].id : null;\n\n return (\n <div\n {...htmlAttributes}\n {...tabstripHook.containerProps}\n className={className}\n id={tabstripId}\n ref={root}\n role=\"tablist\"\n >\n <div className={withBaseName(\"inner\")} ref={innerContainerRef}>\n {renderContent()}\n </div>\n {showActivationIndicator ? (\n <TabActivationIndicator\n hideThumb={selectedTabOverflowed || tabstripHook.isDragging}\n orientation={orientation}\n tabId={selectedTabId}\n />\n ) : null}\n {tabstripHook.draggable}\n </div>\n );\n});\n\nTabstrip.displayName = \"Tabstrip\";\n"],"names":["makePrefixer","forwardRef","Tabstrip","useWindow","useComponentCssInjection","tabstripCss","themeTabstripCss","useRef","useState","useCallback","useIdMemo","useOverflowCollectionItems","Children","useOverflowLayout","useTabstrip","useImperativeHandle","_a","useIsomorphicLayoutEffect","item","isValidElement","Tab","cloneElement","createElement","jsx","Tooltip","Dropdown","clsx","Button","OverflowMenuIcon","AddIcon","jsxs","TabActivationIndicator"],"mappings":"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"}
1
+ {"version":3,"file":"Tabstrip.js","sources":["../src/tabs/Tabstrip.tsx"],"sourcesContent":["import {\n Button,\n Tooltip,\n makePrefixer,\n useIcon,\n useIdMemo,\n useIsomorphicLayoutEffect,\n} from \"@salt-ds/core\";\nimport { AddIcon } from \"@salt-ds/icons\";\nimport { clsx } from \"clsx\";\nimport {\n Children,\n type ForwardedRef,\n type KeyboardEvent,\n type MouseEvent,\n type RefObject,\n cloneElement,\n createElement,\n forwardRef,\n isValidElement,\n useCallback,\n useImperativeHandle,\n useRef,\n useState,\n} from \"react\";\nimport type { SelectionChangeHandler } from \"../common-hooks\";\n\nimport { Dropdown } from \"../dropdown\";\nimport {\n type InjectedSourceItem,\n type OverflowItem,\n useOverflowLayout,\n} from \"../responsive\";\nimport { useOverflowCollectionItems } from \"../responsive/useOverflowCollectionItems\";\nimport { Tab } from \"./Tab\";\nimport { TabActivationIndicator } from \"./TabActivationIndicator\";\nimport type {\n FocusAPI,\n TabDescriptor,\n TabElement,\n TabProps,\n TabsSource,\n TabstripProps,\n responsiveDataAttributes,\n} from \"./TabsTypes\";\nimport { useTabstrip } from \"./useTabstrip\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport tabstripCss from \"./Tabstrip.css\";\nimport themeTabstripCss from \"./ThemeTabstrip.css\";\n\nconst withBaseName = makePrefixer(\"saltTabstrip\");\n\nconst ADD_TAB_LABEL = \"Create Tab\";\n\n// Simple strings for tab labels are accepted as input, convert to TabDescriptors internally\nconst tabDescriptors = (\n tabs: TabsSource | undefined,\n): TabDescriptor[] | undefined =>\n tabs?.map((tab: string | TabDescriptor) =>\n typeof tab === \"string\" ? { label: tab } : tab,\n );\n\nexport const Tabstrip = forwardRef(function Tabstrip(\n {\n activeTabIndex: activeTabIndexProp,\n allowDragDrop = false,\n centered = false,\n children,\n className: classNameProp,\n defaultSource,\n defaultActiveTabIndex,\n editing,\n variant,\n enableAddTab = false,\n enableCloseTab,\n enableRenameTab,\n id: idProp,\n keyBoardActivation = \"manual\",\n onAddTab,\n onActiveChange,\n onCloseTab,\n onEnterEditMode,\n onExitEditMode,\n onMouseDown,\n onMoveTab,\n orientation = \"horizontal\",\n overflowMenu: overflowMenuProp = true,\n promptForNewTabName = true,\n showActivationIndicator = true,\n source,\n title,\n ...htmlAttributes\n }: TabstripProps,\n forwardedRef: ForwardedRef<FocusAPI>,\n) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-tab-strip\",\n css: tabstripCss,\n window: targetWindow,\n });\n useComponentCssInjection({\n testId: \"salt-theme-tab-strip\",\n css: themeTabstripCss,\n window: targetWindow,\n });\n\n const root = useRef<HTMLDivElement>(null);\n // can't use forwardedRef here, can we ?\n // const setForkRef = useForkRef(root, forwardedRef);\n const activeRef = useRef<number | null>(\n activeTabIndexProp || defaultActiveTabIndex || 0,\n );\n const { OverflowIcon } = useIcon();\n const overflowItemsRef = useRef<OverflowItem[]>([]);\n const [showOverflowMenu, _setShowOverflowMenu] = useState(false);\n\n const setShowOverflowMenu = useCallback((value: boolean) => {\n _setShowOverflowMenu(value);\n }, []);\n\n const tabstripId = useIdMemo(idProp);\n\n const injectedItems = enableAddTab\n ? [\n {\n source: { label: \"Add Tab\", position: -1, priority: 1 },\n } as InjectedSourceItem,\n ]\n : undefined;\n\n const collectionHook = useOverflowCollectionItems({\n children,\n defaultSource: tabDescriptors(defaultSource),\n id: tabstripId,\n injectedItems,\n label: \"Tabstrip\",\n orientation,\n source: tabDescriptors(source),\n options: {\n closeable: enableCloseTab,\n editable: enableRenameTab,\n getPriority: (item, index) => {\n return index === activeRef.current ? 1 : undefined;\n },\n },\n });\n\n const childCount = useRef(Children.count(children));\n\n const getChildren = (): TabElement[] | undefined => {\n if (Children.count(children) === 0) {\n return undefined;\n }\n return Children.toArray(children) as TabElement[];\n };\n\n const [innerContainerRef, switchOverflowPriorities] = useOverflowLayout({\n collectionHook,\n disableOverflow: overflowMenuProp === false,\n id: tabstripId,\n orientation,\n label: \"Tabstrip\",\n });\n overflowItemsRef.current = collectionHook.data;\n const overflowedItems = collectionHook.data.filter((item) => item.overflowed);\n\n const tabMovedHandler = useCallback(\n (fromIndex: number, toIndex: number) => {\n onMoveTab?.(fromIndex, toIndex);\n setTimeout(() => {\n collectionHook.dispatch({\n type: \"reset\",\n });\n }, 50);\n },\n [collectionHook, onMoveTab],\n );\n\n const handleTabSelectionChange = useCallback(\n (tabIndex: number) => {\n const selectedItem = collectionHook.data[tabIndex];\n const prevSelectedItem = collectionHook.data.find(\n (item) => item.priority === 1 && !item.isOverflowIndicator,\n );\n if (selectedItem && prevSelectedItem && overflowMenuProp) {\n switchOverflowPriorities(selectedItem, prevSelectedItem);\n }\n onActiveChange?.(tabIndex);\n setShowOverflowMenu(false);\n },\n [\n collectionHook.data,\n onActiveChange,\n overflowMenuProp,\n setShowOverflowMenu,\n switchOverflowPriorities,\n ],\n );\n\n const {\n activeTabIndex,\n activateTab,\n addTab,\n onMouseDown: tabstripHookMouseDown,\n ...tabstripHook\n } = useTabstrip({\n activeTabIndex: activeTabIndexProp,\n allowDragDrop,\n collectionHook,\n defaultTabs: tabDescriptors(defaultSource),\n defaultActiveTabIndex,\n editing,\n enableAddTab,\n idRoot: tabstripId,\n innerContainerRef,\n keyBoardActivation,\n onActiveChange: handleTabSelectionChange,\n onCloseTab,\n onEnterEditMode,\n onExitEditMode,\n onMoveTab: tabMovedHandler,\n orientation,\n promptForNewTabName,\n tabs: tabDescriptors(source) ?? getChildren(),\n });\n\n activeRef.current = activeTabIndex;\n\n useImperativeHandle(\n forwardedRef,\n () =>\n ({\n focus: () => {\n const { current: tabstrip } = root;\n if (tabstrip) {\n const selectedTab = tabstrip.querySelector(\n '.saltTab[aria-selected=\"true\"]',\n ) as HTMLElement;\n if (selectedTab) {\n selectedTab.focus();\n }\n }\n },\n }) as FocusAPI,\n [],\n );\n\n const handleAddTabClick = useCallback(() => {\n if (!collectionHook.isControlled) {\n addTab();\n }\n onAddTab?.();\n }, [collectionHook.isControlled, onAddTab, addTab]);\n\n const selectedIndex = useRef(activeTabIndex);\n const focusedTabIndex = tabstripHook.highlightedIdx;\n const handleOverflowSelectionChange: SelectionChangeHandler<OverflowItem> =\n useCallback(\n (e, tab) => {\n if (tab !== null) {\n activateTab(tab.index);\n }\n },\n [activateTab],\n );\n\n const handleKeydownOverflowMenu = useCallback(\n (e: KeyboardEvent<HTMLElement>) => {\n tabstripHook.navigationProps?.onKeyDown?.(e);\n },\n [tabstripHook.navigationProps],\n );\n\n const handleOverflowMenuOpen = useCallback(\n (open: boolean) => {\n setShowOverflowMenu(open);\n },\n [setShowOverflowMenu],\n );\n\n const handleMouseDown = useCallback(\n (evt: MouseEvent<HTMLDivElement>) => {\n onMouseDown?.(evt);\n tabstripHookMouseDown?.(evt);\n },\n [onMouseDown, tabstripHookMouseDown],\n );\n\n // shouldn't we use ref for this ?\n useIsomorphicLayoutEffect(() => {\n // We don't care about changes to overflowedItems here, the overflowObserver\n // always does the right thing. We only care about changes to selected tab\n if (selectedIndex.current !== activeTabIndex && overflowMenuProp) {\n // We might want to do this only if the selected tab is overflowed ?\n // TODO\n // resetOverflow();\n selectedIndex.current = activeTabIndex;\n }\n }, [overflowMenuProp, activeTabIndex]);\n\n useIsomorphicLayoutEffect(() => {\n if (Children.count(children) !== childCount.current) {\n childCount.current = Children.count(children);\n // TODO\n // resetOverflow();\n }\n }, [children]);\n\n /*\n * biome-ignore lint/correctness/useExhaustiveDependencies: We only want the effect to run when value changes, not every time focusedTabIndex changes.\n * It doesn't matter if focusedTabIndex is stale in between calls - it will be correct when value changes.\n */\n useIsomorphicLayoutEffect(() => {\n if (\n activeTabIndex !== null &&\n focusedTabIndex !== activeTabIndex &&\n focusedTabIndex !== -1\n ) {\n tabstripHook.focusTab(activeTabIndex);\n }\n }, [activeTabIndex]);\n\n const renderContent = () => {\n const content = collectionHook.data\n .filter((item) => !item.isOverflowIndicator && !item.isInjectedItem)\n .map((item: OverflowItem, index: number) => {\n // TODO sort out typoing\n const tab = item.source as unknown as TabDescriptor;\n const element = item.element as TabElement;\n\n const selected = index === activeTabIndex;\n const focusVisible = tabstripHook.focusVisible === index;\n const overflowed =\n overflowedItems.findIndex(\n (item: OverflowItem) => item.index === index,\n ) !== -1;\n\n const tabIsBeingEdited = tabstripHook.editing && selected;\n const tabIndex = tabIsBeingEdited\n ? undefined\n : selected && !tabstripHook.focusIsWithinComponent\n ? 0\n : -1;\n\n const baseProps: Partial<TabProps> &\n responsiveDataAttributes & {\n ref?: RefObject<HTMLDivElement>;\n key: string | number;\n } = {\n \"data-index\": index,\n \"data-priority\": item.priority,\n \"data-overflowed\": overflowed ? true : undefined,\n ...tabstripHook.navigationProps,\n id: item.id,\n key: index,\n onMouseDown: handleMouseDown,\n tabIndex,\n };\n\n const tabProps = {\n ...tabstripHook.tabProps,\n closeable: item.closeable,\n dragging: tabstripHook.draggedItemIndex === index,\n editable: item.editable,\n editing: tabIsBeingEdited,\n focusVisible,\n index,\n onClose: item.closeable ? tabstripHook.closeTab : undefined,\n orientation,\n selected,\n } as Partial<TabProps>;\n\n if (isValidElement(element)) {\n if (element.type === Tab) {\n return cloneElement(element, { ...baseProps, ...tabProps });\n }\n return cloneElement(element, baseProps);\n }\n\n return createElement(Tab, {\n ...baseProps,\n ...tabProps,\n label: tab.label,\n });\n });\n\n const overflowCount = overflowedItems.length;\n const draggingActiveTab = tabstripHook.draggedItemIndex === activeTabIndex;\n const showOverflow =\n (tabstripHook.revealOverflowedItems && !draggingActiveTab) ||\n showOverflowMenu;\n const showTooltip = tabstripHook.revealOverflowedItems && draggingActiveTab;\n const overflowIndicator = collectionHook.data.find(\n (i) => i.isOverflowIndicator,\n );\n const [injectedItem] = collectionHook.data.filter((i) => i.isInjectedItem);\n\n if (overflowIndicator) {\n content.push(\n <Tooltip\n content=\"Active Tab cannot be moved into overflow list\"\n open\n disabled={!showTooltip}\n status=\"warning\"\n key=\"tooltip\"\n hideArrow\n >\n <Dropdown<OverflowItem>\n className={clsx(withBaseName(\"overflowMenu\"), {\n [withBaseName(\"overflowMenu-open\")]: showOverflow,\n })}\n ListProps={{\n className: clsx({\n [withBaseName(\"overflowMenu-dropTarget\")]:\n tabstripHook.revealOverflowedItems,\n }),\n }}\n data-overflow-indicator\n data-priority={0}\n id={overflowIndicator.id}\n isOpen={showOverflow}\n key=\"overflow\"\n onOpenChange={handleOverflowMenuOpen}\n onKeyDown={handleKeydownOverflowMenu}\n onSelectionChange={handleOverflowSelectionChange}\n placement=\"bottom-end\"\n source={overflowedItems}\n selected={null}\n triggerComponent={\n <Button\n aria-label={`Tabs overflow menu ${overflowCount} item${\n overflowCount === 1 ? \"\" : \"s\"\n }`}\n variant=\"secondary\"\n tabIndex={-1}\n >\n <OverflowIcon />\n </Button>\n }\n width=\"auto\"\n />\n </Tooltip>,\n );\n }\n\n if (injectedItem) {\n content.push(\n <Button\n {...tabstripHook.navigationProps}\n aria-label={ADD_TAB_LABEL}\n data-priority={injectedItem.priority}\n data-overflowed={injectedItem.overflowed}\n id={injectedItem.id}\n key=\"addButton\"\n onClick={handleAddTabClick}\n variant=\"secondary\"\n tabIndex={-1}\n >\n <AddIcon />\n </Button>,\n );\n }\n\n return content;\n };\n\n const selectedTabOverflowed = overflowedItems.some(\n (item: OverflowItem) => item.index === activeTabIndex,\n );\n const className = clsx(\n withBaseName(),\n withBaseName(orientation),\n classNameProp,\n {\n [withBaseName(\"centered\")]: centered,\n [withBaseName(\"draggingTab\")]: tabstripHook.isDragging,\n [withBaseName(\"tertiary\")]: variant === \"tertiary\",\n },\n );\n\n const selectedTabId =\n activeTabIndex !== null ? collectionHook.data[activeTabIndex].id : null;\n\n return (\n <div\n {...htmlAttributes}\n {...tabstripHook.containerProps}\n className={className}\n id={tabstripId}\n ref={root}\n role=\"tablist\"\n >\n <div className={withBaseName(\"inner\")} ref={innerContainerRef}>\n {renderContent()}\n </div>\n {showActivationIndicator ? (\n <TabActivationIndicator\n hideThumb={selectedTabOverflowed || tabstripHook.isDragging}\n orientation={orientation}\n tabId={selectedTabId}\n />\n ) : null}\n {tabstripHook.draggable}\n </div>\n );\n});\n\nTabstrip.displayName = \"Tabstrip\";\n"],"names":["makePrefixer","forwardRef","Tabstrip","useWindow","useComponentCssInjection","tabstripCss","themeTabstripCss","useRef","useIcon","useState","useCallback","useIdMemo","useOverflowCollectionItems","Children","useOverflowLayout","useTabstrip","useImperativeHandle","_a","useIsomorphicLayoutEffect","item","isValidElement","Tab","cloneElement","createElement","jsx","Tooltip","Dropdown","clsx","Button","AddIcon","jsxs","TabActivationIndicator"],"mappings":"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"}
@@ -4,7 +4,6 @@ Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  var jsxRuntime = require('react/jsx-runtime');
6
6
  var core = require('@salt-ds/core');
7
- var icons = require('@salt-ds/icons');
8
7
  var react = require('react');
9
8
  var reactOverflow = require('@fluentui/react-overflow');
10
9
  require('../dropdown/DropdownBase.js');
@@ -17,6 +16,7 @@ const OverflowMenu = react.forwardRef(
17
16
  function OverflowMenu2(props, forwardedRef) {
18
17
  const { tabs, ...rest } = props;
19
18
  const { ref, overflowCount, isOverflowing } = reactOverflow.useOverflowMenu();
19
+ const { OverflowIcon } = core.useIcon();
20
20
  const handleRef = core.useForkRef(ref, forwardedRef);
21
21
  const itemVisibility = reactOverflow.useOverflowContext(
22
22
  (context) => context.itemVisibility
@@ -30,7 +30,7 @@ const OverflowMenu = react.forwardRef(
30
30
  "aria-label": "More tabs",
31
31
  variant: "secondary",
32
32
  role: "combobox",
33
- children: /* @__PURE__ */ jsxRuntime.jsx(icons.OverflowMenuIcon, {
33
+ children: /* @__PURE__ */ jsxRuntime.jsx(OverflowIcon, {
34
34
  "aria-hidden": true,
35
35
  style: { margin: 0 }
36
36
  })
@@ -1 +1 @@
1
- {"version":3,"file":"OverflowMenu.js","sources":["../src/tabs-next/OverflowMenu.tsx"],"sourcesContent":["import { Button, useForkRef } from \"@salt-ds/core\";\nimport { OverflowMenuIcon } from \"@salt-ds/icons\";\nimport { type ReactNode, forwardRef } from \"react\";\n\nimport { useOverflowContext, useOverflowMenu } from \"@fluentui/react-overflow\";\nimport { Dropdown, type DropdownProps } from \"../dropdown\";\n\ntype TabValue = {\n value: string;\n label: ReactNode;\n};\n\nexport interface OverflowMenuProps extends DropdownProps<TabValue> {\n tabs: TabValue[];\n}\n\nexport const OverflowMenu = forwardRef<HTMLDivElement, OverflowMenuProps>(\n function OverflowMenu(props, forwardedRef) {\n const { tabs, ...rest } = props;\n const { ref, overflowCount, isOverflowing } =\n useOverflowMenu<HTMLDivElement>();\n const handleRef = useForkRef(ref, forwardedRef);\n const itemVisibility = useOverflowContext(\n (context) => context.itemVisibility,\n );\n\n const tabList = tabs.filter(({ value }) => !itemVisibility[value]);\n\n if (!isOverflowing) return null;\n\n return (\n <Dropdown<TabValue>\n aria-label={`${overflowCount} more tabs`}\n triggerComponent={\n <Button aria-label=\"More tabs\" variant=\"secondary\" role=\"combobox\">\n <OverflowMenuIcon aria-hidden style={{ margin: 0 }} />\n </Button>\n }\n width=\"auto\"\n ref={handleRef}\n source={tabList}\n selected={null}\n {...rest}\n />\n );\n },\n);\n"],"names":["forwardRef","OverflowMenu","useOverflowMenu","useForkRef","useOverflowContext","jsx","Dropdown","Button","OverflowMenuIcon"],"mappings":";;;;;;;;;;;;;;;AAgBO,MAAM,YAAe,GAAAA,gBAAA;AAAA,EAC1B,SAASC,aAAa,CAAA,KAAA,EAAO,YAAc,EAAA;AACzC,IAAM,MAAA,EAAE,IAAS,EAAA,GAAA,IAAA,EAAS,GAAA,KAAA,CAAA;AAC1B,IAAA,MAAM,EAAE,GAAA,EAAK,aAAe,EAAA,aAAA,KAC1BC,6BAAgC,EAAA,CAAA;AAClC,IAAM,MAAA,SAAA,GAAYC,eAAW,CAAA,GAAA,EAAK,YAAY,CAAA,CAAA;AAC9C,IAAA,MAAM,cAAiB,GAAAC,gCAAA;AAAA,MACrB,CAAC,YAAY,OAAQ,CAAA,cAAA;AAAA,KACvB,CAAA;AAEA,IAAM,MAAA,OAAA,GAAU,KAAK,MAAO,CAAA,CAAC,EAAE,KAAM,EAAA,KAAM,CAAC,cAAA,CAAe,KAAM,CAAA,CAAA,CAAA;AAEjE,IAAA,IAAI,CAAC,aAAA;AAAe,MAAO,OAAA,IAAA,CAAA;AAE3B,IAAA,uBACGC,cAAA,CAAAC,iBAAA,EAAA;AAAA,MACC,cAAY,CAAG,EAAA,aAAA,CAAA,UAAA,CAAA;AAAA,MACf,kCACGD,cAAA,CAAAE,WAAA,EAAA;AAAA,QAAO,YAAW,EAAA,WAAA;AAAA,QAAY,OAAQ,EAAA,WAAA;AAAA,QAAY,IAAK,EAAA,UAAA;AAAA,QACtD,QAAC,kBAAAF,cAAA,CAAAG,sBAAA,EAAA;AAAA,UAAiB,aAAW,EAAA,IAAA;AAAA,UAAC,KAAA,EAAO,EAAE,MAAA,EAAQ,CAAE,EAAA;AAAA,SAAG,CAAA;AAAA,OACtD,CAAA;AAAA,MAEF,KAAM,EAAA,MAAA;AAAA,MACN,GAAK,EAAA,SAAA;AAAA,MACL,MAAQ,EAAA,OAAA;AAAA,MACR,QAAU,EAAA,IAAA;AAAA,MACT,GAAG,IAAA;AAAA,KACN,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
1
+ {"version":3,"file":"OverflowMenu.js","sources":["../src/tabs-next/OverflowMenu.tsx"],"sourcesContent":["import { Button, useForkRef, useIcon } from \"@salt-ds/core\";\nimport { type ReactNode, forwardRef } from \"react\";\n\nimport { useOverflowContext, useOverflowMenu } from \"@fluentui/react-overflow\";\nimport { Dropdown, type DropdownProps } from \"../dropdown\";\n\ntype TabValue = {\n value: string;\n label: ReactNode;\n};\n\nexport interface OverflowMenuProps extends DropdownProps<TabValue> {\n tabs: TabValue[];\n}\n\nexport const OverflowMenu = forwardRef<HTMLDivElement, OverflowMenuProps>(\n function OverflowMenu(props, forwardedRef) {\n const { tabs, ...rest } = props;\n const { ref, overflowCount, isOverflowing } =\n useOverflowMenu<HTMLDivElement>();\n const { OverflowIcon } = useIcon();\n const handleRef = useForkRef(ref, forwardedRef);\n const itemVisibility = useOverflowContext(\n (context) => context.itemVisibility,\n );\n\n const tabList = tabs.filter(({ value }) => !itemVisibility[value]);\n\n if (!isOverflowing) return null;\n\n return (\n <Dropdown<TabValue>\n aria-label={`${overflowCount} more tabs`}\n triggerComponent={\n <Button aria-label=\"More tabs\" variant=\"secondary\" role=\"combobox\">\n <OverflowIcon aria-hidden style={{ margin: 0 }} />\n </Button>\n }\n width=\"auto\"\n ref={handleRef}\n source={tabList}\n selected={null}\n {...rest}\n />\n );\n },\n);\n"],"names":["forwardRef","OverflowMenu","useOverflowMenu","useIcon","useForkRef","useOverflowContext","jsx","Dropdown","Button"],"mappings":";;;;;;;;;;;;;;AAeO,MAAM,YAAe,GAAAA,gBAAA;AAAA,EAC1B,SAASC,aAAa,CAAA,KAAA,EAAO,YAAc,EAAA;AACzC,IAAM,MAAA,EAAE,IAAS,EAAA,GAAA,IAAA,EAAS,GAAA,KAAA,CAAA;AAC1B,IAAA,MAAM,EAAE,GAAA,EAAK,aAAe,EAAA,aAAA,KAC1BC,6BAAgC,EAAA,CAAA;AAClC,IAAM,MAAA,EAAE,YAAa,EAAA,GAAIC,YAAQ,EAAA,CAAA;AACjC,IAAM,MAAA,SAAA,GAAYC,eAAW,CAAA,GAAA,EAAK,YAAY,CAAA,CAAA;AAC9C,IAAA,MAAM,cAAiB,GAAAC,gCAAA;AAAA,MACrB,CAAC,YAAY,OAAQ,CAAA,cAAA;AAAA,KACvB,CAAA;AAEA,IAAM,MAAA,OAAA,GAAU,KAAK,MAAO,CAAA,CAAC,EAAE,KAAM,EAAA,KAAM,CAAC,cAAA,CAAe,KAAM,CAAA,CAAA,CAAA;AAEjE,IAAA,IAAI,CAAC,aAAA;AAAe,MAAO,OAAA,IAAA,CAAA;AAE3B,IAAA,uBACGC,cAAA,CAAAC,iBAAA,EAAA;AAAA,MACC,cAAY,CAAG,EAAA,aAAA,CAAA,UAAA,CAAA;AAAA,MACf,kCACGD,cAAA,CAAAE,WAAA,EAAA;AAAA,QAAO,YAAW,EAAA,WAAA;AAAA,QAAY,OAAQ,EAAA,WAAA;AAAA,QAAY,IAAK,EAAA,UAAA;AAAA,QACtD,QAAC,kBAAAF,cAAA,CAAA,YAAA,EAAA;AAAA,UAAa,aAAW,EAAA,IAAA;AAAA,UAAC,KAAA,EAAO,EAAE,MAAA,EAAQ,CAAE,EAAA;AAAA,SAAG,CAAA;AAAA,OAClD,CAAA;AAAA,MAEF,KAAM,EAAA,MAAA;AAAA,MACN,GAAK,EAAA,SAAA;AAAA,MACL,MAAQ,EAAA,OAAA;AAAA,MACR,QAAU,EAAA,IAAA;AAAA,MACT,GAAG,IAAA;AAAA,KACN,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
@@ -4,7 +4,6 @@ Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  var jsxRuntime = require('react/jsx-runtime');
6
6
  var core = require('@salt-ds/core');
7
- var icons = require('@salt-ds/icons');
8
7
  var styles = require('@salt-ds/styles');
9
8
  var window = require('@salt-ds/window');
10
9
  var clsx = require('clsx');
@@ -76,6 +75,7 @@ const TokenizedInputBase = react.forwardRef(function TokenizedInputBase2(props,
76
75
  window: targetWindow
77
76
  });
78
77
  const density = core.useDensity();
78
+ const { OverflowIcon, CloseIcon } = core.useIcon();
79
79
  const id = core.useId(idProp);
80
80
  const inputId = `${id}-input`;
81
81
  const expandButtonId = `${id}-expand-button`;
@@ -246,7 +246,7 @@ const TokenizedInputBase = react.forwardRef(function TokenizedInputBase2(props,
246
246
  ref: core.useForkRef(expandButtonRef, expandButtonRefProp),
247
247
  variant: "secondary",
248
248
  ...restExpandButtonProps,
249
- children: /* @__PURE__ */ jsxRuntime.jsx(icons.OverflowMenuIcon, {
249
+ children: /* @__PURE__ */ jsxRuntime.jsx(OverflowIcon, {
250
250
  "aria-label": expandButtonAccessibleText === void 0 ? "expand edit" : expandButtonAccessibleText
251
251
  })
252
252
  }),
@@ -284,7 +284,7 @@ const TokenizedInputBase = react.forwardRef(function TokenizedInputBase2(props,
284
284
  ref: clearButtonRef,
285
285
  variant: "secondary",
286
286
  "data-testid": "clear-button",
287
- children: /* @__PURE__ */ jsxRuntime.jsx(icons.CloseIcon, {
287
+ children: /* @__PURE__ */ jsxRuntime.jsx(CloseIcon, {
288
288
  "aria-label": "clear input"
289
289
  })
290
290
  })
@@ -1 +1 @@
1
- {"version":3,"file":"TokenizedInputBase.js","sources":["../src/tokenized-input/TokenizedInputBase.tsx"],"sourcesContent":["import {\n Button,\n type ButtonProps,\n makePrefixer,\n useDensity,\n useForkRef,\n useId,\n useIsomorphicLayoutEffect,\n} from \"@salt-ds/core\";\nimport { CloseIcon, OverflowMenuIcon } from \"@salt-ds/icons\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport deepmerge from \"deepmerge\";\nimport {\n type ChangeEventHandler,\n type FocusEvent,\n type FocusEventHandler,\n type ForwardedRef,\n type HTMLAttributes,\n type KeyboardEvent,\n type KeyboardEventHandler,\n type ReactElement,\n type ReactEventHandler,\n type Ref,\n type SyntheticEvent,\n forwardRef,\n useCallback,\n useRef,\n useState,\n} from \"react\";\nimport {\n InputLegacy as Input,\n type InputLegacyProps as InputProps,\n} from \"../input-legacy\";\nimport { InputPill } from \"./internal/InputPill\";\nimport { InputRuler } from \"./internal/InputRuler\";\nimport { calcFirstHiddenIndex } from \"./internal/calcFirstHiddenIndex\";\nimport { defaultItemToString } from \"./internal/defaultItemToString\";\nimport { useResizeObserver } from \"./internal/useResizeObserver\";\nimport { useWidth } from \"./internal/useWidth\";\nimport type {\n TokenizedInputHelpers,\n TokenizedInputState,\n} from \"./useTokenizedInput\";\n\nimport tokenizedInputCss from \"./TokenizedInput.css\";\n\nexport type RemoveItemHandler = (itemIndex: number) => void;\nexport type ItemToString<Item> = (item: Item) => string;\nexport type ExpandButtonProps = Pick<\n ButtonProps,\n \"role\" | \"aria-roledescription\" | \"aria-describedby\"\n> & { accessibleText?: string };\n\nexport interface TokenizedInputBaseProps<Item>\n extends Partial<TokenizedInputState<Item>>,\n Omit<\n HTMLAttributes<HTMLDivElement>,\n \"onFocus\" | \"onBlur\" | \"onChange\" | \"onKeyUp\" | \"onKeyDown\"\n > {\n ExpandButtonProps?: ExpandButtonProps;\n InputProps?: Pick<InputProps, \"aria-describedby\" | \"inputProps\">;\n disabled?: boolean;\n expandButtonRef?: Ref<HTMLButtonElement>;\n helpers: TokenizedInputHelpers<Item>;\n inputRef?: Ref<HTMLInputElement>;\n itemToString?: ItemToString<Item>;\n onFocus?: FocusEventHandler<HTMLInputElement | HTMLButtonElement>;\n onBlur?: FocusEventHandler<HTMLInputElement | HTMLButtonElement>;\n onKeyUp?: KeyboardEventHandler<HTMLInputElement>;\n // Can key down on either input or expand button\n onKeyDown?: KeyboardEventHandler<HTMLInputElement | HTMLButtonElement>;\n onRemoveItem?: RemoveItemHandler;\n onInputBlur?: FocusEventHandler<HTMLInputElement>;\n onInputFocus?: FocusEventHandler<HTMLInputElement>;\n onInputChange?: ChangeEventHandler<HTMLInputElement>;\n onInputSelect?: ReactEventHandler<HTMLInputElement>;\n onClick?: (event: SyntheticEvent<HTMLElement>) => void;\n onClear?: ReactEventHandler;\n}\n\nconst INITIAL_INPUT_WIDTH = 5;\nconst withBaseName = makePrefixer(\"saltTokenizedInput\");\n\nconst getItemsAriaLabel = (itemCount: number) =>\n itemCount === 0\n ? \"no item selected\"\n : `${itemCount} ${itemCount > 1 ? \"items\" : \"item\"}`;\n\nfunction hasHelpers<Item>(helpers: TokenizedInputHelpers<Item>) {\n if (process.env.NODE_ENV !== \"production\") {\n if (helpers == null) {\n console.warn(\n 'TokenizedInputBase is used without helpers. You should pass in \"helpers\" from \"useTokenizedInput\".',\n );\n }\n }\n return helpers != null;\n}\n\nexport const TokenizedInputBase = forwardRef(function TokenizedInputBase<Item>(\n props: TokenizedInputBaseProps<Item>,\n ref: ForwardedRef<HTMLDivElement>,\n) {\n const {\n InputProps = {},\n ExpandButtonProps = {},\n className,\n activeIndices = [],\n selectedItems = [],\n highlightedIndex,\n value,\n focused,\n expanded,\n disabled,\n helpers,\n onFocus,\n onBlur,\n onKeyUp,\n onKeyDown,\n onRemoveItem,\n onInputChange,\n onInputFocus,\n onInputBlur,\n onInputSelect,\n onClear,\n onClick,\n inputRef,\n itemToString = defaultItemToString,\n id: idProp,\n expandButtonRef: expandButtonRefProp,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n ...restProps\n } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-tokenized-input\",\n css: tokenizedInputCss,\n window: targetWindow,\n });\n\n const density = useDensity();\n\n const id = useId(idProp);\n const inputId = `${id}-input`;\n const expandButtonId = `${id}-expand-button`;\n const clearButtonId = `${id}-clear-button`;\n\n // TODO: Use proper machanism to get variable values from theme in React. Something like below\n // getComputedStyle(document.documentElement)\n // .getPropertyValue('--my-variable-name'); // #999999\n const pillGroupPadding = 16;\n const lastVisiblePillMargin = 4;\n\n const pillsRef = useRef<{ [index: number]: number | undefined }>({});\n const inputRulerRef = useRef<HTMLSpanElement | null>(null);\n const keydownExpandButton = useRef(false);\n\n const [expandButtonRef, expandButtonWidth] = useWidth(density);\n const [clearButtonRef, clearButtonWidth] = useWidth(density);\n const [inputWidth, setInputWidth] = useState(INITIAL_INPUT_WIDTH);\n const [pillGroupWidth, setPillGroupWidth] = useState<number | null>(null);\n const [firstHiddenIndex, setFirstHiddenIndex] = useState<number | null>(null);\n\n const showExpandButton = !expanded && firstHiddenIndex != null;\n\n const widthOffset =\n pillGroupPadding +\n INITIAL_INPUT_WIDTH +\n (expanded ? clearButtonWidth : expandButtonWidth);\n\n const containerRef = useResizeObserver<HTMLDivElement>(\n useCallback(\n ([{ contentRect }]) => {\n setPillGroupWidth(contentRect.width - widthOffset);\n },\n [widthOffset],\n ),\n );\n\n useIsomorphicLayoutEffect(\n () => () => {\n // When density changes, set hidden index to null so that pills are in their\n // readonly state before they are measured.\n setFirstHiddenIndex(null);\n },\n [density],\n );\n\n // useLayoutEffect because of potential layout change\n // We want to do that before paint to avoid layout jumps\n useIsomorphicLayoutEffect(\n () => {\n if (expanded) {\n setFirstHiddenIndex(null);\n } else if (pillGroupWidth != null) {\n setFirstHiddenIndex(\n calcFirstHiddenIndex({\n containerWidth: pillGroupWidth,\n pillWidths: Object.values(pillsRef.current).filter(\n Boolean,\n ) as number[],\n }),\n );\n }\n },\n // Additional dependency on selectedItems is for the controlled version\n [expanded, pillGroupWidth, selectedItems],\n );\n\n useIsomorphicLayoutEffect(() => {\n if (expanded && inputRulerRef.current) {\n const newInputWidth = inputRulerRef.current.scrollWidth;\n setInputWidth(Math.min(newInputWidth, pillGroupWidth || 0));\n }\n }, [expanded, pillGroupWidth, value]);\n\n const handleExpandButtonKeyDown = (\n event: KeyboardEvent<HTMLButtonElement>,\n ) => {\n const singleChar = event.key.length === 1;\n const triggerExpand =\n [\n \"CONTROL\",\n \"META\",\n \"ENTER\",\n \"BACKSPACE\",\n \"ARROWDOWN\",\n \"ARROWLEFT\",\n \"ARROWRIGHT\",\n ].indexOf(event.key.toUpperCase()) !== -1;\n\n if ((singleChar || triggerExpand) && hasHelpers(helpers)) {\n if (event.key === \"Enter\" || event.key === \" \") {\n event.preventDefault();\n event.stopPropagation();\n }\n helpers.updateExpanded(true);\n keydownExpandButton.current = true;\n }\n };\n\n const handleInputKeyUp = (event: KeyboardEvent<HTMLInputElement>) => {\n // Call keydown again if the initail event has been used to expand the input\n if (keydownExpandButton.current && \"Enter\" !== event.key) {\n keydownExpandButton.current = false;\n\n if (onKeyDown) {\n onKeyDown(event);\n }\n }\n\n if (onKeyUp) {\n onKeyUp(event);\n }\n };\n\n const handleExpand = (event: SyntheticEvent<HTMLButtonElement>) => {\n event.stopPropagation();\n\n if (hasHelpers(helpers)) {\n helpers.updateExpanded(true);\n }\n };\n\n const handleClearButtonFocus = (event: FocusEvent<HTMLButtonElement>) => {\n event.stopPropagation();\n\n if (hasHelpers(helpers)) {\n helpers.setFocused(false);\n helpers.cancelBlur();\n }\n };\n\n const selectedItemIds = selectedItems.map(\n (_, index) => `${id}-pill-${index}`,\n );\n\n const inputAriaLabelledBy = disabled\n ? [ariaLabelledBy, inputId, ...selectedItemIds]\n : [ariaLabelledBy, inputId];\n\n const mergedInputProps = deepmerge(\n {\n inputProps: {\n style: {\n width: inputWidth,\n minWidth: inputWidth,\n },\n \"aria-label\": [ariaLabel, getItemsAriaLabel(selectedItems.length)]\n .filter(Boolean)\n .join(\" \"),\n \"aria-labelledby\": inputAriaLabelledBy.filter(Boolean).join(\" \"),\n \"aria-activedescendant\":\n highlightedIndex && highlightedIndex >= 0\n ? `${id}-pill-${highlightedIndex}`\n : undefined,\n },\n },\n InputProps,\n );\n\n const {\n accessibleText: expandButtonAccessibleText,\n ...restExpandButtonProps\n } = ExpandButtonProps;\n\n return (\n <div\n {...restProps}\n className={clsx(\n withBaseName(),\n {\n [withBaseName(\"focused\")]: focused,\n [withBaseName(\"expanded\")]: expanded,\n [withBaseName(\"disabled\")]: disabled,\n },\n className,\n )}\n id={id}\n onClick={onClick}\n ref={useForkRef(ref, containerRef)}\n >\n <span\n aria-owns={selectedItemIds.join(\" \")}\n className={withBaseName(\"hidden\")}\n role=\"listbox\"\n />\n <div className={withBaseName(\"pillGroup\")}>\n {selectedItems.map((item, index) => {\n const label = itemToString(item);\n\n return (\n <InputPill\n active={activeIndices.indexOf(index) !== -1}\n disabled={disabled}\n hidden={showExpandButton && index >= firstHiddenIndex}\n highlighted={index === highlightedIndex}\n id={`${id}-pill-${index}`}\n index={index}\n key={`${index}-${label}`}\n label={label}\n lastVisible={\n !showExpandButton && index === selectedItems.length - 1\n }\n onDelete={expanded ? onRemoveItem : undefined}\n pillsRef={pillsRef}\n />\n );\n })}\n <Button\n aria-labelledby={[ariaLabelledBy, inputId, expandButtonId]\n .filter(Boolean)\n .join(\" \")}\n className={clsx(withBaseName(\"expandButton\"), {\n [withBaseName(\"hidden\")]: !showExpandButton,\n })}\n disabled={disabled}\n id={expandButtonId}\n onBlur={onBlur}\n onClick={handleExpand}\n onFocus={onFocus}\n onKeyDown={handleExpandButtonKeyDown}\n ref={useForkRef(expandButtonRef, expandButtonRefProp)}\n variant=\"secondary\"\n {...restExpandButtonProps}\n >\n <OverflowMenuIcon\n aria-label={\n expandButtonAccessibleText === undefined\n ? \"expand edit\"\n : expandButtonAccessibleText\n }\n />\n </Button>\n <Input\n {...mergedInputProps}\n className={clsx(withBaseName(\"input\"), withBaseName(\"inputField\"), {\n [withBaseName(\"hidden\")]: showExpandButton,\n })}\n disabled={disabled}\n id={inputId}\n // TODO: Use multi line input when available\n // multiline\n onBlur={onInputBlur}\n onChange={onInputChange}\n onFocus={onInputFocus}\n onKeyDown={onKeyDown}\n onKeyUp={handleInputKeyUp}\n onSelect={onInputSelect}\n renderSuffix={() => <InputRuler ref={inputRulerRef} value={value} />}\n value={value}\n ref={inputRef}\n />\n </div>\n <Button\n className={clsx(withBaseName(\"clearButton\"), {\n [withBaseName(\"hidden\")]: !expanded || selectedItems.length === 0,\n })}\n disabled={disabled}\n id={clearButtonId}\n onBlur={onBlur}\n onClick={onClear}\n onFocus={handleClearButtonFocus}\n ref={clearButtonRef}\n variant=\"secondary\"\n data-testid=\"clear-button\"\n >\n <CloseIcon aria-label=\"clear input\" />\n </Button>\n </div>\n );\n}) as <Item>(\n p: TokenizedInputBaseProps<Item> & { ref?: ForwardedRef<HTMLDivElement> },\n) => ReactElement<TokenizedInputBaseProps<Item>>;\n"],"names":["makePrefixer","forwardRef","TokenizedInputBase","defaultItemToString","useWindow","useComponentCssInjection","tokenizedInputCss","useDensity","useId","useRef","useWidth","useState","useResizeObserver","useCallback","useIsomorphicLayoutEffect","calcFirstHiddenIndex","deepmerge","jsxs","clsx","useForkRef","jsx","InputPill","Button","OverflowMenuIcon","Input","InputRuler","CloseIcon"],"mappings":"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"}
1
+ {"version":3,"file":"TokenizedInputBase.js","sources":["../src/tokenized-input/TokenizedInputBase.tsx"],"sourcesContent":["import {\n Button,\n type ButtonProps,\n makePrefixer,\n useDensity,\n useForkRef,\n useIcon,\n useId,\n useIsomorphicLayoutEffect,\n} from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport deepmerge from \"deepmerge\";\nimport {\n type ChangeEventHandler,\n type FocusEvent,\n type FocusEventHandler,\n type ForwardedRef,\n type HTMLAttributes,\n type KeyboardEvent,\n type KeyboardEventHandler,\n type ReactElement,\n type ReactEventHandler,\n type Ref,\n type SyntheticEvent,\n forwardRef,\n useCallback,\n useRef,\n useState,\n} from \"react\";\nimport {\n InputLegacy as Input,\n type InputLegacyProps as InputProps,\n} from \"../input-legacy\";\nimport { InputPill } from \"./internal/InputPill\";\nimport { InputRuler } from \"./internal/InputRuler\";\nimport { calcFirstHiddenIndex } from \"./internal/calcFirstHiddenIndex\";\nimport { defaultItemToString } from \"./internal/defaultItemToString\";\nimport { useResizeObserver } from \"./internal/useResizeObserver\";\nimport { useWidth } from \"./internal/useWidth\";\nimport type {\n TokenizedInputHelpers,\n TokenizedInputState,\n} from \"./useTokenizedInput\";\n\nimport tokenizedInputCss from \"./TokenizedInput.css\";\n\nexport type RemoveItemHandler = (itemIndex: number) => void;\nexport type ItemToString<Item> = (item: Item) => string;\nexport type ExpandButtonProps = Pick<\n ButtonProps,\n \"role\" | \"aria-roledescription\" | \"aria-describedby\"\n> & { accessibleText?: string };\n\nexport interface TokenizedInputBaseProps<Item>\n extends Partial<TokenizedInputState<Item>>,\n Omit<\n HTMLAttributes<HTMLDivElement>,\n \"onFocus\" | \"onBlur\" | \"onChange\" | \"onKeyUp\" | \"onKeyDown\"\n > {\n ExpandButtonProps?: ExpandButtonProps;\n InputProps?: Pick<InputProps, \"aria-describedby\" | \"inputProps\">;\n disabled?: boolean;\n expandButtonRef?: Ref<HTMLButtonElement>;\n helpers: TokenizedInputHelpers<Item>;\n inputRef?: Ref<HTMLInputElement>;\n itemToString?: ItemToString<Item>;\n onFocus?: FocusEventHandler<HTMLInputElement | HTMLButtonElement>;\n onBlur?: FocusEventHandler<HTMLInputElement | HTMLButtonElement>;\n onKeyUp?: KeyboardEventHandler<HTMLInputElement>;\n // Can key down on either input or expand button\n onKeyDown?: KeyboardEventHandler<HTMLInputElement | HTMLButtonElement>;\n onRemoveItem?: RemoveItemHandler;\n onInputBlur?: FocusEventHandler<HTMLInputElement>;\n onInputFocus?: FocusEventHandler<HTMLInputElement>;\n onInputChange?: ChangeEventHandler<HTMLInputElement>;\n onInputSelect?: ReactEventHandler<HTMLInputElement>;\n onClick?: (event: SyntheticEvent<HTMLElement>) => void;\n onClear?: ReactEventHandler;\n}\n\nconst INITIAL_INPUT_WIDTH = 5;\nconst withBaseName = makePrefixer(\"saltTokenizedInput\");\n\nconst getItemsAriaLabel = (itemCount: number) =>\n itemCount === 0\n ? \"no item selected\"\n : `${itemCount} ${itemCount > 1 ? \"items\" : \"item\"}`;\n\nfunction hasHelpers<Item>(helpers: TokenizedInputHelpers<Item>) {\n if (process.env.NODE_ENV !== \"production\") {\n if (helpers == null) {\n console.warn(\n 'TokenizedInputBase is used without helpers. You should pass in \"helpers\" from \"useTokenizedInput\".',\n );\n }\n }\n return helpers != null;\n}\n\nexport const TokenizedInputBase = forwardRef(function TokenizedInputBase<Item>(\n props: TokenizedInputBaseProps<Item>,\n ref: ForwardedRef<HTMLDivElement>,\n) {\n const {\n InputProps = {},\n ExpandButtonProps = {},\n className,\n activeIndices = [],\n selectedItems = [],\n highlightedIndex,\n value,\n focused,\n expanded,\n disabled,\n helpers,\n onFocus,\n onBlur,\n onKeyUp,\n onKeyDown,\n onRemoveItem,\n onInputChange,\n onInputFocus,\n onInputBlur,\n onInputSelect,\n onClear,\n onClick,\n inputRef,\n itemToString = defaultItemToString,\n id: idProp,\n expandButtonRef: expandButtonRefProp,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n ...restProps\n } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-tokenized-input\",\n css: tokenizedInputCss,\n window: targetWindow,\n });\n\n const density = useDensity();\n const { OverflowIcon, CloseIcon } = useIcon();\n const id = useId(idProp);\n const inputId = `${id}-input`;\n const expandButtonId = `${id}-expand-button`;\n const clearButtonId = `${id}-clear-button`;\n\n // TODO: Use proper machanism to get variable values from theme in React. Something like below\n // getComputedStyle(document.documentElement)\n // .getPropertyValue('--my-variable-name'); // #999999\n const pillGroupPadding = 16;\n const lastVisiblePillMargin = 4;\n\n const pillsRef = useRef<{ [index: number]: number | undefined }>({});\n const inputRulerRef = useRef<HTMLSpanElement | null>(null);\n const keydownExpandButton = useRef(false);\n\n const [expandButtonRef, expandButtonWidth] = useWidth(density);\n const [clearButtonRef, clearButtonWidth] = useWidth(density);\n const [inputWidth, setInputWidth] = useState(INITIAL_INPUT_WIDTH);\n const [pillGroupWidth, setPillGroupWidth] = useState<number | null>(null);\n const [firstHiddenIndex, setFirstHiddenIndex] = useState<number | null>(null);\n\n const showExpandButton = !expanded && firstHiddenIndex != null;\n\n const widthOffset =\n pillGroupPadding +\n INITIAL_INPUT_WIDTH +\n (expanded ? clearButtonWidth : expandButtonWidth);\n\n const containerRef = useResizeObserver<HTMLDivElement>(\n useCallback(\n ([{ contentRect }]) => {\n setPillGroupWidth(contentRect.width - widthOffset);\n },\n [widthOffset],\n ),\n );\n\n useIsomorphicLayoutEffect(\n () => () => {\n // When density changes, set hidden index to null so that pills are in their\n // readonly state before they are measured.\n setFirstHiddenIndex(null);\n },\n [density],\n );\n\n // useLayoutEffect because of potential layout change\n // We want to do that before paint to avoid layout jumps\n useIsomorphicLayoutEffect(\n () => {\n if (expanded) {\n setFirstHiddenIndex(null);\n } else if (pillGroupWidth != null) {\n setFirstHiddenIndex(\n calcFirstHiddenIndex({\n containerWidth: pillGroupWidth,\n pillWidths: Object.values(pillsRef.current).filter(\n Boolean,\n ) as number[],\n }),\n );\n }\n },\n // Additional dependency on selectedItems is for the controlled version\n [expanded, pillGroupWidth, selectedItems],\n );\n\n useIsomorphicLayoutEffect(() => {\n if (expanded && inputRulerRef.current) {\n const newInputWidth = inputRulerRef.current.scrollWidth;\n setInputWidth(Math.min(newInputWidth, pillGroupWidth || 0));\n }\n }, [expanded, pillGroupWidth, value]);\n\n const handleExpandButtonKeyDown = (\n event: KeyboardEvent<HTMLButtonElement>,\n ) => {\n const singleChar = event.key.length === 1;\n const triggerExpand =\n [\n \"CONTROL\",\n \"META\",\n \"ENTER\",\n \"BACKSPACE\",\n \"ARROWDOWN\",\n \"ARROWLEFT\",\n \"ARROWRIGHT\",\n ].indexOf(event.key.toUpperCase()) !== -1;\n\n if ((singleChar || triggerExpand) && hasHelpers(helpers)) {\n if (event.key === \"Enter\" || event.key === \" \") {\n event.preventDefault();\n event.stopPropagation();\n }\n helpers.updateExpanded(true);\n keydownExpandButton.current = true;\n }\n };\n\n const handleInputKeyUp = (event: KeyboardEvent<HTMLInputElement>) => {\n // Call keydown again if the initail event has been used to expand the input\n if (keydownExpandButton.current && \"Enter\" !== event.key) {\n keydownExpandButton.current = false;\n\n if (onKeyDown) {\n onKeyDown(event);\n }\n }\n\n if (onKeyUp) {\n onKeyUp(event);\n }\n };\n\n const handleExpand = (event: SyntheticEvent<HTMLButtonElement>) => {\n event.stopPropagation();\n\n if (hasHelpers(helpers)) {\n helpers.updateExpanded(true);\n }\n };\n\n const handleClearButtonFocus = (event: FocusEvent<HTMLButtonElement>) => {\n event.stopPropagation();\n\n if (hasHelpers(helpers)) {\n helpers.setFocused(false);\n helpers.cancelBlur();\n }\n };\n\n const selectedItemIds = selectedItems.map(\n (_, index) => `${id}-pill-${index}`,\n );\n\n const inputAriaLabelledBy = disabled\n ? [ariaLabelledBy, inputId, ...selectedItemIds]\n : [ariaLabelledBy, inputId];\n\n const mergedInputProps = deepmerge(\n {\n inputProps: {\n style: {\n width: inputWidth,\n minWidth: inputWidth,\n },\n \"aria-label\": [ariaLabel, getItemsAriaLabel(selectedItems.length)]\n .filter(Boolean)\n .join(\" \"),\n \"aria-labelledby\": inputAriaLabelledBy.filter(Boolean).join(\" \"),\n \"aria-activedescendant\":\n highlightedIndex && highlightedIndex >= 0\n ? `${id}-pill-${highlightedIndex}`\n : undefined,\n },\n },\n InputProps,\n );\n\n const {\n accessibleText: expandButtonAccessibleText,\n ...restExpandButtonProps\n } = ExpandButtonProps;\n\n return (\n <div\n {...restProps}\n className={clsx(\n withBaseName(),\n {\n [withBaseName(\"focused\")]: focused,\n [withBaseName(\"expanded\")]: expanded,\n [withBaseName(\"disabled\")]: disabled,\n },\n className,\n )}\n id={id}\n onClick={onClick}\n ref={useForkRef(ref, containerRef)}\n >\n <span\n aria-owns={selectedItemIds.join(\" \")}\n className={withBaseName(\"hidden\")}\n role=\"listbox\"\n />\n <div className={withBaseName(\"pillGroup\")}>\n {selectedItems.map((item, index) => {\n const label = itemToString(item);\n\n return (\n <InputPill\n active={activeIndices.indexOf(index) !== -1}\n disabled={disabled}\n hidden={showExpandButton && index >= firstHiddenIndex}\n highlighted={index === highlightedIndex}\n id={`${id}-pill-${index}`}\n index={index}\n key={`${index}-${label}`}\n label={label}\n lastVisible={\n !showExpandButton && index === selectedItems.length - 1\n }\n onDelete={expanded ? onRemoveItem : undefined}\n pillsRef={pillsRef}\n />\n );\n })}\n <Button\n aria-labelledby={[ariaLabelledBy, inputId, expandButtonId]\n .filter(Boolean)\n .join(\" \")}\n className={clsx(withBaseName(\"expandButton\"), {\n [withBaseName(\"hidden\")]: !showExpandButton,\n })}\n disabled={disabled}\n id={expandButtonId}\n onBlur={onBlur}\n onClick={handleExpand}\n onFocus={onFocus}\n onKeyDown={handleExpandButtonKeyDown}\n ref={useForkRef(expandButtonRef, expandButtonRefProp)}\n variant=\"secondary\"\n {...restExpandButtonProps}\n >\n <OverflowIcon\n aria-label={\n expandButtonAccessibleText === undefined\n ? \"expand edit\"\n : expandButtonAccessibleText\n }\n />\n </Button>\n <Input\n {...mergedInputProps}\n className={clsx(withBaseName(\"input\"), withBaseName(\"inputField\"), {\n [withBaseName(\"hidden\")]: showExpandButton,\n })}\n disabled={disabled}\n id={inputId}\n // TODO: Use multi line input when available\n // multiline\n onBlur={onInputBlur}\n onChange={onInputChange}\n onFocus={onInputFocus}\n onKeyDown={onKeyDown}\n onKeyUp={handleInputKeyUp}\n onSelect={onInputSelect}\n renderSuffix={() => <InputRuler ref={inputRulerRef} value={value} />}\n value={value}\n ref={inputRef}\n />\n </div>\n <Button\n className={clsx(withBaseName(\"clearButton\"), {\n [withBaseName(\"hidden\")]: !expanded || selectedItems.length === 0,\n })}\n disabled={disabled}\n id={clearButtonId}\n onBlur={onBlur}\n onClick={onClear}\n onFocus={handleClearButtonFocus}\n ref={clearButtonRef}\n variant=\"secondary\"\n data-testid=\"clear-button\"\n >\n <CloseIcon aria-label=\"clear input\" />\n </Button>\n </div>\n );\n}) as <Item>(\n p: TokenizedInputBaseProps<Item> & { ref?: ForwardedRef<HTMLDivElement> },\n) => ReactElement<TokenizedInputBaseProps<Item>>;\n"],"names":["makePrefixer","forwardRef","TokenizedInputBase","defaultItemToString","useWindow","useComponentCssInjection","tokenizedInputCss","useDensity","useIcon","useId","useRef","useWidth","useState","useResizeObserver","useCallback","useIsomorphicLayoutEffect","calcFirstHiddenIndex","deepmerge","jsxs","clsx","useForkRef","jsx","InputPill","Button","Input","InputRuler"],"mappings":"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"}
@@ -4,7 +4,6 @@ Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  var jsxRuntime = require('react/jsx-runtime');
6
6
  var core = require('@salt-ds/core');
7
- var icons = require('@salt-ds/icons');
8
7
  var clsx = require('clsx');
9
8
  var react = require('react');
10
9
  var useWidth = require('./useWidth.js');
@@ -26,6 +25,7 @@ const InputPill = react.memo(function InputPill2(props) {
26
25
  } = props;
27
26
  const ref = react.useRef(null);
28
27
  const isRemovable = Boolean(onDelete);
28
+ const { CloseIcon } = core.useIcon();
29
29
  core.useIsomorphicLayoutEffect(() => {
30
30
  if (!isRemovable && pillsRef.current) {
31
31
  pillsRef.current[index] = useWidth.getWidth(ref.current);
@@ -61,7 +61,7 @@ const InputPill = react.memo(function InputPill2(props) {
61
61
  className: withBaseName("label"),
62
62
  children: label
63
63
  }),
64
- isRemovable && /* @__PURE__ */ jsxRuntime.jsx(icons.CloseIcon, {})
64
+ isRemovable && /* @__PURE__ */ jsxRuntime.jsx(CloseIcon, {})
65
65
  ]
66
66
  });
67
67
  });
@@ -1 +1 @@
1
- {"version":3,"file":"InputPill.js","sources":["../src/tokenized-input/internal/InputPill.tsx"],"sourcesContent":["import {\n Pill,\n type PillProps,\n makePrefixer,\n useIsomorphicLayoutEffect,\n} from \"@salt-ds/core\";\nimport { CloseIcon } from \"@salt-ds/icons\";\nimport { clsx } from \"clsx\";\nimport { type MutableRefObject, memo, useRef } from \"react\";\nimport { getWidth } from \"./useWidth\";\n\nconst withBaseName = makePrefixer(\"saltInputPill\");\n\nexport type InputPillProps = PillProps & {\n /**\n * An ref object holds pills index map to width.\n */\n pillsRef: MutableRefObject<Record<number, number | undefined>>;\n /**\n * Index of the pill within Input.\n */\n index: number;\n /**\n * Pill label.\n */\n label?: string;\n /**\n * Whether the pill is the last visible one within Input.\n */\n lastVisible?: boolean;\n /**\n * Whether the pill is highlighted.\n */\n highlighted?: boolean;\n /**\n * Whether the pill is active.\n */\n active?: boolean;\n /**\n * Callback when pill is deleted.\n */\n onDelete?: (index: number) => void;\n};\n\nexport const InputPill = memo(function InputPill(props: InputPillProps) {\n const {\n active,\n className,\n disabled,\n hidden,\n highlighted,\n index,\n label,\n lastVisible,\n onDelete,\n pillsRef,\n ...restProps\n } = props;\n\n const ref = useRef<HTMLButtonElement | null>(null);\n const isRemovable = Boolean(onDelete);\n\n // useLayoutEffect to match the calcFirstHiddenIndex in TokenizedInputBase\n // We need to collect widths before the calculation\n useIsomorphicLayoutEffect(() => {\n if (!isRemovable && pillsRef.current) {\n pillsRef.current[index] = getWidth(ref.current);\n }\n }, [pillsRef, index, isRemovable, lastVisible]);\n\n useIsomorphicLayoutEffect(\n () => () => {\n pillsRef.current[index] = undefined;\n },\n [pillsRef, index],\n );\n\n const handleDelete = () => {\n onDelete?.(index);\n };\n\n return (\n <Pill\n className={clsx(\n withBaseName(),\n {\n [withBaseName(\"pillActive\")]: active || highlighted,\n [withBaseName(\"pillLastVisible\")]: lastVisible,\n [withBaseName(\"hidden\")]: hidden,\n },\n className,\n )}\n disabled={disabled}\n tabIndex={-1}\n onClick={isRemovable ? handleDelete : undefined}\n ref={ref}\n role=\"option\"\n // style={useMemo(() => ({ maxWidth }), [maxWidth])}\n {...restProps}\n >\n <span className={withBaseName(\"label\")}>{label}</span>\n {isRemovable && <CloseIcon />}\n </Pill>\n );\n});\n"],"names":["makePrefixer","memo","InputPill","useRef","useIsomorphicLayoutEffect","getWidth","jsxs","Pill","clsx","jsx","CloseIcon"],"mappings":";;;;;;;;;;;AAWA,MAAM,YAAA,GAAeA,kBAAa,eAAe,CAAA,CAAA;AAiC1C,MAAM,SAAY,GAAAC,UAAA,CAAK,SAASC,UAAAA,CAAU,KAAuB,EAAA;AACtE,EAAM,MAAA;AAAA,IACJ,MAAA;AAAA,IACA,SAAA;AAAA,IACA,QAAA;AAAA,IACA,MAAA;AAAA,IACA,WAAA;AAAA,IACA,KAAA;AAAA,IACA,KAAA;AAAA,IACA,WAAA;AAAA,IACA,QAAA;AAAA,IACA,QAAA;AAAA,IACG,GAAA,SAAA;AAAA,GACD,GAAA,KAAA,CAAA;AAEJ,EAAM,MAAA,GAAA,GAAMC,aAAiC,IAAI,CAAA,CAAA;AACjD,EAAM,MAAA,WAAA,GAAc,QAAQ,QAAQ,CAAA,CAAA;AAIpC,EAAAC,8BAAA,CAA0B,MAAM;AAC9B,IAAI,IAAA,CAAC,WAAe,IAAA,QAAA,CAAS,OAAS,EAAA;AACpC,MAAA,QAAA,CAAS,OAAQ,CAAA,KAAA,CAAA,GAASC,iBAAS,CAAA,GAAA,CAAI,OAAO,CAAA,CAAA;AAAA,KAChD;AAAA,KACC,CAAC,QAAA,EAAU,KAAO,EAAA,WAAA,EAAa,WAAW,CAAC,CAAA,CAAA;AAE9C,EAAAD,8BAAA;AAAA,IACE,MAAM,MAAM;AACV,MAAA,QAAA,CAAS,QAAQ,KAAS,CAAA,GAAA,KAAA,CAAA,CAAA;AAAA,KAC5B;AAAA,IACA,CAAC,UAAU,KAAK,CAAA;AAAA,GAClB,CAAA;AAEA,EAAA,MAAM,eAAe,MAAM;AACzB,IAAW,QAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,QAAA,CAAA,KAAA,CAAA,CAAA;AAAA,GACb,CAAA;AAEA,EAAA,uBACGE,eAAA,CAAAC,SAAA,EAAA;AAAA,IACC,SAAW,EAAAC,SAAA;AAAA,MACT,YAAa,EAAA;AAAA,MACb;AAAA,QACE,CAAC,YAAA,CAAa,YAAY,CAAA,GAAI,MAAU,IAAA,WAAA;AAAA,QACxC,CAAC,YAAa,CAAA,iBAAiB,CAAI,GAAA,WAAA;AAAA,QACnC,CAAC,YAAa,CAAA,QAAQ,CAAI,GAAA,MAAA;AAAA,OAC5B;AAAA,MACA,SAAA;AAAA,KACF;AAAA,IACA,QAAA;AAAA,IACA,QAAU,EAAA,CAAA,CAAA;AAAA,IACV,OAAA,EAAS,cAAc,YAAe,GAAA,KAAA,CAAA;AAAA,IACtC,GAAA;AAAA,IACA,IAAK,EAAA,QAAA;AAAA,IAEJ,GAAG,SAAA;AAAA,IAEJ,QAAA,EAAA;AAAA,sBAACC,cAAA,CAAA,MAAA,EAAA;AAAA,QAAK,SAAA,EAAW,aAAa,OAAO,CAAA;AAAA,QAAI,QAAA,EAAA,KAAA;AAAA,OAAM,CAAA;AAAA,MAC9C,WAAA,mCAAgBC,eAAU,EAAA,EAAA,CAAA;AAAA,KAAA;AAAA,GAC7B,CAAA,CAAA;AAEJ,CAAC;;;;"}
1
+ {"version":3,"file":"InputPill.js","sources":["../src/tokenized-input/internal/InputPill.tsx"],"sourcesContent":["import {\n Pill,\n type PillProps,\n makePrefixer,\n useIcon,\n useIsomorphicLayoutEffect,\n} from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport { type MutableRefObject, memo, useRef } from \"react\";\nimport { getWidth } from \"./useWidth\";\n\nconst withBaseName = makePrefixer(\"saltInputPill\");\n\nexport type InputPillProps = PillProps & {\n /**\n * An ref object holds pills index map to width.\n */\n pillsRef: MutableRefObject<Record<number, number | undefined>>;\n /**\n * Index of the pill within Input.\n */\n index: number;\n /**\n * Pill label.\n */\n label?: string;\n /**\n * Whether the pill is the last visible one within Input.\n */\n lastVisible?: boolean;\n /**\n * Whether the pill is highlighted.\n */\n highlighted?: boolean;\n /**\n * Whether the pill is active.\n */\n active?: boolean;\n /**\n * Callback when pill is deleted.\n */\n onDelete?: (index: number) => void;\n};\n\nexport const InputPill = memo(function InputPill(props: InputPillProps) {\n const {\n active,\n className,\n disabled,\n hidden,\n highlighted,\n index,\n label,\n lastVisible,\n onDelete,\n pillsRef,\n ...restProps\n } = props;\n\n const ref = useRef<HTMLButtonElement | null>(null);\n const isRemovable = Boolean(onDelete);\n const { CloseIcon } = useIcon();\n // useLayoutEffect to match the calcFirstHiddenIndex in TokenizedInputBase\n // We need to collect widths before the calculation\n useIsomorphicLayoutEffect(() => {\n if (!isRemovable && pillsRef.current) {\n pillsRef.current[index] = getWidth(ref.current);\n }\n }, [pillsRef, index, isRemovable, lastVisible]);\n\n useIsomorphicLayoutEffect(\n () => () => {\n pillsRef.current[index] = undefined;\n },\n [pillsRef, index],\n );\n\n const handleDelete = () => {\n onDelete?.(index);\n };\n\n return (\n <Pill\n className={clsx(\n withBaseName(),\n {\n [withBaseName(\"pillActive\")]: active || highlighted,\n [withBaseName(\"pillLastVisible\")]: lastVisible,\n [withBaseName(\"hidden\")]: hidden,\n },\n className,\n )}\n disabled={disabled}\n tabIndex={-1}\n onClick={isRemovable ? handleDelete : undefined}\n ref={ref}\n role=\"option\"\n // style={useMemo(() => ({ maxWidth }), [maxWidth])}\n {...restProps}\n >\n <span className={withBaseName(\"label\")}>{label}</span>\n {isRemovable && <CloseIcon />}\n </Pill>\n );\n});\n"],"names":["makePrefixer","memo","InputPill","useRef","useIcon","useIsomorphicLayoutEffect","getWidth","jsxs","Pill","clsx","jsx"],"mappings":";;;;;;;;;;AAWA,MAAM,YAAA,GAAeA,kBAAa,eAAe,CAAA,CAAA;AAiC1C,MAAM,SAAY,GAAAC,UAAA,CAAK,SAASC,UAAAA,CAAU,KAAuB,EAAA;AACtE,EAAM,MAAA;AAAA,IACJ,MAAA;AAAA,IACA,SAAA;AAAA,IACA,QAAA;AAAA,IACA,MAAA;AAAA,IACA,WAAA;AAAA,IACA,KAAA;AAAA,IACA,KAAA;AAAA,IACA,WAAA;AAAA,IACA,QAAA;AAAA,IACA,QAAA;AAAA,IACG,GAAA,SAAA;AAAA,GACD,GAAA,KAAA,CAAA;AAEJ,EAAM,MAAA,GAAA,GAAMC,aAAiC,IAAI,CAAA,CAAA;AACjD,EAAM,MAAA,WAAA,GAAc,QAAQ,QAAQ,CAAA,CAAA;AACpC,EAAM,MAAA,EAAE,SAAU,EAAA,GAAIC,YAAQ,EAAA,CAAA;AAG9B,EAAAC,8BAAA,CAA0B,MAAM;AAC9B,IAAI,IAAA,CAAC,WAAe,IAAA,QAAA,CAAS,OAAS,EAAA;AACpC,MAAA,QAAA,CAAS,OAAQ,CAAA,KAAA,CAAA,GAASC,iBAAS,CAAA,GAAA,CAAI,OAAO,CAAA,CAAA;AAAA,KAChD;AAAA,KACC,CAAC,QAAA,EAAU,KAAO,EAAA,WAAA,EAAa,WAAW,CAAC,CAAA,CAAA;AAE9C,EAAAD,8BAAA;AAAA,IACE,MAAM,MAAM;AACV,MAAA,QAAA,CAAS,QAAQ,KAAS,CAAA,GAAA,KAAA,CAAA,CAAA;AAAA,KAC5B;AAAA,IACA,CAAC,UAAU,KAAK,CAAA;AAAA,GAClB,CAAA;AAEA,EAAA,MAAM,eAAe,MAAM;AACzB,IAAW,QAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,QAAA,CAAA,KAAA,CAAA,CAAA;AAAA,GACb,CAAA;AAEA,EAAA,uBACGE,eAAA,CAAAC,SAAA,EAAA;AAAA,IACC,SAAW,EAAAC,SAAA;AAAA,MACT,YAAa,EAAA;AAAA,MACb;AAAA,QACE,CAAC,YAAA,CAAa,YAAY,CAAA,GAAI,MAAU,IAAA,WAAA;AAAA,QACxC,CAAC,YAAa,CAAA,iBAAiB,CAAI,GAAA,WAAA;AAAA,QACnC,CAAC,YAAa,CAAA,QAAQ,CAAI,GAAA,MAAA;AAAA,OAC5B;AAAA,MACA,SAAA;AAAA,KACF;AAAA,IACA,QAAA;AAAA,IACA,QAAU,EAAA,CAAA,CAAA;AAAA,IACV,OAAA,EAAS,cAAc,YAAe,GAAA,KAAA,CAAA;AAAA,IACtC,GAAA;AAAA,IACA,IAAK,EAAA,QAAA;AAAA,IAEJ,GAAG,SAAA;AAAA,IAEJ,QAAA,EAAA;AAAA,sBAACC,cAAA,CAAA,MAAA,EAAA;AAAA,QAAK,SAAA,EAAW,aAAa,OAAO,CAAA;AAAA,QAAI,QAAA,EAAA,KAAA;AAAA,OAAM,CAAA;AAAA,MAC9C,WAAA,mCAAgB,SAAU,EAAA,EAAA,CAAA;AAAA,KAAA;AAAA,GAC7B,CAAA,CAAA;AAEJ,CAAC;;;;"}
@@ -4,7 +4,6 @@ Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  var jsxRuntime = require('react/jsx-runtime');
6
6
  var core = require('@salt-ds/core');
7
- var icons = require('@salt-ds/icons');
8
7
  var styles = require('@salt-ds/styles');
9
8
  var window = require('@salt-ds/window');
10
9
  var clsx = require('clsx');
@@ -71,6 +70,7 @@ const TokenizedInputNext = react.forwardRef(function TokenizedInputNext2({
71
70
  "aria-describedby": ariaDescribedBy,
72
71
  ...restProps
73
72
  } = inputProps;
73
+ const { OverflowIcon, CloseIcon } = core.useIcon();
74
74
  const id = core.useId(idProp);
75
75
  const inputId = `${id}-input`;
76
76
  const expandButtonId = `${id}-expand-button`;
@@ -209,7 +209,7 @@ const TokenizedInputNext = react.forwardRef(function TokenizedInputNext2({
209
209
  variant: "secondary",
210
210
  "data-testid": "clear-button",
211
211
  "aria-label": "clear input",
212
- children: /* @__PURE__ */ jsxRuntime.jsx(icons.CloseIcon, {
212
+ children: /* @__PURE__ */ jsxRuntime.jsx(CloseIcon, {
213
213
  "aria-hidden": true
214
214
  })
215
215
  }),
@@ -227,7 +227,7 @@ const TokenizedInputNext = react.forwardRef(function TokenizedInputNext2({
227
227
  variant: "secondary",
228
228
  "data-testid": "expand-button",
229
229
  ...restExpandButtonProps,
230
- children: /* @__PURE__ */ jsxRuntime.jsx(icons.OverflowMenuIcon, {})
230
+ children: /* @__PURE__ */ jsxRuntime.jsx(OverflowIcon, {})
231
231
  })
232
232
  ]
233
233
  }),
@@ -1 +1 @@
1
- {"version":3,"file":"TokenizedInputNext.js","sources":["../src/tokenized-input-next/TokenizedInputNext.tsx"],"sourcesContent":["import {\n type AdornmentValidationStatus,\n Button,\n type ButtonProps,\n type NecessityType,\n StatusAdornment,\n type ValidationStatus,\n makePrefixer,\n useForkRef,\n useId,\n} from \"@salt-ds/core\";\nimport { CloseIcon, OverflowMenuIcon } from \"@salt-ds/icons\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type ChangeEventHandler,\n type FocusEvent,\n type FocusEventHandler,\n type ForwardedRef,\n type HTMLAttributes,\n type KeyboardEvent,\n type KeyboardEventHandler,\n type ReactEventHandler,\n type Ref,\n type SyntheticEvent,\n type TextareaHTMLAttributes,\n forwardRef,\n useRef,\n} from \"react\";\nimport tokenizedInputCss from \"./TokenizedInputNext.css\";\nimport { InputPill } from \"./internal/InputPill\";\nimport {\n type TokenizedInputNextHelpers,\n type TokenizedInputNextState,\n useTokenizedInputNext,\n} from \"./useTokenizedInputNext\";\n\ntype ChangeHandler<Item> = (\n event: SyntheticEvent,\n selectedItems: Item[] | undefined,\n) => void;\n\ntype ExpandButtonProps = Pick<\n ButtonProps,\n \"role\" | \"aria-roledescription\" | \"aria-describedby\"\n> & { \"aria-label\"?: string };\n\nexport interface TokenizedInputNextProps<Item>\n extends Partial<TokenizedInputNextState<Item>>,\n Omit<\n HTMLAttributes<HTMLDivElement>,\n \"onFocus\" | \"onBlur\" | \"onChange\" | \"onKeyUp\" | \"onKeyDown\"\n > {\n ExpandButtonProps?: ExpandButtonProps;\n disabled?: boolean;\n focused?: boolean;\n expandButtonRef?: Ref<HTMLButtonElement>;\n onBlur?: FocusEventHandler<HTMLTextAreaElement | HTMLButtonElement>;\n onKeyUp?: KeyboardEventHandler<HTMLTextAreaElement | HTMLButtonElement>;\n // Can key down on either input or expand button\n onKeyDown?: KeyboardEventHandler<HTMLTextAreaElement | HTMLButtonElement>;\n onRemoveItem?: (event: SyntheticEvent, index: number) => void;\n onInputBlur?: FocusEventHandler<HTMLTextAreaElement>;\n onInputFocus?: FocusEventHandler<HTMLTextAreaElement>;\n onInputChange?: ChangeEventHandler<HTMLTextAreaElement>;\n onClick?: ReactEventHandler;\n onClear?: ReactEventHandler;\n delimiters?: string[];\n disableAddOnBlur?: boolean;\n defaultSelected?: Item[];\n onChange?: ChangeHandler<Item>;\n onCollapse?: ReactEventHandler;\n onExpand?: ReactEventHandler;\n\n /// from input\n /**\n * Validation status.\n */\n validationStatus?: Omit<ValidationStatus, \"info\">;\n /**\n * If `true`, the component is read only.\n */\n readOnly?: boolean;\n /**\n * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#Attributes) applied to the `textarea` element.\n */\n textAreaProps?: TextareaHTMLAttributes<HTMLTextAreaElement>;\n /**\n * Optional ref for the textarea component\n */\n textAreaRef?: Ref<HTMLTextAreaElement>;\n necessity?: NecessityType;\n /**\n * Styling variant. Defaults to \"primary\".\n */\n variant?: \"primary\" | \"secondary\";\n}\n\nconst withBaseName = makePrefixer(\"saltTokenizedInputNext\");\n\nconst getItemsAriaLabel = (itemCount: number) =>\n itemCount === 0\n ? \"no item selected\"\n : `${itemCount} ${itemCount > 1 ? \"items\" : \"item\"}`;\n\nexport const TokenizedInputNext = forwardRef(function TokenizedInputNext<Item>(\n {\n textAreaRef: textAreaRefProp,\n textAreaProps = {},\n variant = \"primary\",\n ...rest\n }: TokenizedInputNextProps<Item>,\n ref: ForwardedRef<HTMLDivElement>,\n) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-tokenized-input-next\",\n css: tokenizedInputCss,\n window: targetWindow,\n });\n const {\n \"aria-describedby\": textAreaDescribedBy,\n \"aria-labelledby\": textAreaLabelledBy,\n required: textAreaRequired,\n ...restTextAreaProps\n } = textAreaProps;\n\n const { refs, helpers, inputProps, firstHiddenIndex } =\n useTokenizedInputNext(rest);\n\n const {\n textAreaRef: textAreaHookRef,\n pillsRef,\n clearButtonRef,\n expandButtonRef,\n statusAdornmentRef,\n containerRef: containerHookRef,\n } = refs;\n\n const {\n ExpandButtonProps = {\n \"aria-label\": \"expand edit\",\n },\n className,\n activeIndices = [],\n selectedItems = [],\n highlightedIndex,\n value,\n expanded,\n disabled,\n onBlur,\n onKeyDown,\n onRemoveItem,\n onInputChange,\n focused,\n validationStatus,\n readOnly,\n onInputFocus,\n onInputBlur,\n onClear,\n onClick,\n onKeyUp,\n id: idProp,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-describedby\": ariaDescribedBy,\n ...restProps\n } = inputProps;\n\n const id = useId(idProp);\n const inputId = `${id}-input`;\n const expandButtonId = `${id}-expand-button`;\n const clearButtonId = `${id}-clear-button`;\n\n const keydownExpandButton = useRef(false);\n const containerRef = useForkRef(ref, containerHookRef);\n const textAreaRef = useForkRef(textAreaHookRef, textAreaRefProp);\n const showExpandButton = !expanded && firstHiddenIndex != null;\n\n const hasHelpers = (helpers: TokenizedInputNextHelpers<Item>) => {\n if (process.env.NODE_ENV !== \"production\") {\n if (helpers == null) {\n console.warn(\n 'TokenizedInputNext is used without helpers. You should pass in \"helpers\" from \"useTokenizedInputNext\".',\n );\n }\n }\n return helpers != null;\n };\n\n const handleExpandButtonKeyDown = (\n event: KeyboardEvent<HTMLButtonElement>,\n ) => {\n const singleChar = event.key.length === 1;\n const triggerExpand =\n [\n \"CONTROL\",\n \"META\",\n \"ENTER\",\n \"BACKSPACE\",\n \"ARROWDOWN\",\n \"ARROWLEFT\",\n \"ARROWRIGHT\",\n ].indexOf(event.key.toUpperCase()) !== -1;\n\n if ((singleChar || triggerExpand) && hasHelpers(helpers)) {\n if (event.key === \"Enter\" || event.key === \" \") {\n event.preventDefault();\n event.stopPropagation();\n }\n helpers.updateExpanded(event, true);\n keydownExpandButton.current = true;\n }\n };\n\n const handleInputKeyUp = (\n event: KeyboardEvent<HTMLButtonElement | HTMLTextAreaElement>,\n ) => {\n // Call keydown again if the initial event has been used to expand the input\n if (keydownExpandButton.current && \"Enter\" !== event.key) {\n keydownExpandButton.current = false;\n onKeyDown?.(event);\n }\n onKeyUp?.(event);\n };\n\n const handleExpand = (event: SyntheticEvent<HTMLButtonElement>) => {\n event.stopPropagation();\n\n if (hasHelpers(helpers)) {\n helpers.updateExpanded(event, true);\n }\n };\n\n const handleClearButtonFocus = (event: FocusEvent<HTMLButtonElement>) => {\n event.stopPropagation();\n };\n\n const selectedItemIds = selectedItems.map(\n (_, index) => `${id}-pill-${index}`,\n );\n\n const inputAriaLabelledBy = disabled\n ? [ariaLabelledBy, inputId, ...selectedItemIds]\n : [ariaLabelledBy, inputId];\n\n const expandedWithItems =\n expanded && !showExpandButton && selectedItems.length > 0;\n const { \"aria-label\": expandButtonAccessibleText, ...restExpandButtonProps } =\n ExpandButtonProps;\n\n return (\n <div className={withBaseName(\"container\")}>\n <span\n aria-owns={selectedItemIds.join(\" \")}\n className={withBaseName(\"hidden\")}\n role=\"listbox\"\n />\n <div\n className={clsx(\n withBaseName(),\n withBaseName(variant),\n {\n [withBaseName(\"expanded\")]: expanded,\n [withBaseName(\"focused\")]: !disabled && focused,\n [withBaseName(\"disabled\")]: disabled,\n [withBaseName(\"readOnly\")]: readOnly,\n [withBaseName(validationStatus as string)]: validationStatus,\n },\n className,\n )}\n ref={containerRef}\n onClick={onClick}\n // Tab index allows the div to be found as related target and prevents it closing when a click in happens\n tabIndex={-1}\n {...restProps}\n >\n {selectedItems.length > 0 &&\n selectedItems.map((item, index) => {\n const label = String(item);\n return (\n <InputPill\n disabled={disabled}\n hidden={showExpandButton && index >= firstHiddenIndex}\n highlighted={\n index === highlightedIndex ||\n activeIndices.indexOf(index) !== -1\n }\n id={`${id}-pill-${index}`}\n index={index}\n key={`${index}-${label}`}\n label={label}\n onClose={\n expanded && !readOnly\n ? (event) => onRemoveItem?.(event, index)\n : undefined\n }\n pillsRef={pillsRef}\n />\n );\n })}\n <textarea\n aria-labelledby={clsx(inputAriaLabelledBy, textAreaLabelledBy)}\n aria-describedby={clsx(ariaDescribedBy, textAreaDescribedBy)}\n aria-label={clsx(ariaLabel, getItemsAriaLabel(selectedItems.length))}\n aria-activedescendant={\n highlightedIndex && highlightedIndex >= 0\n ? `${id}-pill-${highlightedIndex}`\n : undefined\n }\n disabled={disabled}\n id={inputId}\n readOnly={readOnly}\n ref={textAreaRef}\n required={textAreaRequired}\n rows={1}\n tabIndex={disabled ? -1 : 0}\n value={value}\n className={clsx(withBaseName(\"textarea\"), textAreaProps?.className)}\n onChange={onInputChange}\n onBlur={onInputBlur}\n onFocus={!disabled ? onInputFocus : undefined}\n onKeyDown={onKeyDown}\n {...restTextAreaProps}\n />\n <div className={withBaseName(\"endAdornmentContainer\")}>\n {!disabled && !readOnly && validationStatus && (\n <StatusAdornment\n className={withBaseName(\"statusAdornment\")}\n ref={statusAdornmentRef}\n status={validationStatus as AdornmentValidationStatus}\n />\n )}\n {expandedWithItems && !readOnly && (\n <Button\n className={withBaseName(\"endAdornment\")}\n disabled={disabled}\n id={clearButtonId}\n onBlur={onBlur}\n onClick={onClear}\n onFocus={handleClearButtonFocus}\n ref={clearButtonRef}\n variant=\"secondary\"\n data-testid=\"clear-button\"\n aria-label=\"clear input\"\n >\n <CloseIcon aria-hidden />\n </Button>\n )}\n {showExpandButton && (\n <Button\n className={withBaseName(\"endAdornment\")}\n aria-label={expandButtonAccessibleText}\n aria-labelledby={clsx(ariaLabelledBy, inputId, expandButtonId)}\n disabled={disabled}\n id={expandButtonId}\n onBlur={onBlur}\n onClick={handleExpand}\n onKeyDown={handleExpandButtonKeyDown}\n onKeyUp={handleInputKeyUp}\n ref={expandButtonRef}\n variant=\"secondary\"\n data-testid=\"expand-button\"\n {...restExpandButtonProps}\n >\n <OverflowMenuIcon />\n </Button>\n )}\n </div>\n\n <div className={withBaseName(\"activationIndicator\")} />\n </div>\n </div>\n );\n});\n"],"names":["makePrefixer","forwardRef","TokenizedInputNext","useWindow","useComponentCssInjection","tokenizedInputCss","useTokenizedInputNext","useId","useRef","useForkRef","helpers","jsxs","jsx","clsx","InputPill","StatusAdornment","Button","CloseIcon","OverflowMenuIcon"],"mappings":";;;;;;;;;;;;;;;AAmGA,MAAM,YAAA,GAAeA,kBAAa,wBAAwB,CAAA,CAAA;AAE1D,MAAM,iBAAA,GAAoB,CAAC,SAAA,KACzB,SAAc,KAAA,CAAA,GACV,qBACA,CAAG,EAAA,SAAA,CAAA,CAAA,EAAa,SAAY,GAAA,CAAA,GAAI,OAAU,GAAA,MAAA,CAAA,CAAA,CAAA;AAEnC,MAAA,kBAAA,GAAqBC,gBAAW,CAAA,SAASC,mBACpD,CAAA;AAAA,EACE,WAAa,EAAA,eAAA;AAAA,EACb,gBAAgB,EAAC;AAAA,EACjB,OAAU,GAAA,SAAA;AAAA,EACP,GAAA,IAAA;AACL,CAAA,EACA,GACA,EAAA;AACA,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,2BAAA;AAAA,IACR,GAAK,EAAAC,oBAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AACD,EAAM,MAAA;AAAA,IACJ,kBAAoB,EAAA,mBAAA;AAAA,IACpB,iBAAmB,EAAA,kBAAA;AAAA,IACnB,QAAU,EAAA,gBAAA;AAAA,IACP,GAAA,iBAAA;AAAA,GACD,GAAA,aAAA,CAAA;AAEJ,EAAA,MAAM,EAAE,IAAM,EAAA,OAAA,EAAS,YAAY,gBAAiB,EAAA,GAClDC,4CAAsB,IAAI,CAAA,CAAA;AAE5B,EAAM,MAAA;AAAA,IACJ,WAAa,EAAA,eAAA;AAAA,IACb,QAAA;AAAA,IACA,cAAA;AAAA,IACA,eAAA;AAAA,IACA,kBAAA;AAAA,IACA,YAAc,EAAA,gBAAA;AAAA,GACZ,GAAA,IAAA,CAAA;AAEJ,EAAM,MAAA;AAAA,IACJ,iBAAoB,GAAA;AAAA,MAClB,YAAc,EAAA,aAAA;AAAA,KAChB;AAAA,IACA,SAAA;AAAA,IACA,gBAAgB,EAAC;AAAA,IACjB,gBAAgB,EAAC;AAAA,IACjB,gBAAA;AAAA,IACA,KAAA;AAAA,IACA,QAAA;AAAA,IACA,QAAA;AAAA,IACA,MAAA;AAAA,IACA,SAAA;AAAA,IACA,YAAA;AAAA,IACA,aAAA;AAAA,IACA,OAAA;AAAA,IACA,gBAAA;AAAA,IACA,QAAA;AAAA,IACA,YAAA;AAAA,IACA,WAAA;AAAA,IACA,OAAA;AAAA,IACA,OAAA;AAAA,IACA,OAAA;AAAA,IACA,EAAI,EAAA,MAAA;AAAA,IACJ,YAAc,EAAA,SAAA;AAAA,IACd,iBAAmB,EAAA,cAAA;AAAA,IACnB,kBAAoB,EAAA,eAAA;AAAA,IACjB,GAAA,SAAA;AAAA,GACD,GAAA,UAAA,CAAA;AAEJ,EAAM,MAAA,EAAA,GAAKC,WAAM,MAAM,CAAA,CAAA;AACvB,EAAA,MAAM,UAAU,CAAG,EAAA,EAAA,CAAA,MAAA,CAAA,CAAA;AACnB,EAAA,MAAM,iBAAiB,CAAG,EAAA,EAAA,CAAA,cAAA,CAAA,CAAA;AAC1B,EAAA,MAAM,gBAAgB,CAAG,EAAA,EAAA,CAAA,aAAA,CAAA,CAAA;AAEzB,EAAM,MAAA,mBAAA,GAAsBC,aAAO,KAAK,CAAA,CAAA;AACxC,EAAM,MAAA,YAAA,GAAeC,eAAW,CAAA,GAAA,EAAK,gBAAgB,CAAA,CAAA;AACrD,EAAM,MAAA,WAAA,GAAcA,eAAW,CAAA,eAAA,EAAiB,eAAe,CAAA,CAAA;AAC/D,EAAM,MAAA,gBAAA,GAAmB,CAAC,QAAA,IAAY,gBAAoB,IAAA,IAAA,CAAA;AAE1D,EAAM,MAAA,UAAA,GAAa,CAACC,QAA6C,KAAA;AAC/D,IAAI,IAAA,OAAA,CAAQ,GAAI,CAAA,QAAA,KAAa,YAAc,EAAA;AACzC,MAAA,IAAIA,YAAW,IAAM,EAAA;AACnB,QAAQ,OAAA,CAAA,IAAA;AAAA,UACN,wGAAA;AAAA,SACF,CAAA;AAAA,OACF;AAAA,KACF;AACA,IAAA,OAAOA,QAAW,IAAA,IAAA,CAAA;AAAA,GACpB,CAAA;AAEA,EAAM,MAAA,yBAAA,GAA4B,CAChC,KACG,KAAA;AACH,IAAM,MAAA,UAAA,GAAa,KAAM,CAAA,GAAA,CAAI,MAAW,KAAA,CAAA,CAAA;AACxC,IAAA,MAAM,aACJ,GAAA;AAAA,MACE,SAAA;AAAA,MACA,MAAA;AAAA,MACA,OAAA;AAAA,MACA,WAAA;AAAA,MACA,WAAA;AAAA,MACA,WAAA;AAAA,MACA,YAAA;AAAA,MACA,OAAQ,CAAA,KAAA,CAAM,GAAI,CAAA,WAAA,EAAa,CAAM,KAAA,CAAA,CAAA,CAAA;AAEzC,IAAA,IAAA,CAAK,UAAc,IAAA,aAAA,KAAkB,UAAW,CAAA,OAAO,CAAG,EAAA;AACxD,MAAA,IAAI,KAAM,CAAA,GAAA,KAAQ,OAAW,IAAA,KAAA,CAAM,QAAQ,GAAK,EAAA;AAC9C,QAAA,KAAA,CAAM,cAAe,EAAA,CAAA;AACrB,QAAA,KAAA,CAAM,eAAgB,EAAA,CAAA;AAAA,OACxB;AACA,MAAQ,OAAA,CAAA,cAAA,CAAe,OAAO,IAAI,CAAA,CAAA;AAClC,MAAA,mBAAA,CAAoB,OAAU,GAAA,IAAA,CAAA;AAAA,KAChC;AAAA,GACF,CAAA;AAEA,EAAM,MAAA,gBAAA,GAAmB,CACvB,KACG,KAAA;AAEH,IAAA,IAAI,mBAAoB,CAAA,OAAA,IAAW,OAAY,KAAA,KAAA,CAAM,GAAK,EAAA;AACxD,MAAA,mBAAA,CAAoB,OAAU,GAAA,KAAA,CAAA;AAC9B,MAAY,SAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,SAAA,CAAA,KAAA,CAAA,CAAA;AAAA,KACd;AACA,IAAU,OAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,OAAA,CAAA,KAAA,CAAA,CAAA;AAAA,GACZ,CAAA;AAEA,EAAM,MAAA,YAAA,GAAe,CAAC,KAA6C,KAAA;AACjE,IAAA,KAAA,CAAM,eAAgB,EAAA,CAAA;AAEtB,IAAI,IAAA,UAAA,CAAW,OAAO,CAAG,EAAA;AACvB,MAAQ,OAAA,CAAA,cAAA,CAAe,OAAO,IAAI,CAAA,CAAA;AAAA,KACpC;AAAA,GACF,CAAA;AAEA,EAAM,MAAA,sBAAA,GAAyB,CAAC,KAAyC,KAAA;AACvE,IAAA,KAAA,CAAM,eAAgB,EAAA,CAAA;AAAA,GACxB,CAAA;AAEA,EAAA,MAAM,kBAAkB,aAAc,CAAA,GAAA;AAAA,IACpC,CAAC,CAAA,EAAG,KAAU,KAAA,CAAA,EAAG,EAAW,CAAA,MAAA,EAAA,KAAA,CAAA,CAAA;AAAA,GAC9B,CAAA;AAEA,EAAM,MAAA,mBAAA,GAAsB,QACxB,GAAA,CAAC,cAAgB,EAAA,OAAA,EAAS,GAAG,eAAe,CAAA,GAC5C,CAAC,cAAA,EAAgB,OAAO,CAAA,CAAA;AAE5B,EAAA,MAAM,iBACJ,GAAA,QAAA,IAAY,CAAC,gBAAA,IAAoB,cAAc,MAAS,GAAA,CAAA,CAAA;AAC1D,EAAA,MAAM,EAAE,YAAA,EAAc,0BAA+B,EAAA,GAAA,qBAAA,EACnD,GAAA,iBAAA,CAAA;AAEF,EAAA,uBACGC,eAAA,CAAA,KAAA,EAAA;AAAA,IAAI,SAAA,EAAW,aAAa,WAAW,CAAA;AAAA,IACtC,QAAA,EAAA;AAAA,sBAACC,cAAA,CAAA,MAAA,EAAA;AAAA,QACC,WAAA,EAAW,eAAgB,CAAA,IAAA,CAAK,GAAG,CAAA;AAAA,QACnC,SAAA,EAAW,aAAa,QAAQ,CAAA;AAAA,QAChC,IAAK,EAAA,SAAA;AAAA,OACP,CAAA;AAAA,sBACCD,eAAA,CAAA,KAAA,EAAA;AAAA,QACC,SAAW,EAAAE,SAAA;AAAA,UACT,YAAa,EAAA;AAAA,UACb,aAAa,OAAO,CAAA;AAAA,UACpB;AAAA,YACE,CAAC,YAAa,CAAA,UAAU,CAAI,GAAA,QAAA;AAAA,YAC5B,CAAC,YAAA,CAAa,SAAS,CAAA,GAAI,CAAC,QAAY,IAAA,OAAA;AAAA,YACxC,CAAC,YAAa,CAAA,UAAU,CAAI,GAAA,QAAA;AAAA,YAC5B,CAAC,YAAa,CAAA,UAAU,CAAI,GAAA,QAAA;AAAA,YAC5B,CAAC,YAAa,CAAA,gBAA0B,CAAI,GAAA,gBAAA;AAAA,WAC9C;AAAA,UACA,SAAA;AAAA,SACF;AAAA,QACA,GAAK,EAAA,YAAA;AAAA,QACL,OAAA;AAAA,QAEA,QAAU,EAAA,CAAA,CAAA;AAAA,QACT,GAAG,SAAA;AAAA,QAEH,QAAA,EAAA;AAAA,UAAA,aAAA,CAAc,SAAS,CACtB,IAAA,aAAA,CAAc,GAAI,CAAA,CAAC,MAAM,KAAU,KAAA;AACjC,YAAM,MAAA,KAAA,GAAQ,OAAO,IAAI,CAAA,CAAA;AACzB,YAAA,uBACGD,cAAA,CAAAE,mBAAA,EAAA;AAAA,cACC,QAAA;AAAA,cACA,MAAA,EAAQ,oBAAoB,KAAS,IAAA,gBAAA;AAAA,cACrC,aACE,KAAU,KAAA,gBAAA,IACV,aAAc,CAAA,OAAA,CAAQ,KAAK,CAAM,KAAA,CAAA,CAAA;AAAA,cAEnC,EAAA,EAAI,GAAG,EAAW,CAAA,MAAA,EAAA,KAAA,CAAA,CAAA;AAAA,cAClB,KAAA;AAAA,cAEA,KAAA;AAAA,cACA,OAAA,EACE,YAAY,CAAC,QAAA,GACT,CAAC,KAAU,KAAA,YAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,YAAA,CAAe,OAAO,KACjC,CAAA,GAAA,KAAA,CAAA;AAAA,cAEN,QAAA;AAAA,aAPK,EAAA,CAAA,EAAG,SAAS,KAQnB,CAAA,CAAA,CAAA,CAAA;AAAA,WAEH,CAAA;AAAA,0BACFF,cAAA,CAAA,UAAA,EAAA;AAAA,YACC,iBAAA,EAAiBC,SAAK,CAAA,mBAAA,EAAqB,kBAAkB,CAAA;AAAA,YAC7D,kBAAA,EAAkBA,SAAK,CAAA,eAAA,EAAiB,mBAAmB,CAAA;AAAA,YAC3D,cAAYA,SAAK,CAAA,SAAA,EAAW,iBAAkB,CAAA,aAAA,CAAc,MAAM,CAAC,CAAA;AAAA,YACnE,yBACE,gBAAoB,IAAA,gBAAA,IAAoB,CACpC,GAAA,CAAA,EAAG,WAAW,gBACd,CAAA,CAAA,GAAA,KAAA,CAAA;AAAA,YAEN,QAAA;AAAA,YACA,EAAI,EAAA,OAAA;AAAA,YACJ,QAAA;AAAA,YACA,GAAK,EAAA,WAAA;AAAA,YACL,QAAU,EAAA,gBAAA;AAAA,YACV,IAAM,EAAA,CAAA;AAAA,YACN,QAAA,EAAU,WAAW,CAAK,CAAA,GAAA,CAAA;AAAA,YAC1B,KAAA;AAAA,YACA,WAAWA,SAAK,CAAA,YAAA,CAAa,UAAU,CAAA,EAAG,+CAAe,SAAS,CAAA;AAAA,YAClE,QAAU,EAAA,aAAA;AAAA,YACV,MAAQ,EAAA,WAAA;AAAA,YACR,OAAA,EAAS,CAAC,QAAA,GAAW,YAAe,GAAA,KAAA,CAAA;AAAA,YACpC,SAAA;AAAA,YACC,GAAG,iBAAA;AAAA,WACN,CAAA;AAAA,0BACCF,eAAA,CAAA,KAAA,EAAA;AAAA,YAAI,SAAA,EAAW,aAAa,uBAAuB,CAAA;AAAA,YACjD,QAAA,EAAA;AAAA,cAAA,CAAC,QAAY,IAAA,CAAC,QAAY,IAAA,gBAAA,oBACxBC,cAAA,CAAAG,oBAAA,EAAA;AAAA,gBACC,SAAA,EAAW,aAAa,iBAAiB,CAAA;AAAA,gBACzC,GAAK,EAAA,kBAAA;AAAA,gBACL,MAAQ,EAAA,gBAAA;AAAA,eACV,CAAA;AAAA,cAED,iBAAA,IAAqB,CAAC,QAAA,oBACpBH,cAAA,CAAAI,WAAA,EAAA;AAAA,gBACC,SAAA,EAAW,aAAa,cAAc,CAAA;AAAA,gBACtC,QAAA;AAAA,gBACA,EAAI,EAAA,aAAA;AAAA,gBACJ,MAAA;AAAA,gBACA,OAAS,EAAA,OAAA;AAAA,gBACT,OAAS,EAAA,sBAAA;AAAA,gBACT,GAAK,EAAA,cAAA;AAAA,gBACL,OAAQ,EAAA,WAAA;AAAA,gBACR,aAAY,EAAA,cAAA;AAAA,gBACZ,YAAW,EAAA,aAAA;AAAA,gBAEX,QAAC,kBAAAJ,cAAA,CAAAK,eAAA,EAAA;AAAA,kBAAU,aAAW,EAAA,IAAA;AAAA,iBAAC,CAAA;AAAA,eACzB,CAAA;AAAA,cAED,oCACEL,cAAA,CAAAI,WAAA,EAAA;AAAA,gBACC,SAAA,EAAW,aAAa,cAAc,CAAA;AAAA,gBACtC,YAAY,EAAA,0BAAA;AAAA,gBACZ,iBAAiB,EAAAH,SAAA,CAAK,cAAgB,EAAA,OAAA,EAAS,cAAc,CAAA;AAAA,gBAC7D,QAAA;AAAA,gBACA,EAAI,EAAA,cAAA;AAAA,gBACJ,MAAA;AAAA,gBACA,OAAS,EAAA,YAAA;AAAA,gBACT,SAAW,EAAA,yBAAA;AAAA,gBACX,OAAS,EAAA,gBAAA;AAAA,gBACT,GAAK,EAAA,eAAA;AAAA,gBACL,OAAQ,EAAA,WAAA;AAAA,gBACR,aAAY,EAAA,eAAA;AAAA,gBACX,GAAG,qBAAA;AAAA,gBAEJ,yCAACK,sBAAiB,EAAA,EAAA,CAAA;AAAA,eACpB,CAAA;AAAA,aAAA;AAAA,WAEJ,CAAA;AAAA,0BAECN,cAAA,CAAA,KAAA,EAAA;AAAA,YAAI,SAAA,EAAW,aAAa,qBAAqB,CAAA;AAAA,WAAG,CAAA;AAAA,SAAA;AAAA,OACvD,CAAA;AAAA,KAAA;AAAA,GACF,CAAA,CAAA;AAEJ,CAAC;;;;"}
1
+ {"version":3,"file":"TokenizedInputNext.js","sources":["../src/tokenized-input-next/TokenizedInputNext.tsx"],"sourcesContent":["import {\n type AdornmentValidationStatus,\n Button,\n type ButtonProps,\n type NecessityType,\n StatusAdornment,\n type ValidationStatus,\n makePrefixer,\n useForkRef,\n useIcon,\n useId,\n} from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type ChangeEventHandler,\n type FocusEvent,\n type FocusEventHandler,\n type ForwardedRef,\n type HTMLAttributes,\n type KeyboardEvent,\n type KeyboardEventHandler,\n type ReactEventHandler,\n type Ref,\n type SyntheticEvent,\n type TextareaHTMLAttributes,\n forwardRef,\n useRef,\n} from \"react\";\nimport tokenizedInputCss from \"./TokenizedInputNext.css\";\nimport { InputPill } from \"./internal/InputPill\";\nimport {\n type TokenizedInputNextHelpers,\n type TokenizedInputNextState,\n useTokenizedInputNext,\n} from \"./useTokenizedInputNext\";\n\ntype ChangeHandler<Item> = (\n event: SyntheticEvent,\n selectedItems: Item[] | undefined,\n) => void;\n\ntype ExpandButtonProps = Pick<\n ButtonProps,\n \"role\" | \"aria-roledescription\" | \"aria-describedby\"\n> & { \"aria-label\"?: string };\n\nexport interface TokenizedInputNextProps<Item>\n extends Partial<TokenizedInputNextState<Item>>,\n Omit<\n HTMLAttributes<HTMLDivElement>,\n \"onFocus\" | \"onBlur\" | \"onChange\" | \"onKeyUp\" | \"onKeyDown\"\n > {\n ExpandButtonProps?: ExpandButtonProps;\n disabled?: boolean;\n focused?: boolean;\n expandButtonRef?: Ref<HTMLButtonElement>;\n onBlur?: FocusEventHandler<HTMLTextAreaElement | HTMLButtonElement>;\n onKeyUp?: KeyboardEventHandler<HTMLTextAreaElement | HTMLButtonElement>;\n // Can key down on either input or expand button\n onKeyDown?: KeyboardEventHandler<HTMLTextAreaElement | HTMLButtonElement>;\n onRemoveItem?: (event: SyntheticEvent, index: number) => void;\n onInputBlur?: FocusEventHandler<HTMLTextAreaElement>;\n onInputFocus?: FocusEventHandler<HTMLTextAreaElement>;\n onInputChange?: ChangeEventHandler<HTMLTextAreaElement>;\n onClick?: ReactEventHandler;\n onClear?: ReactEventHandler;\n delimiters?: string[];\n disableAddOnBlur?: boolean;\n defaultSelected?: Item[];\n onChange?: ChangeHandler<Item>;\n onCollapse?: ReactEventHandler;\n onExpand?: ReactEventHandler;\n\n /// from input\n /**\n * Validation status.\n */\n validationStatus?: Omit<ValidationStatus, \"info\">;\n /**\n * If `true`, the component is read only.\n */\n readOnly?: boolean;\n /**\n * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#Attributes) applied to the `textarea` element.\n */\n textAreaProps?: TextareaHTMLAttributes<HTMLTextAreaElement>;\n /**\n * Optional ref for the textarea component\n */\n textAreaRef?: Ref<HTMLTextAreaElement>;\n necessity?: NecessityType;\n /**\n * Styling variant. Defaults to \"primary\".\n */\n variant?: \"primary\" | \"secondary\";\n}\n\nconst withBaseName = makePrefixer(\"saltTokenizedInputNext\");\n\nconst getItemsAriaLabel = (itemCount: number) =>\n itemCount === 0\n ? \"no item selected\"\n : `${itemCount} ${itemCount > 1 ? \"items\" : \"item\"}`;\n\nexport const TokenizedInputNext = forwardRef(function TokenizedInputNext<Item>(\n {\n textAreaRef: textAreaRefProp,\n textAreaProps = {},\n variant = \"primary\",\n ...rest\n }: TokenizedInputNextProps<Item>,\n ref: ForwardedRef<HTMLDivElement>,\n) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-tokenized-input-next\",\n css: tokenizedInputCss,\n window: targetWindow,\n });\n const {\n \"aria-describedby\": textAreaDescribedBy,\n \"aria-labelledby\": textAreaLabelledBy,\n required: textAreaRequired,\n ...restTextAreaProps\n } = textAreaProps;\n\n const { refs, helpers, inputProps, firstHiddenIndex } =\n useTokenizedInputNext(rest);\n\n const {\n textAreaRef: textAreaHookRef,\n pillsRef,\n clearButtonRef,\n expandButtonRef,\n statusAdornmentRef,\n containerRef: containerHookRef,\n } = refs;\n\n const {\n ExpandButtonProps = {\n \"aria-label\": \"expand edit\",\n },\n className,\n activeIndices = [],\n selectedItems = [],\n highlightedIndex,\n value,\n expanded,\n disabled,\n onBlur,\n onKeyDown,\n onRemoveItem,\n onInputChange,\n focused,\n validationStatus,\n readOnly,\n onInputFocus,\n onInputBlur,\n onClear,\n onClick,\n onKeyUp,\n id: idProp,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-describedby\": ariaDescribedBy,\n ...restProps\n } = inputProps;\n const { OverflowIcon, CloseIcon } = useIcon();\n const id = useId(idProp);\n const inputId = `${id}-input`;\n const expandButtonId = `${id}-expand-button`;\n const clearButtonId = `${id}-clear-button`;\n\n const keydownExpandButton = useRef(false);\n const containerRef = useForkRef(ref, containerHookRef);\n const textAreaRef = useForkRef(textAreaHookRef, textAreaRefProp);\n const showExpandButton = !expanded && firstHiddenIndex != null;\n\n const hasHelpers = (helpers: TokenizedInputNextHelpers<Item>) => {\n if (process.env.NODE_ENV !== \"production\") {\n if (helpers == null) {\n console.warn(\n 'TokenizedInputNext is used without helpers. You should pass in \"helpers\" from \"useTokenizedInputNext\".',\n );\n }\n }\n return helpers != null;\n };\n\n const handleExpandButtonKeyDown = (\n event: KeyboardEvent<HTMLButtonElement>,\n ) => {\n const singleChar = event.key.length === 1;\n const triggerExpand =\n [\n \"CONTROL\",\n \"META\",\n \"ENTER\",\n \"BACKSPACE\",\n \"ARROWDOWN\",\n \"ARROWLEFT\",\n \"ARROWRIGHT\",\n ].indexOf(event.key.toUpperCase()) !== -1;\n\n if ((singleChar || triggerExpand) && hasHelpers(helpers)) {\n if (event.key === \"Enter\" || event.key === \" \") {\n event.preventDefault();\n event.stopPropagation();\n }\n helpers.updateExpanded(event, true);\n keydownExpandButton.current = true;\n }\n };\n\n const handleInputKeyUp = (\n event: KeyboardEvent<HTMLButtonElement | HTMLTextAreaElement>,\n ) => {\n // Call keydown again if the initial event has been used to expand the input\n if (keydownExpandButton.current && \"Enter\" !== event.key) {\n keydownExpandButton.current = false;\n onKeyDown?.(event);\n }\n onKeyUp?.(event);\n };\n\n const handleExpand = (event: SyntheticEvent<HTMLButtonElement>) => {\n event.stopPropagation();\n\n if (hasHelpers(helpers)) {\n helpers.updateExpanded(event, true);\n }\n };\n\n const handleClearButtonFocus = (event: FocusEvent<HTMLButtonElement>) => {\n event.stopPropagation();\n };\n\n const selectedItemIds = selectedItems.map(\n (_, index) => `${id}-pill-${index}`,\n );\n\n const inputAriaLabelledBy = disabled\n ? [ariaLabelledBy, inputId, ...selectedItemIds]\n : [ariaLabelledBy, inputId];\n\n const expandedWithItems =\n expanded && !showExpandButton && selectedItems.length > 0;\n const { \"aria-label\": expandButtonAccessibleText, ...restExpandButtonProps } =\n ExpandButtonProps;\n\n return (\n <div className={withBaseName(\"container\")}>\n <span\n aria-owns={selectedItemIds.join(\" \")}\n className={withBaseName(\"hidden\")}\n role=\"listbox\"\n />\n <div\n className={clsx(\n withBaseName(),\n withBaseName(variant),\n {\n [withBaseName(\"expanded\")]: expanded,\n [withBaseName(\"focused\")]: !disabled && focused,\n [withBaseName(\"disabled\")]: disabled,\n [withBaseName(\"readOnly\")]: readOnly,\n [withBaseName(validationStatus as string)]: validationStatus,\n },\n className,\n )}\n ref={containerRef}\n onClick={onClick}\n // Tab index allows the div to be found as related target and prevents it closing when a click in happens\n tabIndex={-1}\n {...restProps}\n >\n {selectedItems.length > 0 &&\n selectedItems.map((item, index) => {\n const label = String(item);\n return (\n <InputPill\n disabled={disabled}\n hidden={showExpandButton && index >= firstHiddenIndex}\n highlighted={\n index === highlightedIndex ||\n activeIndices.indexOf(index) !== -1\n }\n id={`${id}-pill-${index}`}\n index={index}\n key={`${index}-${label}`}\n label={label}\n onClose={\n expanded && !readOnly\n ? (event) => onRemoveItem?.(event, index)\n : undefined\n }\n pillsRef={pillsRef}\n />\n );\n })}\n <textarea\n aria-labelledby={clsx(inputAriaLabelledBy, textAreaLabelledBy)}\n aria-describedby={clsx(ariaDescribedBy, textAreaDescribedBy)}\n aria-label={clsx(ariaLabel, getItemsAriaLabel(selectedItems.length))}\n aria-activedescendant={\n highlightedIndex && highlightedIndex >= 0\n ? `${id}-pill-${highlightedIndex}`\n : undefined\n }\n disabled={disabled}\n id={inputId}\n readOnly={readOnly}\n ref={textAreaRef}\n required={textAreaRequired}\n rows={1}\n tabIndex={disabled ? -1 : 0}\n value={value}\n className={clsx(withBaseName(\"textarea\"), textAreaProps?.className)}\n onChange={onInputChange}\n onBlur={onInputBlur}\n onFocus={!disabled ? onInputFocus : undefined}\n onKeyDown={onKeyDown}\n {...restTextAreaProps}\n />\n <div className={withBaseName(\"endAdornmentContainer\")}>\n {!disabled && !readOnly && validationStatus && (\n <StatusAdornment\n className={withBaseName(\"statusAdornment\")}\n ref={statusAdornmentRef}\n status={validationStatus as AdornmentValidationStatus}\n />\n )}\n {expandedWithItems && !readOnly && (\n <Button\n className={withBaseName(\"endAdornment\")}\n disabled={disabled}\n id={clearButtonId}\n onBlur={onBlur}\n onClick={onClear}\n onFocus={handleClearButtonFocus}\n ref={clearButtonRef}\n variant=\"secondary\"\n data-testid=\"clear-button\"\n aria-label=\"clear input\"\n >\n <CloseIcon aria-hidden />\n </Button>\n )}\n {showExpandButton && (\n <Button\n className={withBaseName(\"endAdornment\")}\n aria-label={expandButtonAccessibleText}\n aria-labelledby={clsx(ariaLabelledBy, inputId, expandButtonId)}\n disabled={disabled}\n id={expandButtonId}\n onBlur={onBlur}\n onClick={handleExpand}\n onKeyDown={handleExpandButtonKeyDown}\n onKeyUp={handleInputKeyUp}\n ref={expandButtonRef}\n variant=\"secondary\"\n data-testid=\"expand-button\"\n {...restExpandButtonProps}\n >\n <OverflowIcon />\n </Button>\n )}\n </div>\n\n <div className={withBaseName(\"activationIndicator\")} />\n </div>\n </div>\n );\n});\n"],"names":["makePrefixer","forwardRef","TokenizedInputNext","useWindow","useComponentCssInjection","tokenizedInputCss","useTokenizedInputNext","useIcon","useId","useRef","useForkRef","helpers","jsxs","jsx","clsx","InputPill","StatusAdornment","Button"],"mappings":"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"}
@@ -4,7 +4,6 @@ Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  var jsxRuntime = require('react/jsx-runtime');
6
6
  var core = require('@salt-ds/core');
7
- var icons = require('@salt-ds/icons');
8
7
  var styles = require('@salt-ds/styles');
9
8
  var window = require('@salt-ds/window');
10
9
  var clsx = require('clsx');
@@ -30,6 +29,7 @@ const InputPill = react.memo(function InputPill2(props) {
30
29
  css: InputPill$1,
31
30
  window: targetWindow
32
31
  });
32
+ const { CloseIcon } = core.useIcon();
33
33
  const ref = react.useRef(null);
34
34
  const [isEllipsisActive, setEllipsisActive] = react.useState(false);
35
35
  const isRemovable = Boolean(onClose);
@@ -73,7 +73,7 @@ const InputPill = react.memo(function InputPill2(props) {
73
73
  className: withBaseName("label"),
74
74
  children: label
75
75
  }),
76
- isRemovable && /* @__PURE__ */ jsxRuntime.jsx(icons.CloseIcon, {})
76
+ isRemovable && /* @__PURE__ */ jsxRuntime.jsx(CloseIcon, {})
77
77
  ]
78
78
  })
79
79
  });
@@ -1 +1 @@
1
- {"version":3,"file":"InputPill.js","sources":["../src/tokenized-input-next/internal/InputPill.tsx"],"sourcesContent":["import {\n Pill,\n type PillProps,\n Tooltip,\n makePrefixer,\n useIsomorphicLayoutEffect,\n} from \"@salt-ds/core\";\nimport { CloseIcon } from \"@salt-ds/icons\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type MutableRefObject,\n type SyntheticEvent,\n memo,\n useRef,\n useState,\n} from \"react\";\nimport inputPillCss from \"./InputPill.css\";\nimport { getWidth } from \"./useWidth\";\n\nconst withBaseName = makePrefixer(\"saltInputPill\");\n\nexport type InputPillProps = PillProps & {\n /**\n * A ref object holds pills index map to width.\n */\n pillsRef: MutableRefObject<Record<number, number | undefined>>;\n /**\n * Index of the pill within Input.\n */\n index: number;\n /**\n * Whether the pill is the last visible one within Input.\n */\n lastVisible?: boolean;\n /**\n * Pill label.\n */\n label?: string;\n /**\n * Whether the pill is highlighted.\n */\n highlighted?: boolean;\n\n /**\n * Callback when pill is deleted.\n */\n onClose?: (event: SyntheticEvent, index: number) => void;\n};\n\nexport const InputPill = memo(function InputPill(props: InputPillProps) {\n const {\n className,\n hidden,\n highlighted,\n index,\n label,\n onClose,\n pillsRef,\n ...rest\n } = props;\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-input-pill\",\n css: inputPillCss,\n window: targetWindow,\n });\n\n const ref = useRef<HTMLButtonElement | null>(null);\n const [isEllipsisActive, setEllipsisActive] = useState(false);\n const isRemovable = Boolean(onClose);\n\n // useIsomorphicLayoutEffect to match the calcFirstHiddenIndex\n // We need to collect widths before the calculation\n useIsomorphicLayoutEffect(() => {\n const text = ref?.current?.firstElementChild as HTMLElement;\n if (!isRemovable && pillsRef.current) {\n pillsRef.current[index] = getWidth(ref.current);\n }\n setEllipsisActive(text?.offsetWidth < text?.scrollWidth);\n }, [pillsRef, index, isRemovable]);\n\n useIsomorphicLayoutEffect(\n () => () => {\n pillsRef.current[index] = undefined;\n },\n [pillsRef, index],\n );\n\n const handleClose = (event: SyntheticEvent) => {\n onClose?.(event, index);\n };\n return (\n <Tooltip content={label} disabled={!isEllipsisActive}>\n <Pill\n className={clsx(\n withBaseName(),\n {\n [withBaseName(\"pillHighlighted\")]: highlighted,\n [withBaseName(\"expanded\")]: isRemovable,\n [withBaseName(\"hidden\")]: hidden,\n },\n className,\n )}\n tabIndex={-1}\n onClick={isRemovable ? handleClose : undefined}\n ref={ref}\n role=\"option\"\n {...rest}\n >\n <span className={withBaseName(\"label\")}>{label}</span>\n {isRemovable && <CloseIcon />}\n </Pill>\n </Tooltip>\n );\n});\n"],"names":["makePrefixer","memo","InputPill","useWindow","useComponentCssInjection","inputPillCss","useRef","useState","useIsomorphicLayoutEffect","getWidth","jsx","Tooltip","jsxs","Pill","clsx","CloseIcon"],"mappings":"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"}
1
+ {"version":3,"file":"InputPill.js","sources":["../src/tokenized-input-next/internal/InputPill.tsx"],"sourcesContent":["import {\n Pill,\n type PillProps,\n Tooltip,\n makePrefixer,\n useIcon,\n useIsomorphicLayoutEffect,\n} from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type MutableRefObject,\n type SyntheticEvent,\n memo,\n useRef,\n useState,\n} from \"react\";\nimport inputPillCss from \"./InputPill.css\";\nimport { getWidth } from \"./useWidth\";\n\nconst withBaseName = makePrefixer(\"saltInputPill\");\n\nexport type InputPillProps = PillProps & {\n /**\n * A ref object holds pills index map to width.\n */\n pillsRef: MutableRefObject<Record<number, number | undefined>>;\n /**\n * Index of the pill within Input.\n */\n index: number;\n /**\n * Whether the pill is the last visible one within Input.\n */\n lastVisible?: boolean;\n /**\n * Pill label.\n */\n label?: string;\n /**\n * Whether the pill is highlighted.\n */\n highlighted?: boolean;\n\n /**\n * Callback when pill is deleted.\n */\n onClose?: (event: SyntheticEvent, index: number) => void;\n};\n\nexport const InputPill = memo(function InputPill(props: InputPillProps) {\n const {\n className,\n hidden,\n highlighted,\n index,\n label,\n onClose,\n pillsRef,\n ...rest\n } = props;\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-input-pill\",\n css: inputPillCss,\n window: targetWindow,\n });\n\n const { CloseIcon } = useIcon();\n const ref = useRef<HTMLButtonElement | null>(null);\n const [isEllipsisActive, setEllipsisActive] = useState(false);\n const isRemovable = Boolean(onClose);\n\n // useIsomorphicLayoutEffect to match the calcFirstHiddenIndex\n // We need to collect widths before the calculation\n useIsomorphicLayoutEffect(() => {\n const text = ref?.current?.firstElementChild as HTMLElement;\n if (!isRemovable && pillsRef.current) {\n pillsRef.current[index] = getWidth(ref.current);\n }\n setEllipsisActive(text?.offsetWidth < text?.scrollWidth);\n }, [pillsRef, index, isRemovable]);\n\n useIsomorphicLayoutEffect(\n () => () => {\n pillsRef.current[index] = undefined;\n },\n [pillsRef, index],\n );\n\n const handleClose = (event: SyntheticEvent) => {\n onClose?.(event, index);\n };\n return (\n <Tooltip content={label} disabled={!isEllipsisActive}>\n <Pill\n className={clsx(\n withBaseName(),\n {\n [withBaseName(\"pillHighlighted\")]: highlighted,\n [withBaseName(\"expanded\")]: isRemovable,\n [withBaseName(\"hidden\")]: hidden,\n },\n className,\n )}\n tabIndex={-1}\n onClick={isRemovable ? handleClose : undefined}\n ref={ref}\n role=\"option\"\n {...rest}\n >\n <span className={withBaseName(\"label\")}>{label}</span>\n {isRemovable && <CloseIcon />}\n </Pill>\n </Tooltip>\n );\n});\n"],"names":["makePrefixer","memo","InputPill","useWindow","useComponentCssInjection","inputPillCss","useIcon","useRef","useState","useIsomorphicLayoutEffect","getWidth","jsx","Tooltip","jsxs","Pill","clsx"],"mappings":"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"}
@@ -5,7 +5,6 @@ Object.defineProperty(exports, '__esModule', { value: true });
5
5
  var jsxRuntime = require('react/jsx-runtime');
6
6
  var react = require('react');
7
7
  var core = require('@salt-ds/core');
8
- var icons = require('@salt-ds/icons');
9
8
  var clsx = require('clsx');
10
9
  var ToolbarField = require('../toolbar-field/ToolbarField.js');
11
10
  var OverflowSeparator = require('./OverflowSeparator.js');
@@ -39,6 +38,7 @@ const OverflowPanel = react.forwardRef(function DropdownPanel({
39
38
  css: OverflowPanel$1,
40
39
  window: targetWindow
41
40
  });
41
+ const { OverflowIcon } = core.useIcon();
42
42
  const id = core.useIdMemo();
43
43
  const collectionHook = useCollectionItems.useCollectionItems({
44
44
  id,
@@ -70,7 +70,7 @@ const OverflowPanel = react.forwardRef(function DropdownPanel({
70
70
  setIsOpen(open);
71
71
  onOpenChange == null ? void 0 : onOpenChange(open);
72
72
  };
73
- const getTriggerButtonIcon = () => (triggerButtonIcon != null ? triggerButtonIcon : triggerButtonLabel === void 0) ? /* @__PURE__ */ jsxRuntime.jsx(icons.OverflowMenuIcon, {}) : void 0;
73
+ const getTriggerButtonIcon = () => (triggerButtonIcon != null ? triggerButtonIcon : triggerButtonLabel === void 0) ? /* @__PURE__ */ jsxRuntime.jsx(OverflowIcon, {}) : void 0;
74
74
  return /* @__PURE__ */ jsxRuntime.jsxs(DropdownBase.DropdownBase, {
75
75
  ...props,
76
76
  className: clsx.clsx(withBaseName(), className),