@lumx/react 3.0.2 → 3.0.3-alpha.1
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/{esm/_internal/_rollupPluginBabelHelpers.js → _internal/ClickAwayProvider.js} +107 -2
- package/_internal/ClickAwayProvider.js.map +1 -0
- package/_internal/types.d.ts +271 -0
- package/index.d.ts +2686 -0
- package/index.js +12533 -0
- package/index.js.map +1 -0
- package/package.json +7 -6
- package/src/components/alert-dialog/AlertDialog.tsx +2 -1
- package/src/components/autocomplete/Autocomplete.tsx +2 -2
- package/src/components/autocomplete/AutocompleteMultiple.tsx +2 -1
- package/src/components/avatar/Avatar.tsx +2 -1
- package/src/components/badge/Badge.test.tsx +1 -1
- package/src/components/badge/Badge.tsx +2 -1
- package/src/components/button/Button.test.tsx +1 -1
- package/src/components/button/Button.tsx +2 -1
- package/src/components/button/ButtonGroup.tsx +2 -1
- package/src/components/button/ButtonRoot.test.tsx +1 -1
- package/src/components/button/ButtonRoot.tsx +2 -1
- package/src/components/button/IconButton.tsx +2 -1
- package/src/components/checkbox/Checkbox.test.tsx +1 -1
- package/src/components/checkbox/Checkbox.tsx +2 -1
- package/src/components/chip/Chip.test.tsx +1 -1
- package/src/components/chip/Chip.tsx +3 -1
- package/src/components/chip/ChipGroup.tsx +2 -1
- package/src/components/comment-block/CommentBlock.tsx +2 -1
- package/src/components/date-picker/DatePicker.tsx +1 -1
- package/src/components/date-picker/DatePickerControlled.tsx +1 -1
- package/src/components/date-picker/DatePickerField.tsx +1 -1
- package/src/components/date-picker/constants.ts +1 -1
- package/src/components/date-picker/types.ts +1 -1
- package/src/components/dialog/Dialog.tsx +4 -8
- package/src/components/divider/Divider.test.tsx +1 -1
- package/src/components/divider/Divider.tsx +3 -2
- package/src/components/drag-handle/DragHandle.tsx +2 -1
- package/src/components/dropdown/Dropdown.tsx +2 -1
- package/src/components/expansion-panel/ExpansionPanel.test.tsx +1 -1
- package/src/components/expansion-panel/ExpansionPanel.tsx +3 -10
- package/src/components/flag/Flag.test.tsx +1 -1
- package/src/components/flag/Flag.tsx +2 -1
- package/src/components/flex-box/FlexBox.stories.tsx +8 -0
- package/src/components/flex-box/FlexBox.tsx +7 -3
- package/src/components/flex-box/__snapshots__/FlexBox.test.tsx.snap +16 -0
- package/src/components/generic-block/GenericBlock.stories.jsx +23 -1
- package/src/components/generic-block/GenericBlock.tsx +18 -4
- package/src/components/generic-block/constants.ts +9 -0
- package/src/components/generic-block/index.ts +1 -0
- package/src/components/grid/Grid.tsx +2 -1
- package/src/components/grid/GridItem.tsx +2 -1
- package/src/components/heading/Heading.tsx +2 -1
- package/src/components/heading/HeadingLevelProvider.tsx +1 -1
- package/src/components/heading/context.tsx +1 -1
- package/src/components/icon/Icon.test.tsx +1 -1
- package/src/components/icon/Icon.tsx +2 -1
- package/src/components/image-block/ImageBlock.tsx +2 -1
- package/src/components/index.ts +1 -1
- package/src/components/inline-list/InlineList.stories.tsx +40 -0
- package/src/components/inline-list/InlineList.test.tsx +41 -0
- package/src/components/inline-list/InlineList.tsx +80 -0
- package/src/components/inline-list/index.ts +1 -0
- package/src/components/input-helper/InputHelper.tsx +2 -1
- package/src/components/input-label/InputLabel.tsx +2 -1
- package/src/components/lightbox/Lightbox.tsx +2 -1
- package/src/components/link/Link.tsx +2 -1
- package/src/components/link-preview/LinkPreview.test.tsx +1 -1
- package/src/components/link-preview/LinkPreview.tsx +2 -1
- package/src/components/list/List.tsx +2 -1
- package/src/components/list/ListDivider.tsx +2 -1
- package/src/components/list/ListItem.tsx +3 -8
- package/src/components/list/ListSubheader.tsx +2 -1
- package/src/components/list/useInteractiveList.tsx +1 -1
- package/src/components/message/Message.test.tsx +1 -1
- package/src/components/message/Message.tsx +2 -1
- package/src/components/mosaic/Mosaic.tsx +2 -1
- package/src/components/notification/Notification.tsx +2 -1
- package/src/components/popover/Popover.tsx +2 -1
- package/src/components/post-block/PostBlock.tsx +2 -1
- package/src/components/progress/Progress.tsx +2 -1
- package/src/components/progress-tracker/ProgressTracker.tsx +2 -1
- package/src/components/progress-tracker/ProgressTrackerStep.test.tsx +1 -1
- package/src/components/progress-tracker/ProgressTrackerStep.tsx +2 -1
- package/src/components/progress-tracker/ProgressTrackerStepPanel.tsx +2 -1
- package/src/components/radio-button/RadioButton.test.tsx +1 -1
- package/src/components/radio-button/RadioButton.tsx +2 -1
- package/src/components/radio-button/RadioGroup.tsx +2 -1
- package/src/components/select/Select.test.tsx +1 -1
- package/src/components/select/Select.tsx +2 -1
- package/src/components/select/SelectMultiple.test.tsx +1 -1
- package/src/components/select/SelectMultiple.tsx +2 -1
- package/src/components/select/WithSelectContext.tsx +1 -1
- package/src/components/select/constants.ts +1 -1
- package/src/components/side-navigation/SideNavigation.tsx +2 -1
- package/src/components/side-navigation/SideNavigationItem.test.tsx +1 -1
- package/src/components/side-navigation/SideNavigationItem.tsx +3 -9
- package/src/components/skeleton/SkeletonCircle.tsx +2 -1
- package/src/components/skeleton/SkeletonRectangle.tsx +2 -1
- package/src/components/skeleton/SkeletonTypography.tsx +2 -1
- package/src/components/slider/Slider.tsx +2 -1
- package/src/components/slideshow/Slides.tsx +2 -1
- package/src/components/slideshow/Slideshow.tsx +1 -1
- package/src/components/slideshow/SlideshowControls.tsx +2 -1
- package/src/components/slideshow/SlideshowItem.tsx +2 -1
- package/src/components/slideshow/SlideshowItemGroup.tsx +2 -1
- package/src/components/switch/Switch.test.tsx +1 -1
- package/src/components/switch/Switch.tsx +2 -1
- package/src/components/table/Table.tsx +2 -1
- package/src/components/table/TableBody.tsx +2 -1
- package/src/components/table/TableCell.tsx +3 -1
- package/src/components/table/TableHeader.tsx +2 -1
- package/src/components/table/TableRow.tsx +2 -1
- package/src/components/tabs/Tab.test.tsx +1 -1
- package/src/components/tabs/Tab.tsx +2 -1
- package/src/components/tabs/TabList.test.tsx +1 -1
- package/src/components/tabs/TabList.tsx +2 -1
- package/src/components/tabs/TabPanel.tsx +2 -1
- package/src/components/text/{Text.stories.tsx → Text.stories.jsx} +23 -28
- package/src/components/text/Text.test.tsx +15 -1
- package/src/components/text/Text.tsx +38 -12
- package/src/components/text-field/TextField.test.tsx +1 -1
- package/src/components/text-field/TextField.tsx +2 -1
- package/src/components/thumbnail/Thumbnail.tsx +2 -1
- package/src/components/thumbnail/types.ts +1 -1
- package/src/components/toolbar/Toolbar.tsx +2 -1
- package/src/components/tooltip/Tooltip.tsx +2 -1
- package/src/components/tooltip/useTooltipOpen.tsx +1 -1
- package/src/components/uploader/Uploader.test.tsx +1 -1
- package/src/components/uploader/Uploader.tsx +2 -1
- package/src/components/user-block/UserBlock.tsx +2 -1
- package/src/hooks/useCallbackOnEscape.ts +2 -1
- package/src/hooks/useClickAway.tsx +1 -1
- package/src/hooks/useDisableBodyScroll.ts +1 -1
- package/src/hooks/useFocusTrap.ts +1 -1
- package/src/hooks/useInterval.tsx +1 -1
- package/src/hooks/useOnResize.ts +1 -1
- package/src/index.ts +5 -0
- package/src/stories/generated/GenericBlock/Demos.stories.tsx +3 -1
- package/src/stories/generated/Heading/Demos.stories.tsx +6 -0
- package/src/stories/withResizableBox.tsx +18 -0
- package/src/testing/utils/commonTestsSuite.ts +1 -1
- package/src/utils/{getRootClassName.ts → className.ts} +19 -0
- package/src/utils/event.ts +1 -0
- package/src/utils/index.ts +5 -0
- package/src/utils/type.ts +3 -0
- package/src/utils/utils.test.ts +1 -1
- package/types.d.ts +68 -11
- package/utils/index.d.ts +29 -0
- package/utils/index.js +2 -0
- package/utils/index.js.map +1 -0
- package/esm/_internal/AlertDialog.js +0 -141
- package/esm/_internal/AlertDialog.js.map +0 -1
- package/esm/_internal/AutocompleteMultiple.js +0 -257
- package/esm/_internal/AutocompleteMultiple.js.map +0 -1
- package/esm/_internal/Avatar2.js +0 -82
- package/esm/_internal/Avatar2.js.map +0 -1
- package/esm/_internal/Badge2.js +0 -54
- package/esm/_internal/Badge2.js.map +0 -1
- package/esm/_internal/Button2.js +0 -84
- package/esm/_internal/Button2.js.map +0 -1
- package/esm/_internal/ButtonGroup.js +0 -51
- package/esm/_internal/ButtonGroup.js.map +0 -1
- package/esm/_internal/ButtonRoot.js +0 -135
- package/esm/_internal/ButtonRoot.js.map +0 -1
- package/esm/_internal/Checkbox2.js +0 -116
- package/esm/_internal/Checkbox2.js.map +0 -1
- package/esm/_internal/Chip2.js +0 -118
- package/esm/_internal/Chip2.js.map +0 -1
- package/esm/_internal/ChipGroup.js +0 -122
- package/esm/_internal/ChipGroup.js.map +0 -1
- package/esm/_internal/ClickAwayProvider.js +0 -217
- package/esm/_internal/ClickAwayProvider.js.map +0 -1
- package/esm/_internal/CommentBlock.js +0 -124
- package/esm/_internal/CommentBlock.js.map +0 -1
- package/esm/_internal/DatePickerField.js +0 -347
- package/esm/_internal/DatePickerField.js.map +0 -1
- package/esm/_internal/Dialog2.js +0 -274
- package/esm/_internal/Dialog2.js.map +0 -1
- package/esm/_internal/Divider2.js +0 -53
- package/esm/_internal/Divider2.js.map +0 -1
- package/esm/_internal/DragHandle.js +0 -50
- package/esm/_internal/DragHandle.js.map +0 -1
- package/esm/_internal/Dropdown2.js +0 -157
- package/esm/_internal/Dropdown2.js.map +0 -1
- package/esm/_internal/ExpansionPanel.js +0 -156
- package/esm/_internal/ExpansionPanel.js.map +0 -1
- package/esm/_internal/Flag2.js +0 -48
- package/esm/_internal/Flag2.js.map +0 -1
- package/esm/_internal/FlexBox.js +0 -55
- package/esm/_internal/FlexBox.js.map +0 -1
- package/esm/_internal/GenericBlock.js +0 -125
- package/esm/_internal/GenericBlock.js.map +0 -1
- package/esm/_internal/GridItem.js +0 -96
- package/esm/_internal/GridItem.js.map +0 -1
- package/esm/_internal/HeadingLevelProvider.js +0 -112
- package/esm/_internal/HeadingLevelProvider.js.map +0 -1
- package/esm/_internal/Icon2.js +0 -120
- package/esm/_internal/Icon2.js.map +0 -1
- package/esm/_internal/IconButton.js +0 -74
- package/esm/_internal/IconButton.js.map +0 -1
- package/esm/_internal/ImageBlock.js +0 -101
- package/esm/_internal/ImageBlock.js.map +0 -1
- package/esm/_internal/InputHelper.js +0 -72
- package/esm/_internal/InputHelper.js.map +0 -1
- package/esm/_internal/InputLabel.js +0 -58
- package/esm/_internal/InputLabel.js.map +0 -1
- package/esm/_internal/Lightbox2.js +0 -123
- package/esm/_internal/Lightbox2.js.map +0 -1
- package/esm/_internal/Link2.js +0 -122
- package/esm/_internal/Link2.js.map +0 -1
- package/esm/_internal/LinkPreview.js +0 -105
- package/esm/_internal/LinkPreview.js.map +0 -1
- package/esm/_internal/List2.js +0 -799
- package/esm/_internal/List2.js.map +0 -1
- package/esm/_internal/ListSubheader.js +0 -79
- package/esm/_internal/ListSubheader.js.map +0 -1
- package/esm/_internal/Message2.js +0 -78
- package/esm/_internal/Message2.js.map +0 -1
- package/esm/_internal/Mosaic2.js +0 -89
- package/esm/_internal/Mosaic2.js.map +0 -1
- package/esm/_internal/Notification2.js +0 -133
- package/esm/_internal/Notification2.js.map +0 -1
- package/esm/_internal/Popover2.js +0 -2473
- package/esm/_internal/Popover2.js.map +0 -1
- package/esm/_internal/PostBlock.js +0 -96
- package/esm/_internal/PostBlock.js.map +0 -1
- package/esm/_internal/Progress2.js +0 -81
- package/esm/_internal/Progress2.js.map +0 -1
- package/esm/_internal/ProgressTrackerStepPanel.js +0 -313
- package/esm/_internal/ProgressTrackerStepPanel.js.map +0 -1
- package/esm/_internal/RadioGroup.js +0 -147
- package/esm/_internal/RadioGroup.js.map +0 -1
- package/esm/_internal/SelectMultiple.js +0 -424
- package/esm/_internal/SelectMultiple.js.map +0 -1
- package/esm/_internal/SideNavigationItem.js +0 -151
- package/esm/_internal/SideNavigationItem.js.map +0 -1
- package/esm/_internal/SkeletonTypography.js +0 -168
- package/esm/_internal/SkeletonTypography.js.map +0 -1
- package/esm/_internal/Slider2.js +0 -327
- package/esm/_internal/Slider2.js.map +0 -1
- package/esm/_internal/Slides.js +0 -864
- package/esm/_internal/Slides.js.map +0 -1
- package/esm/_internal/Switch2.js +0 -116
- package/esm/_internal/Switch2.js.map +0 -1
- package/esm/_internal/TabPanel.js +0 -280
- package/esm/_internal/TabPanel.js.map +0 -1
- package/esm/_internal/TableRow.js +0 -291
- package/esm/_internal/TableRow.js.map +0 -1
- package/esm/_internal/Text2.js +0 -63
- package/esm/_internal/Text2.js.map +0 -1
- package/esm/_internal/TextField.js +0 -322
- package/esm/_internal/TextField.js.map +0 -1
- package/esm/_internal/Thumbnail2.js +0 -301
- package/esm/_internal/Thumbnail2.js.map +0 -1
- package/esm/_internal/Toolbar2.js +0 -60
- package/esm/_internal/Toolbar2.js.map +0 -1
- package/esm/_internal/Tooltip2.js +0 -282
- package/esm/_internal/Tooltip2.js.map +0 -1
- package/esm/_internal/Uploader2.js +0 -84
- package/esm/_internal/Uploader2.js.map +0 -1
- package/esm/_internal/UserBlock.js +0 -132
- package/esm/_internal/UserBlock.js.map +0 -1
- package/esm/_internal/_rollupPluginBabelHelpers.js.map +0 -1
- package/esm/_internal/alert-dialog.js +0 -34
- package/esm/_internal/alert-dialog.js.map +0 -1
- package/esm/_internal/autocomplete.js +0 -32
- package/esm/_internal/autocomplete.js.map +0 -1
- package/esm/_internal/avatar.js +0 -13
- package/esm/_internal/avatar.js.map +0 -1
- package/esm/_internal/badge.js +0 -10
- package/esm/_internal/badge.js.map +0 -1
- package/esm/_internal/button.js +0 -25
- package/esm/_internal/button.js.map +0 -1
- package/esm/_internal/checkbox.js +0 -14
- package/esm/_internal/checkbox.js.map +0 -1
- package/esm/_internal/chip.js +0 -12
- package/esm/_internal/chip.js.map +0 -1
- package/esm/_internal/comment-block.js +0 -24
- package/esm/_internal/comment-block.js.map +0 -1
- package/esm/_internal/components.js +0 -156
- package/esm/_internal/components.js.map +0 -1
- package/esm/_internal/constants.js +0 -13
- package/esm/_internal/constants.js.map +0 -1
- package/esm/_internal/date-picker.js +0 -32
- package/esm/_internal/date-picker.js.map +0 -1
- package/esm/_internal/dialog.js +0 -27
- package/esm/_internal/dialog.js.map +0 -1
- package/esm/_internal/divider.js +0 -10
- package/esm/_internal/divider.js.map +0 -1
- package/esm/_internal/drag-handle.js +0 -11
- package/esm/_internal/drag-handle.js.map +0 -1
- package/esm/_internal/dropdown.js +0 -21
- package/esm/_internal/dropdown.js.map +0 -1
- package/esm/_internal/expansion-panel.js +0 -32
- package/esm/_internal/expansion-panel.js.map +0 -1
- package/esm/_internal/flag.js +0 -11
- package/esm/_internal/flag.js.map +0 -1
- package/esm/_internal/flex-box.js +0 -11
- package/esm/_internal/flex-box.js.map +0 -1
- package/esm/_internal/generic-block.js +0 -20
- package/esm/_internal/generic-block.js.map +0 -1
- package/esm/_internal/getRootClassName.js +0 -346
- package/esm/_internal/getRootClassName.js.map +0 -1
- package/esm/_internal/grid.js +0 -10
- package/esm/_internal/grid.js.map +0 -1
- package/esm/_internal/heading.js +0 -11
- package/esm/_internal/heading.js.map +0 -1
- package/esm/_internal/icon.js +0 -10
- package/esm/_internal/icon.js.map +0 -1
- package/esm/_internal/image-block.js +0 -14
- package/esm/_internal/image-block.js.map +0 -1
- package/esm/_internal/input-helper.js +0 -10
- package/esm/_internal/input-helper.js.map +0 -1
- package/esm/_internal/input-label.js +0 -10
- package/esm/_internal/input-label.js.map +0 -1
- package/esm/_internal/lightbox.js +0 -27
- package/esm/_internal/lightbox.js.map +0 -1
- package/esm/_internal/link-preview.js +0 -15
- package/esm/_internal/link-preview.js.map +0 -1
- package/esm/_internal/link.js +0 -12
- package/esm/_internal/link.js.map +0 -1
- package/esm/_internal/list.js +0 -15
- package/esm/_internal/list.js.map +0 -1
- package/esm/_internal/mergeRefs.js +0 -25
- package/esm/_internal/mergeRefs.js.map +0 -1
- package/esm/_internal/message.js +0 -11
- package/esm/_internal/message.js.map +0 -1
- package/esm/_internal/mosaic.js +0 -14
- package/esm/_internal/mosaic.js.map +0 -1
- package/esm/_internal/notification.js +0 -18
- package/esm/_internal/notification.js.map +0 -1
- package/esm/_internal/partitionMulti.js +0 -27
- package/esm/_internal/partitionMulti.js.map +0 -1
- package/esm/_internal/popover.js +0 -15
- package/esm/_internal/popover.js.map +0 -1
- package/esm/_internal/post-block.js +0 -15
- package/esm/_internal/post-block.js.map +0 -1
- package/esm/_internal/progress-tracker.js +0 -17
- package/esm/_internal/progress-tracker.js.map +0 -1
- package/esm/_internal/progress.js +0 -10
- package/esm/_internal/progress.js.map +0 -1
- package/esm/_internal/radio-button.js +0 -13
- package/esm/_internal/radio-button.js.map +0 -1
- package/esm/_internal/renderLink.js +0 -25
- package/esm/_internal/renderLink.js.map +0 -1
- package/esm/_internal/select.js +0 -31
- package/esm/_internal/select.js.map +0 -1
- package/esm/_internal/side-navigation.js +0 -25
- package/esm/_internal/side-navigation.js.map +0 -1
- package/esm/_internal/skeleton.js +0 -10
- package/esm/_internal/skeleton.js.map +0 -1
- package/esm/_internal/slider.js +0 -13
- package/esm/_internal/slider.js.map +0 -1
- package/esm/_internal/slideshow.js +0 -29
- package/esm/_internal/slideshow.js.map +0 -1
- package/esm/_internal/state.js +0 -145
- package/esm/_internal/state.js.map +0 -1
- package/esm/_internal/switch.js +0 -13
- package/esm/_internal/switch.js.map +0 -1
- package/esm/_internal/table.js +0 -12
- package/esm/_internal/table.js.map +0 -1
- package/esm/_internal/tabs.js +0 -15
- package/esm/_internal/tabs.js.map +0 -1
- package/esm/_internal/text-field.js +0 -26
- package/esm/_internal/text-field.js.map +0 -1
- package/esm/_internal/text.js +0 -10
- package/esm/_internal/text.js.map +0 -1
- package/esm/_internal/thumbnail.js +0 -13
- package/esm/_internal/thumbnail.js.map +0 -1
- package/esm/_internal/toolbar.js +0 -9
- package/esm/_internal/toolbar.js.map +0 -1
- package/esm/_internal/tooltip.js +0 -18
- package/esm/_internal/tooltip.js.map +0 -1
- package/esm/_internal/type.js +0 -40
- package/esm/_internal/type.js.map +0 -1
- package/esm/_internal/types.js +0 -23
- package/esm/_internal/types.js.map +0 -1
- package/esm/_internal/uploader.js +0 -11
- package/esm/_internal/uploader.js.map +0 -1
- package/esm/_internal/useDelayedVisibility.js +0 -47
- package/esm/_internal/useDelayedVisibility.js.map +0 -1
- package/esm/_internal/useDisableBodyScroll.js +0 -220
- package/esm/_internal/useDisableBodyScroll.js.map +0 -1
- package/esm/_internal/useFocusTrap.js +0 -86
- package/esm/_internal/useFocusTrap.js.map +0 -1
- package/esm/_internal/useRovingTabIndex.js +0 -87
- package/esm/_internal/useRovingTabIndex.js.map +0 -1
- package/esm/_internal/user-block.js +0 -17
- package/esm/_internal/user-block.js.map +0 -1
- package/esm/index.js +0 -95
- package/esm/index.js.map +0 -1
- package/esm/index2.js +0 -16
- package/esm/index2.js.map +0 -1
- package/src/utils/index.tsx +0 -7
|
@@ -1,135 +0,0 @@
|
|
|
1
|
-
import { b as _objectWithoutProperties, _ as _objectSpread2, c as _extends } from './_rollupPluginBabelHelpers.js';
|
|
2
|
-
import { Emphasis, ColorPalette, Theme } from './components.js';
|
|
3
|
-
import React, { forwardRef } from 'react';
|
|
4
|
-
import { c as classnames, h as handleBasicClasses, C as CSS_PREFIX } from './getRootClassName.js';
|
|
5
|
-
import isEmpty from 'lodash/isEmpty';
|
|
6
|
-
import { r as renderLink } from './renderLink.js';
|
|
7
|
-
|
|
8
|
-
/**
|
|
9
|
-
* Component display name.
|
|
10
|
-
*/
|
|
11
|
-
var COMPONENT_NAME = 'ButtonRoot';
|
|
12
|
-
var BUTTON_WRAPPER_CLASSNAME = "".concat(CSS_PREFIX, "-button-wrapper");
|
|
13
|
-
var BUTTON_CLASSNAME = "".concat(CSS_PREFIX, "-button");
|
|
14
|
-
/**
|
|
15
|
-
* Render a button wrapper with the ButtonRoot inside.
|
|
16
|
-
*
|
|
17
|
-
* @param props Component props.
|
|
18
|
-
* @return React element.
|
|
19
|
-
*/
|
|
20
|
-
|
|
21
|
-
var renderButtonWrapper = function renderButtonWrapper(props) {
|
|
22
|
-
var color = props.color,
|
|
23
|
-
emphasis = props.emphasis,
|
|
24
|
-
variant = props.variant,
|
|
25
|
-
fullWidth = props.fullWidth;
|
|
26
|
-
var adaptedColor = emphasis === Emphasis.low && (color === ColorPalette.light ? ColorPalette.dark : ColorPalette.light);
|
|
27
|
-
var wrapperClassName = classnames(handleBasicClasses({
|
|
28
|
-
color: adaptedColor,
|
|
29
|
-
prefix: BUTTON_WRAPPER_CLASSNAME,
|
|
30
|
-
variant: variant,
|
|
31
|
-
fullWidth: fullWidth
|
|
32
|
-
}));
|
|
33
|
-
|
|
34
|
-
var buttonProps = _objectSpread2({}, props, {
|
|
35
|
-
hasBackground: false
|
|
36
|
-
});
|
|
37
|
-
|
|
38
|
-
return React.createElement("div", {
|
|
39
|
-
className: wrapperClassName
|
|
40
|
-
}, React.createElement(ButtonRoot, buttonProps));
|
|
41
|
-
};
|
|
42
|
-
/**
|
|
43
|
-
* ButtonRoot component.
|
|
44
|
-
*
|
|
45
|
-
* @param props Component props.
|
|
46
|
-
* @param ref Component ref.
|
|
47
|
-
* @return React element.
|
|
48
|
-
*/
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
var ButtonRoot = forwardRef(function (props, ref) {
|
|
52
|
-
var ariaLabel = props['aria-label'],
|
|
53
|
-
children = props.children,
|
|
54
|
-
className = props.className,
|
|
55
|
-
color = props.color,
|
|
56
|
-
disabled = props.disabled,
|
|
57
|
-
emphasis = props.emphasis,
|
|
58
|
-
hasBackground = props.hasBackground,
|
|
59
|
-
href = props.href,
|
|
60
|
-
_props$isDisabled = props.isDisabled,
|
|
61
|
-
isDisabled = _props$isDisabled === void 0 ? disabled : _props$isDisabled,
|
|
62
|
-
isSelected = props.isSelected,
|
|
63
|
-
isActive = props.isActive,
|
|
64
|
-
isFocused = props.isFocused,
|
|
65
|
-
isHovered = props.isHovered,
|
|
66
|
-
linkAs = props.linkAs,
|
|
67
|
-
name = props.name,
|
|
68
|
-
size = props.size,
|
|
69
|
-
target = props.target,
|
|
70
|
-
theme = props.theme,
|
|
71
|
-
variant = props.variant,
|
|
72
|
-
_props$type = props.type,
|
|
73
|
-
type = _props$type === void 0 ? 'button' : _props$type,
|
|
74
|
-
fullWidth = props.fullWidth,
|
|
75
|
-
forwardedProps = _objectWithoutProperties(props, ["aria-label", "children", "className", "color", "disabled", "emphasis", "hasBackground", "href", "isDisabled", "isSelected", "isActive", "isFocused", "isHovered", "linkAs", "name", "size", "target", "theme", "variant", "type", "fullWidth"]);
|
|
76
|
-
|
|
77
|
-
var adaptedColor = color || emphasis !== Emphasis.high && theme === Theme.dark && ColorPalette.light || emphasis === Emphasis.high && ColorPalette.primary || ColorPalette.dark;
|
|
78
|
-
|
|
79
|
-
if (hasBackground) {
|
|
80
|
-
return renderButtonWrapper(_objectSpread2({}, props, {
|
|
81
|
-
ref: ref,
|
|
82
|
-
variant: variant,
|
|
83
|
-
color: adaptedColor
|
|
84
|
-
}));
|
|
85
|
-
}
|
|
86
|
-
|
|
87
|
-
var buttonClassName = classnames(className, handleBasicClasses({
|
|
88
|
-
color: adaptedColor,
|
|
89
|
-
emphasis: emphasis,
|
|
90
|
-
isSelected: isSelected,
|
|
91
|
-
isDisabled: isDisabled,
|
|
92
|
-
isActive: isActive,
|
|
93
|
-
isFocused: isFocused,
|
|
94
|
-
isHovered: isHovered,
|
|
95
|
-
prefix: BUTTON_CLASSNAME,
|
|
96
|
-
size: size,
|
|
97
|
-
theme: emphasis === Emphasis.high && theme,
|
|
98
|
-
variant: variant,
|
|
99
|
-
fullWidth: fullWidth
|
|
100
|
-
}));
|
|
101
|
-
/**
|
|
102
|
-
* If the linkAs prop is used, we use the linkAs component instead of a <button>.
|
|
103
|
-
* If there is an href attribute, we display an <a> instead of a <button>.
|
|
104
|
-
*
|
|
105
|
-
* However, in any case, if the component is disabled, we returned a <button> since disabled is not compatible with <a>.
|
|
106
|
-
*/
|
|
107
|
-
|
|
108
|
-
if ((linkAs || !isEmpty(props.href)) && !isDisabled) {
|
|
109
|
-
return renderLink(_objectSpread2({
|
|
110
|
-
linkAs: linkAs
|
|
111
|
-
}, forwardedProps, {
|
|
112
|
-
'aria-label': ariaLabel,
|
|
113
|
-
href: href,
|
|
114
|
-
target: target,
|
|
115
|
-
className: buttonClassName,
|
|
116
|
-
ref: ref
|
|
117
|
-
}), children);
|
|
118
|
-
}
|
|
119
|
-
|
|
120
|
-
return React.createElement("button", _extends({}, forwardedProps, {
|
|
121
|
-
disabled: isDisabled,
|
|
122
|
-
"aria-disabled": isDisabled,
|
|
123
|
-
"aria-label": ariaLabel,
|
|
124
|
-
ref: ref,
|
|
125
|
-
className: buttonClassName,
|
|
126
|
-
name: name,
|
|
127
|
-
type: // eslint-disable-next-line react/button-has-type
|
|
128
|
-
type
|
|
129
|
-
}), children);
|
|
130
|
-
});
|
|
131
|
-
ButtonRoot.displayName = COMPONENT_NAME;
|
|
132
|
-
ButtonRoot.defaultProps = {};
|
|
133
|
-
|
|
134
|
-
export { ButtonRoot as B };
|
|
135
|
-
//# sourceMappingURL=ButtonRoot.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"ButtonRoot.js","sources":["../../../src/components/button/ButtonRoot.tsx"],"sourcesContent":["import React, { AriaAttributes, ButtonHTMLAttributes, DetailedHTMLProps, forwardRef, RefObject } from 'react';\n\nimport isEmpty from 'lodash/isEmpty';\n\nimport classNames from 'classnames';\n\nimport { Color, ColorPalette, Emphasis, Size, Theme } from '@lumx/react';\nimport { CSS_PREFIX } from '@lumx/react/constants';\nimport { Comp, GenericProps, handleBasicClasses, HasTheme } from '@lumx/react/utils';\nimport { renderLink } from '@lumx/react/utils/renderLink';\n\ntype HTMLButtonProps = DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>;\n\n/**\n * Button size definition.\n */\nexport type ButtonSize = Extract<Size, 's' | 'm'>;\n\nexport interface BaseButtonProps\n extends GenericProps,\n Pick<AriaAttributes, 'aria-expanded' | 'aria-haspopup' | 'aria-pressed' | 'aria-label'>,\n HasTheme {\n /** Color variant. */\n color?: Color;\n /** Emphasis variant. */\n emphasis?: Emphasis;\n /** Whether or not the button has a background color in low emphasis. */\n hasBackground?: boolean;\n /** Native anchor href property. It determines whether the Button will be a <button> or an <a>. */\n href?: string;\n /** Whether the component is disabled or not. */\n isDisabled?: boolean;\n /** Whether the component is selected or not. */\n isSelected?: boolean;\n /** Native button name property. */\n name?: string;\n /** Size variant. */\n size?: ButtonSize;\n /** Native anchor target property. */\n target?: '_self' | '_blank' | '_parent' | '_top';\n /** Native button type. */\n type?: HTMLButtonProps['type'];\n /** Custom react component for the link (can be used to inject react router Link). */\n linkAs?: 'a' | any;\n}\n\nexport interface ButtonRootProps extends BaseButtonProps {\n variant: 'button' | 'icon';\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'ButtonRoot';\n\nexport const BUTTON_WRAPPER_CLASSNAME = `${CSS_PREFIX}-button-wrapper`;\nexport const BUTTON_CLASSNAME = `${CSS_PREFIX}-button`;\n\n/**\n * Render a button wrapper with the ButtonRoot inside.\n *\n * @param props Component props.\n * @return React element.\n */\nconst renderButtonWrapper: React.FC<ButtonRootProps> = (props) => {\n const { color, emphasis, variant, fullWidth } = props;\n\n const adaptedColor =\n emphasis === Emphasis.low && (color === ColorPalette.light ? ColorPalette.dark : ColorPalette.light);\n\n const wrapperClassName = classNames(\n handleBasicClasses({\n color: adaptedColor,\n prefix: BUTTON_WRAPPER_CLASSNAME,\n variant,\n fullWidth,\n }),\n );\n const buttonProps = { ...props, hasBackground: false };\n\n return (\n <div className={wrapperClassName}>\n {/* eslint-disable-next-line @typescript-eslint/no-use-before-define */}\n <ButtonRoot {...buttonProps} />\n </div>\n );\n};\n\n/**\n * ButtonRoot component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const ButtonRoot: Comp<ButtonRootProps, HTMLButtonElement | HTMLAnchorElement> = forwardRef((props, ref) => {\n const {\n 'aria-label': ariaLabel,\n children,\n className,\n color,\n disabled,\n emphasis,\n hasBackground,\n href,\n isDisabled = disabled,\n isSelected,\n isActive,\n isFocused,\n isHovered,\n linkAs,\n name,\n size,\n target,\n theme,\n variant,\n type = 'button',\n fullWidth,\n ...forwardedProps\n } = props;\n\n const adaptedColor =\n color ||\n (emphasis !== Emphasis.high && theme === Theme.dark && ColorPalette.light) ||\n (emphasis === Emphasis.high && ColorPalette.primary) ||\n ColorPalette.dark;\n\n if (hasBackground) {\n return renderButtonWrapper({ ...props, ref, variant, color: adaptedColor });\n }\n\n const buttonClassName = classNames(\n className,\n handleBasicClasses({\n color: adaptedColor,\n emphasis,\n isSelected,\n isDisabled,\n isActive,\n isFocused,\n isHovered,\n prefix: BUTTON_CLASSNAME,\n size,\n theme: emphasis === Emphasis.high && theme,\n variant,\n fullWidth,\n }),\n );\n\n /**\n * If the linkAs prop is used, we use the linkAs component instead of a <button>.\n * If there is an href attribute, we display an <a> instead of a <button>.\n *\n * However, in any case, if the component is disabled, we returned a <button> since disabled is not compatible with <a>.\n */\n if ((linkAs || !isEmpty(props.href)) && !isDisabled) {\n return renderLink(\n {\n linkAs,\n ...forwardedProps,\n 'aria-label': ariaLabel,\n href,\n target,\n className: buttonClassName,\n ref: ref as RefObject<HTMLAnchorElement>,\n },\n children,\n );\n }\n return (\n <button\n {...forwardedProps}\n disabled={isDisabled}\n aria-disabled={isDisabled}\n aria-label={ariaLabel}\n ref={ref as RefObject<HTMLButtonElement>}\n className={buttonClassName}\n name={name}\n type={\n // eslint-disable-next-line react/button-has-type\n type\n }\n >\n {children}\n </button>\n );\n});\nButtonRoot.displayName = COMPONENT_NAME;\nButtonRoot.defaultProps = {};\n"],"names":["COMPONENT_NAME","BUTTON_WRAPPER_CLASSNAME","CSS_PREFIX","BUTTON_CLASSNAME","renderButtonWrapper","props","color","emphasis","variant","fullWidth","adaptedColor","Emphasis","low","ColorPalette","light","dark","wrapperClassName","classNames","handleBasicClasses","prefix","buttonProps","hasBackground","ButtonRoot","forwardRef","ref","ariaLabel","children","className","disabled","href","isDisabled","isSelected","isActive","isFocused","isHovered","linkAs","name","size","target","theme","type","forwardedProps","high","Theme","primary","buttonClassName","isEmpty","renderLink","displayName","defaultProps"],"mappings":"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"}
|
|
@@ -1,116 +0,0 @@
|
|
|
1
|
-
import { b as _objectWithoutProperties, c as _extends } from './_rollupPluginBabelHelpers.js';
|
|
2
|
-
import { Theme } from './components.js';
|
|
3
|
-
import React, { forwardRef, useMemo } from 'react';
|
|
4
|
-
import { g as getRootClassName, c as classnames, h as handleBasicClasses } from './getRootClassName.js';
|
|
5
|
-
import { I as Icon, e as mdiCheck } from './Icon2.js';
|
|
6
|
-
import { u as uid } from '../index2.js';
|
|
7
|
-
import { I as InputHelper } from './InputHelper.js';
|
|
8
|
-
import { I as InputLabel } from './InputLabel.js';
|
|
9
|
-
|
|
10
|
-
/**
|
|
11
|
-
* Defines the props of the component.
|
|
12
|
-
*/
|
|
13
|
-
|
|
14
|
-
/**
|
|
15
|
-
* Component display name.
|
|
16
|
-
*/
|
|
17
|
-
var COMPONENT_NAME = 'Checkbox';
|
|
18
|
-
/**
|
|
19
|
-
* Component default class name and class prefix.
|
|
20
|
-
*/
|
|
21
|
-
|
|
22
|
-
var CLASSNAME = getRootClassName(COMPONENT_NAME);
|
|
23
|
-
/**
|
|
24
|
-
* Component default props.
|
|
25
|
-
*/
|
|
26
|
-
|
|
27
|
-
var DEFAULT_PROPS = {
|
|
28
|
-
theme: Theme.light
|
|
29
|
-
};
|
|
30
|
-
/**
|
|
31
|
-
* Checkbox component.
|
|
32
|
-
*
|
|
33
|
-
* @param props Component props.
|
|
34
|
-
* @param ref Component ref.
|
|
35
|
-
* @return React element.
|
|
36
|
-
*/
|
|
37
|
-
|
|
38
|
-
var Checkbox = forwardRef(function (props, ref) {
|
|
39
|
-
var checked = props.checked,
|
|
40
|
-
className = props.className,
|
|
41
|
-
disabled = props.disabled,
|
|
42
|
-
helper = props.helper,
|
|
43
|
-
id = props.id,
|
|
44
|
-
inputRef = props.inputRef,
|
|
45
|
-
_props$isChecked = props.isChecked,
|
|
46
|
-
isChecked = _props$isChecked === void 0 ? checked : _props$isChecked,
|
|
47
|
-
_props$isDisabled = props.isDisabled,
|
|
48
|
-
isDisabled = _props$isDisabled === void 0 ? disabled : _props$isDisabled,
|
|
49
|
-
label = props.label,
|
|
50
|
-
name = props.name,
|
|
51
|
-
onChange = props.onChange,
|
|
52
|
-
theme = props.theme,
|
|
53
|
-
value = props.value,
|
|
54
|
-
_props$inputProps = props.inputProps,
|
|
55
|
-
inputProps = _props$inputProps === void 0 ? {} : _props$inputProps,
|
|
56
|
-
forwardedProps = _objectWithoutProperties(props, ["checked", "className", "disabled", "helper", "id", "inputRef", "isChecked", "isDisabled", "label", "name", "onChange", "theme", "value", "inputProps"]);
|
|
57
|
-
|
|
58
|
-
var inputId = useMemo(function () {
|
|
59
|
-
return id || "".concat(CLASSNAME.toLowerCase(), "-").concat(uid());
|
|
60
|
-
}, [id]);
|
|
61
|
-
|
|
62
|
-
var handleChange = function handleChange(event) {
|
|
63
|
-
if (onChange) {
|
|
64
|
-
onChange(!isChecked, value, name, event);
|
|
65
|
-
}
|
|
66
|
-
};
|
|
67
|
-
|
|
68
|
-
return React.createElement("div", _extends({
|
|
69
|
-
ref: ref
|
|
70
|
-
}, forwardedProps, {
|
|
71
|
-
className: classnames(className, handleBasicClasses({
|
|
72
|
-
isChecked: isChecked,
|
|
73
|
-
isDisabled: isDisabled,
|
|
74
|
-
isUnchecked: !isChecked,
|
|
75
|
-
prefix: CLASSNAME,
|
|
76
|
-
theme: theme
|
|
77
|
-
}))
|
|
78
|
-
}), React.createElement("div", {
|
|
79
|
-
className: "".concat(CLASSNAME, "__input-wrapper")
|
|
80
|
-
}, React.createElement("input", _extends({
|
|
81
|
-
ref: inputRef,
|
|
82
|
-
type: "checkbox",
|
|
83
|
-
id: inputId,
|
|
84
|
-
className: "".concat(CLASSNAME, "__input-native"),
|
|
85
|
-
tabIndex: isDisabled ? -1 : 0,
|
|
86
|
-
name: name,
|
|
87
|
-
value: value,
|
|
88
|
-
checked: isChecked,
|
|
89
|
-
onChange: handleChange,
|
|
90
|
-
"aria-describedby": helper ? "".concat(inputId, "-helper") : undefined
|
|
91
|
-
}, inputProps)), React.createElement("div", {
|
|
92
|
-
className: "".concat(CLASSNAME, "__input-placeholder")
|
|
93
|
-
}, React.createElement("div", {
|
|
94
|
-
className: "".concat(CLASSNAME, "__input-background")
|
|
95
|
-
}), React.createElement("div", {
|
|
96
|
-
className: "".concat(CLASSNAME, "__input-indicator")
|
|
97
|
-
}, React.createElement(Icon, {
|
|
98
|
-
icon: mdiCheck
|
|
99
|
-
})))), React.createElement("div", {
|
|
100
|
-
className: "".concat(CLASSNAME, "__content")
|
|
101
|
-
}, label && React.createElement(InputLabel, {
|
|
102
|
-
htmlFor: inputId,
|
|
103
|
-
className: "".concat(CLASSNAME, "__label"),
|
|
104
|
-
theme: theme
|
|
105
|
-
}, label), helper && React.createElement(InputHelper, {
|
|
106
|
-
id: "".concat(inputId, "-helper"),
|
|
107
|
-
className: "".concat(CLASSNAME, "__helper"),
|
|
108
|
-
theme: theme
|
|
109
|
-
}, helper)));
|
|
110
|
-
});
|
|
111
|
-
Checkbox.displayName = COMPONENT_NAME;
|
|
112
|
-
Checkbox.className = CLASSNAME;
|
|
113
|
-
Checkbox.defaultProps = DEFAULT_PROPS;
|
|
114
|
-
|
|
115
|
-
export { Checkbox as C };
|
|
116
|
-
//# sourceMappingURL=Checkbox2.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Checkbox2.js","sources":["../../../src/components/checkbox/Checkbox.tsx"],"sourcesContent":["import React, { useMemo, forwardRef, ReactNode, SyntheticEvent, InputHTMLAttributes } from 'react';\n\nimport classNames from 'classnames';\nimport { uid } from 'uid';\n\nimport { mdiCheck } from '@lumx/icons';\n\nimport { Icon, InputHelper, InputLabel, Theme } from '@lumx/react';\nimport { Comp, GenericProps, getRootClassName, handleBasicClasses, HasTheme } from '@lumx/react/utils';\n\n/**\n * Defines the props of the component.\n */\nexport interface CheckboxProps extends GenericProps, HasTheme {\n /** Helper text. */\n helper?: string;\n /** Native input id property. */\n id?: string;\n /** Native input ref. */\n inputRef?: React.Ref<HTMLInputElement>;\n /** Whether it is checked or not. */\n isChecked?: boolean;\n /** Whether the component is disabled or not. */\n isDisabled?: boolean;\n /** Label text. */\n label?: ReactNode;\n /** Native input name property. */\n name?: string;\n /** Native input value property. */\n value?: string;\n /** On change callback. */\n onChange?(isChecked: boolean, value?: string, name?: string, event?: SyntheticEvent): void;\n /** optional props for input */\n inputProps?: InputHTMLAttributes<HTMLInputElement>;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'Checkbox';\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<CheckboxProps> = {\n theme: Theme.light,\n};\n\n/**\n * Checkbox component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const Checkbox: Comp<CheckboxProps, HTMLDivElement> = forwardRef((props, ref) => {\n const {\n checked,\n className,\n disabled,\n helper,\n id,\n inputRef,\n isChecked = checked,\n isDisabled = disabled,\n label,\n name,\n onChange,\n theme,\n value,\n inputProps = {},\n ...forwardedProps\n } = props;\n const inputId = useMemo(() => id || `${CLASSNAME.toLowerCase()}-${uid()}`, [id]);\n\n const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n if (onChange) {\n onChange(!isChecked, value, name, event);\n }\n };\n\n return (\n <div\n ref={ref}\n {...forwardedProps}\n className={classNames(\n className,\n handleBasicClasses({\n isChecked,\n isDisabled,\n isUnchecked: !isChecked,\n prefix: CLASSNAME,\n theme,\n }),\n )}\n >\n <div className={`${CLASSNAME}__input-wrapper`}>\n <input\n ref={inputRef}\n type=\"checkbox\"\n id={inputId}\n className={`${CLASSNAME}__input-native`}\n tabIndex={isDisabled ? -1 : 0}\n name={name}\n value={value}\n checked={isChecked}\n onChange={handleChange}\n aria-describedby={helper ? `${inputId}-helper` : undefined}\n {...inputProps}\n />\n\n <div className={`${CLASSNAME}__input-placeholder`}>\n <div className={`${CLASSNAME}__input-background`} />\n\n <div className={`${CLASSNAME}__input-indicator`}>\n <Icon icon={mdiCheck} />\n </div>\n </div>\n </div>\n\n <div className={`${CLASSNAME}__content`}>\n {label && (\n <InputLabel htmlFor={inputId} className={`${CLASSNAME}__label`} theme={theme}>\n {label}\n </InputLabel>\n )}\n {helper && (\n <InputHelper id={`${inputId}-helper`} className={`${CLASSNAME}__helper`} theme={theme}>\n {helper}\n </InputHelper>\n )}\n </div>\n </div>\n );\n});\nCheckbox.displayName = COMPONENT_NAME;\nCheckbox.className = CLASSNAME;\nCheckbox.defaultProps = DEFAULT_PROPS;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","theme","Theme","light","Checkbox","forwardRef","props","ref","checked","className","disabled","helper","id","inputRef","isChecked","isDisabled","label","name","onChange","value","inputProps","forwardedProps","inputId","useMemo","toLowerCase","uid","handleChange","event","classNames","handleBasicClasses","isUnchecked","prefix","undefined","mdiCheck","displayName","defaultProps"],"mappings":"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"}
|
package/esm/_internal/Chip2.js
DELETED
|
@@ -1,118 +0,0 @@
|
|
|
1
|
-
import { b as _objectWithoutProperties, c as _extends, a as _defineProperty } from './_rollupPluginBabelHelpers.js';
|
|
2
|
-
import { Size, Theme, ColorPalette } from './components.js';
|
|
3
|
-
import React, { useCallback, forwardRef } from 'react';
|
|
4
|
-
import { g as getRootClassName, c as classnames, h as handleBasicClasses, o as onEnterPressed } from './getRootClassName.js';
|
|
5
|
-
import isFunction from 'lodash/isFunction';
|
|
6
|
-
|
|
7
|
-
/**
|
|
8
|
-
* Wrap mouse event handler to stop event propagation.
|
|
9
|
-
*
|
|
10
|
-
* @param handler The mouse handler to wrap.
|
|
11
|
-
* @return Mouse handler stopping propagation.
|
|
12
|
-
*/
|
|
13
|
-
|
|
14
|
-
function useStopPropagation(handler) {
|
|
15
|
-
return useCallback(function (evt) {
|
|
16
|
-
if (!evt || !isFunction(handler)) {
|
|
17
|
-
return;
|
|
18
|
-
}
|
|
19
|
-
|
|
20
|
-
handler(evt);
|
|
21
|
-
evt.stopPropagation();
|
|
22
|
-
}, [handler]);
|
|
23
|
-
}
|
|
24
|
-
|
|
25
|
-
/**
|
|
26
|
-
* Chip sizes.
|
|
27
|
-
*/
|
|
28
|
-
|
|
29
|
-
/**
|
|
30
|
-
* Component display name.
|
|
31
|
-
*/
|
|
32
|
-
var COMPONENT_NAME = 'Chip';
|
|
33
|
-
/**
|
|
34
|
-
* Component default class name and class prefix.
|
|
35
|
-
*/
|
|
36
|
-
|
|
37
|
-
var CLASSNAME = getRootClassName(COMPONENT_NAME);
|
|
38
|
-
/**
|
|
39
|
-
* Component default props.
|
|
40
|
-
*/
|
|
41
|
-
|
|
42
|
-
var DEFAULT_PROPS = {
|
|
43
|
-
size: Size.m,
|
|
44
|
-
theme: Theme.light
|
|
45
|
-
};
|
|
46
|
-
/**
|
|
47
|
-
* Chip component.
|
|
48
|
-
*
|
|
49
|
-
* @param props Component props.
|
|
50
|
-
* @param ref Component ref.
|
|
51
|
-
* @return React element.
|
|
52
|
-
*/
|
|
53
|
-
|
|
54
|
-
var Chip = forwardRef(function (props, ref) {
|
|
55
|
-
var after = props.after,
|
|
56
|
-
before = props.before,
|
|
57
|
-
children = props.children,
|
|
58
|
-
className = props.className,
|
|
59
|
-
color = props.color,
|
|
60
|
-
disabled = props.disabled,
|
|
61
|
-
isClickable = props.isClickable,
|
|
62
|
-
_props$isDisabled = props.isDisabled,
|
|
63
|
-
isDisabled = _props$isDisabled === void 0 ? disabled : _props$isDisabled,
|
|
64
|
-
isHighlighted = props.isHighlighted,
|
|
65
|
-
isSelected = props.isSelected,
|
|
66
|
-
onAfterClick = props.onAfterClick,
|
|
67
|
-
onBeforeClick = props.onBeforeClick,
|
|
68
|
-
onClick = props.onClick,
|
|
69
|
-
size = props.size,
|
|
70
|
-
theme = props.theme,
|
|
71
|
-
forwardedProps = _objectWithoutProperties(props, ["after", "before", "children", "className", "color", "disabled", "isClickable", "isDisabled", "isHighlighted", "isSelected", "onAfterClick", "onBeforeClick", "onClick", "size", "theme"]);
|
|
72
|
-
|
|
73
|
-
var hasAfterClick = isFunction(onAfterClick);
|
|
74
|
-
var hasBeforeClick = isFunction(onBeforeClick);
|
|
75
|
-
var hasOnClick = isFunction(onClick); // Adapt color to the theme.
|
|
76
|
-
|
|
77
|
-
var chipColor = color || (theme === Theme.light ? ColorPalette.dark : ColorPalette.light);
|
|
78
|
-
var handleOnBeforeClick = useStopPropagation(onBeforeClick);
|
|
79
|
-
var handleOnAfterClick = useStopPropagation(onAfterClick);
|
|
80
|
-
return (// eslint-disable-next-line jsx-a11y/no-static-element-interactions
|
|
81
|
-
React.createElement("a", _extends({}, forwardedProps, {
|
|
82
|
-
ref: ref,
|
|
83
|
-
className: classnames(className, handleBasicClasses({
|
|
84
|
-
clickable: Boolean(hasOnClick) || isClickable,
|
|
85
|
-
color: chipColor,
|
|
86
|
-
isDisabled: isDisabled,
|
|
87
|
-
hasAfter: Boolean(after),
|
|
88
|
-
hasBefore: Boolean(before),
|
|
89
|
-
highlighted: Boolean(isHighlighted),
|
|
90
|
-
prefix: CLASSNAME,
|
|
91
|
-
selected: Boolean(isSelected),
|
|
92
|
-
size: size,
|
|
93
|
-
unselected: Boolean(!isSelected)
|
|
94
|
-
})),
|
|
95
|
-
role: hasOnClick ? 'button' : undefined,
|
|
96
|
-
tabIndex: isDisabled || !hasOnClick ? -1 : 0,
|
|
97
|
-
"aria-disabled": hasOnClick && isDisabled || undefined,
|
|
98
|
-
onClick: hasOnClick ? onClick : undefined,
|
|
99
|
-
onKeyDown: hasOnClick ? onEnterPressed(onClick) : undefined
|
|
100
|
-
}), before && // eslint-disable-next-line jsx-a11y/click-events-have-key-events,jsx-a11y/no-static-element-interactions
|
|
101
|
-
React.createElement("div", {
|
|
102
|
-
className: classnames("".concat(CLASSNAME, "__before"), _defineProperty({}, "".concat(CLASSNAME, "__before--is-clickable"), hasBeforeClick)),
|
|
103
|
-
onClick: handleOnBeforeClick
|
|
104
|
-
}, before), React.createElement("div", {
|
|
105
|
-
className: "".concat(CLASSNAME, "__label")
|
|
106
|
-
}, children), after && // eslint-disable-next-line jsx-a11y/click-events-have-key-events,jsx-a11y/no-static-element-interactions
|
|
107
|
-
React.createElement("div", {
|
|
108
|
-
className: classnames("".concat(CLASSNAME, "__after"), _defineProperty({}, "".concat(CLASSNAME, "__after--is-clickable"), hasAfterClick)),
|
|
109
|
-
onClick: handleOnAfterClick
|
|
110
|
-
}, after))
|
|
111
|
-
);
|
|
112
|
-
});
|
|
113
|
-
Chip.displayName = COMPONENT_NAME;
|
|
114
|
-
Chip.className = CLASSNAME;
|
|
115
|
-
Chip.defaultProps = DEFAULT_PROPS;
|
|
116
|
-
|
|
117
|
-
export { Chip as C };
|
|
118
|
-
//# sourceMappingURL=Chip2.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Chip2.js","sources":["../../../src/hooks/useStopPropagation.ts","../../../src/components/chip/Chip.tsx"],"sourcesContent":["import isFunction from 'lodash/isFunction';\nimport { MouseEventHandler, useCallback } from 'react';\n\n/**\n * Wrap mouse event handler to stop event propagation.\n *\n * @param handler The mouse handler to wrap.\n * @return Mouse handler stopping propagation.\n */\nexport function useStopPropagation(handler?: MouseEventHandler): MouseEventHandler {\n return useCallback(\n (evt) => {\n if (!evt || !isFunction(handler)) {\n return;\n }\n handler(evt);\n evt.stopPropagation();\n },\n [handler],\n );\n}\n","import { Color, ColorPalette, Size, Theme } from '@lumx/react';\nimport { useStopPropagation } from '@lumx/react/hooks/useStopPropagation';\n\nimport { Comp, GenericProps, getRootClassName, handleBasicClasses, HasTheme, onEnterPressed } from '@lumx/react/utils';\n\nimport classNames from 'classnames';\n\nimport isFunction from 'lodash/isFunction';\nimport React, { forwardRef, MouseEventHandler, ReactNode } from 'react';\n\n/**\n * Chip sizes.\n */\ntype ChipSize = Extract<Size, 's' | 'm'>;\n\n/**\n * Defines the props of the component.\n */\nexport interface ChipProps extends GenericProps, HasTheme {\n /** A component to be rendered after the content. */\n after?: ReactNode;\n /** A component to be rendered before the content. */\n before?: ReactNode;\n /** Color variant. */\n color?: Color;\n /** Whether the component is clickable or not. */\n isClickable?: boolean;\n /** Whether the component is disabled or not. */\n isDisabled?: boolean;\n /** Whether the chip is currently in a highlighted state or not. */\n isHighlighted?: boolean;\n /** Whether the component is selected or not. */\n isSelected?: boolean;\n /** Size variant. */\n size?: ChipSize;\n /** On \"after\" element clicked callback. */\n onAfterClick?: MouseEventHandler;\n /** On \"before\" element clicked callback. */\n onBeforeClick?: MouseEventHandler;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'Chip';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<ChipProps> = {\n size: Size.m,\n theme: Theme.light,\n};\n\n/**\n * Chip component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const Chip: Comp<ChipProps, HTMLAnchorElement> = forwardRef((props, ref) => {\n const {\n after,\n before,\n children,\n className,\n color,\n disabled,\n isClickable,\n isDisabled = disabled,\n isHighlighted,\n isSelected,\n onAfterClick,\n onBeforeClick,\n onClick,\n size,\n theme,\n ...forwardedProps\n } = props;\n const hasAfterClick = isFunction(onAfterClick);\n const hasBeforeClick = isFunction(onBeforeClick);\n const hasOnClick = isFunction(onClick);\n\n // Adapt color to the theme.\n const chipColor = color || (theme === Theme.light ? ColorPalette.dark : ColorPalette.light);\n\n const handleOnBeforeClick = useStopPropagation(onBeforeClick);\n const handleOnAfterClick = useStopPropagation(onAfterClick);\n\n return (\n // eslint-disable-next-line jsx-a11y/no-static-element-interactions\n <a\n {...forwardedProps}\n ref={ref}\n className={classNames(\n className,\n handleBasicClasses({\n clickable: Boolean(hasOnClick) || isClickable,\n color: chipColor,\n isDisabled,\n hasAfter: Boolean(after),\n hasBefore: Boolean(before),\n highlighted: Boolean(isHighlighted),\n prefix: CLASSNAME,\n selected: Boolean(isSelected),\n size,\n unselected: Boolean(!isSelected),\n }),\n )}\n role={hasOnClick ? 'button' : undefined}\n tabIndex={isDisabled || !hasOnClick ? -1 : 0}\n aria-disabled={(hasOnClick && isDisabled) || undefined}\n onClick={hasOnClick ? onClick : undefined}\n onKeyDown={hasOnClick ? onEnterPressed(onClick) : undefined}\n >\n {before && (\n // eslint-disable-next-line jsx-a11y/click-events-have-key-events,jsx-a11y/no-static-element-interactions\n <div\n className={classNames(`${CLASSNAME}__before`, {\n [`${CLASSNAME}__before--is-clickable`]: hasBeforeClick,\n })}\n onClick={handleOnBeforeClick}\n >\n {before}\n </div>\n )}\n\n <div className={`${CLASSNAME}__label`}>{children}</div>\n\n {after && (\n // eslint-disable-next-line jsx-a11y/click-events-have-key-events,jsx-a11y/no-static-element-interactions\n <div\n className={classNames(`${CLASSNAME}__after`, {\n [`${CLASSNAME}__after--is-clickable`]: hasAfterClick,\n })}\n onClick={handleOnAfterClick}\n >\n {after}\n </div>\n )}\n </a>\n );\n});\nChip.displayName = COMPONENT_NAME;\nChip.className = CLASSNAME;\nChip.defaultProps = DEFAULT_PROPS;\n"],"names":["useStopPropagation","handler","useCallback","evt","isFunction","stopPropagation","COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","size","Size","m","theme","Theme","light","Chip","forwardRef","props","ref","after","before","children","className","color","disabled","isClickable","isDisabled","isHighlighted","isSelected","onAfterClick","onBeforeClick","onClick","forwardedProps","hasAfterClick","hasBeforeClick","hasOnClick","chipColor","ColorPalette","dark","handleOnBeforeClick","handleOnAfterClick","classNames","handleBasicClasses","clickable","Boolean","hasAfter","hasBefore","highlighted","prefix","selected","unselected","undefined","onEnterPressed","displayName","defaultProps"],"mappings":"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"}
|
|
@@ -1,122 +0,0 @@
|
|
|
1
|
-
import { d as _slicedToArray, b as _objectWithoutProperties, c as _extends } from './_rollupPluginBabelHelpers.js';
|
|
2
|
-
import { Alignment } from './components.js';
|
|
3
|
-
import React, { useState, forwardRef } from 'react';
|
|
4
|
-
import { g as getRootClassName, h as handleBasicClasses, c as classnames } from './getRootClassName.js';
|
|
5
|
-
|
|
6
|
-
var INITIAL_STATE_ACTIVE_CHIP = -1;
|
|
7
|
-
/**
|
|
8
|
-
* Hook that provides the necessary information to manage chips navigation.
|
|
9
|
-
* @param chips List of chips selected.
|
|
10
|
-
* @param onChipDeleted Callback executed when a chip must be eliminated.
|
|
11
|
-
* @param initialActiveChip Initial active chip index.
|
|
12
|
-
*
|
|
13
|
-
* @return chip navigation tools.
|
|
14
|
-
*/
|
|
15
|
-
|
|
16
|
-
var useChipGroupNavigation = function useChipGroupNavigation(chips, onChipDeleted) {
|
|
17
|
-
var initialActiveChip = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : INITIAL_STATE_ACTIVE_CHIP;
|
|
18
|
-
|
|
19
|
-
var _useState = useState(false),
|
|
20
|
-
_useState2 = _slicedToArray(_useState, 2),
|
|
21
|
-
wasBackspacePressed = _useState2[0],
|
|
22
|
-
setWasBackspacePressed = _useState2[1];
|
|
23
|
-
|
|
24
|
-
var _useState3 = useState(initialActiveChip),
|
|
25
|
-
_useState4 = _slicedToArray(_useState3, 2),
|
|
26
|
-
activeChip = _useState4[0],
|
|
27
|
-
setActiveChip = _useState4[1];
|
|
28
|
-
/**
|
|
29
|
-
* Resets the active index and backspace control to their initial state
|
|
30
|
-
*/
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
var resetChipNavigation = function resetChipNavigation() {
|
|
34
|
-
setWasBackspacePressed(false);
|
|
35
|
-
setActiveChip(initialActiveChip);
|
|
36
|
-
};
|
|
37
|
-
/**
|
|
38
|
-
* Callback to be executed when the backspace was pressed. If there are no chips
|
|
39
|
-
* selected, it will return immediately. If there are it will check if the
|
|
40
|
-
* backspace was already pressed. if it was, it means that the user wants to eliminate
|
|
41
|
-
* the chip, so we execute the `onChipDeleted` function and reset internal state.
|
|
42
|
-
*
|
|
43
|
-
* If it was not pressed before, we set the `wasBackspacePressed` flag to true and
|
|
44
|
-
* highlight the last chip.
|
|
45
|
-
*/
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
var onBackspacePressed = function onBackspacePressed() {
|
|
49
|
-
if (chips.length === 0) {
|
|
50
|
-
return;
|
|
51
|
-
}
|
|
52
|
-
|
|
53
|
-
if (wasBackspacePressed) {
|
|
54
|
-
var chipDeleted = chips[chips.length - 1];
|
|
55
|
-
onChipDeleted(chipDeleted);
|
|
56
|
-
resetChipNavigation();
|
|
57
|
-
} else {
|
|
58
|
-
setActiveChip(chips.length - 1);
|
|
59
|
-
setWasBackspacePressed(true);
|
|
60
|
-
}
|
|
61
|
-
};
|
|
62
|
-
|
|
63
|
-
return {
|
|
64
|
-
activeChip: activeChip,
|
|
65
|
-
onBackspacePressed: onBackspacePressed,
|
|
66
|
-
resetChipNavigation: resetChipNavigation
|
|
67
|
-
};
|
|
68
|
-
};
|
|
69
|
-
|
|
70
|
-
/**
|
|
71
|
-
* Defines the props of the component.
|
|
72
|
-
*/
|
|
73
|
-
|
|
74
|
-
/**
|
|
75
|
-
* Component default props.
|
|
76
|
-
*/
|
|
77
|
-
var DEFAULT_PROPS = {
|
|
78
|
-
align: Alignment.left
|
|
79
|
-
};
|
|
80
|
-
/**
|
|
81
|
-
* Component display name.
|
|
82
|
-
*/
|
|
83
|
-
|
|
84
|
-
var COMPONENT_NAME = 'ChipGroup';
|
|
85
|
-
/**
|
|
86
|
-
* Component default class name and class prefix.
|
|
87
|
-
*/
|
|
88
|
-
|
|
89
|
-
var CLASSNAME = getRootClassName(COMPONENT_NAME);
|
|
90
|
-
/**
|
|
91
|
-
* ChipGroup component.
|
|
92
|
-
*
|
|
93
|
-
* @param props Component props.
|
|
94
|
-
* @param ref Component ref.
|
|
95
|
-
* @return React element.
|
|
96
|
-
*/
|
|
97
|
-
|
|
98
|
-
var InternalChipGroup = forwardRef(function (props, ref) {
|
|
99
|
-
var align = props.align,
|
|
100
|
-
children = props.children,
|
|
101
|
-
className = props.className,
|
|
102
|
-
forwardedProps = _objectWithoutProperties(props, ["align", "children", "className"]);
|
|
103
|
-
|
|
104
|
-
var chipGroupClassName = handleBasicClasses({
|
|
105
|
-
align: align,
|
|
106
|
-
prefix: CLASSNAME
|
|
107
|
-
});
|
|
108
|
-
return React.createElement("div", _extends({
|
|
109
|
-
ref: ref
|
|
110
|
-
}, forwardedProps, {
|
|
111
|
-
className: classnames(className, chipGroupClassName)
|
|
112
|
-
}), children);
|
|
113
|
-
});
|
|
114
|
-
InternalChipGroup.displayName = COMPONENT_NAME;
|
|
115
|
-
InternalChipGroup.className = CLASSNAME;
|
|
116
|
-
InternalChipGroup.defaultProps = DEFAULT_PROPS;
|
|
117
|
-
var ChipGroup = Object.assign(InternalChipGroup, {
|
|
118
|
-
useChipGroupNavigation: useChipGroupNavigation
|
|
119
|
-
});
|
|
120
|
-
|
|
121
|
-
export { ChipGroup as C };
|
|
122
|
-
//# sourceMappingURL=ChipGroup.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"ChipGroup.js","sources":["../../../src/hooks/useChipGroupNavigation.tsx","../../../src/components/chip/ChipGroup.tsx"],"sourcesContent":["import { useState } from 'react';\n\ninterface UseChipGroupNavigation {\n /** the current active chip index */\n activeChip: number;\n\n /** callback to be executed when the backspace was pressed */\n onBackspacePressed(): void;\n\n /** function that allows to reset the navigation */\n resetChipNavigation(): void;\n}\n\nexport type useChipGroupNavigationType<C = any> = (\n chips: C[],\n onChipDeleted: (chip: C) => void,\n initialActiveChip?: number,\n) => UseChipGroupNavigation;\n\nconst INITIAL_STATE_ACTIVE_CHIP = -1;\n\n/**\n * Hook that provides the necessary information to manage chips navigation.\n * @param chips List of chips selected.\n * @param onChipDeleted Callback executed when a chip must be eliminated.\n * @param initialActiveChip Initial active chip index.\n *\n * @return chip navigation tools.\n */\nexport const useChipGroupNavigation: useChipGroupNavigationType = (\n chips,\n onChipDeleted,\n initialActiveChip = INITIAL_STATE_ACTIVE_CHIP,\n) => {\n const [wasBackspacePressed, setWasBackspacePressed] = useState(false);\n const [activeChip, setActiveChip] = useState(initialActiveChip);\n\n /**\n * Resets the active index and backspace control to their initial state\n */\n const resetChipNavigation = () => {\n setWasBackspacePressed(false);\n setActiveChip(initialActiveChip);\n };\n\n /**\n * Callback to be executed when the backspace was pressed. If there are no chips\n * selected, it will return immediately. If there are it will check if the\n * backspace was already pressed. if it was, it means that the user wants to eliminate\n * the chip, so we execute the `onChipDeleted` function and reset internal state.\n *\n * If it was not pressed before, we set the `wasBackspacePressed` flag to true and\n * highlight the last chip.\n */\n const onBackspacePressed = () => {\n if (chips.length === 0) {\n return;\n }\n\n if (wasBackspacePressed) {\n const chipDeleted: any = chips[chips.length - 1];\n onChipDeleted(chipDeleted);\n resetChipNavigation();\n } else {\n setActiveChip(chips.length - 1);\n setWasBackspacePressed(true);\n }\n };\n\n return {\n activeChip,\n onBackspacePressed,\n resetChipNavigation,\n };\n};\n","import { Alignment, HorizontalAlignment } from '@lumx/react/components';\nimport React, { forwardRef, ReactNode } from 'react';\n\nimport classNames from 'classnames';\n\nimport { Comp, GenericProps, getRootClassName, handleBasicClasses } from '@lumx/react/utils';\n\nimport { useChipGroupNavigation } from '@lumx/react/hooks/useChipGroupNavigation';\n\n/**\n * Defines the props of the component.\n */\nexport interface ChipGroupProps extends GenericProps {\n /** Chip horizontal alignment. */\n align?: HorizontalAlignment;\n /** List of Chip. */\n children: ReactNode;\n}\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<ChipGroupProps> = {\n align: Alignment.left,\n};\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'ChipGroup';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * ChipGroup component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nconst InternalChipGroup: Comp<ChipGroupProps, HTMLDivElement> = forwardRef((props, ref) => {\n const { align, children, className, ...forwardedProps } = props;\n const chipGroupClassName = handleBasicClasses({\n align,\n prefix: CLASSNAME,\n });\n\n return (\n <div ref={ref} {...forwardedProps} className={classNames(className, chipGroupClassName)}>\n {children}\n </div>\n );\n});\nInternalChipGroup.displayName = COMPONENT_NAME;\nInternalChipGroup.className = CLASSNAME;\nInternalChipGroup.defaultProps = DEFAULT_PROPS;\n\nexport const ChipGroup = Object.assign(InternalChipGroup, { useChipGroupNavigation });\n"],"names":["INITIAL_STATE_ACTIVE_CHIP","useChipGroupNavigation","chips","onChipDeleted","initialActiveChip","useState","wasBackspacePressed","setWasBackspacePressed","activeChip","setActiveChip","resetChipNavigation","onBackspacePressed","length","chipDeleted","DEFAULT_PROPS","align","Alignment","left","COMPONENT_NAME","CLASSNAME","getRootClassName","InternalChipGroup","forwardRef","props","ref","children","className","forwardedProps","chipGroupClassName","handleBasicClasses","prefix","classNames","displayName","defaultProps","ChipGroup","Object","assign"],"mappings":";;;;;AAmBA,IAAMA,yBAAyB,GAAG,CAAC,CAAnC;AAEA;;;;;;;;;AAQO,IAAMC,sBAAkD,GAAG,SAArDA,sBAAqD,CAC9DC,KAD8D,EAE9DC,aAF8D,EAI7D;AAAA,MADDC,iBACC,uEADmBJ,yBACnB;;AAAA,kBACqDK,QAAQ,CAAC,KAAD,CAD7D;AAAA;AAAA,MACMC,mBADN;AAAA,MAC2BC,sBAD3B;;AAAA,mBAEmCF,QAAQ,CAACD,iBAAD,CAF3C;AAAA;AAAA,MAEMI,UAFN;AAAA,MAEkBC,aAFlB;AAID;;;;;AAGA,MAAMC,mBAAmB,GAAG,SAAtBA,mBAAsB,GAAM;AAC9BH,IAAAA,sBAAsB,CAAC,KAAD,CAAtB;AACAE,IAAAA,aAAa,CAACL,iBAAD,CAAb;AACH,GAHD;AAKA;;;;;;;;;;;AASA,MAAMO,kBAAkB,GAAG,SAArBA,kBAAqB,GAAM;AAC7B,QAAIT,KAAK,CAACU,MAAN,KAAiB,CAArB,EAAwB;AACpB;AACH;;AAED,QAAIN,mBAAJ,EAAyB;AACrB,UAAMO,WAAgB,GAAGX,KAAK,CAACA,KAAK,CAACU,MAAN,GAAe,CAAhB,CAA9B;AACAT,MAAAA,aAAa,CAACU,WAAD,CAAb;AACAH,MAAAA,mBAAmB;AACtB,KAJD,MAIO;AACHD,MAAAA,aAAa,CAACP,KAAK,CAACU,MAAN,GAAe,CAAhB,CAAb;AACAL,MAAAA,sBAAsB,CAAC,IAAD,CAAtB;AACH;AACJ,GAbD;;AAeA,SAAO;AACHC,IAAAA,UAAU,EAAVA,UADG;AAEHG,IAAAA,kBAAkB,EAAlBA,kBAFG;AAGHD,IAAAA,mBAAmB,EAAnBA;AAHG,GAAP;AAKH,CA7CM;;ACpBP;;;;AAUA;;;AAGA,IAAMI,aAAsC,GAAG;AAC3CC,EAAAA,KAAK,EAAEC,SAAS,CAACC;AAD0B,CAA/C;AAIA;;;;AAGA,IAAMC,cAAc,GAAG,WAAvB;AAEA;;;;AAGA,IAAMC,SAAS,GAAGC,gBAAgB,CAACF,cAAD,CAAlC;AAEA;;;;;;;;AAOA,IAAMG,iBAAuD,GAAGC,UAAU,CAAC,UAACC,KAAD,EAAQC,GAAR,EAAgB;AAAA,MAC/ET,KAD+E,GAC7BQ,KAD6B,CAC/ER,KAD+E;AAAA,MACxEU,QADwE,GAC7BF,KAD6B,CACxEE,QADwE;AAAA,MAC9DC,SAD8D,GAC7BH,KAD6B,CAC9DG,SAD8D;AAAA,MAChDC,cADgD,4BAC7BJ,KAD6B;;AAEvF,MAAMK,kBAAkB,GAAGC,kBAAkB,CAAC;AAC1Cd,IAAAA,KAAK,EAALA,KAD0C;AAE1Ce,IAAAA,MAAM,EAAEX;AAFkC,GAAD,CAA7C;AAKA,SACI;AAAK,IAAA,GAAG,EAAEK;AAAV,KAAmBG,cAAnB;AAAmC,IAAA,SAAS,EAAEI,UAAU,CAACL,SAAD,EAAYE,kBAAZ;AAAxD,MACKH,QADL,CADJ;AAKH,CAZyE,CAA1E;AAaAJ,iBAAiB,CAACW,WAAlB,GAAgCd,cAAhC;AACAG,iBAAiB,CAACK,SAAlB,GAA8BP,SAA9B;AACAE,iBAAiB,CAACY,YAAlB,GAAiCnB,aAAjC;IAEaoB,SAAS,GAAGC,MAAM,CAACC,MAAP,CAAcf,iBAAd,EAAiC;AAAEpB,EAAAA,sBAAsB,EAAtBA;AAAF,CAAjC;;;;"}
|