@react-md/core 6.3.4 → 6.5.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (477) hide show
  1. package/dist/CoreProviders.d.ts +1 -0
  2. package/dist/CoreProviders.js.map +1 -1
  3. package/dist/_a11y.scss +3 -1
  4. package/dist/_base.scss +3 -0
  5. package/dist/_box-shadows.scss +20 -12
  6. package/dist/_core.scss +2 -1
  7. package/dist/_utils.scss +32 -10
  8. package/dist/app-bar/AppBar.js.map +1 -1
  9. package/dist/app-bar/AppBarTitle.js.map +1 -1
  10. package/dist/app-bar/_app-bar.scss +3 -3
  11. package/dist/autocomplete/AutocompleteListboxChildren.js.map +1 -1
  12. package/dist/autocomplete/_autocomplete.scss +20 -16
  13. package/dist/autocomplete/types.js.map +1 -1
  14. package/dist/autocomplete/utils.js.map +1 -1
  15. package/dist/avatar/Avatar.js.map +1 -1
  16. package/dist/avatar/_avatar.scss +2 -1
  17. package/dist/button/Button.js.map +1 -1
  18. package/dist/button/FloatingActionButton.js.map +1 -1
  19. package/dist/button/_button.scss +9 -5
  20. package/dist/card/Card.js.map +1 -1
  21. package/dist/card/CardContent.js.map +1 -1
  22. package/dist/card/ClickableCard.js.map +1 -1
  23. package/dist/card/_card.scss +6 -6
  24. package/dist/chip/Chip.js.map +1 -1
  25. package/dist/chip/_chip.scss +6 -6
  26. package/dist/datetime/NativeDateField.js.map +1 -1
  27. package/dist/datetime/NativeTimeField.js.map +1 -1
  28. package/dist/datetime/useDateField.js.map +1 -1
  29. package/dist/datetime/useTimeField.js.map +1 -1
  30. package/dist/dialog/Dialog.js.map +1 -1
  31. package/dist/dialog/DialogContainer.js.map +1 -1
  32. package/dist/dialog/DialogContent.js.map +1 -1
  33. package/dist/dialog/DialogFooter.js.map +1 -1
  34. package/dist/dialog/_dialog.scss +6 -6
  35. package/dist/divider/Divider.js.map +1 -1
  36. package/dist/divider/_divider.scss +6 -2
  37. package/dist/draggable/useDraggable.js.map +1 -1
  38. package/dist/draggable/utils.js.map +1 -1
  39. package/dist/expansion-panel/ExpansionPanelHeader.js.map +1 -1
  40. package/dist/files/FileInput.js.map +1 -1
  41. package/dist/files/useFileUpload.js.map +1 -1
  42. package/dist/files/validation.js.map +1 -1
  43. package/dist/focus/useFocusContainer.js.map +1 -1
  44. package/dist/form/Fieldset.d.ts +19 -0
  45. package/dist/form/Fieldset.js +22 -2
  46. package/dist/form/Fieldset.js.map +1 -1
  47. package/dist/form/FormMessageContainer.js.map +1 -1
  48. package/dist/form/FormMessageCounter.js.map +1 -1
  49. package/dist/form/InputToggle.js.map +1 -1
  50. package/dist/form/Legend.d.ts +27 -5
  51. package/dist/form/Legend.js +39 -6
  52. package/dist/form/Legend.js.map +1 -1
  53. package/dist/form/Listbox.js.map +1 -1
  54. package/dist/form/ListboxProvider.js.map +1 -1
  55. package/dist/form/NativeSelect.js.map +1 -1
  56. package/dist/form/Password.js.map +1 -1
  57. package/dist/form/ResizingTextAreaWrapper.js.map +1 -1
  58. package/dist/form/Select.d.ts +24 -0
  59. package/dist/form/Select.js +14 -3
  60. package/dist/form/Select.js.map +1 -1
  61. package/dist/form/SelectedOption.d.ts +1 -2
  62. package/dist/form/SelectedOption.js +2 -2
  63. package/dist/form/SelectedOption.js.map +1 -1
  64. package/dist/form/Slider.js.map +1 -1
  65. package/dist/form/SliderContainer.js.map +1 -1
  66. package/dist/form/SliderThumb.js.map +1 -1
  67. package/dist/form/SliderTrack.js.map +1 -1
  68. package/dist/form/SliderValueMarks.js.map +1 -1
  69. package/dist/form/Switch.js.map +1 -1
  70. package/dist/form/TextArea.js.map +1 -1
  71. package/dist/form/TextField.js.map +1 -1
  72. package/dist/form/TextFieldContainer.js.map +1 -1
  73. package/dist/form/_fieldset.scss +7 -0
  74. package/dist/form/_input-toggle.scss +6 -5
  75. package/dist/form/_label.scss +2 -2
  76. package/dist/form/_legend.scss +77 -0
  77. package/dist/form/_slider.scss +7 -5
  78. package/dist/form/_switch.scss +7 -5
  79. package/dist/form/_text-field.scss +52 -15
  80. package/dist/form/defaultGetSelectedOptionChildren.d.ts +1 -0
  81. package/dist/form/fieldsetStyles.d.ts +6 -1
  82. package/dist/form/fieldsetStyles.js +3 -2
  83. package/dist/form/fieldsetStyles.js.map +1 -1
  84. package/dist/form/getSelectedOptionChildren.d.ts +1 -0
  85. package/dist/form/inputToggleStyles.js.map +1 -1
  86. package/dist/form/labelStyles.d.ts +1 -1
  87. package/dist/form/labelStyles.js +1 -1
  88. package/dist/form/labelStyles.js.map +1 -1
  89. package/dist/form/legendStyles.d.ts +83 -0
  90. package/dist/form/legendStyles.js +25 -0
  91. package/dist/form/legendStyles.js.map +1 -0
  92. package/dist/form/selectUtils.js.map +1 -1
  93. package/dist/form/textFieldContainerStyles.js.map +1 -1
  94. package/dist/form/types.d.ts +28 -6
  95. package/dist/form/types.js.map +1 -1
  96. package/dist/form/useCheckboxGroup.js.map +1 -1
  97. package/dist/form/useCombobox.js.map +1 -1
  98. package/dist/form/useNumberField.js +16 -19
  99. package/dist/form/useNumberField.js.map +1 -1
  100. package/dist/form/useRangeSlider.js.map +1 -1
  101. package/dist/form/useSlider.js.map +1 -1
  102. package/dist/form/useTextField.js.map +1 -1
  103. package/dist/hoverMode/useHoverMode.js.map +1 -1
  104. package/dist/icon/FontIcon.js.map +1 -1
  105. package/dist/icon/IconRotator.js.map +1 -1
  106. package/dist/icon/MaterialIcon.js.map +1 -1
  107. package/dist/icon/MaterialSymbol.js.map +1 -1
  108. package/dist/icon/SVGIcon.js.map +1 -1
  109. package/dist/icon/config.d.ts +0 -1
  110. package/dist/icon/config.js +10 -7
  111. package/dist/icon/config.js.map +1 -1
  112. package/dist/icon/materialConfig.js.map +1 -1
  113. package/dist/icon/styles.js.map +1 -1
  114. package/dist/interaction/UserInteractionModeProvider.js +6 -4
  115. package/dist/interaction/UserInteractionModeProvider.js.map +1 -1
  116. package/dist/interaction/_interaction.scss +5 -3
  117. package/dist/interaction/types.js.map +1 -1
  118. package/dist/interaction/useElementInteraction.js.map +1 -1
  119. package/dist/layout/LayoutAppBar.d.ts +6 -6
  120. package/dist/layout/LayoutAppBar.js +6 -6
  121. package/dist/layout/LayoutAppBar.js.map +1 -1
  122. package/dist/layout/LayoutNav.js.map +1 -1
  123. package/dist/layout/LayoutWindowSplitter.js.map +1 -1
  124. package/dist/layout/Main.js.map +1 -1
  125. package/dist/layout/useExpandableLayout.js +43 -0
  126. package/dist/layout/useExpandableLayout.js.map +1 -1
  127. package/dist/layout/useHorizontalLayoutTransition.js.map +1 -1
  128. package/dist/layout/useLayoutTree.js.map +1 -1
  129. package/dist/layout/useLayoutWindowSplitter.js.map +1 -1
  130. package/dist/layout/useResizableLayout.js.map +1 -1
  131. package/dist/link/Link.js.map +1 -1
  132. package/dist/link/SkipToMainContent.js +19 -21
  133. package/dist/link/SkipToMainContent.js.map +1 -1
  134. package/dist/list/List.js.map +1 -1
  135. package/dist/list/ListItem.js.map +1 -1
  136. package/dist/list/ListItemAddon.js.map +1 -1
  137. package/dist/list/ListItemLink.js.map +1 -1
  138. package/dist/list/ListSubheader.js.map +1 -1
  139. package/dist/list/getListItemHeight.js.map +1 -1
  140. package/dist/list/listItemStyles.js.map +1 -1
  141. package/dist/list/types.js.map +1 -1
  142. package/dist/media-queries/AppSizeProvider.d.ts +2 -0
  143. package/dist/media-queries/AppSizeProvider.js +3 -2
  144. package/dist/media-queries/AppSizeProvider.js.map +1 -1
  145. package/dist/media-queries/appSize.d.ts +3 -0
  146. package/dist/media-queries/appSize.js +3 -1
  147. package/dist/media-queries/appSize.js.map +1 -1
  148. package/dist/media-queries/config.d.ts +11 -0
  149. package/dist/media-queries/config.js +26 -0
  150. package/dist/media-queries/config.js.map +1 -0
  151. package/dist/menu/DropdownMenu.js.map +1 -1
  152. package/dist/menu/Menu.js.map +1 -1
  153. package/dist/menu/MenuItemButton.js.map +1 -1
  154. package/dist/menu/MenuItemFileInput.js.map +1 -1
  155. package/dist/menu/MenuItemInputToggle.js.map +1 -1
  156. package/dist/menu/MenuItemSeparator.js.map +1 -1
  157. package/dist/menu/MenuVisibilityProvider.js.map +1 -1
  158. package/dist/menu/MenuWidget.js.map +1 -1
  159. package/dist/menu/useContextMenu.js.map +1 -1
  160. package/dist/movement/types.d.ts +28 -3
  161. package/dist/movement/types.js.map +1 -1
  162. package/dist/movement/useKeyboardMovementProvider.js +96 -47
  163. package/dist/movement/useKeyboardMovementProvider.js.map +1 -1
  164. package/dist/navigation/CollapsibleNavGroup.js.map +1 -1
  165. package/dist/navigation/NavItem.js.map +1 -1
  166. package/dist/navigation/NavItemButton.js.map +1 -1
  167. package/dist/navigation/NavItemLink.js.map +1 -1
  168. package/dist/navigation/getTableOfContentsHeadings.js.map +1 -1
  169. package/dist/navigation/types.js.map +1 -1
  170. package/dist/overlay/Overlay.js.map +1 -1
  171. package/dist/positioning/createHorizontalPosition.js.map +1 -1
  172. package/dist/positioning/createVerticalPosition.js.map +1 -1
  173. package/dist/positioning/useFixedPositioning.js.map +1 -1
  174. package/dist/progress/CircularProgress.js.map +1 -1
  175. package/dist/progress/LinearProgress.js.map +1 -1
  176. package/dist/progress/linearProgressStyles.js.map +1 -1
  177. package/dist/responsive-item/ResponsiveItem.js.map +1 -1
  178. package/dist/responsive-item/ResponsiveItemOverlay.js.map +1 -1
  179. package/dist/searching/caseInsensitive.js.map +1 -1
  180. package/dist/segmented-button/SegmentedButton.js.map +1 -1
  181. package/dist/segmented-button/SegmentedButtonContainer.js.map +1 -1
  182. package/dist/segmented-button/segmentedButtonStyles.js.map +1 -1
  183. package/dist/sheet/Sheet.js.map +1 -1
  184. package/dist/snackbar/Toast.js.map +1 -1
  185. package/dist/snackbar/_snackbar.scss +3 -3
  186. package/dist/spinbutton/SpinButton.d.ts +16 -0
  187. package/dist/spinbutton/SpinButton.js +55 -0
  188. package/dist/spinbutton/SpinButton.js.map +1 -0
  189. package/dist/spinbutton/SpinButtonGroupProvider.d.ts +17 -0
  190. package/dist/spinbutton/SpinButtonGroupProvider.js +19 -0
  191. package/dist/spinbutton/SpinButtonGroupProvider.js.map +1 -0
  192. package/dist/spinbutton/defaults.d.ts +9 -0
  193. package/dist/spinbutton/defaults.js +25 -0
  194. package/dist/spinbutton/defaults.js.map +1 -0
  195. package/dist/spinbutton/types.d.ts +324 -0
  196. package/dist/spinbutton/types.js +5 -0
  197. package/dist/spinbutton/types.js.map +1 -0
  198. package/dist/spinbutton/useSpinButton.d.ts +5 -0
  199. package/dist/spinbutton/useSpinButton.js +260 -0
  200. package/dist/spinbutton/useSpinButton.js.map +1 -0
  201. package/dist/spinbutton/useSpinButtonGroupProvider.d.ts +27 -0
  202. package/dist/spinbutton/useSpinButtonGroupProvider.js +49 -0
  203. package/dist/spinbutton/useSpinButtonGroupProvider.js.map +1 -0
  204. package/dist/spinbutton/utils/deselectNode.d.ts +5 -0
  205. package/dist/spinbutton/utils/deselectNode.js +17 -0
  206. package/dist/spinbutton/utils/deselectNode.js.map +1 -0
  207. package/dist/spinbutton/utils/resolveInputEvent.d.ts +30 -0
  208. package/dist/spinbutton/utils/resolveInputEvent.js +53 -0
  209. package/dist/spinbutton/utils/resolveInputEvent.js.map +1 -0
  210. package/dist/spinbutton/utils/selectNode.d.ts +5 -0
  211. package/dist/spinbutton/utils/selectNode.js +15 -0
  212. package/dist/spinbutton/utils/selectNode.js.map +1 -0
  213. package/dist/table/StickyTableSection.js.map +1 -1
  214. package/dist/table/Table.js.map +1 -1
  215. package/dist/table/TableBody.js.map +1 -1
  216. package/dist/table/TableCellContent.js.map +1 -1
  217. package/dist/table/TableCheckbox.js.map +1 -1
  218. package/dist/table/TableFooter.js.map +1 -1
  219. package/dist/table/TableHeader.js.map +1 -1
  220. package/dist/table/TableRadio.js.map +1 -1
  221. package/dist/table/TableRow.js.map +1 -1
  222. package/dist/table/useStickyTableSection.js.map +1 -1
  223. package/dist/tabs/SimpleTabPanel.js.map +1 -1
  224. package/dist/tabs/SimpleTabPanels.js.map +1 -1
  225. package/dist/tabs/Tab.js.map +1 -1
  226. package/dist/tabs/TabList.js.map +1 -1
  227. package/dist/tabs/TabListScrollButton.js.map +1 -1
  228. package/dist/tabs/_tabs.scss +5 -6
  229. package/dist/tabs/useMaxTabPanelHeight.js.map +1 -1
  230. package/dist/test-utils/data-testid.js.map +1 -1
  231. package/dist/test-utils/mocks/match-media.js +5 -5
  232. package/dist/test-utils/mocks/match-media.js.map +1 -1
  233. package/dist/test-utils/vitest/timers.d.ts +1 -1
  234. package/dist/test-utils/vitest/timers.js +1 -1
  235. package/dist/test-utils/vitest/timers.js.map +1 -1
  236. package/dist/theme/_a11y.scss +3 -1
  237. package/dist/theme/_theme.scss +16 -12
  238. package/dist/tooltip/Tooltip.js.map +1 -1
  239. package/dist/tooltip/TooltipHoverModeProvider.js.map +1 -1
  240. package/dist/tooltip/useTooltip.js.map +1 -1
  241. package/dist/transition/CSSTransition.js.map +1 -1
  242. package/dist/transition/Collapse.js.map +1 -1
  243. package/dist/transition/CrossFade.js.map +1 -1
  244. package/dist/transition/ScaleTransition.js.map +1 -1
  245. package/dist/transition/SkeletonPlaceholder.js.map +1 -1
  246. package/dist/transition/Slide.js.map +1 -1
  247. package/dist/transition/SlideContainer.js.map +1 -1
  248. package/dist/transition/types.js.map +1 -1
  249. package/dist/transition/useCollapseTransition.js.map +1 -1
  250. package/dist/transition/useCrossFadeTransition.js.map +1 -1
  251. package/dist/transition/useMaxWidthTransition.js.map +1 -1
  252. package/dist/transition/useScaleTransition.js.map +1 -1
  253. package/dist/transition/useSkeletonPlaceholder.js.map +1 -1
  254. package/dist/tree/Tree.js.map +1 -1
  255. package/dist/tree/TreeItem.js.map +1 -1
  256. package/dist/tree/TreeProvider.js.map +1 -1
  257. package/dist/tree/styles.js.map +1 -1
  258. package/dist/tree/types.js.map +1 -1
  259. package/dist/tree/useTreeMovement.js.map +1 -1
  260. package/dist/typography/HighlightTextMark.js.map +1 -1
  261. package/dist/typography/Mark.js.map +1 -1
  262. package/dist/typography/TextContainer.js.map +1 -1
  263. package/dist/typography/Typography.js.map +1 -1
  264. package/dist/typography/_typography.scss +0 -1
  265. package/dist/useElementSize.js.map +1 -1
  266. package/dist/useIntersectionObserver.js.map +1 -1
  267. package/dist/useMutationObserver.js.map +1 -1
  268. package/dist/useWindowSize.js.map +1 -1
  269. package/dist/utils/getNumberOfDigits.d.ts +7 -0
  270. package/dist/utils/getNumberOfDigits.js +11 -0
  271. package/dist/utils/getNumberOfDigits.js.map +1 -0
  272. package/dist/utils/nearest.js +2 -1
  273. package/dist/utils/nearest.js.map +1 -1
  274. package/dist/utils/useDevEffect.d.ts +7 -0
  275. package/dist/utils/useDevEffect.js +8 -0
  276. package/dist/utils/useDevEffect.js.map +1 -0
  277. package/dist/window-splitter/WindowSplitter.js +3 -2
  278. package/dist/window-splitter/WindowSplitter.js.map +1 -1
  279. package/dist/window-splitter/_window-splitter.scss +65 -19
  280. package/dist/window-splitter/styles.d.ts +9 -0
  281. package/dist/window-splitter/styles.js +3 -2
  282. package/dist/window-splitter/styles.js.map +1 -1
  283. package/dist/window-splitter/useWindowSplitter.js.map +1 -1
  284. package/package.json +38 -30
  285. package/src/CoreProviders.tsx +1 -0
  286. package/src/app-bar/AppBar.tsx +1 -2
  287. package/src/app-bar/AppBarTitle.tsx +1 -2
  288. package/src/autocomplete/AutocompleteListboxChildren.tsx +3 -1
  289. package/src/autocomplete/types.ts +24 -19
  290. package/src/autocomplete/utils.ts +9 -6
  291. package/src/avatar/Avatar.tsx +2 -1
  292. package/src/button/Button.tsx +2 -1
  293. package/src/button/FloatingActionButton.tsx +2 -1
  294. package/src/card/Card.tsx +2 -1
  295. package/src/card/CardContent.tsx +1 -2
  296. package/src/card/ClickableCard.tsx +1 -2
  297. package/src/chip/Chip.tsx +2 -1
  298. package/src/datetime/NativeDateField.tsx +2 -1
  299. package/src/datetime/NativeTimeField.tsx +2 -1
  300. package/src/datetime/useDateField.ts +13 -8
  301. package/src/datetime/useTimeField.ts +13 -8
  302. package/src/dialog/Dialog.tsx +2 -1
  303. package/src/dialog/DialogContainer.tsx +1 -2
  304. package/src/dialog/DialogContent.tsx +1 -2
  305. package/src/dialog/DialogFooter.tsx +1 -2
  306. package/src/divider/Divider.tsx +1 -2
  307. package/src/draggable/useDraggable.ts +4 -4
  308. package/src/draggable/utils.ts +4 -2
  309. package/src/expansion-panel/ExpansionPanelHeader.tsx +1 -2
  310. package/src/files/FileInput.tsx +2 -1
  311. package/src/files/useFileUpload.ts +6 -6
  312. package/src/files/validation.ts +1 -2
  313. package/src/focus/useFocusContainer.ts +4 -4
  314. package/src/form/Fieldset.tsx +25 -3
  315. package/src/form/FormMessageContainer.tsx +1 -2
  316. package/src/form/FormMessageCounter.tsx +1 -2
  317. package/src/form/InputToggle.tsx +3 -3
  318. package/src/form/Legend.tsx +55 -10
  319. package/src/form/Listbox.tsx +1 -2
  320. package/src/form/ListboxProvider.ts +3 -2
  321. package/src/form/NativeSelect.tsx +2 -1
  322. package/src/form/Password.tsx +4 -2
  323. package/src/form/ResizingTextAreaWrapper.tsx +1 -2
  324. package/src/form/Select.tsx +55 -3
  325. package/src/form/SelectedOption.tsx +2 -4
  326. package/src/form/Slider.tsx +2 -1
  327. package/src/form/SliderContainer.tsx +1 -2
  328. package/src/form/SliderThumb.tsx +6 -3
  329. package/src/form/SliderTrack.tsx +2 -1
  330. package/src/form/SliderValueMarks.tsx +1 -2
  331. package/src/form/Switch.tsx +2 -1
  332. package/src/form/TextArea.tsx +1 -2
  333. package/src/form/TextField.tsx +2 -1
  334. package/src/form/TextFieldContainer.tsx +1 -2
  335. package/src/form/fieldsetStyles.ts +18 -3
  336. package/src/form/inputToggleStyles.ts +4 -2
  337. package/src/form/labelStyles.ts +1 -1
  338. package/src/form/legendStyles.ts +132 -0
  339. package/src/form/selectUtils.ts +3 -2
  340. package/src/form/textFieldContainerStyles.ts +1 -2
  341. package/src/form/types.ts +35 -17
  342. package/src/form/useCheckboxGroup.ts +3 -2
  343. package/src/form/useCombobox.ts +8 -3
  344. package/src/form/useNumberField.ts +36 -35
  345. package/src/form/useRangeSlider.ts +1 -2
  346. package/src/form/useSlider.ts +1 -2
  347. package/src/form/useTextField.ts +8 -3
  348. package/src/hoverMode/useHoverMode.ts +4 -8
  349. package/src/icon/FontIcon.tsx +1 -2
  350. package/src/icon/IconRotator.tsx +1 -2
  351. package/src/icon/MaterialIcon.tsx +2 -1
  352. package/src/icon/MaterialSymbol.tsx +2 -1
  353. package/src/icon/SVGIcon.tsx +1 -2
  354. package/src/icon/config.tsx +10 -7
  355. package/src/icon/materialConfig.ts +1 -2
  356. package/src/icon/styles.ts +1 -2
  357. package/src/interaction/UserInteractionModeProvider.tsx +9 -4
  358. package/src/interaction/types.ts +1 -2
  359. package/src/interaction/useElementInteraction.tsx +3 -2
  360. package/src/layout/LayoutAppBar.tsx +6 -6
  361. package/src/layout/LayoutNav.tsx +2 -1
  362. package/src/layout/LayoutWindowSplitter.tsx +2 -1
  363. package/src/layout/Main.tsx +1 -2
  364. package/src/layout/useExpandableLayout.ts +63 -5
  365. package/src/layout/useHorizontalLayoutTransition.ts +1 -2
  366. package/src/layout/useLayoutTree.ts +2 -2
  367. package/src/layout/useLayoutWindowSplitter.ts +6 -6
  368. package/src/layout/useResizableLayout.ts +3 -6
  369. package/src/link/Link.tsx +1 -2
  370. package/src/link/SkipToMainContent.tsx +20 -23
  371. package/src/list/List.tsx +1 -2
  372. package/src/list/ListItem.tsx +2 -1
  373. package/src/list/ListItemAddon.tsx +2 -1
  374. package/src/list/ListItemLink.tsx +2 -1
  375. package/src/list/ListSubheader.tsx +1 -2
  376. package/src/list/getListItemHeight.ts +8 -9
  377. package/src/list/listItemStyles.ts +1 -2
  378. package/src/list/types.ts +1 -2
  379. package/src/media-queries/AppSizeProvider.tsx +8 -10
  380. package/src/media-queries/appSize.ts +3 -0
  381. package/src/media-queries/config.ts +41 -0
  382. package/src/menu/DropdownMenu.tsx +4 -5
  383. package/src/menu/Menu.tsx +2 -1
  384. package/src/menu/MenuItemButton.tsx +1 -2
  385. package/src/menu/MenuItemFileInput.tsx +2 -1
  386. package/src/menu/MenuItemInputToggle.tsx +3 -3
  387. package/src/menu/MenuItemSeparator.tsx +2 -1
  388. package/src/menu/MenuVisibilityProvider.tsx +4 -2
  389. package/src/menu/MenuWidget.tsx +1 -2
  390. package/src/menu/useContextMenu.ts +4 -2
  391. package/src/movement/types.ts +52 -13
  392. package/src/movement/useKeyboardMovementProvider.ts +77 -38
  393. package/src/navigation/CollapsibleNavGroup.tsx +1 -2
  394. package/src/navigation/NavItem.tsx +1 -2
  395. package/src/navigation/NavItemButton.tsx +2 -1
  396. package/src/navigation/NavItemLink.tsx +2 -1
  397. package/src/navigation/getTableOfContentsHeadings.ts +1 -2
  398. package/src/navigation/types.ts +1 -2
  399. package/src/overlay/Overlay.tsx +2 -1
  400. package/src/positioning/createHorizontalPosition.ts +10 -12
  401. package/src/positioning/createVerticalPosition.ts +10 -11
  402. package/src/positioning/useFixedPositioning.ts +6 -3
  403. package/src/progress/CircularProgress.tsx +2 -1
  404. package/src/progress/LinearProgress.tsx +2 -1
  405. package/src/progress/linearProgressStyles.ts +1 -2
  406. package/src/responsive-item/ResponsiveItem.tsx +1 -2
  407. package/src/responsive-item/ResponsiveItemOverlay.tsx +2 -1
  408. package/src/searching/caseInsensitive.ts +2 -4
  409. package/src/segmented-button/SegmentedButton.tsx +2 -1
  410. package/src/segmented-button/SegmentedButtonContainer.tsx +2 -1
  411. package/src/segmented-button/segmentedButtonStyles.ts +1 -2
  412. package/src/sheet/Sheet.tsx +1 -2
  413. package/src/snackbar/Toast.tsx +2 -1
  414. package/src/spinbutton/SpinButton.tsx +98 -0
  415. package/src/spinbutton/SpinButtonGroupProvider.tsx +32 -0
  416. package/src/spinbutton/defaults.ts +45 -0
  417. package/src/spinbutton/types.ts +413 -0
  418. package/src/spinbutton/useSpinButton.ts +311 -0
  419. package/src/spinbutton/useSpinButtonGroupProvider.ts +104 -0
  420. package/src/spinbutton/utils/deselectNode.ts +17 -0
  421. package/src/spinbutton/utils/resolveInputEvent.ts +112 -0
  422. package/src/spinbutton/utils/selectNode.ts +15 -0
  423. package/src/table/StickyTableSection.tsx +2 -1
  424. package/src/table/Table.tsx +1 -2
  425. package/src/table/TableBody.tsx +2 -1
  426. package/src/table/TableCellContent.tsx +1 -2
  427. package/src/table/TableCheckbox.tsx +1 -2
  428. package/src/table/TableFooter.tsx +1 -2
  429. package/src/table/TableHeader.tsx +1 -2
  430. package/src/table/TableRadio.tsx +1 -2
  431. package/src/table/TableRow.tsx +1 -2
  432. package/src/table/useStickyTableSection.tsx +1 -2
  433. package/src/tabs/SimpleTabPanel.tsx +2 -1
  434. package/src/tabs/SimpleTabPanels.tsx +2 -1
  435. package/src/tabs/Tab.tsx +3 -6
  436. package/src/tabs/TabList.tsx +2 -1
  437. package/src/tabs/TabListScrollButton.tsx +1 -2
  438. package/src/tabs/useMaxTabPanelHeight.ts +7 -4
  439. package/src/test-utils/data-testid.ts +1 -2
  440. package/src/test-utils/mocks/match-media.ts +5 -10
  441. package/src/test-utils/vitest/timers.ts +1 -1
  442. package/src/tooltip/Tooltip.tsx +2 -1
  443. package/src/tooltip/TooltipHoverModeProvider.tsx +1 -2
  444. package/src/tooltip/useTooltip.ts +9 -5
  445. package/src/transition/CSSTransition.tsx +2 -1
  446. package/src/transition/Collapse.tsx +4 -2
  447. package/src/transition/CrossFade.tsx +2 -1
  448. package/src/transition/ScaleTransition.tsx +2 -1
  449. package/src/transition/SkeletonPlaceholder.tsx +1 -2
  450. package/src/transition/Slide.tsx +2 -1
  451. package/src/transition/SlideContainer.tsx +1 -2
  452. package/src/transition/types.ts +15 -16
  453. package/src/transition/useCollapseTransition.ts +6 -5
  454. package/src/transition/useCrossFadeTransition.ts +3 -2
  455. package/src/transition/useMaxWidthTransition.ts +1 -2
  456. package/src/transition/useScaleTransition.ts +3 -2
  457. package/src/transition/useSkeletonPlaceholder.ts +1 -2
  458. package/src/tree/Tree.tsx +2 -1
  459. package/src/tree/TreeItem.tsx +2 -1
  460. package/src/tree/TreeProvider.tsx +4 -4
  461. package/src/tree/styles.ts +1 -2
  462. package/src/tree/types.ts +1 -2
  463. package/src/tree/useTreeMovement.ts +1 -2
  464. package/src/typography/HighlightTextMark.tsx +1 -2
  465. package/src/typography/Mark.tsx +1 -2
  466. package/src/typography/TextContainer.tsx +1 -2
  467. package/src/typography/Typography.tsx +1 -2
  468. package/src/useElementSize.ts +7 -4
  469. package/src/useIntersectionObserver.ts +3 -2
  470. package/src/useMutationObserver.ts +3 -2
  471. package/src/useWindowSize.ts +4 -2
  472. package/src/utils/getNumberOfDigits.ts +18 -0
  473. package/src/utils/nearest.ts +2 -1
  474. package/src/utils/useDevEffect.ts +9 -0
  475. package/src/window-splitter/WindowSplitter.tsx +5 -2
  476. package/src/window-splitter/styles.ts +13 -2
  477. package/src/window-splitter/useWindowSplitter.ts +3 -1
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/table/TableCheckbox.tsx"],"sourcesContent":["\"use client\";\n\nimport { type TdHTMLAttributes, forwardRef } from \"react\";\n\nimport { Checkbox } from \"../form/Checkbox.js\";\nimport { type CheckboxProps } from \"../form/InputToggle.js\";\nimport { type PropsWithRef } from \"../types.js\";\nimport { TableCell } from \"./TableCell.js\";\n\nconst noop = (): void => {\n // do nothing\n};\n\n/**\n * @since 6.0.0\n */\nexport type TableCheckboxTdHTMLAttributes = Omit<\n TdHTMLAttributes<HTMLTableCellElement>,\n \"aria-sort\" | \"scope\" | \"onChange\"\n>;\n\n/**\n * @since 6.0.0\n */\nexport type TableCheckboxSupportedCheckboxProps = Pick<\n CheckboxProps,\n | \"name\"\n | \"value\"\n | \"icon\"\n | \"iconStyle\"\n | \"iconClassName\"\n | \"iconProps\"\n | \"checkedIcon\"\n | \"indeterminateIcon\"\n | \"checked\"\n | \"onChange\"\n | \"defaultChecked\"\n | \"indeterminate\"\n | \"aria-controls\"\n>;\n\n/**\n * @since 6.0.0 The `id` prop is no longer required since the checkbox's id\n * will automatically be generated as `\"checkbox\" + useId()`. Use the {@link checkboxProps}\n * to set an `id` manually for the checkbox.\n * @since 6.0.0 The `cellId` prop was removed. Use the `id` prop instead.\n * @since 6.0.0 The default `aria-label` was changed from\n * `\"Toggle Row Selection\"` to `\"Select Row\"`.\n */\nexport interface TableCheckboxProps\n extends TableCheckboxTdHTMLAttributes,\n TableCheckboxSupportedCheckboxProps {\n /**\n * @defaultValue `!props[\"aria-labelledby\"] ? \"Select Row\" : undefined`\n */\n \"aria-label\"?: string;\n\n /** @defaultValue `false` */\n sticky?: boolean;\n\n /**\n * This allows you to override any props for the checkbox that are not\n * configurable as top-level props.\n *\n * @example Simple Example\n * ```tsx\n * checkboxProps={{\n * id: \"some-custom-id\",\n * ref: checkboxRef,\n * }}\n * ```\n *\n * @see {@link TableCheckboxSupportedCheckboxProps}\n * @since 6.0.0\n */\n checkboxProps?: PropsWithRef<CheckboxProps>;\n}\n\n/**\n * **Client Component**\n * The `TableCheckbox` is used to render a `Checkbox` within a `TableCell` by applying\n * some minimal styles.\n *\n * @example Simple Example\n * ```tsx\n * import { useCheckboxGroup } from \"@react-md/core/form/useCheckboxGroup\";\n * import { Table } from \"@react-md/core/table/Table\";\n * import { TableBody } from \"@react-md/core/table/TableBody\";\n * import { TableCell } from \"@react-md/core/table/TableCell\";\n * import { TableCheckbox } from \"@react-md/core/table/TableCheckbox\";\n * import { TableContainer } from \"@react-md/core/table/TableContainer\";\n * import { TableHeader } from \"@react-md/core/table/TableHeader\";\n * import { TableRow } from \"@react-md/core/table/TableRow\";\n * import { type ReactElement } from \"react\";\n *\n * const rows = [\n * { name: \"Frozen Yogurt\", type: \"Ice Cream\" },\n * { name: \"Ice cream sandwich\", type: \"Ice Cream\" },\n * { name: \"Eclair\", type: \"Pastry\" },\n * // ...other content\n * ] as const;\n *\n * function Example(): ReactElement {\n * const { getCheckboxProps, getIndeterminateProps } = useCheckboxGroup({\n * values: rows.map(({ name }) => name),\n * name: \"selected\",\n * });\n * return (\n * <TableContainer>\n * <Table>\n * <TableHeader>\n * <TableRow>\n * <TableCheckbox {...getIndeterminateProps()} />\n * <TableCell>Name</TableCell>\n * <TableCell>Type</TableCell>\n * </TableRow>\n * </TableHeader>\n * <TableBody>\n * {rows.map(({ name, type }) => {\n * const checkboxProps = getCheckboxProps(name);\n * const { checked, onChange } = checkboxProps;\n *\n * return (\n * <TableRow\n * key={name}\n * onClick={onChange}\n * clickable\n * selected={checked}\n * >\n * <TableCheckbox {...checkboxProps} />\n * <TableCell>{name}</TableCell>\n * <TableCell hAlign=\"right\">{type}</TableCell>\n * </TableRow>\n * );\n * })}\n * </TableBody>\n * </Table>\n * </TableContainer>\n * );\n * }\n * ```\n *\n * @see {@link https://react-md.dev/components/table | Table Demos}\n * @since 6.0.0 The `id` prop is no longer required since the checkbox's id\n * will automatically be generated as `\"checkbox\" + useId()`. Use the {@link checkboxProps}\n * to set an `id` manually for the checkbox.\n * @since 6.0.0 The `cellId` prop was removed. Use the `id` prop instead.\n * @since 6.0.0 The default `aria-label` was changed from\n * `\"Toggle Row Selection\"` to `\"Select Row\"`.\n */\nexport const TableCheckbox = forwardRef<\n HTMLTableCellElement,\n TableCheckboxProps\n>(function TableCheckbox(props, ref) {\n const {\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-label\": ariaLabel = !ariaLabelledBy ? \"Select Row\" : undefined,\n \"aria-controls\": ariaControls,\n name,\n icon,\n iconProps,\n iconStyle,\n iconClassName,\n checkedIcon,\n indeterminateIcon,\n value,\n checked,\n onChange,\n defaultChecked,\n indeterminate,\n checkboxProps,\n onClick = noop,\n ...remaining\n } = props;\n\n return (\n <TableCell\n {...remaining}\n ref={ref}\n header={false}\n inputToggle\n onClick={(event) => {\n event.stopPropagation();\n onClick(event);\n }}\n >\n <Checkbox\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n aria-controls={ariaControls}\n name={name}\n icon={icon}\n iconProps={iconProps}\n iconStyle={iconStyle}\n iconClassName={iconClassName}\n checkedIcon={checkedIcon}\n indeterminateIcon={indeterminateIcon}\n value={value}\n checked={checked}\n defaultChecked={defaultChecked}\n onChange={onChange}\n indeterminate={indeterminate}\n {...checkboxProps}\n />\n </TableCell>\n );\n});\n"],"names":["forwardRef","Checkbox","TableCell","noop","TableCheckbox","props","ref","ariaLabelledBy","ariaLabel","undefined","ariaControls","name","icon","iconProps","iconStyle","iconClassName","checkedIcon","indeterminateIcon","value","checked","onChange","defaultChecked","indeterminate","checkboxProps","onClick","remaining","header","inputToggle","event","stopPropagation","aria-label","aria-labelledby","aria-controls"],"mappings":"AAAA;;AAEA,SAAgCA,UAAU,QAAQ,QAAQ;AAE1D,SAASC,QAAQ,QAAQ,sBAAsB;AAG/C,SAASC,SAAS,QAAQ,iBAAiB;AAE3C,MAAMC,OAAO;AACX,aAAa;AACf;AAmEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAuEC,GACD,OAAO,MAAMC,8BAAgBJ,WAG3B,SAASI,cAAcC,KAAK,EAAEC,GAAG;IACjC,MAAM,EACJ,mBAAmBC,cAAc,EACjC,cAAcC,YAAY,CAACD,iBAAiB,eAAeE,SAAS,EACpE,iBAAiBC,YAAY,EAC7BC,IAAI,EACJC,IAAI,EACJC,SAAS,EACTC,SAAS,EACTC,aAAa,EACbC,WAAW,EACXC,iBAAiB,EACjBC,KAAK,EACLC,OAAO,EACPC,QAAQ,EACRC,cAAc,EACdC,aAAa,EACbC,aAAa,EACbC,UAAUrB,IAAI,EACd,GAAGsB,WACJ,GAAGpB;IAEJ,qBACE,KAACH;QACE,GAAGuB,SAAS;QACbnB,KAAKA;QACLoB,QAAQ;QACRC,WAAW;QACXH,SAAS,CAACI;YACRA,MAAMC,eAAe;YACrBL,QAAQI;QACV;kBAEA,cAAA,KAAC3B;YACC6B,cAAYtB;YACZuB,mBAAiBxB;YACjByB,iBAAetB;YACfC,MAAMA;YACNC,MAAMA;YACNC,WAAWA;YACXC,WAAWA;YACXC,eAAeA;YACfC,aAAaA;YACbC,mBAAmBA;YACnBC,OAAOA;YACPC,SAASA;YACTE,gBAAgBA;YAChBD,UAAUA;YACVE,eAAeA;YACd,GAAGC,aAAa;;;AAIzB,GAAG"}
1
+ {"version":3,"sources":["../../src/table/TableCheckbox.tsx"],"sourcesContent":["\"use client\";\n\nimport { type TdHTMLAttributes, forwardRef } from \"react\";\n\nimport { Checkbox } from \"../form/Checkbox.js\";\nimport { type CheckboxProps } from \"../form/InputToggle.js\";\nimport { type PropsWithRef } from \"../types.js\";\nimport { TableCell } from \"./TableCell.js\";\n\nconst noop = (): void => {\n // do nothing\n};\n\n/**\n * @since 6.0.0\n */\nexport type TableCheckboxTdHTMLAttributes = Omit<\n TdHTMLAttributes<HTMLTableCellElement>,\n \"aria-sort\" | \"scope\" | \"onChange\"\n>;\n\n/**\n * @since 6.0.0\n */\nexport type TableCheckboxSupportedCheckboxProps = Pick<\n CheckboxProps,\n | \"name\"\n | \"value\"\n | \"icon\"\n | \"iconStyle\"\n | \"iconClassName\"\n | \"iconProps\"\n | \"checkedIcon\"\n | \"indeterminateIcon\"\n | \"checked\"\n | \"onChange\"\n | \"defaultChecked\"\n | \"indeterminate\"\n | \"aria-controls\"\n>;\n\n/**\n * @since 6.0.0 The `id` prop is no longer required since the checkbox's id\n * will automatically be generated as `\"checkbox\" + useId()`. Use the {@link checkboxProps}\n * to set an `id` manually for the checkbox.\n * @since 6.0.0 The `cellId` prop was removed. Use the `id` prop instead.\n * @since 6.0.0 The default `aria-label` was changed from\n * `\"Toggle Row Selection\"` to `\"Select Row\"`.\n */\nexport interface TableCheckboxProps\n extends TableCheckboxTdHTMLAttributes, TableCheckboxSupportedCheckboxProps {\n /**\n * @defaultValue `!props[\"aria-labelledby\"] ? \"Select Row\" : undefined`\n */\n \"aria-label\"?: string;\n\n /** @defaultValue `false` */\n sticky?: boolean;\n\n /**\n * This allows you to override any props for the checkbox that are not\n * configurable as top-level props.\n *\n * @example Simple Example\n * ```tsx\n * checkboxProps={{\n * id: \"some-custom-id\",\n * ref: checkboxRef,\n * }}\n * ```\n *\n * @see {@link TableCheckboxSupportedCheckboxProps}\n * @since 6.0.0\n */\n checkboxProps?: PropsWithRef<CheckboxProps>;\n}\n\n/**\n * **Client Component**\n * The `TableCheckbox` is used to render a `Checkbox` within a `TableCell` by applying\n * some minimal styles.\n *\n * @example Simple Example\n * ```tsx\n * import { useCheckboxGroup } from \"@react-md/core/form/useCheckboxGroup\";\n * import { Table } from \"@react-md/core/table/Table\";\n * import { TableBody } from \"@react-md/core/table/TableBody\";\n * import { TableCell } from \"@react-md/core/table/TableCell\";\n * import { TableCheckbox } from \"@react-md/core/table/TableCheckbox\";\n * import { TableContainer } from \"@react-md/core/table/TableContainer\";\n * import { TableHeader } from \"@react-md/core/table/TableHeader\";\n * import { TableRow } from \"@react-md/core/table/TableRow\";\n * import { type ReactElement } from \"react\";\n *\n * const rows = [\n * { name: \"Frozen Yogurt\", type: \"Ice Cream\" },\n * { name: \"Ice cream sandwich\", type: \"Ice Cream\" },\n * { name: \"Eclair\", type: \"Pastry\" },\n * // ...other content\n * ] as const;\n *\n * function Example(): ReactElement {\n * const { getCheckboxProps, getIndeterminateProps } = useCheckboxGroup({\n * values: rows.map(({ name }) => name),\n * name: \"selected\",\n * });\n * return (\n * <TableContainer>\n * <Table>\n * <TableHeader>\n * <TableRow>\n * <TableCheckbox {...getIndeterminateProps()} />\n * <TableCell>Name</TableCell>\n * <TableCell>Type</TableCell>\n * </TableRow>\n * </TableHeader>\n * <TableBody>\n * {rows.map(({ name, type }) => {\n * const checkboxProps = getCheckboxProps(name);\n * const { checked, onChange } = checkboxProps;\n *\n * return (\n * <TableRow\n * key={name}\n * onClick={onChange}\n * clickable\n * selected={checked}\n * >\n * <TableCheckbox {...checkboxProps} />\n * <TableCell>{name}</TableCell>\n * <TableCell hAlign=\"right\">{type}</TableCell>\n * </TableRow>\n * );\n * })}\n * </TableBody>\n * </Table>\n * </TableContainer>\n * );\n * }\n * ```\n *\n * @see {@link https://react-md.dev/components/table | Table Demos}\n * @since 6.0.0 The `id` prop is no longer required since the checkbox's id\n * will automatically be generated as `\"checkbox\" + useId()`. Use the {@link checkboxProps}\n * to set an `id` manually for the checkbox.\n * @since 6.0.0 The `cellId` prop was removed. Use the `id` prop instead.\n * @since 6.0.0 The default `aria-label` was changed from\n * `\"Toggle Row Selection\"` to `\"Select Row\"`.\n */\nexport const TableCheckbox = forwardRef<\n HTMLTableCellElement,\n TableCheckboxProps\n>(function TableCheckbox(props, ref) {\n const {\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-label\": ariaLabel = !ariaLabelledBy ? \"Select Row\" : undefined,\n \"aria-controls\": ariaControls,\n name,\n icon,\n iconProps,\n iconStyle,\n iconClassName,\n checkedIcon,\n indeterminateIcon,\n value,\n checked,\n onChange,\n defaultChecked,\n indeterminate,\n checkboxProps,\n onClick = noop,\n ...remaining\n } = props;\n\n return (\n <TableCell\n {...remaining}\n ref={ref}\n header={false}\n inputToggle\n onClick={(event) => {\n event.stopPropagation();\n onClick(event);\n }}\n >\n <Checkbox\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n aria-controls={ariaControls}\n name={name}\n icon={icon}\n iconProps={iconProps}\n iconStyle={iconStyle}\n iconClassName={iconClassName}\n checkedIcon={checkedIcon}\n indeterminateIcon={indeterminateIcon}\n value={value}\n checked={checked}\n defaultChecked={defaultChecked}\n onChange={onChange}\n indeterminate={indeterminate}\n {...checkboxProps}\n />\n </TableCell>\n );\n});\n"],"names":["forwardRef","Checkbox","TableCell","noop","TableCheckbox","props","ref","ariaLabelledBy","ariaLabel","undefined","ariaControls","name","icon","iconProps","iconStyle","iconClassName","checkedIcon","indeterminateIcon","value","checked","onChange","defaultChecked","indeterminate","checkboxProps","onClick","remaining","header","inputToggle","event","stopPropagation","aria-label","aria-labelledby","aria-controls"],"mappings":"AAAA;;AAEA,SAAgCA,UAAU,QAAQ,QAAQ;AAE1D,SAASC,QAAQ,QAAQ,sBAAsB;AAG/C,SAASC,SAAS,QAAQ,iBAAiB;AAE3C,MAAMC,OAAO;AACX,aAAa;AACf;AAkEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAuEC,GACD,OAAO,MAAMC,8BAAgBJ,WAG3B,SAASI,cAAcC,KAAK,EAAEC,GAAG;IACjC,MAAM,EACJ,mBAAmBC,cAAc,EACjC,cAAcC,YAAY,CAACD,iBAAiB,eAAeE,SAAS,EACpE,iBAAiBC,YAAY,EAC7BC,IAAI,EACJC,IAAI,EACJC,SAAS,EACTC,SAAS,EACTC,aAAa,EACbC,WAAW,EACXC,iBAAiB,EACjBC,KAAK,EACLC,OAAO,EACPC,QAAQ,EACRC,cAAc,EACdC,aAAa,EACbC,aAAa,EACbC,UAAUrB,IAAI,EACd,GAAGsB,WACJ,GAAGpB;IAEJ,qBACE,KAACH;QACE,GAAGuB,SAAS;QACbnB,KAAKA;QACLoB,QAAQ;QACRC,WAAW;QACXH,SAAS,CAACI;YACRA,MAAMC,eAAe;YACrBL,QAAQI;QACV;kBAEA,cAAA,KAAC3B;YACC6B,cAAYtB;YACZuB,mBAAiBxB;YACjByB,iBAAetB;YACfC,MAAMA;YACNC,MAAMA;YACNC,WAAWA;YACXC,WAAWA;YACXC,eAAeA;YACfC,aAAaA;YACbC,mBAAmBA;YACnBC,OAAOA;YACPC,SAASA;YACTE,gBAAgBA;YAChBD,UAAUA;YACVE,eAAeA;YACd,GAAGC,aAAa;;;AAIzB,GAAG"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/table/TableFooter.tsx"],"sourcesContent":["\"use client\";\n\nimport { type HTMLAttributes, forwardRef } from \"react\";\n\nimport { TableConfigProvider } from \"./TableConfigurationProvider.js\";\nimport { tableFooter } from \"./tableFooterStyles.js\";\nimport { type TableSectionConfiguration } from \"./types.js\";\nimport { useTableSectionConfig } from \"./useTableSectionConfig.js\";\n\nexport interface TableFooterProps\n extends HTMLAttributes<HTMLTableSectionElement>,\n TableSectionConfiguration {\n /**\n * NOTE: It is recommended to use the `StickyTableSection` component instead\n * of enabling this prop since it supports dynamically adding styles while the\n * header covering table rows.\n *\n * Set this to `true` to enable the sticky behavior.\n *\n * @defaultValue `false`\n */\n sticky?: boolean;\n}\n\n/**\n * **Client Component**\n *\n * Creates a `<tfoot>` element with some basic styles. This component will\n * disable the hover effect and line wrapping by default, but the hover effect\n * and line-wrapping can be re-enabled if desired through the `hoverable` and\n * `disableNoWrap` props.\n *\n * @see {@link https://react-md.dev/components/table | Table Demos}\n */\nexport const TableFooter = forwardRef<\n HTMLTableSectionElement,\n TableFooterProps\n>(function TableFooter(props, propRef) {\n const { className, hoverable, lineWrap, children, ...remaining } = props;\n\n const config = useTableSectionConfig({\n type: \"footer\",\n lineWrap,\n hoverable,\n });\n\n return (\n <TableConfigProvider value={config}>\n <tfoot\n {...remaining}\n ref={propRef}\n className={tableFooter({ className })}\n >\n {children}\n </tfoot>\n </TableConfigProvider>\n );\n});\n"],"names":["forwardRef","TableConfigProvider","tableFooter","useTableSectionConfig","TableFooter","props","propRef","className","hoverable","lineWrap","children","remaining","config","type","value","tfoot","ref"],"mappings":"AAAA;;AAEA,SAA8BA,UAAU,QAAQ,QAAQ;AAExD,SAASC,mBAAmB,QAAQ,kCAAkC;AACtE,SAASC,WAAW,QAAQ,yBAAyB;AAErD,SAASC,qBAAqB,QAAQ,6BAA6B;AAiBnE;;;;;;;;;CASC,GACD,OAAO,MAAMC,4BAAcJ,WAGzB,SAASI,YAAYC,KAAK,EAAEC,OAAO;IACnC,MAAM,EAAEC,SAAS,EAAEC,SAAS,EAAEC,QAAQ,EAAEC,QAAQ,EAAE,GAAGC,WAAW,GAAGN;IAEnE,MAAMO,SAAST,sBAAsB;QACnCU,MAAM;QACNJ;QACAD;IACF;IAEA,qBACE,KAACP;QAAoBa,OAAOF;kBAC1B,cAAA,KAACG;YACE,GAAGJ,SAAS;YACbK,KAAKV;YACLC,WAAWL,YAAY;gBAAEK;YAAU;sBAElCG;;;AAIT,GAAG"}
1
+ {"version":3,"sources":["../../src/table/TableFooter.tsx"],"sourcesContent":["\"use client\";\n\nimport { type HTMLAttributes, forwardRef } from \"react\";\n\nimport { TableConfigProvider } from \"./TableConfigurationProvider.js\";\nimport { tableFooter } from \"./tableFooterStyles.js\";\nimport { type TableSectionConfiguration } from \"./types.js\";\nimport { useTableSectionConfig } from \"./useTableSectionConfig.js\";\n\nexport interface TableFooterProps\n extends HTMLAttributes<HTMLTableSectionElement>, TableSectionConfiguration {\n /**\n * NOTE: It is recommended to use the `StickyTableSection` component instead\n * of enabling this prop since it supports dynamically adding styles while the\n * header covering table rows.\n *\n * Set this to `true` to enable the sticky behavior.\n *\n * @defaultValue `false`\n */\n sticky?: boolean;\n}\n\n/**\n * **Client Component**\n *\n * Creates a `<tfoot>` element with some basic styles. This component will\n * disable the hover effect and line wrapping by default, but the hover effect\n * and line-wrapping can be re-enabled if desired through the `hoverable` and\n * `disableNoWrap` props.\n *\n * @see {@link https://react-md.dev/components/table | Table Demos}\n */\nexport const TableFooter = forwardRef<\n HTMLTableSectionElement,\n TableFooterProps\n>(function TableFooter(props, propRef) {\n const { className, hoverable, lineWrap, children, ...remaining } = props;\n\n const config = useTableSectionConfig({\n type: \"footer\",\n lineWrap,\n hoverable,\n });\n\n return (\n <TableConfigProvider value={config}>\n <tfoot\n {...remaining}\n ref={propRef}\n className={tableFooter({ className })}\n >\n {children}\n </tfoot>\n </TableConfigProvider>\n );\n});\n"],"names":["forwardRef","TableConfigProvider","tableFooter","useTableSectionConfig","TableFooter","props","propRef","className","hoverable","lineWrap","children","remaining","config","type","value","tfoot","ref"],"mappings":"AAAA;;AAEA,SAA8BA,UAAU,QAAQ,QAAQ;AAExD,SAASC,mBAAmB,QAAQ,kCAAkC;AACtE,SAASC,WAAW,QAAQ,yBAAyB;AAErD,SAASC,qBAAqB,QAAQ,6BAA6B;AAgBnE;;;;;;;;;CASC,GACD,OAAO,MAAMC,4BAAcJ,WAGzB,SAASI,YAAYC,KAAK,EAAEC,OAAO;IACnC,MAAM,EAAEC,SAAS,EAAEC,SAAS,EAAEC,QAAQ,EAAEC,QAAQ,EAAE,GAAGC,WAAW,GAAGN;IAEnE,MAAMO,SAAST,sBAAsB;QACnCU,MAAM;QACNJ;QACAD;IACF;IAEA,qBACE,KAACP;QAAoBa,OAAOF;kBAC1B,cAAA,KAACG;YACE,GAAGJ,SAAS;YACbK,KAAKV;YACLC,WAAWL,YAAY;gBAAEK;YAAU;sBAElCG;;;AAIT,GAAG"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/table/TableHeader.tsx"],"sourcesContent":["\"use client\";\n\nimport { type HTMLAttributes, forwardRef } from \"react\";\n\nimport { TableConfigProvider } from \"./TableConfigurationProvider.js\";\nimport { tableHeader } from \"./tableHeaderStyles.js\";\nimport { type TableSectionConfiguration } from \"./types.js\";\nimport { useTableSectionConfig } from \"./useTableSectionConfig.js\";\n\nexport interface TableHeaderProps\n extends HTMLAttributes<HTMLTableSectionElement>,\n TableSectionConfiguration {\n /**\n * NOTE: It is recommended to use the `StickyTableSection` component instead\n * of enabling this prop since it supports dynamically adding styles while the\n * header covering table rows.\n *\n * Set this to `true` to enable the sticky behavior.\n *\n * @defaultValue `false`\n */\n sticky?: boolean;\n}\n\n/**\n * **Client Component**\n *\n * Creates a `<thead>` element with some basic styles. This component will also\n * update the table configuration so that all the `TableCell` children will\n * automatically become `<th>` elements instead of the normal `<td>` as well as\n * disabling the hover effect and line wrapping. The hover effect and\n * line-wrapping can be re-enabled if desired through the `hoverable` and\n * `disableNoWrap` props.\n *\n * @see {@link https://react-md.dev/components/table | Table Demos}\n */\nexport const TableHeader = forwardRef<\n HTMLTableSectionElement,\n TableHeaderProps\n>(function TableHeader(props, propRef) {\n const { className, sticky, lineWrap, hoverable, children, ...remaining } =\n props;\n\n const config = useTableSectionConfig({\n type: \"header\",\n lineWrap,\n hoverable,\n });\n const { dense } = config;\n\n return (\n <TableConfigProvider value={config}>\n <thead\n {...remaining}\n ref={propRef}\n className={tableHeader({\n className,\n dense,\n sticky,\n })}\n >\n {children}\n </thead>\n </TableConfigProvider>\n );\n});\n"],"names":["forwardRef","TableConfigProvider","tableHeader","useTableSectionConfig","TableHeader","props","propRef","className","sticky","lineWrap","hoverable","children","remaining","config","type","dense","value","thead","ref"],"mappings":"AAAA;;AAEA,SAA8BA,UAAU,QAAQ,QAAQ;AAExD,SAASC,mBAAmB,QAAQ,kCAAkC;AACtE,SAASC,WAAW,QAAQ,yBAAyB;AAErD,SAASC,qBAAqB,QAAQ,6BAA6B;AAiBnE;;;;;;;;;;;CAWC,GACD,OAAO,MAAMC,4BAAcJ,WAGzB,SAASI,YAAYC,KAAK,EAAEC,OAAO;IACnC,MAAM,EAAEC,SAAS,EAAEC,MAAM,EAAEC,QAAQ,EAAEC,SAAS,EAAEC,QAAQ,EAAE,GAAGC,WAAW,GACtEP;IAEF,MAAMQ,SAASV,sBAAsB;QACnCW,MAAM;QACNL;QACAC;IACF;IACA,MAAM,EAAEK,KAAK,EAAE,GAAGF;IAElB,qBACE,KAACZ;QAAoBe,OAAOH;kBAC1B,cAAA,KAACI;YACE,GAAGL,SAAS;YACbM,KAAKZ;YACLC,WAAWL,YAAY;gBACrBK;gBACAQ;gBACAP;YACF;sBAECG;;;AAIT,GAAG"}
1
+ {"version":3,"sources":["../../src/table/TableHeader.tsx"],"sourcesContent":["\"use client\";\n\nimport { type HTMLAttributes, forwardRef } from \"react\";\n\nimport { TableConfigProvider } from \"./TableConfigurationProvider.js\";\nimport { tableHeader } from \"./tableHeaderStyles.js\";\nimport { type TableSectionConfiguration } from \"./types.js\";\nimport { useTableSectionConfig } from \"./useTableSectionConfig.js\";\n\nexport interface TableHeaderProps\n extends HTMLAttributes<HTMLTableSectionElement>, TableSectionConfiguration {\n /**\n * NOTE: It is recommended to use the `StickyTableSection` component instead\n * of enabling this prop since it supports dynamically adding styles while the\n * header covering table rows.\n *\n * Set this to `true` to enable the sticky behavior.\n *\n * @defaultValue `false`\n */\n sticky?: boolean;\n}\n\n/**\n * **Client Component**\n *\n * Creates a `<thead>` element with some basic styles. This component will also\n * update the table configuration so that all the `TableCell` children will\n * automatically become `<th>` elements instead of the normal `<td>` as well as\n * disabling the hover effect and line wrapping. The hover effect and\n * line-wrapping can be re-enabled if desired through the `hoverable` and\n * `disableNoWrap` props.\n *\n * @see {@link https://react-md.dev/components/table | Table Demos}\n */\nexport const TableHeader = forwardRef<\n HTMLTableSectionElement,\n TableHeaderProps\n>(function TableHeader(props, propRef) {\n const { className, sticky, lineWrap, hoverable, children, ...remaining } =\n props;\n\n const config = useTableSectionConfig({\n type: \"header\",\n lineWrap,\n hoverable,\n });\n const { dense } = config;\n\n return (\n <TableConfigProvider value={config}>\n <thead\n {...remaining}\n ref={propRef}\n className={tableHeader({\n className,\n dense,\n sticky,\n })}\n >\n {children}\n </thead>\n </TableConfigProvider>\n );\n});\n"],"names":["forwardRef","TableConfigProvider","tableHeader","useTableSectionConfig","TableHeader","props","propRef","className","sticky","lineWrap","hoverable","children","remaining","config","type","dense","value","thead","ref"],"mappings":"AAAA;;AAEA,SAA8BA,UAAU,QAAQ,QAAQ;AAExD,SAASC,mBAAmB,QAAQ,kCAAkC;AACtE,SAASC,WAAW,QAAQ,yBAAyB;AAErD,SAASC,qBAAqB,QAAQ,6BAA6B;AAgBnE;;;;;;;;;;;CAWC,GACD,OAAO,MAAMC,4BAAcJ,WAGzB,SAASI,YAAYC,KAAK,EAAEC,OAAO;IACnC,MAAM,EAAEC,SAAS,EAAEC,MAAM,EAAEC,QAAQ,EAAEC,SAAS,EAAEC,QAAQ,EAAE,GAAGC,WAAW,GACtEP;IAEF,MAAMQ,SAASV,sBAAsB;QACnCW,MAAM;QACNL;QACAC;IACF;IACA,MAAM,EAAEK,KAAK,EAAE,GAAGF;IAElB,qBACE,KAACZ;QAAoBe,OAAOH;kBAC1B,cAAA,KAACI;YACE,GAAGL,SAAS;YACbM,KAAKZ;YACLC,WAAWL,YAAY;gBACrBK;gBACAQ;gBACAP;YACF;sBAECG;;;AAIT,GAAG"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/table/TableRadio.tsx"],"sourcesContent":["\"use client\";\n\nimport { type TdHTMLAttributes, forwardRef } from \"react\";\n\nimport { type RadioProps } from \"../form/InputToggle.js\";\nimport { Radio } from \"../form/Radio.js\";\nimport { type PropsWithRef } from \"../types.js\";\nimport { TableCell } from \"./TableCell.js\";\n\nconst noop = (): void => {\n // do nothing\n};\n\n/**\n * @since 6.0.0\n */\nexport type TableRadioTdHTMLAttributes = Omit<\n TdHTMLAttributes<HTMLTableCellElement>,\n \"aria-sort\" | \"scope\" | \"onChange\" | \"onInvalid\"\n>;\n\n/**\n * @since 6.0.0\n */\nexport type TableRadioSupportedRadioProps = Pick<\n RadioProps,\n | \"name\"\n | \"value\"\n | \"icon\"\n | \"iconStyle\"\n | \"iconClassName\"\n | \"iconProps\"\n | \"checkedIcon\"\n | \"checked\"\n | \"onChange\"\n | \"defaultChecked\"\n | \"error\"\n | \"required\"\n | \"onInvalid\"\n>;\n\n/**\n * @since 6.0.0\n */\nexport interface TableRadioProps\n extends TableRadioTdHTMLAttributes,\n TableRadioSupportedRadioProps {\n /**\n * @defaultValue `!props[\"aria-labelledby\"] ? \"Select Row\" : undefined`\n */\n \"aria-label\"?: string;\n\n /** @defaultValue `false` */\n sticky?: boolean;\n\n /**\n * This allows you to override any props for the radio that are not\n * configurable as top-level props.\n *\n * @example Simple Example\n * ```tsx\n * radioProps={{\n * id: \"some-custom-id\",\n * ref: radioRef,\n * }}\n * ```\n *\n * @see {@link TableRadioSupportedRadioProps}\n * @since 6.0.0\n */\n radioProps?: PropsWithRef<RadioProps>;\n}\n\n/**\n * **Client Component**\n * The `TableRadio` is used to render a `Radio` within a `TableCell` by applying\n * some minimal styles.\n *\n * @example Simple Example\n * ```tsx\n * import { useRadioGroup } from \"@react-md/core/form/useRadioGroup\";\n * import { Table } from \"@react-md/core/table/Table\";\n * import { TableBody } from \"@react-md/core/table/TableBody\";\n * import { TableCell } from \"@react-md/core/table/TableCell\";\n * import { TableContainer } from \"@react-md/core/table/TableContainer\";\n * import { TableHeader } from \"@react-md/core/table/TableHeader\";\n * import { TableRadio } from \"@react-md/core/table/TableRadio\";\n * import { TableRow } from \"@react-md/core/table/TableRow\";\n * import type { ReactElement } from \"react\";\n *\n * const rows = [\n * { name: \"Frozen Yogurt\", type: \"Ice Cream\" },\n * { name: \"Ice cream sandwich\", type: \"Ice Cream\" },\n * { name: \"Eclair\", type: \"Pastry\" },\n * // ...other content\n * ] as const;\n *\n * function Example(): ReactElement {\n * const { getRadioProps } = useRadioGroup({\n * name: \"selected\",\n * });\n * return (\n * <TableContainer>\n * <Table>\n * <TableHeader>\n * <TableRow>\n * <TableCell header={false} />\n * <TableCell>Name</TableCell>\n * <TableCell>Type</TableCell>\n * </TableRow>\n * </TableHeader>\n * <TableBody>\n * {rows.map(({ name, type }) => {\n * const radioProps = getRadioProps(name);\n * const { checked, onChange } = radioProps;\n *\n * return (\n * <TableRow\n * key={name}\n * onClick={onChange}\n * clickable\n * selected={checked}\n * >\n * <TableRadio {...radioProps} />\n * <TableCell>{name}</TableCell>\n * <TableCell hAlign=\"right\">{type}</TableCell>\n * </TableRow>\n * );\n * })}\n * </TableBody>\n * </Table>\n * </TableContainer>\n * );\n * }\n * ```\n *\n * @see {@link https://react-md.dev/components/table | Table Demos}\n * @since 6.0.0\n */\nexport const TableRadio = forwardRef<HTMLTableCellElement, TableRadioProps>(\n function TableRadio(props, ref) {\n const {\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-label\": ariaLabel = !ariaLabelledBy ? \"Select Row\" : undefined,\n \"aria-controls\": ariaControls,\n name,\n icon,\n iconProps,\n iconStyle,\n iconClassName,\n checkedIcon,\n value,\n checked,\n onChange,\n defaultChecked,\n radioProps,\n onClick = noop,\n error,\n required,\n onInvalid,\n ...remaining\n } = props;\n\n return (\n <TableCell\n {...remaining}\n ref={ref}\n header={false}\n inputToggle\n onClick={(event) => {\n event.stopPropagation();\n onClick(event);\n }}\n >\n <Radio\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n aria-controls={ariaControls}\n name={name}\n icon={icon}\n iconProps={iconProps}\n iconStyle={iconStyle}\n iconClassName={iconClassName}\n checkedIcon={checkedIcon}\n value={value}\n checked={checked}\n defaultChecked={defaultChecked}\n error={error}\n required={required}\n onChange={onChange}\n onInvalid={onInvalid}\n {...radioProps}\n />\n </TableCell>\n );\n }\n);\n"],"names":["forwardRef","Radio","TableCell","noop","TableRadio","props","ref","ariaLabelledBy","ariaLabel","undefined","ariaControls","name","icon","iconProps","iconStyle","iconClassName","checkedIcon","value","checked","onChange","defaultChecked","radioProps","onClick","error","required","onInvalid","remaining","header","inputToggle","event","stopPropagation","aria-label","aria-labelledby","aria-controls"],"mappings":"AAAA;;AAEA,SAAgCA,UAAU,QAAQ,QAAQ;AAG1D,SAASC,KAAK,QAAQ,mBAAmB;AAEzC,SAASC,SAAS,QAAQ,iBAAiB;AAE3C,MAAMC,OAAO;AACX,aAAa;AACf;AA8DA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiEC,GACD,OAAO,MAAMC,2BAAaJ,WACxB,SAASI,WAAWC,KAAK,EAAEC,GAAG;IAC5B,MAAM,EACJ,mBAAmBC,cAAc,EACjC,cAAcC,YAAY,CAACD,iBAAiB,eAAeE,SAAS,EACpE,iBAAiBC,YAAY,EAC7BC,IAAI,EACJC,IAAI,EACJC,SAAS,EACTC,SAAS,EACTC,aAAa,EACbC,WAAW,EACXC,KAAK,EACLC,OAAO,EACPC,QAAQ,EACRC,cAAc,EACdC,UAAU,EACVC,UAAUnB,IAAI,EACdoB,KAAK,EACLC,QAAQ,EACRC,SAAS,EACT,GAAGC,WACJ,GAAGrB;IAEJ,qBACE,KAACH;QACE,GAAGwB,SAAS;QACbpB,KAAKA;QACLqB,QAAQ;QACRC,WAAW;QACXN,SAAS,CAACO;YACRA,MAAMC,eAAe;YACrBR,QAAQO;QACV;kBAEA,cAAA,KAAC5B;YACC8B,cAAYvB;YACZwB,mBAAiBzB;YACjB0B,iBAAevB;YACfC,MAAMA;YACNC,MAAMA;YACNC,WAAWA;YACXC,WAAWA;YACXC,eAAeA;YACfC,aAAaA;YACbC,OAAOA;YACPC,SAASA;YACTE,gBAAgBA;YAChBG,OAAOA;YACPC,UAAUA;YACVL,UAAUA;YACVM,WAAWA;YACV,GAAGJ,UAAU;;;AAItB,GACA"}
1
+ {"version":3,"sources":["../../src/table/TableRadio.tsx"],"sourcesContent":["\"use client\";\n\nimport { type TdHTMLAttributes, forwardRef } from \"react\";\n\nimport { type RadioProps } from \"../form/InputToggle.js\";\nimport { Radio } from \"../form/Radio.js\";\nimport { type PropsWithRef } from \"../types.js\";\nimport { TableCell } from \"./TableCell.js\";\n\nconst noop = (): void => {\n // do nothing\n};\n\n/**\n * @since 6.0.0\n */\nexport type TableRadioTdHTMLAttributes = Omit<\n TdHTMLAttributes<HTMLTableCellElement>,\n \"aria-sort\" | \"scope\" | \"onChange\" | \"onInvalid\"\n>;\n\n/**\n * @since 6.0.0\n */\nexport type TableRadioSupportedRadioProps = Pick<\n RadioProps,\n | \"name\"\n | \"value\"\n | \"icon\"\n | \"iconStyle\"\n | \"iconClassName\"\n | \"iconProps\"\n | \"checkedIcon\"\n | \"checked\"\n | \"onChange\"\n | \"defaultChecked\"\n | \"error\"\n | \"required\"\n | \"onInvalid\"\n>;\n\n/**\n * @since 6.0.0\n */\nexport interface TableRadioProps\n extends TableRadioTdHTMLAttributes, TableRadioSupportedRadioProps {\n /**\n * @defaultValue `!props[\"aria-labelledby\"] ? \"Select Row\" : undefined`\n */\n \"aria-label\"?: string;\n\n /** @defaultValue `false` */\n sticky?: boolean;\n\n /**\n * This allows you to override any props for the radio that are not\n * configurable as top-level props.\n *\n * @example Simple Example\n * ```tsx\n * radioProps={{\n * id: \"some-custom-id\",\n * ref: radioRef,\n * }}\n * ```\n *\n * @see {@link TableRadioSupportedRadioProps}\n * @since 6.0.0\n */\n radioProps?: PropsWithRef<RadioProps>;\n}\n\n/**\n * **Client Component**\n * The `TableRadio` is used to render a `Radio` within a `TableCell` by applying\n * some minimal styles.\n *\n * @example Simple Example\n * ```tsx\n * import { useRadioGroup } from \"@react-md/core/form/useRadioGroup\";\n * import { Table } from \"@react-md/core/table/Table\";\n * import { TableBody } from \"@react-md/core/table/TableBody\";\n * import { TableCell } from \"@react-md/core/table/TableCell\";\n * import { TableContainer } from \"@react-md/core/table/TableContainer\";\n * import { TableHeader } from \"@react-md/core/table/TableHeader\";\n * import { TableRadio } from \"@react-md/core/table/TableRadio\";\n * import { TableRow } from \"@react-md/core/table/TableRow\";\n * import type { ReactElement } from \"react\";\n *\n * const rows = [\n * { name: \"Frozen Yogurt\", type: \"Ice Cream\" },\n * { name: \"Ice cream sandwich\", type: \"Ice Cream\" },\n * { name: \"Eclair\", type: \"Pastry\" },\n * // ...other content\n * ] as const;\n *\n * function Example(): ReactElement {\n * const { getRadioProps } = useRadioGroup({\n * name: \"selected\",\n * });\n * return (\n * <TableContainer>\n * <Table>\n * <TableHeader>\n * <TableRow>\n * <TableCell header={false} />\n * <TableCell>Name</TableCell>\n * <TableCell>Type</TableCell>\n * </TableRow>\n * </TableHeader>\n * <TableBody>\n * {rows.map(({ name, type }) => {\n * const radioProps = getRadioProps(name);\n * const { checked, onChange } = radioProps;\n *\n * return (\n * <TableRow\n * key={name}\n * onClick={onChange}\n * clickable\n * selected={checked}\n * >\n * <TableRadio {...radioProps} />\n * <TableCell>{name}</TableCell>\n * <TableCell hAlign=\"right\">{type}</TableCell>\n * </TableRow>\n * );\n * })}\n * </TableBody>\n * </Table>\n * </TableContainer>\n * );\n * }\n * ```\n *\n * @see {@link https://react-md.dev/components/table | Table Demos}\n * @since 6.0.0\n */\nexport const TableRadio = forwardRef<HTMLTableCellElement, TableRadioProps>(\n function TableRadio(props, ref) {\n const {\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-label\": ariaLabel = !ariaLabelledBy ? \"Select Row\" : undefined,\n \"aria-controls\": ariaControls,\n name,\n icon,\n iconProps,\n iconStyle,\n iconClassName,\n checkedIcon,\n value,\n checked,\n onChange,\n defaultChecked,\n radioProps,\n onClick = noop,\n error,\n required,\n onInvalid,\n ...remaining\n } = props;\n\n return (\n <TableCell\n {...remaining}\n ref={ref}\n header={false}\n inputToggle\n onClick={(event) => {\n event.stopPropagation();\n onClick(event);\n }}\n >\n <Radio\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n aria-controls={ariaControls}\n name={name}\n icon={icon}\n iconProps={iconProps}\n iconStyle={iconStyle}\n iconClassName={iconClassName}\n checkedIcon={checkedIcon}\n value={value}\n checked={checked}\n defaultChecked={defaultChecked}\n error={error}\n required={required}\n onChange={onChange}\n onInvalid={onInvalid}\n {...radioProps}\n />\n </TableCell>\n );\n }\n);\n"],"names":["forwardRef","Radio","TableCell","noop","TableRadio","props","ref","ariaLabelledBy","ariaLabel","undefined","ariaControls","name","icon","iconProps","iconStyle","iconClassName","checkedIcon","value","checked","onChange","defaultChecked","radioProps","onClick","error","required","onInvalid","remaining","header","inputToggle","event","stopPropagation","aria-label","aria-labelledby","aria-controls"],"mappings":"AAAA;;AAEA,SAAgCA,UAAU,QAAQ,QAAQ;AAG1D,SAASC,KAAK,QAAQ,mBAAmB;AAEzC,SAASC,SAAS,QAAQ,iBAAiB;AAE3C,MAAMC,OAAO;AACX,aAAa;AACf;AA6DA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiEC,GACD,OAAO,MAAMC,2BAAaJ,WACxB,SAASI,WAAWC,KAAK,EAAEC,GAAG;IAC5B,MAAM,EACJ,mBAAmBC,cAAc,EACjC,cAAcC,YAAY,CAACD,iBAAiB,eAAeE,SAAS,EACpE,iBAAiBC,YAAY,EAC7BC,IAAI,EACJC,IAAI,EACJC,SAAS,EACTC,SAAS,EACTC,aAAa,EACbC,WAAW,EACXC,KAAK,EACLC,OAAO,EACPC,QAAQ,EACRC,cAAc,EACdC,UAAU,EACVC,UAAUnB,IAAI,EACdoB,KAAK,EACLC,QAAQ,EACRC,SAAS,EACT,GAAGC,WACJ,GAAGrB;IAEJ,qBACE,KAACH;QACE,GAAGwB,SAAS;QACbpB,KAAKA;QACLqB,QAAQ;QACRC,WAAW;QACXN,SAAS,CAACO;YACRA,MAAMC,eAAe;YACrBR,QAAQO;QACV;kBAEA,cAAA,KAAC5B;YACC8B,cAAYvB;YACZwB,mBAAiBzB;YACjB0B,iBAAevB;YACfC,MAAMA;YACNC,MAAMA;YACNC,WAAWA;YACXC,WAAWA;YACXC,eAAeA;YACfC,aAAaA;YACbC,OAAOA;YACPC,SAASA;YACTE,gBAAgBA;YAChBG,OAAOA;YACPC,UAAUA;YACVL,UAAUA;YACVM,WAAWA;YACV,GAAGJ,UAAU;;;AAItB,GACA"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/table/TableRow.tsx"],"sourcesContent":["\"use client\";\n\nimport { type HTMLAttributes, forwardRef } from \"react\";\n\nimport { useTableConfig } from \"./TableConfigurationProvider.js\";\nimport { tableRow } from \"./tableRowStyles.js\";\nimport { type TableRowConfiguration } from \"./types.js\";\n\nexport interface TableRowProps\n extends HTMLAttributes<HTMLTableRowElement>,\n TableRowConfiguration {\n /**\n * Boolean if the current row has been selected and should apply the selected\n * background-color.\n *\n * @defaultValue `false`\n */\n selected?: boolean;\n\n /**\n * Boolean if the row should be clickable and update the cursor while hovered\n * to be a pointer.\n *\n * @defaultValue `false`\n */\n clickable?: boolean;\n}\n\n/**\n * **Client Component**\n *\n * Creates a `<tr>` element with some general styles that are inherited from the\n * base table configuration.\n *\n * @see {@link https://react-md.dev/components/table | Table Demos}\n */\nexport const TableRow = forwardRef<HTMLTableRowElement, TableRowProps>(\n function TableRow(props, ref) {\n const {\n className,\n disableHover: propDisableHover,\n disableBorders: propDisableBorders,\n children,\n selected = false,\n clickable = false,\n ...remaining\n } = props;\n\n const { disableHover, disableBorders } = useTableConfig({\n disableHover: propDisableHover,\n disableBorders: propDisableBorders,\n });\n\n return (\n <tr\n {...remaining}\n ref={ref}\n className={tableRow({\n selected,\n clickable,\n disableHover,\n disableBorders,\n className,\n })}\n >\n {children}\n </tr>\n );\n }\n);\n"],"names":["forwardRef","useTableConfig","tableRow","TableRow","props","ref","className","disableHover","propDisableHover","disableBorders","propDisableBorders","children","selected","clickable","remaining","tr"],"mappings":"AAAA;;AAEA,SAA8BA,UAAU,QAAQ,QAAQ;AAExD,SAASC,cAAc,QAAQ,kCAAkC;AACjE,SAASC,QAAQ,QAAQ,sBAAsB;AAuB/C;;;;;;;CAOC,GACD,OAAO,MAAMC,yBAAWH,WACtB,SAASG,SAASC,KAAK,EAAEC,GAAG;IAC1B,MAAM,EACJC,SAAS,EACTC,cAAcC,gBAAgB,EAC9BC,gBAAgBC,kBAAkB,EAClCC,QAAQ,EACRC,WAAW,KAAK,EAChBC,YAAY,KAAK,EACjB,GAAGC,WACJ,GAAGV;IAEJ,MAAM,EAAEG,YAAY,EAAEE,cAAc,EAAE,GAAGR,eAAe;QACtDM,cAAcC;QACdC,gBAAgBC;IAClB;IAEA,qBACE,KAACK;QACE,GAAGD,SAAS;QACbT,KAAKA;QACLC,WAAWJ,SAAS;YAClBU;YACAC;YACAN;YACAE;YACAH;QACF;kBAECK;;AAGP,GACA"}
1
+ {"version":3,"sources":["../../src/table/TableRow.tsx"],"sourcesContent":["\"use client\";\n\nimport { type HTMLAttributes, forwardRef } from \"react\";\n\nimport { useTableConfig } from \"./TableConfigurationProvider.js\";\nimport { tableRow } from \"./tableRowStyles.js\";\nimport { type TableRowConfiguration } from \"./types.js\";\n\nexport interface TableRowProps\n extends HTMLAttributes<HTMLTableRowElement>, TableRowConfiguration {\n /**\n * Boolean if the current row has been selected and should apply the selected\n * background-color.\n *\n * @defaultValue `false`\n */\n selected?: boolean;\n\n /**\n * Boolean if the row should be clickable and update the cursor while hovered\n * to be a pointer.\n *\n * @defaultValue `false`\n */\n clickable?: boolean;\n}\n\n/**\n * **Client Component**\n *\n * Creates a `<tr>` element with some general styles that are inherited from the\n * base table configuration.\n *\n * @see {@link https://react-md.dev/components/table | Table Demos}\n */\nexport const TableRow = forwardRef<HTMLTableRowElement, TableRowProps>(\n function TableRow(props, ref) {\n const {\n className,\n disableHover: propDisableHover,\n disableBorders: propDisableBorders,\n children,\n selected = false,\n clickable = false,\n ...remaining\n } = props;\n\n const { disableHover, disableBorders } = useTableConfig({\n disableHover: propDisableHover,\n disableBorders: propDisableBorders,\n });\n\n return (\n <tr\n {...remaining}\n ref={ref}\n className={tableRow({\n selected,\n clickable,\n disableHover,\n disableBorders,\n className,\n })}\n >\n {children}\n </tr>\n );\n }\n);\n"],"names":["forwardRef","useTableConfig","tableRow","TableRow","props","ref","className","disableHover","propDisableHover","disableBorders","propDisableBorders","children","selected","clickable","remaining","tr"],"mappings":"AAAA;;AAEA,SAA8BA,UAAU,QAAQ,QAAQ;AAExD,SAASC,cAAc,QAAQ,kCAAkC;AACjE,SAASC,QAAQ,QAAQ,sBAAsB;AAsB/C;;;;;;;CAOC,GACD,OAAO,MAAMC,yBAAWH,WACtB,SAASG,SAASC,KAAK,EAAEC,GAAG;IAC1B,MAAM,EACJC,SAAS,EACTC,cAAcC,gBAAgB,EAC9BC,gBAAgBC,kBAAkB,EAClCC,QAAQ,EACRC,WAAW,KAAK,EAChBC,YAAY,KAAK,EACjB,GAAGC,WACJ,GAAGV;IAEJ,MAAM,EAAEG,YAAY,EAAEE,cAAc,EAAE,GAAGR,eAAe;QACtDM,cAAcC;QACdC,gBAAgBC;IAClB;IAEA,qBACE,KAACK;QACE,GAAGD,SAAS;QACbT,KAAKA;QACLC,WAAWJ,SAAS;YAClBU;YACAC;YACAN;YACAE;YACAH;QACF;kBAECK;;AAGP,GACA"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/table/useStickyTableSection.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n type ReactNode,\n type Ref,\n type RefCallback,\n useCallback,\n useState,\n} from \"react\";\n\nimport { useEnsuredRef } from \"../useEnsuredRef.js\";\nimport { useIntersectionObserver } from \"../useIntersectionObserver.js\";\nimport { useTableContainer } from \"./TableContainerProvider.js\";\nimport {\n type IsStickyTableSectionActive,\n type TableStickySectionConfiguration,\n} from \"./types.js\";\n\n/**\n * @since 6.0.0\n */\nexport const isTableHeaderStickyActive: IsStickyTableSectionActive = (\n entry\n) => {\n return (\n entry.intersectionRatio < 1 &&\n entry.boundingClientRect.bottom <= window.innerHeight\n );\n};\n\n/**\n * @since 6.0.0\n */\nexport const isTableFooterStickyActive: IsStickyTableSectionActive = (\n entry,\n isInTableContainer\n) => {\n const { intersectionRatio, boundingClientRect, isIntersecting } = entry;\n if (isInTableContainer) {\n return !isIntersecting;\n }\n\n return intersectionRatio < 1 && boundingClientRect.top >= 0;\n};\n\n/** @since 6.0.0 */\nexport interface TableStickySectionOptions\n extends TableStickySectionConfiguration {\n ref?: Ref<HTMLTableSectionElement>;\n type: \"header\" | \"footer\";\n}\n\n/** @since 6.0.0 */\nexport interface TableStickySectionImplementation {\n tbody: ReactNode;\n targetRef: RefCallback<HTMLTableSectionElement>;\n sectionRef: RefCallback<HTMLTableSectionElement>;\n stickyActive: boolean;\n}\n\n/**\n * @since 6.0.0\n * @internal\n */\nexport function useStickyTableSection(\n options: TableStickySectionOptions\n): TableStickySectionImplementation {\n const { ref, type, disableStickyStyles, stickyOptions } = options;\n\n const isHeader = type === \"header\";\n const isStickyActive =\n options.isStickyActive ??\n (isHeader ? isTableHeaderStickyActive : isTableFooterStickyActive);\n\n const [sectionRef, sectionRefCallback] = useEnsuredRef(ref);\n const { exists, containerRef } = useTableContainer();\n const [stickyActive, setStickyActive] = useState(false);\n const targetRef = useIntersectionObserver({\n ref: exists ? undefined : sectionRefCallback,\n root: containerRef,\n disabled: disableStickyStyles,\n threshold: exists ? 0 : 1,\n getRootMargin: useCallback(() => {\n const section = sectionRef.current;\n if (!isHeader) {\n const topOffset = exists && section ? section.offsetHeight - 1 : 1;\n\n return `0px 0px -${topOffset}px 0px`;\n }\n\n if (!section) {\n return;\n }\n\n let topOffset: number;\n if (exists) {\n topOffset = section.offsetHeight - 1;\n } else {\n const top = parseFloat(window.getComputedStyle(section).top);\n topOffset = Number.isNaN(top) ? 1 : top + 1;\n }\n\n return `-${topOffset}px 0px 0px`;\n }, [exists, isHeader, sectionRef]),\n onUpdate: useCallback(\n ([entry]) => {\n setStickyActive(isStickyActive(entry, exists));\n },\n [exists, isStickyActive]\n ),\n // allow the user defined sticky options to override the default behavior\n ...stickyOptions,\n });\n\n let tbody: ReactNode;\n if (exists && !disableStickyStyles) {\n // rendering a `<tbody>` since it is valid to have 0-many in a table\n // https://html.spec.whatwg.org/multipage/tables.html#the-table-element\n tbody = <tbody aria-hidden ref={targetRef} />;\n }\n\n return {\n tbody,\n targetRef,\n sectionRef: exists ? sectionRefCallback : targetRef,\n stickyActive,\n };\n}\n"],"names":["useCallback","useState","useEnsuredRef","useIntersectionObserver","useTableContainer","isTableHeaderStickyActive","entry","intersectionRatio","boundingClientRect","bottom","window","innerHeight","isTableFooterStickyActive","isInTableContainer","isIntersecting","top","useStickyTableSection","options","ref","type","disableStickyStyles","stickyOptions","isHeader","isStickyActive","sectionRef","sectionRefCallback","exists","containerRef","stickyActive","setStickyActive","targetRef","undefined","root","disabled","threshold","getRootMargin","section","current","topOffset","offsetHeight","parseFloat","getComputedStyle","Number","isNaN","onUpdate","tbody","aria-hidden"],"mappings":"AAAA;;AAEA,SAIEA,WAAW,EACXC,QAAQ,QACH,QAAQ;AAEf,SAASC,aAAa,QAAQ,sBAAsB;AACpD,SAASC,uBAAuB,QAAQ,gCAAgC;AACxE,SAASC,iBAAiB,QAAQ,8BAA8B;AAMhE;;CAEC,GACD,OAAO,MAAMC,4BAAwD,CACnEC;IAEA,OACEA,MAAMC,iBAAiB,GAAG,KAC1BD,MAAME,kBAAkB,CAACC,MAAM,IAAIC,OAAOC,WAAW;AAEzD,EAAE;AAEF;;CAEC,GACD,OAAO,MAAMC,4BAAwD,CACnEN,OACAO;IAEA,MAAM,EAAEN,iBAAiB,EAAEC,kBAAkB,EAAEM,cAAc,EAAE,GAAGR;IAClE,IAAIO,oBAAoB;QACtB,OAAO,CAACC;IACV;IAEA,OAAOP,oBAAoB,KAAKC,mBAAmBO,GAAG,IAAI;AAC5D,EAAE;AAiBF;;;CAGC,GACD,OAAO,SAASC,sBACdC,OAAkC;IAElC,MAAM,EAAEC,GAAG,EAAEC,IAAI,EAAEC,mBAAmB,EAAEC,aAAa,EAAE,GAAGJ;IAE1D,MAAMK,WAAWH,SAAS;IAC1B,MAAMI,iBACJN,QAAQM,cAAc,IACrBD,CAAAA,WAAWjB,4BAA4BO,yBAAwB;IAElE,MAAM,CAACY,YAAYC,mBAAmB,GAAGvB,cAAcgB;IACvD,MAAM,EAAEQ,MAAM,EAAEC,YAAY,EAAE,GAAGvB;IACjC,MAAM,CAACwB,cAAcC,gBAAgB,GAAG5B,SAAS;IACjD,MAAM6B,YAAY3B,wBAAwB;QACxCe,KAAKQ,SAASK,YAAYN;QAC1BO,MAAML;QACNM,UAAUb;QACVc,WAAWR,SAAS,IAAI;QACxBS,eAAenC,YAAY;YACzB,MAAMoC,UAAUZ,WAAWa,OAAO;YAClC,IAAI,CAACf,UAAU;gBACb,MAAMgB,YAAYZ,UAAUU,UAAUA,QAAQG,YAAY,GAAG,IAAI;gBAEjE,OAAO,CAAC,SAAS,EAAED,UAAU,MAAM,CAAC;YACtC;YAEA,IAAI,CAACF,SAAS;gBACZ;YACF;YAEA,IAAIE;YACJ,IAAIZ,QAAQ;gBACVY,YAAYF,QAAQG,YAAY,GAAG;YACrC,OAAO;gBACL,MAAMxB,MAAMyB,WAAW9B,OAAO+B,gBAAgB,CAACL,SAASrB,GAAG;gBAC3DuB,YAAYI,OAAOC,KAAK,CAAC5B,OAAO,IAAIA,MAAM;YAC5C;YAEA,OAAO,CAAC,CAAC,EAAEuB,UAAU,UAAU,CAAC;QAClC,GAAG;YAACZ;YAAQJ;YAAUE;SAAW;QACjCoB,UAAU5C,YACR,CAAC,CAACM,MAAM;YACNuB,gBAAgBN,eAAejB,OAAOoB;QACxC,GACA;YAACA;YAAQH;SAAe;QAE1B,yEAAyE;QACzE,GAAGF,aAAa;IAClB;IAEA,IAAIwB;IACJ,IAAInB,UAAU,CAACN,qBAAqB;QAClC,oEAAoE;QACpE,uEAAuE;QACvEyB,sBAAQ,KAACA;YAAMC,aAAW;YAAC5B,KAAKY;;IAClC;IAEA,OAAO;QACLe;QACAf;QACAN,YAAYE,SAASD,qBAAqBK;QAC1CF;IACF;AACF"}
1
+ {"version":3,"sources":["../../src/table/useStickyTableSection.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n type ReactNode,\n type Ref,\n type RefCallback,\n useCallback,\n useState,\n} from \"react\";\n\nimport { useEnsuredRef } from \"../useEnsuredRef.js\";\nimport { useIntersectionObserver } from \"../useIntersectionObserver.js\";\nimport { useTableContainer } from \"./TableContainerProvider.js\";\nimport {\n type IsStickyTableSectionActive,\n type TableStickySectionConfiguration,\n} from \"./types.js\";\n\n/**\n * @since 6.0.0\n */\nexport const isTableHeaderStickyActive: IsStickyTableSectionActive = (\n entry\n) => {\n return (\n entry.intersectionRatio < 1 &&\n entry.boundingClientRect.bottom <= window.innerHeight\n );\n};\n\n/**\n * @since 6.0.0\n */\nexport const isTableFooterStickyActive: IsStickyTableSectionActive = (\n entry,\n isInTableContainer\n) => {\n const { intersectionRatio, boundingClientRect, isIntersecting } = entry;\n if (isInTableContainer) {\n return !isIntersecting;\n }\n\n return intersectionRatio < 1 && boundingClientRect.top >= 0;\n};\n\n/** @since 6.0.0 */\nexport interface TableStickySectionOptions extends TableStickySectionConfiguration {\n ref?: Ref<HTMLTableSectionElement>;\n type: \"header\" | \"footer\";\n}\n\n/** @since 6.0.0 */\nexport interface TableStickySectionImplementation {\n tbody: ReactNode;\n targetRef: RefCallback<HTMLTableSectionElement>;\n sectionRef: RefCallback<HTMLTableSectionElement>;\n stickyActive: boolean;\n}\n\n/**\n * @since 6.0.0\n * @internal\n */\nexport function useStickyTableSection(\n options: TableStickySectionOptions\n): TableStickySectionImplementation {\n const { ref, type, disableStickyStyles, stickyOptions } = options;\n\n const isHeader = type === \"header\";\n const isStickyActive =\n options.isStickyActive ??\n (isHeader ? isTableHeaderStickyActive : isTableFooterStickyActive);\n\n const [sectionRef, sectionRefCallback] = useEnsuredRef(ref);\n const { exists, containerRef } = useTableContainer();\n const [stickyActive, setStickyActive] = useState(false);\n const targetRef = useIntersectionObserver({\n ref: exists ? undefined : sectionRefCallback,\n root: containerRef,\n disabled: disableStickyStyles,\n threshold: exists ? 0 : 1,\n getRootMargin: useCallback(() => {\n const section = sectionRef.current;\n if (!isHeader) {\n const topOffset = exists && section ? section.offsetHeight - 1 : 1;\n\n return `0px 0px -${topOffset}px 0px`;\n }\n\n if (!section) {\n return;\n }\n\n let topOffset: number;\n if (exists) {\n topOffset = section.offsetHeight - 1;\n } else {\n const top = parseFloat(window.getComputedStyle(section).top);\n topOffset = Number.isNaN(top) ? 1 : top + 1;\n }\n\n return `-${topOffset}px 0px 0px`;\n }, [exists, isHeader, sectionRef]),\n onUpdate: useCallback(\n ([entry]) => {\n setStickyActive(isStickyActive(entry, exists));\n },\n [exists, isStickyActive]\n ),\n // allow the user defined sticky options to override the default behavior\n ...stickyOptions,\n });\n\n let tbody: ReactNode;\n if (exists && !disableStickyStyles) {\n // rendering a `<tbody>` since it is valid to have 0-many in a table\n // https://html.spec.whatwg.org/multipage/tables.html#the-table-element\n tbody = <tbody aria-hidden ref={targetRef} />;\n }\n\n return {\n tbody,\n targetRef,\n sectionRef: exists ? sectionRefCallback : targetRef,\n stickyActive,\n };\n}\n"],"names":["useCallback","useState","useEnsuredRef","useIntersectionObserver","useTableContainer","isTableHeaderStickyActive","entry","intersectionRatio","boundingClientRect","bottom","window","innerHeight","isTableFooterStickyActive","isInTableContainer","isIntersecting","top","useStickyTableSection","options","ref","type","disableStickyStyles","stickyOptions","isHeader","isStickyActive","sectionRef","sectionRefCallback","exists","containerRef","stickyActive","setStickyActive","targetRef","undefined","root","disabled","threshold","getRootMargin","section","current","topOffset","offsetHeight","parseFloat","getComputedStyle","Number","isNaN","onUpdate","tbody","aria-hidden"],"mappings":"AAAA;;AAEA,SAIEA,WAAW,EACXC,QAAQ,QACH,QAAQ;AAEf,SAASC,aAAa,QAAQ,sBAAsB;AACpD,SAASC,uBAAuB,QAAQ,gCAAgC;AACxE,SAASC,iBAAiB,QAAQ,8BAA8B;AAMhE;;CAEC,GACD,OAAO,MAAMC,4BAAwD,CACnEC;IAEA,OACEA,MAAMC,iBAAiB,GAAG,KAC1BD,MAAME,kBAAkB,CAACC,MAAM,IAAIC,OAAOC,WAAW;AAEzD,EAAE;AAEF;;CAEC,GACD,OAAO,MAAMC,4BAAwD,CACnEN,OACAO;IAEA,MAAM,EAAEN,iBAAiB,EAAEC,kBAAkB,EAAEM,cAAc,EAAE,GAAGR;IAClE,IAAIO,oBAAoB;QACtB,OAAO,CAACC;IACV;IAEA,OAAOP,oBAAoB,KAAKC,mBAAmBO,GAAG,IAAI;AAC5D,EAAE;AAgBF;;;CAGC,GACD,OAAO,SAASC,sBACdC,OAAkC;IAElC,MAAM,EAAEC,GAAG,EAAEC,IAAI,EAAEC,mBAAmB,EAAEC,aAAa,EAAE,GAAGJ;IAE1D,MAAMK,WAAWH,SAAS;IAC1B,MAAMI,iBACJN,QAAQM,cAAc,IACrBD,CAAAA,WAAWjB,4BAA4BO,yBAAwB;IAElE,MAAM,CAACY,YAAYC,mBAAmB,GAAGvB,cAAcgB;IACvD,MAAM,EAAEQ,MAAM,EAAEC,YAAY,EAAE,GAAGvB;IACjC,MAAM,CAACwB,cAAcC,gBAAgB,GAAG5B,SAAS;IACjD,MAAM6B,YAAY3B,wBAAwB;QACxCe,KAAKQ,SAASK,YAAYN;QAC1BO,MAAML;QACNM,UAAUb;QACVc,WAAWR,SAAS,IAAI;QACxBS,eAAenC,YAAY;YACzB,MAAMoC,UAAUZ,WAAWa,OAAO;YAClC,IAAI,CAACf,UAAU;gBACb,MAAMgB,YAAYZ,UAAUU,UAAUA,QAAQG,YAAY,GAAG,IAAI;gBAEjE,OAAO,CAAC,SAAS,EAAED,UAAU,MAAM,CAAC;YACtC;YAEA,IAAI,CAACF,SAAS;gBACZ;YACF;YAEA,IAAIE;YACJ,IAAIZ,QAAQ;gBACVY,YAAYF,QAAQG,YAAY,GAAG;YACrC,OAAO;gBACL,MAAMxB,MAAMyB,WAAW9B,OAAO+B,gBAAgB,CAACL,SAASrB,GAAG;gBAC3DuB,YAAYI,OAAOC,KAAK,CAAC5B,OAAO,IAAIA,MAAM;YAC5C;YAEA,OAAO,CAAC,CAAC,EAAEuB,UAAU,UAAU,CAAC;QAClC,GAAG;YAACZ;YAAQJ;YAAUE;SAAW;QACjCoB,UAAU5C,YACR,CAAC,CAACM,MAAM;YACNuB,gBAAgBN,eAAejB,OAAOoB;QACxC,GACA;YAACA;YAAQH;SAAe;QAE1B,yEAAyE;QACzE,GAAGF,aAAa;IAClB;IAEA,IAAIwB;IACJ,IAAInB,UAAU,CAACN,qBAAqB;QAClC,oEAAoE;QACpE,uEAAuE;QACvEyB,sBAAQ,KAACA;YAAMC,aAAW;YAAC5B,KAAKY;;IAClC;IAEA,OAAO;QACLe;QACAf;QACAN,YAAYE,SAASD,qBAAqBK;QAC1CF;IACF;AACF"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/tabs/SimpleTabPanel.tsx"],"sourcesContent":["import { cnb } from \"cnbuilder\";\nimport { type HTMLAttributes, type ReactNode, forwardRef } from \"react\";\n\nimport { DISPLAY_NONE_CLASS } from \"../utils/isElementVisible.js\";\nimport { type ProvidedTabPanelProps } from \"./useTabs.js\";\n\n/**\n * @since 6.0.0\n */\nexport interface SimpleTabPanelProps\n extends Omit<HTMLAttributes<HTMLDivElement>, keyof ProvidedTabPanelProps>,\n ProvidedTabPanelProps {\n children: ReactNode;\n}\n\n/**\n * This component can be a replacement for the `Slide` component when animations\n * are not required for changing the active tab contents.\n *\n * This should generally be used along with the `SimpleTabPanels` component.\n *\n * @see {@link https://react-md.dev/components/tabs | Tabs Demos}\n * @see {@link https://react-md.dev/components/tabs#disable-tab-panel-transition|Disable Tab Panel Transition Demo}\n * @since 6.0.0\n */\nexport const SimpleTabPanel = forwardRef<HTMLDivElement, SimpleTabPanelProps>(\n function SimpleTabPanel(props, ref) {\n const { active, className, ...remaining } = props;\n return (\n <div\n ref={ref}\n {...remaining}\n className={cnb(!active && DISPLAY_NONE_CLASS, className)}\n />\n );\n }\n);\n"],"names":["cnb","forwardRef","DISPLAY_NONE_CLASS","SimpleTabPanel","props","ref","active","className","remaining","div"],"mappings":";AAAA,SAASA,GAAG,QAAQ,YAAY;AAChC,SAA8CC,UAAU,QAAQ,QAAQ;AAExE,SAASC,kBAAkB,QAAQ,+BAA+B;AAYlE;;;;;;;;;CASC,GACD,OAAO,MAAMC,+BAAiBF,WAC5B,SAASE,eAAeC,KAAK,EAAEC,GAAG;IAChC,MAAM,EAAEC,MAAM,EAAEC,SAAS,EAAE,GAAGC,WAAW,GAAGJ;IAC5C,qBACE,KAACK;QACCJ,KAAKA;QACJ,GAAGG,SAAS;QACbD,WAAWP,IAAI,CAACM,UAAUJ,oBAAoBK;;AAGpD,GACA"}
1
+ {"version":3,"sources":["../../src/tabs/SimpleTabPanel.tsx"],"sourcesContent":["import { cnb } from \"cnbuilder\";\nimport { type HTMLAttributes, type ReactNode, forwardRef } from \"react\";\n\nimport { DISPLAY_NONE_CLASS } from \"../utils/isElementVisible.js\";\nimport { type ProvidedTabPanelProps } from \"./useTabs.js\";\n\n/**\n * @since 6.0.0\n */\nexport interface SimpleTabPanelProps\n extends\n Omit<HTMLAttributes<HTMLDivElement>, keyof ProvidedTabPanelProps>,\n ProvidedTabPanelProps {\n children: ReactNode;\n}\n\n/**\n * This component can be a replacement for the `Slide` component when animations\n * are not required for changing the active tab contents.\n *\n * This should generally be used along with the `SimpleTabPanels` component.\n *\n * @see {@link https://react-md.dev/components/tabs | Tabs Demos}\n * @see {@link https://react-md.dev/components/tabs#disable-tab-panel-transition|Disable Tab Panel Transition Demo}\n * @since 6.0.0\n */\nexport const SimpleTabPanel = forwardRef<HTMLDivElement, SimpleTabPanelProps>(\n function SimpleTabPanel(props, ref) {\n const { active, className, ...remaining } = props;\n return (\n <div\n ref={ref}\n {...remaining}\n className={cnb(!active && DISPLAY_NONE_CLASS, className)}\n />\n );\n }\n);\n"],"names":["cnb","forwardRef","DISPLAY_NONE_CLASS","SimpleTabPanel","props","ref","active","className","remaining","div"],"mappings":";AAAA,SAASA,GAAG,QAAQ,YAAY;AAChC,SAA8CC,UAAU,QAAQ,QAAQ;AAExE,SAASC,kBAAkB,QAAQ,+BAA+B;AAalE;;;;;;;;;CASC,GACD,OAAO,MAAMC,+BAAiBF,WAC5B,SAASE,eAAeC,KAAK,EAAEC,GAAG;IAChC,MAAM,EAAEC,MAAM,EAAEC,SAAS,EAAE,GAAGC,WAAW,GAAGJ;IAC5C,qBACE,KAACK;QACCJ,KAAKA;QACJ,GAAGG,SAAS;QACbD,WAAWP,IAAI,CAACM,UAAUJ,oBAAoBK;;AAGpD,GACA"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/tabs/SimpleTabPanels.tsx"],"sourcesContent":["import { type HTMLAttributes, type ReactNode, forwardRef } from \"react\";\n\nimport { type ProvidedTabPanelsProps } from \"./useTabs.js\";\n\n/**\n * @since 6.0.0\n */\nexport interface SimpleTabPanelsProps\n extends HTMLAttributes<HTMLDivElement>,\n Omit<ProvidedTabPanelsProps<HTMLDivElement>, \"ref\"> {\n children: ReactNode;\n}\n\n/**\n * This component can be used as a replacement for the `SlideContainer` when\n * animations are not required for changing the active tab contents.\n *\n * This should be normally be used along with the `SimpleTabPanel` component.\n *\n * @see {@link https://react-md.dev/components/tabs | Tabs Demos}\n * @see {@link https://react-md.dev/components/tabs#disable-tab-panel-transition|Disable Tab Panel Transition Demo}\n * @since 6.0.0\n */\nexport const SimpleTabPanels = forwardRef<HTMLDivElement, SimpleTabPanelsProps>(\n function SimpleTabPanels(props, ref) {\n const { direction: _direction, ...remaining } = props;\n\n return <div ref={ref} {...remaining} />;\n }\n);\n"],"names":["forwardRef","SimpleTabPanels","props","ref","direction","_direction","remaining","div"],"mappings":";AAAA,SAA8CA,UAAU,QAAQ,QAAQ;AAaxE;;;;;;;;;CASC,GACD,OAAO,MAAMC,gCAAkBD,WAC7B,SAASC,gBAAgBC,KAAK,EAAEC,GAAG;IACjC,MAAM,EAAEC,WAAWC,UAAU,EAAE,GAAGC,WAAW,GAAGJ;IAEhD,qBAAO,KAACK;QAAIJ,KAAKA;QAAM,GAAGG,SAAS;;AACrC,GACA"}
1
+ {"version":3,"sources":["../../src/tabs/SimpleTabPanels.tsx"],"sourcesContent":["import { type HTMLAttributes, type ReactNode, forwardRef } from \"react\";\n\nimport { type ProvidedTabPanelsProps } from \"./useTabs.js\";\n\n/**\n * @since 6.0.0\n */\nexport interface SimpleTabPanelsProps\n extends\n HTMLAttributes<HTMLDivElement>,\n Omit<ProvidedTabPanelsProps<HTMLDivElement>, \"ref\"> {\n children: ReactNode;\n}\n\n/**\n * This component can be used as a replacement for the `SlideContainer` when\n * animations are not required for changing the active tab contents.\n *\n * This should be normally be used along with the `SimpleTabPanel` component.\n *\n * @see {@link https://react-md.dev/components/tabs | Tabs Demos}\n * @see {@link https://react-md.dev/components/tabs#disable-tab-panel-transition|Disable Tab Panel Transition Demo}\n * @since 6.0.0\n */\nexport const SimpleTabPanels = forwardRef<HTMLDivElement, SimpleTabPanelsProps>(\n function SimpleTabPanels(props, ref) {\n const { direction: _direction, ...remaining } = props;\n\n return <div ref={ref} {...remaining} />;\n }\n);\n"],"names":["forwardRef","SimpleTabPanels","props","ref","direction","_direction","remaining","div"],"mappings":";AAAA,SAA8CA,UAAU,QAAQ,QAAQ;AAcxE;;;;;;;;;CASC,GACD,OAAO,MAAMC,gCAAkBD,WAC7B,SAASC,gBAAgBC,KAAK,EAAEC,GAAG;IACjC,MAAM,EAAEC,WAAWC,UAAU,EAAE,GAAGC,WAAW,GAAGJ;IAEhD,qBAAO,KAACK;QAAIJ,KAAKA;QAAM,GAAGG,SAAS;;AACrC,GACA"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/tabs/Tab.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n type AnchorHTMLAttributes,\n type ButtonHTMLAttributes,\n type ReactElement,\n type ReactNode,\n} from \"react\";\n\nimport { type ComponentWithRippleProps } from \"../interaction/types.js\";\nimport { useElementInteraction } from \"../interaction/useElementInteraction.js\";\nimport { useHigherContrastChildren } from \"../interaction/useHigherContrastChildren.js\";\nimport { type CustomLinkComponent } from \"../link/Link.js\";\nimport { useKeyboardMovementContext } from \"../movement/useKeyboardMovementProvider.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\nimport { type BaseTabClassNameOptions, tab } from \"./tabStyles.js\";\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nimport { type useTabs } from \"./useTabs.js\";\n\n/**\n * @since 6.0.0\n */\nexport interface BaseTabProps\n extends ComponentWithRippleProps,\n BaseTabClassNameOptions {\n /**\n * Set this to `true` if the tab is currently active.\n *\n * This is normally provided by the {@link useTabs} hook.\n */\n active: boolean;\n\n /**\n * An optional icon to render with the with the {@link children}. The default\n * behavior will render this icon before the children.\n *\n * @see {@link iconAfter}\n * @see {@link stacked}\n */\n icon?: ReactNode;\n\n /**\n * Set this to `true` to render the {@link icon} after the {@link children}.\n *\n * @defaultValue `false`\n */\n iconAfter?: boolean;\n}\n\n/**\n * @since 6.0.0\n */\nexport interface TabButtonProps\n extends BaseTabProps,\n ButtonHTMLAttributes<HTMLButtonElement> {\n as?: \"button\";\n}\n\n/**\n * @since 6.0.0\n */\nexport interface TabLinkProps\n extends BaseTabProps,\n AnchorHTMLAttributes<HTMLAnchorElement> {\n as: CustomLinkComponent;\n}\n\n/**\n * @since 6.0.0\n */\nexport type TabProps = TabButtonProps | TabLinkProps;\n\n/**\n * **Client Component**\n *\n * This component should usually be used with the `TabsList` component and\n * `useTabs` hook.\n *\n * @see {@link https://react-md.dev/components/tabs | Tabs Demos}\n * @see {@link useTabs}\n * @since 6.0.0\n */\nexport function Tab(props: TabProps): ReactElement {\n const {\n id: propId,\n as: Component = \"button\",\n active,\n activeIndicator,\n verticalActiveIndicator,\n icon,\n iconAfter,\n stacked,\n className,\n children: propChildren,\n onBlur,\n onClick,\n onKeyDown,\n onKeyUp,\n onMouseDown,\n onMouseUp,\n onMouseLeave,\n onDragStart,\n onTouchStart,\n onTouchEnd,\n onTouchMove,\n disableRipple,\n ...remaining\n } = props as TabButtonProps;\n const { disabled } = props as TabButtonProps;\n\n const id = useEnsuredId(propId, \"tab\");\n const { activeDescendantId } = useKeyboardMovementContext();\n const { ripples, handlers } = useElementInteraction({\n mode: disableRipple ? \"none\" : undefined,\n onBlur,\n onClick,\n onKeyDown,\n onKeyUp,\n onMouseDown,\n onMouseUp,\n onMouseLeave,\n onDragStart,\n onTouchStart,\n onTouchEnd,\n onTouchMove,\n disabled,\n });\n\n const isLink = Component !== \"button\";\n const children = useHigherContrastChildren(propChildren);\n let buttonOnlyProps: Record<string, unknown> | undefined;\n if (!isLink) {\n buttonOnlyProps = { type: \"button\" };\n }\n\n return (\n <Component\n {...remaining}\n {...buttonOnlyProps}\n {...handlers}\n aria-selected={active}\n id={id}\n role=\"tab\"\n tabIndex={id === activeDescendantId ? 0 : -1}\n className={tab({\n className,\n active,\n isLink,\n stacked: !!icon && stacked,\n disabled,\n reversed: !!icon && iconAfter,\n activeIndicator,\n verticalActiveIndicator,\n })}\n >\n {icon}\n {children}\n {ripples}\n </Component>\n );\n}\n"],"names":["useElementInteraction","useHigherContrastChildren","useKeyboardMovementContext","useEnsuredId","tab","Tab","props","id","propId","as","Component","active","activeIndicator","verticalActiveIndicator","icon","iconAfter","stacked","className","children","propChildren","onBlur","onClick","onKeyDown","onKeyUp","onMouseDown","onMouseUp","onMouseLeave","onDragStart","onTouchStart","onTouchEnd","onTouchMove","disableRipple","remaining","disabled","activeDescendantId","ripples","handlers","mode","undefined","isLink","buttonOnlyProps","type","aria-selected","role","tabIndex","reversed"],"mappings":"AAAA;;AAUA,SAASA,qBAAqB,QAAQ,0CAA0C;AAChF,SAASC,yBAAyB,QAAQ,8CAA8C;AAExF,SAASC,0BAA0B,QAAQ,6CAA6C;AACxF,SAASC,YAAY,QAAQ,qBAAqB;AAClD,SAAuCC,GAAG,QAAQ,iBAAiB;AAyDnE;;;;;;;;;CASC,GACD,OAAO,SAASC,IAAIC,KAAe;IACjC,MAAM,EACJC,IAAIC,MAAM,EACVC,IAAIC,YAAY,QAAQ,EACxBC,MAAM,EACNC,eAAe,EACfC,uBAAuB,EACvBC,IAAI,EACJC,SAAS,EACTC,OAAO,EACPC,SAAS,EACTC,UAAUC,YAAY,EACtBC,MAAM,EACNC,OAAO,EACPC,SAAS,EACTC,OAAO,EACPC,WAAW,EACXC,SAAS,EACTC,YAAY,EACZC,WAAW,EACXC,YAAY,EACZC,UAAU,EACVC,WAAW,EACXC,aAAa,EACb,GAAGC,WACJ,GAAG1B;IACJ,MAAM,EAAE2B,QAAQ,EAAE,GAAG3B;IAErB,MAAMC,KAAKJ,aAAaK,QAAQ;IAChC,MAAM,EAAE0B,kBAAkB,EAAE,GAAGhC;IAC/B,MAAM,EAAEiC,OAAO,EAAEC,QAAQ,EAAE,GAAGpC,sBAAsB;QAClDqC,MAAMN,gBAAgB,SAASO;QAC/BlB;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAG;IACF;IAEA,MAAMM,SAAS7B,cAAc;IAC7B,MAAMQ,WAAWjB,0BAA0BkB;IAC3C,IAAIqB;IACJ,IAAI,CAACD,QAAQ;QACXC,kBAAkB;YAAEC,MAAM;QAAS;IACrC;IAEA,qBACE,MAAC/B;QACE,GAAGsB,SAAS;QACZ,GAAGQ,eAAe;QAClB,GAAGJ,QAAQ;QACZM,iBAAe/B;QACfJ,IAAIA;QACJoC,MAAK;QACLC,UAAUrC,OAAO2B,qBAAqB,IAAI,CAAC;QAC3CjB,WAAWb,IAAI;YACba;YACAN;YACA4B;YACAvB,SAAS,CAAC,CAACF,QAAQE;YACnBiB;YACAY,UAAU,CAAC,CAAC/B,QAAQC;YACpBH;YACAC;QACF;;YAECC;YACAI;YACAiB;;;AAGP"}
1
+ {"version":3,"sources":["../../src/tabs/Tab.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n type AnchorHTMLAttributes,\n type ButtonHTMLAttributes,\n type ReactElement,\n type ReactNode,\n} from \"react\";\n\nimport { type ComponentWithRippleProps } from \"../interaction/types.js\";\nimport { useElementInteraction } from \"../interaction/useElementInteraction.js\";\nimport { useHigherContrastChildren } from \"../interaction/useHigherContrastChildren.js\";\nimport { type CustomLinkComponent } from \"../link/Link.js\";\nimport { useKeyboardMovementContext } from \"../movement/useKeyboardMovementProvider.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\nimport { type BaseTabClassNameOptions, tab } from \"./tabStyles.js\";\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nimport { type useTabs } from \"./useTabs.js\";\n\n/**\n * @since 6.0.0\n */\nexport interface BaseTabProps\n extends ComponentWithRippleProps, BaseTabClassNameOptions {\n /**\n * Set this to `true` if the tab is currently active.\n *\n * This is normally provided by the {@link useTabs} hook.\n */\n active: boolean;\n\n /**\n * An optional icon to render with the with the {@link children}. The default\n * behavior will render this icon before the children.\n *\n * @see {@link iconAfter}\n * @see {@link stacked}\n */\n icon?: ReactNode;\n\n /**\n * Set this to `true` to render the {@link icon} after the {@link children}.\n *\n * @defaultValue `false`\n */\n iconAfter?: boolean;\n}\n\n/**\n * @since 6.0.0\n */\nexport interface TabButtonProps\n extends BaseTabProps, ButtonHTMLAttributes<HTMLButtonElement> {\n as?: \"button\";\n}\n\n/**\n * @since 6.0.0\n */\nexport interface TabLinkProps\n extends BaseTabProps, AnchorHTMLAttributes<HTMLAnchorElement> {\n as: CustomLinkComponent;\n}\n\n/**\n * @since 6.0.0\n */\nexport type TabProps = TabButtonProps | TabLinkProps;\n\n/**\n * **Client Component**\n *\n * This component should usually be used with the `TabsList` component and\n * `useTabs` hook.\n *\n * @see {@link https://react-md.dev/components/tabs | Tabs Demos}\n * @see {@link useTabs}\n * @since 6.0.0\n */\nexport function Tab(props: TabProps): ReactElement {\n const {\n id: propId,\n as: Component = \"button\",\n active,\n activeIndicator,\n verticalActiveIndicator,\n icon,\n iconAfter,\n stacked,\n className,\n children: propChildren,\n onBlur,\n onClick,\n onKeyDown,\n onKeyUp,\n onMouseDown,\n onMouseUp,\n onMouseLeave,\n onDragStart,\n onTouchStart,\n onTouchEnd,\n onTouchMove,\n disableRipple,\n ...remaining\n } = props as TabButtonProps;\n const { disabled } = props as TabButtonProps;\n\n const id = useEnsuredId(propId, \"tab\");\n const { activeDescendantId } = useKeyboardMovementContext();\n const { ripples, handlers } = useElementInteraction({\n mode: disableRipple ? \"none\" : undefined,\n onBlur,\n onClick,\n onKeyDown,\n onKeyUp,\n onMouseDown,\n onMouseUp,\n onMouseLeave,\n onDragStart,\n onTouchStart,\n onTouchEnd,\n onTouchMove,\n disabled,\n });\n\n const isLink = Component !== \"button\";\n const children = useHigherContrastChildren(propChildren);\n let buttonOnlyProps: Record<string, unknown> | undefined;\n if (!isLink) {\n buttonOnlyProps = { type: \"button\" };\n }\n\n return (\n <Component\n {...remaining}\n {...buttonOnlyProps}\n {...handlers}\n aria-selected={active}\n id={id}\n role=\"tab\"\n tabIndex={id === activeDescendantId ? 0 : -1}\n className={tab({\n className,\n active,\n isLink,\n stacked: !!icon && stacked,\n disabled,\n reversed: !!icon && iconAfter,\n activeIndicator,\n verticalActiveIndicator,\n })}\n >\n {icon}\n {children}\n {ripples}\n </Component>\n );\n}\n"],"names":["useElementInteraction","useHigherContrastChildren","useKeyboardMovementContext","useEnsuredId","tab","Tab","props","id","propId","as","Component","active","activeIndicator","verticalActiveIndicator","icon","iconAfter","stacked","className","children","propChildren","onBlur","onClick","onKeyDown","onKeyUp","onMouseDown","onMouseUp","onMouseLeave","onDragStart","onTouchStart","onTouchEnd","onTouchMove","disableRipple","remaining","disabled","activeDescendantId","ripples","handlers","mode","undefined","isLink","buttonOnlyProps","type","aria-selected","role","tabIndex","reversed"],"mappings":"AAAA;;AAUA,SAASA,qBAAqB,QAAQ,0CAA0C;AAChF,SAASC,yBAAyB,QAAQ,8CAA8C;AAExF,SAASC,0BAA0B,QAAQ,6CAA6C;AACxF,SAASC,YAAY,QAAQ,qBAAqB;AAClD,SAAuCC,GAAG,QAAQ,iBAAiB;AAsDnE;;;;;;;;;CASC,GACD,OAAO,SAASC,IAAIC,KAAe;IACjC,MAAM,EACJC,IAAIC,MAAM,EACVC,IAAIC,YAAY,QAAQ,EACxBC,MAAM,EACNC,eAAe,EACfC,uBAAuB,EACvBC,IAAI,EACJC,SAAS,EACTC,OAAO,EACPC,SAAS,EACTC,UAAUC,YAAY,EACtBC,MAAM,EACNC,OAAO,EACPC,SAAS,EACTC,OAAO,EACPC,WAAW,EACXC,SAAS,EACTC,YAAY,EACZC,WAAW,EACXC,YAAY,EACZC,UAAU,EACVC,WAAW,EACXC,aAAa,EACb,GAAGC,WACJ,GAAG1B;IACJ,MAAM,EAAE2B,QAAQ,EAAE,GAAG3B;IAErB,MAAMC,KAAKJ,aAAaK,QAAQ;IAChC,MAAM,EAAE0B,kBAAkB,EAAE,GAAGhC;IAC/B,MAAM,EAAEiC,OAAO,EAAEC,QAAQ,EAAE,GAAGpC,sBAAsB;QAClDqC,MAAMN,gBAAgB,SAASO;QAC/BlB;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAG;IACF;IAEA,MAAMM,SAAS7B,cAAc;IAC7B,MAAMQ,WAAWjB,0BAA0BkB;IAC3C,IAAIqB;IACJ,IAAI,CAACD,QAAQ;QACXC,kBAAkB;YAAEC,MAAM;QAAS;IACrC;IAEA,qBACE,MAAC/B;QACE,GAAGsB,SAAS;QACZ,GAAGQ,eAAe;QAClB,GAAGJ,QAAQ;QACZM,iBAAe/B;QACfJ,IAAIA;QACJoC,MAAK;QACLC,UAAUrC,OAAO2B,qBAAqB,IAAI,CAAC;QAC3CjB,WAAWb,IAAI;YACba;YACAN;YACA4B;YACAvB,SAAS,CAAC,CAACF,QAAQE;YACnBiB;YACAY,UAAU,CAAC,CAAC/B,QAAQC;YACpBH;YACAC;QACF;;YAECC;YACAI;YACAiB;;;AAGP"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/tabs/TabList.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n type HTMLAttributes,\n forwardRef,\n useEffect,\n useRef,\n useState,\n} from \"react\";\n\nimport { KeyboardMovementProvider } from \"../movement/useKeyboardMovementProvider.js\";\nimport {\n type BaseTabListScrollButtonProps,\n TabListScrollButton,\n} from \"./TabListScrollButton.js\";\nimport { type GetTabListScrollToOptions } from \"./getTabListScrollToOptions.js\";\nimport { type TabListClassNameOptions, tabList } from \"./tabListStyles.js\";\nimport {\n type TabListActivationMode,\n type TabListScrollButtonsBehavior,\n} from \"./types.js\";\nimport { useTabList } from \"./useTabList.js\";\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nimport { type useTabs } from \"./useTabs.js\";\n\n/**\n * @since 6.0.0\n */\nexport interface TabListProps\n extends HTMLAttributes<HTMLDivElement>,\n Omit<TabListClassNameOptions, \"animate\" | \"indicator\"> {\n activeIndex: number;\n setActiveIndex: (nextActiveIndex: number) => void;\n\n /**\n * Set this to `true` to show a scrollbar when the number of tabs cause\n * overflow.\n *\n * @see {@link scrollButtons}\n * @defaultValue `false`\n */\n scrollbar?: boolean;\n\n /**\n * Set this to `true` to disable the active tab indicator from animating\n * when a new tab is selected.\n *\n * @defaultValue `false`\n */\n disableTransition?: boolean;\n\n /**\n * This should be equal to the `$tabs-transition-duration` variable.\n *\n * @defaultValue `150`\n */\n transitionDuration?: number;\n\n /**\n * @defaultValue `\"manual\"`\n * @see {@link TabListActivationMode}\n */\n activationMode?: TabListActivationMode;\n\n /**\n * @defaultValue `false`\n * @see {@link TabListScrollButtonsBehavior}\n */\n scrollButtons?: TabListScrollButtonsBehavior;\n\n /**\n * A convenience prop for the {@link BaseTabListScrollButtonProps.getScrollToOptions}\n * on {@link forwardScrollButtonProps} and {@link backwardScrollButtonProps}.\n */\n getScrollToOptions?: GetTabListScrollToOptions;\n\n /**\n * Any additional props that should be passed to the scroll forward button.\n *\n * @example\n * ```tsx\n * forwardScrollButtonProps={{\n * \"aria-label\": \"Scroll right\",\n * theme: \"primary\",\n * themeType: \"contained\",\n * className: styles.buttonContainer,\n * buttonProps: {\n * className: styles.button,\n * }\n * }}\n * ```\n */\n forwardScrollButtonProps?: BaseTabListScrollButtonProps;\n\n /**\n * Any additional props that should be passed to the scroll backward button.\n *\n * @example\n * ```tsx\n * forwardScrollButtonProps={{\n * \"aria-label\": \"Scroll left\",\n * theme: \"primary\",\n * themeType: \"contained\",\n * className: styles.buttonContainer,\n * buttonProps: {\n * className: styles.button,\n * }\n * }}\n * ```\n */\n backwardScrollButtonProps?: BaseTabListScrollButtonProps;\n}\n\n/**\n * **Client Component**\n *\n * @see {@link https://react-md.dev/components/tabs | Tabs Demos}\n * @see {@link useTabs} for example usage.\n * @since 6.0.0\n */\nexport const TabList = forwardRef<HTMLDivElement, TabListProps>(\n function TabList(props, ref) {\n const {\n style,\n onClick,\n onFocus,\n onKeyDown,\n className,\n children,\n activeIndex,\n setActiveIndex,\n activationMode = \"manual\",\n align = \"left\",\n padded = false,\n inline = false,\n vertical = false,\n scrollbar = false,\n scrollButtons = false,\n fullWidthTabs,\n disableTransition = false,\n transitionDuration = 150,\n getScrollToOptions,\n forwardScrollButtonProps,\n backwardScrollButtonProps,\n ...remaining\n } = props;\n\n const {\n elementProps,\n movementContext,\n backwardProps,\n forwardProps,\n showScrollButtons,\n } = useTabList({\n ref,\n style,\n onClick,\n onFocus,\n onKeyDown,\n vertical,\n activeIndex,\n setActiveIndex,\n activationMode,\n scrollButtons,\n disableTransition,\n });\n\n const prevActiveIndex = useRef(activeIndex);\n const [animate, setAnimate] = useState(false);\n useEffect(() => {\n const isSameIndex = activeIndex === prevActiveIndex.current;\n prevActiveIndex.current = activeIndex;\n if (disableTransition || isSameIndex) {\n return;\n }\n\n setAnimate(true);\n const timeout = window.setTimeout(() => {\n setAnimate(false);\n }, transitionDuration);\n\n return () => {\n window.clearTimeout(timeout);\n };\n }, [activeIndex, disableTransition, transitionDuration]);\n\n return (\n <KeyboardMovementProvider value={movementContext}>\n <div\n {...remaining}\n {...elementProps}\n role=\"tablist\"\n className={tabList({\n align,\n padded,\n inline,\n animate: !disableTransition && animate,\n vertical,\n scrollbar,\n indicator: !disableTransition,\n fullWidthTabs,\n className,\n })}\n >\n {showScrollButtons && (\n <TabListScrollButton\n getScrollToOptions={getScrollToOptions}\n {...backwardScrollButtonProps}\n {...backwardProps}\n />\n )}\n {children}\n {showScrollButtons && (\n <TabListScrollButton\n getScrollToOptions={getScrollToOptions}\n {...forwardScrollButtonProps}\n {...forwardProps}\n />\n )}\n </div>\n </KeyboardMovementProvider>\n );\n }\n);\n"],"names":["forwardRef","useEffect","useRef","useState","KeyboardMovementProvider","TabListScrollButton","tabList","useTabList","TabList","props","ref","style","onClick","onFocus","onKeyDown","className","children","activeIndex","setActiveIndex","activationMode","align","padded","inline","vertical","scrollbar","scrollButtons","fullWidthTabs","disableTransition","transitionDuration","getScrollToOptions","forwardScrollButtonProps","backwardScrollButtonProps","remaining","elementProps","movementContext","backwardProps","forwardProps","showScrollButtons","prevActiveIndex","animate","setAnimate","isSameIndex","current","timeout","window","setTimeout","clearTimeout","value","div","role","indicator"],"mappings":"AAAA;;AAEA,SAEEA,UAAU,EACVC,SAAS,EACTC,MAAM,EACNC,QAAQ,QACH,QAAQ;AAEf,SAASC,wBAAwB,QAAQ,6CAA6C;AACtF,SAEEC,mBAAmB,QACd,2BAA2B;AAElC,SAAuCC,OAAO,QAAQ,qBAAqB;AAK3E,SAASC,UAAU,QAAQ,kBAAkB;AA4F7C;;;;;;CAMC,GACD,OAAO,MAAMC,wBAAUR,WACrB,SAASQ,QAAQC,KAAK,EAAEC,GAAG;IACzB,MAAM,EACJC,KAAK,EACLC,OAAO,EACPC,OAAO,EACPC,SAAS,EACTC,SAAS,EACTC,QAAQ,EACRC,WAAW,EACXC,cAAc,EACdC,iBAAiB,QAAQ,EACzBC,QAAQ,MAAM,EACdC,SAAS,KAAK,EACdC,SAAS,KAAK,EACdC,WAAW,KAAK,EAChBC,YAAY,KAAK,EACjBC,gBAAgB,KAAK,EACrBC,aAAa,EACbC,oBAAoB,KAAK,EACzBC,qBAAqB,GAAG,EACxBC,kBAAkB,EAClBC,wBAAwB,EACxBC,yBAAyB,EACzB,GAAGC,WACJ,GAAGvB;IAEJ,MAAM,EACJwB,YAAY,EACZC,eAAe,EACfC,aAAa,EACbC,YAAY,EACZC,iBAAiB,EAClB,GAAG9B,WAAW;QACbG;QACAC;QACAC;QACAC;QACAC;QACAS;QACAN;QACAC;QACAC;QACAM;QACAE;IACF;IAEA,MAAMW,kBAAkBpC,OAAOe;IAC/B,MAAM,CAACsB,SAASC,WAAW,GAAGrC,SAAS;IACvCF,UAAU;QACR,MAAMwC,cAAcxB,gBAAgBqB,gBAAgBI,OAAO;QAC3DJ,gBAAgBI,OAAO,GAAGzB;QAC1B,IAAIU,qBAAqBc,aAAa;YACpC;QACF;QAEAD,WAAW;QACX,MAAMG,UAAUC,OAAOC,UAAU,CAAC;YAChCL,WAAW;QACb,GAAGZ;QAEH,OAAO;YACLgB,OAAOE,YAAY,CAACH;QACtB;IACF,GAAG;QAAC1B;QAAaU;QAAmBC;KAAmB;IAEvD,qBACE,KAACxB;QAAyB2C,OAAOb;kBAC/B,cAAA,MAACc;YACE,GAAGhB,SAAS;YACZ,GAAGC,YAAY;YAChBgB,MAAK;YACLlC,WAAWT,QAAQ;gBACjBc;gBACAC;gBACAC;gBACAiB,SAAS,CAACZ,qBAAqBY;gBAC/BhB;gBACAC;gBACA0B,WAAW,CAACvB;gBACZD;gBACAX;YACF;;gBAECsB,mCACC,KAAChC;oBACCwB,oBAAoBA;oBACnB,GAAGE,yBAAyB;oBAC5B,GAAGI,aAAa;;gBAGpBnB;gBACAqB,mCACC,KAAChC;oBACCwB,oBAAoBA;oBACnB,GAAGC,wBAAwB;oBAC3B,GAAGM,YAAY;;;;;AAM5B,GACA"}
1
+ {"version":3,"sources":["../../src/tabs/TabList.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n type HTMLAttributes,\n forwardRef,\n useEffect,\n useRef,\n useState,\n} from \"react\";\n\nimport { KeyboardMovementProvider } from \"../movement/useKeyboardMovementProvider.js\";\nimport {\n type BaseTabListScrollButtonProps,\n TabListScrollButton,\n} from \"./TabListScrollButton.js\";\nimport { type GetTabListScrollToOptions } from \"./getTabListScrollToOptions.js\";\nimport { type TabListClassNameOptions, tabList } from \"./tabListStyles.js\";\nimport {\n type TabListActivationMode,\n type TabListScrollButtonsBehavior,\n} from \"./types.js\";\nimport { useTabList } from \"./useTabList.js\";\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nimport { type useTabs } from \"./useTabs.js\";\n\n/**\n * @since 6.0.0\n */\nexport interface TabListProps\n extends\n HTMLAttributes<HTMLDivElement>,\n Omit<TabListClassNameOptions, \"animate\" | \"indicator\"> {\n activeIndex: number;\n setActiveIndex: (nextActiveIndex: number) => void;\n\n /**\n * Set this to `true` to show a scrollbar when the number of tabs cause\n * overflow.\n *\n * @see {@link scrollButtons}\n * @defaultValue `false`\n */\n scrollbar?: boolean;\n\n /**\n * Set this to `true` to disable the active tab indicator from animating\n * when a new tab is selected.\n *\n * @defaultValue `false`\n */\n disableTransition?: boolean;\n\n /**\n * This should be equal to the `$tabs-transition-duration` variable.\n *\n * @defaultValue `150`\n */\n transitionDuration?: number;\n\n /**\n * @defaultValue `\"manual\"`\n * @see {@link TabListActivationMode}\n */\n activationMode?: TabListActivationMode;\n\n /**\n * @defaultValue `false`\n * @see {@link TabListScrollButtonsBehavior}\n */\n scrollButtons?: TabListScrollButtonsBehavior;\n\n /**\n * A convenience prop for the {@link BaseTabListScrollButtonProps.getScrollToOptions}\n * on {@link forwardScrollButtonProps} and {@link backwardScrollButtonProps}.\n */\n getScrollToOptions?: GetTabListScrollToOptions;\n\n /**\n * Any additional props that should be passed to the scroll forward button.\n *\n * @example\n * ```tsx\n * forwardScrollButtonProps={{\n * \"aria-label\": \"Scroll right\",\n * theme: \"primary\",\n * themeType: \"contained\",\n * className: styles.buttonContainer,\n * buttonProps: {\n * className: styles.button,\n * }\n * }}\n * ```\n */\n forwardScrollButtonProps?: BaseTabListScrollButtonProps;\n\n /**\n * Any additional props that should be passed to the scroll backward button.\n *\n * @example\n * ```tsx\n * forwardScrollButtonProps={{\n * \"aria-label\": \"Scroll left\",\n * theme: \"primary\",\n * themeType: \"contained\",\n * className: styles.buttonContainer,\n * buttonProps: {\n * className: styles.button,\n * }\n * }}\n * ```\n */\n backwardScrollButtonProps?: BaseTabListScrollButtonProps;\n}\n\n/**\n * **Client Component**\n *\n * @see {@link https://react-md.dev/components/tabs | Tabs Demos}\n * @see {@link useTabs} for example usage.\n * @since 6.0.0\n */\nexport const TabList = forwardRef<HTMLDivElement, TabListProps>(\n function TabList(props, ref) {\n const {\n style,\n onClick,\n onFocus,\n onKeyDown,\n className,\n children,\n activeIndex,\n setActiveIndex,\n activationMode = \"manual\",\n align = \"left\",\n padded = false,\n inline = false,\n vertical = false,\n scrollbar = false,\n scrollButtons = false,\n fullWidthTabs,\n disableTransition = false,\n transitionDuration = 150,\n getScrollToOptions,\n forwardScrollButtonProps,\n backwardScrollButtonProps,\n ...remaining\n } = props;\n\n const {\n elementProps,\n movementContext,\n backwardProps,\n forwardProps,\n showScrollButtons,\n } = useTabList({\n ref,\n style,\n onClick,\n onFocus,\n onKeyDown,\n vertical,\n activeIndex,\n setActiveIndex,\n activationMode,\n scrollButtons,\n disableTransition,\n });\n\n const prevActiveIndex = useRef(activeIndex);\n const [animate, setAnimate] = useState(false);\n useEffect(() => {\n const isSameIndex = activeIndex === prevActiveIndex.current;\n prevActiveIndex.current = activeIndex;\n if (disableTransition || isSameIndex) {\n return;\n }\n\n setAnimate(true);\n const timeout = window.setTimeout(() => {\n setAnimate(false);\n }, transitionDuration);\n\n return () => {\n window.clearTimeout(timeout);\n };\n }, [activeIndex, disableTransition, transitionDuration]);\n\n return (\n <KeyboardMovementProvider value={movementContext}>\n <div\n {...remaining}\n {...elementProps}\n role=\"tablist\"\n className={tabList({\n align,\n padded,\n inline,\n animate: !disableTransition && animate,\n vertical,\n scrollbar,\n indicator: !disableTransition,\n fullWidthTabs,\n className,\n })}\n >\n {showScrollButtons && (\n <TabListScrollButton\n getScrollToOptions={getScrollToOptions}\n {...backwardScrollButtonProps}\n {...backwardProps}\n />\n )}\n {children}\n {showScrollButtons && (\n <TabListScrollButton\n getScrollToOptions={getScrollToOptions}\n {...forwardScrollButtonProps}\n {...forwardProps}\n />\n )}\n </div>\n </KeyboardMovementProvider>\n );\n }\n);\n"],"names":["forwardRef","useEffect","useRef","useState","KeyboardMovementProvider","TabListScrollButton","tabList","useTabList","TabList","props","ref","style","onClick","onFocus","onKeyDown","className","children","activeIndex","setActiveIndex","activationMode","align","padded","inline","vertical","scrollbar","scrollButtons","fullWidthTabs","disableTransition","transitionDuration","getScrollToOptions","forwardScrollButtonProps","backwardScrollButtonProps","remaining","elementProps","movementContext","backwardProps","forwardProps","showScrollButtons","prevActiveIndex","animate","setAnimate","isSameIndex","current","timeout","window","setTimeout","clearTimeout","value","div","role","indicator"],"mappings":"AAAA;;AAEA,SAEEA,UAAU,EACVC,SAAS,EACTC,MAAM,EACNC,QAAQ,QACH,QAAQ;AAEf,SAASC,wBAAwB,QAAQ,6CAA6C;AACtF,SAEEC,mBAAmB,QACd,2BAA2B;AAElC,SAAuCC,OAAO,QAAQ,qBAAqB;AAK3E,SAASC,UAAU,QAAQ,kBAAkB;AA6F7C;;;;;;CAMC,GACD,OAAO,MAAMC,wBAAUR,WACrB,SAASQ,QAAQC,KAAK,EAAEC,GAAG;IACzB,MAAM,EACJC,KAAK,EACLC,OAAO,EACPC,OAAO,EACPC,SAAS,EACTC,SAAS,EACTC,QAAQ,EACRC,WAAW,EACXC,cAAc,EACdC,iBAAiB,QAAQ,EACzBC,QAAQ,MAAM,EACdC,SAAS,KAAK,EACdC,SAAS,KAAK,EACdC,WAAW,KAAK,EAChBC,YAAY,KAAK,EACjBC,gBAAgB,KAAK,EACrBC,aAAa,EACbC,oBAAoB,KAAK,EACzBC,qBAAqB,GAAG,EACxBC,kBAAkB,EAClBC,wBAAwB,EACxBC,yBAAyB,EACzB,GAAGC,WACJ,GAAGvB;IAEJ,MAAM,EACJwB,YAAY,EACZC,eAAe,EACfC,aAAa,EACbC,YAAY,EACZC,iBAAiB,EAClB,GAAG9B,WAAW;QACbG;QACAC;QACAC;QACAC;QACAC;QACAS;QACAN;QACAC;QACAC;QACAM;QACAE;IACF;IAEA,MAAMW,kBAAkBpC,OAAOe;IAC/B,MAAM,CAACsB,SAASC,WAAW,GAAGrC,SAAS;IACvCF,UAAU;QACR,MAAMwC,cAAcxB,gBAAgBqB,gBAAgBI,OAAO;QAC3DJ,gBAAgBI,OAAO,GAAGzB;QAC1B,IAAIU,qBAAqBc,aAAa;YACpC;QACF;QAEAD,WAAW;QACX,MAAMG,UAAUC,OAAOC,UAAU,CAAC;YAChCL,WAAW;QACb,GAAGZ;QAEH,OAAO;YACLgB,OAAOE,YAAY,CAACH;QACtB;IACF,GAAG;QAAC1B;QAAaU;QAAmBC;KAAmB;IAEvD,qBACE,KAACxB;QAAyB2C,OAAOb;kBAC/B,cAAA,MAACc;YACE,GAAGhB,SAAS;YACZ,GAAGC,YAAY;YAChBgB,MAAK;YACLlC,WAAWT,QAAQ;gBACjBc;gBACAC;gBACAC;gBACAiB,SAAS,CAACZ,qBAAqBY;gBAC/BhB;gBACAC;gBACA0B,WAAW,CAACvB;gBACZD;gBACAX;YACF;;gBAECsB,mCACC,KAAChC;oBACCwB,oBAAoBA;oBACnB,GAAGE,yBAAyB;oBAC5B,GAAGI,aAAa;;gBAGpBnB;gBACAqB,mCACC,KAAChC;oBACCwB,oBAAoBA;oBACnB,GAAGC,wBAAwB;oBAC3B,GAAGM,YAAY;;;;;AAM5B,GACA"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/tabs/TabListScrollButton.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n type HTMLAttributes,\n forwardRef,\n useCallback,\n useRef,\n useState,\n} from \"react\";\n\nimport { Button, type ButtonProps } from \"../button/Button.js\";\nimport { type ButtonClassNameThemeOptions } from \"../button/styles.js\";\nimport { getIcon } from \"../icon/config.js\";\nimport { type PropsWithRef } from \"../types.js\";\nimport { useDir } from \"../typography/WritingDirectionProvider.js\";\nimport { useIntersectionObserver } from \"../useIntersectionObserver.js\";\nimport { applyRef } from \"../utils/applyRef.js\";\nimport {\n type GetTabListScrollToOptions,\n getTabListScrollToOptions,\n} from \"./getTabListScrollToOptions.js\";\nimport {\n tabListScrollButton,\n tabListScrollButtonContainer,\n} from \"./tabListScrollButtonStyles.js\";\n\n/**\n * @internal\n * @since 6.0.0\n */\nexport interface BaseTabListScrollButtonProps\n extends HTMLAttributes<HTMLDivElement>,\n ButtonClassNameThemeOptions {\n buttonProps?: PropsWithRef<ButtonProps>;\n\n /** @defaultValue `false` */\n disableTransition?: boolean;\n\n /** @defaultValue {@link getTabListScrollToOptions} */\n getScrollToOptions?: GetTabListScrollToOptions;\n}\n\n/**\n * @internal\n * @since 6.0.0\n */\nexport interface TabListScrollButtonProps extends BaseTabListScrollButtonProps {\n type: \"back\" | \"forward\";\n /** @defaultValue `false` */\n vertical?: boolean;\n}\n\n/**\n * **Client Component**\n *\n * @internal\n * @since 6.0.0\n */\nexport const TabListScrollButton = forwardRef<\n HTMLDivElement,\n TabListScrollButtonProps\n>(function TabListScrollButton(props, ref) {\n const {\n \"aria-label\": ariaLabel,\n className,\n buttonProps,\n type,\n theme,\n themeType,\n buttonType = \"icon\",\n disabled: propDisabled,\n children: propChildren,\n getScrollToOptions = getTabListScrollToOptions,\n vertical = false,\n disableTransition = false,\n ...remaining\n } = props;\n\n const forward = type === \"forward\";\n const iconButton = buttonType === \"icon\";\n const icon = getIcon(type);\n const children = propChildren || icon;\n\n const root = useRef<HTMLElement | null>(null);\n const isRTL = useDir().dir === \"rtl\";\n const [disabled, setDisabled] = useState(!forward);\n const nodeRef = useIntersectionObserver({\n root,\n rootMargin: \"1px\",\n onUpdate: useCallback(([entry]) => {\n setDisabled(entry.intersectionRatio === 1);\n }, []),\n });\n\n return (\n <>\n {!forward && <span ref={nodeRef} />}\n <div\n {...remaining}\n ref={(instance) => {\n applyRef(instance, ref);\n root.current = instance?.parentElement || null;\n }}\n className={tabListScrollButtonContainer({\n forward,\n vertical,\n className,\n })}\n >\n <Button\n aria-label={ariaLabel || (iconButton ? type : undefined)}\n theme={theme}\n themeType={themeType}\n buttonType={buttonType}\n disabled={propDisabled || disabled}\n {...buttonProps}\n className={tabListScrollButton({\n className: buttonProps?.className,\n vertical,\n })}\n onClick={(event) => {\n buttonProps?.onClick?.(event);\n const container = root.current;\n if (!container) {\n return;\n }\n\n container.scrollTo(\n getScrollToOptions({\n isRTL,\n animate: !disableTransition,\n vertical,\n container,\n increment: forward,\n })\n );\n }}\n >\n {children}\n </Button>\n </div>\n {forward && <span ref={nodeRef} />}\n </>\n );\n});\n"],"names":["forwardRef","useCallback","useRef","useState","Button","getIcon","useDir","useIntersectionObserver","applyRef","getTabListScrollToOptions","tabListScrollButton","tabListScrollButtonContainer","TabListScrollButton","props","ref","ariaLabel","className","buttonProps","type","theme","themeType","buttonType","disabled","propDisabled","children","propChildren","getScrollToOptions","vertical","disableTransition","remaining","forward","iconButton","icon","root","isRTL","dir","setDisabled","nodeRef","rootMargin","onUpdate","entry","intersectionRatio","span","div","instance","current","parentElement","aria-label","undefined","onClick","event","container","scrollTo","animate","increment"],"mappings":"AAAA;;AAEA,SAEEA,UAAU,EACVC,WAAW,EACXC,MAAM,EACNC,QAAQ,QACH,QAAQ;AAEf,SAASC,MAAM,QAA0B,sBAAsB;AAE/D,SAASC,OAAO,QAAQ,oBAAoB;AAE5C,SAASC,MAAM,QAAQ,4CAA4C;AACnE,SAASC,uBAAuB,QAAQ,gCAAgC;AACxE,SAASC,QAAQ,QAAQ,uBAAuB;AAChD,SAEEC,yBAAyB,QACpB,iCAAiC;AACxC,SACEC,mBAAmB,EACnBC,4BAA4B,QACvB,iCAAiC;AA4BxC;;;;;CAKC,GACD,OAAO,MAAMC,oCAAsBZ,WAGjC,SAASY,oBAAoBC,KAAK,EAAEC,GAAG;IACvC,MAAM,EACJ,cAAcC,SAAS,EACvBC,SAAS,EACTC,WAAW,EACXC,IAAI,EACJC,KAAK,EACLC,SAAS,EACTC,aAAa,MAAM,EACnBC,UAAUC,YAAY,EACtBC,UAAUC,YAAY,EACtBC,qBAAqBjB,yBAAyB,EAC9CkB,WAAW,KAAK,EAChBC,oBAAoB,KAAK,EACzB,GAAGC,WACJ,GAAGhB;IAEJ,MAAMiB,UAAUZ,SAAS;IACzB,MAAMa,aAAaV,eAAe;IAClC,MAAMW,OAAO3B,QAAQa;IACrB,MAAMM,WAAWC,gBAAgBO;IAEjC,MAAMC,OAAO/B,OAA2B;IACxC,MAAMgC,QAAQ5B,SAAS6B,GAAG,KAAK;IAC/B,MAAM,CAACb,UAAUc,YAAY,GAAGjC,SAAS,CAAC2B;IAC1C,MAAMO,UAAU9B,wBAAwB;QACtC0B;QACAK,YAAY;QACZC,UAAUtC,YAAY,CAAC,CAACuC,MAAM;YAC5BJ,YAAYI,MAAMC,iBAAiB,KAAK;QAC1C,GAAG,EAAE;IACP;IAEA,qBACE;;YACG,CAACX,yBAAW,KAACY;gBAAK5B,KAAKuB;;0BACxB,KAACM;gBACE,GAAGd,SAAS;gBACbf,KAAK,CAAC8B;oBACJpC,SAASoC,UAAU9B;oBACnBmB,KAAKY,OAAO,GAAGD,UAAUE,iBAAiB;gBAC5C;gBACA9B,WAAWL,6BAA6B;oBACtCmB;oBACAH;oBACAX;gBACF;0BAEA,cAAA,KAACZ;oBACC2C,cAAYhC,aAAcgB,CAAAA,aAAab,OAAO8B,SAAQ;oBACtD7B,OAAOA;oBACPC,WAAWA;oBACXC,YAAYA;oBACZC,UAAUC,gBAAgBD;oBACzB,GAAGL,WAAW;oBACfD,WAAWN,oBAAoB;wBAC7BM,WAAWC,aAAaD;wBACxBW;oBACF;oBACAsB,SAAS,CAACC;wBACRjC,aAAagC,UAAUC;wBACvB,MAAMC,YAAYlB,KAAKY,OAAO;wBAC9B,IAAI,CAACM,WAAW;4BACd;wBACF;wBAEAA,UAAUC,QAAQ,CAChB1B,mBAAmB;4BACjBQ;4BACAmB,SAAS,CAACzB;4BACVD;4BACAwB;4BACAG,WAAWxB;wBACb;oBAEJ;8BAECN;;;YAGJM,yBAAW,KAACY;gBAAK5B,KAAKuB;;;;AAG7B,GAAG"}
1
+ {"version":3,"sources":["../../src/tabs/TabListScrollButton.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n type HTMLAttributes,\n forwardRef,\n useCallback,\n useRef,\n useState,\n} from \"react\";\n\nimport { Button, type ButtonProps } from \"../button/Button.js\";\nimport { type ButtonClassNameThemeOptions } from \"../button/styles.js\";\nimport { getIcon } from \"../icon/config.js\";\nimport { type PropsWithRef } from \"../types.js\";\nimport { useDir } from \"../typography/WritingDirectionProvider.js\";\nimport { useIntersectionObserver } from \"../useIntersectionObserver.js\";\nimport { applyRef } from \"../utils/applyRef.js\";\nimport {\n type GetTabListScrollToOptions,\n getTabListScrollToOptions,\n} from \"./getTabListScrollToOptions.js\";\nimport {\n tabListScrollButton,\n tabListScrollButtonContainer,\n} from \"./tabListScrollButtonStyles.js\";\n\n/**\n * @internal\n * @since 6.0.0\n */\nexport interface BaseTabListScrollButtonProps\n extends HTMLAttributes<HTMLDivElement>, ButtonClassNameThemeOptions {\n buttonProps?: PropsWithRef<ButtonProps>;\n\n /** @defaultValue `false` */\n disableTransition?: boolean;\n\n /** @defaultValue {@link getTabListScrollToOptions} */\n getScrollToOptions?: GetTabListScrollToOptions;\n}\n\n/**\n * @internal\n * @since 6.0.0\n */\nexport interface TabListScrollButtonProps extends BaseTabListScrollButtonProps {\n type: \"back\" | \"forward\";\n /** @defaultValue `false` */\n vertical?: boolean;\n}\n\n/**\n * **Client Component**\n *\n * @internal\n * @since 6.0.0\n */\nexport const TabListScrollButton = forwardRef<\n HTMLDivElement,\n TabListScrollButtonProps\n>(function TabListScrollButton(props, ref) {\n const {\n \"aria-label\": ariaLabel,\n className,\n buttonProps,\n type,\n theme,\n themeType,\n buttonType = \"icon\",\n disabled: propDisabled,\n children: propChildren,\n getScrollToOptions = getTabListScrollToOptions,\n vertical = false,\n disableTransition = false,\n ...remaining\n } = props;\n\n const forward = type === \"forward\";\n const iconButton = buttonType === \"icon\";\n const icon = getIcon(type);\n const children = propChildren || icon;\n\n const root = useRef<HTMLElement | null>(null);\n const isRTL = useDir().dir === \"rtl\";\n const [disabled, setDisabled] = useState(!forward);\n const nodeRef = useIntersectionObserver({\n root,\n rootMargin: \"1px\",\n onUpdate: useCallback(([entry]) => {\n setDisabled(entry.intersectionRatio === 1);\n }, []),\n });\n\n return (\n <>\n {!forward && <span ref={nodeRef} />}\n <div\n {...remaining}\n ref={(instance) => {\n applyRef(instance, ref);\n root.current = instance?.parentElement || null;\n }}\n className={tabListScrollButtonContainer({\n forward,\n vertical,\n className,\n })}\n >\n <Button\n aria-label={ariaLabel || (iconButton ? type : undefined)}\n theme={theme}\n themeType={themeType}\n buttonType={buttonType}\n disabled={propDisabled || disabled}\n {...buttonProps}\n className={tabListScrollButton({\n className: buttonProps?.className,\n vertical,\n })}\n onClick={(event) => {\n buttonProps?.onClick?.(event);\n const container = root.current;\n if (!container) {\n return;\n }\n\n container.scrollTo(\n getScrollToOptions({\n isRTL,\n animate: !disableTransition,\n vertical,\n container,\n increment: forward,\n })\n );\n }}\n >\n {children}\n </Button>\n </div>\n {forward && <span ref={nodeRef} />}\n </>\n );\n});\n"],"names":["forwardRef","useCallback","useRef","useState","Button","getIcon","useDir","useIntersectionObserver","applyRef","getTabListScrollToOptions","tabListScrollButton","tabListScrollButtonContainer","TabListScrollButton","props","ref","ariaLabel","className","buttonProps","type","theme","themeType","buttonType","disabled","propDisabled","children","propChildren","getScrollToOptions","vertical","disableTransition","remaining","forward","iconButton","icon","root","isRTL","dir","setDisabled","nodeRef","rootMargin","onUpdate","entry","intersectionRatio","span","div","instance","current","parentElement","aria-label","undefined","onClick","event","container","scrollTo","animate","increment"],"mappings":"AAAA;;AAEA,SAEEA,UAAU,EACVC,WAAW,EACXC,MAAM,EACNC,QAAQ,QACH,QAAQ;AAEf,SAASC,MAAM,QAA0B,sBAAsB;AAE/D,SAASC,OAAO,QAAQ,oBAAoB;AAE5C,SAASC,MAAM,QAAQ,4CAA4C;AACnE,SAASC,uBAAuB,QAAQ,gCAAgC;AACxE,SAASC,QAAQ,QAAQ,uBAAuB;AAChD,SAEEC,yBAAyB,QACpB,iCAAiC;AACxC,SACEC,mBAAmB,EACnBC,4BAA4B,QACvB,iCAAiC;AA2BxC;;;;;CAKC,GACD,OAAO,MAAMC,oCAAsBZ,WAGjC,SAASY,oBAAoBC,KAAK,EAAEC,GAAG;IACvC,MAAM,EACJ,cAAcC,SAAS,EACvBC,SAAS,EACTC,WAAW,EACXC,IAAI,EACJC,KAAK,EACLC,SAAS,EACTC,aAAa,MAAM,EACnBC,UAAUC,YAAY,EACtBC,UAAUC,YAAY,EACtBC,qBAAqBjB,yBAAyB,EAC9CkB,WAAW,KAAK,EAChBC,oBAAoB,KAAK,EACzB,GAAGC,WACJ,GAAGhB;IAEJ,MAAMiB,UAAUZ,SAAS;IACzB,MAAMa,aAAaV,eAAe;IAClC,MAAMW,OAAO3B,QAAQa;IACrB,MAAMM,WAAWC,gBAAgBO;IAEjC,MAAMC,OAAO/B,OAA2B;IACxC,MAAMgC,QAAQ5B,SAAS6B,GAAG,KAAK;IAC/B,MAAM,CAACb,UAAUc,YAAY,GAAGjC,SAAS,CAAC2B;IAC1C,MAAMO,UAAU9B,wBAAwB;QACtC0B;QACAK,YAAY;QACZC,UAAUtC,YAAY,CAAC,CAACuC,MAAM;YAC5BJ,YAAYI,MAAMC,iBAAiB,KAAK;QAC1C,GAAG,EAAE;IACP;IAEA,qBACE;;YACG,CAACX,yBAAW,KAACY;gBAAK5B,KAAKuB;;0BACxB,KAACM;gBACE,GAAGd,SAAS;gBACbf,KAAK,CAAC8B;oBACJpC,SAASoC,UAAU9B;oBACnBmB,KAAKY,OAAO,GAAGD,UAAUE,iBAAiB;gBAC5C;gBACA9B,WAAWL,6BAA6B;oBACtCmB;oBACAH;oBACAX;gBACF;0BAEA,cAAA,KAACZ;oBACC2C,cAAYhC,aAAcgB,CAAAA,aAAab,OAAO8B,SAAQ;oBACtD7B,OAAOA;oBACPC,WAAWA;oBACXC,YAAYA;oBACZC,UAAUC,gBAAgBD;oBACzB,GAAGL,WAAW;oBACfD,WAAWN,oBAAoB;wBAC7BM,WAAWC,aAAaD;wBACxBW;oBACF;oBACAsB,SAAS,CAACC;wBACRjC,aAAagC,UAAUC;wBACvB,MAAMC,YAAYlB,KAAKY,OAAO;wBAC9B,IAAI,CAACM,WAAW;4BACd;wBACF;wBAEAA,UAAUC,QAAQ,CAChB1B,mBAAmB;4BACjBQ;4BACAmB,SAAS,CAACzB;4BACVD;4BACAwB;4BACAG,WAAWxB;wBACb;oBAEJ;8BAECN;;;YAGJM,yBAAW,KAACY;gBAAK5B,KAAKuB;;;;AAG7B,GAAG"}
@@ -368,12 +368,11 @@ $variables: (
368
368
  }
369
369
 
370
370
  @include utils.rtl {
371
- $button-selector: "&__button" +
372
- if(
373
- $disable-tablist-scroll-button-vertical,
374
- "",
375
- ":where(:not(.rmd-tablist-button__button--v))"
376
- );
371
+ $button-selector: "&__button";
372
+ @if not $disable-tablist-scroll-button-vertical {
373
+ $button-selector: $button-selector +
374
+ ":where(:not(.rmd-tablist-button__button--v))";
375
+ }
377
376
 
378
377
  &--left {
379
378
  left: auto;
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/tabs/useMaxTabPanelHeight.ts"],"sourcesContent":["import { type CSSProperties, type Ref, useCallback, useState } from \"react\";\n\nimport { type UseStateInitializer } from \"../types.js\";\nimport { useResizeObserver } from \"../useResizeObserver.js\";\nimport { DISPLAY_NONE_CLASS } from \"../utils/isElementVisible.js\";\nimport {\n type ProvidedTabPanelsProps,\n type TabsImplementation,\n} from \"./useTabs.js\";\nimport { getTabPanelRoleOnly } from \"./utils.js\";\n\n/**\n * @since 6.0.0\n */\nexport interface MaxTabPanelHeightOptions<E extends HTMLElement>\n extends Pick<TabsImplementation, \"getTabPanelsProps\"> {\n ref?: Ref<E>;\n style?: CSSProperties;\n\n /**\n * @defaultValue `undefined`\n */\n defaultHeight?: UseStateInitializer<string | number>;\n}\n\n/**\n * @since 6.0.0\n */\nexport interface ProvidedMaxTabPanelsHeightProps<E extends HTMLElement>\n extends ProvidedTabPanelsProps<E> {\n style: CSSProperties;\n}\n\n/**\n * @since 6.0.0\n */\nexport interface MaxTabPanelHeightImplementation<E extends HTMLElement> {\n getMaxTabPanelHeightProps: (\n style?: CSSProperties\n ) => ProvidedMaxTabPanelsHeightProps<E>;\n}\n\n/**\n * The `useMaxTabPanelHeight` hook can be used to enforce the tab panels to\n * have the same height so content does not shift below the tab panels by\n * calculating the height of all tabs and setting the height to the largest\n * value.\n *\n * If a maximum height should be used, set it through CSS and scrollbars will\n * appear in each tab panel.\n *\n * @example Main Usage\n * ```tsx\n * import { Tab } from \"@react-md/core/tabs/Tab\";\n * import { TabList } from \"@react-md/core/tabs/TabList\";\n * import { useMaxTabPanelHeight } from \"@react-md/core/tabs/useMaxTabPanelHeight\";\n * import { useTabs } from \"@react-md/core/tabs/useTabs\";\n * import { Slide } from \"@react-md/core/transition/Slide\";\n * import { SlideContainer } from \"@react-md/core/transition/SlideContainer\";\n * import { Typography } from \"@react-md/core/typography/Typography\";\n * import { type ReactElement } from \"react\";\n *\n * function Example(): ReactElement {\n * const { getTabProps, getTabListProps, getTabPanelProps, getTabPanelsProps } =\n * useTabs();\n * const { getMaxTabPanelHeightProps } = useMaxTabPanelHeight({\n * getTabPanelsProps,\n * });\n *\n * return (\n * <>\n * <TabList {...getTabListProps()}>\n * <Tab {...getTabProps(0)}>Tab 1</Tab>\n * <Tab {...getTabProps(1)}>Tab 2</Tab>\n * <Tab {...getTabProps(2)}>Tab 3</Tab>\n * </TabList>\n * <SlideContainer {...getMaxTabPanelHeightProps()}>\n * <Slide {...getTabPanelProps(0)}>\n * <Tab1Content />\n * </Slide>\n * <Slide {...getTabPanelProps(1)}>\n * <Tab2Content />\n * </Slide>\n * <Slide {...getTabPanelProps(2)}>\n * <Tab3Content />\n * </Slide>\n * </SlideContainer>\n * </>\n * );\n * }\n * ```\n *\n * NOTE: This will **not work** when dynamically rendering the active tab panel\n * by enabling the `temporary` prop on the `Slide` or custom behavior.\n *\n * @since 6.0.0\n */\nexport function useMaxTabPanelHeight<E extends HTMLElement = HTMLDivElement>(\n options: MaxTabPanelHeightOptions<E>\n): MaxTabPanelHeightImplementation<E> {\n const { ref, style, defaultHeight, getTabPanelsProps } = options;\n\n const [height, setHeight] = useState(defaultHeight);\n const panelRef = useResizeObserver({\n ref,\n onUpdate: useCallback((entry) => {\n const element = entry.target as HTMLElement;\n const { height } = element.style;\n element.style.height = \"\";\n const panels = getTabPanelRoleOnly(element);\n const maxHeight = panels.reduce((maxHeight, panel) => {\n let { scrollHeight } = panel;\n if (panel.classList.contains(DISPLAY_NONE_CLASS)) {\n panel.classList.toggle(DISPLAY_NONE_CLASS);\n ({ scrollHeight } = panel);\n panel.classList.toggle(DISPLAY_NONE_CLASS);\n }\n\n return Math.max(maxHeight, scrollHeight);\n }, 0);\n element.style.height = height;\n\n // don't set the height to 0 since it usually means a calculation issue\n setHeight((prevHeight) => (maxHeight <= 0 ? prevHeight : maxHeight));\n }, []),\n });\n\n return {\n getMaxTabPanelHeightProps: (moreStyle) => ({\n ...getTabPanelsProps(panelRef),\n style: {\n height,\n ...style,\n ...moreStyle,\n },\n }),\n };\n}\n"],"names":["useCallback","useState","useResizeObserver","DISPLAY_NONE_CLASS","getTabPanelRoleOnly","useMaxTabPanelHeight","options","ref","style","defaultHeight","getTabPanelsProps","height","setHeight","panelRef","onUpdate","entry","element","target","panels","maxHeight","reduce","panel","scrollHeight","classList","contains","toggle","Math","max","prevHeight","getMaxTabPanelHeightProps","moreStyle"],"mappings":"AAAA,SAAuCA,WAAW,EAAEC,QAAQ,QAAQ,QAAQ;AAG5E,SAASC,iBAAiB,QAAQ,0BAA0B;AAC5D,SAASC,kBAAkB,QAAQ,+BAA+B;AAKlE,SAASC,mBAAmB,QAAQ,aAAa;AAiCjD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAsDC,GACD,OAAO,SAASC,qBACdC,OAAoC;IAEpC,MAAM,EAAEC,GAAG,EAAEC,KAAK,EAAEC,aAAa,EAAEC,iBAAiB,EAAE,GAAGJ;IAEzD,MAAM,CAACK,QAAQC,UAAU,GAAGX,SAASQ;IACrC,MAAMI,WAAWX,kBAAkB;QACjCK;QACAO,UAAUd,YAAY,CAACe;YACrB,MAAMC,UAAUD,MAAME,MAAM;YAC5B,MAAM,EAAEN,MAAM,EAAE,GAAGK,QAAQR,KAAK;YAChCQ,QAAQR,KAAK,CAACG,MAAM,GAAG;YACvB,MAAMO,SAASd,oBAAoBY;YACnC,MAAMG,YAAYD,OAAOE,MAAM,CAAC,CAACD,WAAWE;gBAC1C,IAAI,EAAEC,YAAY,EAAE,GAAGD;gBACvB,IAAIA,MAAME,SAAS,CAACC,QAAQ,CAACrB,qBAAqB;oBAChDkB,MAAME,SAAS,CAACE,MAAM,CAACtB;oBACtB,CAAA,EAAEmB,YAAY,EAAE,GAAGD,KAAI;oBACxBA,MAAME,SAAS,CAACE,MAAM,CAACtB;gBACzB;gBAEA,OAAOuB,KAAKC,GAAG,CAACR,WAAWG;YAC7B,GAAG;YACHN,QAAQR,KAAK,CAACG,MAAM,GAAGA;YAEvB,uEAAuE;YACvEC,UAAU,CAACgB,aAAgBT,aAAa,IAAIS,aAAaT;QAC3D,GAAG,EAAE;IACP;IAEA,OAAO;QACLU,2BAA2B,CAACC,YAAe,CAAA;gBACzC,GAAGpB,kBAAkBG,SAAS;gBAC9BL,OAAO;oBACLG;oBACA,GAAGH,KAAK;oBACR,GAAGsB,SAAS;gBACd;YACF,CAAA;IACF;AACF"}
1
+ {"version":3,"sources":["../../src/tabs/useMaxTabPanelHeight.ts"],"sourcesContent":["import { type CSSProperties, type Ref, useCallback, useState } from \"react\";\n\nimport { type UseStateInitializer } from \"../types.js\";\nimport { useResizeObserver } from \"../useResizeObserver.js\";\nimport { DISPLAY_NONE_CLASS } from \"../utils/isElementVisible.js\";\nimport {\n type ProvidedTabPanelsProps,\n type TabsImplementation,\n} from \"./useTabs.js\";\nimport { getTabPanelRoleOnly } from \"./utils.js\";\n\n/**\n * @since 6.0.0\n */\nexport interface MaxTabPanelHeightOptions<E extends HTMLElement> extends Pick<\n TabsImplementation,\n \"getTabPanelsProps\"\n> {\n ref?: Ref<E>;\n style?: CSSProperties;\n\n /**\n * @defaultValue `undefined`\n */\n defaultHeight?: UseStateInitializer<string | number>;\n}\n\n/**\n * @since 6.0.0\n */\nexport interface ProvidedMaxTabPanelsHeightProps<\n E extends HTMLElement,\n> extends ProvidedTabPanelsProps<E> {\n style: CSSProperties;\n}\n\n/**\n * @since 6.0.0\n */\nexport interface MaxTabPanelHeightImplementation<E extends HTMLElement> {\n getMaxTabPanelHeightProps: (\n style?: CSSProperties\n ) => ProvidedMaxTabPanelsHeightProps<E>;\n}\n\n/**\n * The `useMaxTabPanelHeight` hook can be used to enforce the tab panels to\n * have the same height so content does not shift below the tab panels by\n * calculating the height of all tabs and setting the height to the largest\n * value.\n *\n * If a maximum height should be used, set it through CSS and scrollbars will\n * appear in each tab panel.\n *\n * @example Main Usage\n * ```tsx\n * import { Tab } from \"@react-md/core/tabs/Tab\";\n * import { TabList } from \"@react-md/core/tabs/TabList\";\n * import { useMaxTabPanelHeight } from \"@react-md/core/tabs/useMaxTabPanelHeight\";\n * import { useTabs } from \"@react-md/core/tabs/useTabs\";\n * import { Slide } from \"@react-md/core/transition/Slide\";\n * import { SlideContainer } from \"@react-md/core/transition/SlideContainer\";\n * import { Typography } from \"@react-md/core/typography/Typography\";\n * import { type ReactElement } from \"react\";\n *\n * function Example(): ReactElement {\n * const { getTabProps, getTabListProps, getTabPanelProps, getTabPanelsProps } =\n * useTabs();\n * const { getMaxTabPanelHeightProps } = useMaxTabPanelHeight({\n * getTabPanelsProps,\n * });\n *\n * return (\n * <>\n * <TabList {...getTabListProps()}>\n * <Tab {...getTabProps(0)}>Tab 1</Tab>\n * <Tab {...getTabProps(1)}>Tab 2</Tab>\n * <Tab {...getTabProps(2)}>Tab 3</Tab>\n * </TabList>\n * <SlideContainer {...getMaxTabPanelHeightProps()}>\n * <Slide {...getTabPanelProps(0)}>\n * <Tab1Content />\n * </Slide>\n * <Slide {...getTabPanelProps(1)}>\n * <Tab2Content />\n * </Slide>\n * <Slide {...getTabPanelProps(2)}>\n * <Tab3Content />\n * </Slide>\n * </SlideContainer>\n * </>\n * );\n * }\n * ```\n *\n * NOTE: This will **not work** when dynamically rendering the active tab panel\n * by enabling the `temporary` prop on the `Slide` or custom behavior.\n *\n * @since 6.0.0\n */\nexport function useMaxTabPanelHeight<E extends HTMLElement = HTMLDivElement>(\n options: MaxTabPanelHeightOptions<E>\n): MaxTabPanelHeightImplementation<E> {\n const { ref, style, defaultHeight, getTabPanelsProps } = options;\n\n const [height, setHeight] = useState(defaultHeight);\n const panelRef = useResizeObserver({\n ref,\n onUpdate: useCallback((entry) => {\n const element = entry.target as HTMLElement;\n const { height } = element.style;\n element.style.height = \"\";\n const panels = getTabPanelRoleOnly(element);\n const maxHeight = panels.reduce((maxHeight, panel) => {\n let { scrollHeight } = panel;\n if (panel.classList.contains(DISPLAY_NONE_CLASS)) {\n panel.classList.toggle(DISPLAY_NONE_CLASS);\n ({ scrollHeight } = panel);\n panel.classList.toggle(DISPLAY_NONE_CLASS);\n }\n\n return Math.max(maxHeight, scrollHeight);\n }, 0);\n element.style.height = height;\n\n // don't set the height to 0 since it usually means a calculation issue\n setHeight((prevHeight) => (maxHeight <= 0 ? prevHeight : maxHeight));\n }, []),\n });\n\n return {\n getMaxTabPanelHeightProps: (moreStyle) => ({\n ...getTabPanelsProps(panelRef),\n style: {\n height,\n ...style,\n ...moreStyle,\n },\n }),\n };\n}\n"],"names":["useCallback","useState","useResizeObserver","DISPLAY_NONE_CLASS","getTabPanelRoleOnly","useMaxTabPanelHeight","options","ref","style","defaultHeight","getTabPanelsProps","height","setHeight","panelRef","onUpdate","entry","element","target","panels","maxHeight","reduce","panel","scrollHeight","classList","contains","toggle","Math","max","prevHeight","getMaxTabPanelHeightProps","moreStyle"],"mappings":"AAAA,SAAuCA,WAAW,EAAEC,QAAQ,QAAQ,QAAQ;AAG5E,SAASC,iBAAiB,QAAQ,0BAA0B;AAC5D,SAASC,kBAAkB,QAAQ,+BAA+B;AAKlE,SAASC,mBAAmB,QAAQ,aAAa;AAoCjD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAsDC,GACD,OAAO,SAASC,qBACdC,OAAoC;IAEpC,MAAM,EAAEC,GAAG,EAAEC,KAAK,EAAEC,aAAa,EAAEC,iBAAiB,EAAE,GAAGJ;IAEzD,MAAM,CAACK,QAAQC,UAAU,GAAGX,SAASQ;IACrC,MAAMI,WAAWX,kBAAkB;QACjCK;QACAO,UAAUd,YAAY,CAACe;YACrB,MAAMC,UAAUD,MAAME,MAAM;YAC5B,MAAM,EAAEN,MAAM,EAAE,GAAGK,QAAQR,KAAK;YAChCQ,QAAQR,KAAK,CAACG,MAAM,GAAG;YACvB,MAAMO,SAASd,oBAAoBY;YACnC,MAAMG,YAAYD,OAAOE,MAAM,CAAC,CAACD,WAAWE;gBAC1C,IAAI,EAAEC,YAAY,EAAE,GAAGD;gBACvB,IAAIA,MAAME,SAAS,CAACC,QAAQ,CAACrB,qBAAqB;oBAChDkB,MAAME,SAAS,CAACE,MAAM,CAACtB;oBACtB,CAAA,EAAEmB,YAAY,EAAE,GAAGD,KAAI;oBACxBA,MAAME,SAAS,CAACE,MAAM,CAACtB;gBACzB;gBAEA,OAAOuB,KAAKC,GAAG,CAACR,WAAWG;YAC7B,GAAG;YACHN,QAAQR,KAAK,CAACG,MAAM,GAAGA;YAEvB,uEAAuE;YACvEC,UAAU,CAACgB,aAAgBT,aAAa,IAAIS,aAAaT;QAC3D,GAAG,EAAE;IACP;IAEA,OAAO;QACLU,2BAA2B,CAACC,YAAe,CAAA;gBACzC,GAAGpB,kBAAkBG,SAAS;gBAC9BL,OAAO;oBACLG;oBACA,GAAGH,KAAK;oBACR,GAAGsB,SAAS;gBACd;YACF,CAAA;IACF;AACF"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/test-utils/data-testid.ts"],"sourcesContent":["/// <reference types=\"react\" />\n\ndeclare module \"react\" {\n interface HTMLAttributes<T>\n extends React.AriaAttributes,\n React.DOMAttributes<T> {\n \"data-testid\"?: string | number;\n }\n}\n"],"names":[],"mappings":"AAAA,+BAA+B"}
1
+ {"version":3,"sources":["../../src/test-utils/data-testid.ts"],"sourcesContent":["/// <reference types=\"react\" />\n\ndeclare module \"react\" {\n interface HTMLAttributes<T>\n extends React.AriaAttributes, React.DOMAttributes<T> {\n \"data-testid\"?: string | number;\n }\n}\n"],"names":[],"mappings":"AAAA,+BAA+B"}
@@ -1,4 +1,4 @@
1
- import { DEFAULT_DESKTOP_LARGE_MIN_WIDTH, DEFAULT_DESKTOP_MIN_WIDTH, DEFAULT_PHONE_MAX_WIDTH, DEFAULT_TABLET_MIN_WIDTH } from "../../media-queries/appSize.js";
1
+ import { MEDIA_QUERY_CONFIG } from "../../media-queries/config.js";
2
2
  const noop = ()=>{
3
3
  // do nothing
4
4
  };
@@ -18,19 +18,19 @@ const noop = ()=>{
18
18
  /**
19
19
  * @since 6.0.0
20
20
  * @returns `true` for phone media queries
21
- */ export const matchPhone = (query)=>query.includes(DEFAULT_PHONE_MAX_WIDTH);
21
+ */ export const matchPhone = (query)=>query.includes(`${MEDIA_QUERY_CONFIG.phoneMaxWidth}`);
22
22
  /**
23
23
  * @since 6.0.0
24
24
  * @returns `true` for tablet media queries
25
- */ export const matchTablet = (query)=>query.includes(DEFAULT_TABLET_MIN_WIDTH);
25
+ */ export const matchTablet = (query)=>query.includes(`${MEDIA_QUERY_CONFIG.tabletMinWidth}`);
26
26
  /**
27
27
  * @since 6.0.0
28
28
  * @returns `true` for desktop media queries
29
- */ export const matchDesktop = (query)=>query.includes(DEFAULT_DESKTOP_MIN_WIDTH);
29
+ */ export const matchDesktop = (query)=>query.includes(`${MEDIA_QUERY_CONFIG.desktopMinWidth}`);
30
30
  /**
31
31
  * @since 6.0.0
32
32
  * @returns `true` for large desktop media queries
33
- */ export const matchLargeDesktop = (query)=>query.includes(DEFAULT_DESKTOP_LARGE_MIN_WIDTH);
33
+ */ export const matchLargeDesktop = (query)=>query.includes(`${MEDIA_QUERY_CONFIG.desktopLargeMinWidth}`);
34
34
  /**
35
35
  * @since 6.0.0
36
36
  * @returns `true` for both desktop and large desktop media queries
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/test-utils/mocks/match-media.ts"],"sourcesContent":["import {\n DEFAULT_DESKTOP_LARGE_MIN_WIDTH,\n DEFAULT_DESKTOP_MIN_WIDTH,\n DEFAULT_PHONE_MAX_WIDTH,\n DEFAULT_TABLET_MIN_WIDTH,\n} from \"../../media-queries/appSize.js\";\n\n/**\n * @since 6.0.0\n */\nexport interface MatchMediaChangeViewport {\n /**\n * @example Default Behavior\n * ```tsx\n * const matchMedia = spyOnMatchMedia();\n * render(<Test />);\n *\n * // expect desktop results\n *\n * matchMedia.changeViewport(matchPhone);\n * // expect phone results\n * ```\n *\n * @example Custom Act Behavior\n * ```tsx\n * const matchMedia = spyOnMatchMedia();\n * const { rerender } = render(<Test />);\n *\n * // expect desktop results\n *\n * matchMedia.changeViewport(matchPhone, false);\n * rerender(<Test key=\"new-key\" />);\n *\n * // expect phone results\n * ```\n */\n changeViewport: (matcher: MatchMediaMatcher, disableAct?: boolean) => void;\n}\n\nconst noop = (): void => {\n // do nothing\n};\n\n/**\n * @internal\n * @since 6.0.0\n */\nexport const BASE_MEDIA_QUERY_LIST: MediaQueryList = {\n media: \"\",\n matches: false,\n onchange: noop,\n addListener: noop,\n addEventListener: noop,\n removeEventListener: noop,\n removeListener: noop,\n dispatchEvent: () => false,\n};\n\n/** @since 6.0.0 */\nexport type MatchMediaMatcher = (query: string) => boolean;\n\n/**\n * @since 6.0.0\n * @returns `true` for phone media queries\n */\nexport const matchPhone: MatchMediaMatcher = (query) =>\n query.includes(DEFAULT_PHONE_MAX_WIDTH);\n\n/**\n * @since 6.0.0\n * @returns `true` for tablet media queries\n */\nexport const matchTablet: MatchMediaMatcher = (query) =>\n query.includes(DEFAULT_TABLET_MIN_WIDTH);\n\n/**\n * @since 6.0.0\n * @returns `true` for desktop media queries\n */\nexport const matchDesktop: MatchMediaMatcher = (query) =>\n query.includes(DEFAULT_DESKTOP_MIN_WIDTH);\n\n/**\n * @since 6.0.0\n * @returns `true` for large desktop media queries\n */\nexport const matchLargeDesktop: MatchMediaMatcher = (query) =>\n query.includes(DEFAULT_DESKTOP_LARGE_MIN_WIDTH);\n\n/**\n * @since 6.0.0\n * @returns `true` for both desktop and large desktop media queries\n */\nexport const matchAnyDesktop: MatchMediaMatcher = (query) =>\n matchDesktop(query) || matchLargeDesktop(query);\n"],"names":["DEFAULT_DESKTOP_LARGE_MIN_WIDTH","DEFAULT_DESKTOP_MIN_WIDTH","DEFAULT_PHONE_MAX_WIDTH","DEFAULT_TABLET_MIN_WIDTH","noop","BASE_MEDIA_QUERY_LIST","media","matches","onchange","addListener","addEventListener","removeEventListener","removeListener","dispatchEvent","matchPhone","query","includes","matchTablet","matchDesktop","matchLargeDesktop","matchAnyDesktop"],"mappings":"AAAA,SACEA,+BAA+B,EAC/BC,yBAAyB,EACzBC,uBAAuB,EACvBC,wBAAwB,QACnB,iCAAiC;AAkCxC,MAAMC,OAAO;AACX,aAAa;AACf;AAEA;;;CAGC,GACD,OAAO,MAAMC,wBAAwC;IACnDC,OAAO;IACPC,SAAS;IACTC,UAAUJ;IACVK,aAAaL;IACbM,kBAAkBN;IAClBO,qBAAqBP;IACrBQ,gBAAgBR;IAChBS,eAAe,IAAM;AACvB,EAAE;AAKF;;;CAGC,GACD,OAAO,MAAMC,aAAgC,CAACC,QAC5CA,MAAMC,QAAQ,CAACd,yBAAyB;AAE1C;;;CAGC,GACD,OAAO,MAAMe,cAAiC,CAACF,QAC7CA,MAAMC,QAAQ,CAACb,0BAA0B;AAE3C;;;CAGC,GACD,OAAO,MAAMe,eAAkC,CAACH,QAC9CA,MAAMC,QAAQ,CAACf,2BAA2B;AAE5C;;;CAGC,GACD,OAAO,MAAMkB,oBAAuC,CAACJ,QACnDA,MAAMC,QAAQ,CAAChB,iCAAiC;AAElD;;;CAGC,GACD,OAAO,MAAMoB,kBAAqC,CAACL,QACjDG,aAAaH,UAAUI,kBAAkBJ,OAAO"}
1
+ {"version":3,"sources":["../../../src/test-utils/mocks/match-media.ts"],"sourcesContent":["import { MEDIA_QUERY_CONFIG } from \"../../media-queries/config.js\";\n\n/**\n * @since 6.0.0\n */\nexport interface MatchMediaChangeViewport {\n /**\n * @example Default Behavior\n * ```tsx\n * const matchMedia = spyOnMatchMedia();\n * render(<Test />);\n *\n * // expect desktop results\n *\n * matchMedia.changeViewport(matchPhone);\n * // expect phone results\n * ```\n *\n * @example Custom Act Behavior\n * ```tsx\n * const matchMedia = spyOnMatchMedia();\n * const { rerender } = render(<Test />);\n *\n * // expect desktop results\n *\n * matchMedia.changeViewport(matchPhone, false);\n * rerender(<Test key=\"new-key\" />);\n *\n * // expect phone results\n * ```\n */\n changeViewport: (matcher: MatchMediaMatcher, disableAct?: boolean) => void;\n}\n\nconst noop = (): void => {\n // do nothing\n};\n\n/**\n * @internal\n * @since 6.0.0\n */\nexport const BASE_MEDIA_QUERY_LIST: MediaQueryList = {\n media: \"\",\n matches: false,\n onchange: noop,\n addListener: noop,\n addEventListener: noop,\n removeEventListener: noop,\n removeListener: noop,\n dispatchEvent: () => false,\n};\n\n/** @since 6.0.0 */\nexport type MatchMediaMatcher = (query: string) => boolean;\n\n/**\n * @since 6.0.0\n * @returns `true` for phone media queries\n */\nexport const matchPhone: MatchMediaMatcher = (query) =>\n query.includes(`${MEDIA_QUERY_CONFIG.phoneMaxWidth}`);\n\n/**\n * @since 6.0.0\n * @returns `true` for tablet media queries\n */\nexport const matchTablet: MatchMediaMatcher = (query) =>\n query.includes(`${MEDIA_QUERY_CONFIG.tabletMinWidth}`);\n\n/**\n * @since 6.0.0\n * @returns `true` for desktop media queries\n */\nexport const matchDesktop: MatchMediaMatcher = (query) =>\n query.includes(`${MEDIA_QUERY_CONFIG.desktopMinWidth}`);\n\n/**\n * @since 6.0.0\n * @returns `true` for large desktop media queries\n */\nexport const matchLargeDesktop: MatchMediaMatcher = (query) =>\n query.includes(`${MEDIA_QUERY_CONFIG.desktopLargeMinWidth}`);\n\n/**\n * @since 6.0.0\n * @returns `true` for both desktop and large desktop media queries\n */\nexport const matchAnyDesktop: MatchMediaMatcher = (query) =>\n matchDesktop(query) || matchLargeDesktop(query);\n"],"names":["MEDIA_QUERY_CONFIG","noop","BASE_MEDIA_QUERY_LIST","media","matches","onchange","addListener","addEventListener","removeEventListener","removeListener","dispatchEvent","matchPhone","query","includes","phoneMaxWidth","matchTablet","tabletMinWidth","matchDesktop","desktopMinWidth","matchLargeDesktop","desktopLargeMinWidth","matchAnyDesktop"],"mappings":"AAAA,SAASA,kBAAkB,QAAQ,gCAAgC;AAkCnE,MAAMC,OAAO;AACX,aAAa;AACf;AAEA;;;CAGC,GACD,OAAO,MAAMC,wBAAwC;IACnDC,OAAO;IACPC,SAAS;IACTC,UAAUJ;IACVK,aAAaL;IACbM,kBAAkBN;IAClBO,qBAAqBP;IACrBQ,gBAAgBR;IAChBS,eAAe,IAAM;AACvB,EAAE;AAKF;;;CAGC,GACD,OAAO,MAAMC,aAAgC,CAACC,QAC5CA,MAAMC,QAAQ,CAAC,GAAGb,mBAAmBc,aAAa,EAAE,EAAE;AAExD;;;CAGC,GACD,OAAO,MAAMC,cAAiC,CAACH,QAC7CA,MAAMC,QAAQ,CAAC,GAAGb,mBAAmBgB,cAAc,EAAE,EAAE;AAEzD;;;CAGC,GACD,OAAO,MAAMC,eAAkC,CAACL,QAC9CA,MAAMC,QAAQ,CAAC,GAAGb,mBAAmBkB,eAAe,EAAE,EAAE;AAE1D;;;CAGC,GACD,OAAO,MAAMC,oBAAuC,CAACP,QACnDA,MAAMC,QAAQ,CAAC,GAAGb,mBAAmBoB,oBAAoB,EAAE,EAAE;AAE/D;;;CAGC,GACD,OAAO,MAAMC,kBAAqC,CAACT,QACjDK,aAAaL,UAAUO,kBAAkBP,OAAO"}
@@ -25,7 +25,7 @@ export type RafSpy = MockInstance<typeof requestAnimationFrame>;
25
25
  * import { testImmediateRaf } from "@react-md/core/test-utils/vitest";
26
26
  *
27
27
  * afterEach(() => {
28
- * jest.restoreAllMocks();
28
+ * vi.restoreAllMocks();
29
29
  * });
30
30
  *
31
31
  * describe("some test suite", () => {
@@ -21,7 +21,7 @@ import { vi } from "vitest";
21
21
  * import { testImmediateRaf } from "@react-md/core/test-utils/vitest";
22
22
  *
23
23
  * afterEach(() => {
24
- * jest.restoreAllMocks();
24
+ * vi.restoreAllMocks();
25
25
  * });
26
26
  *
27
27
  * describe("some test suite", () => {
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/test-utils/vitest/timers.ts"],"sourcesContent":["import { type MockInstance, vi } from \"vitest\";\n\n/**\n * @since 6.0.0\n */\nexport type RafSpy = MockInstance<typeof requestAnimationFrame>;\n\n/**\n * @example\n * ```ts\n * import { testImmediateRaf } from \"@react-md/core/test-utils/vitest\";\n *\n * describe(\"some test suite\", () => {\n * it(\"should test something with requestAnimationFrame\", () => {\n * const raf = testImmediateRaf();\n *\n * // do some testing with requestAnimationFrame\n *\n * // reset to original at the end of the test\n * raf.mockRestore()\n * });\n * });\n * ```\n *\n * @example Automatic Cleanup\n * ```ts\n * import { testImmediateRaf } from \"@react-md/core/test-utils/vitest\";\n *\n * afterEach(() => {\n * jest.restoreAllMocks();\n * });\n *\n * describe(\"some test suite\", () => {\n * it(\"should test something with requestAnimationFrame\", () => {\n * const raf = testImmediateRaf();\n *\n * // do some testing with requestAnimationFrame\n * });\n * });\n * ```\n *\n * @since 6.0.0\n */\nexport const testImmediateRaf = (): RafSpy =>\n vi.spyOn(window, \"requestAnimationFrame\").mockImplementation((cb) => {\n cb(0);\n return 0;\n });\n"],"names":["vi","testImmediateRaf","spyOn","window","mockImplementation","cb"],"mappings":"AAAA,SAA4BA,EAAE,QAAQ,SAAS;AAO/C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAmCC,GACD,OAAO,MAAMC,mBAAmB,IAC9BD,GAAGE,KAAK,CAACC,QAAQ,yBAAyBC,kBAAkB,CAAC,CAACC;QAC5DA,GAAG;QACH,OAAO;IACT,GAAG"}
1
+ {"version":3,"sources":["../../../src/test-utils/vitest/timers.ts"],"sourcesContent":["import { type MockInstance, vi } from \"vitest\";\n\n/**\n * @since 6.0.0\n */\nexport type RafSpy = MockInstance<typeof requestAnimationFrame>;\n\n/**\n * @example\n * ```ts\n * import { testImmediateRaf } from \"@react-md/core/test-utils/vitest\";\n *\n * describe(\"some test suite\", () => {\n * it(\"should test something with requestAnimationFrame\", () => {\n * const raf = testImmediateRaf();\n *\n * // do some testing with requestAnimationFrame\n *\n * // reset to original at the end of the test\n * raf.mockRestore()\n * });\n * });\n * ```\n *\n * @example Automatic Cleanup\n * ```ts\n * import { testImmediateRaf } from \"@react-md/core/test-utils/vitest\";\n *\n * afterEach(() => {\n * vi.restoreAllMocks();\n * });\n *\n * describe(\"some test suite\", () => {\n * it(\"should test something with requestAnimationFrame\", () => {\n * const raf = testImmediateRaf();\n *\n * // do some testing with requestAnimationFrame\n * });\n * });\n * ```\n *\n * @since 6.0.0\n */\nexport const testImmediateRaf = (): RafSpy =>\n vi.spyOn(window, \"requestAnimationFrame\").mockImplementation((cb) => {\n cb(0);\n return 0;\n });\n"],"names":["vi","testImmediateRaf","spyOn","window","mockImplementation","cb"],"mappings":"AAAA,SAA4BA,EAAE,QAAQ,SAAS;AAO/C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAmCC,GACD,OAAO,MAAMC,mBAAmB,IAC9BD,GAAGE,KAAK,CAACC,QAAQ,yBAAyBC,kBAAkB,CAAC,CAACC;QAC5DA,GAAG;QACH,OAAO;IACT,GAAG"}
@@ -183,5 +183,7 @@ $_linear-channel-values: (
183
183
  $light-contrast: _contrast($background-color, $light-color);
184
184
  $dark-contrast: _contrast($background-color, $dark-color);
185
185
 
186
- @return if($light-contrast > $dark-contrast, $light-color, $dark-color);
186
+ @return if(
187
+ sass($light-contrast > $dark-contrast): $light-color; else: $dark-color
188
+ );
187
189
  }
@@ -222,10 +222,10 @@ $dark-theme-background-color: #121212 !default;
222
222
  /// color depending on its elevation.
223
223
  ///
224
224
  /// @type Color
225
+ // prettier-ignore
225
226
  $dark-theme-surface-color: if(
226
- $disable-dark-elevation,
227
- colors.$grey-800,
228
- null
227
+ sass($disable-dark-elevation): colors.$grey-800;
228
+ else: null
229
229
  ) !default;
230
230
 
231
231
  /// The primary text color when using the dark theme.
@@ -250,7 +250,7 @@ $dark-theme-text-disabled-color: rgba($dark-theme-inverse-color, 0.38) !default;
250
250
  /// @param {Color} dark-color - The dark theme color
251
251
  /// @returns {Color} The correct color depending on the `$color-scheme`
252
252
  @function get-default-color($light-color, $dark-color) {
253
- @return if($color-scheme == dark, $dark-color, $light-color);
253
+ @return if(sass($color-scheme == dark): $dark-color; else: $light-color);
254
254
  }
255
255
 
256
256
  /// The default background color
@@ -519,7 +519,7 @@ $theme-variables: (
519
519
  /// @param {any} value - The value to maybe return
520
520
  /// @return {any} the `$value` if it was theme var, otherwise null
521
521
  @function theme-color-var-fallback($value) {
522
- @return if(is-theme-color-var($value), $value, null);
522
+ @return if(sass(is-theme-color-var($value)): $value; else: null);
523
523
  }
524
524
 
525
525
  /// @param {Number} z-value - The dark elevation value
@@ -777,11 +777,10 @@ $theme-variables: (
777
777
 
778
778
  @if not $current-color-index {
779
779
  @if not $fallback-color {
780
- $fallback: if(
781
- $fallback-name,
782
- "the '$#{$fallback-name}' variable",
783
- "a fallback color"
784
- );
780
+ $fallback: "a fallback color";
781
+ @if $fallback-name {
782
+ $fallback: "the '$#{$fallback-name}' variable";
783
+ }
785
784
 
786
785
  $error-msg: "Invalid material design color: '#{$color}'. If this was intentional because your app does " +
787
786
  "not use material design colors, set #{$fallback} instead to get a correct color for the provided swatch: " +
@@ -794,8 +793,13 @@ $theme-variables: (
794
793
  }
795
794
  }
796
795
 
796
+ // prettier-ignore
797
+ $current-suffixes: if(
798
+ sass(not $accent): colors.$primary-suffixes;
799
+ else: colors.$accent-suffixes
800
+ );
797
801
  $suffixes: utils.validate(
798
- if($accent, colors.$accent-suffixes, colors.$primary-suffixes),
802
+ $current-suffixes,
799
803
  $swatch,
800
804
  "material design color swatch"
801
805
  );
@@ -829,7 +833,7 @@ $theme-variables: (
829
833
  }
830
834
  }
831
835
 
832
- $color-name: "#{$current-color-name}#{if($accent, "-a", "")}-#{$swatch}";
836
+ $color-name: "#{$current-color-name}#{if(sass(not $accent): ""; else: "-a")}-#{$swatch}";
833
837
 
834
838
  @return map.get(colors.$color-map, $color-name);
835
839
  }
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/tooltip/Tooltip.tsx"],"sourcesContent":["\"use client\";\n\nimport { type HTMLAttributes, forwardRef } from \"react\";\n\nimport { Portal } from \"../portal/Portal.js\";\nimport {\n type CSSTransitionClassNames,\n type CSSTransitionComponentProps,\n type SSRTransitionOptions,\n type TransitionActions,\n type TransitionTimeout,\n} from \"../transition/types.js\";\nimport { useCSSTransition } from \"../transition/useCSSTransition.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\nimport {\n DEFAULT_TOOLTIP_CLASSNAMES,\n DEFAULT_TOOLTIP_POSITION,\n DEFAULT_TOOLTIP_TIMEOUT,\n} from \"./constants.js\";\nimport { type TooltipClassNameOptions, tooltip } from \"./styles.js\";\n\n/**\n * The base props for the `Tooltip` component. This can be extended when\n * creating custom tooltip implementations.\n *\n * @since 2.8.0 Supports the `RenderConditionalPortalProps`\n * @since 6.0.0 The `id` prop is optional.\n * @since 6.0.0 Removed `lineWrap` for `textOverflow`\n * @since 6.0.0 No longer supports the `RenderConditionalPortalProps` other than\n * `portal` with the `disablePortal` prop.\n * @since 6.3.1 Extends TooltipClassNameOptions for CSSProperties module\n * augmentation.\n */\nexport interface TooltipProps\n extends HTMLAttributes<HTMLSpanElement>,\n TooltipClassNameOptions,\n CSSTransitionComponentProps,\n SSRTransitionOptions,\n TransitionActions {\n visible: boolean;\n\n /**\n * @see {@link CSSTransitionComponentProps.temporary}\n * @defaultValue `true`\n */\n temporary?: boolean;\n\n /**\n * @see {@link CSSTransitionComponentProps.timeout}\n * @defaultValue `DEFAULT_TOOLTIP_TIMEOUT`\n */\n timeout?: TransitionTimeout;\n\n /**\n * @see {@link CSSTransitionComponentProps.classNames}\n * @defaultValue `DEFAULT_TOOLTIP_CLASSNAMES`\n */\n classNames?: CSSTransitionClassNames;\n}\n\n/**\n * **Client Component**\n *\n * This is the base tooltip component that can only be used to render a tooltip\n * with an animation when the visibility changes. If this component is used, you\n * will need to manually add all the event listeners and triggers to change the\n * `visible` prop.\n *\n * @example Simple Usage\n * ```tsx\n * import { Button } from \"@react-md/core/button/Button\";\n * import { Tooltip } from \"@react-md/core/tooltip/Tooltip\";\n * import { useTooltip } from \"@react-md/core/tooltip/useTooltip\";\n *\n * function Example() {\n * const { elementProps, tooltipProps } = useTooltip();\n *\n * return (\n * <>\n * <Button {...elementProps}>Button</Button>\n * <Tooltip {...tooltipProps}>\n * Tooltip Content\n * </Tooltip>\n * </>\n * );\n * }\n * ```\n *\n * @see {@link https://react-md.dev/components/tooltip | Tooltip Demos}\n */\nexport const Tooltip = forwardRef<HTMLSpanElement, TooltipProps>(\n function Tooltip(props, nodeRef) {\n const {\n id: propId,\n dense,\n visible,\n children,\n appear,\n enter,\n exit,\n onEnter,\n onEntering,\n onEntered,\n onExit,\n onExiting,\n onExited,\n timeout = DEFAULT_TOOLTIP_TIMEOUT,\n classNames = DEFAULT_TOOLTIP_CLASSNAMES,\n className,\n position = DEFAULT_TOOLTIP_POSITION,\n temporary = true,\n exitedHidden = !temporary,\n textOverflow,\n disablePortal: propDisablePortal,\n ...remaining\n } = props;\n const id = useEnsuredId(propId, \"tooltip\");\n\n const { rendered, elementProps, disablePortal } = useCSSTransition({\n nodeRef,\n appear,\n enter,\n exit,\n transitionIn: visible,\n timeout,\n classNames,\n className: tooltip({\n dense,\n position,\n className,\n textOverflow,\n }),\n onEnter,\n onEntering,\n onEntered,\n onExit,\n onExiting,\n onExited,\n temporary,\n exitedHidden,\n disablePortal: propDisablePortal,\n });\n\n return (\n <Portal disabled={disablePortal}>\n {rendered && (\n <span {...remaining} {...elementProps} id={id} role=\"tooltip\">\n {children}\n </span>\n )}\n </Portal>\n );\n }\n);\n"],"names":["forwardRef","Portal","useCSSTransition","useEnsuredId","DEFAULT_TOOLTIP_CLASSNAMES","DEFAULT_TOOLTIP_POSITION","DEFAULT_TOOLTIP_TIMEOUT","tooltip","Tooltip","props","nodeRef","id","propId","dense","visible","children","appear","enter","exit","onEnter","onEntering","onEntered","onExit","onExiting","onExited","timeout","classNames","className","position","temporary","exitedHidden","textOverflow","disablePortal","propDisablePortal","remaining","rendered","elementProps","transitionIn","disabled","span","role"],"mappings":"AAAA;;AAEA,SAA8BA,UAAU,QAAQ,QAAQ;AAExD,SAASC,MAAM,QAAQ,sBAAsB;AAQ7C,SAASC,gBAAgB,QAAQ,oCAAoC;AACrE,SAASC,YAAY,QAAQ,qBAAqB;AAClD,SACEC,0BAA0B,EAC1BC,wBAAwB,EACxBC,uBAAuB,QAClB,iBAAiB;AACxB,SAAuCC,OAAO,QAAQ,cAAc;AAyCpE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA6BC,GACD,OAAO,MAAMC,wBAAUR,WACrB,SAASQ,QAAQC,KAAK,EAAEC,OAAO;IAC7B,MAAM,EACJC,IAAIC,MAAM,EACVC,KAAK,EACLC,OAAO,EACPC,QAAQ,EACRC,MAAM,EACNC,KAAK,EACLC,IAAI,EACJC,OAAO,EACPC,UAAU,EACVC,SAAS,EACTC,MAAM,EACNC,SAAS,EACTC,QAAQ,EACRC,UAAUnB,uBAAuB,EACjCoB,aAAatB,0BAA0B,EACvCuB,SAAS,EACTC,WAAWvB,wBAAwB,EACnCwB,YAAY,IAAI,EAChBC,eAAe,CAACD,SAAS,EACzBE,YAAY,EACZC,eAAeC,iBAAiB,EAChC,GAAGC,WACJ,GAAGzB;IACJ,MAAME,KAAKR,aAAaS,QAAQ;IAEhC,MAAM,EAAEuB,QAAQ,EAAEC,YAAY,EAAEJ,aAAa,EAAE,GAAG9B,iBAAiB;QACjEQ;QACAM;QACAC;QACAC;QACAmB,cAAcvB;QACdW;QACAC;QACAC,WAAWpB,QAAQ;YACjBM;YACAe;YACAD;YACAI;QACF;QACAZ;QACAC;QACAC;QACAC;QACAC;QACAC;QACAK;QACAC;QACAE,eAAeC;IACjB;IAEA,qBACE,KAAChC;QAAOqC,UAAUN;kBACfG,0BACC,KAACI;YAAM,GAAGL,SAAS;YAAG,GAAGE,YAAY;YAAEzB,IAAIA;YAAI6B,MAAK;sBACjDzB;;;AAKX,GACA"}
1
+ {"version":3,"sources":["../../src/tooltip/Tooltip.tsx"],"sourcesContent":["\"use client\";\n\nimport { type HTMLAttributes, forwardRef } from \"react\";\n\nimport { Portal } from \"../portal/Portal.js\";\nimport {\n type CSSTransitionClassNames,\n type CSSTransitionComponentProps,\n type SSRTransitionOptions,\n type TransitionActions,\n type TransitionTimeout,\n} from \"../transition/types.js\";\nimport { useCSSTransition } from \"../transition/useCSSTransition.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\nimport {\n DEFAULT_TOOLTIP_CLASSNAMES,\n DEFAULT_TOOLTIP_POSITION,\n DEFAULT_TOOLTIP_TIMEOUT,\n} from \"./constants.js\";\nimport { type TooltipClassNameOptions, tooltip } from \"./styles.js\";\n\n/**\n * The base props for the `Tooltip` component. This can be extended when\n * creating custom tooltip implementations.\n *\n * @since 2.8.0 Supports the `RenderConditionalPortalProps`\n * @since 6.0.0 The `id` prop is optional.\n * @since 6.0.0 Removed `lineWrap` for `textOverflow`\n * @since 6.0.0 No longer supports the `RenderConditionalPortalProps` other than\n * `portal` with the `disablePortal` prop.\n * @since 6.3.1 Extends TooltipClassNameOptions for CSSProperties module\n * augmentation.\n */\nexport interface TooltipProps\n extends\n HTMLAttributes<HTMLSpanElement>,\n TooltipClassNameOptions,\n CSSTransitionComponentProps,\n SSRTransitionOptions,\n TransitionActions {\n visible: boolean;\n\n /**\n * @see {@link CSSTransitionComponentProps.temporary}\n * @defaultValue `true`\n */\n temporary?: boolean;\n\n /**\n * @see {@link CSSTransitionComponentProps.timeout}\n * @defaultValue `DEFAULT_TOOLTIP_TIMEOUT`\n */\n timeout?: TransitionTimeout;\n\n /**\n * @see {@link CSSTransitionComponentProps.classNames}\n * @defaultValue `DEFAULT_TOOLTIP_CLASSNAMES`\n */\n classNames?: CSSTransitionClassNames;\n}\n\n/**\n * **Client Component**\n *\n * This is the base tooltip component that can only be used to render a tooltip\n * with an animation when the visibility changes. If this component is used, you\n * will need to manually add all the event listeners and triggers to change the\n * `visible` prop.\n *\n * @example Simple Usage\n * ```tsx\n * import { Button } from \"@react-md/core/button/Button\";\n * import { Tooltip } from \"@react-md/core/tooltip/Tooltip\";\n * import { useTooltip } from \"@react-md/core/tooltip/useTooltip\";\n *\n * function Example() {\n * const { elementProps, tooltipProps } = useTooltip();\n *\n * return (\n * <>\n * <Button {...elementProps}>Button</Button>\n * <Tooltip {...tooltipProps}>\n * Tooltip Content\n * </Tooltip>\n * </>\n * );\n * }\n * ```\n *\n * @see {@link https://react-md.dev/components/tooltip | Tooltip Demos}\n */\nexport const Tooltip = forwardRef<HTMLSpanElement, TooltipProps>(\n function Tooltip(props, nodeRef) {\n const {\n id: propId,\n dense,\n visible,\n children,\n appear,\n enter,\n exit,\n onEnter,\n onEntering,\n onEntered,\n onExit,\n onExiting,\n onExited,\n timeout = DEFAULT_TOOLTIP_TIMEOUT,\n classNames = DEFAULT_TOOLTIP_CLASSNAMES,\n className,\n position = DEFAULT_TOOLTIP_POSITION,\n temporary = true,\n exitedHidden = !temporary,\n textOverflow,\n disablePortal: propDisablePortal,\n ...remaining\n } = props;\n const id = useEnsuredId(propId, \"tooltip\");\n\n const { rendered, elementProps, disablePortal } = useCSSTransition({\n nodeRef,\n appear,\n enter,\n exit,\n transitionIn: visible,\n timeout,\n classNames,\n className: tooltip({\n dense,\n position,\n className,\n textOverflow,\n }),\n onEnter,\n onEntering,\n onEntered,\n onExit,\n onExiting,\n onExited,\n temporary,\n exitedHidden,\n disablePortal: propDisablePortal,\n });\n\n return (\n <Portal disabled={disablePortal}>\n {rendered && (\n <span {...remaining} {...elementProps} id={id} role=\"tooltip\">\n {children}\n </span>\n )}\n </Portal>\n );\n }\n);\n"],"names":["forwardRef","Portal","useCSSTransition","useEnsuredId","DEFAULT_TOOLTIP_CLASSNAMES","DEFAULT_TOOLTIP_POSITION","DEFAULT_TOOLTIP_TIMEOUT","tooltip","Tooltip","props","nodeRef","id","propId","dense","visible","children","appear","enter","exit","onEnter","onEntering","onEntered","onExit","onExiting","onExited","timeout","classNames","className","position","temporary","exitedHidden","textOverflow","disablePortal","propDisablePortal","remaining","rendered","elementProps","transitionIn","disabled","span","role"],"mappings":"AAAA;;AAEA,SAA8BA,UAAU,QAAQ,QAAQ;AAExD,SAASC,MAAM,QAAQ,sBAAsB;AAQ7C,SAASC,gBAAgB,QAAQ,oCAAoC;AACrE,SAASC,YAAY,QAAQ,qBAAqB;AAClD,SACEC,0BAA0B,EAC1BC,wBAAwB,EACxBC,uBAAuB,QAClB,iBAAiB;AACxB,SAAuCC,OAAO,QAAQ,cAAc;AA0CpE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA6BC,GACD,OAAO,MAAMC,wBAAUR,WACrB,SAASQ,QAAQC,KAAK,EAAEC,OAAO;IAC7B,MAAM,EACJC,IAAIC,MAAM,EACVC,KAAK,EACLC,OAAO,EACPC,QAAQ,EACRC,MAAM,EACNC,KAAK,EACLC,IAAI,EACJC,OAAO,EACPC,UAAU,EACVC,SAAS,EACTC,MAAM,EACNC,SAAS,EACTC,QAAQ,EACRC,UAAUnB,uBAAuB,EACjCoB,aAAatB,0BAA0B,EACvCuB,SAAS,EACTC,WAAWvB,wBAAwB,EACnCwB,YAAY,IAAI,EAChBC,eAAe,CAACD,SAAS,EACzBE,YAAY,EACZC,eAAeC,iBAAiB,EAChC,GAAGC,WACJ,GAAGzB;IACJ,MAAME,KAAKR,aAAaS,QAAQ;IAEhC,MAAM,EAAEuB,QAAQ,EAAEC,YAAY,EAAEJ,aAAa,EAAE,GAAG9B,iBAAiB;QACjEQ;QACAM;QACAC;QACAC;QACAmB,cAAcvB;QACdW;QACAC;QACAC,WAAWpB,QAAQ;YACjBM;YACAe;YACAD;YACAI;QACF;QACAZ;QACAC;QACAC;QACAC;QACAC;QACAC;QACAK;QACAC;QACAE,eAAeC;IACjB;IAEA,qBACE,KAAChC;QAAOqC,UAAUN;kBACfG,0BACC,KAACI;YAAM,GAAGL,SAAS;YAAG,GAAGE,YAAY;YAAEzB,IAAIA;YAAI6B,MAAK;sBACjDzB;;;AAKX,GACA"}