@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
|
@@ -1,59 +0,0 @@
|
|
|
1
|
-
import isInteger from 'lodash/isInteger';
|
|
2
|
-
import { f as forwardRef, c as classNames } from '../forwardRef-15f62847.js';
|
|
3
|
-
import { getRootClassName } from '@lumx/core/js/utils/className';
|
|
4
|
-
import { jsx } from 'react/jsx-runtime';
|
|
5
|
-
|
|
6
|
-
/**
|
|
7
|
-
* Component display name.
|
|
8
|
-
*/
|
|
9
|
-
const COMPONENT_NAME = 'GridColumn';
|
|
10
|
-
|
|
11
|
-
/**
|
|
12
|
-
* Component default class name and class prefix.
|
|
13
|
-
*/
|
|
14
|
-
const CLASSNAME = getRootClassName(COMPONENT_NAME);
|
|
15
|
-
|
|
16
|
-
/**
|
|
17
|
-
* Component default props.
|
|
18
|
-
*/
|
|
19
|
-
const DEFAULT_PROPS = {};
|
|
20
|
-
|
|
21
|
-
/**
|
|
22
|
-
* The GridColumn is a layout component that can display children in a grid
|
|
23
|
-
* with custom display properties. It also comes with a responsive design,
|
|
24
|
-
* with a number of column that reduce when there is not enough space for each item.
|
|
25
|
-
*
|
|
26
|
-
* @param props Component props.
|
|
27
|
-
* @param ref Component ref.
|
|
28
|
-
* @return React element.
|
|
29
|
-
*/
|
|
30
|
-
const GridColumn = forwardRef((props, ref) => {
|
|
31
|
-
const {
|
|
32
|
-
as: Component = 'div',
|
|
33
|
-
gap,
|
|
34
|
-
maxColumns,
|
|
35
|
-
itemMinWidth,
|
|
36
|
-
children,
|
|
37
|
-
className,
|
|
38
|
-
style = {},
|
|
39
|
-
...forwardedProps
|
|
40
|
-
} = props;
|
|
41
|
-
return /*#__PURE__*/jsx(Component, {
|
|
42
|
-
...forwardedProps,
|
|
43
|
-
ref: ref,
|
|
44
|
-
className: classNames(className, CLASSNAME),
|
|
45
|
-
style: {
|
|
46
|
-
...style,
|
|
47
|
-
['--lumx-grid-column-item-min-width']: isInteger(itemMinWidth) && `${itemMinWidth}px`,
|
|
48
|
-
['--lumx-grid-column-columns']: maxColumns,
|
|
49
|
-
['--lumx-grid-column-gap']: gap && `var(--lumx-spacing-unit-${gap})`
|
|
50
|
-
},
|
|
51
|
-
children: children
|
|
52
|
-
});
|
|
53
|
-
});
|
|
54
|
-
GridColumn.displayName = COMPONENT_NAME;
|
|
55
|
-
GridColumn.className = CLASSNAME;
|
|
56
|
-
GridColumn.defaultProps = DEFAULT_PROPS;
|
|
57
|
-
|
|
58
|
-
export { GridColumn };
|
|
59
|
-
//# sourceMappingURL=grid-column-f01df853.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"grid-column-f01df853.js","sources":["../../../src/components/grid-column/GridColumn.tsx"],"sourcesContent":["import { ReactElement, ReactNode } from 'react';\n\nimport isInteger from 'lodash/isInteger';\nimport classNames from 'classnames';\n\nimport { Size } from '@lumx/react';\nimport { GenericProps } from '@lumx/react/utils/type';\nimport { getRootClassName } from '@lumx/core/js/utils/className';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\n\nexport type GridColumnGapSize = Extract<Size, 'tiny' | 'regular' | 'big' | 'huge'>;\n\n/**\n * Defines the props of the component.\n */\nexport interface GridColumnProps extends GenericProps {\n /** Customize the root element. */\n as?: React.ElementType;\n /** Children elements. */\n children?: ReactNode;\n /** Space between columns and rows. */\n gap?: GridColumnGapSize;\n /** Ideal number of columns. */\n maxColumns?: number;\n /** Minimum width for each item, reduce the number of column if there is not enough space. */\n itemMinWidth?: number;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'GridColumn';\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<GridColumnProps> = {};\n\n/**\n * The GridColumn is a layout component that can display children in a grid\n * with custom display properties. It also comes with a responsive design,\n * with a number of column that reduce when there is not enough space for each item.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const GridColumn = forwardRef<GridColumnProps>((props, ref): ReactElement => {\n const {\n as: Component = 'div',\n gap,\n maxColumns,\n itemMinWidth,\n children,\n className,\n style = {},\n ...forwardedProps\n } = props;\n\n return (\n <Component\n {...forwardedProps}\n ref={ref as React.Ref<any>}\n className={classNames(className, CLASSNAME)}\n style={{\n ...style,\n ['--lumx-grid-column-item-min-width' as any]: isInteger(itemMinWidth) && `${itemMinWidth}px`,\n ['--lumx-grid-column-columns' as any]: maxColumns,\n ['--lumx-grid-column-gap' as any]: gap && `var(--lumx-spacing-unit-${gap})`,\n }}\n >\n {children}\n </Component>\n );\n});\nGridColumn.displayName = COMPONENT_NAME;\nGridColumn.className = CLASSNAME;\nGridColumn.defaultProps = DEFAULT_PROPS;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","GridColumn","forwardRef","props","ref","as","Component","gap","maxColumns","itemMinWidth","children","className","style","forwardedProps","_jsx","classNames","isInteger","displayName","defaultProps"],"mappings":";;;;;AA4BA;AACA;AACA;AACA,MAAMA,cAAc,GAAG,YAAY,CAAA;;AAEnC;AACA;AACA;AACA,MAAMC,SAAS,GAAGC,gBAAgB,CAACF,cAAc,CAAC,CAAA;;AAElD;AACA;AACA;AACA,MAAMG,aAAuC,GAAG,EAAE,CAAA;;AAElD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMC,UAAU,GAAGC,UAAU,CAAkB,CAACC,KAAK,EAAEC,GAAG,KAAmB;EAChF,MAAM;IACFC,EAAE,EAAEC,SAAS,GAAG,KAAK;IACrBC,GAAG;IACHC,UAAU;IACVC,YAAY;IACZC,QAAQ;IACRC,SAAS;IACTC,KAAK,GAAG,EAAE;IACV,GAAGC,cAAAA;AACP,GAAC,GAAGV,KAAK,CAAA;EAET,oBACIW,GAAA,CAACR,SAAS,EAAA;AAAA,IAAA,GACFO,cAAc;AAClBT,IAAAA,GAAG,EAAEA,GAAsB;AAC3BO,IAAAA,SAAS,EAAEI,UAAU,CAACJ,SAAS,EAAEb,SAAS,CAAE;AAC5Cc,IAAAA,KAAK,EAAE;AACH,MAAA,GAAGA,KAAK;MACR,CAAC,mCAAmC,GAAUI,SAAS,CAACP,YAAY,CAAC,IAAI,CAAGA,EAAAA,YAAY,CAAI,EAAA,CAAA;MAC5F,CAAC,4BAA4B,GAAUD,UAAU;AACjD,MAAA,CAAC,wBAAwB,GAAUD,GAAG,IAAI,2BAA2BA,GAAG,CAAA,CAAA,CAAA;KAC1E;AAAAG,IAAAA,QAAA,EAEDA,QAAAA;AAAQ,GACF,CAAC,CAAA;AAEpB,CAAC,EAAC;AACFT,UAAU,CAACgB,WAAW,GAAGpB,cAAc,CAAA;AACvCI,UAAU,CAACU,SAAS,GAAGb,SAAS,CAAA;AAChCG,UAAU,CAACiB,YAAY,GAAGlB,aAAa;;;;"}
|
|
@@ -1,53 +0,0 @@
|
|
|
1
|
-
import { f as forwardRef, c as classNames } from '../forwardRef-15f62847.js';
|
|
2
|
-
import { getRootClassName } from '@lumx/core/js/utils/className';
|
|
3
|
-
import { u as useHeadingLevel, D as DEFAULT_TYPOGRAPHY_BY_LEVEL } from '../HeadingLevelProvider-ebdcb0c7.js';
|
|
4
|
-
export { H as HeadingLevelProvider } from '../HeadingLevelProvider-ebdcb0c7.js';
|
|
5
|
-
import { jsx } from 'react/jsx-runtime';
|
|
6
|
-
import { T as Text } from '../index-a9c5cd69.js';
|
|
7
|
-
|
|
8
|
-
/**
|
|
9
|
-
* Component display name.
|
|
10
|
-
*/
|
|
11
|
-
const COMPONENT_NAME = 'Heading';
|
|
12
|
-
|
|
13
|
-
/**
|
|
14
|
-
* Component default class name and class prefix.
|
|
15
|
-
*/
|
|
16
|
-
const CLASSNAME = getRootClassName(COMPONENT_NAME);
|
|
17
|
-
|
|
18
|
-
/**
|
|
19
|
-
* Component default props.
|
|
20
|
-
*/
|
|
21
|
-
const DEFAULT_PROPS = {};
|
|
22
|
-
|
|
23
|
-
/**
|
|
24
|
-
* Renders a heading component.
|
|
25
|
-
* Extends the `Text` Component with the heading level automatically computed based on
|
|
26
|
-
* the current level provided by the context.
|
|
27
|
-
*/
|
|
28
|
-
const Heading = forwardRef((props, ref) => {
|
|
29
|
-
const {
|
|
30
|
-
children,
|
|
31
|
-
as,
|
|
32
|
-
className,
|
|
33
|
-
...forwardedProps
|
|
34
|
-
} = props;
|
|
35
|
-
const {
|
|
36
|
-
headingElement
|
|
37
|
-
} = useHeadingLevel();
|
|
38
|
-
const computedHeadingElement = as || headingElement;
|
|
39
|
-
return /*#__PURE__*/jsx(Text, {
|
|
40
|
-
ref: ref,
|
|
41
|
-
className: classNames(className, CLASSNAME),
|
|
42
|
-
as: computedHeadingElement,
|
|
43
|
-
typography: DEFAULT_TYPOGRAPHY_BY_LEVEL[computedHeadingElement],
|
|
44
|
-
...forwardedProps,
|
|
45
|
-
children: children
|
|
46
|
-
});
|
|
47
|
-
});
|
|
48
|
-
Heading.displayName = COMPONENT_NAME;
|
|
49
|
-
Heading.className = CLASSNAME;
|
|
50
|
-
Heading.defaultProps = DEFAULT_PROPS;
|
|
51
|
-
|
|
52
|
-
export { Heading, useHeadingLevel };
|
|
53
|
-
//# sourceMappingURL=heading-89239843.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"heading-89239843.js","sources":["../../../src/components/heading/Heading.tsx"],"sourcesContent":["import classNames from 'classnames';\n\nimport { HeadingElement } from '@lumx/react/utils/type';\nimport { getRootClassName } from '@lumx/core/js/utils/className';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\n\nimport { Text, TextProps } from '../text';\nimport { DEFAULT_TYPOGRAPHY_BY_LEVEL } from './constants';\nimport { useHeadingLevel } from './useHeadingLevel';\n\n/**\n * Defines the props of the component.\n */\nexport interface HeadingProps extends Partial<TextProps> {\n /**\n * Display a specific heading level instead of the one provided by parent context provider.\n */\n as?: HeadingElement;\n /**\n * Children\n */\n children?: React.ReactNode;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'Heading';\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 = {} as const;\n\n/**\n * Renders a heading component.\n * Extends the `Text` Component with the heading level automatically computed based on\n * the current level provided by the context.\n */\nexport const Heading = forwardRef<HeadingProps>((props, ref) => {\n const { children, as, className, ...forwardedProps } = props;\n const { headingElement } = useHeadingLevel();\n\n const computedHeadingElement = as || headingElement;\n return (\n <Text\n ref={ref}\n className={classNames(className, CLASSNAME)}\n as={computedHeadingElement}\n typography={DEFAULT_TYPOGRAPHY_BY_LEVEL[computedHeadingElement]}\n {...forwardedProps}\n >\n {children}\n </Text>\n );\n});\n\nHeading.displayName = COMPONENT_NAME;\nHeading.className = CLASSNAME;\nHeading.defaultProps = DEFAULT_PROPS;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","Heading","forwardRef","props","ref","children","as","className","forwardedProps","headingElement","useHeadingLevel","computedHeadingElement","_jsx","Text","classNames","typography","DEFAULT_TYPOGRAPHY_BY_LEVEL","displayName","defaultProps"],"mappings":";;;;;;;AAwBA;AACA;AACA;AACA,MAAMA,cAAc,GAAG,SAAS,CAAA;;AAEhC;AACA;AACA;AACA,MAAMC,SAAS,GAAGC,gBAAgB,CAACF,cAAc,CAAC,CAAA;;AAElD;AACA;AACA;AACA,MAAMG,aAAa,GAAG,EAAW,CAAA;;AAEjC;AACA;AACA;AACA;AACA;AACO,MAAMC,OAAO,GAAGC,UAAU,CAAe,CAACC,KAAK,EAAEC,GAAG,KAAK;EAC5D,MAAM;IAAEC,QAAQ;IAAEC,EAAE;IAAEC,SAAS;IAAE,GAAGC,cAAAA;AAAe,GAAC,GAAGL,KAAK,CAAA;EAC5D,MAAM;AAAEM,IAAAA,cAAAA;GAAgB,GAAGC,eAAe,EAAE,CAAA;AAE5C,EAAA,MAAMC,sBAAsB,GAAGL,EAAE,IAAIG,cAAc,CAAA;EACnD,oBACIG,GAAA,CAACC,IAAI,EAAA;AACDT,IAAAA,GAAG,EAAEA,GAAI;AACTG,IAAAA,SAAS,EAAEO,UAAU,CAACP,SAAS,EAAET,SAAS,CAAE;AAC5CQ,IAAAA,EAAE,EAAEK,sBAAuB;AAC3BI,IAAAA,UAAU,EAAEC,2BAA2B,CAACL,sBAAsB,CAAE;AAAA,IAAA,GAC5DH,cAAc;AAAAH,IAAAA,QAAA,EAEjBA,QAAAA;AAAQ,GACP,CAAC,CAAA;AAEf,CAAC,EAAC;AAEFJ,OAAO,CAACgB,WAAW,GAAGpB,cAAc,CAAA;AACpCI,OAAO,CAACM,SAAS,GAAGT,SAAS,CAAA;AAC7BG,OAAO,CAACiB,YAAY,GAAGlB,aAAa;;;;"}
|
|
@@ -1,102 +0,0 @@
|
|
|
1
|
-
import { f as forwardRef, c as classNames } from '../forwardRef-15f62847.js';
|
|
2
|
-
import { mdiAlertCircle } from '@lumx/icons';
|
|
3
|
-
import { getRootClassName, resolveColorWithVariants, handleBasicClasses } from '@lumx/core/js/utils/className';
|
|
4
|
-
import { u as useTheme } from '../ThemeContext-3181f000.js';
|
|
5
|
-
import { jsx } from 'react/jsx-runtime';
|
|
6
|
-
import { Theme, ColorPalette, Size } from '@lumx/core/js/constants';
|
|
7
|
-
|
|
8
|
-
/**
|
|
9
|
-
* Component display name.
|
|
10
|
-
*/
|
|
11
|
-
const COMPONENT_NAME = 'Icon';
|
|
12
|
-
|
|
13
|
-
/**
|
|
14
|
-
* Component default class name and class prefix.
|
|
15
|
-
*/
|
|
16
|
-
const CLASSNAME = getRootClassName(COMPONENT_NAME);
|
|
17
|
-
|
|
18
|
-
/**
|
|
19
|
-
* Component default props.
|
|
20
|
-
*/
|
|
21
|
-
const DEFAULT_PROPS = {};
|
|
22
|
-
|
|
23
|
-
/**
|
|
24
|
-
* Icon component.
|
|
25
|
-
*
|
|
26
|
-
* @param props Component props.
|
|
27
|
-
* @param ref Component ref.
|
|
28
|
-
* @return React element.
|
|
29
|
-
*/
|
|
30
|
-
const Icon = forwardRef((props, ref) => {
|
|
31
|
-
const defaultTheme = useTheme();
|
|
32
|
-
const {
|
|
33
|
-
className,
|
|
34
|
-
color: propColor,
|
|
35
|
-
colorVariant: propColorVariant,
|
|
36
|
-
hasShape,
|
|
37
|
-
icon,
|
|
38
|
-
size,
|
|
39
|
-
theme = defaultTheme,
|
|
40
|
-
alt,
|
|
41
|
-
...forwardedProps
|
|
42
|
-
} = props;
|
|
43
|
-
const [color, colorVariant] = resolveColorWithVariants(propColor, propColorVariant);
|
|
44
|
-
|
|
45
|
-
// Color
|
|
46
|
-
let iconColor = color;
|
|
47
|
-
if (!iconColor && (hasShape || theme)) {
|
|
48
|
-
iconColor = theme === Theme.dark ? ColorPalette.light : ColorPalette.dark;
|
|
49
|
-
}
|
|
50
|
-
|
|
51
|
-
// Color variant
|
|
52
|
-
let iconColorVariant = colorVariant;
|
|
53
|
-
if (!iconColorVariant && hasShape && iconColor === ColorPalette.dark) {
|
|
54
|
-
iconColorVariant = 'L2';
|
|
55
|
-
}
|
|
56
|
-
|
|
57
|
-
// Size
|
|
58
|
-
let iconSize = size;
|
|
59
|
-
if (size && hasShape) {
|
|
60
|
-
if (size === Size.xxs || size === Size.xs) {
|
|
61
|
-
iconSize = Size.s;
|
|
62
|
-
} else if (size === Size.xxl) {
|
|
63
|
-
iconSize = Size.xl;
|
|
64
|
-
}
|
|
65
|
-
} else if (hasShape) {
|
|
66
|
-
iconSize = Size.m;
|
|
67
|
-
}
|
|
68
|
-
return /*#__PURE__*/jsx("i", {
|
|
69
|
-
ref: ref,
|
|
70
|
-
...forwardedProps,
|
|
71
|
-
className: classNames(className, handleBasicClasses({
|
|
72
|
-
color: iconColor,
|
|
73
|
-
colorVariant: iconColorVariant,
|
|
74
|
-
hasShape,
|
|
75
|
-
prefix: CLASSNAME,
|
|
76
|
-
theme,
|
|
77
|
-
size: iconSize
|
|
78
|
-
}), !hasShape && `${CLASSNAME}--no-shape`, !hasShape && iconColor === ColorPalette.yellow && icon === mdiAlertCircle && `${CLASSNAME}--has-dark-layer`, `${CLASSNAME}--path`),
|
|
79
|
-
children: /*#__PURE__*/jsx("svg", {
|
|
80
|
-
"aria-hidden": alt ? undefined : 'true',
|
|
81
|
-
role: alt ? 'img' : undefined,
|
|
82
|
-
"aria-label": alt,
|
|
83
|
-
height: "1em",
|
|
84
|
-
preserveAspectRatio: "xMidYMid meet",
|
|
85
|
-
style: {
|
|
86
|
-
verticalAlign: '-0.125em'
|
|
87
|
-
},
|
|
88
|
-
viewBox: "0 0 24 24",
|
|
89
|
-
width: "1em",
|
|
90
|
-
children: /*#__PURE__*/jsx("path", {
|
|
91
|
-
d: icon,
|
|
92
|
-
fill: "currentColor"
|
|
93
|
-
})
|
|
94
|
-
})
|
|
95
|
-
});
|
|
96
|
-
});
|
|
97
|
-
Icon.displayName = COMPONENT_NAME;
|
|
98
|
-
Icon.className = CLASSNAME;
|
|
99
|
-
Icon.defaultProps = DEFAULT_PROPS;
|
|
100
|
-
|
|
101
|
-
export { Icon };
|
|
102
|
-
//# sourceMappingURL=icon-b708cca4.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"icon-b708cca4.js","sources":["../../../src/components/icon/Icon.tsx"],"sourcesContent":["import classNames from 'classnames';\n\nimport { mdiAlertCircle } from '@lumx/icons';\nimport { ColorPalette, ColorVariant, ColorWithVariants, Size, Theme } from '@lumx/react';\nimport { GenericProps, HasTheme } from '@lumx/react/utils/type';\nimport { getRootClassName, handleBasicClasses, resolveColorWithVariants } from '@lumx/core/js/utils/className';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\nimport { useTheme } from '@lumx/react/utils/theme/ThemeContext';\n\nexport type IconSizes = Extract<Size, 'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl' | 'xxl'>;\n\n/**\n * Defines the props of the component.\n */\nexport interface IconProps extends GenericProps, HasTheme {\n /** Color variant. */\n color?: ColorWithVariants;\n /** Lightened or darkened variant of the selected icon color. */\n colorVariant?: ColorVariant;\n /** Whether the icon has a shape. */\n hasShape?: boolean;\n /**\n * Icon (SVG path) draw code (`d` property of the `<path>` SVG element).\n * See https://developer.mozilla.org/en-US/docs/Web/SVG/Tutorial/Paths\n */\n icon: string;\n /** Size variant. */\n size?: IconSizes;\n /** Sets an alternative text on the svg. Will set an `img` role to the svg. */\n alt?: string;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'Icon';\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<IconProps> = {};\n\n/**\n * Icon component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const Icon = forwardRef<IconProps, HTMLElement>((props, ref) => {\n const defaultTheme = useTheme();\n const {\n className,\n color: propColor,\n colorVariant: propColorVariant,\n hasShape,\n icon,\n size,\n theme = defaultTheme,\n alt,\n ...forwardedProps\n } = props;\n const [color, colorVariant] = resolveColorWithVariants(propColor, propColorVariant);\n\n // Color\n let iconColor = color;\n if (!iconColor && (hasShape || theme)) {\n iconColor = theme === Theme.dark ? ColorPalette.light : ColorPalette.dark;\n }\n\n // Color variant\n let iconColorVariant = colorVariant;\n if (!iconColorVariant && hasShape && iconColor === ColorPalette.dark) {\n iconColorVariant = 'L2';\n }\n\n // Size\n let iconSize = size;\n if (size && hasShape) {\n if (size === Size.xxs || size === Size.xs) {\n iconSize = Size.s;\n } else if (size === Size.xxl) {\n iconSize = Size.xl;\n }\n } else if (hasShape) {\n iconSize = Size.m;\n }\n\n return (\n <i\n ref={ref}\n {...forwardedProps}\n className={classNames(\n className,\n handleBasicClasses({\n color: iconColor,\n colorVariant: iconColorVariant,\n hasShape,\n prefix: CLASSNAME,\n theme,\n size: iconSize,\n }),\n !hasShape && `${CLASSNAME}--no-shape`,\n !hasShape &&\n iconColor === ColorPalette.yellow &&\n icon === mdiAlertCircle &&\n `${CLASSNAME}--has-dark-layer`,\n `${CLASSNAME}--path`,\n )}\n >\n <svg\n aria-hidden={alt ? undefined : 'true'}\n role={alt ? 'img' : undefined}\n aria-label={alt}\n height=\"1em\"\n preserveAspectRatio=\"xMidYMid meet\"\n style={{ verticalAlign: '-0.125em' }}\n viewBox=\"0 0 24 24\"\n width=\"1em\"\n >\n <path d={icon} fill=\"currentColor\" />\n </svg>\n </i>\n );\n});\nIcon.displayName = COMPONENT_NAME;\nIcon.className = CLASSNAME;\nIcon.defaultProps = DEFAULT_PROPS;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","Icon","forwardRef","props","ref","defaultTheme","useTheme","className","color","propColor","colorVariant","propColorVariant","hasShape","icon","size","theme","alt","forwardedProps","resolveColorWithVariants","iconColor","Theme","dark","ColorPalette","light","iconColorVariant","iconSize","Size","xxs","xs","s","xxl","xl","m","_jsx","classNames","handleBasicClasses","prefix","yellow","mdiAlertCircle","children","undefined","role","height","preserveAspectRatio","style","verticalAlign","viewBox","width","d","fill","displayName","defaultProps"],"mappings":"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"}
|
|
@@ -1,110 +0,0 @@
|
|
|
1
|
-
import { f as forwardRef, c as classNames } from '../forwardRef-15f62847.js';
|
|
2
|
-
import { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';
|
|
3
|
-
import { u as useTheme } from '../ThemeContext-3181f000.js';
|
|
4
|
-
import { I as ImageCaption } from '../ImageCaption-8134a3aa.js';
|
|
5
|
-
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
6
|
-
import { Alignment, Theme } from '@lumx/core/js/constants';
|
|
7
|
-
import { T as Thumbnail } from '../Thumbnail-b5dea0af.js';
|
|
8
|
-
|
|
9
|
-
const ImageBlockCaptionPosition = {
|
|
10
|
-
below: 'below',
|
|
11
|
-
over: 'over'
|
|
12
|
-
};
|
|
13
|
-
|
|
14
|
-
/**
|
|
15
|
-
* Image block sizes.
|
|
16
|
-
*/
|
|
17
|
-
|
|
18
|
-
/**
|
|
19
|
-
* Defines the props of the component.
|
|
20
|
-
*/
|
|
21
|
-
|
|
22
|
-
/**
|
|
23
|
-
* Component display name.
|
|
24
|
-
*/
|
|
25
|
-
const COMPONENT_NAME = 'ImageBlock';
|
|
26
|
-
|
|
27
|
-
/**
|
|
28
|
-
* Component default class name and class prefix.
|
|
29
|
-
*/
|
|
30
|
-
const CLASSNAME = getRootClassName(COMPONENT_NAME);
|
|
31
|
-
|
|
32
|
-
/**
|
|
33
|
-
* Component default props.
|
|
34
|
-
*/
|
|
35
|
-
const DEFAULT_PROPS = {
|
|
36
|
-
captionPosition: ImageBlockCaptionPosition.below,
|
|
37
|
-
align: Alignment.left
|
|
38
|
-
};
|
|
39
|
-
|
|
40
|
-
/**
|
|
41
|
-
* ImageBlock component.
|
|
42
|
-
*
|
|
43
|
-
* @param props Component props.
|
|
44
|
-
* @param ref Component ref.
|
|
45
|
-
* @return React element.
|
|
46
|
-
*/
|
|
47
|
-
const ImageBlock = forwardRef((props, ref) => {
|
|
48
|
-
const defaultTheme = useTheme() || Theme.light;
|
|
49
|
-
const {
|
|
50
|
-
actions,
|
|
51
|
-
align = DEFAULT_PROPS.align,
|
|
52
|
-
alt,
|
|
53
|
-
captionPosition = DEFAULT_PROPS.captionPosition,
|
|
54
|
-
captionStyle,
|
|
55
|
-
className,
|
|
56
|
-
description,
|
|
57
|
-
descriptionProps,
|
|
58
|
-
fillHeight,
|
|
59
|
-
image,
|
|
60
|
-
size,
|
|
61
|
-
tags,
|
|
62
|
-
theme = defaultTheme,
|
|
63
|
-
thumbnailProps,
|
|
64
|
-
title,
|
|
65
|
-
titleProps,
|
|
66
|
-
...forwardedProps
|
|
67
|
-
} = props;
|
|
68
|
-
return /*#__PURE__*/jsxs("figure", {
|
|
69
|
-
ref: ref,
|
|
70
|
-
...forwardedProps,
|
|
71
|
-
className: classNames(className, handleBasicClasses({
|
|
72
|
-
prefix: CLASSNAME,
|
|
73
|
-
captionPosition,
|
|
74
|
-
align,
|
|
75
|
-
size,
|
|
76
|
-
theme
|
|
77
|
-
}), fillHeight && `${CLASSNAME}--fill-height`),
|
|
78
|
-
children: [/*#__PURE__*/jsx(Thumbnail, {
|
|
79
|
-
...thumbnailProps,
|
|
80
|
-
className: classNames(`${CLASSNAME}__image`, thumbnailProps?.className),
|
|
81
|
-
fillHeight: fillHeight,
|
|
82
|
-
align: align,
|
|
83
|
-
image: image,
|
|
84
|
-
size: size,
|
|
85
|
-
theme: theme,
|
|
86
|
-
alt: alt || title
|
|
87
|
-
}), /*#__PURE__*/jsx(ImageCaption, {
|
|
88
|
-
as: "figcaption",
|
|
89
|
-
baseClassName: CLASSNAME,
|
|
90
|
-
theme: theme,
|
|
91
|
-
title: title,
|
|
92
|
-
titleProps: titleProps,
|
|
93
|
-
description: description,
|
|
94
|
-
descriptionProps: descriptionProps,
|
|
95
|
-
tags: tags,
|
|
96
|
-
captionStyle: captionStyle,
|
|
97
|
-
align: align,
|
|
98
|
-
truncate: captionPosition === 'over'
|
|
99
|
-
}), actions && /*#__PURE__*/jsx("div", {
|
|
100
|
-
className: `${CLASSNAME}__actions`,
|
|
101
|
-
children: actions
|
|
102
|
-
})]
|
|
103
|
-
});
|
|
104
|
-
});
|
|
105
|
-
ImageBlock.displayName = COMPONENT_NAME;
|
|
106
|
-
ImageBlock.className = CLASSNAME;
|
|
107
|
-
ImageBlock.defaultProps = DEFAULT_PROPS;
|
|
108
|
-
|
|
109
|
-
export { ImageBlock, ImageBlockCaptionPosition };
|
|
110
|
-
//# sourceMappingURL=image-block-7938422d.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"image-block-7938422d.js","sources":["../../../src/components/image-block/ImageBlock.tsx"],"sourcesContent":["import { ReactNode } from 'react';\n\nimport classNames from 'classnames';\n\nimport { Alignment, HorizontalAlignment, Size, Theme, Thumbnail } from '@lumx/react';\n\nimport { GenericProps, HasTheme, ValueOf } 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 { ThumbnailProps } from '../thumbnail/Thumbnail';\nimport { ImageCaption, ImageCaptionMetadata } from './ImageCaption';\n\n/**\n * Image block variants.\n */\nexport const ImageBlockCaptionPosition = {\n below: 'below',\n over: 'over',\n} as const;\nexport type ImageBlockCaptionPosition = ValueOf<typeof ImageBlockCaptionPosition>;\n\n/**\n * Image block sizes.\n */\nexport type ImageBlockSize = Extract<Size, 'xl' | 'xxl'>;\n\n/**\n * Defines the props of the component.\n */\nexport interface ImageBlockProps extends GenericProps, HasTheme, ImageCaptionMetadata {\n /** Action toolbar content. */\n actions?: ReactNode;\n /** Alignment. */\n align?: HorizontalAlignment;\n /** Image alternative text. */\n alt: string;\n /** Caption position. */\n captionPosition?: ImageBlockCaptionPosition;\n /** Whether the image has to fill its container height or not. */\n fillHeight?: boolean;\n /** Image URL. */\n image: string;\n /** Size variant. */\n size?: ImageBlockSize;\n /** Props to pass to the thumbnail (minus those already set by the ImageBlock props). */\n thumbnailProps?: Omit<ThumbnailProps, 'image' | 'size' | 'theme' | 'align' | 'fillHeight'>;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'ImageBlock';\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<ImageBlockProps> = {\n captionPosition: ImageBlockCaptionPosition.below,\n align: Alignment.left,\n};\n\n/**\n * ImageBlock component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const ImageBlock = forwardRef<ImageBlockProps, HTMLDivElement>((props, ref) => {\n const defaultTheme = useTheme() || Theme.light;\n const {\n actions,\n align = DEFAULT_PROPS.align,\n alt,\n captionPosition = DEFAULT_PROPS.captionPosition,\n captionStyle,\n className,\n description,\n descriptionProps,\n fillHeight,\n image,\n size,\n tags,\n theme = defaultTheme,\n thumbnailProps,\n title,\n titleProps,\n ...forwardedProps\n } = props;\n return (\n <figure\n ref={ref}\n {...forwardedProps}\n className={classNames(\n className,\n handleBasicClasses({\n prefix: CLASSNAME,\n captionPosition,\n align,\n size,\n theme,\n }),\n fillHeight && `${CLASSNAME}--fill-height`,\n )}\n >\n <Thumbnail\n {...thumbnailProps}\n className={classNames(`${CLASSNAME}__image`, thumbnailProps?.className)}\n fillHeight={fillHeight}\n align={align}\n image={image}\n size={size}\n theme={theme}\n alt={(alt || title) as string}\n />\n <ImageCaption\n as=\"figcaption\"\n baseClassName={CLASSNAME}\n theme={theme}\n title={title}\n titleProps={titleProps}\n description={description}\n descriptionProps={descriptionProps}\n tags={tags}\n captionStyle={captionStyle}\n align={align}\n truncate={captionPosition === 'over'}\n />\n {actions && <div className={`${CLASSNAME}__actions`}>{actions}</div>}\n </figure>\n );\n});\nImageBlock.displayName = COMPONENT_NAME;\nImageBlock.className = CLASSNAME;\nImageBlock.defaultProps = DEFAULT_PROPS;\n"],"names":["ImageBlockCaptionPosition","below","over","COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","captionPosition","align","Alignment","left","ImageBlock","forwardRef","props","ref","defaultTheme","useTheme","Theme","light","actions","alt","captionStyle","className","description","descriptionProps","fillHeight","image","size","tags","theme","thumbnailProps","title","titleProps","forwardedProps","_jsxs","classNames","handleBasicClasses","prefix","children","_jsx","Thumbnail","ImageCaption","as","baseClassName","truncate","displayName","defaultProps"],"mappings":"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"}
|