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

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 (356) hide show
  1. package/CHANGELOG.md +45 -0
  2. package/css/salt-lab.css +125 -366
  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 +25 -30
  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/SidePanelProvider.js +20 -2
  53. package/dist-cjs/side-panel/SidePanelProvider.js.map +1 -1
  54. package/dist-cjs/side-panel/SidePanelTitle.css.js +1 -1
  55. package/dist-cjs/side-panel/SidePanelTitle.js +1 -0
  56. package/dist-cjs/side-panel/SidePanelTitle.js.map +1 -1
  57. package/dist-cjs/side-panel/SidePanelTrigger.js +4 -4
  58. package/dist-cjs/side-panel/SidePanelTrigger.js.map +1 -1
  59. package/dist-cjs/side-panel/internal/SidePanelContext.js +3 -0
  60. package/dist-cjs/side-panel/internal/SidePanelContext.js.map +1 -1
  61. package/dist-cjs/side-panel/internal/useIsScrollable.js +50 -0
  62. package/dist-cjs/side-panel/internal/useIsScrollable.js.map +1 -0
  63. package/dist-cjs/side-panel/internal/useSidePanelTabOrder.js +121 -0
  64. package/dist-cjs/side-panel/internal/useSidePanelTabOrder.js.map +1 -0
  65. package/dist-cjs/side-panel/useSidePanel.js +3 -1
  66. package/dist-cjs/side-panel/useSidePanel.js.map +1 -1
  67. package/dist-cjs/tree/Tree.js +8 -5
  68. package/dist-cjs/tree/Tree.js.map +1 -1
  69. package/dist-cjs/tree/TreeContext.js.map +1 -1
  70. package/dist-cjs/tree/TreeNode.js +18 -14
  71. package/dist-cjs/tree/TreeNode.js.map +1 -1
  72. package/dist-cjs/tree/TreeNodeTrigger.js +4 -3
  73. package/dist-cjs/tree/TreeNodeTrigger.js.map +1 -1
  74. package/dist-cjs/tree/treeModel.js +61 -0
  75. package/dist-cjs/tree/treeModel.js.map +1 -0
  76. package/dist-cjs/tree/useTree.js +71 -65
  77. package/dist-cjs/tree/useTree.js.map +1 -1
  78. package/dist-es/index.js +10 -8
  79. package/dist-es/index.js.map +1 -1
  80. package/dist-es/mega-menu/MegaMenu.js +80 -0
  81. package/dist-es/mega-menu/MegaMenu.js.map +1 -0
  82. package/dist-es/mega-menu/MegaMenuContent.css.js +4 -0
  83. package/dist-es/mega-menu/MegaMenuContent.css.js.map +1 -0
  84. package/dist-es/mega-menu/MegaMenuContent.js +31 -0
  85. package/dist-es/mega-menu/MegaMenuContent.js.map +1 -0
  86. package/dist-es/mega-menu/MegaMenuContext.js +9 -0
  87. package/dist-es/mega-menu/MegaMenuContext.js.map +1 -0
  88. package/dist-es/mega-menu/MegaMenuGroup.css.js +4 -0
  89. package/dist-es/mega-menu/MegaMenuGroup.css.js.map +1 -0
  90. package/dist-es/mega-menu/MegaMenuGroup.js +56 -0
  91. package/dist-es/mega-menu/MegaMenuGroup.js.map +1 -0
  92. package/dist-es/mega-menu/MegaMenuHeader.css.js +4 -0
  93. package/dist-es/mega-menu/MegaMenuHeader.css.js.map +1 -0
  94. package/dist-es/mega-menu/MegaMenuHeader.js +24 -0
  95. package/dist-es/mega-menu/MegaMenuHeader.js.map +1 -0
  96. package/dist-es/mega-menu/MegaMenuItem.css.js +4 -0
  97. package/dist-es/mega-menu/MegaMenuItem.css.js.map +1 -0
  98. package/dist-es/mega-menu/MegaMenuItem.js +50 -0
  99. package/dist-es/mega-menu/MegaMenuItem.js.map +1 -0
  100. package/dist-es/mega-menu/MegaMenuItemContent.css.js +4 -0
  101. package/dist-es/mega-menu/MegaMenuItemContent.css.js.map +1 -0
  102. package/dist-es/mega-menu/MegaMenuItemContent.js +21 -0
  103. package/dist-es/mega-menu/MegaMenuItemContent.js.map +1 -0
  104. package/dist-es/mega-menu/MegaMenuPanel.css.js +4 -0
  105. package/dist-es/mega-menu/MegaMenuPanel.css.js.map +1 -0
  106. package/dist-es/mega-menu/MegaMenuPanel.js +106 -0
  107. package/dist-es/mega-menu/MegaMenuPanel.js.map +1 -0
  108. package/dist-es/mega-menu/MegaMenuSection.css.js +4 -0
  109. package/dist-es/mega-menu/MegaMenuSection.css.js.map +1 -0
  110. package/dist-es/mega-menu/MegaMenuSection.js +23 -0
  111. package/dist-es/mega-menu/MegaMenuSection.js.map +1 -0
  112. package/dist-es/mega-menu/MegaMenuTrigger.js +90 -0
  113. package/dist-es/mega-menu/MegaMenuTrigger.js.map +1 -0
  114. package/dist-es/mega-menu/useMegaMenu.js +13 -0
  115. package/dist-es/mega-menu/useMegaMenu.js.map +1 -0
  116. package/dist-es/mega-menu/useMegaMenuKeyboard.js +205 -0
  117. package/dist-es/mega-menu/useMegaMenuKeyboard.js.map +1 -0
  118. package/dist-es/side-panel/SidePanel.css.js +1 -1
  119. package/dist-es/side-panel/SidePanel.js +28 -33
  120. package/dist-es/side-panel/SidePanel.js.map +1 -1
  121. package/dist-es/side-panel/SidePanelCloseButton.js +36 -0
  122. package/dist-es/side-panel/SidePanelCloseButton.js.map +1 -0
  123. package/dist-es/side-panel/SidePanelContent.css.js +1 -1
  124. package/dist-es/side-panel/SidePanelContent.js +4 -24
  125. package/dist-es/side-panel/SidePanelContent.js.map +1 -1
  126. package/dist-es/side-panel/SidePanelHeader.css.js +1 -1
  127. package/dist-es/side-panel/SidePanelProvider.js +20 -2
  128. package/dist-es/side-panel/SidePanelProvider.js.map +1 -1
  129. package/dist-es/side-panel/SidePanelTitle.css.js +1 -1
  130. package/dist-es/side-panel/SidePanelTitle.js +1 -0
  131. package/dist-es/side-panel/SidePanelTitle.js.map +1 -1
  132. package/dist-es/side-panel/SidePanelTrigger.js +5 -5
  133. package/dist-es/side-panel/SidePanelTrigger.js.map +1 -1
  134. package/dist-es/side-panel/internal/SidePanelContext.js +3 -0
  135. package/dist-es/side-panel/internal/SidePanelContext.js.map +1 -1
  136. package/dist-es/side-panel/internal/useIsScrollable.js +48 -0
  137. package/dist-es/side-panel/internal/useIsScrollable.js.map +1 -0
  138. package/dist-es/side-panel/internal/useSidePanelTabOrder.js +119 -0
  139. package/dist-es/side-panel/internal/useSidePanelTabOrder.js.map +1 -0
  140. package/dist-es/side-panel/useSidePanel.js +3 -1
  141. package/dist-es/side-panel/useSidePanel.js.map +1 -1
  142. package/dist-es/tree/Tree.js +8 -5
  143. package/dist-es/tree/Tree.js.map +1 -1
  144. package/dist-es/tree/TreeContext.js.map +1 -1
  145. package/dist-es/tree/TreeNode.js +20 -16
  146. package/dist-es/tree/TreeNode.js.map +1 -1
  147. package/dist-es/tree/TreeNodeTrigger.js +4 -3
  148. package/dist-es/tree/TreeNodeTrigger.js.map +1 -1
  149. package/dist-es/tree/treeModel.js +57 -0
  150. package/dist-es/tree/treeModel.js.map +1 -0
  151. package/dist-es/tree/useTree.js +49 -43
  152. package/dist-es/tree/useTree.js.map +1 -1
  153. package/dist-types/index.d.ts +1 -2
  154. package/dist-types/mega-menu/MegaMenu.d.ts +27 -0
  155. package/dist-types/mega-menu/MegaMenuContent.d.ts +8 -0
  156. package/dist-types/mega-menu/MegaMenuContext.d.ts +29 -0
  157. package/dist-types/mega-menu/MegaMenuGroup.d.ts +8 -0
  158. package/dist-types/mega-menu/MegaMenuHeader.d.ts +8 -0
  159. package/dist-types/mega-menu/MegaMenuItem.d.ts +12 -0
  160. package/dist-types/mega-menu/MegaMenuItemContent.d.ts +8 -0
  161. package/dist-types/mega-menu/MegaMenuPanel.d.ts +8 -0
  162. package/dist-types/mega-menu/MegaMenuSection.d.ts +8 -0
  163. package/dist-types/mega-menu/MegaMenuTrigger.d.ts +8 -0
  164. package/dist-types/mega-menu/index.d.ts +9 -0
  165. package/dist-types/mega-menu/useMegaMenu.d.ts +6 -0
  166. package/dist-types/mega-menu/useMegaMenuKeyboard.d.ts +30 -0
  167. package/dist-types/side-panel/SidePanelCloseButton.d.ts +2 -0
  168. package/dist-types/side-panel/SidePanelTrigger.d.ts +1 -2
  169. package/dist-types/side-panel/index.d.ts +1 -0
  170. package/dist-types/side-panel/internal/SidePanelContext.d.ts +8 -0
  171. package/dist-types/side-panel/internal/index.d.ts +2 -0
  172. package/dist-types/side-panel/internal/useIsScrollable.d.ts +2 -0
  173. package/dist-types/side-panel/internal/useSidePanelTabOrder.d.ts +7 -0
  174. package/dist-types/side-panel/useSidePanel.d.ts +11 -4
  175. package/dist-types/tree/TreeContext.d.ts +7 -1
  176. package/dist-types/tree/treeModel.d.ts +24 -0
  177. package/dist-types/tree/useTree.d.ts +3 -14
  178. package/package.json +2 -4
  179. package/dist-cjs/rating/Rating.css.js +0 -6
  180. package/dist-cjs/rating/Rating.css.js.map +0 -1
  181. package/dist-cjs/rating/Rating.js +0 -132
  182. package/dist-cjs/rating/Rating.js.map +0 -1
  183. package/dist-cjs/rating/RatingItem.css.js +0 -6
  184. package/dist-cjs/rating/RatingItem.css.js.map +0 -1
  185. package/dist-cjs/rating/RatingItem.js +0 -70
  186. package/dist-cjs/rating/RatingItem.js.map +0 -1
  187. package/dist-cjs/tabs-next/TabBar.css.js +0 -6
  188. package/dist-cjs/tabs-next/TabBar.css.js.map +0 -1
  189. package/dist-cjs/tabs-next/TabBar.js +0 -41
  190. package/dist-cjs/tabs-next/TabBar.js.map +0 -1
  191. package/dist-cjs/tabs-next/TabListLayoutContext.js +0 -13
  192. package/dist-cjs/tabs-next/TabListLayoutContext.js.map +0 -1
  193. package/dist-cjs/tabs-next/TabListNext.css.js +0 -6
  194. package/dist-cjs/tabs-next/TabListNext.css.js.map +0 -1
  195. package/dist-cjs/tabs-next/TabListNext.js +0 -271
  196. package/dist-cjs/tabs-next/TabListNext.js.map +0 -1
  197. package/dist-cjs/tabs-next/TabNext.css.js +0 -6
  198. package/dist-cjs/tabs-next/TabNext.css.js.map +0 -1
  199. package/dist-cjs/tabs-next/TabNext.js +0 -213
  200. package/dist-cjs/tabs-next/TabNext.js.map +0 -1
  201. package/dist-cjs/tabs-next/TabNextAction.js +0 -58
  202. package/dist-cjs/tabs-next/TabNextAction.js.map +0 -1
  203. package/dist-cjs/tabs-next/TabNextContext.js +0 -23
  204. package/dist-cjs/tabs-next/TabNextContext.js.map +0 -1
  205. package/dist-cjs/tabs-next/TabNextPanel.css.js +0 -6
  206. package/dist-cjs/tabs-next/TabNextPanel.css.js.map +0 -1
  207. package/dist-cjs/tabs-next/TabNextPanel.js +0 -92
  208. package/dist-cjs/tabs-next/TabNextPanel.js.map +0 -1
  209. package/dist-cjs/tabs-next/TabNextTrigger.css.js +0 -6
  210. package/dist-cjs/tabs-next/TabNextTrigger.css.js.map +0 -1
  211. package/dist-cjs/tabs-next/TabNextTrigger.js +0 -180
  212. package/dist-cjs/tabs-next/TabNextTrigger.js.map +0 -1
  213. package/dist-cjs/tabs-next/TabOverflowList.css.js +0 -6
  214. package/dist-cjs/tabs-next/TabOverflowList.css.js.map +0 -1
  215. package/dist-cjs/tabs-next/TabOverflowList.js +0 -237
  216. package/dist-cjs/tabs-next/TabOverflowList.js.map +0 -1
  217. package/dist-cjs/tabs-next/TabSlot.js +0 -30
  218. package/dist-cjs/tabs-next/TabSlot.js.map +0 -1
  219. package/dist-cjs/tabs-next/TabSlotRegistryContext.js +0 -16
  220. package/dist-cjs/tabs-next/TabSlotRegistryContext.js.map +0 -1
  221. package/dist-cjs/tabs-next/TabsNext.css.js +0 -6
  222. package/dist-cjs/tabs-next/TabsNext.css.js.map +0 -1
  223. package/dist-cjs/tabs-next/TabsNext.js +0 -195
  224. package/dist-cjs/tabs-next/TabsNext.js.map +0 -1
  225. package/dist-cjs/tabs-next/TabsNextContext.js +0 -47
  226. package/dist-cjs/tabs-next/TabsNextContext.js.map +0 -1
  227. package/dist-cjs/tabs-next/domUtils.js +0 -13
  228. package/dist-cjs/tabs-next/domUtils.js.map +0 -1
  229. package/dist-cjs/tabs-next/hooks/overflowMath.js +0 -86
  230. package/dist-cjs/tabs-next/hooks/overflowMath.js.map +0 -1
  231. package/dist-cjs/tabs-next/hooks/useCollection.js +0 -197
  232. package/dist-cjs/tabs-next/hooks/useCollection.js.map +0 -1
  233. package/dist-cjs/tabs-next/hooks/useFocusWithRetry.js +0 -64
  234. package/dist-cjs/tabs-next/hooks/useFocusWithRetry.js.map +0 -1
  235. package/dist-cjs/tabs-next/hooks/useOverflow.js +0 -266
  236. package/dist-cjs/tabs-next/hooks/useOverflow.js.map +0 -1
  237. package/dist-cjs/tabs-next/hooks/useOverflowLayoutState.js +0 -99
  238. package/dist-cjs/tabs-next/hooks/useOverflowLayoutState.js.map +0 -1
  239. package/dist-cjs/tabs-next/hooks/useOverflowSelectionState.js +0 -60
  240. package/dist-cjs/tabs-next/hooks/useOverflowSelectionState.js.map +0 -1
  241. package/dist-cjs/tabs-next/hooks/useRenderedTabWidth.js +0 -92
  242. package/dist-cjs/tabs-next/hooks/useRenderedTabWidth.js.map +0 -1
  243. package/dist-cjs/tabs-next/hooks/useRenderedTabsRegistry.js +0 -200
  244. package/dist-cjs/tabs-next/hooks/useRenderedTabsRegistry.js.map +0 -1
  245. package/dist-cjs/tabs-next/hooks/useTabListRecovery.js +0 -76
  246. package/dist-cjs/tabs-next/hooks/useTabListRecovery.js.map +0 -1
  247. package/dist-cjs/tabs-next/hooks/useTabRemovalHandler.js +0 -165
  248. package/dist-cjs/tabs-next/hooks/useTabRemovalHandler.js.map +0 -1
  249. package/dist-cjs/tabs-next/hooks/useTabSelectionFocus.js +0 -80
  250. package/dist-cjs/tabs-next/hooks/useTabSelectionFocus.js.map +0 -1
  251. package/dist-cjs/tabs-next/widthMeasurement.js +0 -42
  252. package/dist-cjs/tabs-next/widthMeasurement.js.map +0 -1
  253. package/dist-es/rating/Rating.css.js +0 -4
  254. package/dist-es/rating/Rating.css.js.map +0 -1
  255. package/dist-es/rating/Rating.js +0 -130
  256. package/dist-es/rating/Rating.js.map +0 -1
  257. package/dist-es/rating/RatingItem.css.js +0 -4
  258. package/dist-es/rating/RatingItem.css.js.map +0 -1
  259. package/dist-es/rating/RatingItem.js +0 -68
  260. package/dist-es/rating/RatingItem.js.map +0 -1
  261. package/dist-es/tabs-next/TabBar.css.js +0 -4
  262. package/dist-es/tabs-next/TabBar.css.js.map +0 -1
  263. package/dist-es/tabs-next/TabBar.js +0 -39
  264. package/dist-es/tabs-next/TabBar.js.map +0 -1
  265. package/dist-es/tabs-next/TabListLayoutContext.js +0 -10
  266. package/dist-es/tabs-next/TabListLayoutContext.js.map +0 -1
  267. package/dist-es/tabs-next/TabListNext.css.js +0 -4
  268. package/dist-es/tabs-next/TabListNext.css.js.map +0 -1
  269. package/dist-es/tabs-next/TabListNext.js +0 -269
  270. package/dist-es/tabs-next/TabListNext.js.map +0 -1
  271. package/dist-es/tabs-next/TabNext.css.js +0 -4
  272. package/dist-es/tabs-next/TabNext.css.js.map +0 -1
  273. package/dist-es/tabs-next/TabNext.js +0 -211
  274. package/dist-es/tabs-next/TabNext.js.map +0 -1
  275. package/dist-es/tabs-next/TabNextAction.js +0 -56
  276. package/dist-es/tabs-next/TabNextAction.js.map +0 -1
  277. package/dist-es/tabs-next/TabNextContext.js +0 -20
  278. package/dist-es/tabs-next/TabNextContext.js.map +0 -1
  279. package/dist-es/tabs-next/TabNextPanel.css.js +0 -4
  280. package/dist-es/tabs-next/TabNextPanel.css.js.map +0 -1
  281. package/dist-es/tabs-next/TabNextPanel.js +0 -90
  282. package/dist-es/tabs-next/TabNextPanel.js.map +0 -1
  283. package/dist-es/tabs-next/TabNextTrigger.css.js +0 -4
  284. package/dist-es/tabs-next/TabNextTrigger.css.js.map +0 -1
  285. package/dist-es/tabs-next/TabNextTrigger.js +0 -178
  286. package/dist-es/tabs-next/TabNextTrigger.js.map +0 -1
  287. package/dist-es/tabs-next/TabOverflowList.css.js +0 -4
  288. package/dist-es/tabs-next/TabOverflowList.css.js.map +0 -1
  289. package/dist-es/tabs-next/TabOverflowList.js +0 -235
  290. package/dist-es/tabs-next/TabOverflowList.js.map +0 -1
  291. package/dist-es/tabs-next/TabSlot.js +0 -28
  292. package/dist-es/tabs-next/TabSlot.js.map +0 -1
  293. package/dist-es/tabs-next/TabSlotRegistryContext.js +0 -13
  294. package/dist-es/tabs-next/TabSlotRegistryContext.js.map +0 -1
  295. package/dist-es/tabs-next/TabsNext.css.js +0 -4
  296. package/dist-es/tabs-next/TabsNext.css.js.map +0 -1
  297. package/dist-es/tabs-next/TabsNext.js +0 -193
  298. package/dist-es/tabs-next/TabsNext.js.map +0 -1
  299. package/dist-es/tabs-next/TabsNextContext.js +0 -44
  300. package/dist-es/tabs-next/TabsNextContext.js.map +0 -1
  301. package/dist-es/tabs-next/domUtils.js +0 -11
  302. package/dist-es/tabs-next/domUtils.js.map +0 -1
  303. package/dist-es/tabs-next/hooks/overflowMath.js +0 -82
  304. package/dist-es/tabs-next/hooks/overflowMath.js.map +0 -1
  305. package/dist-es/tabs-next/hooks/useCollection.js +0 -195
  306. package/dist-es/tabs-next/hooks/useCollection.js.map +0 -1
  307. package/dist-es/tabs-next/hooks/useFocusWithRetry.js +0 -62
  308. package/dist-es/tabs-next/hooks/useFocusWithRetry.js.map +0 -1
  309. package/dist-es/tabs-next/hooks/useOverflow.js +0 -264
  310. package/dist-es/tabs-next/hooks/useOverflow.js.map +0 -1
  311. package/dist-es/tabs-next/hooks/useOverflowLayoutState.js +0 -97
  312. package/dist-es/tabs-next/hooks/useOverflowLayoutState.js.map +0 -1
  313. package/dist-es/tabs-next/hooks/useOverflowSelectionState.js +0 -58
  314. package/dist-es/tabs-next/hooks/useOverflowSelectionState.js.map +0 -1
  315. package/dist-es/tabs-next/hooks/useRenderedTabWidth.js +0 -90
  316. package/dist-es/tabs-next/hooks/useRenderedTabWidth.js.map +0 -1
  317. package/dist-es/tabs-next/hooks/useRenderedTabsRegistry.js +0 -198
  318. package/dist-es/tabs-next/hooks/useRenderedTabsRegistry.js.map +0 -1
  319. package/dist-es/tabs-next/hooks/useTabListRecovery.js +0 -74
  320. package/dist-es/tabs-next/hooks/useTabListRecovery.js.map +0 -1
  321. package/dist-es/tabs-next/hooks/useTabRemovalHandler.js +0 -163
  322. package/dist-es/tabs-next/hooks/useTabRemovalHandler.js.map +0 -1
  323. package/dist-es/tabs-next/hooks/useTabSelectionFocus.js +0 -78
  324. package/dist-es/tabs-next/hooks/useTabSelectionFocus.js.map +0 -1
  325. package/dist-es/tabs-next/widthMeasurement.js +0 -36
  326. package/dist-es/tabs-next/widthMeasurement.js.map +0 -1
  327. package/dist-types/rating/Rating.d.ts +0 -48
  328. package/dist-types/rating/RatingItem.d.ts +0 -47
  329. package/dist-types/rating/index.d.ts +0 -1
  330. package/dist-types/tabs-next/TabBar.d.ts +0 -12
  331. package/dist-types/tabs-next/TabListLayoutContext.d.ts +0 -9
  332. package/dist-types/tabs-next/TabListNext.d.ts +0 -12
  333. package/dist-types/tabs-next/TabNext.d.ts +0 -12
  334. package/dist-types/tabs-next/TabNextAction.d.ts +0 -4
  335. package/dist-types/tabs-next/TabNextContext.d.ts +0 -12
  336. package/dist-types/tabs-next/TabNextPanel.d.ts +0 -9
  337. package/dist-types/tabs-next/TabNextTrigger.d.ts +0 -4
  338. package/dist-types/tabs-next/TabOverflowList.d.ts +0 -10
  339. package/dist-types/tabs-next/TabSlot.d.ts +0 -6
  340. package/dist-types/tabs-next/TabSlotRegistryContext.d.ts +0 -5
  341. package/dist-types/tabs-next/TabsNext.d.ts +0 -18
  342. package/dist-types/tabs-next/TabsNextContext.d.ts +0 -43
  343. package/dist-types/tabs-next/domUtils.d.ts +0 -1
  344. package/dist-types/tabs-next/hooks/overflowMath.d.ts +0 -18
  345. package/dist-types/tabs-next/hooks/useCollection.d.ts +0 -30
  346. package/dist-types/tabs-next/hooks/useFocusWithRetry.d.ts +0 -9
  347. package/dist-types/tabs-next/hooks/useOverflow.d.ts +0 -11
  348. package/dist-types/tabs-next/hooks/useOverflowLayoutState.d.ts +0 -13
  349. package/dist-types/tabs-next/hooks/useOverflowSelectionState.d.ts +0 -13
  350. package/dist-types/tabs-next/hooks/useRenderedTabWidth.d.ts +0 -12
  351. package/dist-types/tabs-next/hooks/useRenderedTabsRegistry.d.ts +0 -12
  352. package/dist-types/tabs-next/hooks/useTabListRecovery.d.ts +0 -12
  353. package/dist-types/tabs-next/hooks/useTabRemovalHandler.d.ts +0 -32
  354. package/dist-types/tabs-next/hooks/useTabSelectionFocus.d.ts +0 -15
  355. package/dist-types/tabs-next/index.d.ts +0 -7
  356. package/dist-types/tabs-next/widthMeasurement.d.ts +0 -5
@@ -0,0 +1,8 @@
1
+ import { type ComponentPropsWithoutRef, type ReactNode } from "react";
2
+ export interface MegaMenuHeaderProps extends ComponentPropsWithoutRef<"div"> {
3
+ /**
4
+ * The content of the mega menu header.
5
+ */
6
+ children?: ReactNode;
7
+ }
8
+ export declare const MegaMenuHeader: import("react").ForwardRefExoticComponent<MegaMenuHeaderProps & import("react").RefAttributes<HTMLDivElement>>;
@@ -0,0 +1,12 @@
1
+ import { type AnchorHTMLAttributes, type ReactNode } from "react";
2
+ export interface MegaMenuItemProps extends AnchorHTMLAttributes<HTMLAnchorElement> {
3
+ /**
4
+ * The content of the mega menu item.
5
+ */
6
+ children?: ReactNode;
7
+ /**
8
+ * Href to be passed to the Link element.
9
+ */
10
+ href?: string;
11
+ }
12
+ export declare const MegaMenuItem: import("react").ForwardRefExoticComponent<MegaMenuItemProps & import("react").RefAttributes<HTMLLIElement>>;
@@ -0,0 +1,8 @@
1
+ import { type ComponentPropsWithoutRef, type ReactNode } from "react";
2
+ export interface MegaMenuItemContentProps extends ComponentPropsWithoutRef<"div"> {
3
+ /**
4
+ * The content of Mega Menu Item.
5
+ */
6
+ children?: ReactNode;
7
+ }
8
+ export declare const MegaMenuItemContent: import("react").ForwardRefExoticComponent<MegaMenuItemContentProps & import("react").RefAttributes<HTMLDivElement>>;
@@ -0,0 +1,8 @@
1
+ import { type HTMLAttributes, type ReactNode } from "react";
2
+ export interface MegaMenuPanelProps extends HTMLAttributes<HTMLDivElement> {
3
+ /**
4
+ * The content of the mega menu panel.
5
+ */
6
+ children?: ReactNode;
7
+ }
8
+ export declare const MegaMenuPanel: import("react").ForwardRefExoticComponent<MegaMenuPanelProps & import("react").RefAttributes<HTMLDivElement>>;
@@ -0,0 +1,8 @@
1
+ import { type HTMLAttributes, type ReactNode } from "react";
2
+ export interface MegaMenuSectionProps extends HTMLAttributes<HTMLDivElement> {
3
+ /**
4
+ * The content of the mega menu section.
5
+ */
6
+ children?: ReactNode;
7
+ }
8
+ export declare const MegaMenuSection: import("react").ForwardRefExoticComponent<MegaMenuSectionProps & import("react").RefAttributes<HTMLDivElement>>;
@@ -0,0 +1,8 @@
1
+ import { type ReactNode } from "react";
2
+ export interface MegaMenuTriggerProps {
3
+ /**
4
+ * The trigger element for the mega menu, typically a `NavigationItem` or `Button`.
5
+ */
6
+ children?: ReactNode;
7
+ }
8
+ export declare const MegaMenuTrigger: import("react").ForwardRefExoticComponent<MegaMenuTriggerProps & import("react").RefAttributes<HTMLElement>>;
@@ -0,0 +1,9 @@
1
+ export * from "./MegaMenu";
2
+ export * from "./MegaMenuContent";
3
+ export * from "./MegaMenuGroup";
4
+ export * from "./MegaMenuHeader";
5
+ export * from "./MegaMenuItem";
6
+ export * from "./MegaMenuItemContent";
7
+ export * from "./MegaMenuPanel";
8
+ export * from "./MegaMenuSection";
9
+ export * from "./MegaMenuTrigger";
@@ -0,0 +1,6 @@
1
+ import { type MegaMenuContextValue } from "./MegaMenuContext";
2
+ /**
3
+ * Access the nearest MegaMenu context.
4
+ * Must be used within a `MegaMenu` provider.
5
+ */
6
+ export declare function useMegaMenu(): MegaMenuContextValue;
@@ -0,0 +1,30 @@
1
+ import type { ElementProps, FloatingRootContext } from "@floating-ui/react";
2
+ export declare const FOCUSABLE_SELECTOR = "a[href], button:not([disabled]), [tabindex]:not([tabindex=\"-1\"])";
3
+ export interface UseMegaMenuKeyboardProps {
4
+ /**
5
+ * Whether the interaction is enabled.
6
+ * @default true
7
+ */
8
+ enabled?: boolean;
9
+ }
10
+ /**
11
+ * Floating-ui custom interaction hook for mega menu grid keyboard navigation.
12
+ *
13
+ * Returns `ElementProps` that get merged via `useInteractions`, handling
14
+ * keyboard events on both the reference (trigger) and floating (panel) elements.
15
+ *
16
+ * - **↑ / ↓** move within the current column.
17
+ * - **← / →** jump to the top of the previous / next column.
18
+ * - **Tab / Shift+Tab** move linearly through every item.
19
+ * - **Home / End** jump to the first / last item in the column.
20
+ * - **↑ from the first item** or **← from the first column** returns
21
+ * focus to the trigger.
22
+ * - **→ from the last column** closes the panel and moves focus to the
23
+ * next sibling trigger.
24
+ */
25
+ export declare function useMegaMenuKeyboard(context: FloatingRootContext, props?: UseMegaMenuKeyboardProps): ElementProps;
26
+ /**
27
+ * Focus the first navigable item inside a mega menu panel.
28
+ * Retries with `requestAnimationFrame` if content has not yet rendered.
29
+ */
30
+ export declare function focusFirstItem(panel: HTMLElement, attempt?: number): void;
@@ -0,0 +1,2 @@
1
+ import { type ButtonProps } from "@salt-ds/core";
2
+ export declare const SidePanelCloseButton: import("react").ForwardRefExoticComponent<ButtonProps & import("react").RefAttributes<HTMLButtonElement>>;
@@ -1,5 +1,4 @@
1
- import { type ComponentPropsWithoutRef, type ReactNode } from "react";
1
+ import { type ComponentPropsWithoutRef } from "react";
2
2
  export interface SidePanelTriggerProps extends ComponentPropsWithoutRef<"button"> {
3
- children?: ReactNode;
4
3
  }
5
4
  export declare const SidePanelTrigger: import("react").ForwardRefExoticComponent<SidePanelTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
@@ -1,4 +1,5 @@
1
1
  export * from "./SidePanel";
2
+ export * from "./SidePanelCloseButton";
2
3
  export * from "./SidePanelContent";
3
4
  export * from "./SidePanelHeader";
4
5
  export * from "./SidePanelProvider";
@@ -43,6 +43,14 @@ export interface SidePanelContextValue {
43
43
  * so that SidePanel and SidePanelContent can use it for aria-labelledby.
44
44
  */
45
45
  setTitleId: Dispatch<SetStateAction<string | undefined>>;
46
+ /**
47
+ * Edge the panel is anchored to.
48
+ */
49
+ position?: "right" | "left";
50
+ /**
51
+ * Registers the position from SidePanel back to the context.
52
+ */
53
+ setPosition: Dispatch<SetStateAction<"right" | "left" | undefined>>;
46
54
  }
47
55
  export declare const SidePanelContext: import("react").Context<SidePanelContextValue>;
48
56
  export declare function useSidePanelContext(): SidePanelContextValue;
@@ -1 +1,3 @@
1
1
  export { SidePanelContext, type SidePanelContextValue, useSidePanelContext, } from "./SidePanelContext";
2
+ export * from "./useIsScrollable";
3
+ export * from "./useSidePanelTabOrder";
@@ -0,0 +1,2 @@
1
+ import { type RefObject } from "react";
2
+ export declare function useIsScrollable(ref: RefObject<HTMLElement>): boolean;
@@ -0,0 +1,7 @@
1
+ interface UseSidePanelTabOrderProps {
2
+ floating: HTMLElement | null;
3
+ open: boolean;
4
+ reference: HTMLElement | null;
5
+ }
6
+ export declare function useSidePanelTabOrder(props: UseSidePanelTabOrderProps): void;
7
+ export {};
@@ -8,10 +8,17 @@ export interface SidePanelValue {
8
8
  */
9
9
  setOpen: (open: boolean) => void;
10
10
  /**
11
- * Props getter for a single trigger element.
12
- * Merges `aria-expanded`, `aria-controls`, a `ref` callback (to register
13
- * the trigger for focus-return), and user-provided props.
14
- * Best for the common case where one button toggles one panel.
11
+ * Props getter for a trigger element outside of `SidePanelTrigger`.
12
+ * Returns `aria-expanded`, `aria-controls`, a `ref` (for focus-return),
13
+ * and an `onClick` that toggles the panel.
14
+ *
15
+ * Spread the result onto a Button to get full trigger behavior:
16
+ * ```tsx
17
+ * <Button {...getTriggerProps()}>Toggle panel</Button>
18
+ * ```
19
+ *
20
+ * You can pass additional props which are merged in. If you provide your
21
+ * own `onClick`, it runs before the built-in toggle.
15
22
  *
16
23
  * For multi-trigger scenarios (e.g. table rows), use `setTriggerRef` and
17
24
  * manage ARIA attributes yourself instead.
@@ -1,4 +1,4 @@
1
- import { type Dispatch, type ReactNode, type SetStateAction, type SyntheticEvent } from "react";
1
+ import { type Dispatch, type ReactNode, type Ref, type RefObject, type SetStateAction, type SyntheticEvent } from "react";
2
2
  import type { TreeModel, TreeNodeMeta } from "./useTree";
3
3
  export interface TreeContextValue {
4
4
  expandedState: Set<string>;
@@ -10,6 +10,8 @@ export interface TreeContextValue {
10
10
  selectedSet: Set<string>;
11
11
  /** Set selected state directly */
12
12
  setSelectedState: Dispatch<SetStateAction<string[]>>;
13
+ /** Set selected state without expanding selection through hidden descendants */
14
+ setVisibleSelectionState: (selected: string[]) => void;
13
15
  /** Select node */
14
16
  select: (event: SyntheticEvent, value: string) => void;
15
17
  /** Whether multiselect mode with checkboxes is enabled */
@@ -60,6 +62,10 @@ export interface TreeNodeContextValue {
60
62
  disabled: boolean;
61
63
  /** Node id for the li element */
62
64
  id: string;
65
+ /** Ref for the li element rendered by TreeNodeTrigger */
66
+ nodeRef: RefObject<HTMLLIElement>;
67
+ /** Callback ref that connects TreeNode's forwarded ref to the li element */
68
+ setNodeRef: Ref<HTMLLIElement> | null;
63
69
  /** Whether node is selected */
64
70
  selected: boolean;
65
71
  /** Whether node is in indeterminate state (partially selected children) */
@@ -0,0 +1,24 @@
1
+ import { type ReactElement, type ReactNode } from "react";
2
+ export interface TreeNodeMeta {
3
+ value: string;
4
+ parentValue: string | undefined;
5
+ hasChildren: boolean;
6
+ disabled: boolean;
7
+ }
8
+ export interface TreeModel {
9
+ /** All nodes indexed by value */
10
+ nodes: Map<string, TreeNodeMeta>;
11
+ /** Ordered list of root node values */
12
+ rootValues: string[];
13
+ /** Maps parent value to ordered list of child values */
14
+ childrenOf: Map<string, string[]>;
15
+ }
16
+ interface TreeNodeElementProps {
17
+ value: string;
18
+ disabled?: boolean;
19
+ children?: ReactNode;
20
+ }
21
+ export declare function isTreeNodeElement(child: ReactNode): child is ReactElement<TreeNodeElementProps>;
22
+ export declare function flattenTreeNodeChildren(children: ReactNode): ReactNode[];
23
+ export declare function buildTreeModel(children: ReactNode): TreeModel;
24
+ export {};
@@ -1,4 +1,6 @@
1
1
  import { type ReactNode, type SyntheticEvent } from "react";
2
+ import { type TreeModel, type TreeNodeMeta } from "./treeModel";
3
+ export type { TreeModel, TreeNodeMeta } from "./treeModel";
2
4
  export interface UseTreeProps {
3
5
  /**
4
6
  * Default expanded nodes (uncontrolled)
@@ -37,20 +39,6 @@ export interface UseTreeProps {
37
39
  */
38
40
  children?: ReactNode;
39
41
  }
40
- export interface TreeNodeMeta {
41
- value: string;
42
- parentValue: string | undefined;
43
- hasChildren: boolean;
44
- disabled: boolean;
45
- }
46
- export interface TreeModel {
47
- /** All nodes indexed by value */
48
- nodes: Map<string, TreeNodeMeta>;
49
- /** Ordered list of root node values */
50
- rootValues: string[];
51
- /** Maps parent value to ordered list of child values */
52
- childrenOf: Map<string, string[]>;
53
- }
54
42
  export declare function useTree(props: UseTreeProps): {
55
43
  expandedArray: string[];
56
44
  setExpandedArray: import("react").Dispatch<import("react").SetStateAction<string[]>>;
@@ -59,6 +47,7 @@ export declare function useTree(props: UseTreeProps): {
59
47
  selectedState: string[];
60
48
  selectedSet: Set<string>;
61
49
  setSelectedState: import("react").Dispatch<import("react").SetStateAction<string[]>>;
50
+ setVisibleSelectionState: (selection: string[]) => void;
62
51
  select: (event: SyntheticEvent, value: string) => void;
63
52
  multiselect: boolean;
64
53
  disabled: boolean;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@salt-ds/lab",
3
- "version": "1.0.0-alpha.90",
3
+ "version": "1.0.0-alpha.91",
4
4
  "license": "Apache-2.0",
5
5
  "repository": {
6
6
  "type": "git",
@@ -21,7 +21,7 @@
21
21
  ],
22
22
  "dependencies": {
23
23
  "@floating-ui/react": "^0.26.28",
24
- "@salt-ds/core": "^1.60.0",
24
+ "@salt-ds/core": "^1.61.0",
25
25
  "@salt-ds/date-components": "0.1.0",
26
26
  "@salt-ds/icons": "^1.18.0",
27
27
  "@salt-ds/styles": "0.3.0",
@@ -31,11 +31,9 @@
31
31
  "clsx": "^2.0.0",
32
32
  "compute-scroll-into-view": "^3.0.0",
33
33
  "deepmerge": "^4.2.2",
34
- "dom-accessibility-api": "^0.7.1",
35
34
  "react-color": "^2.19.3",
36
35
  "react-window": "^1.8.6",
37
36
  "rifm": "^0.12.0",
38
- "tabbable": "^6.0.0",
39
37
  "tinycolor2": "^1.4.2"
40
38
  },
41
39
  "peerDependencies": {
@@ -1,6 +0,0 @@
1
- 'use strict';
2
-
3
- var css_248z = ".saltRating {\n display: inline-flex;\n box-sizing: border-box;\n}\n\n.saltFormField .saltRating-container {\n height: var(--salt-size-base);\n padding-top: calc(var(--salt-spacing-100) + var(--salt-spacing-fixed-100));\n}\n\n.saltFormField .saltRating-label {\n min-height: var(--salt-size-base);\n padding-top: var(--salt-spacing-100);\n}\n\n.saltRating-labelBottom {\n flex-direction: column;\n align-items: flex-start;\n gap: var(--salt-spacing-75);\n}\n\n.saltRating-labelRight {\n flex-direction: row;\n gap: var(--salt-spacing-150);\n}\n\n.saltRating-container {\n display: flex;\n flex-direction: row;\n gap: var(--salt-spacing-150);\n flex-wrap: nowrap;\n justify-content: flex-start;\n padding-top: var(--salt-spacing-fixed-100);\n padding-bottom: var(--salt-spacing-fixed-100);\n box-sizing: border-box;\n}\n\n.saltRating-label {\n color: var(--salt-content-primary-foreground);\n font-family: var(--salt-text-fontFamily);\n font-size: var(--salt-text-fontSize);\n font-weight: var(--salt-text-fontWeight);\n line-height: var(--salt-text-lineHeight);\n box-sizing: border-box;\n}\n";
4
-
5
- module.exports = css_248z;
6
- //# sourceMappingURL=Rating.css.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Rating.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
@@ -1,132 +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 Rating$1 = require('./Rating.css.js');
10
- var RatingItem = require('./RatingItem.js');
11
-
12
- const withBaseName = core.makePrefixer("saltRating");
13
- const defaultGetLabel = (value) => `${value} Star${value > 1 ? "s" : ""}`;
14
- const Rating = react.forwardRef(function Rating2({
15
- value: valueProp,
16
- defaultValue = 0,
17
- name: nameProp,
18
- onChange,
19
- className,
20
- readOnly: readOnlyProp,
21
- disabled: disabledProp,
22
- max = 5,
23
- getLabel = defaultGetLabel,
24
- getVisibleLabel,
25
- labelPlacement = "right",
26
- "aria-label": ariaLabel,
27
- "aria-labelledby": ariaLabelledBy,
28
- "aria-describedby": ariaDescribedBy,
29
- ...restProps
30
- }, ref) {
31
- const targetWindow = window.useWindow();
32
- styles.useComponentCssInjection({
33
- testId: "salt-rating",
34
- css: Rating$1,
35
- window: targetWindow
36
- });
37
- const {
38
- disabled: formFieldDisabled,
39
- readOnly: formFieldReadOnly,
40
- a11yProps: {
41
- "aria-describedby": formFieldDescribedBy,
42
- "aria-labelledby": formFieldLabelledBy
43
- } = {}
44
- } = core.useFormFieldProps();
45
- const disabled = formFieldDisabled || disabledProp;
46
- const readOnly = formFieldReadOnly || readOnlyProp;
47
- const [hoveredValue, setHoveredValue] = react.useState(0);
48
- const [selected, setSelected] = core.useControlled({
49
- controlled: valueProp,
50
- default: defaultValue,
51
- name: "Rating",
52
- state: "value"
53
- });
54
- const name = core.useId(nameProp);
55
- const handleMouseEnter = (event) => {
56
- if (readOnly || disabled) return;
57
- const itemValue = Number.parseInt(event.currentTarget.value, 10);
58
- setHoveredValue(itemValue);
59
- };
60
- const handleChange = (event) => {
61
- if (readOnly) {
62
- event.preventDefault();
63
- return;
64
- }
65
- const itemValue = Number.parseInt(event.currentTarget.value, 10);
66
- setSelected(itemValue);
67
- onChange == null ? void 0 : onChange(event, itemValue);
68
- };
69
- return /* @__PURE__ */ jsxRuntime.jsxs(
70
- "div",
71
- {
72
- ref,
73
- className: clsx.clsx(
74
- withBaseName(),
75
- withBaseName(`label${core.capitalize(labelPlacement)}`),
76
- className
77
- ),
78
- ...restProps,
79
- children: [
80
- /* @__PURE__ */ jsxRuntime.jsx(
81
- "div",
82
- {
83
- role: "radiogroup",
84
- className: withBaseName("container"),
85
- "aria-readonly": readOnly || void 0,
86
- "aria-label": ariaLabel,
87
- "aria-labelledby": clsx.clsx(formFieldLabelledBy, ariaLabelledBy) || void 0,
88
- "aria-describedby": clsx.clsx(formFieldDescribedBy, ariaDescribedBy) || void 0,
89
- onMouseLeave: () => setHoveredValue(0),
90
- children: Array.from({ length: max }, (_, index) => {
91
- const itemValue = index + 1;
92
- const isHovered = hoveredValue > 0 && itemValue <= hoveredValue;
93
- const isSelected = hoveredValue === 0 && itemValue <= selected;
94
- const isUnselecting = hoveredValue > 0 && itemValue > hoveredValue && itemValue <= selected;
95
- return /* @__PURE__ */ jsxRuntime.jsx(
96
- RatingItem.RatingItem,
97
- {
98
- currentRating: selected,
99
- isHovered,
100
- isSelected,
101
- isUnselecting,
102
- onMouseEnter: handleMouseEnter,
103
- onChange: handleChange,
104
- value: itemValue,
105
- readOnly,
106
- disabled,
107
- name,
108
- "aria-label": getLabel == null ? void 0 : getLabel(itemValue)
109
- },
110
- itemValue
111
- );
112
- })
113
- }
114
- ),
115
- getVisibleLabel && /* @__PURE__ */ jsxRuntime.jsx(
116
- "div",
117
- {
118
- className: clsx.clsx(
119
- withBaseName("label"),
120
- withBaseName(`label-${labelPlacement}`)
121
- ),
122
- "aria-hidden": true,
123
- children: getVisibleLabel(hoveredValue || selected, max)
124
- }
125
- )
126
- ]
127
- }
128
- );
129
- });
130
-
131
- exports.Rating = Rating;
132
- //# sourceMappingURL=Rating.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Rating.js","sources":["../src/rating/Rating.tsx"],"sourcesContent":["import {\n capitalize,\n makePrefixer,\n useControlled,\n useFormFieldProps,\n useId,\n} from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type ChangeEvent,\n type ComponentPropsWithoutRef,\n forwardRef,\n type MouseEvent,\n useState,\n} from \"react\";\nimport ratingCss from \"./Rating.css\";\nimport { RatingItem } from \"./RatingItem\";\n\nconst withBaseName = makePrefixer(\"saltRating\");\n\nexport interface RatingProps\n extends Omit<ComponentPropsWithoutRef<\"div\">, \"onChange\"> {\n /**\n * When provided, the component is controlled.\n */\n value?: number;\n /**\n * Default rating value for uncontrolled mode.\n * @default 0\n */\n defaultValue?: number;\n /**\n * Callback function for rating change.\n * The first parameter is the event, and the second is the selected rating value.\n */\n onChange?: (event: ChangeEvent<HTMLInputElement>, value: number) => void;\n /**\n * If true, the rating component will be in a read-only state.\n */\n readOnly?: boolean;\n /**\n * If true, the rating component will be in a disabled state.\n */\n disabled?: boolean;\n /**\n * Total number of icons displayed.\n * @default 5\n */\n max?: number;\n /**\n * Function used to provide a user-friendly name for the current value of the rating. Primarily used by screen readers.\n */\n getLabel?: (value: number) => string;\n /**\n * Function used to provide a visible label for the rating.\n */\n getVisibleLabel?: (value: number, max: number) => string;\n /**\n * Position of the label relative to the rating component.\n * @default \"right\"\n */\n labelPlacement?: \"right\" | \"bottom\";\n /**\n * The name to be set on each radio button within the group. If not set, then one will be generated for you.\n */\n name?: string;\n}\n\nconst defaultGetLabel = (value: number) =>\n `${value} Star${value > 1 ? \"s\" : \"\"}`;\n\nexport const Rating = forwardRef<HTMLDivElement, RatingProps>(function Rating(\n {\n value: valueProp,\n defaultValue = 0,\n name: nameProp,\n onChange,\n className,\n readOnly: readOnlyProp,\n disabled: disabledProp,\n max = 5,\n getLabel = defaultGetLabel,\n getVisibleLabel,\n labelPlacement = \"right\",\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-describedby\": ariaDescribedBy,\n ...restProps\n },\n ref,\n) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-rating\",\n css: ratingCss,\n window: targetWindow,\n });\n const {\n disabled: formFieldDisabled,\n readOnly: formFieldReadOnly,\n a11yProps: {\n \"aria-describedby\": formFieldDescribedBy,\n \"aria-labelledby\": formFieldLabelledBy,\n } = {},\n } = useFormFieldProps();\n\n const disabled = formFieldDisabled || disabledProp;\n const readOnly = formFieldReadOnly || readOnlyProp;\n\n const [hoveredValue, setHoveredValue] = useState(0);\n const [selected, setSelected] = useControlled({\n controlled: valueProp,\n default: defaultValue,\n name: \"Rating\",\n state: \"value\",\n });\n const name = useId(nameProp);\n\n const handleMouseEnter = (event: MouseEvent<HTMLInputElement>) => {\n if (readOnly || disabled) return;\n const itemValue = Number.parseInt(event.currentTarget.value, 10);\n setHoveredValue(itemValue);\n };\n\n const handleChange = (event: ChangeEvent<HTMLInputElement>) => {\n if (readOnly) {\n event.preventDefault();\n return;\n }\n\n const itemValue = Number.parseInt(event.currentTarget.value, 10);\n setSelected(itemValue);\n onChange?.(event, itemValue);\n };\n\n return (\n <div\n ref={ref}\n className={clsx(\n withBaseName(),\n withBaseName(`label${capitalize(labelPlacement)}`),\n className,\n )}\n {...restProps}\n >\n <div\n role=\"radiogroup\"\n className={withBaseName(\"container\")}\n aria-readonly={readOnly || undefined}\n aria-label={ariaLabel}\n aria-labelledby={clsx(formFieldLabelledBy, ariaLabelledBy) || undefined}\n aria-describedby={\n clsx(formFieldDescribedBy, ariaDescribedBy) || undefined\n }\n onMouseLeave={() => setHoveredValue(0)}\n >\n {Array.from({ length: max }, (_, index) => {\n const itemValue = index + 1;\n const isHovered = hoveredValue > 0 && itemValue <= hoveredValue;\n const isSelected = hoveredValue === 0 && itemValue <= selected;\n const isUnselecting =\n hoveredValue > 0 &&\n itemValue > hoveredValue &&\n itemValue <= selected;\n return (\n <RatingItem\n key={itemValue}\n currentRating={selected}\n isHovered={isHovered}\n isSelected={isSelected}\n isUnselecting={isUnselecting}\n onMouseEnter={handleMouseEnter}\n onChange={handleChange}\n value={itemValue}\n readOnly={readOnly}\n disabled={disabled}\n name={name}\n aria-label={getLabel?.(itemValue)}\n />\n );\n })}\n </div>\n {getVisibleLabel && (\n <div\n className={clsx(\n withBaseName(\"label\"),\n withBaseName(`label-${labelPlacement}`),\n )}\n aria-hidden\n >\n {getVisibleLabel(hoveredValue || selected, max)}\n </div>\n )}\n </div>\n );\n});\n"],"names":["makePrefixer","forwardRef","Rating","useWindow","useComponentCssInjection","ratingCss","useFormFieldProps","useState","useControlled","useId","jsxs","clsx","capitalize","jsx","RatingItem"],"mappings":"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"}
@@ -1,6 +0,0 @@
1
- 'use strict';
2
-
3
- var css_248z = ".saltRatingItem {\n height: var(--salt-size-icon);\n width: var(--salt-size-icon);\n display: flex;\n position: relative;\n align-items: center;\n justify-content: center;\n cursor: var(--salt-cursor-hover);\n}\n\n.saltRatingItem-disabled,\n.saltRatingItem-readOnly {\n cursor: default;\n}\n\n.saltRatingItem-input {\n position: absolute;\n opacity: 0;\n width: 100%;\n height: 100%;\n margin: 0;\n cursor: inherit;\n z-index: 1;\n}\n\n.saltRatingItem-input::before {\n content: \"\";\n position: absolute;\n width: 100%;\n height: 100%;\n padding: var(--salt-spacing-fixed-600);\n transform: translate(-50%, -50%);\n top: 50%;\n left: 50%;\n box-sizing: content-box;\n}\n\n.saltRatingItem-icon {\n pointer-events: none;\n display: flex;\n align-items: center;\n justify-content: center;\n color: var(--salt-sentiment-neutral-dataviz);\n}\n\n.saltRatingItem-icon .saltIcon {\n --saltIcon-size: var(--salt-size-icon);\n}\n\n.saltRatingItem-input:focus-visible ~ .saltRatingItem-icon::after {\n content: \"\";\n position: absolute;\n width: 100%;\n height: 100%;\n padding: var(--salt-spacing-fixed-600);\n transform: translate(-50%, -50%);\n top: 50%;\n left: 50%;\n box-sizing: content-box;\n\n border-radius: var(--salt-palette-corner-strongest);\n outline: var(--salt-focused-outline);\n outline-offset: calc(-1 * var(--salt-spacing-fixed-200));\n}\n\n.saltRatingItem-disabled {\n cursor: var(--salt-cursor-disabled);\n opacity: var(--salt-palette-opacity-disabled);\n}\n\n.saltRatingItem-disabled .saltRatingItem-input {\n cursor: var(--salt-cursor-disabled);\n}\n\n.saltRatingItem-selected .saltRatingItem-icon,\n.saltRatingItem-hovered .saltRatingItem-icon,\n.saltRatingItem-unselecting .saltRatingItem-icon {\n color: var(--salt-sentiment-accent-dataviz);\n}\n";
4
-
5
- module.exports = css_248z;
6
- //# sourceMappingURL=RatingItem.css.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"RatingItem.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
@@ -1,70 +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 RatingItem$1 = require('./RatingItem.css.js');
10
-
11
- const withBaseName = core.makePrefixer("saltRatingItem");
12
- const RatingItem = react.forwardRef(
13
- function RatingItem2(props, ref) {
14
- const {
15
- "aria-label": ariaLabel,
16
- value,
17
- currentRating,
18
- isHovered,
19
- isSelected,
20
- isUnselecting,
21
- onMouseEnter,
22
- onChange,
23
- readOnly = false,
24
- disabled = false,
25
- name
26
- } = props;
27
- const { RatingIcon, RatingSelectedIcon, RatingUnselectingIcon } = core.useIcon();
28
- const targetWindow = window.useWindow();
29
- styles.useComponentCssInjection({
30
- testId: "salt-rating-item",
31
- css: RatingItem$1,
32
- window: targetWindow
33
- });
34
- const icon = isHovered || isSelected ? /* @__PURE__ */ jsxRuntime.jsx(RatingSelectedIcon, { "aria-hidden": true }) : isUnselecting ? /* @__PURE__ */ jsxRuntime.jsx(RatingUnselectingIcon, { "aria-hidden": true }) : /* @__PURE__ */ jsxRuntime.jsx(RatingIcon, { "aria-hidden": true });
35
- return /* @__PURE__ */ jsxRuntime.jsxs(
36
- "div",
37
- {
38
- className: clsx.clsx(withBaseName(), {
39
- [withBaseName("hovered")]: isHovered,
40
- [withBaseName("selected")]: isSelected,
41
- [withBaseName("unselecting")]: isUnselecting,
42
- [withBaseName("disabled")]: disabled,
43
- [withBaseName("readOnly")]: readOnly
44
- }),
45
- children: [
46
- /* @__PURE__ */ jsxRuntime.jsx(
47
- "input",
48
- {
49
- ref,
50
- type: "radio",
51
- name,
52
- value,
53
- checked: currentRating === value,
54
- onChange,
55
- onMouseEnter,
56
- disabled,
57
- readOnly,
58
- className: withBaseName("input"),
59
- "aria-label": ariaLabel
60
- }
61
- ),
62
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: withBaseName("icon"), "aria-hidden": true, children: icon })
63
- ]
64
- }
65
- );
66
- }
67
- );
68
-
69
- exports.RatingItem = RatingItem;
70
- //# sourceMappingURL=RatingItem.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"RatingItem.js","sources":["../src/rating/RatingItem.tsx"],"sourcesContent":["import { makePrefixer, useIcon } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type ChangeEvent,\n type ComponentPropsWithoutRef,\n forwardRef,\n type MouseEvent,\n} from \"react\";\nimport ratingItemCss from \"./RatingItem.css\";\n\nconst withBaseName = makePrefixer(\"saltRatingItem\");\n\nexport interface RatingItemProps extends ComponentPropsWithoutRef<\"div\"> {\n /**\n * specifies the value of the feedback item.\n */\n value: number;\n /**\n * To define if the current star is being hovered.\n */\n isHovered?: boolean;\n /**\n * To specify if the item is selected.\n */\n isSelected?: boolean;\n /**\n * defines the current selected rating.\n */\n currentRating?: number;\n /**\n * callback function when feedback item is hovered.\n */\n onMouseEnter: (event: MouseEvent<HTMLInputElement>) => void;\n /**\n * callback function when feedback item is clicked.\n */\n onChange: (event: ChangeEvent<HTMLInputElement>) => void;\n /**\n * If true, the rating item will be in a read-only state.\n */\n readOnly?: boolean;\n /**\n * If true, the rating item will be in a disabled state.\n */\n disabled?: boolean;\n /**\n * Indicates whether the current rating item is in an active state.\n * An active state typically means that the item is visually highlighted\n * or styled differently to indicate that it is part of the current selection\n * or interaction (e.g., hover or focus).\n */\n isUnselecting?: boolean;\n /**\n * Name of the radio group\n */\n name?: string;\n}\n\nexport const RatingItem = forwardRef<HTMLInputElement, RatingItemProps>(\n function RatingItem(props, ref) {\n const {\n \"aria-label\": ariaLabel,\n value,\n currentRating,\n isHovered,\n isSelected,\n isUnselecting,\n onMouseEnter,\n onChange,\n readOnly = false,\n disabled = false,\n name,\n } = props;\n\n const { RatingIcon, RatingSelectedIcon, RatingUnselectingIcon } = useIcon();\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-rating-item\",\n css: ratingItemCss,\n window: targetWindow,\n });\n\n const icon =\n isHovered || isSelected ? (\n <RatingSelectedIcon aria-hidden />\n ) : isUnselecting ? (\n <RatingUnselectingIcon aria-hidden />\n ) : (\n <RatingIcon aria-hidden />\n );\n\n return (\n <div\n className={clsx(withBaseName(), {\n [withBaseName(\"hovered\")]: isHovered,\n [withBaseName(\"selected\")]: isSelected,\n [withBaseName(\"unselecting\")]: isUnselecting,\n [withBaseName(\"disabled\")]: disabled,\n [withBaseName(\"readOnly\")]: readOnly,\n })}\n >\n <input\n ref={ref}\n type=\"radio\"\n name={name}\n value={value}\n checked={currentRating === value}\n onChange={onChange}\n onMouseEnter={onMouseEnter}\n disabled={disabled}\n readOnly={readOnly}\n className={withBaseName(\"input\")}\n aria-label={ariaLabel}\n />\n <span className={withBaseName(\"icon\")} aria-hidden>\n {icon}\n </span>\n </div>\n );\n },\n);\n"],"names":["makePrefixer","forwardRef","RatingItem","useIcon","useWindow","useComponentCssInjection","ratingItemCss","jsx","jsxs","clsx"],"mappings":";;;;;;;;;;AAYA,MAAM,YAAA,GAAeA,kBAAa,gBAAgB,CAAA;AAgD3C,MAAM,UAAA,GAAaC,gBAAA;AAAA,EACxB,SAASC,WAAAA,CAAW,KAAA,EAAO,GAAA,EAAK;AAC9B,IAAA,MAAM;AAAA,MACJ,YAAA,EAAc,SAAA;AAAA,MACd,KAAA;AAAA,MACA,aAAA;AAAA,MACA,SAAA;AAAA,MACA,UAAA;AAAA,MACA,aAAA;AAAA,MACA,YAAA;AAAA,MACA,QAAA;AAAA,MACA,QAAA,GAAW,KAAA;AAAA,MACX,QAAA,GAAW,KAAA;AAAA,MACX;AAAA,KACF,GAAI,KAAA;AAEJ,IAAA,MAAM,EAAE,UAAA,EAAY,kBAAA,EAAoB,qBAAA,KAA0BC,YAAA,EAAQ;AAE1E,IAAA,MAAM,eAAeC,gBAAA,EAAU;AAC/B,IAAAC,+BAAA,CAAyB;AAAA,MACvB,MAAA,EAAQ,kBAAA;AAAA,MACR,GAAA,EAAKC,YAAA;AAAA,MACL,MAAA,EAAQ;AAAA,KACT,CAAA;AAED,IAAA,MAAM,OACJ,SAAA,IAAa,UAAA,mBACXC,cAAA,CAAC,kBAAA,EAAA,EAAmB,eAAW,IAAA,EAAC,CAAA,GAC9B,aAAA,mBACFA,cAAA,CAAC,yBAAsB,aAAA,EAAW,IAAA,EAAC,oBAEnCA,cAAA,CAAC,UAAA,EAAA,EAAW,eAAW,IAAA,EAAC,CAAA;AAG5B,IAAA,uBACEC,eAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAWC,SAAA,CAAK,YAAA,EAAa,EAAG;AAAA,UAC9B,CAAC,YAAA,CAAa,SAAS,CAAC,GAAG,SAAA;AAAA,UAC3B,CAAC,YAAA,CAAa,UAAU,CAAC,GAAG,UAAA;AAAA,UAC5B,CAAC,YAAA,CAAa,aAAa,CAAC,GAAG,aAAA;AAAA,UAC/B,CAAC,YAAA,CAAa,UAAU,CAAC,GAAG,QAAA;AAAA,UAC5B,CAAC,YAAA,CAAa,UAAU,CAAC,GAAG;AAAA,SAC7B,CAAA;AAAA,QAED,QAAA,EAAA;AAAA,0BAAAF,cAAA;AAAA,YAAC,OAAA;AAAA,YAAA;AAAA,cACC,GAAA;AAAA,cACA,IAAA,EAAK,OAAA;AAAA,cACL,IAAA;AAAA,cACA,KAAA;AAAA,cACA,SAAS,aAAA,KAAkB,KAAA;AAAA,cAC3B,QAAA;AAAA,cACA,YAAA;AAAA,cACA,QAAA;AAAA,cACA,QAAA;AAAA,cACA,SAAA,EAAW,aAAa,OAAO,CAAA;AAAA,cAC/B,YAAA,EAAY;AAAA;AAAA,WACd;AAAA,0BACAA,cAAA,CAAC,UAAK,SAAA,EAAW,YAAA,CAAa,MAAM,CAAA,EAAG,aAAA,EAAW,MAC/C,QAAA,EAAA,IAAA,EACH;AAAA;AAAA;AAAA,KACF;AAAA,EAEJ;AACF;;;;"}
@@ -1,6 +0,0 @@
1
- 'use strict';
2
-
3
- var css_248z = ".saltTabBar {\n display: flex;\n align-items: center;\n flex-direction: row;\n position: relative;\n box-sizing: border-box;\n min-width: 0;\n max-width: 100%;\n}\n\n.saltTabBar-strip {\n display: flex;\n align-items: center;\n flex-direction: row;\n flex: 1 1 auto;\n gap: var(--salt-spacing-100);\n box-sizing: border-box;\n min-width: 0;\n max-width: 100%;\n}\n\n.saltTabBar-divider::before {\n content: \"\";\n position: absolute;\n inset: auto 0 0 0;\n height: var(--salt-size-fixed-100);\n border-bottom: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--salt-separable-secondary-borderColor);\n}\n\n.saltTabBar-inset {\n padding-left: var(--salt-spacing-300);\n padding-right: var(--salt-spacing-300);\n}\n";
4
-
5
- module.exports = css_248z;
6
- //# sourceMappingURL=TabBar.css.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"TabBar.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
@@ -1,41 +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 TabBar$1 = require('./TabBar.css.js');
10
-
11
- const withBaseName = core.makePrefixer("saltTabBar");
12
- const TabBar = react.forwardRef(
13
- function TabBar2(props, ref) {
14
- const { className, children, divider, inset, ...rest } = props;
15
- const targetWindow = window.useWindow();
16
- styles.useComponentCssInjection({
17
- testId: "salt-tab-bar",
18
- css: TabBar$1,
19
- window: targetWindow
20
- });
21
- return /* @__PURE__ */ jsxRuntime.jsx(
22
- "div",
23
- {
24
- className: clsx.clsx(
25
- withBaseName(),
26
- {
27
- [withBaseName("divider")]: divider,
28
- [withBaseName("inset")]: inset
29
- },
30
- className
31
- ),
32
- ...rest,
33
- ref,
34
- children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: withBaseName("strip"), children })
35
- }
36
- );
37
- }
38
- );
39
-
40
- exports.TabBar = TabBar;
41
- //# sourceMappingURL=TabBar.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"TabBar.js","sources":["../src/tabs-next/TabBar.tsx"],"sourcesContent":["import { makePrefixer } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { type ComponentPropsWithRef, forwardRef } from \"react\";\nimport tabBarCss from \"./TabBar.css\";\n\nexport interface TabBarProps extends ComponentPropsWithRef<\"div\"> {\n /**\n * Styling variant with a bottom separator. Defaults to false\n */\n divider?: boolean;\n /**\n * Styling variant with left and right padding. Defaults to false\n */\n inset?: boolean;\n}\n\nconst withBaseName = makePrefixer(\"saltTabBar\");\n\nexport const TabBar = forwardRef<HTMLDivElement, TabBarProps>(\n function TabBar(props, ref) {\n const { className, children, divider, inset, ...rest } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-tab-bar\",\n css: tabBarCss,\n window: targetWindow,\n });\n\n return (\n <div\n className={clsx(\n withBaseName(),\n {\n [withBaseName(\"divider\")]: divider,\n [withBaseName(\"inset\")]: inset,\n },\n className,\n )}\n {...rest}\n ref={ref}\n >\n <div className={withBaseName(\"strip\")}>{children}</div>\n </div>\n );\n },\n);\n"],"names":["makePrefixer","forwardRef","TabBar","useWindow","useComponentCssInjection","tabBarCss","jsx","clsx"],"mappings":";;;;;;;;;;AAkBA,MAAM,YAAA,GAAeA,kBAAa,YAAY,CAAA;AAEvC,MAAM,MAAA,GAASC,gBAAA;AAAA,EACpB,SAASC,OAAAA,CAAO,KAAA,EAAO,GAAA,EAAK;AAC1B,IAAA,MAAM,EAAE,SAAA,EAAW,QAAA,EAAU,SAAS,KAAA,EAAO,GAAG,MAAK,GAAI,KAAA;AAEzD,IAAA,MAAM,eAAeC,gBAAA,EAAU;AAC/B,IAAAC,+BAAA,CAAyB;AAAA,MACvB,MAAA,EAAQ,cAAA;AAAA,MACR,GAAA,EAAKC,QAAA;AAAA,MACL,MAAA,EAAQ;AAAA,KACT,CAAA;AAED,IAAA,uBACEC,cAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAWC,SAAA;AAAA,UACT,YAAA,EAAa;AAAA,UACb;AAAA,YACE,CAAC,YAAA,CAAa,SAAS,CAAC,GAAG,OAAA;AAAA,YAC3B,CAAC,YAAA,CAAa,OAAO,CAAC,GAAG;AAAA,WAC3B;AAAA,UACA;AAAA,SACF;AAAA,QACC,GAAG,IAAA;AAAA,QACJ,GAAA;AAAA,QAEA,yCAAC,KAAA,EAAA,EAAI,SAAA,EAAW,YAAA,CAAa,OAAO,GAAI,QAAA,EAAS;AAAA;AAAA,KACnD;AAAA,EAEJ;AACF;;;;"}