@react-md/core 1.0.0-next.11 → 1.0.0-next.12

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 (417) hide show
  1. package/.turbo/turbo-build.log +22 -22
  2. package/.turbo/turbo-lint.log +12 -0
  3. package/.turbo/turbo-typecheck.log +1 -1
  4. package/CHANGELOG.md +6 -0
  5. package/dist/CoreProviders.js.map +1 -1
  6. package/dist/NoSsr.js.map +1 -1
  7. package/dist/RootHtml.js.map +1 -1
  8. package/dist/SsrProvider.js.map +1 -1
  9. package/dist/app-bar/AppBar.js.map +1 -1
  10. package/dist/app-bar/AppBarTitle.d.ts +2 -1
  11. package/dist/app-bar/AppBarTitle.js.map +1 -1
  12. package/dist/avatar/Avatar.js.map +1 -1
  13. package/dist/avatar/styles.js.map +1 -1
  14. package/dist/badge/Badge.js.map +1 -1
  15. package/dist/box/Box.js.map +1 -1
  16. package/dist/box/styles.js.map +1 -1
  17. package/dist/button/AsyncButton.js.map +1 -1
  18. package/dist/button/Button.js.map +1 -1
  19. package/dist/button/ButtonUnstyled.js.map +1 -1
  20. package/dist/button/FloatingActionButton.js.map +1 -1
  21. package/dist/button/TooltippedButton.js.map +1 -1
  22. package/dist/button/buttonStyles.js.map +1 -1
  23. package/dist/button/buttonUnstyledStyles.js.map +1 -1
  24. package/dist/card/Card.js.map +1 -1
  25. package/dist/card/CardContent.js.map +1 -1
  26. package/dist/card/CardFooter.js.map +1 -1
  27. package/dist/card/CardHeader.js.map +1 -1
  28. package/dist/card/CardSubtitle.js.map +1 -1
  29. package/dist/card/CardTitle.js.map +1 -1
  30. package/dist/card/ClickableCard.js.map +1 -1
  31. package/dist/card/styles.js.map +1 -1
  32. package/dist/chip/Chip.js.map +1 -1
  33. package/dist/chip/styles.js.map +1 -1
  34. package/dist/cssUtils.js.map +1 -1
  35. package/dist/delegateEvent.js.map +1 -1
  36. package/dist/dialog/Dialog.js.map +1 -1
  37. package/dist/dialog/DialogContainer.js.map +1 -1
  38. package/dist/dialog/DialogContent.js.map +1 -1
  39. package/dist/dialog/DialogFooter.js.map +1 -1
  40. package/dist/dialog/DialogHeader.js.map +1 -1
  41. package/dist/dialog/DialogTitle.d.ts +2 -1
  42. package/dist/dialog/DialogTitle.js.map +1 -1
  43. package/dist/dialog/FixedDialog.js.map +1 -1
  44. package/dist/dialog/NestedDialogProvider.js.map +1 -1
  45. package/dist/dialog/styles.js.map +1 -1
  46. package/dist/divider/Divider.js.map +1 -1
  47. package/dist/divider/styles.js.map +1 -1
  48. package/dist/draggable/useDraggable.js.map +1 -1
  49. package/dist/draggable/utils.js.map +1 -1
  50. package/dist/expansion-panel/ExpansionList.js.map +1 -1
  51. package/dist/expansion-panel/ExpansionPanel.js.map +1 -1
  52. package/dist/expansion-panel/ExpansionPanelHeader.d.ts +2 -1
  53. package/dist/expansion-panel/ExpansionPanelHeader.js +1 -1
  54. package/dist/expansion-panel/ExpansionPanelHeader.js.map +1 -1
  55. package/dist/expansion-panel/useExpansionList.js.map +1 -1
  56. package/dist/expansion-panel/useExpansionPanels.js.map +1 -1
  57. package/dist/focus/useFocusContainer.js.map +1 -1
  58. package/dist/focus/utils.js.map +1 -1
  59. package/dist/form/Checkbox.js.map +1 -1
  60. package/dist/form/Fieldset.js.map +1 -1
  61. package/dist/form/FileInput.js.map +1 -1
  62. package/dist/form/Form.js.map +1 -1
  63. package/dist/form/FormMessage.js.map +1 -1
  64. package/dist/form/FormMessageContainer.js.map +1 -1
  65. package/dist/form/FormMessageCounter.js.map +1 -1
  66. package/dist/form/InputToggle.js.map +1 -1
  67. package/dist/form/InputToggleIcon.js.map +1 -1
  68. package/dist/form/Label.js.map +1 -1
  69. package/dist/form/Legend.js.map +1 -1
  70. package/dist/form/MenuItemCheckbox.js.map +1 -1
  71. package/dist/form/MenuItemFileInput.js.map +1 -1
  72. package/dist/form/MenuItemInputToggle.js.map +1 -1
  73. package/dist/form/MenuItemRadio.js.map +1 -1
  74. package/dist/form/MenuItemSwitch.js.map +1 -1
  75. package/dist/form/MenuItemTextField.js.map +1 -1
  76. package/dist/form/NativeSelect.js.map +1 -1
  77. package/dist/form/OptGroup.js.map +1 -1
  78. package/dist/form/Option.js.map +1 -1
  79. package/dist/form/Password.js.map +1 -1
  80. package/dist/form/Radio.js.map +1 -1
  81. package/dist/form/ResizingTextAreaWrapper.js.map +1 -1
  82. package/dist/form/Select.js.map +1 -1
  83. package/dist/form/SelectedOption.js.map +1 -1
  84. package/dist/form/Slider.js.map +1 -1
  85. package/dist/form/SliderContainer.js.map +1 -1
  86. package/dist/form/SliderMark.js.map +1 -1
  87. package/dist/form/SliderMarkLabel.d.ts +2 -1
  88. package/dist/form/SliderMarkLabel.js.map +1 -1
  89. package/dist/form/SliderThumb.js.map +1 -1
  90. package/dist/form/SliderTrack.js.map +1 -1
  91. package/dist/form/SliderValueMarks.js.map +1 -1
  92. package/dist/form/SliderValueTooltip.js.map +1 -1
  93. package/dist/form/Switch.js.map +1 -1
  94. package/dist/form/SwitchTrack.js.map +1 -1
  95. package/dist/form/TextArea.js.map +1 -1
  96. package/dist/form/TextField.js.map +1 -1
  97. package/dist/form/TextFieldAddon.js.map +1 -1
  98. package/dist/form/TextFieldContainer.js.map +1 -1
  99. package/dist/form/fileUtils.js.map +1 -1
  100. package/dist/form/formConfig.js.map +1 -1
  101. package/dist/form/formMessageStyles.js.map +1 -1
  102. package/dist/form/inputToggleStyles.js.map +1 -1
  103. package/dist/form/menuItemInputToggleStyles.js.map +1 -1
  104. package/dist/form/nativeSelectStyles.js.map +1 -1
  105. package/dist/form/optionStyles.js.map +1 -1
  106. package/dist/form/passwordStyles.js.map +1 -1
  107. package/dist/form/selectStyles.js.map +1 -1
  108. package/dist/form/selectUtils.js.map +1 -1
  109. package/dist/form/sliderUtils.js.map +1 -1
  110. package/dist/form/switchStyles.js.map +1 -1
  111. package/dist/form/textAreaStyles.js.map +1 -1
  112. package/dist/form/textFieldContainerStyles.js.map +1 -1
  113. package/dist/form/textFieldStyles.js.map +1 -1
  114. package/dist/form/types.js.map +1 -1
  115. package/dist/form/useCheckboxGroup.js.map +1 -1
  116. package/dist/form/useCombobox.js.map +1 -1
  117. package/dist/form/useEditableCombobox.js.map +1 -1
  118. package/dist/form/useFileUpload.js.map +1 -1
  119. package/dist/form/useFormReset.js.map +1 -1
  120. package/dist/form/useListboxProvider.js.map +1 -1
  121. package/dist/form/useNumberField.js.map +1 -1
  122. package/dist/form/useRadioGroup.js.map +1 -1
  123. package/dist/form/useRangeSlider.js.map +1 -1
  124. package/dist/form/useResizingTextArea.js.map +1 -1
  125. package/dist/form/useSelectCombobox.js.map +1 -1
  126. package/dist/form/useSlider.js.map +1 -1
  127. package/dist/form/useTextField.js.map +1 -1
  128. package/dist/form/utils.js.map +1 -1
  129. package/dist/form/validation.js.map +1 -1
  130. package/dist/hoverMode/useHoverMode.js.map +1 -1
  131. package/dist/hoverMode/useHoverModeProvider.js.map +1 -1
  132. package/dist/icon/FontIcon.js.map +1 -1
  133. package/dist/icon/IconRotator.js.map +1 -1
  134. package/dist/icon/MaterialIcon.js.map +1 -1
  135. package/dist/icon/MaterialSymbol.js.map +1 -1
  136. package/dist/icon/SVGIcon.js.map +1 -1
  137. package/dist/icon/TextIconSpacing.js.map +1 -1
  138. package/dist/icon/iconConfig.js.map +1 -1
  139. package/dist/icon/material.js.map +1 -1
  140. package/dist/icon/materialConfig.js.map +1 -1
  141. package/dist/icon/styles.js.map +1 -1
  142. package/dist/index.d.ts +3 -1
  143. package/dist/index.js +3 -1
  144. package/dist/index.js.map +1 -1
  145. package/dist/interaction/Ripple.js.map +1 -1
  146. package/dist/interaction/RippleContainer.js.map +1 -1
  147. package/dist/interaction/UserInteractionModeProvider.js.map +1 -1
  148. package/dist/interaction/config.js.map +1 -1
  149. package/dist/interaction/types.js.map +1 -1
  150. package/dist/interaction/useElementInteraction.js.map +1 -1
  151. package/dist/interaction/useHigherContrastChildren.js.map +1 -1
  152. package/dist/interaction/utils.js.map +1 -1
  153. package/dist/layout/LayoutAppBar.js.map +1 -1
  154. package/dist/layout/LayoutNav.js.map +1 -1
  155. package/dist/layout/LayoutWindowSplitter.js.map +1 -1
  156. package/dist/layout/Main.js.map +1 -1
  157. package/dist/layout/layoutNavStyles.js.map +1 -1
  158. package/dist/layout/layoutWindowSplitterStyles.js.map +1 -1
  159. package/dist/layout/mainStyles.js.map +1 -1
  160. package/dist/layout/useExpandableLayout.js.map +1 -1
  161. package/dist/layout/useHorizontalLayoutTransition.js.map +1 -1
  162. package/dist/layout/useLayoutAppBarHeight.js.map +1 -1
  163. package/dist/layout/useLayoutTree.js.map +1 -1
  164. package/dist/layout/useLayoutWindowSplitter.js.map +1 -1
  165. package/dist/layout/useMainTabIndex.js.map +1 -1
  166. package/dist/layout/useResizableLayout.js.map +1 -1
  167. package/dist/layout/useTemporaryLayout.js.map +1 -1
  168. package/dist/link/Link.js.map +1 -1
  169. package/dist/link/SkipToMainContent.js.map +1 -1
  170. package/dist/link/styles.js.map +1 -1
  171. package/dist/list/List.js.map +1 -1
  172. package/dist/list/ListItem.js.map +1 -1
  173. package/dist/list/ListItemAddon.js.map +1 -1
  174. package/dist/list/ListItemChildren.js.map +1 -1
  175. package/dist/list/ListItemLink.js.map +1 -1
  176. package/dist/list/ListItemText.js.map +1 -1
  177. package/dist/list/ListSubheader.js.map +1 -1
  178. package/dist/list/getListItemHeight.js.map +1 -1
  179. package/dist/list/listItemStyles.js.map +1 -1
  180. package/dist/list/types.js.map +1 -1
  181. package/dist/media-queries/AppSizeProvider.js.map +1 -1
  182. package/dist/media-queries/appSize.js.map +1 -1
  183. package/dist/media-queries/useMediaQuery.js.map +1 -1
  184. package/dist/menu/DropdownMenu.js.map +1 -1
  185. package/dist/menu/Menu.js.map +1 -1
  186. package/dist/menu/MenuBar.js.map +1 -1
  187. package/dist/menu/MenuButton.js.map +1 -1
  188. package/dist/menu/MenuConfigurationProvider.js.map +1 -1
  189. package/dist/menu/MenuItem.js.map +1 -1
  190. package/dist/menu/MenuItemButton.js.map +1 -1
  191. package/dist/menu/MenuItemCircularProgress.js.map +1 -1
  192. package/dist/menu/MenuItemGroup.js.map +1 -1
  193. package/dist/menu/MenuItemSeparator.js.map +1 -1
  194. package/dist/menu/MenuSheet.js.map +1 -1
  195. package/dist/menu/MenuVisibilityProvider.js.map +1 -1
  196. package/dist/menu/MenuWidget.js.map +1 -1
  197. package/dist/menu/MenuWidgetKeyboardProvider.js.map +1 -1
  198. package/dist/menu/useContextMenu.js.map +1 -1
  199. package/dist/menu/useMenuBarProvider.js.map +1 -1
  200. package/dist/menu/utils.js.map +1 -1
  201. package/dist/movement/constants.js.map +1 -1
  202. package/dist/movement/findMatchIndex.js.map +1 -1
  203. package/dist/movement/types.js.map +1 -1
  204. package/dist/movement/useKeyboardMovementProvider.js.map +1 -1
  205. package/dist/movement/utils.js.map +1 -1
  206. package/dist/overlay/Overlay.js.map +1 -1
  207. package/dist/overlay/overlayStyles.js.map +1 -1
  208. package/dist/portal/Portal.js.map +1 -1
  209. package/dist/portal/PortalContainerProvider.js.map +1 -1
  210. package/dist/positioning/constants.js.map +1 -1
  211. package/dist/positioning/createHorizontalPosition.js.map +1 -1
  212. package/dist/positioning/createVerticalPosition.js.map +1 -1
  213. package/dist/positioning/getFixedPosition.js.map +1 -1
  214. package/dist/positioning/types.js.map +1 -1
  215. package/dist/positioning/useFixedPositioning.js.map +1 -1
  216. package/dist/positioning/utils.js.map +1 -1
  217. package/dist/progress/CircularProgress.js.map +1 -1
  218. package/dist/progress/LinearProgress.js.map +1 -1
  219. package/dist/progress/getProgressA11y.js.map +1 -1
  220. package/dist/progress/types.js.map +1 -1
  221. package/dist/responsive-item/ResponsiveItemContainer.js.map +1 -1
  222. package/dist/responsive-item/ResponsiveItemOverlay.js.map +1 -1
  223. package/dist/responsive-item/styles.js.map +1 -1
  224. package/dist/scroll/ScrollLock.js.map +1 -1
  225. package/dist/scroll/getScrollbarWidth.js.map +1 -1
  226. package/dist/scroll/useScrollLock.js.map +1 -1
  227. package/dist/searching/caseInsensitive.js.map +1 -1
  228. package/dist/searching/fuzzy.js.map +1 -1
  229. package/dist/searching/toSearchQuery.js.map +1 -1
  230. package/dist/searching/types.js.map +1 -1
  231. package/dist/searching/useFuzzyMatch.js.map +1 -1
  232. package/dist/searching/utils.js.map +1 -1
  233. package/dist/segmented-button/SegmentedButton.js.map +1 -1
  234. package/dist/segmented-button/SegmentedButtonContainer.js.map +1 -1
  235. package/dist/segmented-button/segmentedButtonContainerStyles.js.map +1 -1
  236. package/dist/segmented-button/segmentedButtonStyles.js.map +1 -1
  237. package/dist/sheet/Sheet.js.map +1 -1
  238. package/dist/sheet/styles.js.map +1 -1
  239. package/dist/snackbar/DefaultToastRenderer.js.map +1 -1
  240. package/dist/snackbar/Snackbar.js.map +1 -1
  241. package/dist/snackbar/Toast.js.map +1 -1
  242. package/dist/snackbar/ToastActionButton.js.map +1 -1
  243. package/dist/snackbar/ToastCloseButton.js.map +1 -1
  244. package/dist/snackbar/ToastContent.js.map +1 -1
  245. package/dist/snackbar/ToastManager.js.map +1 -1
  246. package/dist/snackbar/ToastManagerProvider.js.map +1 -1
  247. package/dist/snackbar/snackbarStyles.js.map +1 -1
  248. package/dist/snackbar/toastContentStyles.js.map +1 -1
  249. package/dist/snackbar/toastStyles.js.map +1 -1
  250. package/dist/snackbar/useCurrentToastActions.js.map +1 -1
  251. package/dist/suspense/CircularProgressSuspense.js.map +1 -1
  252. package/dist/suspense/NullSuspense.js.map +1 -1
  253. package/dist/table/Table.js.map +1 -1
  254. package/dist/table/TableBody.js.map +1 -1
  255. package/dist/table/TableCell.js.map +1 -1
  256. package/dist/table/TableCellContent.js.map +1 -1
  257. package/dist/table/TableCheckbox.js.map +1 -1
  258. package/dist/table/TableConfigurationProvider.js.map +1 -1
  259. package/dist/table/TableContainer.js.map +1 -1
  260. package/dist/table/TableContainerProvider.js.map +1 -1
  261. package/dist/table/TableFooter.js.map +1 -1
  262. package/dist/table/TableHeader.js.map +1 -1
  263. package/dist/table/TableRadio.js.map +1 -1
  264. package/dist/table/TableRow.js.map +1 -1
  265. package/dist/table/tableCellStyles.js.map +1 -1
  266. package/dist/table/tableContainerStyles.js.map +1 -1
  267. package/dist/table/tableFooterStyles.js.map +1 -1
  268. package/dist/table/tableHeaderStyles.js.map +1 -1
  269. package/dist/table/tableRowStyles.js.map +1 -1
  270. package/dist/table/tableStyles.js.map +1 -1
  271. package/dist/table/types.js.map +1 -1
  272. package/dist/tabs/Tab.js.map +1 -1
  273. package/dist/tabs/TabList.js.map +1 -1
  274. package/dist/tabs/TabListScrollButton.js.map +1 -1
  275. package/dist/tabs/tabIndicatorStyles.js.map +1 -1
  276. package/dist/tabs/tabListScrollButtonStyles.js.map +1 -1
  277. package/dist/tabs/tabListStyles.js.map +1 -1
  278. package/dist/tabs/tabStyles.js.map +1 -1
  279. package/dist/tabs/useTabList.js.map +1 -1
  280. package/dist/tabs/useTabs.js.map +1 -1
  281. package/dist/tabs/utils.js.map +1 -1
  282. package/dist/test-utils/IntersectionObserver.js.map +1 -1
  283. package/dist/test-utils/ResizeObserver.js.map +1 -1
  284. package/dist/test-utils/data-testid.js.map +1 -1
  285. package/dist/test-utils/index.js.map +1 -1
  286. package/dist/test-utils/jest-setup.js.map +1 -1
  287. package/dist/test-utils/matchMedia.js.map +1 -1
  288. package/dist/test-utils/polyfills/IntersectionObserver.js.map +1 -1
  289. package/dist/test-utils/polyfills/ResizeObserver.js.map +1 -1
  290. package/dist/test-utils/polyfills/TextDecoder.js.map +1 -1
  291. package/dist/test-utils/polyfills/TextEncoder.js.map +1 -1
  292. package/dist/test-utils/polyfills/index.js.map +1 -1
  293. package/dist/test-utils/polyfills/matchMedia.js.map +1 -1
  294. package/dist/test-utils/polyfills/offsetParent.js.map +1 -1
  295. package/dist/test-utils/polyfills/scrollIntoView.js.map +1 -1
  296. package/dist/test-utils/render.js.map +1 -1
  297. package/dist/test-utils/timers.js.map +1 -1
  298. package/dist/theme/LocalStorageColorSchemeProvider.js.map +1 -1
  299. package/dist/theme/ThemeProvider.js.map +1 -1
  300. package/dist/theme/colors.js.map +1 -1
  301. package/dist/theme/cssVars.js.map +1 -1
  302. package/dist/theme/types.js.map +1 -1
  303. package/dist/theme/useCSSVariables.js.map +1 -1
  304. package/dist/theme/useColorScheme.js.map +1 -1
  305. package/dist/theme/useColorSchemeMetaTag.js.map +1 -1
  306. package/dist/theme/useColorSchemeProvider.js.map +1 -1
  307. package/dist/theme/usePrefersColorScheme.js.map +1 -1
  308. package/dist/theme/utils.js.map +1 -1
  309. package/dist/tooltip/Tooltip.js.map +1 -1
  310. package/dist/tooltip/TooltipHoverModeProvider.js.map +1 -1
  311. package/dist/tooltip/constants.js.map +1 -1
  312. package/dist/tooltip/tooltipStyles.js.map +1 -1
  313. package/dist/tooltip/useTooltip.js.map +1 -1
  314. package/dist/tooltip/useTooltipPosition.js.map +1 -1
  315. package/dist/tooltip/utils.js.map +1 -1
  316. package/dist/transition/CSSTransition.js.map +1 -1
  317. package/dist/transition/Collapse.js.map +1 -1
  318. package/dist/transition/CrossFade.js.map +1 -1
  319. package/dist/transition/ScaleTransition.js.map +1 -1
  320. package/dist/transition/SkeletonPlaceholder.js.map +1 -1
  321. package/dist/transition/Slide.js.map +1 -1
  322. package/dist/transition/SlideContainer.js.map +1 -1
  323. package/dist/transition/collapseStyles.js.map +1 -1
  324. package/dist/transition/config.js.map +1 -1
  325. package/dist/transition/maxWidthTransition.js.map +1 -1
  326. package/dist/transition/skeletonPlaceholderUtils.js.map +1 -1
  327. package/dist/transition/types.js.map +1 -1
  328. package/dist/transition/useCSSTransition.js.map +1 -1
  329. package/dist/transition/useCarousel.js.map +1 -1
  330. package/dist/transition/useCollapseTransition.js.map +1 -1
  331. package/dist/transition/useCrossFadeTransition.js.map +1 -1
  332. package/dist/transition/useMaxWidthTransition.js.map +1 -1
  333. package/dist/transition/useScaleTransition.js.map +1 -1
  334. package/dist/transition/useSkeletonPlaceholder.js.map +1 -1
  335. package/dist/transition/useSlideTransition.js.map +1 -1
  336. package/dist/transition/useTransition.js.map +1 -1
  337. package/dist/transition/utils.js.map +1 -1
  338. package/dist/tree/DefaultTreeItemRenderer.js.map +1 -1
  339. package/dist/tree/Tree.js.map +1 -1
  340. package/dist/tree/TreeGroup.js.map +1 -1
  341. package/dist/tree/TreeItem.js.map +1 -1
  342. package/dist/tree/TreeItemExpander.js.map +1 -1
  343. package/dist/tree/TreeProvider.js.map +1 -1
  344. package/dist/tree/styles.js.map +1 -1
  345. package/dist/tree/types.js.map +1 -1
  346. package/dist/tree/useTree.js.map +1 -1
  347. package/dist/tree/useTreeExpansion.js.map +1 -1
  348. package/dist/tree/useTreeItems.js.map +1 -1
  349. package/dist/tree/useTreeMovement.js.map +1 -1
  350. package/dist/tree/useTreeSelection.js.map +1 -1
  351. package/dist/tree/utils.js.map +1 -1
  352. package/dist/types.js.map +1 -1
  353. package/dist/typography/SrOnly.js.map +1 -1
  354. package/dist/typography/TextContainer.d.ts +1 -40
  355. package/dist/typography/TextContainer.js +1 -30
  356. package/dist/typography/TextContainer.js.map +1 -1
  357. package/dist/typography/Typography.d.ts +1 -112
  358. package/dist/typography/Typography.js +1 -89
  359. package/dist/typography/Typography.js.map +1 -1
  360. package/dist/typography/WritingDirectionProvider.js.map +1 -1
  361. package/dist/typography/textContainerStyles.d.ts +40 -0
  362. package/dist/typography/textContainerStyles.js +32 -0
  363. package/dist/typography/textContainerStyles.js.map +1 -0
  364. package/dist/typography/typographyStyles.d.ts +112 -0
  365. package/dist/typography/typographyStyles.js +91 -0
  366. package/dist/typography/typographyStyles.js.map +1 -0
  367. package/dist/useAsyncAction.js.map +1 -1
  368. package/dist/useDebouncedFunction.js.map +1 -1
  369. package/dist/useDropzone.js.map +1 -1
  370. package/dist/useElementSize.js.map +1 -1
  371. package/dist/useEnsuredId.js.map +1 -1
  372. package/dist/useEnsuredRef.js.map +1 -1
  373. package/dist/useEnsuredState.js.map +1 -1
  374. package/dist/useHtmlClassName.js.map +1 -1
  375. package/dist/useIntersectionObserver.js.map +1 -1
  376. package/dist/useIsomorphicLayoutEffect.js.map +1 -1
  377. package/dist/useLocalStorage.js.map +1 -1
  378. package/dist/useOrientation.js.map +1 -1
  379. package/dist/usePageInactive.js.map +1 -1
  380. package/dist/useResizeListener.js.map +1 -1
  381. package/dist/useResizeObserver.js.map +1 -1
  382. package/dist/useThrottledFunction.js.map +1 -1
  383. package/dist/useToggle.js.map +1 -1
  384. package/dist/useUnmounted.js.map +1 -1
  385. package/dist/useWindowSize.js.map +1 -1
  386. package/dist/utils/RenderRecursively.js.map +1 -1
  387. package/dist/utils/alphaNumericSort.js.map +1 -1
  388. package/dist/utils/applyRef.js.map +1 -1
  389. package/dist/utils/bem.js.map +1 -1
  390. package/dist/utils/getClientPosition.js.map +1 -1
  391. package/dist/utils/getMiddleOfRange.js.map +1 -1
  392. package/dist/utils/getPercentage.js.map +1 -1
  393. package/dist/utils/getRangeDefaultValue.js.map +1 -1
  394. package/dist/utils/getRangeSteps.js.map +1 -1
  395. package/dist/utils/identity.js.map +1 -1
  396. package/dist/utils/isElementVisible.js.map +1 -1
  397. package/dist/utils/loop.js.map +1 -1
  398. package/dist/utils/nearest.js.map +1 -1
  399. package/dist/utils/parseCssLengthUnit.js.map +1 -1
  400. package/dist/utils/randomInt.js.map +1 -1
  401. package/dist/utils/wait.js.map +1 -1
  402. package/dist/utils/withinRange.js.map +1 -1
  403. package/dist/window-splitter/WindowSplitter.js.map +1 -1
  404. package/dist/window-splitter/useWindowSplitter.js.map +1 -1
  405. package/package.json +11 -350
  406. package/src/app-bar/AppBarTitle.tsx +2 -5
  407. package/src/dialog/DialogTitle.tsx +1 -1
  408. package/src/expansion-panel/ExpansionPanelHeader.tsx +3 -6
  409. package/src/form/SliderMarkLabel.tsx +1 -1
  410. package/src/index.ts +3 -1
  411. package/src/typography/TextContainer.tsx +4 -53
  412. package/src/typography/Typography.tsx +5 -145
  413. package/src/typography/__tests__/TextContainer.tsx +2 -1
  414. package/src/typography/__tests__/Typography.tsx +2 -1
  415. package/src/typography/textContainerStyles.ts +53 -0
  416. package/src/typography/typographyStyles.ts +145 -0
  417. package/tsconfig.types.json +1 -1
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/table/TableRow.tsx"],"sourcesContent":["\"use client\";\nimport { forwardRef, type HTMLAttributes } from \"react\";\nimport {\n useTableConfig,\n type TableRowConfiguration,\n} from \"./TableConfigurationProvider.js\";\nimport { tableRow } from \"./tableRowStyles.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 */\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;;AACA,SAASA,UAAU,QAA6B,QAAQ;AACxD,SACEC,cAAc,QAET,kCAAkC;AACzC,SAASC,QAAQ,QAAQ,sBAAsB;AAsB/C;;;;;CAKC,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\";\nimport { forwardRef, type HTMLAttributes } from \"react\";\nimport {\n useTableConfig,\n type TableRowConfiguration,\n} from \"./TableConfigurationProvider.js\";\nimport { tableRow } from \"./tableRowStyles.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 */\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"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;AACA,SAASA,UAAU,QAA6B,QAAQ;AACxD,SACEC,cAAc,QAET,kCAAkC;AACzC,SAASC,QAAQ,QAAQ,sBAAsB;AAsB/C;;;;;CAKC,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/tableCellStyles.ts"],"sourcesContent":["import { cnb } from \"cnbuilder\";\nimport { cssUtils } from \"../cssUtils.js\";\nimport {\n type TableCellHorizontalAlignment,\n type TableCellVerticalAlignment,\n} from \"./TableConfigurationProvider.js\";\n\n/** @remarks \\@since 6.0.0 */\nexport interface TableCellClassNameOptions {\n className?: string;\n\n /**\n * Set this to `true` if the cell is rendered as a `<th>` so that the correct\n * sticky styles can be applied.\n */\n header: boolean;\n\n /**\n * Set this to true if the cell is rendered in a `<thead>` so that the correct\n * sticky styles can be applied.\n */\n isInTableHeader: boolean;\n\n /** @defaultValue `false` */\n grow?: boolean;\n\n /** @defaultValue `false` */\n sticky?: boolean;\n\n /** @defaultValue `false` */\n inputToggle?: boolean;\n\n hAlign?: TableCellHorizontalAlignment;\n vAlign?: TableCellVerticalAlignment;\n\n /** @defaultValue `true` */\n lineWrap?: boolean;\n\n /**\n * @defaultValue `\"horizontal\"`\n */\n padding?: \"horizontal\" | \"vertical\" | \"none\";\n}\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport function tableCell(options: TableCellClassNameOptions): string {\n const {\n grow,\n sticky,\n header,\n inputToggle,\n hAlign,\n vAlign,\n lineWrap = true,\n padding = \"horizontal\",\n isInTableHeader,\n className,\n } = options;\n\n // using `&&` instead of `bem` since the latest version of typescript does not\n // support setting the same object key (empty string)\n const p = \"rmd-table-cell--\";\n return cnb(\n \"rmd-table-cell\",\n grow && `${p}grow`,\n header && `${p}header`,\n sticky && `${p}sticky`,\n inputToggle && `${p}input-toggle`,\n sticky && (!isInTableHeader || inputToggle) && `${p}sticky-cell`,\n sticky && isInTableHeader && `${p}sticky-header`,\n sticky && isInTableHeader && inputToggle && `${p}header-cell`,\n vAlign && vAlign !== \"middle\" && `${p}${vAlign}`,\n !lineWrap && `${p}no-wrap`,\n padding === \"vertical\" && `${p}v-padding`,\n padding === \"none\" && `${p}no-padding`,\n cssUtils({\n textAlign: hAlign,\n }),\n className\n );\n}\n"],"names":["cnb","cssUtils","tableCell","options","grow","sticky","header","inputToggle","hAlign","vAlign","lineWrap","padding","isInTableHeader","className","p","textAlign"],"mappings":"AAAA,SAASA,GAAG,QAAQ,YAAY;AAChC,SAASC,QAAQ,QAAQ,iBAAiB;AA2C1C;;CAEC,GACD,OAAO,SAASC,UAAUC,OAAkC;IAC1D,MAAM,EACJC,IAAI,EACJC,MAAM,EACNC,MAAM,EACNC,WAAW,EACXC,MAAM,EACNC,MAAM,EACNC,WAAW,IAAI,EACfC,UAAU,YAAY,EACtBC,eAAe,EACfC,SAAS,EACV,GAAGV;IAEJ,8EAA8E;IAC9E,qDAAqD;IACrD,MAAMW,IAAI;IACV,OAAOd,IACL,kBACAI,QAAQ,CAAC,EAAEU,EAAE,IAAI,CAAC,EAClBR,UAAU,CAAC,EAAEQ,EAAE,MAAM,CAAC,EACtBT,UAAU,CAAC,EAAES,EAAE,MAAM,CAAC,EACtBP,eAAe,CAAC,EAAEO,EAAE,YAAY,CAAC,EACjCT,UAAW,CAAA,CAACO,mBAAmBL,WAAU,KAAM,CAAC,EAAEO,EAAE,WAAW,CAAC,EAChET,UAAUO,mBAAmB,CAAC,EAAEE,EAAE,aAAa,CAAC,EAChDT,UAAUO,mBAAmBL,eAAe,CAAC,EAAEO,EAAE,WAAW,CAAC,EAC7DL,UAAUA,WAAW,YAAY,CAAC,EAAEK,EAAE,EAAEL,OAAO,CAAC,EAChD,CAACC,YAAY,CAAC,EAAEI,EAAE,OAAO,CAAC,EAC1BH,YAAY,cAAc,CAAC,EAAEG,EAAE,SAAS,CAAC,EACzCH,YAAY,UAAU,CAAC,EAAEG,EAAE,UAAU,CAAC,EACtCb,SAAS;QACPc,WAAWP;IACb,IACAK;AAEJ"}
1
+ {"version":3,"sources":["../../src/table/tableCellStyles.ts"],"sourcesContent":["import { cnb } from \"cnbuilder\";\nimport { cssUtils } from \"../cssUtils.js\";\nimport {\n type TableCellHorizontalAlignment,\n type TableCellVerticalAlignment,\n} from \"./TableConfigurationProvider.js\";\n\n/** @remarks \\@since 6.0.0 */\nexport interface TableCellClassNameOptions {\n className?: string;\n\n /**\n * Set this to `true` if the cell is rendered as a `<th>` so that the correct\n * sticky styles can be applied.\n */\n header: boolean;\n\n /**\n * Set this to true if the cell is rendered in a `<thead>` so that the correct\n * sticky styles can be applied.\n */\n isInTableHeader: boolean;\n\n /** @defaultValue `false` */\n grow?: boolean;\n\n /** @defaultValue `false` */\n sticky?: boolean;\n\n /** @defaultValue `false` */\n inputToggle?: boolean;\n\n hAlign?: TableCellHorizontalAlignment;\n vAlign?: TableCellVerticalAlignment;\n\n /** @defaultValue `true` */\n lineWrap?: boolean;\n\n /**\n * @defaultValue `\"horizontal\"`\n */\n padding?: \"horizontal\" | \"vertical\" | \"none\";\n}\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport function tableCell(options: TableCellClassNameOptions): string {\n const {\n grow,\n sticky,\n header,\n inputToggle,\n hAlign,\n vAlign,\n lineWrap = true,\n padding = \"horizontal\",\n isInTableHeader,\n className,\n } = options;\n\n // using `&&` instead of `bem` since the latest version of typescript does not\n // support setting the same object key (empty string)\n const p = \"rmd-table-cell--\";\n return cnb(\n \"rmd-table-cell\",\n grow && `${p}grow`,\n header && `${p}header`,\n sticky && `${p}sticky`,\n inputToggle && `${p}input-toggle`,\n sticky && (!isInTableHeader || inputToggle) && `${p}sticky-cell`,\n sticky && isInTableHeader && `${p}sticky-header`,\n sticky && isInTableHeader && inputToggle && `${p}header-cell`,\n vAlign && vAlign !== \"middle\" && `${p}${vAlign}`,\n !lineWrap && `${p}no-wrap`,\n padding === \"vertical\" && `${p}v-padding`,\n padding === \"none\" && `${p}no-padding`,\n cssUtils({\n textAlign: hAlign,\n }),\n className\n );\n}\n"],"names":["cnb","cssUtils","tableCell","options","grow","sticky","header","inputToggle","hAlign","vAlign","lineWrap","padding","isInTableHeader","className","p","textAlign"],"rangeMappings":";;;;;;;;;;;;","mappings":"AAAA,SAASA,GAAG,QAAQ,YAAY;AAChC,SAASC,QAAQ,QAAQ,iBAAiB;AA2C1C;;CAEC,GACD,OAAO,SAASC,UAAUC,OAAkC;IAC1D,MAAM,EACJC,IAAI,EACJC,MAAM,EACNC,MAAM,EACNC,WAAW,EACXC,MAAM,EACNC,MAAM,EACNC,WAAW,IAAI,EACfC,UAAU,YAAY,EACtBC,eAAe,EACfC,SAAS,EACV,GAAGV;IAEJ,8EAA8E;IAC9E,qDAAqD;IACrD,MAAMW,IAAI;IACV,OAAOd,IACL,kBACAI,QAAQ,CAAC,EAAEU,EAAE,IAAI,CAAC,EAClBR,UAAU,CAAC,EAAEQ,EAAE,MAAM,CAAC,EACtBT,UAAU,CAAC,EAAES,EAAE,MAAM,CAAC,EACtBP,eAAe,CAAC,EAAEO,EAAE,YAAY,CAAC,EACjCT,UAAW,CAAA,CAACO,mBAAmBL,WAAU,KAAM,CAAC,EAAEO,EAAE,WAAW,CAAC,EAChET,UAAUO,mBAAmB,CAAC,EAAEE,EAAE,aAAa,CAAC,EAChDT,UAAUO,mBAAmBL,eAAe,CAAC,EAAEO,EAAE,WAAW,CAAC,EAC7DL,UAAUA,WAAW,YAAY,CAAC,EAAEK,EAAE,EAAEL,OAAO,CAAC,EAChD,CAACC,YAAY,CAAC,EAAEI,EAAE,OAAO,CAAC,EAC1BH,YAAY,cAAc,CAAC,EAAEG,EAAE,SAAS,CAAC,EACzCH,YAAY,UAAU,CAAC,EAAEG,EAAE,UAAU,CAAC,EACtCb,SAAS;QACPc,WAAWP;IACb,IACAK;AAEJ"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/table/tableContainerStyles.ts"],"sourcesContent":["import { cnb } from \"cnbuilder\";\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface TableContainerClassNameOptions {\n className?: string;\n}\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport function tableContainer(\n options: TableContainerClassNameOptions = {}\n): string {\n const { className } = options;\n\n return cnb(\"rmd-table-container\", className);\n}\n"],"names":["cnb","tableContainer","options","className"],"mappings":"AAAA,SAASA,GAAG,QAAQ,YAAY;AAShC;;CAEC,GACD,OAAO,SAASC,eACdC,UAA0C,CAAC,CAAC;IAE5C,MAAM,EAAEC,SAAS,EAAE,GAAGD;IAEtB,OAAOF,IAAI,uBAAuBG;AACpC"}
1
+ {"version":3,"sources":["../../src/table/tableContainerStyles.ts"],"sourcesContent":["import { cnb } from \"cnbuilder\";\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface TableContainerClassNameOptions {\n className?: string;\n}\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport function tableContainer(\n options: TableContainerClassNameOptions = {}\n): string {\n const { className } = options;\n\n return cnb(\"rmd-table-container\", className);\n}\n"],"names":["cnb","tableContainer","options","className"],"rangeMappings":";;;;;;","mappings":"AAAA,SAASA,GAAG,QAAQ,YAAY;AAShC;;CAEC,GACD,OAAO,SAASC,eACdC,UAA0C,CAAC,CAAC;IAE5C,MAAM,EAAEC,SAAS,EAAE,GAAGD;IAEtB,OAAOF,IAAI,uBAAuBG;AACpC"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/table/tableFooterStyles.ts"],"sourcesContent":["import { cnb } from \"cnbuilder\";\nimport { bem } from \"../utils/bem.js\";\n\nconst styles = bem(\"rmd-tfoot\");\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface TableFooterClassNameOptions {\n className?: string;\n sticky?: boolean;\n stickyActive?: boolean;\n stickyActiveClassName?: string;\n}\n\nexport function tableFooter(options: TableFooterClassNameOptions = {}): string {\n const { className, sticky, stickyActive, stickyActiveClassName } = options;\n\n return cnb(\n styles({\n sticky,\n \"sticky-active\": stickyActive,\n }),\n stickyActive && stickyActiveClassName,\n className\n );\n}\n"],"names":["cnb","bem","styles","tableFooter","options","className","sticky","stickyActive","stickyActiveClassName"],"mappings":"AAAA,SAASA,GAAG,QAAQ,YAAY;AAChC,SAASC,GAAG,QAAQ,kBAAkB;AAEtC,MAAMC,SAASD,IAAI;AAYnB,OAAO,SAASE,YAAYC,UAAuC,CAAC,CAAC;IACnE,MAAM,EAAEC,SAAS,EAAEC,MAAM,EAAEC,YAAY,EAAEC,qBAAqB,EAAE,GAAGJ;IAEnE,OAAOJ,IACLE,OAAO;QACLI;QACA,iBAAiBC;IACnB,IACAA,gBAAgBC,uBAChBH;AAEJ"}
1
+ {"version":3,"sources":["../../src/table/tableFooterStyles.ts"],"sourcesContent":["import { cnb } from \"cnbuilder\";\nimport { bem } from \"../utils/bem.js\";\n\nconst styles = bem(\"rmd-tfoot\");\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface TableFooterClassNameOptions {\n className?: string;\n sticky?: boolean;\n stickyActive?: boolean;\n stickyActiveClassName?: string;\n}\n\nexport function tableFooter(options: TableFooterClassNameOptions = {}): string {\n const { className, sticky, stickyActive, stickyActiveClassName } = options;\n\n return cnb(\n styles({\n sticky,\n \"sticky-active\": stickyActive,\n }),\n stickyActive && stickyActiveClassName,\n className\n );\n}\n"],"names":["cnb","bem","styles","tableFooter","options","className","sticky","stickyActive","stickyActiveClassName"],"rangeMappings":";;;;;;;;;","mappings":"AAAA,SAASA,GAAG,QAAQ,YAAY;AAChC,SAASC,GAAG,QAAQ,kBAAkB;AAEtC,MAAMC,SAASD,IAAI;AAYnB,OAAO,SAASE,YAAYC,UAAuC,CAAC,CAAC;IACnE,MAAM,EAAEC,SAAS,EAAEC,MAAM,EAAEC,YAAY,EAAEC,qBAAqB,EAAE,GAAGJ;IAEnE,OAAOJ,IACLE,OAAO;QACLI;QACA,iBAAiBC;IACnB,IACAA,gBAAgBC,uBAChBH;AAEJ"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/table/tableHeaderStyles.ts"],"sourcesContent":["import { cnb } from \"cnbuilder\";\nimport { bem } from \"../utils/bem.js\";\n\nconst styles = bem(\"rmd-thead\");\n\n/** @remarks \\@since 6.0.0 */\nexport interface TableHeaderClassNameOptions {\n className?: string;\n dense?: boolean;\n sticky?: boolean;\n stickyActive?: boolean;\n stickyActiveClassName?: string;\n}\n\n/** @remarks \\@since 6.0.0 */\nexport function tableHeader(options: TableHeaderClassNameOptions = {}): string {\n const { dense, sticky, stickyActive, stickyActiveClassName, className } =\n options;\n\n return cnb(\n styles({\n dense,\n sticky,\n \"sticky-active\": stickyActive,\n }),\n stickyActive && stickyActiveClassName,\n className\n );\n}\n"],"names":["cnb","bem","styles","tableHeader","options","dense","sticky","stickyActive","stickyActiveClassName","className"],"mappings":"AAAA,SAASA,GAAG,QAAQ,YAAY;AAChC,SAASC,GAAG,QAAQ,kBAAkB;AAEtC,MAAMC,SAASD,IAAI;AAWnB,2BAA2B,GAC3B,OAAO,SAASE,YAAYC,UAAuC,CAAC,CAAC;IACnE,MAAM,EAAEC,KAAK,EAAEC,MAAM,EAAEC,YAAY,EAAEC,qBAAqB,EAAEC,SAAS,EAAE,GACrEL;IAEF,OAAOJ,IACLE,OAAO;QACLG;QACAC;QACA,iBAAiBC;IACnB,IACAA,gBAAgBC,uBAChBC;AAEJ"}
1
+ {"version":3,"sources":["../../src/table/tableHeaderStyles.ts"],"sourcesContent":["import { cnb } from \"cnbuilder\";\nimport { bem } from \"../utils/bem.js\";\n\nconst styles = bem(\"rmd-thead\");\n\n/** @remarks \\@since 6.0.0 */\nexport interface TableHeaderClassNameOptions {\n className?: string;\n dense?: boolean;\n sticky?: boolean;\n stickyActive?: boolean;\n stickyActiveClassName?: string;\n}\n\n/** @remarks \\@since 6.0.0 */\nexport function tableHeader(options: TableHeaderClassNameOptions = {}): string {\n const { dense, sticky, stickyActive, stickyActiveClassName, className } =\n options;\n\n return cnb(\n styles({\n dense,\n sticky,\n \"sticky-active\": stickyActive,\n }),\n stickyActive && stickyActiveClassName,\n className\n );\n}\n"],"names":["cnb","bem","styles","tableHeader","options","dense","sticky","stickyActive","stickyActiveClassName","className"],"rangeMappings":";;;;;;;;;;","mappings":"AAAA,SAASA,GAAG,QAAQ,YAAY;AAChC,SAASC,GAAG,QAAQ,kBAAkB;AAEtC,MAAMC,SAASD,IAAI;AAWnB,2BAA2B,GAC3B,OAAO,SAASE,YAAYC,UAAuC,CAAC,CAAC;IACnE,MAAM,EAAEC,KAAK,EAAEC,MAAM,EAAEC,YAAY,EAAEC,qBAAqB,EAAEC,SAAS,EAAE,GACrEL;IAEF,OAAOJ,IACLE,OAAO;QACLG;QACAC;QACA,iBAAiBC;IACnB,IACAA,gBAAgBC,uBAChBC;AAEJ"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/table/tableRowStyles.ts"],"sourcesContent":["import { cnb } from \"cnbuilder\";\nimport { bem } from \"../utils/bem.js\";\n\nconst styles = bem(\"rmd-tr\");\n\n/** @remarks \\@since 6.0.0 */\nexport interface TableRowClassNameOptions {\n className?: string;\n disableHover?: boolean;\n disableBorders?: boolean;\n selected?: boolean;\n clickable?: boolean;\n}\n\n/** @remarks \\@since 6.0.0 */\nexport function tableRow(options: TableRowClassNameOptions = {}): string {\n const { disableHover, disableBorders, selected, clickable, className } =\n options;\n return cnb(\n styles({\n bordered: !disableBorders,\n hoverable: !disableHover,\n clickable,\n selected,\n }),\n className\n );\n}\n"],"names":["cnb","bem","styles","tableRow","options","disableHover","disableBorders","selected","clickable","className","bordered","hoverable"],"mappings":"AAAA,SAASA,GAAG,QAAQ,YAAY;AAChC,SAASC,GAAG,QAAQ,kBAAkB;AAEtC,MAAMC,SAASD,IAAI;AAWnB,2BAA2B,GAC3B,OAAO,SAASE,SAASC,UAAoC,CAAC,CAAC;IAC7D,MAAM,EAAEC,YAAY,EAAEC,cAAc,EAAEC,QAAQ,EAAEC,SAAS,EAAEC,SAAS,EAAE,GACpEL;IACF,OAAOJ,IACLE,OAAO;QACLQ,UAAU,CAACJ;QACXK,WAAW,CAACN;QACZG;QACAD;IACF,IACAE;AAEJ"}
1
+ {"version":3,"sources":["../../src/table/tableRowStyles.ts"],"sourcesContent":["import { cnb } from \"cnbuilder\";\nimport { bem } from \"../utils/bem.js\";\n\nconst styles = bem(\"rmd-tr\");\n\n/** @remarks \\@since 6.0.0 */\nexport interface TableRowClassNameOptions {\n className?: string;\n disableHover?: boolean;\n disableBorders?: boolean;\n selected?: boolean;\n clickable?: boolean;\n}\n\n/** @remarks \\@since 6.0.0 */\nexport function tableRow(options: TableRowClassNameOptions = {}): string {\n const { disableHover, disableBorders, selected, clickable, className } =\n options;\n return cnb(\n styles({\n bordered: !disableBorders,\n hoverable: !disableHover,\n clickable,\n selected,\n }),\n className\n );\n}\n"],"names":["cnb","bem","styles","tableRow","options","disableHover","disableBorders","selected","clickable","className","bordered","hoverable"],"rangeMappings":";;;;;;;;;;;","mappings":"AAAA,SAASA,GAAG,QAAQ,YAAY;AAChC,SAASC,GAAG,QAAQ,kBAAkB;AAEtC,MAAMC,SAASD,IAAI;AAWnB,2BAA2B,GAC3B,OAAO,SAASE,SAASC,UAAoC,CAAC,CAAC;IAC7D,MAAM,EAAEC,YAAY,EAAEC,cAAc,EAAEC,QAAQ,EAAEC,SAAS,EAAEC,SAAS,EAAE,GACpEL;IACF,OAAOJ,IACLE,OAAO;QACLQ,UAAU,CAACJ;QACXK,WAAW,CAACN;QACZG;QACAD;IACF,IACAE;AAEJ"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/table/tableStyles.ts"],"sourcesContent":["import { cnb } from \"cnbuilder\";\nimport { bem } from \"../utils/bem.js\";\n\nconst styles = bem(\"rmd-table\");\n\n/** @remarks \\@since 6.0.0 */\nexport interface TableClassNameOptions {\n className?: string;\n\n /** @defaultValue `false` */\n dense?: boolean;\n\n /** @defaultValue `false` */\n fullWidth?: boolean;\n}\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport function table(options: TableClassNameOptions = {}): string {\n const { dense = false, fullWidth = false, className } = options;\n\n return cnb(styles({ dense, \"full-width\": fullWidth }), className);\n}\n"],"names":["cnb","bem","styles","table","options","dense","fullWidth","className"],"mappings":"AAAA,SAASA,GAAG,QAAQ,YAAY;AAChC,SAASC,GAAG,QAAQ,kBAAkB;AAEtC,MAAMC,SAASD,IAAI;AAanB;;CAEC,GACD,OAAO,SAASE,MAAMC,UAAiC,CAAC,CAAC;IACvD,MAAM,EAAEC,QAAQ,KAAK,EAAEC,YAAY,KAAK,EAAEC,SAAS,EAAE,GAAGH;IAExD,OAAOJ,IAAIE,OAAO;QAAEG;QAAO,cAAcC;IAAU,IAAIC;AACzD"}
1
+ {"version":3,"sources":["../../src/table/tableStyles.ts"],"sourcesContent":["import { cnb } from \"cnbuilder\";\nimport { bem } from \"../utils/bem.js\";\n\nconst styles = bem(\"rmd-table\");\n\n/** @remarks \\@since 6.0.0 */\nexport interface TableClassNameOptions {\n className?: string;\n\n /** @defaultValue `false` */\n dense?: boolean;\n\n /** @defaultValue `false` */\n fullWidth?: boolean;\n}\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport function table(options: TableClassNameOptions = {}): string {\n const { dense = false, fullWidth = false, className } = options;\n\n return cnb(styles({ dense, \"full-width\": fullWidth }), className);\n}\n"],"names":["cnb","bem","styles","table","options","dense","fullWidth","className"],"rangeMappings":";;;;;;;;;;;","mappings":"AAAA,SAASA,GAAG,QAAQ,YAAY;AAChC,SAASC,GAAG,QAAQ,kBAAkB;AAEtC,MAAMC,SAASD,IAAI;AAanB;;CAEC,GACD,OAAO,SAASE,MAAMC,UAAiC,CAAC,CAAC;IACvD,MAAM,EAAEC,QAAQ,KAAK,EAAEC,YAAY,KAAK,EAAEC,SAAS,EAAE,GAAGH;IAExD,OAAOJ,IAAIE,OAAO;QAAEG;QAAO,cAAcC;IAAU,IAAIC;AACzD"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/table/types.ts"],"sourcesContent":["import type { IntersectionObserverHookOptions } from \"../useIntersectionObserver.js\";\n\n/** @remarks \\@since 6.0.0 */\nexport type TableStickySectionOptions = Pick<\n IntersectionObserverHookOptions<HTMLTableSectionElement>,\n \"disabled\" | \"getThreshold\" | \"getRootMargin\"\n>;\n\n/**\n * This **should be wrapped in `useCallback`** to increase performance.\n *\n * The default behavior is to enable the \"active\" state for sticky headers is:\n *\n * - if the `TableHeader` is within a `TableContainer`, add a hidden `<tbody>`\n * after the `<thead>` and enable the active state once 1px overlaps with\n * the container.\n * - otherwise, assume the `TableHeader` is fixed within the viewport and\n * parse the `top` CSS style as `px`. enable the active state once 1px\n * overlaps with this value AND the `TableHeader` exists within the\n * viewport.\n * - Note: This really only works with `px` and `rem` units.\n *\n * @see {@link TableStickySectionProps.stickyOptions} for an example usage with custom threshold and\n * margin.\n * @remarks \\@since 6.0.0\n */\nexport type IsStickyTableSectionActive = (\n entry: IntersectionObserverEntry,\n isInTableContainer: boolean\n) => boolean;\n\n/** @remarks \\@since 6.0.0 */\nexport interface TableStickySectionProps {\n /**\n * @defaultValue `false`\n */\n sticky?: boolean;\n\n /**\n * This can be used when the {@link sticky} prop is set to `true` for\n * additional behavior around the \"active\" state for sticky headers.\n *\n * @example\n * Disabling Sticky Active State\n * ```ts\n * stickyOptions={{\n * disabled: true,\n * }}\n * ```\n *\n * @example\n * Custom Options\n * ```ts\n * stickyOptions={{\n * getThreshold: useCallback(() => {\n * // you can access the DOM safely from here\n * return [0, 0.25, 0.5, 1];\n * }, []),\n * getRootMargin: useCallback(() => {\n * // you can access the DOM safely from here\n * return \"-1px 0px 150px 0px\";\n * }, []),\n * }}\n * isStickyActive={useCallback((entry) => {\n * // whatever custom logic you want. you can access the DOM safely from here\n * return entry.isIntersecting;\n * }, [])}\n * ```\n *\n * @remarks \\@since 6.0.0\n * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API}\n */\n stickyOptions?: TableStickySectionOptions;\n\n /**\n * An optional className to use when the sticky section is covering other rows\n * (`active`). When this is defined, the default\n * `rmd-thead--sticky-active`/`rmd-tfoot--sticky-active` will no longer be\n * applied.\n */\n stickyActiveClassName?: string;\n\n /**\n * @see {@link IsStickyTableSectionActive} for a description.\n * @see {@link stickyOptions} for an example usage with custom threshold and\n * margin.\n * @remarks \\@since 6.0.0\n */\n isStickyActive?: IsStickyTableSectionActive;\n\n /**\n * Set this to `true` when the {@link sticky} prop is `true` to disable the\n * behavior of adding an additional className when the sticky mode is active.\n *\n * The `TableHeader` would gain the `.rmd-thead--sticky-active` class while\n * the `TableFooter` would gain the `.rmd-tfoot--sticky-active` class.\n *\n * @defaultValue `false`\n */\n disableStickyStyles?: boolean;\n}\n"],"names":[],"mappings":"AA+BA,2BAA2B,GAC3B,WAoEC"}
1
+ {"version":3,"sources":["../../src/table/types.ts"],"sourcesContent":["import type { IntersectionObserverHookOptions } from \"../useIntersectionObserver.js\";\n\n/** @remarks \\@since 6.0.0 */\nexport type TableStickySectionOptions = Pick<\n IntersectionObserverHookOptions<HTMLTableSectionElement>,\n \"disabled\" | \"getThreshold\" | \"getRootMargin\"\n>;\n\n/**\n * This **should be wrapped in `useCallback`** to increase performance.\n *\n * The default behavior is to enable the \"active\" state for sticky headers is:\n *\n * - if the `TableHeader` is within a `TableContainer`, add a hidden `<tbody>`\n * after the `<thead>` and enable the active state once 1px overlaps with\n * the container.\n * - otherwise, assume the `TableHeader` is fixed within the viewport and\n * parse the `top` CSS style as `px`. enable the active state once 1px\n * overlaps with this value AND the `TableHeader` exists within the\n * viewport.\n * - Note: This really only works with `px` and `rem` units.\n *\n * @see {@link TableStickySectionProps.stickyOptions} for an example usage with custom threshold and\n * margin.\n * @remarks \\@since 6.0.0\n */\nexport type IsStickyTableSectionActive = (\n entry: IntersectionObserverEntry,\n isInTableContainer: boolean\n) => boolean;\n\n/** @remarks \\@since 6.0.0 */\nexport interface TableStickySectionProps {\n /**\n * @defaultValue `false`\n */\n sticky?: boolean;\n\n /**\n * This can be used when the {@link sticky} prop is set to `true` for\n * additional behavior around the \"active\" state for sticky headers.\n *\n * @example\n * Disabling Sticky Active State\n * ```ts\n * stickyOptions={{\n * disabled: true,\n * }}\n * ```\n *\n * @example\n * Custom Options\n * ```ts\n * stickyOptions={{\n * getThreshold: useCallback(() => {\n * // you can access the DOM safely from here\n * return [0, 0.25, 0.5, 1];\n * }, []),\n * getRootMargin: useCallback(() => {\n * // you can access the DOM safely from here\n * return \"-1px 0px 150px 0px\";\n * }, []),\n * }}\n * isStickyActive={useCallback((entry) => {\n * // whatever custom logic you want. you can access the DOM safely from here\n * return entry.isIntersecting;\n * }, [])}\n * ```\n *\n * @remarks \\@since 6.0.0\n * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API}\n */\n stickyOptions?: TableStickySectionOptions;\n\n /**\n * An optional className to use when the sticky section is covering other rows\n * (`active`). When this is defined, the default\n * `rmd-thead--sticky-active`/`rmd-tfoot--sticky-active` will no longer be\n * applied.\n */\n stickyActiveClassName?: string;\n\n /**\n * @see {@link IsStickyTableSectionActive} for a description.\n * @see {@link stickyOptions} for an example usage with custom threshold and\n * margin.\n * @remarks \\@since 6.0.0\n */\n isStickyActive?: IsStickyTableSectionActive;\n\n /**\n * Set this to `true` when the {@link sticky} prop is `true` to disable the\n * behavior of adding an additional className when the sticky mode is active.\n *\n * The `TableHeader` would gain the `.rmd-thead--sticky-active` class while\n * the `TableFooter` would gain the `.rmd-tfoot--sticky-active` class.\n *\n * @defaultValue `false`\n */\n disableStickyStyles?: boolean;\n}\n"],"names":[],"rangeMappings":"","mappings":"AA+BA,2BAA2B,GAC3B,WAoEC"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/tabs/Tab.tsx"],"sourcesContent":["\"use client\";\nimport {\n type AnchorHTMLAttributes,\n type ButtonHTMLAttributes,\n type ReactElement,\n type ReactNode,\n} from \"react\";\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 { tab } from \"./tabStyles.js\";\n\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nimport { type useTabs } from \"./useTabs.js\";\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nimport { type TabListProps } from \"./TabList.js\";\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface BaseTabProps {\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 * Set this to `true` if the {@link TabListProps.disableTransition} prop has\n * also been set to `true` to disable an active indicator below the tab when\n * {@link active} is `true`.\n *\n * @defaultValue `false`\n */\n activeIndicator?: boolean;\n\n /**\n * Set this to `true` when rendering the tabs vertically and\n * {@link activeIndicator} has been enabled.\n *\n * @defaultValue !false\n */\n verticalActiveIndicator?: 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 * Set this to `true` to render the {@link icon} and {@link children} stacked\n * instead of horizontally.\n *\n * @defaultValue `false`\n */\n stacked?: boolean;\n}\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface TabButtonProps\n extends BaseTabProps,\n ButtonHTMLAttributes<HTMLButtonElement> {\n as?: \"button\";\n}\n\nexport interface TabLinkProps\n extends BaseTabProps,\n AnchorHTMLAttributes<HTMLAnchorElement> {\n as: CustomLinkComponent;\n}\n\n/**\n * @remarks \\@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 useTabs}\n *\n * @remarks \\@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 ...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 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","remaining","disabled","activeDescendantId","ripples","handlers","isLink","buttonOnlyProps","type","aria-selected","role","tabIndex","reversed"],"mappings":"AAAA;;AAOA,SAASA,qBAAqB,QAAQ,0CAA0C;AAChF,SAASC,yBAAyB,QAAQ,8CAA8C;AAExF,SAASC,0BAA0B,QAAQ,6CAA6C;AACxF,SAASC,YAAY,QAAQ,qBAAqB;AAClD,SAASC,GAAG,QAAQ,iBAAiB;AAgFrC;;;;;;;;;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,EACX,GAAGC,WACJ,GAAGzB;IACJ,MAAM,EAAE0B,QAAQ,EAAE,GAAG1B;IAErB,MAAMC,KAAKJ,aAAaK,QAAQ;IAChC,MAAM,EAAEyB,kBAAkB,EAAE,GAAG/B;IAC/B,MAAM,EAAEgC,OAAO,EAAEC,QAAQ,EAAE,GAAGnC,sBAAsB;QAClDoB;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAE;IACF;IAEA,MAAMI,SAAS1B,cAAc;IAC7B,MAAMQ,WAAWjB,0BAA0BkB;IAC3C,IAAIkB;IACJ,IAAI,CAACD,QAAQ;QACXC,kBAAkB;YAAEC,MAAM;QAAS;IACrC;IAEA,qBACE,MAAC5B;QACE,GAAGqB,SAAS;QACZ,GAAGM,eAAe;QAClB,GAAGF,QAAQ;QACZI,iBAAe5B;QACfJ,IAAIA;QACJiC,MAAK;QACLC,UAAUlC,OAAO0B,qBAAqB,IAAI,CAAC;QAC3ChB,WAAWb,IAAI;YACba;YACAN;YACAyB;YACApB,SAAS,CAAC,CAACF,QAAQE;YACnBgB;YACAU,UAAU,CAAC,CAAC5B,QAAQC;YACpBH;YACAC;QACF;;YAECC;YACAI;YACAgB;;;AAGP"}
1
+ {"version":3,"sources":["../../src/tabs/Tab.tsx"],"sourcesContent":["\"use client\";\nimport {\n type AnchorHTMLAttributes,\n type ButtonHTMLAttributes,\n type ReactElement,\n type ReactNode,\n} from \"react\";\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 { tab } from \"./tabStyles.js\";\n\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nimport { type useTabs } from \"./useTabs.js\";\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nimport { type TabListProps } from \"./TabList.js\";\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface BaseTabProps {\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 * Set this to `true` if the {@link TabListProps.disableTransition} prop has\n * also been set to `true` to disable an active indicator below the tab when\n * {@link active} is `true`.\n *\n * @defaultValue `false`\n */\n activeIndicator?: boolean;\n\n /**\n * Set this to `true` when rendering the tabs vertically and\n * {@link activeIndicator} has been enabled.\n *\n * @defaultValue !false\n */\n verticalActiveIndicator?: 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 * Set this to `true` to render the {@link icon} and {@link children} stacked\n * instead of horizontally.\n *\n * @defaultValue `false`\n */\n stacked?: boolean;\n}\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface TabButtonProps\n extends BaseTabProps,\n ButtonHTMLAttributes<HTMLButtonElement> {\n as?: \"button\";\n}\n\nexport interface TabLinkProps\n extends BaseTabProps,\n AnchorHTMLAttributes<HTMLAnchorElement> {\n as: CustomLinkComponent;\n}\n\n/**\n * @remarks \\@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 useTabs}\n *\n * @remarks \\@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 ...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 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","remaining","disabled","activeDescendantId","ripples","handlers","isLink","buttonOnlyProps","type","aria-selected","role","tabIndex","reversed"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;AAOA,SAASA,qBAAqB,QAAQ,0CAA0C;AAChF,SAASC,yBAAyB,QAAQ,8CAA8C;AAExF,SAASC,0BAA0B,QAAQ,6CAA6C;AACxF,SAASC,YAAY,QAAQ,qBAAqB;AAClD,SAASC,GAAG,QAAQ,iBAAiB;AAgFrC;;;;;;;;;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,EACX,GAAGC,WACJ,GAAGzB;IACJ,MAAM,EAAE0B,QAAQ,EAAE,GAAG1B;IAErB,MAAMC,KAAKJ,aAAaK,QAAQ;IAChC,MAAM,EAAEyB,kBAAkB,EAAE,GAAG/B;IAC/B,MAAM,EAAEgC,OAAO,EAAEC,QAAQ,EAAE,GAAGnC,sBAAsB;QAClDoB;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAE;IACF;IAEA,MAAMI,SAAS1B,cAAc;IAC7B,MAAMQ,WAAWjB,0BAA0BkB;IAC3C,IAAIkB;IACJ,IAAI,CAACD,QAAQ;QACXC,kBAAkB;YAAEC,MAAM;QAAS;IACrC;IAEA,qBACE,MAAC5B;QACE,GAAGqB,SAAS;QACZ,GAAGM,eAAe;QAClB,GAAGF,QAAQ;QACZI,iBAAe5B;QACfJ,IAAIA;QACJiC,MAAK;QACLC,UAAUlC,OAAO0B,qBAAqB,IAAI,CAAC;QAC3ChB,WAAWb,IAAI;YACba;YACAN;YACAyB;YACApB,SAAS,CAAC,CAACF,QAAQE;YACnBgB;YACAU,UAAU,CAAC,CAAC5B,QAAQC;YACpBH;YACAC;QACF;;YAECC;YACAI;YACAgB;;;AAGP"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/tabs/TabList.tsx"],"sourcesContent":["\"use client\";\nimport {\n forwardRef,\n useEffect,\n useRef,\n useState,\n type HTMLAttributes,\n} from \"react\";\nimport { useAppSize } from \"../media-queries/AppSizeProvider.js\";\nimport { KeyboardMovementProvider } from \"../movement/useKeyboardMovementProvider.js\";\nimport {\n TabListScrollButton,\n type BaseTabListScrollButtonProps,\n} from \"./TabListScrollButton.js\";\nimport { tabList, type TabsAlignment } from \"./tabListStyles.js\";\nimport { useTabList } from \"./useTabList.js\";\nimport { type GetTabListScrollToOptions } from \"./utils.js\";\n\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nimport { type useTabs } from \"./useTabs.js\";\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface TabListProps extends HTMLAttributes<HTMLDivElement> {\n activeIndex: number;\n setActiveIndex(nextActiveIndex: number): void;\n\n /**\n * @defaultValue `\"left\"`\n */\n align?: TabsAlignment;\n\n /**\n * @defaultValue `false`\n */\n padded?: boolean;\n\n /**\n * @defaultValue `false`\n */\n vertical?: boolean;\n\n /**\n * @defaultValue `false`\n */\n inline?: boolean;\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 */\n activationMode?: \"manual\" | \"automatic\";\n\n /**\n * Set this to `true` to render buttons that can scroll forwards or backwards\n * within the tab list if there is overflow **on desktop**. If you want to\n * display the scroll buttons on mobile as well, set this to `\"allow-phone\"` .\n *\n * @defaultValue `false`\n */\n scrollButtons?: boolean | \"allow-phone\";\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 useTabs} for example usage.\n *\n * @remarks \\@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 disableTransition = false,\n transitionDuration = 150,\n getScrollToOptions,\n forwardScrollButtonProps,\n backwardScrollButtonProps,\n ...remaining\n } = props;\n\n const { isPhone } = useAppSize();\n const showScrollButtons =\n !!scrollButtons && (scrollButtons === \"allow-phone\" || !isPhone);\n\n const { elementProps, movementContext, backwardProps, forwardProps } =\n useTabList({\n ref,\n style,\n onClick,\n onFocus,\n onKeyDown,\n vertical,\n activeIndex,\n setActiveIndex,\n activationMode,\n scrollButtons: showScrollButtons,\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 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","useAppSize","KeyboardMovementProvider","TabListScrollButton","tabList","useTabList","TabList","props","ref","style","onClick","onFocus","onKeyDown","className","children","activeIndex","setActiveIndex","activationMode","align","padded","inline","vertical","scrollbar","scrollButtons","disableTransition","transitionDuration","getScrollToOptions","forwardScrollButtonProps","backwardScrollButtonProps","remaining","isPhone","showScrollButtons","elementProps","movementContext","backwardProps","forwardProps","prevActiveIndex","animate","setAnimate","isSameIndex","current","timeout","window","setTimeout","clearTimeout","value","div","role","indicator"],"mappings":"AAAA;;AACA,SACEA,UAAU,EACVC,SAAS,EACTC,MAAM,EACNC,QAAQ,QAEH,QAAQ;AACf,SAASC,UAAU,QAAQ,sCAAsC;AACjE,SAASC,wBAAwB,QAAQ,6CAA6C;AACtF,SACEC,mBAAmB,QAEd,2BAA2B;AAClC,SAASC,OAAO,QAA4B,qBAAqB;AACjE,SAASC,UAAU,QAAQ,kBAAkB;AAkH7C;;;;;;CAMC,GACD,OAAO,MAAMC,wBAAUT,WACrB,SAASS,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,oBAAoB,KAAK,EACzBC,qBAAqB,GAAG,EACxBC,kBAAkB,EAClBC,wBAAwB,EACxBC,yBAAyB,EACzB,GAAGC,WACJ,GAAGtB;IAEJ,MAAM,EAAEuB,OAAO,EAAE,GAAG7B;IACpB,MAAM8B,oBACJ,CAAC,CAACR,iBAAkBA,CAAAA,kBAAkB,iBAAiB,CAACO,OAAM;IAEhE,MAAM,EAAEE,YAAY,EAAEC,eAAe,EAAEC,aAAa,EAAEC,YAAY,EAAE,GAClE9B,WAAW;QACTG;QACAC;QACAC;QACAC;QACAC;QACAS;QACAN;QACAC;QACAC;QACAM,eAAeQ;QACfP;IACF;IAEF,MAAMY,kBAAkBrC,OAAOgB;IAC/B,MAAM,CAACsB,SAASC,WAAW,GAAGtC,SAAS;IACvCF,UAAU;QACR,MAAMyC,cAAcxB,gBAAgBqB,gBAAgBI,OAAO;QAC3DJ,gBAAgBI,OAAO,GAAGzB;QAC1B,IAAIS,qBAAqBe,aAAa;YACpC;QACF;QAEAD,WAAW;QACX,MAAMG,UAAUC,OAAOC,UAAU,CAAC;YAChCL,WAAW;QACb,GAAGb;QAEH,OAAO;YACLiB,OAAOE,YAAY,CAACH;QACtB;IACF,GAAG;QAAC1B;QAAaS;QAAmBC;KAAmB;IAEvD,qBACE,KAACvB;QAAyB2C,OAAOZ;kBAC/B,cAAA,MAACa;YACE,GAAGjB,SAAS;YACZ,GAAGG,YAAY;YAChBe,MAAK;YACLlC,WAAWT,QAAQ;gBACjBc;gBACAC;gBACAC;gBACAiB,SAAS,CAACb,qBAAqBa;gBAC/BhB;gBACAC;gBACA0B,WAAW,CAACxB;gBACZX;YACF;;gBAECkB,mCACC,KAAC5B;oBACCuB,oBAAoBA;oBACnB,GAAGE,yBAAyB;oBAC5B,GAAGM,aAAa;;gBAGpBpB;gBACAiB,mCACC,KAAC5B;oBACCuB,oBAAoBA;oBACnB,GAAGC,wBAAwB;oBAC3B,GAAGQ,YAAY;;;;;AAM5B,GACA"}
1
+ {"version":3,"sources":["../../src/tabs/TabList.tsx"],"sourcesContent":["\"use client\";\nimport {\n forwardRef,\n useEffect,\n useRef,\n useState,\n type HTMLAttributes,\n} from \"react\";\nimport { useAppSize } from \"../media-queries/AppSizeProvider.js\";\nimport { KeyboardMovementProvider } from \"../movement/useKeyboardMovementProvider.js\";\nimport {\n TabListScrollButton,\n type BaseTabListScrollButtonProps,\n} from \"./TabListScrollButton.js\";\nimport { tabList, type TabsAlignment } from \"./tabListStyles.js\";\nimport { useTabList } from \"./useTabList.js\";\nimport { type GetTabListScrollToOptions } from \"./utils.js\";\n\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nimport { type useTabs } from \"./useTabs.js\";\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface TabListProps extends HTMLAttributes<HTMLDivElement> {\n activeIndex: number;\n setActiveIndex(nextActiveIndex: number): void;\n\n /**\n * @defaultValue `\"left\"`\n */\n align?: TabsAlignment;\n\n /**\n * @defaultValue `false`\n */\n padded?: boolean;\n\n /**\n * @defaultValue `false`\n */\n vertical?: boolean;\n\n /**\n * @defaultValue `false`\n */\n inline?: boolean;\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 */\n activationMode?: \"manual\" | \"automatic\";\n\n /**\n * Set this to `true` to render buttons that can scroll forwards or backwards\n * within the tab list if there is overflow **on desktop**. If you want to\n * display the scroll buttons on mobile as well, set this to `\"allow-phone\"` .\n *\n * @defaultValue `false`\n */\n scrollButtons?: boolean | \"allow-phone\";\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 useTabs} for example usage.\n *\n * @remarks \\@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 disableTransition = false,\n transitionDuration = 150,\n getScrollToOptions,\n forwardScrollButtonProps,\n backwardScrollButtonProps,\n ...remaining\n } = props;\n\n const { isPhone } = useAppSize();\n const showScrollButtons =\n !!scrollButtons && (scrollButtons === \"allow-phone\" || !isPhone);\n\n const { elementProps, movementContext, backwardProps, forwardProps } =\n useTabList({\n ref,\n style,\n onClick,\n onFocus,\n onKeyDown,\n vertical,\n activeIndex,\n setActiveIndex,\n activationMode,\n scrollButtons: showScrollButtons,\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 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","useAppSize","KeyboardMovementProvider","TabListScrollButton","tabList","useTabList","TabList","props","ref","style","onClick","onFocus","onKeyDown","className","children","activeIndex","setActiveIndex","activationMode","align","padded","inline","vertical","scrollbar","scrollButtons","disableTransition","transitionDuration","getScrollToOptions","forwardScrollButtonProps","backwardScrollButtonProps","remaining","isPhone","showScrollButtons","elementProps","movementContext","backwardProps","forwardProps","prevActiveIndex","animate","setAnimate","isSameIndex","current","timeout","window","setTimeout","clearTimeout","value","div","role","indicator"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;AACA,SACEA,UAAU,EACVC,SAAS,EACTC,MAAM,EACNC,QAAQ,QAEH,QAAQ;AACf,SAASC,UAAU,QAAQ,sCAAsC;AACjE,SAASC,wBAAwB,QAAQ,6CAA6C;AACtF,SACEC,mBAAmB,QAEd,2BAA2B;AAClC,SAASC,OAAO,QAA4B,qBAAqB;AACjE,SAASC,UAAU,QAAQ,kBAAkB;AAkH7C;;;;;;CAMC,GACD,OAAO,MAAMC,wBAAUT,WACrB,SAASS,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,oBAAoB,KAAK,EACzBC,qBAAqB,GAAG,EACxBC,kBAAkB,EAClBC,wBAAwB,EACxBC,yBAAyB,EACzB,GAAGC,WACJ,GAAGtB;IAEJ,MAAM,EAAEuB,OAAO,EAAE,GAAG7B;IACpB,MAAM8B,oBACJ,CAAC,CAACR,iBAAkBA,CAAAA,kBAAkB,iBAAiB,CAACO,OAAM;IAEhE,MAAM,EAAEE,YAAY,EAAEC,eAAe,EAAEC,aAAa,EAAEC,YAAY,EAAE,GAClE9B,WAAW;QACTG;QACAC;QACAC;QACAC;QACAC;QACAS;QACAN;QACAC;QACAC;QACAM,eAAeQ;QACfP;IACF;IAEF,MAAMY,kBAAkBrC,OAAOgB;IAC/B,MAAM,CAACsB,SAASC,WAAW,GAAGtC,SAAS;IACvCF,UAAU;QACR,MAAMyC,cAAcxB,gBAAgBqB,gBAAgBI,OAAO;QAC3DJ,gBAAgBI,OAAO,GAAGzB;QAC1B,IAAIS,qBAAqBe,aAAa;YACpC;QACF;QAEAD,WAAW;QACX,MAAMG,UAAUC,OAAOC,UAAU,CAAC;YAChCL,WAAW;QACb,GAAGb;QAEH,OAAO;YACLiB,OAAOE,YAAY,CAACH;QACtB;IACF,GAAG;QAAC1B;QAAaS;QAAmBC;KAAmB;IAEvD,qBACE,KAACvB;QAAyB2C,OAAOZ;kBAC/B,cAAA,MAACa;YACE,GAAGjB,SAAS;YACZ,GAAGG,YAAY;YAChBe,MAAK;YACLlC,WAAWT,QAAQ;gBACjBc;gBACAC;gBACAC;gBACAiB,SAAS,CAACb,qBAAqBa;gBAC/BhB;gBACAC;gBACA0B,WAAW,CAACxB;gBACZX;YACF;;gBAECkB,mCACC,KAAC5B;oBACCuB,oBAAoBA;oBACnB,GAAGE,yBAAyB;oBAC5B,GAAGM,aAAa;;gBAGpBpB;gBACAiB,mCACC,KAAC5B;oBACCuB,oBAAoBA;oBACnB,GAAGC,wBAAwB;oBAC3B,GAAGQ,YAAY;;;;;AAM5B,GACA"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/tabs/TabListScrollButton.tsx"],"sourcesContent":["\"use client\";\nimport {\n forwardRef,\n useCallback,\n useRef,\n useState,\n type HTMLAttributes,\n} from \"react\";\nimport { Button, type ButtonProps } from \"../button/Button.js\";\nimport { type ButtonClassNameThemeOptions } from \"../button/buttonStyles.js\";\nimport { getIcon } from \"../icon/iconConfig.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 tabListScrollButton,\n tabListScrollButtonContainer,\n} from \"./tabListScrollButtonStyles.js\";\nimport {\n getTabListScrollToOptions,\n type GetTabListScrollToOptions,\n} from \"./utils.js\";\n\n/**\n * @internal\n * @remarks \\@since 6.0.0\n */\nexport interface BaseTabListScrollButtonProps\n extends HTMLAttributes<HTMLDivElement>,\n ButtonClassNameThemeOptions {\n buttonProps?: PropsWithRef<ButtonProps, HTMLButtonElement>;\n\n /** @defaultValue `false` */\n disableTransition?: boolean;\n\n /** @defaultValue {@link getTabListScrollToOptions} */\n getScrollToOptions?: GetTabListScrollToOptions;\n}\n\n/**\n * @internal\n * @remarks \\@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 * @remarks \\@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 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({ forward, className })}\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(buttonProps)}\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","tabListScrollButton","tabListScrollButtonContainer","getTabListScrollToOptions","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","onUpdate","entry","intersectionRatio","span","div","instance","current","parentElement","aria-label","undefined","onClick","event","container","scrollTo","animate","increment"],"mappings":"AAAA;;AACA,SACEA,UAAU,EACVC,WAAW,EACXC,MAAM,EACNC,QAAQ,QAEH,QAAQ;AACf,SAASC,MAAM,QAA0B,sBAAsB;AAE/D,SAASC,OAAO,QAAQ,wBAAwB;AAEhD,SAASC,MAAM,QAAQ,4CAA4C;AACnE,SAASC,uBAAuB,QAAQ,gCAAgC;AACxE,SAASC,QAAQ,QAAQ,uBAAuB;AAChD,SACEC,mBAAmB,EACnBC,4BAA4B,QACvB,iCAAiC;AACxC,SACEC,yBAAyB,QAEpB,aAAa;AA4BpB;;;;;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,qBAAqBf,yBAAyB,EAC9CgB,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,UAAUrC,YAAY,CAAC,CAACsC,MAAM;YAC5BH,YAAYG,MAAMC,iBAAiB,KAAK;QAC1C,GAAG,EAAE;IACP;IAEA,qBACE;;YACG,CAACV,yBAAW,KAACW;gBAAK3B,KAAKuB;;0BACxB,KAACK;gBACE,GAAGb,SAAS;gBACbf,KAAK,CAAC6B;oBACJnC,SAASmC,UAAU7B;oBACnBmB,KAAKW,OAAO,GAAGD,UAAUE,iBAAiB;gBAC5C;gBACA7B,WAAWN,6BAA6B;oBAAEoB;oBAASd;gBAAU;0BAE7D,cAAA,KAACZ;oBACC0C,cAAY/B,aAAcgB,CAAAA,aAAab,OAAO6B,SAAQ;oBACtD5B,OAAOA;oBACPC,WAAWA;oBACXC,YAAYA;oBACZC,UAAUC,gBAAgBD;oBACzB,GAAGL,WAAW;oBACfD,WAAWP,oBAAoBQ;oBAC/B+B,SAAS,CAACC;wBACRhC,aAAa+B,UAAUC;wBACvB,MAAMC,YAAYjB,KAAKW,OAAO;wBAC9B,IAAI,CAACM,WAAW;4BACd;wBACF;wBAEAA,UAAUC,QAAQ,CAChBzB,mBAAmB;4BACjBQ;4BACAkB,SAAS,CAACxB;4BACVD;4BACAuB;4BACAG,WAAWvB;wBACb;oBAEJ;8BAECN;;;YAGJM,yBAAW,KAACW;gBAAK3B,KAAKuB;;;;AAG7B,GAAG"}
1
+ {"version":3,"sources":["../../src/tabs/TabListScrollButton.tsx"],"sourcesContent":["\"use client\";\nimport {\n forwardRef,\n useCallback,\n useRef,\n useState,\n type HTMLAttributes,\n} from \"react\";\nimport { Button, type ButtonProps } from \"../button/Button.js\";\nimport { type ButtonClassNameThemeOptions } from \"../button/buttonStyles.js\";\nimport { getIcon } from \"../icon/iconConfig.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 tabListScrollButton,\n tabListScrollButtonContainer,\n} from \"./tabListScrollButtonStyles.js\";\nimport {\n getTabListScrollToOptions,\n type GetTabListScrollToOptions,\n} from \"./utils.js\";\n\n/**\n * @internal\n * @remarks \\@since 6.0.0\n */\nexport interface BaseTabListScrollButtonProps\n extends HTMLAttributes<HTMLDivElement>,\n ButtonClassNameThemeOptions {\n buttonProps?: PropsWithRef<ButtonProps, HTMLButtonElement>;\n\n /** @defaultValue `false` */\n disableTransition?: boolean;\n\n /** @defaultValue {@link getTabListScrollToOptions} */\n getScrollToOptions?: GetTabListScrollToOptions;\n}\n\n/**\n * @internal\n * @remarks \\@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 * @remarks \\@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 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({ forward, className })}\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(buttonProps)}\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","tabListScrollButton","tabListScrollButtonContainer","getTabListScrollToOptions","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","onUpdate","entry","intersectionRatio","span","div","instance","current","parentElement","aria-label","undefined","onClick","event","container","scrollTo","animate","increment"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;AACA,SACEA,UAAU,EACVC,WAAW,EACXC,MAAM,EACNC,QAAQ,QAEH,QAAQ;AACf,SAASC,MAAM,QAA0B,sBAAsB;AAE/D,SAASC,OAAO,QAAQ,wBAAwB;AAEhD,SAASC,MAAM,QAAQ,4CAA4C;AACnE,SAASC,uBAAuB,QAAQ,gCAAgC;AACxE,SAASC,QAAQ,QAAQ,uBAAuB;AAChD,SACEC,mBAAmB,EACnBC,4BAA4B,QACvB,iCAAiC;AACxC,SACEC,yBAAyB,QAEpB,aAAa;AA4BpB;;;;;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,qBAAqBf,yBAAyB,EAC9CgB,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,UAAUrC,YAAY,CAAC,CAACsC,MAAM;YAC5BH,YAAYG,MAAMC,iBAAiB,KAAK;QAC1C,GAAG,EAAE;IACP;IAEA,qBACE;;YACG,CAACV,yBAAW,KAACW;gBAAK3B,KAAKuB;;0BACxB,KAACK;gBACE,GAAGb,SAAS;gBACbf,KAAK,CAAC6B;oBACJnC,SAASmC,UAAU7B;oBACnBmB,KAAKW,OAAO,GAAGD,UAAUE,iBAAiB;gBAC5C;gBACA7B,WAAWN,6BAA6B;oBAAEoB;oBAASd;gBAAU;0BAE7D,cAAA,KAACZ;oBACC0C,cAAY/B,aAAcgB,CAAAA,aAAab,OAAO6B,SAAQ;oBACtD5B,OAAOA;oBACPC,WAAWA;oBACXC,YAAYA;oBACZC,UAAUC,gBAAgBD;oBACzB,GAAGL,WAAW;oBACfD,WAAWP,oBAAoBQ;oBAC/B+B,SAAS,CAACC;wBACRhC,aAAa+B,UAAUC;wBACvB,MAAMC,YAAYjB,KAAKW,OAAO;wBAC9B,IAAI,CAACM,WAAW;4BACd;wBACF;wBAEAA,UAAUC,QAAQ,CAChBzB,mBAAmB;4BACjBQ;4BACAkB,SAAS,CAACxB;4BACVD;4BACAuB;4BACAG,WAAWvB;wBACb;oBAEJ;8BAECN;;;YAGJM,yBAAW,KAACW;gBAAK3B,KAAKuB;;;;AAG7B,GAAG"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/tabs/tabIndicatorStyles.ts"],"sourcesContent":["import { cnb } from \"cnbuilder\";\nimport { bem } from \"../utils/bem.js\";\n\nconst styles = bem(\"rmd-tab-indicator\");\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface TabIndicatorClassNameOptions {\n className?: string;\n animate?: boolean;\n tablist?: boolean;\n vertical?: boolean;\n}\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport function tabIndicator(\n options: TabIndicatorClassNameOptions = {}\n): string {\n const { className, vertical, tablist, animate } = options;\n\n return cnb(\n styles({\n animate,\n h: !vertical,\n v: vertical,\n \"tablist-h\": tablist && !vertical,\n \"tablist-v\": tablist && vertical,\n }),\n className\n );\n}\n"],"names":["cnb","bem","styles","tabIndicator","options","className","vertical","tablist","animate","h","v"],"mappings":"AAAA,SAASA,GAAG,QAAQ,YAAY;AAChC,SAASC,GAAG,QAAQ,kBAAkB;AAEtC,MAAMC,SAASD,IAAI;AAYnB;;CAEC,GACD,OAAO,SAASE,aACdC,UAAwC,CAAC,CAAC;IAE1C,MAAM,EAAEC,SAAS,EAAEC,QAAQ,EAAEC,OAAO,EAAEC,OAAO,EAAE,GAAGJ;IAElD,OAAOJ,IACLE,OAAO;QACLM;QACAC,GAAG,CAACH;QACJI,GAAGJ;QACH,aAAaC,WAAW,CAACD;QACzB,aAAaC,WAAWD;IAC1B,IACAD;AAEJ"}
1
+ {"version":3,"sources":["../../src/tabs/tabIndicatorStyles.ts"],"sourcesContent":["import { cnb } from \"cnbuilder\";\nimport { bem } from \"../utils/bem.js\";\n\nconst styles = bem(\"rmd-tab-indicator\");\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface TabIndicatorClassNameOptions {\n className?: string;\n animate?: boolean;\n tablist?: boolean;\n vertical?: boolean;\n}\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport function tabIndicator(\n options: TabIndicatorClassNameOptions = {}\n): string {\n const { className, vertical, tablist, animate } = options;\n\n return cnb(\n styles({\n animate,\n h: !vertical,\n v: vertical,\n \"tablist-h\": tablist && !vertical,\n \"tablist-v\": tablist && vertical,\n }),\n className\n );\n}\n"],"names":["cnb","bem","styles","tabIndicator","options","className","vertical","tablist","animate","h","v"],"rangeMappings":";;;;;;;;;;;;;;","mappings":"AAAA,SAASA,GAAG,QAAQ,YAAY;AAChC,SAASC,GAAG,QAAQ,kBAAkB;AAEtC,MAAMC,SAASD,IAAI;AAYnB;;CAEC,GACD,OAAO,SAASE,aACdC,UAAwC,CAAC,CAAC;IAE1C,MAAM,EAAEC,SAAS,EAAEC,QAAQ,EAAEC,OAAO,EAAEC,OAAO,EAAE,GAAGJ;IAElD,OAAOJ,IACLE,OAAO;QACLM;QACAC,GAAG,CAACH;QACJI,GAAGJ;QACH,aAAaC,WAAW,CAACD;QACzB,aAAaC,WAAWD;IAC1B,IACAD;AAEJ"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/tabs/tabListScrollButtonStyles.ts"],"sourcesContent":["import { cnb } from \"cnbuilder\";\nimport { bem } from \"../utils/bem.js\";\n\nconst styles = bem(\"rmd-tablist-button\");\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface TabListScrollButtonContainerClassNameOptions {\n className?: string;\n forward: boolean;\n}\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport function tabListScrollButtonContainer(\n options: TabListScrollButtonContainerClassNameOptions\n): string {\n const { forward, className } = options;\n\n return cnb(\n styles({\n left: !forward,\n right: forward,\n }),\n className\n );\n}\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface TabListScrollButtonClassNameOptions {\n className?: string;\n}\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport function tabListScrollButton(\n options: TabListScrollButtonClassNameOptions = {}\n): string {\n const { className } = options;\n\n return cnb(styles(\"button\"), className);\n}\n"],"names":["cnb","bem","styles","tabListScrollButtonContainer","options","forward","className","left","right","tabListScrollButton"],"mappings":"AAAA,SAASA,GAAG,QAAQ,YAAY;AAChC,SAASC,GAAG,QAAQ,kBAAkB;AAEtC,MAAMC,SAASD,IAAI;AAUnB;;CAEC,GACD,OAAO,SAASE,6BACdC,OAAqD;IAErD,MAAM,EAAEC,OAAO,EAAEC,SAAS,EAAE,GAAGF;IAE/B,OAAOJ,IACLE,OAAO;QACLK,MAAM,CAACF;QACPG,OAAOH;IACT,IACAC;AAEJ;AASA;;CAEC,GACD,OAAO,SAASG,oBACdL,UAA+C,CAAC,CAAC;IAEjD,MAAM,EAAEE,SAAS,EAAE,GAAGF;IAEtB,OAAOJ,IAAIE,OAAO,WAAWI;AAC/B"}
1
+ {"version":3,"sources":["../../src/tabs/tabListScrollButtonStyles.ts"],"sourcesContent":["import { cnb } from \"cnbuilder\";\nimport { bem } from \"../utils/bem.js\";\n\nconst styles = bem(\"rmd-tablist-button\");\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface TabListScrollButtonContainerClassNameOptions {\n className?: string;\n forward: boolean;\n}\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport function tabListScrollButtonContainer(\n options: TabListScrollButtonContainerClassNameOptions\n): string {\n const { forward, className } = options;\n\n return cnb(\n styles({\n left: !forward,\n right: forward,\n }),\n className\n );\n}\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface TabListScrollButtonClassNameOptions {\n className?: string;\n}\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport function tabListScrollButton(\n options: TabListScrollButtonClassNameOptions = {}\n): string {\n const { className } = options;\n\n return cnb(styles(\"button\"), className);\n}\n"],"names":["cnb","bem","styles","tabListScrollButtonContainer","options","forward","className","left","right","tabListScrollButton"],"rangeMappings":";;;;;;;;;;;;;;;;;","mappings":"AAAA,SAASA,GAAG,QAAQ,YAAY;AAChC,SAASC,GAAG,QAAQ,kBAAkB;AAEtC,MAAMC,SAASD,IAAI;AAUnB;;CAEC,GACD,OAAO,SAASE,6BACdC,OAAqD;IAErD,MAAM,EAAEC,OAAO,EAAEC,SAAS,EAAE,GAAGF;IAE/B,OAAOJ,IACLE,OAAO;QACLK,MAAM,CAACF;QACPG,OAAOH;IACT,IACAC;AAEJ;AASA;;CAEC,GACD,OAAO,SAASG,oBACdL,UAA+C,CAAC,CAAC;IAEjD,MAAM,EAAEE,SAAS,EAAE,GAAGF;IAEtB,OAAOJ,IAAIE,OAAO,WAAWI;AAC/B"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/tabs/tabListStyles.ts"],"sourcesContent":["import { cnb } from \"cnbuilder\";\nimport { bem } from \"../utils/bem.js\";\nimport { tabIndicator } from \"./tabIndicatorStyles.js\";\n\nconst styles = bem(\"rmd-tablist\");\n\n/**\n * The supported types of alignments for the tabs.\n */\nexport type TabsAlignment = \"left\" | \"center\" | \"right\";\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface TabListClassNameOptions {\n className?: string;\n align?: TabsAlignment;\n animate?: boolean;\n inline?: boolean;\n padded?: boolean;\n vertical?: boolean;\n scrollbar?: boolean;\n indicator?: boolean;\n}\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport function tabList(options: TabListClassNameOptions = {}): string {\n const {\n className,\n align = \"left\",\n padded,\n inline,\n vertical,\n scrollbar,\n animate = false,\n indicator = false,\n } = options;\n\n return cnb(\n styles({\n [align]: true,\n padded,\n vertical,\n \"full-width\": !inline,\n \"no-scrollbar\": !scrollbar,\n }),\n indicator && tabIndicator({ tablist: true, animate, vertical }),\n className\n );\n}\n"],"names":["cnb","bem","tabIndicator","styles","tabList","options","className","align","padded","inline","vertical","scrollbar","animate","indicator","tablist"],"mappings":"AAAA,SAASA,GAAG,QAAQ,YAAY;AAChC,SAASC,GAAG,QAAQ,kBAAkB;AACtC,SAASC,YAAY,QAAQ,0BAA0B;AAEvD,MAAMC,SAASF,IAAI;AAqBnB;;CAEC,GACD,OAAO,SAASG,QAAQC,UAAmC,CAAC,CAAC;IAC3D,MAAM,EACJC,SAAS,EACTC,QAAQ,MAAM,EACdC,MAAM,EACNC,MAAM,EACNC,QAAQ,EACRC,SAAS,EACTC,UAAU,KAAK,EACfC,YAAY,KAAK,EAClB,GAAGR;IAEJ,OAAOL,IACLG,OAAO;QACL,CAACI,MAAM,EAAE;QACTC;QACAE;QACA,cAAc,CAACD;QACf,gBAAgB,CAACE;IACnB,IACAE,aAAaX,aAAa;QAAEY,SAAS;QAAMF;QAASF;IAAS,IAC7DJ;AAEJ"}
1
+ {"version":3,"sources":["../../src/tabs/tabListStyles.ts"],"sourcesContent":["import { cnb } from \"cnbuilder\";\nimport { bem } from \"../utils/bem.js\";\nimport { tabIndicator } from \"./tabIndicatorStyles.js\";\n\nconst styles = bem(\"rmd-tablist\");\n\n/**\n * The supported types of alignments for the tabs.\n */\nexport type TabsAlignment = \"left\" | \"center\" | \"right\";\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface TabListClassNameOptions {\n className?: string;\n align?: TabsAlignment;\n animate?: boolean;\n inline?: boolean;\n padded?: boolean;\n vertical?: boolean;\n scrollbar?: boolean;\n indicator?: boolean;\n}\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport function tabList(options: TabListClassNameOptions = {}): string {\n const {\n className,\n align = \"left\",\n padded,\n inline,\n vertical,\n scrollbar,\n animate = false,\n indicator = false,\n } = options;\n\n return cnb(\n styles({\n [align]: true,\n padded,\n vertical,\n \"full-width\": !inline,\n \"no-scrollbar\": !scrollbar,\n }),\n indicator && tabIndicator({ tablist: true, animate, vertical }),\n className\n );\n}\n"],"names":["cnb","bem","tabIndicator","styles","tabList","options","className","align","padded","inline","vertical","scrollbar","animate","indicator","tablist"],"rangeMappings":";;;;;;;;;;;;;;;;;;;","mappings":"AAAA,SAASA,GAAG,QAAQ,YAAY;AAChC,SAASC,GAAG,QAAQ,kBAAkB;AACtC,SAASC,YAAY,QAAQ,0BAA0B;AAEvD,MAAMC,SAASF,IAAI;AAqBnB;;CAEC,GACD,OAAO,SAASG,QAAQC,UAAmC,CAAC,CAAC;IAC3D,MAAM,EACJC,SAAS,EACTC,QAAQ,MAAM,EACdC,MAAM,EACNC,MAAM,EACNC,QAAQ,EACRC,SAAS,EACTC,UAAU,KAAK,EACfC,YAAY,KAAK,EAClB,GAAGR;IAEJ,OAAOL,IACLG,OAAO;QACL,CAACI,MAAM,EAAE;QACTC;QACAE;QACA,cAAc,CAACD;QACf,gBAAgB,CAACE;IACnB,IACAE,aAAaX,aAAa;QAAEY,SAAS;QAAMF;QAASF;IAAS,IAC7DJ;AAEJ"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/tabs/tabStyles.ts"],"sourcesContent":["import { cnb } from \"cnbuilder\";\nimport { cssUtils } from \"../cssUtils.js\";\nimport { bem } from \"../utils/bem.js\";\nimport { tabIndicator } from \"./tabIndicatorStyles.js\";\n\ndeclare module \"react\" {\n interface CSSProperties {\n \"--rmd-tab-color\"?: string;\n \"--rmd-tab-active-color\"?: string;\n \"--rmd-tab-inactive-color\"?: string;\n \"--rmd-tab-disabled-color\"?: string;\n }\n}\n\nconst styles = bem(\"rmd-tab\");\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface TabClassNameOptions {\n className?: string;\n active?: boolean;\n isLink?: boolean;\n activeIndicator?: boolean;\n verticalActiveIndicator?: boolean;\n stacked?: boolean;\n reversed?: boolean;\n disabled?: boolean;\n}\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport function tab(options: TabClassNameOptions = {}): string {\n const {\n className,\n active,\n isLink,\n stacked,\n reversed,\n disabled,\n activeIndicator,\n verticalActiveIndicator,\n } = options;\n\n return cnb(\n styles({\n active,\n reversed: reversed && !stacked,\n stacked,\n \"stacked-reversed\": stacked && reversed,\n disabled,\n }),\n active &&\n activeIndicator &&\n tabIndicator({ vertical: verticalActiveIndicator }),\n cssUtils({ surface: true, textDecoration: isLink ? \"none\" : undefined }),\n className\n );\n}\n"],"names":["cnb","cssUtils","bem","tabIndicator","styles","tab","options","className","active","isLink","stacked","reversed","disabled","activeIndicator","verticalActiveIndicator","vertical","surface","textDecoration","undefined"],"mappings":"AAAA,SAASA,GAAG,QAAQ,YAAY;AAChC,SAASC,QAAQ,QAAQ,iBAAiB;AAC1C,SAASC,GAAG,QAAQ,kBAAkB;AACtC,SAASC,YAAY,QAAQ,0BAA0B;AAWvD,MAAMC,SAASF,IAAI;AAgBnB;;CAEC,GACD,OAAO,SAASG,IAAIC,UAA+B,CAAC,CAAC;IACnD,MAAM,EACJC,SAAS,EACTC,MAAM,EACNC,MAAM,EACNC,OAAO,EACPC,QAAQ,EACRC,QAAQ,EACRC,eAAe,EACfC,uBAAuB,EACxB,GAAGR;IAEJ,OAAON,IACLI,OAAO;QACLI;QACAG,UAAUA,YAAY,CAACD;QACvBA;QACA,oBAAoBA,WAAWC;QAC/BC;IACF,IACAJ,UACEK,mBACAV,aAAa;QAAEY,UAAUD;IAAwB,IACnDb,SAAS;QAAEe,SAAS;QAAMC,gBAAgBR,SAAS,SAASS;IAAU,IACtEX;AAEJ"}
1
+ {"version":3,"sources":["../../src/tabs/tabStyles.ts"],"sourcesContent":["import { cnb } from \"cnbuilder\";\nimport { cssUtils } from \"../cssUtils.js\";\nimport { bem } from \"../utils/bem.js\";\nimport { tabIndicator } from \"./tabIndicatorStyles.js\";\n\ndeclare module \"react\" {\n interface CSSProperties {\n \"--rmd-tab-color\"?: string;\n \"--rmd-tab-active-color\"?: string;\n \"--rmd-tab-inactive-color\"?: string;\n \"--rmd-tab-disabled-color\"?: string;\n }\n}\n\nconst styles = bem(\"rmd-tab\");\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface TabClassNameOptions {\n className?: string;\n active?: boolean;\n isLink?: boolean;\n activeIndicator?: boolean;\n verticalActiveIndicator?: boolean;\n stacked?: boolean;\n reversed?: boolean;\n disabled?: boolean;\n}\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport function tab(options: TabClassNameOptions = {}): string {\n const {\n className,\n active,\n isLink,\n stacked,\n reversed,\n disabled,\n activeIndicator,\n verticalActiveIndicator,\n } = options;\n\n return cnb(\n styles({\n active,\n reversed: reversed && !stacked,\n stacked,\n \"stacked-reversed\": stacked && reversed,\n disabled,\n }),\n active &&\n activeIndicator &&\n tabIndicator({ vertical: verticalActiveIndicator }),\n cssUtils({ surface: true, textDecoration: isLink ? \"none\" : undefined }),\n className\n );\n}\n"],"names":["cnb","cssUtils","bem","tabIndicator","styles","tab","options","className","active","isLink","stacked","reversed","disabled","activeIndicator","verticalActiveIndicator","vertical","surface","textDecoration","undefined"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,SAASA,GAAG,QAAQ,YAAY;AAChC,SAASC,QAAQ,QAAQ,iBAAiB;AAC1C,SAASC,GAAG,QAAQ,kBAAkB;AACtC,SAASC,YAAY,QAAQ,0BAA0B;AAWvD,MAAMC,SAASF,IAAI;AAgBnB;;CAEC,GACD,OAAO,SAASG,IAAIC,UAA+B,CAAC,CAAC;IACnD,MAAM,EACJC,SAAS,EACTC,MAAM,EACNC,MAAM,EACNC,OAAO,EACPC,QAAQ,EACRC,QAAQ,EACRC,eAAe,EACfC,uBAAuB,EACxB,GAAGR;IAEJ,OAAON,IACLI,OAAO;QACLI;QACAG,UAAUA,YAAY,CAACD;QACvBA;QACA,oBAAoBA,WAAWC;QAC/BC;IACF,IACAJ,UACEK,mBACAV,aAAa;QAAEY,UAAUD;IAAwB,IACnDb,SAAS;QAAEe,SAAS;QAAMC,gBAAgBR,SAAS,SAASS;IAAU,IACtEX;AAEJ"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/tabs/useTabList.ts"],"sourcesContent":["\"use client\";\nimport type {\n CSSProperties,\n FocusEventHandler,\n KeyboardEventHandler,\n MouseEventHandler,\n Ref,\n RefObject,\n} from \"react\";\nimport { useCallback, useEffect, useRef, useState } from \"react\";\nimport type {\n KeyboardMovementContext,\n KeyboardMovementProps,\n} from \"../movement/types.js\";\nimport { useKeyboardMovementProvider } from \"../movement/useKeyboardMovementProvider.js\";\nimport { useDir } from \"../typography/WritingDirectionProvider.js\";\nimport { useEnsuredRef } from \"../useEnsuredRef.js\";\nimport { useResizeObserver } from \"../useResizeObserver.js\";\nimport { getTabRoleOnly, scrollTabIntoView } from \"./utils.js\";\n\ndeclare module \"react\" {\n interface CSSProperties {\n \"--rmd-tab-size\"?: string;\n \"--rmd-tab-offset\"?: string | number;\n \"--rmd-tab-indicator-background\"?: string;\n }\n}\n\nconst TAB_SIZE_VAR = \"--rmd-tab-size\";\nconst TAB_OFFSET_VAR = \"--rmd-tab-offset\";\n\nconst noop = (): void => {\n // do nothing\n};\n\nexport type TabWidthVar = typeof TAB_SIZE_VAR;\nexport type TabOffsetVar = typeof TAB_OFFSET_VAR;\n\nexport type IndicatorCSSProperties = CSSProperties &\n Record<TabWidthVar | TabOffsetVar, string>;\n\nexport interface TabListHookOptions {\n ref: Ref<HTMLDivElement> | undefined;\n style: CSSProperties | undefined;\n activeIndex: number;\n setActiveIndex(nextActiveIndex: number): void;\n scrollButtons: boolean;\n activationMode: \"manual\" | \"automatic\";\n vertical: boolean;\n onClick: MouseEventHandler<HTMLDivElement> | undefined;\n onFocus: FocusEventHandler<HTMLDivElement> | undefined;\n onKeyDown: KeyboardEventHandler<HTMLDivElement> | undefined;\n disableTransition: boolean;\n}\n\nexport interface TabListHookReturnValue {\n elementProps: KeyboardMovementProps<HTMLDivElement> & {\n \"aria-orientation\": \"horizontal\" | \"vertical\";\n style: CSSProperties;\n ref: Ref<HTMLDivElement>;\n onClick: MouseEventHandler<HTMLDivElement>;\n };\n movementContext: KeyboardMovementContext;\n backwardProps: {\n ref: RefObject<HTMLDivElement>;\n type: \"back\";\n vertical: boolean;\n };\n forwardProps: {\n ref: RefObject<HTMLDivElement>;\n type: \"forward\";\n vertical: boolean;\n };\n}\n\n/**\n * @internal\n */\nexport function useTabList(\n options: TabListHookOptions\n): TabListHookReturnValue {\n const {\n ref: propRef,\n style,\n activeIndex,\n scrollButtons,\n onClick = noop,\n onFocus,\n onKeyDown,\n activationMode,\n vertical,\n setActiveIndex,\n disableTransition,\n } = options;\n\n const isRTL = useDir().dir === \"rtl\";\n\n const [indicatorStyles, setIndicatorStyles] =\n useState<IndicatorCSSProperties>(() => {\n const tabWidth = `${100 / 3}%`;\n return {\n [TAB_SIZE_VAR]: tabWidth,\n [TAB_OFFSET_VAR]: \"0px\",\n };\n });\n\n const [nodeRef, ref] = useEnsuredRef(propRef);\n const tabListRef = useResizeObserver({\n ref,\n disabled: disableTransition,\n onUpdate: useCallback(\n (entry) => {\n // this is kind of hacky -- the styles should update when switching between\n // RTL, but the RTL state isn't required for any styles. Just reference it\n // so that the hooks eslint rule doesn't show a warning...\n isRTL;\n\n const activeTab = getTabRoleOnly(entry.target)[activeIndex];\n if (!activeTab) {\n return;\n }\n\n const size = vertical ? activeTab.offsetHeight : activeTab.offsetWidth;\n const offset = vertical ? activeTab.offsetTop : activeTab.offsetLeft;\n const cssVars: IndicatorCSSProperties = {\n [TAB_SIZE_VAR]: `${size}px`,\n [TAB_OFFSET_VAR]: `${offset}px`,\n };\n\n setIndicatorStyles((prevStyles) => {\n if (\n prevStyles &&\n prevStyles[TAB_SIZE_VAR] === cssVars[TAB_SIZE_VAR] &&\n prevStyles[TAB_OFFSET_VAR] === cssVars[TAB_OFFSET_VAR]\n ) {\n return prevStyles;\n }\n\n return cssVars;\n });\n },\n [activeIndex, isRTL, vertical]\n ),\n });\n const forwardRef = useRef<HTMLDivElement>(null);\n const backwardRef = useRef<HTMLDivElement>(null);\n const { movementProps, movementContext } = useKeyboardMovementProvider({\n onClick(event) {\n onClick(event);\n if (event.isPropagationStopped() || !(event.target instanceof Element)) {\n return;\n }\n\n const clickedTab = event.target.closest(\"[role='tab']\");\n const tabs = getTabRoleOnly(event.currentTarget);\n const i = tabs.findIndex((tab) => tab === clickedTab);\n if (i !== -1) {\n setActiveIndex(i);\n }\n },\n onFocus,\n onKeyDown,\n onFocusChange(event) {\n const { index } = event;\n if (activationMode === \"automatic\") {\n setActiveIndex(index);\n } else if (scrollButtons) {\n scrollTabIntoView({\n activeIndex: index,\n backward: backwardRef.current,\n container: nodeRef.current,\n forward: forwardRef.current,\n vertical,\n });\n }\n },\n loopable: true,\n searchable: true,\n horizontal: !vertical,\n includeDisabled: true,\n tabIndexBehavior: \"roving\",\n getFocusableElements: getTabRoleOnly,\n });\n\n useEffect(() => {\n scrollTabIntoView({\n activeIndex,\n backward: backwardRef.current,\n container: nodeRef.current,\n forward: forwardRef.current,\n vertical,\n });\n }, [activeIndex, nodeRef, vertical]);\n\n return {\n elementProps: {\n \"aria-orientation\": vertical ? \"vertical\" : \"horizontal\",\n ref: tabListRef,\n style: {\n ...style,\n ...(disableTransition ? undefined : indicatorStyles),\n },\n ...movementProps,\n },\n backwardProps: {\n ref: backwardRef,\n type: \"back\",\n vertical,\n },\n forwardProps: {\n ref: forwardRef,\n type: \"forward\",\n vertical,\n },\n movementContext,\n };\n}\n"],"names":["useCallback","useEffect","useRef","useState","useKeyboardMovementProvider","useDir","useEnsuredRef","useResizeObserver","getTabRoleOnly","scrollTabIntoView","TAB_SIZE_VAR","TAB_OFFSET_VAR","noop","useTabList","options","ref","propRef","style","activeIndex","scrollButtons","onClick","onFocus","onKeyDown","activationMode","vertical","setActiveIndex","disableTransition","isRTL","dir","indicatorStyles","setIndicatorStyles","tabWidth","nodeRef","tabListRef","disabled","onUpdate","entry","activeTab","target","size","offsetHeight","offsetWidth","offset","offsetTop","offsetLeft","cssVars","prevStyles","forwardRef","backwardRef","movementProps","movementContext","event","isPropagationStopped","Element","clickedTab","closest","tabs","currentTarget","i","findIndex","tab","onFocusChange","index","backward","current","container","forward","loopable","searchable","horizontal","includeDisabled","tabIndexBehavior","getFocusableElements","elementProps","undefined","backwardProps","type","forwardProps"],"mappings":"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"}
1
+ {"version":3,"sources":["../../src/tabs/useTabList.ts"],"sourcesContent":["\"use client\";\nimport type {\n CSSProperties,\n FocusEventHandler,\n KeyboardEventHandler,\n MouseEventHandler,\n Ref,\n RefObject,\n} from \"react\";\nimport { useCallback, useEffect, useRef, useState } from \"react\";\nimport type {\n KeyboardMovementContext,\n KeyboardMovementProps,\n} from \"../movement/types.js\";\nimport { useKeyboardMovementProvider } from \"../movement/useKeyboardMovementProvider.js\";\nimport { useDir } from \"../typography/WritingDirectionProvider.js\";\nimport { useEnsuredRef } from \"../useEnsuredRef.js\";\nimport { useResizeObserver } from \"../useResizeObserver.js\";\nimport { getTabRoleOnly, scrollTabIntoView } from \"./utils.js\";\n\ndeclare module \"react\" {\n interface CSSProperties {\n \"--rmd-tab-size\"?: string;\n \"--rmd-tab-offset\"?: string | number;\n \"--rmd-tab-indicator-background\"?: string;\n }\n}\n\nconst TAB_SIZE_VAR = \"--rmd-tab-size\";\nconst TAB_OFFSET_VAR = \"--rmd-tab-offset\";\n\nconst noop = (): void => {\n // do nothing\n};\n\nexport type TabWidthVar = typeof TAB_SIZE_VAR;\nexport type TabOffsetVar = typeof TAB_OFFSET_VAR;\n\nexport type IndicatorCSSProperties = CSSProperties &\n Record<TabWidthVar | TabOffsetVar, string>;\n\nexport interface TabListHookOptions {\n ref: Ref<HTMLDivElement> | undefined;\n style: CSSProperties | undefined;\n activeIndex: number;\n setActiveIndex(nextActiveIndex: number): void;\n scrollButtons: boolean;\n activationMode: \"manual\" | \"automatic\";\n vertical: boolean;\n onClick: MouseEventHandler<HTMLDivElement> | undefined;\n onFocus: FocusEventHandler<HTMLDivElement> | undefined;\n onKeyDown: KeyboardEventHandler<HTMLDivElement> | undefined;\n disableTransition: boolean;\n}\n\nexport interface TabListHookReturnValue {\n elementProps: KeyboardMovementProps<HTMLDivElement> & {\n \"aria-orientation\": \"horizontal\" | \"vertical\";\n style: CSSProperties;\n ref: Ref<HTMLDivElement>;\n onClick: MouseEventHandler<HTMLDivElement>;\n };\n movementContext: KeyboardMovementContext;\n backwardProps: {\n ref: RefObject<HTMLDivElement>;\n type: \"back\";\n vertical: boolean;\n };\n forwardProps: {\n ref: RefObject<HTMLDivElement>;\n type: \"forward\";\n vertical: boolean;\n };\n}\n\n/**\n * @internal\n */\nexport function useTabList(\n options: TabListHookOptions\n): TabListHookReturnValue {\n const {\n ref: propRef,\n style,\n activeIndex,\n scrollButtons,\n onClick = noop,\n onFocus,\n onKeyDown,\n activationMode,\n vertical,\n setActiveIndex,\n disableTransition,\n } = options;\n\n const isRTL = useDir().dir === \"rtl\";\n\n const [indicatorStyles, setIndicatorStyles] =\n useState<IndicatorCSSProperties>(() => {\n const tabWidth = `${100 / 3}%`;\n return {\n [TAB_SIZE_VAR]: tabWidth,\n [TAB_OFFSET_VAR]: \"0px\",\n };\n });\n\n const [nodeRef, ref] = useEnsuredRef(propRef);\n const tabListRef = useResizeObserver({\n ref,\n disabled: disableTransition,\n onUpdate: useCallback(\n (entry) => {\n // this is kind of hacky -- the styles should update when switching between\n // RTL, but the RTL state isn't required for any styles. Just reference it\n // so that the hooks eslint rule doesn't show a warning...\n isRTL;\n\n const activeTab = getTabRoleOnly(entry.target)[activeIndex];\n if (!activeTab) {\n return;\n }\n\n const size = vertical ? activeTab.offsetHeight : activeTab.offsetWidth;\n const offset = vertical ? activeTab.offsetTop : activeTab.offsetLeft;\n const cssVars: IndicatorCSSProperties = {\n [TAB_SIZE_VAR]: `${size}px`,\n [TAB_OFFSET_VAR]: `${offset}px`,\n };\n\n setIndicatorStyles((prevStyles) => {\n if (\n prevStyles &&\n prevStyles[TAB_SIZE_VAR] === cssVars[TAB_SIZE_VAR] &&\n prevStyles[TAB_OFFSET_VAR] === cssVars[TAB_OFFSET_VAR]\n ) {\n return prevStyles;\n }\n\n return cssVars;\n });\n },\n [activeIndex, isRTL, vertical]\n ),\n });\n const forwardRef = useRef<HTMLDivElement>(null);\n const backwardRef = useRef<HTMLDivElement>(null);\n const { movementProps, movementContext } = useKeyboardMovementProvider({\n onClick(event) {\n onClick(event);\n if (event.isPropagationStopped() || !(event.target instanceof Element)) {\n return;\n }\n\n const clickedTab = event.target.closest(\"[role='tab']\");\n const tabs = getTabRoleOnly(event.currentTarget);\n const i = tabs.findIndex((tab) => tab === clickedTab);\n if (i !== -1) {\n setActiveIndex(i);\n }\n },\n onFocus,\n onKeyDown,\n onFocusChange(event) {\n const { index } = event;\n if (activationMode === \"automatic\") {\n setActiveIndex(index);\n } else if (scrollButtons) {\n scrollTabIntoView({\n activeIndex: index,\n backward: backwardRef.current,\n container: nodeRef.current,\n forward: forwardRef.current,\n vertical,\n });\n }\n },\n loopable: true,\n searchable: true,\n horizontal: !vertical,\n includeDisabled: true,\n tabIndexBehavior: \"roving\",\n getFocusableElements: getTabRoleOnly,\n });\n\n useEffect(() => {\n scrollTabIntoView({\n activeIndex,\n backward: backwardRef.current,\n container: nodeRef.current,\n forward: forwardRef.current,\n vertical,\n });\n }, [activeIndex, nodeRef, vertical]);\n\n return {\n elementProps: {\n \"aria-orientation\": vertical ? \"vertical\" : \"horizontal\",\n ref: tabListRef,\n style: {\n ...style,\n ...(disableTransition ? undefined : indicatorStyles),\n },\n ...movementProps,\n },\n backwardProps: {\n ref: backwardRef,\n type: \"back\",\n vertical,\n },\n forwardProps: {\n ref: forwardRef,\n type: \"forward\",\n vertical,\n },\n movementContext,\n };\n}\n"],"names":["useCallback","useEffect","useRef","useState","useKeyboardMovementProvider","useDir","useEnsuredRef","useResizeObserver","getTabRoleOnly","scrollTabIntoView","TAB_SIZE_VAR","TAB_OFFSET_VAR","noop","useTabList","options","ref","propRef","style","activeIndex","scrollButtons","onClick","onFocus","onKeyDown","activationMode","vertical","setActiveIndex","disableTransition","isRTL","dir","indicatorStyles","setIndicatorStyles","tabWidth","nodeRef","tabListRef","disabled","onUpdate","entry","activeTab","target","size","offsetHeight","offsetWidth","offset","offsetTop","offsetLeft","cssVars","prevStyles","forwardRef","backwardRef","movementProps","movementContext","event","isPropagationStopped","Element","clickedTab","closest","tabs","currentTarget","i","findIndex","tab","onFocusChange","index","backward","current","container","forward","loopable","searchable","horizontal","includeDisabled","tabIndexBehavior","getFocusableElements","elementProps","undefined","backwardProps","type","forwardProps"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/tabs/useTabs.ts"],"sourcesContent":["\"use client\";\nimport type { Dispatch, Ref, RefObject } from \"react\";\nimport { useEffect, useRef, useState } from \"react\";\nimport type { SlideDirection } from \"../transition/SlideContainer.js\";\nimport type { UseStateInitializer, UseStateSetter } from \"../types.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\nimport { useEnsuredState } from \"../useEnsuredState.js\";\n\nconst EMPTY_LIST = [] as const;\nconst PANEL_PREFIX = \"panel-\";\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface TabsHookOptions<TabValue extends string | number = number> {\n /**\n * This can be used to generate the ids for the different components within\n * the tab widget.\n *\n * @defaultValue `\"tab-\" + useId()`\n */\n baseId?: string;\n\n /**\n * Set this to `true` if changing active tabs should no longer attempt to\n * scroll to the top of the tab panels container when using the\n * {@link TabsImplementation.getTabPanelsProps}.\n *\n * @defaultValue `false`\n */\n disableScrollFix?: boolean;\n\n /**\n * Set this to an **ordered** list of tab values when:\n * - using a `string` tab value\n * - using a `number` tab value does not represent a tab index\n *\n * See the examples on the {@link useTabs} for usage.\n */\n tabs?: readonly TabValue[];\n\n /**\n * Provide this value and {@link setActiveTab} to control the active tab\n * behavior.\n */\n activeTab?: TabValue;\n\n /** @see {@link activeTab} */\n setActiveTab?: Dispatch<TabValue>;\n\n /**\n * Set this to the default tab index when not controlling the active tab value\n * through {@link activeTab} and {@link setActiveTab}.\n *\n * @defaultValue `0`\n */\n defaultActiveTab?: UseStateInitializer<TabValue>;\n}\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface ProvidedTabProps {\n \"aria-controls\": string;\n id: string;\n active: boolean;\n}\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface ProvidedTabListProps {\n activeIndex: number;\n setActiveIndex: Dispatch<number>;\n}\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface ProvidedTabPanelProps {\n \"aria-labelledby\": string;\n id: string;\n role: \"tabpanel\";\n active: boolean;\n}\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface ProvidedTabPanelsProps<E extends HTMLElement> {\n ref: Ref<E>;\n direction: SlideDirection;\n}\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface TabsImplementation<TabValue extends string | number = number> {\n direction: SlideDirection;\n setDirection: UseStateSetter<SlideDirection>;\n activeTab?: TabValue;\n setActiveTab?(nextActiveTab: TabValue): void;\n getTabProps(tabValue: TabValue): ProvidedTabProps;\n getTabListProps(): ProvidedTabListProps;\n getTabPanelProps(tabValue: TabValue): ProvidedTabPanelProps;\n getTabPanelsProps<E extends HTMLElement>(): ProvidedTabPanelsProps<E>;\n}\n\n/**\n * @example\n * Super Simple\n * ```tsx\n * import { TabList, Tab, SlideContainer, Slide, useTabs } from \"@react-md/core\";\n * import type { ReactElement } from \"react\";\n *\n * function Example(): ReactElement {\n * const {\n * activeTab,\n * setActiveTab,\n * direction,\n * setDirection,\n * getTabListProps,\n * getTabPanelProps,\n * getTabPanelsProps,\n * getTabProps,\n * } = useTabs();\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 {...getTabPanelsProps()}>\n * <Slide {...getTabPanelProps(0)}>Tab 1 Content</Slide>\n * <Slide {...getTabPanelProps(1)}>Tab 2 Content</Slide>\n * <Slide {...getTabPanelProps(2)}>Tab 3 Content</Slide>\n * </SlideContainer>\n * </>\n * );\n * }\n * ```\n *\n * @remarks \\@since 6.0.0\n */\nexport function useTabs(): TabsImplementation<number> & {\n activeTab: number;\n setActiveTab: number;\n};\n/**\n * The tab behavior can be controlled by providing the `activeTab` and\n * `setActiveTab` options.\n *\n * @example\n * Controlled\n * ```tsx\n * import { TabList, Tab, SlideContainer, Slide, useTabs } from \"@react-md/core\";\n * import type { ReactElement } from \"react\";\n * import { useState } from \"react\";\n *\n * function Example(): ReactElement {\n * const [activeTab, setActiveTab] = useState(1);\n *\n * const {\n * direction,\n * setDirection,\n * getTabListProps,\n * getTabPanelProps,\n * getTabPanelsProps,\n * getTabProps,\n * } = useTabs({\n * activeTab,\n * setActiveTab,\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 {...getTabPanelsProps()}>\n * <Slide {...getTabPanelProps(0)}>Tab 1 Content</Slide>\n * <Slide {...getTabPanelProps(1)}>Tab 2 Content</Slide>\n * <Slide {...getTabPanelProps(2)}>Tab 3 Content</Slide>\n * </SlideContainer>\n * </>\n * );\n * }\n * ```\n *\n * @remarks \\@since 6.0.0\n */\nexport function useTabs<TabValue extends number>(\n options: TabsHookOptions<TabValue> & {\n tabs?: readonly TabValue[];\n activeTab: TabValue;\n setActiveTab: Dispatch<TabValue>;\n defaultActiveTab?: never;\n }\n): TabsImplementation<TabValue> & { activeTab?: never; setActiveTab?: never };\nexport function useTabs<TabValue extends number>(\n options: TabsHookOptions<TabValue> & {\n tabs?: readonly TabValue[];\n activeTab?: never;\n setActiveTab?: never;\n defaultActiveTab?: UseStateInitializer<TabValue>;\n }\n): TabsImplementation<TabValue> & {\n activeTab: TabValue;\n setActiveTab: Dispatch<TabValue>;\n};\n/**\n * When using string values, the {@link TabsHookOptions.tabs} option **must** be\n * provided to determine the correct active tab index.\n *\n * @example\n * String Value Simple\n * ```tsx\n * import { TabList, Tab, SlideContainer, Slide, useTabs } from \"@react-md/core\";\n * import type { ReactElement } from \"react\";\n *\n * const tabs = [\"value-1\", \"value-2\", \"value-3\"];\n *\n * function Example(): ReactElement {\n * const {\n * activeTab,\n * setActiveTab,\n * direction,\n * setDirection,\n * getTabListProps,\n * getTabPanelProps,\n * getTabPanelsProps,\n * getTabProps,\n * } = useTabs({ tabs });\n *\n * return (\n * <>\n * <TabList {...getTabListProps()}>\n * {tabs.map((value) => (\n * <Tab key={value} {...getTabProps(value)}>{value}</Tab>\n * ))}\n * </TabList>\n * <SlideContainer {...getTabPanelsProps()}>\n * {tabs.map((value) => (\n * <Slide key={value}>{value} Content</Slide>\n * ))}\n * </SlideContainer>\n * </>\n * );\n * }\n * ```\n *\n * @remarks \\@since 6.0.0\n */\nexport function useTabs<TabValue extends string>(\n options: TabsHookOptions<TabValue> & {\n tabs: readonly TabValue[];\n activeTab?: never;\n setActiveTab?: never;\n defaultActiveTab?: UseStateInitializer<TabValue>;\n }\n): TabsImplementation<TabValue> & {\n activeTab: TabValue;\n setActiveTab: Dispatch<TabValue>;\n};\n/**\n * When using string values, the {@link TabsHookOptions.tabs} option **must** be\n * provided to determine the correct active tab index.\n *\n * @example\n * String Controlled Simple\n * ```tsx\n * import { TabList, Tab, SlideContainer, Slide, useTabs } from \"@react-md/core\";\n * import type { ReactElement } from \"react\";\n *\n * const tabs = [\"value-1\", \"value-2\", \"value-3\"] as const;\n *\n * function Example(): ReactElement {\n * const [activeTab, setActiveTab] = useState(tabs[0]);\n *\n * const {\n * direction,\n * setDirection,\n * getTabListProps,\n * getTabPanelProps,\n * getTabPanelsProps,\n * getTabProps,\n * } = useTabs({\n * tabs,\n * activeTab,\n * setActiveTab,\n * });\n *\n * return (\n * <>\n * <TabList {...getTabListProps()}>\n * {tabs.map((value) => (\n * <Tab key={value} {...getTabProps(value)}>{value}</Tab>\n * ))}\n * </TabList>\n * <SlideContainer {...getTabPanelsProps()}>\n * {tabs.map((value) => (\n * <Slide key={value}>{value} Content</Slide>\n * ))}\n * </SlideContainer>\n * </>\n * );\n * }\n * ```\n *\n * @example\n * Navigation Tabs\n * ```tsx\n * \"use client\";\n * import {\n * RippleContainer,\n * Tab,\n * TabList,\n * useElementInteraction,\n * useEnsuredId,\n * useHigherContrastChildren,\n * useKeyboardMovementContext,\n * useTabs,\n * } from \"@react-md/core\";\n * import type { LinkProps } from \"next/link\";\n * import Link from \"next/link\";\n * import type { PropsWithChildren, ReactElement } from \"react\";\n * import { usePathname } from \"next/navigation\";\n *\n * interface TabLinkProps extends LinkProps {\n * active: boolean;\n * }\n *\n * function TabLink(props: LinkProps): ReactElement {\n * const {\n * id: propId,\n * children: propChildren,\n * active,\n * className,\n * ...remaining,\n * } = props;\n *\n * const id = useEnsuredId(propId, \"tab\");\n * const { activeDescendantId } = useKeyboardMovementContext();\n * const { handlers, ripples } = useElementInteraction(props);\n * const children = useHigherContrastChildren(propChildren);\n *\n * return (\n * <Link\n * {...props}\n * {...handlers}\n * id={id}\n * aria-selected={active}\n * role=\"tab\"\n * tabIndex={id === activeDescendantId ? 0 : -1}\n * className={tab({\n * className,\n * active,\n * // stacked,\n * // reversed,\n * })}\n * >\n * {children}\n * {ripples}\n * </Link>\n * );\n * }\n *\n * const noop = (): void => {\n * // do nothing\n * };\n *\n * const PATHNAME_TABS = [\"/\", \"/page-1\", \"/page-2\"];\n *\n * function Layout({ children }: PropsWithChildren) {\n * const pathname = usePathname();\n * const { getTabListProps, getTabProps } = useTabs({\n * tabs: PATHNAME_TABS,\n * activeTab: pathname,\n * setActiveTab: noop,\n * });\n *\n * return (\n * <>\n * <TabList {...getTabListProps()}>\n * <TabLink {...getTabProps(\"/\")} href=\"/\">Home</TabLink>\n * <TabLink {...getTabProps(\"/page-1\")} href=\"/page-1\">Page 1</TabLink>\n * <TabLink {...getTabProps(\"/page-2\")} href=\"/page-2\">Page 2</TabLink>\n * </TabList>\n * <main>{children}</main>\n * </>\n * );\n * }\n * ```\n *\n * @remarks \\@since 6.0.0\n */\nexport function useTabs<TabValue extends string>(\n options: TabsHookOptions<TabValue> & {\n tabs: readonly TabValue[];\n activeTab: TabValue;\n setActiveTab: Dispatch<TabValue>;\n defaultActiveTab?: never;\n }\n): TabsImplementation<TabValue> & { activeTab?: never; setActiveTab?: never };\n/**\n * This hook can be uncontrolled/controlled and supports strongly typing the tab\n * values if needed. Check out the overloads for examples.\n *\n * @remarks \\@since 6.0.0\n */\nexport function useTabs<TabValue extends string | number>(\n options: TabsHookOptions<TabValue> = {}\n): TabsImplementation<TabValue> {\n const {\n baseId: propBaseId,\n disableScrollFix,\n tabs = EMPTY_LIST,\n activeTab: propActiveTab,\n setActiveTab: propSetActiveTab,\n defaultActiveTab,\n } = options;\n\n const baseId = useEnsuredId(propBaseId, \"tab\");\n const [direction, setDirection] = useState<SlideDirection>(\"left\");\n\n const [activeTab, setActiveTab] = useEnsuredState({\n value: propActiveTab,\n setValue: propSetActiveTab,\n defaultValue: defaultActiveTab ?? (0 as TabValue),\n });\n\n const getTabIndex = (tabValue: TabValue): number =>\n typeof tabValue === \"string\" || tabs.length > 0\n ? tabs.indexOf(tabValue)\n : tabValue;\n const getTabId = (tabValue: TabValue, prefix = \"\"): string =>\n `${baseId}-${prefix}${getTabIndex(tabValue) + 1}`;\n\n const activeIndex = getTabIndex(activeTab);\n const tabPanelsRef = useRef<HTMLElement>(null);\n useEffect(() => {\n const container = tabPanelsRef.current;\n if (!container || disableScrollFix) {\n return;\n }\n\n container.scrollTop = 0;\n }, [disableScrollFix, activeTab]);\n\n return {\n activeTab,\n setActiveTab,\n direction,\n setDirection,\n getTabProps(tabValue) {\n return {\n \"aria-controls\": getTabId(tabValue, PANEL_PREFIX),\n id: getTabId(tabValue),\n active: tabValue === activeTab,\n };\n },\n getTabListProps() {\n return {\n activeIndex,\n setActiveIndex: (nextActiveIndex) => {\n setDirection(activeIndex < nextActiveIndex ? \"left\" : \"right\");\n if (typeof activeTab === \"string\" || tabs.length > 0) {\n setActiveTab(tabs[nextActiveIndex]);\n } else {\n setActiveTab(nextActiveIndex as TabValue);\n }\n },\n };\n },\n getTabPanelProps(tabValue) {\n return {\n \"aria-labelledby\": getTabId(tabValue),\n id: getTabId(tabValue, PANEL_PREFIX),\n role: \"tabpanel\",\n active: tabValue === activeTab,\n };\n },\n getTabPanelsProps<E>() {\n return {\n ref: tabPanelsRef as RefObject<E>,\n direction,\n };\n },\n };\n}\n"],"names":["useEffect","useRef","useState","useEnsuredId","useEnsuredState","EMPTY_LIST","PANEL_PREFIX","useTabs","options","baseId","propBaseId","disableScrollFix","tabs","activeTab","propActiveTab","setActiveTab","propSetActiveTab","defaultActiveTab","direction","setDirection","value","setValue","defaultValue","getTabIndex","tabValue","length","indexOf","getTabId","prefix","activeIndex","tabPanelsRef","container","current","scrollTop","getTabProps","id","active","getTabListProps","setActiveIndex","nextActiveIndex","getTabPanelProps","role","getTabPanelsProps","ref"],"mappings":"AAAA;AAEA,SAASA,SAAS,EAAEC,MAAM,EAAEC,QAAQ,QAAQ,QAAQ;AAGpD,SAASC,YAAY,QAAQ,qBAAqB;AAClD,SAASC,eAAe,QAAQ,wBAAwB;AAExD,MAAMC,aAAa,EAAE;AACrB,MAAMC,eAAe;AA+YrB;;;;;CAKC,GACD,OAAO,SAASC,QACdC,UAAqC,CAAC,CAAC;IAEvC,MAAM,EACJC,QAAQC,UAAU,EAClBC,gBAAgB,EAChBC,OAAOP,UAAU,EACjBQ,WAAWC,aAAa,EACxBC,cAAcC,gBAAgB,EAC9BC,gBAAgB,EACjB,GAAGT;IAEJ,MAAMC,SAASN,aAAaO,YAAY;IACxC,MAAM,CAACQ,WAAWC,aAAa,GAAGjB,SAAyB;IAE3D,MAAM,CAACW,WAAWE,aAAa,GAAGX,gBAAgB;QAChDgB,OAAON;QACPO,UAAUL;QACVM,cAAcL,oBAAqB;IACrC;IAEA,MAAMM,cAAc,CAACC,WACnB,OAAOA,aAAa,YAAYZ,KAAKa,MAAM,GAAG,IAC1Cb,KAAKc,OAAO,CAACF,YACbA;IACN,MAAMG,WAAW,CAACH,UAAoBI,SAAS,EAAE,GAC/C,CAAC,EAAEnB,OAAO,CAAC,EAAEmB,OAAO,EAAEL,YAAYC,YAAY,EAAE,CAAC;IAEnD,MAAMK,cAAcN,YAAYV;IAChC,MAAMiB,eAAe7B,OAAoB;IACzCD,UAAU;QACR,MAAM+B,YAAYD,aAAaE,OAAO;QACtC,IAAI,CAACD,aAAapB,kBAAkB;YAClC;QACF;QAEAoB,UAAUE,SAAS,GAAG;IACxB,GAAG;QAACtB;QAAkBE;KAAU;IAEhC,OAAO;QACLA;QACAE;QACAG;QACAC;QACAe,aAAYV,QAAQ;YAClB,OAAO;gBACL,iBAAiBG,SAASH,UAAUlB;gBACpC6B,IAAIR,SAASH;gBACbY,QAAQZ,aAAaX;YACvB;QACF;QACAwB;YACE,OAAO;gBACLR;gBACAS,gBAAgB,CAACC;oBACfpB,aAAaU,cAAcU,kBAAkB,SAAS;oBACtD,IAAI,OAAO1B,cAAc,YAAYD,KAAKa,MAAM,GAAG,GAAG;wBACpDV,aAAaH,IAAI,CAAC2B,gBAAgB;oBACpC,OAAO;wBACLxB,aAAawB;oBACf;gBACF;YACF;QACF;QACAC,kBAAiBhB,QAAQ;YACvB,OAAO;gBACL,mBAAmBG,SAASH;gBAC5BW,IAAIR,SAASH,UAAUlB;gBACvBmC,MAAM;gBACNL,QAAQZ,aAAaX;YACvB;QACF;QACA6B;YACE,OAAO;gBACLC,KAAKb;gBACLZ;YACF;QACF;IACF;AACF"}
1
+ {"version":3,"sources":["../../src/tabs/useTabs.ts"],"sourcesContent":["\"use client\";\nimport type { Dispatch, Ref, RefObject } from \"react\";\nimport { useEffect, useRef, useState } from \"react\";\nimport type { SlideDirection } from \"../transition/SlideContainer.js\";\nimport type { UseStateInitializer, UseStateSetter } from \"../types.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\nimport { useEnsuredState } from \"../useEnsuredState.js\";\n\nconst EMPTY_LIST = [] as const;\nconst PANEL_PREFIX = \"panel-\";\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface TabsHookOptions<TabValue extends string | number = number> {\n /**\n * This can be used to generate the ids for the different components within\n * the tab widget.\n *\n * @defaultValue `\"tab-\" + useId()`\n */\n baseId?: string;\n\n /**\n * Set this to `true` if changing active tabs should no longer attempt to\n * scroll to the top of the tab panels container when using the\n * {@link TabsImplementation.getTabPanelsProps}.\n *\n * @defaultValue `false`\n */\n disableScrollFix?: boolean;\n\n /**\n * Set this to an **ordered** list of tab values when:\n * - using a `string` tab value\n * - using a `number` tab value does not represent a tab index\n *\n * See the examples on the {@link useTabs} for usage.\n */\n tabs?: readonly TabValue[];\n\n /**\n * Provide this value and {@link setActiveTab} to control the active tab\n * behavior.\n */\n activeTab?: TabValue;\n\n /** @see {@link activeTab} */\n setActiveTab?: Dispatch<TabValue>;\n\n /**\n * Set this to the default tab index when not controlling the active tab value\n * through {@link activeTab} and {@link setActiveTab}.\n *\n * @defaultValue `0`\n */\n defaultActiveTab?: UseStateInitializer<TabValue>;\n}\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface ProvidedTabProps {\n \"aria-controls\": string;\n id: string;\n active: boolean;\n}\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface ProvidedTabListProps {\n activeIndex: number;\n setActiveIndex: Dispatch<number>;\n}\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface ProvidedTabPanelProps {\n \"aria-labelledby\": string;\n id: string;\n role: \"tabpanel\";\n active: boolean;\n}\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface ProvidedTabPanelsProps<E extends HTMLElement> {\n ref: Ref<E>;\n direction: SlideDirection;\n}\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface TabsImplementation<TabValue extends string | number = number> {\n direction: SlideDirection;\n setDirection: UseStateSetter<SlideDirection>;\n activeTab?: TabValue;\n setActiveTab?(nextActiveTab: TabValue): void;\n getTabProps(tabValue: TabValue): ProvidedTabProps;\n getTabListProps(): ProvidedTabListProps;\n getTabPanelProps(tabValue: TabValue): ProvidedTabPanelProps;\n getTabPanelsProps<E extends HTMLElement>(): ProvidedTabPanelsProps<E>;\n}\n\n/**\n * @example\n * Super Simple\n * ```tsx\n * import { TabList, Tab, SlideContainer, Slide, useTabs } from \"@react-md/core\";\n * import type { ReactElement } from \"react\";\n *\n * function Example(): ReactElement {\n * const {\n * activeTab,\n * setActiveTab,\n * direction,\n * setDirection,\n * getTabListProps,\n * getTabPanelProps,\n * getTabPanelsProps,\n * getTabProps,\n * } = useTabs();\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 {...getTabPanelsProps()}>\n * <Slide {...getTabPanelProps(0)}>Tab 1 Content</Slide>\n * <Slide {...getTabPanelProps(1)}>Tab 2 Content</Slide>\n * <Slide {...getTabPanelProps(2)}>Tab 3 Content</Slide>\n * </SlideContainer>\n * </>\n * );\n * }\n * ```\n *\n * @remarks \\@since 6.0.0\n */\nexport function useTabs(): TabsImplementation<number> & {\n activeTab: number;\n setActiveTab: number;\n};\n/**\n * The tab behavior can be controlled by providing the `activeTab` and\n * `setActiveTab` options.\n *\n * @example\n * Controlled\n * ```tsx\n * import { TabList, Tab, SlideContainer, Slide, useTabs } from \"@react-md/core\";\n * import type { ReactElement } from \"react\";\n * import { useState } from \"react\";\n *\n * function Example(): ReactElement {\n * const [activeTab, setActiveTab] = useState(1);\n *\n * const {\n * direction,\n * setDirection,\n * getTabListProps,\n * getTabPanelProps,\n * getTabPanelsProps,\n * getTabProps,\n * } = useTabs({\n * activeTab,\n * setActiveTab,\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 {...getTabPanelsProps()}>\n * <Slide {...getTabPanelProps(0)}>Tab 1 Content</Slide>\n * <Slide {...getTabPanelProps(1)}>Tab 2 Content</Slide>\n * <Slide {...getTabPanelProps(2)}>Tab 3 Content</Slide>\n * </SlideContainer>\n * </>\n * );\n * }\n * ```\n *\n * @remarks \\@since 6.0.0\n */\nexport function useTabs<TabValue extends number>(\n options: TabsHookOptions<TabValue> & {\n tabs?: readonly TabValue[];\n activeTab: TabValue;\n setActiveTab: Dispatch<TabValue>;\n defaultActiveTab?: never;\n }\n): TabsImplementation<TabValue> & { activeTab?: never; setActiveTab?: never };\nexport function useTabs<TabValue extends number>(\n options: TabsHookOptions<TabValue> & {\n tabs?: readonly TabValue[];\n activeTab?: never;\n setActiveTab?: never;\n defaultActiveTab?: UseStateInitializer<TabValue>;\n }\n): TabsImplementation<TabValue> & {\n activeTab: TabValue;\n setActiveTab: Dispatch<TabValue>;\n};\n/**\n * When using string values, the {@link TabsHookOptions.tabs} option **must** be\n * provided to determine the correct active tab index.\n *\n * @example\n * String Value Simple\n * ```tsx\n * import { TabList, Tab, SlideContainer, Slide, useTabs } from \"@react-md/core\";\n * import type { ReactElement } from \"react\";\n *\n * const tabs = [\"value-1\", \"value-2\", \"value-3\"];\n *\n * function Example(): ReactElement {\n * const {\n * activeTab,\n * setActiveTab,\n * direction,\n * setDirection,\n * getTabListProps,\n * getTabPanelProps,\n * getTabPanelsProps,\n * getTabProps,\n * } = useTabs({ tabs });\n *\n * return (\n * <>\n * <TabList {...getTabListProps()}>\n * {tabs.map((value) => (\n * <Tab key={value} {...getTabProps(value)}>{value}</Tab>\n * ))}\n * </TabList>\n * <SlideContainer {...getTabPanelsProps()}>\n * {tabs.map((value) => (\n * <Slide key={value}>{value} Content</Slide>\n * ))}\n * </SlideContainer>\n * </>\n * );\n * }\n * ```\n *\n * @remarks \\@since 6.0.0\n */\nexport function useTabs<TabValue extends string>(\n options: TabsHookOptions<TabValue> & {\n tabs: readonly TabValue[];\n activeTab?: never;\n setActiveTab?: never;\n defaultActiveTab?: UseStateInitializer<TabValue>;\n }\n): TabsImplementation<TabValue> & {\n activeTab: TabValue;\n setActiveTab: Dispatch<TabValue>;\n};\n/**\n * When using string values, the {@link TabsHookOptions.tabs} option **must** be\n * provided to determine the correct active tab index.\n *\n * @example\n * String Controlled Simple\n * ```tsx\n * import { TabList, Tab, SlideContainer, Slide, useTabs } from \"@react-md/core\";\n * import type { ReactElement } from \"react\";\n *\n * const tabs = [\"value-1\", \"value-2\", \"value-3\"] as const;\n *\n * function Example(): ReactElement {\n * const [activeTab, setActiveTab] = useState(tabs[0]);\n *\n * const {\n * direction,\n * setDirection,\n * getTabListProps,\n * getTabPanelProps,\n * getTabPanelsProps,\n * getTabProps,\n * } = useTabs({\n * tabs,\n * activeTab,\n * setActiveTab,\n * });\n *\n * return (\n * <>\n * <TabList {...getTabListProps()}>\n * {tabs.map((value) => (\n * <Tab key={value} {...getTabProps(value)}>{value}</Tab>\n * ))}\n * </TabList>\n * <SlideContainer {...getTabPanelsProps()}>\n * {tabs.map((value) => (\n * <Slide key={value}>{value} Content</Slide>\n * ))}\n * </SlideContainer>\n * </>\n * );\n * }\n * ```\n *\n * @example\n * Navigation Tabs\n * ```tsx\n * \"use client\";\n * import {\n * RippleContainer,\n * Tab,\n * TabList,\n * useElementInteraction,\n * useEnsuredId,\n * useHigherContrastChildren,\n * useKeyboardMovementContext,\n * useTabs,\n * } from \"@react-md/core\";\n * import type { LinkProps } from \"next/link\";\n * import Link from \"next/link\";\n * import type { PropsWithChildren, ReactElement } from \"react\";\n * import { usePathname } from \"next/navigation\";\n *\n * interface TabLinkProps extends LinkProps {\n * active: boolean;\n * }\n *\n * function TabLink(props: LinkProps): ReactElement {\n * const {\n * id: propId,\n * children: propChildren,\n * active,\n * className,\n * ...remaining,\n * } = props;\n *\n * const id = useEnsuredId(propId, \"tab\");\n * const { activeDescendantId } = useKeyboardMovementContext();\n * const { handlers, ripples } = useElementInteraction(props);\n * const children = useHigherContrastChildren(propChildren);\n *\n * return (\n * <Link\n * {...props}\n * {...handlers}\n * id={id}\n * aria-selected={active}\n * role=\"tab\"\n * tabIndex={id === activeDescendantId ? 0 : -1}\n * className={tab({\n * className,\n * active,\n * // stacked,\n * // reversed,\n * })}\n * >\n * {children}\n * {ripples}\n * </Link>\n * );\n * }\n *\n * const noop = (): void => {\n * // do nothing\n * };\n *\n * const PATHNAME_TABS = [\"/\", \"/page-1\", \"/page-2\"];\n *\n * function Layout({ children }: PropsWithChildren) {\n * const pathname = usePathname();\n * const { getTabListProps, getTabProps } = useTabs({\n * tabs: PATHNAME_TABS,\n * activeTab: pathname,\n * setActiveTab: noop,\n * });\n *\n * return (\n * <>\n * <TabList {...getTabListProps()}>\n * <TabLink {...getTabProps(\"/\")} href=\"/\">Home</TabLink>\n * <TabLink {...getTabProps(\"/page-1\")} href=\"/page-1\">Page 1</TabLink>\n * <TabLink {...getTabProps(\"/page-2\")} href=\"/page-2\">Page 2</TabLink>\n * </TabList>\n * <main>{children}</main>\n * </>\n * );\n * }\n * ```\n *\n * @remarks \\@since 6.0.0\n */\nexport function useTabs<TabValue extends string>(\n options: TabsHookOptions<TabValue> & {\n tabs: readonly TabValue[];\n activeTab: TabValue;\n setActiveTab: Dispatch<TabValue>;\n defaultActiveTab?: never;\n }\n): TabsImplementation<TabValue> & { activeTab?: never; setActiveTab?: never };\n/**\n * This hook can be uncontrolled/controlled and supports strongly typing the tab\n * values if needed. Check out the overloads for examples.\n *\n * @remarks \\@since 6.0.0\n */\nexport function useTabs<TabValue extends string | number>(\n options: TabsHookOptions<TabValue> = {}\n): TabsImplementation<TabValue> {\n const {\n baseId: propBaseId,\n disableScrollFix,\n tabs = EMPTY_LIST,\n activeTab: propActiveTab,\n setActiveTab: propSetActiveTab,\n defaultActiveTab,\n } = options;\n\n const baseId = useEnsuredId(propBaseId, \"tab\");\n const [direction, setDirection] = useState<SlideDirection>(\"left\");\n\n const [activeTab, setActiveTab] = useEnsuredState({\n value: propActiveTab,\n setValue: propSetActiveTab,\n defaultValue: defaultActiveTab ?? (0 as TabValue),\n });\n\n const getTabIndex = (tabValue: TabValue): number =>\n typeof tabValue === \"string\" || tabs.length > 0\n ? tabs.indexOf(tabValue)\n : tabValue;\n const getTabId = (tabValue: TabValue, prefix = \"\"): string =>\n `${baseId}-${prefix}${getTabIndex(tabValue) + 1}`;\n\n const activeIndex = getTabIndex(activeTab);\n const tabPanelsRef = useRef<HTMLElement>(null);\n useEffect(() => {\n const container = tabPanelsRef.current;\n if (!container || disableScrollFix) {\n return;\n }\n\n container.scrollTop = 0;\n }, [disableScrollFix, activeTab]);\n\n return {\n activeTab,\n setActiveTab,\n direction,\n setDirection,\n getTabProps(tabValue) {\n return {\n \"aria-controls\": getTabId(tabValue, PANEL_PREFIX),\n id: getTabId(tabValue),\n active: tabValue === activeTab,\n };\n },\n getTabListProps() {\n return {\n activeIndex,\n setActiveIndex: (nextActiveIndex) => {\n setDirection(activeIndex < nextActiveIndex ? \"left\" : \"right\");\n if (typeof activeTab === \"string\" || tabs.length > 0) {\n setActiveTab(tabs[nextActiveIndex]);\n } else {\n setActiveTab(nextActiveIndex as TabValue);\n }\n },\n };\n },\n getTabPanelProps(tabValue) {\n return {\n \"aria-labelledby\": getTabId(tabValue),\n id: getTabId(tabValue, PANEL_PREFIX),\n role: \"tabpanel\",\n active: tabValue === activeTab,\n };\n },\n getTabPanelsProps<E>() {\n return {\n ref: tabPanelsRef as RefObject<E>,\n direction,\n };\n },\n };\n}\n"],"names":["useEffect","useRef","useState","useEnsuredId","useEnsuredState","EMPTY_LIST","PANEL_PREFIX","useTabs","options","baseId","propBaseId","disableScrollFix","tabs","activeTab","propActiveTab","setActiveTab","propSetActiveTab","defaultActiveTab","direction","setDirection","value","setValue","defaultValue","getTabIndex","tabValue","length","indexOf","getTabId","prefix","activeIndex","tabPanelsRef","container","current","scrollTop","getTabProps","id","active","getTabListProps","setActiveIndex","nextActiveIndex","getTabPanelProps","role","getTabPanelsProps","ref"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;AAEA,SAASA,SAAS,EAAEC,MAAM,EAAEC,QAAQ,QAAQ,QAAQ;AAGpD,SAASC,YAAY,QAAQ,qBAAqB;AAClD,SAASC,eAAe,QAAQ,wBAAwB;AAExD,MAAMC,aAAa,EAAE;AACrB,MAAMC,eAAe;AA+YrB;;;;;CAKC,GACD,OAAO,SAASC,QACdC,UAAqC,CAAC,CAAC;IAEvC,MAAM,EACJC,QAAQC,UAAU,EAClBC,gBAAgB,EAChBC,OAAOP,UAAU,EACjBQ,WAAWC,aAAa,EACxBC,cAAcC,gBAAgB,EAC9BC,gBAAgB,EACjB,GAAGT;IAEJ,MAAMC,SAASN,aAAaO,YAAY;IACxC,MAAM,CAACQ,WAAWC,aAAa,GAAGjB,SAAyB;IAE3D,MAAM,CAACW,WAAWE,aAAa,GAAGX,gBAAgB;QAChDgB,OAAON;QACPO,UAAUL;QACVM,cAAcL,oBAAqB;IACrC;IAEA,MAAMM,cAAc,CAACC,WACnB,OAAOA,aAAa,YAAYZ,KAAKa,MAAM,GAAG,IAC1Cb,KAAKc,OAAO,CAACF,YACbA;IACN,MAAMG,WAAW,CAACH,UAAoBI,SAAS,EAAE,GAC/C,CAAC,EAAEnB,OAAO,CAAC,EAAEmB,OAAO,EAAEL,YAAYC,YAAY,EAAE,CAAC;IAEnD,MAAMK,cAAcN,YAAYV;IAChC,MAAMiB,eAAe7B,OAAoB;IACzCD,UAAU;QACR,MAAM+B,YAAYD,aAAaE,OAAO;QACtC,IAAI,CAACD,aAAapB,kBAAkB;YAClC;QACF;QAEAoB,UAAUE,SAAS,GAAG;IACxB,GAAG;QAACtB;QAAkBE;KAAU;IAEhC,OAAO;QACLA;QACAE;QACAG;QACAC;QACAe,aAAYV,QAAQ;YAClB,OAAO;gBACL,iBAAiBG,SAASH,UAAUlB;gBACpC6B,IAAIR,SAASH;gBACbY,QAAQZ,aAAaX;YACvB;QACF;QACAwB;YACE,OAAO;gBACLR;gBACAS,gBAAgB,CAACC;oBACfpB,aAAaU,cAAcU,kBAAkB,SAAS;oBACtD,IAAI,OAAO1B,cAAc,YAAYD,KAAKa,MAAM,GAAG,GAAG;wBACpDV,aAAaH,IAAI,CAAC2B,gBAAgB;oBACpC,OAAO;wBACLxB,aAAawB;oBACf;gBACF;YACF;QACF;QACAC,kBAAiBhB,QAAQ;YACvB,OAAO;gBACL,mBAAmBG,SAASH;gBAC5BW,IAAIR,SAASH,UAAUlB;gBACvBmC,MAAM;gBACNL,QAAQZ,aAAaX;YACvB;QACF;QACA6B;YACE,OAAO;gBACLC,KAAKb;gBACLZ;YACF;QACF;IACF;AACF"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/tabs/utils.ts"],"sourcesContent":["/**\n * @internal\n */\nexport const getTabRoleOnly = (container: Element): readonly HTMLElement[] => [\n ...container.querySelectorAll<HTMLElement>('[role=\"tab\"]'),\n];\n\n/** @internal */\ninterface ScrollOptions {\n container: HTMLElement | null;\n forward: HTMLElement | null;\n backward: HTMLElement | null;\n vertical: boolean;\n activeIndex: number;\n}\n\n/**\n * @internal\n */\nexport const scrollTabIntoView = (options: ScrollOptions): void => {\n const { container, vertical, forward, backward, activeIndex } = options;\n if (!container) {\n return;\n }\n\n const activeTab = getTabRoleOnly(container)[activeIndex];\n if (!activeTab) {\n return;\n }\n\n const sizeAttribute = vertical ? \"offsetHeight\" : \"offsetWidth\";\n const offsetAttribute = vertical ? \"offsetTop\" : \"offsetLeft\";\n const scrollAttribute = vertical ? \"scrollTop\" : \"scrollLeft\";\n const firstOffset = backward?.[sizeAttribute] || 0;\n const lastOffset = forward?.[sizeAttribute] || 0;\n const elementStart = activeTab[offsetAttribute];\n const elementEnd = elementStart + activeTab[sizeAttribute];\n const containerStart = container[scrollAttribute];\n const containerEnd = containerStart + container[sizeAttribute] - lastOffset;\n if (elementEnd > containerEnd) {\n const containerSize = container[sizeAttribute] - lastOffset;\n container[scrollAttribute] = elementEnd - containerSize;\n } else if (elementStart < containerStart + firstOffset) {\n container[scrollAttribute] = elementStart - firstOffset;\n }\n};\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface TabListScrollToOptions {\n isRTL: boolean;\n animate: boolean;\n vertical: boolean;\n increment: boolean;\n container: HTMLElement;\n}\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport type GetTabListScrollToOptions = (\n options: TabListScrollToOptions\n) => ScrollToOptions | undefined;\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport const getTabListScrollToOptions: GetTabListScrollToOptions = (\n options\n) => {\n const { isRTL, animate, vertical, increment, container } = options;\n const { scrollLeft, scrollTop, scrollWidth, scrollHeight } = container;\n const currentScroll = vertical ? scrollTop : scrollLeft;\n const scrollDistance = vertical ? scrollHeight : scrollWidth;\n const amount = (scrollDistance / 10) * (increment ? 1 : -1);\n const distance = currentScroll + amount * (vertical || !isRTL ? 1 : -1);\n\n return {\n left: vertical ? undefined : distance,\n top: vertical ? distance : undefined,\n behavior: animate ? \"smooth\" : \"auto\",\n };\n};\n"],"names":["getTabRoleOnly","container","querySelectorAll","scrollTabIntoView","options","vertical","forward","backward","activeIndex","activeTab","sizeAttribute","offsetAttribute","scrollAttribute","firstOffset","lastOffset","elementStart","elementEnd","containerStart","containerEnd","containerSize","getTabListScrollToOptions","isRTL","animate","increment","scrollLeft","scrollTop","scrollWidth","scrollHeight","currentScroll","scrollDistance","amount","distance","left","undefined","top","behavior"],"mappings":"AAAA;;CAEC,GACD,OAAO,MAAMA,iBAAiB,CAACC,YAA+C;WACzEA,UAAUC,gBAAgB,CAAc;KAC5C,CAAC;AAWF;;CAEC,GACD,OAAO,MAAMC,oBAAoB,CAACC;IAChC,MAAM,EAAEH,SAAS,EAAEI,QAAQ,EAAEC,OAAO,EAAEC,QAAQ,EAAEC,WAAW,EAAE,GAAGJ;IAChE,IAAI,CAACH,WAAW;QACd;IACF;IAEA,MAAMQ,YAAYT,eAAeC,UAAU,CAACO,YAAY;IACxD,IAAI,CAACC,WAAW;QACd;IACF;IAEA,MAAMC,gBAAgBL,WAAW,iBAAiB;IAClD,MAAMM,kBAAkBN,WAAW,cAAc;IACjD,MAAMO,kBAAkBP,WAAW,cAAc;IACjD,MAAMQ,cAAcN,UAAU,CAACG,cAAc,IAAI;IACjD,MAAMI,aAAaR,SAAS,CAACI,cAAc,IAAI;IAC/C,MAAMK,eAAeN,SAAS,CAACE,gBAAgB;IAC/C,MAAMK,aAAaD,eAAeN,SAAS,CAACC,cAAc;IAC1D,MAAMO,iBAAiBhB,SAAS,CAACW,gBAAgB;IACjD,MAAMM,eAAeD,iBAAiBhB,SAAS,CAACS,cAAc,GAAGI;IACjE,IAAIE,aAAaE,cAAc;QAC7B,MAAMC,gBAAgBlB,SAAS,CAACS,cAAc,GAAGI;QACjDb,SAAS,CAACW,gBAAgB,GAAGI,aAAaG;IAC5C,OAAO,IAAIJ,eAAeE,iBAAiBJ,aAAa;QACtDZ,SAAS,CAACW,gBAAgB,GAAGG,eAAeF;IAC9C;AACF,EAAE;AAoBF;;CAEC,GACD,OAAO,MAAMO,4BAAuD,CAClEhB;IAEA,MAAM,EAAEiB,KAAK,EAAEC,OAAO,EAAEjB,QAAQ,EAAEkB,SAAS,EAAEtB,SAAS,EAAE,GAAGG;IAC3D,MAAM,EAAEoB,UAAU,EAAEC,SAAS,EAAEC,WAAW,EAAEC,YAAY,EAAE,GAAG1B;IAC7D,MAAM2B,gBAAgBvB,WAAWoB,YAAYD;IAC7C,MAAMK,iBAAiBxB,WAAWsB,eAAeD;IACjD,MAAMI,SAAS,AAACD,iBAAiB,KAAON,CAAAA,YAAY,IAAI,CAAC,CAAA;IACzD,MAAMQ,WAAWH,gBAAgBE,SAAUzB,CAAAA,YAAY,CAACgB,QAAQ,IAAI,CAAC,CAAA;IAErE,OAAO;QACLW,MAAM3B,WAAW4B,YAAYF;QAC7BG,KAAK7B,WAAW0B,WAAWE;QAC3BE,UAAUb,UAAU,WAAW;IACjC;AACF,EAAE"}
1
+ {"version":3,"sources":["../../src/tabs/utils.ts"],"sourcesContent":["/**\n * @internal\n */\nexport const getTabRoleOnly = (container: Element): readonly HTMLElement[] => [\n ...container.querySelectorAll<HTMLElement>('[role=\"tab\"]'),\n];\n\n/** @internal */\ninterface ScrollOptions {\n container: HTMLElement | null;\n forward: HTMLElement | null;\n backward: HTMLElement | null;\n vertical: boolean;\n activeIndex: number;\n}\n\n/**\n * @internal\n */\nexport const scrollTabIntoView = (options: ScrollOptions): void => {\n const { container, vertical, forward, backward, activeIndex } = options;\n if (!container) {\n return;\n }\n\n const activeTab = getTabRoleOnly(container)[activeIndex];\n if (!activeTab) {\n return;\n }\n\n const sizeAttribute = vertical ? \"offsetHeight\" : \"offsetWidth\";\n const offsetAttribute = vertical ? \"offsetTop\" : \"offsetLeft\";\n const scrollAttribute = vertical ? \"scrollTop\" : \"scrollLeft\";\n const firstOffset = backward?.[sizeAttribute] || 0;\n const lastOffset = forward?.[sizeAttribute] || 0;\n const elementStart = activeTab[offsetAttribute];\n const elementEnd = elementStart + activeTab[sizeAttribute];\n const containerStart = container[scrollAttribute];\n const containerEnd = containerStart + container[sizeAttribute] - lastOffset;\n if (elementEnd > containerEnd) {\n const containerSize = container[sizeAttribute] - lastOffset;\n container[scrollAttribute] = elementEnd - containerSize;\n } else if (elementStart < containerStart + firstOffset) {\n container[scrollAttribute] = elementStart - firstOffset;\n }\n};\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface TabListScrollToOptions {\n isRTL: boolean;\n animate: boolean;\n vertical: boolean;\n increment: boolean;\n container: HTMLElement;\n}\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport type GetTabListScrollToOptions = (\n options: TabListScrollToOptions\n) => ScrollToOptions | undefined;\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport const getTabListScrollToOptions: GetTabListScrollToOptions = (\n options\n) => {\n const { isRTL, animate, vertical, increment, container } = options;\n const { scrollLeft, scrollTop, scrollWidth, scrollHeight } = container;\n const currentScroll = vertical ? scrollTop : scrollLeft;\n const scrollDistance = vertical ? scrollHeight : scrollWidth;\n const amount = (scrollDistance / 10) * (increment ? 1 : -1);\n const distance = currentScroll + amount * (vertical || !isRTL ? 1 : -1);\n\n return {\n left: vertical ? undefined : distance,\n top: vertical ? distance : undefined,\n behavior: animate ? \"smooth\" : \"auto\",\n };\n};\n"],"names":["getTabRoleOnly","container","querySelectorAll","scrollTabIntoView","options","vertical","forward","backward","activeIndex","activeTab","sizeAttribute","offsetAttribute","scrollAttribute","firstOffset","lastOffset","elementStart","elementEnd","containerStart","containerEnd","containerSize","getTabListScrollToOptions","isRTL","animate","increment","scrollLeft","scrollTop","scrollWidth","scrollHeight","currentScroll","scrollDistance","amount","distance","left","undefined","top","behavior"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;CAEC,GACD,OAAO,MAAMA,iBAAiB,CAACC,YAA+C;WACzEA,UAAUC,gBAAgB,CAAc;KAC5C,CAAC;AAWF;;CAEC,GACD,OAAO,MAAMC,oBAAoB,CAACC;IAChC,MAAM,EAAEH,SAAS,EAAEI,QAAQ,EAAEC,OAAO,EAAEC,QAAQ,EAAEC,WAAW,EAAE,GAAGJ;IAChE,IAAI,CAACH,WAAW;QACd;IACF;IAEA,MAAMQ,YAAYT,eAAeC,UAAU,CAACO,YAAY;IACxD,IAAI,CAACC,WAAW;QACd;IACF;IAEA,MAAMC,gBAAgBL,WAAW,iBAAiB;IAClD,MAAMM,kBAAkBN,WAAW,cAAc;IACjD,MAAMO,kBAAkBP,WAAW,cAAc;IACjD,MAAMQ,cAAcN,UAAU,CAACG,cAAc,IAAI;IACjD,MAAMI,aAAaR,SAAS,CAACI,cAAc,IAAI;IAC/C,MAAMK,eAAeN,SAAS,CAACE,gBAAgB;IAC/C,MAAMK,aAAaD,eAAeN,SAAS,CAACC,cAAc;IAC1D,MAAMO,iBAAiBhB,SAAS,CAACW,gBAAgB;IACjD,MAAMM,eAAeD,iBAAiBhB,SAAS,CAACS,cAAc,GAAGI;IACjE,IAAIE,aAAaE,cAAc;QAC7B,MAAMC,gBAAgBlB,SAAS,CAACS,cAAc,GAAGI;QACjDb,SAAS,CAACW,gBAAgB,GAAGI,aAAaG;IAC5C,OAAO,IAAIJ,eAAeE,iBAAiBJ,aAAa;QACtDZ,SAAS,CAACW,gBAAgB,GAAGG,eAAeF;IAC9C;AACF,EAAE;AAoBF;;CAEC,GACD,OAAO,MAAMO,4BAAuD,CAClEhB;IAEA,MAAM,EAAEiB,KAAK,EAAEC,OAAO,EAAEjB,QAAQ,EAAEkB,SAAS,EAAEtB,SAAS,EAAE,GAAGG;IAC3D,MAAM,EAAEoB,UAAU,EAAEC,SAAS,EAAEC,WAAW,EAAEC,YAAY,EAAE,GAAG1B;IAC7D,MAAM2B,gBAAgBvB,WAAWoB,YAAYD;IAC7C,MAAMK,iBAAiBxB,WAAWsB,eAAeD;IACjD,MAAMI,SAAS,AAACD,iBAAiB,KAAON,CAAAA,YAAY,IAAI,CAAC,CAAA;IACzD,MAAMQ,WAAWH,gBAAgBE,SAAUzB,CAAAA,YAAY,CAACgB,QAAQ,IAAI,CAAC,CAAA;IAErE,OAAO;QACLW,MAAM3B,WAAW4B,YAAYF;QAC7BG,KAAK7B,WAAW0B,WAAWE;QAC3BE,UAAUb,UAAU,WAAW;IACjC;AACF,EAAE"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/test-utils/IntersectionObserver.ts"],"sourcesContent":["export class IntersectionObserverMock implements IntersectionObserver {\n root: Document | Element | null;\n rootMargin: string;\n thresholds: readonly number[];\n\n elements: Set<Element>;\n\n constructor(\n public callback: IntersectionObserverCallback,\n options: IntersectionObserverInit = {}\n ) {\n this.root = options.root || null;\n this.rootMargin = options.rootMargin || \"\";\n this.thresholds =\n typeof options.threshold === \"number\"\n ? [options.threshold]\n : options.threshold ?? [];\n\n this.elements = new Set();\n }\n\n observe(target: Element): void {\n this.elements.add(target);\n\n this.callback(this.takeRecords(), this);\n }\n\n unobserve(target: Element): void {\n this.elements.delete(target);\n }\n\n takeRecords(): IntersectionObserverEntry[] {\n return [...this.elements].map<IntersectionObserverEntry>((target) => ({\n time: Date.now(),\n target,\n boundingClientRect: target.getBoundingClientRect(),\n intersectionRatio: 0,\n intersectionRect: target.getBoundingClientRect(),\n isIntersecting: false,\n rootBounds:\n this.root && \"getBoundingClientRect\" in this.root\n ? this.root.getBoundingClientRect()\n : null,\n }));\n }\n\n disconnect(): void {\n this.elements.clear();\n }\n}\n"],"names":["IntersectionObserverMock","observe","target","elements","add","callback","takeRecords","unobserve","delete","map","time","Date","now","boundingClientRect","getBoundingClientRect","intersectionRatio","intersectionRect","isIntersecting","rootBounds","root","disconnect","clear","constructor","options","rootMargin","thresholds","threshold","Set"],"mappings":";;;;;;;;;;;;;AAAA,OAAO,MAAMA;IAqBXC,QAAQC,MAAe,EAAQ;QAC7B,IAAI,CAACC,QAAQ,CAACC,GAAG,CAACF;QAElB,IAAI,CAACG,QAAQ,CAAC,IAAI,CAACC,WAAW,IAAI,IAAI;IACxC;IAEAC,UAAUL,MAAe,EAAQ;QAC/B,IAAI,CAACC,QAAQ,CAACK,MAAM,CAACN;IACvB;IAEAI,cAA2C;QACzC,OAAO;eAAI,IAAI,CAACH,QAAQ;SAAC,CAACM,GAAG,CAA4B,CAACP,SAAY,CAAA;gBACpEQ,MAAMC,KAAKC,GAAG;gBACdV;gBACAW,oBAAoBX,OAAOY,qBAAqB;gBAChDC,mBAAmB;gBACnBC,kBAAkBd,OAAOY,qBAAqB;gBAC9CG,gBAAgB;gBAChBC,YACE,IAAI,CAACC,IAAI,IAAI,2BAA2B,IAAI,CAACA,IAAI,GAC7C,IAAI,CAACA,IAAI,CAACL,qBAAqB,KAC/B;YACR,CAAA;IACF;IAEAM,aAAmB;QACjB,IAAI,CAACjB,QAAQ,CAACkB,KAAK;IACrB;IAzCAC,YACE,AAAOjB,QAAsC,EAC7CkB,UAAoC,CAAC,CAAC,CACtC;;QATFJ,uBAAAA,QAAAA,KAAAA;QACAK,uBAAAA,cAAAA,KAAAA;QACAC,uBAAAA,cAAAA,KAAAA;QAEAtB,uBAAAA,YAAAA,KAAAA;aAGSE,WAAAA;QAGP,IAAI,CAACc,IAAI,GAAGI,QAAQJ,IAAI,IAAI;QAC5B,IAAI,CAACK,UAAU,GAAGD,QAAQC,UAAU,IAAI;QACxC,IAAI,CAACC,UAAU,GACb,OAAOF,QAAQG,SAAS,KAAK,WACzB;YAACH,QAAQG,SAAS;SAAC,GACnBH,QAAQG,SAAS,IAAI,EAAE;QAE7B,IAAI,CAACvB,QAAQ,GAAG,IAAIwB;IACtB;AA8BF"}
1
+ {"version":3,"sources":["../../src/test-utils/IntersectionObserver.ts"],"sourcesContent":["export class IntersectionObserverMock implements IntersectionObserver {\n root: Document | Element | null;\n rootMargin: string;\n thresholds: readonly number[];\n\n elements: Set<Element>;\n\n constructor(\n public callback: IntersectionObserverCallback,\n options: IntersectionObserverInit = {}\n ) {\n this.root = options.root || null;\n this.rootMargin = options.rootMargin || \"\";\n this.thresholds =\n typeof options.threshold === \"number\"\n ? [options.threshold]\n : options.threshold ?? [];\n\n this.elements = new Set();\n }\n\n observe(target: Element): void {\n this.elements.add(target);\n\n this.callback(this.takeRecords(), this);\n }\n\n unobserve(target: Element): void {\n this.elements.delete(target);\n }\n\n takeRecords(): IntersectionObserverEntry[] {\n return [...this.elements].map<IntersectionObserverEntry>((target) => ({\n time: Date.now(),\n target,\n boundingClientRect: target.getBoundingClientRect(),\n intersectionRatio: 0,\n intersectionRect: target.getBoundingClientRect(),\n isIntersecting: false,\n rootBounds:\n this.root && \"getBoundingClientRect\" in this.root\n ? this.root.getBoundingClientRect()\n : null,\n }));\n }\n\n disconnect(): void {\n this.elements.clear();\n }\n}\n"],"names":["IntersectionObserverMock","observe","target","elements","add","callback","takeRecords","unobserve","delete","map","time","Date","now","boundingClientRect","getBoundingClientRect","intersectionRatio","intersectionRect","isIntersecting","rootBounds","root","disconnect","clear","constructor","options","rootMargin","thresholds","threshold","Set"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;;;AAAA,OAAO,MAAMA;IAqBXC,QAAQC,MAAe,EAAQ;QAC7B,IAAI,CAACC,QAAQ,CAACC,GAAG,CAACF;QAElB,IAAI,CAACG,QAAQ,CAAC,IAAI,CAACC,WAAW,IAAI,IAAI;IACxC;IAEAC,UAAUL,MAAe,EAAQ;QAC/B,IAAI,CAACC,QAAQ,CAACK,MAAM,CAACN;IACvB;IAEAI,cAA2C;QACzC,OAAO;eAAI,IAAI,CAACH,QAAQ;SAAC,CAACM,GAAG,CAA4B,CAACP,SAAY,CAAA;gBACpEQ,MAAMC,KAAKC,GAAG;gBACdV;gBACAW,oBAAoBX,OAAOY,qBAAqB;gBAChDC,mBAAmB;gBACnBC,kBAAkBd,OAAOY,qBAAqB;gBAC9CG,gBAAgB;gBAChBC,YACE,IAAI,CAACC,IAAI,IAAI,2BAA2B,IAAI,CAACA,IAAI,GAC7C,IAAI,CAACA,IAAI,CAACL,qBAAqB,KAC/B;YACR,CAAA;IACF;IAEAM,aAAmB;QACjB,IAAI,CAACjB,QAAQ,CAACkB,KAAK;IACrB;IAzCAC,YACE,AAAOjB,QAAsC,EAC7CkB,UAAoC,CAAC,CAAC,CACtC;;QATFJ,uBAAAA,QAAAA,KAAAA;QACAK,uBAAAA,cAAAA,KAAAA;QACAC,uBAAAA,cAAAA,KAAAA;QAEAtB,uBAAAA,YAAAA,KAAAA;aAGSE,WAAAA;QAGP,IAAI,CAACc,IAAI,GAAGI,QAAQJ,IAAI,IAAI;QAC5B,IAAI,CAACK,UAAU,GAAGD,QAAQC,UAAU,IAAI;QACxC,IAAI,CAACC,UAAU,GACb,OAAOF,QAAQG,SAAS,KAAK,WACzB;YAACH,QAAQG,SAAS;SAAC,GACnBH,QAAQG,SAAS,IAAI,EAAE;QAE7B,IAAI,CAACvB,QAAQ,GAAG,IAAIwB;IACtB;AA8BF"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/test-utils/ResizeObserver.ts"],"sourcesContent":["import { afterEach, jest } from \"@jest/globals\";\nimport {\n resizeObserverManager,\n type ResizeObserverManager,\n} from \"../useResizeObserver.js\";\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface ResizeObserverEntrySize {\n height?: number;\n width?: number;\n}\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport type GetResizeObserverEntryMock = (\n target: Element,\n size?: ResizeObserverEntrySize\n) => ResizeObserverEntry;\n\n/**\n * This is mostly an internal function to be used with the {@link ResizeObserverMock}\n * and {@link setupResizeObserverMock}\n *\n * @remarks \\@since 6.0.0\n */\nexport const createResizeObserverEntry: GetResizeObserverEntryMock = (\n target,\n size\n) => {\n const contentRect = target.getBoundingClientRect();\n if (typeof size?.height === \"number\") {\n contentRect.height = size.height;\n }\n if (typeof size?.width === \"number\") {\n contentRect.width = size.width;\n }\n\n const boxSize: ResizeObserverSize = {\n blockSize: contentRect.height,\n inlineSize: contentRect.width,\n };\n\n return {\n target,\n contentRect,\n borderBoxSize: [boxSize],\n contentBoxSize: [boxSize],\n devicePixelContentBoxSize: [],\n };\n};\n\n/**\n * This is the default ResizeObserver implementation if it does not already\n * exist in jsdom. You normally should not use this directly and instead use the\n * {@link setupResizeObserverMock} instead.\n *\n * @remarks \\@since 6.0.0\n */\nexport class ResizeObserverMock implements ResizeObserver {\n elements: Set<Element>;\n\n constructor(public callback: ResizeObserverCallback) {\n this.elements = new Set();\n }\n\n observe = (target: Element): void => {\n this.elements.add(target);\n this.resizeAllElements(createResizeObserverEntry);\n };\n\n unobserve = (target: Element): void => {\n this.elements.delete(target);\n };\n\n disconnect = (): void => {\n this.elements.clear();\n };\n\n /**\n * Triggers the resize event for a specific element. This must be wrapped in\n * `act`.\n *\n * @example\n * Main Usage\n * ```tsx\n * import {\n * cleanupResizeObserverAfterEach,\n * setupResizeObserverMock,\n * } from \"@react-md/core/test-utils\";\n * import { useResizeObserver } from \"@react-md/core\";\n * import { ExampleComponent } from \"../ExampleComponent.js\";\n *\n * cleanupResizeObserverAfterEach();\n *\n * describe(\"ExampleComponent\", () => {\n * it(\"should do stuff\", () => {\n * const observer = setupResizeObserverMock();\n * render(<ExampleComponent />)\n *\n * const resizeTarget = screen.getByTestId(\"resize-target\")\n *\n * // you can trigger with a custom change\n * act(() => {\n * observer.resizeElement(resizeTarget, { height: 100, width: 100 });\n * });\n * // expect resize changes\n * });\n * })\n * ```\n */\n resizeElement = (\n target: Element,\n changesOrGetEntry:\n | GetResizeObserverEntryMock\n | ResizeObserverEntrySize\n | ResizeObserverEntry = createResizeObserverEntry\n ): void => {\n if (!this.elements.has(target)) {\n throw new Error(\n \"The `ResizeObserverMock` is not watching the target element and cannot be resized\"\n );\n }\n\n let entry: ResizeObserverEntry;\n if (typeof changesOrGetEntry === \"function\") {\n entry = changesOrGetEntry(target);\n } else if (!(\"contentRect\" in changesOrGetEntry)) {\n entry = createResizeObserverEntry(target, changesOrGetEntry);\n } else {\n entry = changesOrGetEntry;\n }\n\n this.callback([entry], this);\n };\n\n /**\n * You'll normally want to use {@link resizeElement} instead, but this can be\n * used to resize all the watched elements at once.\n *\n * @example\n * ```tsx\n * import {\n * act,\n * createResizeObserverEntry,\n * render,\n * screen,\n * setupResizeObserverMock,\n * } from \"@react-md/core/test-utils\";\n *\n * const observer = setupResizeObserverMock();\n * const { container } = render(<Test />)\n * expect(container).toMatchSnapshot()\n *\n * const target1 = screen.getByTestId('target-1');\n * const target2 = screen.getByTestId('target-2');\n * const target3 = screen.getByTestId('target-3');\n *\n * act(() => {\n * observer.resizeAllElements((element) => {\n * let height: number | undefined;\n * let width: number | undefined;\n * switch (element) {\n * case target1:\n * height = 400;\n * width = 250;\n * break;\n * case target2:\n * height = 100;\n * width = 380;\n * break;\n * case target3:\n * height = 24;\n * width = 24;\n * break;\n * }\n *\n * return createResizeObserverEntry(element, { height, width });\n * });\n * });\n * expect(container).toMatchSnapshot()\n * ```\n */\n resizeAllElements = (getEntry = createResizeObserverEntry): void => {\n const entries = [...this.elements].map((element) => getEntry(element));\n this.callback(entries, this);\n };\n}\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface SetupResizeObserverMockOptions {\n /**\n * Set this to `true` to mimic the real `ResizeObserver` behavior where the\n * updates occur after an animation frame instead of invoking immediately.\n *\n * Keeping this as `false` is recommended since this option was only added to\n * make testing this function itself easier.\n *\n * @defaultValue `false`\n */\n raf?: boolean;\n\n /**\n * Keeping this as the `resizeObserverManager` is recommended since this\n * option was only added to make testing this function easier itself.\n *\n * @defaultValue `resizeObserverManager`\n */\n manager?: ResizeObserverManager;\n}\n\n/**\n * Initializes the `ResizeObserverMock` to be used for tests.\n *\n * @example\n * Main Usage\n * ```tsx\n * import { useCallback, useState } from \"react\";\n * import {\n * cleanupResizeObserverAfterEach,\n * render,\n * screen,\n * setupResizeObserverMock,\n * } from \"@react-md/core/test-utils\";\n * import { useResizeObserver } from \"@react-md/core\";\n *\n * function ExampleComponent() {\n * const [size, setSize] = useState({ height: 0, width: 0 });\n * const ref = useResizeObserver({\n * onUpdate: useCallback((entry) => {\n * setSize({\n * height: entry.contentRect.height,\n * width: entry.contentRect.width,\n * });\n * });\n * });\n *\n * return (\n * <>\n * <div data-testid=\"size\">{JSON.stringify(size)}</div>\n * <div data-testid=\"resize-target\" ref={ref} />\n * </>\n * );\n * }\n *\n * cleanupResizeObserverAfterEach();\n *\n * describe(\"ExampleComponent\", () => {\n * it(\"should do stuff\", () => {\n * const observer = setupResizeObserverMock();\n * render(<ExampleComponent />)\n *\n * const size = screen.getByTestId(\"size\");\n * const resizeTarget = screen.getByTestId(\"resize-target\")\n *\n * // jsdom sets all element sizes to 0 by default\n * expect(size).toHaveTextContent(JSON.stringify({ height: 0, width: 0 }));\n *\n * // you can trigger with a custom change\n * act(() => {\n * observer.resizeElement(resizeTarget, { height: 100, width: 100 });\n * });\n * expect(size).toHaveTextContent(JSON.stringify({ height: 100, width: 100 }));\n *\n * // or you can mock the `getBoundingClientRect` result\n * jest.spyOn(resizeTarget, \"getBoundingClientRect\")\n * .mockReturnValue({\n * ...document.body.getBoundingClientRect(),\n * height: 200,\n * width: 200,\n * }):\n *\n * act(() => {\n * observer.resizeElement(resizeTarget);\n * });\n * expect(size).toHaveTextContent(JSON.stringify({ height: 200, width: 200 }));\n * });\n * })\n * ```\n *\n * @remarks \\@since 6.0.0\n */\nexport function setupResizeObserverMock(\n options: SetupResizeObserverMockOptions = {}\n): ResizeObserverMock {\n const { raf, manager = resizeObserverManager } = options;\n\n const resizeObserver = new ResizeObserverMock((entries) => {\n if (raf) {\n window.cancelAnimationFrame(manager.frame);\n manager.frame = window.requestAnimationFrame(() => {\n manager.handleResizeEntries(entries);\n });\n } else {\n manager.handleResizeEntries(entries);\n }\n });\n manager.sharedObserver = resizeObserver;\n return resizeObserver;\n}\n\n/**\n * @see {@link setupResizeObserverMock}\n * @remarks \\@since 6.0.0\n */\nexport function cleanupResizeObserverAfterEach(restoreAllMocks = true): void {\n afterEach(() => {\n resizeObserverManager.frame = 0;\n resizeObserverManager.subscriptions = new Map();\n resizeObserverManager.sharedObserver = undefined;\n\n if (restoreAllMocks) {\n jest.restoreAllMocks();\n }\n });\n}\n"],"names":["afterEach","jest","resizeObserverManager","createResizeObserverEntry","target","size","contentRect","getBoundingClientRect","height","width","boxSize","blockSize","inlineSize","borderBoxSize","contentBoxSize","devicePixelContentBoxSize","ResizeObserverMock","constructor","callback","elements","observe","unobserve","disconnect","resizeElement","resizeAllElements","add","delete","clear","changesOrGetEntry","has","Error","entry","getEntry","entries","map","element","Set","setupResizeObserverMock","options","raf","manager","resizeObserver","window","cancelAnimationFrame","frame","requestAnimationFrame","handleResizeEntries","sharedObserver","cleanupResizeObserverAfterEach","restoreAllMocks","subscriptions","Map","undefined"],"mappings":"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"}
1
+ {"version":3,"sources":["../../src/test-utils/ResizeObserver.ts"],"sourcesContent":["import { afterEach, jest } from \"@jest/globals\";\nimport {\n resizeObserverManager,\n type ResizeObserverManager,\n} from \"../useResizeObserver.js\";\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface ResizeObserverEntrySize {\n height?: number;\n width?: number;\n}\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport type GetResizeObserverEntryMock = (\n target: Element,\n size?: ResizeObserverEntrySize\n) => ResizeObserverEntry;\n\n/**\n * This is mostly an internal function to be used with the {@link ResizeObserverMock}\n * and {@link setupResizeObserverMock}\n *\n * @remarks \\@since 6.0.0\n */\nexport const createResizeObserverEntry: GetResizeObserverEntryMock = (\n target,\n size\n) => {\n const contentRect = target.getBoundingClientRect();\n if (typeof size?.height === \"number\") {\n contentRect.height = size.height;\n }\n if (typeof size?.width === \"number\") {\n contentRect.width = size.width;\n }\n\n const boxSize: ResizeObserverSize = {\n blockSize: contentRect.height,\n inlineSize: contentRect.width,\n };\n\n return {\n target,\n contentRect,\n borderBoxSize: [boxSize],\n contentBoxSize: [boxSize],\n devicePixelContentBoxSize: [],\n };\n};\n\n/**\n * This is the default ResizeObserver implementation if it does not already\n * exist in jsdom. You normally should not use this directly and instead use the\n * {@link setupResizeObserverMock} instead.\n *\n * @remarks \\@since 6.0.0\n */\nexport class ResizeObserverMock implements ResizeObserver {\n elements: Set<Element>;\n\n constructor(public callback: ResizeObserverCallback) {\n this.elements = new Set();\n }\n\n observe = (target: Element): void => {\n this.elements.add(target);\n this.resizeAllElements(createResizeObserverEntry);\n };\n\n unobserve = (target: Element): void => {\n this.elements.delete(target);\n };\n\n disconnect = (): void => {\n this.elements.clear();\n };\n\n /**\n * Triggers the resize event for a specific element. This must be wrapped in\n * `act`.\n *\n * @example\n * Main Usage\n * ```tsx\n * import {\n * cleanupResizeObserverAfterEach,\n * setupResizeObserverMock,\n * } from \"@react-md/core/test-utils\";\n * import { useResizeObserver } from \"@react-md/core\";\n * import { ExampleComponent } from \"../ExampleComponent.js\";\n *\n * cleanupResizeObserverAfterEach();\n *\n * describe(\"ExampleComponent\", () => {\n * it(\"should do stuff\", () => {\n * const observer = setupResizeObserverMock();\n * render(<ExampleComponent />)\n *\n * const resizeTarget = screen.getByTestId(\"resize-target\")\n *\n * // you can trigger with a custom change\n * act(() => {\n * observer.resizeElement(resizeTarget, { height: 100, width: 100 });\n * });\n * // expect resize changes\n * });\n * })\n * ```\n */\n resizeElement = (\n target: Element,\n changesOrGetEntry:\n | GetResizeObserverEntryMock\n | ResizeObserverEntrySize\n | ResizeObserverEntry = createResizeObserverEntry\n ): void => {\n if (!this.elements.has(target)) {\n throw new Error(\n \"The `ResizeObserverMock` is not watching the target element and cannot be resized\"\n );\n }\n\n let entry: ResizeObserverEntry;\n if (typeof changesOrGetEntry === \"function\") {\n entry = changesOrGetEntry(target);\n } else if (!(\"contentRect\" in changesOrGetEntry)) {\n entry = createResizeObserverEntry(target, changesOrGetEntry);\n } else {\n entry = changesOrGetEntry;\n }\n\n this.callback([entry], this);\n };\n\n /**\n * You'll normally want to use {@link resizeElement} instead, but this can be\n * used to resize all the watched elements at once.\n *\n * @example\n * ```tsx\n * import {\n * act,\n * createResizeObserverEntry,\n * render,\n * screen,\n * setupResizeObserverMock,\n * } from \"@react-md/core/test-utils\";\n *\n * const observer = setupResizeObserverMock();\n * const { container } = render(<Test />)\n * expect(container).toMatchSnapshot()\n *\n * const target1 = screen.getByTestId('target-1');\n * const target2 = screen.getByTestId('target-2');\n * const target3 = screen.getByTestId('target-3');\n *\n * act(() => {\n * observer.resizeAllElements((element) => {\n * let height: number | undefined;\n * let width: number | undefined;\n * switch (element) {\n * case target1:\n * height = 400;\n * width = 250;\n * break;\n * case target2:\n * height = 100;\n * width = 380;\n * break;\n * case target3:\n * height = 24;\n * width = 24;\n * break;\n * }\n *\n * return createResizeObserverEntry(element, { height, width });\n * });\n * });\n * expect(container).toMatchSnapshot()\n * ```\n */\n resizeAllElements = (getEntry = createResizeObserverEntry): void => {\n const entries = [...this.elements].map((element) => getEntry(element));\n this.callback(entries, this);\n };\n}\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface SetupResizeObserverMockOptions {\n /**\n * Set this to `true` to mimic the real `ResizeObserver` behavior where the\n * updates occur after an animation frame instead of invoking immediately.\n *\n * Keeping this as `false` is recommended since this option was only added to\n * make testing this function itself easier.\n *\n * @defaultValue `false`\n */\n raf?: boolean;\n\n /**\n * Keeping this as the `resizeObserverManager` is recommended since this\n * option was only added to make testing this function easier itself.\n *\n * @defaultValue `resizeObserverManager`\n */\n manager?: ResizeObserverManager;\n}\n\n/**\n * Initializes the `ResizeObserverMock` to be used for tests.\n *\n * @example\n * Main Usage\n * ```tsx\n * import { useCallback, useState } from \"react\";\n * import {\n * cleanupResizeObserverAfterEach,\n * render,\n * screen,\n * setupResizeObserverMock,\n * } from \"@react-md/core/test-utils\";\n * import { useResizeObserver } from \"@react-md/core\";\n *\n * function ExampleComponent() {\n * const [size, setSize] = useState({ height: 0, width: 0 });\n * const ref = useResizeObserver({\n * onUpdate: useCallback((entry) => {\n * setSize({\n * height: entry.contentRect.height,\n * width: entry.contentRect.width,\n * });\n * });\n * });\n *\n * return (\n * <>\n * <div data-testid=\"size\">{JSON.stringify(size)}</div>\n * <div data-testid=\"resize-target\" ref={ref} />\n * </>\n * );\n * }\n *\n * cleanupResizeObserverAfterEach();\n *\n * describe(\"ExampleComponent\", () => {\n * it(\"should do stuff\", () => {\n * const observer = setupResizeObserverMock();\n * render(<ExampleComponent />)\n *\n * const size = screen.getByTestId(\"size\");\n * const resizeTarget = screen.getByTestId(\"resize-target\")\n *\n * // jsdom sets all element sizes to 0 by default\n * expect(size).toHaveTextContent(JSON.stringify({ height: 0, width: 0 }));\n *\n * // you can trigger with a custom change\n * act(() => {\n * observer.resizeElement(resizeTarget, { height: 100, width: 100 });\n * });\n * expect(size).toHaveTextContent(JSON.stringify({ height: 100, width: 100 }));\n *\n * // or you can mock the `getBoundingClientRect` result\n * jest.spyOn(resizeTarget, \"getBoundingClientRect\")\n * .mockReturnValue({\n * ...document.body.getBoundingClientRect(),\n * height: 200,\n * width: 200,\n * }):\n *\n * act(() => {\n * observer.resizeElement(resizeTarget);\n * });\n * expect(size).toHaveTextContent(JSON.stringify({ height: 200, width: 200 }));\n * });\n * })\n * ```\n *\n * @remarks \\@since 6.0.0\n */\nexport function setupResizeObserverMock(\n options: SetupResizeObserverMockOptions = {}\n): ResizeObserverMock {\n const { raf, manager = resizeObserverManager } = options;\n\n const resizeObserver = new ResizeObserverMock((entries) => {\n if (raf) {\n window.cancelAnimationFrame(manager.frame);\n manager.frame = window.requestAnimationFrame(() => {\n manager.handleResizeEntries(entries);\n });\n } else {\n manager.handleResizeEntries(entries);\n }\n });\n manager.sharedObserver = resizeObserver;\n return resizeObserver;\n}\n\n/**\n * @see {@link setupResizeObserverMock}\n * @remarks \\@since 6.0.0\n */\nexport function cleanupResizeObserverAfterEach(restoreAllMocks = true): void {\n afterEach(() => {\n resizeObserverManager.frame = 0;\n resizeObserverManager.subscriptions = new Map();\n resizeObserverManager.sharedObserver = undefined;\n\n if (restoreAllMocks) {\n jest.restoreAllMocks();\n }\n });\n}\n"],"names":["afterEach","jest","resizeObserverManager","createResizeObserverEntry","target","size","contentRect","getBoundingClientRect","height","width","boxSize","blockSize","inlineSize","borderBoxSize","contentBoxSize","devicePixelContentBoxSize","ResizeObserverMock","constructor","callback","elements","observe","unobserve","disconnect","resizeElement","resizeAllElements","add","delete","clear","changesOrGetEntry","has","Error","entry","getEntry","entries","map","element","Set","setupResizeObserverMock","options","raf","manager","resizeObserver","window","cancelAnimationFrame","frame","requestAnimationFrame","handleResizeEntries","sharedObserver","cleanupResizeObserverAfterEach","restoreAllMocks","subscriptions","Map","undefined"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;;;AAAA,SAASA,SAAS,EAAEC,IAAI,QAAQ,gBAAgB;AAChD,SACEC,qBAAqB,QAEhB,0BAA0B;AAkBjC;;;;;CAKC,GACD,OAAO,MAAMC,4BAAwD,CACnEC,QACAC;IAEA,MAAMC,cAAcF,OAAOG,qBAAqB;IAChD,IAAI,OAAOF,MAAMG,WAAW,UAAU;QACpCF,YAAYE,MAAM,GAAGH,KAAKG,MAAM;IAClC;IACA,IAAI,OAAOH,MAAMI,UAAU,UAAU;QACnCH,YAAYG,KAAK,GAAGJ,KAAKI,KAAK;IAChC;IAEA,MAAMC,UAA8B;QAClCC,WAAWL,YAAYE,MAAM;QAC7BI,YAAYN,YAAYG,KAAK;IAC/B;IAEA,OAAO;QACLL;QACAE;QACAO,eAAe;YAACH;SAAQ;QACxBI,gBAAgB;YAACJ;SAAQ;QACzBK,2BAA2B,EAAE;IAC/B;AACF,EAAE;AAEF;;;;;;CAMC,GACD,OAAO,MAAMC;IAGXC,YAAY,AAAOC,QAAgC,CAAE;;QAFrDC,uBAAAA,YAAAA,KAAAA;QAMAC,uBAAAA,WAAAA,KAAAA;QAKAC,uBAAAA,aAAAA,KAAAA;QAIAC,uBAAAA,cAAAA,KAAAA;QAIA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+BC,GACDC,uBAAAA,iBAAAA,KAAAA;QAyBA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8CC,GACDC,uBAAAA,qBAAAA,KAAAA;aAzHmBN,WAAAA;aAInBE,UAAU,CAAChB;YACT,IAAI,CAACe,QAAQ,CAACM,GAAG,CAACrB;YAClB,IAAI,CAACoB,iBAAiB,CAACrB;QACzB;aAEAkB,YAAY,CAACjB;YACX,IAAI,CAACe,QAAQ,CAACO,MAAM,CAACtB;QACvB;aAEAkB,aAAa;YACX,IAAI,CAACH,QAAQ,CAACQ,KAAK;QACrB;aAkCAJ,gBAAgB,CACdnB,QACAwB,oBAG0BzB,yBAAyB;YAEnD,IAAI,CAAC,IAAI,CAACgB,QAAQ,CAACU,GAAG,CAACzB,SAAS;gBAC9B,MAAM,IAAI0B,MACR;YAEJ;YAEA,IAAIC;YACJ,IAAI,OAAOH,sBAAsB,YAAY;gBAC3CG,QAAQH,kBAAkBxB;YAC5B,OAAO,IAAI,CAAE,CAAA,iBAAiBwB,iBAAgB,GAAI;gBAChDG,QAAQ5B,0BAA0BC,QAAQwB;YAC5C,OAAO;gBACLG,QAAQH;YACV;YAEA,IAAI,CAACV,QAAQ,CAAC;gBAACa;aAAM,EAAE,IAAI;QAC7B;aAiDAP,oBAAoB,CAACQ,WAAW7B,yBAAyB;YACvD,MAAM8B,UAAU;mBAAI,IAAI,CAACd,QAAQ;aAAC,CAACe,GAAG,CAAC,CAACC,UAAYH,SAASG;YAC7D,IAAI,CAACjB,QAAQ,CAACe,SAAS,IAAI;QAC7B;QA3HE,IAAI,CAACd,QAAQ,GAAG,IAAIiB;IACtB;AA2HF;AA0BA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAsEC,GACD,OAAO,SAASC,wBACdC,UAA0C,CAAC,CAAC;IAE5C,MAAM,EAAEC,GAAG,EAAEC,UAAUtC,qBAAqB,EAAE,GAAGoC;IAEjD,MAAMG,iBAAiB,IAAIzB,mBAAmB,CAACiB;QAC7C,IAAIM,KAAK;YACPG,OAAOC,oBAAoB,CAACH,QAAQI,KAAK;YACzCJ,QAAQI,KAAK,GAAGF,OAAOG,qBAAqB,CAAC;gBAC3CL,QAAQM,mBAAmB,CAACb;YAC9B;QACF,OAAO;YACLO,QAAQM,mBAAmB,CAACb;QAC9B;IACF;IACAO,QAAQO,cAAc,GAAGN;IACzB,OAAOA;AACT;AAEA;;;CAGC,GACD,OAAO,SAASO,+BAA+BC,kBAAkB,IAAI;IACnEjD,UAAU;QACRE,sBAAsB0C,KAAK,GAAG;QAC9B1C,sBAAsBgD,aAAa,GAAG,IAAIC;QAC1CjD,sBAAsB6C,cAAc,GAAGK;QAEvC,IAAIH,iBAAiB;YACnBhD,KAAKgD,eAAe;QACtB;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,\n React.DOMAttributes<T> {\n \"data-testid\"?: string | number;\n }\n}\n"],"names":[],"rangeMappings":"","mappings":"AAAA,+BAA+B"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/test-utils/index.ts"],"sourcesContent":["export * from \"@testing-library/react\";\nexport * from \"@testing-library/user-event\";\n\nexport * from \"./IntersectionObserver.js\";\nexport * from \"./ResizeObserver.js\";\nexport * from \"./matchMedia.js\";\nexport * from \"./render.js\";\nexport * from \"./timers.js\";\n"],"names":[],"mappings":"AAAA,cAAc,yBAAyB;AACvC,cAAc,8BAA8B;AAE5C,cAAc,4BAA4B;AAC1C,cAAc,sBAAsB;AACpC,cAAc,kBAAkB;AAChC,cAAc,cAAc;AAC5B,cAAc,cAAc"}
1
+ {"version":3,"sources":["../../src/test-utils/index.ts"],"sourcesContent":["export * from \"@testing-library/react\";\nexport * from \"@testing-library/user-event\";\n\nexport * from \"./IntersectionObserver.js\";\nexport * from \"./ResizeObserver.js\";\nexport * from \"./matchMedia.js\";\nexport * from \"./render.js\";\nexport * from \"./timers.js\";\n"],"names":[],"rangeMappings":";;;;;;","mappings":"AAAA,cAAc,yBAAyB;AACvC,cAAc,8BAA8B;AAE5C,cAAc,4BAA4B;AAC1C,cAAc,sBAAsB;AACpC,cAAc,kBAAkB;AAChC,cAAc,cAAc;AAC5B,cAAc,cAAc"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/test-utils/jest-setup.ts"],"sourcesContent":["import { beforeEach } from \"@jest/globals\";\nimport { INTERACTION_CONFIG } from \"../interaction/config.js\";\nimport { TRANSITION_CONFIG } from \"../transition/config.js\";\n\nbeforeEach(() => {\n // set the mode to `none` in tests since ripples require\n // `getBoundingClientRect()` to create correct CSS. You'll either see warnings\n // in the console around invalid css values or `NaN`.\n INTERACTION_CONFIG.mode = \"none\";\n\n // disable transitions in tests since it just makes it more difficult\n TRANSITION_CONFIG.disabled = true;\n});\n"],"names":["beforeEach","INTERACTION_CONFIG","TRANSITION_CONFIG","mode","disabled"],"mappings":"AAAA,SAASA,UAAU,QAAQ,gBAAgB;AAC3C,SAASC,kBAAkB,QAAQ,2BAA2B;AAC9D,SAASC,iBAAiB,QAAQ,0BAA0B;AAE5DF,WAAW;IACT,wDAAwD;IACxD,8EAA8E;IAC9E,qDAAqD;IACrDC,mBAAmBE,IAAI,GAAG;IAE1B,qEAAqE;IACrED,kBAAkBE,QAAQ,GAAG;AAC/B"}
1
+ {"version":3,"sources":["../../src/test-utils/jest-setup.ts"],"sourcesContent":["import { beforeEach } from \"@jest/globals\";\nimport { INTERACTION_CONFIG } from \"../interaction/config.js\";\nimport { TRANSITION_CONFIG } from \"../transition/config.js\";\n\nbeforeEach(() => {\n // set the mode to `none` in tests since ripples require\n // `getBoundingClientRect()` to create correct CSS. You'll either see warnings\n // in the console around invalid css values or `NaN`.\n INTERACTION_CONFIG.mode = \"none\";\n\n // disable transitions in tests since it just makes it more difficult\n TRANSITION_CONFIG.disabled = true;\n});\n"],"names":["beforeEach","INTERACTION_CONFIG","TRANSITION_CONFIG","mode","disabled"],"rangeMappings":";;;;;;;;;;","mappings":"AAAA,SAASA,UAAU,QAAQ,gBAAgB;AAC3C,SAASC,kBAAkB,QAAQ,2BAA2B;AAC9D,SAASC,iBAAiB,QAAQ,0BAA0B;AAE5DF,WAAW;IACT,wDAAwD;IACxD,8EAA8E;IAC9E,qDAAqD;IACrDC,mBAAmBE,IAAI,GAAG;IAE1B,qEAAqE;IACrED,kBAAkBE,QAAQ,GAAG;AAC/B"}