@react-md/core 1.0.0-next.0 → 1.0.0-next.1
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.
- package/.turbo/turbo-build.log +5 -5
- package/.turbo/turbo-lint.log +12 -0
- package/.turbo/turbo-test.log +166 -0
- package/.turbo/turbo-typecheck.log +4 -0
- package/CHANGELOG.md +57 -0
- package/coverage/clover.xml +3 -1118
- package/coverage/coverage-final.json +1 -7
- package/coverage/lcov-report/CircularProgress.tsx.html +799 -0
- package/coverage/lcov-report/Dialog.tsx.html +1309 -0
- package/coverage/lcov-report/DialogContent.tsx.html +178 -0
- package/coverage/lcov-report/DialogFooter.tsx.html +169 -0
- package/coverage/lcov-report/LinearProgress.tsx.html +658 -0
- package/coverage/lcov-report/MaterialIcon.tsx.html +36 -42
- package/coverage/lcov-report/MaterialSymbol.tsx.html +240 -222
- package/coverage/lcov-report/MenuItemInputToggle.tsx.html +979 -0
- package/coverage/lcov-report/MenuItemSeparator.tsx.html +223 -0
- package/coverage/lcov-report/MenuItemTextField.tsx.html +289 -0
- package/coverage/lcov-report/Switch.tsx.html +535 -0
- package/coverage/lcov-report/SwitchTrack.tsx.html +262 -0
- package/coverage/lcov-report/Table.tsx.html +457 -0
- package/coverage/lcov-report/TableCell.tsx.html +982 -0
- package/coverage/lcov-report/TableCheckbox.tsx.html +709 -0
- package/coverage/lcov-report/TableContainer.tsx.html +220 -0
- package/coverage/lcov-report/TableFooter.tsx.html +502 -0
- package/coverage/lcov-report/TableHeader.tsx.html +541 -0
- package/coverage/lcov-report/TableRadio.tsx.html +670 -0
- package/coverage/lcov-report/TableRow.tsx.html +289 -0
- package/coverage/lcov-report/Tooltip.tsx.html +98 -155
- package/coverage/lcov-report/avatar/Avatar.tsx.html +37 -31
- package/coverage/lcov-report/avatar/index.html +22 -7
- package/coverage/lcov-report/avatar/styles.ts.html +268 -0
- package/coverage/lcov-report/button/AsyncButton.tsx.html +217 -10
- package/coverage/lcov-report/button/Button.tsx.html +95 -83
- package/coverage/lcov-report/button/index.html +12 -12
- package/coverage/lcov-report/config.ts.html +33 -18
- package/coverage/lcov-report/cssUtils.ts.html +143 -65
- package/coverage/lcov-report/dialog/Dialog.tsx.html +170 -167
- package/coverage/lcov-report/dialog/DialogContent.tsx.html +178 -0
- package/coverage/lcov-report/dialog/DialogFooter.tsx.html +169 -0
- package/coverage/lcov-report/dialog/DialogHeader.tsx.html +148 -0
- package/coverage/lcov-report/dialog/DialogTitle.tsx.html +256 -0
- package/coverage/lcov-report/dialog/index.html +18 -33
- package/coverage/lcov-report/dialog/styles.ts.html +439 -0
- package/coverage/lcov-report/form/MenuItemInputToggle.tsx.html +36 -24
- package/coverage/lcov-report/form/MenuItemTextField.tsx.html +12 -9
- package/coverage/lcov-report/form/SliderValueTooltip.tsx.html +319 -0
- package/coverage/lcov-report/form/Switch.tsx.html +310 -385
- package/coverage/lcov-report/form/SwitchTrack.tsx.html +98 -71
- package/coverage/lcov-report/form/index.html +20 -245
- package/coverage/lcov-report/form/switchStyles.ts.html +172 -0
- package/coverage/lcov-report/form/useRadioGroup.ts.html +79 -79
- package/coverage/lcov-report/hoverMode/index.html +116 -0
- package/coverage/lcov-report/hoverMode/useHoverMode.ts.html +676 -0
- package/coverage/lcov-report/icon/FontIcon.tsx.html +37 -46
- package/coverage/lcov-report/icon/index.html +12 -12
- package/coverage/lcov-report/icon/styles.ts.html +41 -104
- package/coverage/lcov-report/iconConfig.tsx.html +973 -0
- package/coverage/lcov-report/index.html +11 -101
- package/coverage/lcov-report/link/Link.tsx.html +358 -0
- package/coverage/lcov-report/link/index.html +20 -20
- package/coverage/lcov-report/list/ListItemLink.tsx.html +29 -35
- package/coverage/lcov-report/list/index.html +8 -38
- package/coverage/lcov-report/materialConfig.ts.html +703 -0
- package/coverage/lcov-report/media-queries/appSize.ts.html +1 -1
- package/coverage/lcov-report/media-queries/index.html +10 -10
- package/coverage/lcov-report/menu/DropdownMenu.tsx.html +976 -0
- package/coverage/lcov-report/menu/Menu.tsx.html +111 -60
- package/coverage/lcov-report/menu/MenuConfigurationProvider.tsx.html +637 -0
- package/coverage/lcov-report/menu/MenuSheet.tsx.html +37 -13
- package/coverage/lcov-report/menu/index.html +35 -65
- package/coverage/lcov-report/menu/menuConfig.ts.html +118 -0
- package/coverage/lcov-report/progress/CircularProgress.tsx.html +799 -0
- package/coverage/lcov-report/progress/LinearProgress.tsx.html +100 -94
- package/coverage/lcov-report/progress/index.html +22 -7
- package/coverage/lcov-report/src/CoreProviders.tsx.html +20 -20
- package/coverage/lcov-report/src/NoSsr.tsx.html +1 -1
- package/coverage/lcov-report/src/SsrProvider.tsx.html +10 -10
- package/coverage/lcov-report/src/app-bar/AppBar.tsx.html +65 -65
- package/coverage/lcov-report/src/app-bar/AppBarTitle.tsx.html +1 -1
- package/coverage/lcov-report/src/app-bar/index.html +20 -5
- package/coverage/lcov-report/src/avatar/Avatar.tsx.html +36 -27
- package/coverage/lcov-report/src/avatar/index.html +22 -7
- package/coverage/lcov-report/src/avatar/styles.ts.html +77 -8
- package/coverage/lcov-report/src/badge/Badge.tsx.html +1 -1
- package/coverage/lcov-report/src/badge/index.html +1 -1
- package/coverage/lcov-report/src/box/Box.tsx.html +1 -1
- package/coverage/lcov-report/src/box/index.html +10 -25
- package/coverage/lcov-report/src/box/styles.ts.html +103 -49
- package/coverage/lcov-report/src/button/AsyncButton.tsx.html +833 -284
- package/coverage/lcov-report/src/button/Button.tsx.html +87 -87
- package/coverage/lcov-report/src/button/ButtonUnstyled.tsx.html +1 -1
- package/coverage/lcov-report/src/button/FloatingActionButton.tsx.html +39 -39
- package/coverage/lcov-report/src/button/buttonStyles.ts.html +59 -59
- package/coverage/lcov-report/src/button/buttonUnstyledStyles.ts.html +1 -1
- package/coverage/lcov-report/src/button/index.html +23 -8
- package/coverage/lcov-report/src/card/Card.tsx.html +1 -1
- package/coverage/lcov-report/src/card/CardContent.tsx.html +1 -1
- package/coverage/lcov-report/src/card/CardFooter.tsx.html +1 -1
- package/coverage/lcov-report/src/card/CardHeader.tsx.html +1 -1
- package/coverage/lcov-report/src/card/CardSubtitle.tsx.html +1 -1
- package/coverage/lcov-report/src/card/CardTitle.tsx.html +1 -1
- package/coverage/lcov-report/src/card/index.html +95 -5
- package/coverage/lcov-report/src/card/styles.ts.html +1 -1
- package/coverage/lcov-report/src/chip/Chip.tsx.html +1 -1
- package/coverage/lcov-report/src/chip/index.html +1 -1
- package/coverage/lcov-report/src/chip/styles.ts.html +1 -1
- package/coverage/lcov-report/src/cssUtils.ts.html +68 -59
- package/coverage/lcov-report/src/delegateEvent.ts.html +84 -84
- package/coverage/lcov-report/src/dialog/Dialog.tsx.html +158 -155
- package/coverage/lcov-report/src/dialog/DialogContainer.tsx.html +27 -27
- package/coverage/lcov-report/src/dialog/DialogContent.tsx.html +72 -72
- package/coverage/lcov-report/src/dialog/DialogFooter.tsx.html +14 -14
- package/coverage/lcov-report/src/dialog/DialogHeader.tsx.html +9 -9
- package/coverage/lcov-report/src/dialog/DialogTitle.tsx.html +124 -124
- package/coverage/lcov-report/src/dialog/FixedDialog.tsx.html +1 -1
- package/coverage/lcov-report/src/dialog/NestedDialogProvider.ts.html +3 -3
- package/coverage/lcov-report/src/dialog/index.html +21 -21
- package/coverage/lcov-report/src/dialog/styles.ts.html +61 -61
- package/coverage/lcov-report/src/divider/Divider.tsx.html +24 -24
- package/coverage/lcov-report/src/divider/index.html +21 -6
- package/coverage/lcov-report/src/divider/styles.ts.html +11 -11
- package/coverage/lcov-report/src/draggable/index.html +5 -5
- package/coverage/lcov-report/src/draggable/useDraggable.ts.html +322 -322
- package/coverage/lcov-report/src/draggable/utils.ts.html +81 -81
- package/coverage/lcov-report/src/expansion-panel/ExpansionList.tsx.html +1 -1
- package/coverage/lcov-report/src/expansion-panel/ExpansionPanel.tsx.html +1 -1
- package/coverage/lcov-report/src/expansion-panel/ExpansionPanelHeader.tsx.html +11 -20
- package/coverage/lcov-report/src/expansion-panel/index.html +25 -10
- package/coverage/lcov-report/src/expansion-panel/useExpansionList.ts.html +1 -1
- package/coverage/lcov-report/src/expansion-panel/useExpansionPanels.ts.html +1 -1
- package/coverage/lcov-report/src/focus/index.html +23 -23
- package/coverage/lcov-report/src/focus/useFocusContainer.ts.html +142 -121
- package/coverage/lcov-report/src/focus/utils.ts.html +37 -37
- package/coverage/lcov-report/src/form/Checkbox.tsx.html +1 -1
- package/coverage/lcov-report/src/form/Fieldset.tsx.html +1 -1
- package/coverage/lcov-report/src/form/FileInput.tsx.html +133 -139
- package/coverage/lcov-report/src/form/Form.tsx.html +1 -1
- package/coverage/lcov-report/src/form/FormMessage.tsx.html +126 -264
- package/coverage/lcov-report/src/form/FormMessageContainer.tsx.html +42 -45
- package/coverage/lcov-report/src/form/FormMessageCounter.tsx.html +1 -1
- package/coverage/lcov-report/src/form/InputToggle.tsx.html +7 -16
- package/coverage/lcov-report/src/form/InputToggleIcon.tsx.html +1 -1
- package/coverage/lcov-report/src/form/Label.tsx.html +102 -102
- package/coverage/lcov-report/src/form/Legend.tsx.html +1 -1
- package/coverage/lcov-report/src/form/MenuItemCheckbox.tsx.html +11 -5
- package/coverage/lcov-report/src/form/MenuItemFileInput.tsx.html +3 -3
- package/coverage/lcov-report/src/form/MenuItemInputToggle.tsx.html +21 -9
- package/coverage/lcov-report/src/form/MenuItemRadio.tsx.html +11 -5
- package/coverage/lcov-report/src/form/MenuItemSwitch.tsx.html +1 -1
- package/coverage/lcov-report/src/form/MenuItemTextField.tsx.html +13 -4
- package/coverage/lcov-report/src/form/NativeSelect.tsx.html +20 -5
- package/coverage/lcov-report/src/form/OptGroup.tsx.html +1 -1
- package/coverage/lcov-report/src/form/Option.tsx.html +4 -4
- package/coverage/lcov-report/src/form/Password.tsx.html +3 -3
- package/coverage/lcov-report/src/form/Radio.tsx.html +1 -1
- package/coverage/lcov-report/src/form/Select.tsx.html +1 -1
- package/coverage/lcov-report/src/form/SelectValue.tsx.html +1 -1
- package/coverage/lcov-report/src/form/Slider.tsx.html +129 -9
- package/coverage/lcov-report/src/form/SliderContainer.tsx.html +1 -1
- package/coverage/lcov-report/src/form/SliderMark.tsx.html +1 -1
- package/coverage/lcov-report/src/form/SliderMarkLabel.tsx.html +1 -1
- package/coverage/lcov-report/src/form/SliderThumb.tsx.html +43 -7
- package/coverage/lcov-report/src/form/SliderTrack.tsx.html +1 -1
- package/coverage/lcov-report/src/form/SliderValueMarks.tsx.html +11 -5
- package/coverage/lcov-report/src/form/SliderValueTooltip.tsx.html +2 -2
- package/coverage/lcov-report/src/form/Switch.tsx.html +310 -373
- package/coverage/lcov-report/src/form/SwitchTrack.tsx.html +99 -69
- package/coverage/lcov-report/src/form/TextArea.tsx.html +21 -9
- package/coverage/lcov-report/src/form/TextField.tsx.html +16 -10
- package/coverage/lcov-report/src/form/TextFieldAddon.tsx.html +14 -26
- package/coverage/lcov-report/src/form/TextFieldContainer.tsx.html +28 -10
- package/coverage/lcov-report/src/form/TextFieldContainerStyles.ts.html +17 -8
- package/coverage/lcov-report/src/form/fileUtils.ts.html +3 -3
- package/coverage/lcov-report/src/form/formConfig.ts.html +18 -18
- package/coverage/lcov-report/src/form/formMessageStyles.ts.html +40 -40
- package/coverage/lcov-report/src/form/index.html +14 -164
- package/coverage/lcov-report/src/form/inputToggleStyles.ts.html +1 -1
- package/coverage/lcov-report/src/form/nativeSelectStyles.ts.html +34 -7
- package/coverage/lcov-report/src/form/optionStyles.ts.html +1 -1
- package/coverage/lcov-report/src/form/passwordStyles.ts.html +1 -1
- package/coverage/lcov-report/src/form/selectStyles.ts.html +1 -1
- package/coverage/lcov-report/src/form/selectUtils.ts.html +6 -9
- package/coverage/lcov-report/src/form/sliderUtils.ts.html +20 -14
- package/coverage/lcov-report/src/form/switchStyles.ts.html +68 -68
- package/coverage/lcov-report/src/form/textAreaStyles.ts.html +3 -3
- package/coverage/lcov-report/src/form/textFieldStyles.ts.html +1 -1
- package/coverage/lcov-report/src/form/useCheckboxGroup.ts.html +2 -2
- package/coverage/lcov-report/src/form/useFileUpload.ts.html +28 -19
- package/coverage/lcov-report/src/form/useListboxProvider.ts.html +5 -8
- package/coverage/lcov-report/src/form/useNumberField.ts.html +10 -10
- package/coverage/lcov-report/src/form/useRadioGroup.ts.html +22 -7
- package/coverage/lcov-report/src/form/useRangeSlider.ts.html +3 -3
- package/coverage/lcov-report/src/form/useResizingTextArea.ts.html +523 -0
- package/coverage/lcov-report/src/form/useSlider.ts.html +2 -2
- package/coverage/lcov-report/src/form/useTextField.ts.html +32 -26
- package/coverage/lcov-report/src/form/utils.ts.html +2 -2
- package/coverage/lcov-report/src/form/validation.ts.html +2 -2
- package/coverage/lcov-report/src/hoverMode/index.html +1 -1
- package/coverage/lcov-report/src/hoverMode/useHoverMode.ts.html +95 -95
- package/coverage/lcov-report/src/hoverMode/useHoverModeProvider.ts.html +3 -3
- package/coverage/lcov-report/src/icon/FontIcon.tsx.html +34 -43
- package/coverage/lcov-report/src/icon/IconRotator.tsx.html +1 -1
- package/coverage/lcov-report/src/icon/MaterialIcon.tsx.html +36 -42
- package/coverage/lcov-report/src/icon/MaterialSymbol.tsx.html +240 -222
- package/coverage/lcov-report/src/icon/SVGIcon.tsx.html +1 -1
- package/coverage/lcov-report/src/icon/TextIconSpacing.tsx.html +33 -33
- package/coverage/lcov-report/src/icon/iconConfig.tsx.html +973 -0
- package/coverage/lcov-report/src/icon/index.html +149 -14
- package/coverage/lcov-report/src/icon/material.ts.html +748 -58
- package/coverage/lcov-report/src/icon/materialConfig.ts.html +703 -0
- package/coverage/lcov-report/src/icon/styles.ts.html +47 -110
- package/coverage/lcov-report/src/index.html +8 -8
- package/coverage/lcov-report/src/interaction/Ripple.tsx.html +60 -60
- package/coverage/lcov-report/src/interaction/RippleContainer.tsx.html +41 -47
- package/coverage/lcov-report/src/interaction/UserInteractionModeProvider.tsx.html +240 -240
- package/coverage/lcov-report/src/interaction/config.ts.html +7 -7
- package/coverage/lcov-report/src/interaction/index.html +100 -10
- package/coverage/lcov-report/src/interaction/useElementInteraction.tsx.html +146 -146
- package/coverage/lcov-report/src/interaction/useHigherContrastChildren.tsx.html +17 -17
- package/coverage/lcov-report/src/interaction/utils.ts.html +171 -171
- package/coverage/lcov-report/src/layout/LayoutAppBar.tsx.html +1 -1
- package/coverage/lcov-report/src/layout/LayoutNav.tsx.html +60 -60
- package/coverage/lcov-report/src/layout/LayoutWindowSplitter.tsx.html +1 -1
- package/coverage/lcov-report/src/layout/Main.tsx.html +1 -1
- package/coverage/lcov-report/src/layout/index.html +200 -5
- package/coverage/lcov-report/src/layout/layoutNavStyles.ts.html +5 -5
- package/coverage/lcov-report/src/layout/layoutWindowSplitterStyles.ts.html +1 -1
- package/coverage/lcov-report/src/layout/mainStyles.ts.html +1 -1
- package/coverage/lcov-report/src/layout/useExpandableLayout.ts.html +1 -1
- package/coverage/lcov-report/src/layout/useHorizontalLayoutTransition.ts.html +1 -1
- package/coverage/lcov-report/src/layout/useLayoutAppBarHeight.ts.html +1 -1
- package/coverage/lcov-report/src/layout/useLayoutTree.ts.html +1 -1
- package/coverage/lcov-report/src/layout/useLayoutWindowSplitter.ts.html +1 -1
- package/coverage/lcov-report/src/layout/useMainTabIndex.ts.html +1 -1
- package/coverage/lcov-report/src/layout/useResizableLayout.ts.html +1 -1
- package/coverage/lcov-report/src/layout/useTemporaryLayout.ts.html +3 -3
- package/coverage/lcov-report/src/link/Link.tsx.html +39 -9
- package/coverage/lcov-report/src/link/SkipToMainContent.tsx.html +1 -1
- package/coverage/lcov-report/src/link/index.html +16 -16
- package/coverage/lcov-report/src/link/styles.ts.html +1 -1
- package/coverage/lcov-report/src/list/List.tsx.html +33 -33
- package/coverage/lcov-report/src/list/ListItem.tsx.html +534 -534
- package/coverage/lcov-report/src/list/ListItemAddon.tsx.html +33 -33
- package/coverage/lcov-report/src/list/ListItemChildren.tsx.html +77 -77
- package/coverage/lcov-report/src/list/ListItemLink.tsx.html +2 -2
- package/coverage/lcov-report/src/list/ListItemText.tsx.html +35 -35
- package/coverage/lcov-report/src/list/ListSubheader.tsx.html +1 -1
- package/coverage/lcov-report/src/list/getListItemHeight.ts.html +33 -33
- package/coverage/lcov-report/src/list/index.html +128 -8
- package/coverage/lcov-report/src/list/listItemStyles.ts.html +1 -1
- package/coverage/lcov-report/src/media-queries/AppSizeProvider.tsx.html +59 -59
- package/coverage/lcov-report/src/media-queries/appSize.ts.html +1 -1
- package/coverage/lcov-report/src/media-queries/index.html +20 -5
- package/coverage/lcov-report/src/media-queries/useMediaQuery.ts.html +24 -24
- package/coverage/lcov-report/src/menu/DropdownMenu.tsx.html +73 -16
- package/coverage/lcov-report/src/menu/Menu.tsx.html +66 -33
- package/coverage/lcov-report/src/menu/MenuBar.tsx.html +1 -1
- package/coverage/lcov-report/src/menu/MenuButton.tsx.html +3 -3
- package/coverage/lcov-report/src/menu/MenuConfigurationProvider.tsx.html +1 -1
- package/coverage/lcov-report/src/menu/MenuItem.tsx.html +1 -1
- package/coverage/lcov-report/src/menu/MenuItemButton.tsx.html +3 -3
- package/coverage/lcov-report/src/menu/MenuItemGroup.tsx.html +1 -1
- package/coverage/lcov-report/src/menu/MenuItemSeparator.tsx.html +6 -36
- package/coverage/lcov-report/src/menu/MenuSheet.tsx.html +34 -7
- package/coverage/lcov-report/src/menu/MenuVisibilityProvider.tsx.html +1 -1
- package/coverage/lcov-report/src/menu/MenuWidget.tsx.html +1 -1
- package/coverage/lcov-report/src/menu/MenuWidgetKeyboardProvider.tsx.html +1 -1
- package/coverage/lcov-report/src/menu/index.html +69 -24
- package/coverage/lcov-report/src/menu/useContextMenu.ts.html +1 -1
- package/coverage/lcov-report/src/menu/useMenuBarProvider.ts.html +1 -1
- package/coverage/lcov-report/src/menu/utils.ts.html +10 -10
- package/coverage/lcov-report/src/movement/constants.ts.html +1 -1
- package/coverage/lcov-report/src/movement/findMatchIndex.ts.html +1 -1
- package/coverage/lcov-report/src/movement/index.html +53 -8
- package/coverage/lcov-report/src/movement/useKeyboardMovementProvider.ts.html +92 -92
- package/coverage/lcov-report/src/movement/utils.ts.html +1 -1
- package/coverage/lcov-report/src/overlay/Overlay.tsx.html +64 -64
- package/coverage/lcov-report/src/overlay/index.html +1 -1
- package/coverage/lcov-report/src/overlay/overlayStyles.ts.html +28 -28
- package/coverage/lcov-report/src/portal/Portal.tsx.html +9 -9
- package/coverage/lcov-report/src/portal/PortalContainerProvider.tsx.html +29 -29
- package/coverage/lcov-report/src/portal/index.html +20 -5
- package/coverage/lcov-report/src/positioning/constants.ts.html +1 -1
- package/coverage/lcov-report/src/positioning/createHorizontalPosition.ts.html +63 -63
- package/coverage/lcov-report/src/positioning/createVerticalPosition.ts.html +65 -65
- package/coverage/lcov-report/src/positioning/getFixedPosition.ts.html +94 -94
- package/coverage/lcov-report/src/positioning/index.html +70 -10
- package/coverage/lcov-report/src/positioning/useFixedPositioning.ts.html +200 -200
- package/coverage/lcov-report/src/positioning/utils.ts.html +111 -111
- package/coverage/lcov-report/src/progress/CircularProgress.tsx.html +501 -456
- package/coverage/lcov-report/src/progress/LinearProgress.tsx.html +419 -338
- package/coverage/lcov-report/src/progress/getProgressA11y.ts.html +1 -1
- package/coverage/lcov-report/src/progress/index.html +32 -32
- package/coverage/lcov-report/src/responsive-item/ResponsiveItemContainer.tsx.html +1 -1
- package/coverage/lcov-report/src/responsive-item/ResponsiveItemOverlay.tsx.html +1 -1
- package/coverage/lcov-report/src/responsive-item/index.html +20 -5
- package/coverage/lcov-report/src/responsive-item/styles.ts.html +1 -1
- package/coverage/lcov-report/src/scroll/ScrollLock.tsx.html +1 -1
- package/coverage/lcov-report/src/scroll/getScrollbarWidth.ts.html +25 -25
- package/coverage/lcov-report/src/scroll/index.html +5 -5
- package/coverage/lcov-report/src/scroll/useScrollLock.ts.html +27 -27
- package/coverage/lcov-report/src/segmented-button/SegmentedButton.tsx.html +4 -4
- package/coverage/lcov-report/src/segmented-button/SegmentedButtonContainer.tsx.html +29 -8
- package/coverage/lcov-report/src/segmented-button/index.html +50 -5
- package/coverage/lcov-report/src/segmented-button/segmentedButtonContainerStyles.ts.html +15 -6
- package/coverage/lcov-report/src/segmented-button/segmentedButtonStyles.ts.html +1 -1
- package/coverage/lcov-report/src/sheet/Sheet.tsx.html +1 -1
- package/coverage/lcov-report/src/sheet/index.html +20 -5
- package/coverage/lcov-report/src/sheet/styles.ts.html +28 -28
- package/coverage/lcov-report/src/snackbar/DefaultToastRenderer.tsx.html +8 -5
- package/coverage/lcov-report/src/snackbar/Snackbar.tsx.html +7 -133
- package/coverage/lcov-report/src/snackbar/Toast.tsx.html +2 -2
- package/coverage/lcov-report/src/snackbar/ToastActionButton.tsx.html +1 -1
- package/coverage/lcov-report/src/snackbar/ToastCloseButton.tsx.html +3 -3
- package/coverage/lcov-report/src/snackbar/ToastContent.tsx.html +7 -115
- package/coverage/lcov-report/src/snackbar/ToastManager.tsx.html +1783 -0
- package/coverage/lcov-report/src/snackbar/ToastManagerProvider.tsx.html +16 -1696
- package/coverage/lcov-report/src/snackbar/index.html +159 -9
- package/coverage/lcov-report/src/snackbar/snackbarStyles.ts.html +214 -0
- package/coverage/lcov-report/src/snackbar/toastContentStyles.ts.html +196 -0
- package/coverage/lcov-report/src/snackbar/toastStyles.ts.html +1 -1
- package/coverage/lcov-report/src/snackbar/useCurrentToastActions.ts.html +1 -1
- package/coverage/lcov-report/src/suspense/CircularProgressSuspense.tsx.html +57 -6
- package/coverage/lcov-report/src/suspense/NullSuspense.tsx.html +1 -1
- package/coverage/lcov-report/src/suspense/index.html +7 -22
- package/coverage/lcov-report/src/table/Table.tsx.html +1 -1
- package/coverage/lcov-report/src/table/TableBody.tsx.html +1 -1
- package/coverage/lcov-report/src/table/TableCell.tsx.html +20 -35
- package/coverage/lcov-report/src/table/TableCellContent.tsx.html +2 -2
- package/coverage/lcov-report/src/table/TableCheckbox.tsx.html +1 -1
- package/coverage/lcov-report/src/table/TableConfigurationProvider.tsx.html +6 -12
- package/coverage/lcov-report/src/table/TableContainer.tsx.html +1 -1
- package/coverage/lcov-report/src/table/TableContainerProvider.tsx.html +1 -1
- package/coverage/lcov-report/src/table/TableFooter.tsx.html +1 -1
- package/coverage/lcov-report/src/table/TableHeader.tsx.html +1 -1
- package/coverage/lcov-report/src/table/TableRow.tsx.html +1 -1
- package/coverage/lcov-report/src/table/index.html +113 -8
- package/coverage/lcov-report/src/tabs/Tab.tsx.html +69 -69
- package/coverage/lcov-report/src/tabs/TabList.tsx.html +92 -92
- package/coverage/lcov-report/src/tabs/TabListScrollButton.tsx.html +61 -61
- package/coverage/lcov-report/src/tabs/index.html +143 -8
- package/coverage/lcov-report/src/tabs/tabIndicatorStyles.ts.html +157 -0
- package/coverage/lcov-report/src/tabs/tabListScrollButtonStyles.ts.html +226 -0
- package/coverage/lcov-report/src/tabs/tabListStyles.ts.html +241 -0
- package/coverage/lcov-report/src/tabs/tabStyles.ts.html +17 -17
- package/coverage/lcov-report/src/tabs/useTabList.ts.html +94 -94
- package/coverage/lcov-report/src/tabs/useTabs.ts.html +54 -54
- package/coverage/lcov-report/src/tabs/utils.ts.html +3 -3
- package/coverage/lcov-report/src/test-utils/IntersectionObserver.ts.html +1 -1
- package/coverage/lcov-report/src/test-utils/ResizeObserver.ts.html +1 -1
- package/coverage/lcov-report/src/test-utils/data-testid.ts.html +100 -0
- package/coverage/lcov-report/src/test-utils/drag.ts.html +1 -1
- package/coverage/lcov-report/src/test-utils/index.html +114 -9
- package/coverage/lcov-report/src/test-utils/jest-setup.ts.html +21 -9
- package/coverage/lcov-report/src/test-utils/matchMedia.ts.html +4 -4
- package/coverage/lcov-report/src/test-utils/polyfills/IntersectionObserver.ts.html +4 -4
- package/coverage/lcov-report/src/test-utils/polyfills/ResizeObserver.ts.html +3 -3
- package/coverage/lcov-report/src/test-utils/polyfills/index.html +1 -1
- package/coverage/lcov-report/src/test-utils/polyfills/matchMedia.ts.html +6 -6
- package/coverage/lcov-report/src/test-utils/polyfills/offsetParent.ts.html +14 -14
- package/coverage/lcov-report/src/test-utils/polyfills/scrollIntoView.ts.html +5 -5
- package/coverage/lcov-report/src/test-utils/render.tsx.html +21 -21
- package/coverage/lcov-report/src/test-utils/timers.ts.html +1 -1
- package/coverage/lcov-report/src/theme/LocalStorageColorSchemeProvider.tsx.html +1 -1
- package/coverage/lcov-report/src/theme/ThemeProvider.tsx.html +22 -4
- package/coverage/lcov-report/src/theme/colors.ts.html +1 -1
- package/coverage/lcov-report/src/theme/cssVars.ts.html +1 -1
- package/coverage/lcov-report/src/theme/index.html +71 -11
- package/coverage/lcov-report/src/theme/useCSSVariables.ts.html +1 -1
- package/coverage/lcov-report/src/theme/useColorScheme.ts.html +1 -1
- package/coverage/lcov-report/src/theme/useColorSchemeMetaTag.ts.html +1 -1
- package/coverage/lcov-report/src/theme/useColorSchemeProvider.ts.html +1 -1
- package/coverage/lcov-report/src/theme/usePrefersColorScheme.ts.html +1 -1
- package/coverage/lcov-report/src/theme/utils.ts.html +58 -58
- package/coverage/lcov-report/src/tooltip/Tooltip.tsx.html +98 -74
- package/coverage/lcov-report/src/tooltip/TooltipHoverModeProvider.tsx.html +60 -6
- package/coverage/lcov-report/src/tooltip/constants.ts.html +1 -1
- package/coverage/lcov-report/src/tooltip/index.html +72 -27
- package/coverage/lcov-report/src/tooltip/tooltipStyles.ts.html +18 -18
- package/coverage/lcov-report/src/tooltip/useOverflowTooltip.ts.html +196 -196
- package/coverage/lcov-report/src/tooltip/useTooltip.ts.html +511 -211
- package/coverage/lcov-report/src/tooltip/useTooltipPosition.ts.html +29 -29
- package/coverage/lcov-report/src/tooltip/utils.ts.html +23 -23
- package/coverage/lcov-report/src/transition/CSSTransition.tsx.html +1 -1
- package/coverage/lcov-report/src/transition/Collapse.tsx.html +1 -1
- package/coverage/lcov-report/src/transition/CrossFade.tsx.html +1 -1
- package/coverage/lcov-report/src/transition/ScaleTransition.tsx.html +1 -1
- package/coverage/lcov-report/src/transition/SkeletonPlaceholder.tsx.html +1 -1
- package/coverage/lcov-report/src/transition/Slide.tsx.html +46 -46
- package/coverage/lcov-report/src/transition/SlideContainer.tsx.html +1 -1
- package/coverage/lcov-report/src/transition/collapseStyles.ts.html +13 -13
- package/coverage/lcov-report/src/transition/config.ts.html +187 -0
- package/coverage/lcov-report/src/transition/index.html +295 -10
- package/coverage/lcov-report/src/transition/maxWidthTransition.ts.html +1 -1
- package/coverage/lcov-report/src/transition/useCSSTransition.ts.html +69 -69
- package/coverage/lcov-report/src/transition/useCarousel.ts.html +1 -1
- package/coverage/lcov-report/src/transition/useCollapseTransition.ts.html +99 -99
- package/coverage/lcov-report/src/transition/useCrossFadeTransition.ts.html +1 -1
- package/coverage/lcov-report/src/transition/useMaxWidthTransition.ts.html +1 -1
- package/coverage/lcov-report/src/transition/useScaleTransition.ts.html +18 -18
- package/coverage/lcov-report/src/transition/useSkeletonPlaceholder.ts.html +1 -1
- package/coverage/lcov-report/src/transition/useSlideTransition.ts.html +20 -20
- package/coverage/lcov-report/src/transition/useTransition.ts.html +277 -250
- package/coverage/lcov-report/src/transition/utils.ts.html +68 -68
- package/coverage/lcov-report/src/tree/DefaultTreeItemRenderer.tsx.html +2 -2
- package/coverage/lcov-report/src/tree/Tree.tsx.html +24 -36
- package/coverage/lcov-report/src/tree/TreeGroup.tsx.html +45 -45
- package/coverage/lcov-report/src/tree/TreeItem.tsx.html +213 -216
- package/coverage/lcov-report/src/tree/TreeItemExpander.tsx.html +3 -3
- package/coverage/lcov-report/src/tree/TreeProvider.tsx.html +29 -11
- package/coverage/lcov-report/src/tree/index.html +114 -9
- package/coverage/lcov-report/src/tree/styles.ts.html +1 -1
- package/coverage/lcov-report/src/tree/useTree.ts.html +1 -1
- package/coverage/lcov-report/src/tree/useTreeExpansion.ts.html +1 -1
- package/coverage/lcov-report/src/tree/useTreeItems.ts.html +10 -13
- package/coverage/lcov-report/src/tree/useTreeMovement.ts.html +1 -1
- package/coverage/lcov-report/src/tree/useTreeSelection.ts.html +1 -1
- package/coverage/lcov-report/src/tree/utils.ts.html +1 -1
- package/coverage/lcov-report/src/typography/SrOnly.tsx.html +26 -26
- package/coverage/lcov-report/src/typography/TextContainer.tsx.html +1 -1
- package/coverage/lcov-report/src/typography/Typography.tsx.html +71 -71
- package/coverage/lcov-report/src/typography/WritingDirectionProvider.tsx.html +75 -75
- package/coverage/lcov-report/src/typography/index.html +64 -19
- package/coverage/lcov-report/src/useAsyncAction.ts.html +25 -25
- package/coverage/lcov-report/src/useDebouncedFunction.ts.html +1 -1
- package/coverage/lcov-report/src/useDropzone.ts.html +1 -1
- package/coverage/lcov-report/src/useEnsuredId.ts.html +8 -8
- package/coverage/lcov-report/src/useEnsuredRef.ts.html +22 -19
- package/coverage/lcov-report/src/useEnsuredState.ts.html +18 -18
- package/coverage/lcov-report/src/useHtmlClassName.ts.html +1 -1
- package/coverage/lcov-report/src/useIntersectionObserver.ts.html +32 -32
- package/coverage/lcov-report/src/useIsomorphicLayoutEffect.ts.html +1 -1
- package/coverage/lcov-report/src/useLocalStorage.ts.html +225 -225
- package/coverage/lcov-report/src/useOrientation.ts.html +32 -32
- package/coverage/lcov-report/src/usePageInactive.ts.html +25 -25
- package/coverage/lcov-report/src/useResizeListener.ts.html +1 -1
- package/coverage/lcov-report/src/useResizeObserver.ts.html +28 -28
- package/coverage/lcov-report/src/useThrottledFunction.ts.html +1 -1
- package/coverage/lcov-report/src/useToggle.ts.html +18 -18
- package/coverage/lcov-report/src/useUnmounted.ts.html +11 -11
- package/coverage/lcov-report/src/useWindowSize.ts.html +1 -1
- package/coverage/lcov-report/src/utils/RenderRecursively.tsx.html +1 -1
- package/coverage/lcov-report/src/utils/alphaNumericSort.ts.html +1 -1
- package/coverage/lcov-report/src/utils/applyRef.ts.html +11 -11
- package/coverage/lcov-report/src/utils/bem.ts.html +50 -50
- package/coverage/lcov-report/src/utils/filters.ts.html +1 -1
- package/coverage/lcov-report/src/utils/getClientPosition.ts.html +1 -1
- package/coverage/lcov-report/src/utils/getPercentage.ts.html +36 -36
- package/coverage/lcov-report/src/utils/getRangeDefaultValue.ts.html +1 -1
- package/coverage/lcov-report/src/utils/getRangeSteps.ts.html +1 -1
- package/coverage/lcov-report/src/utils/identity.ts.html +1 -1
- package/coverage/lcov-report/src/utils/index.html +212 -17
- package/coverage/lcov-report/src/utils/isElementVisible.ts.html +14 -14
- package/coverage/lcov-report/src/utils/loop.ts.html +1 -1
- package/coverage/lcov-report/src/utils/nearest.ts.html +1 -1
- package/coverage/lcov-report/src/utils/parseCssLengthUnit.ts.html +41 -41
- package/coverage/lcov-report/src/utils/randomInt.ts.html +1 -1
- package/coverage/lcov-report/src/utils/wait.ts.html +1 -1
- package/coverage/lcov-report/src/utils/withinRange.ts.html +1 -1
- package/coverage/lcov-report/src/window-splitter/WindowSplitter.tsx.html +1 -1
- package/coverage/lcov-report/src/window-splitter/index.html +1 -1
- package/coverage/lcov-report/src/window-splitter/useWindowSplitter.ts.html +1 -1
- package/coverage/lcov-report/styles.ts.html +134 -320
- package/coverage/lcov-report/switchStyles.ts.html +172 -0
- package/coverage/lcov-report/table/Table.tsx.html +526 -0
- package/coverage/lcov-report/table/TableBody.tsx.html +280 -0
- package/coverage/lcov-report/table/TableCell.tsx.html +159 -168
- package/coverage/lcov-report/table/TableCheckbox.tsx.html +10 -13
- package/coverage/lcov-report/table/TableRadio.tsx.html +670 -0
- package/coverage/lcov-report/table/TableRow.tsx.html +370 -0
- package/coverage/lcov-report/table/index.html +62 -32
- package/coverage/lcov-report/tableCellStyles.ts.html +334 -0
- package/coverage/lcov-report/tableContainerStyles.ts.html +142 -0
- package/coverage/lcov-report/tableFooterStyles.ts.html +157 -0
- package/coverage/lcov-report/tableHeaderStyles.ts.html +163 -0
- package/coverage/lcov-report/tableRowStyles.ts.html +169 -0
- package/coverage/lcov-report/tableStyles.ts.html +157 -0
- package/coverage/lcov-report/tabs/Tab.tsx.html +502 -0
- package/coverage/lcov-report/tabs/TabList.tsx.html +796 -0
- package/coverage/lcov-report/tabs/index.html +62 -17
- package/coverage/lcov-report/tabs/useTabs.ts.html +1567 -0
- package/coverage/lcov-report/tabs/utils.ts.html +337 -0
- package/coverage/lcov-report/test-utils/index.html +20 -20
- package/coverage/lcov-report/test-utils/jest-setup.ts.html +124 -0
- package/coverage/lcov-report/tooltip/Tooltip.tsx.html +98 -74
- package/coverage/lcov-report/tooltip/TooltipHoverModeProvider.tsx.html +167 -11
- package/coverage/lcov-report/tooltip/constants.ts.html +1 -1
- package/coverage/lcov-report/tooltip/index.html +32 -17
- package/coverage/lcov-report/tooltip/tooltipStyles.ts.html +181 -0
- package/coverage/lcov-report/tooltip/useTooltip.ts.html +490 -190
- package/coverage/lcov-report/tooltipStyles.ts.html +181 -0
- package/coverage/lcov-report/transition/config.ts.html +187 -0
- package/coverage/lcov-report/transition/index.html +9 -24
- package/coverage/lcov-report/transition/useTransition.ts.html +943 -0
- package/coverage/lcov-report/tree/Tree.tsx.html +24 -36
- package/coverage/lcov-report/tree/TreeItem.tsx.html +213 -216
- package/coverage/lcov-report/tree/TreeProvider.tsx.html +55 -10
- package/coverage/lcov-report/tree/index.html +14 -59
- package/coverage/lcov-report/typography/WritingDirectionProvider.tsx.html +781 -0
- package/coverage/lcov-report/typography/index.html +8 -8
- package/coverage/lcov-report/useTooltip.ts.html +651 -375
- package/coverage/lcov-report/useTransition.ts.html +934 -0
- package/coverage/lcov-report/utils/index.html +24 -39
- package/coverage/lcov-report/utils/isElementVisible.ts.html +14 -14
- package/coverage/lcov-report/utils/parseCssLengthUnit.ts.html +19 -19
- package/coverage/lcov.info +0 -1176
- package/dist/_core.scss +5 -1
- package/dist/avatar/Avatar.d.ts +2 -15
- package/dist/avatar/Avatar.js +3 -2
- package/dist/avatar/Avatar.js.map +1 -1
- package/dist/avatar/_avatar.scss +4 -2
- package/dist/avatar/styles.d.ts +20 -2
- package/dist/avatar/styles.js +4 -1
- package/dist/avatar/styles.js.map +1 -1
- package/dist/button/AsyncButton.d.ts +29 -0
- package/dist/button/AsyncButton.js +14 -1
- package/dist/button/AsyncButton.js.map +1 -1
- package/dist/chip/_chip.scss +0 -16
- package/dist/chip/styles.d.ts +1 -1
- package/dist/chip/styles.js +3 -4
- package/dist/chip/styles.js.map +1 -1
- package/dist/cssUtils.d.ts +1 -0
- package/dist/cssUtils.js +1 -1
- package/dist/cssUtils.js.map +1 -1
- package/dist/dialog/Dialog.d.ts +1 -1
- package/dist/dialog/Dialog.js +2 -1
- package/dist/dialog/Dialog.js.map +1 -1
- package/dist/focus/useFocusContainer.d.ts +8 -8
- package/dist/focus/useFocusContainer.js +11 -10
- package/dist/focus/useFocusContainer.js.map +1 -1
- package/dist/form/MenuItemInputToggle.js +2 -2
- package/dist/form/MenuItemInputToggle.js.map +1 -1
- package/dist/form/MenuItemTextField.d.ts +2 -0
- package/dist/form/MenuItemTextField.js.map +1 -1
- package/dist/form/Slider.d.ts +41 -5
- package/dist/form/Slider.js +2 -1
- package/dist/form/Slider.js.map +1 -1
- package/dist/form/SliderThumb.d.ts +7 -2
- package/dist/form/SliderThumb.js +4 -2
- package/dist/form/SliderThumb.js.map +1 -1
- package/dist/form/SliderValueMarks.js +1 -1
- package/dist/form/SliderValueMarks.js.map +1 -1
- package/dist/form/SliderValueTooltip.js +1 -1
- package/dist/form/SliderValueTooltip.js.map +1 -1
- package/dist/form/Switch.d.ts +3 -2
- package/dist/form/Switch.js +7 -26
- package/dist/form/Switch.js.map +1 -1
- package/dist/form/SwitchTrack.d.ts +2 -1
- package/dist/form/SwitchTrack.js +8 -4
- package/dist/form/SwitchTrack.js.map +1 -1
- package/dist/form/_form.scss +41 -34
- package/dist/form/switchStyles.d.ts +1 -0
- package/dist/form/switchStyles.js +2 -1
- package/dist/form/switchStyles.js.map +1 -1
- package/dist/hoverMode/useHoverMode.d.ts +2 -2
- package/dist/hoverMode/useHoverMode.js +1 -1
- package/dist/hoverMode/useHoverMode.js.map +1 -1
- package/dist/icon/FontIcon.d.ts +2 -1
- package/dist/icon/FontIcon.js +4 -5
- package/dist/icon/FontIcon.js.map +1 -1
- package/dist/icon/MaterialIcon.d.ts +2 -2
- package/dist/icon/MaterialIcon.js +3 -6
- package/dist/icon/MaterialIcon.js.map +1 -1
- package/dist/icon/MaterialSymbol.d.ts +15 -8
- package/dist/icon/MaterialSymbol.js +15 -11
- package/dist/icon/MaterialSymbol.js.map +1 -1
- package/dist/icon/iconConfig.js.map +1 -1
- package/dist/icon/material.d.ts +1 -1
- package/dist/icon/material.js.map +1 -1
- package/dist/icon/materialConfig.d.ts +156 -0
- package/dist/icon/materialConfig.js +29 -0
- package/dist/icon/materialConfig.js.map +1 -0
- package/dist/icon/styles.d.ts +0 -15
- package/dist/icon/styles.js +2 -4
- package/dist/icon/styles.js.map +1 -1
- package/dist/index.d.ts +8 -6
- package/dist/index.js +8 -6
- package/dist/index.js.map +1 -1
- package/dist/link/Link.d.ts +12 -6
- package/dist/link/Link.js +1 -2
- package/dist/link/Link.js.map +1 -1
- package/dist/list/ListItemLink.d.ts +1 -1
- package/dist/list/ListItemLink.js.map +1 -1
- package/dist/menu/DropdownMenu.d.ts +12 -1
- package/dist/menu/DropdownMenu.js +13 -4
- package/dist/menu/DropdownMenu.js.map +1 -1
- package/dist/menu/Menu.d.ts +8 -0
- package/dist/menu/Menu.js +2 -1
- package/dist/menu/Menu.js.map +1 -1
- package/dist/menu/MenuItemSeparator.d.ts +1 -2
- package/dist/menu/MenuItemSeparator.js +2 -8
- package/dist/menu/MenuItemSeparator.js.map +1 -1
- package/dist/menu/MenuSheet.d.ts +6 -1
- package/dist/menu/MenuSheet.js.map +1 -1
- package/dist/menu/menuConfig.d.ts +60 -0
- package/dist/progress/CircularProgress.d.ts +5 -4
- package/dist/progress/CircularProgress.js +3 -3
- package/dist/progress/CircularProgress.js.map +1 -1
- package/dist/progress/LinearProgress.d.ts +7 -5
- package/dist/progress/LinearProgress.js +4 -3
- package/dist/progress/LinearProgress.js.map +1 -1
- package/dist/segmented-button/_segmented-button.scss +5 -0
- package/dist/suspense/CircularProgressSuspense.d.ts +4 -0
- package/dist/suspense/CircularProgressSuspense.js +3 -1
- package/dist/suspense/CircularProgressSuspense.js.map +1 -1
- package/dist/table/Table.d.ts +0 -12
- package/dist/table/Table.js +1 -12
- package/dist/table/Table.js.map +1 -1
- package/dist/table/TableCell.d.ts +13 -38
- package/dist/table/TableCell.js +7 -15
- package/dist/table/TableCell.js.map +1 -1
- package/dist/table/TableCellContent.d.ts +9 -0
- package/dist/table/TableCellContent.js +2 -1
- package/dist/table/TableCellContent.js.map +1 -1
- package/dist/table/TableCheckbox.d.ts +2 -2
- package/dist/table/TableCheckbox.js +3 -3
- package/dist/table/TableCheckbox.js.map +1 -1
- package/dist/table/TableContainer.d.ts +0 -6
- package/dist/table/TableContainer.js +1 -6
- package/dist/table/TableContainer.js.map +1 -1
- package/dist/table/TableFooter.d.ts +7 -1
- package/dist/table/TableFooter.js +17 -16
- package/dist/table/TableFooter.js.map +1 -1
- package/dist/table/TableHeader.d.ts +7 -14
- package/dist/table/TableHeader.js +6 -14
- package/dist/table/TableHeader.js.map +1 -1
- package/dist/table/TableRadio.d.ts +106 -0
- package/dist/table/TableRadio.js +106 -0
- package/dist/table/TableRadio.js.map +1 -0
- package/dist/table/TableRow.d.ts +0 -10
- package/dist/table/TableRow.js +1 -12
- package/dist/table/TableRow.js.map +1 -1
- package/dist/table/_table.scss +16 -18
- package/dist/table/tableCellStyles.d.ts +33 -0
- package/dist/table/tableCellStyles.js +15 -0
- package/dist/table/tableCellStyles.js.map +1 -0
- package/dist/table/tableContainerStyles.d.ts +10 -0
- package/dist/table/tableContainerStyles.js +9 -0
- package/dist/table/tableContainerStyles.js.map +1 -0
- package/dist/table/tableFooterStyles.d.ts +10 -0
- package/dist/table/tableFooterStyles.js +12 -0
- package/dist/table/tableFooterStyles.js.map +1 -0
- package/dist/table/tableHeaderStyles.d.ts +10 -0
- package/dist/table/tableHeaderStyles.js +13 -0
- package/dist/table/tableHeaderStyles.js.map +1 -0
- package/dist/table/tableRowStyles.d.ts +10 -0
- package/dist/table/tableRowStyles.js +14 -0
- package/dist/table/tableRowStyles.js.map +1 -0
- package/dist/table/tableStyles.d.ts +12 -0
- package/dist/table/tableStyles.js +14 -0
- package/dist/table/tableStyles.js.map +1 -0
- package/dist/table/types.d.ts +28 -15
- package/dist/table/types.js.map +1 -1
- package/dist/tabs/_tabs.scss +2 -0
- package/dist/test-utils/data-testid.js +2 -0
- package/dist/test-utils/data-testid.js.map +1 -0
- package/dist/test-utils/jest-setup.js +3 -0
- package/dist/test-utils/jest-setup.js.map +1 -1
- package/dist/theme/ThemeProvider.d.ts +5 -0
- package/dist/theme/ThemeProvider.js.map +1 -1
- package/dist/tooltip/Tooltip.d.ts +13 -6
- package/dist/tooltip/Tooltip.js +2 -2
- package/dist/tooltip/Tooltip.js.map +1 -1
- package/dist/tooltip/TooltipHoverModeProvider.d.ts +15 -0
- package/dist/tooltip/TooltipHoverModeProvider.js.map +1 -1
- package/dist/tooltip/_tooltip.scss +1 -0
- package/dist/tooltip/tooltipStyles.d.ts +2 -1
- package/dist/tooltip/tooltipStyles.js +2 -2
- package/dist/tooltip/tooltipStyles.js.map +1 -1
- package/dist/tooltip/useTooltip.d.ts +71 -8
- package/dist/tooltip/useTooltip.js +68 -7
- package/dist/tooltip/useTooltip.js.map +1 -1
- package/dist/transition/config.d.ts +22 -0
- package/dist/transition/config.js +16 -0
- package/dist/transition/config.js.map +1 -0
- package/dist/transition/useTransition.js +15 -6
- package/dist/transition/useTransition.js.map +1 -1
- package/dist/tree/DefaultTreeItemRenderer.d.ts +1 -1
- package/dist/tree/DefaultTreeItemRenderer.js.map +1 -1
- package/dist/tree/Tree.d.ts +1 -1
- package/dist/tree/Tree.js +18 -21
- package/dist/tree/Tree.js.map +1 -1
- package/dist/tree/TreeItem.js +1 -3
- package/dist/tree/TreeItem.js.map +1 -1
- package/dist/tree/TreeProvider.d.ts +2 -0
- package/dist/tree/TreeProvider.js +3 -1
- package/dist/tree/TreeProvider.js.map +1 -1
- package/package.json +20 -17
- package/src/__tests__/NoSsr.tsx +5 -5
- package/src/__tests__/useAsyncAction.tsx +14 -6
- package/src/__tests__/useDebouncedFunction.tsx +6 -3
- package/src/__tests__/useDropzone.tsx +10 -10
- package/src/__tests__/useEnsuredId.tsx +5 -5
- package/src/__tests__/useEnsuredState.tsx +1 -2
- package/src/__tests__/useLocalStorage.tsx +21 -21
- package/src/__tests__/useResizeObserver.tsx +2 -0
- package/src/__tests__/useThrottledFunction.tsx +9 -8
- package/src/__tests__/useToggle.tsx +10 -10
- package/src/_core.scss +5 -1
- package/src/app-bar/__tests__/AppBar.tsx +15 -15
- package/src/app-bar/__tests__/AppBarTitle.tsx +3 -5
- package/src/avatar/Avatar.tsx +12 -20
- package/src/avatar/__tests__/Avatar.tsx +6 -6
- package/src/avatar/_avatar.scss +4 -2
- package/src/avatar/styles.ts +27 -4
- package/src/badge/__tests__/Badge.tsx +3 -3
- package/src/button/AsyncButton.tsx +71 -4
- package/src/button/__tests__/AsyncButton.tsx +2 -0
- package/src/button/__tests__/Button.tsx +12 -12
- package/src/button/__tests__/ButtonUnstyled.tsx +3 -3
- package/src/button/__tests__/__snapshots__/AsyncButton.tsx.snap +31 -8
- package/src/card/__tests__/Card.tsx +3 -3
- package/src/card/__tests__/CardContent.tsx +3 -3
- package/src/card/__tests__/CardFooter.tsx +3 -3
- package/src/card/__tests__/CardHeader.tsx +5 -5
- package/src/card/__tests__/CardSubtitle.tsx +3 -3
- package/src/card/__tests__/CardTitle.tsx +3 -3
- package/src/chip/__tests__/Chip.tsx +20 -22
- package/src/chip/__tests__/__snapshots__/Chip.tsx.snap +3 -3
- package/src/chip/__tests__/__snapshots__/styles.ts.snap +1 -1
- package/src/chip/_chip.scss +0 -16
- package/src/chip/styles.ts +4 -5
- package/src/cssUtils.ts +4 -1
- package/src/dialog/Dialog.tsx +5 -4
- package/src/dialog/__tests__/Dialog.tsx +316 -0
- package/src/dialog/__tests__/DialogContent.tsx +53 -0
- package/src/dialog/__tests__/DialogFooter.tsx +70 -0
- package/src/dialog/__tests__/DialogHeader.tsx +37 -0
- package/src/dialog/__tests__/DialogTitle.tsx +41 -0
- package/src/dialog/__tests__/__snapshots__/Dialog.tsx.snap +84 -0
- package/src/dialog/__tests__/__snapshots__/DialogContent.tsx.snap +36 -0
- package/src/dialog/__tests__/__snapshots__/DialogFooter.tsx.snap +186 -0
- package/src/dialog/__tests__/__snapshots__/DialogHeader.tsx.snap +18 -0
- package/src/dialog/__tests__/__snapshots__/DialogTitle.tsx.snap +26 -0
- package/src/divider/__tests__/Divider.tsx +3 -3
- package/src/draggable/__tests__/useDraggable.tsx +35 -39
- package/src/expansion-panel/__tests__/ExpansionPanel.tsx +28 -23
- package/src/focus/__tests__/useFocusContainer.tsx +280 -0
- package/src/focus/useFocusContainer.ts +17 -10
- package/src/form/MenuItemInputToggle.tsx +6 -2
- package/src/form/MenuItemTextField.tsx +3 -0
- package/src/form/Slider.tsx +45 -5
- package/src/form/SliderThumb.tsx +15 -3
- package/src/form/SliderValueMarks.tsx +3 -1
- package/src/form/SliderValueTooltip.tsx +1 -1
- package/src/form/Switch.tsx +6 -27
- package/src/form/SwitchTrack.tsx +12 -2
- package/src/form/__tests__/Checkbox.tsx +5 -5
- package/src/form/__tests__/Fieldset.tsx +3 -3
- package/src/form/__tests__/FileInput.tsx +2 -2
- package/src/form/__tests__/Label.tsx +3 -3
- package/src/form/__tests__/Legend.tsx +3 -3
- package/src/form/__tests__/Radio.tsx +3 -3
- package/src/form/__tests__/Switch.tsx +152 -0
- package/src/form/__tests__/__snapshots__/Switch.tsx.snap +428 -0
- package/src/form/__tests__/__snapshots__/useCheckboxGroup.tsx.snap +1 -1
- package/src/form/__tests__/__snapshots__/useRadioGroup.tsx.snap +1 -1
- package/src/form/__tests__/useCheckboxGroup.tsx +33 -33
- package/src/form/__tests__/useFileUpload.tsx +41 -33
- package/src/form/__tests__/useRadioGroup.tsx +25 -25
- package/src/form/_form.scss +41 -34
- package/src/form/switchStyles.ts +3 -3
- package/src/hoverMode/useHoverMode.ts +4 -4
- package/src/icon/FontIcon.tsx +2 -5
- package/src/icon/MaterialIcon.tsx +4 -6
- package/src/icon/MaterialSymbol.tsx +18 -12
- package/src/icon/__tests__/FontIcon.tsx +7 -11
- package/src/icon/__tests__/IconRotator.tsx +4 -4
- package/src/icon/__tests__/MaterialIcon.tsx +79 -0
- package/src/icon/__tests__/MaterialSymbol.tsx +100 -0
- package/src/icon/__tests__/SVGIcon.tsx +6 -5
- package/src/icon/__tests__/TextIconSpacing.tsx +15 -17
- package/src/icon/__tests__/__snapshots__/IconRotator.tsx.snap +6 -6
- package/src/icon/__tests__/__snapshots__/MaterialIcon.tsx.snap +82 -0
- package/src/icon/__tests__/__snapshots__/MaterialSymbol.tsx.snap +42 -0
- package/src/icon/iconConfig.tsx +1 -0
- package/src/icon/material.ts +284 -54
- package/src/icon/{MaterialSymbolsProvider.tsx → materialConfig.ts} +49 -67
- package/src/icon/styles.ts +0 -21
- package/src/index.ts +8 -6
- package/src/interaction/__tests__/UserInteractionModeProvider.tsx +3 -3
- package/src/layout/__tests__/useExpandableLayout.tsx +12 -1
- package/src/layout/__tests__/useLayoutTree.tsx +6 -1
- package/src/layout/__tests__/useResizableLayout.tsx +13 -1
- package/src/layout/__tests__/useTemporaryLayout.tsx +6 -1
- package/src/link/Link.tsx +15 -5
- package/src/link/__tests__/Link.tsx +3 -3
- package/src/link/__tests__/SkipToMainContent.tsx +11 -14
- package/src/list/ListItemLink.tsx +1 -1
- package/src/list/__tests__/List.tsx +7 -7
- package/src/list/__tests__/ListItem.tsx +17 -16
- package/src/list/__tests__/ListItemLink.tsx +7 -7
- package/src/list/__tests__/ListSubheader.tsx +5 -5
- package/src/menu/DropdownMenu.tsx +23 -4
- package/src/menu/Menu.tsx +11 -0
- package/src/menu/MenuItemSeparator.tsx +2 -12
- package/src/menu/MenuSheet.tsx +10 -1
- package/src/menu/__tests__/DropdownMenu.tsx +74 -65
- package/src/menu/__tests__/MenuBar.tsx +57 -48
- package/src/menu/__tests__/MenuVisibilityProvider.tsx +3 -3
- package/src/overlay/__tests__/Overlay.tsx +37 -35
- package/src/portal/__tests__/PortalContainerProvider.node.tsx +1 -0
- package/src/portal/__tests__/PortalContainerProvider.tsx +9 -9
- package/src/positioning/__tests__/useFixedPositioning.tsx +20 -14
- package/src/progress/CircularProgress.tsx +5 -4
- package/src/progress/LinearProgress.tsx +88 -86
- package/src/progress/__tests__/CircularProgress.tsx +49 -27
- package/src/progress/__tests__/LinearProgress.tsx +40 -25
- package/src/progress/__tests__/__snapshots__/CircularProgress.tsx.snap +21 -0
- package/src/progress/__tests__/__snapshots__/LinearProgress.tsx.snap +20 -0
- package/src/segmented-button/_segmented-button.scss +5 -0
- package/src/snackbar/__tests__/Snackbar.tsx +2 -2
- package/src/snackbar/__tests__/Toast.tsx +8 -3
- package/src/snackbar/__tests__/ToastActionButton.tsx +2 -2
- package/src/snackbar/__tests__/ToastCloseButton.tsx +2 -2
- package/src/snackbar/__tests__/ToastManagerProvider.tsx +8 -0
- package/src/suspense/CircularProgressSuspense.tsx +19 -2
- package/src/table/Table.tsx +1 -24
- package/src/table/TableCell.tsx +22 -85
- package/src/table/TableCellContent.tsx +20 -2
- package/src/table/TableCheckbox.tsx +3 -3
- package/src/table/TableContainer.tsx +1 -8
- package/src/table/TableFooter.tsx +30 -23
- package/src/table/TableHeader.tsx +23 -40
- package/src/table/TableRadio.tsx +195 -0
- package/src/table/TableRow.tsx +1 -28
- package/src/table/__tests__/Table.tsx +4 -10
- package/src/table/__tests__/TableBody.tsx +3 -3
- package/src/table/__tests__/TableCheckbox.tsx +10 -11
- package/src/table/__tests__/TableContainer.tsx +3 -3
- package/src/table/__tests__/TableRadio.tsx +112 -0
- package/src/table/__tests__/TableRow.tsx +4 -10
- package/src/table/__tests__/__snapshots__/Table.tsx.snap +249 -251
- package/src/table/__tests__/__snapshots__/TableBody.tsx.snap +3 -3
- package/src/table/__tests__/__snapshots__/TableCheckbox.tsx.snap +4 -4
- package/src/table/__tests__/__snapshots__/TableRadio.tsx.snap +138 -0
- package/src/table/__tests__/__snapshots__/TableRow.tsx.snap +4 -6
- package/src/table/__tests__/__snapshots__/tableContainerStyles.ts.snap +3 -0
- package/src/table/__tests__/__snapshots__/tableRowStyles.ts.snap +3 -0
- package/src/table/__tests__/__snapshots__/tableStyles.ts.snap +3 -0
- package/src/table/__tests__/tableContainerStyles.ts +8 -0
- package/src/table/__tests__/tableRowStyles.ts +8 -0
- package/src/table/__tests__/tableStyles.ts +8 -0
- package/src/table/_table.scss +16 -18
- package/src/table/tableCellStyles.ts +83 -0
- package/src/table/tableContainerStyles.ts +19 -0
- package/src/table/tableFooterStyles.ts +27 -0
- package/src/table/tableHeaderStyles.ts +29 -0
- package/src/table/tableRowStyles.ts +28 -0
- package/src/table/tableStyles.ts +24 -0
- package/src/table/types.ts +33 -15
- package/src/tabs/__tests__/Tab.tsx +3 -3
- package/src/tabs/__tests__/TabList.tsx +50 -40
- package/src/tabs/__tests__/useTabs.tsx +27 -24
- package/src/tabs/_tabs.scss +2 -0
- package/src/test-utils/data-testid.ts +5 -0
- package/src/test-utils/jest-setup.ts +4 -0
- package/src/theme/ThemeProvider.tsx +6 -0
- package/src/theme/__tests__/LocalStorageColorSchemeProvider.tsx +4 -4
- package/src/theme/__tests__/useCSSVariables.tsx +4 -4
- package/src/tooltip/Tooltip.tsx +17 -9
- package/src/tooltip/TooltipHoverModeProvider.tsx +18 -0
- package/src/tooltip/__tests__/Tooltip.tsx +147 -104
- package/src/tooltip/__tests__/TooltipHoverModeProvider.tsx +8 -3
- package/src/tooltip/__tests__/__snapshots__/Tooltip.tsx.snap +0 -33
- package/src/tooltip/_tooltip.scss +1 -0
- package/src/tooltip/tooltipStyles.ts +4 -4
- package/src/tooltip/useTooltip.ts +119 -19
- package/src/transition/__tests__/CSSTransition.tsx +12 -6
- package/src/transition/__tests__/Collapse.tsx +19 -17
- package/src/transition/__tests__/CrossFade.tsx +20 -17
- package/src/transition/__tests__/ScaleTransition.tsx +18 -14
- package/src/transition/__tests__/useCSSTransition.tsx +18 -14
- package/src/transition/__tests__/useCollapseTransition.tsx +25 -21
- package/src/transition/__tests__/useCrossFadeTransition.tsx +20 -16
- package/src/transition/__tests__/useScaleTransition.tsx +18 -12
- package/src/transition/__tests__/useTransition.tsx +165 -68
- package/src/transition/config.ts +34 -0
- package/src/transition/useTransition.ts +15 -6
- package/src/tree/DefaultTreeItemRenderer.tsx +1 -1
- package/src/tree/Tree.tsx +20 -24
- package/src/tree/TreeItem.tsx +2 -3
- package/src/tree/TreeProvider.tsx +6 -0
- package/src/tree/__tests__/Tree.tsx +7 -2
- package/src/tree/__tests__/TreeGroup.tsx +1 -0
- package/src/tree/__tests__/TreeItemExpander.tsx +1 -0
- package/src/typography/__tests__/TextContainer.tsx +3 -3
- package/src/typography/__tests__/Typography.tsx +10 -12
- package/src/typography/__tests__/WritingDirectionProvider.tsx +7 -7
- package/dist/divider/VerticalDivider.js +0 -40
- package/dist/divider/VerticalDivider.js.map +0 -1
- package/dist/divider/useVerticalDividerHeight.js +0 -40
- package/dist/divider/useVerticalDividerHeight.js.map +0 -1
- package/dist/link/LinkProvider.js +0 -26
- package/dist/link/LinkProvider.js.map +0 -1
- package/dist/tooltip/useOverflowTooltip.js +0 -71
- package/dist/tooltip/useOverflowTooltip.js.map +0 -1
- package/src/divider/VerticalDivider.tsx +0 -50
- package/src/divider/__tests__/VerticalDivider.tsx +0 -35
- package/src/divider/__tests__/__snapshots__/VerticalDivider.tsx.snap +0 -41
- package/src/divider/useVerticalDividerHeight.ts +0 -72
- package/src/icon/MaterialIconsProvider.ts +0 -23
- package/src/link/LinkProvider.tsx +0 -51
- package/src/tooltip/__tests__/useOverflowTooltip.tsx +0 -77
- package/src/tooltip/useOverflowTooltip.ts +0 -93
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/list/ListItemLink.tsx"],"sourcesContent":["\"use client\";\nimport {\n forwardRef,\n type AnchorHTMLAttributes,\n type HTMLAttributes,\n} from \"react\";\nimport { useElementInteraction } from \"../interaction/useElementInteraction.js\";\nimport { useHigherContrastChildren } from \"../interaction/useHigherContrastChildren.js\";\nimport { type CustomLinkComponent } from \"../link/
|
|
1
|
+
{"version":3,"sources":["../../src/list/ListItemLink.tsx"],"sourcesContent":["\"use client\";\nimport {\n forwardRef,\n type AnchorHTMLAttributes,\n type HTMLAttributes,\n} from \"react\";\nimport { useElementInteraction } from \"../interaction/useElementInteraction.js\";\nimport { useHigherContrastChildren } from \"../interaction/useHigherContrastChildren.js\";\nimport { type CustomLinkComponent } from \"../link/Link.js\";\nimport { type PropsWithRef } from \"../types.js\";\nimport { ListItemChildren } from \"./ListItemChildren.js\";\nimport { getListItemHeight } from \"./getListItemHeight.js\";\nimport { listItem, type ListItemClassNameOptions } from \"./listItemStyles.js\";\nimport { type ListItemChildrenProps } from \"./types.js\";\n\nexport interface ListItemLinkProps\n extends AnchorHTMLAttributes<HTMLAnchorElement>,\n ListItemClassNameOptions,\n ListItemChildrenProps {\n /** @defaultValue `\"a\"` */\n as?: CustomLinkComponent;\n\n /**\n * This should only be used if the {@link as} {@link CustomLinkComponent}\n * accepts a `to` prop instead of {@link href}.\n */\n to?: string;\n\n /**\n * The link's href. Either this or the {@link to} prop **should** be provided.\n */\n href?: string;\n\n /**\n * Any additional props to provide the wrapping `<li>` element such as\n * `style`, `className`, and `ref`.\n */\n liProps?: PropsWithRef<HTMLAttributes<HTMLLIElement>, HTMLLIElement>;\n\n /**\n * @defaultValue `disabled ? -1 : undefined`\n */\n tabIndex?: number;\n}\n\n/**\n * **Client Component**\n *\n * The `ListItemLink` should be used to render links within the `List` component.\n */\nexport const ListItemLink = forwardRef<HTMLAnchorElement, ListItemLinkProps>(\n function ListItemLink(props, ref) {\n const {\n as: Link = \"a\",\n to,\n href,\n className,\n liProps,\n textProps,\n textClassName,\n secondaryTextClassName,\n primaryText,\n secondaryText,\n secondaryTextProps,\n disableTextChildren = false,\n height: propHeight = \"auto\",\n leftAddon,\n leftAddonType = \"icon\",\n leftAddonPosition = \"middle\",\n leftAddonClassName,\n leftAddonForceWrap,\n rightAddon,\n rightAddonType = \"icon\",\n rightAddonPosition = \"middle\",\n rightAddonClassName,\n rightAddonForceWrap,\n disableLeftAddonCenteredMedia = false,\n disableRightAddonCenteredMedia = false,\n threeLines = false,\n disabled = false,\n disabledOpacity = false,\n onBlur,\n onClick,\n onKeyDown,\n onKeyUp,\n onMouseDown,\n onMouseUp,\n onMouseLeave,\n onDragStart,\n onTouchStart,\n onTouchEnd,\n onTouchMove,\n role,\n tabIndex = disabled || role === \"menuitem\" ? -1 : undefined,\n children: propChildren,\n ...remaining\n } = props;\n\n const { pressedClassName, 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 const children = useHigherContrastChildren(\n propChildren,\n !disableTextChildren\n );\n\n const height = getListItemHeight({\n height: propHeight,\n leftAddon,\n leftAddonType,\n rightAddon,\n rightAddonType,\n secondaryText,\n });\n\n return (\n <li {...liProps} role=\"none\">\n <Link\n ref={ref}\n {...remaining}\n {...handlers}\n role={role}\n className={listItem({\n className,\n link: true,\n height,\n disabled,\n disabledOpacity,\n threeLines,\n pressedClassName,\n })}\n // TODO: Figure out a better type for the CustomLinkComponent to fix this\n to={to as string}\n href={href as string}\n tabIndex={tabIndex}\n >\n <ListItemChildren\n threeLines={threeLines}\n textClassName={textClassName}\n secondaryTextClassName={secondaryTextClassName}\n disableTextChildren={disableTextChildren}\n primaryText={primaryText}\n textProps={textProps}\n secondaryText={secondaryText}\n secondaryTextProps={secondaryTextProps}\n leftAddon={leftAddon}\n leftAddonType={leftAddonType}\n leftAddonPosition={leftAddonPosition}\n leftAddonClassName={leftAddonClassName}\n leftAddonForceWrap={leftAddonForceWrap}\n rightAddon={rightAddon}\n rightAddonType={rightAddonType}\n rightAddonPosition={rightAddonPosition}\n rightAddonClassName={rightAddonClassName}\n rightAddonForceWrap={rightAddonForceWrap}\n disableLeftAddonCenteredMedia={disableLeftAddonCenteredMedia}\n disableRightAddonCenteredMedia={disableRightAddonCenteredMedia}\n >\n {children}\n </ListItemChildren>\n {ripples}\n </Link>\n </li>\n );\n }\n);\n"],"names":["forwardRef","useElementInteraction","useHigherContrastChildren","ListItemChildren","getListItemHeight","listItem","ListItemLink","props","ref","as","Link","to","href","className","liProps","textProps","textClassName","secondaryTextClassName","primaryText","secondaryText","secondaryTextProps","disableTextChildren","height","propHeight","leftAddon","leftAddonType","leftAddonPosition","leftAddonClassName","leftAddonForceWrap","rightAddon","rightAddonType","rightAddonPosition","rightAddonClassName","rightAddonForceWrap","disableLeftAddonCenteredMedia","disableRightAddonCenteredMedia","threeLines","disabled","disabledOpacity","onBlur","onClick","onKeyDown","onKeyUp","onMouseDown","onMouseUp","onMouseLeave","onDragStart","onTouchStart","onTouchEnd","onTouchMove","role","tabIndex","undefined","children","propChildren","remaining","pressedClassName","ripples","handlers","li","link"],"mappings":"AAAA;;AACA,SACEA,UAAU,QAGL,QAAQ;AACf,SAASC,qBAAqB,QAAQ,0CAA0C;AAChF,SAASC,yBAAyB,QAAQ,8CAA8C;AAGxF,SAASC,gBAAgB,QAAQ,wBAAwB;AACzD,SAASC,iBAAiB,QAAQ,yBAAyB;AAC3D,SAASC,QAAQ,QAAuC,sBAAsB;AAiC9E;;;;CAIC,GACD,OAAO,MAAMC,6BAAeN,WAC1B,SAASM,aAAaC,KAAK,EAAEC,GAAG;IAC9B,MAAM,EACJC,IAAIC,OAAO,GAAG,EACdC,EAAE,EACFC,IAAI,EACJC,SAAS,EACTC,OAAO,EACPC,SAAS,EACTC,aAAa,EACbC,sBAAsB,EACtBC,WAAW,EACXC,aAAa,EACbC,kBAAkB,EAClBC,sBAAsB,KAAK,EAC3BC,QAAQC,aAAa,MAAM,EAC3BC,SAAS,EACTC,gBAAgB,MAAM,EACtBC,oBAAoB,QAAQ,EAC5BC,kBAAkB,EAClBC,kBAAkB,EAClBC,UAAU,EACVC,iBAAiB,MAAM,EACvBC,qBAAqB,QAAQ,EAC7BC,mBAAmB,EACnBC,mBAAmB,EACnBC,gCAAgC,KAAK,EACrCC,iCAAiC,KAAK,EACtCC,aAAa,KAAK,EAClBC,WAAW,KAAK,EAChBC,kBAAkB,KAAK,EACvBC,MAAM,EACNC,OAAO,EACPC,SAAS,EACTC,OAAO,EACPC,WAAW,EACXC,SAAS,EACTC,YAAY,EACZC,WAAW,EACXC,YAAY,EACZC,UAAU,EACVC,WAAW,EACXC,IAAI,EACJC,WAAWd,YAAYa,SAAS,aAAa,CAAC,IAAIE,SAAS,EAC3DC,UAAUC,YAAY,EACtB,GAAGC,WACJ,GAAGhD;IAEJ,MAAM,EAAEiD,gBAAgB,EAAEC,OAAO,EAAEC,QAAQ,EAAE,GAAGzD,sBAAsB;QACpEsC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAZ;IACF;IACA,MAAMgB,WAAWnD,0BACfoD,cACA,CAACjC;IAGH,MAAMC,SAASlB,kBAAkB;QAC/BkB,QAAQC;QACRC;QACAC;QACAI;QACAC;QACAX;IACF;IAEA,qBACE,KAACwC;QAAI,GAAG7C,OAAO;QAAEoC,MAAK;kBACpB,cAAA,MAACxC;YACCF,KAAKA;YACJ,GAAG+C,SAAS;YACZ,GAAGG,QAAQ;YACZR,MAAMA;YACNrC,WAAWR,SAAS;gBAClBQ;gBACA+C,MAAM;gBACNtC;gBACAe;gBACAC;gBACAF;gBACAoB;YACF;YACA,yEAAyE;YACzE7C,IAAIA;YACJC,MAAMA;YACNuC,UAAUA;;8BAEV,KAAChD;oBACCiC,YAAYA;oBACZpB,eAAeA;oBACfC,wBAAwBA;oBACxBI,qBAAqBA;oBACrBH,aAAaA;oBACbH,WAAWA;oBACXI,eAAeA;oBACfC,oBAAoBA;oBACpBI,WAAWA;oBACXC,eAAeA;oBACfC,mBAAmBA;oBACnBC,oBAAoBA;oBACpBC,oBAAoBA;oBACpBC,YAAYA;oBACZC,gBAAgBA;oBAChBC,oBAAoBA;oBACpBC,qBAAqBA;oBACrBC,qBAAqBA;oBACrBC,+BAA+BA;oBAC/BC,gCAAgCA;8BAE/BkB;;gBAEFI;;;;AAIT,GACA"}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { type ReactElement, type ReactNode } from "react";
|
|
2
|
+
import { type UseStateSetter } from "../types.js";
|
|
2
3
|
import { type MenuConvenienceProps, type MenuListConvenienceProps } from "./Menu.js";
|
|
3
4
|
import { type MenuButtonProps } from "./MenuButton.js";
|
|
4
5
|
import { type MenuConfiguration } from "./MenuConfigurationProvider.js";
|
|
@@ -11,6 +12,13 @@ export interface DropdownMenuButtonProps extends MenuButtonProps, BaseDropdownMe
|
|
|
11
12
|
}
|
|
12
13
|
export interface DropdownMenuItemButtonProps extends MenuItemButtonProps, BaseDropdownMenuProps {
|
|
13
14
|
}
|
|
15
|
+
/**
|
|
16
|
+
* @remarks \@since 6.0.0
|
|
17
|
+
*/
|
|
18
|
+
export interface DropdownMenuStateProps {
|
|
19
|
+
visible: boolean;
|
|
20
|
+
setVisible: UseStateSetter<boolean>;
|
|
21
|
+
}
|
|
14
22
|
/**
|
|
15
23
|
* @remarks
|
|
16
24
|
* \@since 5.0.0
|
|
@@ -18,7 +26,10 @@ export interface DropdownMenuItemButtonProps extends MenuItemButtonProps, BaseDr
|
|
|
18
26
|
* work better by default. It's up to the user to make sure they don't provide
|
|
19
27
|
* incorrect props.
|
|
20
28
|
*/
|
|
21
|
-
export type DropdownMenuProps = DropdownMenuButtonProps & DropdownMenuItemButtonProps
|
|
29
|
+
export type DropdownMenuProps = DropdownMenuButtonProps & DropdownMenuItemButtonProps & (DropdownMenuStateProps | {
|
|
30
|
+
visible?: never;
|
|
31
|
+
setVisible?: never;
|
|
32
|
+
});
|
|
22
33
|
/**
|
|
23
34
|
* **Client Component**
|
|
24
35
|
*
|
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
-
import { useCallback, useRef
|
|
3
|
+
import { useCallback, useRef } from "react";
|
|
4
4
|
import { useUserInteractionMode } from "../interaction/UserInteractionModeProvider.js";
|
|
5
5
|
import { getLastFocusableIndex } from "../movement/utils.js";
|
|
6
6
|
import { useEnsuredId } from "../useEnsuredId.js";
|
|
7
|
+
import { useEnsuredState } from "../useEnsuredState.js";
|
|
7
8
|
import { Menu } from "./Menu.js";
|
|
8
9
|
import { MenuButton } from "./MenuButton.js";
|
|
9
10
|
import { MenuConfigurationProvider } from "./MenuConfigurationProvider.js";
|
|
@@ -65,10 +66,14 @@ import { useMenuBarContext } from "./useMenuBarProvider.js";
|
|
|
65
66
|
* \@since 5.0.0
|
|
66
67
|
* \@since 6.0.0 Updated to use the latest menu API.
|
|
67
68
|
*/ export function DropdownMenu(props) {
|
|
68
|
-
const { id: propId, horizontal, sheetHeader, sheetFooter, renderAsSheet, sheetPosition, sheetVerticalSize, buttonChildren, iconRotatorProps: propIconRotatorProps, disableTransition: propDisableTransition, anchor, vwMargin, vhMargin, xMargin, yMargin, initialX, initialY, width, transformOrigin, preventOverlap, disableSwapping, disableVHBounds, preventScroll, closeOnResize, closeOnScroll, getFixedPositionOptions, children, temporary, disablePortal, disableElevation, menuProps, menuStyle, menuClassName, sheetProps, sheetStyle, sheetClassName, ...remaining } = props;
|
|
69
|
+
const { id: propId, horizontal, sheetHeader, sheetFooter, renderAsSheet, sheetPosition, sheetVerticalSize, buttonChildren, iconRotatorProps: propIconRotatorProps, disableTransition: propDisableTransition, floating, anchor, vwMargin, vhMargin, xMargin, yMargin, initialX, initialY, width, transformOrigin, preventOverlap, disableSwapping, disableVHBounds, preventScroll, closeOnResize, closeOnScroll, getFixedPositionOptions, children, temporary, disablePortal, disableElevation, menuProps, menuStyle, menuClassName, sheetProps, sheetStyle, sheetClassName, visible: propVisible, setVisible: propSetVisible, ...remaining } = props;
|
|
69
70
|
const fixedTo = useRef(null);
|
|
70
71
|
const defaultFocusIndex = useRef(0);
|
|
71
|
-
const [visible, setVisible] =
|
|
72
|
+
const [visible, setVisible] = useEnsuredState({
|
|
73
|
+
value: propVisible,
|
|
74
|
+
setValue: propSetVisible,
|
|
75
|
+
defaultValue: false
|
|
76
|
+
});
|
|
72
77
|
const { menubar, menuitem, activeIdRef, animatedOnceRef } = useMenuBarContext();
|
|
73
78
|
const id = useEnsuredId(propId, `menu${menuitem ? "item" : "button"}`);
|
|
74
79
|
const mode = useUserInteractionMode();
|
|
@@ -77,7 +82,9 @@ import { useMenuBarContext } from "./useMenuBarProvider.js";
|
|
|
77
82
|
const disableTransition = propDisableTransition ?? (animatedOnceRef.current && menubar && !!activeIdRef.current && (mouse || keyboard));
|
|
78
83
|
const onRequestClose = useCallback(()=>{
|
|
79
84
|
setVisible(false);
|
|
80
|
-
}, [
|
|
85
|
+
}, [
|
|
86
|
+
setVisible
|
|
87
|
+
]);
|
|
81
88
|
let iconRotatorProps = propIconRotatorProps;
|
|
82
89
|
if (disableTransition) {
|
|
83
90
|
iconRotatorProps = {
|
|
@@ -99,6 +106,7 @@ import { useMenuBarContext } from "./useMenuBarProvider.js";
|
|
|
99
106
|
...remaining,
|
|
100
107
|
id: id,
|
|
101
108
|
ref: fixedTo,
|
|
109
|
+
floating: floating,
|
|
102
110
|
iconRotatorProps: iconRotatorProps,
|
|
103
111
|
children: buttonChildren
|
|
104
112
|
});
|
|
@@ -128,6 +136,7 @@ import { useMenuBarContext } from "./useMenuBarProvider.js";
|
|
|
128
136
|
disablePortal: disablePortal,
|
|
129
137
|
disableElevation: disableElevation,
|
|
130
138
|
disableTransition: disableTransition,
|
|
139
|
+
floating: floating,
|
|
131
140
|
anchor: anchor,
|
|
132
141
|
vwMargin: vwMargin,
|
|
133
142
|
vhMargin: vhMargin,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/menu/DropdownMenu.tsx"],"sourcesContent":["\"use client\";\nimport {\n useCallback,\n useRef,\n useState,\n type ReactElement,\n type ReactNode,\n type RefObject,\n} from \"react\";\nimport { useUserInteractionMode } from \"../interaction/UserInteractionModeProvider.js\";\nimport { getLastFocusableIndex } from \"../movement/utils.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\nimport {\n Menu,\n type MenuConvenienceProps,\n type MenuListConvenienceProps,\n} from \"./Menu.js\";\nimport { MenuButton, type MenuButtonProps } from \"./MenuButton.js\";\nimport {\n MenuConfigurationProvider,\n type MenuConfiguration,\n} from \"./MenuConfigurationProvider.js\";\nimport { MenuItemButton, type MenuItemButtonProps } from \"./MenuItemButton.js\";\nimport { type MenuSheetConvenienceProps } from \"./MenuSheet.js\";\nimport { MenuVisibilityProvider } from \"./MenuVisibilityProvider.js\";\nimport { useMenuBarContext } from \"./useMenuBarProvider.js\";\n\nexport interface BaseDropdownMenuProps\n extends MenuConfiguration,\n MenuListConvenienceProps,\n MenuSheetConvenienceProps,\n MenuConvenienceProps {\n buttonChildren: ReactNode;\n}\n\nexport interface DropdownMenuButtonProps\n extends MenuButtonProps,\n BaseDropdownMenuProps {}\n\nexport interface DropdownMenuItemButtonProps\n extends MenuItemButtonProps,\n BaseDropdownMenuProps {}\n\n/**\n * @remarks\n * \\@since 5.0.0\n * \\@since 6.0.0 Updated to use an `&` instead of `|` to allow autocompletion to\n * work better by default. It's up to the user to make sure they don't provide\n * incorrect props.\n */\nexport type DropdownMenuProps = DropdownMenuButtonProps &\n DropdownMenuItemButtonProps;\n\n/**\n * **Client Component**\n *\n * @example\n * Simple Example\n * ```tsx\n * import type { ReactElement } from \"react\";\n * import { DropdownMenu, MenuItem } from \"@react-md/core\";\n *\n * function Example() {\n * return (\n * <DropdownMenu buttonChildren=\"Dropdown\">\n * <MenuItem onClick={() => console.log('Clicked Item 1')}>\n * Item 1\n * </MenuItem>\n * <MenuItem onClick={() => console.log('Clicked Item 2')}>\n * Item 2\n * </MenuItem>\n * </DropdownMenu>\n * );\n * }\n * ```\n *\n * @example\n * Nested Dropdown Menus\n * ```tsx\n * import type { ReactElement } from \"react\";\n * import { DropdownMenu, MenuItem } from \"@react-md/core\";\n *\n * function Example() {\n * return (\n * <DropdownMenu buttonChildren=\"Dropdown\">\n * <MenuItem onClick={() => console.log('Clicked Item 1')}>\n * Item 1\n * </MenuItem>\n * <MenuItem onClick={() => console.log('Clicked Item 2')}>\n * Item 2\n * </MenuItem>\n * <DropdownMenu buttonChildren=\"Nested Dropdown\">\n * <MenuItem onClick={() => console.log('Clicked Item 1')}>\n * Nested Item 1\n * </MenuItem>\n * <MenuItem onClick={() => console.log('Clicked Item 2')}>\n * Nested Item 2\n * </MenuItem>\n * </DropdownMenu>\n * </DropdownMenu>\n * );\n * }\n * ```\n *\n * @remarks\n * \\@since 5.0.0\n * \\@since 6.0.0 Updated to use the latest menu API.\n */\nexport function DropdownMenu(props: DropdownMenuProps): ReactElement {\n const {\n id: propId,\n horizontal,\n sheetHeader,\n sheetFooter,\n renderAsSheet,\n sheetPosition,\n sheetVerticalSize,\n buttonChildren,\n iconRotatorProps: propIconRotatorProps,\n disableTransition: propDisableTransition,\n anchor,\n vwMargin,\n vhMargin,\n xMargin,\n yMargin,\n initialX,\n initialY,\n width,\n transformOrigin,\n preventOverlap,\n disableSwapping,\n disableVHBounds,\n preventScroll,\n closeOnResize,\n closeOnScroll,\n getFixedPositionOptions,\n children,\n temporary,\n disablePortal,\n disableElevation,\n menuProps,\n menuStyle,\n menuClassName,\n sheetProps,\n sheetStyle,\n sheetClassName,\n ...remaining\n } = props;\n\n const fixedTo = useRef<HTMLElement | HTMLButtonElement>(null);\n const defaultFocusIndex = useRef(0);\n const [visible, setVisible] = useState(false);\n const { menubar, menuitem, activeIdRef, animatedOnceRef } =\n useMenuBarContext();\n const id = useEnsuredId(propId, `menu${menuitem ? \"item\" : \"button\"}`);\n const mode = useUserInteractionMode();\n const mouse = mode === \"mouse\";\n const keyboard = mode === \"keyboard\";\n const disableTransition =\n propDisableTransition ??\n (animatedOnceRef.current &&\n menubar &&\n !!activeIdRef.current &&\n (mouse || keyboard));\n\n const onRequestClose = useCallback(() => {\n setVisible(false);\n }, []);\n\n let iconRotatorProps = propIconRotatorProps;\n if (disableTransition) {\n iconRotatorProps = {\n disableTransition,\n ...propIconRotatorProps,\n };\n }\n\n let toggle: ReactElement;\n if (menuitem) {\n toggle = (\n <MenuItemButton\n {...(remaining as DropdownMenuItemButtonProps)}\n id={id}\n ref={fixedTo as RefObject<HTMLLIElement>}\n iconRotatorProps={iconRotatorProps}\n >\n {buttonChildren}\n </MenuItemButton>\n );\n } else {\n toggle = (\n <MenuButton\n {...(remaining as DropdownMenuButtonProps)}\n id={id}\n ref={fixedTo as RefObject<HTMLButtonElement>}\n iconRotatorProps={iconRotatorProps}\n >\n {buttonChildren}\n </MenuButton>\n );\n }\n\n return (\n <MenuVisibilityProvider\n visible={visible}\n setVisible={setVisible}\n defaultFocusIndex={defaultFocusIndex}\n >\n <MenuConfigurationProvider\n horizontal={horizontal}\n renderAsSheet={renderAsSheet}\n sheetFooter={sheetFooter}\n sheetHeader={sheetHeader}\n sheetPosition={sheetPosition}\n sheetVerticalSize={sheetVerticalSize}\n >\n {toggle}\n </MenuConfigurationProvider>\n <Menu\n aria-labelledby={(menuProps?.[\"aria-label\"] ? undefined : id) as string}\n style={menuStyle}\n className={menuClassName}\n sheetProps={sheetProps}\n sheetStyle={sheetStyle}\n sheetClassName={sheetClassName}\n temporary={temporary}\n disablePortal={disablePortal}\n disableElevation={disableElevation}\n disableTransition={disableTransition}\n anchor={anchor}\n vwMargin={vwMargin}\n vhMargin={vhMargin}\n xMargin={xMargin}\n yMargin={yMargin}\n initialX={initialX}\n initialY={initialY}\n width={width}\n transformOrigin={transformOrigin}\n preventOverlap={preventOverlap}\n disableSwapping={disableSwapping}\n disableVHBounds={disableVHBounds}\n preventScroll={preventScroll}\n closeOnResize={closeOnResize}\n closeOnScroll={closeOnScroll}\n getFixedPositionOptions={getFixedPositionOptions}\n horizontal={horizontal}\n sheetHeader={sheetHeader}\n sheetFooter={sheetFooter}\n renderAsSheet={renderAsSheet}\n sheetPosition={sheetPosition}\n sheetVerticalSize={sheetVerticalSize}\n {...menuProps}\n fixedTo={fixedTo}\n visible={visible}\n getDefaultFocusedIndex={(options) => {\n const defaultIndex = defaultFocusIndex.current;\n if (defaultIndex < 0) {\n return getLastFocusableIndex(options);\n }\n\n return defaultIndex;\n }}\n onRequestClose={onRequestClose}\n onEntered={(appearing) => {\n menuProps?.onEntered?.(appearing);\n // this will be called before `getDefaultFocusedIndex`\n if (disableTransition) {\n return;\n }\n\n defaultFocusIndex.current = 0;\n }}\n >\n {children}\n </Menu>\n </MenuVisibilityProvider>\n );\n}\n"],"names":["useCallback","useRef","useState","useUserInteractionMode","getLastFocusableIndex","useEnsuredId","Menu","MenuButton","MenuConfigurationProvider","MenuItemButton","MenuVisibilityProvider","useMenuBarContext","DropdownMenu","props","id","propId","horizontal","sheetHeader","sheetFooter","renderAsSheet","sheetPosition","sheetVerticalSize","buttonChildren","iconRotatorProps","propIconRotatorProps","disableTransition","propDisableTransition","anchor","vwMargin","vhMargin","xMargin","yMargin","initialX","initialY","width","transformOrigin","preventOverlap","disableSwapping","disableVHBounds","preventScroll","closeOnResize","closeOnScroll","getFixedPositionOptions","children","temporary","disablePortal","disableElevation","menuProps","menuStyle","menuClassName","sheetProps","sheetStyle","sheetClassName","remaining","fixedTo","defaultFocusIndex","visible","setVisible","menubar","menuitem","activeIdRef","animatedOnceRef","mode","mouse","keyboard","current","onRequestClose","toggle","ref","aria-labelledby","undefined","style","className","getDefaultFocusedIndex","options","defaultIndex","onEntered","appearing"],"mappings":"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"}
|
|
1
|
+
{"version":3,"sources":["../../src/menu/DropdownMenu.tsx"],"sourcesContent":["\"use client\";\nimport {\n useCallback,\n useRef,\n type ReactElement,\n type ReactNode,\n type RefObject,\n} from \"react\";\nimport { useUserInteractionMode } from \"../interaction/UserInteractionModeProvider.js\";\nimport { getLastFocusableIndex } from \"../movement/utils.js\";\nimport { type UseStateSetter } from \"../types.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\nimport { useEnsuredState } from \"../useEnsuredState.js\";\nimport {\n Menu,\n type MenuConvenienceProps,\n type MenuListConvenienceProps,\n} from \"./Menu.js\";\nimport { MenuButton, type MenuButtonProps } from \"./MenuButton.js\";\nimport {\n MenuConfigurationProvider,\n type MenuConfiguration,\n} from \"./MenuConfigurationProvider.js\";\nimport { MenuItemButton, type MenuItemButtonProps } from \"./MenuItemButton.js\";\nimport { type MenuSheetConvenienceProps } from \"./MenuSheet.js\";\nimport { MenuVisibilityProvider } from \"./MenuVisibilityProvider.js\";\nimport { useMenuBarContext } from \"./useMenuBarProvider.js\";\n\nexport interface BaseDropdownMenuProps\n extends MenuConfiguration,\n MenuListConvenienceProps,\n MenuSheetConvenienceProps,\n MenuConvenienceProps {\n buttonChildren: ReactNode;\n}\n\nexport interface DropdownMenuButtonProps\n extends MenuButtonProps,\n BaseDropdownMenuProps {}\n\nexport interface DropdownMenuItemButtonProps\n extends MenuItemButtonProps,\n BaseDropdownMenuProps {}\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface DropdownMenuStateProps {\n visible: boolean;\n setVisible: UseStateSetter<boolean>;\n}\n\n/**\n * @remarks\n * \\@since 5.0.0\n * \\@since 6.0.0 Updated to use an `&` instead of `|` to allow autocompletion to\n * work better by default. It's up to the user to make sure they don't provide\n * incorrect props.\n */\nexport type DropdownMenuProps = DropdownMenuButtonProps &\n DropdownMenuItemButtonProps &\n (DropdownMenuStateProps | { visible?: never; setVisible?: never });\n\n/**\n * **Client Component**\n *\n * @example\n * Simple Example\n * ```tsx\n * import type { ReactElement } from \"react\";\n * import { DropdownMenu, MenuItem } from \"@react-md/core\";\n *\n * function Example() {\n * return (\n * <DropdownMenu buttonChildren=\"Dropdown\">\n * <MenuItem onClick={() => console.log('Clicked Item 1')}>\n * Item 1\n * </MenuItem>\n * <MenuItem onClick={() => console.log('Clicked Item 2')}>\n * Item 2\n * </MenuItem>\n * </DropdownMenu>\n * );\n * }\n * ```\n *\n * @example\n * Nested Dropdown Menus\n * ```tsx\n * import type { ReactElement } from \"react\";\n * import { DropdownMenu, MenuItem } from \"@react-md/core\";\n *\n * function Example() {\n * return (\n * <DropdownMenu buttonChildren=\"Dropdown\">\n * <MenuItem onClick={() => console.log('Clicked Item 1')}>\n * Item 1\n * </MenuItem>\n * <MenuItem onClick={() => console.log('Clicked Item 2')}>\n * Item 2\n * </MenuItem>\n * <DropdownMenu buttonChildren=\"Nested Dropdown\">\n * <MenuItem onClick={() => console.log('Clicked Item 1')}>\n * Nested Item 1\n * </MenuItem>\n * <MenuItem onClick={() => console.log('Clicked Item 2')}>\n * Nested Item 2\n * </MenuItem>\n * </DropdownMenu>\n * </DropdownMenu>\n * );\n * }\n * ```\n *\n * @remarks\n * \\@since 5.0.0\n * \\@since 6.0.0 Updated to use the latest menu API.\n */\nexport function DropdownMenu(props: DropdownMenuProps): ReactElement {\n const {\n id: propId,\n horizontal,\n sheetHeader,\n sheetFooter,\n renderAsSheet,\n sheetPosition,\n sheetVerticalSize,\n buttonChildren,\n iconRotatorProps: propIconRotatorProps,\n disableTransition: propDisableTransition,\n floating,\n anchor,\n vwMargin,\n vhMargin,\n xMargin,\n yMargin,\n initialX,\n initialY,\n width,\n transformOrigin,\n preventOverlap,\n disableSwapping,\n disableVHBounds,\n preventScroll,\n closeOnResize,\n closeOnScroll,\n getFixedPositionOptions,\n children,\n temporary,\n disablePortal,\n disableElevation,\n menuProps,\n menuStyle,\n menuClassName,\n sheetProps,\n sheetStyle,\n sheetClassName,\n visible: propVisible,\n setVisible: propSetVisible,\n ...remaining\n } = props;\n\n const fixedTo = useRef<HTMLElement | HTMLButtonElement>(null);\n const defaultFocusIndex = useRef(0);\n const [visible, setVisible] = useEnsuredState({\n value: propVisible,\n setValue: propSetVisible,\n defaultValue: false,\n });\n const { menubar, menuitem, activeIdRef, animatedOnceRef } =\n useMenuBarContext();\n const id = useEnsuredId(propId, `menu${menuitem ? \"item\" : \"button\"}`);\n const mode = useUserInteractionMode();\n const mouse = mode === \"mouse\";\n const keyboard = mode === \"keyboard\";\n const disableTransition =\n propDisableTransition ??\n (animatedOnceRef.current &&\n menubar &&\n !!activeIdRef.current &&\n (mouse || keyboard));\n\n const onRequestClose = useCallback(() => {\n setVisible(false);\n }, [setVisible]);\n\n let iconRotatorProps = propIconRotatorProps;\n if (disableTransition) {\n iconRotatorProps = {\n disableTransition,\n ...propIconRotatorProps,\n };\n }\n\n let toggle: ReactElement;\n if (menuitem) {\n toggle = (\n <MenuItemButton\n {...(remaining as DropdownMenuItemButtonProps)}\n id={id}\n ref={fixedTo as RefObject<HTMLLIElement>}\n iconRotatorProps={iconRotatorProps}\n >\n {buttonChildren}\n </MenuItemButton>\n );\n } else {\n toggle = (\n <MenuButton\n {...(remaining as DropdownMenuButtonProps)}\n id={id}\n ref={fixedTo as RefObject<HTMLButtonElement>}\n floating={floating}\n iconRotatorProps={iconRotatorProps}\n >\n {buttonChildren}\n </MenuButton>\n );\n }\n\n return (\n <MenuVisibilityProvider\n visible={visible}\n setVisible={setVisible}\n defaultFocusIndex={defaultFocusIndex}\n >\n <MenuConfigurationProvider\n horizontal={horizontal}\n renderAsSheet={renderAsSheet}\n sheetFooter={sheetFooter}\n sheetHeader={sheetHeader}\n sheetPosition={sheetPosition}\n sheetVerticalSize={sheetVerticalSize}\n >\n {toggle}\n </MenuConfigurationProvider>\n <Menu\n aria-labelledby={(menuProps?.[\"aria-label\"] ? undefined : id) as string}\n style={menuStyle}\n className={menuClassName}\n sheetProps={sheetProps}\n sheetStyle={sheetStyle}\n sheetClassName={sheetClassName}\n temporary={temporary}\n disablePortal={disablePortal}\n disableElevation={disableElevation}\n disableTransition={disableTransition}\n floating={floating}\n anchor={anchor}\n vwMargin={vwMargin}\n vhMargin={vhMargin}\n xMargin={xMargin}\n yMargin={yMargin}\n initialX={initialX}\n initialY={initialY}\n width={width}\n transformOrigin={transformOrigin}\n preventOverlap={preventOverlap}\n disableSwapping={disableSwapping}\n disableVHBounds={disableVHBounds}\n preventScroll={preventScroll}\n closeOnResize={closeOnResize}\n closeOnScroll={closeOnScroll}\n getFixedPositionOptions={getFixedPositionOptions}\n horizontal={horizontal}\n sheetHeader={sheetHeader}\n sheetFooter={sheetFooter}\n renderAsSheet={renderAsSheet}\n sheetPosition={sheetPosition}\n sheetVerticalSize={sheetVerticalSize}\n {...menuProps}\n fixedTo={fixedTo}\n visible={visible}\n getDefaultFocusedIndex={(options) => {\n const defaultIndex = defaultFocusIndex.current;\n if (defaultIndex < 0) {\n return getLastFocusableIndex(options);\n }\n\n return defaultIndex;\n }}\n onRequestClose={onRequestClose}\n onEntered={(appearing) => {\n menuProps?.onEntered?.(appearing);\n // this will be called before `getDefaultFocusedIndex`\n if (disableTransition) {\n return;\n }\n\n defaultFocusIndex.current = 0;\n }}\n >\n {children}\n </Menu>\n </MenuVisibilityProvider>\n );\n}\n"],"names":["useCallback","useRef","useUserInteractionMode","getLastFocusableIndex","useEnsuredId","useEnsuredState","Menu","MenuButton","MenuConfigurationProvider","MenuItemButton","MenuVisibilityProvider","useMenuBarContext","DropdownMenu","props","id","propId","horizontal","sheetHeader","sheetFooter","renderAsSheet","sheetPosition","sheetVerticalSize","buttonChildren","iconRotatorProps","propIconRotatorProps","disableTransition","propDisableTransition","floating","anchor","vwMargin","vhMargin","xMargin","yMargin","initialX","initialY","width","transformOrigin","preventOverlap","disableSwapping","disableVHBounds","preventScroll","closeOnResize","closeOnScroll","getFixedPositionOptions","children","temporary","disablePortal","disableElevation","menuProps","menuStyle","menuClassName","sheetProps","sheetStyle","sheetClassName","visible","propVisible","setVisible","propSetVisible","remaining","fixedTo","defaultFocusIndex","value","setValue","defaultValue","menubar","menuitem","activeIdRef","animatedOnceRef","mode","mouse","keyboard","current","onRequestClose","toggle","ref","aria-labelledby","undefined","style","className","getDefaultFocusedIndex","options","defaultIndex","onEntered","appearing"],"mappings":"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"}
|
package/dist/menu/Menu.d.ts
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { type CSSProperties, type HTMLAttributes } from "react";
|
|
2
|
+
import { type FloatingActionButtonPosition } from "../button/FloatingActionButton.jsx";
|
|
2
3
|
import { type ListElement, type ListProps } from "../list/List.js";
|
|
3
4
|
import { type GetDefaultFocusedIndex } from "../movement/types.js";
|
|
4
5
|
import { type CalculateFixedPositionOptions } from "../positioning/types.js";
|
|
@@ -161,6 +162,13 @@ export interface MenuProps extends HTMLAttributes<HTMLDivElement>, MenuConfigura
|
|
|
161
162
|
* sheet.
|
|
162
163
|
*/
|
|
163
164
|
menuClassName?: string;
|
|
165
|
+
/**
|
|
166
|
+
* @internal
|
|
167
|
+
*
|
|
168
|
+
* This is only used to update the default anchor when the DropdownMenu's
|
|
169
|
+
* toggle is a floating action button.
|
|
170
|
+
*/
|
|
171
|
+
floating?: FloatingActionButtonPosition;
|
|
164
172
|
}
|
|
165
173
|
/**
|
|
166
174
|
* **Client Component**
|
package/dist/menu/Menu.js
CHANGED
|
@@ -35,7 +35,7 @@ const noop = ()=>{
|
|
|
35
35
|
* implementation so that the `MenuRenderer` is no longer required and context
|
|
36
36
|
* menus can appear as a `Sheet`.
|
|
37
37
|
*/ export const Menu = /*#__PURE__*/ forwardRef(function Menu(props, propRef) {
|
|
38
|
-
const { id: propId, style: propStyle, role = "menu", children, horizontal: _horizontal, sheetHeader: _sheetHeader, sheetFooter: _sheetFooter, renderAsSheet: _renderAsSheet, sheetPosition: _sheetPosition, sheetVerticalSize: _sheetVerticalSize, sheetProps, sheetStyle, sheetClassName, menuStyle, menuClassName, disableElevation = false, temporary = true, tabIndex = -1, fixedTo, className, classNames, timeout, appear, enter, exit, onEnter, onEntering = noop, onEntered = noop, onExit, onExiting, onExited = noop, onKeyDown = noop, listProps, listStyle, listClassName, visible, onRequestClose, anchor, closeOnResize = false, closeOnScroll = false, preventScroll = false, vwMargin, vhMargin, xMargin, yMargin, width, transformOrigin = true, preventOverlap, disableSwapping, disableVHBounds, initialX, initialY, getFixedPositionOptions, disablePortal: propDisablePortal, disableTransition, ...remaining } = props;
|
|
38
|
+
const { id: propId, style: propStyle, role = "menu", children, horizontal: _horizontal, sheetHeader: _sheetHeader, sheetFooter: _sheetFooter, renderAsSheet: _renderAsSheet, sheetPosition: _sheetPosition, sheetVerticalSize: _sheetVerticalSize, sheetProps, sheetStyle, sheetClassName, menuStyle, menuClassName, disableElevation = false, temporary = true, tabIndex = -1, fixedTo, className, classNames, timeout, appear, enter, exit, onEnter, onEntering = noop, onEntered = noop, onExit, onExiting, onExited = noop, onKeyDown = noop, listProps, listStyle, listClassName, visible, onRequestClose, floating, anchor, closeOnResize = false, closeOnScroll = false, preventScroll = false, vwMargin, vhMargin, xMargin, yMargin, width, transformOrigin = true, preventOverlap, disableSwapping, disableVHBounds, initialX, initialY, getFixedPositionOptions, disablePortal: propDisablePortal, disableTransition, ...remaining } = props;
|
|
39
39
|
const { "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy } = props;
|
|
40
40
|
const id = useEnsuredId(propId, "menu");
|
|
41
41
|
const { root, menubar, menuitem, activeId, animatedOnceRef, hoverTimeoutRef, disableHoverMode } = useMenuBarContext();
|
|
@@ -133,6 +133,7 @@ const noop = ()=>{
|
|
|
133
133
|
anchor: getDefaultAnchor({
|
|
134
134
|
anchor,
|
|
135
135
|
menubar,
|
|
136
|
+
floating,
|
|
136
137
|
menuitem: !root && menuitem,
|
|
137
138
|
horizontal
|
|
138
139
|
}),
|
package/dist/menu/Menu.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/menu/Menu.tsx"],"sourcesContent":["\"use client\";\nimport { cnb } from \"cnbuilder\";\nimport {\n forwardRef,\n useEffect,\n useRef,\n type CSSProperties,\n type HTMLAttributes,\n} from \"react\";\nimport { useFocusContainer } from \"../focus/useFocusContainer.js\";\nimport { useUserInteractionMode } from \"../interaction/UserInteractionModeProvider.js\";\nimport { type ListElement, type ListProps } from \"../list/List.js\";\nimport { useAppSize } from \"../media-queries/AppSizeProvider.js\";\nimport { type GetDefaultFocusedIndex } from \"../movement/types.js\";\nimport { Portal } from \"../portal/Portal.js\";\nimport { type CalculateFixedPositionOptions } from \"../positioning/types.js\";\nimport {\n useFixedPositioning,\n type FixedPositioningOptions,\n} from \"../positioning/useFixedPositioning.js\";\nimport { useScrollLock } from \"../scroll/useScrollLock.js\";\nimport {\n useScaleTransition,\n type ScaleTransitionHookOptions,\n} from \"../transition/useScaleTransition.js\";\nimport { type LabelRequiredForA11y, type PropsWithRef } from \"../types.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\nimport {\n MenuConfigurationProvider,\n useMenuConfiguration,\n type MenuConfiguration,\n type MenuOrientationProps,\n} from \"./MenuConfigurationProvider.js\";\nimport { MenuSheet, type MenuSheetConvenienceProps } from \"./MenuSheet.js\";\nimport { MenuWidget } from \"./MenuWidget.js\";\nimport { useMenuBarContext } from \"./useMenuBarProvider.js\";\nimport { getDefaultAnchor } from \"./utils.js\";\n\ndeclare module \"react\" {\n interface CSSProperties {\n \"--rmd-menu-background-color\"?: string;\n \"--rmd-menu-color\"?: string;\n \"--rmd-menu-min-width\"?: string | number;\n \"--rmd-menu-spacing\"?: string | number;\n }\n}\n\nconst noop = (): void => {\n // do nothing\n};\n\n/** @remarks \\@since 5.0.0 */\nexport type MenuTransitionProps = Omit<\n ScaleTransitionHookOptions<HTMLDivElement>,\n \"transitionIn\" | \"vertical\" | \"nodeRef\"\n>;\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface MenuConfigurationProps extends CalculateFixedPositionOptions {\n /**\n * @see {@link ScaleTransitionHookOptions.temporary}\n * @defaultValue `true`\n */\n temporary?: boolean;\n\n /**\n * @defaultValue `false`\n */\n disablePortal?: boolean;\n\n /**\n * Boolean if the menu should not gain the elevation styles and should only be\n * set to `true` when rendering within a `Sheet`.\n *\n * @defaultValue `false`\n */\n disableElevation?: boolean;\n\n /**\n * @defaultValue `false`\n */\n disableTransition?: boolean;\n\n /**\n * @see {@link FixedPositioningOptions.transformOrigin}\n * @defaultValue `true`\n */\n transformOrigin?: boolean;\n\n /**\n * Boolean if the menu should close if the page is scrolled. The default\n * behavior is to just update the position of the menu relative to the menu\n * button until it can no longer be visible within the viewport.\n *\n * @defaultValue `false`\n */\n closeOnScroll?: boolean;\n\n /**\n * Boolean if the page should no longer be scrollable while the menu is\n * visible.\n *\n * @defaultValue `false`\n */\n preventScroll?: boolean;\n\n /**\n * Boolean if the menu should close instead of repositioning itself if the\n * browser window is resized.\n *\n * @defaultValue `false`\n */\n closeOnResize?: boolean;\n\n /** @see {@link FixedPositioningOptions.getFixedPositionOptions} */\n getFixedPositionOptions?(): CalculateFixedPositionOptions;\n}\n\n/**\n * @remarks\n * \\@since 5.1.0\n * \\@since 6.0.0 Renamed from `MenuListProps` to `MenuListConvenienceProps`\n */\nexport interface MenuListConvenienceProps {\n /**\n * An optional style to provide to the `List` component that surrounds the\n * `MenuItem` within a `Menu`.\n */\n listStyle?: CSSProperties;\n\n /**\n * An optional className to provide to the `List` component that surrounds the\n * `MenuItem` within a `Menu`.\n */\n listClassName?: string;\n\n /**\n * Any additional props to pass to the `List` component that surrounds the\n * `Menu`'s `MenuItem`s.\n */\n listProps?: PropsWithRef<Omit<ListProps, \"horizontal\">, ListElement>;\n}\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface MenuConvenienceProps extends MenuConfigurationProps {\n /**\n * This can be used to apply additional props to the `Menu` component.\n *\n * Note: You can override the `style` and `className` using\n * {@link menuStyle} and {@link menuClassName} instead for convenience.\n *\n * @example\n * ```tsx\n * <DropdownMenu\n * {...props}\n * menuProps={{\n * style: {\n * // custom inline style\n * },\n * className: \"come-class-name\",\n * getFixedPositionOptions: () => ({\n * preventOverlap: true,\n * }),\n * }}\n * />\n * ```\n */\n menuProps?: PropsWithRef<\n Omit<\n MenuProps,\n | \"children\"\n | \"fixedTo\"\n | \"visible\"\n | \"onRequestClose\"\n | \"getDefaultFocusedIndex\"\n >,\n HTMLDivElement\n >;\n\n /**\n * Convenience prop to apply custom style to the `Menu` component.\n */\n menuStyle?: CSSProperties;\n\n /**\n * Convenience prop to apply custom class name to the `Menu` component.\n */\n menuClassName?: string;\n}\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport type MenuFixedPositioningOptions = Omit<\n FixedPositioningOptions<HTMLElement, HTMLDivElement>,\n \"onScroll\" | \"onResize\"\n>;\n\n/**\n * @remarks\n * \\@since 5.0.0\n * \\@since 6.0.0 Updated to use the latest Menu, Transition, and Portal API.\n */\nexport interface MenuProps\n extends HTMLAttributes<HTMLDivElement>,\n MenuConfiguration,\n MenuConfigurationProps,\n MenuFixedPositioningOptions,\n MenuOrientationProps,\n MenuTransitionProps,\n MenuListConvenienceProps,\n MenuSheetConvenienceProps {\n visible: boolean;\n onRequestClose(): void;\n\n /**\n * @defaultValue `\"menu-\" + useId()`\n */\n id?: string;\n\n /**\n * This is used to set the default focus index when the menu is visible.\n *\n * @internal\n */\n getDefaultFocusedIndex?: GetDefaultFocusedIndex;\n\n /**\n * Custom style that should be applied to the menu only while not rendered\n * within a sheet since the {@link style} would be applied to both versions.\n */\n menuStyle?: CSSProperties;\n\n /**\n * Custom class name that should be applied only while not rendered within a\n * sheet.\n */\n menuClassName?: string;\n}\n\n/**\n * **Client Component**\n *\n * This component should generally only be used to implement context menus with\n * the `useContextMenu` hook. Otherwise, the `DropdownMenu` component should be\n * used.\n *\n * @see The `useContextMenu` hook for an example.\n *\n * @remarks\n * \\@since 5.0.0\n * \\@since 6.0.0 Updated this component to implement all the `Menu`\n * functionality instead of requiring the `useMenu` hook and `MenuWidget`\n * component. In addition, the `renderAsSheet` behavior has been moved into this\n * implementation so that the `MenuRenderer` is no longer required and context\n * menus can appear as a `Sheet`.\n */\nexport const Menu = forwardRef<HTMLDivElement, LabelRequiredForA11y<MenuProps>>(\n function Menu(props, propRef) {\n const {\n id: propId,\n style: propStyle,\n role = \"menu\",\n children,\n horizontal: _horizontal,\n sheetHeader: _sheetHeader,\n sheetFooter: _sheetFooter,\n renderAsSheet: _renderAsSheet,\n sheetPosition: _sheetPosition,\n sheetVerticalSize: _sheetVerticalSize,\n sheetProps,\n sheetStyle,\n sheetClassName,\n menuStyle,\n menuClassName,\n disableElevation = false,\n temporary = true,\n tabIndex = -1,\n fixedTo,\n className,\n classNames,\n timeout,\n appear,\n enter,\n exit,\n onEnter,\n onEntering = noop,\n onEntered = noop,\n onExit,\n onExiting,\n onExited = noop,\n onKeyDown = noop,\n listProps,\n listStyle,\n listClassName,\n visible,\n onRequestClose,\n anchor,\n closeOnResize = false,\n closeOnScroll = false,\n preventScroll = false,\n vwMargin,\n vhMargin,\n xMargin,\n yMargin,\n width,\n transformOrigin = true,\n preventOverlap,\n disableSwapping,\n disableVHBounds,\n initialX,\n initialY,\n getFixedPositionOptions,\n disablePortal: propDisablePortal,\n disableTransition,\n ...remaining\n } = props;\n const { \"aria-label\": ariaLabel, \"aria-labelledby\": ariaLabelledBy } =\n props;\n\n const id = useEnsuredId(propId, \"menu\");\n const {\n root,\n menubar,\n menuitem,\n activeId,\n animatedOnceRef,\n hoverTimeoutRef,\n disableHoverMode,\n } = useMenuBarContext();\n const {\n horizontal,\n sheetHeader,\n sheetFooter,\n renderAsSheet,\n sheetPosition,\n sheetVerticalSize,\n } = useMenuConfiguration(props);\n const { isPhone } = useAppSize();\n const isSheet =\n renderAsSheet === true || (renderAsSheet === \"phone\" && isPhone);\n\n const entered = useRef(false);\n const cancelUnmountFocus = useRef(false);\n const hideWithoutRefocus = (): void => {\n cancelUnmountFocus.current = true;\n onRequestClose();\n };\n const mode = useUserInteractionMode();\n const mouse = mode === \"mouse\";\n\n const { eventHandlers, transitionOptions } = useFocusContainer({\n nodeRef: propRef,\n activate: visible,\n onKeyDown(event) {\n onKeyDown(event);\n\n // when a menu is within a sheet, it should not trigger the custom\n // keyboard behavior\n if (isSheet) {\n return;\n }\n\n switch (event.key) {\n case \"Escape\":\n // prevent parent components that have an \"Escape\" keypress event\n // from being triggered as well\n event.stopPropagation();\n disableHoverMode();\n onRequestClose();\n break;\n case \"Tab\":\n // since menus are portalled, tab index is kinda broke so just close\n // the menu instead of doing default tab behavior\n event.preventDefault();\n\n if (!menuitem) {\n // pressing the tab key should still cascade close all menus\n event.stopPropagation();\n }\n disableHoverMode();\n onRequestClose();\n break;\n case \"ArrowUp\":\n if (!root && menuitem && horizontal) {\n event.stopPropagation();\n event.preventDefault();\n onRequestClose();\n }\n break;\n case \"ArrowLeft\":\n if (!root && menuitem && !horizontal) {\n event.stopPropagation();\n event.preventDefault();\n onRequestClose();\n }\n break;\n }\n },\n onEntering(appearing) {\n onEntering(appearing);\n entered.current = true;\n },\n onEntered(appearing) {\n onEntered(appearing);\n entered.current = true;\n cancelUnmountFocus.current = false;\n animatedOnceRef.current = true;\n },\n onExited() {\n onExited();\n entered.current = false;\n },\n onExiting,\n disableTransition,\n isFocusTypeDisabled(type) {\n if (role === \"listbox\") {\n return !isSheet;\n }\n\n if (type === \"keyboard\") {\n return isSheet;\n }\n\n const isHoverDisabled = mouse && hoverTimeoutRef.current === 0;\n if (type === \"mount\") {\n return isHoverDisabled;\n }\n\n return (\n isHoverDisabled ||\n cancelUnmountFocus.current ||\n (root && !!activeId && id !== activeId)\n );\n },\n });\n\n const { ref, style, callbacks } = useFixedPositioning({\n ...transitionOptions,\n onEnter,\n style: isSheet ? propStyle : menuStyle,\n fixedTo,\n anchor: getDefaultAnchor({\n anchor,\n menubar,\n menuitem: !root && menuitem,\n horizontal,\n }),\n vwMargin,\n vhMargin,\n xMargin,\n yMargin,\n width,\n transformOrigin,\n preventOverlap,\n disableSwapping,\n disableVHBounds,\n initialX,\n initialY,\n getFixedPositionOptions,\n onResize: closeOnResize ? hideWithoutRefocus : undefined,\n onScroll(_event, data) {\n if (!data.visible || closeOnScroll) {\n hideWithoutRefocus();\n }\n },\n });\n const { rendered, disablePortal, elementProps } = useScaleTransition({\n nodeRef: ref,\n className: cnb(!isSheet && menuClassName, className),\n transitionIn: visible,\n vertical: !horizontal,\n temporary,\n timeout: isSheet || disableTransition ? 0 : timeout,\n classNames,\n appear,\n enter,\n exit,\n onExit,\n onExiting: transitionOptions.onExiting,\n exitedHidden: true,\n ...callbacks,\n });\n useScrollLock(visible && preventScroll);\n\n // need to make sure that the useEffect does not refire for hiding on click\n // events because of the `window.requestAnimationFrame`. It'll make it so\n // that menu items that update state are unable to close when clicked\n const hide = useRef(onRequestClose);\n useEffect(() => {\n hide.current = onRequestClose;\n });\n useEffect(() => {\n if (!visible) {\n return;\n }\n\n const callback = (event: globalThis.MouseEvent): void => {\n // this is required for when the transition is disabled\n if (!entered.current) {\n return;\n }\n\n // if the user clicks outside of the menu to close it, the toggle button\n // should not be focused. instead the nearest focusable element from the\n // click event should be focused when Tab or Shift + tab is pressed\n cancelUnmountFocus.current =\n !(event.target instanceof HTMLElement) ||\n !event.target.closest(`[role=\"${role}\"]`);\n\n // this won't be called if `event.stopPropagation()` is called\n hide.current();\n disableHoverMode();\n };\n\n // wait an animation frame so the initial click event that caused the menu\n // to become visible does not immediately close the menu\n const frame = window.requestAnimationFrame(() => {\n window.addEventListener(\"click\", callback);\n });\n\n return () => {\n window.cancelAnimationFrame(frame);\n window.removeEventListener(\"click\", callback);\n };\n }, [disableHoverMode, role, visible]);\n\n return (\n <MenuConfigurationProvider\n horizontal={horizontal}\n renderAsSheet={renderAsSheet}\n sheetFooter={sheetFooter}\n sheetHeader={sheetHeader}\n sheetPosition={sheetPosition}\n sheetVerticalSize={sheetVerticalSize}\n >\n <MenuSheet\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy as string}\n header={sheetHeader}\n footer={sheetFooter}\n position={sheetPosition}\n verticalSize={sheetVerticalSize}\n visible={visible}\n enabled={isSheet}\n onRequestClose={onRequestClose}\n style={sheetStyle}\n className={sheetClassName}\n disablePortal={propDisablePortal}\n temporary={temporary}\n disableTransition={disableTransition}\n {...sheetProps}\n >\n <Portal disabled={isSheet || (propDisablePortal ?? disablePortal)}>\n {(rendered || isSheet) && (\n <MenuWidget\n {...remaining}\n {...elementProps}\n {...eventHandlers}\n id={id}\n role={role}\n style={isSheet ? propStyle : style}\n isSheet={isSheet}\n tabIndex={tabIndex}\n horizontal={horizontal}\n listProps={listProps}\n listStyle={listStyle}\n listClassName={listClassName}\n disableElevation={disableElevation}\n cancelUnmountFocus={cancelUnmountFocus}\n >\n {children}\n </MenuWidget>\n )}\n </Portal>\n </MenuSheet>\n </MenuConfigurationProvider>\n );\n }\n);\n"],"names":["cnb","forwardRef","useEffect","useRef","useFocusContainer","useUserInteractionMode","useAppSize","Portal","useFixedPositioning","useScrollLock","useScaleTransition","useEnsuredId","MenuConfigurationProvider","useMenuConfiguration","MenuSheet","MenuWidget","useMenuBarContext","getDefaultAnchor","noop","Menu","props","propRef","id","propId","style","propStyle","role","children","horizontal","_horizontal","sheetHeader","_sheetHeader","sheetFooter","_sheetFooter","renderAsSheet","_renderAsSheet","sheetPosition","_sheetPosition","sheetVerticalSize","_sheetVerticalSize","sheetProps","sheetStyle","sheetClassName","menuStyle","menuClassName","disableElevation","temporary","tabIndex","fixedTo","className","classNames","timeout","appear","enter","exit","onEnter","onEntering","onEntered","onExit","onExiting","onExited","onKeyDown","listProps","listStyle","listClassName","visible","onRequestClose","anchor","closeOnResize","closeOnScroll","preventScroll","vwMargin","vhMargin","xMargin","yMargin","width","transformOrigin","preventOverlap","disableSwapping","disableVHBounds","initialX","initialY","getFixedPositionOptions","disablePortal","propDisablePortal","disableTransition","remaining","ariaLabel","ariaLabelledBy","root","menubar","menuitem","activeId","animatedOnceRef","hoverTimeoutRef","disableHoverMode","isPhone","isSheet","entered","cancelUnmountFocus","hideWithoutRefocus","current","mode","mouse","eventHandlers","transitionOptions","nodeRef","activate","event","key","stopPropagation","preventDefault","appearing","isFocusTypeDisabled","type","isHoverDisabled","ref","callbacks","onResize","undefined","onScroll","_event","data","rendered","elementProps","transitionIn","vertical","exitedHidden","hide","callback","target","HTMLElement","closest","frame","window","requestAnimationFrame","addEventListener","cancelAnimationFrame","removeEventListener","aria-label","aria-labelledby","header","footer","position","verticalSize","enabled","disabled"],"mappings":"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"}
|
|
1
|
+
{"version":3,"sources":["../../src/menu/Menu.tsx"],"sourcesContent":["\"use client\";\nimport { cnb } from \"cnbuilder\";\nimport {\n forwardRef,\n useEffect,\n useRef,\n type CSSProperties,\n type HTMLAttributes,\n} from \"react\";\nimport { type FloatingActionButtonPosition } from \"../button/FloatingActionButton.jsx\";\nimport { useFocusContainer } from \"../focus/useFocusContainer.js\";\nimport { useUserInteractionMode } from \"../interaction/UserInteractionModeProvider.js\";\nimport { type ListElement, type ListProps } from \"../list/List.js\";\nimport { useAppSize } from \"../media-queries/AppSizeProvider.js\";\nimport { type GetDefaultFocusedIndex } from \"../movement/types.js\";\nimport { Portal } from \"../portal/Portal.js\";\nimport { type CalculateFixedPositionOptions } from \"../positioning/types.js\";\nimport {\n useFixedPositioning,\n type FixedPositioningOptions,\n} from \"../positioning/useFixedPositioning.js\";\nimport { useScrollLock } from \"../scroll/useScrollLock.js\";\nimport {\n useScaleTransition,\n type ScaleTransitionHookOptions,\n} from \"../transition/useScaleTransition.js\";\nimport { type LabelRequiredForA11y, type PropsWithRef } from \"../types.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\nimport {\n MenuConfigurationProvider,\n useMenuConfiguration,\n type MenuConfiguration,\n type MenuOrientationProps,\n} from \"./MenuConfigurationProvider.js\";\nimport { MenuSheet, type MenuSheetConvenienceProps } from \"./MenuSheet.js\";\nimport { MenuWidget } from \"./MenuWidget.js\";\nimport { useMenuBarContext } from \"./useMenuBarProvider.js\";\nimport { getDefaultAnchor } from \"./utils.js\";\n\ndeclare module \"react\" {\n interface CSSProperties {\n \"--rmd-menu-background-color\"?: string;\n \"--rmd-menu-color\"?: string;\n \"--rmd-menu-min-width\"?: string | number;\n \"--rmd-menu-spacing\"?: string | number;\n }\n}\n\nconst noop = (): void => {\n // do nothing\n};\n\n/** @remarks \\@since 5.0.0 */\nexport type MenuTransitionProps = Omit<\n ScaleTransitionHookOptions<HTMLDivElement>,\n \"transitionIn\" | \"vertical\" | \"nodeRef\"\n>;\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface MenuConfigurationProps extends CalculateFixedPositionOptions {\n /**\n * @see {@link ScaleTransitionHookOptions.temporary}\n * @defaultValue `true`\n */\n temporary?: boolean;\n\n /**\n * @defaultValue `false`\n */\n disablePortal?: boolean;\n\n /**\n * Boolean if the menu should not gain the elevation styles and should only be\n * set to `true` when rendering within a `Sheet`.\n *\n * @defaultValue `false`\n */\n disableElevation?: boolean;\n\n /**\n * @defaultValue `false`\n */\n disableTransition?: boolean;\n\n /**\n * @see {@link FixedPositioningOptions.transformOrigin}\n * @defaultValue `true`\n */\n transformOrigin?: boolean;\n\n /**\n * Boolean if the menu should close if the page is scrolled. The default\n * behavior is to just update the position of the menu relative to the menu\n * button until it can no longer be visible within the viewport.\n *\n * @defaultValue `false`\n */\n closeOnScroll?: boolean;\n\n /**\n * Boolean if the page should no longer be scrollable while the menu is\n * visible.\n *\n * @defaultValue `false`\n */\n preventScroll?: boolean;\n\n /**\n * Boolean if the menu should close instead of repositioning itself if the\n * browser window is resized.\n *\n * @defaultValue `false`\n */\n closeOnResize?: boolean;\n\n /** @see {@link FixedPositioningOptions.getFixedPositionOptions} */\n getFixedPositionOptions?(): CalculateFixedPositionOptions;\n}\n\n/**\n * @remarks\n * \\@since 5.1.0\n * \\@since 6.0.0 Renamed from `MenuListProps` to `MenuListConvenienceProps`\n */\nexport interface MenuListConvenienceProps {\n /**\n * An optional style to provide to the `List` component that surrounds the\n * `MenuItem` within a `Menu`.\n */\n listStyle?: CSSProperties;\n\n /**\n * An optional className to provide to the `List` component that surrounds the\n * `MenuItem` within a `Menu`.\n */\n listClassName?: string;\n\n /**\n * Any additional props to pass to the `List` component that surrounds the\n * `Menu`'s `MenuItem`s.\n */\n listProps?: PropsWithRef<Omit<ListProps, \"horizontal\">, ListElement>;\n}\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface MenuConvenienceProps extends MenuConfigurationProps {\n /**\n * This can be used to apply additional props to the `Menu` component.\n *\n * Note: You can override the `style` and `className` using\n * {@link menuStyle} and {@link menuClassName} instead for convenience.\n *\n * @example\n * ```tsx\n * <DropdownMenu\n * {...props}\n * menuProps={{\n * style: {\n * // custom inline style\n * },\n * className: \"come-class-name\",\n * getFixedPositionOptions: () => ({\n * preventOverlap: true,\n * }),\n * }}\n * />\n * ```\n */\n menuProps?: PropsWithRef<\n Omit<\n MenuProps,\n | \"children\"\n | \"fixedTo\"\n | \"visible\"\n | \"onRequestClose\"\n | \"getDefaultFocusedIndex\"\n >,\n HTMLDivElement\n >;\n\n /**\n * Convenience prop to apply custom style to the `Menu` component.\n */\n menuStyle?: CSSProperties;\n\n /**\n * Convenience prop to apply custom class name to the `Menu` component.\n */\n menuClassName?: string;\n}\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport type MenuFixedPositioningOptions = Omit<\n FixedPositioningOptions<HTMLElement, HTMLDivElement>,\n \"onScroll\" | \"onResize\"\n>;\n\n/**\n * @remarks\n * \\@since 5.0.0\n * \\@since 6.0.0 Updated to use the latest Menu, Transition, and Portal API.\n */\nexport interface MenuProps\n extends HTMLAttributes<HTMLDivElement>,\n MenuConfiguration,\n MenuConfigurationProps,\n MenuFixedPositioningOptions,\n MenuOrientationProps,\n MenuTransitionProps,\n MenuListConvenienceProps,\n MenuSheetConvenienceProps {\n visible: boolean;\n onRequestClose(): void;\n\n /**\n * @defaultValue `\"menu-\" + useId()`\n */\n id?: string;\n\n /**\n * This is used to set the default focus index when the menu is visible.\n *\n * @internal\n */\n getDefaultFocusedIndex?: GetDefaultFocusedIndex;\n\n /**\n * Custom style that should be applied to the menu only while not rendered\n * within a sheet since the {@link style} would be applied to both versions.\n */\n menuStyle?: CSSProperties;\n\n /**\n * Custom class name that should be applied only while not rendered within a\n * sheet.\n */\n menuClassName?: string;\n\n /**\n * @internal\n *\n * This is only used to update the default anchor when the DropdownMenu's\n * toggle is a floating action button.\n */\n floating?: FloatingActionButtonPosition;\n}\n\n/**\n * **Client Component**\n *\n * This component should generally only be used to implement context menus with\n * the `useContextMenu` hook. Otherwise, the `DropdownMenu` component should be\n * used.\n *\n * @see The `useContextMenu` hook for an example.\n *\n * @remarks\n * \\@since 5.0.0\n * \\@since 6.0.0 Updated this component to implement all the `Menu`\n * functionality instead of requiring the `useMenu` hook and `MenuWidget`\n * component. In addition, the `renderAsSheet` behavior has been moved into this\n * implementation so that the `MenuRenderer` is no longer required and context\n * menus can appear as a `Sheet`.\n */\nexport const Menu = forwardRef<HTMLDivElement, LabelRequiredForA11y<MenuProps>>(\n function Menu(props, propRef) {\n const {\n id: propId,\n style: propStyle,\n role = \"menu\",\n children,\n horizontal: _horizontal,\n sheetHeader: _sheetHeader,\n sheetFooter: _sheetFooter,\n renderAsSheet: _renderAsSheet,\n sheetPosition: _sheetPosition,\n sheetVerticalSize: _sheetVerticalSize,\n sheetProps,\n sheetStyle,\n sheetClassName,\n menuStyle,\n menuClassName,\n disableElevation = false,\n temporary = true,\n tabIndex = -1,\n fixedTo,\n className,\n classNames,\n timeout,\n appear,\n enter,\n exit,\n onEnter,\n onEntering = noop,\n onEntered = noop,\n onExit,\n onExiting,\n onExited = noop,\n onKeyDown = noop,\n listProps,\n listStyle,\n listClassName,\n visible,\n onRequestClose,\n floating,\n anchor,\n closeOnResize = false,\n closeOnScroll = false,\n preventScroll = false,\n vwMargin,\n vhMargin,\n xMargin,\n yMargin,\n width,\n transformOrigin = true,\n preventOverlap,\n disableSwapping,\n disableVHBounds,\n initialX,\n initialY,\n getFixedPositionOptions,\n disablePortal: propDisablePortal,\n disableTransition,\n ...remaining\n } = props;\n const { \"aria-label\": ariaLabel, \"aria-labelledby\": ariaLabelledBy } =\n props;\n\n const id = useEnsuredId(propId, \"menu\");\n const {\n root,\n menubar,\n menuitem,\n activeId,\n animatedOnceRef,\n hoverTimeoutRef,\n disableHoverMode,\n } = useMenuBarContext();\n const {\n horizontal,\n sheetHeader,\n sheetFooter,\n renderAsSheet,\n sheetPosition,\n sheetVerticalSize,\n } = useMenuConfiguration(props);\n const { isPhone } = useAppSize();\n const isSheet =\n renderAsSheet === true || (renderAsSheet === \"phone\" && isPhone);\n\n const entered = useRef(false);\n const cancelUnmountFocus = useRef(false);\n const hideWithoutRefocus = (): void => {\n cancelUnmountFocus.current = true;\n onRequestClose();\n };\n const mode = useUserInteractionMode();\n const mouse = mode === \"mouse\";\n\n const { eventHandlers, transitionOptions } = useFocusContainer({\n nodeRef: propRef,\n activate: visible,\n onKeyDown(event) {\n onKeyDown(event);\n\n // when a menu is within a sheet, it should not trigger the custom\n // keyboard behavior\n if (isSheet) {\n return;\n }\n\n switch (event.key) {\n case \"Escape\":\n // prevent parent components that have an \"Escape\" keypress event\n // from being triggered as well\n event.stopPropagation();\n disableHoverMode();\n onRequestClose();\n break;\n case \"Tab\":\n // since menus are portalled, tab index is kinda broke so just close\n // the menu instead of doing default tab behavior\n event.preventDefault();\n\n if (!menuitem) {\n // pressing the tab key should still cascade close all menus\n event.stopPropagation();\n }\n disableHoverMode();\n onRequestClose();\n break;\n case \"ArrowUp\":\n if (!root && menuitem && horizontal) {\n event.stopPropagation();\n event.preventDefault();\n onRequestClose();\n }\n break;\n case \"ArrowLeft\":\n if (!root && menuitem && !horizontal) {\n event.stopPropagation();\n event.preventDefault();\n onRequestClose();\n }\n break;\n }\n },\n onEntering(appearing) {\n onEntering(appearing);\n entered.current = true;\n },\n onEntered(appearing) {\n onEntered(appearing);\n entered.current = true;\n cancelUnmountFocus.current = false;\n animatedOnceRef.current = true;\n },\n onExited() {\n onExited();\n entered.current = false;\n },\n onExiting,\n disableTransition,\n isFocusTypeDisabled(type) {\n if (role === \"listbox\") {\n return !isSheet;\n }\n\n if (type === \"keyboard\") {\n return isSheet;\n }\n\n const isHoverDisabled = mouse && hoverTimeoutRef.current === 0;\n if (type === \"mount\") {\n return isHoverDisabled;\n }\n\n return (\n isHoverDisabled ||\n cancelUnmountFocus.current ||\n (root && !!activeId && id !== activeId)\n );\n },\n });\n\n const { ref, style, callbacks } = useFixedPositioning({\n ...transitionOptions,\n onEnter,\n style: isSheet ? propStyle : menuStyle,\n fixedTo,\n anchor: getDefaultAnchor({\n anchor,\n menubar,\n floating,\n menuitem: !root && menuitem,\n horizontal,\n }),\n vwMargin,\n vhMargin,\n xMargin,\n yMargin,\n width,\n transformOrigin,\n preventOverlap,\n disableSwapping,\n disableVHBounds,\n initialX,\n initialY,\n getFixedPositionOptions,\n onResize: closeOnResize ? hideWithoutRefocus : undefined,\n onScroll(_event, data) {\n if (!data.visible || closeOnScroll) {\n hideWithoutRefocus();\n }\n },\n });\n const { rendered, disablePortal, elementProps } = useScaleTransition({\n nodeRef: ref,\n className: cnb(!isSheet && menuClassName, className),\n transitionIn: visible,\n vertical: !horizontal,\n temporary,\n timeout: isSheet || disableTransition ? 0 : timeout,\n classNames,\n appear,\n enter,\n exit,\n onExit,\n onExiting: transitionOptions.onExiting,\n exitedHidden: true,\n ...callbacks,\n });\n useScrollLock(visible && preventScroll);\n\n // need to make sure that the useEffect does not refire for hiding on click\n // events because of the `window.requestAnimationFrame`. It'll make it so\n // that menu items that update state are unable to close when clicked\n const hide = useRef(onRequestClose);\n useEffect(() => {\n hide.current = onRequestClose;\n });\n useEffect(() => {\n if (!visible) {\n return;\n }\n\n const callback = (event: globalThis.MouseEvent): void => {\n // this is required for when the transition is disabled\n if (!entered.current) {\n return;\n }\n\n // if the user clicks outside of the menu to close it, the toggle button\n // should not be focused. instead the nearest focusable element from the\n // click event should be focused when Tab or Shift + tab is pressed\n cancelUnmountFocus.current =\n !(event.target instanceof HTMLElement) ||\n !event.target.closest(`[role=\"${role}\"]`);\n\n // this won't be called if `event.stopPropagation()` is called\n hide.current();\n disableHoverMode();\n };\n\n // wait an animation frame so the initial click event that caused the menu\n // to become visible does not immediately close the menu\n const frame = window.requestAnimationFrame(() => {\n window.addEventListener(\"click\", callback);\n });\n\n return () => {\n window.cancelAnimationFrame(frame);\n window.removeEventListener(\"click\", callback);\n };\n }, [disableHoverMode, role, visible]);\n\n return (\n <MenuConfigurationProvider\n horizontal={horizontal}\n renderAsSheet={renderAsSheet}\n sheetFooter={sheetFooter}\n sheetHeader={sheetHeader}\n sheetPosition={sheetPosition}\n sheetVerticalSize={sheetVerticalSize}\n >\n <MenuSheet\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy as string}\n header={sheetHeader}\n footer={sheetFooter}\n position={sheetPosition}\n verticalSize={sheetVerticalSize}\n visible={visible}\n enabled={isSheet}\n onRequestClose={onRequestClose}\n style={sheetStyle}\n className={sheetClassName}\n disablePortal={propDisablePortal}\n temporary={temporary}\n disableTransition={disableTransition}\n {...sheetProps}\n >\n <Portal disabled={isSheet || (propDisablePortal ?? disablePortal)}>\n {(rendered || isSheet) && (\n <MenuWidget\n {...remaining}\n {...elementProps}\n {...eventHandlers}\n id={id}\n role={role}\n style={isSheet ? propStyle : style}\n isSheet={isSheet}\n tabIndex={tabIndex}\n horizontal={horizontal}\n listProps={listProps}\n listStyle={listStyle}\n listClassName={listClassName}\n disableElevation={disableElevation}\n cancelUnmountFocus={cancelUnmountFocus}\n >\n {children}\n </MenuWidget>\n )}\n </Portal>\n </MenuSheet>\n </MenuConfigurationProvider>\n );\n }\n);\n"],"names":["cnb","forwardRef","useEffect","useRef","useFocusContainer","useUserInteractionMode","useAppSize","Portal","useFixedPositioning","useScrollLock","useScaleTransition","useEnsuredId","MenuConfigurationProvider","useMenuConfiguration","MenuSheet","MenuWidget","useMenuBarContext","getDefaultAnchor","noop","Menu","props","propRef","id","propId","style","propStyle","role","children","horizontal","_horizontal","sheetHeader","_sheetHeader","sheetFooter","_sheetFooter","renderAsSheet","_renderAsSheet","sheetPosition","_sheetPosition","sheetVerticalSize","_sheetVerticalSize","sheetProps","sheetStyle","sheetClassName","menuStyle","menuClassName","disableElevation","temporary","tabIndex","fixedTo","className","classNames","timeout","appear","enter","exit","onEnter","onEntering","onEntered","onExit","onExiting","onExited","onKeyDown","listProps","listStyle","listClassName","visible","onRequestClose","floating","anchor","closeOnResize","closeOnScroll","preventScroll","vwMargin","vhMargin","xMargin","yMargin","width","transformOrigin","preventOverlap","disableSwapping","disableVHBounds","initialX","initialY","getFixedPositionOptions","disablePortal","propDisablePortal","disableTransition","remaining","ariaLabel","ariaLabelledBy","root","menubar","menuitem","activeId","animatedOnceRef","hoverTimeoutRef","disableHoverMode","isPhone","isSheet","entered","cancelUnmountFocus","hideWithoutRefocus","current","mode","mouse","eventHandlers","transitionOptions","nodeRef","activate","event","key","stopPropagation","preventDefault","appearing","isFocusTypeDisabled","type","isHoverDisabled","ref","callbacks","onResize","undefined","onScroll","_event","data","rendered","elementProps","transitionIn","vertical","exitedHidden","hide","callback","target","HTMLElement","closest","frame","window","requestAnimationFrame","addEventListener","cancelAnimationFrame","removeEventListener","aria-label","aria-labelledby","header","footer","position","verticalSize","enabled","disabled"],"mappings":"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"}
|
|
@@ -1,8 +1,7 @@
|
|
|
1
1
|
import { type HTMLAttributes } from "react";
|
|
2
2
|
import { type DividerProps } from "../divider/Divider.js";
|
|
3
|
-
import { type VerticalDividerProps } from "../divider/VerticalDivider.js";
|
|
4
3
|
/** @remarks \@since 5.0.0 */
|
|
5
|
-
export interface MenuItemSeparatorProps extends HTMLAttributes<HTMLLIElement>, Pick<DividerProps, "inset" | "vertical"
|
|
4
|
+
export interface MenuItemSeparatorProps extends HTMLAttributes<HTMLLIElement>, Pick<DividerProps, "inset" | "vertical"> {
|
|
6
5
|
}
|
|
7
6
|
/**
|
|
8
7
|
* **Client Component**
|
|
@@ -2,7 +2,6 @@
|
|
|
2
2
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
3
|
import { forwardRef } from "react";
|
|
4
4
|
import { divider } from "../divider/styles.js";
|
|
5
|
-
import { useVerticalDividerHeight } from "../divider/useVerticalDividerHeight.js";
|
|
6
5
|
import { useMenuConfiguration } from "./MenuConfigurationProvider.js";
|
|
7
6
|
/**
|
|
8
7
|
* **Client Component**
|
|
@@ -13,18 +12,13 @@ import { useMenuConfiguration } from "./MenuConfigurationProvider.js";
|
|
|
13
12
|
*
|
|
14
13
|
* @remarks \@since 5.0.0 Renders as an `<li>` instead of a `<div>` or `<hr />`.
|
|
15
14
|
*/ export const MenuItemSeparator = /*#__PURE__*/ forwardRef(function MenuItemSeparator(props, ref) {
|
|
16
|
-
const {
|
|
15
|
+
const { className, inset, vertical: propVertical, children, ...remaining } = props;
|
|
17
16
|
const horizontal = useMenuConfiguration().horizontal;
|
|
18
17
|
const vertical = propVertical ?? horizontal;
|
|
19
|
-
const heightProps = useVerticalDividerHeight({
|
|
20
|
-
ref,
|
|
21
|
-
style,
|
|
22
|
-
maxHeight: vertical ? maxHeight ?? 1 : 0
|
|
23
|
-
});
|
|
24
18
|
return /*#__PURE__*/ _jsx("li", {
|
|
25
19
|
...remaining,
|
|
26
|
-
...heightProps,
|
|
27
20
|
"aria-orientation": vertical ? "vertical" : undefined,
|
|
21
|
+
ref: ref,
|
|
28
22
|
role: "separator",
|
|
29
23
|
className: divider({
|
|
30
24
|
inset: inset && !vertical,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/menu/MenuItemSeparator.tsx"],"sourcesContent":["\"use client\";\nimport { forwardRef, type HTMLAttributes } from \"react\";\nimport { type DividerProps } from \"../divider/Divider.js\";\nimport {
|
|
1
|
+
{"version":3,"sources":["../../src/menu/MenuItemSeparator.tsx"],"sourcesContent":["\"use client\";\nimport { forwardRef, type HTMLAttributes } from \"react\";\nimport { type DividerProps } from \"../divider/Divider.js\";\nimport { divider } from \"../divider/styles.js\";\nimport { useMenuConfiguration } from \"./MenuConfigurationProvider.js\";\n\n/** @remarks \\@since 5.0.0 */\nexport interface MenuItemSeparatorProps\n extends HTMLAttributes<HTMLLIElement>,\n Pick<DividerProps, \"inset\" | \"vertical\"> {}\n\n/**\n * **Client Component**\n *\n * This component renders a `<li role=\"separator\">` with the divider styles. It\n * will also automatically render itself vertically instead of horizontally if\n * the menu is rendering horizontally.\n *\n * @remarks \\@since 5.0.0 Renders as an `<li>` instead of a `<div>` or `<hr />`.\n */\nexport const MenuItemSeparator = forwardRef<\n HTMLLIElement,\n MenuItemSeparatorProps\n>(function MenuItemSeparator(props, ref) {\n const {\n className,\n inset,\n vertical: propVertical,\n children,\n ...remaining\n } = props;\n\n const horizontal = useMenuConfiguration().horizontal;\n const vertical = propVertical ?? horizontal;\n\n return (\n <li\n {...remaining}\n aria-orientation={vertical ? \"vertical\" : undefined}\n ref={ref}\n role=\"separator\"\n className={divider({ inset: inset && !vertical, vertical, className })}\n >\n {children}\n </li>\n );\n});\n"],"names":["forwardRef","divider","useMenuConfiguration","MenuItemSeparator","props","ref","className","inset","vertical","propVertical","children","remaining","horizontal","li","aria-orientation","undefined","role"],"mappings":"AAAA;;AACA,SAASA,UAAU,QAA6B,QAAQ;AAExD,SAASC,OAAO,QAAQ,uBAAuB;AAC/C,SAASC,oBAAoB,QAAQ,iCAAiC;AAOtE;;;;;;;;CAQC,GACD,OAAO,MAAMC,kCAAoBH,WAG/B,SAASG,kBAAkBC,KAAK,EAAEC,GAAG;IACrC,MAAM,EACJC,SAAS,EACTC,KAAK,EACLC,UAAUC,YAAY,EACtBC,QAAQ,EACR,GAAGC,WACJ,GAAGP;IAEJ,MAAMQ,aAAaV,uBAAuBU,UAAU;IACpD,MAAMJ,WAAWC,gBAAgBG;IAEjC,qBACE,KAACC;QACE,GAAGF,SAAS;QACbG,oBAAkBN,WAAW,aAAaO;QAC1CV,KAAKA;QACLW,MAAK;QACLV,WAAWL,QAAQ;YAAEM,OAAOA,SAAS,CAACC;YAAUA;YAAUF;QAAU;kBAEnEI;;AAGP,GAAG"}
|
package/dist/menu/MenuSheet.d.ts
CHANGED
|
@@ -2,6 +2,10 @@ import { type CSSProperties, type ReactElement, type ReactNode } from "react";
|
|
|
2
2
|
import { type BaseSheetProps } from "../sheet/Sheet.js";
|
|
3
3
|
import { type LabelRequiredForA11y, type PropsWithRef } from "../types.js";
|
|
4
4
|
import { type RenderMenuAsSheet } from "./MenuConfigurationProvider.js";
|
|
5
|
+
/**
|
|
6
|
+
* @remarks \@since 6.0.0
|
|
7
|
+
*/
|
|
8
|
+
export type MenuSheetConfigurableProps = Omit<BaseSheetProps, "visible" | "onRequestClose">;
|
|
5
9
|
/**
|
|
6
10
|
* @remarks \@since 6.0.0
|
|
7
11
|
*/
|
|
@@ -22,11 +26,12 @@ export interface MenuSheetConvenienceProps {
|
|
|
22
26
|
* // custom inline style
|
|
23
27
|
* },
|
|
24
28
|
* className: "come-class-name",
|
|
29
|
+
* horizontalSize: "touch",
|
|
25
30
|
* }}
|
|
26
31
|
* />
|
|
27
32
|
* ```
|
|
28
33
|
*/
|
|
29
|
-
sheetProps?: PropsWithRef<
|
|
34
|
+
sheetProps?: PropsWithRef<MenuSheetConfigurableProps, HTMLDivElement>;
|
|
30
35
|
/**
|
|
31
36
|
* Convenience prop to apply custom style to the `Sheet` component when the
|
|
32
37
|
* `Menu` is being rendered as a `Sheet`.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/menu/MenuSheet.tsx"],"sourcesContent":["\"use client\";\nimport { type CSSProperties, type ReactElement, type ReactNode } from \"react\";\nimport { Sheet, type BaseSheetProps } from \"../sheet/Sheet.js\";\nimport { type LabelRequiredForA11y, type PropsWithRef } from \"../types.js\";\nimport { type RenderMenuAsSheet } from \"./MenuConfigurationProvider.js\";\n\nconst noop = (): void => {\n // do nothing\n};\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface MenuSheetConvenienceProps {\n /**\n * This can be used to apply additional props to the `Sheet` component when\n * the `Menu` is being rendered as a `Sheet`.\n *\n * Note: You can override the `style` and `className` using\n * {@link sheetStyle} and {@link sheetClassName} instead for convenience.\n *\n * @example\n * ```tsx\n * <Menu\n * {...props}\n * sheetProps={{\n * style: {\n * // custom inline style\n * },\n * className: \"come-class-name\",\n * }}\n * />\n * ```\n */\n sheetProps?: PropsWithRef<
|
|
1
|
+
{"version":3,"sources":["../../src/menu/MenuSheet.tsx"],"sourcesContent":["\"use client\";\nimport { type CSSProperties, type ReactElement, type ReactNode } from \"react\";\nimport { Sheet, type BaseSheetProps } from \"../sheet/Sheet.js\";\nimport { type LabelRequiredForA11y, type PropsWithRef } from \"../types.js\";\nimport { type RenderMenuAsSheet } from \"./MenuConfigurationProvider.js\";\n\nconst noop = (): void => {\n // do nothing\n};\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport type MenuSheetConfigurableProps = Omit<\n BaseSheetProps,\n \"visible\" | \"onRequestClose\"\n>;\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport interface MenuSheetConvenienceProps {\n /**\n * This can be used to apply additional props to the `Sheet` component when\n * the `Menu` is being rendered as a `Sheet`.\n *\n * Note: You can override the `style` and `className` using\n * {@link sheetStyle} and {@link sheetClassName} instead for convenience.\n *\n * @example\n * ```tsx\n * <Menu\n * {...props}\n * sheetProps={{\n * style: {\n * // custom inline style\n * },\n * className: \"come-class-name\",\n * horizontalSize: \"touch\",\n * }}\n * />\n * ```\n */\n sheetProps?: PropsWithRef<MenuSheetConfigurableProps, HTMLDivElement>;\n\n /**\n * Convenience prop to apply custom style to the `Sheet` component when the\n * `Menu` is being rendered as a `Sheet`.\n */\n sheetStyle?: CSSProperties;\n\n /**\n * Convenience prop to apply custom class name to the `Sheet` component when\n * the `Menu` is being rendered as a `Sheet`.\n */\n sheetClassName?: string;\n}\n\n/**\n * @internal\n * @remarks\n * \\@since 5.0.0\n * \\@since 6.0.0 Updated to use the latest menu API.\n */\nexport interface MenuSheetProps extends BaseSheetProps {\n /** {@inheritDoc MenuConfiguration.sheetHeader} */\n header?: ReactNode;\n /** {@inheritDoc MenuConfiguration.sheetFooter} */\n footer?: ReactNode;\n children: ReactNode;\n\n /** @remarks \\@since 6.0.0 */\n enabled: RenderMenuAsSheet;\n}\n\n/**\n * **Client Component**\n *\n * Implements a `Menu` using the `Sheet` component that probably shouldn't\n * really be used externally.\n *\n * @internal\n * @remarks\n * \\@since 5.0.0\n * \\@since 6.0.0 Added the `enabled` prop and does not render a custom `Menu`\n * implementation.\n */\nexport function MenuSheet(\n props: LabelRequiredForA11y<MenuSheetProps>\n): ReactElement {\n const {\n header,\n footer,\n children,\n onClick = noop,\n overlayProps,\n enabled,\n ...remaining\n } = props;\n const { onRequestClose } = props;\n\n if (!enabled) {\n return <>{children}</>;\n }\n\n return (\n <Sheet\n {...remaining}\n onClick={(event) => {\n onClick(event);\n\n // Prevent closing parent sheet/menus if an element in the header or\n // footer is clicked\n if (\n !(event.target instanceof HTMLElement) ||\n event.target\n .closest('.rmd-menu,[role=\"dialog\"]')\n ?.getAttribute(\"role\") === \"dialog\"\n ) {\n event.stopPropagation();\n }\n }}\n overlayProps={{\n ...overlayProps,\n onClick: (event) => {\n overlayProps?.onClick?.(event);\n\n // prevent closing parent menus if the overlay element is clicked.\n event.stopPropagation();\n onRequestClose();\n },\n }}\n >\n {header}\n {children}\n {footer}\n </Sheet>\n );\n}\n"],"names":["Sheet","noop","MenuSheet","props","header","footer","children","onClick","overlayProps","enabled","remaining","onRequestClose","event","target","HTMLElement","closest","getAttribute","stopPropagation"],"mappings":"AAAA;;AAEA,SAASA,KAAK,QAA6B,oBAAoB;AAI/D,MAAMC,OAAO;AACX,aAAa;AACf;AAmEA;;;;;;;;;;;CAWC,GACD,OAAO,SAASC,UACdC,KAA2C;IAE3C,MAAM,EACJC,MAAM,EACNC,MAAM,EACNC,QAAQ,EACRC,UAAUN,IAAI,EACdO,YAAY,EACZC,OAAO,EACP,GAAGC,WACJ,GAAGP;IACJ,MAAM,EAAEQ,cAAc,EAAE,GAAGR;IAE3B,IAAI,CAACM,SAAS;QACZ,qBAAO;sBAAGH;;IACZ;IAEA,qBACE,MAACN;QACE,GAAGU,SAAS;QACbH,SAAS,CAACK;YACRL,QAAQK;YAER,oEAAoE;YACpE,oBAAoB;YACpB,IACE,CAAEA,CAAAA,MAAMC,MAAM,YAAYC,WAAU,KACpCF,MAAMC,MAAM,CACTE,OAAO,CAAC,8BACPC,aAAa,YAAY,UAC7B;gBACAJ,MAAMK,eAAe;YACvB;QACF;QACAT,cAAc;YACZ,GAAGA,YAAY;YACfD,SAAS,CAACK;gBACRJ,cAAcD,UAAUK;gBAExB,kEAAkE;gBAClEA,MAAMK,eAAe;gBACrBN;YACF;QACF;;YAECP;YACAE;YACAD;;;AAGP"}
|
|
@@ -0,0 +1,60 @@
|
|
|
1
|
+
import { type ReactNode } from "react";
|
|
2
|
+
import { type SheetPosition, type SheetVerticalSize } from "../sheet/styles.js";
|
|
3
|
+
/**
|
|
4
|
+
* This allows the menu to be conditionally rendered as a `Sheet` instead of a
|
|
5
|
+
* menu.
|
|
6
|
+
*
|
|
7
|
+
* - `false` - always render as a `Menu`
|
|
8
|
+
* - `true` - always render as a `Sheet`
|
|
9
|
+
* - `"phone"` - render as a sheet only when the {@link AppSize} is considered
|
|
10
|
+
* phone (`isPhone === true`).
|
|
11
|
+
*
|
|
12
|
+
* @defaultValue `false`
|
|
13
|
+
* @remarks \@since 5.0.0
|
|
14
|
+
*/
|
|
15
|
+
export type RenderMenuAsSheet = boolean | "phone";
|
|
16
|
+
/**
|
|
17
|
+
* @remarks \@since 5.0.0
|
|
18
|
+
* @remarks \@since 6.0.0 No longer includes the `horizontal` flag and is no
|
|
19
|
+
* longer a context provider.
|
|
20
|
+
*/
|
|
21
|
+
export interface MenuConfiguration {
|
|
22
|
+
/** {@inheritDoc RenderMenuAsSheet} */
|
|
23
|
+
renderAsSheet?: RenderMenuAsSheet;
|
|
24
|
+
/**
|
|
25
|
+
* @see {@link SheetPosition}
|
|
26
|
+
* @defaultValue `"bottom"`
|
|
27
|
+
*/
|
|
28
|
+
sheetPosition?: SheetPosition;
|
|
29
|
+
/**
|
|
30
|
+
* @see {@link SheetVerticalSize}
|
|
31
|
+
* @defaultValue `"touch"`
|
|
32
|
+
*/
|
|
33
|
+
sheetVerticalSize?: SheetVerticalSize;
|
|
34
|
+
/**
|
|
35
|
+
* Any children to render above the sheet's menu implementation. This would
|
|
36
|
+
* normally be something like a `<DialogHeader>` or `AppBar`.
|
|
37
|
+
*
|
|
38
|
+
* @defaultValue `null`
|
|
39
|
+
*/
|
|
40
|
+
sheetHeader?: ReactNode;
|
|
41
|
+
/**
|
|
42
|
+
* Any children to render below the sheet's menu implementation. This would
|
|
43
|
+
* normally be something like a `<DialogFooter>`.
|
|
44
|
+
*
|
|
45
|
+
* @defaultValue `null`
|
|
46
|
+
*/
|
|
47
|
+
sheetFooter?: ReactNode;
|
|
48
|
+
}
|
|
49
|
+
/**
|
|
50
|
+
* @remarks \@since 6.0.0
|
|
51
|
+
*/
|
|
52
|
+
export type MenuConfig = Required<MenuConfiguration>;
|
|
53
|
+
/**
|
|
54
|
+
* @remarks \@since 6.0.0
|
|
55
|
+
*/
|
|
56
|
+
export declare const MENU_CONFIG: MenuConfig;
|
|
57
|
+
/**
|
|
58
|
+
* @remarks \@since 6.0.0
|
|
59
|
+
*/
|
|
60
|
+
export declare function getMenuConfig<N extends keyof MenuConfig>(name: N, override?: MenuConfig[N]): MenuConfig[N];
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { type CSSProperties, type HTMLAttributes } from "react";
|
|
2
|
+
import { type LabelRequiredForA11y } from "../types.js";
|
|
2
3
|
import { type ProgressProps } from "./types.js";
|
|
3
4
|
/**
|
|
4
5
|
* @remarks \@since 6.0.0
|
|
@@ -97,7 +98,7 @@ export interface CircularProgressProps extends Omit<HTMLAttributes<HTMLSpanEleme
|
|
|
97
98
|
* import { type ReactElement } from "react";
|
|
98
99
|
*
|
|
99
100
|
* function Example(): ReactElement {
|
|
100
|
-
* return <CircularProgress />;
|
|
101
|
+
* return <CircularProgress aria-label="Loading" />;
|
|
101
102
|
* }
|
|
102
103
|
* ```
|
|
103
104
|
*
|
|
@@ -111,11 +112,11 @@ export interface CircularProgressProps extends Omit<HTMLAttributes<HTMLSpanEleme
|
|
|
111
112
|
* // a number from 0 - 100
|
|
112
113
|
* const [progress, setProgress] = useState(0);
|
|
113
114
|
*
|
|
114
|
-
* return <CircularProgress value={progress} />;
|
|
115
|
+
* return <CircularProgress aria-label="File upload" value={progress} />;
|
|
115
116
|
* }
|
|
116
117
|
* ```
|
|
117
118
|
*
|
|
118
119
|
* @remarks \@since 6.0.0 Updated the determinate circular progress to no longer
|
|
119
|
-
* rotate while increasing the value.
|
|
120
|
+
* rotate while increasing the value and require a label for accessibility.
|
|
120
121
|
*/
|
|
121
|
-
export declare const CircularProgress: import("react").ForwardRefExoticComponent<CircularProgressProps & import("react").RefAttributes<HTMLSpanElement>>;
|
|
122
|
+
export declare const CircularProgress: import("react").ForwardRefExoticComponent<LabelRequiredForA11y<CircularProgressProps> & import("react").RefAttributes<HTMLSpanElement>>;
|
|
@@ -16,7 +16,7 @@ const styles = bem("rmd-circular-progress");
|
|
|
16
16
|
* import { type ReactElement } from "react";
|
|
17
17
|
*
|
|
18
18
|
* function Example(): ReactElement {
|
|
19
|
-
* return <CircularProgress />;
|
|
19
|
+
* return <CircularProgress aria-label="Loading" />;
|
|
20
20
|
* }
|
|
21
21
|
* ```
|
|
22
22
|
*
|
|
@@ -30,12 +30,12 @@ const styles = bem("rmd-circular-progress");
|
|
|
30
30
|
* // a number from 0 - 100
|
|
31
31
|
* const [progress, setProgress] = useState(0);
|
|
32
32
|
*
|
|
33
|
-
* return <CircularProgress value={progress} />;
|
|
33
|
+
* return <CircularProgress aria-label="File upload" value={progress} />;
|
|
34
34
|
* }
|
|
35
35
|
* ```
|
|
36
36
|
*
|
|
37
37
|
* @remarks \@since 6.0.0 Updated the determinate circular progress to no longer
|
|
38
|
-
* rotate while increasing the value.
|
|
38
|
+
* rotate while increasing the value and require a label for accessibility.
|
|
39
39
|
*/ export const CircularProgress = /*#__PURE__*/ forwardRef(function CircularProgress(props, ref) {
|
|
40
40
|
const { id: propId, className, svgStyle, svgClassName, circleStyle: propCircleStyle, circleClassName, value, min = 0, max = 100, radius = 30, center = 33, viewBox = "0 0 66 66", theme = "primary", dense = false, dashoffset = 187, disableShrink = false, disableCentered = false, disableTransition = false, ...remaining } = props;
|
|
41
41
|
const id = useEnsuredId(propId, "circular-progress");
|