@vuu-ui/vuu-ui-controls 0.13.2 → 0.13.4

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 (301) hide show
  1. package/cjs/column-picker/ColumnPicker.js +2 -2
  2. package/cjs/column-picker/ColumnPicker.js.map +1 -1
  3. package/cjs/column-picker/ColumnSearch.js +4 -24
  4. package/cjs/column-picker/ColumnSearch.js.map +1 -1
  5. package/cjs/context-panel-provider/ContextPanelProvider.js +55 -0
  6. package/cjs/context-panel-provider/ContextPanelProvider.js.map +1 -0
  7. package/cjs/index.js +6 -80
  8. package/cjs/index.js.map +1 -1
  9. package/cjs/sortable-list/SortableList.js +38 -0
  10. package/cjs/sortable-list/SortableList.js.map +1 -0
  11. package/cjs/toolbar/Toolbar.js.map +1 -1
  12. package/cjs/toolbar/useSelection.js +0 -1
  13. package/cjs/toolbar/useSelection.js.map +1 -1
  14. package/esm/column-picker/ColumnPicker.js +2 -2
  15. package/esm/column-picker/ColumnPicker.js.map +1 -1
  16. package/esm/column-picker/ColumnSearch.js +5 -25
  17. package/esm/column-picker/ColumnSearch.js.map +1 -1
  18. package/esm/context-panel-provider/ContextPanelProvider.js +51 -0
  19. package/esm/context-panel-provider/ContextPanelProvider.js.map +1 -0
  20. package/esm/index.js +2 -21
  21. package/esm/index.js.map +1 -1
  22. package/esm/sortable-list/SortableList.js +35 -0
  23. package/esm/sortable-list/SortableList.js.map +1 -0
  24. package/esm/toolbar/Toolbar.js.map +1 -1
  25. package/esm/toolbar/useSelection.js +0 -1
  26. package/esm/toolbar/useSelection.js.map +1 -1
  27. package/package.json +15 -17
  28. package/cjs/common-hooks/collectionProvider.js +0 -24
  29. package/cjs/common-hooks/collectionProvider.js.map +0 -1
  30. package/cjs/common-hooks/isPlainObject.js +0 -6
  31. package/cjs/common-hooks/isPlainObject.js.map +0 -1
  32. package/cjs/common-hooks/itemToString.js +0 -24
  33. package/cjs/common-hooks/itemToString.js.map +0 -1
  34. package/cjs/common-hooks/useCollectionItems.js +0 -309
  35. package/cjs/common-hooks/useCollectionItems.js.map +0 -1
  36. package/cjs/common-hooks/useSelection.js +0 -212
  37. package/cjs/common-hooks/useSelection.js.map +0 -1
  38. package/cjs/list/Highlighter.css.js +0 -6
  39. package/cjs/list/Highlighter.css.js.map +0 -1
  40. package/cjs/list/Highlighter.js +0 -36
  41. package/cjs/list/Highlighter.js.map +0 -1
  42. package/cjs/list/List.css.js +0 -6
  43. package/cjs/list/List.css.js.map +0 -1
  44. package/cjs/list/List.js +0 -317
  45. package/cjs/list/List.js.map +0 -1
  46. package/cjs/list/ListItem.css.js +0 -6
  47. package/cjs/list/ListItem.css.js.map +0 -1
  48. package/cjs/list/ListItem.js +0 -84
  49. package/cjs/list/ListItem.js.map +0 -1
  50. package/cjs/list/ListItemGroup.js +0 -6
  51. package/cjs/list/ListItemGroup.js.map +0 -1
  52. package/cjs/list/ListItemHeader.js +0 -6
  53. package/cjs/list/ListItemHeader.js.map +0 -1
  54. package/cjs/list/RadioIcon.css.js +0 -6
  55. package/cjs/list/RadioIcon.css.js.map +0 -1
  56. package/cjs/list/RadioIcon.js +0 -27
  57. package/cjs/list/RadioIcon.js.map +0 -1
  58. package/cjs/list/common-hooks/keyUtils.js +0 -78
  59. package/cjs/list/common-hooks/keyUtils.js.map +0 -1
  60. package/cjs/list/common-hooks/list-dom-utils.js +0 -25
  61. package/cjs/list/common-hooks/list-dom-utils.js.map +0 -1
  62. package/cjs/list/common-hooks/useCollapsibleGroups.js +0 -72
  63. package/cjs/list/common-hooks/useCollapsibleGroups.js.map +0 -1
  64. package/cjs/list/common-hooks/useImperativeScrollingAPI.js +0 -52
  65. package/cjs/list/common-hooks/useImperativeScrollingAPI.js.map +0 -1
  66. package/cjs/list/common-hooks/useKeyboardNavigation.js +0 -289
  67. package/cjs/list/common-hooks/useKeyboardNavigation.js.map +0 -1
  68. package/cjs/list/common-hooks/useTypeahead.js +0 -74
  69. package/cjs/list/common-hooks/useTypeahead.js.map +0 -1
  70. package/cjs/list/common-hooks/useViewportTracking.js +0 -133
  71. package/cjs/list/common-hooks/useViewportTracking.js.map +0 -1
  72. package/cjs/list/common-hooks/utils/collection-item-utils.js +0 -182
  73. package/cjs/list/common-hooks/utils/collection-item-utils.js.map +0 -1
  74. package/cjs/list/common-hooks/utils/filter-utils.js +0 -11
  75. package/cjs/list/common-hooks/utils/filter-utils.js.map +0 -1
  76. package/cjs/list/common-hooks/utils/isSelected.js +0 -9
  77. package/cjs/list/common-hooks/utils/isSelected.js.map +0 -1
  78. package/cjs/list/useList.js +0 -278
  79. package/cjs/list/useList.js.map +0 -1
  80. package/cjs/list/useListDrop.js +0 -92
  81. package/cjs/list/useListDrop.js.map +0 -1
  82. package/cjs/list/useListHeight.js +0 -77
  83. package/cjs/list/useListHeight.js.map +0 -1
  84. package/cjs/list/useScrollPosition.js +0 -74
  85. package/cjs/list/useScrollPosition.js.map +0 -1
  86. package/esm/common-hooks/collectionProvider.js +0 -20
  87. package/esm/common-hooks/collectionProvider.js.map +0 -1
  88. package/esm/common-hooks/isPlainObject.js +0 -4
  89. package/esm/common-hooks/isPlainObject.js.map +0 -1
  90. package/esm/common-hooks/itemToString.js +0 -22
  91. package/esm/common-hooks/itemToString.js.map +0 -1
  92. package/esm/common-hooks/useCollectionItems.js +0 -307
  93. package/esm/common-hooks/useCollectionItems.js.map +0 -1
  94. package/esm/common-hooks/useSelection.js +0 -205
  95. package/esm/common-hooks/useSelection.js.map +0 -1
  96. package/esm/list/Highlighter.css.js +0 -4
  97. package/esm/list/Highlighter.css.js.map +0 -1
  98. package/esm/list/Highlighter.js +0 -34
  99. package/esm/list/Highlighter.js.map +0 -1
  100. package/esm/list/List.css.js +0 -4
  101. package/esm/list/List.css.js.map +0 -1
  102. package/esm/list/List.js +0 -315
  103. package/esm/list/List.js.map +0 -1
  104. package/esm/list/ListItem.css.js +0 -4
  105. package/esm/list/ListItem.css.js.map +0 -1
  106. package/esm/list/ListItem.js +0 -81
  107. package/esm/list/ListItem.js.map +0 -1
  108. package/esm/list/ListItemGroup.js +0 -4
  109. package/esm/list/ListItemGroup.js.map +0 -1
  110. package/esm/list/ListItemHeader.js +0 -4
  111. package/esm/list/ListItemHeader.js.map +0 -1
  112. package/esm/list/RadioIcon.css.js +0 -4
  113. package/esm/list/RadioIcon.css.js.map +0 -1
  114. package/esm/list/RadioIcon.js +0 -25
  115. package/esm/list/RadioIcon.js.map +0 -1
  116. package/esm/list/common-hooks/keyUtils.js +0 -64
  117. package/esm/list/common-hooks/keyUtils.js.map +0 -1
  118. package/esm/list/common-hooks/list-dom-utils.js +0 -19
  119. package/esm/list/common-hooks/list-dom-utils.js.map +0 -1
  120. package/esm/list/common-hooks/useCollapsibleGroups.js +0 -70
  121. package/esm/list/common-hooks/useCollapsibleGroups.js.map +0 -1
  122. package/esm/list/common-hooks/useImperativeScrollingAPI.js +0 -50
  123. package/esm/list/common-hooks/useImperativeScrollingAPI.js.map +0 -1
  124. package/esm/list/common-hooks/useKeyboardNavigation.js +0 -286
  125. package/esm/list/common-hooks/useKeyboardNavigation.js.map +0 -1
  126. package/esm/list/common-hooks/useTypeahead.js +0 -72
  127. package/esm/list/common-hooks/useTypeahead.js.map +0 -1
  128. package/esm/list/common-hooks/useViewportTracking.js +0 -131
  129. package/esm/list/common-hooks/useViewportTracking.js.map +0 -1
  130. package/esm/list/common-hooks/utils/collection-item-utils.js +0 -168
  131. package/esm/list/common-hooks/utils/collection-item-utils.js.map +0 -1
  132. package/esm/list/common-hooks/utils/filter-utils.js +0 -8
  133. package/esm/list/common-hooks/utils/filter-utils.js.map +0 -1
  134. package/esm/list/common-hooks/utils/isSelected.js +0 -7
  135. package/esm/list/common-hooks/utils/isSelected.js.map +0 -1
  136. package/esm/list/useList.js +0 -276
  137. package/esm/list/useList.js.map +0 -1
  138. package/esm/list/useListDrop.js +0 -90
  139. package/esm/list/useListDrop.js.map +0 -1
  140. package/esm/list/useListHeight.js +0 -75
  141. package/esm/list/useListHeight.js.map +0 -1
  142. package/esm/list/useScrollPosition.js +0 -72
  143. package/esm/list/useScrollPosition.js.map +0 -1
  144. package/types/calendar/Calendar.d.ts +0 -13
  145. package/types/calendar/index.d.ts +0 -4
  146. package/types/calendar/internal/CalendarCarousel.d.ts +0 -3
  147. package/types/calendar/internal/CalendarContext.d.ts +0 -8
  148. package/types/calendar/internal/CalendarDay.d.ts +0 -14
  149. package/types/calendar/internal/CalendarMonth.d.ts +0 -10
  150. package/types/calendar/internal/CalendarNavigation.d.ts +0 -16
  151. package/types/calendar/internal/CalendarWeekHeader.d.ts +0 -3
  152. package/types/calendar/internal/useFocusManagement.d.ts +0 -9
  153. package/types/calendar/internal/utils.d.ts +0 -15
  154. package/types/calendar/useCalendar.d.ts +0 -54
  155. package/types/calendar/useCalendarDay.d.ts +0 -22
  156. package/types/calendar/useSelection.d.ts +0 -78
  157. package/types/column-picker/ColumnPicker.d.ts +0 -7
  158. package/types/column-picker/ColumnSearch.d.ts +0 -6
  159. package/types/column-picker/index.d.ts +0 -2
  160. package/types/column-picker/moving-window.d.ts +0 -14
  161. package/types/common-hooks/collectionProvider.d.ts +0 -13
  162. package/types/common-hooks/collectionTypes.d.ts +0 -58
  163. package/types/common-hooks/index.d.ts +0 -8
  164. package/types/common-hooks/isPlainObject.d.ts +0 -1
  165. package/types/common-hooks/itemToString.d.ts +0 -2
  166. package/types/common-hooks/navigationTypes.d.ts +0 -36
  167. package/types/common-hooks/selectionTypes.d.ts +0 -70
  168. package/types/common-hooks/use-resize-observer.d.ts +0 -16
  169. package/types/common-hooks/useCollectionItems.d.ts +0 -2
  170. package/types/common-hooks/useControlled.d.ts +0 -24
  171. package/types/common-hooks/useSelection.d.ts +0 -8
  172. package/types/cycle-state-button/CycleStateButton.d.ts +0 -11
  173. package/types/cycle-state-button/index.d.ts +0 -1
  174. package/types/date-input/DateInput.d.ts +0 -60
  175. package/types/date-input/index.d.ts +0 -1
  176. package/types/date-picker/DatePicker.d.ts +0 -66
  177. package/types/date-picker/DatePickerContext.d.ts +0 -19
  178. package/types/date-picker/DatePickerPanel.d.ts +0 -10
  179. package/types/date-picker/index.d.ts +0 -1
  180. package/types/drag-drop/DragDropProvider.d.ts +0 -38
  181. package/types/drag-drop/DragDropState.d.ts +0 -15
  182. package/types/drag-drop/Draggable.d.ts +0 -13
  183. package/types/drag-drop/DropIndicator.d.ts +0 -5
  184. package/types/drag-drop/dragDropTypes.d.ts +0 -100
  185. package/types/drag-drop/drop-target-utils.d.ts +0 -82
  186. package/types/drag-drop/index.d.ts +0 -6
  187. package/types/drag-drop/useAutoScroll.d.ts +0 -11
  188. package/types/drag-drop/useDragDisplacers.d.ts +0 -17
  189. package/types/drag-drop/useDragDrop.d.ts +0 -2
  190. package/types/drag-drop/useDragDropCopy.d.ts +0 -6
  191. package/types/drag-drop/useDragDropIndicator.d.ts +0 -2
  192. package/types/drag-drop/useDragDropNaturalMovement.d.ts +0 -2
  193. package/types/drag-drop/useDropIndicator.d.ts +0 -8
  194. package/types/drag-drop/useGlobalDragDrop.d.ts +0 -11
  195. package/types/drag-drop/useTransition.d.ts +0 -3
  196. package/types/editable/index.d.ts +0 -1
  197. package/types/editable/useEditableText.d.ts +0 -19
  198. package/types/editable-label/EditableLabel.d.ts +0 -19
  199. package/types/editable-label/index.d.ts +0 -1
  200. package/types/expando-input/ExpandoInput.d.ts +0 -6
  201. package/types/expando-input/index.d.ts +0 -1
  202. package/types/icon-button/Icon.d.ts +0 -6
  203. package/types/icon-button/IconButton.d.ts +0 -6
  204. package/types/icon-button/ToggleIconButton.d.ts +0 -5
  205. package/types/icon-button/index.d.ts +0 -3
  206. package/types/index.d.ts +0 -27
  207. package/types/instrument-picker/SearchCell.d.ts +0 -2
  208. package/types/instrument-picker/TablePicker.d.ts +0 -10
  209. package/types/instrument-picker/index.d.ts +0 -1
  210. package/types/instrument-picker/moving-window.d.ts +0 -14
  211. package/types/instrument-picker/useDataSource.d.ts +0 -6
  212. package/types/instrument-picker/useTablePicker.d.ts +0 -47
  213. package/types/list/ChevronIcon.d.ts +0 -7
  214. package/types/list/Highlighter.d.ts +0 -6
  215. package/types/list/List.d.ts +0 -6
  216. package/types/list/ListItem.d.ts +0 -6
  217. package/types/list/ListItemGroup.d.ts +0 -6
  218. package/types/list/ListItemHeader.d.ts +0 -5
  219. package/types/list/RadioIcon.d.ts +0 -4
  220. package/types/list/common-hooks/index.d.ts +0 -10
  221. package/types/list/common-hooks/keyUtils.d.ts +0 -14
  222. package/types/list/common-hooks/list-dom-utils.d.ts +0 -5
  223. package/types/list/common-hooks/useCollapsibleGroups.d.ts +0 -14
  224. package/types/list/common-hooks/useImperativeScrollingAPI.d.ts +0 -14
  225. package/types/list/common-hooks/useKeyboardNavigation.d.ts +0 -3
  226. package/types/list/common-hooks/useTypeahead.d.ts +0 -14
  227. package/types/list/common-hooks/useViewportTracking.d.ts +0 -14
  228. package/types/list/common-hooks/utils/collection-item-utils.d.ts +0 -21
  229. package/types/list/common-hooks/utils/filter-utils.d.ts +0 -4
  230. package/types/list/common-hooks/utils/index.d.ts +0 -4
  231. package/types/list/common-hooks/utils/isSelected.d.ts +0 -2
  232. package/types/list/index.d.ts +0 -9
  233. package/types/list/keyset.d.ts +0 -9
  234. package/types/list/listTypes.d.ts +0 -200
  235. package/types/list/useList.d.ts +0 -3
  236. package/types/list/useListDrop.d.ts +0 -15
  237. package/types/list/useListHeight.d.ts +0 -19
  238. package/types/list/useScrollPosition.d.ts +0 -19
  239. package/types/measured-container/MeasuredContainer.d.ts +0 -14
  240. package/types/measured-container/index.d.ts +0 -2
  241. package/types/measured-container/useMeasuredContainer.d.ts +0 -23
  242. package/types/measured-container/useResizeObserver.d.ts +0 -15
  243. package/types/overflow-container/OverflowContainer.d.ts +0 -15
  244. package/types/overflow-container/index.d.ts +0 -2
  245. package/types/overflow-container/overflow-utils.d.ts +0 -48
  246. package/types/overflow-container/useOverflowContainer.d.ts +0 -19
  247. package/types/price-ticker/PriceTicker.d.ts +0 -7
  248. package/types/price-ticker/index.d.ts +0 -1
  249. package/types/split-button/SplitButton.d.ts +0 -11
  250. package/types/split-button/SplitStateButton.d.ts +0 -5
  251. package/types/split-button/index.d.ts +0 -2
  252. package/types/split-button/useSplitButton.d.ts +0 -311
  253. package/types/table-search/SearchCell.d.ts +0 -2
  254. package/types/table-search/TableSearch.d.ts +0 -9
  255. package/types/table-search/index.d.ts +0 -1
  256. package/types/table-search/moving-window.d.ts +0 -14
  257. package/types/table-search/useTableSearch.d.ts +0 -15
  258. package/types/tabs-next/TabBar.d.ts +0 -12
  259. package/types/tabs-next/TabListNext.d.ts +0 -12
  260. package/types/tabs-next/TabNext.d.ts +0 -12
  261. package/types/tabs-next/TabNextAction.d.ts +0 -5
  262. package/types/tabs-next/TabNextContext.d.ts +0 -12
  263. package/types/tabs-next/TabNextPanel.d.ts +0 -8
  264. package/types/tabs-next/TabNextTrigger.d.ts +0 -5
  265. package/types/tabs-next/TabOverflowList.d.ts +0 -11
  266. package/types/tabs-next/TabsNext.d.ts +0 -17
  267. package/types/tabs-next/TabsNextContext.d.ts +0 -21
  268. package/types/tabs-next/hooks/useCollection.d.ts +0 -18
  269. package/types/tabs-next/hooks/useFocusOutside.d.ts +0 -2
  270. package/types/tabs-next/hooks/useOverflow.d.ts +0 -11
  271. package/types/tabs-next/index.d.ts +0 -7
  272. package/types/tabstrip/Tab.d.ts +0 -27
  273. package/types/tabstrip/TabMenu.d.ts +0 -23
  274. package/types/tabstrip/TabMenuOptions.d.ts +0 -10
  275. package/types/tabstrip/TabsTypes.d.ts +0 -127
  276. package/types/tabstrip/Tabstrip.d.ts +0 -2
  277. package/types/tabstrip/index.d.ts +0 -5
  278. package/types/tabstrip/tabstrip-dom-utils.d.ts +0 -2
  279. package/types/tabstrip/useAnimatedSelectionThumb.d.ts +0 -7
  280. package/types/tabstrip/useKeyboardNavigation.d.ts +0 -29
  281. package/types/tabstrip/useSelection.d.ts +0 -13
  282. package/types/tabstrip/useTabstrip.d.ts +0 -55
  283. package/types/toolbar/Toolbar.d.ts +0 -19
  284. package/types/toolbar/index.d.ts +0 -1
  285. package/types/toolbar/toolbar-dom-utils.d.ts +0 -3
  286. package/types/toolbar/useKeyboardNavigation.d.ts +0 -32
  287. package/types/toolbar/useSelection.d.ts +0 -22
  288. package/types/toolbar/useToolbar.d.ts +0 -28
  289. package/types/utils/deprecated-types.d.ts +0 -2
  290. package/types/utils/escapeRegExp.d.ts +0 -1
  291. package/types/utils/forwardCallbackProps.d.ts +0 -3
  292. package/types/utils/index.d.ts +0 -5
  293. package/types/utils/isOverflowElement.d.ts +0 -1
  294. package/types/utils/isPlainObject.d.ts +0 -1
  295. package/types/vuu-date-picker/VuuDatePicker.d.ts +0 -7
  296. package/types/vuu-date-picker/index.d.ts +0 -1
  297. package/types/vuu-input/VuuInput.d.ts +0 -17
  298. package/types/vuu-input/index.d.ts +0 -1
  299. package/types/vuu-typeahead-input/VuuTypeaheadInput.d.ts +0 -29
  300. package/types/vuu-typeahead-input/index.d.ts +0 -1
  301. package/types/vuu-typeahead-input/useVuuTypeaheadInput.d.ts +0 -15
@@ -1 +0,0 @@
1
- {"version":3,"file":"List.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
package/cjs/list/List.js DELETED
@@ -1,317 +0,0 @@
1
- 'use strict';
2
-
3
- var jsxRuntime = require('react/jsx-runtime');
4
- var React = require('react');
5
- var vuuUtils = require('@vuu-ui/vuu-utils');
6
- var core = require('@salt-ds/core');
7
- var styles = require('@salt-ds/styles');
8
- var window = require('@salt-ds/window');
9
- var cx = require('clsx');
10
- require('../common-hooks/collectionProvider.js');
11
- var itemToString = require('../common-hooks/itemToString.js');
12
- var useCollectionItems = require('../common-hooks/useCollectionItems.js');
13
- require('../common-hooks/use-resize-observer.js');
14
- require('./common-hooks/keyUtils.js');
15
- var useImperativeScrollingAPI = require('./common-hooks/useImperativeScrollingAPI.js');
16
- var useKeyboardNavigation = require('./common-hooks/useKeyboardNavigation.js');
17
- var isSelected = require('./common-hooks/utils/isSelected.js');
18
- var ListItem = require('./ListItem.js');
19
- var useList = require('./useList.js');
20
- var useListHeight = require('./useListHeight.js');
21
- var useScrollPosition = require('./useScrollPosition.js');
22
- var MeasuredContainer = require('../measured-container/MeasuredContainer.js');
23
- require('../measured-container/useResizeObserver.js');
24
- var List$1 = require('./List.css.js');
25
-
26
- const classBase = "vuuList";
27
- const List = React.forwardRef(function List2({
28
- ListItem: ListItem$1 = ListItem.ListItem,
29
- ListPlaceholder,
30
- allowDragDrop,
31
- children,
32
- className,
33
- collapsibleHeaders = false,
34
- defaultHighlightedIndex,
35
- defaultSelected,
36
- disabled: listDisabled = false,
37
- disableFocus = false,
38
- disableTypeToSelect,
39
- displayedItemCount = 10,
40
- emptyMessage,
41
- focusVisible: focusVisibleProp,
42
- getItemHeight: getItemHeightProp,
43
- getItemId,
44
- height,
45
- highlightedIndex: highlightedIndexProp,
46
- id: idProp,
47
- itemGapSize = 0,
48
- itemHeight: itemHeightProp,
49
- itemTextHighlightPattern,
50
- itemToString: itemToString$1 = itemToString.itemToString,
51
- listHandlers: listHandlersProp,
52
- maxHeight,
53
- maxWidth,
54
- minHeight,
55
- minWidth,
56
- onClick: onClickProp,
57
- onDragStart,
58
- onDrop,
59
- onMoveListItem,
60
- onSelect,
61
- onSelectionChange,
62
- onHighlight,
63
- restoreLastFocus,
64
- selected: selectedProp,
65
- selectionStrategy,
66
- checkable = selectionStrategy === "multiple",
67
- scrollingApiRef,
68
- // TODO do we still need these ?
69
- selectionKeys,
70
- showEmptyMessage = false,
71
- source,
72
- style: styleProp,
73
- stickyHeaders,
74
- tabIndex = 0,
75
- tabToSelect,
76
- ...htmlAttributes
77
- }, forwardedRef) {
78
- const targetWindow = window.useWindow();
79
- styles.useComponentCssInjection({
80
- testId: "vuu-list",
81
- css: List$1,
82
- window: targetWindow
83
- });
84
- const id = vuuUtils.useId(idProp);
85
- const contentContainerRef = React.useRef(null);
86
- const [size, setSize] = React.useState();
87
- const handleResize = React.useCallback((size2) => {
88
- setSize(size2);
89
- }, []);
90
- const collectionHook = useCollectionItems.useCollectionItems({
91
- id,
92
- label: "List",
93
- source,
94
- children,
95
- options: {
96
- collapsibleHeaders,
97
- // Add Group ChildTypes to options
98
- getItemId,
99
- itemToString: itemToString$1
100
- }
101
- });
102
- const {
103
- listClientHeight,
104
- computedListHeight,
105
- listItemHeight,
106
- rowHeightProxyRef
107
- } = useListHeight.useListHeight({
108
- displayedItemCount,
109
- getItemHeight: getItemHeightProp,
110
- height,
111
- itemCount: collectionHook.data.length,
112
- itemGapSize,
113
- itemHeight: itemHeightProp,
114
- size
115
- });
116
- const { onVerticalScroll, viewportRange } = useScrollPosition.useScrollPosition({
117
- containerSize: (
118
- // TODO whats the right way to handle string values - ie percentages
119
- listClientHeight ?? computedListHeight ?? size?.height ?? 0
120
- ),
121
- itemCount: collectionHook.data.length,
122
- itemGapSize,
123
- itemSize: listItemHeight
124
- });
125
- const {
126
- containerRef,
127
- setContainerRef,
128
- draggable,
129
- draggedItemIndex,
130
- dropIndicator,
131
- focusVisible,
132
- highlightedIndex,
133
- listControlProps,
134
- listHandlers,
135
- listItemHeaderHandlers,
136
- scrollIntoView,
137
- selected
138
- } = useList.useList({
139
- allowDragDrop,
140
- collapsibleHeaders,
141
- collectionHook,
142
- contentRef: contentContainerRef,
143
- defaultHighlightedIndex,
144
- defaultSelected: collectionHook.itemToCollectionItemId(defaultSelected),
145
- disabled: listDisabled,
146
- disableTypeToSelect,
147
- highlightedIndex: highlightedIndexProp,
148
- id,
149
- label: "List",
150
- listHandlers: listHandlersProp,
151
- // should this be in context ?
152
- onClick: onClickProp,
153
- onDragStart,
154
- onDrop,
155
- onMoveListItem,
156
- onSelect,
157
- onSelectionChange,
158
- onHighlight,
159
- restoreLastFocus,
160
- selected: collectionHook.itemToCollectionItemId(selectedProp),
161
- selectionStrategy,
162
- selectionKeys,
163
- stickyHeaders,
164
- tabToSelect,
165
- viewportRange
166
- });
167
- useImperativeScrollingAPI.useImperativeScrollingAPI({
168
- collectionHook,
169
- forwardedRef: scrollingApiRef,
170
- // this should surely be scrollContainerRef
171
- scrollableRef: containerRef,
172
- scrollIntoView
173
- });
174
- const appliedFocusVisible = focusVisibleProp ?? focusVisible;
175
- const createHeader = function createHeader2(idx, headerId, title, expanded) {
176
- const header = /* @__PURE__ */ React.createElement(
177
- ListItem$1,
178
- {
179
- ...listItemHeaderHandlers,
180
- className: cx(`${classBase}Header`, {
181
- focusVisible: collapsibleHeaders && appliedFocusVisible === idx.value
182
- }),
183
- "aria-expanded": expanded,
184
- "data-index": collapsibleHeaders ? idx.value : void 0,
185
- "data-highlighted": idx.value === highlightedIndex || void 0,
186
- "data-sticky": stickyHeaders,
187
- "data-selectable": false,
188
- id: headerId,
189
- itemHeight: getItemHeight(idx.value),
190
- key: `header-${idx.value}`,
191
- label: title
192
- }
193
- );
194
- idx.value += 1;
195
- return header;
196
- };
197
- const getItemHeight = getItemHeightProp === void 0 ? () => itemHeightProp : getItemHeightProp;
198
- function renderCollectionItem(list, item, idx) {
199
- const { disabled, value, id: itemId, label } = item;
200
- const isChildItem = React.isValidElement(value);
201
- const listItemProps = {
202
- // eslint-disable-next-line @typescript-eslint/ban-ts-comment
203
- // @ts-ignore until we refactor this whole section
204
- className: cx(value?.props?.className, {
205
- vuuHighlighted: idx.value === highlightedIndex,
206
- vuuFocusVisible: appliedFocusVisible === idx.value,
207
- [`vuuDraggable-dragAway`]: draggedItemIndex === idx.value
208
- }),
209
- disabled: disabled || listDisabled,
210
- id: itemId,
211
- item: isChildItem ? void 0 : item?.value ?? void 0,
212
- itemHeight: getItemHeight(idx.value),
213
- itemTextHighlightPattern,
214
- key: itemId,
215
- "data-index": idx.value,
216
- label,
217
- role: "option",
218
- selected: isSelected.isSelected(selected, item),
219
- showCheckbox: checkable
220
- };
221
- list.push(
222
- isChildItem ? React.cloneElement(value, listItemProps) : /* @__PURE__ */ jsxRuntime.jsx(ListItem$1, { ...listItemProps })
223
- );
224
- idx.value += 1;
225
- }
226
- const addGroup = function addGroup2(list, items, idx) {
227
- const { count = 0, id: id2, expanded, label = "" } = items[idx.value];
228
- const header = createHeader(idx, id2, label, expanded);
229
- const childItems = expanded !== false ? [header].concat(
230
- renderCollectionItems(items, idx, idx.value + count) || []
231
- ) : header;
232
- list.push(
233
- /* @__PURE__ */ jsxRuntime.jsx("div", { role: "group", children: childItems }, id2)
234
- );
235
- };
236
- const renderCollectionItems = (items, idx = { value: 0 }, end = items.length) => {
237
- const listItems = [];
238
- while (idx.value < end) {
239
- const item = items[idx.value];
240
- if (item.header) {
241
- listItems.push(
242
- createHeader(idx, item.id, item.label, item.expanded === false)
243
- );
244
- } else if (item.childNodes) {
245
- addGroup(listItems, items, idx);
246
- } else {
247
- renderCollectionItem(listItems, item, idx);
248
- }
249
- }
250
- return listItems;
251
- };
252
- const isEmpty = collectionHook.data.length === 0;
253
- const renderContent = () => {
254
- if (!isEmpty) {
255
- const itemsToRender = collectionHook.data;
256
- return renderCollectionItems(itemsToRender);
257
- }
258
- };
259
- const contentHeight = "auto";
260
- const sizeStyles = {
261
- "--list-borderWidth": "var(--vuuList-borderWidth, var(--salt-size-border, 0))",
262
- "--list-item-gap": itemGapSize ? `${itemGapSize}px` : void 0,
263
- "--computed-list-height": computedListHeight === void 0 ? void 0 : `${computedListHeight}px`,
264
- minWidth,
265
- minHeight,
266
- maxWidth,
267
- maxHeight
268
- };
269
- return /* @__PURE__ */ jsxRuntime.jsxs(
270
- MeasuredContainer.MeasuredContainer,
271
- {
272
- "aria-multiselectable": selectionStrategy === "multiple" || selectionStrategy === "extended" || selectionStrategy === "extended-multi-range" || void 0,
273
- ...htmlAttributes,
274
- ...listHandlers,
275
- ...listControlProps,
276
- className: cx(classBase, className, "vuuScrollable", {
277
- [`${classBase}-collapsible`]: collapsibleHeaders,
278
- [`${classBase}-contentSized`]: computedListHeight !== void 0,
279
- [`${classBase}-empty`]: isEmpty,
280
- vuuFocusVisible: highlightedIndex === useKeyboardNavigation.LIST_FOCUS_VISIBLE
281
- }),
282
- height: computedListHeight ?? height,
283
- id: `${id}`,
284
- onResize: handleResize,
285
- ref: core.useForkRef(setContainerRef, forwardedRef),
286
- role: "listbox",
287
- style: { ...styleProp, ...sizeStyles },
288
- tabIndex: listDisabled || disableFocus ? void 0 : tabIndex,
289
- children: [
290
- /* @__PURE__ */ jsxRuntime.jsx(
291
- ListItem.ListItemProxy,
292
- {
293
- ref: rowHeightProxyRef,
294
- height: itemHeightProp
295
- },
296
- "canary"
297
- ),
298
- collectionHook.data.length === 0 && ListPlaceholder !== void 0 ? /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: /* @__PURE__ */ jsxRuntime.jsx(ListPlaceholder, {}) }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${classBase}-viewport`, onScroll: onVerticalScroll, children: /* @__PURE__ */ jsxRuntime.jsxs(
299
- "div",
300
- {
301
- className: `${classBase}-scrollingContentContainer`,
302
- ref: contentContainerRef,
303
- style: { height: contentHeight },
304
- children: [
305
- renderContent(),
306
- dropIndicator,
307
- draggable
308
- ]
309
- }
310
- ) })
311
- ]
312
- }
313
- );
314
- });
315
-
316
- exports.List = List;
317
- //# sourceMappingURL=List.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"List.js","sources":["../../src/list/List.tsx"],"sourcesContent":["import { useId } from \"@vuu-ui/vuu-utils\";\nimport { useForkRef } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport cx from \"clsx\";\nimport {\n cloneElement,\n ForwardedRef,\n forwardRef,\n isValidElement,\n ReactElement,\n useCallback,\n useRef,\n useState,\n} from \"react\";\nimport {\n CollectionIndexer,\n CollectionItem,\n itemToString as defaultItemToString,\n SelectionStrategy,\n} from \"../common-hooks\";\nimport {\n isSelected,\n LIST_FOCUS_VISIBLE,\n useCollectionItems,\n useImperativeScrollingAPI,\n} from \"./common-hooks\";\n\nimport { ListItem as DefaultListItem, ListItemProxy } from \"./ListItem\";\nimport { ListItemProps, ListProps } from \"./listTypes\";\nimport { useList } from \"./useList\";\nimport { useListHeight } from \"./useListHeight\";\nimport { useScrollPosition } from \"./useScrollPosition\";\nimport { MeasuredContainer, MeasuredSize } from \"../measured-container\";\n\nimport listCss from \"./List.css\";\n\nconst defaultEmptyMessage = \"No data to display\";\n\nconst classBase = \"vuuList\";\n\nexport const List = forwardRef(function List<\n Item = string,\n S extends SelectionStrategy = \"default\",\n>(\n {\n ListItem = DefaultListItem,\n ListPlaceholder,\n allowDragDrop,\n children,\n className,\n collapsibleHeaders = false,\n defaultHighlightedIndex,\n defaultSelected,\n disabled: listDisabled = false,\n disableFocus = false,\n disableTypeToSelect,\n displayedItemCount = 10,\n emptyMessage,\n focusVisible: focusVisibleProp,\n getItemHeight: getItemHeightProp,\n getItemId,\n height,\n highlightedIndex: highlightedIndexProp,\n id: idProp,\n itemGapSize = 0,\n itemHeight: itemHeightProp,\n itemTextHighlightPattern,\n itemToString = defaultItemToString,\n listHandlers: listHandlersProp,\n maxHeight,\n maxWidth,\n minHeight,\n minWidth,\n onClick: onClickProp,\n onDragStart,\n onDrop,\n onMoveListItem,\n onSelect,\n onSelectionChange,\n onHighlight,\n restoreLastFocus,\n selected: selectedProp,\n selectionStrategy,\n checkable = selectionStrategy === \"multiple\",\n scrollingApiRef,\n // TODO do we still need these ?\n selectionKeys,\n showEmptyMessage = false,\n source,\n style: styleProp,\n stickyHeaders,\n tabIndex = 0,\n tabToSelect,\n ...htmlAttributes\n }: ListProps<Item, S>,\n forwardedRef?: ForwardedRef<HTMLDivElement>,\n) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"vuu-list\",\n css: listCss,\n window: targetWindow,\n });\n\n const id = useId(idProp);\n const contentContainerRef = useRef<HTMLDivElement>(null);\n const [size, setSize] = useState<MeasuredSize | undefined>();\n const handleResize = useCallback((size: MeasuredSize) => {\n setSize(size);\n }, []);\n\n const collectionHook = useCollectionItems<Item>({\n id,\n label: \"List\",\n source,\n children,\n options: {\n collapsibleHeaders,\n // Add Group ChildTypes to options\n getItemId,\n itemToString,\n },\n });\n\n const {\n listClientHeight,\n computedListHeight,\n listItemHeight,\n rowHeightProxyRef,\n } = useListHeight({\n displayedItemCount,\n getItemHeight: getItemHeightProp,\n height,\n itemCount: collectionHook.data.length,\n itemGapSize,\n itemHeight: itemHeightProp,\n size,\n });\n\n const { onVerticalScroll, viewportRange } = useScrollPosition({\n containerSize:\n // TODO whats the right way to handle string values - ie percentages\n listClientHeight ?? computedListHeight ?? size?.height ?? 0,\n itemCount: collectionHook.data.length,\n itemGapSize: itemGapSize,\n itemSize: listItemHeight,\n });\n\n const {\n containerRef,\n setContainerRef,\n draggable,\n draggedItemIndex,\n dropIndicator,\n focusVisible,\n highlightedIndex,\n listControlProps,\n listHandlers,\n listItemHeaderHandlers,\n scrollIntoView,\n selected,\n } = useList<Item, S>({\n allowDragDrop,\n collapsibleHeaders,\n collectionHook,\n contentRef: contentContainerRef,\n defaultHighlightedIndex,\n defaultSelected: collectionHook.itemToCollectionItemId(defaultSelected),\n disabled: listDisabled,\n disableTypeToSelect,\n highlightedIndex: highlightedIndexProp,\n id,\n label: \"List\",\n listHandlers: listHandlersProp, // should this be in context ?\n onClick: onClickProp,\n onDragStart,\n onDrop,\n onMoveListItem,\n onSelect,\n onSelectionChange,\n onHighlight,\n restoreLastFocus,\n selected: collectionHook.itemToCollectionItemId(selectedProp as any),\n selectionStrategy,\n selectionKeys,\n stickyHeaders,\n tabToSelect,\n viewportRange,\n });\n\n useImperativeScrollingAPI({\n collectionHook,\n forwardedRef: scrollingApiRef,\n // this should surely be scrollContainerRef\n scrollableRef: containerRef,\n scrollIntoView,\n });\n\n // focusVisible passes as a prop takes precedence\n const appliedFocusVisible = focusVisibleProp ?? focusVisible;\n\n const createHeader: (\n idx: { value: number },\n headerId: string,\n title: string,\n expanded?: boolean,\n ) => ReactElement = function createHeader(idx, headerId, title, expanded) {\n const header = (\n <ListItem\n {...listItemHeaderHandlers}\n className={cx(`${classBase}Header`, {\n focusVisible: collapsibleHeaders && appliedFocusVisible === idx.value,\n })}\n aria-expanded={expanded}\n data-index={collapsibleHeaders ? idx.value : undefined}\n data-highlighted={idx.value === highlightedIndex || undefined}\n data-sticky={stickyHeaders}\n data-selectable={false}\n id={headerId}\n itemHeight={getItemHeight(idx.value)}\n key={`header-${idx.value}`}\n label={title}\n // role=\"presentation\"\n />\n );\n idx.value += 1;\n return header;\n };\n\n const getItemHeight =\n getItemHeightProp === undefined ? () => itemHeightProp : getItemHeightProp;\n\n function renderCollectionItem(\n list: ReactElement[],\n item: CollectionItem<Item>,\n idx: { value: number },\n ) {\n // Note, a number of these props are specific to ListItem. What if user\n // implements a custom ListItem but neglects to handle all these props.\n // Is that on them ?\n const { disabled, value, id: itemId, label } = item;\n const isChildItem = isValidElement(value);\n const listItemProps: ListItemProps<Item> & {\n key: string;\n \"data-index\": number;\n } = {\n // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n // @ts-ignore until we refactor this whole section\n className: cx(value?.props?.className, {\n vuuHighlighted: idx.value === highlightedIndex,\n vuuFocusVisible: appliedFocusVisible === idx.value,\n [`vuuDraggable-dragAway`]: draggedItemIndex === idx.value,\n }),\n disabled: disabled || listDisabled,\n id: itemId,\n item: isChildItem ? undefined : (item?.value ?? undefined),\n itemHeight: getItemHeight(idx.value),\n itemTextHighlightPattern,\n key: itemId,\n \"data-index\": idx.value,\n label,\n role: \"option\",\n selected: isSelected<Item>(selected, item),\n showCheckbox: checkable,\n };\n list.push(\n isChildItem ? (\n cloneElement(value, listItemProps)\n ) : (\n <ListItem {...listItemProps} />\n ),\n );\n\n idx.value += 1;\n }\n\n const addGroup: (\n list: ReactElement[],\n items: CollectionItem<Item>[],\n idx: { value: number },\n ) => void = function addGroup(\n list: ReactElement[],\n items: CollectionItem<Item>[],\n idx: { value: number },\n ) {\n const { count = 0, id, expanded, label = \"\" } = items[idx.value];\n const header = createHeader(idx, id, label, expanded);\n const childItems: ReactElement | ReactElement[] =\n expanded !== false\n ? [header].concat(\n renderCollectionItems(items, idx, idx.value + count) || [],\n )\n : header;\n\n list.push(\n <div key={id} role=\"group\">\n {childItems}\n </div>,\n );\n };\n\n const renderCollectionItems = (\n items: CollectionItem<Item>[],\n idx: CollectionIndexer = { value: 0 },\n end = items.length,\n ): ReactElement[] | undefined => {\n const listItems: ReactElement[] = [];\n while (idx.value < end) {\n const item = items[idx.value];\n if (item.header) {\n listItems.push(\n createHeader(idx, item.id, item.label!, item.expanded === false),\n );\n } else if (item.childNodes) {\n addGroup(listItems, items, idx);\n } else {\n renderCollectionItem(listItems, item, idx);\n }\n }\n return listItems;\n };\n\n function renderEmpty() {\n if (emptyMessage || showEmptyMessage) {\n return (\n <span className={`${classBase}-empty-message`}>\n {emptyMessage ?? defaultEmptyMessage}\n </span>\n );\n } else {\n return null;\n }\n }\n\n const isEmpty = collectionHook.data.length === 0;\n\n const renderContent = () => {\n if (!isEmpty) {\n // const itemsToRender =\n // typeof draggedItemIndex === \"number\" && draggedItemIndex >= 0\n // ? collectionHook.data.filter((d) => d.index !== draggedItemIndex)\n // : collectionHook.data;\n const itemsToRender = collectionHook.data;\n\n return renderCollectionItems(itemsToRender);\n } else {\n renderEmpty();\n }\n };\n const contentHeight = \"auto\";\n const sizeStyles = {\n \"--list-borderWidth\":\n \"var(--vuuList-borderWidth, var(--salt-size-border, 0))\",\n \"--list-item-gap\": itemGapSize ? `${itemGapSize}px` : undefined,\n \"--computed-list-height\":\n computedListHeight === undefined ? undefined : `${computedListHeight}px`,\n minWidth,\n minHeight,\n maxWidth,\n maxHeight,\n };\n return (\n <MeasuredContainer\n aria-multiselectable={\n selectionStrategy === \"multiple\" ||\n selectionStrategy === \"extended\" ||\n selectionStrategy === \"extended-multi-range\" ||\n undefined\n }\n {...htmlAttributes}\n {...listHandlers}\n {...listControlProps}\n className={cx(classBase, className, \"vuuScrollable\", {\n [`${classBase}-collapsible`]: collapsibleHeaders,\n [`${classBase}-contentSized`]: computedListHeight !== undefined,\n [`${classBase}-empty`]: isEmpty,\n vuuFocusVisible: highlightedIndex === LIST_FOCUS_VISIBLE,\n })}\n height={computedListHeight ?? height}\n id={`${id}`}\n onResize={handleResize}\n ref={useForkRef<HTMLDivElement>(setContainerRef, forwardedRef)}\n role=\"listbox\"\n style={{ ...styleProp, ...sizeStyles }}\n tabIndex={listDisabled || disableFocus ? undefined : tabIndex}\n >\n <ListItemProxy\n ref={rowHeightProxyRef}\n height={itemHeightProp}\n key=\"canary\"\n />\n {collectionHook.data.length === 0 && ListPlaceholder !== undefined ? (\n <>\n <ListPlaceholder />\n </>\n ) : (\n <div className={`${classBase}-viewport`} onScroll={onVerticalScroll}>\n <div\n className={`${classBase}-scrollingContentContainer`}\n ref={contentContainerRef}\n style={{ height: contentHeight }}\n >\n {renderContent()}\n {dropIndicator}\n {draggable}\n </div>\n </div>\n )}\n </MeasuredContainer>\n );\n}) as <Item = string, S extends SelectionStrategy = \"default\">(\n props: ListProps<Item, S> & {\n ref?: ForwardedRef<HTMLDivElement>;\n },\n) => ReactElement<ListProps<Item>>;\n"],"names":["forwardRef","List","ListItem","DefaultListItem","itemToString","defaultItemToString","useWindow","useComponentCssInjection","listCss","useId","useRef","useState","useCallback","size","useCollectionItems","useListHeight","useScrollPosition","useList","useImperativeScrollingAPI","createHeader","createElement","isValidElement","isSelected","cloneElement","jsx","addGroup","id","jsxs","MeasuredContainer","LIST_FOCUS_VISIBLE","useForkRef","ListItemProxy"],"mappings":"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"}
@@ -1,6 +0,0 @@
1
- 'use strict';
2
-
3
- var listItemCss = ".vuuListItem {\n /* Color */\n --list-item-text-color: var(--salt-content-primary-foreground);\n --list-item-background: var(--vuuList-item-background, var(--salt-selectable-background));\n /* --list-item-selected-focus-outlineColor: var(--salt-color-white); TODO: Check token with design */\n --list-item-text-color-active: var(--salt-selectable-foreground-selected);\n --list-item-background-active: var(--salt-selectable-background-selected);\n --list-item-alignItems: center;\n}\n\n.vuuListItem.vuuHighlighted {\n --saltCheckbox-icon-stroke: var(--salt-selectable-borderColor-hover);\n --list-item-background: var(--salt-selectable-background-hover);\n}\n\n.vuuListItemHeader {\n font-weight: var(--salt-text-fontWeight-strong); /* TODO: Check token with design */\n}\n\n.vuuListItemHeader[data-sticky] {\n position: sticky;\n top: 0;\n z-index: 1;\n}\n\n.vuuListItem {\n color: var(--list-item-text-color);\n cursor: var(--vuuList-item-cursor, pointer);\n background: var(--vuuList-item-background, var(--list-item-background));\n font-size: var(--salt-text-fontSize);\n text-align: var(--salt-text-textAlign);\n line-height: var(--salt-text-lineHeight);\n height: var(--vuuList-item-height, var(--list-item-height, auto));\n /* Replaced border-bottom with margin. In design spec, the height of the items should not include gap */\n margin-bottom: var(--list-item-gap);\n padding: 0 var(--vuuListItem-padding, var(--salt-size-unit));\n left: 0;\n right: 0;\n display: flex;\n position: relative;\n align-items: var(--list-item-alignItems);\n white-space: nowrap;\n}\n\n.vuuListItem:last-child {\n margin-bottom: 0px;\n}\n\n.vuuListItem-checkbox {\n --list-item-background-active: var(--salt-selectable-background);\n --list-item-text-color-active: var(--salt-content-primary-foreground);\n --list-item-text-padding: 0 0 0 var(--salt-size-unit);\n}\n\n.vuuListItem[aria-selected=\"true\"]:not(.vuuListItem-checkbox) {\n --list-item-background: var(--list-item-background-active);\n color: var(--list-item-text-color-active);\n}\n\n.vuuListItem.vuuDisabled {\n --list-item-text-color: var(--salt-content-primary-foreground-disabled);\n cursor: var(--salt-selectable-cursor-disabled);\n}\n\n.vuuListItem.vuuFocusVisible {\n outline-style: var(--salt-focused-outlineStyle);\n outline-width: var(--salt-focused-outlineWidth);\n outline-offset: -2px;\n outline-color: var(--salt-focused-outlineColor);\n}\n\n.vuuListItem.vuuFocusVisible:after {\n content: none;\n}\n\n.vuuListItem[aria-selected=\"true\"]:not(.vuuListItem-checkbox).vuuFocusVisible {\n outline-color: var(--list-item-selected-focus-outlineColor);\n}\n\n.vuuListItem-textWrapper {\n flex: 1;\n overflow: hidden;\n padding: var(--list-item-text-padding, 0px);\n white-space: nowrap;\n text-overflow: ellipsis;\n}\n\n.vuuListItem-proxy {\n position: absolute !important;\n visibility: hidden;\n}\n.vuuDraggable-list-item {\n --vuuList-item-height: 24px;\n background-color: white;\n}\n\n.vuuListItem.vuuDraggable-dragAway {\n display: none;\n}";
4
-
5
- module.exports = listItemCss;
6
- //# sourceMappingURL=ListItem.css.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"ListItem.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
@@ -1,84 +0,0 @@
1
- 'use strict';
2
-
3
- var jsxRuntime = require('react/jsx-runtime');
4
- var React = require('react');
5
- var cx = require('clsx');
6
- var core = require('@salt-ds/core');
7
- var styles = require('@salt-ds/styles');
8
- var window = require('@salt-ds/window');
9
- var Highlighter = require('./Highlighter.js');
10
- var ListItem$1 = require('./ListItem.css.js');
11
-
12
- const classBase = "vuuListItem";
13
- const ListItemProxy = React.forwardRef(function ListItemProxy2({
14
- height,
15
- ...htmlAttributes
16
- }, forwardedRef) {
17
- const targetWindow = window.useWindow();
18
- styles.useComponentCssInjection({
19
- testId: "vuu-list-item",
20
- css: ListItem$1,
21
- window: targetWindow
22
- });
23
- return /* @__PURE__ */ jsxRuntime.jsx(
24
- "div",
25
- {
26
- ...htmlAttributes,
27
- "aria-hidden": true,
28
- className: cx(classBase, `${classBase}-proxy`),
29
- ref: forwardedRef,
30
- style: { height }
31
- }
32
- );
33
- });
34
- const ListItem = React.forwardRef(
35
- function ListItem2({
36
- children,
37
- className: classNameProp,
38
- disabled,
39
- tabIndex,
40
- item,
41
- itemHeight,
42
- itemTextHighlightPattern,
43
- label,
44
- selectable: _notUsed,
45
- selected,
46
- showCheckbox,
47
- style: styleProp,
48
- ...props
49
- }, forwardedRef) {
50
- const className = cx(classBase, classNameProp, {
51
- vuuDisabled: disabled,
52
- [`${classBase}-checkbox`]: showCheckbox
53
- });
54
- const style = itemHeight !== void 0 ? {
55
- ...styleProp,
56
- height: itemHeight
57
- } : styleProp;
58
- return /* @__PURE__ */ jsxRuntime.jsxs(
59
- "div",
60
- {
61
- className,
62
- ...props,
63
- "aria-disabled": disabled || void 0,
64
- "aria-selected": selected || void 0,
65
- ref: forwardedRef,
66
- style,
67
- children: [
68
- showCheckbox && /* @__PURE__ */ jsxRuntime.jsx(core.Checkbox, { "aria-hidden": true, checked: selected }),
69
- children && typeof children !== "string" ? children : itemTextHighlightPattern == null ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: `${classBase}-textWrapper`, children: label || children }) : /* @__PURE__ */ jsxRuntime.jsx(
70
- Highlighter.Highlighter,
71
- {
72
- matchPattern: itemTextHighlightPattern,
73
- text: label || children
74
- }
75
- )
76
- ]
77
- }
78
- );
79
- }
80
- );
81
-
82
- exports.ListItem = ListItem;
83
- exports.ListItemProxy = ListItemProxy;
84
- //# sourceMappingURL=ListItem.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"ListItem.js","sources":["../../src/list/ListItem.tsx"],"sourcesContent":["import { ForwardedRef, forwardRef, HTMLAttributes } from \"react\";\nimport cx from \"clsx\";\nimport { Checkbox } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { ListItemProps, ListItemType } from \"./listTypes\";\nimport { Highlighter } from \"./Highlighter\";\n\nimport listItemCss from \"./ListItem.css\";\n\nconst classBase = \"vuuListItem\";\n\n// A dummy ListItem rendered once and not visible. We measure this to\n// determine height of ListItem and monitor it for size changes (in\n// case of runtime density switch). This allows ListItem height to\n// be controlled purely through CSS.\nexport const ListItemProxy = forwardRef(function ListItemProxy(\n {\n height,\n ...htmlAttributes\n }: HTMLAttributes<HTMLDivElement> & {\n height?: number;\n },\n forwardedRef: ForwardedRef<HTMLDivElement>\n) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"vuu-list-item\",\n css: listItemCss,\n window: targetWindow,\n });\n\n return (\n <div\n {...htmlAttributes}\n aria-hidden\n className={cx(classBase, `${classBase}-proxy`)}\n ref={forwardedRef}\n style={{ height }}\n />\n );\n});\n\n// Note: the memo is effective if List label is passed as simple string\n// If children are used, it is the responsibility of caller to memoise\n// these if performance on highlight is perceived to be an issue.\nexport const ListItem = forwardRef<HTMLDivElement, ListItemProps>(\n function ListItem(\n {\n children,\n className: classNameProp,\n disabled,\n tabIndex,\n item,\n itemHeight,\n itemTextHighlightPattern,\n label,\n selectable: _notUsed,\n selected,\n showCheckbox,\n style: styleProp,\n ...props\n },\n forwardedRef\n ) {\n const className = cx(classBase, classNameProp, {\n vuuDisabled: disabled,\n [`${classBase}-checkbox`]: showCheckbox,\n });\n const style =\n itemHeight !== undefined\n ? {\n ...styleProp,\n height: itemHeight,\n }\n : styleProp;\n\n return (\n <div\n className={className}\n {...props}\n aria-disabled={disabled || undefined}\n aria-selected={selected || undefined}\n ref={forwardedRef}\n style={style}\n >\n {showCheckbox && <Checkbox aria-hidden checked={selected} />}\n {children && typeof children !== \"string\" ? (\n children\n ) : itemTextHighlightPattern == null ? (\n <span className={`${classBase}-textWrapper`}>\n {label || children}\n </span>\n ) : (\n <Highlighter\n matchPattern={itemTextHighlightPattern}\n text={label || (children as string)}\n />\n )}\n </div>\n );\n }\n) as ListItemType;\n"],"names":["forwardRef","ListItemProxy","useWindow","useComponentCssInjection","listItemCss","jsx","ListItem","jsxs","Checkbox","Highlighter"],"mappings":";;;;;;;;;;;AAUA,MAAM,SAAY,GAAA,aAAA;AAML,MAAA,aAAA,GAAgBA,gBAAW,CAAA,SAASC,cAC/C,CAAA;AAAA,EACE,MAAA;AAAA,EACA,GAAG;AACL,CAAA,EAGA,YACA,EAAA;AACA,EAAA,MAAM,eAAeC,gBAAU,EAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,eAAA;AAAA,IACR,GAAK,EAAAC,UAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EACE,uBAAAC,cAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACE,GAAG,cAAA;AAAA,MACJ,aAAW,EAAA,IAAA;AAAA,MACX,SAAW,EAAA,EAAA,CAAG,SAAW,EAAA,CAAA,EAAG,SAAS,CAAQ,MAAA,CAAA,CAAA;AAAA,MAC7C,GAAK,EAAA,YAAA;AAAA,MACL,KAAA,EAAO,EAAE,MAAO;AAAA;AAAA,GAClB;AAEJ,CAAC;AAKM,MAAM,QAAW,GAAAL,gBAAA;AAAA,EACtB,SAASM,SACP,CAAA;AAAA,IACE,QAAA;AAAA,IACA,SAAW,EAAA,aAAA;AAAA,IACX,QAAA;AAAA,IACA,QAAA;AAAA,IACA,IAAA;AAAA,IACA,UAAA;AAAA,IACA,wBAAA;AAAA,IACA,KAAA;AAAA,IACA,UAAY,EAAA,QAAA;AAAA,IACZ,QAAA;AAAA,IACA,YAAA;AAAA,IACA,KAAO,EAAA,SAAA;AAAA,IACP,GAAG;AAAA,KAEL,YACA,EAAA;AACA,IAAM,MAAA,SAAA,GAAY,EAAG,CAAA,SAAA,EAAW,aAAe,EAAA;AAAA,MAC7C,WAAa,EAAA,QAAA;AAAA,MACb,CAAC,CAAA,EAAG,SAAS,CAAA,SAAA,CAAW,GAAG;AAAA,KAC5B,CAAA;AACD,IAAM,MAAA,KAAA,GACJ,eAAe,KACX,CAAA,GAAA;AAAA,MACE,GAAG,SAAA;AAAA,MACH,MAAQ,EAAA;AAAA,KAEV,GAAA,SAAA;AAEN,IACE,uBAAAC,eAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,SAAA;AAAA,QACC,GAAG,KAAA;AAAA,QACJ,iBAAe,QAAY,IAAA,KAAA,CAAA;AAAA,QAC3B,iBAAe,QAAY,IAAA,KAAA,CAAA;AAAA,QAC3B,GAAK,EAAA,YAAA;AAAA,QACL,KAAA;AAAA,QAEC,QAAA,EAAA;AAAA,UAAA,YAAA,oBAAiBF,cAAA,CAAAG,aAAA,EAAA,EAAS,aAAW,EAAA,IAAA,EAAC,SAAS,QAAU,EAAA,CAAA;AAAA,UACzD,QAAY,IAAA,OAAO,QAAa,KAAA,QAAA,GAC/B,WACE,wBAA4B,IAAA,IAAA,mBAC7BH,cAAA,CAAA,MAAA,EAAA,EAAK,WAAW,CAAG,EAAA,SAAS,CAC1B,YAAA,CAAA,EAAA,QAAA,EAAA,KAAA,IAAS,UACZ,CAEA,mBAAAA,cAAA;AAAA,YAACI,uBAAA;AAAA,YAAA;AAAA,cACC,YAAc,EAAA,wBAAA;AAAA,cACd,MAAM,KAAU,IAAA;AAAA;AAAA;AAClB;AAAA;AAAA,KAEJ;AAAA;AAGN;;;;;"}
@@ -1,6 +0,0 @@
1
- 'use strict';
2
-
3
- const ListItemGroup = (_) => null;
4
-
5
- exports.ListItemGroup = ListItemGroup;
6
- //# sourceMappingURL=ListItemGroup.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"ListItemGroup.js","sources":["../../src/list/ListItemGroup.ts"],"sourcesContent":["import { HTMLAttributes, ReactElement } from \"react\";\n\n// Purely used as markers, props will be extracted\nexport interface ListItemGroupProps extends HTMLAttributes<HTMLDivElement> {\n // children?: ListItemType | ListItemType[];\n children?: ReactElement | ReactElement[];\n label?: string;\n}\nexport const ListItemGroup = (_: ListItemGroupProps) => null;\n"],"names":[],"mappings":";;AAQa,MAAA,aAAA,GAAgB,CAAC,CAA0B,KAAA;;;;"}
@@ -1,6 +0,0 @@
1
- 'use strict';
2
-
3
- const ListItemHeader = (_) => null;
4
-
5
- exports.ListItemHeader = ListItemHeader;
6
- //# sourceMappingURL=ListItemHeader.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"ListItemHeader.js","sources":["../../src/list/ListItemHeader.ts"],"sourcesContent":["import { HTMLAttributes } from \"react\";\n\n// Purely used as markers, props will be extracted\nexport interface ListItemHeaderProps extends HTMLAttributes<HTMLDivElement> {\n label?: string;\n}\nexport const ListItemHeader = (_: ListItemHeaderProps) => null;\n"],"names":[],"mappings":";;AAMa,MAAA,cAAA,GAAiB,CAAC,CAA2B,KAAA;;;;"}
@@ -1,6 +0,0 @@
1
- 'use strict';
2
-
3
- var radioIconCss = ".vuuRadioIcon {\n --vuu-icon-size: 12px;\n --vuu-icon-left: -1px;\n --vuu-icon-top: -1px;\n --vuu-icon-svg: var(--vuu-svg-radio);\n border-style: solid;\n border-color: var(--vuuRadioIcon-borderColor, var(--salt-selectable-borderColor));\n border-radius: 50%;\n border-width: 1px;\n display: inline-block;\n height: var(--vuuRadioIcon-size, 12px);\n position: relative;\n width: var(--vuuRadioIcon-size, 12px);\n}\n\n.vuuRadioIcon-checked {\n background-image: var(--vuu-svg-radio);\n border: none;\n background-repeat: no-repeat;\n}\n\n.vuuRadioIcon-checked:after {\n content: \"\";\n left: var(--vuu-icon-left, auto);\n height: var(--vuu-icon-height, var(--vuu-icon-size, 12px));\n -webkit-mask: var(--vuu-icon-svg) center center/var(--vuu-icon-size) var(--vuu-icon-size);\n mask: var(--vuu-icon-svg) center center/var(--vuu-icon-size) var(--vuu-icon-size);\n mask-repeat: no-repeat;\n -webkit-mask-repeat: no-repeat;\n position: absolute;\n top: var(--vuu-icon-top, auto);\n width: var(--vuu-icon-width, var(--vuu-icon-size, 12px));\n}\n";
4
-
5
- module.exports = radioIconCss;
6
- //# sourceMappingURL=RadioIcon.css.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"RadioIcon.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
@@ -1,27 +0,0 @@
1
- 'use strict';
2
-
3
- var jsxRuntime = require('react/jsx-runtime');
4
- var cx = require('clsx');
5
- var styles = require('@salt-ds/styles');
6
- var window = require('@salt-ds/window');
7
- var RadioIcon$1 = require('./RadioIcon.css.js');
8
-
9
- const classBase = "vuuRadioIcon";
10
- const RadioIcon = ({ checked = false, ...htmlAttributes }) => {
11
- const targetWindow = window.useWindow();
12
- styles.useComponentCssInjection({
13
- testId: "vuu-radio-icon",
14
- css: RadioIcon$1,
15
- window: targetWindow
16
- });
17
- return /* @__PURE__ */ jsxRuntime.jsx(
18
- "span",
19
- {
20
- ...htmlAttributes,
21
- className: cx(classBase, { [`${classBase}-checked`]: checked })
22
- }
23
- );
24
- };
25
-
26
- exports.RadioIcon = RadioIcon;
27
- //# sourceMappingURL=RadioIcon.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"RadioIcon.js","sources":["../../src/list/RadioIcon.tsx"],"sourcesContent":["import cx from \"clsx\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport radioIconCss from \"./RadioIcon.css\";\n\nconst classBase = \"vuuRadioIcon\";\n\nexport const RadioIcon = ({ checked = false, ...htmlAttributes }) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"vuu-radio-icon\",\n css: radioIconCss,\n window: targetWindow,\n });\n\n return (\n <span\n {...htmlAttributes}\n className={cx(classBase, { [`${classBase}-checked`]: checked })}\n />\n );\n};\n"],"names":["useWindow","useComponentCssInjection","radioIconCss","jsx"],"mappings":";;;;;;;;AAMA,MAAM,SAAY,GAAA,cAAA;AAEX,MAAM,YAAY,CAAC,EAAE,UAAU,KAAO,EAAA,GAAG,gBAAqB,KAAA;AACnE,EAAA,MAAM,eAAeA,gBAAU,EAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,gBAAA;AAAA,IACR,GAAK,EAAAC,WAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EACE,uBAAAC,cAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACE,GAAG,cAAA;AAAA,MACJ,SAAA,EAAW,EAAG,CAAA,SAAA,EAAW,EAAE,CAAC,GAAG,SAAS,CAAA,QAAA,CAAU,GAAG,OAAA,EAAS;AAAA;AAAA,GAChE;AAEJ;;;;"}
@@ -1,78 +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 Escape = "Escape";
18
- const Home = "Home";
19
- const End = "End";
20
- const PageUp = "PageUp";
21
- const PageDown = "PageDown";
22
- const Space = " ";
23
- const actionKeys = /* @__PURE__ */ new Set(["Enter", "Delete", " "]);
24
- const focusKeys = /* @__PURE__ */ new Set(["Tab"]);
25
- const arrowLeftRightKeys = /* @__PURE__ */ new Set(["ArrowRight", "ArrowLeft"]);
26
- const navigationKeys = /* @__PURE__ */ new Set([
27
- Home,
28
- End,
29
- PageUp,
30
- PageDown,
31
- ArrowDown,
32
- ArrowUp
33
- ]);
34
- const functionKeys = /* @__PURE__ */ new Set([
35
- "F1",
36
- "F2",
37
- "F3",
38
- "F4",
39
- "F5",
40
- "F6",
41
- "F7",
42
- "F8",
43
- "F9",
44
- "F10",
45
- "F11",
46
- "F12"
47
- ]);
48
- const specialKeys = union(
49
- actionKeys,
50
- navigationKeys,
51
- arrowLeftRightKeys,
52
- functionKeys,
53
- focusKeys
54
- );
55
- const isCharacterKey = (evt) => {
56
- if (specialKeys.has(evt.key)) {
57
- return false;
58
- }
59
- return evt.key.length === 1 && !evt.ctrlKey && !evt.metaKey && !evt.altKey;
60
- };
61
- const isNavigationKey = ({ key }) => {
62
- return navigationKeys.has(key);
63
- };
64
-
65
- exports.ArrowDown = ArrowDown;
66
- exports.ArrowLeft = ArrowLeft;
67
- exports.ArrowRight = ArrowRight;
68
- exports.ArrowUp = ArrowUp;
69
- exports.End = End;
70
- exports.Enter = Enter;
71
- exports.Escape = Escape;
72
- exports.Home = Home;
73
- exports.PageDown = PageDown;
74
- exports.PageUp = PageUp;
75
- exports.Space = Space;
76
- exports.isCharacterKey = isCharacterKey;
77
- exports.isNavigationKey = isNavigationKey;
78
- //# sourceMappingURL=keyUtils.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"keyUtils.js","sources":["../../../src/list/common-hooks/keyUtils.ts"],"sourcesContent":["import React from \"react\";\n\nfunction union<T>(set1: Set<T>, ...sets: Set<T>[]) {\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 ArrowRight = \"ArrowRight\";\nexport const Enter = \"Enter\";\nexport const Escape = \"Escape\";\nexport const Home = \"Home\";\nexport const End = \"End\";\nexport const PageUp = \"PageUp\";\nexport const PageDown = \"PageDown\";\nexport const Space = \" \";\n\nconst actionKeys = new Set([\"Enter\", \"Delete\", \" \"]);\nconst focusKeys = new Set([\"Tab\"]);\nconst arrowLeftRightKeys = new Set([\"ArrowRight\", \"ArrowLeft\"]);\nconst navigationKeys = new Set([\n Home,\n End,\n PageUp,\n PageDown,\n ArrowDown,\n ArrowUp,\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 navigationKeys,\n arrowLeftRightKeys,\n functionKeys,\n focusKeys\n);\nexport const isCharacterKey = (evt: React.KeyboardEvent): boolean => {\n if (specialKeys.has(evt.key)) {\n return false;\n }\n return evt.key.length === 1 && !evt.ctrlKey && !evt.metaKey && !evt.altKey;\n};\n\nexport const isNavigationKey = ({ key }: React.KeyboardEvent): boolean => {\n return navigationKeys.has(key);\n};\n"],"names":[],"mappings":";;AAEA,SAAS,KAAA,CAAS,SAAiB,IAAgB,EAAA;AACjD,EAAM,MAAA,MAAA,GAAS,IAAI,GAAA,CAAI,IAAI,CAAA;AAC3B,EAAA,KAAA,MAAW,OAAO,IAAM,EAAA;AACtB,IAAA,KAAA,MAAW,WAAW,GAAK,EAAA;AACzB,MAAA,MAAA,CAAO,IAAI,OAAO,CAAA;AAAA;AACpB;AAEF,EAAO,OAAA,MAAA;AACT;AAEO,MAAM,OAAU,GAAA;AAChB,MAAM,SAAY,GAAA;AAClB,MAAM,SAAY,GAAA;AAClB,MAAM,UAAa,GAAA;AACnB,MAAM,KAAQ,GAAA;AACd,MAAM,MAAS,GAAA;AACf,MAAM,IAAO,GAAA;AACb,MAAM,GAAM,GAAA;AACZ,MAAM,MAAS,GAAA;AACf,MAAM,QAAW,GAAA;AACjB,MAAM,KAAQ,GAAA;AAErB,MAAM,6BAAiB,IAAA,GAAA,CAAI,CAAC,OAAS,EAAA,QAAA,EAAU,GAAG,CAAC,CAAA;AACnD,MAAM,SAAY,mBAAA,IAAI,GAAI,CAAA,CAAC,KAAK,CAAC,CAAA;AACjC,MAAM,qCAAyB,IAAA,GAAA,CAAI,CAAC,YAAA,EAAc,WAAW,CAAC,CAAA;AAC9D,MAAM,cAAA,uBAAqB,GAAI,CAAA;AAAA,EAC7B,IAAA;AAAA,EACA,GAAA;AAAA,EACA,MAAA;AAAA,EACA,QAAA;AAAA,EACA,SAAA;AAAA,EACA;AACF,CAAC,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;AACF,CAAC,CAAA;AACD,MAAM,WAAc,GAAA,KAAA;AAAA,EAClB,UAAA;AAAA,EACA,cAAA;AAAA,EACA,kBAAA;AAAA,EACA,YAAA;AAAA,EACA;AACF,CAAA;AACa,MAAA,cAAA,GAAiB,CAAC,GAAsC,KAAA;AACnE,EAAA,IAAI,WAAY,CAAA,GAAA,CAAI,GAAI,CAAA,GAAG,CAAG,EAAA;AAC5B,IAAO,OAAA,KAAA;AAAA;AAET,EAAO,OAAA,GAAA,CAAI,GAAI,CAAA,MAAA,KAAW,CAAK,IAAA,CAAC,GAAI,CAAA,OAAA,IAAW,CAAC,GAAA,CAAI,OAAW,IAAA,CAAC,GAAI,CAAA,MAAA;AACtE;AAEO,MAAM,eAAkB,GAAA,CAAC,EAAE,GAAA,EAAwC,KAAA;AACxE,EAAO,OAAA,cAAA,CAAe,IAAI,GAAG,CAAA;AAC/B;;;;;;;;;;;;;;;;"}
@@ -1,25 +0,0 @@
1
- 'use strict';
2
-
3
- const listItemElement = (listEl, listItemIdx) => listEl.querySelector(`:scope > [data-idx="${listItemIdx}"]`);
4
- function listItemIndex(listItemEl) {
5
- if (listItemEl) {
6
- let idx = listItemEl.dataset.index;
7
- if (idx) {
8
- return parseInt(idx, 10);
9
- } else if (idx = listItemEl.ariaPosInSet) {
10
- return parseInt(idx, 10) - 1;
11
- }
12
- }
13
- return -1;
14
- }
15
- const listItemId = (el) => el?.id;
16
- const closestListItem = (el) => el.closest("[data-index],[aria-posinset]");
17
- const closestListItemId = (el) => listItemId(closestListItem(el));
18
- const closestListItemIndex = (el) => listItemIndex(closestListItem(el));
19
-
20
- exports.closestListItemId = closestListItemId;
21
- exports.closestListItemIndex = closestListItemIndex;
22
- exports.listItemElement = listItemElement;
23
- exports.listItemId = listItemId;
24
- exports.listItemIndex = listItemIndex;
25
- //# sourceMappingURL=list-dom-utils.js.map