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

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 (438) hide show
  1. package/cjs/calendar/Calendar.js.map +1 -1
  2. package/cjs/calendar/internal/CalendarCarousel.js.map +1 -1
  3. package/cjs/calendar/internal/CalendarContext.js.map +1 -1
  4. package/cjs/calendar/internal/CalendarDay.js.map +1 -1
  5. package/cjs/calendar/internal/CalendarMonth.js.map +1 -1
  6. package/cjs/calendar/internal/CalendarNavigation.js.map +1 -1
  7. package/cjs/calendar/internal/CalendarWeekHeader.js.map +1 -1
  8. package/cjs/calendar/internal/useFocusManagement.js.map +1 -1
  9. package/cjs/calendar/internal/utils.js.map +1 -1
  10. package/cjs/calendar/useCalendar.js.map +1 -1
  11. package/cjs/calendar/useCalendarDay.js.map +1 -1
  12. package/cjs/calendar/useSelection.js.map +1 -1
  13. package/cjs/column-picker/ColumnPicker.js.map +1 -1
  14. package/cjs/column-picker/ColumnSearch.js.map +1 -1
  15. package/cjs/common-hooks/collectionProvider.js.map +1 -1
  16. package/cjs/common-hooks/itemToString.js.map +1 -1
  17. package/cjs/common-hooks/selectionTypes.js.map +1 -1
  18. package/cjs/common-hooks/use-resize-observer.js.map +1 -1
  19. package/cjs/common-hooks/useCollectionItems.js.map +1 -1
  20. package/cjs/common-hooks/useControlled.js.map +1 -1
  21. package/cjs/common-hooks/useSelection.js.map +1 -1
  22. package/cjs/cycle-state-button/CycleStateButton.js.map +1 -1
  23. package/cjs/date-input/DateInput.js.map +1 -1
  24. package/cjs/date-picker/DatePicker.js.map +1 -1
  25. package/cjs/date-picker/DatePickerContext.js.map +1 -1
  26. package/cjs/date-picker/DatePickerPanel.js.map +1 -1
  27. package/cjs/drag-drop/DragDropProvider.js.map +1 -1
  28. package/cjs/drag-drop/DragDropState.js.map +1 -1
  29. package/cjs/drag-drop/Draggable.js +0 -5
  30. package/cjs/drag-drop/Draggable.js.map +1 -1
  31. package/cjs/drag-drop/dragDropTypes.js.map +1 -1
  32. package/cjs/drag-drop/drop-target-utils.js.map +1 -1
  33. package/cjs/drag-drop/useAutoScroll.js.map +1 -1
  34. package/cjs/drag-drop/useDragDisplacers.js.map +1 -1
  35. package/cjs/drag-drop/useDragDrop.js.map +1 -1
  36. package/cjs/drag-drop/useDragDropCopy.js.map +1 -1
  37. package/cjs/drag-drop/useDragDropIndicator.js.map +1 -1
  38. package/cjs/drag-drop/useDragDropNaturalMovement.js.map +1 -1
  39. package/cjs/drag-drop/useDropIndicator.js.map +1 -1
  40. package/cjs/drag-drop/useGlobalDragDrop.js.map +1 -1
  41. package/cjs/editable/useEditableText.js.map +1 -1
  42. package/cjs/editable-label/EditableLabel.css.js +1 -1
  43. package/cjs/editable-label/EditableLabel.js.map +1 -1
  44. package/cjs/expando-input/ExpandoInput.js +1 -1
  45. package/cjs/expando-input/ExpandoInput.js.map +1 -1
  46. package/cjs/icon-button/Icon.js.map +1 -1
  47. package/cjs/icon-button/IconButton.js.map +1 -1
  48. package/cjs/icon-button/ToggleIconButton.css.js +1 -1
  49. package/cjs/icon-button/ToggleIconButton.js.map +1 -1
  50. package/cjs/index.js +14 -5
  51. package/cjs/index.js.map +1 -1
  52. package/cjs/instrument-picker/TablePicker.js.map +1 -1
  53. package/cjs/instrument-picker/useTablePicker.js.map +1 -1
  54. package/cjs/list/Highlighter.js.map +1 -1
  55. package/cjs/list/List.js.map +1 -1
  56. package/cjs/list/ListItem.js.map +1 -1
  57. package/cjs/list/RadioIcon.js.map +1 -1
  58. package/cjs/list/common-hooks/keyUtils.js.map +1 -1
  59. package/cjs/list/common-hooks/list-dom-utils.js.map +1 -1
  60. package/cjs/list/common-hooks/useCollapsibleGroups.js.map +1 -1
  61. package/cjs/list/common-hooks/useImperativeScrollingAPI.js.map +1 -1
  62. package/cjs/list/common-hooks/useKeyboardNavigation.js.map +1 -1
  63. package/cjs/list/common-hooks/useTypeahead.js.map +1 -1
  64. package/cjs/list/common-hooks/useViewportTracking.js.map +1 -1
  65. package/cjs/list/common-hooks/utils/collection-item-utils.js.map +1 -1
  66. package/cjs/list/common-hooks/utils/filter-utils.js.map +1 -1
  67. package/cjs/list/common-hooks/utils/isSelected.js.map +1 -1
  68. package/cjs/list/useList.js.map +1 -1
  69. package/cjs/list/useListDrop.js.map +1 -1
  70. package/cjs/list/useListHeight.js.map +1 -1
  71. package/cjs/list/useScrollPosition.js.map +1 -1
  72. package/cjs/measured-container/MeasuredContainer.js +1 -0
  73. package/cjs/measured-container/MeasuredContainer.js.map +1 -1
  74. package/cjs/measured-container/useMeasuredContainer.js +4 -1
  75. package/cjs/measured-container/useMeasuredContainer.js.map +1 -1
  76. package/cjs/measured-container/useResizeObserver.js.map +1 -1
  77. package/cjs/overflow-container/OverflowContainer.js.map +1 -1
  78. package/cjs/overflow-container/overflow-utils.js.map +1 -1
  79. package/cjs/overflow-container/useOverflowContainer.js.map +1 -1
  80. package/cjs/price-ticker/PriceTicker.js.map +1 -1
  81. package/cjs/split-button/SplitButton.css.js +1 -1
  82. package/cjs/split-button/SplitButton.js.map +1 -1
  83. package/cjs/split-button/SplitStateButton.css.js +1 -1
  84. package/cjs/split-button/SplitStateButton.js.map +1 -1
  85. package/cjs/split-button/useSplitButton.js.map +1 -1
  86. package/cjs/table-search/SearchCell.css.js +1 -1
  87. package/cjs/table-search/SearchCell.js +8 -3
  88. package/cjs/table-search/SearchCell.js.map +1 -1
  89. package/cjs/table-search/TableSearch.js +11 -18
  90. package/cjs/table-search/TableSearch.js.map +1 -1
  91. package/cjs/table-search/useTableSearch.js +1 -1
  92. package/cjs/table-search/useTableSearch.js.map +1 -1
  93. package/cjs/tabs-next/TabBar.css.js +6 -0
  94. package/cjs/tabs-next/TabBar.css.js.map +1 -0
  95. package/cjs/tabs-next/TabBar.js +41 -0
  96. package/cjs/tabs-next/TabBar.js.map +1 -0
  97. package/cjs/tabs-next/TabListNext.css.js +6 -0
  98. package/cjs/tabs-next/TabListNext.css.js.map +1 -0
  99. package/cjs/tabs-next/TabListNext.js +124 -0
  100. package/cjs/tabs-next/TabListNext.js.map +1 -0
  101. package/cjs/tabs-next/TabNext.css.js +6 -0
  102. package/cjs/tabs-next/TabNext.css.js.map +1 -0
  103. package/cjs/tabs-next/TabNext.js +110 -0
  104. package/cjs/tabs-next/TabNext.js.map +1 -0
  105. package/cjs/tabs-next/TabNextAction.js +35 -0
  106. package/cjs/tabs-next/TabNextAction.js.map +1 -0
  107. package/cjs/tabs-next/TabNextContext.js +23 -0
  108. package/cjs/tabs-next/TabNextContext.js.map +1 -0
  109. package/cjs/tabs-next/TabNextPanel.css.js +6 -0
  110. package/cjs/tabs-next/TabNextPanel.css.js.map +1 -0
  111. package/cjs/tabs-next/TabNextPanel.js +77 -0
  112. package/cjs/tabs-next/TabNextPanel.js.map +1 -0
  113. package/cjs/tabs-next/TabNextTrigger.css.js +6 -0
  114. package/cjs/tabs-next/TabNextTrigger.css.js.map +1 -0
  115. package/cjs/tabs-next/TabNextTrigger.js +74 -0
  116. package/cjs/tabs-next/TabNextTrigger.js.map +1 -0
  117. package/cjs/tabs-next/TabOverflowList.css.js +6 -0
  118. package/cjs/tabs-next/TabOverflowList.css.js.map +1 -0
  119. package/cjs/tabs-next/TabOverflowList.js +130 -0
  120. package/cjs/tabs-next/TabOverflowList.js.map +1 -0
  121. package/cjs/tabs-next/TabsNext.js +174 -0
  122. package/cjs/tabs-next/TabsNext.js.map +1 -0
  123. package/cjs/tabs-next/TabsNextContext.js +33 -0
  124. package/cjs/tabs-next/TabsNextContext.js.map +1 -0
  125. package/cjs/tabs-next/hooks/useCollection.js +91 -0
  126. package/cjs/tabs-next/hooks/useCollection.js.map +1 -0
  127. package/cjs/tabs-next/hooks/useFocusOutside.js +24 -0
  128. package/cjs/tabs-next/hooks/useFocusOutside.js.map +1 -0
  129. package/cjs/tabs-next/hooks/useOverflow.js +138 -0
  130. package/cjs/tabs-next/hooks/useOverflow.js.map +1 -0
  131. package/cjs/tabstrip/Tab.js.map +1 -1
  132. package/cjs/tabstrip/TabMenu.js.map +1 -1
  133. package/cjs/tabstrip/TabMenuOptions.js.map +1 -1
  134. package/cjs/tabstrip/Tabstrip.css.js +1 -1
  135. package/cjs/tabstrip/Tabstrip.js.map +1 -1
  136. package/cjs/tabstrip/tabstrip-dom-utils.js.map +1 -1
  137. package/cjs/tabstrip/useAnimatedSelectionThumb.js.map +1 -1
  138. package/cjs/tabstrip/useKeyboardNavigation.js.map +1 -1
  139. package/cjs/tabstrip/useSelection.js.map +1 -1
  140. package/cjs/tabstrip/useTabstrip.js.map +1 -1
  141. package/cjs/toolbar/Toolbar.js.map +1 -1
  142. package/cjs/toolbar/toolbar-dom-utils.js.map +1 -1
  143. package/cjs/toolbar/useKeyboardNavigation.js.map +1 -1
  144. package/cjs/toolbar/useSelection.js.map +1 -1
  145. package/cjs/toolbar/useToolbar.js.map +1 -1
  146. package/cjs/utils/escapeRegExp.js.map +1 -1
  147. package/cjs/utils/forwardCallbackProps.js.map +1 -1
  148. package/cjs/utils/isOverflowElement.js.map +1 -1
  149. package/cjs/vuu-date-picker/VuuDatePicker.js.map +1 -1
  150. package/cjs/vuu-input/VuuInput.js.map +1 -1
  151. package/cjs/vuu-typeahead-input/VuuTypeaheadInput.js.map +1 -1
  152. package/cjs/vuu-typeahead-input/useVuuTypeaheadInput.js.map +1 -1
  153. package/esm/calendar/Calendar.js.map +1 -1
  154. package/esm/calendar/internal/CalendarCarousel.js.map +1 -1
  155. package/esm/calendar/internal/CalendarContext.js.map +1 -1
  156. package/esm/calendar/internal/CalendarDay.js.map +1 -1
  157. package/esm/calendar/internal/CalendarMonth.js.map +1 -1
  158. package/esm/calendar/internal/CalendarNavigation.js.map +1 -1
  159. package/esm/calendar/internal/CalendarWeekHeader.js.map +1 -1
  160. package/esm/calendar/internal/useFocusManagement.js.map +1 -1
  161. package/esm/calendar/internal/utils.js.map +1 -1
  162. package/esm/calendar/useCalendar.js.map +1 -1
  163. package/esm/calendar/useCalendarDay.js.map +1 -1
  164. package/esm/calendar/useSelection.js.map +1 -1
  165. package/esm/column-picker/ColumnPicker.js.map +1 -1
  166. package/esm/column-picker/ColumnSearch.js.map +1 -1
  167. package/esm/common-hooks/collectionProvider.js.map +1 -1
  168. package/esm/common-hooks/itemToString.js.map +1 -1
  169. package/esm/common-hooks/selectionTypes.js.map +1 -1
  170. package/esm/common-hooks/use-resize-observer.js.map +1 -1
  171. package/esm/common-hooks/useCollectionItems.js.map +1 -1
  172. package/esm/common-hooks/useControlled.js.map +1 -1
  173. package/esm/common-hooks/useSelection.js.map +1 -1
  174. package/esm/cycle-state-button/CycleStateButton.js.map +1 -1
  175. package/esm/date-input/DateInput.js.map +1 -1
  176. package/esm/date-picker/DatePicker.js.map +1 -1
  177. package/esm/date-picker/DatePickerContext.js.map +1 -1
  178. package/esm/date-picker/DatePickerPanel.js.map +1 -1
  179. package/esm/drag-drop/DragDropProvider.js.map +1 -1
  180. package/esm/drag-drop/DragDropState.js.map +1 -1
  181. package/esm/drag-drop/Draggable.js +0 -5
  182. package/esm/drag-drop/Draggable.js.map +1 -1
  183. package/esm/drag-drop/dragDropTypes.js.map +1 -1
  184. package/esm/drag-drop/drop-target-utils.js.map +1 -1
  185. package/esm/drag-drop/useAutoScroll.js.map +1 -1
  186. package/esm/drag-drop/useDragDisplacers.js.map +1 -1
  187. package/esm/drag-drop/useDragDrop.js +1 -1
  188. package/esm/drag-drop/useDragDrop.js.map +1 -1
  189. package/esm/drag-drop/useDragDropCopy.js.map +1 -1
  190. package/esm/drag-drop/useDragDropIndicator.js +1 -1
  191. package/esm/drag-drop/useDragDropIndicator.js.map +1 -1
  192. package/esm/drag-drop/useDragDropNaturalMovement.js +1 -1
  193. package/esm/drag-drop/useDragDropNaturalMovement.js.map +1 -1
  194. package/esm/drag-drop/useDropIndicator.js.map +1 -1
  195. package/esm/drag-drop/useGlobalDragDrop.js.map +1 -1
  196. package/esm/editable/useEditableText.js.map +1 -1
  197. package/esm/editable-label/EditableLabel.css.js +1 -1
  198. package/esm/editable-label/EditableLabel.js.map +1 -1
  199. package/esm/expando-input/ExpandoInput.js +1 -1
  200. package/esm/expando-input/ExpandoInput.js.map +1 -1
  201. package/esm/icon-button/Icon.js.map +1 -1
  202. package/esm/icon-button/IconButton.js.map +1 -1
  203. package/esm/icon-button/ToggleIconButton.css.js +1 -1
  204. package/esm/icon-button/ToggleIconButton.js.map +1 -1
  205. package/esm/index.js +7 -2
  206. package/esm/index.js.map +1 -1
  207. package/esm/instrument-picker/TablePicker.js.map +1 -1
  208. package/esm/instrument-picker/useTablePicker.js.map +1 -1
  209. package/esm/list/Highlighter.js.map +1 -1
  210. package/esm/list/List.js.map +1 -1
  211. package/esm/list/ListItem.js.map +1 -1
  212. package/esm/list/RadioIcon.js.map +1 -1
  213. package/esm/list/common-hooks/keyUtils.js.map +1 -1
  214. package/esm/list/common-hooks/list-dom-utils.js.map +1 -1
  215. package/esm/list/common-hooks/useCollapsibleGroups.js.map +1 -1
  216. package/esm/list/common-hooks/useImperativeScrollingAPI.js.map +1 -1
  217. package/esm/list/common-hooks/useKeyboardNavigation.js.map +1 -1
  218. package/esm/list/common-hooks/useTypeahead.js.map +1 -1
  219. package/esm/list/common-hooks/useViewportTracking.js.map +1 -1
  220. package/esm/list/common-hooks/utils/collection-item-utils.js.map +1 -1
  221. package/esm/list/common-hooks/utils/filter-utils.js.map +1 -1
  222. package/esm/list/common-hooks/utils/isSelected.js.map +1 -1
  223. package/esm/list/useList.js.map +1 -1
  224. package/esm/list/useListDrop.js.map +1 -1
  225. package/esm/list/useListHeight.js.map +1 -1
  226. package/esm/list/useScrollPosition.js.map +1 -1
  227. package/esm/measured-container/MeasuredContainer.js +1 -0
  228. package/esm/measured-container/MeasuredContainer.js.map +1 -1
  229. package/esm/measured-container/useMeasuredContainer.js +4 -1
  230. package/esm/measured-container/useMeasuredContainer.js.map +1 -1
  231. package/esm/measured-container/useResizeObserver.js.map +1 -1
  232. package/esm/overflow-container/OverflowContainer.js.map +1 -1
  233. package/esm/overflow-container/overflow-utils.js.map +1 -1
  234. package/esm/overflow-container/useOverflowContainer.js.map +1 -1
  235. package/esm/price-ticker/PriceTicker.js.map +1 -1
  236. package/esm/split-button/SplitButton.css.js +1 -1
  237. package/esm/split-button/SplitButton.js.map +1 -1
  238. package/esm/split-button/SplitStateButton.css.js +1 -1
  239. package/esm/split-button/SplitStateButton.js.map +1 -1
  240. package/esm/split-button/useSplitButton.js.map +1 -1
  241. package/esm/table-search/SearchCell.css.js +1 -1
  242. package/esm/table-search/SearchCell.js +8 -3
  243. package/esm/table-search/SearchCell.js.map +1 -1
  244. package/esm/table-search/TableSearch.js +12 -19
  245. package/esm/table-search/TableSearch.js.map +1 -1
  246. package/esm/table-search/useTableSearch.js +1 -1
  247. package/esm/table-search/useTableSearch.js.map +1 -1
  248. package/esm/tabs-next/TabBar.css.js +4 -0
  249. package/esm/tabs-next/TabBar.css.js.map +1 -0
  250. package/esm/tabs-next/TabBar.js +39 -0
  251. package/esm/tabs-next/TabBar.js.map +1 -0
  252. package/esm/tabs-next/TabListNext.css.js +4 -0
  253. package/esm/tabs-next/TabListNext.css.js.map +1 -0
  254. package/esm/tabs-next/TabListNext.js +122 -0
  255. package/esm/tabs-next/TabListNext.js.map +1 -0
  256. package/esm/tabs-next/TabNext.css.js +4 -0
  257. package/esm/tabs-next/TabNext.css.js.map +1 -0
  258. package/esm/tabs-next/TabNext.js +108 -0
  259. package/esm/tabs-next/TabNext.js.map +1 -0
  260. package/esm/tabs-next/TabNextAction.js +33 -0
  261. package/esm/tabs-next/TabNextAction.js.map +1 -0
  262. package/esm/tabs-next/TabNextContext.js +20 -0
  263. package/esm/tabs-next/TabNextContext.js.map +1 -0
  264. package/esm/tabs-next/TabNextPanel.css.js +4 -0
  265. package/esm/tabs-next/TabNextPanel.css.js.map +1 -0
  266. package/esm/tabs-next/TabNextPanel.js +75 -0
  267. package/esm/tabs-next/TabNextPanel.js.map +1 -0
  268. package/esm/tabs-next/TabNextTrigger.css.js +4 -0
  269. package/esm/tabs-next/TabNextTrigger.css.js.map +1 -0
  270. package/esm/tabs-next/TabNextTrigger.js +72 -0
  271. package/esm/tabs-next/TabNextTrigger.js.map +1 -0
  272. package/esm/tabs-next/TabOverflowList.css.js +4 -0
  273. package/esm/tabs-next/TabOverflowList.css.js.map +1 -0
  274. package/esm/tabs-next/TabOverflowList.js +128 -0
  275. package/esm/tabs-next/TabOverflowList.js.map +1 -0
  276. package/esm/tabs-next/TabsNext.js +172 -0
  277. package/esm/tabs-next/TabsNext.js.map +1 -0
  278. package/esm/tabs-next/TabsNextContext.js +30 -0
  279. package/esm/tabs-next/TabsNextContext.js.map +1 -0
  280. package/esm/tabs-next/hooks/useCollection.js +89 -0
  281. package/esm/tabs-next/hooks/useCollection.js.map +1 -0
  282. package/esm/tabs-next/hooks/useFocusOutside.js +22 -0
  283. package/esm/tabs-next/hooks/useFocusOutside.js.map +1 -0
  284. package/esm/tabs-next/hooks/useOverflow.js +136 -0
  285. package/esm/tabs-next/hooks/useOverflow.js.map +1 -0
  286. package/esm/tabstrip/Tab.js.map +1 -1
  287. package/esm/tabstrip/TabMenu.js.map +1 -1
  288. package/esm/tabstrip/TabMenuOptions.js.map +1 -1
  289. package/esm/tabstrip/Tabstrip.css.js +1 -1
  290. package/esm/tabstrip/Tabstrip.js.map +1 -1
  291. package/esm/tabstrip/tabstrip-dom-utils.js.map +1 -1
  292. package/esm/tabstrip/useAnimatedSelectionThumb.js.map +1 -1
  293. package/esm/tabstrip/useKeyboardNavigation.js.map +1 -1
  294. package/esm/tabstrip/useSelection.js.map +1 -1
  295. package/esm/tabstrip/useTabstrip.js.map +1 -1
  296. package/esm/toolbar/Toolbar.js.map +1 -1
  297. package/esm/toolbar/toolbar-dom-utils.js.map +1 -1
  298. package/esm/toolbar/useKeyboardNavigation.js.map +1 -1
  299. package/esm/toolbar/useSelection.js.map +1 -1
  300. package/esm/toolbar/useToolbar.js.map +1 -1
  301. package/esm/utils/escapeRegExp.js.map +1 -1
  302. package/esm/utils/forwardCallbackProps.js.map +1 -1
  303. package/esm/utils/isOverflowElement.js.map +1 -1
  304. package/esm/vuu-date-picker/VuuDatePicker.js.map +1 -1
  305. package/esm/vuu-input/VuuInput.js.map +1 -1
  306. package/esm/vuu-typeahead-input/VuuTypeaheadInput.js.map +1 -1
  307. package/esm/vuu-typeahead-input/useVuuTypeaheadInput.js.map +1 -1
  308. package/package.json +15 -14
  309. package/types/calendar/Calendar.d.ts +0 -1
  310. package/types/calendar/internal/CalendarCarousel.d.ts +0 -1
  311. package/types/calendar/internal/CalendarContext.d.ts +0 -1
  312. package/types/calendar/internal/CalendarWeekHeader.d.ts +1 -1
  313. package/types/calendar/useCalendar.d.ts +4 -4
  314. package/types/calendar/useCalendarDay.d.ts +2 -2
  315. package/types/column-picker/ColumnPicker.d.ts +0 -1
  316. package/types/common-hooks/collectionProvider.d.ts +1 -1
  317. package/types/common-hooks/selectionTypes.d.ts +1 -1
  318. package/types/cycle-state-button/CycleStateButton.d.ts +2 -2
  319. package/types/date-picker/DatePickerContext.d.ts +0 -1
  320. package/types/drag-drop/DragDropProvider.d.ts +1 -1
  321. package/types/drag-drop/DropIndicator.d.ts +1 -2
  322. package/types/drag-drop/drop-target-utils.d.ts +24 -20
  323. package/types/drag-drop/useAutoScroll.d.ts +4 -4
  324. package/types/drag-drop/useGlobalDragDrop.d.ts +0 -1
  325. package/types/expando-input/ExpandoInput.d.ts +2 -2
  326. package/types/icon-button/Icon.d.ts +1 -1
  327. package/types/icon-button/IconButton.d.ts +0 -1
  328. package/types/icon-button/ToggleIconButton.d.ts +1 -2
  329. package/types/index.d.ts +1 -1
  330. package/types/instrument-picker/SearchCell.d.ts +1 -2
  331. package/types/instrument-picker/TablePicker.d.ts +1 -1
  332. package/types/instrument-picker/useTablePicker.d.ts +3 -10
  333. package/types/list/ChevronIcon.d.ts +1 -1
  334. package/types/list/ListItem.d.ts +1 -1
  335. package/types/list/RadioIcon.d.ts +1 -2
  336. package/types/list/common-hooks/useTypeahead.d.ts +0 -1
  337. package/types/measured-container/MeasuredContainer.d.ts +1 -1
  338. package/types/overflow-container/useOverflowContainer.d.ts +4 -5
  339. package/types/price-ticker/PriceTicker.d.ts +1 -1
  340. package/types/split-button/SplitStateButton.d.ts +0 -1
  341. package/types/split-button/useSplitButton.d.ts +71 -60
  342. package/types/table-search/SearchCell.d.ts +1 -2
  343. package/types/table-search/TableSearch.d.ts +2 -4
  344. package/types/table-search/useTableSearch.d.ts +4 -2
  345. package/types/tabs-next/TabBar.d.ts +12 -0
  346. package/types/tabs-next/TabListNext.d.ts +12 -0
  347. package/types/tabs-next/TabNext.d.ts +12 -0
  348. package/types/tabs-next/TabNextAction.d.ts +5 -0
  349. package/types/tabs-next/TabNextContext.d.ts +12 -0
  350. package/types/tabs-next/TabNextPanel.d.ts +8 -0
  351. package/types/tabs-next/TabNextTrigger.d.ts +5 -0
  352. package/types/tabs-next/TabOverflowList.d.ts +11 -0
  353. package/types/tabs-next/TabsNext.d.ts +17 -0
  354. package/types/tabs-next/TabsNextContext.d.ts +21 -0
  355. package/types/tabs-next/hooks/useCollection.d.ts +18 -0
  356. package/types/tabs-next/hooks/useFocusOutside.d.ts +2 -0
  357. package/types/tabs-next/hooks/useOverflow.d.ts +11 -0
  358. package/types/tabs-next/index.d.ts +7 -0
  359. package/types/tabstrip/Tab.d.ts +23 -22
  360. package/types/tabstrip/TabMenu.d.ts +1 -2
  361. package/types/tabstrip/Tabstrip.d.ts +1 -2
  362. package/types/tabstrip/useSelection.d.ts +3 -3
  363. package/types/tabstrip/useTabstrip.d.ts +5 -5
  364. package/types/toolbar/Toolbar.d.ts +1 -2
  365. package/types/toolbar/useToolbar.d.ts +1 -1
  366. package/types/vuu-date-picker/VuuDatePicker.d.ts +4 -6
  367. package/types/vuu-input/VuuInput.d.ts +1 -1
  368. package/types/vuu-typeahead-input/VuuTypeaheadInput.d.ts +1 -2
  369. package/cjs/tree/Tree.css.js +0 -6
  370. package/cjs/tree/Tree.css.js.map +0 -1
  371. package/cjs/tree/Tree.js +0 -179
  372. package/cjs/tree/Tree.js.map +0 -1
  373. package/cjs/tree/hierarchical-data-utils.js +0 -72
  374. package/cjs/tree/hierarchical-data-utils.js.map +0 -1
  375. package/cjs/tree/key-code.js +0 -62
  376. package/cjs/tree/key-code.js.map +0 -1
  377. package/cjs/tree/list-dom-utils.js +0 -19
  378. package/cjs/tree/list-dom-utils.js.map +0 -1
  379. package/cjs/tree/treeTypeUtils.js +0 -6
  380. package/cjs/tree/treeTypeUtils.js.map +0 -1
  381. package/cjs/tree/use-collapsible-groups.js +0 -85
  382. package/cjs/tree/use-collapsible-groups.js.map +0 -1
  383. package/cjs/tree/use-hierarchical-data.js +0 -51
  384. package/cjs/tree/use-hierarchical-data.js.map +0 -1
  385. package/cjs/tree/use-items-with-ids.js +0 -100
  386. package/cjs/tree/use-items-with-ids.js.map +0 -1
  387. package/cjs/tree/use-keyboard-navigation.js +0 -144
  388. package/cjs/tree/use-keyboard-navigation.js.map +0 -1
  389. package/cjs/tree/use-selection.js +0 -154
  390. package/cjs/tree/use-selection.js.map +0 -1
  391. package/cjs/tree/use-tree-keyboard-navigation.js +0 -41
  392. package/cjs/tree/use-tree-keyboard-navigation.js.map +0 -1
  393. package/cjs/tree/use-viewport-tracking.js +0 -76
  394. package/cjs/tree/use-viewport-tracking.js.map +0 -1
  395. package/cjs/tree/useTree.js +0 -106
  396. package/cjs/tree/useTree.js.map +0 -1
  397. package/esm/tree/Tree.css.js +0 -4
  398. package/esm/tree/Tree.css.js.map +0 -1
  399. package/esm/tree/Tree.js +0 -176
  400. package/esm/tree/Tree.js.map +0 -1
  401. package/esm/tree/hierarchical-data-utils.js +0 -65
  402. package/esm/tree/hierarchical-data-utils.js.map +0 -1
  403. package/esm/tree/key-code.js +0 -54
  404. package/esm/tree/key-code.js.map +0 -1
  405. package/esm/tree/list-dom-utils.js +0 -15
  406. package/esm/tree/list-dom-utils.js.map +0 -1
  407. package/esm/tree/treeTypeUtils.js +0 -4
  408. package/esm/tree/treeTypeUtils.js.map +0 -1
  409. package/esm/tree/use-collapsible-groups.js +0 -83
  410. package/esm/tree/use-collapsible-groups.js.map +0 -1
  411. package/esm/tree/use-hierarchical-data.js +0 -49
  412. package/esm/tree/use-hierarchical-data.js.map +0 -1
  413. package/esm/tree/use-items-with-ids.js +0 -98
  414. package/esm/tree/use-items-with-ids.js.map +0 -1
  415. package/esm/tree/use-keyboard-navigation.js +0 -142
  416. package/esm/tree/use-keyboard-navigation.js.map +0 -1
  417. package/esm/tree/use-selection.js +0 -147
  418. package/esm/tree/use-selection.js.map +0 -1
  419. package/esm/tree/use-tree-keyboard-navigation.js +0 -39
  420. package/esm/tree/use-tree-keyboard-navigation.js.map +0 -1
  421. package/esm/tree/use-viewport-tracking.js +0 -74
  422. package/esm/tree/use-viewport-tracking.js.map +0 -1
  423. package/esm/tree/useTree.js +0 -104
  424. package/esm/tree/useTree.js.map +0 -1
  425. package/types/tree/Tree.d.ts +0 -19
  426. package/types/tree/hierarchical-data-utils.d.ts +0 -8
  427. package/types/tree/index.d.ts +0 -3
  428. package/types/tree/key-code.d.ts +0 -11
  429. package/types/tree/list-dom-utils.d.ts +0 -6
  430. package/types/tree/treeTypeUtils.d.ts +0 -2
  431. package/types/tree/use-collapsible-groups.d.ts +0 -18
  432. package/types/tree/use-hierarchical-data.d.ts +0 -6
  433. package/types/tree/use-items-with-ids.d.ts +0 -8
  434. package/types/tree/use-keyboard-navigation.d.ts +0 -26
  435. package/types/tree/use-selection.d.ts +0 -31
  436. package/types/tree/use-tree-keyboard-navigation.d.ts +0 -12
  437. package/types/tree/use-viewport-tracking.d.ts +0 -2
  438. package/types/tree/useTree.d.ts +0 -30
@@ -21,12 +21,12 @@ type InteractedTabState = {
21
21
  state: "rename";
22
22
  };
23
23
  export declare const useTabstrip: ({ activeTabIndex: activeTabIndexProp, allowDragDrop, animateSelectionThumb, containerRef, onActiveChange, onAddTab, onCloseTab, onExitEditMode, onMoveTab, orientation, keyBoardActivation, }: TabstripHookProps) => {
24
- draggable?: JSX.Element | undefined;
25
- dropIndicator?: JSX.Element | undefined;
26
- draggedItemIndex?: number | undefined;
24
+ draggable?: JSX.Element;
25
+ dropIndicator?: JSX.Element;
26
+ draggedItemIndex?: number;
27
27
  isDragging: boolean;
28
28
  isScrolling: RefObject<boolean>;
29
- revealOverflowedItems?: boolean | undefined;
29
+ revealOverflowedItems?: boolean;
30
30
  activeTabIndex: number;
31
31
  containerProps: {
32
32
  onSwitchWrappedItemIntoView: (item: OverflowItem) => void;
@@ -39,7 +39,7 @@ export declare const useTabstrip: ({ activeTabIndex: activeTabIndexProp, allowDr
39
39
  focusVisible: number;
40
40
  interactedTabState: InteractedTabState | undefined;
41
41
  navigationProps: {
42
- onFocus: (evt: import("react").FocusEvent<HTMLElement, Element>) => void;
42
+ onFocus: (evt: import("react").FocusEvent<HTMLElement>) => void;
43
43
  onKeyDown: (evt: KeyboardEvent) => void;
44
44
  };
45
45
  onClickAddTab: () => void;
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  import { OverflowContainerProps } from "../overflow-container";
3
2
  import { SelectionStrategy, SpecialKeyMultipleSelection } from "../common-hooks";
4
3
  export type ActiveItemChangeHandler = (itemIndex: number[]) => void;
@@ -17,4 +16,4 @@ export interface ToolbarProps extends OverflowContainerProps {
17
16
  selectionStrategy?: SelectionStrategy | SpecialKeyMultipleSelection;
18
17
  showSeparators?: boolean;
19
18
  }
20
- export declare const Toolbar: ({ activeItemIndex: activeItemIndexProp, alignItems, defaultActiveItemIndex, children, className, id: idProp, onActiveChange, onNavigateOutOfBounds, orientation, selectionStrategy, showSeparators, ...props }: ToolbarProps) => JSX.Element;
19
+ export declare const Toolbar: ({ activeItemIndex: activeItemIndexProp, alignItems, defaultActiveItemIndex, children, className, id: idProp, onActiveChange, onNavigateOutOfBounds, orientation, selectionStrategy, showSeparators, ...props }: ToolbarProps) => import("react/jsx-runtime").JSX.Element;
@@ -22,7 +22,7 @@ export declare const useToolbar: ({ activeItemIndex: activeItemIndexProp, defaul
22
22
  };
23
23
  itemProps: {
24
24
  onClick: (evt: ReactMouseEvent<HTMLElement>) => void;
25
- onFocus: (evt: import("react").FocusEvent<HTMLElement, Element>) => void;
25
+ onFocus: (evt: import("react").FocusEvent<HTMLElement>) => void;
26
26
  onKeyDown: (evt: KeyboardEvent) => void;
27
27
  };
28
28
  };
@@ -1,9 +1,7 @@
1
- /// <reference types="react" />
2
1
  import { CommitHandler } from "@vuu-ui/vuu-utils";
3
- import { DateValue } from "@internationalized/date";
4
2
  import { SingleSelectionValueType } from "../calendar";
5
3
  import { DatePickerProps } from "../date-picker";
6
- export declare const VuuDatePicker: ({ className, onSelectionChange, selectedDate: selectedDateProp, onCommit, preserveFocusOnSelect, ...props }: Omit<DatePickerProps<DateValue>, "defaultSelectedDate"> & {
7
- onCommit?: CommitHandler<HTMLElement, number> | undefined;
8
- preserveFocusOnSelect?: boolean | undefined;
9
- }) => JSX.Element;
4
+ export declare const VuuDatePicker: ({ className, onSelectionChange, selectedDate: selectedDateProp, onCommit, preserveFocusOnSelect, ...props }: Omit<DatePickerProps<SingleSelectionValueType>, "defaultSelectedDate"> & {
5
+ onCommit?: CommitHandler<HTMLElement, number>;
6
+ preserveFocusOnSelect?: boolean;
7
+ }) => import("react/jsx-runtime").JSX.Element;
@@ -5,7 +5,7 @@ import { ForwardedRef, ReactElement, ReactNode } from "react";
5
5
  export interface VuuInputProps<T extends VuuRowDataItemType = string> extends Omit<InputProps, "validationStatus"> {
6
6
  commitWhenCleared?: boolean;
7
7
  errorMessage?: ReactNode;
8
- onCommit: CommitHandler<HTMLInputElement, T | undefined>;
8
+ onCommit: CommitHandler;
9
9
  type?: T;
10
10
  }
11
11
  /**
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  import type { TableSchemaTable } from "@vuu-ui/vuu-data-types";
3
2
  import { type CommitHandler } from "@vuu-ui/vuu-utils";
4
3
  import { PillInputProps } from "@salt-ds/core/dist-types/pill-input";
@@ -27,4 +26,4 @@ export interface VuuTypeaheadInputProps {
27
26
  onCommit: CommitHandler<HTMLInputElement>;
28
27
  table: TableSchemaTable;
29
28
  }
30
- export declare const VuuTypeaheadInput: ({ allowFreeInput, column, freeTextWarning, highlightFirstSuggestion, inputProps: inputPropsProp, onCommit, table, }: VuuTypeaheadInputProps) => JSX.Element;
29
+ export declare const VuuTypeaheadInput: ({ allowFreeInput, column, freeTextWarning, highlightFirstSuggestion, inputProps: inputPropsProp, onCommit, table, }: VuuTypeaheadInputProps) => import("react/jsx-runtime").JSX.Element;
@@ -1,6 +0,0 @@
1
- 'use strict';
2
-
3
- var treeCss = ".vuuTree {\n --tree-node-collapse: var(--vuuTree-toggle-collapse, var(--svg-tree-node-collapse));\n --tree-node-expand: var(--vuuTree-toggle-expand, var(--svg-tree-node-expand));\n --tree-toggle-width: 12px;\n --tree-icon-color: var(--vuuTree-icon-color, #4c505b);\n --tree-node-expanded-transform: var(--vuuTree-node-expanded-transform, none);\n --tree-node-indent: 0px;\n\n --list-hilited-bg: var(--hw-list-hilited-bg, rgba(0, 0, 0, 0.1));\n --list-item-height: var(--hw-list-item-height, 30px);\n --list-item-padding: var(--hw-list-item-padding, 0 6px);\n --list-item-header-bg: var(--hw-list-item-header-bg, black);\n --list-item-header-color: var(--hw-list-item-header-color, white);\n --list-item-header-font-weight: bold;\n --list-item-header-twisty-color: black;\n --list-item-header-twisty-content: '';\n --list-item-header-twisty-top: 50%;\n --list-item-header-twisty-left: -18px;\n --list-item-header-twisty-right: auto;\n --list-item-selected-bg: var(--hw-list-selected-bg, #1ea7fd);\n --list-item-selected-color: white;\n --list-item-text-color: var(--hw-gray-800);\n --focus-visible-border-color: var(--hw-focus-visible-border-color, rgb(141, 154, 179));\n\n list-style: none;\n margin: 0;\n padding: 0 1px;\n font-size: var(--vuuTree-font-size, 14px);\n max-height: inherit;\n outline: none;\n overflow-y: auto;\n position: relative;\n user-select: none;\n}\n\n.vuuTree-viewport {\n --list-item-height: 30px;\n box-sizing: border-box;\n max-height: inherit;\n overflow: auto;\n}\n\n.vuuTree-scrollingContentContainer {\n box-sizing: inherit;\n position: relative;\n}\n\n.vuuTree-scrollingContentContainer .vuuTreeNode {\n line-height: 30px;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n will-change: transform;\n}\n\n.vuuTreeNode {\n list-style: none;\n}\n\n/* Leaf node or the div child of a collapsible node */\n.vuuTreeNode:not([aria-expanded]),\n.vuuTreeNode[aria-expanded] > .vuuTreeNode-label {\n --checkbox-border-color: black;\n --checkbox-border-width: 1px;\n --checkbox-tick: black;\n --list-item-padding-left: 6px;\n --svg-toggle: var(--tree-node-collapse);\n\n align-items: center;\n color: var(--list-item-text-color);\n display: flex;\n flex-wrap: nowrap;\n height: var(--list-item-height);\n line-height: var(--list-item-height);\n padding: var(--list-item-padding);\n padding-left: var(--padding-left);\n position: relative;\n cursor: default;\n margin: 0;\n white-space: nowrap;\n}\n\n.vuuTreeNode:not([aria-expanded]) {\n --padding-left: calc(\n var(--list-item-padding-left) + var(--tree-toggle-width) + var(--tree-node-indent)\n );\n}\n\n.vuuTreeNode[aria-expanded] > .vuuTreeNode-label {\n --padding-left: calc(\n var(--list-item-padding-left) + var(--tree-toggle-width) + var(--tree-node-indent)\n );\n}\n\n.vuuTreeNode-icon {\n background-color: var(--tree-icon-color);\n display: inline-block;\n height: 18px;\n margin-right: 6px;\n -webkit-mask: var(--vuu-icon-svg) center center/12px 12px no-repeat;\n mask: var(--vuu-icon-svg) center center/12px 12px no-repeat;\n flex: 0 0 18px;\n}\n\n.vuuTreeNode[aria-expanded] {\n flex-direction: column;\n}\n\n.vuuTreeNode[aria-expanded] {\n flex-direction: column;\n height: auto;\n}\n\n.vuuTreeNode > *[role='group'] {\n padding-left: 0px;\n}\n\n.vuuTreeNode {\n padding-left: calc(var(--padding-left) + var(--tree-node-indent));\n}\n\n.vuuTreeNode[aria-level='2'] {\n --tree-node-indent: 12px;\n}\n.vuuTreeNode[aria-level='3'] {\n --tree-node-indent: 24px;\n}\n.vuuTreeNode[aria-level='4'] {\n --tree-node-indent: 36px;\n}\n\n.vuuTreeNode:not(.focusVisible):not(.hwListItemHeader):not([aria-expanded])[data-highlighted],\n.vuuTreeNode:not(.focusVisible):not(.hwListItemHeader)[aria-expanded][data-highlighted]\n > div:first-child {\n background-color: var(--list-hilited-bg);\n}\n\n.vuuTreeNode-toggle {\n cursor: pointer;\n}\n\n.vuuTreeNode > .vuuTreeNode-toggle {\n display: inline-block;\n height: 100%;\n left: 0;\n position: absolute;\n width: calc(var(--list-item-padding-left) + var(--tree-toggle-width));\n}\n\n.vuuTreeNode[aria-expanded] > .vuuTreeNode-label:after {\n content: var(--list-item-header-twisty-content);\n -webkit-mask: var(--svg-toggle) center center/8px 8px no-repeat;\n mask: var(--svg-toggle) center center/8px 8px no-repeat;\n background-color: var(--list-item-header-twisty-color);\n height: 18px;\n margin-top: -9px;\n left: var(--tree-node-indent);\n position: absolute;\n top: var(--list-item-header-twisty-top);\n transition: transform 0.3s;\n width: 18px;\n}\n\n.vuuTreeNode[aria-selected='true'] {\n --list-item-header-twisty-color: var(--list-item-selected-color);\n}\n\n\n.vuuTreeNode:not(.focusVisible):focus {\n background-color: rgba(0, 0, 0, 0.1);\n}\n\n.vuuTreeNode:not([aria-expanded]).focusVisible:before,\n.vuuTreeNode[aria-expanded].focusVisible > div:first-child:before {\n content: '';\n position: absolute;\n top: 0px;\n left: var(--tree-focus-offset, 0px);\n right: 0;\n bottom: 0px;\n border: dotted var(--focus-visible-border-color) 2px;\n background-color: var(--list-hilited-bg);\n}\n\n\n.vuuTreeNode[aria-expanded='false'] > *:first-child:after {\n --svg-toggle: var(--tree-node-expand);\n}\n\n.vuuTreeNode[aria-expanded='true'] > *:first-child:after {\n transform: var(--tree-node-expanded-transform);\n}\n\n/* Selection */\n\n.vuuTree:not(.checkbox-only) .vuuTreeNode:not([aria-expanded])[aria-selected='true'],\n.vuuTree:not(.checkbox-only) .vuuTreeNode[aria-expanded][aria-selected='true'] > div:first-child {\n --checkbox-border-color: var(--list-item-selected-color);\n --checkbox-tick: var(--list-item-selected-color);\n --focus-visible-border-color: var(--list-item-selected-color);\n background-color: var(--list-item-selected-bg);\n color: var(--list-item-selected-color);\n}\n\n.with-checkbox .vuuTreeNode {\n padding-left: 28px;\n}\n\n.with-checkbox .vuuTreeNode:before {\n border-style: solid;\n border-width: var(--checkbox-border-width);\n border-color: var(--checkbox-border-color);\n content: '';\n height: 12px;\n left: 3px;\n margin-top: -7px;\n position: absolute;\n top: 50%;\n width: 12px;\n}\n";
4
-
5
- module.exports = treeCss;
6
- //# sourceMappingURL=Tree.css.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Tree.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
package/cjs/tree/Tree.js DELETED
@@ -1,179 +0,0 @@
1
- 'use strict';
2
-
3
- var jsxRuntime = require('react/jsx-runtime');
4
- var React = require('react');
5
- var core = require('@salt-ds/core');
6
- var cx = require('clsx');
7
- var styles = require('@salt-ds/styles');
8
- var window = require('@salt-ds/window');
9
- var listDomUtils = require('./list-dom-utils.js');
10
- var treeTypeUtils = require('./treeTypeUtils.js');
11
- var useItemsWithIds = require('./use-items-with-ids.js');
12
- var useSelection = require('./use-selection.js');
13
- var useViewportTracking = require('./use-viewport-tracking.js');
14
- var useTree = require('./useTree.js');
15
- var Tree$1 = require('./Tree.css.js');
16
-
17
- const classBase = "vuuTree";
18
- const TreeNode = ({ children, idx, ...props }) => {
19
- return /* @__PURE__ */ jsxRuntime.jsx("li", { ...props, children });
20
- };
21
- const Tree = React.forwardRef(function Tree2({
22
- allowDragDrop,
23
- className,
24
- defaultSelected,
25
- groupSelection = "none",
26
- id: idProp,
27
- onHighlight,
28
- onSelectionChange,
29
- revealSelected,
30
- selected: selectedProp,
31
- selection = "single",
32
- source,
33
- ...htmlAttributes
34
- }, forwardedRef) {
35
- const targetWindow = window.useWindow();
36
- styles.useComponentCssInjection({
37
- testId: "vuu-tree",
38
- css: Tree$1,
39
- window: targetWindow
40
- });
41
- const id = core.useIdMemo(idProp);
42
- const rootRef = React.useRef(null);
43
- const [, sourceWithIds, sourceItemById] = useItemsWithIds.useItemsWithIds(source, id, {
44
- revealSelected: revealSelected ? selectedProp ?? defaultSelected ?? false : void 0
45
- });
46
- const handleSelectionChange = (evt, selected2) => {
47
- if (onSelectionChange) {
48
- const sourceItems = selected2.map((id2) => sourceItemById(id2)).filter((sourceItem) => sourceItem !== void 0);
49
- onSelectionChange(sourceItems);
50
- }
51
- };
52
- const {
53
- focusVisible,
54
- highlightedIdx,
55
- hiliteItemAtIndex,
56
- listProps,
57
- listItemHandlers,
58
- selected,
59
- visibleData
60
- } = useTree.useTree({
61
- defaultSelected,
62
- groupSelection,
63
- onChange: handleSelectionChange,
64
- onHighlight,
65
- selected: selectedProp,
66
- selection,
67
- sourceWithIds
68
- });
69
- useViewportTracking.useViewportTracking(rootRef, highlightedIdx);
70
- const defaultItemHandlers = {
71
- onMouseEnter: (evt) => {
72
- const targetEl = evt.target;
73
- const idx = listDomUtils.closestListItemIndex(targetEl);
74
- hiliteItemAtIndex(idx);
75
- }
76
- };
77
- const propsCommonToAllListItems = {
78
- ...defaultItemHandlers,
79
- ...listItemHandlers,
80
- role: "treeitem"
81
- };
82
- const allowGroupSelect = useSelection.groupSelectionEnabled(groupSelection);
83
- function addLeafNode(list, item, idx) {
84
- list.push(
85
- /* @__PURE__ */ jsxRuntime.jsxs(
86
- TreeNode,
87
- {
88
- ...propsCommonToAllListItems,
89
- ...getListItemProps(item, idx, highlightedIdx, selected, focusVisible),
90
- children: [
91
- item.icon ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: `${classBase}Node-icon`, "data-icon": item.icon }) : null,
92
- /* @__PURE__ */ jsxRuntime.jsx("span", { children: item.label })
93
- ]
94
- }
95
- )
96
- );
97
- idx.value += 1;
98
- }
99
- function addGroupNode(list, child, idx, id2, title) {
100
- const { value: i } = idx;
101
- idx.value += 1;
102
- list.push(
103
- /* @__PURE__ */ React.createElement(
104
- TreeNode,
105
- {
106
- ...listItemHandlers,
107
- "aria-expanded": child.expanded,
108
- "aria-level": child.level,
109
- "aria-selected": selected.includes(id2) || void 0,
110
- className: cx(`${classBase}Node`, {
111
- focusVisible: focusVisible === i,
112
- [`${classBase}Node-toggle`]: !allowGroupSelect
113
- }),
114
- "data-idx": i,
115
- "data-highlighted": i === highlightedIdx || void 0,
116
- "data-selectable": true,
117
- id: id2,
118
- key: `header-${i}`
119
- },
120
- allowGroupSelect ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `${classBase}Node-label`, children: [
121
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: `${classBase}Node-toggle` }),
122
- title
123
- ] }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `${classBase}Node-label`, children: [
124
- child.icon ? /* @__PURE__ */ jsxRuntime.jsx(
125
- "span",
126
- {
127
- className: `${classBase}Node-icon`,
128
- "data-icon": child.icon
129
- }
130
- ) : null,
131
- /* @__PURE__ */ jsxRuntime.jsx("span", { children: title })
132
- ] }),
133
- /* @__PURE__ */ jsxRuntime.jsx("ul", { role: "group", children: treeTypeUtils.isExpanded(child) ? renderSourceContent(child.childNodes, idx) : "" })
134
- )
135
- );
136
- }
137
- function renderSourceContent(items, idx = { value: 0 }) {
138
- if (items?.length > 0) {
139
- const listItems = [];
140
- for (const item of items) {
141
- if (item.childNodes) {
142
- addGroupNode(listItems, item, idx, item.id, item.label);
143
- } else {
144
- addLeafNode(listItems, item, idx);
145
- }
146
- }
147
- return listItems;
148
- }
149
- }
150
- return /* @__PURE__ */ jsxRuntime.jsx(
151
- "ul",
152
- {
153
- ...htmlAttributes,
154
- ...listProps,
155
- className: cx(classBase, className),
156
- id: `Tree-${id}`,
157
- ref: core.useForkRef(rootRef, forwardedRef),
158
- role: "tree",
159
- tabIndex: 0,
160
- children: renderSourceContent(visibleData)
161
- }
162
- );
163
- });
164
- const getListItemProps = (item, idx, highlightedIdx, selected, focusVisible, className) => ({
165
- id: item.id,
166
- key: item.id,
167
- "aria-level": item.level,
168
- "aria-selected": selected.includes(item.id) || void 0,
169
- "data-idx": idx.value,
170
- "data-highlighted": idx.value === highlightedIdx || void 0,
171
- className: cx("vuuTreeNode", className, {
172
- focusVisible: focusVisible === idx.value
173
- })
174
- });
175
- Tree.displayName = "Tree";
176
-
177
- exports.Tree = Tree;
178
- exports.TreeNode = TreeNode;
179
- //# sourceMappingURL=Tree.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Tree.js","sources":["../../src/tree/Tree.tsx"],"sourcesContent":["import { useForkRef, useIdMemo as useId } from \"@salt-ds/core\";\nimport cx from \"clsx\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport {\n ForwardedRef,\n HTMLAttributes,\n MouseEvent,\n forwardRef,\n useRef,\n} from \"react\";\nimport { closestListItemIndex } from \"./list-dom-utils\";\nimport { isExpanded } from \"./treeTypeUtils\";\nimport { useItemsWithIds } from \"./use-items-with-ids\";\nimport {\n GroupSelection,\n TreeNodeSelectionHandler,\n TreeSelection,\n groupSelectionEnabled,\n} from \"./use-selection\";\nimport { useViewportTracking } from \"./use-viewport-tracking\";\nimport { useTree } from \"./useTree\";\n\nimport treeCss from \"./Tree.css\";\nimport { NormalisedTreeSourceNode, TreeSourceNode } from \"@vuu-ui/vuu-utils\";\n\nconst classBase = \"vuuTree\";\n\ntype Indexer = {\n value: number;\n};\n\nexport interface TreeNodeProps extends HTMLAttributes<HTMLLIElement> {\n idx?: number;\n}\n\n// eslint-disable-next-line no-unused-vars\nexport const TreeNode = ({ children, idx, ...props }: TreeNodeProps) => {\n return <li {...props}>{children}</li>;\n};\n\nexport interface TreeProps extends HTMLAttributes<HTMLUListElement> {\n allowDragDrop?: boolean;\n defaultSelected?: any;\n groupSelection?: GroupSelection;\n onHighlight?: (index: number) => void;\n onSelectionChange?: (selected: TreeSourceNode[]) => void;\n revealSelected?: boolean;\n selected?: string[];\n selection?: TreeSelection;\n source: TreeSourceNode[];\n}\n\nexport const Tree = forwardRef(function Tree(\n {\n allowDragDrop,\n className,\n defaultSelected,\n groupSelection = \"none\",\n id: idProp,\n onHighlight,\n onSelectionChange,\n revealSelected,\n selected: selectedProp,\n selection = \"single\",\n source,\n ...htmlAttributes\n }: TreeProps,\n forwardedRef: ForwardedRef<HTMLUListElement>,\n) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"vuu-tree\",\n css: treeCss,\n window: targetWindow,\n });\n\n const id = useId(idProp);\n const rootRef = useRef<HTMLUListElement>(null);\n // returns the full source data\n const [, sourceWithIds, sourceItemById] = useItemsWithIds(source, id, {\n revealSelected: revealSelected\n ? (selectedProp ?? defaultSelected ?? false)\n : undefined,\n });\n\n const handleSelectionChange: TreeNodeSelectionHandler = (evt, selected) => {\n if (onSelectionChange) {\n const sourceItems = selected\n .map((id) => sourceItemById(id))\n .filter((sourceItem) => sourceItem !== undefined) as TreeSourceNode[];\n onSelectionChange(sourceItems);\n }\n };\n\n const {\n focusVisible,\n highlightedIdx,\n hiliteItemAtIndex,\n listProps,\n listItemHandlers,\n selected,\n visibleData,\n } = useTree({\n defaultSelected,\n groupSelection,\n onChange: handleSelectionChange,\n onHighlight,\n selected: selectedProp,\n selection,\n sourceWithIds,\n });\n\n // const isScrolling = useViewportTracking(root, highlightedIdx);\n useViewportTracking(rootRef, highlightedIdx);\n\n const defaultItemHandlers = {\n onMouseEnter: (evt: MouseEvent) => {\n // if (!isScrolling.current) {\n const targetEl = evt.target as HTMLElement;\n const idx = closestListItemIndex(targetEl);\n hiliteItemAtIndex(idx);\n // onMouseEnterListItem && onMouseEnterListItem(evt, idx);\n // }\n },\n };\n\n const propsCommonToAllListItems = {\n ...defaultItemHandlers,\n ...listItemHandlers,\n role: \"treeitem\",\n };\n const allowGroupSelect = groupSelectionEnabled(groupSelection);\n\n /**\n * Add a ListItem from source item\n */\n function addLeafNode(\n list: JSX.Element[],\n item: NormalisedTreeSourceNode,\n idx: Indexer,\n ) {\n list.push(\n <TreeNode\n {...propsCommonToAllListItems}\n {...getListItemProps(item, idx, highlightedIdx, selected, focusVisible)}\n >\n {item.icon ? (\n <span className={`${classBase}Node-icon`} data-icon={item.icon} />\n ) : null}\n <span>{item.label}</span>\n </TreeNode>,\n );\n idx.value += 1;\n }\n\n function addGroupNode(\n list: JSX.Element[],\n child: NormalisedTreeSourceNode,\n idx: Indexer,\n id: string,\n title: string,\n ) {\n const { value: i } = idx;\n idx.value += 1;\n list.push(\n <TreeNode\n {...listItemHandlers}\n aria-expanded={child.expanded}\n aria-level={child.level}\n aria-selected={selected.includes(id) || undefined}\n className={cx(`${classBase}Node`, {\n focusVisible: focusVisible === i,\n [`${classBase}Node-toggle`]: !allowGroupSelect,\n })}\n data-idx={i}\n data-highlighted={i === highlightedIdx || undefined}\n data-selectable\n id={id}\n key={`header-${i}`}\n >\n {allowGroupSelect ? (\n <div className={`${classBase}Node-label`}>\n <span className={`${classBase}Node-toggle`} />\n {title}\n </div>\n ) : (\n <div className={`${classBase}Node-label`}>\n {child.icon ? (\n <span\n className={`${classBase}Node-icon`}\n data-icon={child.icon}\n />\n ) : null}\n <span>{title}</span>\n </div>\n )}\n <ul role=\"group\">\n {isExpanded(child) ? renderSourceContent(child.childNodes, idx) : \"\"}\n </ul>\n </TreeNode>,\n );\n }\n\n function renderSourceContent(\n items: NormalisedTreeSourceNode[],\n idx = { value: 0 },\n ) {\n if (items?.length > 0) {\n const listItems: JSX.Element[] = [];\n for (const item of items) {\n if (item.childNodes) {\n addGroupNode(listItems, item, idx, item.id, item.label);\n } else {\n addLeafNode(listItems, item, idx);\n }\n }\n return listItems;\n }\n }\n\n return (\n <ul\n {...htmlAttributes}\n {...listProps}\n className={cx(classBase, className)}\n id={`Tree-${id}`}\n ref={useForkRef<HTMLUListElement>(rootRef, forwardedRef)}\n role=\"tree\"\n tabIndex={0}\n >\n {renderSourceContent(visibleData)}\n </ul>\n );\n});\n\nconst getListItemProps = (\n item: NormalisedTreeSourceNode,\n idx: Indexer,\n highlightedIdx: number,\n selected: string[],\n focusVisible: number,\n className?: string,\n) => ({\n id: item.id,\n key: item.id,\n \"aria-level\": item.level,\n \"aria-selected\": selected.includes(item.id) || undefined,\n \"data-idx\": idx.value,\n \"data-highlighted\": idx.value === highlightedIdx || undefined,\n className: cx(\"vuuTreeNode\", className, {\n focusVisible: focusVisible === idx.value,\n }),\n});\n\nTree.displayName = \"Tree\";\n"],"names":["jsx","forwardRef","Tree","useWindow","useComponentCssInjection","treeCss","useId","useRef","useItemsWithIds","selected","id","useTree","useViewportTracking","closestListItemIndex","groupSelectionEnabled","jsxs","createElement","isExpanded","useForkRef"],"mappings":"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"}
@@ -1,72 +0,0 @@
1
- 'use strict';
2
-
3
- const getNodeParentPath = ({ id }) => {
4
- let pos = id.lastIndexOf("-");
5
- if (pos !== -1) {
6
- const path = id.slice(pos + 1);
7
- const steps = path.split(".");
8
- if (steps.length === 1) {
9
- return null;
10
- } else {
11
- steps.pop();
12
- return `${id.slice(0, pos)}-${steps.join(".")}`;
13
- }
14
- } else if ((pos = id.lastIndexOf("/")) !== -1) {
15
- return id.slice(0, pos);
16
- }
17
- };
18
- const isGroupNode = (node) => node.childNodes !== void 0;
19
- const isHeader = (node) => node.header === true;
20
- const PATH_SEPARATORS = /* @__PURE__ */ new Set([".", "/"]);
21
- const isDescendantOf = (node, targetPath) => {
22
- if (!targetPath.startsWith(node.id)) {
23
- return false;
24
- } else {
25
- return PATH_SEPARATORS.has(targetPath.charAt(node.id.length));
26
- }
27
- };
28
- const getNodeById = (nodes, id) => {
29
- for (const node of nodes) {
30
- if (node.id === id) {
31
- return node;
32
- } else if (isDescendantOf(node, id)) {
33
- return getNodeById(node.childNodes, id);
34
- }
35
- }
36
- };
37
- const getIndexOfNode = (treeNodes, node) => {
38
- const id = typeof node === "string" ? node : node.id;
39
- for (let i = 0; i < treeNodes.length; i++) {
40
- if (treeNodes[i].id === id) {
41
- return i;
42
- }
43
- }
44
- };
45
- const replaceNode = (nodes, id, props) => {
46
- let childNodes;
47
- const newNodes = nodes.map((node) => {
48
- if (node.id === id) {
49
- return {
50
- ...node,
51
- ...props
52
- };
53
- } else if (isDescendantOf(node, id)) {
54
- childNodes = replaceNode(node.childNodes, id, props);
55
- return {
56
- ...node,
57
- childNodes
58
- };
59
- } else {
60
- return node;
61
- }
62
- });
63
- return newNodes;
64
- };
65
-
66
- exports.getIndexOfNode = getIndexOfNode;
67
- exports.getNodeById = getNodeById;
68
- exports.getNodeParentPath = getNodeParentPath;
69
- exports.isGroupNode = isGroupNode;
70
- exports.isHeader = isHeader;
71
- exports.replaceNode = replaceNode;
72
- //# sourceMappingURL=hierarchical-data-utils.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"hierarchical-data-utils.js","sources":["../../src/tree/hierarchical-data-utils.ts"],"sourcesContent":["import { NonLeafNode, NormalisedTreeSourceNode } from \"@vuu-ui/vuu-utils\";\n\nexport const getNodeParentPath = ({ id }: NormalisedTreeSourceNode) => {\n let pos = id.lastIndexOf(\"-\");\n if (pos !== -1) {\n // using the built-in hierarchical id scheme\n // rootId-n-n.n\n const path = id.slice(pos + 1);\n const steps = path.split(\".\");\n if (steps.length === 1) {\n return null;\n } else {\n steps.pop();\n return `${id.slice(0, pos)}-${steps.join(\".\")}`;\n }\n } else if ((pos = id.lastIndexOf(\"/\")) !== -1) {\n // using a path scheme step/step/step\n return id.slice(0, pos);\n }\n};\n\nexport const isGroupNode = (node: NormalisedTreeSourceNode) =>\n node.childNodes !== undefined;\nexport const isCollapsibleGroupNode = (node: NormalisedTreeSourceNode) =>\n isGroupNode(node) && node.expanded !== undefined;\nexport const isHeader = (node: NormalisedTreeSourceNode) =>\n node.header === true;\n\nconst PATH_SEPARATORS = new Set([\".\", \"/\"]);\n\nconst isDescendantOf = (\n node: NormalisedTreeSourceNode,\n targetPath: string,\n): node is NonLeafNode => {\n if (!targetPath.startsWith(node.id)) {\n return false;\n } else {\n return PATH_SEPARATORS.has(targetPath.charAt(node.id.length));\n }\n};\n\nexport const getNodeById = (\n nodes: NormalisedTreeSourceNode[],\n id: string,\n): NormalisedTreeSourceNode | undefined => {\n for (const node of nodes) {\n if (node.id === id) {\n return node;\n } else if (isDescendantOf(node, id)) {\n return getNodeById(node.childNodes, id);\n }\n }\n};\n\nexport const getIndexOfNode = (\n treeNodes: NormalisedTreeSourceNode[],\n node: NormalisedTreeSourceNode,\n) => {\n const id = typeof node === \"string\" ? node : node.id;\n for (let i = 0; i < treeNodes.length; i++) {\n if (treeNodes[i].id === id) {\n return i;\n }\n }\n};\n\nexport const replaceNode = (\n nodes: NormalisedTreeSourceNode[],\n id: string,\n props: Partial<NormalisedTreeSourceNode>,\n): NormalisedTreeSourceNode[] => {\n let childNodes;\n const newNodes = nodes.map((node) => {\n if (node.id === id) {\n return {\n ...node,\n ...props,\n };\n } else if (isDescendantOf(node, id)) {\n childNodes = replaceNode(node.childNodes, id, props);\n return {\n ...node,\n childNodes,\n };\n } else {\n return node;\n }\n });\n\n return newNodes;\n};\n"],"names":[],"mappings":"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"}
@@ -1,62 +0,0 @@
1
- 'use strict';
2
-
3
- function union(set1, ...sets) {
4
- const result = new Set(set1);
5
- for (const set of sets) {
6
- for (const element of set) {
7
- result.add(element);
8
- }
9
- }
10
- return result;
11
- }
12
- const ArrowUp = "ArrowUp";
13
- const ArrowDown = "ArrowDown";
14
- const ArrowLeft = "ArrowLeft";
15
- const ArrowRight = "ArrowRight";
16
- const Enter = "Enter";
17
- const Delete = "Delete";
18
- const actionKeys = /* @__PURE__ */ new Set([Enter, Delete]);
19
- const focusKeys = /* @__PURE__ */ new Set(["Tab"]);
20
- const arrowLeftRightKeys = /* @__PURE__ */ new Set(["ArrowRight", "ArrowLeft"]);
21
- const verticalNavigationKeys = /* @__PURE__ */ new Set(["Home", "End", "ArrowDown", "ArrowUp"]);
22
- const horizontalNavigationKeys = /* @__PURE__ */ new Set([
23
- "Home",
24
- "End",
25
- "ArrowRight",
26
- "ArrowLeft"
27
- ]);
28
- const functionKeys = /* @__PURE__ */ new Set([
29
- "F1",
30
- "F2",
31
- "F3",
32
- "F4",
33
- "F5",
34
- "F6",
35
- "F7",
36
- "F8",
37
- "F9",
38
- "F10",
39
- "F11",
40
- "F12"
41
- ]);
42
- union(
43
- actionKeys,
44
- horizontalNavigationKeys,
45
- verticalNavigationKeys,
46
- arrowLeftRightKeys,
47
- functionKeys,
48
- focusKeys
49
- );
50
- const isNavigationKey = ({ key }, orientation = "vertical") => {
51
- const navigationKeys = orientation === "vertical" ? verticalNavigationKeys : horizontalNavigationKeys;
52
- return navigationKeys.has(key);
53
- };
54
-
55
- exports.ArrowDown = ArrowDown;
56
- exports.ArrowLeft = ArrowLeft;
57
- exports.ArrowRight = ArrowRight;
58
- exports.ArrowUp = ArrowUp;
59
- exports.Delete = Delete;
60
- exports.Enter = Enter;
61
- exports.isNavigationKey = isNavigationKey;
62
- //# sourceMappingURL=key-code.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"key-code.js","sources":["../../src/tree/key-code.ts"],"sourcesContent":["import { KeyboardEvent } from \"react\";\n\nfunction union(set1: Set<string>, ...sets: Set<string>[]) {\n const result = new Set(set1);\n for (const set of sets) {\n for (const element of set) {\n result.add(element);\n }\n }\n return result;\n}\n\nexport const ArrowUp = \"ArrowUp\";\nexport const ArrowDown = \"ArrowDown\";\nexport const ArrowLeft = \"ArrowLeft\";\nexport const Backspace = \"Backspace\";\nexport const ArrowRight = \"ArrowRight\";\nexport const Enter = \"Enter\";\nexport const Escape = \"Escape\";\nexport const Delete = \"Delete\";\n\nconst actionKeys = new Set([Enter, Delete]);\nconst focusKeys = new Set([\"Tab\"]);\n// const navigationKeys = new Set([\"Home\", \"End\", \"ArrowRight\", \"ArrowLeft\",\"ArrowDown\", \"ArrowUp\"]);\nconst arrowLeftRightKeys = new Set([\"ArrowRight\", \"ArrowLeft\"]);\nconst verticalNavigationKeys = new Set([\"Home\", \"End\", \"ArrowDown\", \"ArrowUp\"]);\nconst horizontalNavigationKeys = new Set([\n \"Home\",\n \"End\",\n \"ArrowRight\",\n \"ArrowLeft\",\n]);\nconst functionKeys = new Set([\n \"F1\",\n \"F2\",\n \"F3\",\n \"F4\",\n \"F5\",\n \"F6\",\n \"F7\",\n \"F8\",\n \"F9\",\n \"F10\",\n \"F11\",\n \"F12\",\n]);\nconst specialKeys = union(\n actionKeys,\n horizontalNavigationKeys,\n verticalNavigationKeys,\n arrowLeftRightKeys,\n functionKeys,\n focusKeys\n);\nexport const isCharacterKey = (evt: KeyboardEvent) => {\n if (specialKeys.has(evt.key)) {\n return false;\n }\n if (typeof evt.which === \"number\" && evt.which > 0) {\n return !evt.ctrlKey && !evt.metaKey && !evt.altKey && evt.which !== 8;\n }\n};\n\nexport const isNavigationKey = (\n { key }: KeyboardEvent,\n orientation = \"vertical\"\n) => {\n const navigationKeys =\n orientation === \"vertical\"\n ? verticalNavigationKeys\n : horizontalNavigationKeys;\n return navigationKeys.has(key);\n};\n"],"names":[],"mappings":";;AAEA,SAAS,KAAA,CAAM,SAAsB,IAAqB,EAAA;AACxD,EAAM,MAAA,MAAA,GAAS,IAAI,GAAA,CAAI,IAAI,CAAA,CAAA;AAC3B,EAAA,KAAA,MAAW,OAAO,IAAM,EAAA;AACtB,IAAA,KAAA,MAAW,WAAW,GAAK,EAAA;AACzB,MAAA,MAAA,CAAO,IAAI,OAAO,CAAA,CAAA;AAAA,KACpB;AAAA,GACF;AACA,EAAO,OAAA,MAAA,CAAA;AACT,CAAA;AAEO,MAAM,OAAU,GAAA,UAAA;AAChB,MAAM,SAAY,GAAA,YAAA;AAClB,MAAM,SAAY,GAAA,YAAA;AAElB,MAAM,UAAa,GAAA,aAAA;AACnB,MAAM,KAAQ,GAAA,QAAA;AAEd,MAAM,MAAS,GAAA,SAAA;AAEtB,MAAM,6BAAiB,IAAA,GAAA,CAAI,CAAC,KAAA,EAAO,MAAM,CAAC,CAAA,CAAA;AAC1C,MAAM,SAAY,mBAAA,IAAI,GAAI,CAAA,CAAC,KAAK,CAAC,CAAA,CAAA;AAEjC,MAAM,qCAAyB,IAAA,GAAA,CAAI,CAAC,YAAA,EAAc,WAAW,CAAC,CAAA,CAAA;AAC9D,MAAM,sBAAA,uBAA6B,GAAI,CAAA,CAAC,QAAQ,KAAO,EAAA,WAAA,EAAa,SAAS,CAAC,CAAA,CAAA;AAC9E,MAAM,wBAAA,uBAA+B,GAAI,CAAA;AAAA,EACvC,MAAA;AAAA,EACA,KAAA;AAAA,EACA,YAAA;AAAA,EACA,WAAA;AACF,CAAC,CAAA,CAAA;AACD,MAAM,YAAA,uBAAmB,GAAI,CAAA;AAAA,EAC3B,IAAA;AAAA,EACA,IAAA;AAAA,EACA,IAAA;AAAA,EACA,IAAA;AAAA,EACA,IAAA;AAAA,EACA,IAAA;AAAA,EACA,IAAA;AAAA,EACA,IAAA;AAAA,EACA,IAAA;AAAA,EACA,KAAA;AAAA,EACA,KAAA;AAAA,EACA,KAAA;AACF,CAAC,CAAA,CAAA;AACmB,KAAA;AAAA,EAClB,UAAA;AAAA,EACA,wBAAA;AAAA,EACA,sBAAA;AAAA,EACA,kBAAA;AAAA,EACA,YAAA;AAAA,EACA,SAAA;AACF,EAAA;AAUO,MAAM,kBAAkB,CAC7B,EAAE,GAAI,EAAA,EACN,cAAc,UACX,KAAA;AACH,EAAM,MAAA,cAAA,GACJ,WAAgB,KAAA,UAAA,GACZ,sBACA,GAAA,wBAAA,CAAA;AACN,EAAO,OAAA,cAAA,CAAe,IAAI,GAAG,CAAA,CAAA;AAC/B;;;;;;;;;;"}
@@ -1,19 +0,0 @@
1
- 'use strict';
2
-
3
- function listItemIndex(listItemEl) {
4
- if (listItemEl) {
5
- let idx = listItemEl.dataset.idx;
6
- if (idx) {
7
- return parseInt(idx, 10);
8
- } else if (idx = listItemEl.ariaPosInSet ?? "-1") {
9
- return parseInt(idx, 10) - 1;
10
- }
11
- }
12
- }
13
- const closestListItem = (el) => el.closest("[data-idx],[aria-posinset]");
14
- const closestListItemIndex = (el) => listItemIndex(closestListItem(el));
15
-
16
- exports.closestListItem = closestListItem;
17
- exports.closestListItemIndex = closestListItemIndex;
18
- exports.listItemIndex = listItemIndex;
19
- //# sourceMappingURL=list-dom-utils.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"list-dom-utils.js","sources":["../../src/tree/list-dom-utils.ts"],"sourcesContent":["export const listItemElement = (listEl: HTMLElement, listItemIdx: number) =>\n listEl.querySelector(`:scope > [data-idx=\"${listItemIdx}\"]`);\n\nexport function listItemIndex(listItemEl: HTMLElement) {\n if (listItemEl) {\n let idx = listItemEl.dataset.idx;\n if (idx) {\n return parseInt(idx, 10);\n // eslint-disable-next-line no-cond-assign\n } else if ((idx = listItemEl.ariaPosInSet ?? \"-1\")) {\n return parseInt(idx, 10) - 1;\n }\n }\n}\n\nexport const listItemId = (el: HTMLElement | null) => el?.id;\n\nexport const closestListItem = (el: HTMLElement) =>\n el.closest(\"[data-idx],[aria-posinset]\") as HTMLElement;\n\nexport const closestListItemId = (el: HTMLElement) =>\n listItemId(closestListItem(el));\n\nexport const closestListItemIndex = (el: HTMLElement) =>\n listItemIndex(closestListItem(el));\n"],"names":[],"mappings":";;AAGO,SAAS,cAAc,UAAyB,EAAA;AACrD,EAAA,IAAI,UAAY,EAAA;AACd,IAAI,IAAA,GAAA,GAAM,WAAW,OAAQ,CAAA,GAAA,CAAA;AAC7B,IAAA,IAAI,GAAK,EAAA;AACP,MAAO,OAAA,QAAA,CAAS,KAAK,EAAE,CAAA,CAAA;AAAA,KAEb,MAAA,IAAA,GAAA,GAAM,UAAW,CAAA,YAAA,IAAgB,IAAO,EAAA;AAClD,MAAO,OAAA,QAAA,CAAS,GAAK,EAAA,EAAE,CAAI,GAAA,CAAA,CAAA;AAAA,KAC7B;AAAA,GACF;AACF,CAAA;AAIO,MAAM,eAAkB,GAAA,CAAC,EAC9B,KAAA,EAAA,CAAG,QAAQ,4BAA4B,EAAA;AAKlC,MAAM,uBAAuB,CAAC,EAAA,KACnC,aAAc,CAAA,eAAA,CAAgB,EAAE,CAAC;;;;;;"}
@@ -1,6 +0,0 @@
1
- 'use strict';
2
-
3
- const isExpanded = (node) => node.expanded === true;
4
-
5
- exports.isExpanded = isExpanded;
6
- //# sourceMappingURL=treeTypeUtils.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"treeTypeUtils.js","sources":["../../src/tree/treeTypeUtils.ts"],"sourcesContent":["import type { NonLeafNode, NormalisedTreeSourceNode } from \"@vuu-ui/vuu-utils\";\n\nexport const isExpanded = (\n node: NormalisedTreeSourceNode,\n): node is NonLeafNode => node.expanded === true;\n"],"names":[],"mappings":";;AAEO,MAAM,UAAa,GAAA,CACxB,IACwB,KAAA,IAAA,CAAK,QAAa,KAAA;;;;"}
@@ -1,85 +0,0 @@
1
- 'use strict';
2
-
3
- var React = require('react');
4
- var listDomUtils = require('./list-dom-utils.js');
5
- var keyCode = require('./key-code.js');
6
- var hierarchicalDataUtils = require('./hierarchical-data-utils.js');
7
-
8
- const NO_HANDLERS = {};
9
- const isToggleElement = (element) => element && element.hasAttribute("aria-expanded");
10
- const useCollapsibleGroups = ({
11
- collapsibleHeaders,
12
- highlightedIdx,
13
- treeNodes,
14
- setVisibleData,
15
- source
16
- }) => {
17
- const fullSource = React.useRef(source);
18
- const stateSource = React.useRef(fullSource.current);
19
- const setSource = React.useCallback(
20
- (value) => {
21
- setVisibleData(stateSource.current = value);
22
- },
23
- [setVisibleData]
24
- );
25
- const expandNode = React.useCallback(
26
- (nodeList, { id }) => hierarchicalDataUtils.replaceNode(nodeList, id, { expanded: true }),
27
- []
28
- );
29
- const collapseNode = React.useCallback(
30
- (nodeList, { id }) => hierarchicalDataUtils.replaceNode(nodeList, id, { expanded: false }),
31
- []
32
- );
33
- const handleKeyDown = React.useCallback(
34
- (e) => {
35
- if (e.key === keyCode.ArrowRight || e.key === keyCode.Enter) {
36
- const node = treeNodes[highlightedIdx];
37
- if (node) {
38
- if (node.expanded === false) {
39
- e.preventDefault();
40
- setSource(expandNode(stateSource.current, node));
41
- }
42
- }
43
- }
44
- if (e.key === keyCode.ArrowLeft || e.key === keyCode.Enter) {
45
- const node = treeNodes[highlightedIdx];
46
- if (node) {
47
- if (node.expanded) {
48
- e.preventDefault();
49
- setSource(collapseNode(stateSource.current, node));
50
- }
51
- }
52
- }
53
- },
54
- [collapseNode, expandNode, highlightedIdx, treeNodes, setSource]
55
- );
56
- const listHandlers = collapsibleHeaders ? {
57
- onKeyDown: handleKeyDown
58
- } : NO_HANDLERS;
59
- const handleClick = React.useCallback(
60
- (evt) => {
61
- const el = listDomUtils.closestListItem(evt.target);
62
- if (isToggleElement(el)) {
63
- evt.stopPropagation();
64
- evt.preventDefault();
65
- const node = hierarchicalDataUtils.getNodeById(source, el.id);
66
- if (node?.expanded === false) {
67
- setSource(expandNode(source, node));
68
- } else if (node?.expanded === true) {
69
- setSource(collapseNode(source, node));
70
- }
71
- }
72
- },
73
- [collapseNode, expandNode, setSource, source]
74
- );
75
- const listItemHandlers = {
76
- onClick: handleClick
77
- };
78
- return {
79
- listHandlers,
80
- listItemHandlers
81
- };
82
- };
83
-
84
- exports.useCollapsibleGroups = useCollapsibleGroups;
85
- //# sourceMappingURL=use-collapsible-groups.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"use-collapsible-groups.js","sources":["../../src/tree/use-collapsible-groups.ts"],"sourcesContent":["import { KeyboardEvent, MouseEvent, useCallback, useRef } from \"react\";\nimport { closestListItem } from \"./list-dom-utils\";\nimport { ArrowLeft, ArrowRight, Enter } from \"./key-code\";\nimport { getNodeById, replaceNode } from \"./hierarchical-data-utils\";\nimport { NormalisedTreeSourceNode } from \"@vuu-ui/vuu-utils\";\n\nconst NO_HANDLERS: CollapsibleHookResult[\"listHandlers\"] = {};\nconst isToggleElement = (element: HTMLElement) =>\n element && element.hasAttribute(\"aria-expanded\");\n\nexport interface CollapsibleGroupsHookProps {\n collapsibleHeaders?: boolean;\n highlightedIdx: number;\n treeNodes: NormalisedTreeSourceNode[];\n setVisibleData: (nodes: NormalisedTreeSourceNode[]) => void;\n source: NormalisedTreeSourceNode[];\n}\n\nexport interface CollapsibleHookResult {\n listHandlers: {\n onKeyDown?: (e: KeyboardEvent) => void;\n };\n listItemHandlers: {\n onClick: (e: MouseEvent) => void;\n };\n}\n\nexport const useCollapsibleGroups = ({\n collapsibleHeaders,\n highlightedIdx,\n treeNodes,\n setVisibleData,\n source,\n}: CollapsibleGroupsHookProps): CollapsibleHookResult => {\n const fullSource = useRef<NormalisedTreeSourceNode[]>(source);\n const stateSource = useRef<NormalisedTreeSourceNode[]>(fullSource.current);\n\n const setSource = useCallback(\n (value) => {\n setVisibleData((stateSource.current = value));\n },\n [setVisibleData],\n );\n\n const expandNode = useCallback(\n (nodeList: NormalisedTreeSourceNode[], { id }: NormalisedTreeSourceNode) =>\n replaceNode(nodeList, id, { expanded: true }),\n [],\n );\n\n const collapseNode = useCallback(\n (nodeList, { id }) => replaceNode(nodeList, id, { expanded: false }),\n [],\n );\n\n const handleKeyDown = useCallback(\n (e: KeyboardEvent) => {\n if (e.key === ArrowRight || e.key === Enter) {\n const node = treeNodes[highlightedIdx];\n if (node) {\n if (node.expanded === false) {\n e.preventDefault();\n setSource(expandNode(stateSource.current, node));\n }\n }\n }\n\n if (e.key === ArrowLeft || e.key === Enter) {\n const node = treeNodes[highlightedIdx];\n if (node) {\n if (node.expanded) {\n e.preventDefault();\n setSource(collapseNode(stateSource.current, node));\n }\n }\n }\n },\n [collapseNode, expandNode, highlightedIdx, treeNodes, setSource],\n );\n\n /**\n * These are List handlers, so we will not have reference to the actual node\n * element. We must rely on highlightedIdx to tell us which node is interactive.\n */\n const listHandlers = collapsibleHeaders\n ? {\n onKeyDown: handleKeyDown,\n }\n : NO_HANDLERS;\n\n const handleClick = useCallback(\n (evt) => {\n const el = closestListItem(evt.target);\n if (isToggleElement(el)) {\n evt.stopPropagation();\n evt.preventDefault();\n const node = getNodeById(source, el.id);\n if (node?.expanded === false) {\n setSource(expandNode(source, node));\n } else if (node?.expanded === true) {\n setSource(collapseNode(source, node));\n }\n }\n },\n [collapseNode, expandNode, setSource, source],\n );\n\n const listItemHandlers = {\n onClick: handleClick,\n };\n\n return {\n listHandlers,\n listItemHandlers,\n };\n};\n"],"names":["useRef","useCallback","replaceNode","ArrowRight","Enter","ArrowLeft","closestListItem","getNodeById"],"mappings":"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"}