@react-md/core 1.0.0-next.14 → 1.0.0-next.15
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/.eslintrc.cjs +8 -0
- package/.turbo/turbo-build.log +22 -22
- package/.turbo/turbo-lint.log +3 -3
- package/.turbo/turbo-test.log +4000 -3982
- package/.turbo/turbo-typecheck.log +1 -23
- package/CHANGELOG.md +13 -0
- package/coverage/clover.xml +477 -410
- package/coverage/coverage-final.json +5 -4
- package/coverage/lcov-report/autocomplete/Autocomplete.tsx.html +81 -15
- package/coverage/lcov-report/autocomplete/AutocompleteClearButton.tsx.html +262 -0
- package/coverage/lcov-report/autocomplete/FilterAutocompleteOptions.tsx.html +364 -0
- package/coverage/lcov-report/autocomplete/index.html +48 -18
- package/coverage/lcov-report/card/Card.tsx.html +349 -0
- package/coverage/lcov-report/card/CardSubtitle.tsx.html +265 -0
- package/coverage/lcov-report/card/index.html +146 -0
- package/coverage/lcov-report/card/styles.ts.html +682 -0
- package/coverage/lcov-report/form/Option.tsx.html +727 -0
- package/coverage/lcov-report/form/index.html +131 -0
- package/coverage/lcov-report/form/useListboxProvider.ts.html +253 -0
- package/coverage/lcov-report/index.html +22 -37
- package/coverage/lcov-report/src/card/Card.tsx.html +349 -0
- package/coverage/lcov-report/src/card/CardSubtitle.tsx.html +277 -0
- package/coverage/lcov-report/src/card/index.html +146 -0
- package/coverage/lcov-report/src/card/styles.ts.html +682 -0
- package/coverage/lcov-report/src/cssUtils.ts.html +787 -0
- package/coverage/lcov-report/src/index.html +116 -0
- package/coverage/lcov-report/src/transition/index.html +116 -0
- package/coverage/lcov-report/src/transition/useCSSTransition.ts.html +766 -0
- package/coverage/lcov-report/transition/index.html +116 -0
- package/coverage/lcov-report/transition/useCSSTransition.ts.html +766 -0
- package/coverage/lcov.info +572 -456
- 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/app-bar/AppBar.js.map +1 -1
- package/dist/app-bar/AppBarTitle.d.ts +8 -4
- package/dist/app-bar/AppBarTitle.js +3 -2
- package/dist/app-bar/AppBarTitle.js.map +1 -1
- package/dist/autocomplete/Autocomplete.js.map +1 -1
- package/dist/autocomplete/AutocompleteCircularProgress.js.map +1 -1
- package/dist/autocomplete/AutocompleteDropdownButton.js.map +1 -1
- package/dist/autocomplete/FilterAutocompleteOptions.js.map +1 -1
- package/dist/autocomplete/autocompleteStyles.js.map +1 -1
- package/dist/autocomplete/defaults.d.ts +2 -2
- package/dist/autocomplete/defaults.js +3 -3
- package/dist/autocomplete/defaults.js.map +1 -1
- package/dist/autocomplete/types.js.map +1 -1
- package/dist/avatar/Avatar.d.ts +1 -2
- package/dist/avatar/Avatar.js +1 -2
- 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/box/Box.js.map +1 -1
- 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/button/buttonUnstyledStyles.js.map +1 -1
- package/dist/card/Card.d.ts +2 -1
- 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.d.ts +6 -0
- package/dist/card/CardSubtitle.js +2 -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/styles.js +2 -4
- package/dist/card/styles.js.map +1 -1
- package/dist/chip/Chip.js.map +1 -1
- package/dist/chip/styles.js.map +1 -1
- package/dist/cssUtils.d.ts +1 -1
- package/dist/cssUtils.js.map +1 -1
- package/dist/delegateEvent.js.map +1 -1
- package/dist/dialog/Dialog.js.map +1 -1
- package/dist/dialog/DialogContainer.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.map +1 -1
- package/dist/dialog/NestedDialogProvider.js.map +1 -1
- 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.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.map +1 -1
- package/dist/expansion-panel/useExpansionList.js.map +1 -1
- package/dist/expansion-panel/useExpansionPanels.js.map +1 -1
- package/dist/focus/useFocusContainer.js.map +1 -1
- package/dist/focus/utils.js.map +1 -1
- package/dist/form/Checkbox.js.map +1 -1
- package/dist/form/Fieldset.js.map +1 -1
- package/dist/form/FileInput.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.map +1 -1
- package/dist/form/Label.js.map +1 -1
- package/dist/form/Legend.js.map +1 -1
- package/dist/form/MenuItemCheckbox.js.map +1 -1
- 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.map +1 -1
- package/dist/form/OptGroup.js.map +1 -1
- package/dist/form/Option.js.map +1 -1
- 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.map +1 -1
- package/dist/form/SelectedOption.js.map +1 -1
- 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.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/fileUtils.js.map +1 -1
- package/dist/form/formConfig.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.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.js.map +1 -1
- package/dist/form/useCombobox.js.map +1 -1
- package/dist/form/useEditableCombobox.js.map +1 -1
- package/dist/form/useFileUpload.js.map +1 -1
- package/dist/form/useFormReset.js.map +1 -1
- package/dist/form/useListboxProvider.js.map +1 -1
- package/dist/form/useNumberField.js.map +1 -1
- package/dist/form/useRadioGroup.js.map +1 -1
- 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.js.map +1 -1
- package/dist/form/useTextField.js.map +1 -1
- package/dist/form/useTextFieldContainerAddons.js.map +1 -1
- package/dist/form/utils.js.map +1 -1
- package/dist/form/validation.js.map +1 -1
- package/dist/hoverMode/useHoverMode.js.map +1 -1
- package/dist/hoverMode/useHoverModeProvider.js.map +1 -1
- package/dist/icon/FontIcon.d.ts +10 -6
- package/dist/icon/FontIcon.js +1 -5
- package/dist/icon/FontIcon.js.map +1 -1
- package/dist/icon/IconRotator.js.map +1 -1
- package/dist/icon/MaterialIcon.d.ts +19 -2
- package/dist/icon/MaterialIcon.js +14 -2
- package/dist/icon/MaterialIcon.js.map +1 -1
- package/dist/icon/MaterialSymbol.js.map +1 -1
- package/dist/icon/SVGIcon.d.ts +3 -0
- package/dist/icon/SVGIcon.js.map +1 -1
- package/dist/icon/TextIconSpacing.js.map +1 -1
- package/dist/icon/iconConfig.d.ts +1 -0
- package/dist/icon/iconConfig.js +1 -0
- package/dist/icon/iconConfig.js.map +1 -1
- package/dist/icon/material.d.ts +1 -1
- package/dist/icon/material.js.map +1 -1
- package/dist/icon/materialConfig.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/config.js.map +1 -1
- package/dist/interaction/types.js.map +1 -1
- package/dist/interaction/useElementInteraction.js.map +1 -1
- 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/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.js.map +1 -1
- package/dist/layout/useHorizontalLayoutTransition.js.map +1 -1
- package/dist/layout/useLayoutAppBarHeight.js.map +1 -1
- 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.js.map +1 -1
- package/dist/layout/useTemporaryLayout.js.map +1 -1
- package/dist/link/Link.d.ts +2 -4
- package/dist/link/Link.js +1 -2
- package/dist/link/Link.js.map +1 -1
- package/dist/link/SkipToMainContent.d.ts +10 -3
- package/dist/link/SkipToMainContent.js +4 -1
- package/dist/link/SkipToMainContent.js.map +1 -1
- package/dist/link/styles.d.ts +2 -2
- package/dist/link/styles.js.map +1 -1
- package/dist/list/List.js.map +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/getListItemHeight.js.map +1 -1
- package/dist/list/listItemStyles.js.map +1 -1
- package/dist/list/types.js.map +1 -1
- package/dist/media-queries/AppSizeProvider.js.map +1 -1
- package/dist/media-queries/appSize.js.map +1 -1
- 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.map +1 -1
- package/dist/menu/MenuConfigurationProvider.js.map +1 -1
- package/dist/menu/MenuItem.js.map +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/menu/utils.js.map +1 -1
- package/dist/movement/constants.js.map +1 -1
- package/dist/movement/findMatchIndex.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.map +1 -1
- package/dist/navigation/NavItemLink.js.map +1 -1
- package/dist/navigation/NavSubheader.js.map +1 -1
- package/dist/navigation/Navigation.js.map +1 -1
- package/dist/navigation/getHrefFromParents.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.js.map +1 -1
- package/dist/overlay/Overlay.d.ts +1 -0
- package/dist/overlay/Overlay.js.map +1 -1
- package/dist/overlay/overlayStyles.js.map +1 -1
- package/dist/portal/Portal.d.ts +4 -0
- package/dist/portal/Portal.js.map +1 -1
- package/dist/portal/PortalContainerProvider.d.ts +8 -3
- package/dist/portal/PortalContainerProvider.js +1 -0
- package/dist/portal/PortalContainerProvider.js.map +1 -1
- package/dist/positioning/constants.js.map +1 -1
- package/dist/positioning/createHorizontalPosition.js.map +1 -1
- package/dist/positioning/createVerticalPosition.js.map +1 -1
- package/dist/positioning/getFixedPosition.js.map +1 -1
- package/dist/positioning/types.js.map +1 -1
- package/dist/positioning/useFixedPositioning.js.map +1 -1
- package/dist/positioning/utils.js.map +1 -1
- package/dist/progress/CircularProgress.d.ts +5 -4
- package/dist/progress/CircularProgress.js.map +1 -1
- package/dist/progress/LinearProgress.js.map +1 -1
- package/dist/progress/getProgressA11y.js.map +1 -1
- package/dist/progress/types.js.map +1 -1
- package/dist/responsive-item/ResponsiveItemContainer.js.map +1 -1
- package/dist/responsive-item/ResponsiveItemOverlay.js.map +1 -1
- package/dist/responsive-item/styles.js.map +1 -1
- package/dist/scroll/ScrollLock.js.map +1 -1
- package/dist/scroll/getScrollbarWidth.js.map +1 -1
- package/dist/scroll/useScrollLock.js.map +1 -1
- package/dist/searching/caseInsensitive.js.map +1 -1
- package/dist/searching/fuzzy.js.map +1 -1
- package/dist/searching/toSearchQuery.js.map +1 -1
- package/dist/searching/types.js.map +1 -1
- package/dist/searching/useFuzzyMatch.js.map +1 -1
- package/dist/searching/utils.js.map +1 -1
- package/dist/segmented-button/SegmentedButton.js.map +1 -1
- package/dist/segmented-button/SegmentedButtonContainer.js.map +1 -1
- 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.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/suspense/CircularProgressSuspense.js.map +1 -1
- package/dist/suspense/NullSuspense.js.map +1 -1
- package/dist/table/StickyTableSection.d.ts +23 -0
- package/dist/table/StickyTableSection.js +56 -0
- package/dist/table/StickyTableSection.js.map +1 -0
- package/dist/table/Table.d.ts +1 -1
- package/dist/table/Table.js.map +1 -1
- package/dist/table/TableBody.d.ts +1 -1
- package/dist/table/TableBody.js.map +1 -1
- package/dist/table/TableCell.d.ts +3 -2
- package/dist/table/TableCell.js.map +1 -1
- package/dist/table/TableCellContent.d.ts +1 -2
- package/dist/table/TableCellContent.js.map +1 -1
- package/dist/table/TableCheckbox.js.map +1 -1
- package/dist/table/TableConfigurationProvider.d.ts +1 -73
- 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.d.ts +8 -17
- package/dist/table/TableFooter.js +17 -80
- package/dist/table/TableFooter.js.map +1 -1
- package/dist/table/TableHeader.d.ts +8 -17
- package/dist/table/TableHeader.js +20 -87
- package/dist/table/TableHeader.js.map +1 -1
- package/dist/table/TableRadio.js.map +1 -1
- package/dist/table/TableRow.d.ts +1 -1
- package/dist/table/TableRow.js.map +1 -1
- package/dist/table/tableCellStyles.d.ts +1 -1
- package/dist/table/tableCellStyles.js.map +1 -1
- package/dist/table/tableContainerStyles.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/types.d.ts +89 -9
- package/dist/table/types.js.map +1 -1
- package/dist/table/useStickyTableSection.d.ts +27 -0
- package/dist/table/useStickyTableSection.js +84 -0
- package/dist/table/useStickyTableSection.js.map +1 -0
- package/dist/table/useTableSectionConfig.d.ts +13 -0
- package/dist/table/useTableSectionConfig.js +33 -0
- package/dist/table/useTableSectionConfig.js.map +1 -0
- package/dist/tabs/Tab.js.map +1 -1
- package/dist/tabs/TabList.js.map +1 -1
- package/dist/tabs/TabListScrollButton.js.map +1 -1
- package/dist/tabs/tabIndicatorStyles.js.map +1 -1
- package/dist/tabs/tabListScrollButtonStyles.js.map +1 -1
- package/dist/tabs/tabListStyles.js.map +1 -1
- package/dist/tabs/tabStyles.js.map +1 -1
- package/dist/tabs/useTabList.js.map +1 -1
- package/dist/tabs/useTabs.js.map +1 -1
- package/dist/tabs/utils.js.map +1 -1
- package/dist/test-utils/IntersectionObserver.js.map +1 -1
- package/dist/test-utils/ResizeObserver.js.map +1 -1
- package/dist/test-utils/data-testid.js.map +1 -1
- package/dist/test-utils/index.js.map +1 -1
- package/dist/test-utils/jest-setup.js.map +1 -1
- package/dist/test-utils/matchMedia.js.map +1 -1
- package/dist/test-utils/polyfills/IntersectionObserver.js.map +1 -1
- package/dist/test-utils/polyfills/ResizeObserver.js.map +1 -1
- package/dist/test-utils/polyfills/TextDecoder.js.map +1 -1
- package/dist/test-utils/polyfills/TextEncoder.js.map +1 -1
- package/dist/test-utils/polyfills/index.js.map +1 -1
- package/dist/test-utils/polyfills/matchMedia.js.map +1 -1
- package/dist/test-utils/polyfills/offsetParent.js.map +1 -1
- package/dist/test-utils/polyfills/scrollIntoView.js.map +1 -1
- package/dist/test-utils/render.js.map +1 -1
- package/dist/test-utils/timers.js.map +1 -1
- package/dist/theme/LocalStorageColorSchemeProvider.js.map +1 -1
- package/dist/theme/ThemeProvider.js.map +1 -1
- package/dist/theme/_theme.scss +2 -1
- package/dist/theme/colors.js.map +1 -1
- package/dist/theme/cssVars.js.map +1 -1
- package/dist/theme/types.js.map +1 -1
- package/dist/theme/useCSSVariables.js.map +1 -1
- package/dist/theme/useColorScheme.js.map +1 -1
- package/dist/theme/useColorSchemeMetaTag.js.map +1 -1
- package/dist/theme/useColorSchemeProvider.js.map +1 -1
- package/dist/theme/usePrefersColorScheme.js.map +1 -1
- package/dist/theme/utils.js.map +1 -1
- package/dist/tooltip/Tooltip.d.ts +20 -9
- package/dist/tooltip/Tooltip.js.map +1 -1
- package/dist/tooltip/TooltipHoverModeProvider.js.map +1 -1
- package/dist/tooltip/constants.js.map +1 -1
- package/dist/tooltip/tooltipStyles.js.map +1 -1
- package/dist/tooltip/useTooltip.d.ts +30 -16
- package/dist/tooltip/useTooltip.js.map +1 -1
- package/dist/tooltip/useTooltipPosition.d.ts +2 -4
- package/dist/tooltip/useTooltipPosition.js.map +1 -1
- package/dist/tooltip/utils.js.map +1 -1
- package/dist/transition/CSSTransition.js.map +1 -1
- package/dist/transition/Collapse.js.map +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.js.map +1 -1
- package/dist/transition/maxWidthTransition.js.map +1 -1
- package/dist/transition/skeletonPlaceholderUtils.js.map +1 -1
- package/dist/transition/types.d.ts +19 -24
- package/dist/transition/types.js.map +1 -1
- package/dist/transition/useCSSTransition.js.map +1 -1
- package/dist/transition/useCarousel.js.map +1 -1
- package/dist/transition/useCollapseTransition.js.map +1 -1
- package/dist/transition/useCrossFadeTransition.js.map +1 -1
- package/dist/transition/useMaxWidthTransition.js.map +1 -1
- package/dist/transition/useScaleTransition.js.map +1 -1
- package/dist/transition/useSkeletonPlaceholder.js.map +1 -1
- package/dist/transition/useSlideTransition.js.map +1 -1
- package/dist/transition/useTransition.d.ts +1 -0
- package/dist/transition/useTransition.js +1 -0
- package/dist/transition/useTransition.js.map +1 -1
- package/dist/transition/utils.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.map +1 -1
- package/dist/tree/TreeProvider.js.map +1 -1
- package/dist/tree/styles.js.map +1 -1
- package/dist/tree/types.js.map +1 -1
- package/dist/tree/useTree.d.ts +3 -3
- package/dist/tree/useTree.js.map +1 -1
- package/dist/tree/useTreeExpansion.js.map +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/tree/utils.js.map +1 -1
- package/dist/types.js.map +1 -1
- package/dist/typography/SrOnly.js.map +1 -1
- package/dist/typography/TextContainer.d.ts +4 -0
- package/dist/typography/TextContainer.js +2 -0
- package/dist/typography/TextContainer.js.map +1 -1
- package/dist/typography/Typography.d.ts +10 -0
- package/dist/typography/Typography.js +3 -0
- 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.js.map +1 -1
- package/dist/useDebouncedFunction.js.map +1 -1
- package/dist/useDropzone.js.map +1 -1
- package/dist/useElementSize.js.map +1 -1
- package/dist/useEnsuredId.js.map +1 -1
- package/dist/useEnsuredRef.js.map +1 -1
- package/dist/useEnsuredState.js.map +1 -1
- package/dist/useHtmlClassName.js.map +1 -1
- package/dist/useIntersectionObserver.js.map +1 -1
- package/dist/useIsomorphicLayoutEffect.js.map +1 -1
- package/dist/useLocalStorage.js.map +1 -1
- package/dist/useMutationObserver.js.map +1 -1
- package/dist/useOrientation.js.map +1 -1
- package/dist/usePageInactive.js.map +1 -1
- package/dist/useResizeListener.js.map +1 -1
- package/dist/useResizeObserver.js.map +1 -1
- package/dist/useThrottledFunction.js.map +1 -1
- package/dist/useToggle.js.map +1 -1
- package/dist/useUnmounted.js.map +1 -1
- package/dist/useWindowSize.js.map +1 -1
- package/dist/utils/RenderRecursively.js.map +1 -1
- package/dist/utils/alphaNumericSort.js.map +1 -1
- package/dist/utils/applyRef.js.map +1 -1
- package/dist/utils/bem.js.map +1 -1
- package/dist/utils/getClientPosition.js.map +1 -1
- package/dist/utils/getMiddleOfRange.js.map +1 -1
- package/dist/utils/getPercentage.js.map +1 -1
- package/dist/utils/getRangeDefaultValue.js.map +1 -1
- package/dist/utils/getRangeSteps.js.map +1 -1
- package/dist/utils/identity.js.map +1 -1
- package/dist/utils/isElementVisible.js.map +1 -1
- package/dist/utils/loop.js.map +1 -1
- package/dist/utils/nearest.js.map +1 -1
- package/dist/utils/parseCssLengthUnit.js.map +1 -1
- package/dist/utils/randomInt.js.map +1 -1
- package/dist/utils/wait.js.map +1 -1
- package/dist/utils/withinRange.js.map +1 -1
- package/dist/window-splitter/WindowSplitter.js.map +1 -1
- package/dist/window-splitter/useWindowSplitter.js.map +1 -1
- package/package.json +21 -20
- package/scripts/getExportMap.ts +66 -0
- package/scripts/tsconfig.json +1 -1
- package/src/app-bar/AppBarTitle.tsx +8 -4
- package/src/autocomplete/defaults.ts +3 -3
- package/src/avatar/Avatar.tsx +1 -2
- package/src/card/Card.tsx +2 -1
- package/src/card/CardSubtitle.tsx +9 -0
- package/src/card/__tests__/__snapshots__/CardHeader.tsx.snap +1 -1
- package/src/card/__tests__/__snapshots__/CardSubtitle.tsx.snap +2 -2
- package/src/card/__tests__/__snapshots__/styles.ts.snap +1 -1
- package/src/card/styles.ts +2 -6
- package/src/cssUtils.ts +1 -1
- package/src/icon/FontIcon.tsx +19 -9
- package/src/icon/MaterialIcon.tsx +23 -4
- package/src/icon/SVGIcon.tsx +3 -0
- package/src/icon/iconConfig.tsx +1 -0
- package/src/icon/material.ts +276 -19
- package/src/link/Link.tsx +2 -4
- package/src/link/SkipToMainContent.tsx +11 -4
- package/src/link/styles.ts +2 -2
- package/src/overlay/Overlay.tsx +1 -0
- package/src/portal/Portal.tsx +5 -0
- package/src/portal/PortalContainerProvider.tsx +16 -7
- package/src/progress/CircularProgress.tsx +5 -4
- package/src/table/StickyTableSection.tsx +91 -0
- package/src/table/Table.tsx +2 -5
- package/src/table/TableBody.tsx +1 -2
- package/src/table/TableCell.tsx +3 -5
- package/src/table/TableCellContent.tsx +1 -3
- package/src/table/TableConfigurationProvider.tsx +1 -86
- package/src/table/TableFooter.tsx +19 -116
- package/src/table/TableHeader.tsx +20 -118
- package/src/table/TableRow.tsx +2 -4
- package/src/table/__tests__/Table.tsx +9 -8
- package/src/table/tableCellStyles.ts +1 -1
- package/src/table/types.ts +105 -10
- package/src/table/useStickyTableSection.tsx +126 -0
- package/src/table/useTableSectionConfig.ts +45 -0
- package/src/theme/_theme.scss +2 -1
- package/src/tooltip/Tooltip.tsx +24 -8
- package/src/tooltip/useTooltip.ts +52 -27
- package/src/tooltip/useTooltipPosition.ts +2 -4
- package/src/transition/types.ts +23 -27
- package/src/transition/useTransition.ts +1 -0
- package/src/tree/useTree.ts +3 -5
- package/src/typography/TextContainer.tsx +4 -0
- package/src/typography/Typography.tsx +10 -0
- package/src/useResizeListener.ts +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/CoreProviders.tsx"],"sourcesContent":["\"use client\";\nimport { type ReactElement, type ReactNode } from \"react\";\nimport { SsrProvider } from \"./SsrProvider.js\";\nimport { UserInteractionModeProvider } from \"./interaction/UserInteractionModeProvider.js\";\nimport { AppSizeProvider } from \"./media-queries/AppSizeProvider.js\";\nimport {\n DEFAULT_APP_SIZE,\n DEFAULT_APP_SIZE_QUERIES,\n type AppSize,\n type AppSizeQueries,\n} from \"./media-queries/appSize.js\";\nimport {\n PortalContainerProvider,\n type PortalContainer,\n} from \"./portal/PortalContainerProvider.js\";\n\n/* eslint-disable @typescript-eslint/no-unused-vars */\nimport { type MenuConfigurationProvider } from \"./menu/MenuConfigurationProvider.js\";\nimport { type Snackbar } from \"./snackbar/Snackbar.js\";\nimport { type LocalStorageColorSchemeProvider } from \"./theme/LocalStorageColorSchemeProvider.js\";\nimport { type ThemeProvider } from \"./theme/ThemeProvider.js\";\nimport { type useColorSchemeProvider } from \"./theme/useColorSchemeProvider.js\";\nimport { type TooltipHoverModeProvider } from \"./tooltip/TooltipHoverModeProvider.js\";\nimport { type WritingDirectionProvider } from \"./typography/WritingDirectionProvider.js\";\n/* eslint-enable @typescript-eslint/no-unused-vars */\n\n/** @since 6.0.0 */\nexport interface ReactMDCoreConfiguration {\n /**\n * Set this to `true` if you are using SSR. This will update some hook\n * behavior so that you will not have mismatched initial state between server\n * and client and correctly rehydrate after initial render.\n *\n * @defaultValue `false`\n */\n ssr?: boolean;\n\n /**\n * @defaultValue `DEFAULT_APP_SIZE`\n * @see {@link DEFAULT_APP_SIZE}\n */\n ssrAppSize?: Readonly<AppSize>;\n\n /**\n * @defaultValue `DEFAULT_APP_SIZE_QUERIES`\n * @see {@link DEFAULT_APP_SIZE_QUERIES}\n */\n appSizeQueries?: Readonly<AppSizeQueries>;\n\n /** @see {@link PortalContainerProvider} */\n portalContainer?: PortalContainer;\n}\n\n/** @since 6.0.0 */\nexport interface CoreProvidersProps extends ReactMDCoreConfiguration {\n children: ReactNode;\n}\n\n/**\n * **Client Component**\n *\n * This is a convenience wrapper for initializing providers for react-md. This\n * includes configuration for:\n *\n * - {@link SsrProvider}\n * - {@link PortalContainerProvider}\n * - {@link AppSizeProvider}\n * - {@link UserInteractionModeProvider}\n *\n * This does not include every provider within `react-md` to help decrease the\n * bundle size for unused features. Here are some other providers that might be\n * useful to initialize near the root of your app:\n *\n * - {@link MenuConfigurationProvider} - If you want to render menus as sheets\n * on phones or other configuration.\n * - {@link LocalStorageColorSchemeProvider}/{@link useColorSchemeProvider} - If\n * you want to allow the user to select a light, dark, or system theme\n * - {@link WritingDirectionProvider} - If you need dynamic support for ltr and\n * rtl languages\n * - {@link ThemeProvider} - If you allow the user to dynamically configure the\n * `react-md` theme\n * - {@link TooltipHoverModeProvider} - If you want tooltips to appear\n * immediately for a time after another tooltip has become visible. You can\n * also configure the global visible delay.\n * - {@link Snackbar} - This isn't a provider but this is how you can display\n * alerts in your app\n *\n * @since 6.0.0\n */\nexport function CoreProviders(props: CoreProvidersProps): ReactElement {\n const {\n ssr = false,\n ssrAppSize = DEFAULT_APP_SIZE,\n appSizeQueries = DEFAULT_APP_SIZE_QUERIES,\n portalContainer,\n children,\n } = props;\n return (\n <SsrProvider ssr={ssr}>\n <PortalContainerProvider container={portalContainer}>\n <UserInteractionModeProvider>\n <AppSizeProvider {...appSizeQueries} ssrSize={ssrAppSize}>\n {children}\n </AppSizeProvider>\n </UserInteractionModeProvider>\n </PortalContainerProvider>\n </SsrProvider>\n );\n}\n"],"names":["SsrProvider","UserInteractionModeProvider","AppSizeProvider","DEFAULT_APP_SIZE","DEFAULT_APP_SIZE_QUERIES","PortalContainerProvider","CoreProviders","props","ssr","ssrAppSize","appSizeQueries","portalContainer","children","container","ssrSize"],"
|
|
1
|
+
{"version":3,"sources":["../src/CoreProviders.tsx"],"sourcesContent":["\"use client\";\nimport { type ReactElement, type ReactNode } from \"react\";\nimport { SsrProvider } from \"./SsrProvider.js\";\nimport { UserInteractionModeProvider } from \"./interaction/UserInteractionModeProvider.js\";\nimport { AppSizeProvider } from \"./media-queries/AppSizeProvider.js\";\nimport {\n DEFAULT_APP_SIZE,\n DEFAULT_APP_SIZE_QUERIES,\n type AppSize,\n type AppSizeQueries,\n} from \"./media-queries/appSize.js\";\nimport {\n PortalContainerProvider,\n type PortalContainer,\n} from \"./portal/PortalContainerProvider.js\";\n\n/* eslint-disable @typescript-eslint/no-unused-vars */\nimport { type MenuConfigurationProvider } from \"./menu/MenuConfigurationProvider.js\";\nimport { type Snackbar } from \"./snackbar/Snackbar.js\";\nimport { type LocalStorageColorSchemeProvider } from \"./theme/LocalStorageColorSchemeProvider.js\";\nimport { type ThemeProvider } from \"./theme/ThemeProvider.js\";\nimport { type useColorSchemeProvider } from \"./theme/useColorSchemeProvider.js\";\nimport { type TooltipHoverModeProvider } from \"./tooltip/TooltipHoverModeProvider.js\";\nimport { type WritingDirectionProvider } from \"./typography/WritingDirectionProvider.js\";\n/* eslint-enable @typescript-eslint/no-unused-vars */\n\n/** @since 6.0.0 */\nexport interface ReactMDCoreConfiguration {\n /**\n * Set this to `true` if you are using SSR. This will update some hook\n * behavior so that you will not have mismatched initial state between server\n * and client and correctly rehydrate after initial render.\n *\n * @defaultValue `false`\n */\n ssr?: boolean;\n\n /**\n * @defaultValue `DEFAULT_APP_SIZE`\n * @see {@link DEFAULT_APP_SIZE}\n */\n ssrAppSize?: Readonly<AppSize>;\n\n /**\n * @defaultValue `DEFAULT_APP_SIZE_QUERIES`\n * @see {@link DEFAULT_APP_SIZE_QUERIES}\n */\n appSizeQueries?: Readonly<AppSizeQueries>;\n\n /** @see {@link PortalContainerProvider} */\n portalContainer?: PortalContainer;\n}\n\n/** @since 6.0.0 */\nexport interface CoreProvidersProps extends ReactMDCoreConfiguration {\n children: ReactNode;\n}\n\n/**\n * **Client Component**\n *\n * This is a convenience wrapper for initializing providers for react-md. This\n * includes configuration for:\n *\n * - {@link SsrProvider}\n * - {@link PortalContainerProvider}\n * - {@link AppSizeProvider}\n * - {@link UserInteractionModeProvider}\n *\n * This does not include every provider within `react-md` to help decrease the\n * bundle size for unused features. Here are some other providers that might be\n * useful to initialize near the root of your app:\n *\n * - {@link MenuConfigurationProvider} - If you want to render menus as sheets\n * on phones or other configuration.\n * - {@link LocalStorageColorSchemeProvider}/{@link useColorSchemeProvider} - If\n * you want to allow the user to select a light, dark, or system theme\n * - {@link WritingDirectionProvider} - If you need dynamic support for ltr and\n * rtl languages\n * - {@link ThemeProvider} - If you allow the user to dynamically configure the\n * `react-md` theme\n * - {@link TooltipHoverModeProvider} - If you want tooltips to appear\n * immediately for a time after another tooltip has become visible. You can\n * also configure the global visible delay.\n * - {@link Snackbar} - This isn't a provider but this is how you can display\n * alerts in your app\n *\n * @since 6.0.0\n */\nexport function CoreProviders(props: CoreProvidersProps): ReactElement {\n const {\n ssr = false,\n ssrAppSize = DEFAULT_APP_SIZE,\n appSizeQueries = DEFAULT_APP_SIZE_QUERIES,\n portalContainer,\n children,\n } = props;\n return (\n <SsrProvider ssr={ssr}>\n <PortalContainerProvider container={portalContainer}>\n <UserInteractionModeProvider>\n <AppSizeProvider {...appSizeQueries} ssrSize={ssrAppSize}>\n {children}\n </AppSizeProvider>\n </UserInteractionModeProvider>\n </PortalContainerProvider>\n </SsrProvider>\n );\n}\n"],"names":["SsrProvider","UserInteractionModeProvider","AppSizeProvider","DEFAULT_APP_SIZE","DEFAULT_APP_SIZE_QUERIES","PortalContainerProvider","CoreProviders","props","ssr","ssrAppSize","appSizeQueries","portalContainer","children","container","ssrSize"],"mappings":"AAAA;;AAEA,SAASA,WAAW,QAAQ,mBAAmB;AAC/C,SAASC,2BAA2B,QAAQ,+CAA+C;AAC3F,SAASC,eAAe,QAAQ,qCAAqC;AACrE,SACEC,gBAAgB,EAChBC,wBAAwB,QAGnB,6BAA6B;AACpC,SACEC,uBAAuB,QAElB,sCAAsC;AA4C7C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA8BC,GACD,OAAO,SAASC,cAAcC,KAAyB;IACrD,MAAM,EACJC,MAAM,KAAK,EACXC,aAAaN,gBAAgB,EAC7BO,iBAAiBN,wBAAwB,EACzCO,eAAe,EACfC,QAAQ,EACT,GAAGL;IACJ,qBACE,KAACP;QAAYQ,KAAKA;kBAChB,cAAA,KAACH;YAAwBQ,WAAWF;sBAClC,cAAA,KAACV;0BACC,cAAA,KAACC;oBAAiB,GAAGQ,cAAc;oBAAEI,SAASL;8BAC3CG;;;;;AAMb"}
|
package/dist/NoSsr.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/NoSsr.tsx"],"sourcesContent":["\"use client\";\nimport { useEffect, useState, type ReactElement, type ReactNode } from \"react\";\nimport { useSsr } from \"./SsrProvider.js\";\n\n/** @since 6.0.0 */\nexport interface NoSsrProps {\n children: ReactNode;\n}\n\n/**\n * **Client Component**\n *\n * A small wrapper that can be used to render children client side only. The\n * main use-case are for components that rely on browser API to work correctly.\n *\n * @example Simple Example\n * ```tsx\n * import { CoreProviders, NoSsr, Typography } from \"@react-md/core\";\n * import type { ReactElement } from \"react\";\n *\n * function Example(): ReactElement {\n * return (\n * <>\n * <Typography>This is always rendered.</Typography>\n * <NoSsr>\n * <Typography>\n * This is only rendered client-side after rehydrating.\n * </Typography>\n * </NoSsr>\n * </>\n * );\n * }\n *\n * function App(): ReactElement {\n * return (\n * <CoreProviders ssr>\n * <Example />\n * </CoreProviders>\n * );\n * }\n * ```\n *\n * @since 6.0.0\n */\nexport function NoSsr(props: NoSsrProps): ReactElement {\n const { children } = props;\n const ssr = useSsr();\n const [rendered, setRendered] = useState(!ssr);\n useEffect(() => {\n setRendered(true);\n }, []);\n\n return <>{rendered && children}</>;\n}\n"],"names":["useEffect","useState","useSsr","NoSsr","props","children","ssr","rendered","setRendered"],"
|
|
1
|
+
{"version":3,"sources":["../src/NoSsr.tsx"],"sourcesContent":["\"use client\";\nimport { useEffect, useState, type ReactElement, type ReactNode } from \"react\";\nimport { useSsr } from \"./SsrProvider.js\";\n\n/** @since 6.0.0 */\nexport interface NoSsrProps {\n children: ReactNode;\n}\n\n/**\n * **Client Component**\n *\n * A small wrapper that can be used to render children client side only. The\n * main use-case are for components that rely on browser API to work correctly.\n *\n * @example Simple Example\n * ```tsx\n * import { CoreProviders, NoSsr, Typography } from \"@react-md/core\";\n * import type { ReactElement } from \"react\";\n *\n * function Example(): ReactElement {\n * return (\n * <>\n * <Typography>This is always rendered.</Typography>\n * <NoSsr>\n * <Typography>\n * This is only rendered client-side after rehydrating.\n * </Typography>\n * </NoSsr>\n * </>\n * );\n * }\n *\n * function App(): ReactElement {\n * return (\n * <CoreProviders ssr>\n * <Example />\n * </CoreProviders>\n * );\n * }\n * ```\n *\n * @since 6.0.0\n */\nexport function NoSsr(props: NoSsrProps): ReactElement {\n const { children } = props;\n const ssr = useSsr();\n const [rendered, setRendered] = useState(!ssr);\n useEffect(() => {\n setRendered(true);\n }, []);\n\n return <>{rendered && children}</>;\n}\n"],"names":["useEffect","useState","useSsr","NoSsr","props","children","ssr","rendered","setRendered"],"mappings":"AAAA;;AACA,SAASA,SAAS,EAAEC,QAAQ,QAA2C,QAAQ;AAC/E,SAASC,MAAM,QAAQ,mBAAmB;AAO1C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkCC,GACD,OAAO,SAASC,MAAMC,KAAiB;IACrC,MAAM,EAAEC,QAAQ,EAAE,GAAGD;IACrB,MAAME,MAAMJ;IACZ,MAAM,CAACK,UAAUC,YAAY,GAAGP,SAAS,CAACK;IAC1CN,UAAU;QACRQ,YAAY;IACd,GAAG,EAAE;IAEL,qBAAO;kBAAGD,YAAYF;;AACxB"}
|
package/dist/RootHtml.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/RootHtml.tsx"],"sourcesContent":["import {\n type HTMLAttributes,\n type HtmlHTMLAttributes,\n type ReactElement,\n type ReactNode,\n} from \"react\";\nimport { type PropsWithRef } from \"./types.js\";\n\n/**\n * @since 6.0.0\n */\nexport interface RootHtmlProps extends HtmlHTMLAttributes<HTMLHtmlElement> {\n /** @defaultValue `\"ltr\"` */\n dir?: string;\n\n /** @defaultValue `\"en\"` */\n lang?: string;\n\n /**\n * Any additional props to provide to the `<body>` element and also supports a\n * `ref` if that is required for some reason. Using a `ref` would make your\n * root layout a client component though.\n */\n bodyProps?: PropsWithRef<HTMLAttributes<HTMLBodyElement>, HTMLBodyElement>;\n\n /**\n * Convenience prop to replace `bodyProps={{ className: \"custom-class-name\" }}`.\n */\n bodyClassName?: string;\n\n /**\n * Any content to render before the `<body>` tag. This can be useful if you\n * need to render a custom `<head>` element.\n */\n beforeBodyChildren?: ReactNode;\n\n /**\n * Any content to render after the `<body>` tag. This can be useful to insert\n * `<script>` tags for analytics or other external libraries.\n */\n afterBodyChildren?: ReactNode;\n}\n\n/**\n * **Server Component**\n *\n * This is mostly for creating the root html for next.js applications that\n * defaults to setting the `dir=\"ltr\"` and `lang=\"en\"`. Additional props can be\n * passed to the root `<html>` and `<body>` elements and children can be\n * rendered before and after the `<body>` if needed.\n *\n * @example Simple Example\n * ```tsx\n * // src/app/layout.tsx\n * import { RootHtml } from \"@react-md/core\";\n * import { type ReactElement, type PropsWithChildren } from \"react\";\n * import { Roboto_Flex } from \"next/font/google\";\n *\n * const roboto = Roboto_Flex({\n * subsets: [\"latin\"],\n * variable: \"--roboto\",\n * });\n *\n * export default function RootLayout(props: PropsWithChildren): ReactElement {\n * const { children } = props;\n *\n * return <RootHtml className={roboto.variable}>{children}</RootHtml>;\n * }\n * ```\n *\n * @since 6.0.0\n */\nexport function RootHtml(props: RootHtmlProps): ReactElement {\n const {\n dir = \"ltr\",\n lang = \"en\",\n children,\n bodyProps,\n bodyClassName,\n beforeBodyChildren,\n afterBodyChildren,\n ...remaining\n } = props;\n\n return (\n <html dir={dir} lang={lang} {...remaining}>\n {beforeBodyChildren}\n <body {...bodyProps} className={bodyClassName || bodyProps?.className}>\n {children}\n </body>\n {afterBodyChildren}\n </html>\n );\n}\n"],"names":["RootHtml","props","dir","lang","children","bodyProps","bodyClassName","beforeBodyChildren","afterBodyChildren","remaining","html","body","className"],"
|
|
1
|
+
{"version":3,"sources":["../src/RootHtml.tsx"],"sourcesContent":["import {\n type HTMLAttributes,\n type HtmlHTMLAttributes,\n type ReactElement,\n type ReactNode,\n} from \"react\";\nimport { type PropsWithRef } from \"./types.js\";\n\n/**\n * @since 6.0.0\n */\nexport interface RootHtmlProps extends HtmlHTMLAttributes<HTMLHtmlElement> {\n /** @defaultValue `\"ltr\"` */\n dir?: string;\n\n /** @defaultValue `\"en\"` */\n lang?: string;\n\n /**\n * Any additional props to provide to the `<body>` element and also supports a\n * `ref` if that is required for some reason. Using a `ref` would make your\n * root layout a client component though.\n */\n bodyProps?: PropsWithRef<HTMLAttributes<HTMLBodyElement>, HTMLBodyElement>;\n\n /**\n * Convenience prop to replace `bodyProps={{ className: \"custom-class-name\" }}`.\n */\n bodyClassName?: string;\n\n /**\n * Any content to render before the `<body>` tag. This can be useful if you\n * need to render a custom `<head>` element.\n */\n beforeBodyChildren?: ReactNode;\n\n /**\n * Any content to render after the `<body>` tag. This can be useful to insert\n * `<script>` tags for analytics or other external libraries.\n */\n afterBodyChildren?: ReactNode;\n}\n\n/**\n * **Server Component**\n *\n * This is mostly for creating the root html for next.js applications that\n * defaults to setting the `dir=\"ltr\"` and `lang=\"en\"`. Additional props can be\n * passed to the root `<html>` and `<body>` elements and children can be\n * rendered before and after the `<body>` if needed.\n *\n * @example Simple Example\n * ```tsx\n * // src/app/layout.tsx\n * import { RootHtml } from \"@react-md/core\";\n * import { type ReactElement, type PropsWithChildren } from \"react\";\n * import { Roboto_Flex } from \"next/font/google\";\n *\n * const roboto = Roboto_Flex({\n * subsets: [\"latin\"],\n * variable: \"--roboto\",\n * });\n *\n * export default function RootLayout(props: PropsWithChildren): ReactElement {\n * const { children } = props;\n *\n * return <RootHtml className={roboto.variable}>{children}</RootHtml>;\n * }\n * ```\n *\n * @since 6.0.0\n */\nexport function RootHtml(props: RootHtmlProps): ReactElement {\n const {\n dir = \"ltr\",\n lang = \"en\",\n children,\n bodyProps,\n bodyClassName,\n beforeBodyChildren,\n afterBodyChildren,\n ...remaining\n } = props;\n\n return (\n <html dir={dir} lang={lang} {...remaining}>\n {beforeBodyChildren}\n <body {...bodyProps} className={bodyClassName || bodyProps?.className}>\n {children}\n </body>\n {afterBodyChildren}\n </html>\n );\n}\n"],"names":["RootHtml","props","dir","lang","children","bodyProps","bodyClassName","beforeBodyChildren","afterBodyChildren","remaining","html","body","className"],"mappings":";AA2CA;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4BC,GACD,OAAO,SAASA,SAASC,KAAoB;IAC3C,MAAM,EACJC,MAAM,KAAK,EACXC,OAAO,IAAI,EACXC,QAAQ,EACRC,SAAS,EACTC,aAAa,EACbC,kBAAkB,EAClBC,iBAAiB,EACjB,GAAGC,WACJ,GAAGR;IAEJ,qBACE,MAACS;QAAKR,KAAKA;QAAKC,MAAMA;QAAO,GAAGM,SAAS;;YACtCF;0BACD,KAACI;gBAAM,GAAGN,SAAS;gBAAEO,WAAWN,iBAAiBD,WAAWO;0BACzDR;;YAEFI;;;AAGP"}
|
package/dist/SsrProvider.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/SsrProvider.tsx"],"sourcesContent":["\"use client\";\nimport {\n createContext,\n useContext,\n useEffect,\n useState,\n type ReactElement,\n type ReactNode,\n} from \"react\";\n\nconst context = createContext(false);\nconst { Provider } = context;\ncontext.displayName = \"Ssr\";\n\n/**\n * @since 6.0.0\n */\nexport function useSsr(): boolean {\n return useContext(context);\n}\n\n/**\n * @since 6.0.0\n */\nexport interface SsrProviderProps {\n ssr?: boolean;\n children: ReactNode;\n}\n\n/**\n * **Client Component**\n *\n * @since 6.0.0\n */\nexport function SsrProvider(props: SsrProviderProps): ReactElement {\n const { ssr = false, children } = props;\n const [isSsr, setSsr] = useState(ssr);\n useEffect(() => {\n setSsr(false);\n }, []);\n return <Provider value={isSsr}>{children}</Provider>;\n}\n"],"names":["createContext","useContext","useEffect","useState","context","Provider","displayName","useSsr","SsrProvider","props","ssr","children","isSsr","setSsr","value"],"
|
|
1
|
+
{"version":3,"sources":["../src/SsrProvider.tsx"],"sourcesContent":["\"use client\";\nimport {\n createContext,\n useContext,\n useEffect,\n useState,\n type ReactElement,\n type ReactNode,\n} from \"react\";\n\nconst context = createContext(false);\nconst { Provider } = context;\ncontext.displayName = \"Ssr\";\n\n/**\n * @since 6.0.0\n */\nexport function useSsr(): boolean {\n return useContext(context);\n}\n\n/**\n * @since 6.0.0\n */\nexport interface SsrProviderProps {\n ssr?: boolean;\n children: ReactNode;\n}\n\n/**\n * **Client Component**\n *\n * @since 6.0.0\n */\nexport function SsrProvider(props: SsrProviderProps): ReactElement {\n const { ssr = false, children } = props;\n const [isSsr, setSsr] = useState(ssr);\n useEffect(() => {\n setSsr(false);\n }, []);\n return <Provider value={isSsr}>{children}</Provider>;\n}\n"],"names":["createContext","useContext","useEffect","useState","context","Provider","displayName","useSsr","SsrProvider","props","ssr","children","isSsr","setSsr","value"],"mappings":"AAAA;;AACA,SACEA,aAAa,EACbC,UAAU,EACVC,SAAS,EACTC,QAAQ,QAGH,QAAQ;AAEf,MAAMC,wBAAUJ,cAAc;AAC9B,MAAM,EAAEK,QAAQ,EAAE,GAAGD;AACrBA,QAAQE,WAAW,GAAG;AAEtB;;CAEC,GACD,OAAO,SAASC;IACd,OAAON,WAAWG;AACpB;AAUA;;;;CAIC,GACD,OAAO,SAASI,YAAYC,KAAuB;IACjD,MAAM,EAAEC,MAAM,KAAK,EAAEC,QAAQ,EAAE,GAAGF;IAClC,MAAM,CAACG,OAAOC,OAAO,GAAGV,SAASO;IACjCR,UAAU;QACRW,OAAO;IACT,GAAG,EAAE;IACL,qBAAO,KAACR;QAASS,OAAOF;kBAAQD;;AAClC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/app-bar/AppBar.tsx"],"sourcesContent":["import { cnb } from \"cnbuilder\";\nimport {\n forwardRef,\n type ElementType,\n type HTMLAttributes,\n type Ref,\n} from \"react\";\nimport { box, type BoxOptions } from \"../box/styles.js\";\nimport {\n cssUtils,\n type BackgroundColor,\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n type CssUtilsOptions,\n} from \"../cssUtils.js\";\nimport { type CssPosition } from \"../types.js\";\nimport { bem } from \"../utils/bem.js\";\n\ndeclare module \"react\" {\n interface CSSProperties {\n \"--rmd-app-bar-height\"?: string | number;\n \"--rmd-app-bar-background-color\"?: string;\n \"--rmd-app-bar-color\"?: string;\n \"--rmd-app-bar-surface-background-color\"?: string;\n \"--rmd-app-bar-surface-color\"?: string;\n }\n}\n\nconst styles = bem(\"rmd-app-bar\");\n\nexport type AppBarPosition = \"top\" | \"bottom\";\n\n/**\n * - `\"clear\"` - the background color will be transparent\n * - `\"primary\"` - defaults to the current primary theme color\n * - `\"secondary\"` - defaults to the current secondary theme color\n * - `\"surface\"` - this will use the current surface background color which\n * defaults to `#fff` for light themes, `#242424` for dark themes, and\n * `#424242` for dark themes when the `$disable-dark-elevation` is set to\n * `true`\n *\n * The default dark theme surface color also depends on the `$fixed-elevation`\n * value.\n */\nexport type AppBarTheme = BackgroundColor | \"clear\";\n\n/**\n * - `\"auto\"` - the height will be determined by the height of the content\n * - `\"normal\"` - defaults to `3.5rem` (`$height`)\n * - `\"prominent\"` - defaults to `7rem` (`$prominent-height`)\n * - `\"dense\"` - defaults to `3rem` (`$dense-height`)\n * - `\"prominent-dense\"` - defaults to `6rem` (`$prominent-dense-height`)\n */\nexport type AppBarHeight =\n | \"auto\"\n | \"normal\"\n | \"prominent\"\n | \"dense\"\n | \"prominent-dense\";\n\n/** @since 6.0.0 */\nexport interface AppBarClassNameOptions extends Omit<BoxOptions, \"fullWidth\"> {\n className?: string;\n\n /**\n * Set this to `\"fixed\"` or `\"sticky\"` to set `position: fixed;` or\n * `position: sticky;` to the app bar. The default position will be static and\n * inline with other content.\n *\n * @defaultValue `'static'`\n */\n position?: CssPosition;\n\n /**\n * The position within the page to \"fix\" the `AppBar` when the `fixed` prop is\n * enabled.\n *\n * @defaultValue `\"top\"`\n */\n pagePosition?: AppBarPosition;\n\n /**\n * Set this to `true` to remove the box-shadow.\n *\n * @defaultValue `false`\n */\n disableElevation?: boolean;\n\n /**\n * The theme to apply to the `AppBar`.\n *\n * @defaultValue `\"primary\"`\n * @see {@link AppBarTheme}\n */\n theme?: AppBarTheme;\n\n /**\n * @defaultValue `stacked ? \"auto\" : \"normal\"`\n * @see {@link AppBarHeight}\n */\n height?: AppBarHeight;\n\n /** @see {@link CssUtilsOptions.surfaceColor} */\n surfaceColor?: \"light\" | \"dark\";\n\n /**\n * Set this to `true` if the app bar's positioning and width should be\n * changed whenever the scrollbar is visible on the page. This defaults to\n * `true` when the {@link position} prop is `true` so that once dialogs and menus\n * become visible the contents in the app bar do not need to be repainted.\n *\n * @since 6.0.0\n * @defaultValue `position === \"fixed\"`\n */\n scrollbarOffset?: boolean;\n}\n\n/**\n * Apply the `className`s for a tree component. This will be type-safe if using\n * typescript.\n *\n * @since 6.0.0\n */\nexport function appBar(options: AppBarClassNameOptions = {}): string {\n const {\n className,\n theme = \"primary\",\n stacked,\n height = stacked ? \"auto\" : \"normal\",\n position = \"static\",\n pagePosition = \"top\",\n scrollbarOffset = position === \"fixed\",\n align,\n grid,\n gridColumns,\n gridName,\n justify,\n reversed,\n surfaceColor,\n disableWrap = true,\n disablePadding,\n disableElevation,\n } = options;\n const surface = theme === \"surface\";\n const clear = theme === \"clear\";\n\n return cnb(\n styles({\n surface,\n [height]: height !== \"normal\",\n fixed: position !== \"static\",\n stacked,\n sticky: position === \"sticky\",\n [pagePosition]: position !== \"static\",\n elevated: position !== \"static\" && !disableElevation,\n \"scrollbar-offset\": scrollbarOffset,\n \"static-scrollbar-offset\": position === \"static\" && scrollbarOffset,\n }),\n box({\n align,\n stacked,\n fullWidth: true,\n grid,\n gridColumns,\n gridName,\n justify,\n reversed,\n disableWrap,\n disablePadding,\n }),\n cssUtils({\n backgroundColor: !surface && !clear ? theme : undefined,\n surfaceColor,\n }),\n className\n );\n}\n\n/** @since 6.0.0 */\nexport type CustomAppBarComponent = ElementType<\n HTMLAttributes<HTMLDivElement> & {\n ref?: Ref<HTMLDivElement>;\n className: string;\n }\n>;\n\n/**\n * @since 6.0.0 Renamed the `component` prop to `as` and updated the default\n * value to be a `\"div\"` when `fixed` is `false`.\n * @since 6.0.0 Renamed the `fixedElevation` prop to `disableFixedElevation` to\n * match naming conventions when a feature is enabled by default.\n * @since 6.0.0 Removed the `inheritColor` and `flexWrap` props since they are\n * no longer required.\n * @since 6.0.0 Removed the `fixed` prop in favor of the new `position` prop\n * which enables position `fixed` or `sticky` behavior.\n * @since 6.0.0 Added the {@link stacked} and {@link scrollbarOffset} props.\n */\nexport interface AppBarProps\n extends HTMLAttributes<HTMLDivElement>,\n AppBarClassNameOptions {\n /** @defaultValue `fixed ? \"header\" : \"div\"` */\n as?: CustomAppBarComponent;\n}\n\n/**\n * **Server Component**\n *\n * @example Simple Example\n * ```tsx\n * import { AppBar, AppBarTitle, Button } from \"@react-md/core\";\n * import MenuIcon from \"@react-md/material-icons/MenuIcon\";\n * import MoreVertIcon from \"@react-md/material-icons/MoreVertIcon\";\n * import type { ReactElement } from \"react\";\n *\n * function Example(): ReactElement {\n * return (\n * <AppBar>\n * <Button aria-label=\"Navigation\"><MenuIcon /></Button>\n * <AppBarTitle>My Main Title</AppBarTitle>\n * <Button aria-label=\"Options\"><MoreVertIcon /></Button>\n * </AppBar>\n * );\n * }\n * ```\n *\n * @since 6.0.0 The `AppBar` was updated to use `gap` for spacing\n * instead of requiring the `AppBarNav` and `AppBarAction` components.\n */\nexport const AppBar = forwardRef<HTMLDivElement, AppBarProps>(\n function AppBar(props, ref) {\n const {\n className,\n theme,\n stacked,\n height,\n align,\n grid,\n gridName,\n justify,\n reversed,\n gridColumns,\n disableWrap,\n disablePadding,\n position,\n pagePosition,\n surfaceColor,\n scrollbarOffset,\n disableElevation,\n as: Component = position ? \"header\" : \"div\",\n children,\n ...remaining\n } = props;\n\n return (\n <Component\n {...remaining}\n className={appBar({\n className,\n theme,\n position,\n pagePosition,\n disableElevation,\n scrollbarOffset,\n height,\n grid,\n gridName,\n gridColumns,\n align,\n stacked,\n justify,\n reversed,\n surfaceColor,\n disableWrap,\n disablePadding,\n })}\n ref={ref}\n >\n {children}\n </Component>\n );\n }\n);\n"],"names":["cnb","forwardRef","box","cssUtils","bem","styles","appBar","options","className","theme","stacked","height","position","pagePosition","scrollbarOffset","align","grid","gridColumns","gridName","justify","reversed","surfaceColor","disableWrap","disablePadding","disableElevation","surface","clear","fixed","sticky","elevated","fullWidth","backgroundColor","undefined","AppBar","props","ref","as","Component","children","remaining"],"
|
|
1
|
+
{"version":3,"sources":["../../src/app-bar/AppBar.tsx"],"sourcesContent":["import { cnb } from \"cnbuilder\";\nimport {\n forwardRef,\n type ElementType,\n type HTMLAttributes,\n type Ref,\n} from \"react\";\nimport { box, type BoxOptions } from \"../box/styles.js\";\nimport {\n cssUtils,\n type BackgroundColor,\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n type CssUtilsOptions,\n} from \"../cssUtils.js\";\nimport { type CssPosition } from \"../types.js\";\nimport { bem } from \"../utils/bem.js\";\n\ndeclare module \"react\" {\n interface CSSProperties {\n \"--rmd-app-bar-height\"?: string | number;\n \"--rmd-app-bar-background-color\"?: string;\n \"--rmd-app-bar-color\"?: string;\n \"--rmd-app-bar-surface-background-color\"?: string;\n \"--rmd-app-bar-surface-color\"?: string;\n }\n}\n\nconst styles = bem(\"rmd-app-bar\");\n\nexport type AppBarPosition = \"top\" | \"bottom\";\n\n/**\n * - `\"clear\"` - the background color will be transparent\n * - `\"primary\"` - defaults to the current primary theme color\n * - `\"secondary\"` - defaults to the current secondary theme color\n * - `\"surface\"` - this will use the current surface background color which\n * defaults to `#fff` for light themes, `#242424` for dark themes, and\n * `#424242` for dark themes when the `$disable-dark-elevation` is set to\n * `true`\n *\n * The default dark theme surface color also depends on the `$fixed-elevation`\n * value.\n */\nexport type AppBarTheme = BackgroundColor | \"clear\";\n\n/**\n * - `\"auto\"` - the height will be determined by the height of the content\n * - `\"normal\"` - defaults to `3.5rem` (`$height`)\n * - `\"prominent\"` - defaults to `7rem` (`$prominent-height`)\n * - `\"dense\"` - defaults to `3rem` (`$dense-height`)\n * - `\"prominent-dense\"` - defaults to `6rem` (`$prominent-dense-height`)\n */\nexport type AppBarHeight =\n | \"auto\"\n | \"normal\"\n | \"prominent\"\n | \"dense\"\n | \"prominent-dense\";\n\n/** @since 6.0.0 */\nexport interface AppBarClassNameOptions extends Omit<BoxOptions, \"fullWidth\"> {\n className?: string;\n\n /**\n * Set this to `\"fixed\"` or `\"sticky\"` to set `position: fixed;` or\n * `position: sticky;` to the app bar. The default position will be static and\n * inline with other content.\n *\n * @defaultValue `'static'`\n */\n position?: CssPosition;\n\n /**\n * The position within the page to \"fix\" the `AppBar` when the `fixed` prop is\n * enabled.\n *\n * @defaultValue `\"top\"`\n */\n pagePosition?: AppBarPosition;\n\n /**\n * Set this to `true` to remove the box-shadow.\n *\n * @defaultValue `false`\n */\n disableElevation?: boolean;\n\n /**\n * The theme to apply to the `AppBar`.\n *\n * @defaultValue `\"primary\"`\n * @see {@link AppBarTheme}\n */\n theme?: AppBarTheme;\n\n /**\n * @defaultValue `stacked ? \"auto\" : \"normal\"`\n * @see {@link AppBarHeight}\n */\n height?: AppBarHeight;\n\n /** @see {@link CssUtilsOptions.surfaceColor} */\n surfaceColor?: \"light\" | \"dark\";\n\n /**\n * Set this to `true` if the app bar's positioning and width should be\n * changed whenever the scrollbar is visible on the page. This defaults to\n * `true` when the {@link position} prop is `true` so that once dialogs and menus\n * become visible the contents in the app bar do not need to be repainted.\n *\n * @since 6.0.0\n * @defaultValue `position === \"fixed\"`\n */\n scrollbarOffset?: boolean;\n}\n\n/**\n * Apply the `className`s for a tree component. This will be type-safe if using\n * typescript.\n *\n * @since 6.0.0\n */\nexport function appBar(options: AppBarClassNameOptions = {}): string {\n const {\n className,\n theme = \"primary\",\n stacked,\n height = stacked ? \"auto\" : \"normal\",\n position = \"static\",\n pagePosition = \"top\",\n scrollbarOffset = position === \"fixed\",\n align,\n grid,\n gridColumns,\n gridName,\n justify,\n reversed,\n surfaceColor,\n disableWrap = true,\n disablePadding,\n disableElevation,\n } = options;\n const surface = theme === \"surface\";\n const clear = theme === \"clear\";\n\n return cnb(\n styles({\n surface,\n [height]: height !== \"normal\",\n fixed: position !== \"static\",\n stacked,\n sticky: position === \"sticky\",\n [pagePosition]: position !== \"static\",\n elevated: position !== \"static\" && !disableElevation,\n \"scrollbar-offset\": scrollbarOffset,\n \"static-scrollbar-offset\": position === \"static\" && scrollbarOffset,\n }),\n box({\n align,\n stacked,\n fullWidth: true,\n grid,\n gridColumns,\n gridName,\n justify,\n reversed,\n disableWrap,\n disablePadding,\n }),\n cssUtils({\n backgroundColor: !surface && !clear ? theme : undefined,\n surfaceColor,\n }),\n className\n );\n}\n\n/** @since 6.0.0 */\nexport type CustomAppBarComponent = ElementType<\n HTMLAttributes<HTMLDivElement> & {\n ref?: Ref<HTMLDivElement>;\n className: string;\n }\n>;\n\n/**\n * @since 6.0.0 Renamed the `component` prop to `as` and updated the default\n * value to be a `\"div\"` when `fixed` is `false`.\n * @since 6.0.0 Renamed the `fixedElevation` prop to `disableFixedElevation` to\n * match naming conventions when a feature is enabled by default.\n * @since 6.0.0 Removed the `inheritColor` and `flexWrap` props since they are\n * no longer required.\n * @since 6.0.0 Removed the `fixed` prop in favor of the new `position` prop\n * which enables position `fixed` or `sticky` behavior.\n * @since 6.0.0 Added the {@link stacked} and {@link scrollbarOffset} props.\n */\nexport interface AppBarProps\n extends HTMLAttributes<HTMLDivElement>,\n AppBarClassNameOptions {\n /** @defaultValue `fixed ? \"header\" : \"div\"` */\n as?: CustomAppBarComponent;\n}\n\n/**\n * **Server Component**\n *\n * @example Simple Example\n * ```tsx\n * import { AppBar, AppBarTitle, Button } from \"@react-md/core\";\n * import MenuIcon from \"@react-md/material-icons/MenuIcon\";\n * import MoreVertIcon from \"@react-md/material-icons/MoreVertIcon\";\n * import type { ReactElement } from \"react\";\n *\n * function Example(): ReactElement {\n * return (\n * <AppBar>\n * <Button aria-label=\"Navigation\"><MenuIcon /></Button>\n * <AppBarTitle>My Main Title</AppBarTitle>\n * <Button aria-label=\"Options\"><MoreVertIcon /></Button>\n * </AppBar>\n * );\n * }\n * ```\n *\n * @since 6.0.0 The `AppBar` was updated to use `gap` for spacing\n * instead of requiring the `AppBarNav` and `AppBarAction` components.\n */\nexport const AppBar = forwardRef<HTMLDivElement, AppBarProps>(\n function AppBar(props, ref) {\n const {\n className,\n theme,\n stacked,\n height,\n align,\n grid,\n gridName,\n justify,\n reversed,\n gridColumns,\n disableWrap,\n disablePadding,\n position,\n pagePosition,\n surfaceColor,\n scrollbarOffset,\n disableElevation,\n as: Component = position ? \"header\" : \"div\",\n children,\n ...remaining\n } = props;\n\n return (\n <Component\n {...remaining}\n className={appBar({\n className,\n theme,\n position,\n pagePosition,\n disableElevation,\n scrollbarOffset,\n height,\n grid,\n gridName,\n gridColumns,\n align,\n stacked,\n justify,\n reversed,\n surfaceColor,\n disableWrap,\n disablePadding,\n })}\n ref={ref}\n >\n {children}\n </Component>\n );\n }\n);\n"],"names":["cnb","forwardRef","box","cssUtils","bem","styles","appBar","options","className","theme","stacked","height","position","pagePosition","scrollbarOffset","align","grid","gridColumns","gridName","justify","reversed","surfaceColor","disableWrap","disablePadding","disableElevation","surface","clear","fixed","sticky","elevated","fullWidth","backgroundColor","undefined","AppBar","props","ref","as","Component","children","remaining"],"mappings":";AAAA,SAASA,GAAG,QAAQ,YAAY;AAChC,SACEC,UAAU,QAIL,QAAQ;AACf,SAASC,GAAG,QAAyB,mBAAmB;AACxD,SACEC,QAAQ,QAIH,iBAAiB;AAExB,SAASC,GAAG,QAAQ,kBAAkB;AAYtC,MAAMC,SAASD,IAAI;AAyFnB;;;;;CAKC,GACD,OAAO,SAASE,OAAOC,UAAkC,CAAC,CAAC;IACzD,MAAM,EACJC,SAAS,EACTC,QAAQ,SAAS,EACjBC,OAAO,EACPC,SAASD,UAAU,SAAS,QAAQ,EACpCE,WAAW,QAAQ,EACnBC,eAAe,KAAK,EACpBC,kBAAkBF,aAAa,OAAO,EACtCG,KAAK,EACLC,IAAI,EACJC,WAAW,EACXC,QAAQ,EACRC,OAAO,EACPC,QAAQ,EACRC,YAAY,EACZC,cAAc,IAAI,EAClBC,cAAc,EACdC,gBAAgB,EACjB,GAAGjB;IACJ,MAAMkB,UAAUhB,UAAU;IAC1B,MAAMiB,QAAQjB,UAAU;IAExB,OAAOT,IACLK,OAAO;QACLoB;QACA,CAACd,OAAO,EAAEA,WAAW;QACrBgB,OAAOf,aAAa;QACpBF;QACAkB,QAAQhB,aAAa;QACrB,CAACC,aAAa,EAAED,aAAa;QAC7BiB,UAAUjB,aAAa,YAAY,CAACY;QACpC,oBAAoBV;QACpB,2BAA2BF,aAAa,YAAYE;IACtD,IACAZ,IAAI;QACFa;QACAL;QACAoB,WAAW;QACXd;QACAC;QACAC;QACAC;QACAC;QACAE;QACAC;IACF,IACApB,SAAS;QACP4B,iBAAiB,CAACN,WAAW,CAACC,QAAQjB,QAAQuB;QAC9CX;IACF,IACAb;AAEJ;AA4BA;;;;;;;;;;;;;;;;;;;;;;;CAuBC,GACD,OAAO,MAAMyB,uBAAShC,WACpB,SAASgC,OAAOC,KAAK,EAAEC,GAAG;IACxB,MAAM,EACJ3B,SAAS,EACTC,KAAK,EACLC,OAAO,EACPC,MAAM,EACNI,KAAK,EACLC,IAAI,EACJE,QAAQ,EACRC,OAAO,EACPC,QAAQ,EACRH,WAAW,EACXK,WAAW,EACXC,cAAc,EACdX,QAAQ,EACRC,YAAY,EACZQ,YAAY,EACZP,eAAe,EACfU,gBAAgB,EAChBY,IAAIC,YAAYzB,WAAW,WAAW,KAAK,EAC3C0B,QAAQ,EACR,GAAGC,WACJ,GAAGL;IAEJ,qBACE,KAACG;QACE,GAAGE,SAAS;QACb/B,WAAWF,OAAO;YAChBE;YACAC;YACAG;YACAC;YACAW;YACAV;YACAH;YACAK;YACAE;YACAD;YACAF;YACAL;YACAS;YACAC;YACAC;YACAC;YACAC;QACF;QACAY,KAAKA;kBAEJG;;AAGP,GACA"}
|
|
@@ -30,8 +30,11 @@ export interface AppBarTitleClassNameOptions {
|
|
|
30
30
|
*/
|
|
31
31
|
export declare function appBarTitle(options?: AppBarTitleClassNameOptions): string;
|
|
32
32
|
/**
|
|
33
|
-
* @since 6.0.0
|
|
34
|
-
*
|
|
33
|
+
* @since 6.0.0 The `keyline` prop was changed from a boolean to a type
|
|
34
|
+
* union of different keylines: {@link AppBarTitleKeyline}
|
|
35
|
+
* @since 6.0.0 The `noWrap` prop was removed in favor of the `textOverflow`
|
|
36
|
+
* prop inherited through the base `Typography` component. The `textOverflow`
|
|
37
|
+
* will default to `"ellipsis"` which is new as well.
|
|
35
38
|
*/
|
|
36
39
|
export interface AppBarTitleProps extends TypographyProps, AppBarTitleClassNameOptions {
|
|
37
40
|
/** @defaultValue `"headline-6"` */
|
|
@@ -60,9 +63,10 @@ export interface AppBarTitleProps extends TypographyProps, AppBarTitleClassNameO
|
|
|
60
63
|
* }
|
|
61
64
|
* ```
|
|
62
65
|
*
|
|
63
|
-
* @since 6.0.0 Renamed the `noWrap` prop to `lineWrap` since the `AppBarTitle`
|
|
64
|
-
* does not line wrap by default.
|
|
65
66
|
* @since 6.0.0 The `keyline` prop was changed from a boolean to a type
|
|
66
67
|
* union of different keylines: {@link AppBarTitleKeyline}
|
|
68
|
+
* @since 6.0.0 The `noWrap` prop was removed in favor of the `textOverflow`
|
|
69
|
+
* prop inherited through the base `Typography` component. The `textOverflow`
|
|
70
|
+
* will default to `"ellipsis"` which is new as well.
|
|
67
71
|
*/
|
|
68
72
|
export declare const AppBarTitle: import("react").ForwardRefExoticComponent<AppBarTitleProps & import("react").RefAttributes<HTMLHeadingElement>>;
|
|
@@ -35,10 +35,11 @@ const styles = bem("rmd-app-bar-title");
|
|
|
35
35
|
* }
|
|
36
36
|
* ```
|
|
37
37
|
*
|
|
38
|
-
* @since 6.0.0 Renamed the `noWrap` prop to `lineWrap` since the `AppBarTitle`
|
|
39
|
-
* does not line wrap by default.
|
|
40
38
|
* @since 6.0.0 The `keyline` prop was changed from a boolean to a type
|
|
41
39
|
* union of different keylines: {@link AppBarTitleKeyline}
|
|
40
|
+
* @since 6.0.0 The `noWrap` prop was removed in favor of the `textOverflow`
|
|
41
|
+
* prop inherited through the base `Typography` component. The `textOverflow`
|
|
42
|
+
* will default to `"ellipsis"` which is new as well.
|
|
42
43
|
*/ export const AppBarTitle = /*#__PURE__*/ forwardRef(function AppBarTitle(props, ref) {
|
|
43
44
|
const { type = "headline-6", keyline = "small", children, className, textOverflow = "ellipsis", ...remaining } = props;
|
|
44
45
|
return /*#__PURE__*/ _jsx(Typography, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/app-bar/AppBarTitle.tsx"],"sourcesContent":["import { cnb } from \"cnbuilder\";\nimport { forwardRef } from \"react\";\nimport { type TextOverflow } from \"../cssUtils.js\";\nimport { Typography, type TypographyProps } from \"../typography/Typography.js\";\nimport { type TypographyType } from \"../typography/typographyStyles.js\";\nimport { bem } from \"../utils/bem.js\";\n\nconst styles = bem(\"rmd-app-bar-title\");\n\n/**\n * - `\"small\"` - the first character in the title will be `1rem` (`$keyline`)\n * from the edge of the app bar horizontally\n * - `\"nav\"` - this should be set when there is a nav button before the title so\n * that the first character in the title will be `4.5rem` (`title-keyline`)\n * - `\"list\"` - this should be used when the title should align with the list\n * item keyline and there is no nav icon before.\n *\n * @since 6.0.0\n */\nexport type AppBarTitleKeyline = \"small\" | \"nav\" | \"list\";\n\n/** @since 6.0.0 */\nexport interface AppBarTitleClassNameOptions {\n className?: string;\n\n /**\n * @defaultValue `\"small\"`\n * @see {@link AppBarTitleKeyline}\n */\n keyline?: AppBarTitleKeyline;\n}\n\n/**\n * Apply the `className`s for a `AppBarTitle` component. This will be type-safe\n * if using typescript.\n *\n * @since 6.0.0\n */\nexport function appBarTitle(options: AppBarTitleClassNameOptions = {}): string {\n const { className, keyline = \"small\" } = options;\n return cnb(\n styles({\n keyline: keyline == \"list\",\n \"nav-keyline\": keyline === \"nav\",\n }),\n className\n );\n}\n\n/**\n * @since 6.0.0
|
|
1
|
+
{"version":3,"sources":["../../src/app-bar/AppBarTitle.tsx"],"sourcesContent":["import { cnb } from \"cnbuilder\";\nimport { forwardRef } from \"react\";\nimport { type TextOverflow } from \"../cssUtils.js\";\nimport { Typography, type TypographyProps } from \"../typography/Typography.js\";\nimport { type TypographyType } from \"../typography/typographyStyles.js\";\nimport { bem } from \"../utils/bem.js\";\n\nconst styles = bem(\"rmd-app-bar-title\");\n\n/**\n * - `\"small\"` - the first character in the title will be `1rem` (`$keyline`)\n * from the edge of the app bar horizontally\n * - `\"nav\"` - this should be set when there is a nav button before the title so\n * that the first character in the title will be `4.5rem` (`title-keyline`)\n * - `\"list\"` - this should be used when the title should align with the list\n * item keyline and there is no nav icon before.\n *\n * @since 6.0.0\n */\nexport type AppBarTitleKeyline = \"small\" | \"nav\" | \"list\";\n\n/** @since 6.0.0 */\nexport interface AppBarTitleClassNameOptions {\n className?: string;\n\n /**\n * @defaultValue `\"small\"`\n * @see {@link AppBarTitleKeyline}\n */\n keyline?: AppBarTitleKeyline;\n}\n\n/**\n * Apply the `className`s for a `AppBarTitle` component. This will be type-safe\n * if using typescript.\n *\n * @since 6.0.0\n */\nexport function appBarTitle(options: AppBarTitleClassNameOptions = {}): string {\n const { className, keyline = \"small\" } = options;\n return cnb(\n styles({\n keyline: keyline == \"list\",\n \"nav-keyline\": keyline === \"nav\",\n }),\n className\n );\n}\n\n/**\n * @since 6.0.0 The `keyline` prop was changed from a boolean to a type\n * union of different keylines: {@link AppBarTitleKeyline}\n * @since 6.0.0 The `noWrap` prop was removed in favor of the `textOverflow`\n * prop inherited through the base `Typography` component. The `textOverflow`\n * will default to `\"ellipsis\"` which is new as well.\n */\nexport interface AppBarTitleProps\n extends TypographyProps,\n AppBarTitleClassNameOptions {\n /** @defaultValue `\"headline-6\"` */\n type?: TypographyType;\n\n /**\n * @defaultValue `\"ellipsis\"`\n */\n textOverflow?: TextOverflow;\n}\n\n/**\n * **Server Component**\n *\n * @example Updating the Keyline\n * ```tsx\n * import { AppBar, AppBarTitle } from \"@react-md/core\";\n * import type { ReactElement } from \"react\";\n *\n * function Example(): ReactElement {\n * return (\n * <AppBar>\n * <AppBarTitle keyline=\"nav\">\n * Offset as if there was a nav button to the left\n * </AppBarTitle>\n * </AppBar>\n * );\n * }\n * ```\n *\n * @since 6.0.0 The `keyline` prop was changed from a boolean to a type\n * union of different keylines: {@link AppBarTitleKeyline}\n * @since 6.0.0 The `noWrap` prop was removed in favor of the `textOverflow`\n * prop inherited through the base `Typography` component. The `textOverflow`\n * will default to `\"ellipsis\"` which is new as well.\n */\nexport const AppBarTitle = forwardRef<HTMLHeadingElement, AppBarTitleProps>(\n function AppBarTitle(props, ref) {\n const {\n type = \"headline-6\",\n keyline = \"small\",\n children,\n className,\n textOverflow = \"ellipsis\",\n ...remaining\n } = props;\n return (\n <Typography\n {...remaining}\n ref={ref}\n type={type}\n className={appBarTitle({\n keyline,\n className,\n })}\n textOverflow={textOverflow}\n >\n {children}\n </Typography>\n );\n }\n);\n"],"names":["cnb","forwardRef","Typography","bem","styles","appBarTitle","options","className","keyline","AppBarTitle","props","ref","type","children","textOverflow","remaining"],"mappings":";AAAA,SAASA,GAAG,QAAQ,YAAY;AAChC,SAASC,UAAU,QAAQ,QAAQ;AAEnC,SAASC,UAAU,QAA8B,8BAA8B;AAE/E,SAASC,GAAG,QAAQ,kBAAkB;AAEtC,MAAMC,SAASD,IAAI;AAyBnB;;;;;CAKC,GACD,OAAO,SAASE,YAAYC,UAAuC,CAAC,CAAC;IACnE,MAAM,EAAEC,SAAS,EAAEC,UAAU,OAAO,EAAE,GAAGF;IACzC,OAAON,IACLI,OAAO;QACLI,SAASA,WAAW;QACpB,eAAeA,YAAY;IAC7B,IACAD;AAEJ;AAqBA;;;;;;;;;;;;;;;;;;;;;;;;CAwBC,GACD,OAAO,MAAME,4BAAcR,WACzB,SAASQ,YAAYC,KAAK,EAAEC,GAAG;IAC7B,MAAM,EACJC,OAAO,YAAY,EACnBJ,UAAU,OAAO,EACjBK,QAAQ,EACRN,SAAS,EACTO,eAAe,UAAU,EACzB,GAAGC,WACJ,GAAGL;IACJ,qBACE,KAACR;QACE,GAAGa,SAAS;QACbJ,KAAKA;QACLC,MAAMA;QACNL,WAAWF,YAAY;YACrBG;YACAD;QACF;QACAO,cAAcA;kBAEbD;;AAGP,GACA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/autocomplete/Autocomplete.tsx"],"sourcesContent":["\"use client\";\nimport {\n useEffect,\n type AriaAttributes,\n type ReactElement,\n type Ref,\n} from \"react\";\nimport { TextField, type TextFieldProps } from \"../form/TextField.js\";\nimport { type ConfigurableComboboxMenuProps } from \"../form/useCombobox.js\";\nimport { useEditableCombobox } from \"../form/useEditableCombobox.js\";\nimport { Menu } from \"../menu/Menu.js\";\nimport { type KeyboardMovementFocusChangeEventHandler } from \"../movement/types.js\";\nimport { KeyboardMovementProvider } from \"../movement/useKeyboardMovementProvider.js\";\nimport {\n type PropsWithRef,\n type TextExtractor,\n type UseStateSetter,\n} from \"../types.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\nimport { useEnsuredRef } from \"../useEnsuredRef.js\";\nimport { useEnsuredState } from \"../useEnsuredState.js\";\nimport {\n AutocompleteCircularProgress,\n type AutocompleteCircularProgressProps,\n} from \"./AutocompleteCircularProgress.js\";\nimport {\n AutocompleteDropdownButton,\n type ConfigurableAutocompleteDropdownButtonProps,\n} from \"./AutocompleteDropdownButton.js\";\nimport { FilterAutocompleteOptions } from \"./FilterAutocompleteOptions.js\";\nimport { autocomplete, autocompleteRightAddon } from \"./autocompleteStyles.js\";\nimport {\n type AutocompleteMenuLabel,\n type AutocompleteOptionsProps,\n} from \"./types.js\";\n\nconst noop = (): void => {\n // do nothing\n};\n\n/**\n * @since 6.0.0\n */\nexport interface AutocompleteProps<T>\n extends Omit<TextFieldProps, \"value\" | \"defaultValue\">,\n AutocompleteOptionsProps<T> {\n /** @defaultValue `\"list\"` */\n \"aria-autocomplete\"?: AriaAttributes[\"aria-autocomplete\"];\n inputRef?: Ref<HTMLInputElement>;\n value?: string;\n defaultValue?: string;\n\n /**\n * An `aria-label` to pass to the `Menu` component that describes the list of\n * {@link options}. Either this or the {@link menuLabelledBy} are required for\n * accessibility.\n */\n menuLabel?: string;\n\n /**\n * An `aria-labelledby` to pass to the `Menu` component that describes the\n * list of {@link options}. Either this or the {@link menuLabel} are required\n * for accessibility.\n */\n menuLabelledBy?: string;\n\n /**\n * Any additional props that should be passed to the `Menu` component.\n */\n menuProps?: PropsWithRef<\n ConfigurableComboboxMenuProps & { id?: string },\n HTMLDivElement\n >;\n\n /**\n * This prop should only be used when `aria-autocomplete` is set to\n * `\"inline\"` or `\"both\"`.\n */\n onFocusChange?: KeyboardMovementFocusChangeEventHandler;\n\n /**\n * This can be used to add any custom styling, change the icon, change the\n * label, etc for the dropdown button.\n *\n * @example Simple Example\n * ```tsx\n * dropdownButtonProps={{\n * \"aria-label\": \"Open\",\n * className: styles.dropdownButton,\n * icon: <MyCustomDropdownIcon />,\n * }}\n * ```\n */\n dropdownButtonProps?: ConfigurableAutocompleteDropdownButtonProps;\n\n /**\n * Set this to `true` to remove the {@link DropdownButton} from being rendered\n * after the input element.\n *\n * @defaultValue `false`\n */\n disableDropdownButton?: boolean;\n\n /**\n * Set this to `true` to disable a `<CircularProgress />` after the input and\n * before the `<DropdownButton />`.\n *\n * @defaultValue `false`\n */\n loading?: boolean;\n\n /**\n * @defaultValue `{ \"aria-label\": \"Loading\", ...loadingProps }`\n */\n loadingProps?: AutocompleteCircularProgressProps;\n}\n\n/**\n * @since 6.0.0\n */\nexport function Autocomplete<T extends string | { label: string }>(\n props: AutocompleteMenuLabel<Omit<AutocompleteProps<T>, \"extractor\">>\n): ReactElement;\n/**\n * @since 6.0.0\n */\nexport function Autocomplete<T>(\n props: AutocompleteMenuLabel<\n AutocompleteProps<T> & { extractor: TextExtractor<T> }\n >\n): ReactElement;\nexport function Autocomplete<T>(\n props: AutocompleteMenuLabel<AutocompleteProps<T>>\n): ReactElement {\n const {\n id: propId,\n value: propValue,\n defaultValue = \"\",\n onClick,\n onFocus,\n onKeyDown,\n onChange = noop,\n onFocusChange,\n className,\n options,\n children,\n inputRef,\n extractor,\n onAutocomplete = noop,\n getOptionProps,\n clearOnAutocomplete,\n menuProps,\n menuLabel,\n menuLabelledBy,\n containerProps,\n filter,\n whitespace,\n disableFilter,\n noOptionsChildren,\n dropdownButtonProps,\n disableDropdownButton,\n loading,\n loadingProps,\n rightAddon,\n rightAddonProps,\n ...remaining\n } = props;\n\n const { form } = props;\n const id = useEnsuredId(propId, \"autocomplete\");\n const menuId = useEnsuredId(menuProps?.id, \"autocomplete-listbox\");\n\n const [query, setQuery] = useEnsuredState<string, UseStateSetter<string>>({\n value: propValue,\n setValue: typeof propValue === \"string\" ? noop : undefined,\n defaultValue,\n });\n\n const {\n visible,\n setVisible,\n getMenuProps,\n comboboxRef,\n comboboxProps,\n movementContext,\n } = useEditableCombobox({\n form,\n onClick,\n onFocus,\n onKeyDown,\n onFocusChange,\n popupId: menuId,\n popupRef: menuProps?.ref,\n comboboxId: id,\n comboboxRef: inputRef,\n });\n const [containerNodeRef, containerRef] = useEnsuredRef(containerProps?.ref);\n useEffect(() => {\n const input = comboboxRef.current;\n if (!input || document.activeElement !== input) {\n return;\n }\n\n const target = input.value.length;\n input.setSelectionRange(target, target);\n }, [comboboxRef, loading]);\n\n return (\n <KeyboardMovementProvider value={movementContext}>\n <TextField\n aria-autocomplete=\"list\"\n {...remaining}\n value={query}\n {...comboboxProps}\n containerProps={{\n ...containerProps,\n ref: containerRef,\n }}\n className={autocomplete({\n className,\n loading,\n disableDropdownButton,\n })}\n onChange={(event) => {\n onChange(event);\n setQuery(event.currentTarget.value);\n }}\n onKeyDown={(event) => {\n comboboxProps.onKeyDown(event);\n if (!visible && event.key === \"Escape\") {\n onAutocomplete(null);\n }\n }}\n onFocus={(event) => {\n comboboxProps.onFocus(event);\n event.currentTarget.setSelectionRange(\n 0,\n event.currentTarget.value.length\n );\n }}\n rightAddon={\n <>\n {rightAddon}\n {loading && <AutocompleteCircularProgress {...loadingProps} />}\n {!disableDropdownButton && (\n <AutocompleteDropdownButton\n aria-label={menuLabel}\n aria-labelledby={menuLabelledBy}\n aria-controls={comboboxProps.id}\n {...dropdownButtonProps}\n visible={visible}\n onClick={() => {\n comboboxRef.current?.focus();\n setVisible((prev) => !prev);\n }}\n />\n )}\n </>\n }\n rightAddonProps={{\n ...rightAddonProps,\n pointerEvents: true,\n className: autocompleteRightAddon({\n className: rightAddonProps?.className,\n }),\n }}\n />\n <Menu\n aria-label={menuLabel as string}\n aria-labelledby={menuLabelledBy}\n {...getMenuProps(menuProps)}\n // since the `afterInputChildren` is not included in the `comboboxRef`'s\n // width, the menu will no longer be equal width without changing the\n // fixedTo node to the container\n fixedTo={containerNodeRef}\n >\n {children}\n <FilterAutocompleteOptions\n query={query}\n filter={filter}\n options={options}\n noOptionsChildren={noOptionsChildren}\n extractor={extractor}\n whitespace={whitespace}\n comboboxRef={comboboxRef}\n disableFilter={disableFilter || props[\"aria-autocomplete\"] === \"none\"}\n getOptionProps={getOptionProps}\n onAutocomplete={onAutocomplete}\n clearOnAutocomplete={clearOnAutocomplete}\n />\n </Menu>\n </KeyboardMovementProvider>\n );\n}\n"],"names":["useEffect","TextField","useEditableCombobox","Menu","KeyboardMovementProvider","useEnsuredId","useEnsuredRef","useEnsuredState","AutocompleteCircularProgress","AutocompleteDropdownButton","FilterAutocompleteOptions","autocomplete","autocompleteRightAddon","noop","Autocomplete","props","id","propId","value","propValue","defaultValue","onClick","onFocus","onKeyDown","onChange","onFocusChange","className","options","children","inputRef","extractor","onAutocomplete","getOptionProps","clearOnAutocomplete","menuProps","menuLabel","menuLabelledBy","containerProps","filter","whitespace","disableFilter","noOptionsChildren","dropdownButtonProps","disableDropdownButton","loading","loadingProps","rightAddon","rightAddonProps","remaining","form","menuId","query","setQuery","setValue","undefined","visible","setVisible","getMenuProps","comboboxRef","comboboxProps","movementContext","popupId","popupRef","ref","comboboxId","containerNodeRef","containerRef","input","current","document","activeElement","target","length","setSelectionRange","aria-autocomplete","event","currentTarget","key","aria-label","aria-labelledby","aria-controls","focus","prev","pointerEvents","fixedTo"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;AACA,SACEA,SAAS,QAIJ,QAAQ;AACf,SAASC,SAAS,QAA6B,uBAAuB;AAEtE,SAASC,mBAAmB,QAAQ,iCAAiC;AACrE,SAASC,IAAI,QAAQ,kBAAkB;AAEvC,SAASC,wBAAwB,QAAQ,6CAA6C;AAMtF,SAASC,YAAY,QAAQ,qBAAqB;AAClD,SAASC,aAAa,QAAQ,sBAAsB;AACpD,SAASC,eAAe,QAAQ,wBAAwB;AACxD,SACEC,4BAA4B,QAEvB,oCAAoC;AAC3C,SACEC,0BAA0B,QAErB,kCAAkC;AACzC,SAASC,yBAAyB,QAAQ,iCAAiC;AAC3E,SAASC,YAAY,EAAEC,sBAAsB,QAAQ,0BAA0B;AAM/E,MAAMC,OAAO;AACX,aAAa;AACf;AA6FA,OAAO,SAASC,aACdC,KAAkD;IAElD,MAAM,EACJC,IAAIC,MAAM,EACVC,OAAOC,SAAS,EAChBC,eAAe,EAAE,EACjBC,OAAO,EACPC,OAAO,EACPC,SAAS,EACTC,WAAWX,IAAI,EACfY,aAAa,EACbC,SAAS,EACTC,OAAO,EACPC,QAAQ,EACRC,QAAQ,EACRC,SAAS,EACTC,iBAAiBlB,IAAI,EACrBmB,cAAc,EACdC,mBAAmB,EACnBC,SAAS,EACTC,SAAS,EACTC,cAAc,EACdC,cAAc,EACdC,MAAM,EACNC,UAAU,EACVC,aAAa,EACbC,iBAAiB,EACjBC,mBAAmB,EACnBC,qBAAqB,EACrBC,OAAO,EACPC,YAAY,EACZC,UAAU,EACVC,eAAe,EACf,GAAGC,WACJ,GAAGjC;IAEJ,MAAM,EAAEkC,IAAI,EAAE,GAAGlC;IACjB,MAAMC,KAAKX,aAAaY,QAAQ;IAChC,MAAMiC,SAAS7C,aAAa6B,WAAWlB,IAAI;IAE3C,MAAM,CAACmC,OAAOC,SAAS,GAAG7C,gBAAgD;QACxEW,OAAOC;QACPkC,UAAU,OAAOlC,cAAc,WAAWN,OAAOyC;QACjDlC;IACF;IAEA,MAAM,EACJmC,OAAO,EACPC,UAAU,EACVC,YAAY,EACZC,WAAW,EACXC,aAAa,EACbC,eAAe,EAChB,GAAG1D,oBAAoB;QACtB+C;QACA5B;QACAC;QACAC;QACAE;QACAoC,SAASX;QACTY,UAAU5B,WAAW6B;QACrBC,YAAYhD;QACZ0C,aAAa7B;IACf;IACA,MAAM,CAACoC,kBAAkBC,aAAa,GAAG5D,cAAc+B,gBAAgB0B;IACvE/D,UAAU;QACR,MAAMmE,QAAQT,YAAYU,OAAO;QACjC,IAAI,CAACD,SAASE,SAASC,aAAa,KAAKH,OAAO;YAC9C;QACF;QAEA,MAAMI,SAASJ,MAAMjD,KAAK,CAACsD,MAAM;QACjCL,MAAMM,iBAAiB,CAACF,QAAQA;IAClC,GAAG;QAACb;QAAad;KAAQ;IAEzB,qBACE,MAACxC;QAAyBc,OAAO0C;;0BAC/B,KAAC3D;gBACCyE,qBAAkB;gBACjB,GAAG1B,SAAS;gBACb9B,OAAOiC;gBACN,GAAGQ,aAAa;gBACjBtB,gBAAgB;oBACd,GAAGA,cAAc;oBACjB0B,KAAKG;gBACP;gBACAxC,WAAWf,aAAa;oBACtBe;oBACAkB;oBACAD;gBACF;gBACAnB,UAAU,CAACmD;oBACTnD,SAASmD;oBACTvB,SAASuB,MAAMC,aAAa,CAAC1D,KAAK;gBACpC;gBACAK,WAAW,CAACoD;oBACVhB,cAAcpC,SAAS,CAACoD;oBACxB,IAAI,CAACpB,WAAWoB,MAAME,GAAG,KAAK,UAAU;wBACtC9C,eAAe;oBACjB;gBACF;gBACAT,SAAS,CAACqD;oBACRhB,cAAcrC,OAAO,CAACqD;oBACtBA,MAAMC,aAAa,CAACH,iBAAiB,CACnC,GACAE,MAAMC,aAAa,CAAC1D,KAAK,CAACsD,MAAM;gBAEpC;gBACA1B,0BACE;;wBACGA;wBACAF,yBAAW,KAACpC;4BAA8B,GAAGqC,YAAY;;wBACzD,CAACF,uCACA,KAAClC;4BACCqE,cAAY3C;4BACZ4C,mBAAiB3C;4BACjB4C,iBAAerB,cAAc3C,EAAE;4BAC9B,GAAG0B,mBAAmB;4BACvBa,SAASA;4BACTlC,SAAS;gCACPqC,YAAYU,OAAO,EAAEa;gCACrBzB,WAAW,CAAC0B,OAAS,CAACA;4BACxB;;;;gBAKRnC,iBAAiB;oBACf,GAAGA,eAAe;oBAClBoC,eAAe;oBACfzD,WAAWd,uBAAuB;wBAChCc,WAAWqB,iBAAiBrB;oBAC9B;gBACF;;0BAEF,MAACvB;gBACC2E,cAAY3C;gBACZ4C,mBAAiB3C;gBAChB,GAAGqB,aAAavB,UAAU;gBAC3B,wEAAwE;gBACxE,qEAAqE;gBACrE,gCAAgC;gBAChCkD,SAASnB;;oBAERrC;kCACD,KAAClB;wBACCyC,OAAOA;wBACPb,QAAQA;wBACRX,SAASA;wBACTc,mBAAmBA;wBACnBX,WAAWA;wBACXS,YAAYA;wBACZmB,aAAaA;wBACblB,eAAeA,iBAAiBzB,KAAK,CAAC,oBAAoB,KAAK;wBAC/DiB,gBAAgBA;wBAChBD,gBAAgBA;wBAChBE,qBAAqBA;;;;;;AAK/B"}
|
|
1
|
+
{"version":3,"sources":["../../src/autocomplete/Autocomplete.tsx"],"sourcesContent":["\"use client\";\nimport {\n useEffect,\n type AriaAttributes,\n type ReactElement,\n type Ref,\n} from \"react\";\nimport { TextField, type TextFieldProps } from \"../form/TextField.js\";\nimport { type ConfigurableComboboxMenuProps } from \"../form/useCombobox.js\";\nimport { useEditableCombobox } from \"../form/useEditableCombobox.js\";\nimport { Menu } from \"../menu/Menu.js\";\nimport { type KeyboardMovementFocusChangeEventHandler } from \"../movement/types.js\";\nimport { KeyboardMovementProvider } from \"../movement/useKeyboardMovementProvider.js\";\nimport {\n type PropsWithRef,\n type TextExtractor,\n type UseStateSetter,\n} from \"../types.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\nimport { useEnsuredRef } from \"../useEnsuredRef.js\";\nimport { useEnsuredState } from \"../useEnsuredState.js\";\nimport {\n AutocompleteCircularProgress,\n type AutocompleteCircularProgressProps,\n} from \"./AutocompleteCircularProgress.js\";\nimport {\n AutocompleteDropdownButton,\n type ConfigurableAutocompleteDropdownButtonProps,\n} from \"./AutocompleteDropdownButton.js\";\nimport { FilterAutocompleteOptions } from \"./FilterAutocompleteOptions.js\";\nimport { autocomplete, autocompleteRightAddon } from \"./autocompleteStyles.js\";\nimport {\n type AutocompleteMenuLabel,\n type AutocompleteOptionsProps,\n} from \"./types.js\";\n\nconst noop = (): void => {\n // do nothing\n};\n\n/**\n * @since 6.0.0\n */\nexport interface AutocompleteProps<T>\n extends Omit<TextFieldProps, \"value\" | \"defaultValue\">,\n AutocompleteOptionsProps<T> {\n /** @defaultValue `\"list\"` */\n \"aria-autocomplete\"?: AriaAttributes[\"aria-autocomplete\"];\n inputRef?: Ref<HTMLInputElement>;\n value?: string;\n defaultValue?: string;\n\n /**\n * An `aria-label` to pass to the `Menu` component that describes the list of\n * {@link options}. Either this or the {@link menuLabelledBy} are required for\n * accessibility.\n */\n menuLabel?: string;\n\n /**\n * An `aria-labelledby` to pass to the `Menu` component that describes the\n * list of {@link options}. Either this or the {@link menuLabel} are required\n * for accessibility.\n */\n menuLabelledBy?: string;\n\n /**\n * Any additional props that should be passed to the `Menu` component.\n */\n menuProps?: PropsWithRef<\n ConfigurableComboboxMenuProps & { id?: string },\n HTMLDivElement\n >;\n\n /**\n * This prop should only be used when `aria-autocomplete` is set to\n * `\"inline\"` or `\"both\"`.\n */\n onFocusChange?: KeyboardMovementFocusChangeEventHandler;\n\n /**\n * This can be used to add any custom styling, change the icon, change the\n * label, etc for the dropdown button.\n *\n * @example Simple Example\n * ```tsx\n * dropdownButtonProps={{\n * \"aria-label\": \"Open\",\n * className: styles.dropdownButton,\n * icon: <MyCustomDropdownIcon />,\n * }}\n * ```\n */\n dropdownButtonProps?: ConfigurableAutocompleteDropdownButtonProps;\n\n /**\n * Set this to `true` to remove the {@link DropdownButton} from being rendered\n * after the input element.\n *\n * @defaultValue `false`\n */\n disableDropdownButton?: boolean;\n\n /**\n * Set this to `true` to disable a `<CircularProgress />` after the input and\n * before the `<DropdownButton />`.\n *\n * @defaultValue `false`\n */\n loading?: boolean;\n\n /**\n * @defaultValue `{ \"aria-label\": \"Loading\", ...loadingProps }`\n */\n loadingProps?: AutocompleteCircularProgressProps;\n}\n\n/**\n * @since 6.0.0\n */\nexport function Autocomplete<T extends string | { label: string }>(\n props: AutocompleteMenuLabel<Omit<AutocompleteProps<T>, \"extractor\">>\n): ReactElement;\n/**\n * @since 6.0.0\n */\nexport function Autocomplete<T>(\n props: AutocompleteMenuLabel<\n AutocompleteProps<T> & { extractor: TextExtractor<T> }\n >\n): ReactElement;\nexport function Autocomplete<T>(\n props: AutocompleteMenuLabel<AutocompleteProps<T>>\n): ReactElement {\n const {\n id: propId,\n value: propValue,\n defaultValue = \"\",\n onClick,\n onFocus,\n onKeyDown,\n onChange = noop,\n onFocusChange,\n className,\n options,\n children,\n inputRef,\n extractor,\n onAutocomplete = noop,\n getOptionProps,\n clearOnAutocomplete,\n menuProps,\n menuLabel,\n menuLabelledBy,\n containerProps,\n filter,\n whitespace,\n disableFilter,\n noOptionsChildren,\n dropdownButtonProps,\n disableDropdownButton,\n loading,\n loadingProps,\n rightAddon,\n rightAddonProps,\n ...remaining\n } = props;\n\n const { form } = props;\n const id = useEnsuredId(propId, \"autocomplete\");\n const menuId = useEnsuredId(menuProps?.id, \"autocomplete-listbox\");\n\n const [query, setQuery] = useEnsuredState<string, UseStateSetter<string>>({\n value: propValue,\n setValue: typeof propValue === \"string\" ? noop : undefined,\n defaultValue,\n });\n\n const {\n visible,\n setVisible,\n getMenuProps,\n comboboxRef,\n comboboxProps,\n movementContext,\n } = useEditableCombobox({\n form,\n onClick,\n onFocus,\n onKeyDown,\n onFocusChange,\n popupId: menuId,\n popupRef: menuProps?.ref,\n comboboxId: id,\n comboboxRef: inputRef,\n });\n const [containerNodeRef, containerRef] = useEnsuredRef(containerProps?.ref);\n useEffect(() => {\n const input = comboboxRef.current;\n if (!input || document.activeElement !== input) {\n return;\n }\n\n const target = input.value.length;\n input.setSelectionRange(target, target);\n }, [comboboxRef, loading]);\n\n return (\n <KeyboardMovementProvider value={movementContext}>\n <TextField\n aria-autocomplete=\"list\"\n {...remaining}\n value={query}\n {...comboboxProps}\n containerProps={{\n ...containerProps,\n ref: containerRef,\n }}\n className={autocomplete({\n className,\n loading,\n disableDropdownButton,\n })}\n onChange={(event) => {\n onChange(event);\n setQuery(event.currentTarget.value);\n }}\n onKeyDown={(event) => {\n comboboxProps.onKeyDown(event);\n if (!visible && event.key === \"Escape\") {\n onAutocomplete(null);\n }\n }}\n onFocus={(event) => {\n comboboxProps.onFocus(event);\n event.currentTarget.setSelectionRange(\n 0,\n event.currentTarget.value.length\n );\n }}\n rightAddon={\n <>\n {rightAddon}\n {loading && <AutocompleteCircularProgress {...loadingProps} />}\n {!disableDropdownButton && (\n <AutocompleteDropdownButton\n aria-label={menuLabel}\n aria-labelledby={menuLabelledBy}\n aria-controls={comboboxProps.id}\n {...dropdownButtonProps}\n visible={visible}\n onClick={() => {\n comboboxRef.current?.focus();\n setVisible((prev) => !prev);\n }}\n />\n )}\n </>\n }\n rightAddonProps={{\n ...rightAddonProps,\n pointerEvents: true,\n className: autocompleteRightAddon({\n className: rightAddonProps?.className,\n }),\n }}\n />\n <Menu\n aria-label={menuLabel as string}\n aria-labelledby={menuLabelledBy}\n {...getMenuProps(menuProps)}\n // since the `afterInputChildren` is not included in the `comboboxRef`'s\n // width, the menu will no longer be equal width without changing the\n // fixedTo node to the container\n fixedTo={containerNodeRef}\n >\n {children}\n <FilterAutocompleteOptions\n query={query}\n filter={filter}\n options={options}\n noOptionsChildren={noOptionsChildren}\n extractor={extractor}\n whitespace={whitespace}\n comboboxRef={comboboxRef}\n disableFilter={disableFilter || props[\"aria-autocomplete\"] === \"none\"}\n getOptionProps={getOptionProps}\n onAutocomplete={onAutocomplete}\n clearOnAutocomplete={clearOnAutocomplete}\n />\n </Menu>\n </KeyboardMovementProvider>\n );\n}\n"],"names":["useEffect","TextField","useEditableCombobox","Menu","KeyboardMovementProvider","useEnsuredId","useEnsuredRef","useEnsuredState","AutocompleteCircularProgress","AutocompleteDropdownButton","FilterAutocompleteOptions","autocomplete","autocompleteRightAddon","noop","Autocomplete","props","id","propId","value","propValue","defaultValue","onClick","onFocus","onKeyDown","onChange","onFocusChange","className","options","children","inputRef","extractor","onAutocomplete","getOptionProps","clearOnAutocomplete","menuProps","menuLabel","menuLabelledBy","containerProps","filter","whitespace","disableFilter","noOptionsChildren","dropdownButtonProps","disableDropdownButton","loading","loadingProps","rightAddon","rightAddonProps","remaining","form","menuId","query","setQuery","setValue","undefined","visible","setVisible","getMenuProps","comboboxRef","comboboxProps","movementContext","popupId","popupRef","ref","comboboxId","containerNodeRef","containerRef","input","current","document","activeElement","target","length","setSelectionRange","aria-autocomplete","event","currentTarget","key","aria-label","aria-labelledby","aria-controls","focus","prev","pointerEvents","fixedTo"],"mappings":"AAAA;;AACA,SACEA,SAAS,QAIJ,QAAQ;AACf,SAASC,SAAS,QAA6B,uBAAuB;AAEtE,SAASC,mBAAmB,QAAQ,iCAAiC;AACrE,SAASC,IAAI,QAAQ,kBAAkB;AAEvC,SAASC,wBAAwB,QAAQ,6CAA6C;AAMtF,SAASC,YAAY,QAAQ,qBAAqB;AAClD,SAASC,aAAa,QAAQ,sBAAsB;AACpD,SAASC,eAAe,QAAQ,wBAAwB;AACxD,SACEC,4BAA4B,QAEvB,oCAAoC;AAC3C,SACEC,0BAA0B,QAErB,kCAAkC;AACzC,SAASC,yBAAyB,QAAQ,iCAAiC;AAC3E,SAASC,YAAY,EAAEC,sBAAsB,QAAQ,0BAA0B;AAM/E,MAAMC,OAAO;AACX,aAAa;AACf;AA6FA,OAAO,SAASC,aACdC,KAAkD;IAElD,MAAM,EACJC,IAAIC,MAAM,EACVC,OAAOC,SAAS,EAChBC,eAAe,EAAE,EACjBC,OAAO,EACPC,OAAO,EACPC,SAAS,EACTC,WAAWX,IAAI,EACfY,aAAa,EACbC,SAAS,EACTC,OAAO,EACPC,QAAQ,EACRC,QAAQ,EACRC,SAAS,EACTC,iBAAiBlB,IAAI,EACrBmB,cAAc,EACdC,mBAAmB,EACnBC,SAAS,EACTC,SAAS,EACTC,cAAc,EACdC,cAAc,EACdC,MAAM,EACNC,UAAU,EACVC,aAAa,EACbC,iBAAiB,EACjBC,mBAAmB,EACnBC,qBAAqB,EACrBC,OAAO,EACPC,YAAY,EACZC,UAAU,EACVC,eAAe,EACf,GAAGC,WACJ,GAAGjC;IAEJ,MAAM,EAAEkC,IAAI,EAAE,GAAGlC;IACjB,MAAMC,KAAKX,aAAaY,QAAQ;IAChC,MAAMiC,SAAS7C,aAAa6B,WAAWlB,IAAI;IAE3C,MAAM,CAACmC,OAAOC,SAAS,GAAG7C,gBAAgD;QACxEW,OAAOC;QACPkC,UAAU,OAAOlC,cAAc,WAAWN,OAAOyC;QACjDlC;IACF;IAEA,MAAM,EACJmC,OAAO,EACPC,UAAU,EACVC,YAAY,EACZC,WAAW,EACXC,aAAa,EACbC,eAAe,EAChB,GAAG1D,oBAAoB;QACtB+C;QACA5B;QACAC;QACAC;QACAE;QACAoC,SAASX;QACTY,UAAU5B,WAAW6B;QACrBC,YAAYhD;QACZ0C,aAAa7B;IACf;IACA,MAAM,CAACoC,kBAAkBC,aAAa,GAAG5D,cAAc+B,gBAAgB0B;IACvE/D,UAAU;QACR,MAAMmE,QAAQT,YAAYU,OAAO;QACjC,IAAI,CAACD,SAASE,SAASC,aAAa,KAAKH,OAAO;YAC9C;QACF;QAEA,MAAMI,SAASJ,MAAMjD,KAAK,CAACsD,MAAM;QACjCL,MAAMM,iBAAiB,CAACF,QAAQA;IAClC,GAAG;QAACb;QAAad;KAAQ;IAEzB,qBACE,MAACxC;QAAyBc,OAAO0C;;0BAC/B,KAAC3D;gBACCyE,qBAAkB;gBACjB,GAAG1B,SAAS;gBACb9B,OAAOiC;gBACN,GAAGQ,aAAa;gBACjBtB,gBAAgB;oBACd,GAAGA,cAAc;oBACjB0B,KAAKG;gBACP;gBACAxC,WAAWf,aAAa;oBACtBe;oBACAkB;oBACAD;gBACF;gBACAnB,UAAU,CAACmD;oBACTnD,SAASmD;oBACTvB,SAASuB,MAAMC,aAAa,CAAC1D,KAAK;gBACpC;gBACAK,WAAW,CAACoD;oBACVhB,cAAcpC,SAAS,CAACoD;oBACxB,IAAI,CAACpB,WAAWoB,MAAME,GAAG,KAAK,UAAU;wBACtC9C,eAAe;oBACjB;gBACF;gBACAT,SAAS,CAACqD;oBACRhB,cAAcrC,OAAO,CAACqD;oBACtBA,MAAMC,aAAa,CAACH,iBAAiB,CACnC,GACAE,MAAMC,aAAa,CAAC1D,KAAK,CAACsD,MAAM;gBAEpC;gBACA1B,0BACE;;wBACGA;wBACAF,yBAAW,KAACpC;4BAA8B,GAAGqC,YAAY;;wBACzD,CAACF,uCACA,KAAClC;4BACCqE,cAAY3C;4BACZ4C,mBAAiB3C;4BACjB4C,iBAAerB,cAAc3C,EAAE;4BAC9B,GAAG0B,mBAAmB;4BACvBa,SAASA;4BACTlC,SAAS;gCACPqC,YAAYU,OAAO,EAAEa;gCACrBzB,WAAW,CAAC0B,OAAS,CAACA;4BACxB;;;;gBAKRnC,iBAAiB;oBACf,GAAGA,eAAe;oBAClBoC,eAAe;oBACfzD,WAAWd,uBAAuB;wBAChCc,WAAWqB,iBAAiBrB;oBAC9B;gBACF;;0BAEF,MAACvB;gBACC2E,cAAY3C;gBACZ4C,mBAAiB3C;gBAChB,GAAGqB,aAAavB,UAAU;gBAC3B,wEAAwE;gBACxE,qEAAqE;gBACrE,gCAAgC;gBAChCkD,SAASnB;;oBAERrC;kCACD,KAAClB;wBACCyC,OAAOA;wBACPb,QAAQA;wBACRX,SAASA;wBACTc,mBAAmBA;wBACnBX,WAAWA;wBACXS,YAAYA;wBACZmB,aAAaA;wBACblB,eAAeA,iBAAiBzB,KAAK,CAAC,oBAAoB,KAAK;wBAC/DiB,gBAAgBA;wBAChBD,gBAAgBA;wBAChBE,qBAAqBA;;;;;;AAK/B"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/autocomplete/AutocompleteCircularProgress.tsx"],"sourcesContent":["import { type ReactElement } from \"react\";\nimport {\n CircularProgress,\n type CircularProgressProps,\n} from \"../progress/CircularProgress.js\";\nimport { type ProgressTheme } from \"../progress/types.js\";\n\n/**\n * @since 6.0.0\n */\nexport interface AutocompleteCircularProgressProps\n extends CircularProgressProps {\n /** @defaultValue `\"Loading\"` */\n \"aria-label\"?: string;\n\n /** @defaultValue `\"current-color\"` */\n theme?: ProgressTheme;\n}\n\n/**\n * @since 6.0.0\n */\nexport function AutocompleteCircularProgress(\n props: AutocompleteCircularProgressProps\n): ReactElement {\n const {\n \"aria-labelledby\": ariaLabelledby,\n \"aria-label\": ariaLabel = ariaLabelledby ? undefined : \"Loading\",\n theme = \"current-color\",\n ...remaining\n } = props;\n\n return (\n <CircularProgress\n {...remaining}\n aria-label={ariaLabel as string}\n aria-labelledby={ariaLabelledby}\n theme={theme}\n />\n );\n}\n"],"names":["CircularProgress","AutocompleteCircularProgress","props","ariaLabelledby","ariaLabel","undefined","theme","remaining","aria-label","aria-labelledby"],"
|
|
1
|
+
{"version":3,"sources":["../../src/autocomplete/AutocompleteCircularProgress.tsx"],"sourcesContent":["import { type ReactElement } from \"react\";\nimport {\n CircularProgress,\n type CircularProgressProps,\n} from \"../progress/CircularProgress.js\";\nimport { type ProgressTheme } from \"../progress/types.js\";\n\n/**\n * @since 6.0.0\n */\nexport interface AutocompleteCircularProgressProps\n extends CircularProgressProps {\n /** @defaultValue `\"Loading\"` */\n \"aria-label\"?: string;\n\n /** @defaultValue `\"current-color\"` */\n theme?: ProgressTheme;\n}\n\n/**\n * @since 6.0.0\n */\nexport function AutocompleteCircularProgress(\n props: AutocompleteCircularProgressProps\n): ReactElement {\n const {\n \"aria-labelledby\": ariaLabelledby,\n \"aria-label\": ariaLabel = ariaLabelledby ? undefined : \"Loading\",\n theme = \"current-color\",\n ...remaining\n } = props;\n\n return (\n <CircularProgress\n {...remaining}\n aria-label={ariaLabel as string}\n aria-labelledby={ariaLabelledby}\n theme={theme}\n />\n );\n}\n"],"names":["CircularProgress","AutocompleteCircularProgress","props","ariaLabelledby","ariaLabel","undefined","theme","remaining","aria-label","aria-labelledby"],"mappings":";AACA,SACEA,gBAAgB,QAEX,kCAAkC;AAezC;;CAEC,GACD,OAAO,SAASC,6BACdC,KAAwC;IAExC,MAAM,EACJ,mBAAmBC,cAAc,EACjC,cAAcC,YAAYD,iBAAiBE,YAAY,SAAS,EAChEC,QAAQ,eAAe,EACvB,GAAGC,WACJ,GAAGL;IAEJ,qBACE,KAACF;QACE,GAAGO,SAAS;QACbC,cAAYJ;QACZK,mBAAiBN;QACjBG,OAAOA;;AAGb"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/autocomplete/AutocompleteDropdownButton.tsx"],"sourcesContent":["\"use client\";\nimport {\n type MouseEventHandler,\n type ReactElement,\n type ReactNode,\n} from \"react\";\nimport { Button, type ButtonProps } from \"../button/Button.js\";\nimport { IconRotator, type IconRotatorProps } from \"../icon/IconRotator.js\";\nimport { getIcon } from \"../icon/iconConfig.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\n\n/**\n * @since 6.0.0\n */\nexport interface ConfigurableAutocompleteDropdownButtonProps\n extends ButtonProps {\n /** @defaultValue `AutocompleteProps.menuLabel` */\n \"aria-label\"?: string;\n /** @defaultValue `AutocompleteProps.menuLabelledby` */\n \"aria-labelledby\"?: string;\n\n /** @defaultValue `\"autocomplete-dropdown-\" + useId()` */\n id?: string;\n\n /** @defaultValue `getIcon(\"dropdown\")` */\n icon?: ReactNode;\n iconRotatorProps?: Omit<IconRotatorProps, \"rotated\">;\n}\n\n/**\n * @since 6.0.0\n */\nexport interface AutocompleteDropdownButtonProps\n extends ConfigurableAutocompleteDropdownButtonProps {\n \"aria-controls\": string;\n onClick: MouseEventHandler<HTMLButtonElement>;\n visible: boolean;\n}\n\n/**\n * This is a simple `Button` wrapper to be used as a dropdown button within the\n * `Autocomplete`.\n *\n * @since 6.0.0\n */\nexport function AutocompleteDropdownButton(\n props: AutocompleteDropdownButtonProps\n): ReactElement {\n const { id: propId, icon, visible, iconRotatorProps, ...remaining } = props;\n\n const id = useEnsuredId(propId, \"autocomplete-dropdown\");\n\n return (\n <Button\n {...remaining}\n id={id}\n aria-expanded={visible}\n tabIndex={-1}\n buttonType=\"icon\"\n >\n <IconRotator {...iconRotatorProps} rotated={visible}>\n {getIcon(\"dropdown\", icon)}\n </IconRotator>\n </Button>\n );\n}\n"],"names":["Button","IconRotator","getIcon","useEnsuredId","AutocompleteDropdownButton","props","id","propId","icon","visible","iconRotatorProps","remaining","aria-expanded","tabIndex","buttonType","rotated"],"
|
|
1
|
+
{"version":3,"sources":["../../src/autocomplete/AutocompleteDropdownButton.tsx"],"sourcesContent":["\"use client\";\nimport {\n type MouseEventHandler,\n type ReactElement,\n type ReactNode,\n} from \"react\";\nimport { Button, type ButtonProps } from \"../button/Button.js\";\nimport { IconRotator, type IconRotatorProps } from \"../icon/IconRotator.js\";\nimport { getIcon } from \"../icon/iconConfig.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\n\n/**\n * @since 6.0.0\n */\nexport interface ConfigurableAutocompleteDropdownButtonProps\n extends ButtonProps {\n /** @defaultValue `AutocompleteProps.menuLabel` */\n \"aria-label\"?: string;\n /** @defaultValue `AutocompleteProps.menuLabelledby` */\n \"aria-labelledby\"?: string;\n\n /** @defaultValue `\"autocomplete-dropdown-\" + useId()` */\n id?: string;\n\n /** @defaultValue `getIcon(\"dropdown\")` */\n icon?: ReactNode;\n iconRotatorProps?: Omit<IconRotatorProps, \"rotated\">;\n}\n\n/**\n * @since 6.0.0\n */\nexport interface AutocompleteDropdownButtonProps\n extends ConfigurableAutocompleteDropdownButtonProps {\n \"aria-controls\": string;\n onClick: MouseEventHandler<HTMLButtonElement>;\n visible: boolean;\n}\n\n/**\n * This is a simple `Button` wrapper to be used as a dropdown button within the\n * `Autocomplete`.\n *\n * @since 6.0.0\n */\nexport function AutocompleteDropdownButton(\n props: AutocompleteDropdownButtonProps\n): ReactElement {\n const { id: propId, icon, visible, iconRotatorProps, ...remaining } = props;\n\n const id = useEnsuredId(propId, \"autocomplete-dropdown\");\n\n return (\n <Button\n {...remaining}\n id={id}\n aria-expanded={visible}\n tabIndex={-1}\n buttonType=\"icon\"\n >\n <IconRotator {...iconRotatorProps} rotated={visible}>\n {getIcon(\"dropdown\", icon)}\n </IconRotator>\n </Button>\n );\n}\n"],"names":["Button","IconRotator","getIcon","useEnsuredId","AutocompleteDropdownButton","props","id","propId","icon","visible","iconRotatorProps","remaining","aria-expanded","tabIndex","buttonType","rotated"],"mappings":"AAAA;;AAMA,SAASA,MAAM,QAA0B,sBAAsB;AAC/D,SAASC,WAAW,QAA+B,yBAAyB;AAC5E,SAASC,OAAO,QAAQ,wBAAwB;AAChD,SAASC,YAAY,QAAQ,qBAAqB;AA8BlD;;;;;CAKC,GACD,OAAO,SAASC,2BACdC,KAAsC;IAEtC,MAAM,EAAEC,IAAIC,MAAM,EAAEC,IAAI,EAAEC,OAAO,EAAEC,gBAAgB,EAAE,GAAGC,WAAW,GAAGN;IAEtE,MAAMC,KAAKH,aAAaI,QAAQ;IAEhC,qBACE,KAACP;QACE,GAAGW,SAAS;QACbL,IAAIA;QACJM,iBAAeH;QACfI,UAAU,CAAC;QACXC,YAAW;kBAEX,cAAA,KAACb;YAAa,GAAGS,gBAAgB;YAAEK,SAASN;sBACzCP,QAAQ,YAAYM;;;AAI7B"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/autocomplete/FilterAutocompleteOptions.tsx"],"sourcesContent":["\"use client\";\nimport { useMemo, type ReactElement, type RefObject } from \"react\";\nimport {\n triggerManualChangeEvent,\n type EditableHTMLElement,\n} from \"../form/utils.js\";\nimport { ListSubheader } from \"../list/ListSubheader.js\";\nimport { MenuItem } from \"../menu/MenuItem.js\";\nimport {\n defaultAutocompleteExtractor,\n defaultAutocompleteFilter,\n defaultAutocompleteOptionProps,\n} from \"./defaults.js\";\nimport { type AutocompleteOptionsProps } from \"./types.js\";\n\nconst noop = (): void => {\n // do nothing\n};\n\nexport interface FilterAutocompleteOptionsProps<T>\n extends AutocompleteOptionsProps<T> {\n query: string;\n comboboxRef: RefObject<EditableHTMLElement>;\n}\n\nexport function FilterAutocompleteOptions<T>(\n props: FilterAutocompleteOptionsProps<T>\n): ReactElement {\n const {\n query,\n filter = defaultAutocompleteFilter,\n options,\n extractor = defaultAutocompleteExtractor,\n whitespace = \"keep\",\n comboboxRef,\n disableFilter,\n onAutocomplete = noop,\n getOptionProps = defaultAutocompleteOptionProps,\n clearOnAutocomplete,\n noOptionsChildren = <ListSubheader>No Options</ListSubheader>,\n } = props;\n const filtered = useMemo(() => {\n if (disableFilter) {\n return options;\n }\n\n return filter({\n list: options,\n query,\n extractor,\n whitespace,\n });\n }, [disableFilter, extractor, filter, options, query, whitespace]);\n\n return (\n <>\n {!filtered.length && noOptionsChildren}\n {filtered.map((option, index) => {\n const label = extractor(option);\n const optionProps = getOptionProps({\n index,\n option,\n });\n\n return (\n <MenuItem\n key={label}\n role=\"option\"\n {...optionProps}\n onClick={(event) => {\n optionProps?.onClick?.(event);\n\n triggerManualChangeEvent(\n comboboxRef.current,\n clearOnAutocomplete ? \"\" : label\n );\n onAutocomplete(option);\n }}\n >\n {optionProps?.children ?? label}\n </MenuItem>\n );\n })}\n </>\n );\n}\n"],"names":["useMemo","triggerManualChangeEvent","ListSubheader","MenuItem","defaultAutocompleteExtractor","defaultAutocompleteFilter","defaultAutocompleteOptionProps","noop","FilterAutocompleteOptions","props","query","filter","options","extractor","whitespace","comboboxRef","disableFilter","onAutocomplete","getOptionProps","clearOnAutocomplete","noOptionsChildren","filtered","list","length","map","option","index","label","optionProps","role","onClick","event","current","children"],"
|
|
1
|
+
{"version":3,"sources":["../../src/autocomplete/FilterAutocompleteOptions.tsx"],"sourcesContent":["\"use client\";\nimport { useMemo, type ReactElement, type RefObject } from \"react\";\nimport {\n triggerManualChangeEvent,\n type EditableHTMLElement,\n} from \"../form/utils.js\";\nimport { ListSubheader } from \"../list/ListSubheader.js\";\nimport { MenuItem } from \"../menu/MenuItem.js\";\nimport {\n defaultAutocompleteExtractor,\n defaultAutocompleteFilter,\n defaultAutocompleteOptionProps,\n} from \"./defaults.js\";\nimport { type AutocompleteOptionsProps } from \"./types.js\";\n\nconst noop = (): void => {\n // do nothing\n};\n\nexport interface FilterAutocompleteOptionsProps<T>\n extends AutocompleteOptionsProps<T> {\n query: string;\n comboboxRef: RefObject<EditableHTMLElement>;\n}\n\nexport function FilterAutocompleteOptions<T>(\n props: FilterAutocompleteOptionsProps<T>\n): ReactElement {\n const {\n query,\n filter = defaultAutocompleteFilter,\n options,\n extractor = defaultAutocompleteExtractor,\n whitespace = \"keep\",\n comboboxRef,\n disableFilter,\n onAutocomplete = noop,\n getOptionProps = defaultAutocompleteOptionProps,\n clearOnAutocomplete,\n noOptionsChildren = <ListSubheader>No Options</ListSubheader>,\n } = props;\n const filtered = useMemo(() => {\n if (disableFilter) {\n return options;\n }\n\n return filter({\n list: options,\n query,\n extractor,\n whitespace,\n });\n }, [disableFilter, extractor, filter, options, query, whitespace]);\n\n return (\n <>\n {!filtered.length && noOptionsChildren}\n {filtered.map((option, index) => {\n const label = extractor(option);\n const optionProps = getOptionProps({\n index,\n option,\n });\n\n return (\n <MenuItem\n key={label}\n role=\"option\"\n {...optionProps}\n onClick={(event) => {\n optionProps?.onClick?.(event);\n\n triggerManualChangeEvent(\n comboboxRef.current,\n clearOnAutocomplete ? \"\" : label\n );\n onAutocomplete(option);\n }}\n >\n {optionProps?.children ?? label}\n </MenuItem>\n );\n })}\n </>\n );\n}\n"],"names":["useMemo","triggerManualChangeEvent","ListSubheader","MenuItem","defaultAutocompleteExtractor","defaultAutocompleteFilter","defaultAutocompleteOptionProps","noop","FilterAutocompleteOptions","props","query","filter","options","extractor","whitespace","comboboxRef","disableFilter","onAutocomplete","getOptionProps","clearOnAutocomplete","noOptionsChildren","filtered","list","length","map","option","index","label","optionProps","role","onClick","event","current","children"],"mappings":"AAAA;;AACA,SAASA,OAAO,QAA2C,QAAQ;AACnE,SACEC,wBAAwB,QAEnB,mBAAmB;AAC1B,SAASC,aAAa,QAAQ,2BAA2B;AACzD,SAASC,QAAQ,QAAQ,sBAAsB;AAC/C,SACEC,4BAA4B,EAC5BC,yBAAyB,EACzBC,8BAA8B,QACzB,gBAAgB;AAGvB,MAAMC,OAAO;AACX,aAAa;AACf;AAQA,OAAO,SAASC,0BACdC,KAAwC;IAExC,MAAM,EACJC,KAAK,EACLC,SAASN,yBAAyB,EAClCO,OAAO,EACPC,YAAYT,4BAA4B,EACxCU,aAAa,MAAM,EACnBC,WAAW,EACXC,aAAa,EACbC,iBAAiBV,IAAI,EACrBW,iBAAiBZ,8BAA8B,EAC/Ca,mBAAmB,EACnBC,kCAAoB,KAAClB;kBAAc;MAA0B,EAC9D,GAAGO;IACJ,MAAMY,WAAWrB,QAAQ;QACvB,IAAIgB,eAAe;YACjB,OAAOJ;QACT;QAEA,OAAOD,OAAO;YACZW,MAAMV;YACNF;YACAG;YACAC;QACF;IACF,GAAG;QAACE;QAAeH;QAAWF;QAAQC;QAASF;QAAOI;KAAW;IAEjE,qBACE;;YACG,CAACO,SAASE,MAAM,IAAIH;YACpBC,SAASG,GAAG,CAAC,CAACC,QAAQC;gBACrB,MAAMC,QAAQd,UAAUY;gBACxB,MAAMG,cAAcV,eAAe;oBACjCQ;oBACAD;gBACF;gBAEA,qBACE,KAACtB;oBAEC0B,MAAK;oBACJ,GAAGD,WAAW;oBACfE,SAAS,CAACC;wBACRH,aAAaE,UAAUC;wBAEvB9B,yBACEc,YAAYiB,OAAO,EACnBb,sBAAsB,KAAKQ;wBAE7BV,eAAeQ;oBACjB;8BAECG,aAAaK,YAAYN;mBAbrBA;YAgBX;;;AAGN"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/autocomplete/autocompleteStyles.ts"],"sourcesContent":["import { cnb } from \"cnbuilder\";\nimport { cssUtils } from \"../cssUtils.js\";\nimport { bem } from \"../utils/bem.js\";\n\nconst styles = bem(\"rmd-autocomplete\");\n\n/**\n * @since 6.0.0\n */\nexport interface AutocompleteClassNameOptions {\n className?: string;\n\n loading?: boolean;\n disableDropdownButton?: boolean;\n}\n\n/**\n * @since 6.0.0\n */\nexport function autocomplete(\n options: AutocompleteClassNameOptions = {}\n): string {\n const { className, loading, disableDropdownButton } = options;\n\n return cnb(\n styles({\n // all other configurations must be set manually\n\n // right-addon-1: dropdown button only\n ra1: !loading && !disableDropdownButton,\n // right-addon-2: circular progress and dropdown button\n ra2: loading && !disableDropdownButton,\n // right-addon-3: circular progress only\n ra3: loading && disableDropdownButton,\n }),\n className\n );\n}\n\n/**\n * @since 6.0.0\n */\nexport interface AutocompleteRightAddonClassNameOptions {\n className?: string;\n}\n\n/**\n * @since 6.0.0\n */\nexport function autocompleteRightAddon(\n options: AutocompleteRightAddonClassNameOptions = {}\n): string {\n const { className } = options;\n\n return cnb(\n styles(\"right-addon\"),\n cssUtils({ backgroundColor: \"current-color\" }),\n className\n );\n}\n\n/**\n * @since 6.0.0\n */\nexport interface AutocompleteClearButtonClassNameOptions {\n className?: string;\n}\n\n/**\n * @since 6.0.0\n */\nexport function autocompleteClearButton(\n options: AutocompleteClearButtonClassNameOptions = {}\n): string {\n const { className } = options;\n\n return cnb(styles(\"clear-button\"), className);\n}\n"],"names":["cnb","cssUtils","bem","styles","autocomplete","options","className","loading","disableDropdownButton","ra1","ra2","ra3","autocompleteRightAddon","backgroundColor","autocompleteClearButton"],"
|
|
1
|
+
{"version":3,"sources":["../../src/autocomplete/autocompleteStyles.ts"],"sourcesContent":["import { cnb } from \"cnbuilder\";\nimport { cssUtils } from \"../cssUtils.js\";\nimport { bem } from \"../utils/bem.js\";\n\nconst styles = bem(\"rmd-autocomplete\");\n\n/**\n * @since 6.0.0\n */\nexport interface AutocompleteClassNameOptions {\n className?: string;\n\n loading?: boolean;\n disableDropdownButton?: boolean;\n}\n\n/**\n * @since 6.0.0\n */\nexport function autocomplete(\n options: AutocompleteClassNameOptions = {}\n): string {\n const { className, loading, disableDropdownButton } = options;\n\n return cnb(\n styles({\n // all other configurations must be set manually\n\n // right-addon-1: dropdown button only\n ra1: !loading && !disableDropdownButton,\n // right-addon-2: circular progress and dropdown button\n ra2: loading && !disableDropdownButton,\n // right-addon-3: circular progress only\n ra3: loading && disableDropdownButton,\n }),\n className\n );\n}\n\n/**\n * @since 6.0.0\n */\nexport interface AutocompleteRightAddonClassNameOptions {\n className?: string;\n}\n\n/**\n * @since 6.0.0\n */\nexport function autocompleteRightAddon(\n options: AutocompleteRightAddonClassNameOptions = {}\n): string {\n const { className } = options;\n\n return cnb(\n styles(\"right-addon\"),\n cssUtils({ backgroundColor: \"current-color\" }),\n className\n );\n}\n\n/**\n * @since 6.0.0\n */\nexport interface AutocompleteClearButtonClassNameOptions {\n className?: string;\n}\n\n/**\n * @since 6.0.0\n */\nexport function autocompleteClearButton(\n options: AutocompleteClearButtonClassNameOptions = {}\n): string {\n const { className } = options;\n\n return cnb(styles(\"clear-button\"), className);\n}\n"],"names":["cnb","cssUtils","bem","styles","autocomplete","options","className","loading","disableDropdownButton","ra1","ra2","ra3","autocompleteRightAddon","backgroundColor","autocompleteClearButton"],"mappings":"AAAA,SAASA,GAAG,QAAQ,YAAY;AAChC,SAASC,QAAQ,QAAQ,iBAAiB;AAC1C,SAASC,GAAG,QAAQ,kBAAkB;AAEtC,MAAMC,SAASD,IAAI;AAYnB;;CAEC,GACD,OAAO,SAASE,aACdC,UAAwC,CAAC,CAAC;IAE1C,MAAM,EAAEC,SAAS,EAAEC,OAAO,EAAEC,qBAAqB,EAAE,GAAGH;IAEtD,OAAOL,IACLG,OAAO;QACL,gDAAgD;QAEhD,sCAAsC;QACtCM,KAAK,CAACF,WAAW,CAACC;QAClB,uDAAuD;QACvDE,KAAKH,WAAW,CAACC;QACjB,wCAAwC;QACxCG,KAAKJ,WAAWC;IAClB,IACAF;AAEJ;AASA;;CAEC,GACD,OAAO,SAASM,uBACdP,UAAkD,CAAC,CAAC;IAEpD,MAAM,EAAEC,SAAS,EAAE,GAAGD;IAEtB,OAAOL,IACLG,OAAO,gBACPF,SAAS;QAAEY,iBAAiB;IAAgB,IAC5CP;AAEJ;AASA;;CAEC,GACD,OAAO,SAASQ,wBACdT,UAAmD,CAAC,CAAC;IAErD,MAAM,EAAEC,SAAS,EAAE,GAAGD;IAEtB,OAAOL,IAAIG,OAAO,iBAAiBG;AACrC"}
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
import { type MenuItemProps } from "../menu/MenuItem.js";
|
|
2
2
|
import { type AutocompleteFilterOptions } from "./types.js";
|
|
3
3
|
/**
|
|
4
|
-
* @
|
|
4
|
+
* @since 6.0.0
|
|
5
5
|
* @internal
|
|
6
6
|
*/
|
|
7
7
|
export declare const defaultAutocompleteExtractor: <T>(item: T) => string;
|
|
8
8
|
/**
|
|
9
|
-
* @
|
|
9
|
+
* @since 6.0.0
|
|
10
10
|
* @internal
|
|
11
11
|
*/
|
|
12
12
|
export declare const defaultAutocompleteOptionProps: <T>(options: {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { caseInsensitiveSearch } from "../searching/caseInsensitive.js";
|
|
2
2
|
import { defaultExtractor } from "../searching/utils.js";
|
|
3
3
|
/**
|
|
4
|
-
* @
|
|
4
|
+
* @since 6.0.0
|
|
5
5
|
* @internal
|
|
6
6
|
*/ export const defaultAutocompleteExtractor = (item)=>{
|
|
7
7
|
if (item && typeof item === "object" && "label" in item && typeof item.label === "string") {
|
|
@@ -10,11 +10,11 @@ import { defaultExtractor } from "../searching/utils.js";
|
|
|
10
10
|
return defaultExtractor("Autocomplete")(item);
|
|
11
11
|
};
|
|
12
12
|
/**
|
|
13
|
-
* @
|
|
13
|
+
* @since 6.0.0
|
|
14
14
|
* @internal
|
|
15
15
|
*/ const isProbablyMenuItemProps = (item)=>!!item && typeof item === "object";
|
|
16
16
|
/**
|
|
17
|
-
* @
|
|
17
|
+
* @since 6.0.0
|
|
18
18
|
* @internal
|
|
19
19
|
*/ export const defaultAutocompleteOptionProps = (options)=>{
|
|
20
20
|
const { option } = options;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/autocomplete/defaults.ts"],"sourcesContent":["import { type MenuItemProps } from \"../menu/MenuItem.js\";\nimport { caseInsensitiveSearch } from \"../searching/caseInsensitive.js\";\nimport { defaultExtractor } from \"../searching/utils.js\";\nimport { type AutocompleteFilterOptions } from \"./types.js\";\n\n/**\n * @
|
|
1
|
+
{"version":3,"sources":["../../src/autocomplete/defaults.ts"],"sourcesContent":["import { type MenuItemProps } from \"../menu/MenuItem.js\";\nimport { caseInsensitiveSearch } from \"../searching/caseInsensitive.js\";\nimport { defaultExtractor } from \"../searching/utils.js\";\nimport { type AutocompleteFilterOptions } from \"./types.js\";\n\n/**\n * @since 6.0.0\n * @internal\n */\nexport const defaultAutocompleteExtractor = <T>(item: T): string => {\n if (\n item &&\n typeof item === \"object\" &&\n \"label\" in item &&\n typeof item.label === \"string\"\n ) {\n return item.label;\n }\n\n return defaultExtractor(\"Autocomplete\")(item);\n};\n\n/**\n * @since 6.0.0\n * @internal\n */\nconst isProbablyMenuItemProps = (\n item: unknown\n): item is Partial<MenuItemProps> => !!item && typeof item === \"object\";\n\n/**\n * @since 6.0.0\n * @internal\n */\nexport const defaultAutocompleteOptionProps = <T>(options: {\n option: T;\n}): Partial<MenuItemProps> | undefined => {\n const { option } = options;\n if (isProbablyMenuItemProps(option)) {\n const {\n leftAddon,\n rightAddon,\n className,\n disabled,\n height,\n textProps,\n textClassName,\n primaryText,\n secondaryText,\n secondaryTextClassName,\n multiline,\n disableTextChildren,\n } = option;\n\n return {\n leftAddon,\n rightAddon,\n className,\n disabled,\n height,\n textProps,\n textClassName,\n primaryText,\n secondaryText,\n secondaryTextClassName,\n multiline,\n disableTextChildren,\n };\n }\n return;\n};\n\n/**\n * This is just the {@link caseInsensitiveSearch} but requires\n * the options to start with the current query.\n *\n * @since 6.0.0\n */\nexport function defaultAutocompleteFilter<T>(\n options: AutocompleteFilterOptions<T>\n): readonly T[] {\n return caseInsensitiveSearch({ ...options, startsWith: true });\n}\n"],"names":["caseInsensitiveSearch","defaultExtractor","defaultAutocompleteExtractor","item","label","isProbablyMenuItemProps","defaultAutocompleteOptionProps","options","option","leftAddon","rightAddon","className","disabled","height","textProps","textClassName","primaryText","secondaryText","secondaryTextClassName","multiline","disableTextChildren","defaultAutocompleteFilter","startsWith"],"mappings":"AACA,SAASA,qBAAqB,QAAQ,kCAAkC;AACxE,SAASC,gBAAgB,QAAQ,wBAAwB;AAGzD;;;CAGC,GACD,OAAO,MAAMC,+BAA+B,CAAIC;IAC9C,IACEA,QACA,OAAOA,SAAS,YAChB,WAAWA,QACX,OAAOA,KAAKC,KAAK,KAAK,UACtB;QACA,OAAOD,KAAKC,KAAK;IACnB;IAEA,OAAOH,iBAAiB,gBAAgBE;AAC1C,EAAE;AAEF;;;CAGC,GACD,MAAME,0BAA0B,CAC9BF,OACmC,CAAC,CAACA,QAAQ,OAAOA,SAAS;AAE/D;;;CAGC,GACD,OAAO,MAAMG,iCAAiC,CAAIC;IAGhD,MAAM,EAAEC,MAAM,EAAE,GAAGD;IACnB,IAAIF,wBAAwBG,SAAS;QACnC,MAAM,EACJC,SAAS,EACTC,UAAU,EACVC,SAAS,EACTC,QAAQ,EACRC,MAAM,EACNC,SAAS,EACTC,aAAa,EACbC,WAAW,EACXC,aAAa,EACbC,sBAAsB,EACtBC,SAAS,EACTC,mBAAmB,EACpB,GAAGZ;QAEJ,OAAO;YACLC;YACAC;YACAC;YACAC;YACAC;YACAC;YACAC;YACAC;YACAC;YACAC;YACAC;YACAC;QACF;IACF;IACA;AACF,EAAE;AAEF;;;;;CAKC,GACD,OAAO,SAASC,0BACdd,OAAqC;IAErC,OAAOP,sBAAsB;QAAE,GAAGO,OAAO;QAAEe,YAAY;IAAK;AAC9D"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/autocomplete/types.ts"],"sourcesContent":["import { type ReactNode } from \"react\";\nimport { type MenuItemProps } from \"../menu/MenuItem.jsx\";\nimport {\n type BaseSearchOptions,\n type WhitespaceFilter,\n} from \"../searching/types.js\";\nimport { type RequireAtLeastOne, type TextExtractor } from \"../types.js\";\n\n/**\n * @since 6.0.0\n */\nexport type AutocompleteMenuLabel<\n T extends { menuLabel?: string; menuLabelledBy?: string },\n> = RequireAtLeastOne<T, \"menuLabel\" | \"menuLabelledBy\">;\n\n/**\n * @since 6.0.0\n */\nexport type AutocompleteFilterOptions<T> = Pick<\n Required<BaseSearchOptions<T>>,\n \"list\" | \"query\" | \"extractor\" | \"whitespace\"\n>;\n\n/**\n * @since 6.0.0\n */\nexport interface AutocompleteGetOptionPropsOptions<T> {\n index: number;\n option: T;\n}\n\n/**\n * @since 6.0.0\n */\nexport interface AutocompleteOptionsProps<T> {\n /**\n * This list of options to display and will be filtered based on the current\n * value in the text box unless {@link disableFilter} is `true`.\n *\n * When this is not a list of strings or a list of objects with a\n * `{ label: string }`, the {@link extractor} is required to pull a searchable\n * string from each option.\n */\n options: readonly T[];\n\n /**\n * This controls how the {@link options} are filtered based on the current\n * value in the text box.\n *\n * @example Fuzzy Search\n * ```tsx\n * import { fuzzySearch } from \"@react-md/core/searching/fuzzy\";\n *\n * <Autocomplete\n * {...props}\n * filter={fuzzySearch}\n * />\n * ```\n *\n * @defaultValue `caseInsensitiveSearch`\n */\n filter?(options: AutocompleteFilterOptions<T>): readonly T[];\n\n /**\n * @example\n * ```tsx\n * <Autocomplete\n * options={[{ children: \"Apple\" }, { children = \"Banana\" }]}\n * extractor={(option) => option.children}\n * {...props}\n * />\n * ```\n */\n extractor?: TextExtractor<T>;\n\n /**\n * This can be used to add additional props to each option.\n *\n * @example Simple Example\n * ```tsx\n * getOptionProps={({ option }) => {\n * return {\n * disabled: option === \"\",\n * className: cnb(option === \"a\" && styles.blue),\n * leftAddon: option === value && <CheckIcon />,\n * };\n * }}\n * ```\n */\n getOptionProps?(\n options: AutocompleteGetOptionPropsOptions<T>\n ): Partial<MenuItemProps> | undefined;\n\n /**\n * The children to display when there are no {@link options} due to the\n * current text box value.\n *\n * @defaultValue `<ListSubheader>No options</ListSubheader`\n */\n noOptionsChildren?: ReactNode;\n\n /**\n * This will be called whenever one of the options are selected or reset.\n */\n onAutocomplete?(option: T | null): void;\n\n /**\n * @defaultValue `false`\n */\n clearOnAutocomplete?: boolean;\n\n /**\n * Set this to `true` to disable the built-in filtering of the\n * {@link options}. This will always be `true` if `aria-autocomplete=\"none\"`.\n *\n * @defaultValue `false`\n */\n disableFilter?: boolean;\n\n /** @defaultValue `\"keep\"` */\n whitespace?: WhitespaceFilter;\n}\n"],"names":[],"
|
|
1
|
+
{"version":3,"sources":["../../src/autocomplete/types.ts"],"sourcesContent":["import { type ReactNode } from \"react\";\nimport { type MenuItemProps } from \"../menu/MenuItem.jsx\";\nimport {\n type BaseSearchOptions,\n type WhitespaceFilter,\n} from \"../searching/types.js\";\nimport { type RequireAtLeastOne, type TextExtractor } from \"../types.js\";\n\n/**\n * @since 6.0.0\n */\nexport type AutocompleteMenuLabel<\n T extends { menuLabel?: string; menuLabelledBy?: string },\n> = RequireAtLeastOne<T, \"menuLabel\" | \"menuLabelledBy\">;\n\n/**\n * @since 6.0.0\n */\nexport type AutocompleteFilterOptions<T> = Pick<\n Required<BaseSearchOptions<T>>,\n \"list\" | \"query\" | \"extractor\" | \"whitespace\"\n>;\n\n/**\n * @since 6.0.0\n */\nexport interface AutocompleteGetOptionPropsOptions<T> {\n index: number;\n option: T;\n}\n\n/**\n * @since 6.0.0\n */\nexport interface AutocompleteOptionsProps<T> {\n /**\n * This list of options to display and will be filtered based on the current\n * value in the text box unless {@link disableFilter} is `true`.\n *\n * When this is not a list of strings or a list of objects with a\n * `{ label: string }`, the {@link extractor} is required to pull a searchable\n * string from each option.\n */\n options: readonly T[];\n\n /**\n * This controls how the {@link options} are filtered based on the current\n * value in the text box.\n *\n * @example Fuzzy Search\n * ```tsx\n * import { fuzzySearch } from \"@react-md/core/searching/fuzzy\";\n *\n * <Autocomplete\n * {...props}\n * filter={fuzzySearch}\n * />\n * ```\n *\n * @defaultValue `caseInsensitiveSearch`\n */\n filter?(options: AutocompleteFilterOptions<T>): readonly T[];\n\n /**\n * @example\n * ```tsx\n * <Autocomplete\n * options={[{ children: \"Apple\" }, { children = \"Banana\" }]}\n * extractor={(option) => option.children}\n * {...props}\n * />\n * ```\n */\n extractor?: TextExtractor<T>;\n\n /**\n * This can be used to add additional props to each option.\n *\n * @example Simple Example\n * ```tsx\n * getOptionProps={({ option }) => {\n * return {\n * disabled: option === \"\",\n * className: cnb(option === \"a\" && styles.blue),\n * leftAddon: option === value && <CheckIcon />,\n * };\n * }}\n * ```\n */\n getOptionProps?(\n options: AutocompleteGetOptionPropsOptions<T>\n ): Partial<MenuItemProps> | undefined;\n\n /**\n * The children to display when there are no {@link options} due to the\n * current text box value.\n *\n * @defaultValue `<ListSubheader>No options</ListSubheader`\n */\n noOptionsChildren?: ReactNode;\n\n /**\n * This will be called whenever one of the options are selected or reset.\n */\n onAutocomplete?(option: T | null): void;\n\n /**\n * @defaultValue `false`\n */\n clearOnAutocomplete?: boolean;\n\n /**\n * Set this to `true` to disable the built-in filtering of the\n * {@link options}. This will always be `true` if `aria-autocomplete=\"none\"`.\n *\n * @defaultValue `false`\n */\n disableFilter?: boolean;\n\n /** @defaultValue `\"keep\"` */\n whitespace?: WhitespaceFilter;\n}\n"],"names":[],"mappings":"AA+BA;;CAEC,GACD,WAuFC"}
|
package/dist/avatar/Avatar.d.ts
CHANGED
|
@@ -82,7 +82,6 @@ export interface AvatarProps extends Omit<HTMLAttributes<HTMLSpanElement>, "colo
|
|
|
82
82
|
* }
|
|
83
83
|
* ```
|
|
84
84
|
*
|
|
85
|
-
* @since 6.0.0 `aria-hidden` is set to `true` by default
|
|
86
|
-
* the `role="presentation"`.
|
|
85
|
+
* @since 6.0.0 `aria-hidden` is set to `true` by default.
|
|
87
86
|
*/
|
|
88
87
|
export declare const Avatar: import("react").ForwardRefExoticComponent<AvatarProps & import("react").RefAttributes<HTMLSpanElement>>;
|
package/dist/avatar/Avatar.js
CHANGED
|
@@ -19,8 +19,7 @@ import { avatar, avatarImage } from "./styles.js";
|
|
|
19
19
|
* }
|
|
20
20
|
* ```
|
|
21
21
|
*
|
|
22
|
-
* @since 6.0.0 `aria-hidden` is set to `true` by default
|
|
23
|
-
* the `role="presentation"`.
|
|
22
|
+
* @since 6.0.0 `aria-hidden` is set to `true` by default.
|
|
24
23
|
*/ export const Avatar = /*#__PURE__*/ forwardRef(function Avatar(props, ref) {
|
|
25
24
|
const { "aria-hidden": ariaHidden = true, className, children, src, alt = "", size = "avatar", color = "", theme, imgProps, referrerPolicy, ...remaining } = props;
|
|
26
25
|
let img;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/avatar/Avatar.tsx"],"sourcesContent":["import {\n forwardRef,\n type HTMLAttributes,\n type ImgHTMLAttributes,\n type ReactNode,\n} from \"react\";\nimport { type PropsWithRef } from \"../types.js\";\nimport { avatar, avatarImage, type AvatarClassNameOptions } from \"./styles.js\";\n\ndeclare module \"react\" {\n interface CSSProperties {\n \"--rmd-avatar-background-color\"?: string;\n \"--rmd-avatar-color\"?: string;\n \"--rmd-avatar-border-color\"?: string;\n \"--rmd-avatar-border-radius\"?: string | number;\n \"--rmd-avatar-size\"?: string | number;\n \"--rmd-avatar-font-size\"?: string | number;\n }\n}\n\nexport type AvatarImgAttributes = ImgHTMLAttributes<HTMLImageElement>;\n\n/**\n * @since 6.0.0 `aria-hidden` is set to `true` by default and removed\n * the `role=\"presentation\"`.\n */\nexport interface AvatarProps\n extends Omit<HTMLAttributes<HTMLSpanElement>, \"color\">,\n AvatarClassNameOptions {\n /**\n * Since avatars are normally presentational data, they are hidden from screen\n * readers by default.\n *\n * @defaultValue `true`\n */\n \"aria-hidden\"?: HTMLAttributes<HTMLSpanElement>[\"aria-hidden\"];\n\n /**\n * This should be an image `src` attribute to create an avatar from. When this\n * prop is defined, you should not add any children to the avatar as the\n * positioning will break.\n */\n src?: string;\n\n /**\n * An optional alt tag to display on the `<img>` when the `src` prop is also\n * applied.\n *\n * For accessibility and screen readers, you normally do not want to actually\n * provide this prop. This should only be used if the `Avatar` is not\n * accompanied by some other component or main content as it will be extra\n * noise for screen readers.\n *\n * @defaultValue `\"\"`\n */\n alt?: string;\n\n /**\n * An optional `referrerPolicy` to provide to the `<img>` element if the `src`\n * or `imgProps` props are provided.\n *\n * @see {@link https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#attr-referrerpolicy|Referrer Policy}\n *\n * @since 2.2.0\n */\n referrerPolicy?: AvatarImgAttributes[\"referrerPolicy\"];\n\n /**\n * An optional object of image props and ref that can be used to create an\n * image within the `Avatar`. This can be useful to add a custom `style`\n * or`className` to the `<img>` element if that additional customization is\n * needed.\n *\n * Note: The values in this object will override the `src`, `alt`, and\n * `referrerPolicy` root level avatar props if they exist on this object.\n *\n * @since 2.2.0\n */\n imgProps?: PropsWithRef<AvatarImgAttributes, HTMLImageElement>;\n}\n\n/**\n * **Server Component**\n *\n * An `Avatar` is generally used to represent objects or people within your app.\n * The avatar can consist of an image, an icon, or some text to display. When\n * the avatar is not an image, different themes can be applied to make the\n * avatar more unique.\n *\n * @example Simple Example\n * ```tsx\n * import { Avatar } from \"@react-md/core\";\n * import { type ReactElement } from \"react\";\n *\n * export function Example(): ReactElement {\n * return <Avatar src=\"/path-to-img.png\" />;\n * }\n * ```\n *\n * @since 6.0.0 `aria-hidden` is set to `true` by default
|
|
1
|
+
{"version":3,"sources":["../../src/avatar/Avatar.tsx"],"sourcesContent":["import {\n forwardRef,\n type HTMLAttributes,\n type ImgHTMLAttributes,\n type ReactNode,\n} from \"react\";\nimport { type PropsWithRef } from \"../types.js\";\nimport { avatar, avatarImage, type AvatarClassNameOptions } from \"./styles.js\";\n\ndeclare module \"react\" {\n interface CSSProperties {\n \"--rmd-avatar-background-color\"?: string;\n \"--rmd-avatar-color\"?: string;\n \"--rmd-avatar-border-color\"?: string;\n \"--rmd-avatar-border-radius\"?: string | number;\n \"--rmd-avatar-size\"?: string | number;\n \"--rmd-avatar-font-size\"?: string | number;\n }\n}\n\nexport type AvatarImgAttributes = ImgHTMLAttributes<HTMLImageElement>;\n\n/**\n * @since 6.0.0 `aria-hidden` is set to `true` by default and removed\n * the `role=\"presentation\"`.\n */\nexport interface AvatarProps\n extends Omit<HTMLAttributes<HTMLSpanElement>, \"color\">,\n AvatarClassNameOptions {\n /**\n * Since avatars are normally presentational data, they are hidden from screen\n * readers by default.\n *\n * @defaultValue `true`\n */\n \"aria-hidden\"?: HTMLAttributes<HTMLSpanElement>[\"aria-hidden\"];\n\n /**\n * This should be an image `src` attribute to create an avatar from. When this\n * prop is defined, you should not add any children to the avatar as the\n * positioning will break.\n */\n src?: string;\n\n /**\n * An optional alt tag to display on the `<img>` when the `src` prop is also\n * applied.\n *\n * For accessibility and screen readers, you normally do not want to actually\n * provide this prop. This should only be used if the `Avatar` is not\n * accompanied by some other component or main content as it will be extra\n * noise for screen readers.\n *\n * @defaultValue `\"\"`\n */\n alt?: string;\n\n /**\n * An optional `referrerPolicy` to provide to the `<img>` element if the `src`\n * or `imgProps` props are provided.\n *\n * @see {@link https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#attr-referrerpolicy|Referrer Policy}\n *\n * @since 2.2.0\n */\n referrerPolicy?: AvatarImgAttributes[\"referrerPolicy\"];\n\n /**\n * An optional object of image props and ref that can be used to create an\n * image within the `Avatar`. This can be useful to add a custom `style`\n * or`className` to the `<img>` element if that additional customization is\n * needed.\n *\n * Note: The values in this object will override the `src`, `alt`, and\n * `referrerPolicy` root level avatar props if they exist on this object.\n *\n * @since 2.2.0\n */\n imgProps?: PropsWithRef<AvatarImgAttributes, HTMLImageElement>;\n}\n\n/**\n * **Server Component**\n *\n * An `Avatar` is generally used to represent objects or people within your app.\n * The avatar can consist of an image, an icon, or some text to display. When\n * the avatar is not an image, different themes can be applied to make the\n * avatar more unique.\n *\n * @example Simple Example\n * ```tsx\n * import { Avatar } from \"@react-md/core\";\n * import { type ReactElement } from \"react\";\n *\n * export function Example(): ReactElement {\n * return <Avatar src=\"/path-to-img.png\" />;\n * }\n * ```\n *\n * @since 6.0.0 `aria-hidden` is set to `true` by default.\n */\nexport const Avatar = forwardRef<HTMLSpanElement, AvatarProps>(\n function Avatar(props, ref) {\n const {\n \"aria-hidden\": ariaHidden = true,\n className,\n children,\n src,\n alt = \"\",\n size = \"avatar\",\n color = \"\",\n theme,\n imgProps,\n referrerPolicy,\n ...remaining\n } = props;\n\n let img: ReactNode;\n if (src || imgProps) {\n img = (\n <img\n src={src}\n alt={alt}\n referrerPolicy={referrerPolicy}\n {...imgProps}\n className={avatarImage({ className: imgProps?.className })}\n />\n );\n }\n\n return (\n <span\n {...remaining}\n aria-hidden={ariaHidden}\n ref={ref}\n className={avatar({\n size,\n color,\n theme,\n className,\n })}\n >\n {img}\n {children}\n </span>\n );\n }\n);\n"],"names":["forwardRef","avatar","avatarImage","Avatar","props","ref","ariaHidden","className","children","src","alt","size","color","theme","imgProps","referrerPolicy","remaining","img","span","aria-hidden"],"mappings":";AAAA,SACEA,UAAU,QAIL,QAAQ;AAEf,SAASC,MAAM,EAAEC,WAAW,QAAqC,cAAc;AA0E/E;;;;;;;;;;;;;;;;;;;CAmBC,GACD,OAAO,MAAMC,uBAASH,WACpB,SAASG,OAAOC,KAAK,EAAEC,GAAG;IACxB,MAAM,EACJ,eAAeC,aAAa,IAAI,EAChCC,SAAS,EACTC,QAAQ,EACRC,GAAG,EACHC,MAAM,EAAE,EACRC,OAAO,QAAQ,EACfC,QAAQ,EAAE,EACVC,KAAK,EACLC,QAAQ,EACRC,cAAc,EACd,GAAGC,WACJ,GAAGZ;IAEJ,IAAIa;IACJ,IAAIR,OAAOK,UAAU;QACnBG,oBACE,KAACA;YACCR,KAAKA;YACLC,KAAKA;YACLK,gBAAgBA;YACf,GAAGD,QAAQ;YACZP,WAAWL,YAAY;gBAAEK,WAAWO,UAAUP;YAAU;;IAG9D;IAEA,qBACE,MAACW;QACE,GAAGF,SAAS;QACbG,eAAab;QACbD,KAAKA;QACLE,WAAWN,OAAO;YAChBU;YACAC;YACAC;YACAN;QACF;;YAECU;YACAT;;;AAGP,GACA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/avatar/styles.ts"],"sourcesContent":["import { cnb } from \"cnbuilder\";\nimport { cssUtils, type ThemeColor } from \"../cssUtils.js\";\nimport { bem } from \"../utils/bem.js\";\n\nconst styles = bem(\"rmd-avatar\");\n\n/** @since 6.0.0 */\nexport interface AvatarClassNameOptions {\n className?: string;\n\n /**\n * An optional color to apply to the avatar. This will apply a className of\n * `rmd-avatar--${color}`, so only the keys from the `$rmd-avatar-colors` Map\n * are supported by default. It is recommended to create custom colors using\n * the `rmd-avatar-theme-update-var` mixin with custom class names if the\n * default colors aren't extensive enough.\n *\n * @see {@link theme}\n * @defaultValue `\"\"`\n */\n color?: string;\n\n /**\n * @defaultValue `\"avatar\"`\n */\n size?: \"avatar\" | \"icon\";\n\n /**\n * This can be used instead of {@link color} to set the background color to one of\n * the theme colors. This will also set the text color to either be `#000` or\n * `#fff` automatically to enforce the correct aspect ratio.\n */\n theme?: ThemeColor;\n}\n\n/**\n * @since 6.0.0\n */\nexport function avatar(options: AvatarClassNameOptions): string {\n const { className, color = \"\", size, theme } = options;\n\n return cnb(\n styles({ [color]: color, icon: size === \"icon\" }),\n cssUtils({ backgroundColor: theme }),\n className\n );\n}\n\n/** @since 6.0.0 */\nexport interface AvatarImageClassNameOptions {\n className?: string;\n}\n\n/**\n * @since 6.0.0\n */\nexport function avatarImage(options: AvatarImageClassNameOptions = {}): string {\n const { className } = options;\n\n return cnb(styles(\"image\"), className);\n}\n"],"names":["cnb","cssUtils","bem","styles","avatar","options","className","color","size","theme","icon","backgroundColor","avatarImage"],"
|
|
1
|
+
{"version":3,"sources":["../../src/avatar/styles.ts"],"sourcesContent":["import { cnb } from \"cnbuilder\";\nimport { cssUtils, type ThemeColor } from \"../cssUtils.js\";\nimport { bem } from \"../utils/bem.js\";\n\nconst styles = bem(\"rmd-avatar\");\n\n/** @since 6.0.0 */\nexport interface AvatarClassNameOptions {\n className?: string;\n\n /**\n * An optional color to apply to the avatar. This will apply a className of\n * `rmd-avatar--${color}`, so only the keys from the `$rmd-avatar-colors` Map\n * are supported by default. It is recommended to create custom colors using\n * the `rmd-avatar-theme-update-var` mixin with custom class names if the\n * default colors aren't extensive enough.\n *\n * @see {@link theme}\n * @defaultValue `\"\"`\n */\n color?: string;\n\n /**\n * @defaultValue `\"avatar\"`\n */\n size?: \"avatar\" | \"icon\";\n\n /**\n * This can be used instead of {@link color} to set the background color to one of\n * the theme colors. This will also set the text color to either be `#000` or\n * `#fff` automatically to enforce the correct aspect ratio.\n */\n theme?: ThemeColor;\n}\n\n/**\n * @since 6.0.0\n */\nexport function avatar(options: AvatarClassNameOptions): string {\n const { className, color = \"\", size, theme } = options;\n\n return cnb(\n styles({ [color]: color, icon: size === \"icon\" }),\n cssUtils({ backgroundColor: theme }),\n className\n );\n}\n\n/** @since 6.0.0 */\nexport interface AvatarImageClassNameOptions {\n className?: string;\n}\n\n/**\n * @since 6.0.0\n */\nexport function avatarImage(options: AvatarImageClassNameOptions = {}): string {\n const { className } = options;\n\n return cnb(styles(\"image\"), className);\n}\n"],"names":["cnb","cssUtils","bem","styles","avatar","options","className","color","size","theme","icon","backgroundColor","avatarImage"],"mappings":"AAAA,SAASA,GAAG,QAAQ,YAAY;AAChC,SAASC,QAAQ,QAAyB,iBAAiB;AAC3D,SAASC,GAAG,QAAQ,kBAAkB;AAEtC,MAAMC,SAASD,IAAI;AA+BnB;;CAEC,GACD,OAAO,SAASE,OAAOC,OAA+B;IACpD,MAAM,EAAEC,SAAS,EAAEC,QAAQ,EAAE,EAAEC,IAAI,EAAEC,KAAK,EAAE,GAAGJ;IAE/C,OAAOL,IACLG,OAAO;QAAE,CAACI,MAAM,EAAEA;QAAOG,MAAMF,SAAS;IAAO,IAC/CP,SAAS;QAAEU,iBAAiBF;IAAM,IAClCH;AAEJ;AAOA;;CAEC,GACD,OAAO,SAASM,YAAYP,UAAuC,CAAC,CAAC;IACnE,MAAM,EAAEC,SAAS,EAAE,GAAGD;IAEtB,OAAOL,IAAIG,OAAO,UAAUG;AAC9B"}
|
package/dist/badge/Badge.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/badge/Badge.tsx"],"sourcesContent":["import { cnb } from \"cnbuilder\";\nimport { forwardRef, type HTMLAttributes, type ReactNode } from \"react\";\nimport { cssUtils, type BackgroundColor } from \"../cssUtils.js\";\nimport { bem } from \"../utils/bem.js\";\n\ndeclare module \"react\" {\n interface CSSProperties {\n \"--rmd-badge-size\"?: string | number;\n \"--rmd-badge-offset\"?: string | number;\n \"--rmd-badge-offset-top\"?: string | number;\n \"--rmd-badge-offset-right\"?: string | number;\n }\n}\n\nconst styles = bem(\"rmd-badge\");\n\n/**\n * @since 6.0.0 Renamed `\"default\"` to `\"greyscale\"` and added all\n * theme colors.\n */\nexport type BadgeTheme = BackgroundColor | \"greyscale\" | \"clear\";\n\nexport interface BadgeClassNameOptions {\n className?: string;\n\n /** @defaultValue `\"\"greyscale` */\n theme?: BadgeTheme;\n}\n\nexport function badge(options: BadgeClassNameOptions = {}): string {\n const { className, theme = \"greyscale\" } = options;\n const greyscale = theme === \"greyscale\";\n const clear = theme === \"clear\";\n\n return cnb(\n styles({ greyscale }),\n cssUtils({ backgroundColor: !clear && !greyscale ? theme : undefined }),\n className\n );\n}\n\nexport interface BadgeProps extends HTMLAttributes<HTMLSpanElement> {\n /** @defaultValue `\"\"greyscale` */\n theme?: BadgeTheme;\n\n children: ReactNode;\n}\n\n/**\n * **Server Component**\n *\n * @example Simple Example\n * ```tsx\n * import type { ReactElement } from \"react\";\n * import { Badge, Button, MaterialSymbol } from \"@react-md/core\";\n *\n * function Example(): ReactElement {\n * return (\n * <>\n * <Badge>3</Badge>\n * <Badge theme=\"primary\">100</Badge>\n * <Badge theme=\"secondary\">23</Badge>\n * <Badge theme=\"greyscale\">18</Badge>\n * <Badge theme=\"clear\">1</Badge>\n * </>\n * );\n * }\n * ```\n *\n * @example Within Buttons Example\n * ```tsx\n * import type { ReactElement } from \"react\";\n * import { Badge, Button, MaterialSymbol } from \"@react-md/core\";\n *\n * function Example(): ReactElement {\n * return (\n * <Button aria-label=\"Notifications\" buttonType=\"icon\">\n * <Badge>88</Badge>\n * <MaterialSymbol name=\"notifications\" />\n * </Button>\n * );\n * }\n * ```\n *\n * @since 6.0.0 Removed the `disableNullOnZero` feature since it's\n * easier just to use condition rendering yourself.\n */\nexport const Badge = forwardRef<HTMLSpanElement, BadgeProps>(\n function Badge(props, ref) {\n const { children, className, theme, ...remaining } = props;\n return (\n <span {...remaining} ref={ref} className={badge({ theme, className })}>\n {children}\n </span>\n );\n }\n);\n"],"names":["cnb","forwardRef","cssUtils","bem","styles","badge","options","className","theme","greyscale","clear","backgroundColor","undefined","Badge","props","ref","children","remaining","span"],"
|
|
1
|
+
{"version":3,"sources":["../../src/badge/Badge.tsx"],"sourcesContent":["import { cnb } from \"cnbuilder\";\nimport { forwardRef, type HTMLAttributes, type ReactNode } from \"react\";\nimport { cssUtils, type BackgroundColor } from \"../cssUtils.js\";\nimport { bem } from \"../utils/bem.js\";\n\ndeclare module \"react\" {\n interface CSSProperties {\n \"--rmd-badge-size\"?: string | number;\n \"--rmd-badge-offset\"?: string | number;\n \"--rmd-badge-offset-top\"?: string | number;\n \"--rmd-badge-offset-right\"?: string | number;\n }\n}\n\nconst styles = bem(\"rmd-badge\");\n\n/**\n * @since 6.0.0 Renamed `\"default\"` to `\"greyscale\"` and added all\n * theme colors.\n */\nexport type BadgeTheme = BackgroundColor | \"greyscale\" | \"clear\";\n\nexport interface BadgeClassNameOptions {\n className?: string;\n\n /** @defaultValue `\"\"greyscale` */\n theme?: BadgeTheme;\n}\n\nexport function badge(options: BadgeClassNameOptions = {}): string {\n const { className, theme = \"greyscale\" } = options;\n const greyscale = theme === \"greyscale\";\n const clear = theme === \"clear\";\n\n return cnb(\n styles({ greyscale }),\n cssUtils({ backgroundColor: !clear && !greyscale ? theme : undefined }),\n className\n );\n}\n\nexport interface BadgeProps extends HTMLAttributes<HTMLSpanElement> {\n /** @defaultValue `\"\"greyscale` */\n theme?: BadgeTheme;\n\n children: ReactNode;\n}\n\n/**\n * **Server Component**\n *\n * @example Simple Example\n * ```tsx\n * import type { ReactElement } from \"react\";\n * import { Badge, Button, MaterialSymbol } from \"@react-md/core\";\n *\n * function Example(): ReactElement {\n * return (\n * <>\n * <Badge>3</Badge>\n * <Badge theme=\"primary\">100</Badge>\n * <Badge theme=\"secondary\">23</Badge>\n * <Badge theme=\"greyscale\">18</Badge>\n * <Badge theme=\"clear\">1</Badge>\n * </>\n * );\n * }\n * ```\n *\n * @example Within Buttons Example\n * ```tsx\n * import type { ReactElement } from \"react\";\n * import { Badge, Button, MaterialSymbol } from \"@react-md/core\";\n *\n * function Example(): ReactElement {\n * return (\n * <Button aria-label=\"Notifications\" buttonType=\"icon\">\n * <Badge>88</Badge>\n * <MaterialSymbol name=\"notifications\" />\n * </Button>\n * );\n * }\n * ```\n *\n * @since 6.0.0 Removed the `disableNullOnZero` feature since it's\n * easier just to use condition rendering yourself.\n */\nexport const Badge = forwardRef<HTMLSpanElement, BadgeProps>(\n function Badge(props, ref) {\n const { children, className, theme, ...remaining } = props;\n return (\n <span {...remaining} ref={ref} className={badge({ theme, className })}>\n {children}\n </span>\n );\n }\n);\n"],"names":["cnb","forwardRef","cssUtils","bem","styles","badge","options","className","theme","greyscale","clear","backgroundColor","undefined","Badge","props","ref","children","remaining","span"],"mappings":";AAAA,SAASA,GAAG,QAAQ,YAAY;AAChC,SAASC,UAAU,QAA6C,QAAQ;AACxE,SAASC,QAAQ,QAA8B,iBAAiB;AAChE,SAASC,GAAG,QAAQ,kBAAkB;AAWtC,MAAMC,SAASD,IAAI;AAenB,OAAO,SAASE,MAAMC,UAAiC,CAAC,CAAC;IACvD,MAAM,EAAEC,SAAS,EAAEC,QAAQ,WAAW,EAAE,GAAGF;IAC3C,MAAMG,YAAYD,UAAU;IAC5B,MAAME,QAAQF,UAAU;IAExB,OAAOR,IACLI,OAAO;QAAEK;IAAU,IACnBP,SAAS;QAAES,iBAAiB,CAACD,SAAS,CAACD,YAAYD,QAAQI;IAAU,IACrEL;AAEJ;AASA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAsCC,GACD,OAAO,MAAMM,sBAAQZ,WACnB,SAASY,MAAMC,KAAK,EAAEC,GAAG;IACvB,MAAM,EAAEC,QAAQ,EAAET,SAAS,EAAEC,KAAK,EAAE,GAAGS,WAAW,GAAGH;IACrD,qBACE,KAACI;QAAM,GAAGD,SAAS;QAAEF,KAAKA;QAAKR,WAAWF,MAAM;YAAEG;YAAOD;QAAU;kBAChES;;AAGP,GACA"}
|
package/dist/box/Box.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/box/Box.tsx"],"sourcesContent":["import { forwardRef, type HTMLAttributes } from \"react\";\nimport { box, type BoxOptions } from \"./styles.js\";\n\n/**\n * @since 6.0.0\n */\nexport interface BoxProps extends HTMLAttributes<HTMLDivElement>, BoxOptions {}\n\n/**\n * **Server Component**\n *\n * The `Box` component is a wrapper around the CSS box model and should solve\n * most of your `flex` and `grid` layout requirements for responsive design.\n * There are pass-through props for all of the box module styling properties\n * available by default.\n *\n * @example Default Styles\n * ```scss\n * .box {\n * align-items: center;\n * display: flex;\n * flex-wrap: wrap;\n * gap: 1rem;\n * padding: 1rem;\n * }\n * ```\n *\n * ```tsx\n * import { Box } from \"@react-md/core\";\n * import type { ReactElement } from \"react\";\n *\n * export default function Example(): ReactElement {\n * return (\n * <Box>\n * <div>Thing 1</div>\n * <div>Thing 2</div>\n * <div>Thing 3</div>\n * <div>Thing 4</div>\n * <div>Thing 5</div>\n * </Box>\n * ):\n * }\n * ```\n *\n * @example Default Grid Styles\n * ```scss\n * .box {\n * align-items: center;\n * display: grid;\n * grid-gap: 1rem;\n * grid-template-columns: repeat(auto-fit, minmax(8rem, 1fr));\n * padding: 1rem;\n * }\n * ```\n *\n * ```tsx\n * import { Box } from \"@react-md/core\";\n * import type { ReactElement } from \"react\";\n *\n * export default function Example(): ReactElement {\n * return (\n * <Box grid>\n * <div>Thing 1</div>\n * <div>Thing 2</div>\n * <div>Thing 3</div>\n * <div>Thing 4</div>\n * <div>Thing 5</div>\n * </Box>\n * ):\n * }\n * ```\n *\n * @example Custom Grid\n * ```scss\n * @use \"@react-md/core\" with (\n * $box-grids: (\n * small: (\n * min: 5rem,\n * ),\n * medium: (\n * min: 7rem,\n * padding: 2rem,\n * gap: 0.5rem,\n * ),\n * )\n * );\n *\n * ```\n *\n * ```tsx\n * import { Box } from \"@react-md/core\";\n * import type { ReactElement } from \"react\";\n *\n * export default function Example(): ReactElement {\n * return (\n * <Box grid gridName=\"medium\">\n * <div>Thing 1</div>\n * <div>Thing 2</div>\n * <div>Thing 3</div>\n * <div>Thing 4</div>\n * <div>Thing 5</div>\n * </Box>\n * ):\n * }\n * ```\n *\n * @since 6.0.0\n */\nexport const Box = forwardRef<HTMLDivElement, BoxProps>(\n function Box(props, ref) {\n const {\n className,\n children,\n align,\n grid = false,\n style: propStyle,\n gridName = \"\",\n justify,\n stacked = false,\n reversed = false,\n gridColumns = \"fit\",\n fullWidth = false,\n disableWrap = false,\n disablePadding = false,\n ...remaining\n } = props;\n\n let style = propStyle;\n if (typeof gridColumns === \"number\") {\n style = {\n ...propStyle,\n \"--rmd-box-columns\": gridColumns,\n };\n }\n\n return (\n <div\n {...remaining}\n style={style}\n ref={ref}\n className={box({\n className,\n fullWidth,\n grid,\n stacked,\n gridName,\n gridColumns,\n align,\n justify,\n reversed,\n disableWrap,\n disablePadding,\n })}\n >\n {children}\n </div>\n );\n }\n);\n"],"names":["forwardRef","box","Box","props","ref","className","children","align","grid","style","propStyle","gridName","justify","stacked","reversed","gridColumns","fullWidth","disableWrap","disablePadding","remaining","div"],"
|
|
1
|
+
{"version":3,"sources":["../../src/box/Box.tsx"],"sourcesContent":["import { forwardRef, type HTMLAttributes } from \"react\";\nimport { box, type BoxOptions } from \"./styles.js\";\n\n/**\n * @since 6.0.0\n */\nexport interface BoxProps extends HTMLAttributes<HTMLDivElement>, BoxOptions {}\n\n/**\n * **Server Component**\n *\n * The `Box` component is a wrapper around the CSS box model and should solve\n * most of your `flex` and `grid` layout requirements for responsive design.\n * There are pass-through props for all of the box module styling properties\n * available by default.\n *\n * @example Default Styles\n * ```scss\n * .box {\n * align-items: center;\n * display: flex;\n * flex-wrap: wrap;\n * gap: 1rem;\n * padding: 1rem;\n * }\n * ```\n *\n * ```tsx\n * import { Box } from \"@react-md/core\";\n * import type { ReactElement } from \"react\";\n *\n * export default function Example(): ReactElement {\n * return (\n * <Box>\n * <div>Thing 1</div>\n * <div>Thing 2</div>\n * <div>Thing 3</div>\n * <div>Thing 4</div>\n * <div>Thing 5</div>\n * </Box>\n * ):\n * }\n * ```\n *\n * @example Default Grid Styles\n * ```scss\n * .box {\n * align-items: center;\n * display: grid;\n * grid-gap: 1rem;\n * grid-template-columns: repeat(auto-fit, minmax(8rem, 1fr));\n * padding: 1rem;\n * }\n * ```\n *\n * ```tsx\n * import { Box } from \"@react-md/core\";\n * import type { ReactElement } from \"react\";\n *\n * export default function Example(): ReactElement {\n * return (\n * <Box grid>\n * <div>Thing 1</div>\n * <div>Thing 2</div>\n * <div>Thing 3</div>\n * <div>Thing 4</div>\n * <div>Thing 5</div>\n * </Box>\n * ):\n * }\n * ```\n *\n * @example Custom Grid\n * ```scss\n * @use \"@react-md/core\" with (\n * $box-grids: (\n * small: (\n * min: 5rem,\n * ),\n * medium: (\n * min: 7rem,\n * padding: 2rem,\n * gap: 0.5rem,\n * ),\n * )\n * );\n *\n * ```\n *\n * ```tsx\n * import { Box } from \"@react-md/core\";\n * import type { ReactElement } from \"react\";\n *\n * export default function Example(): ReactElement {\n * return (\n * <Box grid gridName=\"medium\">\n * <div>Thing 1</div>\n * <div>Thing 2</div>\n * <div>Thing 3</div>\n * <div>Thing 4</div>\n * <div>Thing 5</div>\n * </Box>\n * ):\n * }\n * ```\n *\n * @since 6.0.0\n */\nexport const Box = forwardRef<HTMLDivElement, BoxProps>(\n function Box(props, ref) {\n const {\n className,\n children,\n align,\n grid = false,\n style: propStyle,\n gridName = \"\",\n justify,\n stacked = false,\n reversed = false,\n gridColumns = \"fit\",\n fullWidth = false,\n disableWrap = false,\n disablePadding = false,\n ...remaining\n } = props;\n\n let style = propStyle;\n if (typeof gridColumns === \"number\") {\n style = {\n ...propStyle,\n \"--rmd-box-columns\": gridColumns,\n };\n }\n\n return (\n <div\n {...remaining}\n style={style}\n ref={ref}\n className={box({\n className,\n fullWidth,\n grid,\n stacked,\n gridName,\n gridColumns,\n align,\n justify,\n reversed,\n disableWrap,\n disablePadding,\n })}\n >\n {children}\n </div>\n );\n }\n);\n"],"names":["forwardRef","box","Box","props","ref","className","children","align","grid","style","propStyle","gridName","justify","stacked","reversed","gridColumns","fullWidth","disableWrap","disablePadding","remaining","div"],"mappings":";AAAA,SAASA,UAAU,QAA6B,QAAQ;AACxD,SAASC,GAAG,QAAyB,cAAc;AAOnD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAmGC,GACD,OAAO,MAAMC,oBAAMF,WACjB,SAASE,IAAIC,KAAK,EAAEC,GAAG;IACrB,MAAM,EACJC,SAAS,EACTC,QAAQ,EACRC,KAAK,EACLC,OAAO,KAAK,EACZC,OAAOC,SAAS,EAChBC,WAAW,EAAE,EACbC,OAAO,EACPC,UAAU,KAAK,EACfC,WAAW,KAAK,EAChBC,cAAc,KAAK,EACnBC,YAAY,KAAK,EACjBC,cAAc,KAAK,EACnBC,iBAAiB,KAAK,EACtB,GAAGC,WACJ,GAAGhB;IAEJ,IAAIM,QAAQC;IACZ,IAAI,OAAOK,gBAAgB,UAAU;QACnCN,QAAQ;YACN,GAAGC,SAAS;YACZ,qBAAqBK;QACvB;IACF;IAEA,qBACE,KAACK;QACE,GAAGD,SAAS;QACbV,OAAOA;QACPL,KAAKA;QACLC,WAAWJ,IAAI;YACbI;YACAW;YACAR;YACAK;YACAF;YACAI;YACAR;YACAK;YACAE;YACAG;YACAC;QACF;kBAECZ;;AAGP,GACA"}
|
package/dist/box/styles.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/box/styles.ts"],"sourcesContent":["import { cnb } from \"cnbuilder\";\nimport { bem } from \"../utils/bem.js\";\n\nconst styles = bem(\"rmd-box\");\n\ndeclare module \"react\" {\n interface CSSProperties {\n \"--rmd-box-gap\"?: string | number;\n \"--rmd-box-padding\"?: string | number;\n \"--rmd-box-item-min-size\"?: string | number;\n \"--rmd-box-columns\"?: string | number;\n }\n}\n\n/**\n * @since 6.0.0\n */\nexport type BoxAlignItems =\n | \"start\"\n | \"flex-start\"\n | \"center\"\n | \"end\"\n | \"flex-end\"\n | \"stretch\";\n\n/**\n * @since 6.0.0\n */\nexport type BoxJustifyContent =\n | BoxAlignItems\n | \"space-around\"\n | \"space-between\"\n | \"space-evenly\";\n\n/**\n * @since 6.0.0\n */\nexport type BoxFlexDirection = \"row\" | \"column\";\n\n/**\n * @since 6.0.0\n */\nexport interface BoxOptions {\n className?: string;\n\n /**\n * Set this to `true` to use `display: grid` instead of `display: flex`.\n *\n * @defaultValue `false`\n */\n grid?: boolean;\n\n /**\n * Set this to `true` to apply `width: 100%`. This can be useful when using\n * nested box layouts.\n *\n * @defaultValue `false`\n */\n fullWidth?: boolean;\n\n /**\n * Set this to `true` to set `flex-wrap: nowrap`.\n *\n * @defaultValue `false`\n */\n disableWrap?: boolean;\n\n /**\n * Set this to `true` to disable the default padding.\n *\n * @defaultValue `false`\n */\n disablePadding?: boolean;\n\n /**\n * This should match one of the names in the `$box-grids` map. So for example:\n *\n * ```scss\n * @use \"react-md\" with (\n * $box-grids: (\n * small: (\n * min: 5rem\n * ),\n * medium: (\n * min: 7rem,\n * gap: 0.5rem,\n * padding: 2rem,\n * ),\n * ),\n * );\n * ```\n *\n * The `gridName` should be `\"small\" | \"medium\"`.\n *\n * @defaultValue `\"\"`\n */\n gridName?: string;\n\n /**\n * @defaultValue `\"fit\"`\n */\n gridColumns?: \"fit\" | \"fill\" | number;\n\n /**\n * @defaultValue `\"\"`\n */\n align?: BoxAlignItems;\n\n /**\n * The default value is really `center` or whatever the\n * `$box-default-align-items` is set to.\n *\n * @defaultValue `\"\"`\n */\n justify?: BoxJustifyContent;\n\n /**\n * Set this to `true` to set `flex-direction: column` which will stack all\n * items in the box.\n *\n * @defaultValue `false`\n */\n stacked?: boolean;\n\n /**\n * Set this to `true` to reverse the `flex-direction`. i.e.\n * - `flex-direction: row-reverse`\n * - `flex-direction: column-reverse`\n *\n * @defaultValue `false`\n */\n reversed?: boolean;\n}\n\n/**\n * @since 6.0.0\n */\nexport function box(options: BoxOptions = {}): string {\n const {\n className,\n align = \"\",\n grid = false,\n gridName = \"\",\n gridColumns = \"fit\",\n justify = \"\",\n stacked = false,\n reversed,\n fullWidth = false,\n disableWrap = false,\n disablePadding = false,\n } = options;\n\n return cnb(\n styles({\n wrap: !disableWrap,\n padded: !disablePadding,\n column: stacked && !reversed,\n reverse: !stacked && reversed,\n \"column-reverse\": stacked && reversed,\n \"full-width\": fullWidth,\n grid,\n \"grid-fill\": gridColumns === \"fill\",\n \"grid-columns\": typeof gridColumns === \"number\",\n [gridName]: grid && gridName,\n \"align-start\": align === \"start\" || align === \"flex-start\",\n \"align-center\": align === \"center\",\n \"align-end\": align === \"end\" || align === \"flex-end\",\n \"align-stretch\": align === \"stretch\",\n \"justify-center\": justify === \"center\",\n \"justify-start\": justify === \"start\" || justify === \"flex-start\",\n \"justify-end\": justify === \"end\" || justify === \"flex-end\",\n \"justify-stretch\": justify === \"stretch\",\n \"justify-around\": justify === \"space-around\",\n \"justify-between\": justify === \"space-between\",\n \"justify-evenly\": justify === \"space-evenly\",\n }),\n className\n );\n}\n"],"names":["cnb","bem","styles","box","options","className","align","grid","gridName","gridColumns","justify","stacked","reversed","fullWidth","disableWrap","disablePadding","wrap","padded","column","reverse"],"
|
|
1
|
+
{"version":3,"sources":["../../src/box/styles.ts"],"sourcesContent":["import { cnb } from \"cnbuilder\";\nimport { bem } from \"../utils/bem.js\";\n\nconst styles = bem(\"rmd-box\");\n\ndeclare module \"react\" {\n interface CSSProperties {\n \"--rmd-box-gap\"?: string | number;\n \"--rmd-box-padding\"?: string | number;\n \"--rmd-box-item-min-size\"?: string | number;\n \"--rmd-box-columns\"?: string | number;\n }\n}\n\n/**\n * @since 6.0.0\n */\nexport type BoxAlignItems =\n | \"start\"\n | \"flex-start\"\n | \"center\"\n | \"end\"\n | \"flex-end\"\n | \"stretch\";\n\n/**\n * @since 6.0.0\n */\nexport type BoxJustifyContent =\n | BoxAlignItems\n | \"space-around\"\n | \"space-between\"\n | \"space-evenly\";\n\n/**\n * @since 6.0.0\n */\nexport type BoxFlexDirection = \"row\" | \"column\";\n\n/**\n * @since 6.0.0\n */\nexport interface BoxOptions {\n className?: string;\n\n /**\n * Set this to `true` to use `display: grid` instead of `display: flex`.\n *\n * @defaultValue `false`\n */\n grid?: boolean;\n\n /**\n * Set this to `true` to apply `width: 100%`. This can be useful when using\n * nested box layouts.\n *\n * @defaultValue `false`\n */\n fullWidth?: boolean;\n\n /**\n * Set this to `true` to set `flex-wrap: nowrap`.\n *\n * @defaultValue `false`\n */\n disableWrap?: boolean;\n\n /**\n * Set this to `true` to disable the default padding.\n *\n * @defaultValue `false`\n */\n disablePadding?: boolean;\n\n /**\n * This should match one of the names in the `$box-grids` map. So for example:\n *\n * ```scss\n * @use \"react-md\" with (\n * $box-grids: (\n * small: (\n * min: 5rem\n * ),\n * medium: (\n * min: 7rem,\n * gap: 0.5rem,\n * padding: 2rem,\n * ),\n * ),\n * );\n * ```\n *\n * The `gridName` should be `\"small\" | \"medium\"`.\n *\n * @defaultValue `\"\"`\n */\n gridName?: string;\n\n /**\n * @defaultValue `\"fit\"`\n */\n gridColumns?: \"fit\" | \"fill\" | number;\n\n /**\n * @defaultValue `\"\"`\n */\n align?: BoxAlignItems;\n\n /**\n * The default value is really `center` or whatever the\n * `$box-default-align-items` is set to.\n *\n * @defaultValue `\"\"`\n */\n justify?: BoxJustifyContent;\n\n /**\n * Set this to `true` to set `flex-direction: column` which will stack all\n * items in the box.\n *\n * @defaultValue `false`\n */\n stacked?: boolean;\n\n /**\n * Set this to `true` to reverse the `flex-direction`. i.e.\n * - `flex-direction: row-reverse`\n * - `flex-direction: column-reverse`\n *\n * @defaultValue `false`\n */\n reversed?: boolean;\n}\n\n/**\n * @since 6.0.0\n */\nexport function box(options: BoxOptions = {}): string {\n const {\n className,\n align = \"\",\n grid = false,\n gridName = \"\",\n gridColumns = \"fit\",\n justify = \"\",\n stacked = false,\n reversed,\n fullWidth = false,\n disableWrap = false,\n disablePadding = false,\n } = options;\n\n return cnb(\n styles({\n wrap: !disableWrap,\n padded: !disablePadding,\n column: stacked && !reversed,\n reverse: !stacked && reversed,\n \"column-reverse\": stacked && reversed,\n \"full-width\": fullWidth,\n grid,\n \"grid-fill\": gridColumns === \"fill\",\n \"grid-columns\": typeof gridColumns === \"number\",\n [gridName]: grid && gridName,\n \"align-start\": align === \"start\" || align === \"flex-start\",\n \"align-center\": align === \"center\",\n \"align-end\": align === \"end\" || align === \"flex-end\",\n \"align-stretch\": align === \"stretch\",\n \"justify-center\": justify === \"center\",\n \"justify-start\": justify === \"start\" || justify === \"flex-start\",\n \"justify-end\": justify === \"end\" || justify === \"flex-end\",\n \"justify-stretch\": justify === \"stretch\",\n \"justify-around\": justify === \"space-around\",\n \"justify-between\": justify === \"space-between\",\n \"justify-evenly\": justify === \"space-evenly\",\n }),\n className\n );\n}\n"],"names":["cnb","bem","styles","box","options","className","align","grid","gridName","gridColumns","justify","stacked","reversed","fullWidth","disableWrap","disablePadding","wrap","padded","column","reverse"],"mappings":"AAAA,SAASA,GAAG,QAAQ,YAAY;AAChC,SAASC,GAAG,QAAQ,kBAAkB;AAEtC,MAAMC,SAASD,IAAI;AAmInB;;CAEC,GACD,OAAO,SAASE,IAAIC,UAAsB,CAAC,CAAC;IAC1C,MAAM,EACJC,SAAS,EACTC,QAAQ,EAAE,EACVC,OAAO,KAAK,EACZC,WAAW,EAAE,EACbC,cAAc,KAAK,EACnBC,UAAU,EAAE,EACZC,UAAU,KAAK,EACfC,QAAQ,EACRC,YAAY,KAAK,EACjBC,cAAc,KAAK,EACnBC,iBAAiB,KAAK,EACvB,GAAGX;IAEJ,OAAOJ,IACLE,OAAO;QACLc,MAAM,CAACF;QACPG,QAAQ,CAACF;QACTG,QAAQP,WAAW,CAACC;QACpBO,SAAS,CAACR,WAAWC;QACrB,kBAAkBD,WAAWC;QAC7B,cAAcC;QACdN;QACA,aAAaE,gBAAgB;QAC7B,gBAAgB,OAAOA,gBAAgB;QACvC,CAACD,SAAS,EAAED,QAAQC;QACpB,eAAeF,UAAU,WAAWA,UAAU;QAC9C,gBAAgBA,UAAU;QAC1B,aAAaA,UAAU,SAASA,UAAU;QAC1C,iBAAiBA,UAAU;QAC3B,kBAAkBI,YAAY;QAC9B,iBAAiBA,YAAY,WAAWA,YAAY;QACpD,eAAeA,YAAY,SAASA,YAAY;QAChD,mBAAmBA,YAAY;QAC/B,kBAAkBA,YAAY;QAC9B,mBAAmBA,YAAY;QAC/B,kBAAkBA,YAAY;IAChC,IACAL;AAEJ"}
|