@salt-ds/lab 1.0.0-alpha.90 → 1.0.0-alpha.92

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 (362) hide show
  1. package/CHANGELOG.md +54 -0
  2. package/css/salt-lab.css +169 -404
  3. package/dist-cjs/index.js +20 -16
  4. package/dist-cjs/index.js.map +1 -1
  5. package/dist-cjs/mega-menu/MegaMenu.js +82 -0
  6. package/dist-cjs/mega-menu/MegaMenu.js.map +1 -0
  7. package/dist-cjs/mega-menu/MegaMenuContent.css.js +6 -0
  8. package/dist-cjs/mega-menu/MegaMenuContent.css.js.map +1 -0
  9. package/dist-cjs/mega-menu/MegaMenuContent.js +33 -0
  10. package/dist-cjs/mega-menu/MegaMenuContent.js.map +1 -0
  11. package/dist-cjs/mega-menu/MegaMenuContext.js +11 -0
  12. package/dist-cjs/mega-menu/MegaMenuContext.js.map +1 -0
  13. package/dist-cjs/mega-menu/MegaMenuGroup.css.js +6 -0
  14. package/dist-cjs/mega-menu/MegaMenuGroup.css.js.map +1 -0
  15. package/dist-cjs/mega-menu/MegaMenuGroup.js +58 -0
  16. package/dist-cjs/mega-menu/MegaMenuGroup.js.map +1 -0
  17. package/dist-cjs/mega-menu/MegaMenuHeader.css.js +6 -0
  18. package/dist-cjs/mega-menu/MegaMenuHeader.css.js.map +1 -0
  19. package/dist-cjs/mega-menu/MegaMenuHeader.js +26 -0
  20. package/dist-cjs/mega-menu/MegaMenuHeader.js.map +1 -0
  21. package/dist-cjs/mega-menu/MegaMenuItem.css.js +6 -0
  22. package/dist-cjs/mega-menu/MegaMenuItem.css.js.map +1 -0
  23. package/dist-cjs/mega-menu/MegaMenuItem.js +52 -0
  24. package/dist-cjs/mega-menu/MegaMenuItem.js.map +1 -0
  25. package/dist-cjs/mega-menu/MegaMenuItemContent.css.js +6 -0
  26. package/dist-cjs/mega-menu/MegaMenuItemContent.css.js.map +1 -0
  27. package/dist-cjs/mega-menu/MegaMenuItemContent.js +23 -0
  28. package/dist-cjs/mega-menu/MegaMenuItemContent.js.map +1 -0
  29. package/dist-cjs/mega-menu/MegaMenuPanel.css.js +6 -0
  30. package/dist-cjs/mega-menu/MegaMenuPanel.css.js.map +1 -0
  31. package/dist-cjs/mega-menu/MegaMenuPanel.js +108 -0
  32. package/dist-cjs/mega-menu/MegaMenuPanel.js.map +1 -0
  33. package/dist-cjs/mega-menu/MegaMenuSection.css.js +6 -0
  34. package/dist-cjs/mega-menu/MegaMenuSection.css.js.map +1 -0
  35. package/dist-cjs/mega-menu/MegaMenuSection.js +25 -0
  36. package/dist-cjs/mega-menu/MegaMenuSection.js.map +1 -0
  37. package/dist-cjs/mega-menu/MegaMenuTrigger.js +92 -0
  38. package/dist-cjs/mega-menu/MegaMenuTrigger.js.map +1 -0
  39. package/dist-cjs/mega-menu/useMegaMenu.js +15 -0
  40. package/dist-cjs/mega-menu/useMegaMenu.js.map +1 -0
  41. package/dist-cjs/mega-menu/useMegaMenuKeyboard.js +209 -0
  42. package/dist-cjs/mega-menu/useMegaMenuKeyboard.js.map +1 -0
  43. package/dist-cjs/side-panel/SidePanel.css.js +1 -1
  44. package/dist-cjs/side-panel/SidePanel.js +107 -66
  45. package/dist-cjs/side-panel/SidePanel.js.map +1 -1
  46. package/dist-cjs/side-panel/SidePanelCloseButton.js +38 -0
  47. package/dist-cjs/side-panel/SidePanelCloseButton.js.map +1 -0
  48. package/dist-cjs/side-panel/SidePanelContent.css.js +1 -1
  49. package/dist-cjs/side-panel/SidePanelContent.js +3 -23
  50. package/dist-cjs/side-panel/SidePanelContent.js.map +1 -1
  51. package/dist-cjs/side-panel/SidePanelHeader.css.js +1 -1
  52. package/dist-cjs/side-panel/SidePanelHeader.js.map +1 -1
  53. package/dist-cjs/side-panel/SidePanelProvider.js +11 -4
  54. package/dist-cjs/side-panel/SidePanelProvider.js.map +1 -1
  55. package/dist-cjs/side-panel/SidePanelTitle.css.js +1 -1
  56. package/dist-cjs/side-panel/SidePanelTitle.js +1 -0
  57. package/dist-cjs/side-panel/SidePanelTitle.js.map +1 -1
  58. package/dist-cjs/side-panel/SidePanelTrigger.js +4 -4
  59. package/dist-cjs/side-panel/SidePanelTrigger.js.map +1 -1
  60. package/dist-cjs/side-panel/internal/SidePanelContext.js +2 -1
  61. package/dist-cjs/side-panel/internal/SidePanelContext.js.map +1 -1
  62. package/dist-cjs/side-panel/internal/useIsScrollable.js +50 -0
  63. package/dist-cjs/side-panel/internal/useIsScrollable.js.map +1 -0
  64. package/dist-cjs/side-panel/internal/useSidePanelTabOrder.js +214 -0
  65. package/dist-cjs/side-panel/internal/useSidePanelTabOrder.js.map +1 -0
  66. package/dist-cjs/side-panel/useSidePanel.js +9 -7
  67. package/dist-cjs/side-panel/useSidePanel.js.map +1 -1
  68. package/dist-cjs/tree/Tree.js +8 -5
  69. package/dist-cjs/tree/Tree.js.map +1 -1
  70. package/dist-cjs/tree/TreeContext.js.map +1 -1
  71. package/dist-cjs/tree/TreeNode.js +18 -14
  72. package/dist-cjs/tree/TreeNode.js.map +1 -1
  73. package/dist-cjs/tree/TreeNodeTrigger.js +4 -3
  74. package/dist-cjs/tree/TreeNodeTrigger.js.map +1 -1
  75. package/dist-cjs/tree/treeModel.js +61 -0
  76. package/dist-cjs/tree/treeModel.js.map +1 -0
  77. package/dist-cjs/tree/useTree.js +71 -65
  78. package/dist-cjs/tree/useTree.js.map +1 -1
  79. package/dist-es/index.js +10 -8
  80. package/dist-es/index.js.map +1 -1
  81. package/dist-es/mega-menu/MegaMenu.js +80 -0
  82. package/dist-es/mega-menu/MegaMenu.js.map +1 -0
  83. package/dist-es/mega-menu/MegaMenuContent.css.js +4 -0
  84. package/dist-es/mega-menu/MegaMenuContent.css.js.map +1 -0
  85. package/dist-es/mega-menu/MegaMenuContent.js +31 -0
  86. package/dist-es/mega-menu/MegaMenuContent.js.map +1 -0
  87. package/dist-es/mega-menu/MegaMenuContext.js +9 -0
  88. package/dist-es/mega-menu/MegaMenuContext.js.map +1 -0
  89. package/dist-es/mega-menu/MegaMenuGroup.css.js +4 -0
  90. package/dist-es/mega-menu/MegaMenuGroup.css.js.map +1 -0
  91. package/dist-es/mega-menu/MegaMenuGroup.js +56 -0
  92. package/dist-es/mega-menu/MegaMenuGroup.js.map +1 -0
  93. package/dist-es/mega-menu/MegaMenuHeader.css.js +4 -0
  94. package/dist-es/mega-menu/MegaMenuHeader.css.js.map +1 -0
  95. package/dist-es/mega-menu/MegaMenuHeader.js +24 -0
  96. package/dist-es/mega-menu/MegaMenuHeader.js.map +1 -0
  97. package/dist-es/mega-menu/MegaMenuItem.css.js +4 -0
  98. package/dist-es/mega-menu/MegaMenuItem.css.js.map +1 -0
  99. package/dist-es/mega-menu/MegaMenuItem.js +50 -0
  100. package/dist-es/mega-menu/MegaMenuItem.js.map +1 -0
  101. package/dist-es/mega-menu/MegaMenuItemContent.css.js +4 -0
  102. package/dist-es/mega-menu/MegaMenuItemContent.css.js.map +1 -0
  103. package/dist-es/mega-menu/MegaMenuItemContent.js +21 -0
  104. package/dist-es/mega-menu/MegaMenuItemContent.js.map +1 -0
  105. package/dist-es/mega-menu/MegaMenuPanel.css.js +4 -0
  106. package/dist-es/mega-menu/MegaMenuPanel.css.js.map +1 -0
  107. package/dist-es/mega-menu/MegaMenuPanel.js +106 -0
  108. package/dist-es/mega-menu/MegaMenuPanel.js.map +1 -0
  109. package/dist-es/mega-menu/MegaMenuSection.css.js +4 -0
  110. package/dist-es/mega-menu/MegaMenuSection.css.js.map +1 -0
  111. package/dist-es/mega-menu/MegaMenuSection.js +23 -0
  112. package/dist-es/mega-menu/MegaMenuSection.js.map +1 -0
  113. package/dist-es/mega-menu/MegaMenuTrigger.js +90 -0
  114. package/dist-es/mega-menu/MegaMenuTrigger.js.map +1 -0
  115. package/dist-es/mega-menu/useMegaMenu.js +13 -0
  116. package/dist-es/mega-menu/useMegaMenu.js.map +1 -0
  117. package/dist-es/mega-menu/useMegaMenuKeyboard.js +205 -0
  118. package/dist-es/mega-menu/useMegaMenuKeyboard.js.map +1 -0
  119. package/dist-es/side-panel/SidePanel.css.js +1 -1
  120. package/dist-es/side-panel/SidePanel.js +110 -69
  121. package/dist-es/side-panel/SidePanel.js.map +1 -1
  122. package/dist-es/side-panel/SidePanelCloseButton.js +36 -0
  123. package/dist-es/side-panel/SidePanelCloseButton.js.map +1 -0
  124. package/dist-es/side-panel/SidePanelContent.css.js +1 -1
  125. package/dist-es/side-panel/SidePanelContent.js +4 -24
  126. package/dist-es/side-panel/SidePanelContent.js.map +1 -1
  127. package/dist-es/side-panel/SidePanelHeader.css.js +1 -1
  128. package/dist-es/side-panel/SidePanelHeader.js.map +1 -1
  129. package/dist-es/side-panel/SidePanelProvider.js +12 -5
  130. package/dist-es/side-panel/SidePanelProvider.js.map +1 -1
  131. package/dist-es/side-panel/SidePanelTitle.css.js +1 -1
  132. package/dist-es/side-panel/SidePanelTitle.js +1 -0
  133. package/dist-es/side-panel/SidePanelTitle.js.map +1 -1
  134. package/dist-es/side-panel/SidePanelTrigger.js +5 -5
  135. package/dist-es/side-panel/SidePanelTrigger.js.map +1 -1
  136. package/dist-es/side-panel/internal/SidePanelContext.js +2 -1
  137. package/dist-es/side-panel/internal/SidePanelContext.js.map +1 -1
  138. package/dist-es/side-panel/internal/useIsScrollable.js +48 -0
  139. package/dist-es/side-panel/internal/useIsScrollable.js.map +1 -0
  140. package/dist-es/side-panel/internal/useSidePanelTabOrder.js +212 -0
  141. package/dist-es/side-panel/internal/useSidePanelTabOrder.js.map +1 -0
  142. package/dist-es/side-panel/useSidePanel.js +9 -7
  143. package/dist-es/side-panel/useSidePanel.js.map +1 -1
  144. package/dist-es/tree/Tree.js +8 -5
  145. package/dist-es/tree/Tree.js.map +1 -1
  146. package/dist-es/tree/TreeContext.js.map +1 -1
  147. package/dist-es/tree/TreeNode.js +20 -16
  148. package/dist-es/tree/TreeNode.js.map +1 -1
  149. package/dist-es/tree/TreeNodeTrigger.js +4 -3
  150. package/dist-es/tree/TreeNodeTrigger.js.map +1 -1
  151. package/dist-es/tree/treeModel.js +57 -0
  152. package/dist-es/tree/treeModel.js.map +1 -0
  153. package/dist-es/tree/useTree.js +49 -43
  154. package/dist-es/tree/useTree.js.map +1 -1
  155. package/dist-types/index.d.ts +1 -2
  156. package/dist-types/mega-menu/MegaMenu.d.ts +27 -0
  157. package/dist-types/mega-menu/MegaMenuContent.d.ts +8 -0
  158. package/dist-types/mega-menu/MegaMenuContext.d.ts +29 -0
  159. package/dist-types/mega-menu/MegaMenuGroup.d.ts +8 -0
  160. package/dist-types/mega-menu/MegaMenuHeader.d.ts +8 -0
  161. package/dist-types/mega-menu/MegaMenuItem.d.ts +12 -0
  162. package/dist-types/mega-menu/MegaMenuItemContent.d.ts +8 -0
  163. package/dist-types/mega-menu/MegaMenuPanel.d.ts +8 -0
  164. package/dist-types/mega-menu/MegaMenuSection.d.ts +8 -0
  165. package/dist-types/mega-menu/MegaMenuTrigger.d.ts +8 -0
  166. package/dist-types/mega-menu/index.d.ts +9 -0
  167. package/dist-types/mega-menu/useMegaMenu.d.ts +6 -0
  168. package/dist-types/mega-menu/useMegaMenuKeyboard.d.ts +30 -0
  169. package/dist-types/side-panel/SidePanel.d.ts +3 -4
  170. package/dist-types/side-panel/SidePanelCloseButton.d.ts +2 -0
  171. package/dist-types/side-panel/SidePanelContent.d.ts +4 -3
  172. package/dist-types/side-panel/SidePanelHeader.d.ts +4 -3
  173. package/dist-types/side-panel/SidePanelTitle.d.ts +1 -2
  174. package/dist-types/side-panel/SidePanelTrigger.d.ts +3 -5
  175. package/dist-types/side-panel/index.d.ts +1 -0
  176. package/dist-types/side-panel/internal/SidePanelContext.d.ts +4 -0
  177. package/dist-types/side-panel/internal/index.d.ts +2 -0
  178. package/dist-types/side-panel/internal/useIsScrollable.d.ts +2 -0
  179. package/dist-types/side-panel/internal/useSidePanelTabOrder.d.ts +7 -0
  180. package/dist-types/side-panel/useSidePanel.d.ts +32 -6
  181. package/dist-types/tree/TreeContext.d.ts +7 -1
  182. package/dist-types/tree/treeModel.d.ts +24 -0
  183. package/dist-types/tree/useTree.d.ts +3 -14
  184. package/package.json +2 -4
  185. package/dist-cjs/rating/Rating.css.js +0 -6
  186. package/dist-cjs/rating/Rating.css.js.map +0 -1
  187. package/dist-cjs/rating/Rating.js +0 -132
  188. package/dist-cjs/rating/Rating.js.map +0 -1
  189. package/dist-cjs/rating/RatingItem.css.js +0 -6
  190. package/dist-cjs/rating/RatingItem.css.js.map +0 -1
  191. package/dist-cjs/rating/RatingItem.js +0 -70
  192. package/dist-cjs/rating/RatingItem.js.map +0 -1
  193. package/dist-cjs/tabs-next/TabBar.css.js +0 -6
  194. package/dist-cjs/tabs-next/TabBar.css.js.map +0 -1
  195. package/dist-cjs/tabs-next/TabBar.js +0 -41
  196. package/dist-cjs/tabs-next/TabBar.js.map +0 -1
  197. package/dist-cjs/tabs-next/TabListLayoutContext.js +0 -13
  198. package/dist-cjs/tabs-next/TabListLayoutContext.js.map +0 -1
  199. package/dist-cjs/tabs-next/TabListNext.css.js +0 -6
  200. package/dist-cjs/tabs-next/TabListNext.css.js.map +0 -1
  201. package/dist-cjs/tabs-next/TabListNext.js +0 -271
  202. package/dist-cjs/tabs-next/TabListNext.js.map +0 -1
  203. package/dist-cjs/tabs-next/TabNext.css.js +0 -6
  204. package/dist-cjs/tabs-next/TabNext.css.js.map +0 -1
  205. package/dist-cjs/tabs-next/TabNext.js +0 -213
  206. package/dist-cjs/tabs-next/TabNext.js.map +0 -1
  207. package/dist-cjs/tabs-next/TabNextAction.js +0 -58
  208. package/dist-cjs/tabs-next/TabNextAction.js.map +0 -1
  209. package/dist-cjs/tabs-next/TabNextContext.js +0 -23
  210. package/dist-cjs/tabs-next/TabNextContext.js.map +0 -1
  211. package/dist-cjs/tabs-next/TabNextPanel.css.js +0 -6
  212. package/dist-cjs/tabs-next/TabNextPanel.css.js.map +0 -1
  213. package/dist-cjs/tabs-next/TabNextPanel.js +0 -92
  214. package/dist-cjs/tabs-next/TabNextPanel.js.map +0 -1
  215. package/dist-cjs/tabs-next/TabNextTrigger.css.js +0 -6
  216. package/dist-cjs/tabs-next/TabNextTrigger.css.js.map +0 -1
  217. package/dist-cjs/tabs-next/TabNextTrigger.js +0 -180
  218. package/dist-cjs/tabs-next/TabNextTrigger.js.map +0 -1
  219. package/dist-cjs/tabs-next/TabOverflowList.css.js +0 -6
  220. package/dist-cjs/tabs-next/TabOverflowList.css.js.map +0 -1
  221. package/dist-cjs/tabs-next/TabOverflowList.js +0 -237
  222. package/dist-cjs/tabs-next/TabOverflowList.js.map +0 -1
  223. package/dist-cjs/tabs-next/TabSlot.js +0 -30
  224. package/dist-cjs/tabs-next/TabSlot.js.map +0 -1
  225. package/dist-cjs/tabs-next/TabSlotRegistryContext.js +0 -16
  226. package/dist-cjs/tabs-next/TabSlotRegistryContext.js.map +0 -1
  227. package/dist-cjs/tabs-next/TabsNext.css.js +0 -6
  228. package/dist-cjs/tabs-next/TabsNext.css.js.map +0 -1
  229. package/dist-cjs/tabs-next/TabsNext.js +0 -195
  230. package/dist-cjs/tabs-next/TabsNext.js.map +0 -1
  231. package/dist-cjs/tabs-next/TabsNextContext.js +0 -47
  232. package/dist-cjs/tabs-next/TabsNextContext.js.map +0 -1
  233. package/dist-cjs/tabs-next/domUtils.js +0 -13
  234. package/dist-cjs/tabs-next/domUtils.js.map +0 -1
  235. package/dist-cjs/tabs-next/hooks/overflowMath.js +0 -86
  236. package/dist-cjs/tabs-next/hooks/overflowMath.js.map +0 -1
  237. package/dist-cjs/tabs-next/hooks/useCollection.js +0 -197
  238. package/dist-cjs/tabs-next/hooks/useCollection.js.map +0 -1
  239. package/dist-cjs/tabs-next/hooks/useFocusWithRetry.js +0 -64
  240. package/dist-cjs/tabs-next/hooks/useFocusWithRetry.js.map +0 -1
  241. package/dist-cjs/tabs-next/hooks/useOverflow.js +0 -266
  242. package/dist-cjs/tabs-next/hooks/useOverflow.js.map +0 -1
  243. package/dist-cjs/tabs-next/hooks/useOverflowLayoutState.js +0 -99
  244. package/dist-cjs/tabs-next/hooks/useOverflowLayoutState.js.map +0 -1
  245. package/dist-cjs/tabs-next/hooks/useOverflowSelectionState.js +0 -60
  246. package/dist-cjs/tabs-next/hooks/useOverflowSelectionState.js.map +0 -1
  247. package/dist-cjs/tabs-next/hooks/useRenderedTabWidth.js +0 -92
  248. package/dist-cjs/tabs-next/hooks/useRenderedTabWidth.js.map +0 -1
  249. package/dist-cjs/tabs-next/hooks/useRenderedTabsRegistry.js +0 -200
  250. package/dist-cjs/tabs-next/hooks/useRenderedTabsRegistry.js.map +0 -1
  251. package/dist-cjs/tabs-next/hooks/useTabListRecovery.js +0 -76
  252. package/dist-cjs/tabs-next/hooks/useTabListRecovery.js.map +0 -1
  253. package/dist-cjs/tabs-next/hooks/useTabRemovalHandler.js +0 -165
  254. package/dist-cjs/tabs-next/hooks/useTabRemovalHandler.js.map +0 -1
  255. package/dist-cjs/tabs-next/hooks/useTabSelectionFocus.js +0 -80
  256. package/dist-cjs/tabs-next/hooks/useTabSelectionFocus.js.map +0 -1
  257. package/dist-cjs/tabs-next/widthMeasurement.js +0 -42
  258. package/dist-cjs/tabs-next/widthMeasurement.js.map +0 -1
  259. package/dist-es/rating/Rating.css.js +0 -4
  260. package/dist-es/rating/Rating.css.js.map +0 -1
  261. package/dist-es/rating/Rating.js +0 -130
  262. package/dist-es/rating/Rating.js.map +0 -1
  263. package/dist-es/rating/RatingItem.css.js +0 -4
  264. package/dist-es/rating/RatingItem.css.js.map +0 -1
  265. package/dist-es/rating/RatingItem.js +0 -68
  266. package/dist-es/rating/RatingItem.js.map +0 -1
  267. package/dist-es/tabs-next/TabBar.css.js +0 -4
  268. package/dist-es/tabs-next/TabBar.css.js.map +0 -1
  269. package/dist-es/tabs-next/TabBar.js +0 -39
  270. package/dist-es/tabs-next/TabBar.js.map +0 -1
  271. package/dist-es/tabs-next/TabListLayoutContext.js +0 -10
  272. package/dist-es/tabs-next/TabListLayoutContext.js.map +0 -1
  273. package/dist-es/tabs-next/TabListNext.css.js +0 -4
  274. package/dist-es/tabs-next/TabListNext.css.js.map +0 -1
  275. package/dist-es/tabs-next/TabListNext.js +0 -269
  276. package/dist-es/tabs-next/TabListNext.js.map +0 -1
  277. package/dist-es/tabs-next/TabNext.css.js +0 -4
  278. package/dist-es/tabs-next/TabNext.css.js.map +0 -1
  279. package/dist-es/tabs-next/TabNext.js +0 -211
  280. package/dist-es/tabs-next/TabNext.js.map +0 -1
  281. package/dist-es/tabs-next/TabNextAction.js +0 -56
  282. package/dist-es/tabs-next/TabNextAction.js.map +0 -1
  283. package/dist-es/tabs-next/TabNextContext.js +0 -20
  284. package/dist-es/tabs-next/TabNextContext.js.map +0 -1
  285. package/dist-es/tabs-next/TabNextPanel.css.js +0 -4
  286. package/dist-es/tabs-next/TabNextPanel.css.js.map +0 -1
  287. package/dist-es/tabs-next/TabNextPanel.js +0 -90
  288. package/dist-es/tabs-next/TabNextPanel.js.map +0 -1
  289. package/dist-es/tabs-next/TabNextTrigger.css.js +0 -4
  290. package/dist-es/tabs-next/TabNextTrigger.css.js.map +0 -1
  291. package/dist-es/tabs-next/TabNextTrigger.js +0 -178
  292. package/dist-es/tabs-next/TabNextTrigger.js.map +0 -1
  293. package/dist-es/tabs-next/TabOverflowList.css.js +0 -4
  294. package/dist-es/tabs-next/TabOverflowList.css.js.map +0 -1
  295. package/dist-es/tabs-next/TabOverflowList.js +0 -235
  296. package/dist-es/tabs-next/TabOverflowList.js.map +0 -1
  297. package/dist-es/tabs-next/TabSlot.js +0 -28
  298. package/dist-es/tabs-next/TabSlot.js.map +0 -1
  299. package/dist-es/tabs-next/TabSlotRegistryContext.js +0 -13
  300. package/dist-es/tabs-next/TabSlotRegistryContext.js.map +0 -1
  301. package/dist-es/tabs-next/TabsNext.css.js +0 -4
  302. package/dist-es/tabs-next/TabsNext.css.js.map +0 -1
  303. package/dist-es/tabs-next/TabsNext.js +0 -193
  304. package/dist-es/tabs-next/TabsNext.js.map +0 -1
  305. package/dist-es/tabs-next/TabsNextContext.js +0 -44
  306. package/dist-es/tabs-next/TabsNextContext.js.map +0 -1
  307. package/dist-es/tabs-next/domUtils.js +0 -11
  308. package/dist-es/tabs-next/domUtils.js.map +0 -1
  309. package/dist-es/tabs-next/hooks/overflowMath.js +0 -82
  310. package/dist-es/tabs-next/hooks/overflowMath.js.map +0 -1
  311. package/dist-es/tabs-next/hooks/useCollection.js +0 -195
  312. package/dist-es/tabs-next/hooks/useCollection.js.map +0 -1
  313. package/dist-es/tabs-next/hooks/useFocusWithRetry.js +0 -62
  314. package/dist-es/tabs-next/hooks/useFocusWithRetry.js.map +0 -1
  315. package/dist-es/tabs-next/hooks/useOverflow.js +0 -264
  316. package/dist-es/tabs-next/hooks/useOverflow.js.map +0 -1
  317. package/dist-es/tabs-next/hooks/useOverflowLayoutState.js +0 -97
  318. package/dist-es/tabs-next/hooks/useOverflowLayoutState.js.map +0 -1
  319. package/dist-es/tabs-next/hooks/useOverflowSelectionState.js +0 -58
  320. package/dist-es/tabs-next/hooks/useOverflowSelectionState.js.map +0 -1
  321. package/dist-es/tabs-next/hooks/useRenderedTabWidth.js +0 -90
  322. package/dist-es/tabs-next/hooks/useRenderedTabWidth.js.map +0 -1
  323. package/dist-es/tabs-next/hooks/useRenderedTabsRegistry.js +0 -198
  324. package/dist-es/tabs-next/hooks/useRenderedTabsRegistry.js.map +0 -1
  325. package/dist-es/tabs-next/hooks/useTabListRecovery.js +0 -74
  326. package/dist-es/tabs-next/hooks/useTabListRecovery.js.map +0 -1
  327. package/dist-es/tabs-next/hooks/useTabRemovalHandler.js +0 -163
  328. package/dist-es/tabs-next/hooks/useTabRemovalHandler.js.map +0 -1
  329. package/dist-es/tabs-next/hooks/useTabSelectionFocus.js +0 -78
  330. package/dist-es/tabs-next/hooks/useTabSelectionFocus.js.map +0 -1
  331. package/dist-es/tabs-next/widthMeasurement.js +0 -36
  332. package/dist-es/tabs-next/widthMeasurement.js.map +0 -1
  333. package/dist-types/rating/Rating.d.ts +0 -48
  334. package/dist-types/rating/RatingItem.d.ts +0 -47
  335. package/dist-types/rating/index.d.ts +0 -1
  336. package/dist-types/tabs-next/TabBar.d.ts +0 -12
  337. package/dist-types/tabs-next/TabListLayoutContext.d.ts +0 -9
  338. package/dist-types/tabs-next/TabListNext.d.ts +0 -12
  339. package/dist-types/tabs-next/TabNext.d.ts +0 -12
  340. package/dist-types/tabs-next/TabNextAction.d.ts +0 -4
  341. package/dist-types/tabs-next/TabNextContext.d.ts +0 -12
  342. package/dist-types/tabs-next/TabNextPanel.d.ts +0 -9
  343. package/dist-types/tabs-next/TabNextTrigger.d.ts +0 -4
  344. package/dist-types/tabs-next/TabOverflowList.d.ts +0 -10
  345. package/dist-types/tabs-next/TabSlot.d.ts +0 -6
  346. package/dist-types/tabs-next/TabSlotRegistryContext.d.ts +0 -5
  347. package/dist-types/tabs-next/TabsNext.d.ts +0 -18
  348. package/dist-types/tabs-next/TabsNextContext.d.ts +0 -43
  349. package/dist-types/tabs-next/domUtils.d.ts +0 -1
  350. package/dist-types/tabs-next/hooks/overflowMath.d.ts +0 -18
  351. package/dist-types/tabs-next/hooks/useCollection.d.ts +0 -30
  352. package/dist-types/tabs-next/hooks/useFocusWithRetry.d.ts +0 -9
  353. package/dist-types/tabs-next/hooks/useOverflow.d.ts +0 -11
  354. package/dist-types/tabs-next/hooks/useOverflowLayoutState.d.ts +0 -13
  355. package/dist-types/tabs-next/hooks/useOverflowSelectionState.d.ts +0 -13
  356. package/dist-types/tabs-next/hooks/useRenderedTabWidth.d.ts +0 -12
  357. package/dist-types/tabs-next/hooks/useRenderedTabsRegistry.d.ts +0 -12
  358. package/dist-types/tabs-next/hooks/useTabListRecovery.d.ts +0 -12
  359. package/dist-types/tabs-next/hooks/useTabRemovalHandler.d.ts +0 -32
  360. package/dist-types/tabs-next/hooks/useTabSelectionFocus.d.ts +0 -15
  361. package/dist-types/tabs-next/index.d.ts +0 -7
  362. package/dist-types/tabs-next/widthMeasurement.d.ts +0 -5
@@ -1,271 +0,0 @@
1
- 'use strict';
2
-
3
- var jsxRuntime = require('react/jsx-runtime');
4
- var core = require('@salt-ds/core');
5
- var styles = require('@salt-ds/styles');
6
- var window = require('@salt-ds/window');
7
- var clsx = require('clsx');
8
- var react = require('react');
9
- var useFocusWithRetry = require('./hooks/useFocusWithRetry.js');
10
- var useOverflow = require('./hooks/useOverflow.js');
11
- var useOverflowLayoutState = require('./hooks/useOverflowLayoutState.js');
12
- var useTabListRecovery = require('./hooks/useTabListRecovery.js');
13
- var useTabRemovalHandler = require('./hooks/useTabRemovalHandler.js');
14
- var useTabSelectionFocus = require('./hooks/useTabSelectionFocus.js');
15
- var TabListLayoutContext = require('./TabListLayoutContext.js');
16
- var TabListNext$1 = require('./TabListNext.css.js');
17
- var TabOverflowList = require('./TabOverflowList.js');
18
- var TabSlot = require('./TabSlot.js');
19
- var TabSlotRegistryContext = require('./TabSlotRegistryContext.js');
20
- var TabsNextContext = require('./TabsNextContext.js');
21
-
22
- const withBaseName = core.makePrefixer("saltTabListNext");
23
- const MAX_FOCUS_RETRY_ATTEMPTS = 120;
24
- const TabListNext = react.forwardRef(
25
- function TabListNext2(props, ref) {
26
- const {
27
- appearance = "bordered",
28
- activeColor = "primary",
29
- children,
30
- className,
31
- onKeyDown,
32
- ...rest
33
- } = props;
34
- const targetWindow = window.useWindow();
35
- styles.useComponentCssInjection({
36
- testId: "salt-tablist-next",
37
- css: TabListNext$1,
38
- window: targetWindow
39
- });
40
- const {
41
- renderMode,
42
- selected,
43
- setSelected,
44
- setBootstrapOverflowReady,
45
- getNext,
46
- getPrevious,
47
- getFirst,
48
- getLast,
49
- getIndex,
50
- item,
51
- itemAt,
52
- activeTab,
53
- selectionFromOverflowValueRef,
54
- menuOpen,
55
- setMenuOpen,
56
- sortItems,
57
- getRemovedItems,
58
- getRenderedTab,
59
- renderedTabs,
60
- removalVersion
61
- } = TabsNextContext.useTabsNext();
62
- const tabstripRef = react.useRef(null);
63
- const overflowListRef = react.useRef(null);
64
- const slotMapRef = react.useRef(/* @__PURE__ */ new Map());
65
- const removalRecoveryRafRef = react.useRef(null);
66
- const pendingRemovalRecoveryRef = react.useRef(false);
67
- const pendingRemovalRecoveryRetriesRef = react.useRef(0);
68
- const [slotVersion, setSlotVersion] = react.useState(0);
69
- const handleRef = core.useForkRef(tabstripRef, ref);
70
- const overflowButtonRef = react.useRef(null);
71
- const { announce } = core.useAriaAnnouncer();
72
- const overflowMenuOpen = renderMode === "portal" ? menuOpen : false;
73
- const [visibleValues, hiddenValues, isMeasuring] = useOverflow.useOverflow({
74
- container: tabstripRef,
75
- menuOpen: overflowMenuOpen,
76
- selected,
77
- tabs: renderedTabs,
78
- overflowButton: overflowButtonRef
79
- });
80
- react.useEffect(() => {
81
- setBootstrapOverflowReady(
82
- renderMode === "inline" && renderedTabs.length > 0 && !isMeasuring
83
- );
84
- }, [
85
- isMeasuring,
86
- renderMode,
87
- renderedTabs.length,
88
- setBootstrapOverflowReady
89
- ]);
90
- const { resolvedOverflowActiveValue, tabListLayoutContext } = useOverflowLayoutState.useOverflowLayoutState({
91
- hiddenValues,
92
- menuOpen,
93
- overflowMenuOpen,
94
- visibleValues
95
- });
96
- const registerSlot = react.useCallback(
97
- (slotId, element) => {
98
- const currentElement = slotMapRef.current.get(slotId) ?? null;
99
- if (currentElement === element) {
100
- return;
101
- }
102
- if (element) {
103
- slotMapRef.current.set(slotId, element);
104
- } else {
105
- slotMapRef.current.delete(slotId);
106
- }
107
- setSlotVersion((currentVersion) => currentVersion + 1);
108
- },
109
- []
110
- );
111
- const slotRegistryContext = react.useMemo(
112
- () => ({ registerSlot }),
113
- [registerSlot]
114
- );
115
- const slotAssignments = react.useMemo(() => {
116
- const nextAssignments = /* @__PURE__ */ new Map();
117
- for (const value of visibleValues) {
118
- nextAssignments.set(value, `main:${value}`);
119
- }
120
- for (const value of hiddenValues) {
121
- nextAssignments.set(
122
- value,
123
- menuOpen ? `overflow:${value}` : `measure:${value}`
124
- );
125
- }
126
- return {
127
- map: nextAssignments,
128
- version: slotVersion
129
- };
130
- }, [hiddenValues, menuOpen, slotVersion, visibleValues]);
131
- core.useIsomorphicLayoutEffect(() => {
132
- var _a;
133
- if (renderMode !== "portal") {
134
- return;
135
- }
136
- for (const [value, slotId] of slotAssignments.map) {
137
- const host = (_a = getRenderedTab(value)) == null ? void 0 : _a.host;
138
- const slot = slotMapRef.current.get(slotId);
139
- if (host && slot && host.parentElement !== slot) {
140
- slot.appendChild(host);
141
- }
142
- }
143
- }, [getRenderedTab, renderMode, slotAssignments]);
144
- const handleKeyDown = (event) => {
145
- var _a, _b;
146
- onKeyDown == null ? void 0 : onKeyDown(event);
147
- if (menuOpen) return;
148
- const actionMap = {
149
- ArrowRight: getNext,
150
- ArrowLeft: getPrevious,
151
- Home: getFirst,
152
- End: getLast
153
- };
154
- const action = actionMap[event.key];
155
- if (action) {
156
- event.preventDefault();
157
- sortItems();
158
- const activeTabId = (_a = activeTab.current) == null ? void 0 : _a.id;
159
- if (!activeTabId) return;
160
- const nextItem = action(activeTabId);
161
- if (nextItem) {
162
- (_b = nextItem.element) == null ? void 0 : _b.focus({ preventScroll: true });
163
- }
164
- }
165
- };
166
- const getSelectedTabElement = react.useCallback(() => {
167
- var _a, _b, _c;
168
- return ((_a = tabstripRef.current) == null ? void 0 : _a.querySelector(
169
- '[role="tab"][aria-selected="true"]'
170
- )) ?? ((_c = item((_b = activeTab.current) == null ? void 0 : _b.id)) == null ? void 0 : _c.element);
171
- }, [item, activeTab]);
172
- const { focusElementWithRetry } = useFocusWithRetry.useFocusWithRetry({
173
- maxAttempts: MAX_FOCUS_RETRY_ATTEMPTS,
174
- targetWindow
175
- });
176
- useTabSelectionFocus.useTabSelectionFocus({
177
- announce,
178
- focusElementWithRetry,
179
- getRenderedTab,
180
- getSelectedTabElement,
181
- menuOpen,
182
- resolvedOverflowActiveValue,
183
- selected,
184
- selectionFromOverflowValueRef,
185
- targetWindow
186
- });
187
- const handleTabRemoval = useTabRemovalHandler.useTabRemovalHandler({
188
- activeTab,
189
- focusElementWithRetry,
190
- getFirst,
191
- getIndex,
192
- getLast,
193
- getRemovedItems,
194
- getRenderedTab,
195
- getSelectedTabElement,
196
- item,
197
- itemAt,
198
- maxRetryAttempts: MAX_FOCUS_RETRY_ATTEMPTS,
199
- menuOpen,
200
- overflowButtonRef,
201
- overflowListRef,
202
- pendingRemovalRecoveryRef,
203
- pendingRemovalRecoveryRetriesRef,
204
- removalRecoveryRafRef,
205
- selected,
206
- setSelected,
207
- tabstripRef,
208
- targetWindow
209
- });
210
- useTabListRecovery.useTabListRecovery({
211
- removalVersion,
212
- targetWindow,
213
- tabstripRef,
214
- overflowListRef,
215
- handleTabRemoval,
216
- pendingRemovalRecoveryRef,
217
- pendingRemovalRecoveryRetriesRef
218
- });
219
- return /* @__PURE__ */ jsxRuntime.jsx(
220
- "div",
221
- {
222
- role: "tablist",
223
- className: clsx.clsx(
224
- withBaseName(),
225
- withBaseName(appearance),
226
- withBaseName("horizontal"),
227
- withBaseName(`activeColor${core.capitalize(activeColor)}`),
228
- className
229
- ),
230
- "data-ismeasuring": renderMode === "portal" && isMeasuring ? true : void 0,
231
- ref: handleRef,
232
- onKeyDown: handleKeyDown,
233
- ...rest,
234
- children: renderMode === "inline" ? children : /* @__PURE__ */ jsxRuntime.jsx(TabSlotRegistryContext.TabSlotRegistryContext.Provider, { value: slotRegistryContext, children: /* @__PURE__ */ jsxRuntime.jsxs(TabListLayoutContext.TabListLayoutContext.Provider, { value: tabListLayoutContext, children: [
235
- children,
236
- visibleValues.map((value) => /* @__PURE__ */ jsxRuntime.jsx(TabSlot.TabSlot, { slotId: `main:${value}`, value }, value)),
237
- !menuOpen && hiddenValues.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(
238
- "div",
239
- {
240
- "aria-hidden": "true",
241
- role: "presentation",
242
- className: withBaseName("measureContainer"),
243
- children: hiddenValues.map((value) => /* @__PURE__ */ jsxRuntime.jsx(
244
- TabSlot.TabSlot,
245
- {
246
- slotId: `measure:${value}`,
247
- value
248
- },
249
- `measure-${value}`
250
- ))
251
- }
252
- ) : null,
253
- /* @__PURE__ */ jsxRuntime.jsx(
254
- TabOverflowList.TabOverflowList,
255
- {
256
- buttonRef: overflowButtonRef,
257
- hiddenValues,
258
- open: menuOpen,
259
- order: renderedTabs.length,
260
- setOpen: setMenuOpen,
261
- ref: overflowListRef
262
- }
263
- )
264
- ] }) })
265
- }
266
- );
267
- }
268
- );
269
-
270
- exports.TabListNext = TabListNext;
271
- //# sourceMappingURL=TabListNext.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"TabListNext.js","sources":["../src/tabs-next/TabListNext.tsx"],"sourcesContent":["import {\n capitalize,\n makePrefixer,\n useAriaAnnouncer,\n useForkRef,\n useIsomorphicLayoutEffect,\n} from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type ComponentPropsWithoutRef,\n forwardRef,\n type KeyboardEvent,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\";\nimport { useFocusWithRetry } from \"./hooks/useFocusWithRetry\";\nimport { useOverflow } from \"./hooks/useOverflow\";\nimport { useOverflowLayoutState } from \"./hooks/useOverflowLayoutState\";\nimport { useTabListRecovery } from \"./hooks/useTabListRecovery\";\nimport { useTabRemovalHandler } from \"./hooks/useTabRemovalHandler\";\nimport { useTabSelectionFocus } from \"./hooks/useTabSelectionFocus\";\nimport { TabListLayoutContext } from \"./TabListLayoutContext\";\nimport tablistNextCss from \"./TabListNext.css\";\nimport { TabOverflowList } from \"./TabOverflowList\";\nimport { TabSlot } from \"./TabSlot\";\nimport { TabSlotRegistryContext } from \"./TabSlotRegistryContext\";\nimport { useTabsNext } from \"./TabsNextContext\";\n\nconst withBaseName = makePrefixer(\"saltTabListNext\");\nconst MAX_FOCUS_RETRY_ATTEMPTS = 120;\n\nexport interface TabListNextProps\n extends Omit<ComponentPropsWithoutRef<\"div\">, \"onChange\"> {\n /**\n * Styling active color variant. Defaults to \"primary\".\n */\n activeColor?: \"primary\" | \"secondary\" | \"tertiary\";\n /**\n * The appearance of the tabs. Defaults to \"bordered\".\n */\n appearance?: \"bordered\" | \"transparent\";\n}\n\nexport const TabListNext = forwardRef<HTMLDivElement, TabListNextProps>(\n function TabListNext(props, ref) {\n const {\n appearance = \"bordered\",\n activeColor = \"primary\",\n children,\n className,\n onKeyDown,\n ...rest\n } = props;\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-tablist-next\",\n css: tablistNextCss,\n window: targetWindow,\n });\n\n const {\n renderMode,\n selected,\n setSelected,\n setBootstrapOverflowReady,\n getNext,\n getPrevious,\n getFirst,\n getLast,\n getIndex,\n item,\n itemAt,\n activeTab,\n selectionFromOverflowValueRef,\n menuOpen,\n setMenuOpen,\n sortItems,\n getRemovedItems,\n getRenderedTab,\n renderedTabs,\n removalVersion,\n } = useTabsNext();\n\n const tabstripRef = useRef<HTMLDivElement>(null);\n const overflowListRef = useRef<HTMLDivElement>(null);\n const slotMapRef = useRef<Map<string, HTMLDivElement>>(new Map());\n const removalRecoveryRafRef = useRef<number | null>(null);\n const pendingRemovalRecoveryRef = useRef(false);\n const pendingRemovalRecoveryRetriesRef = useRef(0);\n const [slotVersion, setSlotVersion] = useState(0);\n\n const handleRef = useForkRef(tabstripRef, ref);\n const overflowButtonRef = useRef<HTMLButtonElement>(null);\n\n const { announce } = useAriaAnnouncer();\n const overflowMenuOpen = renderMode === \"portal\" ? menuOpen : false;\n\n const [visibleValues, hiddenValues, isMeasuring] = useOverflow({\n container: tabstripRef,\n menuOpen: overflowMenuOpen,\n selected,\n tabs: renderedTabs,\n overflowButton: overflowButtonRef,\n });\n\n useEffect(() => {\n setBootstrapOverflowReady(\n renderMode === \"inline\" && renderedTabs.length > 0 && !isMeasuring,\n );\n }, [\n isMeasuring,\n renderMode,\n renderedTabs.length,\n setBootstrapOverflowReady,\n ]);\n\n const { resolvedOverflowActiveValue, tabListLayoutContext } =\n useOverflowLayoutState({\n hiddenValues,\n menuOpen,\n overflowMenuOpen,\n visibleValues,\n });\n const registerSlot = useCallback(\n (slotId: string, element: HTMLDivElement | null) => {\n const currentElement = slotMapRef.current.get(slotId) ?? null;\n if (currentElement === element) {\n return;\n }\n\n if (element) {\n slotMapRef.current.set(slotId, element);\n } else {\n slotMapRef.current.delete(slotId);\n }\n\n setSlotVersion((currentVersion) => currentVersion + 1);\n },\n [],\n );\n const slotRegistryContext = useMemo(\n () => ({ registerSlot }),\n [registerSlot],\n );\n const slotAssignments = useMemo(() => {\n const nextAssignments = new Map<string, string>();\n\n for (const value of visibleValues) {\n nextAssignments.set(value, `main:${value}`);\n }\n\n for (const value of hiddenValues) {\n nextAssignments.set(\n value,\n menuOpen ? `overflow:${value}` : `measure:${value}`,\n );\n }\n\n return {\n map: nextAssignments,\n version: slotVersion,\n };\n }, [hiddenValues, menuOpen, slotVersion, visibleValues]);\n\n useIsomorphicLayoutEffect(() => {\n if (renderMode !== \"portal\") {\n return;\n }\n\n for (const [value, slotId] of slotAssignments.map) {\n const host = getRenderedTab(value)?.host;\n const slot = slotMapRef.current.get(slotId);\n\n if (host && slot && host.parentElement !== slot) {\n slot.appendChild(host);\n }\n }\n }, [getRenderedTab, renderMode, slotAssignments]);\n\n const handleKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n onKeyDown?.(event);\n\n if (menuOpen) return;\n\n const actionMap = {\n ArrowRight: getNext,\n ArrowLeft: getPrevious,\n Home: getFirst,\n End: getLast,\n };\n\n const action = actionMap[event.key as keyof typeof actionMap];\n\n if (action) {\n event.preventDefault();\n // Item registration/sorting is raf-driven; flush before keyboard nav to\n // avoid navigating against stale collection order/registration.\n sortItems();\n const activeTabId = activeTab.current?.id;\n if (!activeTabId) return;\n const nextItem = action(activeTabId);\n if (nextItem) {\n // Scrolling is handled by TabTrigger.\n nextItem.element?.focus({ preventScroll: true });\n }\n }\n };\n\n const getSelectedTabElement = useCallback(() => {\n return (\n tabstripRef.current?.querySelector<HTMLElement>(\n '[role=\"tab\"][aria-selected=\"true\"]',\n ) ?? item(activeTab.current?.id)?.element\n );\n }, [item, activeTab]);\n const { focusElementWithRetry } = useFocusWithRetry({\n maxAttempts: MAX_FOCUS_RETRY_ATTEMPTS,\n targetWindow,\n });\n useTabSelectionFocus({\n announce,\n focusElementWithRetry,\n getRenderedTab,\n getSelectedTabElement,\n menuOpen,\n resolvedOverflowActiveValue,\n selected,\n selectionFromOverflowValueRef,\n targetWindow,\n });\n\n const handleTabRemoval = useTabRemovalHandler({\n activeTab,\n focusElementWithRetry,\n getFirst,\n getIndex,\n getLast,\n getRemovedItems,\n getRenderedTab,\n getSelectedTabElement,\n item,\n itemAt,\n maxRetryAttempts: MAX_FOCUS_RETRY_ATTEMPTS,\n menuOpen,\n overflowButtonRef,\n overflowListRef,\n pendingRemovalRecoveryRef,\n pendingRemovalRecoveryRetriesRef,\n removalRecoveryRafRef,\n selected,\n setSelected,\n tabstripRef,\n targetWindow,\n });\n\n useTabListRecovery({\n removalVersion,\n targetWindow,\n tabstripRef,\n overflowListRef,\n handleTabRemoval,\n pendingRemovalRecoveryRef,\n pendingRemovalRecoveryRetriesRef,\n });\n\n return (\n <div\n role=\"tablist\"\n className={clsx(\n withBaseName(),\n withBaseName(appearance),\n withBaseName(\"horizontal\"),\n withBaseName(`activeColor${capitalize(activeColor)}`),\n className,\n )}\n data-ismeasuring={\n renderMode === \"portal\" && isMeasuring ? true : undefined\n }\n ref={handleRef}\n onKeyDown={handleKeyDown}\n {...rest}\n >\n {renderMode === \"inline\" ? (\n children\n ) : (\n <TabSlotRegistryContext.Provider value={slotRegistryContext}>\n <TabListLayoutContext.Provider value={tabListLayoutContext}>\n {children}\n {visibleValues.map((value) => (\n <TabSlot key={value} slotId={`main:${value}`} value={value} />\n ))}\n {!menuOpen && hiddenValues.length > 0 ? (\n <div\n aria-hidden=\"true\"\n role=\"presentation\"\n className={withBaseName(\"measureContainer\")}\n >\n {hiddenValues.map((value) => (\n <TabSlot\n key={`measure-${value}`}\n slotId={`measure:${value}`}\n value={value}\n />\n ))}\n </div>\n ) : null}\n <TabOverflowList\n buttonRef={overflowButtonRef}\n hiddenValues={hiddenValues}\n open={menuOpen}\n order={renderedTabs.length}\n setOpen={setMenuOpen}\n ref={overflowListRef}\n />\n </TabListLayoutContext.Provider>\n </TabSlotRegistryContext.Provider>\n )}\n </div>\n );\n },\n);\n"],"names":["makePrefixer","forwardRef","TabListNext","useWindow","useComponentCssInjection","tablistNextCss","useTabsNext","useRef","useState","useForkRef","useAriaAnnouncer","useOverflow","useEffect","useOverflowLayoutState","useCallback","useMemo","useIsomorphicLayoutEffect","useFocusWithRetry","useTabSelectionFocus","useTabRemovalHandler","useTabListRecovery","jsx","clsx","capitalize","TabSlotRegistryContext","jsxs","TabListLayoutContext","TabSlot","TabOverflowList"],"mappings":"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"}
@@ -1,6 +0,0 @@
1
- 'use strict';
2
-
3
- var css_248z = "/* Class applied to root Tab element */\n.saltTabNext {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n appearance: none;\n -webkit-appearance: none;\n gap: var(--salt-spacing-100);\n border: none;\n border-left: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) transparent;\n border-right: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) transparent;\n white-space: pre;\n min-height: calc(var(--salt-size-base) + var(--salt-spacing-100));\n min-width: 4em;\n padding: var(--salt-spacing-50) var(--salt-spacing-100);\n position: relative;\n flex-shrink: 0;\n box-sizing: border-box;\n overflow: hidden;\n\n cursor: var(--salt-cursor-hover);\n color: var(--salt-content-primary-foreground);\n font-weight: var(--salt-text-fontWeight);\n font-family: var(--salt-text-fontFamily);\n text-align: var(--salt-text-textAlign);\n letter-spacing: var(--salt-text-letterSpacing);\n line-height: var(--salt-text-lineHeight);\n font-size: var(--salt-text-fontSize);\n max-width: 100%;\n}\n\n@supports selector(:has(*)) {\n .saltTabListNext:has([data-overflowbutton]) .saltTabNext {\n /* 100% of the tab list but reserving space for the overflow button */\n max-width: calc(100% - var(--salt-spacing-100) - var(--salt-size-base));\n }\n}\n\n.saltTabNext::after {\n content: \"\";\n position: absolute;\n left: calc(var(--salt-size-fixed-100) * -1);\n right: calc(var(--salt-size-fixed-100) * -1);\n height: var(--salt-size-indicator);\n}\n\n.saltTabListNext-bordered .saltTabNext::after {\n top: 0;\n}\n\n.saltTabListNext-transparent .saltTabNext::after {\n bottom: 0;\n}\n\n.saltTabNext:hover::after,\n.saltTabNext-focusVisible::after {\n background: var(--salt-navigable-indicator-hover);\n}\n\n.saltTabNext-disabled:hover::after,\n.saltTabNext-disabled.saltTabNext-focusVisible::after {\n background: none;\n}\n\n.saltTabNext-focusVisible {\n outline: var(--salt-focused-outline);\n}\n\n.saltTabListNext-bordered .saltTabNext.saltTabNext-selected {\n background: var(--saltTabListNext-activeColor);\n border-left: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--salt-separable-secondary-borderColor);\n border-right: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--salt-separable-secondary-borderColor);\n}\n\n.saltTabNext.saltTabNext-selected::after {\n background: var(--salt-navigable-accent-indicator-active);\n}\n\n.saltTabNext.saltTabNext-disabled {\n cursor: var(--salt-cursor-disabled);\n color: var(--salt-content-primary-foreground-disabled);\n}\n";
4
-
5
- module.exports = css_248z;
6
- //# sourceMappingURL=TabNext.css.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"TabNext.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
@@ -1,213 +0,0 @@
1
- 'use strict';
2
-
3
- var jsxRuntime = require('react/jsx-runtime');
4
- var core = require('@salt-ds/core');
5
- var styles = require('@salt-ds/styles');
6
- var window = require('@salt-ds/window');
7
- var clsx = require('clsx');
8
- var react = require('react');
9
- var ReactDOM = require('react-dom');
10
- var useRenderedTabWidth = require('./hooks/useRenderedTabWidth.js');
11
- var TabNext$1 = require('./TabNext.css.js');
12
- var TabNextContext = require('./TabNextContext.js');
13
- var TabsNextContext = require('./TabsNextContext.js');
14
- var widthMeasurement = require('./widthMeasurement.js');
15
-
16
- const withBaseName = core.makePrefixer("saltTabNext");
17
- const TabNext = react.forwardRef(
18
- function Tab(props, ref) {
19
- const {
20
- children,
21
- className,
22
- disabled: disabledProp,
23
- onBlur,
24
- onMouseDown,
25
- onFocus,
26
- onFocusCapture,
27
- value,
28
- id: idProp,
29
- ...rest
30
- } = props;
31
- const targetWindow = window.useWindow();
32
- styles.useComponentCssInjection({
33
- testId: "salt-tab-next",
34
- css: TabNext$1,
35
- window: targetWindow
36
- });
37
- const {
38
- selected,
39
- activeTab,
40
- renderMode,
41
- registerBootstrapTab,
42
- setBootstrapTabReady,
43
- registerRenderedTab,
44
- updateRenderedTab
45
- } = TabsNextContext.useTabsNext();
46
- const disabled = !!disabledProp;
47
- const id = core.useId(idProp);
48
- const wasMouseDown = react.useRef(false);
49
- const [focusVisible, setFocusVisible] = react.useState(false);
50
- const [focused, setFocused] = react.useState(false);
51
- const [hostElement, setHostElement] = react.useState(null);
52
- const markerRef = react.useRef(null);
53
- const tabRootRef = react.useRef(null);
54
- const handleFocusCapture = (event) => {
55
- onFocusCapture == null ? void 0 : onFocusCapture(event);
56
- if (id) {
57
- activeTab.current = { value, id };
58
- }
59
- };
60
- const handleFocus = (event) => {
61
- onFocus == null ? void 0 : onFocus(event);
62
- setFocused(true);
63
- if (!wasMouseDown.current && event.target.getAttribute("role") === "tab") {
64
- setFocusVisible(true);
65
- }
66
- wasMouseDown.current = false;
67
- };
68
- const handleBlur = (event) => {
69
- onBlur == null ? void 0 : onBlur(event);
70
- setFocused(false);
71
- setFocusVisible(false);
72
- };
73
- const handleMouseDown = (event) => {
74
- onMouseDown == null ? void 0 : onMouseDown(event);
75
- if (id) {
76
- activeTab.current = { value, id };
77
- }
78
- wasMouseDown.current = true;
79
- };
80
- const [actionIds, setActionIds] = react.useState(() => /* @__PURE__ */ new Set());
81
- const registerAction = react.useCallback((id2) => {
82
- setActionIds((old) => {
83
- if (old.has(id2)) {
84
- return old;
85
- }
86
- const next = new Set(old);
87
- next.add(id2);
88
- return next;
89
- });
90
- return () => {
91
- setActionIds((old) => {
92
- if (!old.has(id2)) {
93
- return old;
94
- }
95
- const next = new Set(old);
96
- next.delete(id2);
97
- return next;
98
- });
99
- };
100
- }, []);
101
- const actions = react.useMemo(() => Array.from(actionIds), [actionIds]);
102
- const context = react.useMemo(
103
- () => ({
104
- tabId: id,
105
- selected: selected === value,
106
- focused,
107
- value,
108
- disabled,
109
- actions,
110
- registerAction
111
- }),
112
- [id, selected, value, focused, disabled, actions, registerAction]
113
- );
114
- core.useIsomorphicLayoutEffect(() => {
115
- const doc = targetWindow == null ? void 0 : targetWindow.document;
116
- if (!doc) {
117
- return;
118
- }
119
- const host = doc.createElement("div");
120
- host.dataset.tabHost = value;
121
- host.role = "presentation";
122
- host.style.display = "contents";
123
- setHostElement(host);
124
- return () => {
125
- host.remove();
126
- };
127
- }, [targetWindow, value]);
128
- core.useIsomorphicLayoutEffect(() => {
129
- if (renderMode !== "inline") {
130
- return;
131
- }
132
- return registerBootstrapTab(value);
133
- }, [registerBootstrapTab, renderMode, value]);
134
- core.useIsomorphicLayoutEffect(() => {
135
- setBootstrapTabReady(value, hostElement != null);
136
- return () => {
137
- setBootstrapTabReady(value, false);
138
- };
139
- }, [hostElement, setBootstrapTabReady, value]);
140
- core.useIsomorphicLayoutEffect(() => {
141
- if (!hostElement || !id) {
142
- return;
143
- }
144
- return registerRenderedTab({
145
- host: hostElement,
146
- id,
147
- marker: markerRef.current,
148
- root: tabRootRef.current,
149
- trigger: null,
150
- value,
151
- width: widthMeasurement.getIntrinsicMeasuredWidth(tabRootRef.current)
152
- });
153
- }, [hostElement, id, registerRenderedTab, value]);
154
- core.useIsomorphicLayoutEffect(() => {
155
- const updates = {
156
- marker: markerRef.current,
157
- root: tabRootRef.current
158
- };
159
- if (renderMode === "inline") {
160
- updates.width = widthMeasurement.getIntrinsicMeasuredWidth(tabRootRef.current);
161
- }
162
- updateRenderedTab(value, updates);
163
- }, [renderMode, updateRenderedTab, value]);
164
- useRenderedTabWidth.useRenderedTabWidth({
165
- hostElement,
166
- renderMode,
167
- tabRootRef,
168
- targetWindow,
169
- updateRenderedTab,
170
- value
171
- });
172
- const handleTabRootRef = core.useForkRef(tabRootRef, ref);
173
- const tabMarkup = /* @__PURE__ */ jsxRuntime.jsx(TabNextContext.TabNextContext.Provider, { value: context, children: /* @__PURE__ */ jsxRuntime.jsx(
174
- "div",
175
- {
176
- className: clsx.clsx(
177
- withBaseName(),
178
- {
179
- [withBaseName("selected")]: selected === value,
180
- [withBaseName("disabled")]: disabled,
181
- [withBaseName("focusVisible")]: focusVisible
182
- },
183
- className
184
- ),
185
- "data-overflowitem": "true",
186
- "data-value": value,
187
- ref: handleTabRootRef,
188
- onMouseDown: handleMouseDown,
189
- onFocusCapture: handleFocusCapture,
190
- onFocus: handleFocus,
191
- onBlur: handleBlur,
192
- role: "presentation",
193
- ...rest,
194
- children
195
- }
196
- ) });
197
- return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
198
- /* @__PURE__ */ jsxRuntime.jsx(
199
- "span",
200
- {
201
- role: "presentation",
202
- "data-tabnext-marker": "",
203
- hidden: true,
204
- ref: markerRef
205
- }
206
- ),
207
- renderMode === "inline" ? tabMarkup : hostElement ? ReactDOM.createPortal(tabMarkup, hostElement) : null
208
- ] });
209
- }
210
- );
211
-
212
- exports.TabNext = TabNext;
213
- //# sourceMappingURL=TabNext.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"TabNext.js","sources":["../src/tabs-next/TabNext.tsx"],"sourcesContent":["import {\n makePrefixer,\n useForkRef,\n useId,\n useIsomorphicLayoutEffect,\n} from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type ComponentPropsWithoutRef,\n type FocusEvent,\n forwardRef,\n type MouseEvent,\n type ReactElement,\n useCallback,\n useMemo,\n useRef,\n useState,\n} from \"react\";\nimport { createPortal } from \"react-dom\";\n\nimport { useRenderedTabWidth } from \"./hooks/useRenderedTabWidth\";\nimport tabCss from \"./TabNext.css\";\nimport { TabNextContext } from \"./TabNextContext\";\nimport { useTabsNext } from \"./TabsNextContext\";\nimport { getIntrinsicMeasuredWidth } from \"./widthMeasurement\";\n\nconst withBaseName = makePrefixer(\"saltTabNext\");\n\nexport interface TabNextProps extends ComponentPropsWithoutRef<\"div\"> {\n /**\n * If `true`, the tab will be disabled.\n */\n disabled?: boolean;\n /**\n * The value of the tab. This must be unique within a `TabsNext` instance.\n */\n value: string;\n}\n\nexport const TabNext = forwardRef<HTMLDivElement, TabNextProps>(\n function Tab(props, ref): ReactElement<TabNextProps> {\n const {\n children,\n className,\n disabled: disabledProp,\n onBlur,\n onMouseDown,\n onFocus,\n onFocusCapture,\n value,\n id: idProp,\n ...rest\n } = props;\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-tab-next\",\n css: tabCss,\n window: targetWindow,\n });\n\n const {\n selected,\n activeTab,\n renderMode,\n registerBootstrapTab,\n setBootstrapTabReady,\n registerRenderedTab,\n updateRenderedTab,\n } = useTabsNext();\n\n const disabled = !!disabledProp;\n\n const id = useId(idProp);\n\n const wasMouseDown = useRef(false);\n const [focusVisible, setFocusVisible] = useState(false);\n const [focused, setFocused] = useState(false);\n const [hostElement, setHostElement] = useState<HTMLDivElement | null>(null);\n const markerRef = useRef<HTMLSpanElement>(null);\n const tabRootRef = useRef<HTMLDivElement>(null);\n\n const handleFocusCapture = (event: FocusEvent<HTMLDivElement>) => {\n onFocusCapture?.(event);\n if (id) {\n activeTab.current = { value, id };\n }\n };\n\n const handleFocus = (event: FocusEvent<HTMLDivElement>) => {\n onFocus?.(event);\n\n setFocused(true);\n\n if (\n !wasMouseDown.current &&\n event.target.getAttribute(\"role\") === \"tab\"\n ) {\n setFocusVisible(true);\n }\n\n wasMouseDown.current = false;\n };\n\n const handleBlur = (event: FocusEvent<HTMLDivElement>) => {\n onBlur?.(event);\n setFocused(false);\n setFocusVisible(false);\n };\n\n const handleMouseDown = (event: MouseEvent<HTMLDivElement>) => {\n onMouseDown?.(event);\n if (id) {\n activeTab.current = { value, id };\n }\n wasMouseDown.current = true;\n };\n\n const [actionIds, setActionIds] = useState(() => new Set<string>());\n\n const registerAction = useCallback((id: string) => {\n setActionIds((old) => {\n if (old.has(id)) {\n return old;\n }\n\n const next = new Set(old);\n next.add(id);\n return next;\n });\n\n return () => {\n setActionIds((old) => {\n if (!old.has(id)) {\n return old;\n }\n\n const next = new Set(old);\n next.delete(id);\n return next;\n });\n };\n }, []);\n\n const actions = useMemo(() => Array.from(actionIds), [actionIds]);\n\n const context = useMemo(\n () => ({\n tabId: id,\n selected: selected === value,\n focused,\n value,\n disabled,\n actions,\n registerAction,\n }),\n [id, selected, value, focused, disabled, actions, registerAction],\n );\n\n useIsomorphicLayoutEffect(() => {\n const doc = targetWindow?.document;\n if (!doc) {\n return;\n }\n\n const host = doc.createElement(\"div\");\n host.dataset.tabHost = value;\n host.role = \"presentation\";\n host.style.display = \"contents\";\n setHostElement(host);\n\n return () => {\n host.remove();\n };\n }, [targetWindow, value]);\n\n useIsomorphicLayoutEffect(() => {\n if (renderMode !== \"inline\") {\n return;\n }\n\n return registerBootstrapTab(value);\n }, [registerBootstrapTab, renderMode, value]);\n\n useIsomorphicLayoutEffect(() => {\n setBootstrapTabReady(value, hostElement != null);\n\n return () => {\n setBootstrapTabReady(value, false);\n };\n }, [hostElement, setBootstrapTabReady, value]);\n\n useIsomorphicLayoutEffect(() => {\n if (!hostElement || !id) {\n return;\n }\n\n return registerRenderedTab({\n host: hostElement,\n id,\n marker: markerRef.current,\n root: tabRootRef.current,\n trigger: null,\n value,\n width: getIntrinsicMeasuredWidth(tabRootRef.current),\n });\n }, [hostElement, id, registerRenderedTab, value]);\n\n useIsomorphicLayoutEffect(() => {\n const updates = {\n marker: markerRef.current,\n root: tabRootRef.current,\n } as Partial<{\n host: HTMLDivElement;\n id: string;\n marker: HTMLElement | null;\n root: HTMLElement | null;\n trigger: HTMLButtonElement | null;\n width: number;\n }>;\n\n if (renderMode === \"inline\") {\n updates.width = getIntrinsicMeasuredWidth(tabRootRef.current);\n }\n\n updateRenderedTab(value, updates);\n }, [renderMode, updateRenderedTab, value]);\n\n useRenderedTabWidth({\n hostElement,\n renderMode,\n tabRootRef,\n targetWindow,\n updateRenderedTab,\n value,\n });\n\n const handleTabRootRef = useForkRef(tabRootRef, ref);\n\n const tabMarkup = (\n <TabNextContext.Provider value={context}>\n <div\n className={clsx(\n withBaseName(),\n {\n [withBaseName(\"selected\")]: selected === value,\n [withBaseName(\"disabled\")]: disabled,\n [withBaseName(\"focusVisible\")]: focusVisible,\n },\n className,\n )}\n data-overflowitem=\"true\"\n data-value={value}\n ref={handleTabRootRef}\n onMouseDown={handleMouseDown}\n onFocusCapture={handleFocusCapture}\n onFocus={handleFocus}\n onBlur={handleBlur}\n role=\"presentation\"\n {...rest}\n >\n {children}\n </div>\n </TabNextContext.Provider>\n );\n\n return (\n <>\n <span\n role=\"presentation\"\n data-tabnext-marker=\"\"\n hidden\n ref={markerRef}\n />\n {renderMode === \"inline\"\n ? tabMarkup\n : hostElement\n ? createPortal(tabMarkup, hostElement)\n : null}\n </>\n );\n },\n);\n"],"names":["makePrefixer","forwardRef","useWindow","useComponentCssInjection","tabCss","useTabsNext","useId","useRef","useState","useCallback","id","useMemo","useIsomorphicLayoutEffect","getIntrinsicMeasuredWidth","useRenderedTabWidth","useForkRef","jsx","TabNextContext","clsx","jsxs","Fragment","createPortal"],"mappings":"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"}
@@ -1,58 +0,0 @@
1
- 'use strict';
2
-
3
- var jsxRuntime = require('react/jsx-runtime');
4
- var core = require('@salt-ds/core');
5
- var clsx = require('clsx');
6
- var react = require('react');
7
- var TabNextContext = require('./TabNextContext.js');
8
- var TabsNextContext = require('./TabsNextContext.js');
9
-
10
- const TabNextAction = react.forwardRef(
11
- function TabNextAction2(props, ref) {
12
- const {
13
- "aria-labelledby": ariaLabelledBy,
14
- id: idProp,
15
- onFocus,
16
- onMouseDown,
17
- ...rest
18
- } = props;
19
- const id = core.useId(idProp);
20
- const { focused, selected, tabId, registerAction, value } = TabNextContext.useTabNext();
21
- const { activeTab } = TabsNextContext.useTabsNext();
22
- core.useIsomorphicLayoutEffect(() => {
23
- if (id) {
24
- return registerAction(id);
25
- }
26
- }, [registerAction, id]);
27
- const setActiveTab = () => {
28
- if (tabId) {
29
- activeTab.current = { id: tabId, value };
30
- }
31
- };
32
- const handleFocus = (event) => {
33
- onFocus == null ? void 0 : onFocus(event);
34
- setActiveTab();
35
- };
36
- const handleMouseDown = (event) => {
37
- onMouseDown == null ? void 0 : onMouseDown(event);
38
- setActiveTab();
39
- };
40
- return /* @__PURE__ */ jsxRuntime.jsx(
41
- core.Button,
42
- {
43
- id,
44
- "aria-labelledby": clsx.clsx(ariaLabelledBy, tabId, id),
45
- tabIndex: focused || selected ? void 0 : -1,
46
- appearance: "transparent",
47
- sentiment: "neutral",
48
- ref,
49
- onFocus: handleFocus,
50
- onMouseDown: handleMouseDown,
51
- ...rest
52
- }
53
- );
54
- }
55
- );
56
-
57
- exports.TabNextAction = TabNextAction;
58
- //# sourceMappingURL=TabNextAction.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"TabNextAction.js","sources":["../src/tabs-next/TabNextAction.tsx"],"sourcesContent":["import {\n Button,\n type ButtonProps,\n useId,\n useIsomorphicLayoutEffect,\n} from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport { type FocusEvent, forwardRef, type MouseEvent } from \"react\";\nimport { useTabNext } from \"./TabNextContext\";\nimport { useTabsNext } from \"./TabsNextContext\";\n\nexport interface TabNextActionProps extends ButtonProps {}\n\nexport const TabNextAction = forwardRef<HTMLButtonElement, TabNextActionProps>(\n function TabNextAction(props, ref) {\n const {\n \"aria-labelledby\": ariaLabelledBy,\n id: idProp,\n onFocus,\n onMouseDown,\n ...rest\n } = props;\n\n const id = useId(idProp);\n const { focused, selected, tabId, registerAction, value } = useTabNext();\n const { activeTab } = useTabsNext();\n\n useIsomorphicLayoutEffect(() => {\n if (id) {\n return registerAction(id);\n }\n }, [registerAction, id]);\n\n const setActiveTab = () => {\n if (tabId) {\n activeTab.current = { id: tabId, value };\n }\n };\n\n const handleFocus = (event: FocusEvent<HTMLButtonElement>) => {\n onFocus?.(event);\n setActiveTab();\n };\n\n const handleMouseDown = (event: MouseEvent<HTMLButtonElement>) => {\n onMouseDown?.(event);\n setActiveTab();\n };\n\n return (\n <Button\n id={id}\n aria-labelledby={clsx(ariaLabelledBy, tabId, id)}\n tabIndex={focused || selected ? undefined : -1}\n appearance=\"transparent\"\n sentiment=\"neutral\"\n ref={ref}\n onFocus={handleFocus}\n onMouseDown={handleMouseDown}\n {...rest}\n />\n );\n },\n);\n"],"names":["forwardRef","TabNextAction","useId","useTabNext","useTabsNext","useIsomorphicLayoutEffect","jsx","Button","clsx"],"mappings":";;;;;;;;;AAaO,MAAM,aAAA,GAAgBA,gBAAA;AAAA,EAC3B,SAASC,cAAAA,CAAc,KAAA,EAAO,GAAA,EAAK;AACjC,IAAA,MAAM;AAAA,MACJ,iBAAA,EAAmB,cAAA;AAAA,MACnB,EAAA,EAAI,MAAA;AAAA,MACJ,OAAA;AAAA,MACA,WAAA;AAAA,MACA,GAAG;AAAA,KACL,GAAI,KAAA;AAEJ,IAAA,MAAM,EAAA,GAAKC,WAAM,MAAM,CAAA;AACvB,IAAA,MAAM,EAAE,OAAA,EAAS,QAAA,EAAU,OAAO,cAAA,EAAgB,KAAA,KAAUC,yBAAA,EAAW;AACvE,IAAA,MAAM,EAAE,SAAA,EAAU,GAAIC,2BAAA,EAAY;AAElC,IAAAC,8BAAA,CAA0B,MAAM;AAC9B,MAAA,IAAI,EAAA,EAAI;AACN,QAAA,OAAO,eAAe,EAAE,CAAA;AAAA,MAC1B;AAAA,IACF,CAAA,EAAG,CAAC,cAAA,EAAgB,EAAE,CAAC,CAAA;AAEvB,IAAA,MAAM,eAAe,MAAM;AACzB,MAAA,IAAI,KAAA,EAAO;AACT,QAAA,SAAA,CAAU,OAAA,GAAU,EAAE,EAAA,EAAI,KAAA,EAAO,KAAA,EAAM;AAAA,MACzC;AAAA,IACF,CAAA;AAEA,IAAA,MAAM,WAAA,GAAc,CAAC,KAAA,KAAyC;AAC5D,MAAA,OAAA,IAAA,IAAA,GAAA,MAAA,GAAA,OAAA,CAAU,KAAA,CAAA;AACV,MAAA,YAAA,EAAa;AAAA,IACf,CAAA;AAEA,IAAA,MAAM,eAAA,GAAkB,CAAC,KAAA,KAAyC;AAChE,MAAA,WAAA,IAAA,IAAA,GAAA,MAAA,GAAA,WAAA,CAAc,KAAA,CAAA;AACd,MAAA,YAAA,EAAa;AAAA,IACf,CAAA;AAEA,IAAA,uBACEC,cAAA;AAAA,MAACC,WAAA;AAAA,MAAA;AAAA,QACC,EAAA;AAAA,QACA,iBAAA,EAAiBC,SAAA,CAAK,cAAA,EAAgB,KAAA,EAAO,EAAE,CAAA;AAAA,QAC/C,QAAA,EAAU,OAAA,IAAW,QAAA,GAAW,MAAA,GAAY,EAAA;AAAA,QAC5C,UAAA,EAAW,aAAA;AAAA,QACX,SAAA,EAAU,SAAA;AAAA,QACV,GAAA;AAAA,QACA,OAAA,EAAS,WAAA;AAAA,QACT,WAAA,EAAa,eAAA;AAAA,QACZ,GAAG;AAAA;AAAA,KACN;AAAA,EAEJ;AACF;;;;"}
@@ -1,23 +0,0 @@
1
- 'use strict';
2
-
3
- var core = require('@salt-ds/core');
4
- var react = require('react');
5
-
6
- const TabNextContext = core.createContext(
7
- "TabNextContext",
8
- {
9
- focused: false,
10
- selected: false,
11
- disabled: false,
12
- value: "",
13
- actions: [],
14
- registerAction: () => () => void 0
15
- }
16
- );
17
- function useTabNext() {
18
- return react.useContext(TabNextContext);
19
- }
20
-
21
- exports.TabNextContext = TabNextContext;
22
- exports.useTabNext = useTabNext;
23
- //# sourceMappingURL=TabNextContext.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"TabNextContext.js","sources":["../src/tabs-next/TabNextContext.tsx"],"sourcesContent":["import { createContext } from \"@salt-ds/core\";\nimport { useContext } from \"react\";\n\ninterface TabNextContextValue {\n tabId?: string;\n focused: boolean;\n selected: boolean;\n value: string;\n disabled: boolean;\n actions: string[];\n registerAction: (id: string) => () => void;\n}\n\nexport const TabNextContext = createContext<TabNextContextValue>(\n \"TabNextContext\",\n {\n focused: false,\n selected: false,\n disabled: false,\n value: \"\",\n actions: [],\n registerAction: () => () => undefined,\n },\n);\n\nexport function useTabNext() {\n return useContext(TabNextContext);\n}\n"],"names":["createContext","useContext"],"mappings":";;;;;AAaO,MAAM,cAAA,GAAiBA,kBAAA;AAAA,EAC5B,gBAAA;AAAA,EACA;AAAA,IACE,OAAA,EAAS,KAAA;AAAA,IACT,QAAA,EAAU,KAAA;AAAA,IACV,QAAA,EAAU,KAAA;AAAA,IACV,KAAA,EAAO,EAAA;AAAA,IACP,SAAS,EAAC;AAAA,IACV,cAAA,EAAgB,MAAM,MAAM;AAAA;AAEhC;AAEO,SAAS,UAAA,GAAa;AAC3B,EAAA,OAAOC,iBAAW,cAAc,CAAA;AAClC;;;;;"}