@lumx/react 3.20.1-alpha.12 → 3.20.1-alpha.14
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/index.js +236 -0
- package/_internal/index.js.map +1 -0
- package/index.d.ts +1 -1
- package/index.js +14440 -65
- package/index.js.map +1 -1
- package/package.json +11 -3
- 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/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/0420e67b.js +0 -119
- package/_internal/0420e67b.js.map +0 -1
- package/_internal/0a490b07.js +0 -75
- package/_internal/0a490b07.js.map +0 -1
- package/_internal/0b9c76cb.js +0 -6
- package/_internal/0b9c76cb.js.map +0 -1
- package/_internal/0be1006e.js +0 -97
- package/_internal/0be1006e.js.map +0 -1
- package/_internal/0d1a078c.js +0 -144
- package/_internal/0d1a078c.js.map +0 -1
- package/_internal/15eab19b.js +0 -75
- package/_internal/15eab19b.js.map +0 -1
- package/_internal/179a84d1.js +0 -259
- package/_internal/179a84d1.js.map +0 -1
- package/_internal/193521fa.js +0 -52
- package/_internal/193521fa.js.map +0 -1
- package/_internal/1a90ea3d.js +0 -51
- package/_internal/1a90ea3d.js.map +0 -1
- package/_internal/1deba7d7.js +0 -224
- package/_internal/1deba7d7.js.map +0 -1
- package/_internal/1ea72630.js +0 -146
- package/_internal/1ea72630.js.map +0 -1
- package/_internal/21b83d16.js +0 -137
- package/_internal/21b83d16.js.map +0 -1
- package/_internal/230173a8.js +0 -13
- package/_internal/230173a8.js.map +0 -1
- package/_internal/297bed8f.js +0 -457
- package/_internal/297bed8f.js.map +0 -1
- package/_internal/2a3d237c.js +0 -12
- package/_internal/2a3d237c.js.map +0 -1
- package/_internal/2c2b6a89.js +0 -52
- package/_internal/2c2b6a89.js.map +0 -1
- package/_internal/2f1716fa.js +0 -237
- package/_internal/2f1716fa.js.map +0 -1
- package/_internal/2f6c7f84.js +0 -103
- package/_internal/2f6c7f84.js.map +0 -1
- package/_internal/3181f000.js +0 -14
- package/_internal/3181f000.js.map +0 -1
- package/_internal/329b5f12.js +0 -55
- package/_internal/329b5f12.js.map +0 -1
- package/_internal/332e9844.js +0 -2
- package/_internal/332e9844.js.map +0 -1
- package/_internal/34c59f5b.js +0 -681
- package/_internal/34c59f5b.js.map +0 -1
- package/_internal/36bd7352.js +0 -219
- package/_internal/36bd7352.js.map +0 -1
- package/_internal/370bdaed.js +0 -61
- package/_internal/370bdaed.js.map +0 -1
- package/_internal/37b007a4.js +0 -20
- package/_internal/37b007a4.js.map +0 -1
- package/_internal/3a1facc0.js +0 -18
- package/_internal/3a1facc0.js.map +0 -1
- package/_internal/3a4e4636.js +0 -162
- package/_internal/3a4e4636.js.map +0 -1
- package/_internal/3e653144.js +0 -49
- package/_internal/3e653144.js.map +0 -1
- package/_internal/3f86608e.js +0 -45
- package/_internal/3f86608e.js.map +0 -1
- package/_internal/478b5c92.js +0 -24
- package/_internal/478b5c92.js.map +0 -1
- package/_internal/4962be5b.js +0 -121
- package/_internal/4962be5b.js.map +0 -1
- package/_internal/49bbeed3.js +0 -6
- package/_internal/49bbeed3.js.map +0 -1
- package/_internal/4cd870a5.js +0 -2155
- package/_internal/4cd870a5.js.map +0 -1
- package/_internal/4daccdd5.js.map +0 -1
- package/_internal/501f2f9f.js +0 -58
- package/_internal/501f2f9f.js.map +0 -1
- package/_internal/5e7b90e2.js +0 -2
- package/_internal/5e7b90e2.js.map +0 -1
- package/_internal/5ec059fe.js +0 -145
- package/_internal/5ec059fe.js.map +0 -1
- package/_internal/5f8f9454.js +0 -70
- package/_internal/5f8f9454.js.map +0 -1
- package/_internal/5fe09341.js +0 -112
- package/_internal/5fe09341.js.map +0 -1
- package/_internal/628468c4.js +0 -313
- package/_internal/628468c4.js.map +0 -1
- package/_internal/6589b796.js +0 -280
- package/_internal/6589b796.js.map +0 -1
- package/_internal/65f91970.js +0 -297
- package/_internal/65f91970.js.map +0 -1
- package/_internal/66f691d3.js +0 -74
- package/_internal/66f691d3.js.map +0 -1
- package/_internal/68c10f98.js +0 -166
- package/_internal/68c10f98.js.map +0 -1
- package/_internal/690ca33e.js +0 -109
- package/_internal/690ca33e.js.map +0 -1
- package/_internal/6ca04271.js +0 -108
- package/_internal/6ca04271.js.map +0 -1
- package/_internal/6da19518.js +0 -165
- package/_internal/6da19518.js.map +0 -1
- package/_internal/7093ba23.js +0 -95
- package/_internal/7093ba23.js.map +0 -1
- package/_internal/74a4a214.js +0 -82
- package/_internal/74a4a214.js.map +0 -1
- package/_internal/76be70dd.js +0 -42
- package/_internal/76be70dd.js.map +0 -1
- package/_internal/78df9309.js +0 -20
- package/_internal/78df9309.js.map +0 -1
- package/_internal/7b221b05.js +0 -9
- package/_internal/7b221b05.js.map +0 -1
- package/_internal/7daf0f24.js +0 -77
- package/_internal/7daf0f24.js.map +0 -1
- package/_internal/7f54e947.js +0 -758
- package/_internal/7f54e947.js.map +0 -1
- package/_internal/825ac334.js +0 -130
- package/_internal/825ac334.js.map +0 -1
- package/_internal/827b804a.js +0 -6
- package/_internal/827b804a.js.map +0 -1
- package/_internal/84dfe68f.js +0 -436
- package/_internal/84dfe68f.js.map +0 -1
- package/_internal/85e3a5ca.js +0 -145
- package/_internal/85e3a5ca.js.map +0 -1
- package/_internal/86aa4aa4.js +0 -154
- package/_internal/86aa4aa4.js.map +0 -1
- package/_internal/88ec77c2.js +0 -130
- package/_internal/88ec77c2.js.map +0 -1
- package/_internal/8ab42752.js +0 -103
- package/_internal/8ab42752.js.map +0 -1
- package/_internal/95cfd814.js +0 -70
- package/_internal/95cfd814.js.map +0 -1
- package/_internal/9a4dfad0.js +0 -326
- package/_internal/9a4dfad0.js.map +0 -1
- package/_internal/9c9df5f2.js +0 -80
- package/_internal/9c9df5f2.js.map +0 -1
- package/_internal/9d1336a1.js +0 -19
- package/_internal/9d1336a1.js.map +0 -1
- package/_internal/9fdc715b.js +0 -152
- package/_internal/9fdc715b.js.map +0 -1
- package/_internal/a003602b.js +0 -116
- package/_internal/a003602b.js.map +0 -1
- package/_internal/a34639bd.js +0 -97
- package/_internal/a34639bd.js.map +0 -1
- package/_internal/a84f4981.js +0 -122
- package/_internal/a84f4981.js.map +0 -1
- package/_internal/b0a7a999.js +0 -59
- package/_internal/b0a7a999.js.map +0 -1
- package/_internal/b0b2e33d.js +0 -359
- package/_internal/b0b2e33d.js.map +0 -1
- package/_internal/b1af5979.js +0 -653
- package/_internal/b1af5979.js.map +0 -1
- package/_internal/b477da26.js +0 -164
- package/_internal/b477da26.js.map +0 -1
- package/_internal/b8667090.js +0 -36
- package/_internal/b8667090.js.map +0 -1
- package/_internal/bae266a9.js +0 -61
- package/_internal/bae266a9.js.map +0 -1
- package/_internal/be6da9b0.js +0 -296
- package/_internal/be6da9b0.js.map +0 -1
- package/_internal/c0414b89.js +0 -101
- package/_internal/c0414b89.js.map +0 -1
- package/_internal/c2388b10.js +0 -58
- package/_internal/c2388b10.js.map +0 -1
- package/_internal/c459a04d.js +0 -148
- package/_internal/c459a04d.js.map +0 -1
- package/_internal/c6ca7494.js +0 -2
- package/_internal/c6ca7494.js.map +0 -1
- package/_internal/cdddaed8.js +0 -116
- package/_internal/cdddaed8.js.map +0 -1
- package/_internal/d0dd1815.js +0 -10
- package/_internal/d0dd1815.js.map +0 -1
- package/_internal/d45e3f16.js +0 -15
- package/_internal/d45e3f16.js.map +0 -1
- package/_internal/d5f316cb.js +0 -62
- package/_internal/d5f316cb.js.map +0 -1
- package/_internal/db4fdc7b.js +0 -310
- package/_internal/db4fdc7b.js.map +0 -1
- package/_internal/dbe0cf24.js +0 -75
- package/_internal/dbe0cf24.js.map +0 -1
- package/_internal/de24f857.js +0 -4
- package/_internal/de24f857.js.map +0 -1
- package/_internal/e2afb13f.js +0 -75
- package/_internal/e2afb13f.js.map +0 -1
- package/_internal/e52f0d3f.js +0 -94
- package/_internal/e52f0d3f.js.map +0 -1
- package/_internal/e6dd117e.js +0 -50
- package/_internal/e6dd117e.js.map +0 -1
- package/_internal/e806b848.js +0 -9
- package/_internal/e806b848.js.map +0 -1
- package/_internal/ea04260d.js +0 -29
- package/_internal/ea04260d.js.map +0 -1
- package/_internal/eaa8b1d8.js +0 -150
- package/_internal/eaa8b1d8.js.map +0 -1
- package/_internal/eaf6c45a.js +0 -4
- package/_internal/eaf6c45a.js.map +0 -1
- package/_internal/edab29ce.js +0 -308
- package/_internal/edab29ce.js.map +0 -1
- package/_internal/ef5d1aac.js +0 -4
- package/_internal/ef5d1aac.js.map +0 -1
- package/_internal/f0900583.js +0 -142
- package/_internal/f0900583.js.map +0 -1
- package/_internal/f0d7d6ea.js +0 -30
- package/_internal/f0d7d6ea.js.map +0 -1
- package/_internal/f23cdf84.js +0 -181
- package/_internal/f23cdf84.js.map +0 -1
- package/_internal/f52e979e.js +0 -3
- package/_internal/f52e979e.js.map +0 -1
- package/_internal/f5508d3d.js +0 -792
- package/_internal/f5508d3d.js.map +0 -1
- package/_internal/f93fe83e.js +0 -46
- package/_internal/f93fe83e.js.map +0 -1
- /package/_internal/{d95844c1.d.ts → Falsy.d.ts} +0 -0
package/_internal/5ec059fe.js
DELETED
|
@@ -1,145 +0,0 @@
|
|
|
1
|
-
import { useRef } from 'react';
|
|
2
|
-
import { m as getRootClassName, n as forwardRef, b as Theme, l as classNames, c as Size, d as Emphasis, N as NOTIFICATION_TRANSITION_DURATION } from './6589b796.js';
|
|
3
|
-
import isFunction from 'lodash/isFunction';
|
|
4
|
-
import { D as DOCUMENT } from './478b5c92.js';
|
|
5
|
-
import { m as mdiAlert, a as mdiInformation } from './49bbeed3.js';
|
|
6
|
-
import { m as mdiCheckCircle } from './de24f857.js';
|
|
7
|
-
import { m as mdiAlertCircle, I as Icon } from './8ab42752.js';
|
|
8
|
-
import { h as handleBasicClasses } from './e2afb13f.js';
|
|
9
|
-
import { u as useTransitionVisibility } from './e6dd117e.js';
|
|
10
|
-
import { m as mergeRefs } from './f0d7d6ea.js';
|
|
11
|
-
import { u as useTheme } from './3181f000.js';
|
|
12
|
-
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
13
|
-
import { P as Portal } from './3f86608e.js';
|
|
14
|
-
import { a as Button } from './a34639bd.js';
|
|
15
|
-
|
|
16
|
-
/**
|
|
17
|
-
* Notification icon and colors according to their type.
|
|
18
|
-
*/
|
|
19
|
-
const NOTIFICATION_CONFIGURATION = {
|
|
20
|
-
error: {
|
|
21
|
-
color: 'red',
|
|
22
|
-
icon: mdiAlert
|
|
23
|
-
},
|
|
24
|
-
info: {
|
|
25
|
-
color: 'blue',
|
|
26
|
-
icon: mdiInformation
|
|
27
|
-
},
|
|
28
|
-
success: {
|
|
29
|
-
color: 'green',
|
|
30
|
-
icon: mdiCheckCircle
|
|
31
|
-
},
|
|
32
|
-
warning: {
|
|
33
|
-
color: 'yellow',
|
|
34
|
-
icon: mdiAlertCircle
|
|
35
|
-
}
|
|
36
|
-
};
|
|
37
|
-
|
|
38
|
-
/**
|
|
39
|
-
* Component display name.
|
|
40
|
-
*/
|
|
41
|
-
const COMPONENT_NAME = 'Notification';
|
|
42
|
-
|
|
43
|
-
/**
|
|
44
|
-
* Component default class name and class prefix.
|
|
45
|
-
*/
|
|
46
|
-
const CLASSNAME = getRootClassName(COMPONENT_NAME);
|
|
47
|
-
|
|
48
|
-
/**
|
|
49
|
-
* Component default props.
|
|
50
|
-
*/
|
|
51
|
-
const DEFAULT_PROPS = {
|
|
52
|
-
zIndex: 9999,
|
|
53
|
-
usePortal: true
|
|
54
|
-
};
|
|
55
|
-
|
|
56
|
-
/* eslint-disable react-hooks/rules-of-hooks, jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions */
|
|
57
|
-
/**
|
|
58
|
-
* Notification component.
|
|
59
|
-
*
|
|
60
|
-
* @param props Component props.
|
|
61
|
-
* @param ref Component ref.
|
|
62
|
-
* @return React element.
|
|
63
|
-
*/
|
|
64
|
-
const Notification = forwardRef((props, ref) => {
|
|
65
|
-
const defaultTheme = useTheme() || Theme.light;
|
|
66
|
-
const {
|
|
67
|
-
actionLabel,
|
|
68
|
-
className,
|
|
69
|
-
content,
|
|
70
|
-
isOpen,
|
|
71
|
-
onActionClick,
|
|
72
|
-
onClick,
|
|
73
|
-
theme = defaultTheme,
|
|
74
|
-
type,
|
|
75
|
-
zIndex = DEFAULT_PROPS.zIndex,
|
|
76
|
-
usePortal = DEFAULT_PROPS.usePortal,
|
|
77
|
-
style,
|
|
78
|
-
...forwardedProps
|
|
79
|
-
} = props;
|
|
80
|
-
if (!DOCUMENT) {
|
|
81
|
-
// Can't render in SSR.
|
|
82
|
-
return null;
|
|
83
|
-
}
|
|
84
|
-
const {
|
|
85
|
-
color,
|
|
86
|
-
icon
|
|
87
|
-
} = NOTIFICATION_CONFIGURATION[type] || {};
|
|
88
|
-
const rootRef = useRef(null);
|
|
89
|
-
const isVisible = useTransitionVisibility(rootRef, !!isOpen, NOTIFICATION_TRANSITION_DURATION);
|
|
90
|
-
const hasAction = Boolean(onActionClick) && Boolean(actionLabel);
|
|
91
|
-
const handleCallback = evt => {
|
|
92
|
-
if (isFunction(onActionClick)) {
|
|
93
|
-
onActionClick();
|
|
94
|
-
}
|
|
95
|
-
evt.stopPropagation();
|
|
96
|
-
};
|
|
97
|
-
if (!type || !isVisible) {
|
|
98
|
-
return null;
|
|
99
|
-
}
|
|
100
|
-
return /*#__PURE__*/jsx(Portal, {
|
|
101
|
-
enabled: usePortal,
|
|
102
|
-
children: /*#__PURE__*/jsxs("div", {
|
|
103
|
-
ref: mergeRefs(ref, rootRef),
|
|
104
|
-
role: "alert",
|
|
105
|
-
...forwardedProps,
|
|
106
|
-
className: classNames(className, handleBasicClasses({
|
|
107
|
-
color,
|
|
108
|
-
hasAction,
|
|
109
|
-
isHidden: !isOpen,
|
|
110
|
-
prefix: CLASSNAME
|
|
111
|
-
})),
|
|
112
|
-
onClick: onClick,
|
|
113
|
-
style: {
|
|
114
|
-
...style,
|
|
115
|
-
zIndex
|
|
116
|
-
},
|
|
117
|
-
children: [/*#__PURE__*/jsx("div", {
|
|
118
|
-
className: `${CLASSNAME}__icon`,
|
|
119
|
-
children: /*#__PURE__*/jsx(Icon, {
|
|
120
|
-
icon: icon,
|
|
121
|
-
size: Size.s
|
|
122
|
-
})
|
|
123
|
-
}), /*#__PURE__*/jsx("div", {
|
|
124
|
-
className: `${CLASSNAME}__content`,
|
|
125
|
-
children: content
|
|
126
|
-
}), hasAction && /*#__PURE__*/jsx("div", {
|
|
127
|
-
className: `${CLASSNAME}__action`,
|
|
128
|
-
children: /*#__PURE__*/jsx(Button, {
|
|
129
|
-
emphasis: Emphasis.medium,
|
|
130
|
-
theme: theme,
|
|
131
|
-
onClick: handleCallback,
|
|
132
|
-
children: /*#__PURE__*/jsx("span", {
|
|
133
|
-
children: actionLabel
|
|
134
|
-
})
|
|
135
|
-
})
|
|
136
|
-
})]
|
|
137
|
-
})
|
|
138
|
-
});
|
|
139
|
-
});
|
|
140
|
-
Notification.displayName = COMPONENT_NAME;
|
|
141
|
-
Notification.className = CLASSNAME;
|
|
142
|
-
Notification.defaultProps = DEFAULT_PROPS;
|
|
143
|
-
|
|
144
|
-
export { Notification };
|
|
145
|
-
//# sourceMappingURL=5ec059fe.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"5ec059fe.js","sources":["../../src/components/notification/constants.ts","../../src/components/notification/Notification.tsx"],"sourcesContent":["import { mdiAlert, mdiAlertCircle, mdiCheckCircle, mdiInformation } from '@lumx/icons';\n\n/**\n * Notification delay before hiding.\n */\nexport const HIDE_DELAY = 6000;\n\n/**\n * Notification icon and colors according to their type.\n */\nexport const NOTIFICATION_CONFIGURATION = {\n error: {\n color: 'red',\n icon: mdiAlert,\n },\n info: {\n color: 'blue',\n icon: mdiInformation,\n },\n success: {\n color: 'green',\n icon: mdiCheckCircle,\n },\n warning: {\n color: 'yellow',\n icon: mdiAlertCircle,\n },\n};\n","import { useRef } from 'react';\n\nimport classNames from 'classnames';\nimport isFunction from 'lodash/isFunction';\n\nimport { Button, Emphasis, Icon, Kind, Size, Theme } from '@lumx/react';\nimport { DOCUMENT, NOTIFICATION_TRANSITION_DURATION } from '@lumx/react/constants';\nimport { NOTIFICATION_CONFIGURATION } from '@lumx/react/components/notification/constants';\nimport { GenericProps, HasTheme } from '@lumx/react/utils/type';\nimport { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';\nimport { useTransitionVisibility } from '@lumx/react/hooks/useTransitionVisibility';\nimport { mergeRefs } from '@lumx/react/utils/react/mergeRefs';\nimport { useTheme } from '@lumx/react/utils/theme/ThemeContext';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\n\nimport { Portal } from '@lumx/react/utils';\n\n/**\n * Defines the props of the component.\n */\nexport interface NotificationProps extends GenericProps, HasTheme {\n /** Action button label. */\n actionLabel?: string;\n /** Content. */\n content?: React.ReactNode;\n /** Whether the component is open or not. */\n isOpen?: boolean;\n /** Notification type. */\n type?: Kind;\n /** Z-axis position. */\n zIndex?: number;\n /** On action button click callback. */\n onActionClick?(): void;\n /** On click callback. */\n onClick?(): void;\n /** Whether the notification should be rendered into a DOM node that exists outside the DOM hierarchy of the parent component. */\n usePortal?: boolean;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'Notification';\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<NotificationProps> = {\n zIndex: 9999,\n usePortal: true,\n};\n\n/* eslint-disable react-hooks/rules-of-hooks, jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions */\n/**\n * Notification component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const Notification = forwardRef<NotificationProps, HTMLDivElement>((props, ref) => {\n const defaultTheme = useTheme() || Theme.light;\n const {\n actionLabel,\n className,\n content,\n isOpen,\n onActionClick,\n onClick,\n theme = defaultTheme,\n type,\n zIndex = DEFAULT_PROPS.zIndex,\n usePortal = DEFAULT_PROPS.usePortal,\n style,\n ...forwardedProps\n } = props;\n if (!DOCUMENT) {\n // Can't render in SSR.\n return null;\n }\n const { color, icon } = NOTIFICATION_CONFIGURATION[type as Kind] || {};\n const rootRef = useRef<HTMLDivElement>(null);\n const isVisible = useTransitionVisibility(rootRef, !!isOpen, NOTIFICATION_TRANSITION_DURATION);\n const hasAction: boolean = Boolean(onActionClick) && Boolean(actionLabel);\n\n const handleCallback = (evt: React.MouseEvent) => {\n if (isFunction(onActionClick)) {\n onActionClick();\n }\n evt.stopPropagation();\n };\n\n if (!type || !isVisible) {\n return null;\n }\n\n return (\n <Portal enabled={usePortal}>\n {/* eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions */}\n <div\n ref={mergeRefs(ref, rootRef)}\n role=\"alert\"\n {...forwardedProps}\n className={classNames(\n className,\n handleBasicClasses({\n color,\n hasAction,\n isHidden: !isOpen,\n prefix: CLASSNAME,\n }),\n )}\n onClick={onClick}\n style={{ ...style, zIndex }}\n >\n <div className={`${CLASSNAME}__icon`}>\n <Icon icon={icon} size={Size.s} />\n </div>\n <div className={`${CLASSNAME}__content`}>{content}</div>\n {hasAction && (\n <div className={`${CLASSNAME}__action`}>\n <Button emphasis={Emphasis.medium} theme={theme} onClick={handleCallback}>\n <span>{actionLabel}</span>\n </Button>\n </div>\n )}\n </div>\n </Portal>\n );\n});\nNotification.displayName = COMPONENT_NAME;\nNotification.className = CLASSNAME;\nNotification.defaultProps = DEFAULT_PROPS;\n"],"names":["NOTIFICATION_CONFIGURATION","error","color","icon","mdiAlert","info","mdiInformation","success","mdiCheckCircle","warning","mdiAlertCircle","COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","zIndex","usePortal","Notification","forwardRef","props","ref","defaultTheme","useTheme","Theme","light","actionLabel","className","content","isOpen","onActionClick","onClick","theme","type","style","forwardedProps","DOCUMENT","rootRef","useRef","isVisible","useTransitionVisibility","NOTIFICATION_TRANSITION_DURATION","hasAction","Boolean","handleCallback","evt","isFunction","stopPropagation","_jsx","Portal","enabled","children","_jsxs","mergeRefs","role","classNames","handleBasicClasses","isHidden","prefix","Icon","size","Size","s","Button","emphasis","Emphasis","medium","displayName","defaultProps"],"mappings":"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"}
|
package/_internal/5f8f9454.js
DELETED
|
@@ -1,70 +0,0 @@
|
|
|
1
|
-
import { m as getRootClassName, K as Kind, n as forwardRef, b as Theme, l as classNames } from './6589b796.js';
|
|
2
|
-
import { h as handleBasicClasses } from './e2afb13f.js';
|
|
3
|
-
import { u as useTheme } from './3181f000.js';
|
|
4
|
-
import { jsx } from 'react/jsx-runtime';
|
|
5
|
-
|
|
6
|
-
const INPUT_HELPER_CONFIGURATION = {
|
|
7
|
-
error: {
|
|
8
|
-
color: 'red'
|
|
9
|
-
},
|
|
10
|
-
success: {
|
|
11
|
-
color: 'green'
|
|
12
|
-
},
|
|
13
|
-
warning: {
|
|
14
|
-
color: 'yellow'
|
|
15
|
-
}
|
|
16
|
-
};
|
|
17
|
-
|
|
18
|
-
/**
|
|
19
|
-
* Component display name.
|
|
20
|
-
*/
|
|
21
|
-
const COMPONENT_NAME = 'InputHelper';
|
|
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
|
-
kind: Kind.info
|
|
33
|
-
};
|
|
34
|
-
|
|
35
|
-
/**
|
|
36
|
-
* InputHelper component.
|
|
37
|
-
*
|
|
38
|
-
* @param props Component props.
|
|
39
|
-
* @param ref Component ref.
|
|
40
|
-
* @return React element.
|
|
41
|
-
*/
|
|
42
|
-
const InputHelper = forwardRef((props, ref) => {
|
|
43
|
-
const defaultTheme = useTheme() || Theme.light;
|
|
44
|
-
const {
|
|
45
|
-
children,
|
|
46
|
-
className,
|
|
47
|
-
kind = DEFAULT_PROPS.kind,
|
|
48
|
-
theme = defaultTheme,
|
|
49
|
-
...forwardedProps
|
|
50
|
-
} = props;
|
|
51
|
-
const {
|
|
52
|
-
color
|
|
53
|
-
} = INPUT_HELPER_CONFIGURATION[kind] || {};
|
|
54
|
-
return /*#__PURE__*/jsx("p", {
|
|
55
|
-
ref: ref,
|
|
56
|
-
...forwardedProps,
|
|
57
|
-
className: classNames(className, handleBasicClasses({
|
|
58
|
-
prefix: CLASSNAME,
|
|
59
|
-
color,
|
|
60
|
-
theme
|
|
61
|
-
})),
|
|
62
|
-
children: children
|
|
63
|
-
});
|
|
64
|
-
});
|
|
65
|
-
InputHelper.displayName = COMPONENT_NAME;
|
|
66
|
-
InputHelper.className = CLASSNAME;
|
|
67
|
-
InputHelper.defaultProps = DEFAULT_PROPS;
|
|
68
|
-
|
|
69
|
-
export { InputHelper };
|
|
70
|
-
//# sourceMappingURL=5f8f9454.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"5f8f9454.js","sources":["../../src/components/input-helper/constants.ts","../../src/components/input-helper/InputHelper.tsx"],"sourcesContent":["export const INPUT_HELPER_CONFIGURATION: Record<string, { color: string }> = {\n error: {\n color: 'red',\n },\n success: {\n color: 'green',\n },\n warning: {\n color: 'yellow',\n },\n};\n","import { ReactNode } from 'react';\n\nimport classNames from 'classnames';\n\nimport { Kind, Theme } from '@lumx/react';\nimport { GenericProps, HasTheme } from '@lumx/react/utils/type';\nimport { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\n\nimport { useTheme } from '@lumx/react/utils/theme/ThemeContext';\nimport { INPUT_HELPER_CONFIGURATION } from './constants';\n\n/**\n * Defines the props of the component.\n */\nexport interface InputHelperProps extends GenericProps, HasTheme {\n /** Helper content. */\n children: string | ReactNode;\n /** Helper variant. */\n kind?: Kind;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'InputHelper';\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<InputHelperProps> = {\n kind: Kind.info,\n};\n\n/**\n * InputHelper component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const InputHelper = forwardRef<InputHelperProps, HTMLParagraphElement>((props, ref) => {\n const defaultTheme = useTheme() || Theme.light;\n const { children, className, kind = DEFAULT_PROPS.kind, theme = defaultTheme, ...forwardedProps } = props;\n const { color } = INPUT_HELPER_CONFIGURATION[kind as any] || {};\n\n return (\n <p\n ref={ref}\n {...forwardedProps}\n className={classNames(className, handleBasicClasses({ prefix: CLASSNAME, color, theme }))}\n >\n {children}\n </p>\n );\n});\n\nInputHelper.displayName = COMPONENT_NAME;\nInputHelper.className = CLASSNAME;\nInputHelper.defaultProps = DEFAULT_PROPS;\n"],"names":["INPUT_HELPER_CONFIGURATION","error","color","success","warning","COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","kind","Kind","info","InputHelper","forwardRef","props","ref","defaultTheme","useTheme","Theme","light","children","className","theme","forwardedProps","_jsx","classNames","handleBasicClasses","prefix","displayName","defaultProps"],"mappings":";;;;;AAAO,MAAMA,0BAA6D,GAAG;AACzEC,EAAAA,KAAK,EAAE;AACHC,IAAAA,KAAK,EAAE,KAAA;GACV;AACDC,EAAAA,OAAO,EAAE;AACLD,IAAAA,KAAK,EAAE,OAAA;GACV;AACDE,EAAAA,OAAO,EAAE;AACLF,IAAAA,KAAK,EAAE,QAAA;AACX,GAAA;AACJ,CAAC;;ACYD;AACA;AACA;AACA,MAAMG,cAAc,GAAG,aAAa,CAAA;;AAEpC;AACA;AACA;AACA,MAAMC,SAAS,GAAGC,gBAAgB,CAACF,cAAc,CAAC,CAAA;;AAElD;AACA;AACA;AACA,MAAMG,aAAwC,GAAG;EAC7CC,IAAI,EAAEC,IAAI,CAACC,IAAAA;AACf,CAAC,CAAA;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMC,WAAW,GAAGC,UAAU,CAAyC,CAACC,KAAK,EAAEC,GAAG,KAAK;EAC1F,MAAMC,YAAY,GAAGC,QAAQ,EAAE,IAAIC,KAAK,CAACC,KAAK,CAAA;EAC9C,MAAM;IAAEC,QAAQ;IAAEC,SAAS;IAAEZ,IAAI,GAAGD,aAAa,CAACC,IAAI;AAAEa,IAAAA,KAAK,GAAGN,YAAY;IAAE,GAAGO,cAAAA;AAAe,GAAC,GAAGT,KAAK,CAAA;EACzG,MAAM;AAAEZ,IAAAA,KAAAA;AAAM,GAAC,GAAGF,0BAA0B,CAACS,IAAI,CAAQ,IAAI,EAAE,CAAA;AAE/D,EAAA,oBACIe,GAAA,CAAA,GAAA,EAAA;AACIT,IAAAA,GAAG,EAAEA,GAAI;AAAA,IAAA,GACLQ,cAAc;AAClBF,IAAAA,SAAS,EAAEI,UAAU,CAACJ,SAAS,EAAEK,kBAAkB,CAAC;AAAEC,MAAAA,MAAM,EAAErB,SAAS;MAAEJ,KAAK;AAAEoB,MAAAA,KAAAA;AAAM,KAAC,CAAC,CAAE;AAAAF,IAAAA,QAAA,EAEzFA,QAAAA;AAAQ,GACV,CAAC,CAAA;AAEZ,CAAC,EAAC;AAEFR,WAAW,CAACgB,WAAW,GAAGvB,cAAc,CAAA;AACxCO,WAAW,CAACS,SAAS,GAAGf,SAAS,CAAA;AACjCM,WAAW,CAACiB,YAAY,GAAGrB,aAAa;;;;"}
|
package/_internal/5fe09341.js
DELETED
|
@@ -1,112 +0,0 @@
|
|
|
1
|
-
import { useEffect } from 'react';
|
|
2
|
-
import { D as DOCUMENT } from './478b5c92.js';
|
|
3
|
-
import { g as getFocusableElements } from './230173a8.js';
|
|
4
|
-
import { m as makeListenerTowerContext } from './d5f316cb.js';
|
|
5
|
-
|
|
6
|
-
/**
|
|
7
|
-
* Get first and last elements focusable in an element.
|
|
8
|
-
*
|
|
9
|
-
* @param parentElement The element in which to search focusable elements.
|
|
10
|
-
* @return first and last focusable elements
|
|
11
|
-
*/
|
|
12
|
-
function getFirstAndLastFocusable(parentElement) {
|
|
13
|
-
const focusableElements = getFocusableElements(parentElement);
|
|
14
|
-
|
|
15
|
-
// First non disabled element.
|
|
16
|
-
const first = focusableElements[0];
|
|
17
|
-
// Last non disabled element.
|
|
18
|
-
const last = focusableElements[focusableElements.length - 1];
|
|
19
|
-
if (last && first) {
|
|
20
|
-
return {
|
|
21
|
-
first,
|
|
22
|
-
last
|
|
23
|
-
};
|
|
24
|
-
}
|
|
25
|
-
return {};
|
|
26
|
-
}
|
|
27
|
-
|
|
28
|
-
const FOCUS_TRAPS = makeListenerTowerContext();
|
|
29
|
-
|
|
30
|
-
/**
|
|
31
|
-
* Trap 'Tab' focus switch inside the `focusZoneElement`.
|
|
32
|
-
*
|
|
33
|
-
* If multiple focus trap are activated, only the last one is maintained and when a focus trap closes, the previous one
|
|
34
|
-
* gets activated again.
|
|
35
|
-
*
|
|
36
|
-
* @param focusZoneElement The element in which to trap the focus.
|
|
37
|
-
* @param focusElement The element to focus when the focus trap is activated (otherwise the first focusable element
|
|
38
|
-
* will be focused).
|
|
39
|
-
*/
|
|
40
|
-
function useFocusTrap(focusZoneElement, focusElement) {
|
|
41
|
-
useEffect(() => {
|
|
42
|
-
// Body element can be undefined in SSR context.
|
|
43
|
-
const rootElement = DOCUMENT?.body;
|
|
44
|
-
if (!rootElement || !focusZoneElement) {
|
|
45
|
-
return undefined;
|
|
46
|
-
}
|
|
47
|
-
|
|
48
|
-
// Use the shadow root as focusZoneElement when available
|
|
49
|
-
const focusZoneElementOrShadowRoot = focusZoneElement.shadowRoot || focusZoneElement;
|
|
50
|
-
|
|
51
|
-
// Trap 'Tab' key down focus switch into the focus zone.
|
|
52
|
-
const trapTabFocusInFocusZone = evt => {
|
|
53
|
-
const {
|
|
54
|
-
key
|
|
55
|
-
} = evt;
|
|
56
|
-
if (key !== 'Tab') {
|
|
57
|
-
return;
|
|
58
|
-
}
|
|
59
|
-
const focusable = getFirstAndLastFocusable(focusZoneElementOrShadowRoot);
|
|
60
|
-
|
|
61
|
-
// Prevent focus switch if no focusable available.
|
|
62
|
-
if (!focusable.first) {
|
|
63
|
-
evt.preventDefault();
|
|
64
|
-
return;
|
|
65
|
-
}
|
|
66
|
-
const activeElement = focusZoneElement.shadowRoot ? focusZoneElement.shadowRoot.activeElement : document.activeElement;
|
|
67
|
-
if (
|
|
68
|
-
// No previous focus
|
|
69
|
-
!activeElement ||
|
|
70
|
-
// Previous focus is at the end of the focus zone.
|
|
71
|
-
!evt.shiftKey && activeElement === focusable.last ||
|
|
72
|
-
// Previous focus is outside the focus zone
|
|
73
|
-
!focusZoneElementOrShadowRoot.contains(activeElement)) {
|
|
74
|
-
focusable.first.focus();
|
|
75
|
-
evt.preventDefault();
|
|
76
|
-
return;
|
|
77
|
-
}
|
|
78
|
-
if (
|
|
79
|
-
// Focus order reversed
|
|
80
|
-
evt.shiftKey &&
|
|
81
|
-
// Previous focus is at the start of the focus zone.
|
|
82
|
-
activeElement === focusable.first) {
|
|
83
|
-
focusable.last.focus();
|
|
84
|
-
evt.preventDefault();
|
|
85
|
-
}
|
|
86
|
-
};
|
|
87
|
-
const focusTrap = {
|
|
88
|
-
enable: () => rootElement.addEventListener('keydown', trapTabFocusInFocusZone),
|
|
89
|
-
disable: () => rootElement.removeEventListener('keydown', trapTabFocusInFocusZone)
|
|
90
|
-
};
|
|
91
|
-
|
|
92
|
-
// SETUP:
|
|
93
|
-
if (focusElement && focusZoneElementOrShadowRoot.contains(focusElement)) {
|
|
94
|
-
// Focus the given element.
|
|
95
|
-
focusElement.focus({
|
|
96
|
-
preventScroll: true
|
|
97
|
-
});
|
|
98
|
-
} else {
|
|
99
|
-
// Focus the first focusable element in the zone.
|
|
100
|
-
getFirstAndLastFocusable(focusZoneElementOrShadowRoot).first?.focus({
|
|
101
|
-
preventScroll: true
|
|
102
|
-
});
|
|
103
|
-
}
|
|
104
|
-
FOCUS_TRAPS.register(focusTrap);
|
|
105
|
-
|
|
106
|
-
// TEARDOWN:
|
|
107
|
-
return () => FOCUS_TRAPS.unregister(focusTrap);
|
|
108
|
-
}, [focusElement, focusZoneElement]);
|
|
109
|
-
}
|
|
110
|
-
|
|
111
|
-
export { getFirstAndLastFocusable as g, useFocusTrap as u };
|
|
112
|
-
//# sourceMappingURL=5fe09341.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"5fe09341.js","sources":["../../src/utils/browser/focus/getFirstAndLastFocusable.ts","../../src/hooks/useFocusTrap.ts"],"sourcesContent":["import { getFocusableElements } from './getFocusableElements';\n\n/**\n * Get first and last elements focusable in an element.\n *\n * @param parentElement The element in which to search focusable elements.\n * @return first and last focusable elements\n */\nexport function getFirstAndLastFocusable(parentElement: HTMLElement | ShadowRoot) {\n const focusableElements = getFocusableElements(parentElement);\n\n // First non disabled element.\n const first = focusableElements[0];\n // Last non disabled element.\n const last = focusableElements[focusableElements.length - 1];\n\n if (last && first) {\n return { first, last };\n }\n return {};\n}\n","import { useEffect } from 'react';\n\nimport { DOCUMENT } from '@lumx/react/constants';\nimport { getFirstAndLastFocusable } from '@lumx/react/utils/browser/focus/getFirstAndLastFocusable';\nimport { Falsy } from '@lumx/react/utils/type';\nimport { Listener, makeListenerTowerContext } from '@lumx/react/utils/function/makeListenerTowerContext';\n\nconst FOCUS_TRAPS = makeListenerTowerContext();\n\n/**\n * Trap 'Tab' focus switch inside the `focusZoneElement`.\n *\n * If multiple focus trap are activated, only the last one is maintained and when a focus trap closes, the previous one\n * gets activated again.\n *\n * @param focusZoneElement The element in which to trap the focus.\n * @param focusElement The element to focus when the focus trap is activated (otherwise the first focusable element\n * will be focused).\n */\nexport function useFocusTrap(focusZoneElement: HTMLElement | Falsy, focusElement?: HTMLElement | null): void {\n useEffect(() => {\n // Body element can be undefined in SSR context.\n const rootElement = DOCUMENT?.body;\n\n if (!rootElement || !focusZoneElement) {\n return undefined;\n }\n\n // Use the shadow root as focusZoneElement when available\n const focusZoneElementOrShadowRoot = focusZoneElement.shadowRoot || focusZoneElement;\n\n // Trap 'Tab' key down focus switch into the focus zone.\n const trapTabFocusInFocusZone = (evt: KeyboardEvent) => {\n const { key } = evt;\n if (key !== 'Tab') {\n return;\n }\n\n const focusable = getFirstAndLastFocusable(focusZoneElementOrShadowRoot);\n\n // Prevent focus switch if no focusable available.\n if (!focusable.first) {\n evt.preventDefault();\n return;\n }\n\n const activeElement = focusZoneElement.shadowRoot\n ? focusZoneElement.shadowRoot.activeElement\n : document.activeElement;\n\n if (\n // No previous focus\n !activeElement ||\n // Previous focus is at the end of the focus zone.\n (!evt.shiftKey && activeElement === focusable.last) ||\n // Previous focus is outside the focus zone\n !focusZoneElementOrShadowRoot.contains(activeElement)\n ) {\n focusable.first.focus();\n evt.preventDefault();\n return;\n }\n\n if (\n // Focus order reversed\n evt.shiftKey &&\n // Previous focus is at the start of the focus zone.\n activeElement === focusable.first\n ) {\n focusable.last.focus();\n evt.preventDefault();\n }\n };\n\n const focusTrap: Listener = {\n enable: () => rootElement.addEventListener('keydown', trapTabFocusInFocusZone),\n disable: () => rootElement.removeEventListener('keydown', trapTabFocusInFocusZone),\n };\n\n // SETUP:\n if (focusElement && focusZoneElementOrShadowRoot.contains(focusElement)) {\n // Focus the given element.\n focusElement.focus({ preventScroll: true });\n } else {\n // Focus the first focusable element in the zone.\n getFirstAndLastFocusable(focusZoneElementOrShadowRoot).first?.focus({ preventScroll: true });\n }\n FOCUS_TRAPS.register(focusTrap);\n\n // TEARDOWN:\n return () => FOCUS_TRAPS.unregister(focusTrap);\n }, [focusElement, focusZoneElement]);\n}\n"],"names":["getFirstAndLastFocusable","parentElement","focusableElements","getFocusableElements","first","last","length","FOCUS_TRAPS","makeListenerTowerContext","useFocusTrap","focusZoneElement","focusElement","useEffect","rootElement","DOCUMENT","body","undefined","focusZoneElementOrShadowRoot","shadowRoot","trapTabFocusInFocusZone","evt","key","focusable","preventDefault","activeElement","document","shiftKey","contains","focus","focusTrap","enable","addEventListener","disable","removeEventListener","preventScroll","register","unregister"],"mappings":"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"}
|