@react-md/core 1.0.0-next.19 → 1.0.0-next.20
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.js.map +1 -1
- package/dist/NoSsr.js.map +1 -1
- package/dist/RootHtml.js.map +1 -1
- package/dist/SsrProvider.js.map +1 -1
- package/dist/_core.scss +10 -9
- package/dist/app-bar/AppBar.js.map +1 -1
- package/dist/app-bar/AppBarTitle.js.map +1 -1
- package/dist/app-bar/_app-bar.scss +0 -4
- package/dist/app-bar/styles.js.map +1 -1
- package/dist/autocomplete/Autocomplete.js.map +1 -1
- package/dist/autocomplete/AutocompleteChip.js +1 -1
- package/dist/autocomplete/AutocompleteChip.js.map +1 -1
- package/dist/autocomplete/AutocompleteCircularProgress.js.map +1 -1
- package/dist/autocomplete/AutocompleteClearButton.js +1 -1
- package/dist/autocomplete/AutocompleteClearButton.js.map +1 -1
- package/dist/autocomplete/AutocompleteDropdownButton.js +1 -1
- package/dist/autocomplete/AutocompleteDropdownButton.js.map +1 -1
- package/dist/autocomplete/AutocompleteListboxChildren.js.map +1 -1
- package/dist/autocomplete/_autocomplete.scss +15 -13
- package/dist/autocomplete/autocompleteStyles.js.map +1 -1
- package/dist/autocomplete/types.js.map +1 -1
- package/dist/autocomplete/useAutocomplete.js +1 -1
- package/dist/autocomplete/useAutocomplete.js.map +1 -1
- package/dist/autocomplete/utils.js.map +1 -1
- package/dist/avatar/Avatar.js.map +1 -1
- package/dist/avatar/styles.js.map +1 -1
- package/dist/badge/Badge.js.map +1 -1
- package/dist/badge/styles.js.map +1 -1
- package/dist/box/Box.js +2 -1
- package/dist/box/Box.js.map +1 -1
- package/dist/box/_box.scss +24 -1
- package/dist/box/styles.d.ts +11 -0
- package/dist/box/styles.js +4 -3
- package/dist/box/styles.js.map +1 -1
- package/dist/button/AsyncButton.js.map +1 -1
- package/dist/button/Button.js.map +1 -1
- package/dist/button/ButtonUnstyled.js.map +1 -1
- package/dist/button/FloatingActionButton.js.map +1 -1
- package/dist/button/TooltippedButton.js.map +1 -1
- package/dist/button/buttonStyles.js.map +1 -1
- package/dist/card/Card.d.ts +4 -13
- package/dist/card/Card.js +3 -3
- package/dist/card/Card.js.map +1 -1
- package/dist/card/CardContent.js.map +1 -1
- package/dist/card/CardFooter.js.map +1 -1
- package/dist/card/CardHeader.js.map +1 -1
- package/dist/card/CardSubtitle.js.map +1 -1
- package/dist/card/CardTitle.js.map +1 -1
- package/dist/card/ClickableCard.js.map +1 -1
- package/dist/card/_card.scss +5 -0
- package/dist/card/styles.js.map +1 -1
- package/dist/chip/Chip.js +1 -1
- package/dist/chip/Chip.js.map +1 -1
- package/dist/chip/styles.js.map +1 -1
- package/dist/dialog/Dialog.d.ts +4 -4
- package/dist/dialog/Dialog.js.map +1 -1
- package/dist/dialog/DialogContent.js.map +1 -1
- package/dist/dialog/DialogFooter.js.map +1 -1
- package/dist/dialog/DialogHeader.js.map +1 -1
- package/dist/dialog/DialogTitle.js.map +1 -1
- package/dist/dialog/FixedDialog.js +8 -5
- package/dist/dialog/FixedDialog.js.map +1 -1
- package/dist/dialog/NestedDialogProvider.js.map +1 -1
- package/dist/dialog/styles.d.ts +12 -3
- package/dist/dialog/styles.js.map +1 -1
- package/dist/divider/Divider.js.map +1 -1
- package/dist/divider/styles.js.map +1 -1
- package/dist/draggable/useDraggable.d.ts +3 -0
- package/dist/draggable/useDraggable.js +20 -5
- package/dist/draggable/useDraggable.js.map +1 -1
- package/dist/draggable/utils.js.map +1 -1
- package/dist/expansion-panel/ExpansionList.js.map +1 -1
- package/dist/expansion-panel/ExpansionPanel.js.map +1 -1
- package/dist/expansion-panel/ExpansionPanelHeader.js +1 -1
- package/dist/expansion-panel/ExpansionPanelHeader.js.map +1 -1
- package/dist/expansion-panel/expansionPanelStyles.js.map +1 -1
- package/dist/expansion-panel/useExpansionList.js.map +1 -1
- package/dist/expansion-panel/useExpansionPanels.js.map +1 -1
- package/dist/files/FileInput.js +1 -1
- package/dist/files/FileInput.js.map +1 -1
- package/dist/files/styles.js.map +1 -1
- package/dist/files/useFileUpload.js.map +1 -1
- package/dist/files/utils.d.ts +31 -1
- package/dist/files/utils.js +30 -0
- package/dist/files/utils.js.map +1 -1
- package/dist/focus/useFocusContainer.d.ts +5 -7
- package/dist/focus/useFocusContainer.js +5 -7
- package/dist/focus/useFocusContainer.js.map +1 -1
- package/dist/form/Checkbox.js.map +1 -1
- package/dist/form/Fieldset.js.map +1 -1
- package/dist/form/Form.js.map +1 -1
- package/dist/form/FormMessage.js.map +1 -1
- package/dist/form/FormMessageContainer.js.map +1 -1
- package/dist/form/FormMessageCounter.js.map +1 -1
- package/dist/form/InputToggle.js.map +1 -1
- package/dist/form/InputToggleIcon.js +1 -1
- package/dist/form/InputToggleIcon.js.map +1 -1
- package/dist/form/Label.js.map +1 -1
- package/dist/form/Legend.js.map +1 -1
- package/dist/form/Listbox.js.map +1 -1
- package/dist/form/ListboxProvider.js.map +1 -1
- package/dist/form/MenuItemCheckbox.js.map +1 -1
- package/dist/form/MenuItemFileInput.d.ts +1 -4
- package/dist/form/MenuItemFileInput.js +15 -6
- package/dist/form/MenuItemFileInput.js.map +1 -1
- package/dist/form/MenuItemInputToggle.js.map +1 -1
- package/dist/form/MenuItemRadio.js.map +1 -1
- package/dist/form/MenuItemSwitch.js.map +1 -1
- package/dist/form/MenuItemTextField.js.map +1 -1
- package/dist/form/NativeSelect.js +1 -1
- package/dist/form/NativeSelect.js.map +1 -1
- package/dist/form/OptGroup.js.map +1 -1
- package/dist/form/Option.js +4 -4
- package/dist/form/Option.js.map +1 -1
- package/dist/form/Password.js +2 -2
- package/dist/form/Password.js.map +1 -1
- package/dist/form/Radio.js.map +1 -1
- package/dist/form/ResizingTextAreaWrapper.js.map +1 -1
- package/dist/form/Select.js +1 -1
- package/dist/form/Select.js.map +1 -1
- package/dist/form/SelectedOption.js.map +1 -1
- package/dist/form/Slider.js +9 -62
- package/dist/form/Slider.js.map +1 -1
- package/dist/form/SliderContainer.js.map +1 -1
- package/dist/form/SliderMark.js.map +1 -1
- package/dist/form/SliderMarkLabel.js.map +1 -1
- package/dist/form/SliderThumb.js +1 -0
- package/dist/form/SliderThumb.js.map +1 -1
- package/dist/form/SliderTrack.js.map +1 -1
- package/dist/form/SliderValueMarks.js.map +1 -1
- package/dist/form/SliderValueTooltip.js.map +1 -1
- package/dist/form/Switch.js.map +1 -1
- package/dist/form/SwitchTrack.js.map +1 -1
- package/dist/form/TextArea.js.map +1 -1
- package/dist/form/TextField.js.map +1 -1
- package/dist/form/TextFieldAddon.js.map +1 -1
- package/dist/form/TextFieldContainer.js.map +1 -1
- package/dist/form/_form.scss +313 -269
- package/dist/form/formMessageContainerStyles.js.map +1 -1
- package/dist/form/formMessageStyles.js.map +1 -1
- package/dist/form/inputToggleStyles.js.map +1 -1
- package/dist/form/menuItemInputToggleStyles.js.map +1 -1
- package/dist/form/nativeSelectStyles.js.map +1 -1
- package/dist/form/optionStyles.js.map +1 -1
- package/dist/form/passwordStyles.js.map +1 -1
- package/dist/form/selectStyles.js.map +1 -1
- package/dist/form/selectUtils.js.map +1 -1
- package/dist/form/sliderUtils.d.ts +2 -7
- package/dist/form/sliderUtils.js +5 -5
- package/dist/form/sliderUtils.js.map +1 -1
- package/dist/form/switchStyles.js.map +1 -1
- package/dist/form/textAreaStyles.js.map +1 -1
- package/dist/form/textFieldContainerStyles.js.map +1 -1
- package/dist/form/textFieldStyles.js.map +1 -1
- package/dist/form/types.js.map +1 -1
- package/dist/form/useCheckboxGroup.d.ts +2 -2
- package/dist/form/useCheckboxGroup.js.map +1 -1
- package/dist/form/useCombobox.js.map +1 -1
- package/dist/form/useEditableCombobox.js.map +1 -1
- package/dist/form/useFormReset.js.map +1 -1
- package/dist/form/useNumberField.js.map +1 -1
- package/dist/form/useRadioGroup.d.ts +1 -1
- package/dist/form/useRadioGroup.js.map +1 -1
- package/dist/form/useRangeSlider.d.ts +1 -0
- package/dist/form/useRangeSlider.js.map +1 -1
- package/dist/form/useResizingTextArea.js.map +1 -1
- package/dist/form/useSelectCombobox.js.map +1 -1
- package/dist/form/useSlider.d.ts +1 -3
- package/dist/form/useSlider.js.map +1 -1
- package/dist/form/useSliderDraggable.d.ts +9 -0
- package/dist/form/useSliderDraggable.js +44 -0
- package/dist/form/useSliderDraggable.js.map +1 -0
- package/dist/form/useTextField.d.ts +24 -14
- package/dist/form/useTextField.js +7 -5
- package/dist/form/useTextField.js.map +1 -1
- package/dist/form/useTextFieldContainerAddons.js.map +1 -1
- package/dist/form/validation.js +2 -0
- package/dist/form/validation.js.map +1 -1
- package/dist/hoverMode/useHoverMode.d.ts +64 -3
- package/dist/hoverMode/useHoverMode.js.map +1 -1
- package/dist/hoverMode/useHoverModeProvider.d.ts +22 -12
- package/dist/hoverMode/useHoverModeProvider.js +21 -11
- package/dist/hoverMode/useHoverModeProvider.js.map +1 -1
- package/dist/icon/FontIcon.js.map +1 -1
- package/dist/icon/IconRotator.js.map +1 -1
- package/dist/icon/MaterialIcon.js.map +1 -1
- package/dist/icon/MaterialSymbol.js.map +1 -1
- package/dist/icon/SVGIcon.js.map +1 -1
- package/dist/icon/TextIconSpacing.js.map +1 -1
- package/dist/icon/{iconConfig.js → config.js} +1 -1
- package/dist/icon/config.js.map +1 -0
- package/dist/icon/materialConfig.js.map +1 -1
- package/dist/icon/styles.js.map +1 -1
- package/dist/interaction/Ripple.js.map +1 -1
- package/dist/interaction/RippleContainer.js.map +1 -1
- package/dist/interaction/UserInteractionModeProvider.js.map +1 -1
- package/dist/interaction/_interaction.scss +2 -2
- package/dist/interaction/useElementInteraction.d.ts +24 -25
- package/dist/interaction/useElementInteraction.js +20 -21
- package/dist/interaction/useElementInteraction.js.map +1 -1
- package/dist/interaction/useHigherContrastChildren.d.ts +8 -6
- package/dist/interaction/useHigherContrastChildren.js +10 -8
- package/dist/interaction/useHigherContrastChildren.js.map +1 -1
- package/dist/interaction/utils.js.map +1 -1
- package/dist/layout/LayoutAppBar.js.map +1 -1
- package/dist/layout/LayoutNav.js.map +1 -1
- package/dist/layout/LayoutWindowSplitter.js.map +1 -1
- package/dist/layout/Main.js.map +1 -1
- package/dist/layout/_layout.scss +4 -0
- package/dist/layout/layoutNavStyles.js.map +1 -1
- package/dist/layout/layoutWindowSplitterStyles.js.map +1 -1
- package/dist/layout/mainStyles.js.map +1 -1
- package/dist/layout/useExpandableLayout.d.ts +12 -14
- package/dist/layout/useExpandableLayout.js +13 -15
- package/dist/layout/useExpandableLayout.js.map +1 -1
- package/dist/layout/useHorizontalLayoutTransition.js.map +1 -1
- package/dist/layout/useLayoutAppBarHeight.js.map +1 -1
- package/dist/layout/useLayoutTree.d.ts +4 -3
- package/dist/layout/useLayoutTree.js +4 -3
- package/dist/layout/useLayoutTree.js.map +1 -1
- package/dist/layout/useLayoutWindowSplitter.js.map +1 -1
- package/dist/layout/useMainTabIndex.js.map +1 -1
- package/dist/layout/useResizableLayout.d.ts +13 -16
- package/dist/layout/useResizableLayout.js +13 -16
- package/dist/layout/useResizableLayout.js.map +1 -1
- package/dist/layout/useTemporaryLayout.d.ts +14 -9
- package/dist/layout/useTemporaryLayout.js +12 -10
- package/dist/layout/useTemporaryLayout.js.map +1 -1
- package/dist/link/Link.js.map +1 -1
- package/dist/link/SkipToMainContent.js.map +1 -1
- package/dist/link/styles.js.map +1 -1
- package/dist/list/List.js.map +1 -1
- package/dist/list/ListItem.js +1 -1
- package/dist/list/ListItem.js.map +1 -1
- package/dist/list/ListItemAddon.js.map +1 -1
- package/dist/list/ListItemChildren.js.map +1 -1
- package/dist/list/ListItemLink.js.map +1 -1
- package/dist/list/ListItemText.js.map +1 -1
- package/dist/list/ListSubheader.js.map +1 -1
- package/dist/list/listItemStyles.js.map +1 -1
- package/dist/list/listStyles.js.map +1 -1
- package/dist/list/types.js.map +1 -1
- package/dist/media-queries/AppSizeProvider.d.ts +1 -1
- package/dist/media-queries/AppSizeProvider.js +1 -1
- package/dist/media-queries/AppSizeProvider.js.map +1 -1
- package/dist/media-queries/useMediaQuery.d.ts +3 -3
- package/dist/media-queries/useMediaQuery.js +3 -3
- package/dist/media-queries/useMediaQuery.js.map +1 -1
- package/dist/menu/DropdownMenu.js.map +1 -1
- package/dist/menu/Menu.js.map +1 -1
- package/dist/menu/MenuBar.js.map +1 -1
- package/dist/menu/MenuButton.js +1 -1
- package/dist/menu/MenuButton.js.map +1 -1
- package/dist/menu/MenuConfigurationProvider.js.map +1 -1
- package/dist/menu/MenuItem.js.map +1 -1
- package/dist/menu/MenuItemButton.js +1 -1
- package/dist/menu/MenuItemButton.js.map +1 -1
- package/dist/menu/MenuItemCircularProgress.js.map +1 -1
- package/dist/menu/MenuItemGroup.js.map +1 -1
- package/dist/menu/MenuItemSeparator.js.map +1 -1
- package/dist/menu/MenuSheet.js.map +1 -1
- package/dist/menu/MenuVisibilityProvider.js.map +1 -1
- package/dist/menu/MenuWidget.js.map +1 -1
- package/dist/menu/MenuWidgetKeyboardProvider.js.map +1 -1
- package/dist/menu/useContextMenu.js.map +1 -1
- package/dist/menu/useMenuBarProvider.js.map +1 -1
- package/dist/movement/types.js.map +1 -1
- package/dist/movement/useKeyboardMovementProvider.js.map +1 -1
- package/dist/movement/utils.js.map +1 -1
- package/dist/navigation/CollapsibleNavGroup.js.map +1 -1
- package/dist/navigation/DefaultNavigationRenderer.js.map +1 -1
- package/dist/navigation/NavGroup.js.map +1 -1
- package/dist/navigation/NavItem.js.map +1 -1
- package/dist/navigation/NavItemButton.js +1 -1
- package/dist/navigation/NavItemButton.js.map +1 -1
- package/dist/navigation/NavItemLink.js.map +1 -1
- package/dist/navigation/NavSubheader.d.ts +1 -1
- package/dist/navigation/NavSubheader.js +1 -1
- package/dist/navigation/NavSubheader.js.map +1 -1
- package/dist/navigation/Navigation.js.map +1 -1
- package/dist/navigation/navGroupStyles.js.map +1 -1
- package/dist/navigation/navItemStyles.js.map +1 -1
- package/dist/navigation/types.js.map +1 -1
- package/dist/navigation/useActiveHeadingId.d.ts +1 -1
- package/dist/navigation/useActiveHeadingId.js +4 -4
- package/dist/navigation/useActiveHeadingId.js.map +1 -1
- package/dist/navigation/useNavigationExpansion.js.map +1 -1
- package/dist/navigation/useTableOfContentsHeadings.d.ts +75 -0
- package/dist/navigation/useTableOfContentsHeadings.js +91 -0
- package/dist/navigation/useTableOfContentsHeadings.js.map +1 -0
- package/dist/objectFit.js.map +1 -1
- package/dist/overlay/Overlay.js +1 -1
- package/dist/overlay/Overlay.js.map +1 -1
- package/dist/overlay/overlayStyles.d.ts +7 -3
- package/dist/overlay/overlayStyles.js.map +1 -1
- package/dist/portal/Portal.js.map +1 -1
- package/dist/portal/PortalContainerProvider.js.map +1 -1
- package/dist/positioning/createHorizontalPosition.js.map +1 -1
- package/dist/positioning/createVerticalPosition.js.map +1 -1
- package/dist/positioning/useFixedPositioning.d.ts +11 -8
- package/dist/positioning/useFixedPositioning.js +7 -6
- package/dist/positioning/useFixedPositioning.js.map +1 -1
- package/dist/progress/CircularProgress.js.map +1 -1
- package/dist/progress/LinearProgress.js.map +1 -1
- package/dist/progress/_progress.scss +2 -1
- package/dist/responsive-item/ResponsiveItem.js.map +1 -1
- package/dist/responsive-item/ResponsiveItemOverlay.js.map +1 -1
- package/dist/responsive-item/responsiveItemOverlayStyles.js.map +1 -1
- package/dist/responsive-item/responsiveItemStyles.js.map +1 -1
- package/dist/scroll/ScrollLock.js.map +1 -1
- package/dist/scroll/useScrollLock.d.ts +1 -1
- package/dist/scroll/useScrollLock.js +1 -1
- package/dist/scroll/useScrollLock.js.map +1 -1
- package/dist/searching/fuzzy.d.ts +1 -1
- package/dist/searching/fuzzy.js.map +1 -1
- package/dist/searching/useFuzzyMatch.js.map +1 -1
- package/dist/segmented-button/SegmentedButton.js +1 -1
- package/dist/segmented-button/SegmentedButton.js.map +1 -1
- package/dist/segmented-button/SegmentedButtonContainer.js.map +1 -1
- package/dist/segmented-button/_segmented-button.scss +40 -0
- package/dist/segmented-button/segmentedButtonContainerStyles.js.map +1 -1
- package/dist/segmented-button/segmentedButtonStyles.js.map +1 -1
- package/dist/sheet/Sheet.js.map +1 -1
- package/dist/sheet/styles.js.map +1 -1
- package/dist/snackbar/DefaultToastRenderer.js.map +1 -1
- package/dist/snackbar/Snackbar.js.map +1 -1
- package/dist/snackbar/Toast.js.map +1 -1
- package/dist/snackbar/ToastActionButton.js.map +1 -1
- package/dist/snackbar/ToastCloseButton.js +1 -1
- package/dist/snackbar/ToastCloseButton.js.map +1 -1
- package/dist/snackbar/ToastContent.js.map +1 -1
- package/dist/snackbar/ToastManager.js.map +1 -1
- package/dist/snackbar/ToastManagerProvider.js.map +1 -1
- package/dist/snackbar/snackbarStyles.js.map +1 -1
- package/dist/snackbar/toastContentStyles.js.map +1 -1
- package/dist/snackbar/toastStyles.js.map +1 -1
- package/dist/snackbar/useCurrentToastActions.js.map +1 -1
- package/dist/storage/internalUtils.d.ts +19 -0
- package/dist/storage/internalUtils.js +22 -0
- package/dist/storage/internalUtils.js.map +1 -0
- package/dist/storage/types.d.ts +75 -0
- package/dist/storage/types.js +3 -0
- package/dist/storage/types.js.map +1 -0
- package/dist/storage/useStorage.d.ts +113 -0
- package/dist/storage/useStorage.js +247 -0
- package/dist/storage/useStorage.js.map +1 -0
- package/dist/storage/utils.d.ts +94 -0
- package/dist/storage/utils.js +106 -0
- package/dist/storage/utils.js.map +1 -0
- package/dist/suspense/CircularProgressSuspense.js.map +1 -1
- package/dist/suspense/NullSuspense.js.map +1 -1
- package/dist/table/StickyTableSection.js.map +1 -1
- package/dist/table/Table.js.map +1 -1
- package/dist/table/TableBody.js.map +1 -1
- package/dist/table/TableCell.js +1 -1
- package/dist/table/TableCell.js.map +1 -1
- package/dist/table/TableCellContent.js.map +1 -1
- package/dist/table/TableCheckbox.js.map +1 -1
- package/dist/table/TableConfigurationProvider.js.map +1 -1
- package/dist/table/TableContainer.js.map +1 -1
- package/dist/table/TableContainerProvider.js.map +1 -1
- package/dist/table/TableFooter.js.map +1 -1
- package/dist/table/TableHeader.js.map +1 -1
- package/dist/table/TableRadio.js.map +1 -1
- package/dist/table/TableRow.js.map +1 -1
- package/dist/table/_table.scss +0 -1
- package/dist/table/tableCellStyles.js.map +1 -1
- package/dist/table/tableFooterStyles.js.map +1 -1
- package/dist/table/tableHeaderStyles.js.map +1 -1
- package/dist/table/tableRowStyles.js.map +1 -1
- package/dist/table/tableStyles.js.map +1 -1
- package/dist/table/useStickyTableSection.js.map +1 -1
- package/dist/table/useTableSectionConfig.js.map +1 -1
- package/dist/tabs/SimpleTabPanel.d.ts +17 -0
- package/dist/tabs/SimpleTabPanel.js +21 -0
- package/dist/tabs/SimpleTabPanel.js.map +1 -0
- package/dist/tabs/SimpleTabPanels.d.ts +17 -0
- package/dist/tabs/SimpleTabPanels.js +18 -0
- package/dist/tabs/SimpleTabPanels.js.map +1 -0
- package/dist/tabs/Tab.js.map +1 -1
- package/dist/tabs/TabList.d.ts +8 -25
- package/dist/tabs/TabList.js +4 -6
- package/dist/tabs/TabList.js.map +1 -1
- package/dist/tabs/TabListScrollButton.js +2 -1
- package/dist/tabs/TabListScrollButton.js.map +1 -1
- package/dist/tabs/_tabs.scss +50 -14
- package/dist/tabs/tabIndicatorStyles.js.map +1 -1
- package/dist/tabs/tabListScrollButtonStyles.js.map +1 -1
- package/dist/tabs/tabListStyles.d.ts +9 -0
- package/dist/tabs/tabListStyles.js +2 -1
- package/dist/tabs/tabListStyles.js.map +1 -1
- package/dist/tabs/tabStyles.d.ts +7 -0
- package/dist/tabs/tabStyles.js.map +1 -1
- package/dist/tabs/types.d.ts +25 -0
- package/dist/tabs/types.js +24 -0
- package/dist/tabs/types.js.map +1 -0
- package/dist/tabs/useMaxTabPanelHeight.d.ts +82 -0
- package/dist/tabs/useMaxTabPanelHeight.js +95 -0
- package/dist/tabs/useMaxTabPanelHeight.js.map +1 -0
- package/dist/tabs/useTabList.d.ts +4 -2
- package/dist/tabs/useTabList.js +24 -6
- package/dist/tabs/useTabList.js.map +1 -1
- package/dist/tabs/useTabs.d.ts +53 -68
- package/dist/tabs/useTabs.js +6 -2
- package/dist/tabs/useTabs.js.map +1 -1
- package/dist/tabs/utils.d.ts +4 -0
- package/dist/tabs/utils.js +5 -0
- package/dist/tabs/utils.js.map +1 -1
- package/dist/test-utils/drag.d.ts +1 -0
- package/dist/test-utils/index.d.ts +6 -4
- package/dist/test-utils/index.js +6 -4
- package/dist/test-utils/index.js.map +1 -1
- package/dist/test-utils/jest-globals/index.d.ts +4 -0
- package/dist/test-utils/jest-globals/index.js +6 -0
- package/dist/test-utils/jest-globals/index.js.map +1 -0
- package/dist/test-utils/jest-globals/match-media.d.ts +32 -0
- package/dist/test-utils/jest-globals/match-media.js +35 -0
- package/dist/test-utils/jest-globals/match-media.js.map +1 -0
- package/dist/test-utils/jest-globals/resize-observer.d.ts +5 -0
- package/dist/test-utils/jest-globals/resize-observer.js +10 -0
- package/dist/test-utils/jest-globals/resize-observer.js.map +1 -0
- package/dist/test-utils/jest-globals/setup.d.ts +1 -0
- package/dist/test-utils/{jest-setup.js → jest-globals/setup.js} +4 -3
- package/dist/test-utils/jest-globals/setup.js.map +1 -0
- package/dist/test-utils/{timers.d.ts → jest-globals/timers.d.ts} +2 -2
- package/dist/test-utils/{timers.js → jest-globals/timers.js} +2 -2
- package/dist/test-utils/jest-globals/timers.js.map +1 -0
- package/dist/test-utils/jest-globals/uploadMenuItemFileInput.d.ts +32 -0
- package/dist/test-utils/jest-globals/uploadMenuItemFileInput.js +39 -0
- package/dist/test-utils/jest-globals/uploadMenuItemFileInput.js.map +1 -0
- package/dist/test-utils/mocks/IntersectionObserver.js.map +1 -0
- package/dist/test-utils/{ResizeObserver.d.ts → mocks/ResizeObserver.d.ts} +16 -23
- package/dist/test-utils/{ResizeObserver.js → mocks/ResizeObserver.js} +17 -38
- package/dist/test-utils/mocks/ResizeObserver.js.map +1 -0
- package/dist/test-utils/mocks/match-media-implementation.d.ts +42 -0
- package/dist/test-utils/mocks/match-media-implementation.js +46 -0
- package/dist/test-utils/mocks/match-media-implementation.js.map +1 -0
- package/dist/test-utils/mocks/match-media.d.ts +32 -0
- package/dist/test-utils/mocks/match-media.js +39 -0
- package/dist/test-utils/mocks/match-media.js.map +1 -0
- package/dist/test-utils/polyfills/IntersectionObserver.js +1 -1
- package/dist/test-utils/polyfills/IntersectionObserver.js.map +1 -1
- package/dist/test-utils/polyfills/ResizeObserver.js +1 -1
- package/dist/test-utils/polyfills/ResizeObserver.js.map +1 -1
- package/dist/test-utils/polyfills/matchMedia.js +1 -1
- package/dist/test-utils/polyfills/matchMedia.js.map +1 -1
- package/dist/test-utils/queries/index.d.ts +2 -0
- package/dist/test-utils/queries/index.js +4 -0
- package/dist/test-utils/queries/index.js.map +1 -0
- package/dist/test-utils/queries/select.d.ts +67 -0
- package/dist/test-utils/queries/select.js +69 -0
- package/dist/test-utils/queries/select.js.map +1 -0
- package/dist/test-utils/queries/slider.d.ts +126 -0
- package/dist/test-utils/queries/slider.js +136 -0
- package/dist/test-utils/queries/slider.js.map +1 -0
- package/dist/test-utils/queries/types.d.ts +8 -0
- package/dist/test-utils/queries/types.js +5 -0
- package/dist/test-utils/queries/types.js.map +1 -0
- package/dist/test-utils/render.js.map +1 -1
- package/dist/test-utils/utils/createFileList.d.ts +4 -0
- package/dist/test-utils/utils/createFileList.js +27 -0
- package/dist/test-utils/utils/createFileList.js.map +1 -0
- package/dist/test-utils/utils/createResizeObserverEntry.d.ts +18 -0
- package/dist/test-utils/utils/createResizeObserverEntry.js +33 -0
- package/dist/test-utils/utils/createResizeObserverEntry.js.map +1 -0
- package/dist/test-utils/vitest/index.d.ts +4 -0
- package/dist/test-utils/vitest/index.js +6 -0
- package/dist/test-utils/vitest/index.js.map +1 -0
- package/dist/test-utils/vitest/match-media.d.ts +32 -0
- package/dist/test-utils/vitest/match-media.js +35 -0
- package/dist/test-utils/vitest/match-media.js.map +1 -0
- package/dist/test-utils/vitest/resize-observer.d.ts +5 -0
- package/dist/test-utils/vitest/resize-observer.js +10 -0
- package/dist/test-utils/vitest/resize-observer.js.map +1 -0
- package/dist/test-utils/vitest/setup.d.ts +1 -0
- package/dist/test-utils/vitest/setup.js +14 -0
- package/dist/test-utils/vitest/setup.js.map +1 -0
- package/dist/test-utils/vitest/timers.d.ts +42 -0
- package/dist/test-utils/vitest/timers.js +42 -0
- package/dist/test-utils/vitest/timers.js.map +1 -0
- package/dist/test-utils/vitest/uploadMenuItemFileInput.d.ts +32 -0
- package/dist/test-utils/vitest/uploadMenuItemFileInput.js +39 -0
- package/dist/test-utils/vitest/uploadMenuItemFileInput.js.map +1 -0
- package/dist/theme/LocalStorageColorSchemeProvider.d.ts +17 -17
- package/dist/theme/LocalStorageColorSchemeProvider.js +19 -19
- package/dist/theme/LocalStorageColorSchemeProvider.js.map +1 -1
- package/dist/theme/ThemeProvider.d.ts +2 -2
- package/dist/theme/ThemeProvider.js +4 -4
- package/dist/theme/ThemeProvider.js.map +1 -1
- package/dist/theme/_theme.scss +0 -4
- package/dist/theme/isColorScheme.d.ts +5 -5
- package/dist/theme/isColorScheme.js +5 -5
- package/dist/theme/isColorScheme.js.map +1 -1
- package/dist/theme/types.d.ts +10 -22
- package/dist/theme/types.js.map +1 -1
- package/dist/theme/useCSSVariables.d.ts +8 -15
- package/dist/theme/useCSSVariables.js.map +1 -1
- package/dist/theme/useColorScheme.d.ts +15 -13
- package/dist/theme/useColorScheme.js +17 -15
- package/dist/theme/useColorScheme.js.map +1 -1
- package/dist/theme/useColorSchemeMetaTag.d.ts +15 -2
- package/dist/theme/useColorSchemeMetaTag.js +13 -0
- package/dist/theme/useColorSchemeMetaTag.js.map +1 -1
- package/dist/theme/useColorSchemeProvider.d.ts +18 -20
- package/dist/theme/useColorSchemeProvider.js +13 -13
- package/dist/theme/useColorSchemeProvider.js.map +1 -1
- package/dist/theme/{usePrefersDarkScheme.js → usePrefersDarkTheme.js} +1 -1
- package/dist/theme/usePrefersDarkTheme.js.map +1 -0
- package/dist/tooltip/Tooltip.js.map +1 -1
- package/dist/tooltip/TooltipHoverModeProvider.js.map +1 -1
- package/dist/tooltip/tooltipStyles.js.map +1 -1
- package/dist/tooltip/useTooltip.d.ts +5 -2
- package/dist/tooltip/useTooltip.js.map +1 -1
- package/dist/tooltip/useTooltipPosition.js.map +1 -1
- package/dist/transition/CSSTransition.js.map +1 -1
- package/dist/transition/Collapse.js.map +1 -1
- package/dist/transition/CrossFade.d.ts +1 -1
- package/dist/transition/CrossFade.js +1 -1
- package/dist/transition/CrossFade.js.map +1 -1
- package/dist/transition/ScaleTransition.js.map +1 -1
- package/dist/transition/SkeletonPlaceholder.js.map +1 -1
- package/dist/transition/Slide.js.map +1 -1
- package/dist/transition/SlideContainer.js.map +1 -1
- package/dist/transition/collapseStyles.js.map +1 -1
- package/dist/transition/config.d.ts +4 -1
- package/dist/transition/config.js.map +1 -1
- package/dist/transition/maxWidthTransition.d.ts +6 -0
- package/dist/transition/maxWidthTransition.js +3 -1
- package/dist/transition/maxWidthTransition.js.map +1 -1
- package/dist/transition/skeletonPlaceholderUtils.js.map +1 -1
- package/dist/transition/types.d.ts +0 -1
- package/dist/transition/types.js.map +1 -1
- package/dist/transition/useCSSTransition.d.ts +8 -4
- package/dist/transition/useCSSTransition.js +8 -4
- package/dist/transition/useCSSTransition.js.map +1 -1
- package/dist/transition/useCarousel.js.map +1 -1
- package/dist/transition/useCollapseTransition.d.ts +13 -8
- package/dist/transition/useCollapseTransition.js +11 -6
- package/dist/transition/useCollapseTransition.js.map +1 -1
- package/dist/transition/useCrossFadeTransition.js.map +1 -1
- package/dist/transition/useMaxWidthTransition.d.ts +9 -0
- package/dist/transition/useMaxWidthTransition.js +9 -0
- package/dist/transition/useMaxWidthTransition.js.map +1 -1
- package/dist/transition/useScaleTransition.d.ts +27 -6
- package/dist/transition/useScaleTransition.js +4 -2
- package/dist/transition/useScaleTransition.js.map +1 -1
- package/dist/transition/useSkeletonPlaceholder.d.ts +16 -0
- package/dist/transition/useSkeletonPlaceholder.js +13 -1
- package/dist/transition/useSkeletonPlaceholder.js.map +1 -1
- package/dist/transition/useSlideTransition.d.ts +12 -16
- package/dist/transition/useSlideTransition.js +12 -16
- package/dist/transition/useSlideTransition.js.map +1 -1
- package/dist/transition/useTransition.js +1 -1
- package/dist/transition/useTransition.js.map +1 -1
- package/dist/tree/DefaultTreeItemRenderer.js.map +1 -1
- package/dist/tree/Tree.js.map +1 -1
- package/dist/tree/TreeGroup.js.map +1 -1
- package/dist/tree/TreeItem.js.map +1 -1
- package/dist/tree/TreeItemExpander.js +1 -1
- package/dist/tree/TreeItemExpander.js.map +1 -1
- package/dist/tree/TreeProvider.js.map +1 -1
- package/dist/tree/_tree.scss +0 -1
- package/dist/tree/styles.js.map +1 -1
- package/dist/tree/types.js.map +1 -1
- package/dist/tree/useTree.js.map +1 -1
- package/dist/tree/useTreeExpansion.js.map +1 -1
- package/dist/tree/useTreeItems.d.ts +1 -1
- package/dist/tree/useTreeItems.js.map +1 -1
- package/dist/tree/useTreeMovement.js.map +1 -1
- package/dist/tree/useTreeSelection.js.map +1 -1
- package/dist/typography/SrOnly.js.map +1 -1
- package/dist/typography/TextContainer.js.map +1 -1
- package/dist/typography/Typography.js.map +1 -1
- package/dist/typography/WritingDirectionProvider.js.map +1 -1
- package/dist/typography/textContainerStyles.js.map +1 -1
- package/dist/typography/typographyStyles.js.map +1 -1
- package/dist/useAsyncFunction.d.ts +20 -0
- package/dist/useAsyncFunction.js.map +1 -1
- package/dist/useDebouncedFunction.js.map +1 -1
- package/dist/useDropzone.d.ts +18 -11
- package/dist/useDropzone.js +27 -23
- package/dist/useDropzone.js.map +1 -1
- package/dist/useElementSize.d.ts +3 -3
- package/dist/useElementSize.js +1 -1
- package/dist/useElementSize.js.map +1 -1
- package/dist/useEnsuredId.d.ts +1 -1
- package/dist/useEnsuredId.js +1 -1
- package/dist/useEnsuredId.js.map +1 -1
- package/dist/useEnsuredRef.d.ts +1 -1
- package/dist/useEnsuredRef.js +1 -1
- package/dist/useEnsuredRef.js.map +1 -1
- package/dist/useEnsuredState.js.map +1 -1
- package/dist/useHtmlClassName.d.ts +11 -0
- package/dist/useHtmlClassName.js +11 -0
- package/dist/useHtmlClassName.js.map +1 -1
- package/dist/useIntersectionObserver.d.ts +3 -3
- package/dist/useIntersectionObserver.js +2 -2
- package/dist/useIntersectionObserver.js.map +1 -1
- package/dist/useIsomorphicLayoutEffect.js.map +1 -1
- package/dist/useMutationObserver.d.ts +3 -3
- package/dist/useMutationObserver.js +4 -4
- package/dist/useMutationObserver.js.map +1 -1
- package/dist/useOrientation.d.ts +0 -1
- package/dist/useOrientation.js +0 -1
- package/dist/useOrientation.js.map +1 -1
- package/dist/usePageInactive.d.ts +7 -2
- package/dist/usePageInactive.js +7 -2
- package/dist/usePageInactive.js.map +1 -1
- package/dist/useReadonlySet.d.ts +5 -4
- package/dist/useReadonlySet.js +4 -3
- package/dist/useReadonlySet.js.map +1 -1
- package/dist/useResizeListener.d.ts +6 -4
- package/dist/useResizeListener.js +6 -4
- package/dist/useResizeListener.js.map +1 -1
- package/dist/useResizeObserver.d.ts +1 -1
- package/dist/useResizeObserver.js +1 -1
- package/dist/useResizeObserver.js.map +1 -1
- package/dist/useThrottledFunction.js.map +1 -1
- package/dist/useToggle.d.ts +3 -3
- package/dist/useToggle.js +3 -3
- package/dist/useToggle.js.map +1 -1
- package/dist/useUnmounted.js.map +1 -1
- package/dist/useWindowSize.d.ts +1 -1
- package/dist/useWindowSize.js +1 -1
- package/dist/useWindowSize.js.map +1 -1
- package/dist/utils/RenderRecursively.d.ts +88 -32
- package/dist/utils/RenderRecursively.js +88 -32
- package/dist/utils/RenderRecursively.js.map +1 -1
- package/dist/utils/alphaNumericSort.d.ts +5 -0
- package/dist/utils/alphaNumericSort.js +5 -4
- package/dist/utils/alphaNumericSort.js.map +1 -1
- package/dist/utils/bem.d.ts +49 -6
- package/dist/utils/bem.js +5 -14
- package/dist/utils/bem.js.map +1 -1
- package/dist/utils/getRangeDefaultValue.js.map +1 -1
- package/dist/utils/isElementVisible.d.ts +1 -1
- package/dist/utils/isElementVisible.js +1 -1
- package/dist/utils/isElementVisible.js.map +1 -1
- package/dist/utils/loop.d.ts +2 -0
- package/dist/utils/loop.js.map +1 -1
- package/dist/utils/parseCssLengthUnit.d.ts +1 -1
- package/dist/utils/parseCssLengthUnit.js.map +1 -1
- package/dist/utils/wait.d.ts +4 -4
- package/dist/utils/wait.js +6 -4
- package/dist/utils/wait.js.map +1 -1
- package/dist/window-splitter/WindowSplitter.js.map +1 -1
- package/dist/window-splitter/styles.js.map +1 -1
- package/dist/window-splitter/useWindowSplitter.d.ts +4 -1
- package/dist/window-splitter/useWindowSplitter.js +4 -1
- package/dist/window-splitter/useWindowSplitter.js.map +1 -1
- package/package.json +26 -22
- package/src/CoreProviders.tsx +8 -6
- package/src/NoSsr.tsx +3 -1
- package/src/RootHtml.tsx +1 -0
- package/src/SsrProvider.tsx +3 -2
- package/src/app-bar/AppBar.tsx +3 -2
- package/src/app-bar/AppBarTitle.tsx +1 -0
- package/src/app-bar/styles.ts +1 -0
- package/src/autocomplete/Autocomplete.tsx +2 -0
- package/src/autocomplete/AutocompleteChip.tsx +2 -1
- package/src/autocomplete/AutocompleteCircularProgress.tsx +1 -0
- package/src/autocomplete/AutocompleteClearButton.tsx +3 -1
- package/src/autocomplete/AutocompleteDropdownButton.tsx +3 -1
- package/src/autocomplete/AutocompleteListboxChildren.tsx +2 -0
- package/src/autocomplete/autocompleteStyles.ts +1 -0
- package/src/autocomplete/types.ts +1 -0
- package/src/autocomplete/useAutocomplete.ts +4 -2
- package/src/autocomplete/utils.ts +1 -0
- package/src/avatar/Avatar.tsx +3 -2
- package/src/avatar/styles.ts +2 -1
- package/src/badge/Badge.tsx +3 -2
- package/src/badge/styles.ts +1 -0
- package/src/box/Box.tsx +5 -2
- package/src/box/styles.ts +17 -2
- package/src/button/AsyncButton.tsx +3 -1
- package/src/button/Button.tsx +4 -2
- package/src/button/ButtonUnstyled.tsx +2 -1
- package/src/button/FloatingActionButton.tsx +2 -1
- package/src/button/TooltippedButton.tsx +4 -2
- package/src/button/buttonStyles.ts +2 -1
- package/src/card/Card.tsx +10 -23
- package/src/card/CardContent.tsx +3 -2
- package/src/card/CardFooter.tsx +1 -0
- package/src/card/CardHeader.tsx +2 -1
- package/src/card/CardSubtitle.tsx +1 -0
- package/src/card/CardTitle.tsx +1 -0
- package/src/card/ClickableCard.tsx +3 -1
- package/src/card/styles.ts +1 -0
- package/src/chip/Chip.tsx +4 -2
- package/src/chip/styles.ts +1 -0
- package/src/dialog/Dialog.tsx +10 -6
- package/src/dialog/DialogContent.tsx +3 -2
- package/src/dialog/DialogFooter.tsx +3 -2
- package/src/dialog/DialogHeader.tsx +2 -1
- package/src/dialog/DialogTitle.tsx +2 -1
- package/src/dialog/FixedDialog.tsx +14 -9
- package/src/dialog/NestedDialogProvider.ts +1 -0
- package/src/dialog/styles.ts +5 -4
- package/src/divider/Divider.tsx +3 -2
- package/src/divider/styles.ts +1 -0
- package/src/draggable/useDraggable.ts +25 -12
- package/src/draggable/utils.ts +2 -1
- package/src/expansion-panel/ExpansionList.tsx +3 -1
- package/src/expansion-panel/ExpansionPanel.tsx +3 -1
- package/src/expansion-panel/ExpansionPanelHeader.tsx +3 -2
- package/src/expansion-panel/expansionPanelStyles.ts +1 -0
- package/src/expansion-panel/useExpansionList.ts +2 -0
- package/src/expansion-panel/useExpansionPanels.ts +1 -0
- package/src/files/FileInput.tsx +4 -2
- package/src/files/styles.ts +1 -0
- package/src/files/useFileUpload.ts +7 -5
- package/src/files/utils.ts +31 -1
- package/src/focus/useFocusContainer.ts +10 -10
- package/src/form/Checkbox.tsx +2 -1
- package/src/form/Fieldset.tsx +2 -1
- package/src/form/Form.tsx +2 -1
- package/src/form/FormMessage.tsx +1 -0
- package/src/form/FormMessageContainer.tsx +2 -1
- package/src/form/FormMessageCounter.tsx +1 -0
- package/src/form/InputToggle.tsx +3 -1
- package/src/form/InputToggleIcon.tsx +4 -3
- package/src/form/Label.tsx +1 -0
- package/src/form/Legend.tsx +1 -0
- package/src/form/Listbox.tsx +1 -0
- package/src/form/ListboxProvider.ts +2 -0
- package/src/form/MenuItemCheckbox.tsx +5 -3
- package/src/form/MenuItemFileInput.tsx +25 -13
- package/src/form/MenuItemInputToggle.tsx +3 -1
- package/src/form/MenuItemRadio.tsx +4 -2
- package/src/form/MenuItemSwitch.tsx +2 -0
- package/src/form/MenuItemTextField.tsx +3 -1
- package/src/form/NativeSelect.tsx +3 -2
- package/src/form/OptGroup.tsx +3 -1
- package/src/form/Option.tsx +6 -4
- package/src/form/Password.tsx +5 -3
- package/src/form/Radio.tsx +2 -0
- package/src/form/ResizingTextAreaWrapper.tsx +2 -1
- package/src/form/Select.tsx +6 -4
- package/src/form/SelectedOption.tsx +1 -0
- package/src/form/Slider.tsx +13 -71
- package/src/form/SliderContainer.tsx +2 -1
- package/src/form/SliderMark.tsx +1 -0
- package/src/form/SliderMarkLabel.tsx +2 -1
- package/src/form/SliderThumb.tsx +6 -3
- package/src/form/SliderTrack.tsx +4 -3
- package/src/form/SliderValueMarks.tsx +3 -2
- package/src/form/SliderValueTooltip.tsx +2 -0
- package/src/form/Switch.tsx +2 -1
- package/src/form/SwitchTrack.tsx +2 -1
- package/src/form/TextArea.tsx +4 -2
- package/src/form/TextField.tsx +2 -1
- package/src/form/TextFieldAddon.tsx +1 -0
- package/src/form/TextFieldContainer.tsx +3 -1
- package/src/form/formMessageContainerStyles.ts +1 -0
- package/src/form/formMessageStyles.ts +1 -0
- package/src/form/inputToggleStyles.ts +1 -0
- package/src/form/menuItemInputToggleStyles.ts +1 -0
- package/src/form/nativeSelectStyles.ts +1 -0
- package/src/form/optionStyles.ts +1 -0
- package/src/form/passwordStyles.ts +1 -0
- package/src/form/selectStyles.ts +1 -0
- package/src/form/selectUtils.ts +2 -1
- package/src/form/sliderUtils.ts +8 -7
- package/src/form/switchStyles.ts +1 -0
- package/src/form/textAreaStyles.ts +2 -1
- package/src/form/textFieldContainerStyles.ts +2 -1
- package/src/form/textFieldStyles.ts +1 -0
- package/src/form/types.ts +1 -0
- package/src/form/useCheckboxGroup.ts +4 -2
- package/src/form/useCombobox.ts +4 -2
- package/src/form/useEditableCombobox.ts +2 -0
- package/src/form/useFormReset.ts +4 -2
- package/src/form/useNumberField.ts +3 -1
- package/src/form/useRadioGroup.ts +5 -3
- package/src/form/useRangeSlider.ts +3 -0
- package/src/form/useResizingTextArea.ts +5 -3
- package/src/form/useSelectCombobox.ts +2 -1
- package/src/form/useSlider.ts +3 -3
- package/src/form/useSliderDraggable.ts +71 -0
- package/src/form/useTextField.ts +40 -26
- package/src/form/useTextFieldContainerAddons.ts +4 -2
- package/src/form/validation.ts +2 -0
- package/src/hoverMode/useHoverMode.ts +76 -4
- package/src/hoverMode/useHoverModeProvider.ts +24 -12
- package/src/icon/FontIcon.tsx +3 -2
- package/src/icon/IconRotator.tsx +5 -4
- package/src/icon/MaterialIcon.tsx +3 -2
- package/src/icon/MaterialSymbol.tsx +4 -3
- package/src/icon/SVGIcon.tsx +3 -2
- package/src/icon/TextIconSpacing.tsx +2 -2
- package/src/icon/{iconConfig.tsx → config.tsx} +1 -0
- package/src/icon/materialConfig.ts +1 -0
- package/src/icon/styles.ts +2 -1
- package/src/interaction/Ripple.tsx +2 -0
- package/src/interaction/RippleContainer.tsx +1 -0
- package/src/interaction/UserInteractionModeProvider.tsx +3 -2
- package/src/interaction/useElementInteraction.tsx +39 -36
- package/src/interaction/useHigherContrastChildren.tsx +11 -8
- package/src/interaction/utils.ts +1 -0
- package/src/layout/LayoutAppBar.tsx +2 -0
- package/src/layout/LayoutNav.tsx +4 -2
- package/src/layout/LayoutWindowSplitter.tsx +4 -2
- package/src/layout/Main.tsx +4 -2
- package/src/layout/layoutNavStyles.ts +1 -0
- package/src/layout/layoutWindowSplitterStyles.ts +1 -0
- package/src/layout/mainStyles.ts +1 -0
- package/src/layout/useExpandableLayout.ts +17 -17
- package/src/layout/useHorizontalLayoutTransition.ts +2 -0
- package/src/layout/useLayoutAppBarHeight.ts +3 -1
- package/src/layout/useLayoutTree.ts +6 -3
- package/src/layout/useLayoutWindowSplitter.ts +2 -1
- package/src/layout/useMainTabIndex.ts +1 -0
- package/src/layout/useResizableLayout.ts +14 -17
- package/src/layout/useTemporaryLayout.ts +18 -11
- package/src/link/Link.tsx +3 -2
- package/src/link/SkipToMainContent.tsx +4 -2
- package/src/link/styles.ts +1 -0
- package/src/list/List.tsx +2 -1
- package/src/list/ListItem.tsx +4 -2
- package/src/list/ListItemAddon.tsx +2 -1
- package/src/list/ListItemChildren.tsx +1 -0
- package/src/list/ListItemLink.tsx +4 -2
- package/src/list/ListItemText.tsx +2 -1
- package/src/list/ListSubheader.tsx +2 -1
- package/src/list/listItemStyles.ts +1 -0
- package/src/list/listStyles.ts +1 -0
- package/src/list/types.ts +1 -0
- package/src/media-queries/AppSizeProvider.tsx +7 -5
- package/src/media-queries/useMediaQuery.ts +5 -3
- package/src/menu/DropdownMenu.tsx +5 -3
- package/src/menu/Menu.tsx +8 -6
- package/src/menu/MenuBar.tsx +2 -0
- package/src/menu/MenuButton.tsx +3 -1
- package/src/menu/MenuConfigurationProvider.tsx +4 -2
- package/src/menu/MenuItem.tsx +2 -0
- package/src/menu/MenuItemButton.tsx +3 -1
- package/src/menu/MenuItemCircularProgress.tsx +2 -1
- package/src/menu/MenuItemGroup.tsx +3 -1
- package/src/menu/MenuItemSeparator.tsx +3 -1
- package/src/menu/MenuSheet.tsx +3 -1
- package/src/menu/MenuVisibilityProvider.tsx +4 -2
- package/src/menu/MenuWidget.tsx +3 -1
- package/src/menu/MenuWidgetKeyboardProvider.tsx +2 -0
- package/src/menu/useContextMenu.ts +2 -0
- package/src/menu/useMenuBarProvider.ts +2 -0
- package/src/movement/types.ts +1 -0
- package/src/movement/useKeyboardMovementProvider.ts +2 -0
- package/src/movement/utils.ts +1 -0
- package/src/navigation/CollapsibleNavGroup.tsx +3 -1
- package/src/navigation/DefaultNavigationRenderer.tsx +1 -0
- package/src/navigation/NavGroup.tsx +2 -1
- package/src/navigation/NavItem.tsx +2 -1
- package/src/navigation/NavItemButton.tsx +4 -2
- package/src/navigation/NavItemLink.tsx +4 -2
- package/src/navigation/NavSubheader.tsx +2 -1
- package/src/navigation/Navigation.tsx +3 -2
- package/src/navigation/navGroupStyles.ts +1 -0
- package/src/navigation/navItemStyles.ts +1 -0
- package/src/navigation/types.ts +1 -0
- package/src/navigation/useActiveHeadingId.ts +8 -6
- package/src/navigation/useNavigationExpansion.ts +2 -0
- package/src/navigation/useTableOfContentsHeadings.ts +150 -0
- package/src/objectFit.ts +1 -0
- package/src/overlay/Overlay.tsx +4 -2
- package/src/overlay/overlayStyles.ts +10 -10
- package/src/portal/Portal.tsx +1 -0
- package/src/portal/PortalContainerProvider.tsx +4 -3
- package/src/positioning/createHorizontalPosition.ts +1 -1
- package/src/positioning/createVerticalPosition.ts +1 -1
- package/src/positioning/useFixedPositioning.ts +17 -12
- package/src/progress/CircularProgress.tsx +3 -2
- package/src/progress/LinearProgress.tsx +3 -2
- package/src/responsive-item/ResponsiveItem.tsx +3 -2
- package/src/responsive-item/ResponsiveItemOverlay.tsx +3 -2
- package/src/responsive-item/responsiveItemOverlayStyles.ts +1 -0
- package/src/responsive-item/responsiveItemStyles.ts +1 -0
- package/src/scroll/ScrollLock.tsx +1 -0
- package/src/scroll/useScrollLock.ts +3 -1
- package/src/searching/fuzzy.ts +1 -1
- package/src/searching/useFuzzyMatch.ts +2 -0
- package/src/segmented-button/SegmentedButton.tsx +4 -2
- package/src/segmented-button/SegmentedButtonContainer.tsx +3 -2
- package/src/segmented-button/segmentedButtonContainerStyles.ts +1 -0
- package/src/segmented-button/segmentedButtonStyles.ts +1 -0
- package/src/sheet/Sheet.tsx +4 -2
- package/src/sheet/styles.ts +3 -3
- package/src/snackbar/DefaultToastRenderer.tsx +5 -3
- package/src/snackbar/Snackbar.tsx +4 -2
- package/src/snackbar/Toast.tsx +4 -2
- package/src/snackbar/ToastActionButton.tsx +2 -0
- package/src/snackbar/ToastCloseButton.tsx +3 -1
- package/src/snackbar/ToastContent.tsx +3 -1
- package/src/snackbar/ToastManager.tsx +1 -0
- package/src/snackbar/ToastManagerProvider.tsx +4 -3
- package/src/snackbar/snackbarStyles.ts +1 -0
- package/src/snackbar/toastContentStyles.ts +1 -0
- package/src/snackbar/toastStyles.ts +2 -1
- package/src/snackbar/useCurrentToastActions.ts +1 -0
- package/src/storage/internalUtils.ts +43 -0
- package/src/storage/types.ts +88 -0
- package/src/storage/useStorage.ts +277 -0
- package/src/storage/utils.ts +156 -0
- package/src/suspense/CircularProgressSuspense.tsx +2 -1
- package/src/suspense/NullSuspense.tsx +1 -1
- package/src/table/StickyTableSection.tsx +3 -1
- package/src/table/Table.tsx +3 -1
- package/src/table/TableBody.tsx +3 -1
- package/src/table/TableCell.tsx +4 -2
- package/src/table/TableCellContent.tsx +2 -1
- package/src/table/TableCheckbox.tsx +3 -1
- package/src/table/TableConfigurationProvider.tsx +2 -0
- package/src/table/TableContainer.tsx +4 -2
- package/src/table/TableContainerProvider.tsx +2 -1
- package/src/table/TableFooter.tsx +3 -1
- package/src/table/TableHeader.tsx +3 -1
- package/src/table/TableRadio.tsx +3 -1
- package/src/table/TableRow.tsx +3 -1
- package/src/table/tableCellStyles.ts +1 -0
- package/src/table/tableFooterStyles.ts +1 -0
- package/src/table/tableHeaderStyles.ts +1 -0
- package/src/table/tableRowStyles.ts +1 -0
- package/src/table/tableStyles.ts +1 -0
- package/src/table/useStickyTableSection.tsx +4 -2
- package/src/table/useTableSectionConfig.ts +2 -0
- package/src/tabs/SimpleTabPanel.tsx +35 -0
- package/src/tabs/SimpleTabPanels.tsx +28 -0
- package/src/tabs/Tab.tsx +4 -3
- package/src/tabs/TabList.tsx +38 -51
- package/src/tabs/TabListScrollButton.tsx +6 -3
- package/src/tabs/tabIndicatorStyles.ts +1 -0
- package/src/tabs/tabListScrollButtonStyles.ts +1 -0
- package/src/tabs/tabListStyles.ts +22 -2
- package/src/tabs/tabStyles.ts +8 -0
- package/src/tabs/types.ts +30 -0
- package/src/tabs/useMaxTabPanelHeight.ts +138 -0
- package/src/tabs/useTabList.ts +45 -8
- package/src/tabs/useTabs.ts +64 -79
- package/src/tabs/utils.ts +9 -0
- package/src/test-utils/drag.ts +10 -2
- package/src/test-utils/index.ts +6 -5
- package/src/test-utils/jest-globals/index.ts +4 -0
- package/src/test-utils/jest-globals/match-media.ts +41 -0
- package/src/test-utils/jest-globals/resize-observer.ts +11 -0
- package/src/test-utils/{jest-setup.ts → jest-globals/setup.ts} +4 -2
- package/src/test-utils/{timers.ts → jest-globals/timers.ts} +2 -2
- package/src/test-utils/jest-globals/uploadMenuItemFileInput.ts +52 -0
- package/src/test-utils/{ResizeObserver.ts → mocks/ResizeObserver.ts} +25 -59
- package/src/test-utils/mocks/match-media-implementation.ts +111 -0
- package/src/test-utils/mocks/match-media.ts +63 -0
- package/src/test-utils/polyfills/IntersectionObserver.ts +1 -1
- package/src/test-utils/polyfills/ResizeObserver.ts +1 -1
- package/src/test-utils/polyfills/matchMedia.ts +1 -1
- package/src/test-utils/queries/index.ts +2 -0
- package/src/test-utils/queries/select.ts +116 -0
- package/src/test-utils/queries/slider.ts +247 -0
- package/src/test-utils/queries/types.ts +13 -0
- package/src/test-utils/render.tsx +2 -1
- package/src/test-utils/utils/createFileList.ts +27 -0
- package/src/test-utils/utils/createResizeObserverEntry.ts +47 -0
- package/src/test-utils/vitest/index.ts +4 -0
- package/src/test-utils/vitest/match-media.ts +41 -0
- package/src/test-utils/vitest/resize-observer.ts +11 -0
- package/src/test-utils/vitest/setup.ts +15 -0
- package/src/test-utils/vitest/timers.ts +48 -0
- package/src/test-utils/vitest/uploadMenuItemFileInput.ts +52 -0
- package/src/theme/LocalStorageColorSchemeProvider.tsx +30 -30
- package/src/theme/ThemeProvider.tsx +9 -7
- package/src/theme/isColorScheme.ts +8 -6
- package/src/theme/types.ts +11 -23
- package/src/theme/useCSSVariables.ts +10 -15
- package/src/theme/useColorScheme.ts +19 -15
- package/src/theme/useColorSchemeMetaTag.ts +17 -2
- package/src/theme/useColorSchemeProvider.ts +36 -37
- package/src/theme/{usePrefersDarkScheme.ts → usePrefersDarkTheme.ts} +1 -0
- package/src/tooltip/Tooltip.tsx +3 -1
- package/src/tooltip/TooltipHoverModeProvider.tsx +6 -4
- package/src/tooltip/tooltipStyles.ts +2 -1
- package/src/tooltip/useTooltip.ts +15 -10
- package/src/tooltip/useTooltipPosition.ts +2 -0
- package/src/transition/CSSTransition.tsx +3 -1
- package/src/transition/Collapse.tsx +4 -2
- package/src/transition/CrossFade.tsx +5 -3
- package/src/transition/ScaleTransition.tsx +4 -2
- package/src/transition/SkeletonPlaceholder.tsx +4 -2
- package/src/transition/Slide.tsx +3 -1
- package/src/transition/SlideContainer.tsx +2 -1
- package/src/transition/collapseStyles.ts +1 -0
- package/src/transition/config.ts +4 -1
- package/src/transition/maxWidthTransition.ts +7 -0
- package/src/transition/skeletonPlaceholderUtils.ts +1 -0
- package/src/transition/types.ts +0 -2
- package/src/transition/useCSSTransition.ts +10 -4
- package/src/transition/useCarousel.ts +2 -0
- package/src/transition/useCollapseTransition.ts +20 -14
- package/src/transition/useCrossFadeTransition.ts +1 -0
- package/src/transition/useMaxWidthTransition.ts +11 -0
- package/src/transition/useScaleTransition.ts +12 -10
- package/src/transition/useSkeletonPlaceholder.ts +20 -2
- package/src/transition/useSlideTransition.ts +14 -16
- package/src/transition/useTransition.ts +3 -1
- package/src/tree/DefaultTreeItemRenderer.tsx +1 -0
- package/src/tree/Tree.tsx +3 -1
- package/src/tree/TreeGroup.tsx +3 -1
- package/src/tree/TreeItem.tsx +4 -2
- package/src/tree/TreeItemExpander.tsx +5 -3
- package/src/tree/TreeProvider.tsx +4 -2
- package/src/tree/styles.ts +1 -0
- package/src/tree/types.ts +1 -0
- package/src/tree/useTree.ts +3 -2
- package/src/tree/useTreeExpansion.ts +1 -0
- package/src/tree/useTreeItems.ts +4 -3
- package/src/tree/useTreeMovement.ts +2 -0
- package/src/tree/useTreeSelection.ts +1 -0
- package/src/typography/SrOnly.tsx +2 -1
- package/src/typography/TextContainer.tsx +3 -2
- package/src/typography/Typography.tsx +3 -2
- package/src/typography/WritingDirectionProvider.tsx +4 -2
- package/src/typography/textContainerStyles.ts +1 -0
- package/src/typography/typographyStyles.ts +2 -1
- package/src/useAsyncFunction.ts +23 -0
- package/src/useDebouncedFunction.ts +2 -0
- package/src/useDropzone.ts +50 -34
- package/src/useElementSize.ts +7 -5
- package/src/useEnsuredId.ts +1 -1
- package/src/useEnsuredRef.ts +3 -1
- package/src/useEnsuredState.ts +1 -0
- package/src/useHtmlClassName.ts +12 -0
- package/src/useIntersectionObserver.ts +5 -3
- package/src/useIsomorphicLayoutEffect.ts +1 -0
- package/src/useMutationObserver.ts +7 -6
- package/src/useOrientation.ts +1 -1
- package/src/usePageInactive.ts +8 -2
- package/src/useReadonlySet.ts +7 -4
- package/src/useResizeListener.ts +8 -4
- package/src/useResizeObserver.ts +4 -3
- package/src/useThrottledFunction.ts +2 -0
- package/src/useToggle.ts +5 -3
- package/src/useUnmounted.ts +2 -0
- package/src/useWindowSize.ts +4 -2
- package/src/utils/RenderRecursively.tsx +88 -32
- package/src/utils/alphaNumericSort.ts +10 -4
- package/src/utils/bem.ts +58 -26
- package/src/utils/getRangeDefaultValue.ts +1 -1
- package/src/utils/isElementVisible.ts +1 -1
- package/src/utils/loop.ts +2 -0
- package/src/utils/parseCssLengthUnit.ts +1 -1
- package/src/utils/wait.ts +6 -5
- package/src/window-splitter/WindowSplitter.tsx +2 -2
- package/src/window-splitter/styles.ts +1 -0
- package/src/window-splitter/useWindowSplitter.ts +7 -2
- package/dist/icon/iconConfig.js.map +0 -1
- package/dist/test-utils/IntersectionObserver.js.map +0 -1
- package/dist/test-utils/ResizeObserver.js.map +0 -1
- package/dist/test-utils/jest-setup.d.ts +0 -1
- package/dist/test-utils/jest-setup.js.map +0 -1
- package/dist/test-utils/matchMedia.d.ts +0 -97
- package/dist/test-utils/matchMedia.js +0 -112
- package/dist/test-utils/matchMedia.js.map +0 -1
- package/dist/test-utils/timers.js.map +0 -1
- package/dist/theme/usePrefersDarkScheme.js.map +0 -1
- package/dist/useLocalStorage.d.ts +0 -368
- package/dist/useLocalStorage.js +0 -377
- package/dist/useLocalStorage.js.map +0 -1
- package/src/test-utils/README.md +0 -150
- package/src/test-utils/matchMedia.ts +0 -194
- package/src/useLocalStorage.ts +0 -584
- /package/dist/icon/{iconConfig.d.ts → config.d.ts} +0 -0
- /package/dist/test-utils/{IntersectionObserver.d.ts → mocks/IntersectionObserver.d.ts} +0 -0
- /package/dist/test-utils/{IntersectionObserver.js → mocks/IntersectionObserver.js} +0 -0
- /package/dist/theme/{usePrefersDarkScheme.d.ts → usePrefersDarkTheme.d.ts} +0 -0
- /package/src/test-utils/{IntersectionObserver.ts → mocks/IntersectionObserver.ts} +0 -0
|
@@ -5,17 +5,15 @@ import { useLayoutWindowSplitter } from "./useLayoutWindowSplitter.js";
|
|
|
5
5
|
/**
|
|
6
6
|
* @example Main Usage
|
|
7
7
|
* ```tsx
|
|
8
|
-
* import {
|
|
9
|
-
*
|
|
10
|
-
*
|
|
11
|
-
*
|
|
12
|
-
*
|
|
13
|
-
*
|
|
14
|
-
*
|
|
15
|
-
*
|
|
16
|
-
*
|
|
17
|
-
* } from "@react-md/core";
|
|
18
|
-
* import type { ReactElement, ReactNode } from "react";
|
|
8
|
+
* import { AppBarTitle } from "@react-md/core/app-bar/AppBarTitle";
|
|
9
|
+
* import { Button } from "@react-md/core/button/Button";
|
|
10
|
+
* import { LayoutAppBar } from "@react-md/core/layout/LayoutAppBar";
|
|
11
|
+
* import { LayoutNav } from "@react-md/core/layout/LayoutNav";
|
|
12
|
+
* import { LayoutWindowSplitter } from "@react-md/core/layout/LayoutWindowSplitter";
|
|
13
|
+
* import { Main } from "@react-md/core/layout/Main";
|
|
14
|
+
* import { useResizableLayout } from "@react-md/core/layout/useResizableLayout";
|
|
15
|
+
* import { Sheet } from "@react-md/core/sheet/Sheet";
|
|
16
|
+
* import { type ReactElement, type ReactNode } from "react";
|
|
19
17
|
*
|
|
20
18
|
* import { CustomNavigation } from "./CustomNavigation";
|
|
21
19
|
*
|
|
@@ -44,7 +42,7 @@ import { useLayoutWindowSplitter } from "./useLayoutWindowSplitter.js";
|
|
|
44
42
|
* windowSplitterProps,
|
|
45
43
|
* } = useResizableLayout({ pathname });
|
|
46
44
|
*
|
|
47
|
-
* return
|
|
45
|
+
* return (
|
|
48
46
|
* <>
|
|
49
47
|
* <LayoutAppBar {...appBarProps}>
|
|
50
48
|
* <Button {...navToggleProps} />
|
|
@@ -61,7 +59,7 @@ import { useLayoutWindowSplitter } from "./useLayoutWindowSplitter.js";
|
|
|
61
59
|
* )}
|
|
62
60
|
* <Main {...mainProps}>{children}</Main>
|
|
63
61
|
* </>
|
|
64
|
-
*
|
|
62
|
+
* );
|
|
65
63
|
* }
|
|
66
64
|
* ```
|
|
67
65
|
*
|
|
@@ -82,7 +80,7 @@ import { useLayoutWindowSplitter } from "./useLayoutWindowSplitter.js";
|
|
|
82
80
|
* windowSplitterProps,
|
|
83
81
|
* } = useResizableLayout({ pathname });
|
|
84
82
|
*
|
|
85
|
-
* return
|
|
83
|
+
* return (
|
|
86
84
|
* <>
|
|
87
85
|
* <LayoutAppBar {...appBarProps}>
|
|
88
86
|
* <Button {...navToggleProps} />
|
|
@@ -107,8 +105,7 @@ import { useLayoutWindowSplitter } from "./useLayoutWindowSplitter.js";
|
|
|
107
105
|
* )}
|
|
108
106
|
* <Main {...mainProps}>{children}</Main>
|
|
109
107
|
* </>
|
|
110
|
-
*
|
|
111
|
-
*
|
|
108
|
+
* )
|
|
112
109
|
* ```
|
|
113
110
|
*
|
|
114
111
|
* @since 6.0.0
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/layout/useResizableLayout.ts"],"sourcesContent":["import { useEnsuredId } from \"../useEnsuredId.js\";\nimport { DISPLAY_NONE_CLASS } from \"../utils/isElementVisible.js\";\nimport { type LayoutWindowSplitterProps } from \"./LayoutWindowSplitter.js\";\nimport {\n type ExpandableLayoutImplementation,\n type ExpandableLayoutOptions,\n type ProvidedLayoutNavProps,\n} from \"./useExpandableLayout.js\";\nimport { useExpandableLayout } from \"./useExpandableLayout.js\";\nimport {\n
|
|
1
|
+
{"version":3,"sources":["../../src/layout/useResizableLayout.ts"],"sourcesContent":["import { useEnsuredId } from \"../useEnsuredId.js\";\nimport { DISPLAY_NONE_CLASS } from \"../utils/isElementVisible.js\";\nimport { type LayoutWindowSplitterProps } from \"./LayoutWindowSplitter.js\";\nimport {\n type ExpandableLayoutImplementation,\n type ExpandableLayoutOptions,\n type ProvidedLayoutNavProps,\n} from \"./useExpandableLayout.js\";\nimport { useExpandableLayout } from \"./useExpandableLayout.js\";\nimport {\n type LayoutWindowSplitterOptions,\n useLayoutWindowSplitter,\n} from \"./useLayoutWindowSplitter.js\";\n\n/**\n * @since 6.0.0\n */\nexport interface ResizableLayoutOptions\n extends ExpandableLayoutOptions,\n LayoutWindowSplitterOptions {\n /**\n * This id will be used as the `aria-controls` prop for the\n * `LayoutWindowSplitter` and should be applied to the `LayoutNav` as an `id`.\n *\n * @defaultValue `\"layout-nav\" + useId()`\n */\n navId?: string;\n}\n\n/**\n * @since 6.0.0\n */\nexport interface ProvidedResizableLayoutNavProps\n extends ProvidedLayoutNavProps {\n id: string;\n}\n\n/**\n * @since 6.0.0\n */\nexport interface ResizableLayoutImplementation\n extends ExpandableLayoutImplementation {\n expandableNavProps: ProvidedResizableLayoutNavProps;\n windowSplitterProps: LayoutWindowSplitterProps;\n}\n\n/**\n * @example Main Usage\n * ```tsx\n * import { AppBarTitle } from \"@react-md/core/app-bar/AppBarTitle\";\n * import { Button } from \"@react-md/core/button/Button\";\n * import { LayoutAppBar } from \"@react-md/core/layout/LayoutAppBar\";\n * import { LayoutNav } from \"@react-md/core/layout/LayoutNav\";\n * import { LayoutWindowSplitter } from \"@react-md/core/layout/LayoutWindowSplitter\";\n * import { Main } from \"@react-md/core/layout/Main\";\n * import { useResizableLayout } from \"@react-md/core/layout/useResizableLayout\";\n * import { Sheet } from \"@react-md/core/sheet/Sheet\";\n * import { type ReactElement, type ReactNode } from \"react\";\n *\n * import { CustomNavigation } from \"./CustomNavigation\";\n *\n * export interface LayoutProps {\n * children: ReactNode;\n * }\n *\n * export function Layout(props: LayoutProps): ReactElement {\n * const { children } = props;\n *\n * // choose whichever one for your app\n * // nextjs app dir\n * const pathname = usePathname();\n * // nextjs pages\n * const { pathname } = useRouter();\n * // react router\n * const { pathname } = useHistory();\n *\n * const {\n * temporary,\n * appBarProps,\n * expandableNavProps,\n * mainProps,\n * navToggleProps,\n * temporaryNavProps,\n * windowSplitterProps,\n * } = useResizableLayout({ pathname });\n *\n * return (\n * <>\n * <LayoutAppBar {...appBarProps}>\n * <Button {...navToggleProps} />\n * <AppBarTitle>Hello, world!</AppBarTitle>\n * </LayoutAppBar>\n * <LayoutNav {...expandableNavProps}>\n * <CustomNavigation />\n * </LayoutNav>\n * <LayoutWindowSplitter {...windowSplitterProps} />\n * {temporary && (\n * <Sheet {...temporaryNavProps}>\n * <CustomNavigation />\n * </Sheet>\n * )}\n * <Main {...mainProps}>{children}</Main>\n * </>\n * );\n * }\n * ```\n *\n * If you have a large navigation panel, you can conditionally render the\n * `LayoutNav` with the `persistent` boolean returned by the hook which will\n * ensure that the DOM has rehydrated before unmounting to prevent SSR errors.\n *\n * @example Conditionally Rendering\n * ```diff\n * const {\n * temporary,\n * + persistent,\n * appBarProps,\n * expandableNavProps,\n * mainProps,\n * navToggleProps,\n * temporaryNavProps,\n * windowSplitterProps,\n * } = useResizableLayout({ pathname });\n *\n * return (\n * <>\n * <LayoutAppBar {...appBarProps}>\n * <Button {...navToggleProps} />\n * <AppBarTitle>Hello, world!</AppBarTitle>\n * </LayoutAppBar>\n * - <LayoutNav {...expandableNavProps}>\n * - <CustomNavigation />\n * - </LayoutNav>\n * - <LayoutWindowSplitter {...windowSplitterProps} />\n * + {persistent && (\n * + <>\n * + <LayoutNav {...expandableNavProps}>\n * + <CustomNavigation />\n * + </LayoutNav>\n * + <LayoutWindowSplitter {...windowSplitterProps} />\n * + </>\n * + )}\n * {temporary && (\n * <Sheet {...temporaryNavProps}>\n * <CustomNavigation />\n * </Sheet>\n * )}\n * <Main {...mainProps}>{children}</Main>\n * </>\n * )\n * ```\n *\n * @since 6.0.0\n */\nexport function useResizableLayout(\n options: ResizableLayoutOptions\n): ResizableLayoutImplementation {\n const {\n navId: propNavId,\n pathname,\n appBarPosition = \"fixed\",\n fullHeightNav = false,\n defaultVisible,\n defaultExpanded,\n ...splitterOptions\n } = options;\n const navId = useEnsuredId(propNavId, \"layout-nav\");\n const { splitterProps, ...windowSplitter } =\n useLayoutWindowSplitter(splitterOptions);\n const expandableLayout = useExpandableLayout({\n pathname,\n appBarPosition,\n fullHeightNav,\n defaultExpanded,\n defaultVisible,\n });\n const { expandableNavProps, expanded } = expandableLayout;\n\n return {\n ...expandableLayout,\n ...windowSplitter,\n expandableNavProps: {\n id: navId,\n ...expandableNavProps,\n },\n windowSplitterProps: {\n ...splitterProps,\n \"aria-controls\": navId,\n appBarOffset: !fullHeightNav,\n className: (!expanded && DISPLAY_NONE_CLASS) || undefined,\n },\n };\n}\n"],"names":["useEnsuredId","DISPLAY_NONE_CLASS","useExpandableLayout","useLayoutWindowSplitter","useResizableLayout","options","navId","propNavId","pathname","appBarPosition","fullHeightNav","defaultVisible","defaultExpanded","splitterOptions","splitterProps","windowSplitter","expandableLayout","expandableNavProps","expanded","id","windowSplitterProps","appBarOffset","className","undefined"],"mappings":"AAAA,SAASA,YAAY,QAAQ,qBAAqB;AAClD,SAASC,kBAAkB,QAAQ,+BAA+B;AAOlE,SAASC,mBAAmB,QAAQ,2BAA2B;AAC/D,SAEEC,uBAAuB,QAClB,+BAA+B;AAkCtC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2GC,GACD,OAAO,SAASC,mBACdC,OAA+B;IAE/B,MAAM,EACJC,OAAOC,SAAS,EAChBC,QAAQ,EACRC,iBAAiB,OAAO,EACxBC,gBAAgB,KAAK,EACrBC,cAAc,EACdC,eAAe,EACf,GAAGC,iBACJ,GAAGR;IACJ,MAAMC,QAAQN,aAAaO,WAAW;IACtC,MAAM,EAAEO,aAAa,EAAE,GAAGC,gBAAgB,GACxCZ,wBAAwBU;IAC1B,MAAMG,mBAAmBd,oBAAoB;QAC3CM;QACAC;QACAC;QACAE;QACAD;IACF;IACA,MAAM,EAAEM,kBAAkB,EAAEC,QAAQ,EAAE,GAAGF;IAEzC,OAAO;QACL,GAAGA,gBAAgB;QACnB,GAAGD,cAAc;QACjBE,oBAAoB;YAClBE,IAAIb;YACJ,GAAGW,kBAAkB;QACvB;QACAG,qBAAqB;YACnB,GAAGN,aAAa;YAChB,iBAAiBR;YACjBe,cAAc,CAACX;YACfY,WAAW,AAAC,CAACJ,YAAYjB,sBAAuBsB;QAClD;IACF;AACF"}
|
|
@@ -4,6 +4,9 @@ import { type ButtonProps } from "../button/Button.js";
|
|
|
4
4
|
import { type SheetProps } from "../sheet/Sheet.js";
|
|
5
5
|
import { type CssPosition, type UseStateInitializer } from "../types.js";
|
|
6
6
|
import { type MainProps } from "./Main.js";
|
|
7
|
+
/**
|
|
8
|
+
* @since 6.0.0
|
|
9
|
+
*/
|
|
7
10
|
export interface TemporaryLayoutOptions {
|
|
8
11
|
/**
|
|
9
12
|
* This is used to automatically hide the temporary navigation whenever the
|
|
@@ -44,17 +47,19 @@ export interface TemporaryLayoutImplementation {
|
|
|
44
47
|
temporaryNavProps: ProvidedTemporaryLayoutNavProps;
|
|
45
48
|
}
|
|
46
49
|
/**
|
|
50
|
+
* The `useTemporaryLayout` hook is used to create a layout where the main
|
|
51
|
+
* navigation is hidden in a `Sheet` until a user clicks a button to show the
|
|
52
|
+
* navigation.
|
|
53
|
+
*
|
|
47
54
|
* @example
|
|
48
55
|
* ```tsx
|
|
49
|
-
* import {
|
|
50
|
-
*
|
|
51
|
-
*
|
|
52
|
-
*
|
|
53
|
-
*
|
|
54
|
-
*
|
|
55
|
-
*
|
|
56
|
-
* } from "@react-md/core";
|
|
57
|
-
* import type { ReactElement, ReactNode } from "react";
|
|
56
|
+
* import { AppBar } from "@react-md/core/app-bar/AppBar";
|
|
57
|
+
* import { AppBarTitle } from "@react-md/core/app-bar/AppBarTitle";
|
|
58
|
+
* import { Button } from "@react-md/core/button/Button";
|
|
59
|
+
* import { useTemporaryLayout } from "@react-md/core/layout/useTemporaryLayout";
|
|
60
|
+
* import { Main } from "@react-md/core/layout/Main";
|
|
61
|
+
* import { Sheet } from "@react-md/core/sheet/Sheet";
|
|
62
|
+
* import { type ReactElement, type ReactNode } from "react";
|
|
58
63
|
*
|
|
59
64
|
* import { CustomNavigation } from "./CustomNavigation.jsx";
|
|
60
65
|
*
|
|
@@ -1,19 +1,21 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { useEffect } from "react";
|
|
3
|
-
import { getIcon } from "../icon/
|
|
3
|
+
import { getIcon } from "../icon/config.js";
|
|
4
4
|
import { useToggle } from "../useToggle.js";
|
|
5
5
|
/**
|
|
6
|
+
* The `useTemporaryLayout` hook is used to create a layout where the main
|
|
7
|
+
* navigation is hidden in a `Sheet` until a user clicks a button to show the
|
|
8
|
+
* navigation.
|
|
9
|
+
*
|
|
6
10
|
* @example
|
|
7
11
|
* ```tsx
|
|
8
|
-
* import {
|
|
9
|
-
*
|
|
10
|
-
*
|
|
11
|
-
*
|
|
12
|
-
*
|
|
13
|
-
*
|
|
14
|
-
*
|
|
15
|
-
* } from "@react-md/core";
|
|
16
|
-
* import type { ReactElement, ReactNode } from "react";
|
|
12
|
+
* import { AppBar } from "@react-md/core/app-bar/AppBar";
|
|
13
|
+
* import { AppBarTitle } from "@react-md/core/app-bar/AppBarTitle";
|
|
14
|
+
* import { Button } from "@react-md/core/button/Button";
|
|
15
|
+
* import { useTemporaryLayout } from "@react-md/core/layout/useTemporaryLayout";
|
|
16
|
+
* import { Main } from "@react-md/core/layout/Main";
|
|
17
|
+
* import { Sheet } from "@react-md/core/sheet/Sheet";
|
|
18
|
+
* import { type ReactElement, type ReactNode } from "react";
|
|
17
19
|
*
|
|
18
20
|
* import { CustomNavigation } from "./CustomNavigation.jsx";
|
|
19
21
|
*
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/layout/useTemporaryLayout.ts"],"sourcesContent":["\"use client\";\nimport {
|
|
1
|
+
{"version":3,"sources":["../../src/layout/useTemporaryLayout.ts"],"sourcesContent":["\"use client\";\n\nimport { type PropsWithChildren, useEffect } from \"react\";\n\nimport { type AppBarProps } from \"../app-bar/AppBar.js\";\nimport { type ButtonProps } from \"../button/Button.js\";\nimport { getIcon } from \"../icon/config.js\";\nimport { type SheetProps } from \"../sheet/Sheet.js\";\nimport { type CssPosition, type UseStateInitializer } from \"../types.js\";\nimport { useToggle } from \"../useToggle.js\";\nimport { type MainProps } from \"./Main.js\";\n\n/**\n * @since 6.0.0\n */\nexport interface TemporaryLayoutOptions {\n /**\n * This is used to automatically hide the temporary navigation whenever the\n * route changes. Set this to `null` if you want to handle closing yourself.\n */\n pathname: string | null;\n\n /** @defaultValue `\"fixed\"` */\n appBarPosition?: CssPosition;\n\n /** @defaultValue `false` */\n defaultVisible?: UseStateInitializer<boolean>;\n}\n\n/**\n * @since 6.0.0\n */\nexport type ProvidedLayoutNavToggleProps = PropsWithChildren<\n Pick<Required<ButtonProps>, \"aria-label\" | \"buttonType\" | \"onClick\">\n>;\n\n/**\n * @since 6.0.0\n */\nexport type ProvidedTemporaryLayoutNavProps = Pick<\n Required<SheetProps>,\n \"aria-label\" | \"visible\" | \"onRequestClose\"\n>;\n\n/**\n * @since 6.0.0\n */\nexport type ProvidedTemporaryLayoutMainProps = Required<\n Pick<MainProps, \"appBarOffset\">\n>;\n\n/**\n * @since 6.0.0\n */\nexport type ProvidedTemporaryLayoutAppBarProps = Required<\n Pick<AppBarProps, \"position\">\n>;\n\n/**\n * @since 6.0.0\n */\nexport interface TemporaryLayoutImplementation {\n visible: boolean;\n showTemporaryNav: () => void;\n hideTemporaryNav: () => void;\n appBarProps: ProvidedTemporaryLayoutAppBarProps;\n mainProps: ProvidedTemporaryLayoutMainProps;\n navToggleProps: ProvidedLayoutNavToggleProps;\n temporaryNavProps: ProvidedTemporaryLayoutNavProps;\n}\n\n/**\n * The `useTemporaryLayout` hook is used to create a layout where the main\n * navigation is hidden in a `Sheet` until a user clicks a button to show the\n * navigation.\n *\n * @example\n * ```tsx\n * import { AppBar } from \"@react-md/core/app-bar/AppBar\";\n * import { AppBarTitle } from \"@react-md/core/app-bar/AppBarTitle\";\n * import { Button } from \"@react-md/core/button/Button\";\n * import { useTemporaryLayout } from \"@react-md/core/layout/useTemporaryLayout\";\n * import { Main } from \"@react-md/core/layout/Main\";\n * import { Sheet } from \"@react-md/core/sheet/Sheet\";\n * import { type ReactElement, type ReactNode } from \"react\";\n *\n * import { CustomNavigation } from \"./CustomNavigation.jsx\";\n *\n * export interface LayoutProps {\n * children: ReactNode;\n * }\n *\n * export function Layout(props: LayoutProps): ReactElement {\n * const { children } = props;\n *\n * // choose whichever one for your app\n * // nextjs app dir\n * const pathname = usePathname();\n * // nextjs pages\n * const { pathname } = useRouter();\n * // react router\n * const { pathname } = useHistory();\n *\n * const {\n * mainProps,\n * navToggleProps,\n * temporaryNavProps,\n * } = useTemporaryLayout({ pathname });\n *\n * return (\n * <>\n * <AppBar position=\"fixed\">\n * <Button {...navToggleProps} />\n * <AppBarTitle>Hello, world!</AppBarTitle>\n * </AppBar>\n * <Main {...mainProps}>{children}</Main>\n * <Sheet {...temporaryNavProps}>\n * <CustomNavigation />\n * </Sheet>\n * </>\n * );\n * }\n * ```\n *\n * @since 6.0.0\n */\nexport function useTemporaryLayout(\n options: TemporaryLayoutOptions\n): TemporaryLayoutImplementation {\n const {\n pathname,\n defaultVisible = false,\n appBarPosition = \"fixed\",\n } = options;\n\n const menuIcon = getIcon(\"menu\");\n const {\n toggled: visible,\n enable: showTemporaryNav,\n disable: hideTemporaryNav,\n } = useToggle(defaultVisible);\n\n // hide the temporary nav whenever the route changes\n useEffect(() => {\n if (pathname !== null) {\n hideTemporaryNav();\n }\n }, [hideTemporaryNav, pathname]);\n\n return {\n visible,\n showTemporaryNav,\n hideTemporaryNav,\n appBarProps: {\n position: appBarPosition,\n },\n mainProps: {\n appBarOffset: appBarPosition !== \"static\",\n },\n temporaryNavProps: {\n \"aria-label\": \"Navigation\",\n visible,\n onRequestClose: hideTemporaryNav,\n },\n navToggleProps: {\n \"aria-label\": \"Navigation\",\n buttonType: \"icon\",\n children: menuIcon,\n onClick() {\n showTemporaryNav();\n },\n },\n };\n}\n"],"names":["useEffect","getIcon","useToggle","useTemporaryLayout","options","pathname","defaultVisible","appBarPosition","menuIcon","toggled","visible","enable","showTemporaryNav","disable","hideTemporaryNav","appBarProps","position","mainProps","appBarOffset","temporaryNavProps","onRequestClose","navToggleProps","buttonType","children","onClick"],"mappings":"AAAA;AAEA,SAAiCA,SAAS,QAAQ,QAAQ;AAI1D,SAASC,OAAO,QAAQ,oBAAoB;AAG5C,SAASC,SAAS,QAAQ,kBAAkB;AA8D5C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAsDC,GACD,OAAO,SAASC,mBACdC,OAA+B;IAE/B,MAAM,EACJC,QAAQ,EACRC,iBAAiB,KAAK,EACtBC,iBAAiB,OAAO,EACzB,GAAGH;IAEJ,MAAMI,WAAWP,QAAQ;IACzB,MAAM,EACJQ,SAASC,OAAO,EAChBC,QAAQC,gBAAgB,EACxBC,SAASC,gBAAgB,EAC1B,GAAGZ,UAAUI;IAEd,oDAAoD;IACpDN,UAAU;QACR,IAAIK,aAAa,MAAM;YACrBS;QACF;IACF,GAAG;QAACA;QAAkBT;KAAS;IAE/B,OAAO;QACLK;QACAE;QACAE;QACAC,aAAa;YACXC,UAAUT;QACZ;QACAU,WAAW;YACTC,cAAcX,mBAAmB;QACnC;QACAY,mBAAmB;YACjB,cAAc;YACdT;YACAU,gBAAgBN;QAClB;QACAO,gBAAgB;YACd,cAAc;YACdC,YAAY;YACZC,UAAUf;YACVgB;gBACEZ;YACF;QACF;IACF;AACF"}
|
package/dist/link/Link.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/link/Link.tsx"],"sourcesContent":["import {\n
|
|
1
|
+
{"version":3,"sources":["../../src/link/Link.tsx"],"sourcesContent":["import {\n type AnchorHTMLAttributes,\n type ForwardRefExoticComponent,\n forwardRef,\n} from \"react\";\n\nimport { type LinkClassNameOptions, link } from \"./styles.js\";\n\ndeclare module \"react\" {\n interface CSSProperties {\n \"--rmd-link-color\"?: string;\n \"--rmd-link-visited-color\"?: string;\n \"--rmd-link-hover-color\"?: string;\n }\n}\n\n/**\n * @since 6.0.0\n */\nexport type CustomLinkComponent =\n | ForwardRefExoticComponent<{ href: string }>\n | ForwardRefExoticComponent<{ to: string }>\n | \"a\";\n\n/**\n * @since 6.0.0 Removed the `preventMaliciousTarget` prop since browsers\n * default to `rel=noopener` after updating the {@link https://github.com/whatwg/html/issues/4078|spec}.\n * @since 6.0.0 Removed the `component` prop since all you need for link\n * behavior is `className=\"rmd-link\"`.\n * @since 6.0.0 The `href` prop is required.\n * @since 6.0.0 Renamed `flexCentered` to `flex`.\n */\nexport interface LinkProps\n extends AnchorHTMLAttributes<HTMLAnchorElement>,\n LinkClassNameOptions {\n /**\n * All links **must** have a valid href.\n */\n href: string;\n\n /**\n * Set this to `true` if your link contains icons that should be centered and\n * spaced with additional text. This is not used by default so that links can\n * correctly line wrap while rendered within paragraphs of text.\n *\n * @defaultValue `false`\n */\n flex?: boolean;\n}\n\n/**\n * @example Simple Example\n * ```tsx\n * import { Link, Typography } from \"@react-md/core\";\n * import type { ReactElement } from \"react\";\n *\n * function Element(): ReactElement {\n * return (\n * <Typography>\n * Here is a paragraph of text with a {\" \"}\n * <Link href=\"/some-url\">link to some content</Link>.\n * </Typography>\n * );\n * }\n * ```\n *\n *\n * @since 6.0.0 Removed the `preventMaliciousTarget` prop since browsers\n * default to `rel=noopener` after updating the {@link https://github.com/whatwg/html/issues/4078|spec}.\n * @since 6.0.0 Removed the `component` prop since all you need for link\n * behavior is `className=\"rmd-link\"`.\n * @since 6.0.0 The `href` prop is required.\n * @since 6.0.0 Renamed `flexCentered` to `flex`.\n */\nexport const Link = forwardRef<HTMLAnchorElement, LinkProps>(\n function Link(props, ref) {\n const { className, flex, children, ...remaining } = props;\n\n return (\n <a {...remaining} ref={ref} className={link({ flex, className })}>\n {children}\n </a>\n );\n }\n);\n"],"names":["forwardRef","link","Link","props","ref","className","flex","children","remaining","a"],"mappings":";AAAA,SAGEA,UAAU,QACL,QAAQ;AAEf,SAAoCC,IAAI,QAAQ,cAAc;AA4C9D;;;;;;;;;;;;;;;;;;;;;;;CAuBC,GACD,OAAO,MAAMC,qBAAOF,WAClB,SAASE,KAAKC,KAAK,EAAEC,GAAG;IACtB,MAAM,EAAEC,SAAS,EAAEC,IAAI,EAAEC,QAAQ,EAAE,GAAGC,WAAW,GAAGL;IAEpD,qBACE,KAACM;QAAG,GAAGD,SAAS;QAAEJ,KAAKA;QAAKC,WAAWJ,KAAK;YAAEK;YAAMD;QAAU;kBAC3DE;;AAGP,GACA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/link/SkipToMainContent.tsx"],"sourcesContent":["\"use client\";\nimport { forwardRef, useEffect, useRef
|
|
1
|
+
{"version":3,"sources":["../../src/link/SkipToMainContent.tsx"],"sourcesContent":["\"use client\";\n\nimport { type ReactNode, forwardRef, useEffect, useRef } from \"react\";\n\nimport { Link, type LinkProps } from \"./Link.js\";\nimport {\n type SkipToMainContentClassNameOptions,\n skipToMainContent,\n} from \"./styles.js\";\n\nconst noop = (): void => {\n // do nothing\n};\n\nconst getMainElement = (mainId: string): HTMLElement | null =>\n mainId\n ? document.getElementById(mainId)\n : document.querySelector<HTMLElement>('main,[role=\"main\"]');\n\n/**\n * @since 6.0.0 The `mainId` is optional\n */\nexport interface SkipToMainContentProps\n extends Omit<LinkProps, \"href\">,\n SkipToMainContentClassNameOptions {\n /**\n * @since 6.0.0 Changed default value from `\"skip-to-main-content\"`\n * @defaultValue `\"skip-to-main\"`\n */\n id?: string;\n\n /**\n * An optional id for the main element. When this is not provided, the main\n * element will be found by:\n *\n * ```ts\n * document.querySelector('main,[role=\"main\"]');\n * ```\n */\n mainId?: string;\n\n /**\n * @defaultValue `\"Skip to main content\"`\n */\n children?: ReactNode;\n}\n\n/**\n * **Client Component**\n *\n * @since 6.0.0 Changed the default `id` from `\"skip-to-main-content\"` to\n * `\"skip-to-main\"`.\n * @since 6.0.0 The `mainId` prop is optional\n * @since 6.0.0 Throws an error after rendering if no main element can be found\n * with the provided `mainId` in development mode. The previous behavior would\n * only log an error after being clicked.\n */\nexport const SkipToMainContent = forwardRef<\n HTMLAnchorElement,\n SkipToMainContentProps\n>(function SkipToMainContent(props, ref) {\n const {\n id = \"skip-to-main\",\n className,\n children = \"Skip to main content\",\n mainId = \"\",\n onClick = noop,\n unstyled,\n ...remaining\n } = props;\n\n const mainNodeRef = useRef<HTMLElement | null>(null);\n // want to warn the developer about missing main element in development\n // immediately to help prevent errors, but in production this can be lazy\n // initialized only once a keyboard user focuses and clicks this element\n if (process.env.NODE_ENV !== \"production\") {\n // eslint-disable-next-line react-hooks/rules-of-hooks\n useEffect(() => {\n mainNodeRef.current = getMainElement(mainId);\n\n if (!mainNodeRef.current) {\n const foundMainId = document.querySelector('main,[role=\"main\"]')?.id;\n let message = `Unable to find a main element to focus`;\n if (mainId) {\n message += ` with an id of \"${mainId}\"`;\n\n if (foundMainId) {\n message += ` but a main element was found with an id of \"${foundMainId}\".`;\n }\n }\n if (!foundMainId) {\n message +=\n '. There should be at least one <main> element or an element with role=\"main\" on the page for accessibility.';\n }\n\n throw new Error(message);\n }\n }, [mainId]);\n }\n\n return (\n <Link\n {...remaining}\n id={id}\n ref={ref}\n href={`#${mainId}`}\n onClick={(event) => {\n onClick(event);\n if (event.isPropagationStopped()) {\n return;\n }\n\n event.preventDefault();\n event.stopPropagation();\n\n // see comment above useEffect\n mainNodeRef.current ||= getMainElement(mainId);\n mainNodeRef.current?.focus();\n }}\n className={skipToMainContent({\n unstyled,\n className,\n })}\n >\n {children}\n </Link>\n );\n});\n"],"names":["forwardRef","useEffect","useRef","Link","skipToMainContent","noop","getMainElement","mainId","document","getElementById","querySelector","SkipToMainContent","props","ref","id","className","children","onClick","unstyled","remaining","mainNodeRef","process","env","NODE_ENV","current","foundMainId","message","Error","href","event","isPropagationStopped","preventDefault","stopPropagation","focus"],"mappings":"AAAA;;AAEA,SAAyBA,UAAU,EAAEC,SAAS,EAAEC,MAAM,QAAQ,QAAQ;AAEtE,SAASC,IAAI,QAAwB,YAAY;AACjD,SAEEC,iBAAiB,QACZ,cAAc;AAErB,MAAMC,OAAO;AACX,aAAa;AACf;AAEA,MAAMC,iBAAiB,CAACC,SACtBA,SACIC,SAASC,cAAc,CAACF,UACxBC,SAASE,aAAa,CAAc;AA8B1C;;;;;;;;;CASC,GACD,OAAO,MAAMC,kCAAoBX,WAG/B,SAASW,kBAAkBC,KAAK,EAAEC,GAAG;IACrC,MAAM,EACJC,KAAK,cAAc,EACnBC,SAAS,EACTC,WAAW,sBAAsB,EACjCT,SAAS,EAAE,EACXU,UAAUZ,IAAI,EACda,QAAQ,EACR,GAAGC,WACJ,GAAGP;IAEJ,MAAMQ,cAAclB,OAA2B;IAC/C,uEAAuE;IACvE,yEAAyE;IACzE,wEAAwE;IACxE,IAAImB,QAAQC,GAAG,CAACC,QAAQ,KAAK,cAAc;QACzC,sDAAsD;QACtDtB,UAAU;YACRmB,YAAYI,OAAO,GAAGlB,eAAeC;YAErC,IAAI,CAACa,YAAYI,OAAO,EAAE;gBACxB,MAAMC,cAAcjB,SAASE,aAAa,CAAC,uBAAuBI;gBAClE,IAAIY,UAAU,CAAC,sCAAsC,CAAC;gBACtD,IAAInB,QAAQ;oBACVmB,WAAW,CAAC,gBAAgB,EAAEnB,OAAO,CAAC,CAAC;oBAEvC,IAAIkB,aAAa;wBACfC,WAAW,CAAC,6CAA6C,EAAED,YAAY,EAAE,CAAC;oBAC5E;gBACF;gBACA,IAAI,CAACA,aAAa;oBAChBC,WACE;gBACJ;gBAEA,MAAM,IAAIC,MAAMD;YAClB;QACF,GAAG;YAACnB;SAAO;IACb;IAEA,qBACE,KAACJ;QACE,GAAGgB,SAAS;QACbL,IAAIA;QACJD,KAAKA;QACLe,MAAM,CAAC,CAAC,EAAErB,QAAQ;QAClBU,SAAS,CAACY;YACRZ,QAAQY;YACR,IAAIA,MAAMC,oBAAoB,IAAI;gBAChC;YACF;YAEAD,MAAME,cAAc;YACpBF,MAAMG,eAAe;YAErB,8BAA8B;YAC9BZ,YAAYI,OAAO,KAAKlB,eAAeC;YACvCa,YAAYI,OAAO,EAAES;QACvB;QACAlB,WAAWX,kBAAkB;YAC3Bc;YACAH;QACF;kBAECC;;AAGP,GAAG"}
|
package/dist/link/styles.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/link/styles.ts"],"sourcesContent":["import { cnb } from \"cnbuilder\";\nimport { bem } from \"../utils/bem.js\";\n\nconst styles = bem(\"rmd-link\");\n\n/** @since 6.0.0 */\nexport interface LinkClassNameOptions {\n className?: string;\n\n /** @defaultValue `false` */\n flex?: boolean;\n}\n\n/**\n * This really doesn't do much at this time since it only merges `rmd-link` with\n * the optional className. This was mostly added just for convention purposes.\n *\n * @since 6.0.0\n */\nexport function link(options: LinkClassNameOptions = {}): string {\n const { flex, className } = options;\n\n return cnb(styles({ flex }), className);\n}\n\n/** @since 6.0.0 */\nexport interface SkipToMainContentClassNameOptions {\n className?: string;\n\n /**\n * @defaultValue `false`\n */\n unstyled?: boolean;\n}\n\n/**\n * @since 6.0.0\n */\nexport function skipToMainContent(\n options: SkipToMainContentClassNameOptions = {}\n): string {\n const { unstyled = false, className } = options;\n\n return cnb(\n styles({\n skip: true,\n \"skip-styled\": !unstyled,\n }),\n className\n );\n}\n"],"names":["cnb","bem","styles","link","options","flex","className","skipToMainContent","unstyled","skip"],"mappings":"AAAA,SAASA,GAAG,QAAQ,YAAY;
|
|
1
|
+
{"version":3,"sources":["../../src/link/styles.ts"],"sourcesContent":["import { cnb } from \"cnbuilder\";\n\nimport { bem } from \"../utils/bem.js\";\n\nconst styles = bem(\"rmd-link\");\n\n/** @since 6.0.0 */\nexport interface LinkClassNameOptions {\n className?: string;\n\n /** @defaultValue `false` */\n flex?: boolean;\n}\n\n/**\n * This really doesn't do much at this time since it only merges `rmd-link` with\n * the optional className. This was mostly added just for convention purposes.\n *\n * @since 6.0.0\n */\nexport function link(options: LinkClassNameOptions = {}): string {\n const { flex, className } = options;\n\n return cnb(styles({ flex }), className);\n}\n\n/** @since 6.0.0 */\nexport interface SkipToMainContentClassNameOptions {\n className?: string;\n\n /**\n * @defaultValue `false`\n */\n unstyled?: boolean;\n}\n\n/**\n * @since 6.0.0\n */\nexport function skipToMainContent(\n options: SkipToMainContentClassNameOptions = {}\n): string {\n const { unstyled = false, className } = options;\n\n return cnb(\n styles({\n skip: true,\n \"skip-styled\": !unstyled,\n }),\n className\n );\n}\n"],"names":["cnb","bem","styles","link","options","flex","className","skipToMainContent","unstyled","skip"],"mappings":"AAAA,SAASA,GAAG,QAAQ,YAAY;AAEhC,SAASC,GAAG,QAAQ,kBAAkB;AAEtC,MAAMC,SAASD,IAAI;AAUnB;;;;;CAKC,GACD,OAAO,SAASE,KAAKC,UAAgC,CAAC,CAAC;IACrD,MAAM,EAAEC,IAAI,EAAEC,SAAS,EAAE,GAAGF;IAE5B,OAAOJ,IAAIE,OAAO;QAAEG;IAAK,IAAIC;AAC/B;AAYA;;CAEC,GACD,OAAO,SAASC,kBACdH,UAA6C,CAAC,CAAC;IAE/C,MAAM,EAAEI,WAAW,KAAK,EAAEF,SAAS,EAAE,GAAGF;IAExC,OAAOJ,IACLE,OAAO;QACLO,MAAM;QACN,eAAe,CAACD;IAClB,IACAF;AAEJ"}
|
package/dist/list/List.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/list/List.tsx"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"sources":["../../src/list/List.tsx"],"sourcesContent":["import { type HTMLAttributes, forwardRef } from \"react\";\n\nimport { list } from \"./listStyles.js\";\n\nexport type ListElement = HTMLUListElement | HTMLOListElement;\n\nexport interface ListProps extends HTMLAttributes<ListElement> {\n /**\n * @defaultValue `\"none\"`\n */\n role?: HTMLAttributes<ListElement>[\"role\"];\n\n /**\n * Set to `true` to decrease the amount of padding and font size within the\n * list.\n *\n * @defaultValue `false`\n */\n dense?: boolean;\n\n /**\n * Set this to `true` to render as `<ol>` instead of `<ul>` when the children\n * are in a specific order. For example: steps within a recipe.\n *\n * @defaultValue `false`\n */\n ordered?: boolean;\n\n /**\n * Set this to `true` to render horizontally instead of vertically.\n *\n * @defaultValue `false`\n */\n horizontal?: boolean;\n}\n\n/**\n * The `List` component is used to render a collection of clickable actions\n * vertically or horizontally and does not include the default `ol`/`ul` styles.\n *\n * @example Simple Example\n * ```tsx\n * import { List, ListItem, ListItemLink } from \"@react-md/core\";\n * import type { ReactElement } from \"react\";\n *\n * function Example(): ReactElement {\n * return (\n * <List>\n * <ListItem\n * onClick={() => {\n * // do something\n * }}\n * >\n * Item 1\n * </ListItem>\n * <ListItem\n * onClick={() => {\n * // do something\n * }}\n * >\n * Item 2\n * </ListItem>\n * <ListItem\n * onClick={() => {\n * // do something\n * }}\n * >\n * Item 3\n * </ListItem>\n * <ListItemLink href=\"/some-route\">Link Example</ListItemLink>\n * </List>\n * );\n * }\n * ```\n */\nexport const List = forwardRef<ListElement, ListProps>(\n function List(props, ref) {\n const {\n className,\n children,\n role = \"none\",\n dense = false,\n ordered = false,\n horizontal = false,\n ...remaining\n } = props;\n const Component = (ordered ? \"ol\" : \"ul\") as \"ul\";\n return (\n <Component\n {...remaining}\n ref={ref}\n role={role}\n className={list({\n dense,\n horizontal,\n className,\n })}\n >\n {children}\n </Component>\n );\n }\n);\n"],"names":["forwardRef","list","List","props","ref","className","children","role","dense","ordered","horizontal","remaining","Component"],"mappings":";AAAA,SAA8BA,UAAU,QAAQ,QAAQ;AAExD,SAASC,IAAI,QAAQ,kBAAkB;AAkCvC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAsCC,GACD,OAAO,MAAMC,qBAAOF,WAClB,SAASE,KAAKC,KAAK,EAAEC,GAAG;IACtB,MAAM,EACJC,SAAS,EACTC,QAAQ,EACRC,OAAO,MAAM,EACbC,QAAQ,KAAK,EACbC,UAAU,KAAK,EACfC,aAAa,KAAK,EAClB,GAAGC,WACJ,GAAGR;IACJ,MAAMS,YAAaH,UAAU,OAAO;IACpC,qBACE,KAACG;QACE,GAAGD,SAAS;QACbP,KAAKA;QACLG,MAAMA;QACNF,WAAWJ,KAAK;YACdO;YACAE;YACAL;QACF;kBAECC;;AAGP,GACA"}
|
package/dist/list/ListItem.js
CHANGED
|
@@ -3,8 +3,8 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
3
3
|
import { forwardRef } from "react";
|
|
4
4
|
import { useElementInteraction } from "../interaction/useElementInteraction.js";
|
|
5
5
|
import { useHigherContrastChildren } from "../interaction/useHigherContrastChildren.js";
|
|
6
|
-
import { getListItemHeight } from "./getListItemHeight.js";
|
|
7
6
|
import { ListItemChildren } from "./ListItemChildren.js";
|
|
7
|
+
import { getListItemHeight } from "./getListItemHeight.js";
|
|
8
8
|
import { listItem } from "./listItemStyles.js";
|
|
9
9
|
/**
|
|
10
10
|
* **Client Component**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/list/ListItem.tsx"],"sourcesContent":["\"use client\";\nimport {
|
|
1
|
+
{"version":3,"sources":["../../src/list/ListItem.tsx"],"sourcesContent":["\"use client\";\n\nimport { type HTMLAttributes, forwardRef } from \"react\";\n\nimport { type ComponentWithRippleProps } from \"../interaction/types.js\";\nimport { useElementInteraction } from \"../interaction/useElementInteraction.js\";\nimport { useHigherContrastChildren } from \"../interaction/useHigherContrastChildren.js\";\nimport { ListItemChildren } from \"./ListItemChildren.js\";\nimport { getListItemHeight } from \"./getListItemHeight.js\";\nimport { listItem } from \"./listItemStyles.js\";\nimport { type ListItemChildrenProps, type ListItemHeight } from \"./types.js\";\n\n/**\n * @since 6.0.0 Renamed `threeLines` to `multiline` since it can\n * support more than three lines of text.\n */\nexport interface ListItemProps\n extends HTMLAttributes<HTMLLIElement>,\n ListItemChildrenProps,\n ComponentWithRippleProps {\n /**\n * @defaultValue `\"button\"`\n */\n role?: HTMLAttributes<HTMLLIElement>[\"role\"];\n\n /**\n * @defaultValue `disabled ? -1 : 0`\n */\n tabIndex?: number;\n\n /**\n * @see {@link ListItemHeight}\n * @defaultValue `\"auto\"`\n */\n height?: ListItemHeight;\n\n /**\n * @defaultValue `false`\n */\n multiline?: boolean;\n\n /**\n * @defaultValue `false`\n */\n disabled?: boolean;\n\n /**\n * Note: This does nothing if the `disabled` prop is not enabled.\n *\n * @defaultValue `false`\n * @since 2.4.3\n */\n disabledOpacity?: boolean;\n\n /**\n * Set this to `false` if the list item should not gain the interaction\n * states: hover, focus, press, etc. This is kind of like being disabled\n * without the disabled styles being applied.\n *\n * @defaultValue `role === \"presentation\"`\n */\n presentational?: boolean;\n}\n\n/**\n * **Client Component**\n *\n * The `ListItem` is used to create a clickable/focusable button within a\n * `List` and removes the normal `<li>` styles.\n *\n * @example Simple Example\n * ```tsx\n * import { List, ListItem } from \"@react-md/core\";\n * import type { ReactElement } from \"react\";\n *\n * function Example(): ReactElement {\n * return (\n * <List>\n * <ListItem\n * onClick={() => {\n * // do something\n * }}\n * >\n * Item 1\n * </ListItem>\n * <ListItem\n * onClick={() => {\n * // do something\n * }}\n * secondaryText={<span>Some <strong>additional</strong> content.</span>}\n * >\n * Item 2\n * </ListItem>\n * </List>\n * );\n * );\n * }\n * ```\n *\n * @example Applying Addons Example\n * ```tsx\n * import { List, ListItem } from \"@react-md/core\";\n * import FavoriteIcon from \"@react-md/material-icons/FavoriteIcon\";\n * import type { ReactElement } from \"react\";\n *\n * function Example(): ReactElement {\n * return (\n * <List>\n * <ListItem leftAddon={<FavoriteIcon />}>\n * Item 1\n * </ListItem>\n * <ListItem rightAddon={<FavoriteIcon />}>\n * Item 2\n * </ListItem>\n * <ListItem\n * leftAddon={<FavoriteIcon />}\n * rightAddon={<img alt=\"\" src=\"/some-image.png\" />}\n * rightAddonType=\"media\"\n * >\n * Item 3\n * </ListItem>\n * </List>\n * );\n * );\n * }\n * ```\n */\nexport const ListItem = forwardRef<HTMLLIElement, ListItemProps>(\n function ListItem(props, ref) {\n const {\n className,\n textProps,\n textClassName,\n secondaryTextClassName,\n primaryText,\n secondaryText,\n secondaryTextProps,\n disableTextChildren = false,\n height: propHeight,\n leftAddon,\n leftAddonType,\n leftAddonPosition,\n leftAddonClassName,\n leftAddonForceWrap,\n rightAddon,\n rightAddonType,\n rightAddonPosition,\n rightAddonClassName,\n rightAddonForceWrap,\n disableLeftAddonSpacing,\n disableLeftAddonCenteredMedia,\n disableRightAddonCenteredMedia,\n multiline = false,\n disabled = false,\n disableRipple,\n disabledOpacity = false,\n role = \"button\",\n onBlur,\n onClick,\n onKeyDown,\n onKeyUp,\n onMouseDown,\n onMouseUp,\n onMouseLeave,\n onDragStart,\n onTouchStart,\n onTouchEnd,\n onTouchMove,\n tabIndex: propTabIndex,\n children: propChildren,\n presentational = role === \"presentation\",\n ...remaining\n } = props;\n\n let tabIndex = propTabIndex;\n if (!presentational && typeof tabIndex === \"undefined\") {\n tabIndex = disabled ? -1 : 0;\n }\n\n const { pressedClassName, ripples, handlers } = useElementInteraction({\n mode: disableRipple ? \"none\" : undefined,\n onBlur,\n onClick,\n onKeyDown,\n onKeyUp,\n onMouseDown,\n onMouseUp,\n onMouseLeave,\n onDragStart,\n onTouchStart,\n onTouchEnd,\n onTouchMove,\n disabled: disabled || presentational,\n });\n const children = useHigherContrastChildren(\n propChildren,\n !disableTextChildren\n );\n\n const height = getListItemHeight({\n height: propHeight,\n leftAddon,\n leftAddonType,\n rightAddon,\n rightAddonType,\n secondaryText,\n });\n\n return (\n <li\n {...remaining}\n {...handlers}\n aria-disabled={disabled || undefined}\n ref={ref}\n role={role}\n tabIndex={tabIndex}\n className={listItem({\n className,\n height,\n disabled,\n disabledOpacity,\n multiline,\n clickable: !presentational,\n pressedClassName,\n })}\n >\n <ListItemChildren\n multiline={multiline}\n textClassName={textClassName}\n secondaryTextClassName={secondaryTextClassName}\n disableTextChildren={disableTextChildren}\n primaryText={primaryText}\n textProps={textProps}\n secondaryText={secondaryText}\n secondaryTextProps={secondaryTextProps}\n leftAddon={leftAddon}\n leftAddonType={leftAddonType}\n leftAddonPosition={leftAddonPosition}\n leftAddonClassName={leftAddonClassName}\n leftAddonForceWrap={leftAddonForceWrap}\n rightAddon={rightAddon}\n rightAddonType={rightAddonType}\n rightAddonPosition={rightAddonPosition}\n rightAddonClassName={rightAddonClassName}\n rightAddonForceWrap={rightAddonForceWrap}\n disableLeftAddonSpacing={disableLeftAddonSpacing}\n disableLeftAddonCenteredMedia={disableLeftAddonCenteredMedia}\n disableRightAddonCenteredMedia={disableRightAddonCenteredMedia}\n >\n {children}\n </ListItemChildren>\n {ripples}\n </li>\n );\n }\n);\n"],"names":["forwardRef","useElementInteraction","useHigherContrastChildren","ListItemChildren","getListItemHeight","listItem","ListItem","props","ref","className","textProps","textClassName","secondaryTextClassName","primaryText","secondaryText","secondaryTextProps","disableTextChildren","height","propHeight","leftAddon","leftAddonType","leftAddonPosition","leftAddonClassName","leftAddonForceWrap","rightAddon","rightAddonType","rightAddonPosition","rightAddonClassName","rightAddonForceWrap","disableLeftAddonSpacing","disableLeftAddonCenteredMedia","disableRightAddonCenteredMedia","multiline","disabled","disableRipple","disabledOpacity","role","onBlur","onClick","onKeyDown","onKeyUp","onMouseDown","onMouseUp","onMouseLeave","onDragStart","onTouchStart","onTouchEnd","onTouchMove","tabIndex","propTabIndex","children","propChildren","presentational","remaining","pressedClassName","ripples","handlers","mode","undefined","li","aria-disabled","clickable"],"mappings":"AAAA;;AAEA,SAA8BA,UAAU,QAAQ,QAAQ;AAGxD,SAASC,qBAAqB,QAAQ,0CAA0C;AAChF,SAASC,yBAAyB,QAAQ,8CAA8C;AACxF,SAASC,gBAAgB,QAAQ,wBAAwB;AACzD,SAASC,iBAAiB,QAAQ,yBAAyB;AAC3D,SAASC,QAAQ,QAAQ,sBAAsB;AAuD/C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA8DC,GACD,OAAO,MAAMC,yBAAWN,WACtB,SAASM,SAASC,KAAK,EAAEC,GAAG;IAC1B,MAAM,EACJC,SAAS,EACTC,SAAS,EACTC,aAAa,EACbC,sBAAsB,EACtBC,WAAW,EACXC,aAAa,EACbC,kBAAkB,EAClBC,sBAAsB,KAAK,EAC3BC,QAAQC,UAAU,EAClBC,SAAS,EACTC,aAAa,EACbC,iBAAiB,EACjBC,kBAAkB,EAClBC,kBAAkB,EAClBC,UAAU,EACVC,cAAc,EACdC,kBAAkB,EAClBC,mBAAmB,EACnBC,mBAAmB,EACnBC,uBAAuB,EACvBC,6BAA6B,EAC7BC,8BAA8B,EAC9BC,YAAY,KAAK,EACjBC,WAAW,KAAK,EAChBC,aAAa,EACbC,kBAAkB,KAAK,EACvBC,OAAO,QAAQ,EACfC,MAAM,EACNC,OAAO,EACPC,SAAS,EACTC,OAAO,EACPC,WAAW,EACXC,SAAS,EACTC,YAAY,EACZC,WAAW,EACXC,YAAY,EACZC,UAAU,EACVC,WAAW,EACXC,UAAUC,YAAY,EACtBC,UAAUC,YAAY,EACtBC,iBAAiBhB,SAAS,cAAc,EACxC,GAAGiB,WACJ,GAAG9C;IAEJ,IAAIyC,WAAWC;IACf,IAAI,CAACG,kBAAkB,OAAOJ,aAAa,aAAa;QACtDA,WAAWf,WAAW,CAAC,IAAI;IAC7B;IAEA,MAAM,EAAEqB,gBAAgB,EAAEC,OAAO,EAAEC,QAAQ,EAAE,GAAGvD,sBAAsB;QACpEwD,MAAMvB,gBAAgB,SAASwB;QAC/BrB;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAd,UAAUA,YAAYmB;IACxB;IACA,MAAMF,WAAWhD,0BACfiD,cACA,CAACnC;IAGH,MAAMC,SAASb,kBAAkB;QAC/Ba,QAAQC;QACRC;QACAC;QACAI;QACAC;QACAX;IACF;IAEA,qBACE,MAAC6C;QACE,GAAGN,SAAS;QACZ,GAAGG,QAAQ;QACZI,iBAAe3B,YAAYyB;QAC3BlD,KAAKA;QACL4B,MAAMA;QACNY,UAAUA;QACVvC,WAAWJ,SAAS;YAClBI;YACAQ;YACAgB;YACAE;YACAH;YACA6B,WAAW,CAACT;YACZE;QACF;;0BAEA,KAACnD;gBACC6B,WAAWA;gBACXrB,eAAeA;gBACfC,wBAAwBA;gBACxBI,qBAAqBA;gBACrBH,aAAaA;gBACbH,WAAWA;gBACXI,eAAeA;gBACfC,oBAAoBA;gBACpBI,WAAWA;gBACXC,eAAeA;gBACfC,mBAAmBA;gBACnBC,oBAAoBA;gBACpBC,oBAAoBA;gBACpBC,YAAYA;gBACZC,gBAAgBA;gBAChBC,oBAAoBA;gBACpBC,qBAAqBA;gBACrBC,qBAAqBA;gBACrBC,yBAAyBA;gBACzBC,+BAA+BA;gBAC/BC,gCAAgCA;0BAE/BmB;;YAEFK;;;AAGP,GACA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/list/ListItemAddon.tsx"],"sourcesContent":["import { type ReactElement, type ReactNode } from \"react\";\nimport {\n TextIconSpacing,\n type TextIconSpacingProps,\n} from \"../icon/TextIconSpacing.js\";\nimport {\n
|
|
1
|
+
{"version":3,"sources":["../../src/list/ListItemAddon.tsx"],"sourcesContent":["import { type ReactElement, type ReactNode } from \"react\";\n\nimport {\n TextIconSpacing,\n type TextIconSpacingProps,\n} from \"../icon/TextIconSpacing.js\";\nimport {\n type ListItemAddonClassNameOptions,\n listItemAddon,\n} from \"./listItemStyles.js\";\n\nexport interface ListItemAddonProps\n extends Omit<TextIconSpacingProps, \"icon\" | \"iconAfter\" | \"forceIconWrap\">,\n ListItemAddonClassNameOptions {\n /**\n * The addon that should be rendered.\n */\n addon: ReactNode;\n\n /**\n * @defaultValue `type === \"media\" || type === \"large-media\"`\n */\n forceAddonWrap?: boolean;\n}\n\n/**\n * The `ListItemAddon` is used to create an addon to the left or right of the\n * text/children of a `ListItem`.\n *\n * @internal\n */\nexport function ListItemAddon(props: ListItemAddonProps): ReactElement {\n const {\n className,\n children,\n addon,\n addonAfter,\n type = \"icon\",\n position,\n forceAddonWrap,\n disableCenteredMedia,\n disableBeforeSpacing,\n ...remaining\n } = props;\n\n const isMedia = type === \"media\" || type === \"large-media\";\n\n return (\n <TextIconSpacing\n {...remaining}\n icon={addon}\n forceIconWrap={forceAddonWrap ?? isMedia}\n className={listItemAddon({\n type,\n position,\n className,\n addonAfter,\n disableBeforeSpacing,\n disableCenteredMedia,\n })}\n iconAfter={addonAfter}\n >\n {children}\n </TextIconSpacing>\n );\n}\n"],"names":["TextIconSpacing","listItemAddon","ListItemAddon","props","className","children","addon","addonAfter","type","position","forceAddonWrap","disableCenteredMedia","disableBeforeSpacing","remaining","isMedia","icon","forceIconWrap","iconAfter"],"mappings":";AAEA,SACEA,eAAe,QAEV,6BAA6B;AACpC,SAEEC,aAAa,QACR,sBAAsB;AAgB7B;;;;;CAKC,GACD,OAAO,SAASC,cAAcC,KAAyB;IACrD,MAAM,EACJC,SAAS,EACTC,QAAQ,EACRC,KAAK,EACLC,UAAU,EACVC,OAAO,MAAM,EACbC,QAAQ,EACRC,cAAc,EACdC,oBAAoB,EACpBC,oBAAoB,EACpB,GAAGC,WACJ,GAAGV;IAEJ,MAAMW,UAAUN,SAAS,WAAWA,SAAS;IAE7C,qBACE,KAACR;QACE,GAAGa,SAAS;QACbE,MAAMT;QACNU,eAAeN,kBAAkBI;QACjCV,WAAWH,cAAc;YACvBO;YACAC;YACAL;YACAG;YACAK;YACAD;QACF;QACAM,WAAWV;kBAEVF;;AAGP"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/list/ListItemChildren.tsx"],"sourcesContent":["import { type ReactElement } from \"react\";\nimport { ListItemAddon } from \"./ListItemAddon.js\";\nimport { ListItemText } from \"./ListItemText.js\";\nimport { type ListItemChildrenProps } from \"./types.js\";\n\n/**\n * The `ListItemChildren` component is used to create a styled list item that\n * can have optional addons to the left or right of the children in the form of\n * icons, avatars, or media. The `children` can be replaced by the `primaryText`\n * and `secondaryText` props to create stacked text spanning two or more lines\n * with the default behavior of using `line-clamp` at three lines.\n *\n * Note: This will return a `React.Fragment` of the children and does not wrap\n * in a DOM node for styling. The parent component should normally have\n * `display: flex` for the styling to work.\n *\n * @example Custom Component Usage\n * ```tsx\n * import { ListItemChildren } from \"@react-md/core\";\n * import FavoriteIcon from \"@react-md/material-icons/FavoriteIcon\";\n * import type { ReactElement } from \"react\";\n *\n * function Example(): ReactElement {\n * return (\n * <div style={{ display: \"flex\" }}>\n * <ListItemChildren\n * leftAddon={<FavoriteIcon />}\n * rightAddon={<img alt=\"\" src=\"/some-image.png\" />}\n * rightAddonType=\"media\"\n * secondaryText={<span>Some <strong>additional</strong> content.</span>}\n * >\n * Content\n * </ListItemChildren>\n * </div>\n * );\n * }\n * ```\n */\nexport function ListItemChildren(props: ListItemChildrenProps): ReactElement {\n const {\n multiline,\n textProps,\n textClassName,\n secondaryTextClassName,\n disableTextChildren,\n primaryText,\n secondaryText,\n secondaryTextProps,\n leftAddon,\n leftAddonType = \"icon\",\n leftAddonPosition = \"middle\",\n leftAddonClassName,\n leftAddonForceWrap,\n disableLeftAddonSpacing,\n disableLeftAddonCenteredMedia,\n rightAddon,\n rightAddonType = \"icon\",\n rightAddonPosition = \"middle\",\n rightAddonClassName,\n rightAddonForceWrap,\n disableRightAddonCenteredMedia,\n children: propChildren,\n } = props;\n\n const stringifiedChildren =\n typeof propChildren === \"number\" ? `${propChildren}` : propChildren;\n\n let children = stringifiedChildren;\n if (primaryText || secondaryText || !disableTextChildren) {\n children = (\n <ListItemText\n {...textProps}\n className={textClassName}\n secondaryText={secondaryText}\n secondaryTextProps={secondaryTextProps}\n secondaryTextClamped={multiline}\n secondaryTextClassName={secondaryTextClassName}\n >\n {(!disableTextChildren && children) || primaryText}\n </ListItemText>\n );\n }\n\n children = (\n <ListItemAddon\n addon={leftAddon}\n type={leftAddonType}\n position={leftAddonPosition}\n className={leftAddonClassName}\n forceAddonWrap={leftAddonForceWrap}\n disableBeforeSpacing={disableLeftAddonSpacing}\n disableCenteredMedia={disableLeftAddonCenteredMedia}\n >\n {children}\n </ListItemAddon>\n );\n children = (\n <ListItemAddon\n addon={rightAddon}\n addonAfter\n type={rightAddonType}\n position={rightAddonPosition}\n className={rightAddonClassName}\n forceAddonWrap={rightAddonForceWrap}\n disableCenteredMedia={disableRightAddonCenteredMedia}\n >\n {children}\n </ListItemAddon>\n );\n\n return (\n <>\n {children}\n {(primaryText && stringifiedChildren) || null}\n </>\n );\n}\n"],"names":["ListItemAddon","ListItemText","ListItemChildren","props","multiline","textProps","textClassName","secondaryTextClassName","disableTextChildren","primaryText","secondaryText","secondaryTextProps","leftAddon","leftAddonType","leftAddonPosition","leftAddonClassName","leftAddonForceWrap","disableLeftAddonSpacing","disableLeftAddonCenteredMedia","rightAddon","rightAddonType","rightAddonPosition","rightAddonClassName","rightAddonForceWrap","disableRightAddonCenteredMedia","children","propChildren","stringifiedChildren","className","secondaryTextClamped","addon","type","position","forceAddonWrap","disableBeforeSpacing","disableCenteredMedia","addonAfter"],"mappings":";
|
|
1
|
+
{"version":3,"sources":["../../src/list/ListItemChildren.tsx"],"sourcesContent":["import { type ReactElement } from \"react\";\n\nimport { ListItemAddon } from \"./ListItemAddon.js\";\nimport { ListItemText } from \"./ListItemText.js\";\nimport { type ListItemChildrenProps } from \"./types.js\";\n\n/**\n * The `ListItemChildren` component is used to create a styled list item that\n * can have optional addons to the left or right of the children in the form of\n * icons, avatars, or media. The `children` can be replaced by the `primaryText`\n * and `secondaryText` props to create stacked text spanning two or more lines\n * with the default behavior of using `line-clamp` at three lines.\n *\n * Note: This will return a `React.Fragment` of the children and does not wrap\n * in a DOM node for styling. The parent component should normally have\n * `display: flex` for the styling to work.\n *\n * @example Custom Component Usage\n * ```tsx\n * import { ListItemChildren } from \"@react-md/core\";\n * import FavoriteIcon from \"@react-md/material-icons/FavoriteIcon\";\n * import type { ReactElement } from \"react\";\n *\n * function Example(): ReactElement {\n * return (\n * <div style={{ display: \"flex\" }}>\n * <ListItemChildren\n * leftAddon={<FavoriteIcon />}\n * rightAddon={<img alt=\"\" src=\"/some-image.png\" />}\n * rightAddonType=\"media\"\n * secondaryText={<span>Some <strong>additional</strong> content.</span>}\n * >\n * Content\n * </ListItemChildren>\n * </div>\n * );\n * }\n * ```\n */\nexport function ListItemChildren(props: ListItemChildrenProps): ReactElement {\n const {\n multiline,\n textProps,\n textClassName,\n secondaryTextClassName,\n disableTextChildren,\n primaryText,\n secondaryText,\n secondaryTextProps,\n leftAddon,\n leftAddonType = \"icon\",\n leftAddonPosition = \"middle\",\n leftAddonClassName,\n leftAddonForceWrap,\n disableLeftAddonSpacing,\n disableLeftAddonCenteredMedia,\n rightAddon,\n rightAddonType = \"icon\",\n rightAddonPosition = \"middle\",\n rightAddonClassName,\n rightAddonForceWrap,\n disableRightAddonCenteredMedia,\n children: propChildren,\n } = props;\n\n const stringifiedChildren =\n typeof propChildren === \"number\" ? `${propChildren}` : propChildren;\n\n let children = stringifiedChildren;\n if (primaryText || secondaryText || !disableTextChildren) {\n children = (\n <ListItemText\n {...textProps}\n className={textClassName}\n secondaryText={secondaryText}\n secondaryTextProps={secondaryTextProps}\n secondaryTextClamped={multiline}\n secondaryTextClassName={secondaryTextClassName}\n >\n {(!disableTextChildren && children) || primaryText}\n </ListItemText>\n );\n }\n\n children = (\n <ListItemAddon\n addon={leftAddon}\n type={leftAddonType}\n position={leftAddonPosition}\n className={leftAddonClassName}\n forceAddonWrap={leftAddonForceWrap}\n disableBeforeSpacing={disableLeftAddonSpacing}\n disableCenteredMedia={disableLeftAddonCenteredMedia}\n >\n {children}\n </ListItemAddon>\n );\n children = (\n <ListItemAddon\n addon={rightAddon}\n addonAfter\n type={rightAddonType}\n position={rightAddonPosition}\n className={rightAddonClassName}\n forceAddonWrap={rightAddonForceWrap}\n disableCenteredMedia={disableRightAddonCenteredMedia}\n >\n {children}\n </ListItemAddon>\n );\n\n return (\n <>\n {children}\n {(primaryText && stringifiedChildren) || null}\n </>\n );\n}\n"],"names":["ListItemAddon","ListItemText","ListItemChildren","props","multiline","textProps","textClassName","secondaryTextClassName","disableTextChildren","primaryText","secondaryText","secondaryTextProps","leftAddon","leftAddonType","leftAddonPosition","leftAddonClassName","leftAddonForceWrap","disableLeftAddonSpacing","disableLeftAddonCenteredMedia","rightAddon","rightAddonType","rightAddonPosition","rightAddonClassName","rightAddonForceWrap","disableRightAddonCenteredMedia","children","propChildren","stringifiedChildren","className","secondaryTextClamped","addon","type","position","forceAddonWrap","disableBeforeSpacing","disableCenteredMedia","addonAfter"],"mappings":";AAEA,SAASA,aAAa,QAAQ,qBAAqB;AACnD,SAASC,YAAY,QAAQ,oBAAoB;AAGjD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgCC,GACD,OAAO,SAASC,iBAAiBC,KAA4B;IAC3D,MAAM,EACJC,SAAS,EACTC,SAAS,EACTC,aAAa,EACbC,sBAAsB,EACtBC,mBAAmB,EACnBC,WAAW,EACXC,aAAa,EACbC,kBAAkB,EAClBC,SAAS,EACTC,gBAAgB,MAAM,EACtBC,oBAAoB,QAAQ,EAC5BC,kBAAkB,EAClBC,kBAAkB,EAClBC,uBAAuB,EACvBC,6BAA6B,EAC7BC,UAAU,EACVC,iBAAiB,MAAM,EACvBC,qBAAqB,QAAQ,EAC7BC,mBAAmB,EACnBC,mBAAmB,EACnBC,8BAA8B,EAC9BC,UAAUC,YAAY,EACvB,GAAGvB;IAEJ,MAAMwB,sBACJ,OAAOD,iBAAiB,WAAW,GAAGA,cAAc,GAAGA;IAEzD,IAAID,WAAWE;IACf,IAAIlB,eAAeC,iBAAiB,CAACF,qBAAqB;QACxDiB,yBACE,KAACxB;YACE,GAAGI,SAAS;YACbuB,WAAWtB;YACXI,eAAeA;YACfC,oBAAoBA;YACpBkB,sBAAsBzB;YACtBG,wBAAwBA;sBAEvB,AAAC,CAACC,uBAAuBiB,YAAahB;;IAG7C;IAEAgB,yBACE,KAACzB;QACC8B,OAAOlB;QACPmB,MAAMlB;QACNmB,UAAUlB;QACVc,WAAWb;QACXkB,gBAAgBjB;QAChBkB,sBAAsBjB;QACtBkB,sBAAsBjB;kBAErBO;;IAGLA,yBACE,KAACzB;QACC8B,OAAOX;QACPiB,UAAU;QACVL,MAAMX;QACNY,UAAUX;QACVO,WAAWN;QACXW,gBAAgBV;QAChBY,sBAAsBX;kBAErBC;;IAIL,qBACE;;YACGA;YACChB,eAAekB,uBAAwB;;;AAG/C"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/list/ListItemLink.tsx"],"sourcesContent":["\"use client\";\nimport {\n
|
|
1
|
+
{"version":3,"sources":["../../src/list/ListItemLink.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n type AnchorHTMLAttributes,\n type HTMLAttributes,\n forwardRef,\n} from \"react\";\n\nimport { type ComponentWithRippleProps } from \"../interaction/types.js\";\nimport { useElementInteraction } from \"../interaction/useElementInteraction.js\";\nimport { useHigherContrastChildren } from \"../interaction/useHigherContrastChildren.js\";\nimport { type CustomLinkComponent } from \"../link/Link.js\";\nimport { type PropsWithRef } from \"../types.js\";\nimport { ListItemChildren } from \"./ListItemChildren.js\";\nimport { getListItemHeight } from \"./getListItemHeight.js\";\nimport { type ListItemClassNameOptions, listItem } from \"./listItemStyles.js\";\nimport { type ListItemChildrenProps } from \"./types.js\";\n\nexport interface ListItemLinkProps\n extends AnchorHTMLAttributes<HTMLAnchorElement>,\n ListItemClassNameOptions,\n ListItemChildrenProps,\n ComponentWithRippleProps {\n /** @defaultValue `\"a\"` */\n as?: CustomLinkComponent;\n\n /**\n * This should only be used if the {@link as} {@link CustomLinkComponent}\n * accepts a `to` prop instead of {@link href}.\n */\n to?: string;\n\n /**\n * The link's href. Either this or the {@link to} prop **should** be provided.\n */\n href?: string;\n\n /**\n * Any additional props to provide the wrapping `<li>` element such as\n * `style`, `className`, and `ref`.\n */\n liProps?: PropsWithRef<HTMLAttributes<HTMLLIElement>, HTMLLIElement>;\n\n /**\n * @defaultValue `disabled ? -1 : undefined`\n */\n tabIndex?: number;\n}\n\n/**\n * **Client Component**\n *\n * The `ListItemLink` should be used to render links within the `List` component.\n */\nexport const ListItemLink = forwardRef<HTMLAnchorElement, ListItemLinkProps>(\n function ListItemLink(props, ref) {\n const {\n as: Link = \"a\",\n to,\n href,\n className,\n liProps,\n textProps,\n textClassName,\n secondaryTextClassName,\n primaryText,\n secondaryText,\n secondaryTextProps,\n disableTextChildren = false,\n height: propHeight,\n leftAddon,\n leftAddonType = \"icon\",\n leftAddonPosition = \"middle\",\n leftAddonClassName,\n leftAddonForceWrap,\n rightAddon,\n rightAddonType = \"icon\",\n rightAddonPosition = \"middle\",\n rightAddonClassName,\n rightAddonForceWrap,\n disableLeftAddonCenteredMedia = false,\n disableRightAddonCenteredMedia = false,\n multiline = false,\n disabled = false,\n disabledOpacity = false,\n onBlur,\n onClick,\n onKeyDown,\n onKeyUp,\n onMouseDown,\n onMouseUp,\n onMouseLeave,\n onDragStart,\n onTouchStart,\n onTouchEnd,\n onTouchMove,\n role,\n tabIndex = disabled || role === \"menuitem\" ? -1 : undefined,\n children: propChildren,\n disableRipple,\n ...remaining\n } = props;\n\n const { pressedClassName, ripples, handlers } = useElementInteraction({\n mode: disableRipple ? \"none\" : undefined,\n onBlur,\n onClick,\n onKeyDown,\n onKeyUp,\n onMouseDown,\n onMouseUp,\n onMouseLeave,\n onDragStart,\n onTouchStart,\n onTouchEnd,\n onTouchMove,\n disabled,\n });\n const children = useHigherContrastChildren(\n propChildren,\n !disableTextChildren\n );\n\n const height = getListItemHeight({\n height: propHeight,\n leftAddon,\n leftAddonType,\n rightAddon,\n rightAddonType,\n secondaryText,\n });\n\n return (\n <li {...liProps} role=\"none\">\n <Link\n ref={ref}\n {...remaining}\n {...handlers}\n role={role}\n className={listItem({\n className,\n link: true,\n height,\n disabled,\n disabledOpacity,\n multiline,\n pressedClassName,\n })}\n // TODO: Figure out a better type for the CustomLinkComponent to fix this\n to={to as string}\n href={href as string}\n tabIndex={tabIndex}\n >\n <ListItemChildren\n multiline={multiline}\n textClassName={textClassName}\n secondaryTextClassName={secondaryTextClassName}\n disableTextChildren={disableTextChildren}\n primaryText={primaryText}\n textProps={textProps}\n secondaryText={secondaryText}\n secondaryTextProps={secondaryTextProps}\n leftAddon={leftAddon}\n leftAddonType={leftAddonType}\n leftAddonPosition={leftAddonPosition}\n leftAddonClassName={leftAddonClassName}\n leftAddonForceWrap={leftAddonForceWrap}\n rightAddon={rightAddon}\n rightAddonType={rightAddonType}\n rightAddonPosition={rightAddonPosition}\n rightAddonClassName={rightAddonClassName}\n rightAddonForceWrap={rightAddonForceWrap}\n disableLeftAddonCenteredMedia={disableLeftAddonCenteredMedia}\n disableRightAddonCenteredMedia={disableRightAddonCenteredMedia}\n >\n {children}\n </ListItemChildren>\n {ripples}\n </Link>\n </li>\n );\n }\n);\n"],"names":["forwardRef","useElementInteraction","useHigherContrastChildren","ListItemChildren","getListItemHeight","listItem","ListItemLink","props","ref","as","Link","to","href","className","liProps","textProps","textClassName","secondaryTextClassName","primaryText","secondaryText","secondaryTextProps","disableTextChildren","height","propHeight","leftAddon","leftAddonType","leftAddonPosition","leftAddonClassName","leftAddonForceWrap","rightAddon","rightAddonType","rightAddonPosition","rightAddonClassName","rightAddonForceWrap","disableLeftAddonCenteredMedia","disableRightAddonCenteredMedia","multiline","disabled","disabledOpacity","onBlur","onClick","onKeyDown","onKeyUp","onMouseDown","onMouseUp","onMouseLeave","onDragStart","onTouchStart","onTouchEnd","onTouchMove","role","tabIndex","undefined","children","propChildren","disableRipple","remaining","pressedClassName","ripples","handlers","mode","li","link"],"mappings":"AAAA;;AAEA,SAGEA,UAAU,QACL,QAAQ;AAGf,SAASC,qBAAqB,QAAQ,0CAA0C;AAChF,SAASC,yBAAyB,QAAQ,8CAA8C;AAGxF,SAASC,gBAAgB,QAAQ,wBAAwB;AACzD,SAASC,iBAAiB,QAAQ,yBAAyB;AAC3D,SAAwCC,QAAQ,QAAQ,sBAAsB;AAkC9E;;;;CAIC,GACD,OAAO,MAAMC,6BAAeN,WAC1B,SAASM,aAAaC,KAAK,EAAEC,GAAG;IAC9B,MAAM,EACJC,IAAIC,OAAO,GAAG,EACdC,EAAE,EACFC,IAAI,EACJC,SAAS,EACTC,OAAO,EACPC,SAAS,EACTC,aAAa,EACbC,sBAAsB,EACtBC,WAAW,EACXC,aAAa,EACbC,kBAAkB,EAClBC,sBAAsB,KAAK,EAC3BC,QAAQC,UAAU,EAClBC,SAAS,EACTC,gBAAgB,MAAM,EACtBC,oBAAoB,QAAQ,EAC5BC,kBAAkB,EAClBC,kBAAkB,EAClBC,UAAU,EACVC,iBAAiB,MAAM,EACvBC,qBAAqB,QAAQ,EAC7BC,mBAAmB,EACnBC,mBAAmB,EACnBC,gCAAgC,KAAK,EACrCC,iCAAiC,KAAK,EACtCC,YAAY,KAAK,EACjBC,WAAW,KAAK,EAChBC,kBAAkB,KAAK,EACvBC,MAAM,EACNC,OAAO,EACPC,SAAS,EACTC,OAAO,EACPC,WAAW,EACXC,SAAS,EACTC,YAAY,EACZC,WAAW,EACXC,YAAY,EACZC,UAAU,EACVC,WAAW,EACXC,IAAI,EACJC,WAAWd,YAAYa,SAAS,aAAa,CAAC,IAAIE,SAAS,EAC3DC,UAAUC,YAAY,EACtBC,aAAa,EACb,GAAGC,WACJ,GAAGjD;IAEJ,MAAM,EAAEkD,gBAAgB,EAAEC,OAAO,EAAEC,QAAQ,EAAE,GAAG1D,sBAAsB;QACpE2D,MAAML,gBAAgB,SAASH;QAC/Bb;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAZ;IACF;IACA,MAAMgB,WAAWnD,0BACfoD,cACA,CAACjC;IAGH,MAAMC,SAASlB,kBAAkB;QAC/BkB,QAAQC;QACRC;QACAC;QACAI;QACAC;QACAX;IACF;IAEA,qBACE,KAAC0C;QAAI,GAAG/C,OAAO;QAAEoC,MAAK;kBACpB,cAAA,MAACxC;YACCF,KAAKA;YACJ,GAAGgD,SAAS;YACZ,GAAGG,QAAQ;YACZT,MAAMA;YACNrC,WAAWR,SAAS;gBAClBQ;gBACAiD,MAAM;gBACNxC;gBACAe;gBACAC;gBACAF;gBACAqB;YACF;YACA,yEAAyE;YACzE9C,IAAIA;YACJC,MAAMA;YACNuC,UAAUA;;8BAEV,KAAChD;oBACCiC,WAAWA;oBACXpB,eAAeA;oBACfC,wBAAwBA;oBACxBI,qBAAqBA;oBACrBH,aAAaA;oBACbH,WAAWA;oBACXI,eAAeA;oBACfC,oBAAoBA;oBACpBI,WAAWA;oBACXC,eAAeA;oBACfC,mBAAmBA;oBACnBC,oBAAoBA;oBACpBC,oBAAoBA;oBACpBC,YAAYA;oBACZC,gBAAgBA;oBAChBC,oBAAoBA;oBACpBC,qBAAqBA;oBACrBC,qBAAqBA;oBACrBC,+BAA+BA;oBAC/BC,gCAAgCA;8BAE/BkB;;gBAEFK;;;;AAIT,GACA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/list/ListItemText.tsx"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"sources":["../../src/list/ListItemText.tsx"],"sourcesContent":["import { type HTMLAttributes, type ReactNode, forwardRef } from \"react\";\n\nimport { type PropsWithRef } from \"../types.js\";\nimport { listItemText } from \"./listItemStyles.js\";\n\n/**\n * @internal\n */\nexport interface ListItemTextProps extends HTMLAttributes<HTMLSpanElement> {\n secondaryText?: ReactNode;\n secondaryTextProps?: PropsWithRef<\n HTMLAttributes<HTMLSpanElement>,\n HTMLSpanElement\n >;\n\n /** @defaultValue `false` */\n secondaryTextClamped?: boolean;\n secondaryTextClassName?: string;\n}\n\n/**\n * This is mostly an internal component that can conditionally render secondary\n * text within list items.\n *\n * @internal\n */\nexport const ListItemText = forwardRef<HTMLSpanElement, ListItemTextProps>(\n function ListItemText(props, ref) {\n const {\n className,\n secondaryText,\n secondaryTextProps,\n secondaryTextClamped = false,\n secondaryTextClassName,\n children,\n ...remaining\n } = props;\n\n return (\n <span\n {...remaining}\n ref={ref}\n className={listItemText({\n className,\n })}\n >\n {children}\n {secondaryText && (\n <span\n {...secondaryTextProps}\n className={listItemText({\n clamped: secondaryTextClamped,\n className: secondaryTextClassName,\n secondary: true,\n })}\n >\n {secondaryText}\n </span>\n )}\n </span>\n );\n }\n);\n"],"names":["forwardRef","listItemText","ListItemText","props","ref","className","secondaryText","secondaryTextProps","secondaryTextClamped","secondaryTextClassName","children","remaining","span","clamped","secondary"],"mappings":";AAAA,SAA8CA,UAAU,QAAQ,QAAQ;AAGxE,SAASC,YAAY,QAAQ,sBAAsB;AAiBnD;;;;;CAKC,GACD,OAAO,MAAMC,6BAAeF,WAC1B,SAASE,aAAaC,KAAK,EAAEC,GAAG;IAC9B,MAAM,EACJC,SAAS,EACTC,aAAa,EACbC,kBAAkB,EAClBC,uBAAuB,KAAK,EAC5BC,sBAAsB,EACtBC,QAAQ,EACR,GAAGC,WACJ,GAAGR;IAEJ,qBACE,MAACS;QACE,GAAGD,SAAS;QACbP,KAAKA;QACLC,WAAWJ,aAAa;YACtBI;QACF;;YAECK;YACAJ,+BACC,KAACM;gBACE,GAAGL,kBAAkB;gBACtBF,WAAWJ,aAAa;oBACtBY,SAASL;oBACTH,WAAWI;oBACXK,WAAW;gBACb;0BAECR;;;;AAKX,GACA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/list/ListSubheader.tsx"],"sourcesContent":["import { cnb } from \"cnbuilder\";\nimport {
|
|
1
|
+
{"version":3,"sources":["../../src/list/ListSubheader.tsx"],"sourcesContent":["import { cnb } from \"cnbuilder\";\nimport { type HTMLAttributes, forwardRef } from \"react\";\n\nimport { type PropsWithRef } from \"../types.js\";\nimport { bem } from \"../utils/bem.js\";\nimport { ListItemText } from \"./ListItemText.js\";\n\nconst styles = bem(\"rmd-list-subheader\");\n\n/** @since 6.0.0 */\nexport interface ListSubheaderClassNameOptions {\n className?: string;\n\n /**\n * Boolean if the subheader should be inset to match the `ListItem` text\n * keyline.\n *\n * @defaultValue `false`\n */\n inset?: boolean;\n}\n\n/**\n * @since 6.0.0\n */\nexport function listSubheader(\n options: ListSubheaderClassNameOptions = {}\n): string {\n const { inset = false, className } = options;\n\n return cnb(styles({ inset }), className);\n}\n\n/**\n * @since 6.0.0 The `role` prop defaults to `\"presentation\"`\n */\nexport interface ListSubheaderProps\n extends HTMLAttributes<HTMLLIElement>,\n ListSubheaderClassNameOptions {\n /**\n * @defaultValue `\"presentation\"`\n */\n role?: HTMLAttributes<HTMLLIElement>[\"role\"];\n\n /**\n * @since 6.0.0\n */\n textProps?: PropsWithRef<HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>;\n}\n\n/**\n * The `ListSubheader` is a wrapper for the `<li>` element to apply subheader\n * typography styles and {@link ListItemText} layout.\n */\nexport const ListSubheader = forwardRef<HTMLLIElement, ListSubheaderProps>(\n function ListSubheader(props, ref) {\n const {\n role = \"presentation\",\n inset = false,\n className,\n children,\n textProps,\n ...remaining\n } = props;\n\n return (\n <li\n {...remaining}\n ref={ref}\n role={role}\n className={listSubheader({\n inset,\n className,\n })}\n >\n <ListItemText {...textProps}>{children}</ListItemText>\n </li>\n );\n }\n);\n"],"names":["cnb","forwardRef","bem","ListItemText","styles","listSubheader","options","inset","className","ListSubheader","props","ref","role","children","textProps","remaining","li"],"mappings":";AAAA,SAASA,GAAG,QAAQ,YAAY;AAChC,SAA8BC,UAAU,QAAQ,QAAQ;AAGxD,SAASC,GAAG,QAAQ,kBAAkB;AACtC,SAASC,YAAY,QAAQ,oBAAoB;AAEjD,MAAMC,SAASF,IAAI;AAenB;;CAEC,GACD,OAAO,SAASG,cACdC,UAAyC,CAAC,CAAC;IAE3C,MAAM,EAAEC,QAAQ,KAAK,EAAEC,SAAS,EAAE,GAAGF;IAErC,OAAON,IAAII,OAAO;QAAEG;IAAM,IAAIC;AAChC;AAmBA;;;CAGC,GACD,OAAO,MAAMC,8BAAgBR,WAC3B,SAASQ,cAAcC,KAAK,EAAEC,GAAG;IAC/B,MAAM,EACJC,OAAO,cAAc,EACrBL,QAAQ,KAAK,EACbC,SAAS,EACTK,QAAQ,EACRC,SAAS,EACT,GAAGC,WACJ,GAAGL;IAEJ,qBACE,KAACM;QACE,GAAGD,SAAS;QACbJ,KAAKA;QACLC,MAAMA;QACNJ,WAAWH,cAAc;YACvBE;YACAC;QACF;kBAEA,cAAA,KAACL;YAAc,GAAGW,SAAS;sBAAGD;;;AAGpC,GACA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/list/listItemStyles.ts"],"sourcesContent":["import { cnb } from \"cnbuilder\";\nimport { cssUtils } from \"../cssUtils.js\";\nimport { bem } from \"../utils/bem.js\";\nimport {\n type ListItemAddonPosition,\n type ListItemAddonType,\n type ListItemHeight,\n} from \"./types.js\";\n\ndeclare module \"react\" {\n interface CSSProperties {\n \"--rmd-list-item-keyline\"?: string | number;\n \"--rmd-list-item-padding-h\"?: string | number;\n \"--rmd-list-item-padding-v\"?: string | number;\n \"--rmd-list-item-height\"?: string | number;\n \"--rmd-list-item-medium-height\"?: string | number;\n \"--rmd-list-item-large-height\"?: string | number;\n \"--rmd-list-item-extra-large-height\"?: string | number;\n \"--rmd-list-item-multiline-clamp\"?: string | number;\n \"--rmd-list-item-multiline-height\"?: string | number;\n \"--rmd-list-item-media-size\"?: string | number;\n \"--rmd-list-item-media-spacing\"?: string | number;\n \"--rmd-list-item-text-multiline-height\"?: string | number;\n }\n}\n\nconst styles = bem(\"rmd-list-item\");\n\n/** @since 6.0.0 */\nexport interface ListItemClassNameOptions {\n className?: string;\n /**\n * @see {@link ListItemHeight}\n * @defaultValue `\"auto\"`\n */\n height?: ListItemHeight;\n\n /**\n * @defaultValue `false`\n */\n multiline?: boolean;\n\n /**\n * @defaultValue `false`\n */\n disabled?: boolean;\n\n /**\n * Note: This does nothing if the `disabled` prop is not enabled.\n *\n * @defaultValue `false`\n * @since 2.4.3\n */\n disabledOpacity?: boolean;\n\n /**\n * Set this to `false` if the list item should not gain the interaction\n * states: hover, focus, press, etc. This is kind of like being disabled\n * without the disabled styles being applied.\n *\n * @defaultValue `true`\n */\n clickable?: boolean;\n}\n\n/** @since 6.0.0 */\nexport interface InternalListItemClassNameOptions\n extends ListItemClassNameOptions {\n /**\n * @defaultValue `false`\n */\n link?: boolean;\n\n /**\n * This is prop is used internally when integrating with the\n * {@link useElementInteraction} hook.\n */\n pressedClassName?: string;\n}\n\n/**\n * @since 6.0.0\n */\nexport function listItem(\n options: InternalListItemClassNameOptions = {}\n): string {\n const {\n className,\n link = false,\n height = \"auto\",\n clickable = true,\n multiline = false,\n disabled = false,\n disabledOpacity = false,\n pressedClassName,\n } = options;\n\n return cnb(\n styles({\n link,\n [height]: height !== \"auto\",\n multiline,\n \"disabled-color\": disabled && !disabledOpacity,\n \"disabled-opacity\": disabled && disabledOpacity,\n }),\n cssUtils({ surface: clickable }),\n pressedClassName,\n className\n );\n}\n\n/** @since 6.0.0 */\nexport interface ListItemTextClassNameOptions {\n className?: string;\n /**\n * @defaultValue `false`\n */\n clamped?: boolean;\n\n /**\n * @defaultValue `false`\n */\n secondary?: boolean;\n}\n\n/**\n * @since 6.0.0\n */\nexport function listItemText(\n options: ListItemTextClassNameOptions = {}\n): string {\n const { className, secondary = false, clamped = false } = options;\n\n return cnb(\n styles(\"text\", {\n clamped: secondary && clamped,\n secondary,\n }),\n className\n );\n}\n\n/** @since 6.0.0 */\nexport interface ListItemAddonClassNameOptions {\n className?: string;\n\n /**\n * The addon type that is used to adjust the spacing styles.\n *\n * @defaultValue `\"icon\"`\n */\n type?: ListItemAddonType;\n\n /**\n * The vertical position to use for the addon.\n *\n * @defaultValue `\"middle\"`\n */\n position?: ListItemAddonPosition;\n\n /**\n * Boolean if the addon should appear after the `children`.\n *\n * @defaultValue `false`\n */\n addonAfter?: boolean;\n\n /**\n * The media items are centered by default using:\n * ```scss\n * align-items: center;\n * display: flex;\n * justify-content: center;\n * ```\n *\n * When this is set to `true`, the flex styles will not be applied.\n *\n * @defaultValue `false`\n * @since 6.0.0\n */\n disableCenteredMedia?: boolean;\n\n /**\n * Set this to `true` to disable the additional spacing applied to the addons\n * that appear before the `children` and the normal `--rmd-text-icon-spacing`\n * value is used instead.\n *\n * @defaultValue `false`\n */\n disableBeforeSpacing?: boolean;\n}\n\n/**\n *\n * @since 6.0.0\n */\nexport function listItemAddon(\n options: ListItemAddonClassNameOptions = {}\n): string {\n const {\n type = \"icon\",\n position = \"middle\",\n className,\n addonAfter = false,\n disableCenteredMedia = false,\n disableBeforeSpacing = false,\n } = options;\n\n const isMedia = type === \"media\" || type === \"large-media\";\n const isAvatar = type === \"avatar\";\n\n return cnb(\n styles(\"addon\", {\n [position]: position !== \"middle\",\n before: !disableBeforeSpacing && !addonAfter,\n \"avatar-before\": !disableBeforeSpacing && !addonAfter && isAvatar,\n media: isMedia,\n \"media-large\": type === \"large-media\",\n \"media-centered\": isMedia && !disableCenteredMedia,\n }),\n className\n );\n}\n"],"names":["cnb","cssUtils","bem","styles","listItem","options","className","link","height","clickable","multiline","disabled","disabledOpacity","pressedClassName","surface","listItemText","secondary","clamped","listItemAddon","type","position","addonAfter","disableCenteredMedia","disableBeforeSpacing","isMedia","isAvatar","before","media"],"mappings":"AAAA,SAASA,GAAG,QAAQ,YAAY;
|
|
1
|
+
{"version":3,"sources":["../../src/list/listItemStyles.ts"],"sourcesContent":["import { cnb } from \"cnbuilder\";\n\nimport { cssUtils } from \"../cssUtils.js\";\nimport { bem } from \"../utils/bem.js\";\nimport {\n type ListItemAddonPosition,\n type ListItemAddonType,\n type ListItemHeight,\n} from \"./types.js\";\n\ndeclare module \"react\" {\n interface CSSProperties {\n \"--rmd-list-item-keyline\"?: string | number;\n \"--rmd-list-item-padding-h\"?: string | number;\n \"--rmd-list-item-padding-v\"?: string | number;\n \"--rmd-list-item-height\"?: string | number;\n \"--rmd-list-item-medium-height\"?: string | number;\n \"--rmd-list-item-large-height\"?: string | number;\n \"--rmd-list-item-extra-large-height\"?: string | number;\n \"--rmd-list-item-multiline-clamp\"?: string | number;\n \"--rmd-list-item-multiline-height\"?: string | number;\n \"--rmd-list-item-media-size\"?: string | number;\n \"--rmd-list-item-media-spacing\"?: string | number;\n \"--rmd-list-item-text-multiline-height\"?: string | number;\n }\n}\n\nconst styles = bem(\"rmd-list-item\");\n\n/** @since 6.0.0 */\nexport interface ListItemClassNameOptions {\n className?: string;\n /**\n * @see {@link ListItemHeight}\n * @defaultValue `\"auto\"`\n */\n height?: ListItemHeight;\n\n /**\n * @defaultValue `false`\n */\n multiline?: boolean;\n\n /**\n * @defaultValue `false`\n */\n disabled?: boolean;\n\n /**\n * Note: This does nothing if the `disabled` prop is not enabled.\n *\n * @defaultValue `false`\n * @since 2.4.3\n */\n disabledOpacity?: boolean;\n\n /**\n * Set this to `false` if the list item should not gain the interaction\n * states: hover, focus, press, etc. This is kind of like being disabled\n * without the disabled styles being applied.\n *\n * @defaultValue `true`\n */\n clickable?: boolean;\n}\n\n/** @since 6.0.0 */\nexport interface InternalListItemClassNameOptions\n extends ListItemClassNameOptions {\n /**\n * @defaultValue `false`\n */\n link?: boolean;\n\n /**\n * This is prop is used internally when integrating with the\n * {@link useElementInteraction} hook.\n */\n pressedClassName?: string;\n}\n\n/**\n * @since 6.0.0\n */\nexport function listItem(\n options: InternalListItemClassNameOptions = {}\n): string {\n const {\n className,\n link = false,\n height = \"auto\",\n clickable = true,\n multiline = false,\n disabled = false,\n disabledOpacity = false,\n pressedClassName,\n } = options;\n\n return cnb(\n styles({\n link,\n [height]: height !== \"auto\",\n multiline,\n \"disabled-color\": disabled && !disabledOpacity,\n \"disabled-opacity\": disabled && disabledOpacity,\n }),\n cssUtils({ surface: clickable }),\n pressedClassName,\n className\n );\n}\n\n/** @since 6.0.0 */\nexport interface ListItemTextClassNameOptions {\n className?: string;\n /**\n * @defaultValue `false`\n */\n clamped?: boolean;\n\n /**\n * @defaultValue `false`\n */\n secondary?: boolean;\n}\n\n/**\n * @since 6.0.0\n */\nexport function listItemText(\n options: ListItemTextClassNameOptions = {}\n): string {\n const { className, secondary = false, clamped = false } = options;\n\n return cnb(\n styles(\"text\", {\n clamped: secondary && clamped,\n secondary,\n }),\n className\n );\n}\n\n/** @since 6.0.0 */\nexport interface ListItemAddonClassNameOptions {\n className?: string;\n\n /**\n * The addon type that is used to adjust the spacing styles.\n *\n * @defaultValue `\"icon\"`\n */\n type?: ListItemAddonType;\n\n /**\n * The vertical position to use for the addon.\n *\n * @defaultValue `\"middle\"`\n */\n position?: ListItemAddonPosition;\n\n /**\n * Boolean if the addon should appear after the `children`.\n *\n * @defaultValue `false`\n */\n addonAfter?: boolean;\n\n /**\n * The media items are centered by default using:\n * ```scss\n * align-items: center;\n * display: flex;\n * justify-content: center;\n * ```\n *\n * When this is set to `true`, the flex styles will not be applied.\n *\n * @defaultValue `false`\n * @since 6.0.0\n */\n disableCenteredMedia?: boolean;\n\n /**\n * Set this to `true` to disable the additional spacing applied to the addons\n * that appear before the `children` and the normal `--rmd-text-icon-spacing`\n * value is used instead.\n *\n * @defaultValue `false`\n */\n disableBeforeSpacing?: boolean;\n}\n\n/**\n *\n * @since 6.0.0\n */\nexport function listItemAddon(\n options: ListItemAddonClassNameOptions = {}\n): string {\n const {\n type = \"icon\",\n position = \"middle\",\n className,\n addonAfter = false,\n disableCenteredMedia = false,\n disableBeforeSpacing = false,\n } = options;\n\n const isMedia = type === \"media\" || type === \"large-media\";\n const isAvatar = type === \"avatar\";\n\n return cnb(\n styles(\"addon\", {\n [position]: position !== \"middle\",\n before: !disableBeforeSpacing && !addonAfter,\n \"avatar-before\": !disableBeforeSpacing && !addonAfter && isAvatar,\n media: isMedia,\n \"media-large\": type === \"large-media\",\n \"media-centered\": isMedia && !disableCenteredMedia,\n }),\n className\n );\n}\n"],"names":["cnb","cssUtils","bem","styles","listItem","options","className","link","height","clickable","multiline","disabled","disabledOpacity","pressedClassName","surface","listItemText","secondary","clamped","listItemAddon","type","position","addonAfter","disableCenteredMedia","disableBeforeSpacing","isMedia","isAvatar","before","media"],"mappings":"AAAA,SAASA,GAAG,QAAQ,YAAY;AAEhC,SAASC,QAAQ,QAAQ,iBAAiB;AAC1C,SAASC,GAAG,QAAQ,kBAAkB;AAwBtC,MAAMC,SAASD,IAAI;AAsDnB;;CAEC,GACD,OAAO,SAASE,SACdC,UAA4C,CAAC,CAAC;IAE9C,MAAM,EACJC,SAAS,EACTC,OAAO,KAAK,EACZC,SAAS,MAAM,EACfC,YAAY,IAAI,EAChBC,YAAY,KAAK,EACjBC,WAAW,KAAK,EAChBC,kBAAkB,KAAK,EACvBC,gBAAgB,EACjB,GAAGR;IAEJ,OAAOL,IACLG,OAAO;QACLI;QACA,CAACC,OAAO,EAAEA,WAAW;QACrBE;QACA,kBAAkBC,YAAY,CAACC;QAC/B,oBAAoBD,YAAYC;IAClC,IACAX,SAAS;QAAEa,SAASL;IAAU,IAC9BI,kBACAP;AAEJ;AAgBA;;CAEC,GACD,OAAO,SAASS,aACdV,UAAwC,CAAC,CAAC;IAE1C,MAAM,EAAEC,SAAS,EAAEU,YAAY,KAAK,EAAEC,UAAU,KAAK,EAAE,GAAGZ;IAE1D,OAAOL,IACLG,OAAO,QAAQ;QACbc,SAASD,aAAaC;QACtBD;IACF,IACAV;AAEJ;AAoDA;;;CAGC,GACD,OAAO,SAASY,cACdb,UAAyC,CAAC,CAAC;IAE3C,MAAM,EACJc,OAAO,MAAM,EACbC,WAAW,QAAQ,EACnBd,SAAS,EACTe,aAAa,KAAK,EAClBC,uBAAuB,KAAK,EAC5BC,uBAAuB,KAAK,EAC7B,GAAGlB;IAEJ,MAAMmB,UAAUL,SAAS,WAAWA,SAAS;IAC7C,MAAMM,WAAWN,SAAS;IAE1B,OAAOnB,IACLG,OAAO,SAAS;QACd,CAACiB,SAAS,EAAEA,aAAa;QACzBM,QAAQ,CAACH,wBAAwB,CAACF;QAClC,iBAAiB,CAACE,wBAAwB,CAACF,cAAcI;QACzDE,OAAOH;QACP,eAAeL,SAAS;QACxB,kBAAkBK,WAAW,CAACF;IAChC,IACAhB;AAEJ"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/list/listStyles.ts"],"sourcesContent":["import { cnb } from \"cnbuilder\";\nimport { bem } from \"../utils/bem.js\";\n\ndeclare module \"react\" {\n interface CSSProperties {\n \"--rmd-list-padding-h\"?: string | number;\n \"--rmd-list-padding-v\"?: string | number;\n }\n}\n\nconst styles = bem(\"rmd-list\");\n\n/** @since 6.0.0 */\nexport interface ListClassNameOptions {\n className?: string;\n\n /** @defaultValue `false` */\n dense?: boolean;\n\n /** @defaultValue `false` */\n horizontal?: boolean;\n}\n\n/**\n * @since 6.0.0\n */\nexport function list(options: ListClassNameOptions = {}): string {\n const { dense = false, horizontal = false, className } = options;\n\n return cnb(styles({ dense, horizontal }), className);\n}\n"],"names":["cnb","bem","styles","list","options","dense","horizontal","className"],"mappings":"AAAA,SAASA,GAAG,QAAQ,YAAY;
|
|
1
|
+
{"version":3,"sources":["../../src/list/listStyles.ts"],"sourcesContent":["import { cnb } from \"cnbuilder\";\n\nimport { bem } from \"../utils/bem.js\";\n\ndeclare module \"react\" {\n interface CSSProperties {\n \"--rmd-list-padding-h\"?: string | number;\n \"--rmd-list-padding-v\"?: string | number;\n }\n}\n\nconst styles = bem(\"rmd-list\");\n\n/** @since 6.0.0 */\nexport interface ListClassNameOptions {\n className?: string;\n\n /** @defaultValue `false` */\n dense?: boolean;\n\n /** @defaultValue `false` */\n horizontal?: boolean;\n}\n\n/**\n * @since 6.0.0\n */\nexport function list(options: ListClassNameOptions = {}): string {\n const { dense = false, horizontal = false, className } = options;\n\n return cnb(styles({ dense, horizontal }), className);\n}\n"],"names":["cnb","bem","styles","list","options","dense","horizontal","className"],"mappings":"AAAA,SAASA,GAAG,QAAQ,YAAY;AAEhC,SAASC,GAAG,QAAQ,kBAAkB;AAStC,MAAMC,SAASD,IAAI;AAanB;;CAEC,GACD,OAAO,SAASE,KAAKC,UAAgC,CAAC,CAAC;IACrD,MAAM,EAAEC,QAAQ,KAAK,EAAEC,aAAa,KAAK,EAAEC,SAAS,EAAE,GAAGH;IAEzD,OAAOJ,IAAIE,OAAO;QAAEG;QAAOC;IAAW,IAAIC;AAC5C"}
|
package/dist/list/types.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/list/types.ts"],"sourcesContent":["import { type HTMLAttributes, type ReactNode } from \"react\";\nimport { type PropsWithRef } from \"../types.js\";\n\n/**\n * The height to apply to the list item.\n *\n * Conversions:\n *\n * - height !== undefined && height !== \"auto\" -> height\n * - secondaryText or left/right addon is media/media-large -> \"extra-large\"\n * - left/right addon is avatar -> \"large\"\n * - left/right addon is icon -> \"medium\"\n * - no addons and no secondary text -> \"normal\"\n */\nexport type ListItemHeight =\n | \"auto\"\n | \"normal\"\n | \"medium\"\n | \"large\"\n | \"extra-large\";\n\nexport type ListItemAddonPosition = \"top\" | \"middle\" | \"bottom\";\nexport type ListItemAddonType = \"icon\" | \"avatar\" | \"media\" | \"large-media\";\n\n/** @since 6.0.0 */\nexport interface ListItemChildrenAddonProps {\n /**\n * An optional addon to display to the left of the `primaryText` or\n * `children` and should be used with the `leftAddonType` prop to adjust\n * spacing.\n */\n leftAddon?: ReactNode;\n\n /**\n * The type of the addon that appears to the left of the `primaryText` or\n * `children`.\n *\n * @defaultValue `\"icon\"`\n */\n leftAddonType?: ListItemAddonType;\n\n /**\n * The vertical position the left icon, avatar, media, or large media\n * should be placed.\n *\n * @defaultValue `\"middle\"`\n */\n leftAddonPosition?: ListItemAddonPosition;\n\n /**\n * @since 6.0.0\n */\n leftAddonClassName?: string;\n\n /**\n * Set this to `true` if your addon does not accept a `className` prop to\n * apply the correct styling.\n *\n * @defaultValue `leftAddonType === \"media\" || leftAddonType === \"large-media\"`\n * @since 6.0.0\n */\n leftAddonForceWrap?: boolean;\n\n /**\n * Set this to `true` to disable the additional spacing applied to the addons\n * that appear before the `children` and the normal `--rmd-text-icon-spacing`\n * value is used instead.\n *\n * @defaultValue `false`\n */\n disableLeftAddonSpacing?: boolean;\n\n /**\n * An optional addon to display to the right of the `primaryText` or\n * `children` and should be used with the `rightAddonType` prop to adjust\n * spacing.\n */\n rightAddon?: ReactNode;\n\n /**\n * The type of the addon that appears to the right of the `primaryText` or\n * `children`.\n *\n * @defaultValue `\"icon\"`\n */\n rightAddonType?: ListItemAddonType;\n\n /**\n * The vertical position the right icon, avatar, media, or large media\n * should be placed.\n *\n * @defaultValue `\"middle\"`\n */\n rightAddonPosition?: ListItemAddonPosition;\n\n /**\n * @since 6.0.0\n */\n rightAddonClassName?: string;\n\n /**\n * Set this to `true` if your addon does not accept a `className` prop to\n * apply the correct styling.\n *\n * @defaultValue `rightAddonType === \"media\" || rightAddonType === \"large-media\"`\n * @since 6.0.0\n */\n rightAddonForceWrap?: boolean;\n\n /**\n * The media items are centered by default using:\n * ```scss\n * align-items: center;\n * display: flex;\n * justify-content: center;\n * ```\n *\n * When this is set to `true`, the flex styles will not be applied.\n *\n * @defaultValue `false`\n * @since 6.0.0\n */\n disableLeftAddonCenteredMedia?: boolean;\n\n /**\n * The media items are centered by default using:\n * ```scss\n * align-items: center;\n * display: flex;\n * justify-content: center;\n * ```\n *\n * When this is set to `true`, the flex styles will not be applied.\n *\n * @defaultValue `false`\n * @since 6.0.0\n */\n disableRightAddonCenteredMedia?: boolean;\n}\n\n/**\n * Note: This interface was added since there are components that replace the\n * {@link ListItemChildrenAddonProps} with renamed versions but should still\n * support everything for rendering text.\n *\n * @since 6.0.0\n */\nexport interface ListItemChildrenTextProps {\n /**\n * The main content to display that defaults to being wrapped in the\n * `ListItemText` component. Enable the {@link disableTextChildren} prop to\n * render without the additional `ListItemText` wrapper.\n */\n children?: ReactNode;\n\n /**\n * Any additional props that should be passed to the `<span>` surrounding\n * the {@link children}, {@link primaryText}, and {@link secondaryText}.\n *\n * @since 6.0.0\n */\n textProps?: PropsWithRef<HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>;\n\n /**\n * An optional className to apply to the `<span>` that surrounds the\n * `primaryText` and optionally `secondaryText` within the list item.\n */\n textClassName?: string;\n\n /**\n * An optional className to apply to the `<span>` that surrounds the\n * `secondaryText` within the list item.\n */\n secondaryTextClassName?: string;\n\n /**\n * Set this to `true` if the {@link children} should not automatically be\n * wrapped in the `ListItemText` component.\n *\n * @since 6.0.0 Renamed from `textChildren` since it was defaulted on.\n * @defaultValue `false`\n */\n disableTextChildren?: boolean;\n\n /**\n * An optional element that should be rendered as the `primaryText` within the\n * list item. It is most likely easier to use the `children` prop instead, but\n * this allows you to create more complex components with the `ListItem` since\n * you can provided `children` and have the styles for the `primaryText` still\n * applied. By default, this will only allow one line of text and add ellipsis\n * for any text overflow.\n */\n primaryText?: ReactNode;\n\n /**\n * An optional element that should be rendered as the `secondaryText` within\n * the list item. By default, this will only span one line and add ellipsis\n * for overflow.\n */\n secondaryText?: ReactNode;\n\n /**\n * Any additional props that should be passed to the `<span>` surrounding\n * the {@link secondaryText}.\n *\n * @since 6.0.0\n */\n secondaryTextProps?: PropsWithRef<\n HTMLAttributes<HTMLSpanElement>,\n HTMLSpanElement\n >;\n\n /**\n * Set this to `true` to allow the {@link secondaryText} to span multiple\n * lines and use the CSS clamp after two lines of text are visible. The number\n * of lines can be configured by `core.$list-item-multiline-clamp` or\n * `@include core.list-set-var(item-multiline-clamp, $new-value)`.\n *\n * @see {@link https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-line-clamp}\n * @defaultValue `false`\n */\n multiline?: boolean;\n}\n\n/**\n * @since 6.0.0 Extends the `ListItemChildrenTextProps` and\n * `ListItemChildrenAddonProps` interfaces.\n * @since 6.0.0 Added `textProps` and `secondaryTextClassName`\n * @since 6.0.0 Renamed `textChildren` to `disableTextChildren`\n */\nexport interface ListItemChildrenProps\n extends ListItemChildrenTextProps,\n ListItemChildrenAddonProps {}\n"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"sources":["../../src/list/types.ts"],"sourcesContent":["import { type HTMLAttributes, type ReactNode } from \"react\";\n\nimport { type PropsWithRef } from \"../types.js\";\n\n/**\n * The height to apply to the list item.\n *\n * Conversions:\n *\n * - height !== undefined && height !== \"auto\" -> height\n * - secondaryText or left/right addon is media/media-large -> \"extra-large\"\n * - left/right addon is avatar -> \"large\"\n * - left/right addon is icon -> \"medium\"\n * - no addons and no secondary text -> \"normal\"\n */\nexport type ListItemHeight =\n | \"auto\"\n | \"normal\"\n | \"medium\"\n | \"large\"\n | \"extra-large\";\n\nexport type ListItemAddonPosition = \"top\" | \"middle\" | \"bottom\";\nexport type ListItemAddonType = \"icon\" | \"avatar\" | \"media\" | \"large-media\";\n\n/** @since 6.0.0 */\nexport interface ListItemChildrenAddonProps {\n /**\n * An optional addon to display to the left of the `primaryText` or\n * `children` and should be used with the `leftAddonType` prop to adjust\n * spacing.\n */\n leftAddon?: ReactNode;\n\n /**\n * The type of the addon that appears to the left of the `primaryText` or\n * `children`.\n *\n * @defaultValue `\"icon\"`\n */\n leftAddonType?: ListItemAddonType;\n\n /**\n * The vertical position the left icon, avatar, media, or large media\n * should be placed.\n *\n * @defaultValue `\"middle\"`\n */\n leftAddonPosition?: ListItemAddonPosition;\n\n /**\n * @since 6.0.0\n */\n leftAddonClassName?: string;\n\n /**\n * Set this to `true` if your addon does not accept a `className` prop to\n * apply the correct styling.\n *\n * @defaultValue `leftAddonType === \"media\" || leftAddonType === \"large-media\"`\n * @since 6.0.0\n */\n leftAddonForceWrap?: boolean;\n\n /**\n * Set this to `true` to disable the additional spacing applied to the addons\n * that appear before the `children` and the normal `--rmd-text-icon-spacing`\n * value is used instead.\n *\n * @defaultValue `false`\n */\n disableLeftAddonSpacing?: boolean;\n\n /**\n * An optional addon to display to the right of the `primaryText` or\n * `children` and should be used with the `rightAddonType` prop to adjust\n * spacing.\n */\n rightAddon?: ReactNode;\n\n /**\n * The type of the addon that appears to the right of the `primaryText` or\n * `children`.\n *\n * @defaultValue `\"icon\"`\n */\n rightAddonType?: ListItemAddonType;\n\n /**\n * The vertical position the right icon, avatar, media, or large media\n * should be placed.\n *\n * @defaultValue `\"middle\"`\n */\n rightAddonPosition?: ListItemAddonPosition;\n\n /**\n * @since 6.0.0\n */\n rightAddonClassName?: string;\n\n /**\n * Set this to `true` if your addon does not accept a `className` prop to\n * apply the correct styling.\n *\n * @defaultValue `rightAddonType === \"media\" || rightAddonType === \"large-media\"`\n * @since 6.0.0\n */\n rightAddonForceWrap?: boolean;\n\n /**\n * The media items are centered by default using:\n * ```scss\n * align-items: center;\n * display: flex;\n * justify-content: center;\n * ```\n *\n * When this is set to `true`, the flex styles will not be applied.\n *\n * @defaultValue `false`\n * @since 6.0.0\n */\n disableLeftAddonCenteredMedia?: boolean;\n\n /**\n * The media items are centered by default using:\n * ```scss\n * align-items: center;\n * display: flex;\n * justify-content: center;\n * ```\n *\n * When this is set to `true`, the flex styles will not be applied.\n *\n * @defaultValue `false`\n * @since 6.0.0\n */\n disableRightAddonCenteredMedia?: boolean;\n}\n\n/**\n * Note: This interface was added since there are components that replace the\n * {@link ListItemChildrenAddonProps} with renamed versions but should still\n * support everything for rendering text.\n *\n * @since 6.0.0\n */\nexport interface ListItemChildrenTextProps {\n /**\n * The main content to display that defaults to being wrapped in the\n * `ListItemText` component. Enable the {@link disableTextChildren} prop to\n * render without the additional `ListItemText` wrapper.\n */\n children?: ReactNode;\n\n /**\n * Any additional props that should be passed to the `<span>` surrounding\n * the {@link children}, {@link primaryText}, and {@link secondaryText}.\n *\n * @since 6.0.0\n */\n textProps?: PropsWithRef<HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>;\n\n /**\n * An optional className to apply to the `<span>` that surrounds the\n * `primaryText` and optionally `secondaryText` within the list item.\n */\n textClassName?: string;\n\n /**\n * An optional className to apply to the `<span>` that surrounds the\n * `secondaryText` within the list item.\n */\n secondaryTextClassName?: string;\n\n /**\n * Set this to `true` if the {@link children} should not automatically be\n * wrapped in the `ListItemText` component.\n *\n * @since 6.0.0 Renamed from `textChildren` since it was defaulted on.\n * @defaultValue `false`\n */\n disableTextChildren?: boolean;\n\n /**\n * An optional element that should be rendered as the `primaryText` within the\n * list item. It is most likely easier to use the `children` prop instead, but\n * this allows you to create more complex components with the `ListItem` since\n * you can provided `children` and have the styles for the `primaryText` still\n * applied. By default, this will only allow one line of text and add ellipsis\n * for any text overflow.\n */\n primaryText?: ReactNode;\n\n /**\n * An optional element that should be rendered as the `secondaryText` within\n * the list item. By default, this will only span one line and add ellipsis\n * for overflow.\n */\n secondaryText?: ReactNode;\n\n /**\n * Any additional props that should be passed to the `<span>` surrounding\n * the {@link secondaryText}.\n *\n * @since 6.0.0\n */\n secondaryTextProps?: PropsWithRef<\n HTMLAttributes<HTMLSpanElement>,\n HTMLSpanElement\n >;\n\n /**\n * Set this to `true` to allow the {@link secondaryText} to span multiple\n * lines and use the CSS clamp after two lines of text are visible. The number\n * of lines can be configured by `core.$list-item-multiline-clamp` or\n * `@include core.list-set-var(item-multiline-clamp, $new-value)`.\n *\n * @see {@link https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-line-clamp}\n * @defaultValue `false`\n */\n multiline?: boolean;\n}\n\n/**\n * @since 6.0.0 Extends the `ListItemChildrenTextProps` and\n * `ListItemChildrenAddonProps` interfaces.\n * @since 6.0.0 Added `textProps` and `secondaryTextClassName`\n * @since 6.0.0 Renamed `textChildren` to `disableTextChildren`\n */\nexport interface ListItemChildrenProps\n extends ListItemChildrenTextProps,\n ListItemChildrenAddonProps {}\n"],"names":[],"mappings":"AAiOA;;;;;CAKC,GACD,WAEiC"}
|
|
@@ -6,7 +6,7 @@ import { type AppSize, type AppSizeQueries } from "./appSize.js";
|
|
|
6
6
|
*
|
|
7
7
|
* @example Simple Example
|
|
8
8
|
* ```tsx
|
|
9
|
-
* import { useAppSize } from "@react-md/core";
|
|
9
|
+
* import { useAppSize } from "@react-md/core/media-queries/AppSizeProvider";
|
|
10
10
|
*
|
|
11
11
|
* function Example() {
|
|
12
12
|
* const { isPhone, isTablet, isDesktop, isLargeDesktop, isLandscape } =
|
|
@@ -21,7 +21,7 @@ const { Provider } = context;
|
|
|
21
21
|
*
|
|
22
22
|
* @example Simple Example
|
|
23
23
|
* ```tsx
|
|
24
|
-
* import { useAppSize } from "@react-md/core";
|
|
24
|
+
* import { useAppSize } from "@react-md/core/media-queries/AppSizeProvider";
|
|
25
25
|
*
|
|
26
26
|
* function Example() {
|
|
27
27
|
* const { isPhone, isTablet, isDesktop, isLargeDesktop, isLandscape } =
|