@react-md/core 1.0.0-next.20 → 1.0.0-next.21
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/dist/CoreProviders.d.ts +1 -0
- package/dist/CoreProviders.js +1 -0
- package/dist/CoreProviders.js.map +1 -1
- package/dist/NoSsr.d.ts +3 -1
- package/dist/NoSsr.js +3 -1
- package/dist/NoSsr.js.map +1 -1
- package/dist/RootHtml.d.ts +1 -1
- package/dist/RootHtml.js +1 -1
- package/dist/RootHtml.js.map +1 -1
- package/dist/SsrProvider.d.ts +1 -0
- package/dist/SsrProvider.js +1 -0
- package/dist/SsrProvider.js.map +1 -1
- package/dist/_a11y.scss +187 -0
- package/dist/_base.scss +479 -0
- package/dist/_box-shadows.scss +80 -71
- package/dist/_colors.scss +283 -279
- package/dist/_core.scss +5 -483
- package/dist/_object-fit.scss +27 -23
- package/dist/_utils.scss +225 -225
- package/dist/app-bar/AppBar.d.ts +3 -1
- package/dist/app-bar/AppBar.js +3 -1
- package/dist/app-bar/AppBar.js.map +1 -1
- package/dist/app-bar/AppBarTitle.d.ts +2 -1
- package/dist/app-bar/AppBarTitle.js +2 -1
- package/dist/app-bar/AppBarTitle.js.map +1 -1
- package/dist/app-bar/_app-bar.scss +112 -105
- package/dist/autocomplete/Autocomplete.d.ts +81 -2
- package/dist/autocomplete/Autocomplete.js +4 -2
- package/dist/autocomplete/Autocomplete.js.map +1 -1
- package/dist/autocomplete/AutocompleteChip.d.ts +1 -0
- package/dist/autocomplete/AutocompleteChip.js +1 -0
- package/dist/autocomplete/AutocompleteChip.js.map +1 -1
- package/dist/autocomplete/AutocompleteCircularProgress.d.ts +1 -0
- package/dist/autocomplete/AutocompleteCircularProgress.js +1 -0
- package/dist/autocomplete/AutocompleteCircularProgress.js.map +1 -1
- package/dist/autocomplete/AutocompleteClearButton.d.ts +1 -0
- package/dist/autocomplete/AutocompleteClearButton.js +4 -2
- package/dist/autocomplete/AutocompleteClearButton.js.map +1 -1
- package/dist/autocomplete/AutocompleteDropdownButton.d.ts +1 -0
- package/dist/autocomplete/AutocompleteDropdownButton.js +1 -0
- package/dist/autocomplete/AutocompleteDropdownButton.js.map +1 -1
- package/dist/autocomplete/AutocompleteListboxChildren.d.ts +1 -3
- package/dist/autocomplete/AutocompleteListboxChildren.js.map +1 -1
- package/dist/autocomplete/_autocomplete.scss +125 -71
- package/dist/autocomplete/autocompleteStyles.d.ts +3 -0
- package/dist/autocomplete/autocompleteStyles.js +5 -2
- package/dist/autocomplete/autocompleteStyles.js.map +1 -1
- package/dist/autocomplete/types.d.ts +128 -82
- package/dist/autocomplete/types.js.map +1 -1
- package/dist/autocomplete/useAutocomplete.d.ts +3 -0
- package/dist/autocomplete/useAutocomplete.js +17 -17
- package/dist/autocomplete/useAutocomplete.js.map +1 -1
- package/dist/autocomplete/utils.d.ts +3 -6
- package/dist/autocomplete/utils.js.map +1 -1
- package/dist/avatar/Avatar.d.ts +2 -1
- package/dist/avatar/Avatar.js +2 -1
- package/dist/avatar/Avatar.js.map +1 -1
- package/dist/avatar/_avatar.scss +81 -77
- package/dist/badge/Badge.d.ts +8 -4
- package/dist/badge/Badge.js +8 -4
- package/dist/badge/Badge.js.map +1 -1
- package/dist/badge/_badge.scss +72 -68
- package/dist/box/Box.d.ts +4 -3
- package/dist/box/Box.js +4 -3
- package/dist/box/Box.js.map +1 -1
- package/dist/box/_box.scss +115 -119
- package/dist/button/AsyncButton.d.ts +3 -2
- package/dist/button/AsyncButton.js +4 -3
- package/dist/button/AsyncButton.js.map +1 -1
- package/dist/button/Button.d.ts +11 -9
- package/dist/button/Button.js +11 -9
- package/dist/button/Button.js.map +1 -1
- package/dist/button/ButtonUnstyled.d.ts +1 -0
- package/dist/button/ButtonUnstyled.js +2 -1
- package/dist/button/ButtonUnstyled.js.map +1 -1
- package/dist/button/TooltippedButton.d.ts +3 -2
- package/dist/button/TooltippedButton.js +2 -1
- package/dist/button/TooltippedButton.js.map +1 -1
- package/dist/button/_button.scss +128 -98
- package/dist/button/{buttonStyles.d.ts → styles.d.ts} +10 -0
- package/dist/button/{buttonStyles.js → styles.js} +9 -1
- package/dist/button/styles.js.map +1 -0
- package/dist/card/Card.d.ts +9 -10
- package/dist/card/Card.js +9 -10
- package/dist/card/Card.js.map +1 -1
- package/dist/card/CardContent.d.ts +1 -0
- package/dist/card/CardContent.js +1 -0
- package/dist/card/CardContent.js.map +1 -1
- package/dist/card/CardFooter.d.ts +1 -0
- package/dist/card/CardFooter.js +1 -0
- package/dist/card/CardFooter.js.map +1 -1
- package/dist/card/CardHeader.d.ts +1 -0
- package/dist/card/CardHeader.js +1 -0
- package/dist/card/CardHeader.js.map +1 -1
- package/dist/card/CardSubtitle.d.ts +1 -0
- package/dist/card/CardSubtitle.js +1 -0
- package/dist/card/CardSubtitle.js.map +1 -1
- package/dist/card/CardTitle.d.ts +2 -1
- package/dist/card/CardTitle.js +1 -0
- package/dist/card/CardTitle.js.map +1 -1
- package/dist/card/ClickableCard.d.ts +3 -1
- package/dist/card/ClickableCard.js +3 -1
- package/dist/card/ClickableCard.js.map +1 -1
- package/dist/card/_card.scss +76 -71
- package/dist/chip/Chip.d.ts +5 -3
- package/dist/chip/Chip.js +5 -3
- package/dist/chip/Chip.js.map +1 -1
- package/dist/chip/_chip.scss +247 -33
- package/dist/cssUtils.d.ts +1 -1
- package/dist/cssUtils.js.map +1 -1
- package/dist/dialog/Dialog.d.ts +9 -10
- package/dist/dialog/Dialog.js +9 -10
- package/dist/dialog/Dialog.js.map +1 -1
- package/dist/dialog/DialogContent.d.ts +2 -0
- package/dist/dialog/DialogContent.js +5 -2
- package/dist/dialog/DialogContent.js.map +1 -1
- package/dist/dialog/DialogFooter.d.ts +2 -0
- package/dist/dialog/DialogFooter.js +5 -2
- package/dist/dialog/DialogFooter.js.map +1 -1
- package/dist/dialog/DialogHeader.d.ts +14 -2
- package/dist/dialog/DialogHeader.js +8 -2
- package/dist/dialog/DialogHeader.js.map +1 -1
- package/dist/dialog/DialogTitle.d.ts +2 -0
- package/dist/dialog/DialogTitle.js +5 -2
- package/dist/dialog/DialogTitle.js.map +1 -1
- package/dist/dialog/FixedDialog.d.ts +11 -10
- package/dist/dialog/FixedDialog.js +13 -12
- package/dist/dialog/FixedDialog.js.map +1 -1
- package/dist/dialog/_dialog.scss +167 -22
- package/dist/dialog/styles.d.ts +12 -6
- package/dist/dialog/styles.js +11 -5
- package/dist/dialog/styles.js.map +1 -1
- package/dist/divider/Divider.d.ts +3 -1
- package/dist/divider/Divider.js +3 -1
- package/dist/divider/Divider.js.map +1 -1
- package/dist/divider/_divider.scss +68 -0
- package/dist/divider/styles.js.map +1 -1
- package/dist/draggable/_draggable.scss +16 -0
- package/dist/draggable/useDraggable.d.ts +1 -0
- package/dist/draggable/useDraggable.js +1 -0
- package/dist/draggable/useDraggable.js.map +1 -1
- package/dist/error-boundary/ErrorBoundary.d.ts +58 -0
- package/dist/error-boundary/ErrorBoundary.js +99 -0
- package/dist/error-boundary/ErrorBoundary.js.map +1 -0
- package/dist/error-boundary/context.d.ts +11 -0
- package/dist/error-boundary/context.js +12 -0
- package/dist/error-boundary/context.js.map +1 -0
- package/dist/error-boundary/types.d.ts +16 -0
- package/dist/error-boundary/types.js +7 -0
- package/dist/error-boundary/types.js.map +1 -0
- package/dist/error-boundary/useErrorBoundary.d.ts +25 -0
- package/dist/error-boundary/useErrorBoundary.js +33 -0
- package/dist/error-boundary/useErrorBoundary.js.map +1 -0
- package/dist/expansion-panel/ExpansionList.d.ts +1 -0
- package/dist/expansion-panel/ExpansionList.js +1 -0
- package/dist/expansion-panel/ExpansionList.js.map +1 -1
- package/dist/expansion-panel/ExpansionPanel.d.ts +32 -0
- package/dist/expansion-panel/ExpansionPanel.js +32 -0
- package/dist/expansion-panel/ExpansionPanel.js.map +1 -1
- package/dist/expansion-panel/ExpansionPanelHeader.d.ts +4 -7
- package/dist/expansion-panel/ExpansionPanelHeader.js +9 -10
- package/dist/expansion-panel/ExpansionPanelHeader.js.map +1 -1
- package/dist/expansion-panel/_expansion-panel.scss +45 -0
- package/dist/expansion-panel/expansionPanelStyles.d.ts +20 -0
- package/dist/expansion-panel/expansionPanelStyles.js +12 -0
- package/dist/expansion-panel/expansionPanelStyles.js.map +1 -1
- package/dist/expansion-panel/useExpansionList.d.ts +7 -8
- package/dist/expansion-panel/useExpansionList.js +7 -8
- package/dist/expansion-panel/useExpansionList.js.map +1 -1
- package/dist/expansion-panel/useExpansionPanels.d.ts +7 -10
- package/dist/expansion-panel/useExpansionPanels.js +7 -10
- package/dist/expansion-panel/useExpansionPanels.js.map +1 -1
- package/dist/files/FileInput.d.ts +4 -2
- package/dist/files/FileInput.js +3 -1
- package/dist/files/FileInput.js.map +1 -1
- package/dist/files/_files.scss +9 -0
- package/dist/files/styles.d.ts +1 -1
- package/dist/files/styles.js +1 -1
- package/dist/files/styles.js.map +1 -1
- package/dist/files/useFileUpload.d.ts +2 -0
- package/dist/files/useFileUpload.js +2 -0
- package/dist/files/useFileUpload.js.map +1 -1
- package/dist/focus/useFocusContainer.js +24 -23
- package/dist/focus/useFocusContainer.js.map +1 -1
- package/dist/form/Checkbox.d.ts +3 -1
- package/dist/form/Checkbox.js +3 -1
- package/dist/form/Checkbox.js.map +1 -1
- package/dist/form/Fieldset.d.ts +6 -20
- package/dist/form/Fieldset.js +6 -13
- package/dist/form/Fieldset.js.map +1 -1
- package/dist/form/Form.d.ts +2 -0
- package/dist/form/Form.js +2 -0
- package/dist/form/Form.js.map +1 -1
- package/dist/form/FormMessage.d.ts +2 -0
- package/dist/form/FormMessage.js +2 -0
- package/dist/form/FormMessage.js.map +1 -1
- package/dist/form/FormMessageContainer.d.ts +1 -0
- package/dist/form/FormMessageContainer.js +1 -0
- package/dist/form/FormMessageContainer.js.map +1 -1
- package/dist/form/FormMessageCounter.d.ts +2 -0
- package/dist/form/FormMessageCounter.js +2 -0
- package/dist/form/FormMessageCounter.js.map +1 -1
- package/dist/form/InputToggle.d.ts +4 -2
- package/dist/form/InputToggle.js +2 -0
- package/dist/form/InputToggle.js.map +1 -1
- package/dist/form/Label.d.ts +4 -5
- package/dist/form/Label.js +4 -32
- package/dist/form/Label.js.map +1 -1
- package/dist/form/Legend.d.ts +1 -0
- package/dist/form/Legend.js +1 -0
- package/dist/form/Legend.js.map +1 -1
- package/dist/form/Listbox.d.ts +1 -1
- package/dist/form/Listbox.js.map +1 -1
- package/dist/form/MenuItemCheckbox.d.ts +3 -1
- package/dist/form/MenuItemCheckbox.js +3 -1
- package/dist/form/MenuItemCheckbox.js.map +1 -1
- package/dist/form/MenuItemFileInput.d.ts +1 -0
- package/dist/form/MenuItemFileInput.js +1 -0
- package/dist/form/MenuItemFileInput.js.map +1 -1
- package/dist/form/MenuItemInputToggle.d.ts +3 -2
- package/dist/form/MenuItemInputToggle.js +1 -0
- package/dist/form/MenuItemInputToggle.js.map +1 -1
- package/dist/form/MenuItemRadio.d.ts +8 -8
- package/dist/form/MenuItemRadio.js +8 -8
- package/dist/form/MenuItemRadio.js.map +1 -1
- package/dist/form/MenuItemSwitch.d.ts +3 -1
- package/dist/form/MenuItemSwitch.js +3 -1
- package/dist/form/MenuItemSwitch.js.map +1 -1
- package/dist/form/MenuItemTextField.d.ts +1 -0
- package/dist/form/MenuItemTextField.js +1 -0
- package/dist/form/MenuItemTextField.js.map +1 -1
- package/dist/form/NativeSelect.d.ts +2 -0
- package/dist/form/NativeSelect.js +2 -0
- package/dist/form/NativeSelect.js.map +1 -1
- package/dist/form/OptGroup.d.ts +4 -1
- package/dist/form/OptGroup.js +4 -1
- package/dist/form/OptGroup.js.map +1 -1
- package/dist/form/Option.d.ts +2 -1
- package/dist/form/Option.js +1 -0
- package/dist/form/Option.js.map +1 -1
- package/dist/form/Password.d.ts +3 -1
- package/dist/form/Password.js +3 -1
- package/dist/form/Password.js.map +1 -1
- package/dist/form/Radio.d.ts +2 -0
- package/dist/form/Radio.js +2 -0
- package/dist/form/Radio.js.map +1 -1
- package/dist/form/Select.d.ts +5 -28
- package/dist/form/Select.js +4 -27
- package/dist/form/Select.js.map +1 -1
- package/dist/form/Slider.d.ts +9 -2
- package/dist/form/Slider.js.map +1 -1
- package/dist/form/SliderContainer.js +7 -11
- package/dist/form/SliderContainer.js.map +1 -1
- package/dist/form/SliderMark.js +5 -8
- package/dist/form/SliderMark.js.map +1 -1
- package/dist/form/SliderMarkLabel.js +5 -7
- package/dist/form/SliderMarkLabel.js.map +1 -1
- package/dist/form/SliderThumb.js +2 -27
- package/dist/form/SliderThumb.js.map +1 -1
- package/dist/form/SliderTrack.js +6 -12
- package/dist/form/SliderTrack.js.map +1 -1
- package/dist/form/SliderValueTooltip.js +7 -7
- package/dist/form/SliderValueTooltip.js.map +1 -1
- package/dist/form/Switch.d.ts +9 -1
- package/dist/form/Switch.js +3 -1
- package/dist/form/Switch.js.map +1 -1
- package/dist/form/SwitchTrack.js +8 -8
- package/dist/form/SwitchTrack.js.map +1 -1
- package/dist/form/TextArea.d.ts +9 -1
- package/dist/form/TextArea.js +3 -1
- package/dist/form/TextArea.js.map +1 -1
- package/dist/form/TextField.d.ts +3 -1
- package/dist/form/TextField.js +3 -1
- package/dist/form/TextField.js.map +1 -1
- package/dist/form/TextFieldAddon.d.ts +1 -34
- package/dist/form/TextFieldAddon.js +1 -16
- package/dist/form/TextFieldAddon.js.map +1 -1
- package/dist/form/TextFieldContainer.d.ts +13 -0
- package/dist/form/TextFieldContainer.js.map +1 -1
- package/dist/form/_form.scss +737 -10
- package/dist/form/fieldsetStyles.d.ts +19 -0
- package/dist/form/fieldsetStyles.js +14 -0
- package/dist/form/fieldsetStyles.js.map +1 -0
- package/dist/form/formConfig.js +22 -3
- package/dist/form/formConfig.js.map +1 -1
- package/dist/form/labelStyles.d.ts +5 -0
- package/dist/form/labelStyles.js +34 -0
- package/dist/form/labelStyles.js.map +1 -0
- package/dist/form/sliderStyles.d.ts +89 -0
- package/dist/form/sliderStyles.js +96 -0
- package/dist/form/sliderStyles.js.map +1 -0
- package/dist/form/switchStyles.d.ts +24 -6
- package/dist/form/switchStyles.js +18 -0
- package/dist/form/switchStyles.js.map +1 -1
- package/dist/form/textAreaStyles.d.ts +0 -6
- package/dist/form/textAreaStyles.js.map +1 -1
- package/dist/form/textFieldAddonStyles.d.ts +17 -0
- package/dist/form/textFieldAddonStyles.js +18 -0
- package/dist/form/textFieldAddonStyles.js.map +1 -0
- package/dist/form/textFieldContainerStyles.d.ts +0 -13
- package/dist/form/textFieldContainerStyles.js.map +1 -1
- package/dist/form/types.d.ts +23 -2
- package/dist/form/types.js.map +1 -1
- package/dist/form/useCheckboxGroup.d.ts +8 -0
- package/dist/form/useCheckboxGroup.js +6 -1
- package/dist/form/useCheckboxGroup.js.map +1 -1
- package/dist/form/useCombobox.d.ts +0 -1
- package/dist/form/useCombobox.js +66 -63
- package/dist/form/useCombobox.js.map +1 -1
- package/dist/form/useNumberField.d.ts +17 -7
- package/dist/form/useNumberField.js +2 -0
- package/dist/form/useNumberField.js.map +1 -1
- package/dist/form/useRadioGroup.d.ts +6 -0
- package/dist/form/useRadioGroup.js +3 -0
- package/dist/form/useRadioGroup.js.map +1 -1
- package/dist/form/useRangeSlider.d.ts +6 -1
- package/dist/form/useRangeSlider.js +6 -1
- package/dist/form/useRangeSlider.js.map +1 -1
- package/dist/form/useSlider.d.ts +4 -1
- package/dist/form/useSlider.js +4 -1
- package/dist/form/useSlider.js.map +1 -1
- package/dist/form/useTextField.d.ts +7 -1
- package/dist/form/useTextField.js +5 -1
- package/dist/form/useTextField.js.map +1 -1
- package/dist/form/validation.d.ts +1 -0
- package/dist/form/validation.js.map +1 -1
- package/dist/icon/FontIcon.d.ts +1 -0
- package/dist/icon/FontIcon.js +1 -0
- package/dist/icon/FontIcon.js.map +1 -1
- package/dist/icon/IconRotator.d.ts +2 -0
- package/dist/icon/IconRotator.js +2 -0
- package/dist/icon/IconRotator.js.map +1 -1
- package/dist/icon/MaterialIcon.d.ts +2 -0
- package/dist/icon/MaterialIcon.js +2 -0
- package/dist/icon/MaterialIcon.js.map +1 -1
- package/dist/icon/MaterialSymbol.d.ts +3 -1
- package/dist/icon/MaterialSymbol.js +3 -1
- package/dist/icon/MaterialSymbol.js.map +1 -1
- package/dist/icon/SVGIcon.d.ts +2 -0
- package/dist/icon/SVGIcon.js +2 -0
- package/dist/icon/SVGIcon.js.map +1 -1
- package/dist/icon/TextIconSpacing.d.ts +6 -2
- package/dist/icon/TextIconSpacing.js +6 -2
- package/dist/icon/TextIconSpacing.js.map +1 -1
- package/dist/icon/_icon.scss +137 -129
- package/dist/icon/config.d.ts +2 -2
- package/dist/icon/config.js +2 -2
- package/dist/icon/config.js.map +1 -1
- package/dist/icon/material.d.ts +1 -1
- package/dist/icon/material.js.map +1 -1
- package/dist/icon/styles.d.ts +2 -1
- package/dist/icon/styles.js.map +1 -1
- package/dist/interaction/Ripple.d.ts +11 -2
- package/dist/interaction/Ripple.js.map +1 -1
- package/dist/interaction/UserInteractionModeProvider.d.ts +1 -1
- package/dist/interaction/UserInteractionModeProvider.js +1 -1
- package/dist/interaction/UserInteractionModeProvider.js.map +1 -1
- package/dist/interaction/_interaction.scss +279 -13
- package/dist/layout/LayoutAppBar.d.ts +1 -0
- package/dist/layout/LayoutAppBar.js +1 -0
- package/dist/layout/LayoutAppBar.js.map +1 -1
- package/dist/layout/LayoutNav.d.ts +9 -12
- package/dist/layout/LayoutNav.js +9 -12
- package/dist/layout/LayoutNav.js.map +1 -1
- package/dist/layout/LayoutWindowSplitter.d.ts +7 -8
- package/dist/layout/LayoutWindowSplitter.js +7 -8
- package/dist/layout/LayoutWindowSplitter.js.map +1 -1
- package/dist/layout/Main.d.ts +2 -1
- package/dist/layout/Main.js +2 -1
- package/dist/layout/Main.js.map +1 -1
- package/dist/layout/_layout.scss +106 -23
- package/dist/layout/useExpandableLayout.d.ts +1 -0
- package/dist/layout/useExpandableLayout.js +1 -0
- package/dist/layout/useExpandableLayout.js.map +1 -1
- package/dist/layout/useHorizontalLayoutTransition.d.ts +9 -6
- package/dist/layout/useHorizontalLayoutTransition.js +4 -1
- package/dist/layout/useHorizontalLayoutTransition.js.map +1 -1
- package/dist/layout/useLayoutAppBarHeight.d.ts +7 -10
- package/dist/layout/useLayoutAppBarHeight.js +7 -10
- package/dist/layout/useLayoutAppBarHeight.js.map +1 -1
- package/dist/layout/useLayoutTree.d.ts +3 -0
- package/dist/layout/useLayoutTree.js +3 -0
- package/dist/layout/useLayoutTree.js.map +1 -1
- package/dist/layout/useLayoutWindowSplitter.d.ts +4 -2
- package/dist/layout/useLayoutWindowSplitter.js +4 -2
- package/dist/layout/useLayoutWindowSplitter.js.map +1 -1
- package/dist/layout/useResizableLayout.d.ts +1 -0
- package/dist/layout/useResizableLayout.js +3 -1
- package/dist/layout/useResizableLayout.js.map +1 -1
- package/dist/layout/useTemporaryLayout.d.ts +1 -0
- package/dist/layout/useTemporaryLayout.js +1 -0
- package/dist/layout/useTemporaryLayout.js.map +1 -1
- package/dist/link/Link.d.ts +3 -1
- package/dist/link/Link.js +3 -1
- package/dist/link/Link.js.map +1 -1
- package/dist/link/SkipToMainContent.d.ts +22 -0
- package/dist/link/SkipToMainContent.js +22 -0
- package/dist/link/SkipToMainContent.js.map +1 -1
- package/dist/link/_link.scss +55 -6
- package/dist/list/List.d.ts +11 -1
- package/dist/list/List.js +5 -1
- package/dist/list/List.js.map +1 -1
- package/dist/list/ListItem.d.ts +22 -2
- package/dist/list/ListItem.js +6 -2
- package/dist/list/ListItem.js.map +1 -1
- package/dist/list/ListItemChildren.d.ts +3 -1
- package/dist/list/ListItemChildren.js +3 -1
- package/dist/list/ListItemChildren.js.map +1 -1
- package/dist/list/ListItemLink.d.ts +32 -1
- package/dist/list/ListItemLink.js +32 -1
- package/dist/list/ListItemLink.js.map +1 -1
- package/dist/list/ListSubheader.d.ts +2 -0
- package/dist/list/ListSubheader.js +2 -0
- package/dist/list/ListSubheader.js.map +1 -1
- package/dist/list/_list.scss +224 -1
- package/dist/list/listItemStyles.d.ts +0 -16
- package/dist/list/listItemStyles.js.map +1 -1
- package/dist/list/listStyles.d.ts +0 -6
- package/dist/list/listStyles.js.map +1 -1
- package/dist/media-queries/AppSizeProvider.d.ts +2 -0
- package/dist/media-queries/AppSizeProvider.js +2 -0
- package/dist/media-queries/AppSizeProvider.js.map +1 -1
- package/dist/media-queries/_media-queries.scss +111 -4
- package/dist/media-queries/useMediaQuery.d.ts +2 -0
- package/dist/media-queries/useMediaQuery.js +2 -0
- package/dist/media-queries/useMediaQuery.js.map +1 -1
- package/dist/menu/DropdownMenu.d.ts +5 -2
- package/dist/menu/DropdownMenu.js +5 -2
- package/dist/menu/DropdownMenu.js.map +1 -1
- package/dist/menu/Menu.d.ts +1 -0
- package/dist/menu/Menu.js +1 -0
- package/dist/menu/Menu.js.map +1 -1
- package/dist/menu/MenuBar.d.ts +4 -1
- package/dist/menu/MenuBar.js +4 -1
- package/dist/menu/MenuBar.js.map +1 -1
- package/dist/menu/MenuButton.d.ts +1 -0
- package/dist/menu/MenuButton.js +1 -0
- package/dist/menu/MenuButton.js.map +1 -1
- package/dist/menu/MenuItem.d.ts +1 -0
- package/dist/menu/MenuItem.js +1 -0
- package/dist/menu/MenuItem.js.map +1 -1
- package/dist/menu/MenuItemCircularProgress.d.ts +4 -6
- package/dist/menu/MenuItemCircularProgress.js +4 -6
- package/dist/menu/MenuItemCircularProgress.js.map +1 -1
- package/dist/menu/MenuItemGroup.d.ts +6 -7
- package/dist/menu/MenuItemGroup.js +6 -7
- package/dist/menu/MenuItemGroup.js.map +1 -1
- package/dist/menu/MenuItemSeparator.d.ts +1 -0
- package/dist/menu/MenuItemSeparator.js +1 -0
- package/dist/menu/MenuItemSeparator.js.map +1 -1
- package/dist/menu/MenuWidget.d.ts +0 -12
- package/dist/menu/MenuWidget.js +1 -12
- package/dist/menu/MenuWidget.js.map +1 -1
- package/dist/menu/_menu.scss +61 -0
- package/dist/menu/styles.d.ts +12 -0
- package/dist/menu/styles.js +14 -0
- package/dist/menu/styles.js.map +1 -0
- package/dist/menu/useContextMenu.d.ts +4 -1
- package/dist/menu/useContextMenu.js +4 -1
- package/dist/menu/useContextMenu.js.map +1 -1
- package/dist/movement/useKeyboardMovementProvider.d.ts +3 -3
- package/dist/movement/useKeyboardMovementProvider.js +3 -3
- package/dist/movement/useKeyboardMovementProvider.js.map +1 -1
- package/dist/navigation/CollapsibleNavGroup.d.ts +1 -0
- package/dist/navigation/CollapsibleNavGroup.js +1 -0
- package/dist/navigation/CollapsibleNavGroup.js.map +1 -1
- package/dist/navigation/DefaultNavigationRenderer.d.ts +1 -0
- package/dist/navigation/DefaultNavigationRenderer.js +1 -0
- package/dist/navigation/DefaultNavigationRenderer.js.map +1 -1
- package/dist/navigation/NavGroup.d.ts +1 -0
- package/dist/navigation/NavGroup.js +1 -0
- package/dist/navigation/NavGroup.js.map +1 -1
- package/dist/navigation/NavItem.d.ts +1 -0
- package/dist/navigation/NavItem.js +1 -0
- package/dist/navigation/NavItem.js.map +1 -1
- package/dist/navigation/NavItemButton.d.ts +1 -0
- package/dist/navigation/NavItemButton.js +1 -0
- package/dist/navigation/NavItemButton.js.map +1 -1
- package/dist/navigation/NavItemLink.d.ts +1 -0
- package/dist/navigation/NavItemLink.js +1 -0
- package/dist/navigation/NavItemLink.js.map +1 -1
- package/dist/navigation/NavSubheader.d.ts +1 -0
- package/dist/navigation/NavSubheader.js +1 -0
- package/dist/navigation/NavSubheader.js.map +1 -1
- package/dist/navigation/Navigation.d.ts +44 -0
- package/dist/navigation/Navigation.js +44 -0
- package/dist/navigation/Navigation.js.map +1 -1
- package/dist/navigation/_navigation.scss +47 -5
- package/dist/navigation/getTableOfContentsHeadings.d.ts +20 -0
- package/dist/navigation/getTableOfContentsHeadings.js +53 -0
- package/dist/navigation/getTableOfContentsHeadings.js.map +1 -0
- package/dist/navigation/navItemStyles.js +1 -1
- package/dist/navigation/navItemStyles.js.map +1 -1
- package/dist/navigation/types.d.ts +47 -0
- package/dist/navigation/types.js +1 -3
- package/dist/navigation/types.js.map +1 -1
- package/dist/navigation/useActiveHeadingId.d.ts +2 -12
- package/dist/navigation/useActiveHeadingId.js +1 -0
- package/dist/navigation/useActiveHeadingId.js.map +1 -1
- package/dist/navigation/useNavigationExpansion.d.ts +2 -0
- package/dist/navigation/useNavigationExpansion.js +2 -0
- package/dist/navigation/useNavigationExpansion.js.map +1 -1
- package/dist/navigation/useTableOfContentsHeadings.d.ts +3 -37
- package/dist/navigation/useTableOfContentsHeadings.js +18 -41
- package/dist/navigation/useTableOfContentsHeadings.js.map +1 -1
- package/dist/overlay/Overlay.d.ts +10 -1
- package/dist/overlay/Overlay.js +5 -2
- package/dist/overlay/Overlay.js.map +1 -1
- package/dist/overlay/_overlay.scss +35 -0
- package/dist/overlay/{overlayStyles.d.ts → styles.d.ts} +0 -6
- package/dist/overlay/{overlayStyles.js → styles.js} +1 -1
- package/dist/overlay/styles.js.map +1 -0
- package/dist/portal/Portal.d.ts +1 -0
- package/dist/portal/Portal.js +1 -0
- package/dist/portal/Portal.js.map +1 -1
- package/dist/portal/PortalContainerProvider.d.ts +1 -0
- package/dist/portal/PortalContainerProvider.js +1 -0
- package/dist/portal/PortalContainerProvider.js.map +1 -1
- package/dist/positioning/createHorizontalPosition.d.ts +6 -6
- package/dist/positioning/createHorizontalPosition.js +12 -12
- package/dist/positioning/createHorizontalPosition.js.map +1 -1
- package/dist/positioning/createVerticalPosition.d.ts +6 -6
- package/dist/positioning/createVerticalPosition.js +2 -2
- package/dist/positioning/createVerticalPosition.js.map +1 -1
- package/dist/positioning/useFixedPositioning.d.ts +1 -0
- package/dist/positioning/useFixedPositioning.js +1 -0
- package/dist/positioning/useFixedPositioning.js.map +1 -1
- package/dist/progress/CircularProgress.d.ts +3 -2
- package/dist/progress/CircularProgress.js +3 -2
- package/dist/progress/CircularProgress.js.map +1 -1
- package/dist/progress/LinearProgress.d.ts +3 -2
- package/dist/progress/LinearProgress.js +3 -2
- package/dist/progress/LinearProgress.js.map +1 -1
- package/dist/progress/_progress.scss +164 -38
- package/dist/responsive-item/ResponsiveItem.d.ts +4 -3
- package/dist/responsive-item/ResponsiveItem.js +4 -3
- package/dist/responsive-item/ResponsiveItem.js.map +1 -1
- package/dist/responsive-item/ResponsiveItemOverlay.d.ts +6 -4
- package/dist/responsive-item/ResponsiveItemOverlay.js +6 -4
- package/dist/responsive-item/ResponsiveItemOverlay.js.map +1 -1
- package/dist/responsive-item/_responsive-item.scss +89 -0
- package/dist/scroll/useScrollLock.d.ts +1 -0
- package/dist/scroll/useScrollLock.js +1 -0
- package/dist/scroll/useScrollLock.js.map +1 -1
- package/dist/searching/fuzzy.d.ts +2 -1
- package/dist/searching/fuzzy.js +2 -1
- package/dist/searching/fuzzy.js.map +1 -1
- package/dist/segmented-button/SegmentedButton.d.ts +3 -4
- package/dist/segmented-button/SegmentedButton.js +3 -4
- package/dist/segmented-button/SegmentedButton.js.map +1 -1
- package/dist/segmented-button/SegmentedButtonContainer.d.ts +5 -6
- package/dist/segmented-button/SegmentedButtonContainer.js +7 -8
- package/dist/segmented-button/SegmentedButtonContainer.js.map +1 -1
- package/dist/segmented-button/_segmented-button.scss +79 -33
- package/dist/segmented-button/segmentedButtonContainerStyles.d.ts +1 -1
- package/dist/segmented-button/segmentedButtonContainerStyles.js +1 -1
- package/dist/segmented-button/segmentedButtonContainerStyles.js.map +1 -1
- package/dist/sheet/Sheet.d.ts +14 -0
- package/dist/sheet/Sheet.js +2 -0
- package/dist/sheet/Sheet.js.map +1 -1
- package/dist/sheet/_sheet.scss +84 -0
- package/dist/sheet/styles.d.ts +19 -15
- package/dist/sheet/styles.js +6 -2
- package/dist/sheet/styles.js.map +1 -1
- package/dist/snackbar/DefaultToastRenderer.d.ts +1 -0
- package/dist/snackbar/DefaultToastRenderer.js +1 -0
- package/dist/snackbar/DefaultToastRenderer.js.map +1 -1
- package/dist/snackbar/Snackbar.d.ts +10 -9
- package/dist/snackbar/Snackbar.js +4 -1
- package/dist/snackbar/Snackbar.js.map +1 -1
- package/dist/snackbar/Toast.d.ts +8 -0
- package/dist/snackbar/Toast.js +1 -0
- package/dist/snackbar/Toast.js.map +1 -1
- package/dist/snackbar/ToastActionButton.d.ts +2 -1
- package/dist/snackbar/ToastActionButton.js +1 -0
- package/dist/snackbar/ToastActionButton.js.map +1 -1
- package/dist/snackbar/ToastCloseButton.d.ts +2 -1
- package/dist/snackbar/ToastCloseButton.js +1 -0
- package/dist/snackbar/ToastCloseButton.js.map +1 -1
- package/dist/snackbar/ToastContent.d.ts +1 -0
- package/dist/snackbar/ToastContent.js +1 -0
- package/dist/snackbar/ToastContent.js.map +1 -1
- package/dist/snackbar/ToastManager.d.ts +1 -1
- package/dist/snackbar/ToastManager.js +1 -1
- package/dist/snackbar/ToastManager.js.map +1 -1
- package/dist/snackbar/ToastManagerProvider.d.ts +1 -0
- package/dist/snackbar/ToastManagerProvider.js +1 -0
- package/dist/snackbar/ToastManagerProvider.js.map +1 -1
- package/dist/snackbar/_snackbar.scss +131 -3
- package/dist/snackbar/toastStyles.d.ts +0 -7
- package/dist/snackbar/toastStyles.js.map +1 -1
- package/dist/snackbar/useCurrentToastActions.d.ts +1 -0
- package/dist/snackbar/useCurrentToastActions.js +1 -0
- package/dist/snackbar/useCurrentToastActions.js.map +1 -1
- package/dist/storage/useStorage.d.ts +1 -0
- package/dist/storage/useStorage.js +1 -0
- package/dist/storage/useStorage.js.map +1 -1
- package/dist/suspense/CircularProgressSuspense.d.ts +2 -1
- package/dist/suspense/CircularProgressSuspense.js +2 -1
- package/dist/suspense/CircularProgressSuspense.js.map +1 -1
- package/dist/suspense/NullSuspense.d.ts +2 -1
- package/dist/suspense/NullSuspense.js +2 -1
- package/dist/suspense/NullSuspense.js.map +1 -1
- package/dist/table/StickyTableSection.d.ts +2 -0
- package/dist/table/StickyTableSection.js +2 -0
- package/dist/table/StickyTableSection.js.map +1 -1
- package/dist/table/Table.d.ts +8 -8
- package/dist/table/Table.js +8 -8
- package/dist/table/Table.js.map +1 -1
- package/dist/table/TableBody.d.ts +2 -0
- package/dist/table/TableBody.js +2 -0
- package/dist/table/TableBody.js.map +1 -1
- package/dist/table/TableCell.d.ts +6 -2
- package/dist/table/TableCell.js +2 -0
- package/dist/table/TableCell.js.map +1 -1
- package/dist/table/TableCheckbox.d.ts +11 -12
- package/dist/table/TableCheckbox.js +10 -11
- package/dist/table/TableCheckbox.js.map +1 -1
- package/dist/table/TableConfigurationProvider.js +1 -1
- package/dist/table/TableConfigurationProvider.js.map +1 -1
- package/dist/table/TableContainer.d.ts +2 -0
- package/dist/table/TableContainer.js +2 -0
- package/dist/table/TableContainer.js.map +1 -1
- package/dist/table/TableContainerProvider.js +1 -1
- package/dist/table/TableContainerProvider.js.map +1 -1
- package/dist/table/TableFooter.d.ts +2 -0
- package/dist/table/TableFooter.js +2 -0
- package/dist/table/TableFooter.js.map +1 -1
- package/dist/table/TableHeader.d.ts +2 -0
- package/dist/table/TableHeader.js +2 -0
- package/dist/table/TableHeader.js.map +1 -1
- package/dist/table/TableRadio.d.ts +13 -13
- package/dist/table/TableRadio.js +10 -10
- package/dist/table/TableRadio.js.map +1 -1
- package/dist/table/TableRow.d.ts +2 -0
- package/dist/table/TableRow.js +2 -0
- package/dist/table/TableRow.js.map +1 -1
- package/dist/table/_table.scss +209 -11
- package/dist/table/tableCellStyles.js +3 -2
- package/dist/table/tableCellStyles.js.map +1 -1
- package/dist/tabs/SimpleTabPanel.d.ts +2 -0
- package/dist/tabs/SimpleTabPanel.js +2 -0
- package/dist/tabs/SimpleTabPanel.js.map +1 -1
- package/dist/tabs/SimpleTabPanels.d.ts +2 -0
- package/dist/tabs/SimpleTabPanels.js +2 -0
- package/dist/tabs/SimpleTabPanels.js.map +1 -1
- package/dist/tabs/Tab.d.ts +19 -1
- package/dist/tabs/Tab.js +1 -1
- package/dist/tabs/Tab.js.map +1 -1
- package/dist/tabs/TabList.d.ts +1 -1
- package/dist/tabs/TabList.js +1 -1
- package/dist/tabs/TabList.js.map +1 -1
- package/dist/tabs/TabListScrollButton.d.ts +1 -1
- package/dist/tabs/TabListScrollButton.js.map +1 -1
- package/dist/tabs/_tabs.scss +142 -5
- package/dist/tabs/tabStyles.d.ts +0 -18
- package/dist/tabs/tabStyles.js.map +1 -1
- package/dist/tabs/useTabs.d.ts +4 -0
- package/dist/tabs/useTabs.js +3 -2
- package/dist/tabs/useTabs.js.map +1 -1
- package/dist/test-utils/jest-globals/match-media.d.ts +1 -2
- package/dist/test-utils/jest-globals/match-media.js +1 -1
- package/dist/test-utils/jest-globals/match-media.js.map +1 -1
- package/dist/test-utils/jest-globals/resize-observer.js +2 -2
- package/dist/test-utils/jest-globals/resize-observer.js.map +1 -1
- package/dist/test-utils/mocks/ResizeObserver.d.ts +7 -7
- package/dist/test-utils/mocks/ResizeObserver.js +7 -7
- package/dist/test-utils/mocks/ResizeObserver.js.map +1 -1
- package/dist/test-utils/mocks/match-media.d.ts +31 -0
- package/dist/test-utils/mocks/match-media.js.map +1 -1
- package/dist/test-utils/utils/createMatchMediaSpy.d.ts +40 -0
- package/dist/test-utils/{mocks/match-media-implementation.js → utils/createMatchMediaSpy.js} +33 -4
- package/dist/test-utils/utils/createMatchMediaSpy.js.map +1 -0
- package/dist/test-utils/vitest/match-media.d.ts +1 -2
- package/dist/test-utils/vitest/match-media.js +1 -1
- package/dist/test-utils/vitest/match-media.js.map +1 -1
- package/dist/test-utils/vitest/resize-observer.js +2 -2
- package/dist/test-utils/vitest/resize-observer.js.map +1 -1
- package/dist/theme/LocalStorageColorSchemeProvider.d.ts +6 -6
- package/dist/theme/LocalStorageColorSchemeProvider.js +6 -6
- package/dist/theme/LocalStorageColorSchemeProvider.js.map +1 -1
- package/dist/theme/ThemeProvider.d.ts +10 -11
- package/dist/theme/ThemeProvider.js +7 -9
- package/dist/theme/ThemeProvider.js.map +1 -1
- package/dist/theme/_a11y.scss +62 -62
- package/dist/theme/_colors.scss +283 -279
- package/dist/theme/_theme.scss +298 -249
- package/dist/theme/colors.d.ts +2 -2
- package/dist/theme/colors.js +2 -2
- package/dist/theme/colors.js.map +1 -1
- package/dist/theme/useColorScheme.d.ts +1 -1
- package/dist/theme/useColorScheme.js +1 -1
- package/dist/theme/useColorScheme.js.map +1 -1
- package/dist/tooltip/Tooltip.d.ts +12 -1
- package/dist/tooltip/Tooltip.js +6 -2
- package/dist/tooltip/Tooltip.js.map +1 -1
- package/dist/tooltip/TooltipHoverModeProvider.d.ts +1 -0
- package/dist/tooltip/TooltipHoverModeProvider.js +1 -0
- package/dist/tooltip/TooltipHoverModeProvider.js.map +1 -1
- package/dist/tooltip/_tooltip.scss +109 -5
- package/dist/tooltip/constants.d.ts +13 -3
- package/dist/tooltip/constants.js +4 -4
- package/dist/tooltip/constants.js.map +1 -1
- package/dist/tooltip/{tooltipStyles.d.ts → styles.d.ts} +1 -1
- package/dist/tooltip/{tooltipStyles.js → styles.js} +1 -1
- package/dist/tooltip/styles.js.map +1 -0
- package/dist/tooltip/useTooltip.d.ts +8 -15
- package/dist/tooltip/useTooltip.js +8 -8
- package/dist/tooltip/useTooltip.js.map +1 -1
- package/dist/transition/CSSTransition.d.ts +3 -1
- package/dist/transition/CSSTransition.js +3 -1
- package/dist/transition/CSSTransition.js.map +1 -1
- package/dist/transition/Collapse.d.ts +1 -0
- package/dist/transition/Collapse.js +1 -0
- package/dist/transition/Collapse.js.map +1 -1
- package/dist/transition/CrossFade.d.ts +1 -0
- package/dist/transition/CrossFade.js +1 -0
- package/dist/transition/CrossFade.js.map +1 -1
- package/dist/transition/ScaleTransition.d.ts +4 -1
- package/dist/transition/ScaleTransition.js +4 -1
- package/dist/transition/ScaleTransition.js.map +1 -1
- package/dist/transition/SkeletonPlaceholder.d.ts +3 -2
- package/dist/transition/SkeletonPlaceholder.js +3 -2
- package/dist/transition/SkeletonPlaceholder.js.map +1 -1
- package/dist/transition/Slide.d.ts +1 -0
- package/dist/transition/Slide.js +1 -0
- package/dist/transition/Slide.js.map +1 -1
- package/dist/transition/SlideContainer.d.ts +10 -7
- package/dist/transition/SlideContainer.js +12 -8
- package/dist/transition/SlideContainer.js.map +1 -1
- package/dist/transition/_transition.scss +178 -6
- package/dist/transition/getTransitionCallbacks.d.ts +76 -0
- package/dist/transition/getTransitionCallbacks.js +57 -0
- package/dist/transition/getTransitionCallbacks.js.map +1 -0
- package/dist/transition/skeletonPlaceholderUtils.d.ts +4 -1
- package/dist/transition/skeletonPlaceholderUtils.js +4 -1
- package/dist/transition/skeletonPlaceholderUtils.js.map +1 -1
- package/dist/transition/types.d.ts +26 -1
- package/dist/transition/types.js.map +1 -1
- package/dist/transition/useCSSTransition.d.ts +2 -0
- package/dist/transition/useCSSTransition.js +2 -0
- package/dist/transition/useCSSTransition.js.map +1 -1
- package/dist/transition/useCarousel.d.ts +6 -2
- package/dist/transition/useCarousel.js +11 -7
- package/dist/transition/useCarousel.js.map +1 -1
- package/dist/transition/useCollapseTransition.d.ts +7 -2
- package/dist/transition/useCollapseTransition.js +2 -0
- package/dist/transition/useCollapseTransition.js.map +1 -1
- package/dist/transition/useCrossFadeTransition.d.ts +22 -45
- package/dist/transition/useCrossFadeTransition.js +17 -49
- package/dist/transition/useCrossFadeTransition.js.map +1 -1
- package/dist/transition/useScaleTransition.d.ts +22 -16
- package/dist/transition/useScaleTransition.js +20 -14
- package/dist/transition/useScaleTransition.js.map +1 -1
- package/dist/transition/useSkeletonPlaceholder.d.ts +6 -3
- package/dist/transition/useSkeletonPlaceholder.js +3 -0
- package/dist/transition/useSkeletonPlaceholder.js.map +1 -1
- package/dist/transition/useSlideTransition.d.ts +9 -3
- package/dist/transition/useSlideTransition.js +1 -0
- package/dist/transition/useSlideTransition.js.map +1 -1
- package/dist/transition/useTransition.d.ts +1 -0
- package/dist/transition/useTransition.js +3 -2
- package/dist/transition/useTransition.js.map +1 -1
- package/dist/tree/DefaultTreeItemRenderer.d.ts +1 -0
- package/dist/tree/DefaultTreeItemRenderer.js +1 -0
- package/dist/tree/DefaultTreeItemRenderer.js.map +1 -1
- package/dist/tree/Tree.d.ts +8 -9
- package/dist/tree/Tree.js +4 -3
- package/dist/tree/Tree.js.map +1 -1
- package/dist/tree/TreeItem.d.ts +1 -0
- package/dist/tree/TreeItem.js +1 -0
- package/dist/tree/TreeItem.js.map +1 -1
- package/dist/tree/_tree.scss +71 -1
- package/dist/tree/types.d.ts +1 -1
- package/dist/tree/types.js.map +1 -1
- package/dist/tree/useTree.d.ts +4 -2
- package/dist/tree/useTree.js +4 -2
- package/dist/tree/useTree.js.map +1 -1
- package/dist/tree/useTreeExpansion.d.ts +1 -0
- package/dist/tree/useTreeExpansion.js +1 -0
- package/dist/tree/useTreeExpansion.js.map +1 -1
- package/dist/tree/useTreeItems.d.ts +1 -0
- package/dist/tree/useTreeItems.js +1 -0
- package/dist/tree/useTreeItems.js.map +1 -1
- package/dist/tree/useTreeSelection.d.ts +1 -0
- package/dist/tree/useTreeSelection.js +1 -0
- package/dist/tree/useTreeSelection.js.map +1 -1
- package/dist/types.d.ts +1 -1
- package/dist/types.js.map +1 -1
- package/dist/typography/HighlightText.d.ts +76 -0
- package/dist/typography/HighlightText.js +60 -0
- package/dist/typography/HighlightText.js.map +1 -0
- package/dist/typography/HighlightTextMark.d.ts +16 -0
- package/dist/typography/HighlightTextMark.js +16 -0
- package/dist/typography/HighlightTextMark.js.map +1 -0
- package/dist/typography/Mark.d.ts +27 -0
- package/dist/typography/Mark.js +34 -0
- package/dist/typography/Mark.js.map +1 -0
- package/dist/typography/SrOnly.d.ts +3 -1
- package/dist/typography/SrOnly.js +3 -1
- package/dist/typography/SrOnly.js.map +1 -1
- package/dist/typography/TextContainer.d.ts +9 -1
- package/dist/typography/TextContainer.js +3 -1
- package/dist/typography/TextContainer.js.map +1 -1
- package/dist/typography/Typography.d.ts +2 -1
- package/dist/typography/Typography.js +2 -1
- package/dist/typography/Typography.js.map +1 -1
- package/dist/typography/WritingDirectionProvider.d.ts +8 -8
- package/dist/typography/WritingDirectionProvider.js +8 -8
- package/dist/typography/WritingDirectionProvider.js.map +1 -1
- package/dist/typography/_typography.scss +392 -51
- package/dist/typography/markStyles.d.ts +10 -0
- package/dist/typography/markStyles.js +11 -0
- package/dist/typography/markStyles.js.map +1 -0
- package/dist/typography/textContainerStyles.d.ts +2 -7
- package/dist/typography/textContainerStyles.js +2 -1
- package/dist/typography/textContainerStyles.js.map +1 -1
- package/dist/typography/typographyStyles.d.ts +2 -2
- package/dist/typography/typographyStyles.js +2 -2
- package/dist/typography/typographyStyles.js.map +1 -1
- package/dist/useAsyncFunction.d.ts +10 -68
- package/dist/useAsyncFunction.js +9 -67
- package/dist/useAsyncFunction.js.map +1 -1
- package/dist/useDebouncedFunction.d.ts +3 -1
- package/dist/useDebouncedFunction.js +3 -1
- package/dist/useDebouncedFunction.js.map +1 -1
- package/dist/useDropzone.d.ts +3 -2
- package/dist/useDropzone.js +3 -2
- package/dist/useDropzone.js.map +1 -1
- package/dist/useThrottledFunction.d.ts +3 -1
- package/dist/useThrottledFunction.js +3 -1
- package/dist/useThrottledFunction.js.map +1 -1
- package/dist/useUnmounted.d.ts +1 -1
- package/dist/useUnmounted.js +1 -1
- package/dist/useUnmounted.js.map +1 -1
- package/dist/utils/RenderRecursively.d.ts +1 -0
- package/dist/utils/RenderRecursively.js +1 -0
- package/dist/utils/RenderRecursively.js.map +1 -1
- package/dist/utils/applyRef.d.ts +1 -1
- package/dist/utils/applyRef.js +1 -1
- package/dist/utils/applyRef.js.map +1 -1
- package/dist/window-splitter/WindowSplitter.d.ts +11 -0
- package/dist/window-splitter/WindowSplitter.js +1 -0
- package/dist/window-splitter/WindowSplitter.js.map +1 -1
- package/dist/window-splitter/_window-splitter.scss +46 -0
- package/dist/window-splitter/useWindowSplitter.d.ts +0 -10
- package/dist/window-splitter/useWindowSplitter.js.map +1 -1
- package/package.json +43 -17
- package/src/CoreProviders.tsx +1 -0
- package/src/NoSsr.tsx +3 -1
- package/src/RootHtml.tsx +1 -1
- package/src/SsrProvider.tsx +1 -0
- package/src/app-bar/AppBar.tsx +3 -1
- package/src/app-bar/AppBarTitle.tsx +2 -1
- package/src/autocomplete/Autocomplete.tsx +85 -3
- package/src/autocomplete/AutocompleteChip.tsx +1 -0
- package/src/autocomplete/AutocompleteCircularProgress.tsx +1 -0
- package/src/autocomplete/AutocompleteClearButton.tsx +3 -1
- package/src/autocomplete/AutocompleteDropdownButton.tsx +1 -0
- package/src/autocomplete/AutocompleteListboxChildren.tsx +2 -3
- package/src/autocomplete/autocompleteStyles.ts +11 -2
- package/src/autocomplete/types.ts +140 -86
- package/src/autocomplete/useAutocomplete.ts +21 -26
- package/src/autocomplete/utils.ts +6 -8
- package/src/avatar/Avatar.tsx +2 -1
- package/src/badge/Badge.tsx +8 -4
- package/src/box/Box.tsx +4 -3
- package/src/button/AsyncButton.tsx +4 -3
- package/src/button/Button.tsx +11 -9
- package/src/button/ButtonUnstyled.tsx +2 -1
- package/src/button/TooltippedButton.tsx +3 -2
- package/src/button/{buttonStyles.ts → styles.ts} +18 -0
- package/src/card/Card.tsx +9 -10
- package/src/card/CardContent.tsx +1 -0
- package/src/card/CardFooter.tsx +1 -0
- package/src/card/CardHeader.tsx +1 -0
- package/src/card/CardSubtitle.tsx +1 -0
- package/src/card/CardTitle.tsx +2 -1
- package/src/card/ClickableCard.tsx +3 -1
- package/src/chip/Chip.tsx +5 -3
- package/src/cssUtils.ts +1 -1
- package/src/dialog/Dialog.tsx +9 -10
- package/src/dialog/DialogContent.tsx +5 -5
- package/src/dialog/DialogFooter.tsx +5 -2
- package/src/dialog/DialogHeader.tsx +31 -5
- package/src/dialog/DialogTitle.tsx +8 -7
- package/src/dialog/FixedDialog.tsx +13 -12
- package/src/dialog/styles.ts +16 -10
- package/src/divider/Divider.tsx +3 -1
- package/src/divider/styles.ts +2 -2
- package/src/draggable/useDraggable.ts +1 -0
- package/src/error-boundary/ErrorBoundary.tsx +103 -0
- package/src/error-boundary/context.ts +16 -0
- package/src/error-boundary/types.ts +19 -0
- package/src/error-boundary/useErrorBoundary.ts +36 -0
- package/src/expansion-panel/ExpansionList.tsx +1 -0
- package/src/expansion-panel/ExpansionPanel.tsx +32 -0
- package/src/expansion-panel/ExpansionPanelHeader.tsx +10 -10
- package/src/expansion-panel/expansionPanelStyles.ts +33 -0
- package/src/expansion-panel/useExpansionList.ts +7 -8
- package/src/expansion-panel/useExpansionPanels.ts +7 -10
- package/src/files/FileInput.tsx +4 -2
- package/src/files/styles.ts +1 -1
- package/src/files/useFileUpload.ts +2 -0
- package/src/focus/useFocusContainer.ts +29 -43
- package/src/form/Checkbox.tsx +3 -1
- package/src/form/Fieldset.tsx +6 -35
- package/src/form/Form.tsx +2 -0
- package/src/form/FormMessage.tsx +2 -0
- package/src/form/FormMessageContainer.tsx +1 -0
- package/src/form/FormMessageCounter.tsx +2 -0
- package/src/form/InputToggle.tsx +4 -2
- package/src/form/Label.tsx +5 -54
- package/src/form/Legend.tsx +1 -0
- package/src/form/Listbox.tsx +1 -1
- package/src/form/MenuItemCheckbox.tsx +3 -1
- package/src/form/MenuItemFileInput.tsx +1 -0
- package/src/form/MenuItemInputToggle.tsx +3 -2
- package/src/form/MenuItemRadio.tsx +8 -8
- package/src/form/MenuItemSwitch.tsx +3 -1
- package/src/form/MenuItemTextField.tsx +1 -0
- package/src/form/NativeSelect.tsx +2 -0
- package/src/form/OptGroup.tsx +4 -1
- package/src/form/Option.tsx +2 -1
- package/src/form/Password.tsx +3 -1
- package/src/form/Radio.tsx +2 -0
- package/src/form/Select.tsx +6 -29
- package/src/form/Slider.tsx +9 -2
- package/src/form/SliderContainer.tsx +7 -15
- package/src/form/SliderMark.tsx +2 -13
- package/src/form/SliderMarkLabel.tsx +2 -5
- package/src/form/SliderThumb.tsx +2 -50
- package/src/form/SliderTrack.tsx +8 -18
- package/src/form/SliderValueTooltip.tsx +2 -10
- package/src/form/Switch.tsx +10 -1
- package/src/form/SwitchTrack.tsx +3 -6
- package/src/form/TextArea.tsx +10 -1
- package/src/form/TextField.tsx +3 -1
- package/src/form/TextFieldAddon.tsx +2 -59
- package/src/form/TextFieldContainer.tsx +14 -0
- package/src/form/fieldsetStyles.ts +35 -0
- package/src/form/formConfig.ts +29 -4
- package/src/form/labelStyles.ts +55 -0
- package/src/form/sliderStyles.ts +204 -0
- package/src/form/switchStyles.ts +36 -7
- package/src/form/textAreaStyles.ts +0 -7
- package/src/form/textFieldAddonStyles.ts +41 -0
- package/src/form/textFieldContainerStyles.ts +0 -14
- package/src/form/types.ts +25 -2
- package/src/form/useCheckboxGroup.ts +14 -0
- package/src/form/useCombobox.ts +78 -84
- package/src/form/useNumberField.ts +19 -7
- package/src/form/useRadioGroup.ts +9 -0
- package/src/form/useRangeSlider.ts +6 -1
- package/src/form/useSlider.ts +4 -1
- package/src/form/useTextField.ts +12 -1
- package/src/form/validation.ts +1 -0
- package/src/icon/FontIcon.tsx +1 -0
- package/src/icon/IconRotator.tsx +2 -0
- package/src/icon/MaterialIcon.tsx +2 -0
- package/src/icon/MaterialSymbol.tsx +3 -1
- package/src/icon/SVGIcon.tsx +2 -0
- package/src/icon/TextIconSpacing.tsx +6 -2
- package/src/icon/config.tsx +2 -2
- package/src/icon/material.ts +260 -17
- package/src/icon/styles.ts +5 -1
- package/src/interaction/Ripple.tsx +4 -4
- package/src/interaction/UserInteractionModeProvider.tsx +1 -1
- package/src/layout/LayoutAppBar.tsx +1 -0
- package/src/layout/LayoutNav.tsx +9 -12
- package/src/layout/LayoutWindowSplitter.tsx +7 -8
- package/src/layout/Main.tsx +2 -1
- package/src/layout/useExpandableLayout.ts +1 -0
- package/src/layout/useHorizontalLayoutTransition.ts +5 -2
- package/src/layout/useLayoutAppBarHeight.ts +7 -10
- package/src/layout/useLayoutTree.ts +3 -0
- package/src/layout/useLayoutWindowSplitter.ts +4 -2
- package/src/layout/useResizableLayout.ts +3 -0
- package/src/layout/useTemporaryLayout.ts +1 -0
- package/src/link/Link.tsx +3 -1
- package/src/link/SkipToMainContent.tsx +22 -0
- package/src/list/List.tsx +12 -1
- package/src/list/ListItem.tsx +23 -2
- package/src/list/ListItemChildren.tsx +3 -1
- package/src/list/ListItemLink.tsx +32 -1
- package/src/list/ListSubheader.tsx +2 -0
- package/src/list/listItemStyles.ts +0 -17
- package/src/list/listStyles.ts +0 -7
- package/src/media-queries/AppSizeProvider.tsx +2 -0
- package/src/media-queries/useMediaQuery.ts +2 -0
- package/src/menu/DropdownMenu.tsx +5 -2
- package/src/menu/Menu.tsx +1 -0
- package/src/menu/MenuBar.tsx +4 -1
- package/src/menu/MenuButton.tsx +1 -0
- package/src/menu/MenuItem.tsx +1 -0
- package/src/menu/MenuItemCircularProgress.tsx +4 -6
- package/src/menu/MenuItemGroup.tsx +6 -7
- package/src/menu/MenuItemSeparator.tsx +1 -0
- package/src/menu/MenuWidget.tsx +1 -21
- package/src/menu/styles.ts +23 -0
- package/src/menu/useContextMenu.ts +4 -1
- package/src/movement/useKeyboardMovementProvider.ts +3 -3
- package/src/navigation/CollapsibleNavGroup.tsx +1 -0
- package/src/navigation/DefaultNavigationRenderer.tsx +1 -0
- package/src/navigation/NavGroup.tsx +1 -0
- package/src/navigation/NavItem.tsx +1 -0
- package/src/navigation/NavItemButton.tsx +1 -0
- package/src/navigation/NavItemLink.tsx +1 -0
- package/src/navigation/NavSubheader.tsx +1 -0
- package/src/navigation/Navigation.tsx +44 -0
- package/src/navigation/getTableOfContentsHeadings.ts +70 -0
- package/src/navigation/navItemStyles.ts +1 -1
- package/src/navigation/types.ts +57 -0
- package/src/navigation/useActiveHeadingId.ts +3 -15
- package/src/navigation/useNavigationExpansion.ts +2 -0
- package/src/navigation/useTableOfContentsHeadings.ts +22 -89
- package/src/overlay/Overlay.tsx +12 -2
- package/src/overlay/{overlayStyles.ts → styles.ts} +1 -7
- package/src/portal/Portal.tsx +1 -0
- package/src/portal/PortalContainerProvider.tsx +1 -0
- package/src/positioning/createHorizontalPosition.ts +25 -19
- package/src/positioning/createVerticalPosition.ts +10 -8
- package/src/positioning/useFixedPositioning.ts +1 -0
- package/src/progress/CircularProgress.tsx +3 -2
- package/src/progress/LinearProgress.tsx +3 -2
- package/src/responsive-item/ResponsiveItem.tsx +4 -3
- package/src/responsive-item/ResponsiveItemOverlay.tsx +6 -4
- package/src/scroll/useScrollLock.ts +1 -0
- package/src/searching/fuzzy.ts +2 -1
- package/src/segmented-button/SegmentedButton.tsx +3 -4
- package/src/segmented-button/SegmentedButtonContainer.tsx +7 -8
- package/src/segmented-button/segmentedButtonContainerStyles.ts +1 -1
- package/src/sheet/Sheet.tsx +15 -0
- package/src/sheet/styles.ts +10 -17
- package/src/snackbar/DefaultToastRenderer.tsx +1 -0
- package/src/snackbar/Snackbar.tsx +10 -9
- package/src/snackbar/Toast.tsx +9 -0
- package/src/snackbar/ToastActionButton.tsx +2 -1
- package/src/snackbar/ToastCloseButton.tsx +2 -1
- package/src/snackbar/ToastContent.tsx +1 -0
- package/src/snackbar/{ToastManager.tsx → ToastManager.ts} +1 -1
- package/src/snackbar/ToastManagerProvider.tsx +1 -0
- package/src/snackbar/toastStyles.ts +0 -8
- package/src/snackbar/useCurrentToastActions.ts +1 -0
- package/src/storage/useStorage.ts +1 -0
- package/src/suspense/CircularProgressSuspense.tsx +2 -1
- package/src/suspense/NullSuspense.tsx +2 -1
- package/src/table/StickyTableSection.tsx +2 -0
- package/src/table/Table.tsx +8 -8
- package/src/table/TableBody.tsx +2 -0
- package/src/table/TableCell.tsx +6 -2
- package/src/table/TableCheckbox.tsx +11 -12
- package/src/table/TableContainer.tsx +2 -0
- package/src/table/TableFooter.tsx +2 -0
- package/src/table/TableHeader.tsx +2 -0
- package/src/table/TableRadio.tsx +13 -13
- package/src/table/TableRow.tsx +2 -0
- package/src/table/tableCellStyles.ts +1 -1
- package/src/tabs/SimpleTabPanel.tsx +2 -0
- package/src/tabs/SimpleTabPanels.tsx +2 -0
- package/src/tabs/Tab.tsx +21 -1
- package/src/tabs/TabList.tsx +1 -1
- package/src/tabs/TabListScrollButton.tsx +1 -1
- package/src/tabs/tabStyles.ts +0 -20
- package/src/tabs/useTabs.ts +7 -2
- package/src/test-utils/jest-globals/match-media.ts +4 -3
- package/src/test-utils/jest-globals/resize-observer.ts +2 -2
- package/src/test-utils/mocks/ResizeObserver.ts +7 -7
- package/src/test-utils/mocks/match-media.ts +32 -0
- package/src/test-utils/{mocks/match-media-implementation.ts → utils/createMatchMediaSpy.ts} +34 -36
- package/src/test-utils/vitest/match-media.ts +4 -3
- package/src/test-utils/vitest/resize-observer.ts +2 -2
- package/src/theme/LocalStorageColorSchemeProvider.tsx +6 -6
- package/src/theme/ThemeProvider.tsx +10 -11
- package/src/theme/colors.ts +2 -2
- package/src/theme/useColorScheme.ts +1 -1
- package/src/tooltip/Tooltip.tsx +14 -2
- package/src/tooltip/TooltipHoverModeProvider.tsx +1 -0
- package/src/tooltip/constants.ts +11 -11
- package/src/tooltip/{tooltipStyles.ts → styles.ts} +1 -1
- package/src/tooltip/useTooltip.ts +8 -16
- package/src/transition/CSSTransition.tsx +3 -1
- package/src/transition/Collapse.tsx +1 -0
- package/src/transition/CrossFade.tsx +1 -0
- package/src/transition/ScaleTransition.tsx +4 -1
- package/src/transition/SkeletonPlaceholder.tsx +3 -2
- package/src/transition/Slide.tsx +1 -0
- package/src/transition/SlideContainer.tsx +15 -11
- package/src/transition/getTransitionCallbacks.ts +140 -0
- package/src/transition/skeletonPlaceholderUtils.ts +4 -1
- package/src/transition/types.ts +28 -7
- package/src/transition/useCSSTransition.ts +2 -0
- package/src/transition/useCarousel.ts +11 -7
- package/src/transition/useCollapseTransition.ts +4 -3
- package/src/transition/useCrossFadeTransition.ts +23 -57
- package/src/transition/useScaleTransition.ts +27 -19
- package/src/transition/useSkeletonPlaceholder.ts +6 -3
- package/src/transition/useSlideTransition.ts +14 -13
- package/src/transition/useTransition.ts +3 -2
- package/src/tree/DefaultTreeItemRenderer.tsx +1 -0
- package/src/tree/Tree.tsx +8 -9
- package/src/tree/TreeItem.tsx +1 -0
- package/src/tree/types.ts +1 -1
- package/src/tree/useTree.ts +4 -2
- package/src/tree/useTreeExpansion.ts +1 -0
- package/src/tree/useTreeItems.ts +1 -0
- package/src/tree/useTreeSelection.ts +1 -0
- package/src/types.ts +1 -1
- package/src/typography/HighlightText.tsx +201 -0
- package/src/typography/HighlightTextMark.tsx +25 -0
- package/src/typography/Mark.tsx +41 -0
- package/src/typography/SrOnly.tsx +3 -1
- package/src/typography/TextContainer.tsx +10 -1
- package/src/typography/Typography.tsx +2 -1
- package/src/typography/WritingDirectionProvider.tsx +8 -8
- package/src/typography/markStyles.ts +20 -0
- package/src/typography/textContainerStyles.ts +2 -8
- package/src/typography/typographyStyles.ts +2 -2
- package/src/useAsyncFunction.ts +12 -68
- package/src/useDebouncedFunction.ts +3 -1
- package/src/useDropzone.ts +3 -2
- package/src/useThrottledFunction.ts +3 -1
- package/src/useUnmounted.ts +1 -1
- package/src/utils/RenderRecursively.tsx +1 -0
- package/src/utils/applyRef.ts +1 -1
- package/src/window-splitter/WindowSplitter.tsx +12 -0
- package/src/window-splitter/useWindowSplitter.ts +0 -11
- package/dist/button/buttonStyles.js.map +0 -1
- package/dist/button/buttonUnstyledStyles.d.ts +0 -10
- package/dist/button/buttonUnstyledStyles.js +0 -11
- package/dist/button/buttonUnstyledStyles.js.map +0 -1
- package/dist/overlay/overlayStyles.js.map +0 -1
- package/dist/test-utils/mocks/match-media-implementation.d.ts +0 -42
- package/dist/test-utils/mocks/match-media-implementation.js.map +0 -1
- package/dist/tooltip/tooltipStyles.js.map +0 -1
- package/src/button/buttonUnstyledStyles.ts +0 -19
- /package/src/table/{TableConfigurationProvider.tsx → TableConfigurationProvider.ts} +0 -0
- /package/src/table/{TableContainerProvider.tsx → TableContainerProvider.ts} +0 -0
|
@@ -3,7 +3,7 @@ import { bem } from "../utils/bem.js";
|
|
|
3
3
|
const styles = bem("rmd-segmented-button-container");
|
|
4
4
|
/**
|
|
5
5
|
* @since 6.0.0
|
|
6
|
-
*/ export function
|
|
6
|
+
*/ export function segmentedButtonContainer(options = {}) {
|
|
7
7
|
const { className, disableFullWidth } = options;
|
|
8
8
|
return cnb(styles({
|
|
9
9
|
"full-width": !disableFullWidth
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/segmented-button/segmentedButtonContainerStyles.ts"],"sourcesContent":["import { cnb } from \"cnbuilder\";\n\nimport { bem } from \"../utils/bem.js\";\n\nconst styles = bem(\"rmd-segmented-button-container\");\n\n/**\n * @since 6.0.0\n */\nexport interface SegmentedButtonContainerClassNameOptions {\n className?: string;\n\n /** @defaultValue `false` */\n disableFullWidth?: boolean;\n}\n\n/**\n * @since 6.0.0\n */\nexport function
|
|
1
|
+
{"version":3,"sources":["../../src/segmented-button/segmentedButtonContainerStyles.ts"],"sourcesContent":["import { cnb } from \"cnbuilder\";\n\nimport { bem } from \"../utils/bem.js\";\n\nconst styles = bem(\"rmd-segmented-button-container\");\n\n/**\n * @since 6.0.0\n */\nexport interface SegmentedButtonContainerClassNameOptions {\n className?: string;\n\n /** @defaultValue `false` */\n disableFullWidth?: boolean;\n}\n\n/**\n * @since 6.0.0\n */\nexport function segmentedButtonContainer(\n options: SegmentedButtonContainerClassNameOptions = {}\n): string {\n const { className, disableFullWidth } = options;\n\n return cnb(styles({ \"full-width\": !disableFullWidth }), className);\n}\n"],"names":["cnb","bem","styles","segmentedButtonContainer","options","className","disableFullWidth"],"mappings":"AAAA,SAASA,GAAG,QAAQ,YAAY;AAEhC,SAASC,GAAG,QAAQ,kBAAkB;AAEtC,MAAMC,SAASD,IAAI;AAYnB;;CAEC,GACD,OAAO,SAASE,yBACdC,UAAoD,CAAC,CAAC;IAEtD,MAAM,EAAEC,SAAS,EAAEC,gBAAgB,EAAE,GAAGF;IAExC,OAAOJ,IAAIE,OAAO;QAAE,cAAc,CAACI;IAAiB,IAAID;AAC1D"}
|
package/dist/sheet/Sheet.d.ts
CHANGED
|
@@ -1,6 +1,18 @@
|
|
|
1
1
|
import { type BaseDialogProps } from "../dialog/Dialog.js";
|
|
2
2
|
import { type LabelRequiredForA11y } from "../types.js";
|
|
3
3
|
import { type BaseSheetClassNameOptions } from "./styles.js";
|
|
4
|
+
declare module "react" {
|
|
5
|
+
interface CSSProperties {
|
|
6
|
+
"--rmd-sheet-height"?: string | number;
|
|
7
|
+
"--rmd-sheet-width"?: string | number;
|
|
8
|
+
"--rmd-sheet-max-height"?: string | number;
|
|
9
|
+
"--rmd-sheet-touch-width"?: string | number;
|
|
10
|
+
"--rmd-sheet-touch-max-height"?: string | number;
|
|
11
|
+
"--rmd-sheet-static-width"?: string | number;
|
|
12
|
+
"--rmd-sheet-transform-offscreen"?: string | number;
|
|
13
|
+
"--rmd-sheet-z-index"?: number;
|
|
14
|
+
}
|
|
15
|
+
}
|
|
4
16
|
/**
|
|
5
17
|
* @since 6.0.0
|
|
6
18
|
*/
|
|
@@ -48,5 +60,7 @@ export type SheetProps = LabelRequiredForA11y<BaseSheetProps>;
|
|
|
48
60
|
* );
|
|
49
61
|
* }
|
|
50
62
|
* ```
|
|
63
|
+
*
|
|
64
|
+
* @see {@link https://next.react-md.dev/components/sheet | Sheet Demos}
|
|
51
65
|
*/
|
|
52
66
|
export declare const Sheet: import("react").ForwardRefExoticComponent<SheetProps & import("react").RefAttributes<HTMLDivElement>>;
|
package/dist/sheet/Sheet.js
CHANGED
|
@@ -29,6 +29,8 @@ import { DEFAULT_SHEET_CLASSNAMES, DEFAULT_SHEET_TIMEOUT, sheet } from "./styles
|
|
|
29
29
|
* );
|
|
30
30
|
* }
|
|
31
31
|
* ```
|
|
32
|
+
*
|
|
33
|
+
* @see {@link https://next.react-md.dev/components/sheet | Sheet Demos}
|
|
32
34
|
*/ export const Sheet = /*#__PURE__*/ forwardRef(function Sheet(props, ref) {
|
|
33
35
|
const { role = "dialog", className, position = "left", horizontalSize = "media", verticalSize = "recommended", timeout = DEFAULT_SHEET_TIMEOUT, classNames = DEFAULT_SHEET_CLASSNAMES, visible, temporary = true, exitedHidden = true, children, ...remaining } = props;
|
|
34
36
|
const { disableOverlay } = props;
|
package/dist/sheet/Sheet.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/sheet/Sheet.tsx"],"sourcesContent":["\"use client\";\n\nimport { forwardRef } from \"react\";\n\nimport { type BaseDialogProps, Dialog } from \"../dialog/Dialog.js\";\nimport { type LabelRequiredForA11y } from \"../types.js\";\nimport {\n type BaseSheetClassNameOptions,\n DEFAULT_SHEET_CLASSNAMES,\n DEFAULT_SHEET_TIMEOUT,\n sheet,\n} from \"./styles.js\";\n\n/**\n * @since 6.0.0\n */\nexport type SheetDialogProps = Omit<BaseDialogProps, \"role\" | \"type\" | \"modal\">;\n\n/**\n * @since 6.0.0 extends the `SheetDialogProps` instead of `AllowedDialogProps`\n * and exports the `SheetDialogProps`.\n */\nexport interface BaseSheetProps\n extends SheetDialogProps,\n BaseSheetClassNameOptions {\n /**\n * @defaultValue `\"dialog\"`\n */\n role?: \"dialog\" | \"menu\" | \"none\";\n\n /**\n * @defaultValue `true`\n * @see {@link SheetDialogProps.exitedHidden}\n * @since 6.0.0\n */\n exitedHidden?: boolean;\n}\n\nexport type SheetProps = LabelRequiredForA11y<BaseSheetProps>;\n\n/**\n * **Client Component**\n *\n * The `Sheet` component is a {@link Dialog} that is fixed to the top, right,\n * bottom, or left of the viewport.\n *\n * @example Simple Example\n * ```tsx\n * import { Button } from \"@react-md/core/button/Button\";\n * import { Sheet } from \"@react-md/core/sheet/Sheet\";\n * import { useToggle } from \"@react-md/core/useToggle\";\n * import { type ReactElement } from \"react\";\n *\n * export function Example(): ReactElement {\n * const { toggled, disable, enable } = useToggle();\n *\n * return (\n * <>\n * <Button onClick={enable}>Show</Button>\n * <Sheet aria-label=\"Customization\" visible={toggled} onRequestClose={disable}>\n * Whatever Content\n * </Sheet>\n * </>\n * );\n * }\n * ```\n */\nexport const Sheet = forwardRef<HTMLDivElement, SheetProps>(\n function Sheet(props, ref) {\n const {\n role = \"dialog\",\n className,\n position = \"left\",\n horizontalSize = \"media\",\n verticalSize = \"recommended\",\n timeout = DEFAULT_SHEET_TIMEOUT,\n classNames = DEFAULT_SHEET_CLASSNAMES,\n visible,\n temporary = true,\n exitedHidden = true,\n children,\n ...remaining\n } = props;\n const { disableOverlay } = props;\n\n return (\n <Dialog\n {...remaining}\n ref={ref}\n role={role}\n type=\"custom\"\n timeout={timeout}\n classNames={classNames}\n visible={visible}\n temporary={temporary}\n exitedHidden={exitedHidden}\n className={sheet({\n position,\n horizontalSize,\n verticalSize,\n disableOverlay,\n className,\n })}\n >\n {children}\n </Dialog>\n );\n }\n);\n"],"names":["forwardRef","Dialog","DEFAULT_SHEET_CLASSNAMES","DEFAULT_SHEET_TIMEOUT","sheet","Sheet","props","ref","role","className","position","horizontalSize","verticalSize","timeout","classNames","visible","temporary","exitedHidden","children","remaining","disableOverlay","type"],"mappings":"AAAA;;AAEA,SAASA,UAAU,QAAQ,QAAQ;AAEnC,SAA+BC,MAAM,QAAQ,sBAAsB;AAEnE,SAEEC,wBAAwB,EACxBC,qBAAqB,EACrBC,KAAK,QACA,cAAc;
|
|
1
|
+
{"version":3,"sources":["../../src/sheet/Sheet.tsx"],"sourcesContent":["\"use client\";\n\nimport { forwardRef } from \"react\";\n\nimport { type BaseDialogProps, Dialog } from \"../dialog/Dialog.js\";\nimport { type LabelRequiredForA11y } from \"../types.js\";\nimport {\n type BaseSheetClassNameOptions,\n DEFAULT_SHEET_CLASSNAMES,\n DEFAULT_SHEET_TIMEOUT,\n sheet,\n} from \"./styles.js\";\n\ndeclare module \"react\" {\n interface CSSProperties {\n \"--rmd-sheet-height\"?: string | number;\n \"--rmd-sheet-width\"?: string | number;\n \"--rmd-sheet-max-height\"?: string | number;\n \"--rmd-sheet-touch-width\"?: string | number;\n \"--rmd-sheet-touch-max-height\"?: string | number;\n \"--rmd-sheet-static-width\"?: string | number;\n \"--rmd-sheet-transform-offscreen\"?: string | number;\n \"--rmd-sheet-z-index\"?: number;\n }\n}\n\n/**\n * @since 6.0.0\n */\nexport type SheetDialogProps = Omit<BaseDialogProps, \"role\" | \"type\" | \"modal\">;\n\n/**\n * @since 6.0.0 extends the `SheetDialogProps` instead of `AllowedDialogProps`\n * and exports the `SheetDialogProps`.\n */\nexport interface BaseSheetProps\n extends SheetDialogProps,\n BaseSheetClassNameOptions {\n /**\n * @defaultValue `\"dialog\"`\n */\n role?: \"dialog\" | \"menu\" | \"none\";\n\n /**\n * @defaultValue `true`\n * @see {@link SheetDialogProps.exitedHidden}\n * @since 6.0.0\n */\n exitedHidden?: boolean;\n}\n\nexport type SheetProps = LabelRequiredForA11y<BaseSheetProps>;\n\n/**\n * **Client Component**\n *\n * The `Sheet` component is a {@link Dialog} that is fixed to the top, right,\n * bottom, or left of the viewport.\n *\n * @example Simple Example\n * ```tsx\n * import { Button } from \"@react-md/core/button/Button\";\n * import { Sheet } from \"@react-md/core/sheet/Sheet\";\n * import { useToggle } from \"@react-md/core/useToggle\";\n * import { type ReactElement } from \"react\";\n *\n * export function Example(): ReactElement {\n * const { toggled, disable, enable } = useToggle();\n *\n * return (\n * <>\n * <Button onClick={enable}>Show</Button>\n * <Sheet aria-label=\"Customization\" visible={toggled} onRequestClose={disable}>\n * Whatever Content\n * </Sheet>\n * </>\n * );\n * }\n * ```\n *\n * @see {@link https://next.react-md.dev/components/sheet | Sheet Demos}\n */\nexport const Sheet = forwardRef<HTMLDivElement, SheetProps>(\n function Sheet(props, ref) {\n const {\n role = \"dialog\",\n className,\n position = \"left\",\n horizontalSize = \"media\",\n verticalSize = \"recommended\",\n timeout = DEFAULT_SHEET_TIMEOUT,\n classNames = DEFAULT_SHEET_CLASSNAMES,\n visible,\n temporary = true,\n exitedHidden = true,\n children,\n ...remaining\n } = props;\n const { disableOverlay } = props;\n\n return (\n <Dialog\n {...remaining}\n ref={ref}\n role={role}\n type=\"custom\"\n timeout={timeout}\n classNames={classNames}\n visible={visible}\n temporary={temporary}\n exitedHidden={exitedHidden}\n className={sheet({\n position,\n horizontalSize,\n verticalSize,\n disableOverlay,\n className,\n })}\n >\n {children}\n </Dialog>\n );\n }\n);\n"],"names":["forwardRef","Dialog","DEFAULT_SHEET_CLASSNAMES","DEFAULT_SHEET_TIMEOUT","sheet","Sheet","props","ref","role","className","position","horizontalSize","verticalSize","timeout","classNames","visible","temporary","exitedHidden","children","remaining","disableOverlay","type"],"mappings":"AAAA;;AAEA,SAASA,UAAU,QAAQ,QAAQ;AAEnC,SAA+BC,MAAM,QAAQ,sBAAsB;AAEnE,SAEEC,wBAAwB,EACxBC,qBAAqB,EACrBC,KAAK,QACA,cAAc;AA0CrB;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4BC,GACD,OAAO,MAAMC,sBAAQL,WACnB,SAASK,MAAMC,KAAK,EAAEC,GAAG;IACvB,MAAM,EACJC,OAAO,QAAQ,EACfC,SAAS,EACTC,WAAW,MAAM,EACjBC,iBAAiB,OAAO,EACxBC,eAAe,aAAa,EAC5BC,UAAUV,qBAAqB,EAC/BW,aAAaZ,wBAAwB,EACrCa,OAAO,EACPC,YAAY,IAAI,EAChBC,eAAe,IAAI,EACnBC,QAAQ,EACR,GAAGC,WACJ,GAAGb;IACJ,MAAM,EAAEc,cAAc,EAAE,GAAGd;IAE3B,qBACE,KAACL;QACE,GAAGkB,SAAS;QACbZ,KAAKA;QACLC,MAAMA;QACNa,MAAK;QACLR,SAASA;QACTC,YAAYA;QACZC,SAASA;QACTC,WAAWA;QACXC,cAAcA;QACdR,WAAWL,MAAM;YACfM;YACAC;YACAC;YACAQ;YACAX;QACF;kBAECS;;AAGP,GACA"}
|
package/dist/sheet/_sheet.scss
CHANGED
|
@@ -1,35 +1,104 @@
|
|
|
1
|
+
////
|
|
2
|
+
/// @group sheet
|
|
3
|
+
////
|
|
4
|
+
|
|
1
5
|
@use "sass:map";
|
|
2
6
|
@use "../utils";
|
|
3
7
|
@use "../box-shadows";
|
|
4
8
|
@use "../media-queries/media-queries";
|
|
5
9
|
@use "../transition/transition";
|
|
6
10
|
|
|
11
|
+
/// Set to `true` to disable all the styles.
|
|
12
|
+
/// @type Boolean
|
|
7
13
|
$disable-everything: false !default;
|
|
14
|
+
|
|
15
|
+
/// Set to `true` to disable `position="left"` for the `Sheet`.
|
|
16
|
+
/// @type Boolean
|
|
8
17
|
$disable-position-left: false !default;
|
|
18
|
+
|
|
19
|
+
/// Set to `true` to disable `position="right"` for the `Sheet`.
|
|
20
|
+
/// @type Boolean
|
|
9
21
|
$disable-position-right: false !default;
|
|
22
|
+
|
|
23
|
+
/// Set to `true` to disable `position="bottom"` for the `Sheet`.
|
|
24
|
+
/// @type Boolean
|
|
10
25
|
$disable-position-bottom: false !default;
|
|
26
|
+
|
|
27
|
+
/// Set to `true` to disable `position="top"` for the `Sheet`.
|
|
28
|
+
/// @type Boolean
|
|
11
29
|
$disable-position-top: false !default;
|
|
12
30
|
|
|
31
|
+
/// This should be a number between 0-24 representing the box-shadow elevation
|
|
32
|
+
/// of the `Sheet` while rendered without an `Overlay`.
|
|
33
|
+
/// @type Number
|
|
13
34
|
$elevation: 2 !default;
|
|
35
|
+
|
|
36
|
+
/// This should be a number between 0-24 representing the box-shadow elevation
|
|
37
|
+
/// of the `Sheet` while rendered with an `Overlay`.
|
|
38
|
+
/// @type Number
|
|
14
39
|
$raised-elevation: 16 !default;
|
|
15
40
|
|
|
41
|
+
/// The default enter transition duration.
|
|
42
|
+
/// @type Number
|
|
16
43
|
$enter-duration: transition.$enter-duration !default;
|
|
44
|
+
|
|
45
|
+
/// The default enter transition timing function.
|
|
46
|
+
/// @type String
|
|
17
47
|
$enter-timing-function: transition.$deceleration-timing-function !default;
|
|
48
|
+
|
|
49
|
+
/// The default leave transition duration.
|
|
50
|
+
/// @type Number
|
|
18
51
|
$leave-duration: transition.$leave-duration !default;
|
|
52
|
+
|
|
53
|
+
/// The default leave transition timing function.
|
|
54
|
+
/// @type String
|
|
19
55
|
$leave-timing-function: transition.$acceleration-timing-function !default;
|
|
20
56
|
|
|
57
|
+
/// The default `z-index` while rendered without an `Overlay`.
|
|
58
|
+
/// @type Number
|
|
21
59
|
$z-index: 5 !default;
|
|
60
|
+
|
|
61
|
+
/// The default `z-index` while rendered with an `Overlay`.
|
|
62
|
+
/// @type Number
|
|
22
63
|
$raised-z-index: utils.$temporary-element-z-index !default;
|
|
23
64
|
|
|
65
|
+
/// The default width for a `Sheet`.
|
|
66
|
+
/// @type Number
|
|
24
67
|
$static-width: 16rem !default;
|
|
68
|
+
|
|
69
|
+
/// The amount of margin between the `Sheet` and the viewport edge which is
|
|
70
|
+
/// used to create the `$touch-width` and `$touch-max-height`
|
|
71
|
+
///
|
|
72
|
+
/// @see $touch-width
|
|
73
|
+
/// @see $touch-max-height
|
|
74
|
+
/// @type Number
|
|
25
75
|
$touch-margin: 3.5rem !default;
|
|
76
|
+
|
|
77
|
+
/// The default width for a `Sheet` on touch/phone devices.
|
|
78
|
+
/// @type Number
|
|
26
79
|
$touch-width: calc(100vw - #{$touch-margin}) !default;
|
|
27
80
|
|
|
81
|
+
/// The default max-height for a `Sheet`.
|
|
82
|
+
/// @type Number
|
|
28
83
|
$max-height: 100% !default;
|
|
84
|
+
|
|
85
|
+
/// The default `max-height` for a `Sheet` that has `position="top"` or
|
|
86
|
+
/// `position="bottom"`.
|
|
87
|
+
///
|
|
88
|
+
/// @type Number
|
|
29
89
|
$touch-max-height: calc(100% - #{$touch-margin}) !default;
|
|
90
|
+
|
|
91
|
+
/// The default `min-height` for a `Sheet` when `verticalSize="recommended"`.
|
|
92
|
+
/// @type Number
|
|
30
93
|
$recommended-min-height: 3.5rem !default;
|
|
94
|
+
|
|
95
|
+
/// The default `max-height` for a `Sheet` when `verticalSize="recommended"`.
|
|
96
|
+
/// @type Number
|
|
31
97
|
$recommended-max-height: 50% !default;
|
|
32
98
|
|
|
99
|
+
/// The available configurable css variables and mostly used internally for the
|
|
100
|
+
/// `get-var`, `set-var`, and `use-var` utils.
|
|
101
|
+
/// @type List
|
|
33
102
|
$variables: (
|
|
34
103
|
height,
|
|
35
104
|
width,
|
|
@@ -41,6 +110,9 @@ $variables: (
|
|
|
41
110
|
z-index
|
|
42
111
|
);
|
|
43
112
|
|
|
113
|
+
/// @param {String} name - The supported variable name
|
|
114
|
+
/// @param {any} fallback [null] - An optional fallback value
|
|
115
|
+
/// @returns {String} a `var()` statement
|
|
44
116
|
@function get-var($name, $fallback: null) {
|
|
45
117
|
$var: utils.get-var-name($variables, $name, "sheet");
|
|
46
118
|
@if $fallback {
|
|
@@ -50,16 +122,24 @@ $variables: (
|
|
|
50
122
|
@return var(#{$var});
|
|
51
123
|
}
|
|
52
124
|
|
|
125
|
+
/// @param {String} name - The supported variable name
|
|
126
|
+
/// @param {any} value - The value to set the variable to. Supports `null` which
|
|
127
|
+
/// will just be a no-op.
|
|
53
128
|
@mixin set-var($name, $value) {
|
|
54
129
|
@if $value {
|
|
55
130
|
#{utils.get-var-name($variables, $name, "sheet")}: #{$value};
|
|
56
131
|
}
|
|
57
132
|
}
|
|
58
133
|
|
|
134
|
+
/// @param {String} property - The css property to apply the variable to
|
|
135
|
+
/// @param {String} name [$property] - The supported variable name
|
|
136
|
+
/// @param {any} fallback [null] - An optional fallback value if the variable
|
|
137
|
+
/// has not been set
|
|
59
138
|
@mixin use-var($property, $name: $property, $fallback: null) {
|
|
60
139
|
#{$property}: get-var($name, $fallback);
|
|
61
140
|
}
|
|
62
141
|
|
|
142
|
+
/// Conditionally applies the css variables based on feature flags
|
|
63
143
|
@mixin variables {
|
|
64
144
|
@if not $disable-everything {
|
|
65
145
|
@include set-var(touch-width, $touch-width);
|
|
@@ -69,6 +149,10 @@ $variables: (
|
|
|
69
149
|
}
|
|
70
150
|
}
|
|
71
151
|
|
|
152
|
+
/// Generates all the styles based on feature flags.
|
|
153
|
+
///
|
|
154
|
+
/// @param {Boolean} disable-layer [false] - Set this to `true` to disable the
|
|
155
|
+
/// layer behavior
|
|
72
156
|
@mixin styles($disable-layer: false) {
|
|
73
157
|
@if not $disable-everything {
|
|
74
158
|
@include utils.optional-layer(sheet, $disable-layer) {
|
package/dist/sheet/styles.d.ts
CHANGED
|
@@ -1,18 +1,22 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
1
|
+
/**
|
|
2
|
+
* @since 6.0.0 Uses `as const satisfies TransitionTimeout`
|
|
3
|
+
*/
|
|
4
|
+
export declare const DEFAULT_SHEET_TIMEOUT: {
|
|
5
|
+
readonly enter: 200;
|
|
6
|
+
readonly exit: 150;
|
|
7
|
+
};
|
|
8
|
+
/**
|
|
9
|
+
* @since 6.0.0 Uses `as const satisfies CSSTransitionClassNames`
|
|
10
|
+
*/
|
|
11
|
+
export declare const DEFAULT_SHEET_CLASSNAMES: {
|
|
12
|
+
readonly appear: "rmd-sheet--offscreen";
|
|
13
|
+
readonly appearActive: "rmd-sheet--enter rmd-sheet--visible";
|
|
14
|
+
readonly enter: "rmd-sheet--offscreen";
|
|
15
|
+
readonly enterActive: "rmd-sheet--enter rmd-sheet--visible";
|
|
16
|
+
readonly exit: "rmd-sheet--exit";
|
|
17
|
+
readonly exitActive: "rmd-sheet--offscreen";
|
|
18
|
+
readonly exitDone: "rmd-sheet--offscreen rmd-sheet--hidden";
|
|
19
|
+
};
|
|
16
20
|
/**
|
|
17
21
|
* The location that the sheet should be located within the viewport.
|
|
18
22
|
*/
|
package/dist/sheet/styles.js
CHANGED
|
@@ -1,10 +1,14 @@
|
|
|
1
1
|
import { cnb } from "cnbuilder";
|
|
2
2
|
import { bem } from "../utils/bem.js";
|
|
3
|
-
|
|
3
|
+
/**
|
|
4
|
+
* @since 6.0.0 Uses `as const satisfies TransitionTimeout`
|
|
5
|
+
*/ export const DEFAULT_SHEET_TIMEOUT = {
|
|
4
6
|
enter: 200,
|
|
5
7
|
exit: 150
|
|
6
8
|
};
|
|
7
|
-
|
|
9
|
+
/**
|
|
10
|
+
* @since 6.0.0 Uses `as const satisfies CSSTransitionClassNames`
|
|
11
|
+
*/ export const DEFAULT_SHEET_CLASSNAMES = {
|
|
8
12
|
appear: "rmd-sheet--offscreen",
|
|
9
13
|
appearActive: "rmd-sheet--enter rmd-sheet--visible",
|
|
10
14
|
enter: "rmd-sheet--offscreen",
|
package/dist/sheet/styles.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/sheet/styles.ts"],"sourcesContent":["import { cnb } from \"cnbuilder\";\n\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nimport { type BaseDialogProps } from \"../dialog/Dialog.js\";\nimport {\n type CSSTransitionClassNames,\n type TransitionTimeout,\n} from \"../transition/types.js\";\nimport { bem } from \"../utils/bem.js\";\n\
|
|
1
|
+
{"version":3,"sources":["../../src/sheet/styles.ts"],"sourcesContent":["import { cnb } from \"cnbuilder\";\n\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nimport { type BaseDialogProps } from \"../dialog/Dialog.js\";\nimport {\n type CSSTransitionClassNames,\n type TransitionTimeout,\n} from \"../transition/types.js\";\nimport { bem } from \"../utils/bem.js\";\n\n/**\n * @since 6.0.0 Uses `as const satisfies TransitionTimeout`\n */\nexport const DEFAULT_SHEET_TIMEOUT = {\n enter: 200,\n exit: 150,\n} as const satisfies TransitionTimeout;\n\n/**\n * @since 6.0.0 Uses `as const satisfies CSSTransitionClassNames`\n */\nexport const DEFAULT_SHEET_CLASSNAMES = {\n appear: \"rmd-sheet--offscreen\",\n appearActive: \"rmd-sheet--enter rmd-sheet--visible\",\n enter: \"rmd-sheet--offscreen\",\n enterActive: \"rmd-sheet--enter rmd-sheet--visible\",\n exit: \"rmd-sheet--exit\",\n exitActive: \"rmd-sheet--offscreen\",\n exitDone: \"rmd-sheet--offscreen rmd-sheet--hidden\",\n} as const satisfies CSSTransitionClassNames;\n\nconst styles = bem(\"rmd-sheet\");\n\n/**\n * The location that the sheet should be located within the viewport.\n */\nexport type SheetPosition = \"top\" | \"right\" | \"bottom\" | \"left\";\n\n/**\n * The size to use for sheets that have been positioned left or right. The\n * default supported values are:\n *\n * - `\"none\"` - the size is based on content, but is still limited to the\n * viewport width so that the horizontal scrolling will not occur within the\n * page. No limits added to sizing.\n * - `\"touch\"` - the `width` is set to be the entire viewport width minus a\n * touchable area and is normally recommended for mobile devices.\n * - `\"static\"` - the `width` is set to a static `16rem` and generally used for\n * landscape tablets and desktops.\n * - `\"media\"` - automatically switches between \"touch\" and \"static\" based on\n * css media queries. (this is the default)\n */\nexport type SheetHorizontalSize = \"none\" | \"media\" | \"touch\" | \"static\";\n\n/**\n * The size to use for sheets that have been positioned top or bottom. The\n * supported sizes are:\n *\n * - `\"none\"` - the size is based on content and is limited to the viewport\n * height\n * - `\"touch\"` - the size is based on content and is limited to the viewport\n * height minus a small touchable area\n * - `\"recommended\"` - the material design recommended sizing that forces a\n * `max-height` of 50vh and `min-height` of 3.5rem\n */\nexport type SheetVerticalSize = \"none\" | \"touch\" | \"recommended\";\n\n/** @since 6.0.0 */\nexport interface BaseSheetClassNameOptions {\n className?: string;\n\n /**\n * @defaultValue `\"left\"`\n */\n position?: SheetPosition;\n\n /**\n * @defaultValue `\"media\"`\n */\n horizontalSize?: SheetHorizontalSize;\n\n /**\n * @defaultValue `\"recommended\"`\n */\n verticalSize?: SheetVerticalSize;\n}\n\n/**\n * @since 6.0.0\n * @internal\n */\nexport interface SheetClassNameOptions extends BaseSheetClassNameOptions {\n /**\n * Set this to `true` if the sheet is rendered, but not visible.\n *\n * This isn't actually used since it is hard coded in {@link DEFAULT_SHEET_CLASSNAMES}.\n *\n * @defaultValue `false`\n */\n offscreen?: boolean;\n\n /**\n * Set this to `true` to disable the overlay behind the sheet and any\n * additional box-shadow that would be applied to the sheet.\n *\n * @see {@link BaseDialogProps.disableOverlay}\n * @defaultValue `false`\n */\n disableOverlay?: boolean;\n}\n\n/** @since 6.0.0 */\nexport function sheet(options: SheetClassNameOptions): string {\n const {\n position = \"left\",\n horizontalSize = \"media\",\n verticalSize = \"recommended\",\n offscreen = false,\n disableOverlay,\n className,\n } = options;\n const horizontal = position === \"left\" || position === \"right\";\n\n return cnb(\n styles({\n horizontal,\n vertical: !horizontal,\n raised: !disableOverlay,\n offscreen,\n [position]: true,\n \"media-width\": horizontal && horizontalSize === \"media\",\n \"touch-width\": horizontal && horizontalSize === \"touch\",\n \"static-width\": horizontal && horizontalSize === \"static\",\n \"viewport-height\": !horizontal && verticalSize === \"none\",\n \"touchable-height\": !horizontal && verticalSize === \"touch\",\n \"recommended-height\": !horizontal && verticalSize === \"recommended\",\n }),\n className\n );\n}\n"],"names":["cnb","bem","DEFAULT_SHEET_TIMEOUT","enter","exit","DEFAULT_SHEET_CLASSNAMES","appear","appearActive","enterActive","exitActive","exitDone","styles","sheet","options","position","horizontalSize","verticalSize","offscreen","disableOverlay","className","horizontal","vertical","raised"],"mappings":"AAAA,SAASA,GAAG,QAAQ,YAAY;AAQhC,SAASC,GAAG,QAAQ,kBAAkB;AAEtC;;CAEC,GACD,OAAO,MAAMC,wBAAwB;IACnCC,OAAO;IACPC,MAAM;AACR,EAAuC;AAEvC;;CAEC,GACD,OAAO,MAAMC,2BAA2B;IACtCC,QAAQ;IACRC,cAAc;IACdJ,OAAO;IACPK,aAAa;IACbJ,MAAM;IACNK,YAAY;IACZC,UAAU;AACZ,EAA6C;AAE7C,MAAMC,SAASV,IAAI;AAgFnB,iBAAiB,GACjB,OAAO,SAASW,MAAMC,OAA8B;IAClD,MAAM,EACJC,WAAW,MAAM,EACjBC,iBAAiB,OAAO,EACxBC,eAAe,aAAa,EAC5BC,YAAY,KAAK,EACjBC,cAAc,EACdC,SAAS,EACV,GAAGN;IACJ,MAAMO,aAAaN,aAAa,UAAUA,aAAa;IAEvD,OAAOd,IACLW,OAAO;QACLS;QACAC,UAAU,CAACD;QACXE,QAAQ,CAACJ;QACTD;QACA,CAACH,SAAS,EAAE;QACZ,eAAeM,cAAcL,mBAAmB;QAChD,eAAeK,cAAcL,mBAAmB;QAChD,gBAAgBK,cAAcL,mBAAmB;QACjD,mBAAmB,CAACK,cAAcJ,iBAAiB;QACnD,oBAAoB,CAACI,cAAcJ,iBAAiB;QACpD,sBAAsB,CAACI,cAAcJ,iBAAiB;IACxD,IACAG;AAEJ"}
|
|
@@ -29,6 +29,7 @@ export interface ToastRendererProps extends ConfigurableToastProps, ToastMeta {
|
|
|
29
29
|
* - always renders the {@link ToastRendererProps.toastDefaults}'s `children`
|
|
30
30
|
* 'after the optional toast's `children`
|
|
31
31
|
*
|
|
32
|
+
* @see {@link https://next.react-md.dev/components/snackbar | Snackbar Demos}
|
|
32
33
|
* @since 6.0.0
|
|
33
34
|
*/
|
|
34
35
|
export declare function DefaultToastRenderer(props: ToastRendererProps): ReactElement;
|
|
@@ -25,6 +25,7 @@ const noop = ()=>{
|
|
|
25
25
|
* - always renders the {@link ToastRendererProps.toastDefaults}'s `children`
|
|
26
26
|
* 'after the optional toast's `children`
|
|
27
27
|
*
|
|
28
|
+
* @see {@link https://next.react-md.dev/components/snackbar | Snackbar Demos}
|
|
28
29
|
* @since 6.0.0
|
|
29
30
|
*/ export function DefaultToastRenderer(props) {
|
|
30
31
|
const { toastId, paused, visible, priority: _priority, duplicates: _duplicates, visibleTime, onExited = noop, onEntered = noop, onMouseEnter = noop, onMouseLeave = noop, toastDefaults = {}, ...remaining } = props;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/snackbar/DefaultToastRenderer.tsx"],"sourcesContent":["\"use client\";\n\nimport { type ReactElement, useEffect, useMemo } from \"react\";\n\nimport { usePageInactive } from \"../usePageInactive.js\";\nimport { type ConfigurableToastProps, Toast } from \"./Toast.js\";\nimport { type ToastMeta } from \"./ToastManager.js\";\nimport { useToastManager } from \"./ToastManagerProvider.js\";\nimport {\n type CurrentToastActions,\n CurrentToastActionsProvider,\n} from \"./useCurrentToastActions.js\";\n\nconst noop = (): void => {\n // do nothing\n};\n\n/**\n * @since 6.0.0\n */\nexport interface ToastRendererProps extends ConfigurableToastProps, ToastMeta {\n /**\n * Optional props that should be passed to each `Toast` from the `Snackbar`.\n * This is a great way to enforce each toast having a close button, a custom\n * class name, theme, etc.\n */\n toastDefaults?: ConfigurableToastProps;\n}\n\n/**\n * **Client Component**\n *\n * This is the default implementation for rendering toasts that will:\n *\n * - controls the visibility of the toast with the {@link useToast} hook\n * - add a `closeButton` if the {@link ToastRendererProps.toastDefaults} has\n * `closeButton === true` or the `closeButtonProps` exists.\n * - add a `closeButton` if the `visibleTime` is `null` and the current toast\n * does not have an `action` or `actionButton`\n * - ensures both the toast's `onEntered` and the {@link ToastRendererProps.toastDefaults}'s\n * `onEntered` are called\n * - ensures both the toast's `onExited` and the {@link ToastRendererProps.toastDefaults}'s\n * `onExited` are called\n * - always renders the {@link ToastRendererProps.toastDefaults}'s `children`\n * 'after the optional toast's `children`\n *\n * @since 6.0.0\n */\nexport function DefaultToastRenderer(props: ToastRendererProps): ReactElement {\n const {\n toastId,\n paused,\n visible,\n priority: _priority,\n duplicates: _duplicates,\n visibleTime,\n onExited = noop,\n onEntered = noop,\n onMouseEnter = noop,\n onMouseLeave = noop,\n toastDefaults = {},\n ...remaining\n } = props;\n const {\n closeButtonProps,\n closeButton = !!closeButtonProps || !!remaining.closeButtonProps,\n onEntered: defaultEntered = noop,\n onExited: defaultExited = noop,\n onMouseEnter: defaultMouseEnter = noop,\n onMouseLeave: defaultMouseLeave = noop,\n ...defaults\n } = toastDefaults;\n\n const toastManager = useToastManager();\n const currentToastActions = useMemo<CurrentToastActions>(\n () => ({\n clearTimer() {\n toastManager.clearTimer(toastId);\n },\n removeToast(transition) {\n toastManager.removeToast(toastId, transition);\n },\n startRemoveTimeout() {\n toastManager.startRemoveTimeout(toastId);\n },\n pauseRemoveTimeout() {\n toastManager.pauseRemoveTimeout(toastId);\n },\n resumeRemoveTimeout() {\n toastManager.resumeRemoveTimeout(toastId);\n },\n }),\n [toastId, toastManager]\n );\n useEffect(() => {\n return () => {\n currentToastActions.clearTimer();\n };\n }, [currentToastActions]);\n usePageInactive({\n disabled: !visible,\n onChange(active) {\n if (active) {\n currentToastActions.resumeRemoveTimeout();\n } else {\n currentToastActions.pauseRemoveTimeout();\n }\n },\n });\n\n return (\n <CurrentToastActionsProvider value={currentToastActions}>\n <Toast\n closeButton={\n closeButton ||\n (!visibleTime && !remaining.action && !remaining.actionButton)\n }\n closeButtonProps={closeButtonProps}\n {...defaults}\n {...remaining}\n paused={paused}\n visible={visible}\n onEntered={(appearing) => {\n defaultEntered(appearing);\n onEntered(appearing);\n currentToastActions.startRemoveTimeout();\n }}\n onExited={() => {\n defaultExited();\n onExited();\n currentToastActions.removeToast(false);\n }}\n onMouseEnter={(event) => {\n defaultMouseEnter(event);\n onMouseEnter(event);\n currentToastActions.pauseRemoveTimeout();\n }}\n onMouseLeave={(event) => {\n defaultMouseLeave(event);\n onMouseLeave(event);\n currentToastActions.resumeRemoveTimeout();\n }}\n >\n {defaults.children}\n {remaining.children}\n </Toast>\n </CurrentToastActionsProvider>\n );\n}\n"],"names":["useEffect","useMemo","usePageInactive","Toast","useToastManager","CurrentToastActionsProvider","noop","DefaultToastRenderer","props","toastId","paused","visible","priority","_priority","duplicates","_duplicates","visibleTime","onExited","onEntered","onMouseEnter","onMouseLeave","toastDefaults","remaining","closeButtonProps","closeButton","defaultEntered","defaultExited","defaultMouseEnter","defaultMouseLeave","defaults","toastManager","currentToastActions","clearTimer","removeToast","transition","startRemoveTimeout","pauseRemoveTimeout","resumeRemoveTimeout","disabled","onChange","active","value","action","actionButton","appearing","event","children"],"mappings":"AAAA;;AAEA,SAA4BA,SAAS,EAAEC,OAAO,QAAQ,QAAQ;AAE9D,SAASC,eAAe,QAAQ,wBAAwB;AACxD,SAAsCC,KAAK,QAAQ,aAAa;AAEhE,SAASC,eAAe,QAAQ,4BAA4B;AAC5D,SAEEC,2BAA2B,QACtB,8BAA8B;AAErC,MAAMC,OAAO;AACX,aAAa;AACf;AAcA
|
|
1
|
+
{"version":3,"sources":["../../src/snackbar/DefaultToastRenderer.tsx"],"sourcesContent":["\"use client\";\n\nimport { type ReactElement, useEffect, useMemo } from \"react\";\n\nimport { usePageInactive } from \"../usePageInactive.js\";\nimport { type ConfigurableToastProps, Toast } from \"./Toast.js\";\nimport { type ToastMeta } from \"./ToastManager.js\";\nimport { useToastManager } from \"./ToastManagerProvider.js\";\nimport {\n type CurrentToastActions,\n CurrentToastActionsProvider,\n} from \"./useCurrentToastActions.js\";\n\nconst noop = (): void => {\n // do nothing\n};\n\n/**\n * @since 6.0.0\n */\nexport interface ToastRendererProps extends ConfigurableToastProps, ToastMeta {\n /**\n * Optional props that should be passed to each `Toast` from the `Snackbar`.\n * This is a great way to enforce each toast having a close button, a custom\n * class name, theme, etc.\n */\n toastDefaults?: ConfigurableToastProps;\n}\n\n/**\n * **Client Component**\n *\n * This is the default implementation for rendering toasts that will:\n *\n * - controls the visibility of the toast with the {@link useToast} hook\n * - add a `closeButton` if the {@link ToastRendererProps.toastDefaults} has\n * `closeButton === true` or the `closeButtonProps` exists.\n * - add a `closeButton` if the `visibleTime` is `null` and the current toast\n * does not have an `action` or `actionButton`\n * - ensures both the toast's `onEntered` and the {@link ToastRendererProps.toastDefaults}'s\n * `onEntered` are called\n * - ensures both the toast's `onExited` and the {@link ToastRendererProps.toastDefaults}'s\n * `onExited` are called\n * - always renders the {@link ToastRendererProps.toastDefaults}'s `children`\n * 'after the optional toast's `children`\n *\n * @see {@link https://next.react-md.dev/components/snackbar | Snackbar Demos}\n * @since 6.0.0\n */\nexport function DefaultToastRenderer(props: ToastRendererProps): ReactElement {\n const {\n toastId,\n paused,\n visible,\n priority: _priority,\n duplicates: _duplicates,\n visibleTime,\n onExited = noop,\n onEntered = noop,\n onMouseEnter = noop,\n onMouseLeave = noop,\n toastDefaults = {},\n ...remaining\n } = props;\n const {\n closeButtonProps,\n closeButton = !!closeButtonProps || !!remaining.closeButtonProps,\n onEntered: defaultEntered = noop,\n onExited: defaultExited = noop,\n onMouseEnter: defaultMouseEnter = noop,\n onMouseLeave: defaultMouseLeave = noop,\n ...defaults\n } = toastDefaults;\n\n const toastManager = useToastManager();\n const currentToastActions = useMemo<CurrentToastActions>(\n () => ({\n clearTimer() {\n toastManager.clearTimer(toastId);\n },\n removeToast(transition) {\n toastManager.removeToast(toastId, transition);\n },\n startRemoveTimeout() {\n toastManager.startRemoveTimeout(toastId);\n },\n pauseRemoveTimeout() {\n toastManager.pauseRemoveTimeout(toastId);\n },\n resumeRemoveTimeout() {\n toastManager.resumeRemoveTimeout(toastId);\n },\n }),\n [toastId, toastManager]\n );\n useEffect(() => {\n return () => {\n currentToastActions.clearTimer();\n };\n }, [currentToastActions]);\n usePageInactive({\n disabled: !visible,\n onChange(active) {\n if (active) {\n currentToastActions.resumeRemoveTimeout();\n } else {\n currentToastActions.pauseRemoveTimeout();\n }\n },\n });\n\n return (\n <CurrentToastActionsProvider value={currentToastActions}>\n <Toast\n closeButton={\n closeButton ||\n (!visibleTime && !remaining.action && !remaining.actionButton)\n }\n closeButtonProps={closeButtonProps}\n {...defaults}\n {...remaining}\n paused={paused}\n visible={visible}\n onEntered={(appearing) => {\n defaultEntered(appearing);\n onEntered(appearing);\n currentToastActions.startRemoveTimeout();\n }}\n onExited={() => {\n defaultExited();\n onExited();\n currentToastActions.removeToast(false);\n }}\n onMouseEnter={(event) => {\n defaultMouseEnter(event);\n onMouseEnter(event);\n currentToastActions.pauseRemoveTimeout();\n }}\n onMouseLeave={(event) => {\n defaultMouseLeave(event);\n onMouseLeave(event);\n currentToastActions.resumeRemoveTimeout();\n }}\n >\n {defaults.children}\n {remaining.children}\n </Toast>\n </CurrentToastActionsProvider>\n );\n}\n"],"names":["useEffect","useMemo","usePageInactive","Toast","useToastManager","CurrentToastActionsProvider","noop","DefaultToastRenderer","props","toastId","paused","visible","priority","_priority","duplicates","_duplicates","visibleTime","onExited","onEntered","onMouseEnter","onMouseLeave","toastDefaults","remaining","closeButtonProps","closeButton","defaultEntered","defaultExited","defaultMouseEnter","defaultMouseLeave","defaults","toastManager","currentToastActions","clearTimer","removeToast","transition","startRemoveTimeout","pauseRemoveTimeout","resumeRemoveTimeout","disabled","onChange","active","value","action","actionButton","appearing","event","children"],"mappings":"AAAA;;AAEA,SAA4BA,SAAS,EAAEC,OAAO,QAAQ,QAAQ;AAE9D,SAASC,eAAe,QAAQ,wBAAwB;AACxD,SAAsCC,KAAK,QAAQ,aAAa;AAEhE,SAASC,eAAe,QAAQ,4BAA4B;AAC5D,SAEEC,2BAA2B,QACtB,8BAA8B;AAErC,MAAMC,OAAO;AACX,aAAa;AACf;AAcA;;;;;;;;;;;;;;;;;;;CAmBC,GACD,OAAO,SAASC,qBAAqBC,KAAyB;IAC5D,MAAM,EACJC,OAAO,EACPC,MAAM,EACNC,OAAO,EACPC,UAAUC,SAAS,EACnBC,YAAYC,WAAW,EACvBC,WAAW,EACXC,WAAWX,IAAI,EACfY,YAAYZ,IAAI,EAChBa,eAAeb,IAAI,EACnBc,eAAed,IAAI,EACnBe,gBAAgB,CAAC,CAAC,EAClB,GAAGC,WACJ,GAAGd;IACJ,MAAM,EACJe,gBAAgB,EAChBC,cAAc,CAAC,CAACD,oBAAoB,CAAC,CAACD,UAAUC,gBAAgB,EAChEL,WAAWO,iBAAiBnB,IAAI,EAChCW,UAAUS,gBAAgBpB,IAAI,EAC9Ba,cAAcQ,oBAAoBrB,IAAI,EACtCc,cAAcQ,oBAAoBtB,IAAI,EACtC,GAAGuB,UACJ,GAAGR;IAEJ,MAAMS,eAAe1B;IACrB,MAAM2B,sBAAsB9B,QAC1B,IAAO,CAAA;YACL+B;gBACEF,aAAaE,UAAU,CAACvB;YAC1B;YACAwB,aAAYC,UAAU;gBACpBJ,aAAaG,WAAW,CAACxB,SAASyB;YACpC;YACAC;gBACEL,aAAaK,kBAAkB,CAAC1B;YAClC;YACA2B;gBACEN,aAAaM,kBAAkB,CAAC3B;YAClC;YACA4B;gBACEP,aAAaO,mBAAmB,CAAC5B;YACnC;QACF,CAAA,GACA;QAACA;QAASqB;KAAa;IAEzB9B,UAAU;QACR,OAAO;YACL+B,oBAAoBC,UAAU;QAChC;IACF,GAAG;QAACD;KAAoB;IACxB7B,gBAAgB;QACdoC,UAAU,CAAC3B;QACX4B,UAASC,MAAM;YACb,IAAIA,QAAQ;gBACVT,oBAAoBM,mBAAmB;YACzC,OAAO;gBACLN,oBAAoBK,kBAAkB;YACxC;QACF;IACF;IAEA,qBACE,KAAC/B;QAA4BoC,OAAOV;kBAClC,cAAA,MAAC5B;YACCqB,aACEA,eACC,CAACR,eAAe,CAACM,UAAUoB,MAAM,IAAI,CAACpB,UAAUqB,YAAY;YAE/DpB,kBAAkBA;YACjB,GAAGM,QAAQ;YACX,GAAGP,SAAS;YACbZ,QAAQA;YACRC,SAASA;YACTO,WAAW,CAAC0B;gBACVnB,eAAemB;gBACf1B,UAAU0B;gBACVb,oBAAoBI,kBAAkB;YACxC;YACAlB,UAAU;gBACRS;gBACAT;gBACAc,oBAAoBE,WAAW,CAAC;YAClC;YACAd,cAAc,CAAC0B;gBACblB,kBAAkBkB;gBAClB1B,aAAa0B;gBACbd,oBAAoBK,kBAAkB;YACxC;YACAhB,cAAc,CAACyB;gBACbjB,kBAAkBiB;gBAClBzB,aAAayB;gBACbd,oBAAoBM,mBAAmB;YACzC;;gBAECR,SAASiB,QAAQ;gBACjBxB,UAAUwB,QAAQ;;;;AAI3B"}
|
|
@@ -33,14 +33,12 @@ export interface SnackbarProps extends HTMLAttributes<HTMLDivElement> {
|
|
|
33
33
|
*
|
|
34
34
|
* @example
|
|
35
35
|
* ```ts
|
|
36
|
-
* import
|
|
37
|
-
* import {
|
|
38
|
-
*
|
|
39
|
-
*
|
|
40
|
-
*
|
|
41
|
-
*
|
|
42
|
-
* } from "@react-md/core";
|
|
43
|
-
* import type { ReactElement } from "react";
|
|
36
|
+
* import { Snackbar } from "@react-md/core/snackbar/Snackbar";
|
|
37
|
+
* import { Toast } from "@react-md/core/snackbar/Toast";
|
|
38
|
+
* import { ToastContent } from "@react-md/core/snackbar/ToastContent";
|
|
39
|
+
* import { type ToastRendererProps } from "@react-md/core/snackbar/DefaultToastRenderer";
|
|
40
|
+
* import { useToastManager } from "@react-md/core/snackbar/ToastManagerProvider";
|
|
41
|
+
* import { type ReactElement } from "react";
|
|
44
42
|
*
|
|
45
43
|
* function CustomToast(props: CustomToastRendererProps): ReactElement {
|
|
46
44
|
* // Pretend like we don't need anything else from the toast since the
|
|
@@ -105,7 +103,9 @@ export interface SnackbarProps extends HTMLAttributes<HTMLDivElement> {
|
|
|
105
103
|
*
|
|
106
104
|
* @example Super Simple Example
|
|
107
105
|
* ```tsx
|
|
108
|
-
* import { Button
|
|
106
|
+
* import { Button } from "@react-md/core/button/Button";
|
|
107
|
+
* import { Snackbar } from "@react-md/core/snackbar/Snackbar";
|
|
108
|
+
* import { addToast } from "@react-md/core/snackbar/ToastManager";
|
|
109
109
|
* import type { ReactElement } from "react";
|
|
110
110
|
*
|
|
111
111
|
* function Example(): ReactElement {
|
|
@@ -124,6 +124,7 @@ export interface SnackbarProps extends HTMLAttributes<HTMLDivElement> {
|
|
|
124
124
|
* }
|
|
125
125
|
* ```
|
|
126
126
|
*
|
|
127
|
+
* @see {@link https://next.react-md.dev/components/snackbar | Snackbar Demos}
|
|
127
128
|
* @see {@link SnackbarProps.renderToast} for creating a custom toast
|
|
128
129
|
* implementation.
|
|
129
130
|
* @since 6.0.0 Rewritten to use a new API that supports adding toasts
|
|
@@ -12,7 +12,9 @@ import { snackbar } from "./snackbarStyles.js";
|
|
|
12
12
|
*
|
|
13
13
|
* @example Super Simple Example
|
|
14
14
|
* ```tsx
|
|
15
|
-
* import { Button
|
|
15
|
+
* import { Button } from "@react-md/core/button/Button";
|
|
16
|
+
* import { Snackbar } from "@react-md/core/snackbar/Snackbar";
|
|
17
|
+
* import { addToast } from "@react-md/core/snackbar/ToastManager";
|
|
16
18
|
* import type { ReactElement } from "react";
|
|
17
19
|
*
|
|
18
20
|
* function Example(): ReactElement {
|
|
@@ -31,6 +33,7 @@ import { snackbar } from "./snackbarStyles.js";
|
|
|
31
33
|
* }
|
|
32
34
|
* ```
|
|
33
35
|
*
|
|
36
|
+
* @see {@link https://next.react-md.dev/components/snackbar | Snackbar Demos}
|
|
34
37
|
* @see {@link SnackbarProps.renderToast} for creating a custom toast
|
|
35
38
|
* implementation.
|
|
36
39
|
* @since 6.0.0 Rewritten to use a new API that supports adding toasts
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/snackbar/Snackbar.tsx"],"sourcesContent":["\"use client\";\n\nimport { type ComponentType, type HTMLAttributes, forwardRef } from \"react\";\n\nimport { Portal } from \"../portal/Portal.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\nimport {\n DefaultToastRenderer,\n type ToastRendererProps,\n} from \"./DefaultToastRenderer.js\";\nimport { type ConfigurableToastProps } from \"./Toast.js\";\nimport { useToastQueue } from \"./ToastManagerProvider.js\";\nimport { type SnackbarPosition, snackbar } from \"./snackbarStyles.js\";\n\n/**\n * @since 6.0.0 The `id` prop is optional\n */\nexport interface SnackbarProps extends HTMLAttributes<HTMLDivElement> {\n /** @defaultValue `\"snackbar-\" + useId()` */\n id?: string;\n\n /**\n * Set this to the number of toasts that can be visible within the snackbar at\n * the same time. Any toasts added after this value will be added into the\n * queue to be shown.\n *\n * @defaultValue `1`\n */\n limit?: number;\n\n /**\n * Set this to `true` if the snackbar should use absolute positioning so it\n * can be fixed within a `position: relative` container instead of the entire\n * viewport.\n *\n * @defaultValue `false`\n */\n absolute?: boolean;\n\n /** @defaultValue `\"bottom\"` */\n position?: SnackbarPosition;\n\n /** @defaultValue `false` */\n disablePortal?: boolean;\n\n /**\n * This can be used to create a custom toast implementation.\n *\n * @example\n * ```ts\n * import
|
|
1
|
+
{"version":3,"sources":["../../src/snackbar/Snackbar.tsx"],"sourcesContent":["\"use client\";\n\nimport { type ComponentType, type HTMLAttributes, forwardRef } from \"react\";\n\nimport { Portal } from \"../portal/Portal.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\nimport {\n DefaultToastRenderer,\n type ToastRendererProps,\n} from \"./DefaultToastRenderer.js\";\nimport { type ConfigurableToastProps } from \"./Toast.js\";\nimport { useToastQueue } from \"./ToastManagerProvider.js\";\nimport { type SnackbarPosition, snackbar } from \"./snackbarStyles.js\";\n\n/**\n * @since 6.0.0 The `id` prop is optional\n */\nexport interface SnackbarProps extends HTMLAttributes<HTMLDivElement> {\n /** @defaultValue `\"snackbar-\" + useId()` */\n id?: string;\n\n /**\n * Set this to the number of toasts that can be visible within the snackbar at\n * the same time. Any toasts added after this value will be added into the\n * queue to be shown.\n *\n * @defaultValue `1`\n */\n limit?: number;\n\n /**\n * Set this to `true` if the snackbar should use absolute positioning so it\n * can be fixed within a `position: relative` container instead of the entire\n * viewport.\n *\n * @defaultValue `false`\n */\n absolute?: boolean;\n\n /** @defaultValue `\"bottom\"` */\n position?: SnackbarPosition;\n\n /** @defaultValue `false` */\n disablePortal?: boolean;\n\n /**\n * This can be used to create a custom toast implementation.\n *\n * @example\n * ```ts\n * import { Snackbar } from \"@react-md/core/snackbar/Snackbar\";\n * import { Toast } from \"@react-md/core/snackbar/Toast\";\n * import { ToastContent } from \"@react-md/core/snackbar/ToastContent\";\n * import { type ToastRendererProps } from \"@react-md/core/snackbar/DefaultToastRenderer\";\n * import { useToastManager } from \"@react-md/core/snackbar/ToastManagerProvider\";\n * import { type ReactElement } from \"react\";\n *\n * function CustomToast(props: CustomToastRendererProps): ReactElement {\n * // Pretend like we don't need anything else from the toast since the\n * // custom behavior is related to the `toastId`\n * const { toastId, visible, duplicates, visibleTime } = props;\n *\n * const toastManager = useToastManager();\n *\n * // Note: If you want to rely on the `action` and `closeButton` behavior,\n * // you must also wrap the `Toast` with:\n * // <RemoveToastProvider value={() => toastManager.removeToast(toastId, true)}>\n *\n * return (\n * <Toast\n * theme={isError(toastId) ? \"error\" : \"surface\"}\n * visible={visible}\n * onEntered={() => {\n * toastManager.startRemoveTimeout(toastId);\n * }}\n * onExited={() => {\n * toastManager.removeToast(toastId, false)\n * }}\n * disableContentWrapper\n * >\n * <ToastContent>\n * <TranslateMessage id={toastId} />\n * </ToastContent>\n * {isActionable(toastId) && (\n * <Button\n * onClick={async () => {\n * await someApiCall();\n * toastManager.removeToast(toastId, true);\n * }}\n * >\n * Dismiss\n * </Button>\n * )}\n * </Toast>\n * );\n * }\n *\n * function Example(): ReactElement {\n * return <Snackbar renderToast={CustomToast} />\n * }\n * ```\n *\n * @see {@link DefaultToastRenderer}\n * @defaultValue `DefaultToastRenderer`\n */\n renderToast?: ComponentType<ToastRendererProps>;\n\n /**\n * Optional props that should be passed to each `Toast` from the `Snackbar`.\n * This is a great way to enforce each toast having a close button, a custom\n * class name, theme, etc.\n *\n * @see {@link DefaultToastRenderer}\n */\n toastDefaults?: ConfigurableToastProps;\n}\n\n/**\n * **Client Component**\n *\n * @example Super Simple Example\n * ```tsx\n * import { Button } from \"@react-md/core/button/Button\";\n * import { Snackbar } from \"@react-md/core/snackbar/Snackbar\";\n * import { addToast } from \"@react-md/core/snackbar/ToastManager\";\n * import type { ReactElement } from \"react\";\n *\n * function Example(): ReactElement {\n * return (\n * <>\n * <Button\n * onClick={() => {\n * addToast({ children: \"A new toast!\" });\n * }}\n * >\n * Toast!\n * </Button>\n * <Snackbar />\n * </>\n * );\n * }\n * ```\n *\n * @see {@link https://next.react-md.dev/components/snackbar | Snackbar Demos}\n * @see {@link SnackbarProps.renderToast} for creating a custom toast\n * implementation.\n * @since 6.0.0 Rewritten to use a new API that supports adding toasts\n * outside of React components and rendering multiple toasts at once.\n */\nexport const Snackbar = forwardRef<HTMLDivElement, SnackbarProps>(\n function Snackbar(props, ref) {\n const {\n id: propId,\n className,\n limit = 1,\n absolute,\n position = \"bottom\",\n renderToast: RenderToast = DefaultToastRenderer,\n disablePortal,\n toastDefaults,\n ...remaining\n } = props;\n const id = useEnsuredId(propId, \"snackbar\");\n const queue = useToastQueue(limit);\n\n return (\n <Portal disabled={disablePortal}>\n {queue.length > 0 && (\n <div\n {...remaining}\n id={id}\n ref={ref}\n className={snackbar({ absolute, position, className })}\n >\n {queue.map((toast) => (\n <RenderToast\n {...toast}\n key={toast.toastId}\n toastDefaults={toastDefaults}\n />\n ))}\n </div>\n )}\n </Portal>\n );\n }\n);\n"],"names":["forwardRef","Portal","useEnsuredId","DefaultToastRenderer","useToastQueue","snackbar","Snackbar","props","ref","id","propId","className","limit","absolute","position","renderToast","RenderToast","disablePortal","toastDefaults","remaining","queue","disabled","length","div","map","toast","key","toastId"],"mappings":"AAAA;;;AAEA,SAAkDA,UAAU,QAAQ,QAAQ;AAE5E,SAASC,MAAM,QAAQ,sBAAsB;AAC7C,SAASC,YAAY,QAAQ,qBAAqB;AAClD,SACEC,oBAAoB,QAEf,4BAA4B;AAEnC,SAASC,aAAa,QAAQ,4BAA4B;AAC1D,SAAgCC,QAAQ,QAAQ,sBAAsB;AAyGtE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA+BC,GACD,OAAO,MAAMC,yBAAWN,WACtB,SAASM,SAASC,KAAK,EAAEC,GAAG;IAC1B,MAAM,EACJC,IAAIC,MAAM,EACVC,SAAS,EACTC,QAAQ,CAAC,EACTC,QAAQ,EACRC,WAAW,QAAQ,EACnBC,aAAaC,cAAcb,oBAAoB,EAC/Cc,aAAa,EACbC,aAAa,EACb,GAAGC,WACJ,GAAGZ;IACJ,MAAME,KAAKP,aAAaQ,QAAQ;IAChC,MAAMU,QAAQhB,cAAcQ;IAE5B,qBACE,KAACX;QAAOoB,UAAUJ;kBACfG,MAAME,MAAM,GAAG,mBACd,KAACC;YACE,GAAGJ,SAAS;YACbV,IAAIA;YACJD,KAAKA;YACLG,WAAWN,SAAS;gBAAEQ;gBAAUC;gBAAUH;YAAU;sBAEnDS,MAAMI,GAAG,CAAC,CAACC,sBACV,eAACT;oBACE,GAAGS,KAAK;oBACTC,KAAKD,MAAME,OAAO;oBAClBT,eAAeA;;;;AAO7B,GACA"}
|
package/dist/snackbar/Toast.d.ts
CHANGED
|
@@ -4,6 +4,13 @@ import { type BackgroundColor } from "../cssUtils.js";
|
|
|
4
4
|
import { type CSSTransitionClassNames, type TransitionCallbacks, type TransitionTimeout } from "../transition/types.js";
|
|
5
5
|
import { type PropsWithRef } from "../types.js";
|
|
6
6
|
import { type ToastContentProps } from "./ToastContent.js";
|
|
7
|
+
declare module "react" {
|
|
8
|
+
interface CSSProperties {
|
|
9
|
+
"--rmd-toast-color"?: string;
|
|
10
|
+
"--rmd-toast-background-color"?: string;
|
|
11
|
+
"--rmd-toast-offset"?: string | number;
|
|
12
|
+
}
|
|
13
|
+
}
|
|
7
14
|
/**
|
|
8
15
|
* @since 6.0.0
|
|
9
16
|
*/
|
|
@@ -100,6 +107,7 @@ export interface ToastProps extends ConfigurableToastProps {
|
|
|
100
107
|
* This component is just used for toast styling and does not implement any of
|
|
101
108
|
* the visibility behavior.
|
|
102
109
|
*
|
|
110
|
+
* @see {@link https://next.react-md.dev/components/snackbar | Snackbar Demos}
|
|
103
111
|
* @since 6.0.0
|
|
104
112
|
*/
|
|
105
113
|
export declare const Toast: import("react").ForwardRefExoticComponent<ToastProps & import("react").RefAttributes<HTMLDivElement>>;
|
package/dist/snackbar/Toast.js
CHANGED
|
@@ -13,6 +13,7 @@ import { toast } from "./toastStyles.js";
|
|
|
13
13
|
* This component is just used for toast styling and does not implement any of
|
|
14
14
|
* the visibility behavior.
|
|
15
15
|
*
|
|
16
|
+
* @see {@link https://next.react-md.dev/components/snackbar | Snackbar Demos}
|
|
16
17
|
* @since 6.0.0
|
|
17
18
|
*/ export const Toast = /*#__PURE__*/ forwardRef(function Toast(props, ref) {
|
|
18
19
|
const { id: propId, className, timeout, classNames, theme = "surface", action: propAction, actionButton: propActionButton, paused, visible, closeIcon: propCloseIcon, closeButtonProps, closeButton = !!closeButtonProps, contentProps, disableToastContent, stacked, multiline, onEnter, onEntering, onEntered, onExit, onExiting, onExited, children, ...remaining } = props;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/snackbar/Toast.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n type AriaRole,\n type HTMLAttributes,\n type ReactElement,\n type ReactNode,\n forwardRef,\n isValidElement,\n} from \"react\";\n\nimport { type ButtonProps } from \"../button/Button.js\";\nimport { type BackgroundColor } from \"../cssUtils.js\";\nimport {\n type CSSTransitionClassNames,\n type TransitionCallbacks,\n type TransitionTimeout,\n} from \"../transition/types.js\";\nimport { useScaleTransition } from \"../transition/useScaleTransition.js\";\nimport { type PropsWithRef } from \"../types.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\nimport { ToastActionButton } from \"./ToastActionButton.js\";\nimport { ToastCloseButton } from \"./ToastCloseButton.js\";\nimport { ToastContent, type ToastContentProps } from \"./ToastContent.js\";\nimport { toast } from \"./toastStyles.js\";\n\n/**\n * @since 6.0.0\n */\nexport interface ConfigurableToastProps\n extends HTMLAttributes<HTMLDivElement>,\n TransitionCallbacks {\n /**\n * Note: this default value will only be generated in the `Toast` component.\n *\n * @defaultValue `\"toast-\" + useId()`\n */\n id?: string;\n\n /**\n * Note: This is set while creating the toast.\n *\n * @defaultValue `visibleTime === null ? \"alert\" : \"status\"`\n */\n role?: AriaRole;\n\n /**\n * @defaultValue `\"surface\"`\n */\n theme?: BackgroundColor;\n\n /**\n * Set this to `true` to stack the content above the {@link action}. It is not\n * recommended to enable this prop if the {@link closeButton} is enabled.\n *\n * @defaultValue `false`\n */\n stacked?: boolean;\n\n /**\n * If this is not provided, a `ResizeObserver` will be used to determine if\n * there are multiple lines of content.\n */\n multiline?: boolean;\n\n /**\n * When this is a string or React element, it will be rendered as the\n * `children` within a `Button`\n */\n action?: ButtonProps | ReactElement | string;\n\n /**\n * This can be used to replace the custom action button behavior.\n */\n actionButton?: ReactNode;\n\n /**\n * @defaultValue `getIcon(\"close\")`\n */\n closeIcon?: ReactNode;\n\n /**\n * Set this to `true` if a close button should be rendered to the right of the\n * `children`.\n *\n * @defaultValue `!!closeButtonProps`\n */\n closeButton?: boolean;\n\n /**\n * Use this prop to override most of the close button behavior. The\n */\n closeButtonProps?: ButtonProps;\n\n /**\n * Any additional props that should be provided to the `<div>` that surrounds\n * the toast `children`.\n */\n contentProps?: PropsWithRef<ToastContentProps, HTMLDivElement>;\n\n /**\n * Set this to `true` if the `children` for the toast should no longer be\n * wrapped in an additional `<div>` that applies some toast layout styles.\n * This should normally only be used for custom `Toast` implementations.\n *\n * @see the `Snackbar`'s `renderToast` prop for an example.\n */\n disableToastContent?: boolean;\n\n /**\n * The toast's transition timeout for entering and exiting. This is **not**\n * how long the toast should remain visible.\n *\n * @defaultValue `SCALE_TIMEOUT`\n */\n timeout?: TransitionTimeout;\n\n /**\n * The toast's transition class names for entering and exiting.\n *\n * @defaultValue `SCALE_CLASSNAMES`\n */\n classNames?: CSSTransitionClassNames;\n}\n\n/**\n * @since 6.0.0\n */\nexport interface ToastProps extends ConfigurableToastProps {\n paused?: boolean;\n visible: boolean;\n}\n\n/**\n * **Client Component**\n *\n * This component is just used for toast styling and does not implement any of\n * the visibility behavior.\n *\n * @since 6.0.0\n */\nexport const Toast = forwardRef<HTMLDivElement, ToastProps>(\n function Toast(props, ref) {\n const {\n id: propId,\n className,\n timeout,\n classNames,\n theme = \"surface\",\n action: propAction,\n actionButton: propActionButton,\n paused,\n visible,\n closeIcon: propCloseIcon,\n closeButtonProps,\n closeButton = !!closeButtonProps,\n contentProps,\n disableToastContent,\n stacked,\n multiline,\n onEnter,\n onEntering,\n onEntered,\n onExit,\n onExiting,\n onExited,\n children,\n ...remaining\n } = props;\n const id = useEnsuredId(propId, \"toast\");\n\n let actionButton = propActionButton;\n if (propAction) {\n let overrides: ButtonProps = {};\n let buttonChildren: ReactNode;\n // have to use `any` to correctly filter out all react elements\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n if (isValidElement<any>(propAction) || typeof propAction !== \"object\") {\n buttonChildren = propAction;\n } else {\n ({ children: buttonChildren, ...overrides } = propAction);\n }\n\n actionButton = (\n <ToastActionButton\n theme={theme === \"surface\" ? \"secondary\" : \"clear\"}\n reordered={stacked && closeButton}\n {...overrides}\n >\n {buttonChildren}\n </ToastActionButton>\n );\n }\n\n let closeIcon = propCloseIcon;\n if (typeof closeButtonProps?.children !== \"undefined\") {\n closeIcon = closeButtonProps.children;\n }\n\n const action = !!actionButton;\n const reordered = stacked && action && closeButton;\n const { elementProps, rendered } = useScaleTransition({\n appear: true,\n nodeRef: ref,\n className: toast({\n className,\n theme,\n action,\n paused,\n stacked,\n reordered,\n closeButton,\n }),\n timeout,\n classNames,\n onEnter,\n onEntering,\n onEntered,\n onExit,\n onExiting,\n onExited,\n temporary: true,\n transitionIn: visible,\n exitedHidden: true,\n });\n\n // this might get rid of the weird popping-back-in for a split second\n // that sometimes happens on mobile firefox\n if (!rendered) {\n return null;\n }\n\n return (\n <div {...remaining} {...elementProps} id={id}>\n <ToastContent\n action={action}\n stacked={stacked}\n multiline={multiline}\n closeButton={closeButton}\n disableWrapper={disableToastContent}\n {...contentProps}\n >\n {children}\n </ToastContent>\n {actionButton}\n {closeButton && (\n <ToastCloseButton reordered={reordered} {...closeButtonProps}>\n {closeIcon}\n </ToastCloseButton>\n )}\n </div>\n );\n }\n);\n"],"names":["forwardRef","isValidElement","useScaleTransition","useEnsuredId","ToastActionButton","ToastCloseButton","ToastContent","toast","Toast","props","ref","id","propId","className","timeout","classNames","theme","action","propAction","actionButton","propActionButton","paused","visible","closeIcon","propCloseIcon","closeButtonProps","closeButton","contentProps","disableToastContent","stacked","multiline","onEnter","onEntering","onEntered","onExit","onExiting","onExited","children","remaining","overrides","buttonChildren","reordered","elementProps","rendered","appear","nodeRef","temporary","transitionIn","exitedHidden","div","disableWrapper"],"mappings":"AAAA;;AAEA,SAKEA,UAAU,EACVC,cAAc,QACT,QAAQ;AASf,SAASC,kBAAkB,QAAQ,sCAAsC;AAEzE,SAASC,YAAY,QAAQ,qBAAqB;AAClD,SAASC,iBAAiB,QAAQ,yBAAyB;AAC3D,SAASC,gBAAgB,QAAQ,wBAAwB;AACzD,SAASC,YAAY,QAAgC,oBAAoB;AACzE,SAASC,KAAK,QAAQ,mBAAmB;
|
|
1
|
+
{"version":3,"sources":["../../src/snackbar/Toast.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n type AriaRole,\n type HTMLAttributes,\n type ReactElement,\n type ReactNode,\n forwardRef,\n isValidElement,\n} from \"react\";\n\nimport { type ButtonProps } from \"../button/Button.js\";\nimport { type BackgroundColor } from \"../cssUtils.js\";\nimport {\n type CSSTransitionClassNames,\n type TransitionCallbacks,\n type TransitionTimeout,\n} from \"../transition/types.js\";\nimport { useScaleTransition } from \"../transition/useScaleTransition.js\";\nimport { type PropsWithRef } from \"../types.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\nimport { ToastActionButton } from \"./ToastActionButton.js\";\nimport { ToastCloseButton } from \"./ToastCloseButton.js\";\nimport { ToastContent, type ToastContentProps } from \"./ToastContent.js\";\nimport { toast } from \"./toastStyles.js\";\n\ndeclare module \"react\" {\n interface CSSProperties {\n \"--rmd-toast-color\"?: string;\n \"--rmd-toast-background-color\"?: string;\n \"--rmd-toast-offset\"?: string | number;\n }\n}\n\n/**\n * @since 6.0.0\n */\nexport interface ConfigurableToastProps\n extends HTMLAttributes<HTMLDivElement>,\n TransitionCallbacks {\n /**\n * Note: this default value will only be generated in the `Toast` component.\n *\n * @defaultValue `\"toast-\" + useId()`\n */\n id?: string;\n\n /**\n * Note: This is set while creating the toast.\n *\n * @defaultValue `visibleTime === null ? \"alert\" : \"status\"`\n */\n role?: AriaRole;\n\n /**\n * @defaultValue `\"surface\"`\n */\n theme?: BackgroundColor;\n\n /**\n * Set this to `true` to stack the content above the {@link action}. It is not\n * recommended to enable this prop if the {@link closeButton} is enabled.\n *\n * @defaultValue `false`\n */\n stacked?: boolean;\n\n /**\n * If this is not provided, a `ResizeObserver` will be used to determine if\n * there are multiple lines of content.\n */\n multiline?: boolean;\n\n /**\n * When this is a string or React element, it will be rendered as the\n * `children` within a `Button`\n */\n action?: ButtonProps | ReactElement | string;\n\n /**\n * This can be used to replace the custom action button behavior.\n */\n actionButton?: ReactNode;\n\n /**\n * @defaultValue `getIcon(\"close\")`\n */\n closeIcon?: ReactNode;\n\n /**\n * Set this to `true` if a close button should be rendered to the right of the\n * `children`.\n *\n * @defaultValue `!!closeButtonProps`\n */\n closeButton?: boolean;\n\n /**\n * Use this prop to override most of the close button behavior. The\n */\n closeButtonProps?: ButtonProps;\n\n /**\n * Any additional props that should be provided to the `<div>` that surrounds\n * the toast `children`.\n */\n contentProps?: PropsWithRef<ToastContentProps, HTMLDivElement>;\n\n /**\n * Set this to `true` if the `children` for the toast should no longer be\n * wrapped in an additional `<div>` that applies some toast layout styles.\n * This should normally only be used for custom `Toast` implementations.\n *\n * @see the `Snackbar`'s `renderToast` prop for an example.\n */\n disableToastContent?: boolean;\n\n /**\n * The toast's transition timeout for entering and exiting. This is **not**\n * how long the toast should remain visible.\n *\n * @defaultValue `SCALE_TIMEOUT`\n */\n timeout?: TransitionTimeout;\n\n /**\n * The toast's transition class names for entering and exiting.\n *\n * @defaultValue `SCALE_CLASSNAMES`\n */\n classNames?: CSSTransitionClassNames;\n}\n\n/**\n * @since 6.0.0\n */\nexport interface ToastProps extends ConfigurableToastProps {\n paused?: boolean;\n visible: boolean;\n}\n\n/**\n * **Client Component**\n *\n * This component is just used for toast styling and does not implement any of\n * the visibility behavior.\n *\n * @see {@link https://next.react-md.dev/components/snackbar | Snackbar Demos}\n * @since 6.0.0\n */\nexport const Toast = forwardRef<HTMLDivElement, ToastProps>(\n function Toast(props, ref) {\n const {\n id: propId,\n className,\n timeout,\n classNames,\n theme = \"surface\",\n action: propAction,\n actionButton: propActionButton,\n paused,\n visible,\n closeIcon: propCloseIcon,\n closeButtonProps,\n closeButton = !!closeButtonProps,\n contentProps,\n disableToastContent,\n stacked,\n multiline,\n onEnter,\n onEntering,\n onEntered,\n onExit,\n onExiting,\n onExited,\n children,\n ...remaining\n } = props;\n const id = useEnsuredId(propId, \"toast\");\n\n let actionButton = propActionButton;\n if (propAction) {\n let overrides: ButtonProps = {};\n let buttonChildren: ReactNode;\n // have to use `any` to correctly filter out all react elements\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n if (isValidElement<any>(propAction) || typeof propAction !== \"object\") {\n buttonChildren = propAction;\n } else {\n ({ children: buttonChildren, ...overrides } = propAction);\n }\n\n actionButton = (\n <ToastActionButton\n theme={theme === \"surface\" ? \"secondary\" : \"clear\"}\n reordered={stacked && closeButton}\n {...overrides}\n >\n {buttonChildren}\n </ToastActionButton>\n );\n }\n\n let closeIcon = propCloseIcon;\n if (typeof closeButtonProps?.children !== \"undefined\") {\n closeIcon = closeButtonProps.children;\n }\n\n const action = !!actionButton;\n const reordered = stacked && action && closeButton;\n const { elementProps, rendered } = useScaleTransition({\n appear: true,\n nodeRef: ref,\n className: toast({\n className,\n theme,\n action,\n paused,\n stacked,\n reordered,\n closeButton,\n }),\n timeout,\n classNames,\n onEnter,\n onEntering,\n onEntered,\n onExit,\n onExiting,\n onExited,\n temporary: true,\n transitionIn: visible,\n exitedHidden: true,\n });\n\n // this might get rid of the weird popping-back-in for a split second\n // that sometimes happens on mobile firefox\n if (!rendered) {\n return null;\n }\n\n return (\n <div {...remaining} {...elementProps} id={id}>\n <ToastContent\n action={action}\n stacked={stacked}\n multiline={multiline}\n closeButton={closeButton}\n disableWrapper={disableToastContent}\n {...contentProps}\n >\n {children}\n </ToastContent>\n {actionButton}\n {closeButton && (\n <ToastCloseButton reordered={reordered} {...closeButtonProps}>\n {closeIcon}\n </ToastCloseButton>\n )}\n </div>\n );\n }\n);\n"],"names":["forwardRef","isValidElement","useScaleTransition","useEnsuredId","ToastActionButton","ToastCloseButton","ToastContent","toast","Toast","props","ref","id","propId","className","timeout","classNames","theme","action","propAction","actionButton","propActionButton","paused","visible","closeIcon","propCloseIcon","closeButtonProps","closeButton","contentProps","disableToastContent","stacked","multiline","onEnter","onEntering","onEntered","onExit","onExiting","onExited","children","remaining","overrides","buttonChildren","reordered","elementProps","rendered","appear","nodeRef","temporary","transitionIn","exitedHidden","div","disableWrapper"],"mappings":"AAAA;;AAEA,SAKEA,UAAU,EACVC,cAAc,QACT,QAAQ;AASf,SAASC,kBAAkB,QAAQ,sCAAsC;AAEzE,SAASC,YAAY,QAAQ,qBAAqB;AAClD,SAASC,iBAAiB,QAAQ,yBAAyB;AAC3D,SAASC,gBAAgB,QAAQ,wBAAwB;AACzD,SAASC,YAAY,QAAgC,oBAAoB;AACzE,SAASC,KAAK,QAAQ,mBAAmB;AAqHzC;;;;;;;;CAQC,GACD,OAAO,MAAMC,sBAAQR,WACnB,SAASQ,MAAMC,KAAK,EAAEC,GAAG;IACvB,MAAM,EACJC,IAAIC,MAAM,EACVC,SAAS,EACTC,OAAO,EACPC,UAAU,EACVC,QAAQ,SAAS,EACjBC,QAAQC,UAAU,EAClBC,cAAcC,gBAAgB,EAC9BC,MAAM,EACNC,OAAO,EACPC,WAAWC,aAAa,EACxBC,gBAAgB,EAChBC,cAAc,CAAC,CAACD,gBAAgB,EAChCE,YAAY,EACZC,mBAAmB,EACnBC,OAAO,EACPC,SAAS,EACTC,OAAO,EACPC,UAAU,EACVC,SAAS,EACTC,MAAM,EACNC,SAAS,EACTC,QAAQ,EACRC,QAAQ,EACR,GAAGC,WACJ,GAAG7B;IACJ,MAAME,KAAKR,aAAaS,QAAQ;IAEhC,IAAIO,eAAeC;IACnB,IAAIF,YAAY;QACd,IAAIqB,YAAyB,CAAC;QAC9B,IAAIC;QACJ,+DAA+D;QAC/D,8DAA8D;QAC9D,kBAAIvC,eAAoBiB,eAAe,OAAOA,eAAe,UAAU;YACrEsB,iBAAiBtB;QACnB,OAAO;YACJ,CAAA,EAAEmB,UAAUG,cAAc,EAAE,GAAGD,WAAW,GAAGrB,UAAS;QACzD;QAEAC,6BACE,KAACf;YACCY,OAAOA,UAAU,YAAY,cAAc;YAC3CyB,WAAWZ,WAAWH;YACrB,GAAGa,SAAS;sBAEZC;;IAGP;IAEA,IAAIjB,YAAYC;IAChB,IAAI,OAAOC,kBAAkBY,aAAa,aAAa;QACrDd,YAAYE,iBAAiBY,QAAQ;IACvC;IAEA,MAAMpB,SAAS,CAAC,CAACE;IACjB,MAAMsB,YAAYZ,WAAWZ,UAAUS;IACvC,MAAM,EAAEgB,YAAY,EAAEC,QAAQ,EAAE,GAAGzC,mBAAmB;QACpD0C,QAAQ;QACRC,SAASnC;QACTG,WAAWN,MAAM;YACfM;YACAG;YACAC;YACAI;YACAQ;YACAY;YACAf;QACF;QACAZ;QACAC;QACAgB;QACAC;QACAC;QACAC;QACAC;QACAC;QACAU,WAAW;QACXC,cAAczB;QACd0B,cAAc;IAChB;IAEA,qEAAqE;IACrE,2CAA2C;IAC3C,IAAI,CAACL,UAAU;QACb,OAAO;IACT;IAEA,qBACE,MAACM;QAAK,GAAGX,SAAS;QAAG,GAAGI,YAAY;QAAE/B,IAAIA;;0BACxC,KAACL;gBACCW,QAAQA;gBACRY,SAASA;gBACTC,WAAWA;gBACXJ,aAAaA;gBACbwB,gBAAgBtB;gBACf,GAAGD,YAAY;0BAEfU;;YAEFlB;YACAO,6BACC,KAACrB;gBAAiBoC,WAAWA;gBAAY,GAAGhB,gBAAgB;0BACzDF;;;;AAKX,GACA"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { type ButtonProps } from "../button/Button.js";
|
|
2
|
-
import { type ButtonTheme } from "../button/
|
|
2
|
+
import { type ButtonTheme } from "../button/styles.js";
|
|
3
3
|
/**
|
|
4
4
|
* @since 6.0.0
|
|
5
5
|
*/
|
|
@@ -21,6 +21,7 @@ export interface ToastActionButtonProps extends ButtonProps {
|
|
|
21
21
|
* This button will automatically close the toast when clicked unless
|
|
22
22
|
* `event.stopPropagation()` is called from the `onClick` prop.
|
|
23
23
|
*
|
|
24
|
+
* @see {@link https://next.react-md.dev/components/snackbar | Snackbar Demos}
|
|
24
25
|
* @since 6.0.0
|
|
25
26
|
*/
|
|
26
27
|
export declare const ToastActionButton: import("react").ForwardRefExoticComponent<ToastActionButtonProps & import("react").RefAttributes<HTMLButtonElement>>;
|
|
@@ -15,6 +15,7 @@ const noop = ()=>{
|
|
|
15
15
|
* This button will automatically close the toast when clicked unless
|
|
16
16
|
* `event.stopPropagation()` is called from the `onClick` prop.
|
|
17
17
|
*
|
|
18
|
+
* @see {@link https://next.react-md.dev/components/snackbar | Snackbar Demos}
|
|
18
19
|
* @since 6.0.0
|
|
19
20
|
*/ export const ToastActionButton = /*#__PURE__*/ forwardRef(function ToastActionButton(props, ref) {
|
|
20
21
|
const { className, children, theme = "secondary", onClick = noop, reordered, ...remaining } = props;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/snackbar/ToastActionButton.tsx"],"sourcesContent":["\"use client\";\n\nimport { cnb } from \"cnbuilder\";\nimport { forwardRef } from \"react\";\n\nimport { Button, type ButtonProps } from \"../button/Button.js\";\nimport { type ButtonTheme } from \"../button/
|
|
1
|
+
{"version":3,"sources":["../../src/snackbar/ToastActionButton.tsx"],"sourcesContent":["\"use client\";\n\nimport { cnb } from \"cnbuilder\";\nimport { forwardRef } from \"react\";\n\nimport { Button, type ButtonProps } from \"../button/Button.js\";\nimport { type ButtonTheme } from \"../button/styles.js\";\nimport { bem } from \"../utils/bem.js\";\nimport { useCurrentToastActions } from \"./useCurrentToastActions.js\";\n\nconst styles = bem(\"rmd-toast-action\");\nconst noop = (): void => {\n // do nothing\n};\n\n/**\n * @since 6.0.0\n */\nexport interface ToastActionButtonProps extends ButtonProps {\n /** @defaultValue `\"secondary\"` */\n theme?: ButtonTheme;\n\n /**\n * Set this to `true` when there is a close button visible and the content is\n * stacked. This will update the styles so the button renders in the bottom\n * right below the content and close button.\n *\n * @defaultValue `false`\n */\n reordered?: boolean;\n}\n\n/**\n * **Client Component**\n *\n * This button will automatically close the toast when clicked unless\n * `event.stopPropagation()` is called from the `onClick` prop.\n *\n * @see {@link https://next.react-md.dev/components/snackbar | Snackbar Demos}\n * @since 6.0.0\n */\nexport const ToastActionButton = forwardRef<\n HTMLButtonElement,\n ToastActionButtonProps\n>(function ToastActionButton(props, ref) {\n const {\n className,\n children,\n theme = \"secondary\",\n onClick = noop,\n reordered,\n ...remaining\n } = props;\n const { removeToast } = useCurrentToastActions();\n\n return (\n <Button\n {...remaining}\n ref={ref}\n onClick={(event) => {\n onClick(event);\n if (event.isPropagationStopped()) {\n return;\n }\n\n removeToast(true);\n }}\n theme={theme}\n className={cnb(styles({ reordered }), className)}\n >\n {children}\n </Button>\n );\n});\n"],"names":["cnb","forwardRef","Button","bem","useCurrentToastActions","styles","noop","ToastActionButton","props","ref","className","children","theme","onClick","reordered","remaining","removeToast","event","isPropagationStopped"],"mappings":"AAAA;;AAEA,SAASA,GAAG,QAAQ,YAAY;AAChC,SAASC,UAAU,QAAQ,QAAQ;AAEnC,SAASC,MAAM,QAA0B,sBAAsB;AAE/D,SAASC,GAAG,QAAQ,kBAAkB;AACtC,SAASC,sBAAsB,QAAQ,8BAA8B;AAErE,MAAMC,SAASF,IAAI;AACnB,MAAMG,OAAO;AACX,aAAa;AACf;AAmBA;;;;;;;;CAQC,GACD,OAAO,MAAMC,kCAAoBN,WAG/B,SAASM,kBAAkBC,KAAK,EAAEC,GAAG;IACrC,MAAM,EACJC,SAAS,EACTC,QAAQ,EACRC,QAAQ,WAAW,EACnBC,UAAUP,IAAI,EACdQ,SAAS,EACT,GAAGC,WACJ,GAAGP;IACJ,MAAM,EAAEQ,WAAW,EAAE,GAAGZ;IAExB,qBACE,KAACF;QACE,GAAGa,SAAS;QACbN,KAAKA;QACLI,SAAS,CAACI;YACRJ,QAAQI;YACR,IAAIA,MAAMC,oBAAoB,IAAI;gBAChC;YACF;YAEAF,YAAY;QACd;QACAJ,OAAOA;QACPF,WAAWV,IAAIK,OAAO;YAAES;QAAU,IAAIJ;kBAErCC;;AAGP,GAAG"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { type ButtonProps } from "../button/Button.js";
|
|
2
|
-
import { type ButtonType } from "../button/
|
|
2
|
+
import { type ButtonType } from "../button/styles.js";
|
|
3
3
|
/**
|
|
4
4
|
* @since 6.0.0
|
|
5
5
|
*/
|
|
@@ -28,6 +28,7 @@ export interface ToastCloseButtonProps extends ButtonProps {
|
|
|
28
28
|
* This button will automatically close the toast when clicked unless
|
|
29
29
|
* `event.stopPropagation()` is called from the `onClick` prop.
|
|
30
30
|
*
|
|
31
|
+
* @see {@link https://next.react-md.dev/components/snackbar | Snackbar Demos}
|
|
31
32
|
* @since 6.0.0
|
|
32
33
|
*/
|
|
33
34
|
export declare const ToastCloseButton: import("react").ForwardRefExoticComponent<ToastCloseButtonProps & import("react").RefAttributes<HTMLButtonElement>>;
|