@lumx/react 3.20.1-alpha.20 → 3.20.1-alpha.21
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/_internal/Falsy.d.ts +7 -0
- package/_internal/index.js +236 -0
- package/_internal/index.js.map +1 -0
- package/index.d.ts +352 -7
- package/index.js +14486 -65
- package/index.js.map +1 -1
- package/package.json +11 -4
- package/src/components/alert-dialog/AlertDialog.stories.tsx +127 -0
- package/src/components/alert-dialog/AlertDialog.test.tsx +34 -0
- package/src/components/alert-dialog/AlertDialog.tsx +189 -0
- package/src/components/alert-dialog/index.ts +1 -0
- package/src/components/autocomplete/Autocomplete.stories.tsx +75 -0
- package/src/components/autocomplete/Autocomplete.test.tsx +99 -0
- package/src/components/autocomplete/Autocomplete.tsx +294 -0
- package/src/components/autocomplete/AutocompleteMultiple.stories.tsx +167 -0
- package/src/components/autocomplete/AutocompleteMultiple.test.tsx +61 -0
- package/src/components/autocomplete/AutocompleteMultiple.tsx +156 -0
- package/src/components/autocomplete/__mockData__/index.ts +39 -0
- package/src/components/autocomplete/index.ts +2 -0
- package/src/components/avatar/Avatar.stories.tsx +119 -0
- package/src/components/avatar/Avatar.test.tsx +32 -0
- package/src/components/avatar/Avatar.tsx +114 -0
- package/src/components/avatar/index.ts +1 -0
- package/src/components/badge/Badge.stories.tsx +69 -0
- package/src/components/badge/Badge.test.tsx +45 -0
- package/src/components/badge/Badge.tsx +58 -0
- package/src/components/badge/BadgeWrapper.stories.tsx +75 -0
- package/src/components/badge/BadgeWrapper.test.tsx +47 -0
- package/src/components/badge/BadgeWrapper.tsx +37 -0
- package/src/components/badge/index.ts +2 -0
- package/src/components/button/Button.stories.tsx +355 -0
- package/src/components/button/Button.test.tsx +125 -0
- package/src/components/button/Button.tsx +101 -0
- package/src/components/button/ButtonGroup.stories.tsx +52 -0
- package/src/components/button/ButtonGroup.test.tsx +41 -0
- package/src/components/button/ButtonGroup.tsx +50 -0
- package/src/components/button/ButtonRoot.tsx +163 -0
- package/src/components/button/IconButton.stories.tsx +52 -0
- package/src/components/button/IconButton.test.tsx +66 -0
- package/src/components/button/IconButton.tsx +91 -0
- package/src/components/button/index.ts +4 -0
- package/src/components/checkbox/Checkbox.stories.tsx +64 -0
- package/src/components/checkbox/Checkbox.test.tsx +154 -0
- package/src/components/checkbox/Checkbox.tsx +164 -0
- package/src/components/checkbox/index.ts +1 -0
- package/src/components/chip/Chip.stories.tsx +164 -0
- package/src/components/chip/Chip.test.tsx +243 -0
- package/src/components/chip/Chip.tsx +168 -0
- package/src/components/chip/ChipGroup.stories.tsx +47 -0
- package/src/components/chip/ChipGroup.test.tsx +37 -0
- package/src/components/chip/ChipGroup.tsx +60 -0
- package/src/components/chip/index.ts +2 -0
- package/src/components/comment-block/CommentBlock.stories.tsx +91 -0
- package/src/components/comment-block/CommentBlock.test.tsx +28 -0
- package/src/components/comment-block/CommentBlock.tsx +172 -0
- package/src/components/comment-block/index.ts +1 -0
- package/src/components/date-picker/DatePicker.stories.tsx +118 -0
- package/src/components/date-picker/DatePicker.test.tsx +34 -0
- package/src/components/date-picker/DatePicker.tsx +52 -0
- package/src/components/date-picker/DatePickerControlled.test.tsx +91 -0
- package/src/components/date-picker/DatePickerControlled.tsx +259 -0
- package/src/components/date-picker/DatePickerField.stories.tsx +100 -0
- package/src/components/date-picker/DatePickerField.test.tsx +70 -0
- package/src/components/date-picker/DatePickerField.tsx +135 -0
- package/src/components/date-picker/constants.ts +11 -0
- package/src/components/date-picker/index.ts +4 -0
- package/src/components/date-picker/types.ts +28 -0
- package/src/components/dialog/Dialog.stories.tsx +318 -0
- package/src/components/dialog/Dialog.test.tsx +97 -0
- package/src/components/dialog/Dialog.tsx +288 -0
- package/src/components/dialog/index.ts +1 -0
- package/src/components/divider/Divider.test.tsx +51 -0
- package/src/components/divider/Divider.tsx +50 -0
- package/src/components/divider/index.ts +1 -0
- package/src/components/drag-handle/DragHandle.test.tsx +36 -0
- package/src/components/drag-handle/DragHandle.tsx +51 -0
- package/src/components/drag-handle/index.ts +1 -0
- package/src/components/dropdown/Dropdown.stories.tsx +31 -0
- package/src/components/dropdown/Dropdown.test.tsx +66 -0
- package/src/components/dropdown/Dropdown.tsx +186 -0
- package/src/components/dropdown/index.ts +1 -0
- package/src/components/expansion-panel/ExpansionPanel.stories.tsx +91 -0
- package/src/components/expansion-panel/ExpansionPanel.test.tsx +185 -0
- package/src/components/expansion-panel/ExpansionPanel.tsx +195 -0
- package/src/components/expansion-panel/index.ts +1 -0
- package/src/components/flag/Flag.stories.tsx +48 -0
- package/src/components/flag/Flag.test.tsx +62 -0
- package/src/components/flag/Flag.tsx +52 -0
- package/src/components/flag/index.ts +1 -0
- package/src/components/flex-box/FlexBox.stories.tsx +156 -0
- package/src/components/flex-box/FlexBox.test.tsx +24 -0
- package/src/components/flex-box/FlexBox.tsx +100 -0
- package/src/components/flex-box/index.ts +1 -0
- package/src/components/generic-block/GenericBlock.stories.jsx +128 -0
- package/src/components/generic-block/GenericBlock.test.tsx +156 -0
- package/src/components/generic-block/GenericBlock.tsx +225 -0
- package/src/components/generic-block/constants.ts +9 -0
- package/src/components/generic-block/index.ts +2 -0
- package/src/components/grid/Grid.tsx +83 -0
- package/src/components/grid/GridItem.tsx +55 -0
- package/src/components/grid/index.ts +2 -0
- package/src/components/grid-column/GridColumn.stories.tsx +45 -0
- package/src/components/grid-column/GridColumn.test.jsx +56 -0
- package/src/components/grid-column/GridColumn.tsx +83 -0
- package/src/components/grid-column/index.ts +1 -0
- package/src/components/heading/Heading.stories.tsx +69 -0
- package/src/components/heading/Heading.test.tsx +82 -0
- package/src/components/heading/Heading.tsx +65 -0
- package/src/components/heading/HeadingLevelProvider.tsx +30 -0
- package/src/components/heading/constants.ts +16 -0
- package/src/components/heading/context.tsx +13 -0
- package/src/components/heading/index.ts +3 -0
- package/src/components/heading/useHeadingLevel.tsx +8 -0
- package/src/components/icon/Icon.stories.tsx +73 -0
- package/src/components/icon/Icon.test.tsx +125 -0
- package/src/components/icon/Icon.tsx +133 -0
- package/src/components/icon/index.ts +1 -0
- package/src/components/image-block/ImageBlock.stories.tsx +117 -0
- package/src/components/image-block/ImageBlock.test.tsx +58 -0
- package/src/components/image-block/ImageBlock.tsx +142 -0
- package/src/components/image-block/ImageCaption.tsx +115 -0
- package/src/components/image-block/index.ts +1 -0
- package/src/components/image-lightbox/ImageLightbox.stories.tsx +160 -0
- package/src/components/image-lightbox/ImageLightbox.test.tsx +254 -0
- package/src/components/image-lightbox/ImageLightbox.tsx +90 -0
- package/src/components/image-lightbox/constants.ts +11 -0
- package/src/components/image-lightbox/index.ts +2 -0
- package/src/components/image-lightbox/internal/ImageSlide.tsx +107 -0
- package/src/components/image-lightbox/internal/ImageSlideshow.tsx +164 -0
- package/src/components/image-lightbox/internal/useAnimateScroll.ts +55 -0
- package/src/components/image-lightbox/internal/usePointerZoom.ts +148 -0
- package/src/components/image-lightbox/types.ts +48 -0
- package/src/components/image-lightbox/useImageLightbox.tsx +141 -0
- package/src/components/inline-list/InlineList.stories.tsx +77 -0
- package/src/components/inline-list/InlineList.test.tsx +52 -0
- package/src/components/inline-list/InlineList.tsx +96 -0
- package/src/components/inline-list/index.ts +1 -0
- package/src/components/input-helper/InputHelper.stories.tsx +35 -0
- package/src/components/input-helper/InputHelper.test.tsx +55 -0
- package/src/components/input-helper/InputHelper.tsx +65 -0
- package/src/components/input-helper/constants.ts +11 -0
- package/src/components/input-helper/index.ts +1 -0
- package/src/components/input-label/InputLabel.stories.tsx +45 -0
- package/src/components/input-label/InputLabel.test.tsx +59 -0
- package/src/components/input-label/InputLabel.tsx +69 -0
- package/src/components/input-label/index.ts +1 -0
- package/src/components/lightbox/Lightbox.stories.tsx +101 -0
- package/src/components/lightbox/Lightbox.test.tsx +53 -0
- package/src/components/lightbox/Lightbox.tsx +180 -0
- package/src/components/lightbox/index.ts +1 -0
- package/src/components/link/Link.stories.tsx +195 -0
- package/src/components/link/Link.test.tsx +127 -0
- package/src/components/link/Link.tsx +106 -0
- package/src/components/link/index.ts +1 -0
- package/src/components/link-preview/LinkPreview.stories.tsx +61 -0
- package/src/components/link-preview/LinkPreview.test.tsx +105 -0
- package/src/components/link-preview/LinkPreview.tsx +158 -0
- package/src/components/link-preview/index.ts +1 -0
- package/src/components/list/List.stories.tsx +116 -0
- package/src/components/list/List.test.tsx +18 -0
- package/src/components/list/List.tsx +104 -0
- package/src/components/list/ListDivider.stories.tsx +12 -0
- package/src/components/list/ListDivider.test.tsx +22 -0
- package/src/components/list/ListDivider.tsx +35 -0
- package/src/components/list/ListItem.stories.tsx +66 -0
- package/src/components/list/ListItem.test.tsx +93 -0
- package/src/components/list/ListItem.tsx +157 -0
- package/src/components/list/ListSubheader.stories.tsx +11 -0
- package/src/components/list/ListSubheader.test.tsx +21 -0
- package/src/components/list/ListSubheader.tsx +44 -0
- package/src/components/list/index.ts +4 -0
- package/src/components/list/useInteractiveList.tsx +202 -0
- package/src/components/message/Message.stories.tsx +72 -0
- package/src/components/message/Message.test.tsx +76 -0
- package/src/components/message/Message.tsx +100 -0
- package/src/components/message/index.ts +1 -0
- package/src/components/mosaic/Mosaic.stories.tsx +89 -0
- package/src/components/mosaic/Mosaic.test.tsx +77 -0
- package/src/components/mosaic/Mosaic.tsx +98 -0
- package/src/components/mosaic/index.ts +1 -0
- package/src/components/navigation/Navigation.stories.tsx +234 -0
- package/src/components/navigation/Navigation.test.tsx +65 -0
- package/src/components/navigation/Navigation.tsx +79 -0
- package/src/components/navigation/NavigationItem.test.tsx +35 -0
- package/src/components/navigation/NavigationItem.tsx +82 -0
- package/src/components/navigation/NavigationSection.test.tsx +137 -0
- package/src/components/navigation/NavigationSection.tsx +108 -0
- package/src/components/navigation/context.tsx +7 -0
- package/src/components/navigation/index.ts +1 -0
- package/src/components/notification/Notification.test.tsx +94 -0
- package/src/components/notification/Notification.tsx +138 -0
- package/src/components/notification/Notifications.stories.tsx +92 -0
- package/src/components/notification/constants.ts +28 -0
- package/src/components/notification/index.ts +1 -0
- package/src/components/popover/Popover.stories.tsx +264 -0
- package/src/components/popover/Popover.test.tsx +62 -0
- package/src/components/popover/Popover.tsx +201 -0
- package/src/components/popover/constants.ts +62 -0
- package/src/components/popover/index.ts +3 -0
- package/src/components/popover/usePopoverStyle.tsx +184 -0
- package/src/components/popover/useRestoreFocusOnClose.tsx +47 -0
- package/src/components/popover-dialog/PopoverDialog.stories.tsx +64 -0
- package/src/components/popover-dialog/PopoverDialog.test.tsx +139 -0
- package/src/components/popover-dialog/PopoverDialog.tsx +74 -0
- package/src/components/popover-dialog/index.tsx +1 -0
- package/src/components/post-block/PostBlock.test.tsx +27 -0
- package/src/components/post-block/PostBlock.tsx +122 -0
- package/src/components/post-block/index.ts +1 -0
- package/src/components/progress/Progress.tsx +68 -0
- package/src/components/progress/ProgressCircular.stories.tsx +43 -0
- package/src/components/progress/ProgressCircular.test.tsx +46 -0
- package/src/components/progress/ProgressCircular.tsx +82 -0
- package/src/components/progress/ProgressLinear.stories.tsx +12 -0
- package/src/components/progress/ProgressLinear.test.tsx +30 -0
- package/src/components/progress/ProgressLinear.tsx +50 -0
- package/src/components/progress/index.ts +3 -0
- package/src/components/progress-tracker/ProgressTracker.stories.tsx +145 -0
- package/src/components/progress-tracker/ProgressTracker.test.tsx +42 -0
- package/src/components/progress-tracker/ProgressTracker.tsx +87 -0
- package/src/components/progress-tracker/ProgressTrackerProvider.test.tsx +65 -0
- package/src/components/progress-tracker/ProgressTrackerProvider.tsx +67 -0
- package/src/components/progress-tracker/ProgressTrackerStep.test.tsx +36 -0
- package/src/components/progress-tracker/ProgressTrackerStep.tsx +159 -0
- package/src/components/progress-tracker/ProgressTrackerStepPanel.test.tsx +34 -0
- package/src/components/progress-tracker/ProgressTrackerStepPanel.tsx +67 -0
- package/src/components/progress-tracker/index.ts +4 -0
- package/src/components/radio-button/RadioButton.stories.tsx +71 -0
- package/src/components/radio-button/RadioButton.test.tsx +143 -0
- package/src/components/radio-button/RadioButton.tsx +143 -0
- package/src/components/radio-button/RadioGroup.stories.tsx +39 -0
- package/src/components/radio-button/RadioGroup.test.tsx +29 -0
- package/src/components/radio-button/RadioGroup.tsx +44 -0
- package/src/components/radio-button/index.ts +2 -0
- package/src/components/select/Select.stories.tsx +385 -0
- package/src/components/select/Select.test.tsx +199 -0
- package/src/components/select/Select.tsx +199 -0
- package/src/components/select/SelectMultiple.stories.tsx +315 -0
- package/src/components/select/SelectMultiple.test.tsx +213 -0
- package/src/components/select/SelectMultiple.tsx +206 -0
- package/src/components/select/WithSelectContext.tsx +147 -0
- package/src/components/select/constants.ts +55 -0
- package/src/components/select/index.ts +2 -0
- package/src/components/side-navigation/SideNavigation.stories.tsx +191 -0
- package/src/components/side-navigation/SideNavigation.test.tsx +37 -0
- package/src/components/side-navigation/SideNavigation.tsx +52 -0
- package/src/components/side-navigation/SideNavigationItem.stories.tsx +133 -0
- package/src/components/side-navigation/SideNavigationItem.test.tsx +136 -0
- package/src/components/side-navigation/SideNavigationItem.tsx +165 -0
- package/src/components/side-navigation/index.ts +2 -0
- package/src/components/skeleton/SkeletonCircle.stories.tsx +41 -0
- package/src/components/skeleton/SkeletonCircle.test.tsx +27 -0
- package/src/components/skeleton/SkeletonCircle.tsx +52 -0
- package/src/components/skeleton/SkeletonRectangle.stories.tsx +82 -0
- package/src/components/skeleton/SkeletonRectangle.test.tsx +27 -0
- package/src/components/skeleton/SkeletonRectangle.tsx +88 -0
- package/src/components/skeleton/SkeletonTypography.stories.tsx +19 -0
- package/src/components/skeleton/SkeletonTypography.test.tsx +27 -0
- package/src/components/skeleton/SkeletonTypography.tsx +59 -0
- package/src/components/skeleton/index.ts +3 -0
- package/src/components/slider/Slider.stories.tsx +45 -0
- package/src/components/slider/Slider.test.tsx +29 -0
- package/src/components/slider/Slider.tsx +299 -0
- package/src/components/slider/index.ts +2 -0
- package/src/components/slideshow/Slides.tsx +130 -0
- package/src/components/slideshow/Slideshow.stories.tsx +179 -0
- package/src/components/slideshow/Slideshow.test.tsx +35 -0
- package/src/components/slideshow/Slideshow.tsx +173 -0
- package/src/components/slideshow/SlideshowControls.stories.tsx +100 -0
- package/src/components/slideshow/SlideshowControls.tsx +243 -0
- package/src/components/slideshow/SlideshowItem.tsx +44 -0
- package/src/components/slideshow/SlideshowItemGroup.tsx +60 -0
- package/src/components/slideshow/constants.ts +24 -0
- package/src/components/slideshow/index.ts +4 -0
- package/src/components/slideshow/useKeyNavigate.ts +28 -0
- package/src/components/slideshow/usePaginationVisibleRange.ts +37 -0
- package/src/components/slideshow/useSlideFocusManagement.tsx +92 -0
- package/src/components/slideshow/useSwipeNavigate.ts +18 -0
- package/src/components/switch/Switch.stories.tsx +49 -0
- package/src/components/switch/Switch.test.tsx +144 -0
- package/src/components/switch/Switch.tsx +145 -0
- package/src/components/switch/index.ts +1 -0
- package/src/components/table/Table.test.tsx +29 -0
- package/src/components/table/Table.tsx +59 -0
- package/src/components/table/TableBody.test.tsx +30 -0
- package/src/components/table/TableBody.tsx +42 -0
- package/src/components/table/TableCell.test.tsx +72 -0
- package/src/components/table/TableCell.tsx +130 -0
- package/src/components/table/TableHeader.test.tsx +30 -0
- package/src/components/table/TableHeader.tsx +48 -0
- package/src/components/table/TableRow.test.tsx +40 -0
- package/src/components/table/TableRow.tsx +71 -0
- package/src/components/table/index.ts +5 -0
- package/src/components/tabs/Tab.test.tsx +50 -0
- package/src/components/tabs/Tab.tsx +133 -0
- package/src/components/tabs/TabList.test.tsx +49 -0
- package/src/components/tabs/TabList.tsx +94 -0
- package/src/components/tabs/TabPanel.test.tsx +37 -0
- package/src/components/tabs/TabPanel.tsx +67 -0
- package/src/components/tabs/TabProvider.test.tsx +161 -0
- package/src/components/tabs/TabProvider.tsx +67 -0
- package/src/components/tabs/Tabs.stories.tsx +170 -0
- package/src/components/tabs/index.ts +4 -0
- package/src/components/tabs/state.ts +114 -0
- package/src/components/tabs/test-utils.ts +39 -0
- package/src/components/text/Text.stories.tsx +177 -0
- package/src/components/text/Text.test.tsx +92 -0
- package/src/components/text/Text.tsx +139 -0
- package/src/components/text/index.ts +1 -0
- package/src/components/text-field/TextField.stories.tsx +180 -0
- package/src/components/text-field/TextField.test.tsx +298 -0
- package/src/components/text-field/TextField.tsx +493 -0
- package/src/components/text-field/index.ts +1 -0
- package/src/components/thumbnail/Thumbnail.stories.tsx +448 -0
- package/src/components/thumbnail/Thumbnail.test.tsx +88 -0
- package/src/components/thumbnail/Thumbnail.tsx +248 -0
- package/src/components/thumbnail/index.ts +3 -0
- package/src/components/thumbnail/types.ts +48 -0
- package/src/components/thumbnail/useFocusPointStyle.test.ts +92 -0
- package/src/components/thumbnail/useFocusPointStyle.tsx +107 -0
- package/src/components/thumbnail/useImageLoad.ts +40 -0
- package/src/components/toolbar/Toolbar.tsx +68 -0
- package/src/components/toolbar/index.ts +1 -0
- package/src/components/tooltip/Tooltip.stories.tsx +118 -0
- package/src/components/tooltip/Tooltip.test.tsx +417 -0
- package/src/components/tooltip/Tooltip.tsx +165 -0
- package/src/components/tooltip/constants.ts +8 -0
- package/src/components/tooltip/context.tsx +17 -0
- package/src/components/tooltip/index.ts +1 -0
- package/src/components/tooltip/useInjectTooltipRef.tsx +55 -0
- package/src/components/tooltip/useTooltipOpen.tsx +143 -0
- package/src/components/uploader/Uploader.stories.tsx +109 -0
- package/src/components/uploader/Uploader.test.tsx +146 -0
- package/src/components/uploader/Uploader.tsx +177 -0
- package/src/components/uploader/index.ts +1 -0
- package/src/components/user-block/UserBlock.stories.tsx +133 -0
- package/src/components/user-block/UserBlock.test.tsx +106 -0
- package/src/components/user-block/UserBlock.tsx +193 -0
- package/src/components/user-block/index.ts +1 -0
- package/src/constants.ts +27 -0
- package/src/hooks/useBooleanState.tsx +13 -0
- package/src/hooks/useCallbackOnEscape.ts +34 -0
- package/src/hooks/useChipGroupNavigation.tsx +75 -0
- package/src/hooks/useClickAway.tsx +48 -0
- package/src/hooks/useDisableBodyScroll.ts +28 -0
- package/src/hooks/useEventCallback.tsx +17 -0
- package/src/hooks/useFocus.tsx +21 -0
- package/src/hooks/useFocusTrap.ts +93 -0
- package/src/hooks/useFocusWithin.ts +33 -0
- package/src/hooks/useId.test.tsx +22 -0
- package/src/hooks/useId.ts +15 -0
- package/src/hooks/useImageSize.ts +17 -0
- package/src/hooks/useInfiniteScroll.tsx +60 -0
- package/src/hooks/useIntersectionObserver.tsx +43 -0
- package/src/hooks/useInterval.tsx +31 -0
- package/src/hooks/useKeyboardListNavigation.tsx +204 -0
- package/src/hooks/useListenFocus.tsx +26 -0
- package/src/hooks/useOverflowTooltipLabel.tsx +32 -0
- package/src/hooks/usePopper.ts +12 -0
- package/src/hooks/usePreviousValue.ts +12 -0
- package/src/hooks/useRovingTabIndex.tsx +90 -0
- package/src/hooks/useSizeOnWindowResize.ts +30 -0
- package/src/hooks/useSlideshowControls.ts +246 -0
- package/src/hooks/useStopPropagation.ts +21 -0
- package/src/hooks/useTransitionVisibility.ts +48 -0
- package/src/index.ts +63 -0
- package/src/stories/controls/color.ts +7 -0
- package/src/stories/controls/element.ts +6 -0
- package/src/stories/controls/focusPoint.ts +1 -0
- package/src/stories/controls/icons.ts +126 -0
- package/src/stories/controls/image.ts +84 -0
- package/src/stories/controls/selectArgType.ts +8 -0
- package/src/stories/controls/theme.ts +3 -0
- package/src/stories/controls/typography.ts +5 -0
- package/src/stories/controls/withUndefined.ts +1 -0
- package/src/stories/decorators/withChromaticForceScreenSize.tsx +7 -0
- package/src/stories/decorators/withCombinations.tsx +132 -0
- package/src/stories/decorators/withNestedProps.tsx +22 -0
- package/src/stories/decorators/withResizableBox.tsx +21 -0
- package/src/stories/decorators/withThemedBackground.tsx +16 -0
- package/src/stories/decorators/withValueOnChange.tsx +18 -0
- package/src/stories/decorators/withWrapper.tsx +19 -0
- package/src/stories/generated/Autocomplete/Demos.stories.tsx +7 -0
- package/src/stories/generated/Avatar/Demos.stories.tsx +7 -0
- package/src/stories/generated/Badge/Demos.stories.tsx +9 -0
- package/src/stories/generated/Button/Demos.stories.tsx +11 -0
- package/src/stories/generated/Checkbox/Demos.stories.tsx +6 -0
- package/src/stories/generated/Chip/Demos.stories.tsx +11 -0
- package/src/stories/generated/CommentBlock/Demos.stories.tsx +8 -0
- package/src/stories/generated/DatePicker/Demos.stories.tsx +8 -0
- package/src/stories/generated/Dialog/Demos.stories.tsx +10 -0
- package/src/stories/generated/Divider/Demos.stories.tsx +6 -0
- package/src/stories/generated/Dropdown/Demos.stories.tsx +8 -0
- package/src/stories/generated/ExpansionPanel/Demos.stories.tsx +9 -0
- package/src/stories/generated/Flag/Demos.stories.tsx +6 -0
- package/src/stories/generated/GenericBlock/Demos.stories.tsx +8 -0
- package/src/stories/generated/Heading/Demos.stories.tsx +6 -0
- package/src/stories/generated/Icon/Demos.stories.tsx +8 -0
- package/src/stories/generated/ImageBlock/Demos.stories.tsx +9 -0
- package/src/stories/generated/ImageLightbox/Demos.stories.tsx +6 -0
- package/src/stories/generated/Lightbox/Demos.stories.tsx +6 -0
- package/src/stories/generated/LinkPreview/Demos.stories.tsx +7 -0
- package/src/stories/generated/List/Demos.stories.tsx +11 -0
- package/src/stories/generated/Message/Demos.stories.tsx +11 -0
- package/src/stories/generated/Mosaic/Demos.stories.tsx +10 -0
- package/src/stories/generated/Notification/Demos.stories.tsx +6 -0
- package/src/stories/generated/Popover/Demos.stories.tsx +11 -0
- package/src/stories/generated/PopoverDialog/Demos.stories.tsx +6 -0
- package/src/stories/generated/PostBlock/Demos.stories.tsx +6 -0
- package/src/stories/generated/Progress/Demos.stories.tsx +7 -0
- package/src/stories/generated/ProgressTracker/Demos.stories.tsx +9 -0
- package/src/stories/generated/RadioButton/Demos.stories.tsx +6 -0
- package/src/stories/generated/Select/Demos.stories.tsx +14 -0
- package/src/stories/generated/SideNavigation/Demos.stories.tsx +10 -0
- package/src/stories/generated/Skeleton/Demos.stories.tsx +9 -0
- package/src/stories/generated/Slider/Demos.stories.tsx +9 -0
- package/src/stories/generated/Slideshow/Demos.stories.tsx +8 -0
- package/src/stories/generated/Switch/Demos.stories.tsx +6 -0
- package/src/stories/generated/Table/Demos.stories.tsx +7 -0
- package/src/stories/generated/Tabs/Demos.stories.tsx +8 -0
- package/src/stories/generated/TextField/Demos.stories.tsx +20 -0
- package/src/stories/generated/Thumbnail/Demos.stories.tsx +12 -0
- package/src/stories/generated/Toolbar/Demos.stories.tsx +10 -0
- package/src/stories/generated/Tooltip/Demos.stories.tsx +8 -0
- package/src/stories/generated/Uploader/Demos.stories.tsx +8 -0
- package/src/stories/generated/UserBlock/Demos.stories.tsx +11 -0
- package/src/stories/utils/CustomLink.tsx +12 -0
- package/src/stories/utils/concatPath.tsx +17 -0
- package/src/stories/utils/disableArgTypes.ts +3 -0
- package/src/stories/utils/initDemoShadowDOMPortal.ts +10 -0
- package/src/stories/utils/lorem.ts +59 -0
- package/src/stories/utils/theming.tsx +166 -0
- package/src/stories/utils/toFlattenProps.ts +28 -0
- package/src/stories/utils/withCategory.ts +12 -0
- package/src/testing/utils/ThemeSentinel.tsx +10 -0
- package/src/testing/utils/commonTestsSuiteRTL.tsx +193 -0
- package/src/testing/utils/index.ts +1 -0
- package/src/testing/utils/queries.ts +19 -0
- package/src/untypped-modules.d.ts +9 -0
- package/src/utils/ClickAwayProvider/ClickAwayProvider.stories.jsx +70 -0
- package/src/utils/ClickAwayProvider/ClickAwayProvider.tsx +69 -0
- package/src/utils/ClickAwayProvider/index.ts +1 -0
- package/src/utils/MaterialThemeSwitcher/MaterialThemeSwitcher.tsx +54 -0
- package/src/utils/MaterialThemeSwitcher/index.ts +1 -0
- package/src/utils/Portal/Portal.test.tsx +31 -0
- package/src/utils/Portal/Portal.tsx +33 -0
- package/src/utils/Portal/PortalProvider.stories.jsx +22 -0
- package/src/utils/Portal/PortalProvider.test.tsx +72 -0
- package/src/utils/Portal/PortalProvider.tsx +24 -0
- package/src/utils/Portal/index.tsx +2 -0
- package/src/utils/browser/DOM/findImage.tsx +3 -0
- package/src/utils/browser/DOM/startViewTransition.ts +68 -0
- package/src/utils/browser/focus/constants.ts +7 -0
- package/src/utils/browser/focus/getFirstAndLastFocusable.test.ts +134 -0
- package/src/utils/browser/focus/getFirstAndLastFocusable.ts +21 -0
- package/src/utils/browser/focus/getFocusableElements.test.ts +151 -0
- package/src/utils/browser/focus/getFocusableElements.ts +7 -0
- package/src/utils/browser/isFocusVisible.ts +9 -0
- package/src/utils/browser/isHoverNotSupported.test.js +24 -0
- package/src/utils/browser/isHoverNotSupported.ts +2 -0
- package/src/utils/browser/isReducedMotion.ts +6 -0
- package/src/utils/date/addMonthResetDay.test.ts +13 -0
- package/src/utils/date/addMonthResetDay.ts +9 -0
- package/src/utils/date/formatDayNumber.test.ts +12 -0
- package/src/utils/date/formatDayNumber.ts +5 -0
- package/src/utils/date/getFirstDayOfWeek.test.ts +20 -0
- package/src/utils/date/getFirstDayOfWeek.ts +59 -0
- package/src/utils/date/getMonthCalendar.test.ts +127 -0
- package/src/utils/date/getMonthCalendar.ts +69 -0
- package/src/utils/date/getWeekDays.test.ts +48 -0
- package/src/utils/date/getWeekDays.ts +34 -0
- package/src/utils/date/getYearDisplayName.test.ts +20 -0
- package/src/utils/date/getYearDisplayName.ts +12 -0
- package/src/utils/date/isDateValid.test.ts +15 -0
- package/src/utils/date/isDateValid.ts +4 -0
- package/src/utils/date/isSameDay.test.ts +37 -0
- package/src/utils/date/isSameDay.ts +11 -0
- package/src/utils/disabled/DisabledStateContext.tsx +29 -0
- package/src/utils/disabled/DisabledStateProvider.stories.tsx +92 -0
- package/src/utils/disabled/index.ts +2 -0
- package/src/utils/disabled/useDisableStateProps.test.tsx +74 -0
- package/src/utils/disabled/useDisableStateProps.tsx +37 -0
- package/src/utils/function/makeListenerTowerContext.ts +32 -0
- package/src/utils/index.ts +7 -0
- package/src/utils/locale/getCurrentLocale.ts +4 -0
- package/src/utils/locale/parseLocale.test.ts +17 -0
- package/src/utils/locale/parseLocale.ts +23 -0
- package/src/utils/locale/types.ts +8 -0
- package/src/utils/number/clamp.ts +17 -0
- package/src/utils/object/isEqual.test.ts +25 -0
- package/src/utils/object/isEqual.ts +11 -0
- package/src/utils/partitionMulti.test.ts +27 -0
- package/{_internal/partitionMulti-4daccdd5.js → src/utils/partitionMulti.ts} +9 -5
- package/src/utils/react/OnBeforeUnmount.tsx +20 -0
- package/src/utils/react/RawClickable.test.tsx +153 -0
- package/src/utils/react/RawClickable.tsx +65 -0
- package/src/utils/react/flattenChildren.ts +32 -0
- package/src/utils/react/forwardRef.ts +11 -0
- package/src/utils/react/forwardRefPolymorphic.ts +9 -0
- package/src/utils/react/mergeRefs.ts +33 -0
- package/src/utils/react/renderLink.tsx +17 -0
- package/src/utils/react/skipRender.tsx +18 -0
- package/src/utils/react/unref.ts +7 -0
- package/src/utils/react/wrapChildrenIconWithSpaces.test.tsx +37 -0
- package/src/utils/react/wrapChildrenIconWithSpaces.tsx +22 -0
- package/src/utils/theme/ThemeContext.ts +16 -0
- package/src/utils/theme/invertTheme.ts +4 -0
- package/src/utils/type/Comp.ts +14 -0
- package/src/utils/type/ComponentRef.ts +16 -0
- package/src/utils/type/HasAriaDisabled.ts +6 -0
- package/src/utils/type/HasPolymorphicAs.ts +6 -0
- package/src/utils/type/HasRequiredLinkHref.ts +1 -0
- package/src/utils/type/MaybeElementOrRef.ts +6 -0
- package/src/utils/type/index.ts +9 -0
- package/src/utils/type/isComponent.ts +33 -0
- package/src/utils/type/isComponentType.ts +9 -0
- package/utils/index.d.ts +1 -1
- package/utils/index.js +1 -3
- package/utils/index.js.map +1 -1
- package/_internal/Button-1f227024.js +0 -98
- package/_internal/Button-1f227024.js.map +0 -1
- package/_internal/ButtonRoot-823f3e9c.js +0 -117
- package/_internal/ButtonRoot-823f3e9c.js.map +0 -1
- package/_internal/Chip-a34f6905.js +0 -146
- package/_internal/Chip-a34f6905.js.map +0 -1
- package/_internal/ClickAwayProvider-7093ba23.js +0 -95
- package/_internal/ClickAwayProvider-7093ba23.js.map +0 -1
- package/_internal/DisabledStateContext-ea04260d.js +0 -29
- package/_internal/DisabledStateContext-ea04260d.js.map +0 -1
- package/_internal/HeadingLevelProvider-ebdcb0c7.js +0 -61
- package/_internal/HeadingLevelProvider-ebdcb0c7.js.map +0 -1
- package/_internal/IconButton-f4df224c.js +0 -77
- package/_internal/IconButton-f4df224c.js.map +0 -1
- package/_internal/ImageCaption-8134a3aa.js +0 -75
- package/_internal/ImageCaption-8134a3aa.js.map +0 -1
- package/_internal/List-54237e0e.js +0 -793
- package/_internal/List-54237e0e.js.map +0 -1
- package/_internal/PopoverDialog-e0967e5f.js +0 -655
- package/_internal/PopoverDialog-e0967e5f.js.map +0 -1
- package/_internal/Portal-3f86608e.js +0 -45
- package/_internal/Portal-3f86608e.js.map +0 -1
- package/_internal/RawClickable-2c2b6a89.js +0 -52
- package/_internal/RawClickable-2c2b6a89.js.map +0 -1
- package/_internal/Slides-b7a67f32.js +0 -678
- package/_internal/Slides-b7a67f32.js.map +0 -1
- package/_internal/ThemeContext-3181f000.js +0 -14
- package/_internal/ThemeContext-3181f000.js.map +0 -1
- package/_internal/Thumbnail-b5dea0af.js +0 -313
- package/_internal/Thumbnail-b5dea0af.js.map +0 -1
- package/_internal/components/alert-dialog-b284b191.js +0 -162
- package/_internal/components/alert-dialog-b284b191.js.map +0 -1
- package/_internal/components/autocomplete-8d3f37ea.js +0 -261
- package/_internal/components/autocomplete-8d3f37ea.js.map +0 -1
- package/_internal/components/avatar-5fc70e00.js +0 -83
- package/_internal/components/avatar-5fc70e00.js.map +0 -1
- package/_internal/components/badge-8390e590.js +0 -81
- package/_internal/components/badge-8390e590.js.map +0 -1
- package/_internal/components/button-e3c7f2eb.js +0 -47
- package/_internal/components/button-e3c7f2eb.js.map +0 -1
- package/_internal/components/checkbox-d1ca9748.js +0 -140
- package/_internal/components/checkbox-d1ca9748.js.map +0 -1
- package/_internal/components/chip-e40c5521.js +0 -102
- package/_internal/components/chip-e40c5521.js.map +0 -1
- package/_internal/components/comment-block-a3cf7b9b.js +0 -138
- package/_internal/components/comment-block-a3cf7b9b.js.map +0 -1
- package/_internal/components/date-picker-6c1b14e4.js +0 -2
- package/_internal/components/date-picker-6c1b14e4.js.map +0 -1
- package/_internal/components/dialog-ebdb9500.js +0 -238
- package/_internal/components/dialog-ebdb9500.js.map +0 -1
- package/_internal/components/divider-116af6b9.js +0 -50
- package/_internal/components/divider-116af6b9.js.map +0 -1
- package/_internal/components/drag-handle-5215cd21.js +0 -51
- package/_internal/components/drag-handle-5215cd21.js.map +0 -1
- package/_internal/components/dropdown-0baed51b.js +0 -147
- package/_internal/components/dropdown-0baed51b.js.map +0 -1
- package/_internal/components/expansion-panel-5533a680.js +0 -167
- package/_internal/components/expansion-panel-5533a680.js.map +0 -1
- package/_internal/components/flag-8d4a7e72.js +0 -59
- package/_internal/components/flag-8d4a7e72.js.map +0 -1
- package/_internal/components/flex-box-55144e5f.js +0 -56
- package/_internal/components/flex-box-55144e5f.js.map +0 -1
- package/_internal/components/generic-block-ff0509ee.js +0 -124
- package/_internal/components/generic-block-ff0509ee.js.map +0 -1
- package/_internal/components/grid-6f1b5a41.js +0 -104
- package/_internal/components/grid-6f1b5a41.js.map +0 -1
- package/_internal/components/grid-column-f01df853.js +0 -59
- package/_internal/components/grid-column-f01df853.js.map +0 -1
- package/_internal/components/heading-89239843.js +0 -53
- package/_internal/components/heading-89239843.js.map +0 -1
- package/_internal/components/icon-b708cca4.js +0 -102
- package/_internal/components/icon-b708cca4.js.map +0 -1
- package/_internal/components/image-block-7938422d.js +0 -110
- package/_internal/components/image-block-7938422d.js.map +0 -1
- package/_internal/components/image-lightbox-58331704.js +0 -756
- package/_internal/components/image-lightbox-58331704.js.map +0 -1
- package/_internal/components/inline-list-e6f19a98.js +0 -74
- package/_internal/components/inline-list-e6f19a98.js.map +0 -1
- package/_internal/components/input-helper-64153099.js +0 -71
- package/_internal/components/input-helper-64153099.js.map +0 -1
- package/_internal/components/input-label-2feb0bb0.js +0 -59
- package/_internal/components/input-label-2feb0bb0.js.map +0 -1
- package/_internal/components/lightbox-570ad9e5.js +0 -155
- package/_internal/components/lightbox-570ad9e5.js.map +0 -1
- package/_internal/components/link-91f76477.js +0 -72
- package/_internal/components/link-91f76477.js.map +0 -1
- package/_internal/components/link-preview-fdd8d738.js +0 -117
- package/_internal/components/link-preview-fdd8d738.js.map +0 -1
- package/_internal/components/list-b08d8423.js +0 -71
- package/_internal/components/list-b08d8423.js.map +0 -1
- package/_internal/components/message-29cb9181.js +0 -96
- package/_internal/components/message-29cb9181.js.map +0 -1
- package/_internal/components/mosaic-cdb9f563.js +0 -95
- package/_internal/components/mosaic-cdb9f563.js.map +0 -1
- package/_internal/components/navigation-8b7d9bd8.js +0 -225
- package/_internal/components/navigation-8b7d9bd8.js.map +0 -1
- package/_internal/components/notification-a45fda96.js +0 -145
- package/_internal/components/notification-a45fda96.js.map +0 -1
- package/_internal/components/popover-65bfbc57.js +0 -3
- package/_internal/components/popover-65bfbc57.js.map +0 -1
- package/_internal/components/post-block-52e58dd5.js +0 -109
- package/_internal/components/post-block-52e58dd5.js.map +0 -1
- package/_internal/components/progress-f39c3fa2.js +0 -182
- package/_internal/components/progress-f39c3fa2.js.map +0 -1
- package/_internal/components/progress-tracker-512d7a08.js +0 -305
- package/_internal/components/progress-tracker-512d7a08.js.map +0 -1
- package/_internal/components/radio-button-559a4863.js +0 -149
- package/_internal/components/radio-button-559a4863.js.map +0 -1
- package/_internal/components/select-48d4fa8c.js +0 -454
- package/_internal/components/select-48d4fa8c.js.map +0 -1
- package/_internal/components/side-navigation-f9bc5b4e.js +0 -165
- package/_internal/components/side-navigation-f9bc5b4e.js.map +0 -1
- package/_internal/components/skeleton-c66516ee.js +0 -166
- package/_internal/components/skeleton-c66516ee.js.map +0 -1
- package/_internal/components/slider-efbfbc45.js +0 -311
- package/_internal/components/slider-efbfbc45.js.map +0 -1
- package/_internal/components/slideshow-dd312470.js +0 -151
- package/_internal/components/slideshow-dd312470.js.map +0 -1
- package/_internal/components/switch-769a2a04.js +0 -122
- package/_internal/components/switch-769a2a04.js.map +0 -1
- package/_internal/components/table-8617b1ba.js +0 -294
- package/_internal/components/table-8617b1ba.js.map +0 -1
- package/_internal/components/tabs-884c57b6.js +0 -298
- package/_internal/components/tabs-884c57b6.js.map +0 -1
- package/_internal/components/text-c7b1e079.js +0 -2
- package/_internal/components/text-c7b1e079.js.map +0 -1
- package/_internal/components/text-field-478acd86.js +0 -359
- package/_internal/components/text-field-478acd86.js.map +0 -1
- package/_internal/components/thumbnail-310a4c4b.js +0 -42
- package/_internal/components/thumbnail-310a4c4b.js.map +0 -1
- package/_internal/components/toolbar-a43533a2.js +0 -61
- package/_internal/components/toolbar-a43533a2.js.map +0 -1
- package/_internal/components/tooltip-2885ab2e.js +0 -327
- package/_internal/components/tooltip-2885ab2e.js.map +0 -1
- package/_internal/components/uploader-1e7f5bbb.js +0 -153
- package/_internal/components/uploader-1e7f5bbb.js.map +0 -1
- package/_internal/components/user-block-68a51ed0.js +0 -145
- package/_internal/components/user-block-68a51ed0.js.map +0 -1
- package/_internal/constants-b9e57936.js +0 -2155
- package/_internal/constants-b9e57936.js.map +0 -1
- package/_internal/constants-d0e3f49e.js +0 -24
- package/_internal/constants-d0e3f49e.js.map +0 -1
- package/_internal/context-9d1336a1.js +0 -19
- package/_internal/context-9d1336a1.js.map +0 -1
- package/_internal/forwardRef-15f62847.js +0 -70
- package/_internal/forwardRef-15f62847.js.map +0 -1
- package/_internal/getFocusableElements-230173a8.js +0 -13
- package/_internal/getFocusableElements-230173a8.js.map +0 -1
- package/_internal/index-9df37c0d.js +0 -436
- package/_internal/index-9df37c0d.js.map +0 -1
- package/_internal/index-a9c5cd69.js +0 -117
- package/_internal/index-a9c5cd69.js.map +0 -1
- package/_internal/isComponent-78df9309.js +0 -20
- package/_internal/isComponent-78df9309.js.map +0 -1
- package/_internal/isComponentType-e806b848.js +0 -9
- package/_internal/isComponentType-e806b848.js.map +0 -1
- package/_internal/mergeRefs-f0d7d6ea.js +0 -30
- package/_internal/mergeRefs-f0d7d6ea.js.map +0 -1
- package/_internal/partitionMulti-4daccdd5.js.map +0 -1
- package/_internal/state-db358714.js +0 -130
- package/_internal/state-db358714.js.map +0 -1
- package/_internal/useBooleanState-2a3d237c.js +0 -12
- package/_internal/useBooleanState-2a3d237c.js.map +0 -1
- package/_internal/useCallbackOnEscape-ea4d9eb4.js +0 -62
- package/_internal/useCallbackOnEscape-ea4d9eb4.js.map +0 -1
- package/_internal/useDisableBodyScroll-36bd7352.js +0 -219
- package/_internal/useDisableBodyScroll-36bd7352.js.map +0 -1
- package/_internal/useDisableStateProps-69e16b7c.js +0 -36
- package/_internal/useDisableStateProps-69e16b7c.js.map +0 -1
- package/_internal/useFocusTrap-c3c6378b.js +0 -112
- package/_internal/useFocusTrap-c3c6378b.js.map +0 -1
- package/_internal/useId-3a1facc0.js +0 -18
- package/_internal/useId-3a1facc0.js.map +0 -1
- package/_internal/useRovingTabIndex-7daf0f24.js +0 -77
- package/_internal/useRovingTabIndex-7daf0f24.js.map +0 -1
- package/_internal/useTransitionVisibility-321fdbfa.js +0 -50
- package/_internal/useTransitionVisibility-321fdbfa.js.map +0 -1
- package/_internal/wrapChildrenIconWithSpaces-c1faaae4.js +0 -20
- package/_internal/wrapChildrenIconWithSpaces-c1faaae4.js.map +0 -1
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import React, { Children } from 'react';
|
|
2
|
+
import { isComponentType } from '@lumx/react/utils/type';
|
|
3
|
+
import { Icon } from '@lumx/react';
|
|
4
|
+
|
|
5
|
+
/** Force wrap spaces around icons to make sure they are never stuck against text. */
|
|
6
|
+
export function wrapChildrenIconWithSpaces(children: React.ReactNode): React.ReactNode {
|
|
7
|
+
if (children === null || children === undefined) return undefined;
|
|
8
|
+
return Children.toArray(children).flatMap((child) => {
|
|
9
|
+
if (isComponentType(Icon)(child)) {
|
|
10
|
+
return [' ', child, ' '];
|
|
11
|
+
}
|
|
12
|
+
if (
|
|
13
|
+
React.isValidElement(child) &&
|
|
14
|
+
child.props &&
|
|
15
|
+
typeof child.props === 'object' &&
|
|
16
|
+
'children' in child.props
|
|
17
|
+
) {
|
|
18
|
+
return React.cloneElement(child, undefined, wrapChildrenIconWithSpaces(child.props.children));
|
|
19
|
+
}
|
|
20
|
+
return child;
|
|
21
|
+
});
|
|
22
|
+
}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import type { Theme } from '@lumx/react';
|
|
3
|
+
|
|
4
|
+
type ThemeContextValue = Theme | undefined;
|
|
5
|
+
export const ThemeContext = React.createContext<ThemeContextValue>(undefined);
|
|
6
|
+
|
|
7
|
+
/** Provide a theme context to all children. */
|
|
8
|
+
export const ThemeProvider = ThemeContext.Provider as React.FC<{
|
|
9
|
+
value: ThemeContextValue;
|
|
10
|
+
children?: React.ReactNode;
|
|
11
|
+
}>;
|
|
12
|
+
|
|
13
|
+
/** Get the theme in the current context. */
|
|
14
|
+
export function useTheme(): ThemeContextValue {
|
|
15
|
+
return React.useContext(ThemeContext);
|
|
16
|
+
}
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import type { ReactElement, Ref } from 'react';
|
|
2
|
+
|
|
3
|
+
/** LumX Component Type. */
|
|
4
|
+
export type Comp<P, T = HTMLElement> = {
|
|
5
|
+
(props: P & { ref?: Ref<T> }): ReactElement | null;
|
|
6
|
+
/** React component type. */
|
|
7
|
+
readonly $$typeof: symbol;
|
|
8
|
+
/** Component default props. */
|
|
9
|
+
defaultProps?: Partial<P>;
|
|
10
|
+
/** Component name. */
|
|
11
|
+
displayName?: string;
|
|
12
|
+
/** Component base class name. */
|
|
13
|
+
className?: string;
|
|
14
|
+
};
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import type React from 'react';
|
|
2
|
+
import type { Comp } from './Comp';
|
|
3
|
+
|
|
4
|
+
/**
|
|
5
|
+
* Extract ref type for a component or JSX intrinsic element
|
|
6
|
+
*
|
|
7
|
+
* @example ComponentRef<'div'> => React.Ref<HTMLDivElement>
|
|
8
|
+
* @example ComponentRef<Button> => React.Ref<HTMLButtonElement
|
|
9
|
+
*/
|
|
10
|
+
export type ComponentRef<C> = C extends keyof JSX.IntrinsicElements
|
|
11
|
+
? JSX.IntrinsicElements[C]['ref']
|
|
12
|
+
: C extends Comp<any, infer T>
|
|
13
|
+
? React.Ref<T>
|
|
14
|
+
: C extends React.JSXElementConstructor<{ ref?: infer R }>
|
|
15
|
+
? R
|
|
16
|
+
: never;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export type HasRequiredLinkHref<E> = E extends 'a' ? { href: string } : Record<string, unknown>;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
export type * from '@lumx/core/js/types';
|
|
2
|
+
|
|
3
|
+
export type { Comp } from './Comp';
|
|
4
|
+
export type { ComponentRef } from './ComponentRef';
|
|
5
|
+
export type { HasPolymorphicAs } from './HasPolymorphicAs';
|
|
6
|
+
export { isComponent } from './isComponent';
|
|
7
|
+
export { isComponentType } from './isComponentType';
|
|
8
|
+
export type { MaybeElementOrRef } from './MaybeElementOrRef';
|
|
9
|
+
export type { HasRequiredLinkHref } from './HasRequiredLinkHref';
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
import type { ReactElement, ReactNode } from 'react';
|
|
2
|
+
import get from 'lodash/get';
|
|
3
|
+
import type { Comp } from './Comp';
|
|
4
|
+
|
|
5
|
+
/**
|
|
6
|
+
* Properties of a component to use to determine it's name.
|
|
7
|
+
* In the order of preference.
|
|
8
|
+
*/
|
|
9
|
+
const NAME_PROPERTIES: string[] = [
|
|
10
|
+
'type',
|
|
11
|
+
'type.displayName',
|
|
12
|
+
'displayName',
|
|
13
|
+
'name',
|
|
14
|
+
'type.name',
|
|
15
|
+
'props.mdxType',
|
|
16
|
+
'_reactInternalFiber.elementType.name',
|
|
17
|
+
];
|
|
18
|
+
/**
|
|
19
|
+
* Create a predicate function that checks if a ReactNode is a react element from the given component.
|
|
20
|
+
*
|
|
21
|
+
* @param component React function component or the component name
|
|
22
|
+
* @return predicate returning true if value is instance of the component
|
|
23
|
+
*/
|
|
24
|
+
export const isComponent =
|
|
25
|
+
<C>(component: Comp<C, any> | string) =>
|
|
26
|
+
(instance: ReactNode): instance is ReactElement => {
|
|
27
|
+
const componentName = typeof component === 'string' ? component : component.displayName;
|
|
28
|
+
|
|
29
|
+
return (
|
|
30
|
+
!!get(instance, '$$typeof') &&
|
|
31
|
+
NAME_PROPERTIES.some((nameProperty: string): boolean => get(instance, nameProperty) === componentName)
|
|
32
|
+
);
|
|
33
|
+
};
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import React, { ReactElement, ReactNode } from 'react';
|
|
2
|
+
|
|
3
|
+
/**
|
|
4
|
+
* Similar to `isComponent` but more precise as it's not based on the component `displayName` but on the component function reference.
|
|
5
|
+
*/
|
|
6
|
+
export const isComponentType =
|
|
7
|
+
(type: ReactElement['type']) =>
|
|
8
|
+
(node: ReactNode): node is ReactElement =>
|
|
9
|
+
React.isValidElement(node) && node.type === type;
|
package/utils/index.d.ts
CHANGED
package/utils/index.js
CHANGED
|
@@ -1,4 +1,2 @@
|
|
|
1
|
-
export { C as ClickAwayProvider } from '../_internal/
|
|
2
|
-
export { P as Portal, a as PortalProvider } from '../_internal/Portal-3f86608e.js';
|
|
3
|
-
export { D as DisabledStateProvider, u as useDisabledStateContext } from '../_internal/DisabledStateContext-ea04260d.js';
|
|
1
|
+
export { C as ClickAwayProvider, D as DisabledStateProvider, P as Portal, c as PortalProvider, u as useDisabledStateContext } from '../_internal/index.js';
|
|
4
2
|
//# sourceMappingURL=index.js.map
|
package/utils/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}
|
|
@@ -1,98 +0,0 @@
|
|
|
1
|
-
import { f as forwardRef, c as classNames } from './forwardRef-15f62847.js';
|
|
2
|
-
import isEmpty from 'lodash/isEmpty';
|
|
3
|
-
import { i as isComponent } from './isComponent-78df9309.js';
|
|
4
|
-
import { getRootClassName, getBasicClass } from '@lumx/core/js/utils/className';
|
|
5
|
-
import { u as useTheme, T as ThemeProvider } from './ThemeContext-3181f000.js';
|
|
6
|
-
import { B as ButtonRoot } from './ButtonRoot-823f3e9c.js';
|
|
7
|
-
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
8
|
-
import { T as Text } from './index-a9c5cd69.js';
|
|
9
|
-
import { Emphasis, Size, Theme } from '@lumx/core/js/constants';
|
|
10
|
-
import { Icon } from './components/icon-b708cca4.js';
|
|
11
|
-
|
|
12
|
-
const ButtonEmphasis = Emphasis;
|
|
13
|
-
|
|
14
|
-
/**
|
|
15
|
-
* Defines the props of the component.
|
|
16
|
-
*/
|
|
17
|
-
|
|
18
|
-
/**
|
|
19
|
-
* Component display name.
|
|
20
|
-
*/
|
|
21
|
-
const COMPONENT_NAME = 'Button';
|
|
22
|
-
|
|
23
|
-
/**
|
|
24
|
-
* Component default class name and class prefix.
|
|
25
|
-
*/
|
|
26
|
-
const CLASSNAME = getRootClassName(COMPONENT_NAME);
|
|
27
|
-
|
|
28
|
-
/**
|
|
29
|
-
* Component default props.
|
|
30
|
-
*/
|
|
31
|
-
const DEFAULT_PROPS = {
|
|
32
|
-
emphasis: Emphasis.high,
|
|
33
|
-
size: Size.m
|
|
34
|
-
};
|
|
35
|
-
|
|
36
|
-
/**
|
|
37
|
-
* Button component.
|
|
38
|
-
*
|
|
39
|
-
* @param props Component props.
|
|
40
|
-
* @param ref Component ref.
|
|
41
|
-
* @return React element.
|
|
42
|
-
*/
|
|
43
|
-
const Button = forwardRef((props, ref) => {
|
|
44
|
-
const defaultTheme = useTheme() || Theme.light;
|
|
45
|
-
const {
|
|
46
|
-
children,
|
|
47
|
-
className,
|
|
48
|
-
emphasis = DEFAULT_PROPS.emphasis,
|
|
49
|
-
leftIcon,
|
|
50
|
-
rightIcon,
|
|
51
|
-
size = DEFAULT_PROPS.size,
|
|
52
|
-
theme = defaultTheme,
|
|
53
|
-
...forwardedProps
|
|
54
|
-
} = props;
|
|
55
|
-
const buttonClassName = classNames(className, getBasicClass({
|
|
56
|
-
prefix: CLASSNAME,
|
|
57
|
-
type: 'hasLeftIcon',
|
|
58
|
-
value: !isEmpty(leftIcon)
|
|
59
|
-
}), getBasicClass({
|
|
60
|
-
prefix: CLASSNAME,
|
|
61
|
-
type: 'hasRightIcon',
|
|
62
|
-
value: !isEmpty(rightIcon)
|
|
63
|
-
}));
|
|
64
|
-
return /*#__PURE__*/jsxs(ButtonRoot, {
|
|
65
|
-
ref: ref,
|
|
66
|
-
emphasis,
|
|
67
|
-
size,
|
|
68
|
-
theme,
|
|
69
|
-
...forwardedProps,
|
|
70
|
-
className: buttonClassName,
|
|
71
|
-
variant: "button",
|
|
72
|
-
children: [leftIcon && !isEmpty(leftIcon) &&
|
|
73
|
-
/*#__PURE__*/
|
|
74
|
-
// Theme is handled in the button scss
|
|
75
|
-
jsx(ThemeProvider, {
|
|
76
|
-
value: undefined,
|
|
77
|
-
children: /*#__PURE__*/jsx(Icon, {
|
|
78
|
-
icon: leftIcon
|
|
79
|
-
})
|
|
80
|
-
}), children && (isComponent(Text)(children) ? children : /*#__PURE__*/jsx("span", {
|
|
81
|
-
children: children
|
|
82
|
-
})), rightIcon && !isEmpty(rightIcon) &&
|
|
83
|
-
/*#__PURE__*/
|
|
84
|
-
// Theme is handled in the button scss
|
|
85
|
-
jsx(ThemeProvider, {
|
|
86
|
-
value: undefined,
|
|
87
|
-
children: /*#__PURE__*/jsx(Icon, {
|
|
88
|
-
icon: rightIcon
|
|
89
|
-
})
|
|
90
|
-
})]
|
|
91
|
-
});
|
|
92
|
-
});
|
|
93
|
-
Button.displayName = COMPONENT_NAME;
|
|
94
|
-
Button.className = CLASSNAME;
|
|
95
|
-
Button.defaultProps = DEFAULT_PROPS;
|
|
96
|
-
|
|
97
|
-
export { ButtonEmphasis as B, Button as a };
|
|
98
|
-
//# sourceMappingURL=Button-1f227024.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Button-1f227024.js","sources":["../../src/components/button/Button.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport isEmpty from 'lodash/isEmpty';\n\nimport { Emphasis, Icon, Size, Theme, Text, ThemeProvider } from '@lumx/react';\nimport { isComponent } from '@lumx/react/utils/type';\nimport { getBasicClass, getRootClassName } from '@lumx/core/js/utils/className';\nimport { useTheme } from '@lumx/react/utils/theme/ThemeContext';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\n\nimport { BaseButtonProps, ButtonRoot } from './ButtonRoot';\n\n/**\n * Button emphasis definition.\n * @deprecated Use Emphasis instead.\n */\nexport const ButtonEmphasis = Emphasis;\n\n/**\n * Defines the props of the component.\n */\nexport interface ButtonProps extends BaseButtonProps {\n /** Left icon (SVG path). */\n leftIcon?: string;\n /** Right icon (SVG path). */\n rightIcon?: string;\n /** When `true`, the button gets as large as possible. */\n fullWidth?: boolean;\n /** Children */\n children?: React.ReactNode;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'Button';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<ButtonProps> = {\n emphasis: Emphasis.high,\n size: Size.m,\n};\n\n/**\n * Button component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const Button = forwardRef<ButtonProps, HTMLButtonElement | HTMLAnchorElement>((props, ref) => {\n const defaultTheme = useTheme() || Theme.light;\n const {\n children,\n className,\n emphasis = DEFAULT_PROPS.emphasis,\n leftIcon,\n rightIcon,\n size = DEFAULT_PROPS.size,\n theme = defaultTheme,\n ...forwardedProps\n } = props;\n\n const buttonClassName = classNames(\n className,\n getBasicClass({ prefix: CLASSNAME, type: 'hasLeftIcon', value: !isEmpty(leftIcon) }),\n getBasicClass({ prefix: CLASSNAME, type: 'hasRightIcon', value: !isEmpty(rightIcon) }),\n );\n\n return (\n <ButtonRoot\n ref={ref}\n {...{ emphasis, size, theme, ...forwardedProps }}\n className={buttonClassName}\n variant=\"button\"\n >\n {leftIcon && !isEmpty(leftIcon) && (\n // Theme is handled in the button scss\n <ThemeProvider value={undefined}>\n <Icon icon={leftIcon} />\n </ThemeProvider>\n )}\n {children && (isComponent(Text)(children) ? children : <span>{children}</span>)}\n {rightIcon && !isEmpty(rightIcon) && (\n // Theme is handled in the button scss\n <ThemeProvider value={undefined}>\n <Icon icon={rightIcon} />\n </ThemeProvider>\n )}\n </ButtonRoot>\n );\n});\nButton.displayName = COMPONENT_NAME;\nButton.className = CLASSNAME;\nButton.defaultProps = DEFAULT_PROPS;\n"],"names":["ButtonEmphasis","Emphasis","COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","emphasis","high","size","Size","m","Button","forwardRef","props","ref","defaultTheme","useTheme","Theme","light","children","className","leftIcon","rightIcon","theme","forwardedProps","buttonClassName","classNames","getBasicClass","prefix","type","value","isEmpty","_jsxs","ButtonRoot","variant","_jsx","ThemeProvider","undefined","Icon","icon","isComponent","Text","displayName","defaultProps"],"mappings":";;;;;;;;;;;AAeO,MAAMA,cAAc,GAAGC,SAAQ;;AAEtC;AACA;AACA;;AAYA;AACA;AACA;AACA,MAAMC,cAAc,GAAG,QAAQ,CAAA;;AAE/B;AACA;AACA;AACA,MAAMC,SAAS,GAAGC,gBAAgB,CAACF,cAAc,CAAC,CAAA;;AAElD;AACA;AACA;AACA,MAAMG,aAAmC,GAAG;EACxCC,QAAQ,EAAEL,QAAQ,CAACM,IAAI;EACvBC,IAAI,EAAEC,IAAI,CAACC,CAAAA;AACf,CAAC,CAAA;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMC,MAAM,GAAGC,UAAU,CAAqD,CAACC,KAAK,EAAEC,GAAG,KAAK;EACjG,MAAMC,YAAY,GAAGC,QAAQ,EAAE,IAAIC,KAAK,CAACC,KAAK,CAAA;EAC9C,MAAM;IACFC,QAAQ;IACRC,SAAS;IACTd,QAAQ,GAAGD,aAAa,CAACC,QAAQ;IACjCe,QAAQ;IACRC,SAAS;IACTd,IAAI,GAAGH,aAAa,CAACG,IAAI;AACzBe,IAAAA,KAAK,GAAGR,YAAY;IACpB,GAAGS,cAAAA;AACP,GAAC,GAAGX,KAAK,CAAA;AAET,EAAA,MAAMY,eAAe,GAAGC,UAAU,CAC9BN,SAAS,EACTO,aAAa,CAAC;AAAEC,IAAAA,MAAM,EAAEzB,SAAS;AAAE0B,IAAAA,IAAI,EAAE,aAAa;AAAEC,IAAAA,KAAK,EAAE,CAACC,OAAO,CAACV,QAAQ,CAAA;GAAG,CAAC,EACpFM,aAAa,CAAC;AAAEC,IAAAA,MAAM,EAAEzB,SAAS;AAAE0B,IAAAA,IAAI,EAAE,cAAc;AAAEC,IAAAA,KAAK,EAAE,CAACC,OAAO,CAACT,SAAS,CAAA;AAAE,GAAC,CACzF,CAAC,CAAA;EAED,oBACIU,IAAA,CAACC,UAAU,EAAA;AACPnB,IAAAA,GAAG,EAAEA,GAAI;IACHR,QAAQ;IAAEE,IAAI;IAAEe,KAAK;AAAE,IAAA,GAAGC,cAAc;AAC9CJ,IAAAA,SAAS,EAAEK,eAAgB;AAC3BS,IAAAA,OAAO,EAAC,QAAQ;AAAAf,IAAAA,QAAA,GAEfE,QAAQ,IAAI,CAACU,OAAO,CAACV,QAAQ,CAAC;AAAA;AAC3B;AACAc,IAAAA,GAAA,CAACC,aAAa,EAAA;AAACN,MAAAA,KAAK,EAAEO,SAAU;MAAAlB,QAAA,eAC5BgB,GAAA,CAACG,IAAI,EAAA;AAACC,QAAAA,IAAI,EAAElB,QAAAA;OAAW,CAAA;AAAC,KACb,CAClB,EACAF,QAAQ,KAAKqB,WAAW,CAACC,IAAI,CAAC,CAACtB,QAAQ,CAAC,GAAGA,QAAQ,gBAAGgB,GAAA,CAAA,MAAA,EAAA;AAAAhB,MAAAA,QAAA,EAAOA,QAAAA;KAAe,CAAC,CAAC,EAC9EG,SAAS,IAAI,CAACS,OAAO,CAACT,SAAS,CAAC;AAAA;AAC7B;AACAa,IAAAA,GAAA,CAACC,aAAa,EAAA;AAACN,MAAAA,KAAK,EAAEO,SAAU;MAAAlB,QAAA,eAC5BgB,GAAA,CAACG,IAAI,EAAA;AAACC,QAAAA,IAAI,EAAEjB,SAAAA;OAAY,CAAA;AAAC,KACd,CAClB,CAAA;AAAA,GACO,CAAC,CAAA;AAErB,CAAC,EAAC;AACFX,MAAM,CAAC+B,WAAW,GAAGxC,cAAc,CAAA;AACnCS,MAAM,CAACS,SAAS,GAAGjB,SAAS,CAAA;AAC5BQ,MAAM,CAACgC,YAAY,GAAGtC,aAAa;;;;"}
|
|
@@ -1,117 +0,0 @@
|
|
|
1
|
-
import { f as forwardRef, c as classNames } from './forwardRef-15f62847.js';
|
|
2
|
-
import './constants-d0e3f49e.js';
|
|
3
|
-
import { handleBasicClasses } from '@lumx/core/js/utils/className';
|
|
4
|
-
import { R as RawClickable } from './RawClickable-2c2b6a89.js';
|
|
5
|
-
import { jsx } from 'react/jsx-runtime';
|
|
6
|
-
import { u as useDisableStateProps } from './useDisableStateProps-69e16b7c.js';
|
|
7
|
-
import { Emphasis, Theme, ColorPalette, CSS_PREFIX } from '@lumx/core/js/constants';
|
|
8
|
-
|
|
9
|
-
/**
|
|
10
|
-
* Component display name.
|
|
11
|
-
*/
|
|
12
|
-
const COMPONENT_NAME = 'ButtonRoot';
|
|
13
|
-
const BUTTON_WRAPPER_CLASSNAME = `${CSS_PREFIX}-button-wrapper`;
|
|
14
|
-
const BUTTON_CLASSNAME = `${CSS_PREFIX}-button`;
|
|
15
|
-
|
|
16
|
-
/**
|
|
17
|
-
* Render a button wrapper with the ButtonRoot inside.
|
|
18
|
-
*
|
|
19
|
-
* @param props Component props.
|
|
20
|
-
* @return React element.
|
|
21
|
-
*/
|
|
22
|
-
const renderButtonWrapper = props => {
|
|
23
|
-
const {
|
|
24
|
-
color,
|
|
25
|
-
emphasis,
|
|
26
|
-
variant,
|
|
27
|
-
fullWidth
|
|
28
|
-
} = props;
|
|
29
|
-
const adaptedColor = emphasis === Emphasis.low && (color === ColorPalette.light ? ColorPalette.dark : ColorPalette.light);
|
|
30
|
-
const wrapperClassName = classNames(handleBasicClasses({
|
|
31
|
-
color: adaptedColor,
|
|
32
|
-
prefix: BUTTON_WRAPPER_CLASSNAME,
|
|
33
|
-
variant,
|
|
34
|
-
fullWidth
|
|
35
|
-
}));
|
|
36
|
-
const buttonProps = {
|
|
37
|
-
...props,
|
|
38
|
-
hasBackground: false
|
|
39
|
-
};
|
|
40
|
-
return /*#__PURE__*/jsx("div", {
|
|
41
|
-
className: wrapperClassName,
|
|
42
|
-
children: /*#__PURE__*/jsx(ButtonRoot, {
|
|
43
|
-
...buttonProps
|
|
44
|
-
})
|
|
45
|
-
});
|
|
46
|
-
};
|
|
47
|
-
|
|
48
|
-
/**
|
|
49
|
-
* ButtonRoot component.
|
|
50
|
-
*
|
|
51
|
-
* @param props Component props.
|
|
52
|
-
* @param ref Component ref.
|
|
53
|
-
* @return React element.
|
|
54
|
-
*/
|
|
55
|
-
const ButtonRoot = forwardRef((props, ref) => {
|
|
56
|
-
const {
|
|
57
|
-
isAnyDisabled,
|
|
58
|
-
disabledStateProps,
|
|
59
|
-
otherProps
|
|
60
|
-
} = useDisableStateProps(props);
|
|
61
|
-
const {
|
|
62
|
-
'aria-label': ariaLabel,
|
|
63
|
-
children,
|
|
64
|
-
className,
|
|
65
|
-
color,
|
|
66
|
-
emphasis,
|
|
67
|
-
hasBackground,
|
|
68
|
-
isSelected,
|
|
69
|
-
isActive,
|
|
70
|
-
isFocused,
|
|
71
|
-
isHovered,
|
|
72
|
-
linkAs,
|
|
73
|
-
size,
|
|
74
|
-
theme,
|
|
75
|
-
variant,
|
|
76
|
-
fullWidth,
|
|
77
|
-
...forwardedProps
|
|
78
|
-
} = otherProps;
|
|
79
|
-
const adaptedColor = color || emphasis !== Emphasis.high && theme === Theme.dark && ColorPalette.light || emphasis === Emphasis.high && ColorPalette.primary || ColorPalette.dark;
|
|
80
|
-
if (hasBackground) {
|
|
81
|
-
return renderButtonWrapper({
|
|
82
|
-
...props,
|
|
83
|
-
ref,
|
|
84
|
-
variant,
|
|
85
|
-
color: adaptedColor
|
|
86
|
-
});
|
|
87
|
-
}
|
|
88
|
-
const buttonClassName = classNames(className, handleBasicClasses({
|
|
89
|
-
color: adaptedColor,
|
|
90
|
-
emphasis,
|
|
91
|
-
isSelected,
|
|
92
|
-
isDisabled: props.isDisabled || props['aria-disabled'],
|
|
93
|
-
isActive,
|
|
94
|
-
isFocused,
|
|
95
|
-
isHovered,
|
|
96
|
-
prefix: BUTTON_CLASSNAME,
|
|
97
|
-
size,
|
|
98
|
-
theme: emphasis === Emphasis.high && theme,
|
|
99
|
-
variant,
|
|
100
|
-
fullWidth
|
|
101
|
-
}));
|
|
102
|
-
return /*#__PURE__*/jsx(RawClickable, {
|
|
103
|
-
as: linkAs || (forwardedProps.href ? 'a' : 'button'),
|
|
104
|
-
...forwardedProps,
|
|
105
|
-
...disabledStateProps,
|
|
106
|
-
"aria-disabled": isAnyDisabled,
|
|
107
|
-
"aria-label": ariaLabel,
|
|
108
|
-
ref: ref,
|
|
109
|
-
className: buttonClassName,
|
|
110
|
-
children: children
|
|
111
|
-
});
|
|
112
|
-
});
|
|
113
|
-
ButtonRoot.displayName = COMPONENT_NAME;
|
|
114
|
-
ButtonRoot.defaultProps = {};
|
|
115
|
-
|
|
116
|
-
export { ButtonRoot as B };
|
|
117
|
-
//# sourceMappingURL=ButtonRoot-823f3e9c.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"ButtonRoot-823f3e9c.js","sources":["../../src/components/button/ButtonRoot.tsx"],"sourcesContent":["import { AriaAttributes, ButtonHTMLAttributes, DetailedHTMLProps, RefObject } from 'react';\n\nimport classNames from 'classnames';\n\nimport { ColorPalette, Emphasis, Size, Theme } from '@lumx/react';\nimport { CSS_PREFIX } from '@lumx/react/constants';\nimport { GenericProps, HasTheme } from '@lumx/react/utils/type';\nimport { handleBasicClasses } from '@lumx/core/js/utils/className';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\nimport { HasAriaDisabled } from '@lumx/react/utils/type/HasAriaDisabled';\nimport { RawClickable } from '@lumx/react/utils/react/RawClickable';\nimport { useDisableStateProps } from '@lumx/react/utils/disabled';\n\ntype HTMLButtonProps = DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>;\n\n/**\n * Button size definition.\n */\nexport type ButtonSize = Extract<Size, 's' | 'm'>;\n\nexport interface BaseButtonProps\n extends GenericProps,\n Pick<AriaAttributes, 'aria-expanded' | 'aria-haspopup' | 'aria-pressed' | 'aria-label'>,\n HasTheme,\n HasAriaDisabled {\n /** Color variant. */\n color?: ColorPalette;\n /** Emphasis variant. */\n emphasis?: Emphasis;\n /** Whether or not the button has a background color in low emphasis. */\n hasBackground?: boolean;\n /** Native anchor href property. It determines whether the Button will be a <button> or an <a>. */\n href?: string;\n /** Whether the component is disabled or not. */\n isDisabled?: boolean;\n /** Whether the component is selected or not (unsupported in `high` emphasis). */\n isSelected?: boolean;\n /** Native button name property. */\n name?: string;\n /** Size variant. */\n size?: ButtonSize;\n /** Native anchor target property. */\n target?: '_self' | '_blank' | '_parent' | '_top';\n /** Native button type. */\n type?: HTMLButtonProps['type'];\n /** Custom react component for the link (can be used to inject react router Link). */\n linkAs?: 'a' | any;\n}\n\nexport interface ButtonRootProps extends BaseButtonProps {\n variant: 'button' | 'icon';\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'ButtonRoot';\n\nexport const BUTTON_WRAPPER_CLASSNAME = `${CSS_PREFIX}-button-wrapper`;\nexport const BUTTON_CLASSNAME = `${CSS_PREFIX}-button`;\n\n/**\n * Render a button wrapper with the ButtonRoot inside.\n *\n * @param props Component props.\n * @return React element.\n */\nconst renderButtonWrapper: React.FC<ButtonRootProps> = (props) => {\n const { color, emphasis, variant, fullWidth } = props;\n\n const adaptedColor =\n emphasis === Emphasis.low && (color === ColorPalette.light ? ColorPalette.dark : ColorPalette.light);\n\n const wrapperClassName = classNames(\n handleBasicClasses({\n color: adaptedColor,\n prefix: BUTTON_WRAPPER_CLASSNAME,\n variant,\n fullWidth,\n }),\n );\n const buttonProps = { ...props, hasBackground: false };\n\n return (\n <div className={wrapperClassName}>\n {/* eslint-disable-next-line @typescript-eslint/no-use-before-define */}\n <ButtonRoot {...buttonProps} />\n </div>\n );\n};\n\n/**\n * ButtonRoot component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const ButtonRoot = forwardRef<ButtonRootProps, HTMLButtonElement | HTMLAnchorElement>((props, ref) => {\n const { isAnyDisabled, disabledStateProps, otherProps } = useDisableStateProps(props);\n const {\n 'aria-label': ariaLabel,\n children,\n className,\n color,\n emphasis,\n hasBackground,\n isSelected,\n isActive,\n isFocused,\n isHovered,\n linkAs,\n size,\n theme,\n variant,\n fullWidth,\n ...forwardedProps\n } = otherProps;\n\n const adaptedColor =\n color ||\n (emphasis !== Emphasis.high && theme === Theme.dark && ColorPalette.light) ||\n (emphasis === Emphasis.high && ColorPalette.primary) ||\n ColorPalette.dark;\n\n if (hasBackground) {\n return renderButtonWrapper({ ...props, ref, variant, color: adaptedColor });\n }\n\n const buttonClassName = classNames(\n className,\n handleBasicClasses({\n color: adaptedColor,\n emphasis,\n isSelected,\n isDisabled: props.isDisabled || props['aria-disabled'],\n isActive,\n isFocused,\n isHovered,\n prefix: BUTTON_CLASSNAME,\n size,\n theme: emphasis === Emphasis.high && theme,\n variant,\n fullWidth,\n }),\n );\n\n return (\n <RawClickable\n as={linkAs || (forwardedProps.href ? 'a' : 'button')}\n {...forwardedProps}\n {...disabledStateProps}\n aria-disabled={isAnyDisabled}\n aria-label={ariaLabel}\n ref={ref as RefObject<HTMLButtonElement>}\n className={buttonClassName}\n >\n {children}\n </RawClickable>\n );\n});\nButtonRoot.displayName = COMPONENT_NAME;\nButtonRoot.defaultProps = {};\n"],"names":["COMPONENT_NAME","BUTTON_WRAPPER_CLASSNAME","CSS_PREFIX","BUTTON_CLASSNAME","renderButtonWrapper","props","color","emphasis","variant","fullWidth","adaptedColor","Emphasis","low","ColorPalette","light","dark","wrapperClassName","classNames","handleBasicClasses","prefix","buttonProps","hasBackground","_jsx","className","children","ButtonRoot","forwardRef","ref","isAnyDisabled","disabledStateProps","otherProps","useDisableStateProps","ariaLabel","isSelected","isActive","isFocused","isHovered","linkAs","size","theme","forwardedProps","high","Theme","primary","buttonClassName","isDisabled","RawClickable","as","href","displayName","defaultProps"],"mappings":"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"}
|
|
@@ -1,146 +0,0 @@
|
|
|
1
|
-
import { f as forwardRef, c as classNames } from './forwardRef-15f62847.js';
|
|
2
|
-
import isFunction from 'lodash/isFunction';
|
|
3
|
-
import { useCallback } from 'react';
|
|
4
|
-
import { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';
|
|
5
|
-
import { onEnterPressed } from '@lumx/core/js/utils';
|
|
6
|
-
import { u as useTheme } from './ThemeContext-3181f000.js';
|
|
7
|
-
import { u as useDisableStateProps } from './useDisableStateProps-69e16b7c.js';
|
|
8
|
-
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
9
|
-
import { Size, Theme, ColorPalette } from '@lumx/core/js/constants';
|
|
10
|
-
|
|
11
|
-
/**
|
|
12
|
-
* Wrap mouse event handler to stop event propagation.
|
|
13
|
-
*
|
|
14
|
-
* @param handler The mouse handler to wrap.
|
|
15
|
-
* @return Mouse handler stopping propagation.
|
|
16
|
-
*/
|
|
17
|
-
function useStopPropagation(handler) {
|
|
18
|
-
return useCallback(evt => {
|
|
19
|
-
if (!evt || !isFunction(handler)) {
|
|
20
|
-
return;
|
|
21
|
-
}
|
|
22
|
-
handler(evt);
|
|
23
|
-
evt.stopPropagation();
|
|
24
|
-
}, [handler]);
|
|
25
|
-
}
|
|
26
|
-
|
|
27
|
-
/**
|
|
28
|
-
* Component display name.
|
|
29
|
-
*/
|
|
30
|
-
const COMPONENT_NAME = 'Chip';
|
|
31
|
-
|
|
32
|
-
/**
|
|
33
|
-
* Component default class name and class prefix.
|
|
34
|
-
*/
|
|
35
|
-
const CLASSNAME = getRootClassName(COMPONENT_NAME);
|
|
36
|
-
|
|
37
|
-
/**
|
|
38
|
-
* Component default props.
|
|
39
|
-
*/
|
|
40
|
-
const DEFAULT_PROPS = {
|
|
41
|
-
size: Size.m
|
|
42
|
-
};
|
|
43
|
-
|
|
44
|
-
/**
|
|
45
|
-
* Chip component.
|
|
46
|
-
*
|
|
47
|
-
* @param props Component props.
|
|
48
|
-
* @param ref Component ref.
|
|
49
|
-
* @return React element.
|
|
50
|
-
*/
|
|
51
|
-
const Chip = forwardRef((props, ref) => {
|
|
52
|
-
const defaultTheme = useTheme() || Theme.light;
|
|
53
|
-
const {
|
|
54
|
-
isAnyDisabled,
|
|
55
|
-
disabledStateProps,
|
|
56
|
-
otherProps
|
|
57
|
-
} = useDisableStateProps(props);
|
|
58
|
-
const {
|
|
59
|
-
after,
|
|
60
|
-
before,
|
|
61
|
-
children,
|
|
62
|
-
className,
|
|
63
|
-
color,
|
|
64
|
-
isClickable: propIsClickable,
|
|
65
|
-
isHighlighted,
|
|
66
|
-
isSelected,
|
|
67
|
-
onAfterClick,
|
|
68
|
-
onBeforeClick,
|
|
69
|
-
onClick,
|
|
70
|
-
size = DEFAULT_PROPS.size,
|
|
71
|
-
theme = defaultTheme,
|
|
72
|
-
href,
|
|
73
|
-
onKeyDown,
|
|
74
|
-
...forwardedProps
|
|
75
|
-
} = otherProps;
|
|
76
|
-
const hasAfterClick = isFunction(onAfterClick);
|
|
77
|
-
const hasBeforeClick = isFunction(onBeforeClick);
|
|
78
|
-
const hasOnClick = isFunction(props.onClick);
|
|
79
|
-
const isButton = hasOnClick && !href;
|
|
80
|
-
const isClickable = Boolean(hasOnClick) || Boolean(href) || propIsClickable;
|
|
81
|
-
|
|
82
|
-
// Adapt color to the theme.
|
|
83
|
-
const chipColor = color || (theme === Theme.light ? ColorPalette.dark : ColorPalette.light);
|
|
84
|
-
const handleOnBeforeClick = useStopPropagation(onBeforeClick);
|
|
85
|
-
const handleOnAfterClick = useStopPropagation(onAfterClick);
|
|
86
|
-
const handleKeyDown = evt => {
|
|
87
|
-
onKeyDown?.(evt);
|
|
88
|
-
if (hasOnClick) {
|
|
89
|
-
onEnterPressed(onClick)(evt);
|
|
90
|
-
}
|
|
91
|
-
};
|
|
92
|
-
return (
|
|
93
|
-
/*#__PURE__*/
|
|
94
|
-
// eslint-disable-next-line jsx-a11y/no-static-element-interactions
|
|
95
|
-
jsxs("a", {
|
|
96
|
-
role: isButton ? 'button' : undefined,
|
|
97
|
-
tabIndex: isClickable && !disabledStateProps.disabled ? 0 : undefined,
|
|
98
|
-
...forwardedProps,
|
|
99
|
-
href: !disabledStateProps.disabled ? href : undefined,
|
|
100
|
-
ref: ref,
|
|
101
|
-
className: classNames(className, handleBasicClasses({
|
|
102
|
-
clickable: isClickable,
|
|
103
|
-
color: chipColor,
|
|
104
|
-
isDisabled: isAnyDisabled,
|
|
105
|
-
hasAfter: Boolean(after),
|
|
106
|
-
hasBefore: Boolean(before),
|
|
107
|
-
highlighted: Boolean(isHighlighted),
|
|
108
|
-
prefix: CLASSNAME,
|
|
109
|
-
selected: Boolean(isSelected),
|
|
110
|
-
size,
|
|
111
|
-
unselected: Boolean(!isSelected)
|
|
112
|
-
})),
|
|
113
|
-
"aria-disabled": isClickable && isAnyDisabled || undefined,
|
|
114
|
-
onClick: hasOnClick ? onClick : undefined,
|
|
115
|
-
onKeyDown: handleKeyDown,
|
|
116
|
-
children: [before &&
|
|
117
|
-
/*#__PURE__*/
|
|
118
|
-
// eslint-disable-next-line jsx-a11y/click-events-have-key-events,jsx-a11y/no-static-element-interactions
|
|
119
|
-
jsx("div", {
|
|
120
|
-
className: classNames(`${CLASSNAME}__before`, {
|
|
121
|
-
[`${CLASSNAME}__before--is-clickable`]: hasBeforeClick
|
|
122
|
-
}),
|
|
123
|
-
onClick: handleOnBeforeClick,
|
|
124
|
-
children: before
|
|
125
|
-
}), /*#__PURE__*/jsx("div", {
|
|
126
|
-
className: `${CLASSNAME}__label`,
|
|
127
|
-
children: children
|
|
128
|
-
}), after &&
|
|
129
|
-
/*#__PURE__*/
|
|
130
|
-
// eslint-disable-next-line jsx-a11y/click-events-have-key-events,jsx-a11y/no-static-element-interactions
|
|
131
|
-
jsx("div", {
|
|
132
|
-
className: classNames(`${CLASSNAME}__after`, {
|
|
133
|
-
[`${CLASSNAME}__after--is-clickable`]: hasAfterClick
|
|
134
|
-
}),
|
|
135
|
-
onClick: handleOnAfterClick,
|
|
136
|
-
children: after
|
|
137
|
-
})]
|
|
138
|
-
})
|
|
139
|
-
);
|
|
140
|
-
});
|
|
141
|
-
Chip.displayName = COMPONENT_NAME;
|
|
142
|
-
Chip.className = CLASSNAME;
|
|
143
|
-
Chip.defaultProps = DEFAULT_PROPS;
|
|
144
|
-
|
|
145
|
-
export { Chip as C };
|
|
146
|
-
//# sourceMappingURL=Chip-a34f6905.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Chip-a34f6905.js","sources":["../../src/hooks/useStopPropagation.ts","../../src/components/chip/Chip.tsx"],"sourcesContent":["import isFunction from 'lodash/isFunction';\nimport { MouseEventHandler, useCallback } from 'react';\n\n/**\n * Wrap mouse event handler to stop event propagation.\n *\n * @param handler The mouse handler to wrap.\n * @return Mouse handler stopping propagation.\n */\nexport function useStopPropagation(handler?: MouseEventHandler): MouseEventHandler {\n return useCallback(\n (evt) => {\n if (!evt || !isFunction(handler)) {\n return;\n }\n handler(evt);\n evt.stopPropagation();\n },\n [handler],\n );\n}\n","import { MouseEventHandler, ReactNode } from 'react';\n\nimport classNames from 'classnames';\nimport isFunction from 'lodash/isFunction';\n\nimport { ColorPalette, Size, Theme } from '@lumx/react';\nimport { useStopPropagation } from '@lumx/react/hooks/useStopPropagation';\n\nimport { GenericProps, HasTheme } from '@lumx/react/utils/type';\nimport { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';\nimport { onEnterPressed } from '@lumx/core/js/utils';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\nimport { useTheme } from '@lumx/react/utils/theme/ThemeContext';\nimport { useDisableStateProps } from '@lumx/react/utils/disabled/useDisableStateProps';\nimport { HasAriaDisabled } from '@lumx/react/utils/type/HasAriaDisabled';\n\n/**\n * Chip sizes.\n */\ntype ChipSize = Extract<Size, 's' | 'm'>;\n\n/**\n * Defines the props of the component.\n */\nexport interface ChipProps extends GenericProps, HasTheme, HasAriaDisabled {\n /** A component to be rendered after the content. */\n after?: ReactNode;\n /** A component to be rendered before the content. */\n before?: ReactNode;\n /** Color variant. */\n color?: ColorPalette;\n /** Whether the component is clickable or not. */\n isClickable?: boolean;\n /** Whether the component is disabled or not. */\n isDisabled?: boolean;\n /** Whether the chip is currently in a highlighted state or not. */\n isHighlighted?: boolean;\n /** Whether the component is selected or not. */\n isSelected?: boolean;\n /** Size variant. */\n size?: ChipSize;\n /** On \"after\" element clicked callback. */\n onAfterClick?: MouseEventHandler;\n /** On \"before\" element clicked callback. */\n onBeforeClick?: MouseEventHandler;\n /** Children */\n children?: React.ReactNode;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'Chip';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<ChipProps> = {\n size: Size.m,\n};\n\n/**\n * Chip component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const Chip = forwardRef<ChipProps, HTMLAnchorElement>((props, ref) => {\n const defaultTheme = useTheme() || Theme.light;\n const { isAnyDisabled, disabledStateProps, otherProps } = useDisableStateProps(props);\n const {\n after,\n before,\n children,\n className,\n color,\n isClickable: propIsClickable,\n isHighlighted,\n isSelected,\n onAfterClick,\n onBeforeClick,\n onClick,\n size = DEFAULT_PROPS.size,\n theme = defaultTheme,\n href,\n onKeyDown,\n ...forwardedProps\n } = otherProps;\n const hasAfterClick = isFunction(onAfterClick);\n const hasBeforeClick = isFunction(onBeforeClick);\n const hasOnClick = isFunction(props.onClick);\n const isButton = hasOnClick && !href;\n const isClickable = Boolean(hasOnClick) || Boolean(href) || propIsClickable;\n\n // Adapt color to the theme.\n const chipColor = color || (theme === Theme.light ? ColorPalette.dark : ColorPalette.light);\n\n const handleOnBeforeClick = useStopPropagation(onBeforeClick);\n const handleOnAfterClick = useStopPropagation(onAfterClick);\n const handleKeyDown = (evt: React.KeyboardEvent) => {\n onKeyDown?.(evt);\n if (hasOnClick) {\n onEnterPressed(onClick)(evt);\n }\n };\n\n return (\n // eslint-disable-next-line jsx-a11y/no-static-element-interactions\n <a\n role={isButton ? 'button' : undefined}\n tabIndex={isClickable && !disabledStateProps.disabled ? 0 : undefined}\n {...forwardedProps}\n href={!disabledStateProps.disabled ? href : undefined}\n ref={ref}\n className={classNames(\n className,\n handleBasicClasses({\n clickable: isClickable,\n color: chipColor,\n isDisabled: isAnyDisabled,\n hasAfter: Boolean(after),\n hasBefore: Boolean(before),\n highlighted: Boolean(isHighlighted),\n prefix: CLASSNAME,\n selected: Boolean(isSelected),\n size,\n unselected: Boolean(!isSelected),\n }),\n )}\n aria-disabled={(isClickable && isAnyDisabled) || undefined}\n onClick={hasOnClick ? onClick : undefined}\n onKeyDown={handleKeyDown}\n >\n {before && (\n // eslint-disable-next-line jsx-a11y/click-events-have-key-events,jsx-a11y/no-static-element-interactions\n <div\n className={classNames(`${CLASSNAME}__before`, {\n [`${CLASSNAME}__before--is-clickable`]: hasBeforeClick,\n })}\n onClick={handleOnBeforeClick}\n >\n {before}\n </div>\n )}\n <div className={`${CLASSNAME}__label`}>{children}</div>\n {after && (\n // eslint-disable-next-line jsx-a11y/click-events-have-key-events,jsx-a11y/no-static-element-interactions\n <div\n className={classNames(`${CLASSNAME}__after`, {\n [`${CLASSNAME}__after--is-clickable`]: hasAfterClick,\n })}\n onClick={handleOnAfterClick}\n >\n {after}\n </div>\n )}\n </a>\n );\n});\nChip.displayName = COMPONENT_NAME;\nChip.className = CLASSNAME;\nChip.defaultProps = DEFAULT_PROPS;\n"],"names":["useStopPropagation","handler","useCallback","evt","isFunction","stopPropagation","COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","size","Size","m","Chip","forwardRef","props","ref","defaultTheme","useTheme","Theme","light","isAnyDisabled","disabledStateProps","otherProps","useDisableStateProps","after","before","children","className","color","isClickable","propIsClickable","isHighlighted","isSelected","onAfterClick","onBeforeClick","onClick","theme","href","onKeyDown","forwardedProps","hasAfterClick","hasBeforeClick","hasOnClick","isButton","Boolean","chipColor","ColorPalette","dark","handleOnBeforeClick","handleOnAfterClick","handleKeyDown","onEnterPressed","_jsxs","role","undefined","tabIndex","disabled","classNames","handleBasicClasses","clickable","isDisabled","hasAfter","hasBefore","highlighted","prefix","selected","unselected","_jsx","displayName","defaultProps"],"mappings":"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"}
|