@lumx/react 3.20.1-alpha.10 → 3.20.1-alpha.12
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/CONTRIBUTING.md +1 -5
- package/README.md +0 -2
- package/_internal/0420e67b.js +119 -0
- package/_internal/0420e67b.js.map +1 -0
- package/_internal/0a490b07.js +75 -0
- package/_internal/0a490b07.js.map +1 -0
- package/_internal/0b9c76cb.js +6 -0
- package/_internal/0b9c76cb.js.map +1 -0
- package/_internal/0be1006e.js +97 -0
- package/_internal/0be1006e.js.map +1 -0
- package/_internal/0d1a078c.js +144 -0
- package/_internal/0d1a078c.js.map +1 -0
- package/_internal/15eab19b.js +75 -0
- package/_internal/15eab19b.js.map +1 -0
- package/_internal/179a84d1.js +259 -0
- package/_internal/179a84d1.js.map +1 -0
- package/_internal/193521fa.js +52 -0
- package/_internal/193521fa.js.map +1 -0
- package/_internal/1a90ea3d.js +51 -0
- package/_internal/1a90ea3d.js.map +1 -0
- package/_internal/1deba7d7.js +224 -0
- package/_internal/1deba7d7.js.map +1 -0
- package/_internal/1ea72630.js +146 -0
- package/_internal/1ea72630.js.map +1 -0
- package/_internal/21b83d16.js +137 -0
- package/_internal/21b83d16.js.map +1 -0
- package/_internal/230173a8.js +13 -0
- package/_internal/230173a8.js.map +1 -0
- package/_internal/297bed8f.js +457 -0
- package/_internal/297bed8f.js.map +1 -0
- package/_internal/2a3d237c.js +12 -0
- package/_internal/2a3d237c.js.map +1 -0
- package/_internal/2c2b6a89.js +52 -0
- package/_internal/2c2b6a89.js.map +1 -0
- package/_internal/2f1716fa.js +237 -0
- package/_internal/2f1716fa.js.map +1 -0
- package/_internal/2f6c7f84.js +103 -0
- package/_internal/2f6c7f84.js.map +1 -0
- package/_internal/3181f000.js +14 -0
- package/_internal/3181f000.js.map +1 -0
- package/_internal/329b5f12.js +55 -0
- package/_internal/329b5f12.js.map +1 -0
- package/_internal/332e9844.js +2 -0
- package/_internal/332e9844.js.map +1 -0
- package/_internal/34c59f5b.js +681 -0
- package/_internal/34c59f5b.js.map +1 -0
- package/_internal/36bd7352.js +219 -0
- package/_internal/36bd7352.js.map +1 -0
- package/_internal/370bdaed.js +61 -0
- package/_internal/370bdaed.js.map +1 -0
- package/_internal/37b007a4.js +20 -0
- package/_internal/37b007a4.js.map +1 -0
- package/_internal/3a1facc0.js +18 -0
- package/_internal/3a1facc0.js.map +1 -0
- package/_internal/3a4e4636.js +162 -0
- package/_internal/3a4e4636.js.map +1 -0
- package/_internal/3e653144.js +49 -0
- package/_internal/3e653144.js.map +1 -0
- package/_internal/3f86608e.js +45 -0
- package/_internal/3f86608e.js.map +1 -0
- package/_internal/478b5c92.js +24 -0
- package/_internal/478b5c92.js.map +1 -0
- package/_internal/4962be5b.js +121 -0
- package/_internal/4962be5b.js.map +1 -0
- package/_internal/49bbeed3.js +6 -0
- package/_internal/49bbeed3.js.map +1 -0
- package/_internal/4cd870a5.js +2155 -0
- package/_internal/4cd870a5.js.map +1 -0
- package/{src/utils/partitionMulti.ts → _internal/4daccdd5.js} +5 -9
- package/_internal/4daccdd5.js.map +1 -0
- package/_internal/501f2f9f.js +58 -0
- package/_internal/501f2f9f.js.map +1 -0
- package/_internal/5e7b90e2.js +2 -0
- package/_internal/5e7b90e2.js.map +1 -0
- package/_internal/5ec059fe.js +145 -0
- package/_internal/5ec059fe.js.map +1 -0
- package/_internal/5f8f9454.js +70 -0
- package/_internal/5f8f9454.js.map +1 -0
- package/_internal/5fe09341.js +112 -0
- package/_internal/5fe09341.js.map +1 -0
- package/_internal/628468c4.js +313 -0
- package/_internal/628468c4.js.map +1 -0
- package/_internal/6589b796.js +280 -0
- package/_internal/6589b796.js.map +1 -0
- package/_internal/65f91970.js +297 -0
- package/_internal/65f91970.js.map +1 -0
- package/_internal/66f691d3.js +74 -0
- package/_internal/66f691d3.js.map +1 -0
- package/_internal/68c10f98.js +166 -0
- package/_internal/68c10f98.js.map +1 -0
- package/_internal/690ca33e.js +109 -0
- package/_internal/690ca33e.js.map +1 -0
- package/_internal/6ca04271.js +108 -0
- package/_internal/6ca04271.js.map +1 -0
- package/_internal/6da19518.js +165 -0
- package/_internal/6da19518.js.map +1 -0
- package/_internal/7093ba23.js +95 -0
- package/_internal/7093ba23.js.map +1 -0
- package/_internal/74a4a214.js +82 -0
- package/_internal/74a4a214.js.map +1 -0
- package/_internal/76be70dd.js +42 -0
- package/_internal/76be70dd.js.map +1 -0
- package/_internal/78df9309.js +20 -0
- package/_internal/78df9309.js.map +1 -0
- package/_internal/7b221b05.js +9 -0
- package/_internal/7b221b05.js.map +1 -0
- package/_internal/7daf0f24.js +77 -0
- package/_internal/7daf0f24.js.map +1 -0
- package/_internal/7f54e947.js +758 -0
- package/_internal/7f54e947.js.map +1 -0
- package/_internal/825ac334.js +130 -0
- package/_internal/825ac334.js.map +1 -0
- package/_internal/827b804a.js +6 -0
- package/_internal/827b804a.js.map +1 -0
- package/_internal/84dfe68f.js +436 -0
- package/_internal/84dfe68f.js.map +1 -0
- package/_internal/85e3a5ca.js +145 -0
- package/_internal/85e3a5ca.js.map +1 -0
- package/_internal/86aa4aa4.js +154 -0
- package/_internal/86aa4aa4.js.map +1 -0
- package/_internal/88ec77c2.js +130 -0
- package/_internal/88ec77c2.js.map +1 -0
- package/_internal/8ab42752.js +103 -0
- package/_internal/8ab42752.js.map +1 -0
- package/_internal/95cfd814.js +70 -0
- package/_internal/95cfd814.js.map +1 -0
- package/_internal/9a4dfad0.js +326 -0
- package/_internal/9a4dfad0.js.map +1 -0
- package/_internal/9c9df5f2.js +80 -0
- package/_internal/9c9df5f2.js.map +1 -0
- package/_internal/9d1336a1.js +19 -0
- package/_internal/9d1336a1.js.map +1 -0
- package/_internal/9fdc715b.js +152 -0
- package/_internal/9fdc715b.js.map +1 -0
- package/_internal/a003602b.js +116 -0
- package/_internal/a003602b.js.map +1 -0
- package/_internal/a34639bd.js +97 -0
- package/_internal/a34639bd.js.map +1 -0
- package/_internal/a84f4981.js +122 -0
- package/_internal/a84f4981.js.map +1 -0
- package/_internal/b0a7a999.js +59 -0
- package/_internal/b0a7a999.js.map +1 -0
- package/_internal/b0b2e33d.js +359 -0
- package/_internal/b0b2e33d.js.map +1 -0
- package/_internal/b1af5979.js +653 -0
- package/_internal/b1af5979.js.map +1 -0
- package/_internal/b477da26.js +164 -0
- package/_internal/b477da26.js.map +1 -0
- package/_internal/b8667090.js +36 -0
- package/_internal/b8667090.js.map +1 -0
- package/_internal/bae266a9.js +61 -0
- package/_internal/bae266a9.js.map +1 -0
- package/_internal/be6da9b0.js +296 -0
- package/_internal/be6da9b0.js.map +1 -0
- package/_internal/c0414b89.js +101 -0
- package/_internal/c0414b89.js.map +1 -0
- package/_internal/c2388b10.js +58 -0
- package/_internal/c2388b10.js.map +1 -0
- package/_internal/c459a04d.js +148 -0
- package/_internal/c459a04d.js.map +1 -0
- package/_internal/c6ca7494.js +2 -0
- package/_internal/c6ca7494.js.map +1 -0
- package/_internal/cdddaed8.js +116 -0
- package/_internal/cdddaed8.js.map +1 -0
- package/_internal/d0dd1815.js +10 -0
- package/_internal/d0dd1815.js.map +1 -0
- package/_internal/d45e3f16.js +15 -0
- package/_internal/d45e3f16.js.map +1 -0
- package/_internal/d5f316cb.js +62 -0
- package/_internal/d5f316cb.js.map +1 -0
- package/_internal/db4fdc7b.js +310 -0
- package/_internal/db4fdc7b.js.map +1 -0
- package/_internal/dbe0cf24.js +75 -0
- package/_internal/dbe0cf24.js.map +1 -0
- package/_internal/de24f857.js +4 -0
- package/_internal/de24f857.js.map +1 -0
- package/_internal/e2afb13f.js +75 -0
- package/_internal/e2afb13f.js.map +1 -0
- package/_internal/e52f0d3f.js +94 -0
- package/_internal/e52f0d3f.js.map +1 -0
- package/_internal/e6dd117e.js +50 -0
- package/_internal/e6dd117e.js.map +1 -0
- package/_internal/e806b848.js +9 -0
- package/_internal/e806b848.js.map +1 -0
- package/_internal/ea04260d.js +29 -0
- package/_internal/ea04260d.js.map +1 -0
- package/_internal/eaa8b1d8.js +150 -0
- package/_internal/eaa8b1d8.js.map +1 -0
- package/_internal/eaf6c45a.js +4 -0
- package/_internal/eaf6c45a.js.map +1 -0
- package/_internal/edab29ce.js +308 -0
- package/_internal/edab29ce.js.map +1 -0
- package/_internal/ef5d1aac.js +4 -0
- package/_internal/ef5d1aac.js.map +1 -0
- package/_internal/f0900583.js +142 -0
- package/_internal/f0900583.js.map +1 -0
- package/_internal/f0d7d6ea.js +30 -0
- package/_internal/f0d7d6ea.js.map +1 -0
- package/_internal/f23cdf84.js +181 -0
- package/_internal/f23cdf84.js.map +1 -0
- package/_internal/f52e979e.js +3 -0
- package/_internal/f52e979e.js.map +1 -0
- package/_internal/f5508d3d.js +792 -0
- package/_internal/f5508d3d.js.map +1 -0
- package/_internal/f93fe83e.js +46 -0
- package/_internal/f93fe83e.js.map +1 -0
- package/index.d.ts +1 -2
- package/index.js +65 -14607
- package/index.js.map +1 -1
- package/package.json +3 -15
- package/utils/index.d.ts +1 -1
- package/utils/index.js +3 -1
- package/utils/index.js.map +1 -1
- package/_internal/index.js +0 -229
- package/_internal/index.js.map +0 -1
- package/src/components/alert-dialog/AlertDialog.stories.tsx +0 -127
- package/src/components/alert-dialog/AlertDialog.test.tsx +0 -34
- package/src/components/alert-dialog/AlertDialog.tsx +0 -189
- package/src/components/alert-dialog/index.ts +0 -1
- package/src/components/autocomplete/Autocomplete.stories.tsx +0 -75
- package/src/components/autocomplete/Autocomplete.test.tsx +0 -99
- package/src/components/autocomplete/Autocomplete.tsx +0 -294
- package/src/components/autocomplete/AutocompleteMultiple.stories.tsx +0 -167
- package/src/components/autocomplete/AutocompleteMultiple.test.tsx +0 -61
- package/src/components/autocomplete/AutocompleteMultiple.tsx +0 -156
- package/src/components/autocomplete/__mockData__/index.ts +0 -39
- package/src/components/autocomplete/index.ts +0 -2
- package/src/components/avatar/Avatar.stories.tsx +0 -119
- package/src/components/avatar/Avatar.test.tsx +0 -32
- package/src/components/avatar/Avatar.tsx +0 -114
- package/src/components/avatar/index.ts +0 -1
- package/src/components/badge/Badge.stories.tsx +0 -69
- package/src/components/badge/Badge.test.tsx +0 -45
- package/src/components/badge/Badge.tsx +0 -58
- package/src/components/badge/BadgeWrapper.stories.tsx +0 -75
- package/src/components/badge/BadgeWrapper.test.tsx +0 -47
- package/src/components/badge/BadgeWrapper.tsx +0 -37
- package/src/components/badge/index.ts +0 -2
- package/src/components/button/Button.stories.tsx +0 -355
- package/src/components/button/Button.test.tsx +0 -125
- package/src/components/button/Button.tsx +0 -101
- package/src/components/button/ButtonGroup.stories.tsx +0 -52
- package/src/components/button/ButtonGroup.test.tsx +0 -41
- package/src/components/button/ButtonGroup.tsx +0 -50
- package/src/components/button/ButtonRoot.tsx +0 -163
- package/src/components/button/IconButton.stories.tsx +0 -52
- package/src/components/button/IconButton.test.tsx +0 -66
- package/src/components/button/IconButton.tsx +0 -91
- package/src/components/button/index.ts +0 -4
- package/src/components/checkbox/Checkbox.stories.tsx +0 -64
- package/src/components/checkbox/Checkbox.test.tsx +0 -154
- package/src/components/checkbox/Checkbox.tsx +0 -164
- package/src/components/checkbox/index.ts +0 -1
- package/src/components/chip/Chip.stories.tsx +0 -164
- package/src/components/chip/Chip.test.tsx +0 -243
- package/src/components/chip/Chip.tsx +0 -168
- package/src/components/chip/ChipGroup.stories.tsx +0 -47
- package/src/components/chip/ChipGroup.test.tsx +0 -37
- package/src/components/chip/ChipGroup.tsx +0 -60
- package/src/components/chip/index.ts +0 -2
- package/src/components/comment-block/CommentBlock.stories.tsx +0 -91
- package/src/components/comment-block/CommentBlock.test.tsx +0 -28
- package/src/components/comment-block/CommentBlock.tsx +0 -172
- package/src/components/comment-block/index.ts +0 -1
- package/src/components/date-picker/DatePicker.stories.tsx +0 -118
- package/src/components/date-picker/DatePicker.test.tsx +0 -34
- package/src/components/date-picker/DatePicker.tsx +0 -52
- package/src/components/date-picker/DatePickerControlled.test.tsx +0 -91
- package/src/components/date-picker/DatePickerControlled.tsx +0 -259
- package/src/components/date-picker/DatePickerField.stories.tsx +0 -100
- package/src/components/date-picker/DatePickerField.test.tsx +0 -70
- package/src/components/date-picker/DatePickerField.tsx +0 -135
- package/src/components/date-picker/constants.ts +0 -11
- package/src/components/date-picker/index.ts +0 -4
- package/src/components/date-picker/types.ts +0 -28
- package/src/components/dialog/Dialog.stories.tsx +0 -318
- package/src/components/dialog/Dialog.test.tsx +0 -97
- package/src/components/dialog/Dialog.tsx +0 -288
- package/src/components/dialog/index.ts +0 -1
- package/src/components/divider/Divider.test.tsx +0 -51
- package/src/components/divider/Divider.tsx +0 -50
- package/src/components/divider/index.ts +0 -1
- package/src/components/drag-handle/DragHandle.test.tsx +0 -36
- package/src/components/drag-handle/DragHandle.tsx +0 -51
- package/src/components/drag-handle/index.ts +0 -1
- package/src/components/dropdown/Dropdown.stories.tsx +0 -31
- package/src/components/dropdown/Dropdown.test.tsx +0 -66
- package/src/components/dropdown/Dropdown.tsx +0 -186
- package/src/components/dropdown/index.ts +0 -1
- package/src/components/expansion-panel/ExpansionPanel.stories.tsx +0 -91
- package/src/components/expansion-panel/ExpansionPanel.test.tsx +0 -185
- package/src/components/expansion-panel/ExpansionPanel.tsx +0 -195
- package/src/components/expansion-panel/index.ts +0 -1
- package/src/components/flag/Flag.stories.tsx +0 -48
- package/src/components/flag/Flag.test.tsx +0 -62
- package/src/components/flag/Flag.tsx +0 -52
- package/src/components/flag/index.ts +0 -1
- package/src/components/flex-box/FlexBox.stories.tsx +0 -156
- package/src/components/flex-box/FlexBox.test.tsx +0 -24
- package/src/components/flex-box/FlexBox.tsx +0 -100
- package/src/components/flex-box/index.ts +0 -1
- package/src/components/generic-block/GenericBlock.stories.jsx +0 -128
- package/src/components/generic-block/GenericBlock.test.tsx +0 -156
- package/src/components/generic-block/GenericBlock.tsx +0 -225
- package/src/components/generic-block/constants.ts +0 -9
- package/src/components/generic-block/index.ts +0 -2
- package/src/components/grid/Grid.tsx +0 -83
- package/src/components/grid/GridItem.tsx +0 -55
- package/src/components/grid/index.ts +0 -2
- package/src/components/grid-column/GridColumn.stories.tsx +0 -45
- package/src/components/grid-column/GridColumn.test.jsx +0 -56
- package/src/components/grid-column/GridColumn.tsx +0 -83
- package/src/components/grid-column/index.ts +0 -1
- package/src/components/heading/Heading.stories.tsx +0 -69
- package/src/components/heading/Heading.test.tsx +0 -82
- package/src/components/heading/Heading.tsx +0 -65
- package/src/components/heading/HeadingLevelProvider.tsx +0 -30
- package/src/components/heading/constants.ts +0 -16
- package/src/components/heading/context.tsx +0 -13
- package/src/components/heading/index.ts +0 -3
- package/src/components/heading/useHeadingLevel.tsx +0 -8
- package/src/components/icon/Icon.stories.tsx +0 -73
- package/src/components/icon/Icon.test.tsx +0 -125
- package/src/components/icon/Icon.tsx +0 -22
- package/src/components/icon/index.ts +0 -1
- package/src/components/image-block/ImageBlock.stories.tsx +0 -117
- package/src/components/image-block/ImageBlock.test.tsx +0 -58
- package/src/components/image-block/ImageBlock.tsx +0 -142
- package/src/components/image-block/ImageCaption.tsx +0 -115
- package/src/components/image-block/index.ts +0 -1
- package/src/components/image-lightbox/ImageLightbox.stories.tsx +0 -160
- package/src/components/image-lightbox/ImageLightbox.test.tsx +0 -254
- package/src/components/image-lightbox/ImageLightbox.tsx +0 -90
- package/src/components/image-lightbox/constants.ts +0 -11
- package/src/components/image-lightbox/index.ts +0 -2
- package/src/components/image-lightbox/internal/ImageSlide.tsx +0 -107
- package/src/components/image-lightbox/internal/ImageSlideshow.tsx +0 -164
- package/src/components/image-lightbox/internal/useAnimateScroll.ts +0 -55
- package/src/components/image-lightbox/internal/usePointerZoom.ts +0 -148
- package/src/components/image-lightbox/types.ts +0 -48
- package/src/components/image-lightbox/useImageLightbox.tsx +0 -141
- package/src/components/inline-list/InlineList.stories.tsx +0 -77
- package/src/components/inline-list/InlineList.test.tsx +0 -52
- package/src/components/inline-list/InlineList.tsx +0 -96
- package/src/components/inline-list/index.ts +0 -1
- package/src/components/input-helper/InputHelper.stories.tsx +0 -35
- package/src/components/input-helper/InputHelper.test.tsx +0 -55
- package/src/components/input-helper/InputHelper.tsx +0 -65
- package/src/components/input-helper/constants.ts +0 -11
- package/src/components/input-helper/index.ts +0 -1
- package/src/components/input-label/InputLabel.stories.tsx +0 -45
- package/src/components/input-label/InputLabel.test.tsx +0 -59
- package/src/components/input-label/InputLabel.tsx +0 -69
- package/src/components/input-label/index.ts +0 -1
- package/src/components/lightbox/Lightbox.stories.tsx +0 -101
- package/src/components/lightbox/Lightbox.test.tsx +0 -53
- package/src/components/lightbox/Lightbox.tsx +0 -180
- package/src/components/lightbox/index.ts +0 -1
- package/src/components/link/Link.stories.tsx +0 -195
- package/src/components/link/Link.test.tsx +0 -127
- package/src/components/link/Link.tsx +0 -106
- package/src/components/link/index.ts +0 -1
- package/src/components/link-preview/LinkPreview.stories.tsx +0 -61
- package/src/components/link-preview/LinkPreview.test.tsx +0 -105
- package/src/components/link-preview/LinkPreview.tsx +0 -158
- package/src/components/link-preview/index.ts +0 -1
- package/src/components/list/List.stories.tsx +0 -116
- package/src/components/list/List.test.tsx +0 -18
- package/src/components/list/List.tsx +0 -104
- package/src/components/list/ListDivider.stories.tsx +0 -12
- package/src/components/list/ListDivider.test.tsx +0 -22
- package/src/components/list/ListDivider.tsx +0 -35
- package/src/components/list/ListItem.stories.tsx +0 -66
- package/src/components/list/ListItem.test.tsx +0 -93
- package/src/components/list/ListItem.tsx +0 -157
- package/src/components/list/ListSubheader.stories.tsx +0 -11
- package/src/components/list/ListSubheader.test.tsx +0 -21
- package/src/components/list/ListSubheader.tsx +0 -44
- package/src/components/list/index.ts +0 -4
- package/src/components/list/useInteractiveList.tsx +0 -202
- package/src/components/message/Message.stories.tsx +0 -72
- package/src/components/message/Message.test.tsx +0 -76
- package/src/components/message/Message.tsx +0 -100
- package/src/components/message/index.ts +0 -1
- package/src/components/mosaic/Mosaic.stories.tsx +0 -89
- package/src/components/mosaic/Mosaic.test.tsx +0 -77
- package/src/components/mosaic/Mosaic.tsx +0 -98
- package/src/components/mosaic/index.ts +0 -1
- package/src/components/navigation/Navigation.stories.tsx +0 -234
- package/src/components/navigation/Navigation.test.tsx +0 -65
- package/src/components/navigation/Navigation.tsx +0 -79
- package/src/components/navigation/NavigationItem.test.tsx +0 -35
- package/src/components/navigation/NavigationItem.tsx +0 -82
- package/src/components/navigation/NavigationSection.test.tsx +0 -137
- package/src/components/navigation/NavigationSection.tsx +0 -108
- package/src/components/navigation/context.tsx +0 -7
- package/src/components/navigation/index.ts +0 -1
- package/src/components/notification/Notification.test.tsx +0 -94
- package/src/components/notification/Notification.tsx +0 -138
- package/src/components/notification/Notifications.stories.tsx +0 -92
- package/src/components/notification/constants.ts +0 -28
- package/src/components/notification/index.ts +0 -1
- package/src/components/popover/Popover.stories.tsx +0 -264
- package/src/components/popover/Popover.test.tsx +0 -62
- package/src/components/popover/Popover.tsx +0 -201
- package/src/components/popover/constants.ts +0 -62
- package/src/components/popover/index.ts +0 -3
- package/src/components/popover/usePopoverStyle.tsx +0 -184
- package/src/components/popover/useRestoreFocusOnClose.tsx +0 -47
- package/src/components/popover-dialog/PopoverDialog.stories.tsx +0 -64
- package/src/components/popover-dialog/PopoverDialog.test.tsx +0 -139
- package/src/components/popover-dialog/PopoverDialog.tsx +0 -74
- package/src/components/popover-dialog/index.tsx +0 -1
- package/src/components/post-block/PostBlock.test.tsx +0 -27
- package/src/components/post-block/PostBlock.tsx +0 -122
- package/src/components/post-block/index.ts +0 -1
- package/src/components/progress/Progress.tsx +0 -68
- package/src/components/progress/ProgressCircular.stories.tsx +0 -43
- package/src/components/progress/ProgressCircular.test.tsx +0 -46
- package/src/components/progress/ProgressCircular.tsx +0 -82
- package/src/components/progress/ProgressLinear.stories.tsx +0 -12
- package/src/components/progress/ProgressLinear.test.tsx +0 -30
- package/src/components/progress/ProgressLinear.tsx +0 -50
- package/src/components/progress/index.ts +0 -3
- package/src/components/progress-tracker/ProgressTracker.stories.tsx +0 -145
- package/src/components/progress-tracker/ProgressTracker.test.tsx +0 -42
- package/src/components/progress-tracker/ProgressTracker.tsx +0 -87
- package/src/components/progress-tracker/ProgressTrackerProvider.test.tsx +0 -65
- package/src/components/progress-tracker/ProgressTrackerProvider.tsx +0 -67
- package/src/components/progress-tracker/ProgressTrackerStep.test.tsx +0 -36
- package/src/components/progress-tracker/ProgressTrackerStep.tsx +0 -159
- package/src/components/progress-tracker/ProgressTrackerStepPanel.test.tsx +0 -34
- package/src/components/progress-tracker/ProgressTrackerStepPanel.tsx +0 -67
- package/src/components/progress-tracker/index.ts +0 -4
- package/src/components/radio-button/RadioButton.stories.tsx +0 -71
- package/src/components/radio-button/RadioButton.test.tsx +0 -143
- package/src/components/radio-button/RadioButton.tsx +0 -143
- package/src/components/radio-button/RadioGroup.stories.tsx +0 -39
- package/src/components/radio-button/RadioGroup.test.tsx +0 -29
- package/src/components/radio-button/RadioGroup.tsx +0 -44
- package/src/components/radio-button/index.ts +0 -2
- package/src/components/select/Select.stories.tsx +0 -385
- package/src/components/select/Select.test.tsx +0 -199
- package/src/components/select/Select.tsx +0 -199
- package/src/components/select/SelectMultiple.stories.tsx +0 -315
- package/src/components/select/SelectMultiple.test.tsx +0 -213
- package/src/components/select/SelectMultiple.tsx +0 -206
- package/src/components/select/WithSelectContext.tsx +0 -147
- package/src/components/select/constants.ts +0 -55
- package/src/components/select/index.ts +0 -2
- package/src/components/side-navigation/SideNavigation.stories.tsx +0 -191
- package/src/components/side-navigation/SideNavigation.test.tsx +0 -37
- package/src/components/side-navigation/SideNavigation.tsx +0 -52
- package/src/components/side-navigation/SideNavigationItem.stories.tsx +0 -133
- package/src/components/side-navigation/SideNavigationItem.test.tsx +0 -136
- package/src/components/side-navigation/SideNavigationItem.tsx +0 -165
- package/src/components/side-navigation/index.ts +0 -2
- package/src/components/skeleton/SkeletonCircle.stories.tsx +0 -41
- package/src/components/skeleton/SkeletonCircle.test.tsx +0 -27
- package/src/components/skeleton/SkeletonCircle.tsx +0 -52
- package/src/components/skeleton/SkeletonRectangle.stories.tsx +0 -82
- package/src/components/skeleton/SkeletonRectangle.test.tsx +0 -27
- package/src/components/skeleton/SkeletonRectangle.tsx +0 -88
- package/src/components/skeleton/SkeletonTypography.stories.tsx +0 -19
- package/src/components/skeleton/SkeletonTypography.test.tsx +0 -27
- package/src/components/skeleton/SkeletonTypography.tsx +0 -59
- package/src/components/skeleton/index.ts +0 -3
- package/src/components/slider/Slider.stories.tsx +0 -45
- package/src/components/slider/Slider.test.tsx +0 -29
- package/src/components/slider/Slider.tsx +0 -299
- package/src/components/slider/index.ts +0 -2
- package/src/components/slideshow/Slides.tsx +0 -130
- package/src/components/slideshow/Slideshow.stories.tsx +0 -179
- package/src/components/slideshow/Slideshow.test.tsx +0 -35
- package/src/components/slideshow/Slideshow.tsx +0 -173
- package/src/components/slideshow/SlideshowControls.stories.tsx +0 -100
- package/src/components/slideshow/SlideshowControls.tsx +0 -243
- package/src/components/slideshow/SlideshowItem.tsx +0 -44
- package/src/components/slideshow/SlideshowItemGroup.tsx +0 -60
- package/src/components/slideshow/constants.ts +0 -24
- package/src/components/slideshow/index.ts +0 -4
- package/src/components/slideshow/useKeyNavigate.ts +0 -28
- package/src/components/slideshow/usePaginationVisibleRange.ts +0 -37
- package/src/components/slideshow/useSlideFocusManagement.tsx +0 -92
- package/src/components/slideshow/useSwipeNavigate.ts +0 -18
- package/src/components/switch/Switch.stories.tsx +0 -49
- package/src/components/switch/Switch.test.tsx +0 -144
- package/src/components/switch/Switch.tsx +0 -145
- package/src/components/switch/index.ts +0 -1
- package/src/components/table/Table.test.tsx +0 -29
- package/src/components/table/Table.tsx +0 -59
- package/src/components/table/TableBody.test.tsx +0 -30
- package/src/components/table/TableBody.tsx +0 -42
- package/src/components/table/TableCell.test.tsx +0 -72
- package/src/components/table/TableCell.tsx +0 -130
- package/src/components/table/TableHeader.test.tsx +0 -30
- package/src/components/table/TableHeader.tsx +0 -48
- package/src/components/table/TableRow.test.tsx +0 -40
- package/src/components/table/TableRow.tsx +0 -71
- package/src/components/table/index.ts +0 -5
- package/src/components/tabs/Tab.test.tsx +0 -50
- package/src/components/tabs/Tab.tsx +0 -133
- package/src/components/tabs/TabList.test.tsx +0 -49
- package/src/components/tabs/TabList.tsx +0 -94
- package/src/components/tabs/TabPanel.test.tsx +0 -37
- package/src/components/tabs/TabPanel.tsx +0 -67
- package/src/components/tabs/TabProvider.test.tsx +0 -161
- package/src/components/tabs/TabProvider.tsx +0 -67
- package/src/components/tabs/Tabs.stories.tsx +0 -170
- package/src/components/tabs/index.ts +0 -4
- package/src/components/tabs/state.ts +0 -114
- package/src/components/tabs/test-utils.ts +0 -39
- package/src/components/text/Text.stories.tsx +0 -177
- package/src/components/text/Text.test.tsx +0 -92
- package/src/components/text/Text.tsx +0 -139
- package/src/components/text/index.ts +0 -1
- package/src/components/text-field/TextField.stories.tsx +0 -180
- package/src/components/text-field/TextField.test.tsx +0 -298
- package/src/components/text-field/TextField.tsx +0 -493
- package/src/components/text-field/index.ts +0 -1
- package/src/components/thumbnail/Thumbnail.stories.tsx +0 -448
- package/src/components/thumbnail/Thumbnail.test.tsx +0 -88
- package/src/components/thumbnail/Thumbnail.tsx +0 -248
- package/src/components/thumbnail/index.ts +0 -3
- package/src/components/thumbnail/types.ts +0 -48
- package/src/components/thumbnail/useFocusPointStyle.test.ts +0 -92
- package/src/components/thumbnail/useFocusPointStyle.tsx +0 -107
- package/src/components/thumbnail/useImageLoad.ts +0 -40
- package/src/components/toolbar/Toolbar.tsx +0 -68
- package/src/components/toolbar/index.ts +0 -1
- package/src/components/tooltip/Tooltip.stories.tsx +0 -118
- package/src/components/tooltip/Tooltip.test.tsx +0 -417
- package/src/components/tooltip/Tooltip.tsx +0 -165
- package/src/components/tooltip/constants.ts +0 -8
- package/src/components/tooltip/context.tsx +0 -17
- package/src/components/tooltip/index.ts +0 -1
- package/src/components/tooltip/useInjectTooltipRef.tsx +0 -55
- package/src/components/tooltip/useTooltipOpen.tsx +0 -143
- package/src/components/uploader/Uploader.stories.tsx +0 -109
- package/src/components/uploader/Uploader.test.tsx +0 -146
- package/src/components/uploader/Uploader.tsx +0 -177
- package/src/components/uploader/index.ts +0 -1
- package/src/components/user-block/UserBlock.stories.tsx +0 -133
- package/src/components/user-block/UserBlock.test.tsx +0 -106
- package/src/components/user-block/UserBlock.tsx +0 -193
- package/src/components/user-block/index.ts +0 -1
- package/src/constants.ts +0 -27
- package/src/hooks/useBooleanState.tsx +0 -13
- package/src/hooks/useCallbackOnEscape.ts +0 -34
- package/src/hooks/useChipGroupNavigation.tsx +0 -75
- package/src/hooks/useClickAway.tsx +0 -48
- package/src/hooks/useDisableBodyScroll.ts +0 -28
- package/src/hooks/useEventCallback.tsx +0 -17
- package/src/hooks/useFocus.tsx +0 -21
- package/src/hooks/useFocusTrap.ts +0 -93
- package/src/hooks/useFocusWithin.ts +0 -33
- package/src/hooks/useId.test.tsx +0 -22
- package/src/hooks/useId.ts +0 -15
- package/src/hooks/useImageSize.ts +0 -17
- package/src/hooks/useInfiniteScroll.tsx +0 -60
- package/src/hooks/useIntersectionObserver.tsx +0 -43
- package/src/hooks/useInterval.tsx +0 -31
- package/src/hooks/useKeyboardListNavigation.tsx +0 -204
- package/src/hooks/useListenFocus.tsx +0 -26
- package/src/hooks/useOverflowTooltipLabel.tsx +0 -32
- package/src/hooks/usePopper.ts +0 -12
- package/src/hooks/usePreviousValue.ts +0 -12
- package/src/hooks/useRovingTabIndex.tsx +0 -90
- package/src/hooks/useSizeOnWindowResize.ts +0 -30
- package/src/hooks/useSlideshowControls.ts +0 -246
- package/src/hooks/useStopPropagation.ts +0 -21
- package/src/hooks/useTransitionVisibility.ts +0 -48
- package/src/index.ts +0 -63
- package/src/stories/controls/color.ts +0 -7
- package/src/stories/controls/element.ts +0 -6
- package/src/stories/controls/focusPoint.ts +0 -1
- package/src/stories/controls/icons.ts +0 -126
- package/src/stories/controls/image.ts +0 -84
- package/src/stories/controls/selectArgType.ts +0 -8
- package/src/stories/controls/theme.ts +0 -3
- package/src/stories/controls/typography.ts +0 -5
- package/src/stories/controls/withUndefined.ts +0 -1
- package/src/stories/decorators/withChromaticForceScreenSize.tsx +0 -7
- package/src/stories/decorators/withCombinations.tsx +0 -132
- package/src/stories/decorators/withNestedProps.tsx +0 -22
- package/src/stories/decorators/withResizableBox.tsx +0 -21
- package/src/stories/decorators/withThemedBackground.tsx +0 -16
- package/src/stories/decorators/withValueOnChange.tsx +0 -18
- package/src/stories/decorators/withWrapper.tsx +0 -19
- package/src/stories/generated/Autocomplete/Demos.stories.tsx +0 -7
- package/src/stories/generated/Avatar/Demos.stories.tsx +0 -7
- package/src/stories/generated/Badge/Demos.stories.tsx +0 -9
- package/src/stories/generated/Button/Demos.stories.tsx +0 -11
- package/src/stories/generated/Checkbox/Demos.stories.tsx +0 -6
- package/src/stories/generated/Chip/Demos.stories.tsx +0 -11
- package/src/stories/generated/CommentBlock/Demos.stories.tsx +0 -8
- package/src/stories/generated/DatePicker/Demos.stories.tsx +0 -8
- package/src/stories/generated/Dialog/Demos.stories.tsx +0 -10
- package/src/stories/generated/Divider/Demos.stories.tsx +0 -6
- package/src/stories/generated/Dropdown/Demos.stories.tsx +0 -8
- package/src/stories/generated/ExpansionPanel/Demos.stories.tsx +0 -9
- package/src/stories/generated/Flag/Demos.stories.tsx +0 -6
- package/src/stories/generated/GenericBlock/Demos.stories.tsx +0 -8
- package/src/stories/generated/Heading/Demos.stories.tsx +0 -6
- package/src/stories/generated/Icon/Demos.stories.tsx +0 -8
- package/src/stories/generated/ImageBlock/Demos.stories.tsx +0 -9
- package/src/stories/generated/ImageLightbox/Demos.stories.tsx +0 -6
- package/src/stories/generated/Lightbox/Demos.stories.tsx +0 -6
- package/src/stories/generated/LinkPreview/Demos.stories.tsx +0 -7
- package/src/stories/generated/List/Demos.stories.tsx +0 -11
- package/src/stories/generated/Message/Demos.stories.tsx +0 -11
- package/src/stories/generated/Mosaic/Demos.stories.tsx +0 -10
- package/src/stories/generated/Notification/Demos.stories.tsx +0 -6
- package/src/stories/generated/Popover/Demos.stories.tsx +0 -11
- package/src/stories/generated/PopoverDialog/Demos.stories.tsx +0 -6
- package/src/stories/generated/PostBlock/Demos.stories.tsx +0 -6
- package/src/stories/generated/Progress/Demos.stories.tsx +0 -7
- package/src/stories/generated/ProgressTracker/Demos.stories.tsx +0 -9
- package/src/stories/generated/RadioButton/Demos.stories.tsx +0 -6
- package/src/stories/generated/Select/Demos.stories.tsx +0 -14
- package/src/stories/generated/SideNavigation/Demos.stories.tsx +0 -10
- package/src/stories/generated/Skeleton/Demos.stories.tsx +0 -9
- package/src/stories/generated/Slider/Demos.stories.tsx +0 -9
- package/src/stories/generated/Slideshow/Demos.stories.tsx +0 -8
- package/src/stories/generated/Switch/Demos.stories.tsx +0 -6
- package/src/stories/generated/Table/Demos.stories.tsx +0 -7
- package/src/stories/generated/Tabs/Demos.stories.tsx +0 -8
- package/src/stories/generated/TextField/Demos.stories.tsx +0 -20
- package/src/stories/generated/Thumbnail/Demos.stories.tsx +0 -12
- package/src/stories/generated/Toolbar/Demos.stories.tsx +0 -10
- package/src/stories/generated/Tooltip/Demos.stories.tsx +0 -8
- package/src/stories/generated/Uploader/Demos.stories.tsx +0 -8
- package/src/stories/generated/UserBlock/Demos.stories.tsx +0 -11
- package/src/stories/utils/CustomLink.tsx +0 -12
- package/src/stories/utils/concatPath.tsx +0 -17
- package/src/stories/utils/disableArgTypes.ts +0 -3
- package/src/stories/utils/initDemoShadowDOMPortal.ts +0 -10
- package/src/stories/utils/lorem.ts +0 -59
- package/src/stories/utils/theming.tsx +0 -166
- package/src/stories/utils/toFlattenProps.ts +0 -28
- package/src/stories/utils/withCategory.ts +0 -12
- package/src/testing/utils/ThemeSentinel.tsx +0 -10
- package/src/testing/utils/commonTestsSuiteRTL.tsx +0 -193
- package/src/testing/utils/index.ts +0 -1
- package/src/testing/utils/queries.ts +0 -19
- package/src/untypped-modules.d.ts +0 -9
- package/src/utils/ClickAwayProvider/ClickAwayProvider.stories.jsx +0 -70
- package/src/utils/ClickAwayProvider/ClickAwayProvider.tsx +0 -69
- package/src/utils/ClickAwayProvider/index.ts +0 -1
- package/src/utils/MaterialThemeSwitcher/MaterialThemeSwitcher.tsx +0 -54
- package/src/utils/MaterialThemeSwitcher/index.ts +0 -1
- package/src/utils/Portal/Portal.test.tsx +0 -31
- package/src/utils/Portal/Portal.tsx +0 -33
- package/src/utils/Portal/PortalProvider.stories.jsx +0 -22
- package/src/utils/Portal/PortalProvider.test.tsx +0 -72
- package/src/utils/Portal/PortalProvider.tsx +0 -24
- package/src/utils/Portal/index.tsx +0 -2
- package/src/utils/browser/DOM/findImage.tsx +0 -3
- package/src/utils/browser/DOM/startViewTransition.ts +0 -68
- package/src/utils/browser/focus/constants.ts +0 -7
- package/src/utils/browser/focus/getFirstAndLastFocusable.test.ts +0 -134
- package/src/utils/browser/focus/getFirstAndLastFocusable.ts +0 -21
- package/src/utils/browser/focus/getFocusableElements.test.ts +0 -151
- package/src/utils/browser/focus/getFocusableElements.ts +0 -7
- package/src/utils/browser/isFocusVisible.ts +0 -9
- package/src/utils/browser/isHoverNotSupported.test.js +0 -24
- package/src/utils/browser/isHoverNotSupported.ts +0 -2
- package/src/utils/browser/isReducedMotion.ts +0 -6
- package/src/utils/date/addMonthResetDay.test.ts +0 -13
- package/src/utils/date/addMonthResetDay.ts +0 -9
- package/src/utils/date/formatDayNumber.test.ts +0 -12
- package/src/utils/date/formatDayNumber.ts +0 -5
- package/src/utils/date/getFirstDayOfWeek.test.ts +0 -20
- package/src/utils/date/getFirstDayOfWeek.ts +0 -59
- package/src/utils/date/getMonthCalendar.test.ts +0 -127
- package/src/utils/date/getMonthCalendar.ts +0 -69
- package/src/utils/date/getWeekDays.test.ts +0 -48
- package/src/utils/date/getWeekDays.ts +0 -34
- package/src/utils/date/getYearDisplayName.test.ts +0 -20
- package/src/utils/date/getYearDisplayName.ts +0 -12
- package/src/utils/date/isDateValid.test.ts +0 -15
- package/src/utils/date/isDateValid.ts +0 -4
- package/src/utils/date/isSameDay.test.ts +0 -37
- package/src/utils/date/isSameDay.ts +0 -11
- package/src/utils/disabled/DisabledStateContext.tsx +0 -29
- package/src/utils/disabled/DisabledStateProvider.stories.tsx +0 -92
- package/src/utils/disabled/index.ts +0 -2
- package/src/utils/disabled/useDisableStateProps.test.tsx +0 -74
- package/src/utils/disabled/useDisableStateProps.tsx +0 -37
- package/src/utils/function/makeListenerTowerContext.ts +0 -32
- package/src/utils/index.ts +0 -7
- package/src/utils/locale/getCurrentLocale.ts +0 -4
- package/src/utils/locale/parseLocale.test.ts +0 -17
- package/src/utils/locale/parseLocale.ts +0 -23
- package/src/utils/locale/types.ts +0 -8
- package/src/utils/number/clamp.ts +0 -17
- package/src/utils/object/isEqual.test.ts +0 -25
- package/src/utils/object/isEqual.ts +0 -11
- package/src/utils/partitionMulti.test.ts +0 -27
- package/src/utils/react/OnBeforeUnmount.tsx +0 -20
- package/src/utils/react/RawClickable.test.tsx +0 -153
- package/src/utils/react/RawClickable.tsx +0 -65
- package/src/utils/react/flattenChildren.ts +0 -32
- package/src/utils/react/forwardRef.ts +0 -11
- package/src/utils/react/forwardRefPolymorphic.ts +0 -9
- package/src/utils/react/mergeRefs.ts +0 -33
- package/src/utils/react/renderLink.tsx +0 -17
- package/src/utils/react/skipRender.tsx +0 -18
- package/src/utils/react/unref.ts +0 -7
- package/src/utils/react/wrapChildrenIconWithSpaces.test.tsx +0 -37
- package/src/utils/react/wrapChildrenIconWithSpaces.tsx +0 -22
- package/src/utils/theme/ThemeContext.ts +0 -16
- package/src/utils/theme/invertTheme.ts +0 -4
- package/src/utils/type/Comp.ts +0 -14
- package/src/utils/type/ComponentRef.ts +0 -16
- package/src/utils/type/HasAriaDisabled.ts +0 -6
- package/src/utils/type/HasPolymorphicAs.ts +0 -6
- package/src/utils/type/HasRequiredLinkHref.ts +0 -1
- package/src/utils/type/MaybeElementOrRef.ts +0 -6
- package/src/utils/type/index.ts +0 -9
- package/src/utils/type/isComponent.ts +0 -33
- package/src/utils/type/isComponentType.ts +0 -9
- /package/_internal/{Falsy.d.ts → d95844c1.d.ts} +0 -0
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"68c10f98.js","sources":["../../src/components/expansion-panel/ExpansionPanel.tsx"],"sourcesContent":["import React, { Children, PropsWithChildren, ReactNode, useRef } from 'react';\n\nimport classNames from 'classnames';\n\nimport { mdiChevronDown, mdiChevronUp } from '@lumx/icons';\n\nimport isEmpty from 'lodash/isEmpty';\n\nimport { ColorPalette, DragHandle, Emphasis, IconButton, IconButtonProps, Theme } from '@lumx/react';\nimport { GenericProps, HasCloseMode, HasTheme, isComponent } from '@lumx/react/utils/type';\nimport { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';\nimport { partitionMulti } from '@lumx/react/utils/partitionMulti';\nimport { useTheme } from '@lumx/react/utils/theme/ThemeContext';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\nimport { IS_BROWSER } from '@lumx/react/constants';\n\n/**\n * Defines the props of the component.\n */\nexport interface ExpansionPanelProps extends GenericProps, HasCloseMode, HasTheme {\n /** Whether the expansion panel has a background. */\n hasBackground?: boolean;\n /** Whether the header has a divider. */\n hasHeaderDivider?: boolean;\n /** Whether the component is open or not. */\n isOpen?: boolean;\n /** Label text (overwritten if a `<header>` is provided in the children). */\n label?: string;\n /** On open callback. */\n onOpen?: (event: React.MouseEvent) => void;\n /** On close callback. */\n onClose?: (event: React.MouseEvent) => void;\n /** Props to pass to the toggle button (minus those already set by the ExpansionPanel props). */\n toggleButtonProps: Pick<IconButtonProps, 'label'> &\n Omit<IconButtonProps, 'label' | 'onClick' | 'icon' | 'emphasis' | 'color'>;\n /** On toggle open or close callback. */\n onToggleOpen?(shouldOpen: boolean, event: React.MouseEvent): void;\n /** Children */\n children?: React.ReactNode;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'ExpansionPanel';\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<ExpansionPanelProps> = {\n closeMode: 'unmount',\n};\n\nconst isDragHandle = isComponent(DragHandle);\nconst isHeader = isComponent('header');\nconst isFooter = isComponent('footer');\n\n/**\n * ExpansionPanel component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const ExpansionPanel = forwardRef<ExpansionPanelProps, HTMLDivElement>((props, ref) => {\n const defaultTheme = useTheme() || Theme.light;\n const {\n className,\n closeMode = DEFAULT_PROPS.closeMode,\n children: anyChildren,\n hasBackground,\n hasHeaderDivider,\n isOpen,\n label,\n onClose,\n onOpen,\n onToggleOpen,\n theme = defaultTheme,\n toggleButtonProps,\n ...forwardedProps\n } = props;\n\n const children: ReactNode[] = Children.toArray(anyChildren);\n\n // Partition children by types.\n const [[dragHandle], [header], [footer], content] = partitionMulti(children, [isDragHandle, isHeader, isFooter]);\n\n // Either take the header in children or create one with the label.\n const headerProps: PropsWithChildren<any> = React.isValidElement(header) ? header.props : {};\n const headerContent = !isEmpty(headerProps.children) ? (\n headerProps.children\n ) : (\n <span className={`${CLASSNAME}__label`}>{label}</span>\n );\n\n const toggleOpen = (event: React.MouseEvent) => {\n const shouldOpen = !isOpen;\n\n if (onOpen && shouldOpen) {\n onOpen(event);\n }\n if (onClose && !shouldOpen) {\n onClose(event);\n }\n if (onToggleOpen) {\n onToggleOpen(shouldOpen, event);\n }\n };\n\n const color = theme === Theme.dark ? ColorPalette.light : ColorPalette.dark;\n\n const rootClassName = classNames(\n className,\n handleBasicClasses({\n hasBackground,\n hasHeader: Boolean(!isEmpty(headerProps.children)),\n hasHeaderDivider,\n isClose: !isOpen,\n isDraggable: Boolean(dragHandle),\n isOpen,\n prefix: CLASSNAME,\n theme,\n }),\n );\n\n const wrapperRef = useRef<HTMLDivElement>(null);\n\n // Children stay visible while the open/close transition is running\n const [isChildrenVisible, setChildrenVisible] = React.useState(isOpen);\n\n const isOpenRef = React.useRef(isOpen);\n React.useEffect(() => {\n if (isOpen || closeMode === 'hide') {\n setChildrenVisible(true);\n } else if (!IS_BROWSER) {\n // Outside a browser we can't wait for the transition\n setChildrenVisible(false);\n }\n isOpenRef.current = isOpen;\n }, [closeMode, isOpen]);\n\n // Change children's visibility on the transition end\n React.useEffect(() => {\n const { current: wrapper } = wrapperRef;\n if (!IS_BROWSER || !wrapper) {\n return undefined;\n }\n const onTransitionEnd = () => {\n setChildrenVisible(isOpenRef.current || closeMode === 'hide');\n };\n wrapper.addEventListener('transitionend', onTransitionEnd);\n return () => wrapper.removeEventListener('transitionend', onTransitionEnd);\n }, [closeMode]);\n\n return (\n <section ref={ref} {...forwardedProps} className={rootClassName}>\n {/* eslint-disable-next-line jsx-a11y/click-events-have-key-events,jsx-a11y/no-static-element-interactions */}\n <header className={`${CLASSNAME}__header`} onClick={toggleOpen}>\n {dragHandle && <div className={`${CLASSNAME}__header-drag`}>{dragHandle}</div>}\n\n <div {...headerProps} className={`${CLASSNAME}__header-content`}>\n {headerContent}\n </div>\n\n <div className={`${CLASSNAME}__header-toggle`}>\n <IconButton\n {...toggleButtonProps}\n color={color}\n emphasis={Emphasis.low}\n icon={isOpen ? mdiChevronUp : mdiChevronDown}\n aria-expanded={isOpen || 'false'}\n />\n </div>\n </header>\n\n <div className={`${CLASSNAME}__wrapper`} ref={wrapperRef}>\n {(isOpen || isChildrenVisible) && (\n <div className={`${CLASSNAME}__container`}>\n <div className={`${CLASSNAME}__content`}>{content}</div>\n\n {footer && <div className={`${CLASSNAME}__footer`}>{footer}</div>}\n </div>\n )}\n </div>\n </section>\n );\n});\nExpansionPanel.displayName = COMPONENT_NAME;\nExpansionPanel.className = CLASSNAME;\nExpansionPanel.defaultProps = DEFAULT_PROPS;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","closeMode","isDragHandle","isComponent","DragHandle","isHeader","isFooter","ExpansionPanel","forwardRef","props","ref","defaultTheme","useTheme","Theme","light","className","children","anyChildren","hasBackground","hasHeaderDivider","isOpen","label","onClose","onOpen","onToggleOpen","theme","toggleButtonProps","forwardedProps","Children","toArray","dragHandle","header","footer","content","partitionMulti","headerProps","React","isValidElement","headerContent","isEmpty","_jsx","toggleOpen","event","shouldOpen","color","dark","ColorPalette","rootClassName","classNames","handleBasicClasses","hasHeader","Boolean","isClose","isDraggable","prefix","wrapperRef","useRef","isChildrenVisible","setChildrenVisible","useState","isOpenRef","useEffect","IS_BROWSER","current","wrapper","undefined","onTransitionEnd","addEventListener","removeEventListener","_jsxs","onClick","IconButton","emphasis","Emphasis","low","icon","mdiChevronUp","mdiChevronDown","displayName","defaultProps"],"mappings":"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"}
|
|
@@ -0,0 +1,109 @@
|
|
|
1
|
+
import { m as getRootClassName, A as Alignment, 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 { I as ImageCaption } from './dbe0cf24.js';
|
|
5
|
+
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
6
|
+
import { T as Thumbnail } from './628468c4.js';
|
|
7
|
+
|
|
8
|
+
const ImageBlockCaptionPosition = {
|
|
9
|
+
below: 'below',
|
|
10
|
+
over: 'over'
|
|
11
|
+
};
|
|
12
|
+
|
|
13
|
+
/**
|
|
14
|
+
* Image block sizes.
|
|
15
|
+
*/
|
|
16
|
+
|
|
17
|
+
/**
|
|
18
|
+
* Defines the props of the component.
|
|
19
|
+
*/
|
|
20
|
+
|
|
21
|
+
/**
|
|
22
|
+
* Component display name.
|
|
23
|
+
*/
|
|
24
|
+
const COMPONENT_NAME = 'ImageBlock';
|
|
25
|
+
|
|
26
|
+
/**
|
|
27
|
+
* Component default class name and class prefix.
|
|
28
|
+
*/
|
|
29
|
+
const CLASSNAME = getRootClassName(COMPONENT_NAME);
|
|
30
|
+
|
|
31
|
+
/**
|
|
32
|
+
* Component default props.
|
|
33
|
+
*/
|
|
34
|
+
const DEFAULT_PROPS = {
|
|
35
|
+
captionPosition: ImageBlockCaptionPosition.below,
|
|
36
|
+
align: Alignment.left
|
|
37
|
+
};
|
|
38
|
+
|
|
39
|
+
/**
|
|
40
|
+
* ImageBlock component.
|
|
41
|
+
*
|
|
42
|
+
* @param props Component props.
|
|
43
|
+
* @param ref Component ref.
|
|
44
|
+
* @return React element.
|
|
45
|
+
*/
|
|
46
|
+
const ImageBlock = forwardRef((props, ref) => {
|
|
47
|
+
const defaultTheme = useTheme() || Theme.light;
|
|
48
|
+
const {
|
|
49
|
+
actions,
|
|
50
|
+
align = DEFAULT_PROPS.align,
|
|
51
|
+
alt,
|
|
52
|
+
captionPosition = DEFAULT_PROPS.captionPosition,
|
|
53
|
+
captionStyle,
|
|
54
|
+
className,
|
|
55
|
+
description,
|
|
56
|
+
descriptionProps,
|
|
57
|
+
fillHeight,
|
|
58
|
+
image,
|
|
59
|
+
size,
|
|
60
|
+
tags,
|
|
61
|
+
theme = defaultTheme,
|
|
62
|
+
thumbnailProps,
|
|
63
|
+
title,
|
|
64
|
+
titleProps,
|
|
65
|
+
...forwardedProps
|
|
66
|
+
} = props;
|
|
67
|
+
return /*#__PURE__*/jsxs("figure", {
|
|
68
|
+
ref: ref,
|
|
69
|
+
...forwardedProps,
|
|
70
|
+
className: classNames(className, handleBasicClasses({
|
|
71
|
+
prefix: CLASSNAME,
|
|
72
|
+
captionPosition,
|
|
73
|
+
align,
|
|
74
|
+
size,
|
|
75
|
+
theme
|
|
76
|
+
}), fillHeight && `${CLASSNAME}--fill-height`),
|
|
77
|
+
children: [/*#__PURE__*/jsx(Thumbnail, {
|
|
78
|
+
...thumbnailProps,
|
|
79
|
+
className: classNames(`${CLASSNAME}__image`, thumbnailProps?.className),
|
|
80
|
+
fillHeight: fillHeight,
|
|
81
|
+
align: align,
|
|
82
|
+
image: image,
|
|
83
|
+
size: size,
|
|
84
|
+
theme: theme,
|
|
85
|
+
alt: alt || title
|
|
86
|
+
}), /*#__PURE__*/jsx(ImageCaption, {
|
|
87
|
+
as: "figcaption",
|
|
88
|
+
baseClassName: CLASSNAME,
|
|
89
|
+
theme: theme,
|
|
90
|
+
title: title,
|
|
91
|
+
titleProps: titleProps,
|
|
92
|
+
description: description,
|
|
93
|
+
descriptionProps: descriptionProps,
|
|
94
|
+
tags: tags,
|
|
95
|
+
captionStyle: captionStyle,
|
|
96
|
+
align: align,
|
|
97
|
+
truncate: captionPosition === 'over'
|
|
98
|
+
}), actions && /*#__PURE__*/jsx("div", {
|
|
99
|
+
className: `${CLASSNAME}__actions`,
|
|
100
|
+
children: actions
|
|
101
|
+
})]
|
|
102
|
+
});
|
|
103
|
+
});
|
|
104
|
+
ImageBlock.displayName = COMPONENT_NAME;
|
|
105
|
+
ImageBlock.className = CLASSNAME;
|
|
106
|
+
ImageBlock.defaultProps = DEFAULT_PROPS;
|
|
107
|
+
|
|
108
|
+
export { ImageBlock, ImageBlockCaptionPosition };
|
|
109
|
+
//# sourceMappingURL=690ca33e.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"690ca33e.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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"}
|
|
@@ -0,0 +1,108 @@
|
|
|
1
|
+
import { m as getRootClassName, O as Orientation, n as forwardRef, b as Theme, l as classNames } from './6589b796.js';
|
|
2
|
+
import isObject from 'lodash/isObject';
|
|
3
|
+
import { h as handleBasicClasses } from './e2afb13f.js';
|
|
4
|
+
import { u as useTheme } from './3181f000.js';
|
|
5
|
+
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
6
|
+
import { ThumbnailVariant } from './76be70dd.js';
|
|
7
|
+
import { T as Thumbnail } from './628468c4.js';
|
|
8
|
+
|
|
9
|
+
/**
|
|
10
|
+
* Component display name.
|
|
11
|
+
*/
|
|
12
|
+
const COMPONENT_NAME = 'PostBlock';
|
|
13
|
+
|
|
14
|
+
/**
|
|
15
|
+
* Component default class name and class prefix.
|
|
16
|
+
*/
|
|
17
|
+
const CLASSNAME = getRootClassName(COMPONENT_NAME);
|
|
18
|
+
|
|
19
|
+
/**
|
|
20
|
+
* Component default props.
|
|
21
|
+
*/
|
|
22
|
+
const DEFAULT_PROPS = {
|
|
23
|
+
orientation: Orientation.horizontal
|
|
24
|
+
};
|
|
25
|
+
|
|
26
|
+
/**
|
|
27
|
+
* PostBlock component.
|
|
28
|
+
*
|
|
29
|
+
* @param props Component props.
|
|
30
|
+
* @param ref Component ref.
|
|
31
|
+
* @return React element.
|
|
32
|
+
*/
|
|
33
|
+
const PostBlock = forwardRef((props, ref) => {
|
|
34
|
+
const defaultTheme = useTheme() || Theme.light;
|
|
35
|
+
const {
|
|
36
|
+
actions,
|
|
37
|
+
attachments,
|
|
38
|
+
author,
|
|
39
|
+
className,
|
|
40
|
+
meta,
|
|
41
|
+
onClick,
|
|
42
|
+
orientation = DEFAULT_PROPS.orientation,
|
|
43
|
+
tags,
|
|
44
|
+
text,
|
|
45
|
+
theme = defaultTheme,
|
|
46
|
+
thumbnailProps,
|
|
47
|
+
title,
|
|
48
|
+
...forwardedProps
|
|
49
|
+
} = props;
|
|
50
|
+
return /*#__PURE__*/jsxs("div", {
|
|
51
|
+
ref: ref,
|
|
52
|
+
className: classNames(className, handleBasicClasses({
|
|
53
|
+
prefix: CLASSNAME,
|
|
54
|
+
orientation,
|
|
55
|
+
theme
|
|
56
|
+
})),
|
|
57
|
+
...forwardedProps,
|
|
58
|
+
children: [thumbnailProps && /*#__PURE__*/jsx("div", {
|
|
59
|
+
className: `${CLASSNAME}__thumbnail`,
|
|
60
|
+
children: /*#__PURE__*/jsx(Thumbnail, {
|
|
61
|
+
...thumbnailProps,
|
|
62
|
+
theme: theme,
|
|
63
|
+
variant: ThumbnailVariant.rounded
|
|
64
|
+
})
|
|
65
|
+
}), /*#__PURE__*/jsxs("div", {
|
|
66
|
+
className: `${CLASSNAME}__wrapper`,
|
|
67
|
+
children: [author && /*#__PURE__*/jsx("div", {
|
|
68
|
+
className: `${CLASSNAME}__author`,
|
|
69
|
+
children: author
|
|
70
|
+
}), title && /*#__PURE__*/jsx("button", {
|
|
71
|
+
type: "button",
|
|
72
|
+
className: `${CLASSNAME}__title`,
|
|
73
|
+
onClick: onClick,
|
|
74
|
+
children: title
|
|
75
|
+
}), meta && /*#__PURE__*/jsx("span", {
|
|
76
|
+
className: `${CLASSNAME}__meta`,
|
|
77
|
+
children: meta
|
|
78
|
+
}), isObject(text) && text.__html ?
|
|
79
|
+
/*#__PURE__*/
|
|
80
|
+
// eslint-disable-next-line react/no-danger
|
|
81
|
+
jsx("p", {
|
|
82
|
+
dangerouslySetInnerHTML: text,
|
|
83
|
+
className: `${CLASSNAME}__text`
|
|
84
|
+
}) : /*#__PURE__*/jsx("p", {
|
|
85
|
+
className: `${CLASSNAME}__text`,
|
|
86
|
+
children: text
|
|
87
|
+
}), attachments && /*#__PURE__*/jsx("div", {
|
|
88
|
+
className: `${CLASSNAME}__attachments`,
|
|
89
|
+
children: attachments
|
|
90
|
+
}), (tags || actions) && /*#__PURE__*/jsxs("div", {
|
|
91
|
+
className: `${CLASSNAME}__toolbar`,
|
|
92
|
+
children: [tags && /*#__PURE__*/jsx("div", {
|
|
93
|
+
className: `${CLASSNAME}__tags`,
|
|
94
|
+
children: tags
|
|
95
|
+
}), actions && /*#__PURE__*/jsx("div", {
|
|
96
|
+
className: `${CLASSNAME}__actions`,
|
|
97
|
+
children: actions
|
|
98
|
+
})]
|
|
99
|
+
})]
|
|
100
|
+
})]
|
|
101
|
+
});
|
|
102
|
+
});
|
|
103
|
+
PostBlock.displayName = COMPONENT_NAME;
|
|
104
|
+
PostBlock.className = CLASSNAME;
|
|
105
|
+
PostBlock.defaultProps = DEFAULT_PROPS;
|
|
106
|
+
|
|
107
|
+
export { PostBlock };
|
|
108
|
+
//# sourceMappingURL=6ca04271.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"6ca04271.js","sources":["../../src/components/post-block/PostBlock.tsx"],"sourcesContent":["import { ReactNode } from 'react';\n\nimport classNames from 'classnames';\nimport isObject from 'lodash/isObject';\n\nimport { Orientation, Theme, Thumbnail, ThumbnailProps, ThumbnailVariant } from '@lumx/react';\nimport { GenericProps, HasTheme } from '@lumx/react/utils/type';\nimport { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';\nimport { useTheme } from '@lumx/react/utils/theme/ThemeContext';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\n\n/**\n * Defines the props of the component.\n */\nexport interface PostBlockProps extends GenericProps, HasTheme {\n /** Action toolbar content. */\n actions?: ReactNode;\n /** Attachment content. */\n attachments?: ReactNode;\n /** Author content. */\n author?: ReactNode;\n /** Metadata content. */\n meta?: ReactNode;\n /** Orientation. */\n orientation?: Orientation;\n /** Tag content. */\n tags?: ReactNode;\n /** Content (string, or sanitized html). */\n text?: string | { __html: string };\n /** Thumbnail. */\n thumbnailProps?: ThumbnailProps;\n /** Title. */\n title: string;\n /** On click callback. */\n onClick?(): void;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'PostBlock';\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<PostBlockProps> = {\n orientation: Orientation.horizontal,\n};\n\n/**\n * PostBlock component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const PostBlock = forwardRef<PostBlockProps, HTMLDivElement>((props, ref) => {\n const defaultTheme = useTheme() || Theme.light;\n const {\n actions,\n attachments,\n author,\n className,\n meta,\n onClick,\n orientation = DEFAULT_PROPS.orientation,\n tags,\n text,\n theme = defaultTheme,\n thumbnailProps,\n title,\n ...forwardedProps\n } = props;\n\n return (\n <div\n ref={ref}\n className={classNames(className, handleBasicClasses({ prefix: CLASSNAME, orientation, theme }))}\n {...forwardedProps}\n >\n {thumbnailProps && (\n <div className={`${CLASSNAME}__thumbnail`}>\n <Thumbnail {...thumbnailProps} theme={theme} variant={ThumbnailVariant.rounded} />\n </div>\n )}\n <div className={`${CLASSNAME}__wrapper`}>\n {author && <div className={`${CLASSNAME}__author`}>{author}</div>}\n\n {title && (\n <button type=\"button\" className={`${CLASSNAME}__title`} onClick={onClick}>\n {title}\n </button>\n )}\n\n {meta && <span className={`${CLASSNAME}__meta`}>{meta}</span>}\n\n {isObject(text) && text.__html ? (\n // eslint-disable-next-line react/no-danger\n <p dangerouslySetInnerHTML={text} className={`${CLASSNAME}__text`} />\n ) : (\n <p className={`${CLASSNAME}__text`}>{text}</p>\n )}\n\n {attachments && <div className={`${CLASSNAME}__attachments`}>{attachments}</div>}\n {(tags || actions) && (\n <div className={`${CLASSNAME}__toolbar`}>\n {tags && <div className={`${CLASSNAME}__tags`}>{tags}</div>}\n {actions && <div className={`${CLASSNAME}__actions`}>{actions}</div>}\n </div>\n )}\n </div>\n </div>\n );\n});\nPostBlock.displayName = COMPONENT_NAME;\nPostBlock.className = CLASSNAME;\nPostBlock.defaultProps = DEFAULT_PROPS;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","orientation","Orientation","horizontal","PostBlock","forwardRef","props","ref","defaultTheme","useTheme","Theme","light","actions","attachments","author","className","meta","onClick","tags","text","theme","thumbnailProps","title","forwardedProps","_jsxs","classNames","handleBasicClasses","prefix","children","_jsx","Thumbnail","variant","ThumbnailVariant","rounded","type","isObject","__html","dangerouslySetInnerHTML","displayName","defaultProps"],"mappings":"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"}
|
|
@@ -0,0 +1,165 @@
|
|
|
1
|
+
import { m as getRootClassName, 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 DEFAULT_PROPS$2 = {};
|
|
7
|
+
|
|
8
|
+
/**
|
|
9
|
+
* Component display name.
|
|
10
|
+
*/
|
|
11
|
+
const COMPONENT_NAME$2 = 'SkeletonCircle';
|
|
12
|
+
|
|
13
|
+
/**
|
|
14
|
+
* Component default class name and class prefix.
|
|
15
|
+
*/
|
|
16
|
+
const CLASSNAME$2 = getRootClassName(COMPONENT_NAME$2);
|
|
17
|
+
|
|
18
|
+
/**
|
|
19
|
+
* SkeletonCircle component.
|
|
20
|
+
*
|
|
21
|
+
* @param props Component props.
|
|
22
|
+
* @param ref Component ref.
|
|
23
|
+
* @return React element.
|
|
24
|
+
*/
|
|
25
|
+
const SkeletonCircle = forwardRef((props, ref) => {
|
|
26
|
+
const defaultTheme = useTheme() || Theme.light;
|
|
27
|
+
const {
|
|
28
|
+
className,
|
|
29
|
+
size,
|
|
30
|
+
color,
|
|
31
|
+
theme = defaultTheme,
|
|
32
|
+
...forwardedProps
|
|
33
|
+
} = props;
|
|
34
|
+
return /*#__PURE__*/jsx("div", {
|
|
35
|
+
ref: ref,
|
|
36
|
+
...forwardedProps,
|
|
37
|
+
className: classNames(className, handleBasicClasses({
|
|
38
|
+
prefix: CLASSNAME$2,
|
|
39
|
+
size,
|
|
40
|
+
color,
|
|
41
|
+
theme
|
|
42
|
+
}))
|
|
43
|
+
});
|
|
44
|
+
});
|
|
45
|
+
SkeletonCircle.displayName = COMPONENT_NAME$2;
|
|
46
|
+
SkeletonCircle.defaultProps = DEFAULT_PROPS$2;
|
|
47
|
+
SkeletonCircle.className = CLASSNAME$2;
|
|
48
|
+
|
|
49
|
+
const SkeletonRectangleVariant = {
|
|
50
|
+
squared: 'squared',
|
|
51
|
+
rounded: 'rounded',
|
|
52
|
+
pill: 'pill'
|
|
53
|
+
};
|
|
54
|
+
|
|
55
|
+
/**
|
|
56
|
+
* Defines the props of the component.
|
|
57
|
+
*/
|
|
58
|
+
|
|
59
|
+
const DEFAULT_PROPS$1 = {
|
|
60
|
+
variant: SkeletonRectangleVariant.squared
|
|
61
|
+
};
|
|
62
|
+
|
|
63
|
+
/**
|
|
64
|
+
* Component display name.
|
|
65
|
+
*/
|
|
66
|
+
const COMPONENT_NAME$1 = 'SkeletonRectangle';
|
|
67
|
+
|
|
68
|
+
/**
|
|
69
|
+
* Component default class name and class prefix.
|
|
70
|
+
*/
|
|
71
|
+
const CLASSNAME$1 = getRootClassName(COMPONENT_NAME$1);
|
|
72
|
+
|
|
73
|
+
/**
|
|
74
|
+
* SkeletonRectangle component.
|
|
75
|
+
*
|
|
76
|
+
* @param props Component props.
|
|
77
|
+
* @param ref Component ref.
|
|
78
|
+
* @return React element.
|
|
79
|
+
*/
|
|
80
|
+
const SkeletonRectangle = forwardRef((props, ref) => {
|
|
81
|
+
const defaultTheme = useTheme() || Theme.light;
|
|
82
|
+
const {
|
|
83
|
+
aspectRatio,
|
|
84
|
+
className,
|
|
85
|
+
height,
|
|
86
|
+
theme = defaultTheme,
|
|
87
|
+
variant = DEFAULT_PROPS$1.variant,
|
|
88
|
+
width,
|
|
89
|
+
color,
|
|
90
|
+
...forwardedProps
|
|
91
|
+
} = props;
|
|
92
|
+
return /*#__PURE__*/jsx("div", {
|
|
93
|
+
ref: ref,
|
|
94
|
+
...forwardedProps,
|
|
95
|
+
className: classNames(className, handleBasicClasses({
|
|
96
|
+
prefix: CLASSNAME$1,
|
|
97
|
+
aspectRatio,
|
|
98
|
+
height: aspectRatio ? undefined : height,
|
|
99
|
+
theme,
|
|
100
|
+
variant,
|
|
101
|
+
width,
|
|
102
|
+
color
|
|
103
|
+
})),
|
|
104
|
+
children: /*#__PURE__*/jsx("div", {
|
|
105
|
+
className: `${CLASSNAME$1}__inner`
|
|
106
|
+
})
|
|
107
|
+
});
|
|
108
|
+
});
|
|
109
|
+
SkeletonRectangle.displayName = COMPONENT_NAME$1;
|
|
110
|
+
SkeletonRectangle.className = CLASSNAME$1;
|
|
111
|
+
SkeletonRectangle.defaultProps = DEFAULT_PROPS$1;
|
|
112
|
+
|
|
113
|
+
const DEFAULT_PROPS = {};
|
|
114
|
+
|
|
115
|
+
/**
|
|
116
|
+
* Component display name.
|
|
117
|
+
*/
|
|
118
|
+
const COMPONENT_NAME = 'SkeletonTypography';
|
|
119
|
+
|
|
120
|
+
/**
|
|
121
|
+
* Component default class name and class prefix.
|
|
122
|
+
*/
|
|
123
|
+
const CLASSNAME = getRootClassName(COMPONENT_NAME);
|
|
124
|
+
|
|
125
|
+
/**
|
|
126
|
+
* SkeletonTypography component.
|
|
127
|
+
*
|
|
128
|
+
* @param props Component props.
|
|
129
|
+
* @param ref Component ref.
|
|
130
|
+
* @return React element.
|
|
131
|
+
*/
|
|
132
|
+
const SkeletonTypography = forwardRef((props, ref) => {
|
|
133
|
+
const defaultTheme = useTheme() || Theme.light;
|
|
134
|
+
const {
|
|
135
|
+
className,
|
|
136
|
+
theme = defaultTheme,
|
|
137
|
+
typography,
|
|
138
|
+
width,
|
|
139
|
+
color,
|
|
140
|
+
...forwardedProps
|
|
141
|
+
} = props;
|
|
142
|
+
return /*#__PURE__*/jsx("div", {
|
|
143
|
+
ref: ref,
|
|
144
|
+
...forwardedProps,
|
|
145
|
+
className: classNames(className, handleBasicClasses({
|
|
146
|
+
prefix: CLASSNAME,
|
|
147
|
+
theme,
|
|
148
|
+
typography,
|
|
149
|
+
color
|
|
150
|
+
})),
|
|
151
|
+
style: {
|
|
152
|
+
...forwardedProps.style,
|
|
153
|
+
width
|
|
154
|
+
},
|
|
155
|
+
children: /*#__PURE__*/jsx("div", {
|
|
156
|
+
className: `${CLASSNAME}__inner`
|
|
157
|
+
})
|
|
158
|
+
});
|
|
159
|
+
});
|
|
160
|
+
SkeletonTypography.displayName = COMPONENT_NAME;
|
|
161
|
+
SkeletonTypography.defaultProps = DEFAULT_PROPS;
|
|
162
|
+
SkeletonTypography.className = CLASSNAME;
|
|
163
|
+
|
|
164
|
+
export { SkeletonCircle, SkeletonRectangle, SkeletonRectangleVariant, SkeletonTypography };
|
|
165
|
+
//# sourceMappingURL=6da19518.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"6da19518.js","sources":["../../src/components/skeleton/SkeletonCircle.tsx","../../src/components/skeleton/SkeletonRectangle.tsx","../../src/components/skeleton/SkeletonTypography.tsx"],"sourcesContent":["import classNames from 'classnames';\n\nimport { GlobalSize, Theme, ColorPalette } from '@lumx/react';\nimport { GenericProps, HasTheme } from '@lumx/react/utils/type';\nimport { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';\nimport { useTheme } from '@lumx/react/utils/theme/ThemeContext';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\n\n/**\n * Defines the props of the component.\n */\nexport interface SkeletonCircleProps extends GenericProps, HasTheme {\n /** Size variant. */\n size: GlobalSize;\n /** The color of the skeleton. */\n color?: ColorPalette;\n}\n\nconst DEFAULT_PROPS: Partial<SkeletonCircleProps> = {};\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'SkeletonCircle';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * SkeletonCircle component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const SkeletonCircle = forwardRef<SkeletonCircleProps, HTMLDivElement>((props, ref) => {\n const defaultTheme = useTheme() || Theme.light;\n const { className, size, color, theme = defaultTheme, ...forwardedProps } = props;\n\n return (\n <div\n ref={ref}\n {...forwardedProps}\n className={classNames(className, handleBasicClasses({ prefix: CLASSNAME, size, color, theme }))}\n />\n );\n});\nSkeletonCircle.displayName = COMPONENT_NAME;\nSkeletonCircle.defaultProps = DEFAULT_PROPS;\nSkeletonCircle.className = CLASSNAME;\n","import classNames from 'classnames';\n\nimport { AspectRatio, GlobalSize, Theme, ColorPalette } from '@lumx/react';\nimport { GenericProps, HasTheme, ValueOf } from '@lumx/react/utils/type';\nimport { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';\nimport { useTheme } from '@lumx/react/utils/theme/ThemeContext';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\n\n/**\n * Skeleton variants.\n */\nexport const SkeletonRectangleVariant = { squared: 'squared', rounded: 'rounded', pill: 'pill' } as const;\nexport type SkeletonRectangleVariant = ValueOf<typeof SkeletonRectangleVariant>;\n\n/**\n * Defines the props of the component.\n */\nexport interface SkeletonRectangleProps extends GenericProps, HasTheme {\n /** Aspect ratio (use with width and not height). */\n aspectRatio?: Extract<AspectRatio, 'square' | 'horizontal' | 'vertical' | 'wide'>;\n /** Height size. */\n height?: GlobalSize;\n /** Border variant. */\n variant?: SkeletonRectangleVariant;\n /** Width size. */\n width?: GlobalSize;\n /** The color of the skeleton. */\n color?: ColorPalette;\n}\n\nconst DEFAULT_PROPS: Partial<SkeletonRectangleProps> = {\n variant: SkeletonRectangleVariant.squared,\n};\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'SkeletonRectangle';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * SkeletonRectangle component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const SkeletonRectangle = forwardRef<SkeletonRectangleProps, HTMLDivElement>((props, ref) => {\n const defaultTheme = useTheme() || Theme.light;\n const {\n aspectRatio,\n className,\n height,\n theme = defaultTheme,\n variant = DEFAULT_PROPS.variant,\n width,\n color,\n ...forwardedProps\n } = props;\n\n return (\n <div\n ref={ref}\n {...forwardedProps}\n className={classNames(\n className,\n handleBasicClasses({\n prefix: CLASSNAME,\n aspectRatio,\n height: aspectRatio ? undefined : height,\n theme,\n variant,\n width,\n color,\n }),\n )}\n >\n <div className={`${CLASSNAME}__inner`} />\n </div>\n );\n});\nSkeletonRectangle.displayName = COMPONENT_NAME;\nSkeletonRectangle.className = CLASSNAME;\nSkeletonRectangle.defaultProps = DEFAULT_PROPS;\n","import { CSSProperties } from 'react';\n\nimport classNames from 'classnames';\n\nimport { Theme, TypographyInterface, ColorPalette } from '@lumx/react';\nimport { GenericProps, HasTheme } from '@lumx/react/utils/type';\nimport { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';\nimport { useTheme } from '@lumx/react/utils/theme/ThemeContext';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\n\n/**\n * Defines the props of the component.\n */\nexport interface SkeletonTypographyProps extends GenericProps, HasTheme {\n /** Typography variant. */\n typography: TypographyInterface;\n /** Width CSS property. */\n width?: CSSProperties['width'];\n /** The color of the skeleton. */\n color?: ColorPalette;\n}\n\nconst DEFAULT_PROPS: Partial<SkeletonTypographyProps> = {};\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'SkeletonTypography';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * SkeletonTypography component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const SkeletonTypography = forwardRef<SkeletonTypographyProps, HTMLDivElement>((props, ref) => {\n const defaultTheme = useTheme() || Theme.light;\n const { className, theme = defaultTheme, typography, width, color, ...forwardedProps } = props;\n\n return (\n <div\n ref={ref}\n {...forwardedProps}\n className={classNames(className, handleBasicClasses({ prefix: CLASSNAME, theme, typography, color }))}\n style={{ ...forwardedProps.style, width }}\n >\n <div className={`${CLASSNAME}__inner`} />\n </div>\n );\n});\nSkeletonTypography.displayName = COMPONENT_NAME;\nSkeletonTypography.defaultProps = DEFAULT_PROPS;\nSkeletonTypography.className = CLASSNAME;\n"],"names":["DEFAULT_PROPS","COMPONENT_NAME","CLASSNAME","getRootClassName","SkeletonCircle","forwardRef","props","ref","defaultTheme","useTheme","Theme","light","className","size","color","theme","forwardedProps","_jsx","classNames","handleBasicClasses","prefix","displayName","defaultProps","SkeletonRectangleVariant","squared","rounded","pill","variant","SkeletonRectangle","aspectRatio","height","width","undefined","children","SkeletonTypography","typography","style"],"mappings":"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"}
|
|
@@ -0,0 +1,95 @@
|
|
|
1
|
+
import { useEffect, useContext, useMemo, useRef, createContext } from 'react';
|
|
2
|
+
import isEmpty from 'lodash/isEmpty';
|
|
3
|
+
import { jsx } from 'react/jsx-runtime';
|
|
4
|
+
|
|
5
|
+
const EVENT_TYPES = ['mousedown', 'touchstart'];
|
|
6
|
+
function isClickAway(targets, refs) {
|
|
7
|
+
// The targets elements are not contained in any of the listed element references.
|
|
8
|
+
return !refs.some(ref => targets.some(target => ref?.current?.contains(target)));
|
|
9
|
+
}
|
|
10
|
+
/**
|
|
11
|
+
* Listen to clicks away from the given elements and callback the passed in function.
|
|
12
|
+
*
|
|
13
|
+
* Warning: If you need to detect click away on nested React portals, please use the `ClickAwayProvider` component.
|
|
14
|
+
*/
|
|
15
|
+
function useClickAway({
|
|
16
|
+
callback,
|
|
17
|
+
childrenRefs
|
|
18
|
+
}) {
|
|
19
|
+
useEffect(() => {
|
|
20
|
+
const {
|
|
21
|
+
current: currentRefs
|
|
22
|
+
} = childrenRefs;
|
|
23
|
+
if (!callback || !currentRefs || isEmpty(currentRefs)) {
|
|
24
|
+
return undefined;
|
|
25
|
+
}
|
|
26
|
+
const listener = evt => {
|
|
27
|
+
const targets = [evt.composedPath?.()[0], evt.target];
|
|
28
|
+
if (isClickAway(targets, currentRefs)) {
|
|
29
|
+
callback(evt);
|
|
30
|
+
}
|
|
31
|
+
};
|
|
32
|
+
EVENT_TYPES.forEach(evtType => document.addEventListener(evtType, listener));
|
|
33
|
+
return () => {
|
|
34
|
+
EVENT_TYPES.forEach(evtType => document.removeEventListener(evtType, listener));
|
|
35
|
+
};
|
|
36
|
+
}, [callback, childrenRefs]);
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
const ClickAwayAncestorContext = /*#__PURE__*/createContext(null);
|
|
40
|
+
/**
|
|
41
|
+
* Component combining the `useClickAway` hook with a React context to hook into the React component tree and make sure
|
|
42
|
+
* we take into account both the DOM tree and the React tree to detect click away.
|
|
43
|
+
*
|
|
44
|
+
* @return the react component.
|
|
45
|
+
*/
|
|
46
|
+
const ClickAwayProvider = ({
|
|
47
|
+
children,
|
|
48
|
+
callback,
|
|
49
|
+
childrenRefs,
|
|
50
|
+
parentRef
|
|
51
|
+
}) => {
|
|
52
|
+
const parentContext = useContext(ClickAwayAncestorContext);
|
|
53
|
+
const currentContext = useMemo(() => {
|
|
54
|
+
const context = {
|
|
55
|
+
childrenRefs: [],
|
|
56
|
+
/**
|
|
57
|
+
* Add element refs to the current context and propagate to the parent context.
|
|
58
|
+
*/
|
|
59
|
+
addRefs(...newChildrenRefs) {
|
|
60
|
+
// Add element refs that should be considered as inside the click away context.
|
|
61
|
+
context.childrenRefs.push(...newChildrenRefs);
|
|
62
|
+
if (parentContext) {
|
|
63
|
+
// Also add then to the parent context
|
|
64
|
+
parentContext.addRefs(...newChildrenRefs);
|
|
65
|
+
if (parentRef) {
|
|
66
|
+
// The parent element is also considered as inside the parent click away context but not inside the current context
|
|
67
|
+
parentContext.addRefs(parentRef);
|
|
68
|
+
}
|
|
69
|
+
}
|
|
70
|
+
}
|
|
71
|
+
};
|
|
72
|
+
return context;
|
|
73
|
+
}, [parentContext, parentRef]);
|
|
74
|
+
useEffect(() => {
|
|
75
|
+
const {
|
|
76
|
+
current: currentRefs
|
|
77
|
+
} = childrenRefs;
|
|
78
|
+
if (!currentRefs) {
|
|
79
|
+
return;
|
|
80
|
+
}
|
|
81
|
+
currentContext.addRefs(...currentRefs);
|
|
82
|
+
}, [currentContext, childrenRefs]);
|
|
83
|
+
useClickAway({
|
|
84
|
+
callback,
|
|
85
|
+
childrenRefs: useRef(currentContext.childrenRefs)
|
|
86
|
+
});
|
|
87
|
+
return /*#__PURE__*/jsx(ClickAwayAncestorContext.Provider, {
|
|
88
|
+
value: currentContext,
|
|
89
|
+
children: children
|
|
90
|
+
});
|
|
91
|
+
};
|
|
92
|
+
ClickAwayProvider.displayName = 'ClickAwayProvider';
|
|
93
|
+
|
|
94
|
+
export { ClickAwayProvider as C };
|
|
95
|
+
//# sourceMappingURL=7093ba23.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"7093ba23.js","sources":["../../src/hooks/useClickAway.tsx","../../src/utils/ClickAwayProvider/ClickAwayProvider.tsx"],"sourcesContent":["import { RefObject, useEffect } from 'react';\n\nimport { Falsy } from '@lumx/react/utils/type';\n\nimport isEmpty from 'lodash/isEmpty';\n\nconst EVENT_TYPES = ['mousedown', 'touchstart'];\n\nfunction isClickAway(targets: HTMLElement[], refs: Array<RefObject<HTMLElement>>): boolean {\n // The targets elements are not contained in any of the listed element references.\n return !refs.some((ref) => targets.some((target) => ref?.current?.contains(target)));\n}\n\nexport interface ClickAwayParameters {\n /**\n * A callback function to call when the user clicks away from the elements.\n */\n callback: EventListener | Falsy;\n /**\n * Elements considered within the click away context (clicking outside them will trigger the click away callback).\n */\n childrenRefs: RefObject<Array<RefObject<HTMLElement>>>;\n}\n\n/**\n * Listen to clicks away from the given elements and callback the passed in function.\n *\n * Warning: If you need to detect click away on nested React portals, please use the `ClickAwayProvider` component.\n */\nexport function useClickAway({ callback, childrenRefs }: ClickAwayParameters): void {\n useEffect(() => {\n const { current: currentRefs } = childrenRefs;\n if (!callback || !currentRefs || isEmpty(currentRefs)) {\n return undefined;\n }\n const listener: EventListener = (evt) => {\n const targets = [evt.composedPath?.()[0], evt.target] as HTMLElement[];\n if (isClickAway(targets, currentRefs)) {\n callback(evt);\n }\n };\n\n EVENT_TYPES.forEach((evtType) => document.addEventListener(evtType, listener));\n return () => {\n EVENT_TYPES.forEach((evtType) => document.removeEventListener(evtType, listener));\n };\n }, [callback, childrenRefs]);\n}\n","import { createContext, RefObject, useContext, useEffect, useMemo, useRef } from 'react';\nimport { ClickAwayParameters, useClickAway } from '@lumx/react/hooks/useClickAway';\n\ninterface ContextValue {\n childrenRefs: Array<RefObject<HTMLElement>>;\n addRefs(...newChildrenRefs: Array<RefObject<HTMLElement>>): void;\n}\n\nconst ClickAwayAncestorContext = createContext<ContextValue | null>(null);\n\ninterface ClickAwayProviderProps extends ClickAwayParameters {\n /**\n * (Optional) Element that should be considered as part of the parent\n */\n parentRef?: RefObject<HTMLElement>;\n /**\n * Children\n */\n children?: React.ReactNode;\n}\n\n/**\n * Component combining the `useClickAway` hook with a React context to hook into the React component tree and make sure\n * we take into account both the DOM tree and the React tree to detect click away.\n *\n * @return the react component.\n */\nexport const ClickAwayProvider: React.FC<ClickAwayProviderProps> = ({\n children,\n callback,\n childrenRefs,\n parentRef,\n}) => {\n const parentContext = useContext(ClickAwayAncestorContext);\n const currentContext = useMemo(() => {\n const context: ContextValue = {\n childrenRefs: [],\n /**\n * Add element refs to the current context and propagate to the parent context.\n */\n addRefs(...newChildrenRefs) {\n // Add element refs that should be considered as inside the click away context.\n context.childrenRefs.push(...newChildrenRefs);\n\n if (parentContext) {\n // Also add then to the parent context\n parentContext.addRefs(...newChildrenRefs);\n if (parentRef) {\n // The parent element is also considered as inside the parent click away context but not inside the current context\n parentContext.addRefs(parentRef);\n }\n }\n },\n };\n return context;\n }, [parentContext, parentRef]);\n\n useEffect(() => {\n const { current: currentRefs } = childrenRefs;\n if (!currentRefs) {\n return;\n }\n currentContext.addRefs(...currentRefs);\n }, [currentContext, childrenRefs]);\n\n useClickAway({ callback, childrenRefs: useRef(currentContext.childrenRefs) });\n return <ClickAwayAncestorContext.Provider value={currentContext}>{children}</ClickAwayAncestorContext.Provider>;\n};\nClickAwayProvider.displayName = 'ClickAwayProvider';\n"],"names":["EVENT_TYPES","isClickAway","targets","refs","some","ref","target","current","contains","useClickAway","callback","childrenRefs","useEffect","currentRefs","isEmpty","undefined","listener","evt","composedPath","forEach","evtType","document","addEventListener","removeEventListener","ClickAwayAncestorContext","createContext","ClickAwayProvider","children","parentRef","parentContext","useContext","currentContext","useMemo","context","addRefs","newChildrenRefs","push","useRef","_jsx","Provider","value","displayName"],"mappings":"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"}
|