@lumx/react 2.2.18-alpha-hooks.1 → 2.2.18
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/{alertdialog.1.js → AlertDialog.js} +8 -8
- package/esm/_internal/AlertDialog.js.map +1 -0
- package/esm/_internal/{autocompletemultiple.2.js → AutocompleteMultiple.js} +9 -9
- package/esm/_internal/AutocompleteMultiple.js.map +1 -0
- package/esm/_internal/{avatar.3.js → Avatar2.js} +4 -4
- package/esm/_internal/Avatar2.js.map +1 -0
- package/esm/_internal/{badge.4.js → Badge2.js} +3 -3
- package/esm/_internal/Badge2.js.map +1 -0
- package/esm/_internal/{button.5.js → Button2.js} +5 -5
- package/esm/_internal/Button2.js.map +1 -0
- package/esm/_internal/{buttongroup.7.js → ButtonGroup.js} +3 -3
- package/esm/_internal/ButtonGroup.js.map +1 -0
- package/esm/_internal/{buttonroot.57.js → ButtonRoot.js} +4 -4
- package/esm/_internal/ButtonRoot.js.map +1 -0
- package/esm/_internal/{checkbox.8.js → Checkbox2.js} +7 -7
- package/esm/_internal/Checkbox2.js.map +1 -0
- package/esm/_internal/{chip.9.js → Chip2.js} +3 -3
- package/esm/_internal/Chip2.js.map +1 -0
- package/esm/_internal/{chipgroup.10.js → ChipGroup.js} +3 -3
- package/esm/_internal/ChipGroup.js.map +1 -0
- package/esm/_internal/{clickawayprovider.60.js → ClickAwayProvider.js} +4 -4
- package/esm/_internal/ClickAwayProvider.js.map +1 -0
- package/esm/_internal/{commentblock.11.js → CommentBlock.js} +5 -5
- package/esm/_internal/CommentBlock.js.map +1 -0
- package/esm/_internal/{datepickerfield.12.js → DatePickerField.js} +9 -9
- package/esm/_internal/DatePickerField.js.map +1 -0
- package/esm/_internal/{dialog.13.js → Dialog2.js} +12 -12
- package/esm/_internal/Dialog2.js.map +1 -0
- package/esm/_internal/{divider.14.js → Divider2.js} +3 -3
- package/esm/_internal/Divider2.js.map +1 -0
- package/esm/_internal/{draghandle.15.js → DragHandle.js} +4 -4
- package/esm/_internal/DragHandle.js.map +1 -0
- package/esm/_internal/{dropdown.16.js → Dropdown2.js} +6 -6
- package/esm/_internal/Dropdown2.js.map +1 -0
- package/esm/_internal/{expansionpanel.17.js → ExpansionPanel.js} +8 -8
- package/esm/_internal/ExpansionPanel.js.map +1 -0
- package/esm/_internal/{flag.18.js → Flag2.js} +4 -4
- package/esm/_internal/Flag2.js.map +1 -0
- package/esm/_internal/{flexbox.19.js → FlexBox.js} +3 -3
- package/esm/_internal/FlexBox.js.map +1 -0
- package/esm/_internal/{griditem.20.js → GridItem.js} +3 -3
- package/esm/_internal/GridItem.js.map +1 -0
- package/esm/_internal/{icon.21.js → Icon2.js} +3 -3
- package/esm/_internal/Icon2.js.map +1 -0
- package/esm/_internal/{iconbutton.6.js → IconButton.js} +6 -6
- package/esm/_internal/IconButton.js.map +1 -0
- package/esm/_internal/{imageblock.22.js → ImageBlock.js} +4 -4
- package/esm/_internal/ImageBlock.js.map +1 -0
- package/esm/_internal/{inputhelper.23.js → InputHelper.js} +3 -3
- package/esm/_internal/InputHelper.js.map +1 -0
- package/esm/_internal/{inputlabel.24.js → InputLabel.js} +3 -3
- package/esm/_internal/InputLabel.js.map +1 -0
- package/esm/_internal/{lightbox.25.js → Lightbox2.js} +11 -11
- package/esm/_internal/Lightbox2.js.map +1 -0
- package/esm/_internal/{link.26.js → Link2.js} +5 -5
- package/esm/_internal/Link2.js.map +1 -0
- package/esm/_internal/{linkpreview.27.js → LinkPreview.js} +5 -5
- package/esm/_internal/LinkPreview.js.map +1 -0
- package/esm/_internal/{list.28.js → List2.js} +6 -6
- package/esm/_internal/List2.js.map +1 -0
- package/esm/_internal/{listsubheader.29.js → ListSubheader.js} +3 -3
- package/esm/_internal/ListSubheader.js.map +1 -0
- package/esm/_internal/{message.30.js → Message2.js} +4 -4
- package/esm/_internal/Message2.js.map +1 -0
- package/esm/_internal/{mosaic.31.js → Mosaic2.js} +4 -4
- package/esm/_internal/Mosaic2.js.map +1 -0
- package/esm/_internal/{notification.32.js → Notification2.js} +7 -7
- package/esm/_internal/Notification2.js.map +1 -0
- package/esm/_internal/{popover.33.js → Popover2.js} +31 -8
- package/esm/_internal/Popover2.js.map +1 -0
- package/esm/_internal/{postblock.34.js → PostBlock.js} +5 -5
- package/esm/_internal/PostBlock.js.map +1 -0
- package/esm/_internal/{progress.35.js → Progress2.js} +3 -3
- package/esm/_internal/Progress2.js.map +1 -0
- package/esm/_internal/{progresstrackersteppanel.36.js → ProgressTrackerStepPanel.js} +8 -8
- package/esm/_internal/ProgressTrackerStepPanel.js.map +1 -0
- package/esm/_internal/{radiogroup.37.js → RadioGroup.js} +6 -6
- package/esm/_internal/RadioGroup.js.map +1 -0
- package/esm/_internal/{selectmultiple.38.js → SelectMultiple.js} +12 -12
- package/esm/_internal/SelectMultiple.js.map +1 -0
- package/esm/_internal/{sidenavigationitem.39.js → SideNavigationItem.js} +15 -11
- package/esm/_internal/SideNavigationItem.js.map +1 -0
- package/esm/_internal/{skeletontypography.40.js → SkeletonTypography.js} +3 -3
- package/esm/_internal/SkeletonTypography.js.map +1 -0
- package/esm/_internal/{slider.41.js → Slider2.js} +6 -6
- package/esm/_internal/Slider2.js.map +1 -0
- package/esm/_internal/{slides.42.js → Slides.js} +8 -8
- package/esm/_internal/Slides.js.map +1 -0
- package/esm/_internal/{switch.43.js → Switch2.js} +6 -6
- package/esm/_internal/Switch2.js.map +1 -0
- package/esm/_internal/{tabpanel.45.js → TabPanel.js} +6 -6
- package/esm/_internal/TabPanel.js.map +1 -0
- package/esm/_internal/{tablerow.44.js → TableRow.js} +4 -4
- package/esm/_internal/TableRow.js.map +1 -0
- package/esm/_internal/{textfield.46.js → TextField.js} +9 -9
- package/esm/_internal/TextField.js.map +1 -0
- package/esm/_internal/{thumbnail.47.js → Thumbnail2.js} +6 -6
- package/esm/_internal/Thumbnail2.js.map +1 -0
- package/esm/_internal/{toolbar.49.js → Toolbar2.js} +3 -3
- package/esm/_internal/Toolbar2.js.map +1 -0
- package/esm/_internal/{tooltip.50.js → Tooltip2.js} +14 -12
- package/esm/_internal/Tooltip2.js.map +1 -0
- package/esm/_internal/{uploader.51.js → Uploader2.js} +4 -4
- package/esm/_internal/Uploader2.js.map +1 -0
- package/esm/_internal/{userblock.52.js → UserBlock.js} +5 -5
- package/esm/_internal/UserBlock.js.map +1 -0
- package/esm/_internal/{_rolluppluginbabelhelpers.53.js → _rollupPluginBabelHelpers.js} +1 -1
- package/esm/_internal/_rollupPluginBabelHelpers.js.map +1 -0
- package/esm/_internal/alert-dialog.js +19 -19
- package/esm/_internal/autocomplete.js +20 -21
- package/esm/_internal/autocomplete.js.map +1 -1
- package/esm/_internal/avatar.js +6 -6
- package/esm/_internal/badge.js +3 -3
- package/esm/_internal/button.js +14 -15
- package/esm/_internal/button.js.map +1 -1
- package/esm/_internal/checkbox.js +7 -7
- package/esm/_internal/chip.js +4 -4
- package/esm/_internal/comment-block.js +12 -13
- package/esm/_internal/comment-block.js.map +1 -1
- package/esm/_internal/components.js +1 -1
- package/esm/_internal/{constants.59.js → constants.js} +1 -1
- package/esm/_internal/constants.js.map +1 -0
- package/esm/_internal/date-picker.js +18 -19
- package/esm/_internal/date-picker.js.map +1 -1
- package/esm/_internal/dialog.js +12 -12
- package/esm/_internal/divider.js +3 -3
- package/esm/_internal/drag-handle.js +4 -4
- package/esm/_internal/dropdown.js +10 -11
- package/esm/_internal/dropdown.js.map +1 -1
- package/esm/_internal/expansion-panel.js +16 -17
- package/esm/_internal/expansion-panel.js.map +1 -1
- package/esm/_internal/flag.js +4 -4
- package/esm/_internal/flex-box.js +3 -3
- package/esm/_internal/{getrootclassname.54.js → getRootClassName.js} +2 -2
- package/esm/_internal/getRootClassName.js.map +1 -0
- package/esm/_internal/grid.js +3 -3
- package/esm/_internal/icon.js +3 -3
- package/esm/_internal/image-block.js +6 -6
- package/esm/_internal/input-helper.js +3 -3
- package/esm/_internal/input-label.js +3 -3
- package/esm/_internal/lightbox.js +16 -17
- package/esm/_internal/lightbox.js.map +1 -1
- package/esm/_internal/link-preview.js +8 -8
- package/esm/_internal/link.js +5 -5
- package/esm/_internal/list.js +7 -7
- package/esm/_internal/{mergerefs.56.js → mergeRefs.js} +1 -1
- package/esm/_internal/mergeRefs.js.map +1 -0
- package/esm/_internal/message.js +4 -4
- package/esm/_internal/mosaic.js +6 -6
- package/esm/_internal/notification.js +9 -9
- package/esm/_internal/{partitionmulti.62.js → partitionMulti.js} +1 -1
- package/esm/_internal/partitionMulti.js.map +1 -0
- package/esm/_internal/popover.js +6 -7
- package/esm/_internal/popover.js.map +1 -1
- package/esm/_internal/post-block.js +7 -7
- package/esm/_internal/progress-tracker.js +9 -9
- package/esm/_internal/progress.js +3 -3
- package/esm/_internal/radio-button.js +6 -6
- package/esm/_internal/{renderlink.65.js → renderLink.js} +2 -2
- package/esm/_internal/renderLink.js.map +1 -0
- package/esm/_internal/select.js +19 -20
- package/esm/_internal/select.js.map +1 -1
- package/esm/_internal/side-navigation.js +14 -15
- package/esm/_internal/side-navigation.js.map +1 -1
- package/esm/_internal/skeleton.js +3 -3
- package/esm/_internal/slider.js +6 -6
- package/esm/_internal/slideshow.js +13 -14
- package/esm/_internal/slideshow.js.map +1 -1
- package/esm/_internal/switch.js +6 -6
- package/esm/_internal/table.js +4 -4
- package/esm/_internal/tabs.js +7 -7
- package/esm/_internal/text-field.js +15 -16
- package/esm/_internal/text-field.js.map +1 -1
- package/esm/_internal/thumbnail.js +6 -6
- package/esm/_internal/toolbar.js +3 -3
- package/esm/_internal/tooltip.js +8 -9
- package/esm/_internal/tooltip.js.map +1 -1
- package/esm/_internal/{type.64.js → type.js} +1 -1
- package/esm/_internal/type.js.map +1 -0
- package/esm/_internal/{types.48.js → types.js} +3 -2
- package/esm/_internal/types.js.map +1 -0
- package/esm/_internal/uploader.js +4 -4
- package/esm/_internal/{usedelayedvisibility.63.js → useDelayedVisibility.js} +2 -2
- package/esm/_internal/useDelayedVisibility.js.map +1 -0
- package/esm/_internal/{usedisablebodyscroll.61.js → useDisableBodyScroll.js} +1 -1
- package/esm/_internal/useDisableBodyScroll.js.map +1 -0
- package/esm/_internal/{usefocustrap.58.js → useFocusTrap.js} +2 -2
- package/esm/_internal/useFocusTrap.js.map +1 -0
- package/esm/_internal/{userovingtabindex.66.js → useRovingTabIndex.js} +3 -3
- package/esm/_internal/useRovingTabIndex.js.map +1 -0
- package/esm/_internal/user-block.js +9 -9
- package/esm/index.js +89 -0
- package/{index.js.map → esm/index.js.map} +1 -1
- package/esm/{_internal/index.55.js → index2.js} +1 -1
- package/esm/index2.js.map +1 -0
- package/package.json +8 -11
- package/src/components/side-navigation/SideNavigation.stories.tsx +26 -0
- package/src/components/side-navigation/SideNavigationItem.test.tsx +19 -2
- package/src/components/side-navigation/SideNavigationItem.tsx +10 -2
- package/src/components/side-navigation/__snapshots__/SideNavigationItem.test.tsx.snap +1 -1
- package/src/components/thumbnail/index.ts +1 -0
- package/src/components/tooltip/useTooltipOpen.tsx +7 -4
- package/{index.d.ts → types.d.ts} +11 -5
- package/esm/_internal/_rolluppluginbabelhelpers.53.js.map +0 -1
- package/esm/_internal/alertdialog.1.js.map +0 -1
- package/esm/_internal/autocompletemultiple.2.js.map +0 -1
- package/esm/_internal/avatar.3.js.map +0 -1
- package/esm/_internal/badge.4.js.map +0 -1
- package/esm/_internal/button.5.js.map +0 -1
- package/esm/_internal/buttongroup.7.js.map +0 -1
- package/esm/_internal/buttonroot.57.js.map +0 -1
- package/esm/_internal/checkbox.8.js.map +0 -1
- package/esm/_internal/chip.9.js.map +0 -1
- package/esm/_internal/chipgroup.10.js.map +0 -1
- package/esm/_internal/clickawayprovider.60.js.map +0 -1
- package/esm/_internal/commentblock.11.js.map +0 -1
- package/esm/_internal/constants.59.js.map +0 -1
- package/esm/_internal/datepickerfield.12.js.map +0 -1
- package/esm/_internal/dialog.13.js.map +0 -1
- package/esm/_internal/divider.14.js.map +0 -1
- package/esm/_internal/draghandle.15.js.map +0 -1
- package/esm/_internal/dropdown.16.js.map +0 -1
- package/esm/_internal/expansionpanel.17.js.map +0 -1
- package/esm/_internal/flag.18.js.map +0 -1
- package/esm/_internal/flexbox.19.js.map +0 -1
- package/esm/_internal/getrootclassname.54.js.map +0 -1
- package/esm/_internal/griditem.20.js.map +0 -1
- package/esm/_internal/icon.21.js.map +0 -1
- package/esm/_internal/iconbutton.6.js.map +0 -1
- package/esm/_internal/imageblock.22.js.map +0 -1
- package/esm/_internal/index.55.js.map +0 -1
- package/esm/_internal/inputhelper.23.js.map +0 -1
- package/esm/_internal/inputlabel.24.js.map +0 -1
- package/esm/_internal/lightbox.25.js.map +0 -1
- package/esm/_internal/link.26.js.map +0 -1
- package/esm/_internal/linkpreview.27.js.map +0 -1
- package/esm/_internal/list.28.js.map +0 -1
- package/esm/_internal/listsubheader.29.js.map +0 -1
- package/esm/_internal/mergerefs.56.js.map +0 -1
- package/esm/_internal/message.30.js.map +0 -1
- package/esm/_internal/mosaic.31.js.map +0 -1
- package/esm/_internal/notification.32.js.map +0 -1
- package/esm/_internal/partitionmulti.62.js.map +0 -1
- package/esm/_internal/popover.33.js.map +0 -1
- package/esm/_internal/postblock.34.js.map +0 -1
- package/esm/_internal/progress.35.js.map +0 -1
- package/esm/_internal/progresstrackersteppanel.36.js.map +0 -1
- package/esm/_internal/radiogroup.37.js.map +0 -1
- package/esm/_internal/renderlink.65.js.map +0 -1
- package/esm/_internal/selectmultiple.38.js.map +0 -1
- package/esm/_internal/sidenavigationitem.39.js.map +0 -1
- package/esm/_internal/skeletontypography.40.js.map +0 -1
- package/esm/_internal/slider.41.js.map +0 -1
- package/esm/_internal/slides.42.js.map +0 -1
- package/esm/_internal/switch.43.js.map +0 -1
- package/esm/_internal/tablerow.44.js.map +0 -1
- package/esm/_internal/tabpanel.45.js.map +0 -1
- package/esm/_internal/textfield.46.js.map +0 -1
- package/esm/_internal/thumbnail.47.js.map +0 -1
- package/esm/_internal/toolbar.49.js.map +0 -1
- package/esm/_internal/tooltip.50.js.map +0 -1
- package/esm/_internal/type.64.js.map +0 -1
- package/esm/_internal/types.48.js.map +0 -1
- package/esm/_internal/uploader.51.js.map +0 -1
- package/esm/_internal/usedelayedvisibility.63.js.map +0 -1
- package/esm/_internal/usedisablebodyscroll.61.js.map +0 -1
- package/esm/_internal/usefocustrap.58.js.map +0 -1
- package/esm/_internal/userblock.52.js.map +0 -1
- package/esm/_internal/userovingtabindex.66.js.map +0 -1
- package/hooks/useFocusWithin.d.ts +0 -16
- package/hooks/useFocusWithin.js +0 -28
- package/hooks/useFocusWithin.js.map +0 -1
- package/index.js +0 -90
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Slides.js","sources":["../../../src/hooks/useInterval.tsx","../../../src/components/slideshow/constants.ts","../../../src/hooks/useSlideshowControls.ts","../../../src/components/slideshow/Slideshow.tsx","../../../src/components/slideshow/SlideshowItem.tsx","../../../src/components/slideshow/useSwipeNavigate.ts","../../../src/components/slideshow/useKeyNavigate.ts","../../../src/components/slideshow/usePaginationVisibleRange.ts","../../../src/components/slideshow/SlideshowControls.tsx","../../../src/components/slideshow/Slides.tsx"],"sourcesContent":["import { useEffect, useRef } from 'react';\n\nimport isFunction from 'lodash/isFunction';\nimport { Callback } from '../utils';\n\n/**\n * Making setInterval Declarative with React Hooks.\n * Credits: https://overreacted.io/making-setinterval-declarative-with-react-hooks/\n *\n * @param callback Function called by setInterval.\n * @param delay Delay for setInterval.\n */\nexport function useInterval(callback: Callback, delay: number | null): void {\n const savedCallback = useRef<Callback>();\n\n useEffect(() => {\n savedCallback.current = callback;\n });\n\n useEffect(() => {\n if (delay === null) return undefined;\n\n function tick() {\n if (isFunction(savedCallback.current)) {\n savedCallback.current();\n }\n }\n const id = setInterval(tick, delay);\n return () => clearInterval(id);\n }, [delay]);\n}\n","/**\n * Autoplay default interval in ms.\n */\nexport const AUTOPLAY_DEFAULT_INTERVAL = 5000;\n\n/**\n * Full width size in percent.\n */\nexport const FULL_WIDTH_PERCENT = 100;\n\n/**\n * Edge from the active index.\n */\nexport const EDGE_FROM_ACTIVE_INDEX = 2;\n\n/**\n * Max number of pagination items.\n */\nexport const PAGINATION_ITEMS_MAX = 5;\n\n/**\n * Size of a pagination item. Used to translate wrapper.\n */\nexport const PAGINATION_ITEM_SIZE = 12;\n","import { useState, useCallback, useEffect, useMemo } from 'react';\n\nimport { useInterval } from '@lumx/react/hooks/useInterval';\nimport uniqueId from 'lodash/uniqueId';\nimport { AUTOPLAY_DEFAULT_INTERVAL } from '@lumx/react/components/slideshow/constants';\n\nexport interface UseSlideshowControlsOptions {\n /** default active index to be displayed */\n defaultActiveIndex?: number;\n /** total slides to display */\n itemsCount: number;\n /** Index of the current slide. */\n activeIndex?: number;\n /** Whether the automatic rotation of the slideshow is enabled or not. */\n autoPlay?: boolean;\n /** Whether the image has to fill its container height or not. */\n fillHeight?: boolean;\n /** Number of slides to group together. */\n groupBy?: number;\n /** Interval between each slide when automatic rotation is enabled. */\n interval?: number;\n /** Callback when slide changes */\n onChange?(index: number): void;\n /** slideshow HTML id attribute */\n id?: string;\n /** slides wrapper HTML id attribute */\n slidesId?: string;\n}\n\nexport interface UseSlideshowControls {\n /** Index for the first visible slide, should be used when groupBy is passed in */\n startIndexVisible: number;\n /** Index for the last visible slide, should be used when groupBy is passed in */\n endIndexVisible: number;\n /** total slides to be displayed */\n slidesCount: number;\n /** callback to set */\n setSlideshow: (element: HTMLDivElement | null) => void;\n /** reference to the slideshow element */\n slideshow: HTMLDivElement | null;\n /** id to be used for the slideshow */\n slideshowId: string;\n /** id to be used for the wrapper that contains the slides */\n slideshowSlidesId: string;\n /** callback that triggers the previous slide while using the slideshow controls */\n onPreviousClick: (loopback: boolean) => void;\n /** callback that triggers the next slide while using the slideshow controls */\n onNextClick: (loopback: boolean) => void;\n /** callback that triggers a specific page while using the slideshow controls */\n onPaginationClick: (index: number) => void;\n /** whether the slideshow is autoplaying or not */\n isAutoPlaying: boolean;\n /** whether the slideshow was force paused or not */\n isForcePaused: boolean;\n /** callback to change whether the slideshow is autoplaying or not */\n toggleAutoPlay: () => void;\n /** calback to change whether the slideshow should be force paused or not */\n toggleForcePause: () => void;\n /** current active slide index */\n activeIndex: number;\n /** set the current index as the active one */\n setActiveIndex: (index: number) => void;\n /** callback that stops the auto play */\n stopAutoPlay: () => void;\n /** callback that starts the auto play */\n startAutoPlay: () => void;\n}\n\nexport const DEFAULT_OPTIONS: Partial<UseSlideshowControlsOptions> = {\n activeIndex: 0,\n groupBy: 1,\n interval: AUTOPLAY_DEFAULT_INTERVAL,\n};\n\nexport const useSlideshowControls = ({\n activeIndex = DEFAULT_OPTIONS.activeIndex,\n groupBy = DEFAULT_OPTIONS.groupBy,\n interval = DEFAULT_OPTIONS.interval,\n autoPlay,\n defaultActiveIndex,\n onChange,\n itemsCount,\n id,\n slidesId,\n}: UseSlideshowControlsOptions): UseSlideshowControls => {\n const [currentIndex, setCurrentIndex] = useState(activeIndex as number);\n // Use state instead of a ref to make the slideshow controls update directly when the element is set.\n const [element, setElement] = useState<HTMLDivElement | null>(null);\n\n // Number of slides when using groupBy prop.\n const slidesCount = Math.ceil(itemsCount / Math.min(groupBy as number, itemsCount));\n\n // Change current index to display next slide.\n const goToNextSlide = useCallback(\n (loopback = true) => {\n setCurrentIndex((index) => {\n if (loopback && index === slidesCount - 1) {\n // Loopback to the start.\n return 0;\n }\n if (index < slidesCount - 1) {\n // Next slide.\n return index + 1;\n }\n return index;\n });\n },\n [slidesCount, setCurrentIndex],\n );\n\n // Change current index to display previous slide.\n const goToPreviousSlide = useCallback(\n (loopback = true) => {\n setCurrentIndex((index) => {\n if (loopback && index === 0) {\n // Loopback to the end.\n return slidesCount - 1;\n }\n if (index > 0) {\n // Previous slide.\n return index - 1;\n }\n return index;\n });\n },\n [slidesCount, setCurrentIndex],\n );\n\n // Auto play\n const [isAutoPlaying, setIsAutoPlaying] = useState(Boolean(autoPlay));\n const [isForcePaused, setIsForcePaused] = useState(false);\n\n const isSlideshowAutoPlaying = isForcePaused ? false : isAutoPlaying;\n // Start\n useInterval(goToNextSlide, isSlideshowAutoPlaying && slidesCount > 1 ? (interval as number) : null);\n\n // Reset current index if it become invalid.\n useEffect(() => {\n if (currentIndex > slidesCount - 1) {\n setCurrentIndex(defaultActiveIndex as number);\n }\n }, [currentIndex, slidesCount, defaultActiveIndex]);\n\n const startAutoPlay = () => {\n setIsAutoPlaying(Boolean(autoPlay));\n };\n\n const stopAutoPlay = () => {\n setIsAutoPlaying(false);\n };\n\n // Handle click on a bullet to go to a specific slide.\n const onPaginationClick = useCallback(\n (index: number) => {\n stopAutoPlay();\n setIsForcePaused(true);\n\n if (index >= 0 && index < slidesCount) {\n setCurrentIndex(index);\n }\n },\n [slidesCount, setCurrentIndex],\n );\n\n // Handle click or keyboard event to go to next slide.\n const onNextClick = useCallback(\n (loopback = true) => {\n stopAutoPlay();\n setIsForcePaused(true);\n goToNextSlide(loopback);\n },\n [goToNextSlide],\n );\n\n // Handle click or keyboard event to go to previous slide.\n const onPreviousClick = useCallback(\n (loopback = true) => {\n stopAutoPlay();\n setIsForcePaused(true);\n goToPreviousSlide(loopback);\n },\n [goToPreviousSlide],\n );\n\n // If the activeIndex props changes, update the current slide\n useEffect(() => {\n setCurrentIndex(activeIndex as number);\n }, [activeIndex]);\n\n // If the slide changes, with autoplay for example, trigger \"onChange\"\n useEffect(() => {\n if (!onChange) return;\n onChange(currentIndex);\n }, [currentIndex, onChange]);\n\n const slideshowId = useMemo(() => id || uniqueId('slideshow'), [id]);\n const slideshowSlidesId = useMemo(() => slidesId || uniqueId('slideshow-slides'), [slidesId]);\n\n const toggleAutoPlay = () => {\n if (isSlideshowAutoPlaying) {\n stopAutoPlay();\n } else {\n startAutoPlay();\n }\n };\n\n const toggleForcePause = () => {\n const shouldBePaused = !isForcePaused;\n\n setIsForcePaused(shouldBePaused);\n\n if (!shouldBePaused) {\n startAutoPlay();\n } else {\n stopAutoPlay();\n }\n };\n\n // Start index and end index of visible slides.\n const startIndexVisible = currentIndex * (groupBy as number);\n const endIndexVisible = startIndexVisible + (groupBy as number);\n\n return {\n startIndexVisible,\n endIndexVisible,\n setSlideshow: setElement,\n slideshow: element,\n slideshowId,\n slideshowSlidesId,\n onPreviousClick,\n onNextClick,\n onPaginationClick,\n isAutoPlaying: isSlideshowAutoPlaying,\n toggleAutoPlay,\n activeIndex: currentIndex,\n slidesCount,\n setActiveIndex: setCurrentIndex,\n startAutoPlay,\n stopAutoPlay,\n isForcePaused,\n toggleForcePause,\n };\n};\n","import React, { forwardRef } from 'react';\n\nimport { SlideshowControls, SlideshowControlsProps, Theme, Slides, SlidesProps } from '@lumx/react';\nimport { DEFAULT_OPTIONS } from '@lumx/react/hooks/useSlideshowControls';\nimport { Comp, GenericProps } from '@lumx/react/utils';\nimport { useFocusWithin } from '@lumx/react/hooks/useFocusWithin';\nimport { mergeRefs } from '@lumx/react/utils/mergeRefs';\n\n/**\n * Defines the props of the component.\n */\nexport interface SlideshowProps\n extends GenericProps,\n Pick<SlidesProps, 'autoPlay' | 'slidesId' | 'id' | 'theme' | 'fillHeight' | 'groupBy'> {\n /** current slide active */\n activeIndex?: SlidesProps['activeIndex'];\n /** Interval between each slide when automatic rotation is enabled. */\n interval?: number;\n /** Props to pass to the slideshow controls (minus those already set by the Slideshow props). */\n slideshowControlsProps?: Pick<SlideshowControlsProps, 'nextButtonProps' | 'previousButtonProps'> &\n Omit<\n SlideshowControlsProps,\n | 'activeIndex'\n | 'onPaginationClick'\n | 'onNextClick'\n | 'onPreviousClick'\n | 'slidesCount'\n | 'parentRef'\n | 'theme'\n >;\n /** Callback when slide changes */\n onChange?(index: number): void;\n}\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<SlideshowProps> = {\n ...DEFAULT_OPTIONS,\n theme: Theme.light,\n};\n\n/**\n * Slideshow component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const Slideshow: Comp<SlideshowProps, HTMLDivElement> = forwardRef((props, ref) => {\n const {\n activeIndex,\n autoPlay,\n children,\n className,\n fillHeight,\n groupBy,\n interval,\n onChange,\n slideshowControlsProps,\n theme,\n id,\n slidesId,\n ...forwardedProps\n } = props;\n // Number of slideshow items.\n const itemsCount = React.Children.count(children);\n\n const {\n activeIndex: currentIndex,\n slideshowId,\n setSlideshow,\n isAutoPlaying,\n slideshowSlidesId,\n slidesCount,\n onNextClick,\n onPaginationClick,\n onPreviousClick,\n slideshow,\n stopAutoPlay,\n startAutoPlay,\n toggleAutoPlay,\n toggleForcePause,\n } = SlideshowControls.useSlideshowControls({\n activeIndex,\n defaultActiveIndex: DEFAULT_PROPS.activeIndex as number,\n autoPlay: Boolean(autoPlay),\n itemsCount,\n groupBy,\n id,\n interval,\n onChange,\n slidesId,\n });\n\n useFocusWithin({\n element: slideshow,\n onFocusIn: stopAutoPlay,\n onFocusOut: startAutoPlay,\n });\n\n return (\n <Slides\n activeIndex={currentIndex}\n id={slideshowId}\n className={className}\n theme={theme}\n fillHeight={fillHeight}\n groupBy={groupBy}\n isAutoPlaying={isAutoPlaying}\n autoPlay={autoPlay}\n slidesId={slideshowSlidesId}\n toggleAutoPlay={toggleAutoPlay}\n interval={interval}\n ref={mergeRefs(ref, setSlideshow)}\n afterSlides={\n slideshowControlsProps && slidesCount > 1 ? (\n <div className={`${Slides.className}__controls`}>\n <SlideshowControls\n {...slideshowControlsProps}\n activeIndex={currentIndex}\n onPaginationClick={onPaginationClick}\n onNextClick={onNextClick}\n onPreviousClick={onPreviousClick}\n slidesCount={slidesCount}\n parentRef={slideshow}\n theme={theme}\n isAutoPlaying={isAutoPlaying}\n nextButtonProps={{\n 'aria-controls': slideshowSlidesId,\n ...slideshowControlsProps.nextButtonProps,\n }}\n previousButtonProps={{\n 'aria-controls': slideshowSlidesId,\n ...slideshowControlsProps.previousButtonProps,\n }}\n playButtonProps={\n autoPlay\n ? {\n 'aria-controls': slideshowSlidesId,\n onClick: toggleForcePause,\n ...slideshowControlsProps.playButtonProps,\n }\n : undefined\n }\n />\n </div>\n ) : undefined\n }\n {...forwardedProps}\n >\n {children}\n </Slides>\n );\n});\n\nSlideshow.displayName = 'Slideshow';\nSlideshow.defaultProps = DEFAULT_PROPS;\n","import React, { forwardRef } from 'react';\n\nimport classNames from 'classnames';\n\nimport { Comp, GenericProps, getRootClassName, handleBasicClasses } from '@lumx/react/utils';\n\n/**\n * Defines the props of the component.\n */\nexport interface SlideshowItemProps extends GenericProps {\n /** whether the slideshow item is currently visible */\n isCurrentlyVisible?: boolean;\n /** interval in which slides are automatically shown */\n interval?: number;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'SlideshowItem';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * SlideshowItem component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const SlideshowItem: Comp<SlideshowItemProps, HTMLDivElement> = forwardRef((props, ref) => {\n const { className, children, ...forwardedProps } = props;\n\n return (\n <div\n ref={ref}\n className={classNames(\n className,\n handleBasicClasses({\n prefix: CLASSNAME,\n }),\n )}\n aria-roledescription=\"slide\"\n role=\"group\"\n {...forwardedProps}\n >\n {children}\n </div>\n );\n});\n\nSlideshowItem.displayName = COMPONENT_NAME;\nSlideshowItem.className = CLASSNAME;\n","import { useEffect } from 'react';\nimport { detectHorizontalSwipe } from '@lumx/core/js/utils';\n\nconst isTouchDevice = () => 'ontouchstart' in window;\n\n/**\n * Listen swipe to navigate left and right.\n */\nexport function useSwipeNavigate(element?: HTMLElement | null, onNext?: () => void, onPrevious?: () => void): void {\n useEffect(() => {\n if (!element || !isTouchDevice()) return undefined;\n\n return detectHorizontalSwipe(element, (swipe) => {\n const callback = swipe === 'right' ? onPrevious : onNext;\n callback?.();\n });\n }, [onPrevious, onNext, element]);\n}\n","import { useEffect } from 'react';\n\n/**\n * Listen keyboard to navigate left and right.\n */\nexport function useKeyNavigate(element?: HTMLElement | null, onNext?: () => void, onPrevious?: () => void): void {\n useEffect(() => {\n if (!element) return undefined;\n const onKeyNavigate = (evt: KeyboardEvent) => {\n let callback;\n if (evt?.key === 'ArrowRight') {\n callback = onNext;\n } else if (evt?.key === 'ArrowLeft') {\n callback = onPrevious;\n }\n if (!callback) return;\n\n callback();\n evt.preventDefault();\n evt.stopPropagation();\n };\n\n element.addEventListener('keydown', onKeyNavigate);\n return () => {\n element.removeEventListener('keydown', onKeyNavigate);\n };\n }, [onPrevious, onNext, element]);\n}\n","import { useMemo, useRef } from 'react';\nimport { EDGE_FROM_ACTIVE_INDEX, PAGINATION_ITEMS_MAX } from '@lumx/react/components/slideshow/constants';\n\ntype Range = { min: number; max: number };\n\n/**\n * Calculate the currently visible pagination \"bullet\" range.\n */\nexport function usePaginationVisibleRange(activeIndex: number, slideCount: number): Range {\n const previousVisibleRangeRef = useRef<Range>();\n return useMemo(() => {\n const lastSlide = slideCount - 1;\n const { current: previousVisibleRange } = previousVisibleRangeRef;\n let newVisibleRange: Range;\n if (activeIndex === previousVisibleRange?.max && activeIndex < lastSlide) {\n newVisibleRange = { min: previousVisibleRange.min + 1, max: previousVisibleRange.max + 1 };\n } else if (activeIndex === previousVisibleRange?.min && activeIndex > 0) {\n newVisibleRange = { min: previousVisibleRange.min - 1, max: previousVisibleRange.max - 1 };\n } else {\n const deltaItems = PAGINATION_ITEMS_MAX - 1;\n let min = activeIndex - EDGE_FROM_ACTIVE_INDEX;\n let max = activeIndex + EDGE_FROM_ACTIVE_INDEX;\n\n if (activeIndex > lastSlide - EDGE_FROM_ACTIVE_INDEX) {\n min = lastSlide - deltaItems;\n max = lastSlide;\n } else if (activeIndex < deltaItems) {\n min = 0;\n max = deltaItems;\n }\n\n newVisibleRange = { min, max };\n }\n previousVisibleRangeRef.current = newVisibleRange;\n return newVisibleRange;\n }, [activeIndex, slideCount]);\n}\n","import React, { forwardRef, RefObject, useCallback, useMemo } from 'react';\n\nimport classNames from 'classnames';\nimport range from 'lodash/range';\n\nimport { mdiChevronLeft, mdiChevronRight, mdiPlayCircleOutline, mdiPauseCircleOutline } from '@lumx/icons';\nimport { Emphasis, IconButton, IconButtonProps, Theme } from '@lumx/react';\nimport { Comp, GenericProps, getRootClassName, handleBasicClasses } from '@lumx/react/utils';\nimport { WINDOW } from '@lumx/react/constants';\nimport { useSlideshowControls, DEFAULT_OPTIONS } from '@lumx/react/hooks/useSlideshowControls';\n\nimport { useSwipeNavigate } from './useSwipeNavigate';\nimport { useKeyNavigate } from './useKeyNavigate';\nimport { PAGINATION_ITEM_SIZE, PAGINATION_ITEMS_MAX } from './constants';\nimport { usePaginationVisibleRange } from './usePaginationVisibleRange';\n\n/**\n * Defines the props of the component.\n */\nexport interface SlideshowControlsProps extends GenericProps {\n /** Index of the current slide. */\n activeIndex?: number;\n /** Props to pass to the next button (minus those already set by the SlideshowControls props). */\n nextButtonProps: Pick<IconButtonProps, 'label'> &\n Omit<IconButtonProps, 'label' | 'onClick' | 'icon' | 'emphasis' | 'color'>;\n /** Reference to the parent element on which we want to listen touch swipe. */\n parentRef?: RefObject<HTMLDivElement> | HTMLDivElement | null;\n /** Props to pass to the previous button (minus those already set by the SlideshowControls props). */\n previousButtonProps: Pick<IconButtonProps, 'label'> &\n Omit<IconButtonProps, 'label' | 'onClick' | 'icon' | 'emphasis' | 'color'>;\n /** Number of slides. */\n slidesCount: number;\n /** Theme adapting the component to light or dark background. */\n theme?: Theme;\n /** On next button click callback. */\n onNextClick?(loopback?: boolean): void;\n /** On pagination change callback. */\n onPaginationClick?(index: number): void;\n /** On previous button click callback. */\n onPreviousClick?(loopback?: boolean): void;\n /** whether the slideshow is currently playing */\n isAutoPlaying?: boolean;\n /** function to be executed in order to retrieve the label for the pagination item */\n paginationItemLabel?: (index: number) => string;\n /** Props to pass to the lay button (minus those already set by the SlideshowControls props). */\n playButtonProps?: Pick<IconButtonProps, 'label'> &\n Omit<IconButtonProps, 'label' | 'onClick' | 'icon' | 'emphasis' | 'color'>;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'SlideshowControls';\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<SlideshowControlsProps> = {\n activeIndex: 0,\n theme: Theme.light,\n};\n\n/**\n * SlideshowControls component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nconst InternalSlideshowControls: Comp<SlideshowControlsProps, HTMLDivElement> = forwardRef((props, ref) => {\n const {\n activeIndex,\n className,\n nextButtonProps,\n onNextClick,\n onPaginationClick,\n onPreviousClick,\n parentRef,\n previousButtonProps,\n slidesCount,\n theme,\n isAutoPlaying = false,\n playButtonProps,\n paginationItemLabel,\n ...forwardedProps\n } = props;\n\n let parent;\n if (WINDOW) {\n // Checking window object to avoid errors in SSR.\n parent = parentRef instanceof HTMLElement ? parentRef : parentRef?.current;\n }\n // Listen to keyboard navigate left & right.\n useKeyNavigate(parent, onNextClick, onPreviousClick);\n // Listen to touch swipe navigate left & right.\n useSwipeNavigate(\n parent,\n // Go next without loopback.\n useCallback(() => onNextClick?.(false), [onNextClick]),\n // Go previous without loopback.\n useCallback(() => onPreviousClick?.(false), [onPreviousClick]),\n );\n\n // Pagination \"bullet\" range.\n const visibleRange = usePaginationVisibleRange(activeIndex as number, slidesCount);\n\n // Inline style of wrapper element.\n const wrapperStyle = { transform: `translateX(-${PAGINATION_ITEM_SIZE * visibleRange.min}px)` };\n\n return (\n <div\n ref={ref}\n {...forwardedProps}\n className={classNames(className, handleBasicClasses({ prefix: CLASSNAME, theme }), {\n [`${CLASSNAME}--has-infinite-pagination`]: slidesCount > PAGINATION_ITEMS_MAX,\n })}\n >\n <IconButton\n {...previousButtonProps}\n icon={mdiChevronLeft}\n className={`${CLASSNAME}__navigation`}\n color={theme === Theme.dark ? 'light' : 'dark'}\n emphasis={Emphasis.low}\n onClick={onPreviousClick}\n />\n <div className={`${CLASSNAME}__pagination`}>\n <div className={`${CLASSNAME}__pagination-items`} style={wrapperStyle}>\n {useMemo(\n () =>\n range(slidesCount).map((index) => {\n const isOnEdge =\n index !== 0 &&\n index !== slidesCount - 1 &&\n (index === visibleRange.min || index === visibleRange.max);\n const isActive = activeIndex === index;\n const isOutRange = index < visibleRange.min || index > visibleRange.max;\n return (\n <button\n className={classNames(\n handleBasicClasses({\n prefix: `${CLASSNAME}__pagination-item`,\n isActive,\n isOnEdge,\n isOutRange,\n }),\n )}\n key={index}\n type=\"button\"\n onClick={() => onPaginationClick?.(index)}\n {...{\n 'aria-label': paginationItemLabel\n ? paginationItemLabel(index)\n : `${index + 1} / ${slidesCount}`,\n }}\n />\n );\n }),\n [\n slidesCount,\n visibleRange.min,\n visibleRange.max,\n activeIndex,\n paginationItemLabel,\n onPaginationClick,\n ],\n )}\n </div>\n </div>\n\n {playButtonProps ? (\n <IconButton\n {...playButtonProps}\n icon={isAutoPlaying ? mdiPauseCircleOutline : mdiPlayCircleOutline}\n className={`${CLASSNAME}__play`}\n color={theme === Theme.dark ? 'light' : 'dark'}\n emphasis={Emphasis.low}\n />\n ) : null}\n\n <IconButton\n {...nextButtonProps}\n icon={mdiChevronRight}\n className={`${CLASSNAME}__navigation`}\n color={theme === Theme.dark ? 'light' : 'dark'}\n emphasis={Emphasis.low}\n onClick={onNextClick}\n />\n </div>\n );\n});\n\nInternalSlideshowControls.displayName = COMPONENT_NAME;\nInternalSlideshowControls.className = CLASSNAME;\nInternalSlideshowControls.defaultProps = DEFAULT_PROPS;\n\nexport const SlideshowControls = Object.assign(InternalSlideshowControls, {\n useSlideshowControls,\n useSlideshowControlsDefaultOptions: DEFAULT_OPTIONS,\n});\n","import React, { CSSProperties, forwardRef } from 'react';\n\nimport classNames from 'classnames';\n\nimport { FULL_WIDTH_PERCENT } from '@lumx/react/components/slideshow/constants';\nimport { Comp, GenericProps, getRootClassName, handleBasicClasses } from '@lumx/react/utils';\nimport { Theme } from '@lumx/react';\n\nexport interface SlidesProps extends GenericProps {\n /** current slide active */\n activeIndex: number;\n /** slides id to be added to the wrapper */\n id?: string;\n /** custom classname */\n className?: string;\n /** custom theme */\n theme?: Theme;\n /** Whether the automatic rotation of the slideshow is enabled or not. */\n autoPlay?: boolean;\n /** Whether the image has to fill its container height or not. */\n fillHeight?: boolean;\n /** Number of slides to group together. */\n groupBy?: number;\n /** whether the slides are currently playing or not */\n isAutoPlaying?: boolean;\n /** id to be passed in into the slides */\n slidesId?: string;\n /** callback to change whether the slideshow is playing or not */\n toggleAutoPlay: () => void;\n /** component to be rendered after the slides */\n afterSlides?: React.ReactNode;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'Slideshow';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * Slides component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const Slides: Comp<SlidesProps, HTMLDivElement> = forwardRef((props, ref) => {\n const {\n activeIndex,\n id,\n className,\n theme,\n fillHeight,\n groupBy,\n isAutoPlaying,\n toggleAutoPlay,\n slidesId,\n children,\n afterSlides,\n ...forwardedProps\n } = props;\n // Inline style of wrapper element.\n const wrapperStyle: CSSProperties = { transform: `translateX(-${FULL_WIDTH_PERCENT * activeIndex}%)` };\n\n return (\n <section\n id={id}\n ref={ref}\n {...forwardedProps}\n className={classNames(className, handleBasicClasses({ prefix: CLASSNAME, theme }), {\n [`${CLASSNAME}--fill-height`]: fillHeight,\n [`${CLASSNAME}--group-by-${groupBy}`]: Boolean(groupBy),\n })}\n aria-roledescription=\"carousel\"\n >\n <div\n id={slidesId}\n className={`${CLASSNAME}__slides`}\n onMouseEnter={toggleAutoPlay}\n onMouseLeave={toggleAutoPlay}\n aria-live={isAutoPlaying ? 'off' : 'polite'}\n >\n <div className={`${CLASSNAME}__wrapper`} style={wrapperStyle}>\n {children}\n </div>\n </div>\n\n {afterSlides}\n </section>\n );\n});\n\nSlides.displayName = COMPONENT_NAME;\nSlides.className = CLASSNAME;\n"],"names":["useInterval","callback","delay","savedCallback","useRef","useEffect","current","undefined","tick","isFunction","id","setInterval","clearInterval","AUTOPLAY_DEFAULT_INTERVAL","FULL_WIDTH_PERCENT","EDGE_FROM_ACTIVE_INDEX","PAGINATION_ITEMS_MAX","PAGINATION_ITEM_SIZE","DEFAULT_OPTIONS","activeIndex","groupBy","interval","useSlideshowControls","autoPlay","defaultActiveIndex","onChange","itemsCount","slidesId","useState","currentIndex","setCurrentIndex","element","setElement","slidesCount","Math","ceil","min","goToNextSlide","useCallback","loopback","index","goToPreviousSlide","Boolean","isAutoPlaying","setIsAutoPlaying","isForcePaused","setIsForcePaused","isSlideshowAutoPlaying","startAutoPlay","stopAutoPlay","onPaginationClick","onNextClick","onPreviousClick","slideshowId","useMemo","uniqueId","slideshowSlidesId","toggleAutoPlay","toggleForcePause","shouldBePaused","startIndexVisible","endIndexVisible","setSlideshow","slideshow","setActiveIndex","DEFAULT_PROPS","theme","Theme","light","Slideshow","forwardRef","props","ref","children","className","fillHeight","slideshowControlsProps","forwardedProps","React","Children","count","SlideshowControls","useFocusWithin","onFocusIn","onFocusOut","mergeRefs","Slides","nextButtonProps","previousButtonProps","onClick","playButtonProps","displayName","defaultProps","COMPONENT_NAME","CLASSNAME","getRootClassName","SlideshowItem","classNames","handleBasicClasses","prefix","isTouchDevice","window","useSwipeNavigate","onNext","onPrevious","detectHorizontalSwipe","swipe","useKeyNavigate","onKeyNavigate","evt","key","preventDefault","stopPropagation","addEventListener","removeEventListener","usePaginationVisibleRange","slideCount","previousVisibleRangeRef","lastSlide","previousVisibleRange","newVisibleRange","max","deltaItems","InternalSlideshowControls","parentRef","paginationItemLabel","parent","WINDOW","HTMLElement","visibleRange","wrapperStyle","transform","mdiChevronLeft","dark","Emphasis","low","range","map","isOnEdge","isActive","isOutRange","mdiPauseCircleOutline","mdiPlayCircleOutline","mdiChevronRight","Object","assign","useSlideshowControlsDefaultOptions","afterSlides"],"mappings":";;;;;;;;;;;;;AAKA;;;;;;;AAOO,SAASA,WAAT,CAAqBC,QAArB,EAAyCC,KAAzC,EAAqE;AACxE,MAAMC,aAAa,GAAGC,MAAM,EAA5B;AAEAC,EAAAA,SAAS,CAAC,YAAM;AACZF,IAAAA,aAAa,CAACG,OAAd,GAAwBL,QAAxB;AACH,GAFQ,CAAT;AAIAI,EAAAA,SAAS,CAAC,YAAM;AACZ,QAAIH,KAAK,KAAK,IAAd,EAAoB,OAAOK,SAAP;;AAEpB,aAASC,IAAT,GAAgB;AACZ,UAAIC,UAAU,CAACN,aAAa,CAACG,OAAf,CAAd,EAAuC;AACnCH,QAAAA,aAAa,CAACG,OAAd;AACH;AACJ;;AACD,QAAMI,EAAE,GAAGC,WAAW,CAACH,IAAD,EAAON,KAAP,CAAtB;AACA,WAAO;AAAA,aAAMU,aAAa,CAACF,EAAD,CAAnB;AAAA,KAAP;AACH,GAVQ,EAUN,CAACR,KAAD,CAVM,CAAT;AAWH;;AC9BD;;;AAGO,IAAMW,yBAAyB,GAAG,IAAlC;AAEP;;;;AAGO,IAAMC,kBAAkB,GAAG,GAA3B;AAEP;;;;AAGO,IAAMC,sBAAsB,GAAG,CAA/B;AAEP;;;;AAGO,IAAMC,oBAAoB,GAAG,CAA7B;AAEP;;;;AAGO,IAAMC,oBAAoB,GAAG,EAA7B;;AC6CA,IAAMC,eAAqD,GAAG;AACjEC,EAAAA,WAAW,EAAE,CADoD;AAEjEC,EAAAA,OAAO,EAAE,CAFwD;AAGjEC,EAAAA,QAAQ,EAAER;AAHuD,CAA9D;AAMA,IAAMS,oBAAoB,GAAG,SAAvBA,oBAAuB,OAUqB;AAAA,8BATrDH,WASqD;AAAA,MATrDA,WASqD,iCATvCD,eAAe,CAACC,WASuB;AAAA,0BARrDC,OAQqD;AAAA,MARrDA,OAQqD,6BAR3CF,eAAe,CAACE,OAQ2B;AAAA,2BAPrDC,QAOqD;AAAA,MAPrDA,QAOqD,8BAP1CH,eAAe,CAACG,QAO0B;AAAA,MANrDE,QAMqD,QANrDA,QAMqD;AAAA,MALrDC,kBAKqD,QALrDA,kBAKqD;AAAA,MAJrDC,QAIqD,QAJrDA,QAIqD;AAAA,MAHrDC,UAGqD,QAHrDA,UAGqD;AAAA,MAFrDhB,EAEqD,QAFrDA,EAEqD;AAAA,MADrDiB,QACqD,QADrDA,QACqD;;AAAA,kBACbC,QAAQ,CAACT,WAAD,CADK;AAAA;AAAA,MAC9CU,YAD8C;AAAA,MAChCC,eADgC;;;AAAA,mBAGvBF,QAAQ,CAAwB,IAAxB,CAHe;AAAA;AAAA,MAG9CG,OAH8C;AAAA,MAGrCC,UAHqC;;;AAMrD,MAAMC,WAAW,GAAGC,IAAI,CAACC,IAAL,CAAUT,UAAU,GAAGQ,IAAI,CAACE,GAAL,CAAShB,OAAT,EAA4BM,UAA5B,CAAvB,CAApB,CANqD;;AASrD,MAAMW,aAAa,GAAGC,WAAW,CAC7B,YAAqB;AAAA,QAApBC,QAAoB,uEAAT,IAAS;AACjBT,IAAAA,eAAe,CAAC,UAACU,KAAD,EAAW;AACvB,UAAID,QAAQ,IAAIC,KAAK,KAAKP,WAAW,GAAG,CAAxC,EAA2C;AACvC;AACA,eAAO,CAAP;AACH;;AACD,UAAIO,KAAK,GAAGP,WAAW,GAAG,CAA1B,EAA6B;AACzB;AACA,eAAOO,KAAK,GAAG,CAAf;AACH;;AACD,aAAOA,KAAP;AACH,KAVc,CAAf;AAWH,GAb4B,EAc7B,CAACP,WAAD,EAAcH,eAAd,CAd6B,CAAjC,CATqD;;AA2BrD,MAAMW,iBAAiB,GAAGH,WAAW,CACjC,YAAqB;AAAA,QAApBC,QAAoB,uEAAT,IAAS;AACjBT,IAAAA,eAAe,CAAC,UAACU,KAAD,EAAW;AACvB,UAAID,QAAQ,IAAIC,KAAK,KAAK,CAA1B,EAA6B;AACzB;AACA,eAAOP,WAAW,GAAG,CAArB;AACH;;AACD,UAAIO,KAAK,GAAG,CAAZ,EAAe;AACX;AACA,eAAOA,KAAK,GAAG,CAAf;AACH;;AACD,aAAOA,KAAP;AACH,KAVc,CAAf;AAWH,GAbgC,EAcjC,CAACP,WAAD,EAAcH,eAAd,CAdiC,CAArC,CA3BqD;;AAAA,mBA6CXF,QAAQ,CAACc,OAAO,CAACnB,QAAD,CAAR,CA7CG;AAAA;AAAA,MA6C9CoB,aA7C8C;AAAA,MA6C/BC,gBA7C+B;;AAAA,mBA8CXhB,QAAQ,CAAC,KAAD,CA9CG;AAAA;AAAA,MA8C9CiB,aA9C8C;AAAA,MA8C/BC,gBA9C+B;;AAgDrD,MAAMC,sBAAsB,GAAGF,aAAa,GAAG,KAAH,GAAWF,aAAvD,CAhDqD;;AAkDrD3C,EAAAA,WAAW,CAACqC,aAAD,EAAgBU,sBAAsB,IAAId,WAAW,GAAG,CAAxC,GAA6CZ,QAA7C,GAAmE,IAAnF,CAAX,CAlDqD;;AAqDrDhB,EAAAA,SAAS,CAAC,YAAM;AACZ,QAAIwB,YAAY,GAAGI,WAAW,GAAG,CAAjC,EAAoC;AAChCH,MAAAA,eAAe,CAACN,kBAAD,CAAf;AACH;AACJ,GAJQ,EAIN,CAACK,YAAD,EAAeI,WAAf,EAA4BT,kBAA5B,CAJM,CAAT;;AAMA,MAAMwB,aAAa,GAAG,SAAhBA,aAAgB,GAAM;AACxBJ,IAAAA,gBAAgB,CAACF,OAAO,CAACnB,QAAD,CAAR,CAAhB;AACH,GAFD;;AAIA,MAAM0B,YAAY,GAAG,SAAfA,YAAe,GAAM;AACvBL,IAAAA,gBAAgB,CAAC,KAAD,CAAhB;AACH,GAFD,CA/DqD;;;AAoErD,MAAMM,iBAAiB,GAAGZ,WAAW,CACjC,UAACE,KAAD,EAAmB;AACfS,IAAAA,YAAY;AACZH,IAAAA,gBAAgB,CAAC,IAAD,CAAhB;;AAEA,QAAIN,KAAK,IAAI,CAAT,IAAcA,KAAK,GAAGP,WAA1B,EAAuC;AACnCH,MAAAA,eAAe,CAACU,KAAD,CAAf;AACH;AACJ,GARgC,EASjC,CAACP,WAAD,EAAcH,eAAd,CATiC,CAArC,CApEqD;;AAiFrD,MAAMqB,WAAW,GAAGb,WAAW,CAC3B,YAAqB;AAAA,QAApBC,QAAoB,uEAAT,IAAS;AACjBU,IAAAA,YAAY;AACZH,IAAAA,gBAAgB,CAAC,IAAD,CAAhB;AACAT,IAAAA,aAAa,CAACE,QAAD,CAAb;AACH,GAL0B,EAM3B,CAACF,aAAD,CAN2B,CAA/B,CAjFqD;;AA2FrD,MAAMe,eAAe,GAAGd,WAAW,CAC/B,YAAqB;AAAA,QAApBC,QAAoB,uEAAT,IAAS;AACjBU,IAAAA,YAAY;AACZH,IAAAA,gBAAgB,CAAC,IAAD,CAAhB;AACAL,IAAAA,iBAAiB,CAACF,QAAD,CAAjB;AACH,GAL8B,EAM/B,CAACE,iBAAD,CAN+B,CAAnC,CA3FqD;;AAqGrDpC,EAAAA,SAAS,CAAC,YAAM;AACZyB,IAAAA,eAAe,CAACX,WAAD,CAAf;AACH,GAFQ,EAEN,CAACA,WAAD,CAFM,CAAT,CArGqD;;AA0GrDd,EAAAA,SAAS,CAAC,YAAM;AACZ,QAAI,CAACoB,QAAL,EAAe;AACfA,IAAAA,QAAQ,CAACI,YAAD,CAAR;AACH,GAHQ,EAGN,CAACA,YAAD,EAAeJ,QAAf,CAHM,CAAT;AAKA,MAAM4B,WAAW,GAAGC,OAAO,CAAC;AAAA,WAAM5C,EAAE,IAAI6C,QAAQ,CAAC,WAAD,CAApB;AAAA,GAAD,EAAoC,CAAC7C,EAAD,CAApC,CAA3B;AACA,MAAM8C,iBAAiB,GAAGF,OAAO,CAAC;AAAA,WAAM3B,QAAQ,IAAI4B,QAAQ,CAAC,kBAAD,CAA1B;AAAA,GAAD,EAAiD,CAAC5B,QAAD,CAAjD,CAAjC;;AAEA,MAAM8B,cAAc,GAAG,SAAjBA,cAAiB,GAAM;AACzB,QAAIV,sBAAJ,EAA4B;AACxBE,MAAAA,YAAY;AACf,KAFD,MAEO;AACHD,MAAAA,aAAa;AAChB;AACJ,GAND;;AAQA,MAAMU,gBAAgB,GAAG,SAAnBA,gBAAmB,GAAM;AAC3B,QAAMC,cAAc,GAAG,CAACd,aAAxB;AAEAC,IAAAA,gBAAgB,CAACa,cAAD,CAAhB;;AAEA,QAAI,CAACA,cAAL,EAAqB;AACjBX,MAAAA,aAAa;AAChB,KAFD,MAEO;AACHC,MAAAA,YAAY;AACf;AACJ,GAVD,CA1HqD;;;AAuIrD,MAAMW,iBAAiB,GAAG/B,YAAY,GAAIT,OAA1C;AACA,MAAMyC,eAAe,GAAGD,iBAAiB,GAAIxC,OAA7C;AAEA,SAAO;AACHwC,IAAAA,iBAAiB,EAAjBA,iBADG;AAEHC,IAAAA,eAAe,EAAfA,eAFG;AAGHC,IAAAA,YAAY,EAAE9B,UAHX;AAIH+B,IAAAA,SAAS,EAAEhC,OAJR;AAKHsB,IAAAA,WAAW,EAAXA,WALG;AAMHG,IAAAA,iBAAiB,EAAjBA,iBANG;AAOHJ,IAAAA,eAAe,EAAfA,eAPG;AAQHD,IAAAA,WAAW,EAAXA,WARG;AASHD,IAAAA,iBAAiB,EAAjBA,iBATG;AAUHP,IAAAA,aAAa,EAAEI,sBAVZ;AAWHU,IAAAA,cAAc,EAAdA,cAXG;AAYHtC,IAAAA,WAAW,EAAEU,YAZV;AAaHI,IAAAA,WAAW,EAAXA,WAbG;AAcH+B,IAAAA,cAAc,EAAElC,eAdb;AAeHkB,IAAAA,aAAa,EAAbA,aAfG;AAgBHC,IAAAA,YAAY,EAAZA,YAhBG;AAiBHJ,IAAAA,aAAa,EAAbA,aAjBG;AAkBHa,IAAAA,gBAAgB,EAAhBA;AAlBG,GAAP;AAoBH,CAxKM;;AClEP;;;;AA0BA;;;AAGA,IAAMO,aAAsC,sBACrC/C,eADqC;AAExCgD,EAAAA,KAAK,EAAEC,KAAK,CAACC;AAF2B,EAA5C;AAKA;;;;;;;;;IAOaC,SAA+C,GAAGC,UAAU,CAAC,UAACC,KAAD,EAAQC,GAAR,EAAgB;AAAA,MAElFrD,WAFkF,GAelFoD,KAfkF,CAElFpD,WAFkF;AAAA,MAGlFI,QAHkF,GAelFgD,KAfkF,CAGlFhD,QAHkF;AAAA,MAIlFkD,QAJkF,GAelFF,KAfkF,CAIlFE,QAJkF;AAAA,MAKlFC,SALkF,GAelFH,KAfkF,CAKlFG,SALkF;AAAA,MAMlFC,UANkF,GAelFJ,KAfkF,CAMlFI,UANkF;AAAA,MAOlFvD,OAPkF,GAelFmD,KAfkF,CAOlFnD,OAPkF;AAAA,MAQlFC,QARkF,GAelFkD,KAfkF,CAQlFlD,QARkF;AAAA,MASlFI,QATkF,GAelF8C,KAfkF,CASlF9C,QATkF;AAAA,MAUlFmD,sBAVkF,GAelFL,KAfkF,CAUlFK,sBAVkF;AAAA,MAWlFV,KAXkF,GAelFK,KAfkF,CAWlFL,KAXkF;AAAA,MAYlFxD,EAZkF,GAelF6D,KAfkF,CAYlF7D,EAZkF;AAAA,MAalFiB,QAbkF,GAelF4C,KAfkF,CAalF5C,QAbkF;AAAA,MAc/EkD,cAd+E,4BAelFN,KAfkF;;;AAiBtF,MAAM7C,UAAU,GAAGoD,KAAK,CAACC,QAAN,CAAeC,KAAf,CAAqBP,QAArB,CAAnB;;AAjBsF,8BAkClFQ,iBAAiB,CAAC3D,oBAAlB,CAAuC;AACvCH,IAAAA,WAAW,EAAXA,WADuC;AAEvCK,IAAAA,kBAAkB,EAAEyC,aAAa,CAAC9C,WAFK;AAGvCI,IAAAA,QAAQ,EAAEmB,OAAO,CAACnB,QAAD,CAHsB;AAIvCG,IAAAA,UAAU,EAAVA,UAJuC;AAKvCN,IAAAA,OAAO,EAAPA,OALuC;AAMvCV,IAAAA,EAAE,EAAFA,EANuC;AAOvCW,IAAAA,QAAQ,EAARA,QAPuC;AAQvCI,IAAAA,QAAQ,EAARA,QARuC;AASvCE,IAAAA,QAAQ,EAARA;AATuC,GAAvC,CAlCkF;AAAA,MAoBrEE,YApBqE,yBAoBlFV,WApBkF;AAAA,MAqBlFkC,WArBkF,yBAqBlFA,WArBkF;AAAA,MAsBlFS,YAtBkF,yBAsBlFA,YAtBkF;AAAA,MAuBlFnB,aAvBkF,yBAuBlFA,aAvBkF;AAAA,MAwBlFa,iBAxBkF,yBAwBlFA,iBAxBkF;AAAA,MAyBlFvB,WAzBkF,yBAyBlFA,WAzBkF;AAAA,MA0BlFkB,WA1BkF,yBA0BlFA,WA1BkF;AAAA,MA2BlFD,iBA3BkF,yBA2BlFA,iBA3BkF;AAAA,MA4BlFE,eA5BkF,yBA4BlFA,eA5BkF;AAAA,MA6BlFW,SA7BkF,yBA6BlFA,SA7BkF;AAAA,MA8BlFd,YA9BkF,yBA8BlFA,YA9BkF;AAAA,MA+BlFD,aA/BkF,yBA+BlFA,aA/BkF;AAAA,MAgClFS,cAhCkF,yBAgClFA,cAhCkF;AAAA,MAiClFC,gBAjCkF,yBAiClFA,gBAjCkF;;AA8CtFwB,EAAAA,cAAc,CAAC;AACXnD,IAAAA,OAAO,EAAEgC,SADE;AAEXoB,IAAAA,SAAS,EAAElC,YAFA;AAGXmC,IAAAA,UAAU,EAAEpC;AAHD,GAAD,CAAd;AAMA,SACI,oBAAC,MAAD;AACI,IAAA,WAAW,EAAEnB,YADjB;AAEI,IAAA,EAAE,EAAEwB,WAFR;AAGI,IAAA,SAAS,EAAEqB,SAHf;AAII,IAAA,KAAK,EAAER,KAJX;AAKI,IAAA,UAAU,EAAES,UALhB;AAMI,IAAA,OAAO,EAAEvD,OANb;AAOI,IAAA,aAAa,EAAEuB,aAPnB;AAQI,IAAA,QAAQ,EAAEpB,QARd;AASI,IAAA,QAAQ,EAAEiC,iBATd;AAUI,IAAA,cAAc,EAAEC,cAVpB;AAWI,IAAA,QAAQ,EAAEpC,QAXd;AAYI,IAAA,GAAG,EAAEgE,SAAS,CAACb,GAAD,EAAMV,YAAN,CAZlB;AAaI,IAAA,WAAW,EACPc,sBAAsB,IAAI3C,WAAW,GAAG,CAAxC,GACI;AAAK,MAAA,SAAS,YAAKqD,MAAM,CAACZ,SAAZ;AAAd,OACI,oBAAC,iBAAD,eACQE,sBADR;AAEI,MAAA,WAAW,EAAE/C,YAFjB;AAGI,MAAA,iBAAiB,EAAEqB,iBAHvB;AAII,MAAA,WAAW,EAAEC,WAJjB;AAKI,MAAA,eAAe,EAAEC,eALrB;AAMI,MAAA,WAAW,EAAEnB,WANjB;AAOI,MAAA,SAAS,EAAE8B,SAPf;AAQI,MAAA,KAAK,EAAEG,KARX;AASI,MAAA,aAAa,EAAEvB,aATnB;AAUI,MAAA,eAAe;AACX,yBAAiBa;AADN,SAERoB,sBAAsB,CAACW,eAFf,CAVnB;AAcI,MAAA,mBAAmB;AACf,yBAAiB/B;AADF,SAEZoB,sBAAsB,CAACY,mBAFX,CAdvB;AAkBI,MAAA,eAAe,EACXjE,QAAQ;AAEE,yBAAiBiC,iBAFnB;AAGEiC,QAAAA,OAAO,EAAE/B;AAHX,SAIKkB,sBAAsB,CAACc,eAJ5B,IAMFnF;AAzBd,OADJ,CADJ,GA+BIA;AA7CZ,KA+CQsE,cA/CR,GAiDKJ,QAjDL,CADJ;AAqDH,CAzGwE;AA2GzEJ,SAAS,CAACsB,WAAV,GAAwB,WAAxB;AACAtB,SAAS,CAACuB,YAAV,GAAyB3B,aAAzB;;ACvJA;;;;AAUA;;;AAGA,IAAM4B,cAAc,GAAG,eAAvB;AAEA;;;;AAGA,IAAMC,SAAS,GAAGC,gBAAgB,CAACF,cAAD,CAAlC;AAEA;;;;;;;;IAOaG,aAAuD,GAAG1B,UAAU,CAAC,UAACC,KAAD,EAAQC,GAAR,EAAgB;AAAA,MACtFE,SADsF,GAC3CH,KAD2C,CACtFG,SADsF;AAAA,MAC3ED,QAD2E,GAC3CF,KAD2C,CAC3EE,QAD2E;AAAA,MAC9DI,cAD8D,4BAC3CN,KAD2C;;AAG9F,SACI;AACI,IAAA,GAAG,EAAEC,GADT;AAEI,IAAA,SAAS,EAAEyB,UAAU,CACjBvB,SADiB,EAEjBwB,kBAAkB,CAAC;AACfC,MAAAA,MAAM,EAAEL;AADO,KAAD,CAFD,CAFzB;AAQI,4BAAqB,OARzB;AASI,IAAA,IAAI,EAAC;AATT,KAUQjB,cAVR,GAYKJ,QAZL,CADJ;AAgBH,CAnBgF;AAqBjFuB,aAAa,CAACL,WAAd,GAA4BE,cAA5B;AACAG,aAAa,CAACtB,SAAd,GAA0BoB,SAA1B;;ACpDA,IAAMM,aAAa,GAAG,SAAhBA,aAAgB;AAAA,SAAM,kBAAkBC,MAAxB;AAAA,CAAtB;AAEA;;;;;AAGO,SAASC,gBAAT,CAA0BvE,OAA1B,EAAwDwE,MAAxD,EAA6EC,UAA7E,EAA4G;AAC/GnG,EAAAA,SAAS,CAAC,YAAM;AACZ,QAAI,CAAC0B,OAAD,IAAY,CAACqE,aAAa,EAA9B,EAAkC,OAAO7F,SAAP;AAElC,WAAOkG,qBAAqB,CAAC1E,OAAD,EAAU,UAAC2E,KAAD,EAAW;AAC7C,UAAMzG,QAAQ,GAAGyG,KAAK,KAAK,OAAV,GAAoBF,UAApB,GAAiCD,MAAlD;AACAtG,MAAAA,QAAQ,SAAR,IAAAA,QAAQ,WAAR,YAAAA,QAAQ;AACX,KAH2B,CAA5B;AAIH,GAPQ,EAON,CAACuG,UAAD,EAAaD,MAAb,EAAqBxE,OAArB,CAPM,CAAT;AAQH;;ACfD;;;;AAGO,SAAS4E,cAAT,CAAwB5E,OAAxB,EAAsDwE,MAAtD,EAA2EC,UAA3E,EAA0G;AAC7GnG,EAAAA,SAAS,CAAC,YAAM;AACZ,QAAI,CAAC0B,OAAL,EAAc,OAAOxB,SAAP;;AACd,QAAMqG,aAAa,GAAG,SAAhBA,aAAgB,CAACC,GAAD,EAAwB;AAC1C,UAAI5G,QAAJ;;AACA,UAAI,CAAA4G,GAAG,SAAH,IAAAA,GAAG,WAAH,YAAAA,GAAG,CAAEC,GAAL,MAAa,YAAjB,EAA+B;AAC3B7G,QAAAA,QAAQ,GAAGsG,MAAX;AACH,OAFD,MAEO,IAAI,CAAAM,GAAG,SAAH,IAAAA,GAAG,WAAH,YAAAA,GAAG,CAAEC,GAAL,MAAa,WAAjB,EAA8B;AACjC7G,QAAAA,QAAQ,GAAGuG,UAAX;AACH;;AACD,UAAI,CAACvG,QAAL,EAAe;AAEfA,MAAAA,QAAQ;AACR4G,MAAAA,GAAG,CAACE,cAAJ;AACAF,MAAAA,GAAG,CAACG,eAAJ;AACH,KAZD;;AAcAjF,IAAAA,OAAO,CAACkF,gBAAR,CAAyB,SAAzB,EAAoCL,aAApC;AACA,WAAO,YAAM;AACT7E,MAAAA,OAAO,CAACmF,mBAAR,CAA4B,SAA5B,EAAuCN,aAAvC;AACH,KAFD;AAGH,GApBQ,EAoBN,CAACJ,UAAD,EAAaD,MAAb,EAAqBxE,OAArB,CApBM,CAAT;AAqBH;;ACtBD;;;AAGO,SAASoF,yBAAT,CAAmChG,WAAnC,EAAwDiG,UAAxD,EAAmF;AACtF,MAAMC,uBAAuB,GAAGjH,MAAM,EAAtC;AACA,SAAOkD,OAAO,CAAC,YAAM;AACjB,QAAMgE,SAAS,GAAGF,UAAU,GAAG,CAA/B;AADiB,QAEAG,oBAFA,GAEyBF,uBAFzB,CAET/G,OAFS;AAGjB,QAAIkH,eAAJ;;AACA,QAAIrG,WAAW,MAAKoG,oBAAL,aAAKA,oBAAL,uBAAKA,oBAAoB,CAAEE,GAA3B,CAAX,IAA6CtG,WAAW,GAAGmG,SAA/D,EAA0E;AACtEE,MAAAA,eAAe,GAAG;AAAEpF,QAAAA,GAAG,EAAEmF,oBAAoB,CAACnF,GAArB,GAA2B,CAAlC;AAAqCqF,QAAAA,GAAG,EAAEF,oBAAoB,CAACE,GAArB,GAA2B;AAArE,OAAlB;AACH,KAFD,MAEO,IAAItG,WAAW,MAAKoG,oBAAL,aAAKA,oBAAL,uBAAKA,oBAAoB,CAAEnF,GAA3B,CAAX,IAA6CjB,WAAW,GAAG,CAA/D,EAAkE;AACrEqG,MAAAA,eAAe,GAAG;AAAEpF,QAAAA,GAAG,EAAEmF,oBAAoB,CAACnF,GAArB,GAA2B,CAAlC;AAAqCqF,QAAAA,GAAG,EAAEF,oBAAoB,CAACE,GAArB,GAA2B;AAArE,OAAlB;AACH,KAFM,MAEA;AACH,UAAMC,UAAU,GAAG1G,oBAAoB,GAAG,CAA1C;AACA,UAAIoB,GAAG,GAAGjB,WAAW,GAAGJ,sBAAxB;AACA,UAAI0G,GAAG,GAAGtG,WAAW,GAAGJ,sBAAxB;;AAEA,UAAII,WAAW,GAAGmG,SAAS,GAAGvG,sBAA9B,EAAsD;AAClDqB,QAAAA,GAAG,GAAGkF,SAAS,GAAGI,UAAlB;AACAD,QAAAA,GAAG,GAAGH,SAAN;AACH,OAHD,MAGO,IAAInG,WAAW,GAAGuG,UAAlB,EAA8B;AACjCtF,QAAAA,GAAG,GAAG,CAAN;AACAqF,QAAAA,GAAG,GAAGC,UAAN;AACH;;AAEDF,MAAAA,eAAe,GAAG;AAAEpF,QAAAA,GAAG,EAAHA,GAAF;AAAOqF,QAAAA,GAAG,EAAHA;AAAP,OAAlB;AACH;;AACDJ,IAAAA,uBAAuB,CAAC/G,OAAxB,GAAkCkH,eAAlC;AACA,WAAOA,eAAP;AACH,GAzBa,EAyBX,CAACrG,WAAD,EAAciG,UAAd,CAzBW,CAAd;AA0BH;;ACpBD;;;;AAiCA;;;AAGA,IAAMvB,gBAAc,GAAG,mBAAvB;AAEA;;;;AAGA,IAAMC,WAAS,GAAGC,gBAAgB,CAACF,gBAAD,CAAlC;AAEA;;;;AAGA,IAAM5B,eAA8C,GAAG;AACnD9C,EAAAA,WAAW,EAAE,CADsC;AAEnD+C,EAAAA,KAAK,EAAEC,KAAK,CAACC;AAFsC,CAAvD;AAKA;;;;;;;;AAOA,IAAMuD,yBAAuE,GAAGrD,UAAU,CAAC,UAACC,KAAD,EAAQC,GAAR,EAAgB;AAAA,MAEnGrD,WAFmG,GAgBnGoD,KAhBmG,CAEnGpD,WAFmG;AAAA,MAGnGuD,SAHmG,GAgBnGH,KAhBmG,CAGnGG,SAHmG;AAAA,MAInGa,eAJmG,GAgBnGhB,KAhBmG,CAInGgB,eAJmG;AAAA,MAKnGpC,WALmG,GAgBnGoB,KAhBmG,CAKnGpB,WALmG;AAAA,MAMnGD,iBANmG,GAgBnGqB,KAhBmG,CAMnGrB,iBANmG;AAAA,MAOnGE,eAPmG,GAgBnGmB,KAhBmG,CAOnGnB,eAPmG;AAAA,MAQnGwE,SARmG,GAgBnGrD,KAhBmG,CAQnGqD,SARmG;AAAA,MASnGpC,mBATmG,GAgBnGjB,KAhBmG,CASnGiB,mBATmG;AAAA,MAUnGvD,WAVmG,GAgBnGsC,KAhBmG,CAUnGtC,WAVmG;AAAA,MAWnGiC,KAXmG,GAgBnGK,KAhBmG,CAWnGL,KAXmG;AAAA,6BAgBnGK,KAhBmG,CAYnG5B,aAZmG;AAAA,MAYnGA,aAZmG,qCAYnF,KAZmF;AAAA,MAanG+C,eAbmG,GAgBnGnB,KAhBmG,CAanGmB,eAbmG;AAAA,MAcnGmC,mBAdmG,GAgBnGtD,KAhBmG,CAcnGsD,mBAdmG;AAAA,MAehGhD,cAfgG,4BAgBnGN,KAhBmG;;AAkBvG,MAAIuD,MAAJ;;AACA,MAAIC,MAAJ,EAAY;AACR;AACAD,IAAAA,MAAM,GAAGF,SAAS,YAAYI,WAArB,GAAmCJ,SAAnC,GAA+CA,SAA/C,aAA+CA,SAA/C,uBAA+CA,SAAS,CAAEtH,OAAnE;AACH,GAtBsG;;;AAwBvGqG,EAAAA,cAAc,CAACmB,MAAD,EAAS3E,WAAT,EAAsBC,eAAtB,CAAd,CAxBuG;;AA0BvGkD,EAAAA,gBAAgB,CACZwB,MADY;AAGZxF,EAAAA,WAAW,CAAC;AAAA,WAAMa,WAAN,aAAMA,WAAN,uBAAMA,WAAW,CAAG,KAAH,CAAjB;AAAA,GAAD,EAA6B,CAACA,WAAD,CAA7B,CAHC;AAKZb,EAAAA,WAAW,CAAC;AAAA,WAAMc,eAAN,aAAMA,eAAN,uBAAMA,eAAe,CAAG,KAAH,CAArB;AAAA,GAAD,EAAiC,CAACA,eAAD,CAAjC,CALC,CAAhB,CA1BuG;;AAmCvG,MAAM6E,YAAY,GAAGd,yBAAyB,CAAChG,WAAD,EAAwBc,WAAxB,CAA9C,CAnCuG;;AAsCvG,MAAMiG,YAAY,GAAG;AAAEC,IAAAA,SAAS,wBAAiBlH,oBAAoB,GAAGgH,YAAY,CAAC7F,GAArD;AAAX,GAArB;AAEA,SACI;AACI,IAAA,GAAG,EAAEoC;AADT,KAEQK,cAFR;AAGI,IAAA,SAAS,EAAEoB,UAAU,CAACvB,SAAD,EAAYwB,kBAAkB,CAAC;AAAEC,MAAAA,MAAM,EAAEL,WAAV;AAAqB5B,MAAAA,KAAK,EAALA;AAArB,KAAD,CAA9B,gCACb4B,WADa,gCAC0B7D,WAAW,GAAGjB,oBADxC;AAHzB,MAOI,oBAAC,UAAD,eACQwE,mBADR;AAEI,IAAA,IAAI,EAAE4C,cAFV;AAGI,IAAA,SAAS,YAAKtC,WAAL,iBAHb;AAII,IAAA,KAAK,EAAE5B,KAAK,KAAKC,KAAK,CAACkE,IAAhB,GAAuB,OAAvB,GAAiC,MAJ5C;AAKI,IAAA,QAAQ,EAAEC,QAAQ,CAACC,GALvB;AAMI,IAAA,OAAO,EAAEnF;AANb,KAPJ,EAeI;AAAK,IAAA,SAAS,YAAK0C,WAAL;AAAd,KACI;AAAK,IAAA,SAAS,YAAKA,WAAL,uBAAd;AAAkD,IAAA,KAAK,EAAEoC;AAAzD,KACK5E,OAAO,CACJ;AAAA,WACIkF,KAAK,CAACvG,WAAD,CAAL,CAAmBwG,GAAnB,CAAuB,UAACjG,KAAD,EAAW;AAC9B,UAAMkG,QAAQ,GACVlG,KAAK,KAAK,CAAV,IACAA,KAAK,KAAKP,WAAW,GAAG,CADxB,KAECO,KAAK,KAAKyF,YAAY,CAAC7F,GAAvB,IAA8BI,KAAK,KAAKyF,YAAY,CAACR,GAFtD,CADJ;AAIA,UAAMkB,QAAQ,GAAGxH,WAAW,KAAKqB,KAAjC;AACA,UAAMoG,UAAU,GAAGpG,KAAK,GAAGyF,YAAY,CAAC7F,GAArB,IAA4BI,KAAK,GAAGyF,YAAY,CAACR,GAApE;AACA,aACI;AACI,QAAA,SAAS,EAAExB,UAAU,CACjBC,kBAAkB,CAAC;AACfC,UAAAA,MAAM,YAAKL,WAAL,sBADS;AAEf6C,UAAAA,QAAQ,EAARA,QAFe;AAGfD,UAAAA,QAAQ,EAARA,QAHe;AAIfE,UAAAA,UAAU,EAAVA;AAJe,SAAD,CADD,CADzB;AASI,QAAA,GAAG,EAAEpG,KATT;AAUI,QAAA,IAAI,EAAC,QAVT;AAWI,QAAA,OAAO,EAAE;AAAA,iBAAMU,iBAAN,aAAMA,iBAAN,uBAAMA,iBAAiB,CAAGV,KAAH,CAAvB;AAAA;AAXb,SAYQ;AACA,sBAAcqF,mBAAmB,GAC3BA,mBAAmB,CAACrF,KAAD,CADQ,aAExBA,KAAK,GAAG,CAFgB,gBAETP,WAFS;AADjC,OAZR,EADJ;AAoBH,KA3BD,CADJ;AAAA,GADI,EA8BJ,CACIA,WADJ,EAEIgG,YAAY,CAAC7F,GAFjB,EAGI6F,YAAY,CAACR,GAHjB,EAIItG,WAJJ,EAKI0G,mBALJ,EAMI3E,iBANJ,CA9BI,CADZ,CADJ,CAfJ,EA2DKwC,eAAe,GACZ,oBAAC,UAAD,eACQA,eADR;AAEI,IAAA,IAAI,EAAE/C,aAAa,GAAGkG,qBAAH,GAA2BC,oBAFlD;AAGI,IAAA,SAAS,YAAKhD,WAAL,WAHb;AAII,IAAA,KAAK,EAAE5B,KAAK,KAAKC,KAAK,CAACkE,IAAhB,GAAuB,OAAvB,GAAiC,MAJ5C;AAKI,IAAA,QAAQ,EAAEC,QAAQ,CAACC;AALvB,KADY,GAQZ,IAnER,EAqEI,oBAAC,UAAD,eACQhD,eADR;AAEI,IAAA,IAAI,EAAEwD,eAFV;AAGI,IAAA,SAAS,YAAKjD,WAAL,iBAHb;AAII,IAAA,KAAK,EAAE5B,KAAK,KAAKC,KAAK,CAACkE,IAAhB,GAAuB,OAAvB,GAAiC,MAJ5C;AAKI,IAAA,QAAQ,EAAEC,QAAQ,CAACC,GALvB;AAMI,IAAA,OAAO,EAAEpF;AANb,KArEJ,CADJ;AAgFH,CAxHyF,CAA1F;AA0HAwE,yBAAyB,CAAChC,WAA1B,GAAwCE,gBAAxC;AACA8B,yBAAyB,CAACjD,SAA1B,GAAsCoB,WAAtC;AACA6B,yBAAyB,CAAC/B,YAA1B,GAAyC3B,eAAzC;IAEagB,iBAAiB,GAAG+D,MAAM,CAACC,MAAP,CAActB,yBAAd,EAAyC;AACtErG,EAAAA,oBAAoB,EAApBA,oBADsE;AAEtE4H,EAAAA,kCAAkC,EAAEhI;AAFkC,CAAzC;;ACvKjC;;;AAGA,IAAM2E,gBAAc,GAAG,WAAvB;AAEA;;;;AAGA,IAAMC,WAAS,GAAGC,gBAAgB,CAACF,gBAAD,CAAlC;AAEA;;;;;;;;IAOaP,MAAyC,GAAGhB,UAAU,CAAC,UAACC,KAAD,EAAQC,GAAR,EAAgB;AAAA;;AAAA,MAE5ErD,WAF4E,GAc5EoD,KAd4E,CAE5EpD,WAF4E;AAAA,MAG5ET,EAH4E,GAc5E6D,KAd4E,CAG5E7D,EAH4E;AAAA,MAI5EgE,SAJ4E,GAc5EH,KAd4E,CAI5EG,SAJ4E;AAAA,MAK5ER,KAL4E,GAc5EK,KAd4E,CAK5EL,KAL4E;AAAA,MAM5ES,UAN4E,GAc5EJ,KAd4E,CAM5EI,UAN4E;AAAA,MAO5EvD,OAP4E,GAc5EmD,KAd4E,CAO5EnD,OAP4E;AAAA,MAQ5EuB,aAR4E,GAc5E4B,KAd4E,CAQ5E5B,aAR4E;AAAA,MAS5Ec,cAT4E,GAc5Ec,KAd4E,CAS5Ed,cAT4E;AAAA,MAU5E9B,QAV4E,GAc5E4C,KAd4E,CAU5E5C,QAV4E;AAAA,MAW5E8C,QAX4E,GAc5EF,KAd4E,CAW5EE,QAX4E;AAAA,MAY5E0E,WAZ4E,GAc5E5E,KAd4E,CAY5E4E,WAZ4E;AAAA,MAazEtE,cAbyE,4BAc5EN,KAd4E;;;AAgBhF,MAAM2D,YAA2B,GAAG;AAAEC,IAAAA,SAAS,wBAAiBrH,kBAAkB,GAAGK,WAAtC;AAAX,GAApC;AAEA,SACI;AACI,IAAA,EAAE,EAAET,EADR;AAEI,IAAA,GAAG,EAAE8D;AAFT,KAGQK,cAHR;AAII,IAAA,SAAS,EAAEoB,UAAU,CAACvB,SAAD,EAAYwB,kBAAkB,CAAC;AAAEC,MAAAA,MAAM,EAAEL,WAAV;AAAqB5B,MAAAA,KAAK,EAALA;AAArB,KAAD,CAA9B,4DACb4B,WADa,oBACcnB,UADd,0CAEbmB,WAFa,wBAEU1E,OAFV,GAEsBsB,OAAO,CAACtB,OAAD,CAF7B,gBAJzB;AAQI,4BAAqB;AARzB,MAUI;AACI,IAAA,EAAE,EAAEO,QADR;AAEI,IAAA,SAAS,YAAKmE,WAAL,aAFb;AAGI,IAAA,YAAY,EAAErC,cAHlB;AAII,IAAA,YAAY,EAAEA,cAJlB;AAKI,iBAAWd,aAAa,GAAG,KAAH,GAAW;AALvC,KAOI;AAAK,IAAA,SAAS,YAAKmD,WAAL,cAAd;AAAyC,IAAA,KAAK,EAAEoC;AAAhD,KACKzD,QADL,CAPJ,CAVJ,EAsBK0E,WAtBL,CADJ;AA0BH,CA5CkE;AA8CnE7D,MAAM,CAACK,WAAP,GAAqBE,gBAArB;AACAP,MAAM,CAACZ,SAAP,GAAmBoB,WAAnB;;;;"}
|
|
@@ -1,11 +1,11 @@
|
|
|
1
|
-
import { b as _objectWithoutProperties, c as _extends } from './
|
|
1
|
+
import { b as _objectWithoutProperties, c as _extends } from './_rollupPluginBabelHelpers.js';
|
|
2
2
|
import { Alignment, Theme } from './components.js';
|
|
3
3
|
import React, { forwardRef, useMemo, Children } from 'react';
|
|
4
|
-
import { g as getRootClassName, c as classnames, h as handleBasicClasses } from './
|
|
5
|
-
import { u as uid } from '
|
|
4
|
+
import { g as getRootClassName, c as classnames, h as handleBasicClasses } from './getRootClassName.js';
|
|
5
|
+
import { u as uid } from '../index2.js';
|
|
6
6
|
import isEmpty from 'lodash/isEmpty';
|
|
7
|
-
import { I as InputHelper } from './
|
|
8
|
-
import { I as InputLabel } from './
|
|
7
|
+
import { I as InputHelper } from './InputHelper.js';
|
|
8
|
+
import { I as InputLabel } from './InputLabel.js';
|
|
9
9
|
|
|
10
10
|
/**
|
|
11
11
|
* Defines the props of the component.
|
|
@@ -113,4 +113,4 @@ Switch.className = CLASSNAME;
|
|
|
113
113
|
Switch.defaultProps = DEFAULT_PROPS;
|
|
114
114
|
|
|
115
115
|
export { Switch as S };
|
|
116
|
-
//# sourceMappingURL=
|
|
116
|
+
//# sourceMappingURL=Switch2.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Switch2.js","sources":["../../../src/components/switch/Switch.tsx"],"sourcesContent":["import React, { Children, forwardRef, InputHTMLAttributes, SyntheticEvent, useMemo } from 'react';\n\nimport classNames from 'classnames';\nimport { uid } from 'uid';\n\nimport isEmpty from 'lodash/isEmpty';\n\nimport { Alignment, InputHelper, InputLabel, Theme } from '@lumx/react';\n\nimport { Comp, GenericProps, getRootClassName, handleBasicClasses } from '@lumx/react/utils';\n\n/**\n * Defines the props of the component.\n */\nexport interface SwitchProps extends GenericProps {\n /** Helper text. */\n helper?: string;\n /** Whether it is checked or not. */\n isChecked?: boolean;\n /** Whether the component is disabled or not. */\n isDisabled?: boolean;\n /** Native input name property. */\n name?: string;\n /** Position of the switch relative to the label. */\n position?: Extract<Alignment, 'right' | 'left'>;\n /** Theme adapting the component to light or dark background. */\n theme?: Theme;\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 = 'Switch';\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<SwitchProps> = {\n position: Alignment.left,\n theme: Theme.light,\n};\n\n/**\n * Switch component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const Switch: Comp<SwitchProps, HTMLDivElement> = forwardRef((props, ref) => {\n const {\n checked,\n children,\n className,\n disabled,\n helper,\n id,\n isChecked = checked,\n isDisabled = disabled,\n name,\n onChange,\n position,\n theme,\n value,\n inputProps = {},\n ...forwardedProps\n } = props;\n const switchId = useMemo(() => id || `switch-${uid()}`, [id]);\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 prefix: CLASSNAME,\n isChecked,\n isDisabled,\n position,\n theme,\n isUnchecked: !isChecked,\n }),\n )}\n aria-disabled={isDisabled}\n >\n <div className={`${CLASSNAME}__input-wrapper`}>\n <input\n type=\"checkbox\"\n role=\"switch\"\n id={switchId}\n className={`${CLASSNAME}__input-native`}\n name={name}\n value={value}\n disabled={isDisabled}\n checked={isChecked}\n aria-checked={Boolean(isChecked)}\n onChange={handleChange}\n {...inputProps}\n />\n\n <div className={`${CLASSNAME}__input-placeholder`}>\n <div className={`${CLASSNAME}__input-background`} />\n <div className={`${CLASSNAME}__input-indicator`} />\n </div>\n </div>\n\n {Children.count(children) > 0 && (\n <div className={`${CLASSNAME}__content`}>\n <InputLabel htmlFor={switchId} theme={theme} className={`${CLASSNAME}__label`}>\n {children}\n </InputLabel>\n {!isEmpty(helper) && (\n <InputHelper theme={theme} className={`${CLASSNAME}__helper`}>\n {helper}\n </InputHelper>\n )}\n </div>\n )}\n </div>\n );\n});\nSwitch.displayName = COMPONENT_NAME;\nSwitch.className = CLASSNAME;\nSwitch.defaultProps = DEFAULT_PROPS;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","position","Alignment","left","theme","Theme","light","Switch","forwardRef","props","ref","checked","children","className","disabled","helper","id","isChecked","isDisabled","name","onChange","value","inputProps","forwardedProps","switchId","useMemo","uid","handleChange","event","classNames","handleBasicClasses","prefix","isUnchecked","Boolean","Children","count","isEmpty","displayName","defaultProps"],"mappings":"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"}
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import { b as _objectWithoutProperties, d as _slicedToArray, e as _toConsumableArray, c as _extends } from './
|
|
1
|
+
import { b as _objectWithoutProperties, d as _slicedToArray, e as _toConsumableArray, c as _extends } from './_rollupPluginBabelHelpers.js';
|
|
2
2
|
import { Alignment, Theme, Size } from './components.js';
|
|
3
3
|
import React, { useReducer, useEffect, forwardRef, useCallback } from 'react';
|
|
4
|
-
import { c as classnames, h as handleBasicClasses, C as CSS_PREFIX } from './
|
|
5
|
-
import { I as Icon } from './
|
|
6
|
-
import { m as mergeRefs } from './
|
|
7
|
-
import { r as reducer, I as INIT_STATE, T as TabProviderContext, u as useRovingTabIndex, b as useTabProviderContext } from './
|
|
4
|
+
import { c as classnames, h as handleBasicClasses, C as CSS_PREFIX } from './getRootClassName.js';
|
|
5
|
+
import { I as Icon } from './Icon2.js';
|
|
6
|
+
import { m as mergeRefs } from './mergeRefs.js';
|
|
7
|
+
import { r as reducer, I as INIT_STATE, T as TabProviderContext, u as useRovingTabIndex, b as useTabProviderContext } from './useRovingTabIndex.js';
|
|
8
8
|
|
|
9
9
|
var DEFAULT_PROPS = {
|
|
10
10
|
isLazy: INIT_STATE.isLazy,
|
|
@@ -276,4 +276,4 @@ TabPanel.className = CLASSNAME$2;
|
|
|
276
276
|
TabPanel.defaultProps = DEFAULT_PROPS$3;
|
|
277
277
|
|
|
278
278
|
export { TabProvider as T, TabListLayout as a, TabList as b, Tab as c, TabPanel as d };
|
|
279
|
-
//# sourceMappingURL=
|
|
279
|
+
//# sourceMappingURL=TabPanel.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TabPanel.js","sources":["../../../src/components/tabs/TabProvider.tsx","../../../src/components/tabs/TabList.tsx","../../../src/components/tabs/Tab.tsx","../../../src/components/tabs/TabPanel.tsx"],"sourcesContent":["import React, { ReactNode, useEffect, useReducer } from 'react';\nimport { INIT_STATE, TabProviderContext, reducer } from './state';\n\nexport interface TabProviderProps {\n /** Active tab index. */\n activeTabIndex?: number;\n /** Tab provider children. */\n children: ReactNode;\n /** Tab panel children should not render if the tab panel is hidden. */\n isLazy?: boolean;\n /** Activate tabs on focus. */\n shouldActivateOnFocus?: boolean;\n\n /** Tab change callback. */\n onChange?(index: number): void;\n}\n\nconst DEFAULT_PROPS: Partial<TabProviderProps> = {\n isLazy: INIT_STATE.isLazy,\n shouldActivateOnFocus: INIT_STATE.shouldActivateOnFocus,\n};\n\n/**\n * This component provides a context in which tabs can be defined and linked to their tab panel.\n *\n * It does not produce any markup so you can wrap it around any React elements and then split the TabList and TabPanel\n * components in the react tree.\n *\n * @param props React component props.\n * @return React element.\n */\nexport const TabProvider: React.FC<TabProviderProps> = (props) => {\n const { children, onChange, ...propState } = props;\n const [state, dispatch] = useReducer(reducer, INIT_STATE);\n\n // On prop state change => dispatch update.\n useEffect(\n () => {\n dispatch({ type: 'update', payload: propState });\n },\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [dispatch, ...Object.values(propState)],\n );\n\n // On active tab index state change => send update to the onChange.\n useEffect(\n () => {\n if (state === INIT_STATE || !onChange || propState.activeTabIndex === state.activeTabIndex) {\n return;\n }\n onChange(state.activeTabIndex);\n },\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [onChange, state.activeTabIndex],\n );\n\n return <TabProviderContext.Provider value={[state, dispatch]}>{children}</TabProviderContext.Provider>;\n};\nTabProvider.defaultProps = DEFAULT_PROPS;\n","import { Alignment, Theme } from '@lumx/react';\nimport { CSS_PREFIX } from '@lumx/react/constants';\nimport { Comp, GenericProps, handleBasicClasses } from '@lumx/react/utils';\nimport { mergeRefs } from '@lumx/react/utils/mergeRefs';\n\nimport classNames from 'classnames';\nimport React, { forwardRef, ReactNode } from 'react';\nimport { useRovingTabIndex } from '../../hooks/useRovingTabIndex';\n\nexport enum TabListLayout {\n clustered = 'clustered',\n fixed = 'fixed',\n}\n\n/**\n * Defines the props of the component.\n */\nexport interface TabListProps extends GenericProps {\n /** ARIA label (purpose of the set of tabs). */\n ['aria-label']: string;\n /** Tab list. */\n children: ReactNode;\n /** Layout of the tabs in the list. */\n layout?: TabListLayout;\n /** Position of the tabs in the list (requires 'clustered' layout). */\n position?: Alignment;\n /** Theme adapting the component to light or dark background. */\n theme?: Theme;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'TabList';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = `${CSS_PREFIX}-tabs`;\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<TabListProps> = {\n layout: TabListLayout.fixed,\n position: Alignment.left,\n theme: Theme.light,\n};\n\n/**\n * TabList component.\n *\n * Implements WAI-ARIA `tablist` role {@see https://www.w3.org/TR/wai-aria-practices-1.1/examples/tabs/tabs-1/tabs.html#rps_label}\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const TabList: Comp<TabListProps, HTMLDivElement> = forwardRef((props, ref) => {\n const { 'aria-label': ariaLabel, children, className, layout, position, theme, ...forwardedProps } = props;\n const tabListRef = React.useRef(null);\n useRovingTabIndex({\n parentRef: tabListRef,\n elementSelector: '[role=\"tab\"]',\n keepTabIndex: false,\n extraDependencies: [children],\n });\n\n return (\n <div\n ref={mergeRefs(ref, tabListRef)}\n {...forwardedProps}\n className={classNames(className, handleBasicClasses({ prefix: CLASSNAME, layout, position, theme }))}\n >\n <div className={`${CLASSNAME}__links`} role=\"tablist\" aria-label={ariaLabel}>\n {children}\n </div>\n </div>\n );\n});\nTabList.displayName = COMPONENT_NAME;\nTabList.className = CLASSNAME;\nTabList.defaultProps = DEFAULT_PROPS;\n","import { Icon, IconProps, Size } from '@lumx/react';\nimport { CSS_PREFIX } from '@lumx/react/constants';\nimport { Comp, GenericProps, handleBasicClasses } from '@lumx/react/utils';\n\nimport classNames from 'classnames';\nimport React, { FocusEventHandler, forwardRef, KeyboardEventHandler, ReactNode, useCallback } from 'react';\nimport { useTabProviderContext } from './state';\n\n/**\n * Defines the props of the component.\n */\nexport interface TabProps extends GenericProps {\n /** Children are not supported. */\n children?: never;\n /** Icon (SVG path). */\n icon?: IconProps['icon'];\n /** Native id property. */\n id?: string;\n /** Whether the tab is active or not. */\n isActive?: boolean;\n /** Whether the component is disabled or not. */\n isDisabled?: boolean;\n /** Label content. */\n label: string | ReactNode;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'Tab';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = `${CSS_PREFIX}-tabs__link`;\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<TabProps> = {};\n\n/**\n * Tab component.\n *\n * Implements WAI-ARIA `tab` role {@see https://www.w3.org/TR/wai-aria-practices-1.1/examples/tabs/tabs-1/tabs.html#rps_label}\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const Tab: Comp<TabProps, HTMLButtonElement> = forwardRef((props, ref) => {\n const {\n className,\n disabled,\n icon,\n id,\n isActive: propIsActive,\n isDisabled = disabled,\n label,\n onFocus,\n onKeyPress,\n tabIndex = -1,\n ...forwardedProps\n } = props;\n const state = useTabProviderContext('tab', id);\n const isActive = propIsActive || state?.isActive;\n\n const changeToCurrentTab = useCallback(() => {\n if (isDisabled) {\n return;\n }\n state?.changeToTab();\n }, [isDisabled, state]);\n\n const handleFocus: FocusEventHandler = useCallback(\n (event) => {\n onFocus?.(event);\n if (state?.shouldActivateOnFocus) {\n changeToCurrentTab();\n }\n },\n [changeToCurrentTab, onFocus, state?.shouldActivateOnFocus],\n );\n\n const handleKeyPress: KeyboardEventHandler = useCallback(\n (event) => {\n onKeyPress?.(event);\n if (event.key !== 'Enter') {\n return;\n }\n changeToCurrentTab();\n },\n [changeToCurrentTab, onKeyPress],\n );\n\n return (\n <button\n ref={ref}\n {...forwardedProps}\n type=\"button\"\n id={state?.tabId}\n className={classNames(className, handleBasicClasses({ prefix: CLASSNAME, isActive, isDisabled }))}\n onClick={changeToCurrentTab}\n onKeyPress={handleKeyPress}\n onFocus={handleFocus}\n role=\"tab\"\n tabIndex={isActive ? 0 : tabIndex}\n aria-disabled={isDisabled}\n aria-selected={isActive}\n aria-controls={state?.tabPanelId}\n >\n {icon && <Icon icon={icon} size={Size.xs} />}\n {label && <span>{label}</span>}\n </button>\n );\n});\nTab.displayName = COMPONENT_NAME;\nTab.className = CLASSNAME;\nTab.defaultProps = DEFAULT_PROPS;\n","import { useTabProviderContext } from '@lumx/react/components/tabs/state';\nimport { CSS_PREFIX } from '@lumx/react/constants';\nimport { Comp, GenericProps, handleBasicClasses } from '@lumx/react/utils';\n\nimport classNames from 'classnames';\nimport React, { forwardRef } from 'react';\n\n/**\n * Defines the props of the component.\n */\nexport interface TabPanelProps extends GenericProps {\n /** Native id property */\n id?: string;\n /** Whether the tab is active or not. */\n isActive?: boolean;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'TabPanel';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = `${CSS_PREFIX}-tab-panel`;\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<TabPanelProps> = {};\n\n/**\n * TabPanel component.\n *\n * Implements WAI-ARIA `tabpanel` role {@see https://www.w3.org/TR/wai-aria-practices-1.1/examples/tabs/tabs-1/tabs.html#rps_label}\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const TabPanel: Comp<TabPanelProps, HTMLDivElement> = forwardRef((props, ref) => {\n const { children, id, className, isActive: propIsActive, ...forwardedProps } = props;\n\n const state = useTabProviderContext('tabPanel', id);\n const isActive = propIsActive || state?.isActive;\n\n return (\n <div\n ref={ref}\n {...forwardedProps}\n id={state?.tabPanelId}\n className={classNames(className, handleBasicClasses({ prefix: CLASSNAME, isActive }))}\n role=\"tabpanel\"\n tabIndex={0}\n aria-labelledby={state?.tabId}\n >\n {(!state?.isLazy || isActive) && children}\n </div>\n );\n});\nTabPanel.displayName = COMPONENT_NAME;\nTabPanel.className = CLASSNAME;\nTabPanel.defaultProps = DEFAULT_PROPS;\n"],"names":["DEFAULT_PROPS","isLazy","INIT_STATE","shouldActivateOnFocus","TabProvider","props","children","onChange","propState","useReducer","reducer","state","dispatch","useEffect","type","payload","Object","values","activeTabIndex","defaultProps","TabListLayout","COMPONENT_NAME","CLASSNAME","CSS_PREFIX","layout","fixed","position","Alignment","left","theme","Theme","light","TabList","forwardRef","ref","ariaLabel","className","forwardedProps","tabListRef","React","useRef","useRovingTabIndex","parentRef","elementSelector","keepTabIndex","extraDependencies","mergeRefs","classNames","handleBasicClasses","prefix","displayName","Tab","disabled","icon","id","propIsActive","isActive","isDisabled","label","onFocus","onKeyPress","tabIndex","useTabProviderContext","changeToCurrentTab","useCallback","changeToTab","handleFocus","event","handleKeyPress","key","tabId","tabPanelId","Size","xs","TabPanel"],"mappings":"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"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import { b as _objectWithoutProperties, c as _extends, a as _defineProperty } from './
|
|
1
|
+
import { b as _objectWithoutProperties, c as _extends, a as _defineProperty } from './_rollupPluginBabelHelpers.js';
|
|
2
2
|
import { Theme, Size } from './components.js';
|
|
3
3
|
import React, { forwardRef, useCallback } from 'react';
|
|
4
|
-
import { g as getRootClassName, c as classnames, h as handleBasicClasses, o as onEnterPressed } from './
|
|
5
|
-
import { I as Icon, r as mdiArrowUp, s as mdiArrowDown } from './
|
|
4
|
+
import { g as getRootClassName, c as classnames, h as handleBasicClasses, o as onEnterPressed } from './getRootClassName.js';
|
|
5
|
+
import { I as Icon, r as mdiArrowUp, s as mdiArrowDown } from './Icon2.js';
|
|
6
6
|
import isFunction from 'lodash/isFunction';
|
|
7
7
|
|
|
8
8
|
/**
|
|
@@ -288,4 +288,4 @@ TableRow.className = CLASSNAME$4;
|
|
|
288
288
|
TableRow.defaultProps = DEFAULT_PROPS$3;
|
|
289
289
|
|
|
290
290
|
export { Table as T, TableBody as a, ThOrder as b, TableCellVariant as c, TableCell as d, TableHeader as e, TableRow as f };
|
|
291
|
-
//# sourceMappingURL=
|
|
291
|
+
//# sourceMappingURL=TableRow.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TableRow.js","sources":["../../../src/components/table/Table.tsx","../../../src/components/table/TableBody.tsx","../../../src/components/table/TableCell.tsx","../../../src/components/table/TableHeader.tsx","../../../src/components/table/TableRow.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\n\nimport classNames from 'classnames';\n\nimport { Theme } from '@lumx/react';\n\nimport { Comp, GenericProps, getRootClassName, handleBasicClasses } from '@lumx/react/utils';\n\n/**\n * Defines the props of the component.\n */\nexport interface TableProps extends GenericProps {\n /** Whether the table has checkbox or thumbnail on first cell or not. */\n hasBefore?: boolean;\n /** Whether the table has dividers or not. */\n hasDividers?: boolean;\n /** Theme adapting the component to light or dark background. */\n theme?: Theme;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'Table';\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<TableProps> = {\n theme: Theme.light,\n};\n\n/**\n * Table component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const Table: Comp<TableProps, HTMLTableElement> = forwardRef((props, ref) => {\n const { children, className, hasBefore, hasDividers, theme, ...forwardedProps } = props;\n\n return (\n <table\n ref={ref}\n {...forwardedProps}\n className={classNames(className, handleBasicClasses({ prefix: CLASSNAME, hasBefore, hasDividers, theme }))}\n >\n {children}\n </table>\n );\n});\nTable.displayName = COMPONENT_NAME;\nTable.className = CLASSNAME;\nTable.defaultProps = DEFAULT_PROPS;\n","import React, { forwardRef } from 'react';\n\nimport classNames from 'classnames';\n\nimport { Comp, GenericProps, getRootClassName, handleBasicClasses } from '@lumx/react/utils';\n\n/**\n * Defines the props of the component.\n */\nexport type TableBodyProps = GenericProps;\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'TableBody';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME, true);\n\n/**\n * TableBody component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const TableBody: Comp<TableBodyProps, HTMLTableSectionElement> = forwardRef((props, ref) => {\n const { children, className, ...forwardedProps } = props;\n\n return (\n <tbody\n ref={ref}\n {...forwardedProps}\n className={classNames(className, handleBasicClasses({ prefix: CLASSNAME }))}\n >\n {children}\n </tbody>\n );\n});\nTableBody.displayName = COMPONENT_NAME;\nTableBody.className = CLASSNAME;\n","import React, { forwardRef, useCallback } from 'react';\n\nimport classNames from 'classnames';\n\nimport { Icon, Size } from '@lumx/react';\nimport { Comp, GenericProps, getRootClassName, handleBasicClasses, onEnterPressed, ValueOf } from '@lumx/react/utils';\n\nimport { mdiArrowDown, mdiArrowUp } from '@lumx/icons';\n\nimport isFunction from 'lodash/isFunction';\n\n/**\n * Table head cell sort order.\n */\nexport const ThOrder = { asc: 'asc', desc: 'desc' } as const;\nexport type ThOrder = ValueOf<typeof ThOrder>;\n\n/**\n * Table cell variants.\n */\nexport const TableCellVariant = { body: 'body', head: 'head' } as const;\nexport type TableCellVariant = ValueOf<typeof TableCellVariant>;\n\n/**\n * Defines the props of the component.\n */\nexport interface TableCellProps extends GenericProps {\n /** Icon (SVG path).(thead only). */\n icon?: string;\n /** Whether the column is sortable or not (thead only). */\n isSortable?: boolean;\n /** Sort order displayed as icon (sortable thead only). */\n sortOrder?: ThOrder;\n /** Variant. */\n variant?: TableCellVariant;\n /** On header cell click callback. */\n onHeaderClick?(): void;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'TableCell';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME, true);\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<TableCellProps> = {\n variant: TableCellVariant.body,\n};\n\n/**\n * TableCell component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const TableCell: Comp<TableCellProps, HTMLTableCellElement> = forwardRef((props, ref) => {\n const { children, className, icon, isSortable, onHeaderClick, sortOrder, variant, ...forwardedProps } = props;\n\n /**\n * Handle click on the ordered thead.\n */\n const handleOnHeaderClick = useCallback(() => {\n if (isFunction(onHeaderClick)) {\n onHeaderClick();\n }\n }, [onHeaderClick]);\n\n return (\n <>\n {variant === TableCellVariant.head && (\n <th\n ref={ref}\n {...forwardedProps}\n className={classNames(\n handleBasicClasses({ prefix: CLASSNAME, isSortable }),\n className,\n `${CLASSNAME}--head`,\n {\n [`${CLASSNAME}--is-sorted`]: isSortable && sortOrder,\n },\n )}\n tabIndex={isSortable && isFunction(onHeaderClick) ? 0 : -1}\n onClick={handleOnHeaderClick}\n onKeyDown={onEnterPressed(handleOnHeaderClick)}\n >\n <div className={`${CLASSNAME}-wrapper`}>\n {icon && !isSortable && <Icon className={`${CLASSNAME}-icon`} icon={icon} size={Size.xxs} />}\n\n {isSortable && sortOrder === ThOrder.asc && (\n <Icon className={`${CLASSNAME}-icon`} icon={mdiArrowUp} size={Size.xxs} />\n )}\n\n {isSortable && sortOrder === ThOrder.desc && (\n <Icon className={`${CLASSNAME}-icon`} icon={mdiArrowDown} size={Size.xxs} />\n )}\n\n <div className={`${CLASSNAME}-content`}>{children}</div>\n </div>\n </th>\n )}\n\n {variant === TableCellVariant.body && (\n <td\n {...forwardedProps}\n className={classNames(className, handleBasicClasses({ prefix: CLASSNAME }), `${CLASSNAME}--body`)}\n >\n <div className={`${CLASSNAME}-content`}>{children}</div>\n </td>\n )}\n </>\n );\n});\nTableCell.displayName = COMPONENT_NAME;\nTableCell.className = CLASSNAME;\nTableCell.defaultProps = DEFAULT_PROPS;\n","import React, { forwardRef } from 'react';\n\nimport classNames from 'classnames';\n\nimport { Comp, GenericProps, getRootClassName, handleBasicClasses } from '@lumx/react/utils';\n\n/**\n * Defines the props of the component.\n */\nexport type TableHeaderProps = GenericProps;\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'TableHeader';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME, true);\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<TableHeaderProps> = {};\n\n/**\n * TableHeader component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const TableHeader: Comp<TableHeaderProps, HTMLTableSectionElement> = forwardRef((props, ref) => {\n const { children, className, ...forwardedProps } = props;\n\n return (\n <thead\n ref={ref}\n {...forwardedProps}\n className={classNames(className, handleBasicClasses({ prefix: CLASSNAME }))}\n >\n {children}\n </thead>\n );\n});\nTableHeader.displayName = COMPONENT_NAME;\nTableHeader.className = CLASSNAME;\nTableHeader.defaultProps = DEFAULT_PROPS;\n","import React, { forwardRef } from 'react';\n\nimport classNames from 'classnames';\n\nimport { Comp, GenericProps, getRootClassName, handleBasicClasses } from '@lumx/react/utils';\n\n/**\n * Defines the props of the component.\n */\nexport interface TableRowProps extends GenericProps {\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 component is selected or not. */\n isSelected?: boolean;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'TableRow';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME, true);\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<TableRowProps> = {};\n\n/**\n * TableRow component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const TableRow: Comp<TableRowProps, HTMLTableRowElement> = forwardRef((props, ref) => {\n const { children, className, disabled, isClickable, isDisabled = disabled, isSelected, ...forwardedProps } = props;\n\n return (\n <tr\n ref={ref}\n tabIndex={isClickable && !isDisabled ? 0 : -1}\n {...forwardedProps}\n className={classNames(\n className,\n handleBasicClasses({\n isClickable: isClickable && !isDisabled,\n isDisabled,\n isSelected: isSelected && !isDisabled,\n prefix: CLASSNAME,\n }),\n )}\n aria-disabled={isDisabled}\n >\n {children}\n </tr>\n );\n});\n\nTableRow.displayName = COMPONENT_NAME;\nTableRow.className = CLASSNAME;\nTableRow.defaultProps = DEFAULT_PROPS;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","theme","Theme","light","Table","forwardRef","props","ref","children","className","hasBefore","hasDividers","forwardedProps","classNames","handleBasicClasses","prefix","displayName","defaultProps","TableBody","ThOrder","asc","desc","TableCellVariant","body","head","variant","TableCell","icon","isSortable","onHeaderClick","sortOrder","handleOnHeaderClick","useCallback","isFunction","onEnterPressed","Size","xxs","mdiArrowUp","mdiArrowDown","TableHeader","TableRow","disabled","isClickable","isDisabled","isSelected"],"mappings":"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"}
|
|
@@ -1,14 +1,14 @@
|
|
|
1
|
-
import { b as _objectWithoutProperties, d as _slicedToArray, _ as _objectSpread2, c as _extends } from './
|
|
1
|
+
import { b as _objectWithoutProperties, d as _slicedToArray, _ as _objectSpread2, c as _extends } from './_rollupPluginBabelHelpers.js';
|
|
2
2
|
import { Size, Theme, Emphasis, Kind } from './components.js';
|
|
3
3
|
import React, { forwardRef, useMemo, useState, useRef, useEffect } from 'react';
|
|
4
|
-
import { g as getRootClassName, c as classnames, h as handleBasicClasses } from './
|
|
5
|
-
import { I as Icon, c as mdiAlertCircle, b as mdiCheckCircle, n as mdiCloseCircle } from './
|
|
6
|
-
import { u as uid } from '
|
|
4
|
+
import { g as getRootClassName, c as classnames, h as handleBasicClasses } from './getRootClassName.js';
|
|
5
|
+
import { I as Icon, c as mdiAlertCircle, b as mdiCheckCircle, n as mdiCloseCircle } from './Icon2.js';
|
|
6
|
+
import { u as uid } from '../index2.js';
|
|
7
7
|
import get from 'lodash/get';
|
|
8
|
-
import { m as mergeRefs } from './
|
|
9
|
-
import { I as IconButton } from './
|
|
10
|
-
import { I as InputHelper } from './
|
|
11
|
-
import { I as InputLabel } from './
|
|
8
|
+
import { m as mergeRefs } from './mergeRefs.js';
|
|
9
|
+
import { I as IconButton } from './IconButton.js';
|
|
10
|
+
import { I as InputHelper } from './InputHelper.js';
|
|
11
|
+
import { I as InputLabel } from './InputLabel.js';
|
|
12
12
|
|
|
13
13
|
/**
|
|
14
14
|
* Defines the props of the component.
|
|
@@ -319,4 +319,4 @@ TextField.className = CLASSNAME;
|
|
|
319
319
|
TextField.defaultProps = DEFAULT_PROPS;
|
|
320
320
|
|
|
321
321
|
export { TextField as T };
|
|
322
|
-
//# sourceMappingURL=
|
|
322
|
+
//# sourceMappingURL=TextField.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TextField.js","sources":["../../../src/components/text-field/TextField.tsx"],"sourcesContent":["import React, { forwardRef, ReactNode, RefObject, SyntheticEvent, useEffect, useMemo, useRef, useState } from 'react';\n\nimport classNames from 'classnames';\nimport get from 'lodash/get';\nimport { uid } from 'uid';\n\nimport { mdiAlertCircle, mdiCheckCircle, mdiCloseCircle } from '@lumx/icons';\nimport { Emphasis, Icon, IconButton, IconButtonProps, InputHelper, InputLabel, Kind, Size, Theme } from '@lumx/react';\nimport { Comp, GenericProps, getRootClassName, handleBasicClasses } from '@lumx/react/utils';\nimport { mergeRefs } from '@lumx/react/utils/mergeRefs';\n\n/**\n * Defines the props of the component.\n */\nexport interface TextFieldProps extends GenericProps {\n /** Chip Group to be rendered before the main text input. */\n chips?: HTMLElement | ReactNode;\n /** Props to pass to the clear button (minus those already set by the TextField props). If not specified, the button won't be displayed. */\n clearButtonProps?: Pick<IconButtonProps, 'label'> &\n Omit<IconButtonProps, 'label' | 'onClick' | 'icon' | 'emphasis'>;\n /** Error message. */\n error?: string | ReactNode;\n /** Whether we force the focus style or not. */\n forceFocusStyle?: boolean;\n /** Whether the text field is displayed with error style or not. */\n hasError?: boolean;\n /** Additional element to put at the end of the text field. */\n afterElement?: ReactNode;\n /** Helper text. */\n helper?: string | ReactNode;\n /** Icon (SVG path). */\n icon?: string;\n /** Native input id property (generated if not provided to link the label element). */\n id?: string;\n /** Reference to the <input> or <textarea> element. */\n inputRef?: RefObject<HTMLInputElement> | RefObject<HTMLTextAreaElement>;\n /** Whether the component is disabled or not. */\n isDisabled?: boolean;\n /** Whether the component is required or not. */\n isRequired?: boolean;\n /** Whether the text field is displayed with valid style or not. */\n isValid?: boolean;\n /** Label text. */\n label?: string;\n /** Max string length the input accepts (constrains the input and displays a character counter). */\n maxLength?: number;\n /** Minimum number of rows displayed in multiline mode (requires `multiline` to be enabled). */\n minimumRows?: number;\n /** Whether the text field is a textarea or an input. */\n multiline?: boolean;\n /** Native input name property. */\n name?: string;\n /** Placeholder text. */\n placeholder?: string;\n /** Reference to the wrapper. */\n textFieldRef?: RefObject<HTMLDivElement>;\n /** Theme adapting the component to light or dark background. */\n theme?: Theme;\n /** Value. */\n value?: string;\n /** On blur callback. */\n onBlur?(event: React.FocusEvent): void;\n /** On change callback. */\n onChange(value: string, name?: string, event?: SyntheticEvent): void;\n /** On focus callback. */\n onFocus?(event: React.FocusEvent): void;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'TextField';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * Default minimum number of rows in the multiline mode.\n */\nconst DEFAULT_MIN_ROWS = 2;\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<TextFieldProps> = {\n theme: Theme.light,\n type: 'text',\n};\n\n/**\n * Hook that allows to calculate the number of rows needed for a text area.\n * @param minimumRows Minimum number of rows that we want to display.\n * @return rows to be used and a callback to recalculate\n */\nconst useComputeNumberOfRows = (\n minimumRows: number,\n): {\n /** number of rows to be used on the text area */\n rows: number;\n /**\n * Callback in order to recalculate the number of rows due to a change on the text area\n */\n recomputeNumberOfRows(target: Element): void;\n} => {\n const [rows, setRows] = useState(minimumRows);\n\n const recompute = (target: Element) => {\n /**\n * HEAD's UP! This part is a little bit tricky. The idea here is to only\n * display the necessary rows on the textarea. In order to dynamically adjust\n * the height on that field, we need to:\n * 1. Set the current amount of rows to the minimum. That will make the scroll appear.\n * 2. With that, we will have the `scrollHeight`, meaning the height of the container adjusted to the current content\n * 3. With the scroll height, we can figure out how many rows we need to use by dividing the scroll height\n * by the line height.\n * 4. With that number, we can readjust the number of rows on the text area. We need to do that here, if we leave that to\n * the state change through React, there are some scenarios (resize, hitting ENTER or BACKSPACE which add or remove lines)\n * when we will not see the update and the rows will be resized to the minimum.\n * 5. In case there is any other update on the component that changes the UI, we need to keep the number of rows\n * on the state in order to allow React to re-render. Therefore, we save them using `useState`\n */\n // eslint-disable-next-line no-param-reassign\n (target as HTMLTextAreaElement).rows = minimumRows;\n let currentRows = target.scrollHeight / (target.clientHeight / minimumRows);\n currentRows = currentRows >= minimumRows ? currentRows : minimumRows;\n // eslint-disable-next-line no-param-reassign\n (target as HTMLTextAreaElement).rows = currentRows;\n\n setRows(currentRows);\n };\n\n return {\n recomputeNumberOfRows: recompute,\n rows,\n };\n};\n\ninterface InputNativeProps {\n id?: string;\n inputRef?: RefObject<HTMLInputElement> | RefObject<HTMLTextAreaElement>;\n isDisabled?: boolean;\n isRequired?: boolean;\n multiline?: boolean;\n maxLength?: number;\n placeholder?: string;\n rows: number;\n type: string;\n name?: string;\n value?: string;\n setFocus(focus: boolean): void;\n recomputeNumberOfRows(target: Element): void;\n onChange(value: string, name?: string, event?: SyntheticEvent): void;\n onFocus?(value: React.FocusEvent): void;\n onBlur?(value: React.FocusEvent): void;\n}\n\nconst renderInputNative: React.FC<InputNativeProps> = (props) => {\n const {\n id,\n isDisabled,\n isRequired,\n placeholder,\n multiline,\n value,\n setFocus,\n onChange,\n onFocus,\n onBlur,\n inputRef,\n rows,\n recomputeNumberOfRows,\n type,\n name,\n ...forwardedProps\n } = props;\n // eslint-disable-next-line react-hooks/rules-of-hooks\n const ref = useRef<HTMLElement>(null);\n\n // eslint-disable-next-line react-hooks/rules-of-hooks\n useEffect(() => {\n // Recompute the number of rows for the first rendering\n if (multiline && ref && ref.current) {\n recomputeNumberOfRows(ref.current);\n }\n }, [ref, multiline, recomputeNumberOfRows, value]);\n\n const onTextFieldFocus = (event: React.FocusEvent) => {\n onFocus?.(event);\n setFocus(true);\n };\n\n const onTextFieldBlur = (event: React.FocusEvent) => {\n onBlur?.(event);\n setFocus(false);\n };\n\n const handleChange = (event: React.ChangeEvent) => {\n onChange(get(event, 'target.value'), name, event);\n };\n\n const Component = multiline ? 'textarea' : 'input';\n const inputProps: any = {\n ...forwardedProps,\n id,\n className: multiline\n ? `${CLASSNAME}__input-native ${CLASSNAME}__input-native--textarea`\n : `${CLASSNAME}__input-native ${CLASSNAME}__input-native--text`,\n placeholder,\n value,\n name,\n disabled: isDisabled,\n required: isRequired,\n onFocus: onTextFieldFocus,\n onBlur: onTextFieldBlur,\n onChange: handleChange,\n ref: mergeRefs(inputRef as any, ref) as any,\n };\n if (multiline) {\n inputProps.rows = rows;\n } else {\n inputProps.type = type;\n }\n return <Component {...inputProps} />;\n};\n\n/**\n * TextField component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const TextField: Comp<TextFieldProps, HTMLDivElement> = forwardRef((props, ref) => {\n const {\n chips,\n className,\n clearButtonProps,\n disabled,\n error,\n forceFocusStyle,\n hasError,\n helper,\n icon,\n id,\n inputRef,\n isDisabled = disabled,\n isRequired,\n isValid,\n label,\n maxLength,\n minimumRows,\n multiline,\n name,\n onBlur,\n onChange,\n onFocus,\n placeholder,\n textFieldRef,\n theme,\n type,\n value,\n afterElement,\n ...forwardedProps\n } = props;\n const textFieldId = useMemo(() => id || `text-field-${uid()}`, [id]);\n const [isFocus, setFocus] = useState(false);\n const { rows, recomputeNumberOfRows } = useComputeNumberOfRows(multiline ? minimumRows || DEFAULT_MIN_ROWS : 0);\n const valueLength = (value || '').length;\n const isNotEmpty = valueLength > 0;\n\n /**\n * Function triggered when the Clear Button is clicked.\n * The idea is to execute the `onChange` callback with an empty string\n * and remove focus from the clear button.\n * @param evt On clear event.\n */\n const onClear = (evt: React.ChangeEvent) => {\n evt.nativeEvent.preventDefault();\n evt.nativeEvent.stopPropagation();\n (evt.currentTarget as HTMLElement).blur();\n\n onChange('');\n };\n\n return (\n <div\n ref={ref}\n className={classNames(\n className,\n handleBasicClasses({\n hasChips: Boolean(chips),\n hasError: !isValid && hasError,\n hasIcon: Boolean(icon),\n hasInput: !multiline,\n hasInputClear: clearButtonProps && isNotEmpty,\n hasLabel: Boolean(label),\n hasPlaceholder: Boolean(placeholder),\n hasTextarea: multiline,\n hasValue: Boolean(value),\n isDisabled,\n isFocus: isFocus || forceFocusStyle,\n isValid,\n prefix: CLASSNAME,\n theme,\n }),\n )}\n >\n {(label || maxLength) && (\n <div className={`${CLASSNAME}__header`}>\n {label && (\n <InputLabel\n htmlFor={textFieldId}\n className={`${CLASSNAME}__label`}\n isRequired={isRequired}\n theme={theme}\n >\n {label}\n </InputLabel>\n )}\n\n {maxLength && (\n <div className={`${CLASSNAME}__char-counter`}>\n <span>{maxLength - valueLength}</span>\n {maxLength - valueLength === 0 && <Icon icon={mdiAlertCircle} size={Size.xxs} />}\n </div>\n )}\n </div>\n )}\n\n <div className={`${CLASSNAME}__wrapper`} ref={textFieldRef}>\n {icon && (\n <Icon\n className={`${CLASSNAME}__input-icon`}\n color={theme === Theme.dark ? 'light' : undefined}\n icon={icon}\n size={Size.xs}\n />\n )}\n\n {chips && (\n <div className={`${CLASSNAME}__chips`}>\n {chips}\n\n {renderInputNative({\n id: textFieldId,\n inputRef,\n isDisabled,\n isRequired,\n maxLength,\n multiline,\n onBlur,\n onChange,\n onFocus,\n placeholder,\n recomputeNumberOfRows,\n rows,\n setFocus,\n type,\n value,\n name,\n ...forwardedProps,\n })}\n </div>\n )}\n\n {!chips && (\n <div className={`${CLASSNAME}__input-wrapper`}>\n {renderInputNative({\n id: textFieldId,\n inputRef,\n isDisabled,\n isRequired,\n maxLength,\n multiline,\n onBlur,\n onChange,\n onFocus,\n placeholder,\n recomputeNumberOfRows,\n rows,\n setFocus,\n type,\n value,\n name,\n ...forwardedProps,\n })}\n </div>\n )}\n\n {(isValid || hasError) && (\n <Icon\n className={`${CLASSNAME}__input-validity`}\n color={theme === Theme.dark ? 'light' : undefined}\n icon={isValid ? mdiCheckCircle : mdiAlertCircle}\n size={Size.xxs}\n />\n )}\n\n {clearButtonProps && isNotEmpty && (\n <IconButton\n {...clearButtonProps}\n className={`${CLASSNAME}__input-clear`}\n icon={mdiCloseCircle}\n emphasis={Emphasis.low}\n size={Size.s}\n theme={theme}\n onClick={onClear}\n type=\"button\"\n />\n )}\n\n {afterElement && <div className={`${CLASSNAME}__after-element`}>{afterElement}</div>}\n </div>\n\n {hasError && error && (\n <InputHelper className={`${CLASSNAME}__helper`} kind={Kind.error} theme={theme}>\n {error}\n </InputHelper>\n )}\n\n {helper && (\n <InputHelper className={`${CLASSNAME}__helper`} theme={theme}>\n {helper}\n </InputHelper>\n )}\n </div>\n );\n});\nTextField.displayName = COMPONENT_NAME;\nTextField.className = CLASSNAME;\nTextField.defaultProps = DEFAULT_PROPS;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_MIN_ROWS","DEFAULT_PROPS","theme","Theme","light","type","useComputeNumberOfRows","minimumRows","useState","rows","setRows","recompute","target","currentRows","scrollHeight","clientHeight","recomputeNumberOfRows","renderInputNative","props","id","isDisabled","isRequired","placeholder","multiline","value","setFocus","onChange","onFocus","onBlur","inputRef","name","forwardedProps","ref","useRef","useEffect","current","onTextFieldFocus","event","onTextFieldBlur","handleChange","get","Component","inputProps","className","disabled","required","mergeRefs","TextField","forwardRef","chips","clearButtonProps","error","forceFocusStyle","hasError","helper","icon","isValid","label","maxLength","textFieldRef","afterElement","textFieldId","useMemo","uid","isFocus","valueLength","length","isNotEmpty","onClear","evt","nativeEvent","preventDefault","stopPropagation","currentTarget","blur","classNames","handleBasicClasses","hasChips","Boolean","hasIcon","hasInput","hasInputClear","hasLabel","hasPlaceholder","hasTextarea","hasValue","prefix","mdiAlertCircle","Size","xxs","dark","undefined","xs","mdiCheckCircle","mdiCloseCircle","Emphasis","low","s","Kind","displayName","defaultProps"],"mappings":"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"}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import { d as _slicedToArray, b as _objectWithoutProperties, _ as _objectSpread2, c as _extends } from './
|
|
1
|
+
import { d as _slicedToArray, b as _objectWithoutProperties, _ as _objectSpread2, c as _extends } from './_rollupPluginBabelHelpers.js';
|
|
2
2
|
import { AspectRatio, Size, Theme } from './components.js';
|
|
3
3
|
import React, { useState, useEffect, useMemo, forwardRef } from 'react';
|
|
4
|
-
import { g as getRootClassName, c as classnames, h as handleBasicClasses } from './
|
|
5
|
-
import { I as Icon, t as mdiImageBroken } from './
|
|
6
|
-
import { m as mergeRefs } from './
|
|
4
|
+
import { g as getRootClassName, c as classnames, h as handleBasicClasses } from './getRootClassName.js';
|
|
5
|
+
import { I as Icon, t as mdiImageBroken } from './Icon2.js';
|
|
6
|
+
import { m as mergeRefs } from './mergeRefs.js';
|
|
7
7
|
|
|
8
8
|
function getState(img, event) {
|
|
9
9
|
// Error event occurred or image loaded empty.
|
|
@@ -283,5 +283,5 @@ Thumbnail.displayName = COMPONENT_NAME;
|
|
|
283
283
|
Thumbnail.className = CLASSNAME;
|
|
284
284
|
Thumbnail.defaultProps = DEFAULT_PROPS;
|
|
285
285
|
|
|
286
|
-
export { Thumbnail as T };
|
|
287
|
-
//# sourceMappingURL=
|
|
286
|
+
export { Thumbnail as T, useFocusPointStyle as u };
|
|
287
|
+
//# sourceMappingURL=Thumbnail2.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Thumbnail2.js","sources":["../../../src/components/thumbnail/useImageLoad.ts","../../../src/components/thumbnail/useFocusPointStyle.tsx","../../../src/components/thumbnail/Thumbnail.tsx"],"sourcesContent":["import { useEffect, useState } from 'react';\n\nexport type LoadingState = 'isLoading' | 'isLoaded' | 'hasError';\n\nfunction getState(img: HTMLImageElement | null | undefined, event?: Event) {\n // Error event occurred or image loaded empty.\n if (event?.type === 'error' || (img?.complete && (img?.naturalWidth === 0 || img?.naturalHeight === 0))) {\n return 'hasError';\n }\n // Image is undefined or incomplete.\n if (!img || !img.complete) {\n return 'isLoading';\n }\n // Else loaded.\n return 'isLoaded';\n}\n\nexport function useImageLoad(imageURL: string, imgRef?: HTMLImageElement): LoadingState {\n const [state, setState] = useState<LoadingState>(getState(imgRef));\n\n // Update state when changing image URL or DOM reference.\n useEffect(() => {\n setState(getState(imgRef));\n }, [imageURL, imgRef]);\n\n // Listen to `load` and `error` event on image\n useEffect(() => {\n const img = imgRef;\n if (!img) return undefined;\n const update = (event?: Event) => setState(getState(img, event));\n img.addEventListener('load', update);\n img.addEventListener('error', update);\n return () => {\n img.removeEventListener('load', update);\n img.removeEventListener('error', update);\n };\n }, [imgRef, imgRef?.src]);\n\n return state;\n}\n","import { CSSProperties, useEffect, useMemo, useState } from 'react';\nimport { AspectRatio } from '@lumx/react/components';\nimport { ThumbnailProps } from '@lumx/react/components/thumbnail/Thumbnail';\n\n// Calculate shift to center the focus point in the container.\nfunction shiftPosition(scale: number, focusPoint: number, imageSize: number, containerSize: number) {\n const scaledSize = imageSize / scale;\n const scaledFocusHeight = focusPoint * scaledSize;\n const startFocus = scaledFocusHeight - containerSize / 2;\n const shift = startFocus / (scaledSize - containerSize);\n return Math.floor(Math.max(Math.min(shift, 1), 0) * 100);\n}\n\ntype Size = { width: number; height: number };\n\n// Compute CSS properties to apply the focus point.\nexport const useFocusPointStyle = (\n { image, aspectRatio, focusPoint, imgProps: { width, height } = {} }: ThumbnailProps,\n element: HTMLImageElement | undefined,\n isLoaded: boolean,\n): CSSProperties => {\n // Get natural image size from imgProps or img element.\n const imageSize: Size | undefined = useMemo(() => {\n // Focus point is not applicable => exit early\n if (!image || aspectRatio === AspectRatio.original || (!focusPoint?.x && !focusPoint?.y)) return undefined;\n if (typeof width === 'number' && typeof height === 'number') return { width, height };\n if (element && isLoaded) return { width: element.naturalWidth, height: element.naturalHeight };\n return undefined;\n }, [aspectRatio, element, focusPoint?.x, focusPoint?.y, height, image, isLoaded, width]);\n\n // Get container size (dependant on imageSize).\n const [containerSize, setContainerSize] = useState<Size | undefined>(undefined);\n useEffect(\n function updateContainerSize() {\n const cWidth = element?.offsetWidth;\n const cHeight = element?.offsetHeight;\n if (cWidth && cHeight) {\n // Update only if needed.\n setContainerSize((oldContainerSize) =>\n oldContainerSize?.width === cWidth && oldContainerSize.height === cHeight\n ? oldContainerSize\n : { width: cWidth, height: cHeight },\n );\n } else if (imageSize) {\n // Wait for a render (in case the container size is dependent on the image size).\n requestAnimationFrame(updateContainerSize);\n }\n },\n [element?.offsetHeight, element?.offsetWidth, imageSize],\n );\n\n // Compute style.\n const [style, setStyle] = useState<CSSProperties>({});\n useEffect(() => {\n // Focus point is not applicable => exit early\n if (!image || aspectRatio === AspectRatio.original || (!focusPoint?.x && !focusPoint?.y)) {\n return;\n }\n if (!element || !imageSize) {\n // Focus point can be computed but now right now (image size unknown).\n setStyle({ visibility: 'hidden' });\n return;\n }\n if (!containerSize) {\n // Missing container size abort focus point compute.\n setStyle({});\n return;\n }\n\n const heightScale = imageSize.height / containerSize.height;\n const widthScale = imageSize.width / containerSize.width;\n const scale = Math.min(widthScale, heightScale);\n\n // Focus Y relative to the top (instead of the center)\n const focusPointFromTop = Math.abs((focusPoint?.y || 0) - 1) / 2;\n const y = shiftPosition(scale, focusPointFromTop, imageSize.height, containerSize.height);\n\n // Focus X relative to the left (instead of the center)\n const focusPointFromLeft = Math.abs((focusPoint?.x || 0) + 1) / 2;\n const x = shiftPosition(scale, focusPointFromLeft, imageSize.width, containerSize.width);\n\n const objectPosition = `${x}% ${y}%`;\n\n // Update only if needed.\n setStyle((oldStyle) => (oldStyle.objectPosition === objectPosition ? oldStyle : { objectPosition }));\n }, [aspectRatio, containerSize, element, focusPoint?.x, focusPoint?.y, image, imageSize]);\n\n return style;\n};\n","import React, {\n CSSProperties,\n forwardRef,\n ImgHTMLAttributes,\n KeyboardEventHandler,\n MouseEventHandler,\n ReactElement,\n ReactNode,\n Ref,\n useState,\n} from 'react';\nimport classNames from 'classnames';\n\nimport { AspectRatio, HorizontalAlignment, Icon, Size, Theme } from '@lumx/react';\n\nimport { Comp, GenericProps, getRootClassName, handleBasicClasses } from '@lumx/react/utils';\n\nimport { mdiImageBroken } from '@lumx/icons';\nimport { mergeRefs } from '@lumx/react/utils/mergeRefs';\nimport { useImageLoad } from '@lumx/react/components/thumbnail/useImageLoad';\nimport { useFocusPointStyle } from '@lumx/react/components/thumbnail/useFocusPointStyle';\nimport { FocusPoint, ThumbnailSize, ThumbnailVariant } from './types';\n\ntype ImgHTMLProps = ImgHTMLAttributes<HTMLImageElement>;\n\n/**\n * Defines the props of the component.\n */\nexport interface ThumbnailProps extends GenericProps {\n /** Alignment of the thumbnail in it's parent (requires flex parent). */\n align?: HorizontalAlignment;\n /** Image alternative text. */\n alt: string;\n /** Image aspect ratio. */\n aspectRatio?: AspectRatio;\n /** Badge. */\n badge?: ReactElement;\n /** Image cross origin resource policy. */\n crossOrigin?: ImgHTMLProps['crossOrigin'];\n /** Fallback icon (SVG path) or react node when image fails to load. */\n fallback?: string | ReactNode;\n /** Whether the thumbnail should fill it's parent size (requires flex parent) or not. */\n fillHeight?: boolean;\n /** Apply relative vertical and horizontal shift (from -1 to 1) on the image position inside the thumbnail. */\n focusPoint?: FocusPoint;\n /** Image URL. */\n image: string;\n /** Props to inject into the native <img> element. */\n imgProps?: ImgHTMLProps;\n /** Reference to the native <img> element. */\n imgRef?: Ref<HTMLImageElement>;\n /** Set to true to force the display of the loading skeleton. */\n isLoading?: boolean;\n /** Size variant of the component. */\n size?: ThumbnailSize;\n /** Image loading mode. */\n loading?: ImgHTMLProps['loading'];\n /** On click callback. */\n onClick?: MouseEventHandler<HTMLDivElement>;\n /** On key press callback. */\n onKeyPress?: KeyboardEventHandler<HTMLDivElement>;\n /** Theme adapting the component to light or dark background. */\n theme?: Theme;\n /** Variant of the component. */\n variant?: ThumbnailVariant;\n /** Props to pass to the link wrapping the thumbnail. */\n linkProps?: React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>;\n /** Custom react component for the link (can be used to inject react router Link). */\n linkAs?: 'a' | any;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'Thumbnail';\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<ThumbnailProps> = {\n fallback: mdiImageBroken,\n loading: 'lazy',\n theme: Theme.light,\n};\n\n/**\n * Thumbnail component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const Thumbnail: Comp<ThumbnailProps> = forwardRef((props, ref) => {\n const {\n align,\n alt,\n aspectRatio = AspectRatio.original,\n badge,\n className,\n crossOrigin,\n fallback,\n fillHeight,\n // `focusPoint` needs to be here to remove it from `forwardedProps`.\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n focusPoint,\n image,\n imgProps,\n imgRef: propImgRef,\n isLoading: isLoadingProp,\n loading,\n size,\n theme,\n variant,\n linkProps,\n linkAs,\n ...forwardedProps\n } = props;\n const [imgElement, setImgElement] = useState<HTMLImageElement>();\n\n // Image loading state.\n const loadingState = useImageLoad(image, imgElement);\n const isLoaded = loadingState === 'isLoaded';\n const isLoading = isLoadingProp || loadingState === 'isLoading';\n const hasError = loadingState === 'hasError';\n\n // Focus point.\n const focusPointStyle = useFocusPointStyle(props, imgElement, isLoaded);\n\n const hasIconErrorFallback = hasError && typeof fallback === 'string';\n const hasCustomErrorFallback = hasError && !hasIconErrorFallback;\n const imageErrorStyle: CSSProperties = {};\n if (hasIconErrorFallback) {\n // Keep the image layout on icon fallback.\n imageErrorStyle.visibility = 'hidden';\n } else if (hasCustomErrorFallback) {\n // Remove the image on custom fallback.\n imageErrorStyle.display = 'none';\n }\n\n const isLink = Boolean(linkProps?.href || linkAs);\n const isButton = !!forwardedProps.onClick;\n const isClickable = isButton || isLink;\n\n let Wrapper: any = 'div';\n const wrapperProps = { ...forwardedProps };\n if (isLink) {\n Wrapper = linkAs || 'a';\n Object.assign(wrapperProps, linkProps);\n } else if (isButton) {\n Wrapper = 'button';\n wrapperProps.type = forwardedProps.type || 'button';\n wrapperProps['aria-label'] = forwardedProps['aria-label'] || alt;\n }\n\n return (\n <Wrapper\n {...wrapperProps}\n ref={ref}\n className={classNames(\n linkProps?.className,\n className,\n handleBasicClasses({\n align,\n aspectRatio,\n prefix: CLASSNAME,\n size,\n theme,\n variant,\n isClickable,\n hasError,\n hasIconErrorFallback,\n hasCustomErrorFallback,\n isLoading,\n hasBadge: !!badge,\n }),\n fillHeight && `${CLASSNAME}--fill-height`,\n )}\n >\n <div className={`${CLASSNAME}__background`}>\n <img\n {...imgProps}\n style={{\n ...imgProps?.style,\n ...imageErrorStyle,\n ...focusPointStyle,\n }}\n ref={mergeRefs(setImgElement, propImgRef)}\n className={classNames(\n handleBasicClasses({\n prefix: `${CLASSNAME}__image`,\n isLoading,\n hasDefinedSize: Boolean(imgProps?.height && imgProps.width),\n }),\n imgProps?.className,\n )}\n crossOrigin={crossOrigin}\n src={image}\n alt={alt}\n loading={loading}\n />\n {!isLoading && hasError && (\n <div className={`${CLASSNAME}__fallback`}>\n {hasIconErrorFallback ? (\n <Icon icon={fallback as string} size={Size.xxs} theme={theme} />\n ) : (\n fallback\n )}\n </div>\n )}\n </div>\n {badge &&\n React.cloneElement(badge, { className: classNames(`${CLASSNAME}__badge`, badge.props.className) })}\n </Wrapper>\n );\n});\nThumbnail.displayName = COMPONENT_NAME;\nThumbnail.className = CLASSNAME;\nThumbnail.defaultProps = DEFAULT_PROPS;\n"],"names":["getState","img","event","type","complete","naturalWidth","naturalHeight","useImageLoad","imageURL","imgRef","useState","state","setState","useEffect","undefined","update","addEventListener","removeEventListener","src","shiftPosition","scale","focusPoint","imageSize","containerSize","scaledSize","scaledFocusHeight","startFocus","shift","Math","floor","max","min","useFocusPointStyle","element","isLoaded","image","aspectRatio","imgProps","width","height","useMemo","AspectRatio","original","x","y","setContainerSize","updateContainerSize","cWidth","offsetWidth","cHeight","offsetHeight","oldContainerSize","requestAnimationFrame","style","setStyle","visibility","heightScale","widthScale","focusPointFromTop","abs","focusPointFromLeft","objectPosition","oldStyle","COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","fallback","mdiImageBroken","loading","theme","Theme","light","Thumbnail","forwardRef","props","ref","align","alt","badge","className","crossOrigin","fillHeight","propImgRef","isLoadingProp","isLoading","size","variant","linkProps","linkAs","forwardedProps","imgElement","setImgElement","loadingState","hasError","focusPointStyle","hasIconErrorFallback","hasCustomErrorFallback","imageErrorStyle","display","isLink","Boolean","href","isButton","onClick","isClickable","Wrapper","wrapperProps","Object","assign","classNames","handleBasicClasses","prefix","hasBadge","mergeRefs","hasDefinedSize","Size","xxs","React","cloneElement","displayName","defaultProps"],"mappings":";;;;;;;AAIA,SAASA,QAAT,CAAkBC,GAAlB,EAA4DC,KAA5D,EAA2E;AACvE;AACA,MAAI,CAAAA,KAAK,SAAL,IAAAA,KAAK,WAAL,YAAAA,KAAK,CAAEC,IAAP,MAAgB,OAAhB,IAA4B,CAAAF,GAAG,SAAH,IAAAA,GAAG,WAAH,YAAAA,GAAG,CAAEG,QAAL,MAAkB,CAAAH,GAAG,SAAH,IAAAA,GAAG,WAAH,YAAAA,GAAG,CAAEI,YAAL,MAAsB,CAAtB,IAA2B,CAAAJ,GAAG,SAAH,IAAAA,GAAG,WAAH,YAAAA,GAAG,CAAEK,aAAL,MAAuB,CAApE,CAAhC,EAAyG;AACrG,WAAO,UAAP;AACH,GAJsE;;;AAMvE,MAAI,CAACL,GAAD,IAAQ,CAACA,GAAG,CAACG,QAAjB,EAA2B;AACvB,WAAO,WAAP;AACH,GARsE;;;AAUvE,SAAO,UAAP;AACH;;AAEM,SAASG,YAAT,CAAsBC,QAAtB,EAAwCC,MAAxC,EAAiF;AAAA,kBAC1DC,QAAQ,CAAeV,QAAQ,CAACS,MAAD,CAAvB,CADkD;AAAA;AAAA,MAC7EE,KAD6E;AAAA,MACtEC,QADsE;;;AAIpFC,EAAAA,SAAS,CAAC,YAAM;AACZD,IAAAA,QAAQ,CAACZ,QAAQ,CAACS,MAAD,CAAT,CAAR;AACH,GAFQ,EAEN,CAACD,QAAD,EAAWC,MAAX,CAFM,CAAT,CAJoF;;AASpFI,EAAAA,SAAS,CAAC,YAAM;AACZ,QAAMZ,GAAG,GAAGQ,MAAZ;AACA,QAAI,CAACR,GAAL,EAAU,OAAOa,SAAP;;AACV,QAAMC,MAAM,GAAG,SAATA,MAAS,CAACb,KAAD;AAAA,aAAmBU,QAAQ,CAACZ,QAAQ,CAACC,GAAD,EAAMC,KAAN,CAAT,CAA3B;AAAA,KAAf;;AACAD,IAAAA,GAAG,CAACe,gBAAJ,CAAqB,MAArB,EAA6BD,MAA7B;AACAd,IAAAA,GAAG,CAACe,gBAAJ,CAAqB,OAArB,EAA8BD,MAA9B;AACA,WAAO,YAAM;AACTd,MAAAA,GAAG,CAACgB,mBAAJ,CAAwB,MAAxB,EAAgCF,MAAhC;AACAd,MAAAA,GAAG,CAACgB,mBAAJ,CAAwB,OAAxB,EAAiCF,MAAjC;AACH,KAHD;AAIH,GAVQ,EAUN,CAACN,MAAD,EAASA,MAAT,aAASA,MAAT,uBAASA,MAAM,CAAES,GAAjB,CAVM,CAAT;AAYA,SAAOP,KAAP;AACH;;ACnCD;AACA,SAASQ,aAAT,CAAuBC,KAAvB,EAAsCC,UAAtC,EAA0DC,SAA1D,EAA6EC,aAA7E,EAAoG;AAChG,MAAMC,UAAU,GAAGF,SAAS,GAAGF,KAA/B;AACA,MAAMK,iBAAiB,GAAGJ,UAAU,GAAGG,UAAvC;AACA,MAAME,UAAU,GAAGD,iBAAiB,GAAGF,aAAa,GAAG,CAAvD;AACA,MAAMI,KAAK,GAAGD,UAAU,IAAIF,UAAU,GAAGD,aAAjB,CAAxB;AACA,SAAOK,IAAI,CAACC,KAAL,CAAWD,IAAI,CAACE,GAAL,CAASF,IAAI,CAACG,GAAL,CAASJ,KAAT,EAAgB,CAAhB,CAAT,EAA6B,CAA7B,IAAkC,GAA7C,CAAP;AACH;;AAID;IACaK,kBAAkB,GAAG,SAArBA,kBAAqB,OAE9BC,OAF8B,EAG9BC,QAH8B,EAId;AAAA,MAHdC,KAGc,QAHdA,KAGc;AAAA,MAHPC,WAGO,QAHPA,WAGO;AAAA,MAHMf,UAGN,QAHMA,UAGN;AAAA,2BAHkBgB,QAGlB;AAAA,6CAHgD,EAGhD;AAAA,MAH8BC,KAG9B,iBAH8BA,KAG9B;AAAA,MAHqCC,MAGrC,iBAHqCA,MAGrC;AAChB;AACA,MAAMjB,SAA2B,GAAGkB,OAAO,CAAC,YAAM;AAC9C;AACA,QAAI,CAACL,KAAD,IAAUC,WAAW,KAAKK,WAAW,CAACC,QAAtC,IAAmD,EAACrB,UAAD,aAACA,UAAD,uBAACA,UAAU,CAAEsB,CAAb,KAAkB,EAACtB,UAAD,aAACA,UAAD,uBAACA,UAAU,CAAEuB,CAAb,CAAzE,EAA0F,OAAO9B,SAAP;AAC1F,QAAI,OAAOwB,KAAP,KAAiB,QAAjB,IAA6B,OAAOC,MAAP,KAAkB,QAAnD,EAA6D,OAAO;AAAED,MAAAA,KAAK,EAALA,KAAF;AAASC,MAAAA,MAAM,EAANA;AAAT,KAAP;AAC7D,QAAIN,OAAO,IAAIC,QAAf,EAAyB,OAAO;AAAEI,MAAAA,KAAK,EAAEL,OAAO,CAAC5B,YAAjB;AAA+BkC,MAAAA,MAAM,EAAEN,OAAO,CAAC3B;AAA/C,KAAP;AACzB,WAAOQ,SAAP;AACH,GAN0C,EAMxC,CAACsB,WAAD,EAAcH,OAAd,EAAuBZ,UAAvB,aAAuBA,UAAvB,uBAAuBA,UAAU,CAAEsB,CAAnC,EAAsCtB,UAAtC,aAAsCA,UAAtC,uBAAsCA,UAAU,CAAEuB,CAAlD,EAAqDL,MAArD,EAA6DJ,KAA7D,EAAoED,QAApE,EAA8EI,KAA9E,CANwC,CAA3C,CAFgB;;AAAA,kBAW0B5B,QAAQ,CAAmBI,SAAnB,CAXlC;AAAA;AAAA,MAWTS,aAXS;AAAA,MAWMsB,gBAXN;;AAYhBhC,EAAAA,SAAS,CACL,SAASiC,mBAAT,GAA+B;AAC3B,QAAMC,MAAM,GAAGd,OAAH,aAAGA,OAAH,uBAAGA,OAAO,CAAEe,WAAxB;AACA,QAAMC,OAAO,GAAGhB,OAAH,aAAGA,OAAH,uBAAGA,OAAO,CAAEiB,YAAzB;;AACA,QAAIH,MAAM,IAAIE,OAAd,EAAuB;AACnB;AACAJ,MAAAA,gBAAgB,CAAC,UAACM,gBAAD;AAAA,eACb,CAAAA,gBAAgB,SAAhB,IAAAA,gBAAgB,WAAhB,YAAAA,gBAAgB,CAAEb,KAAlB,MAA4BS,MAA5B,IAAsCI,gBAAgB,CAACZ,MAAjB,KAA4BU,OAAlE,GACME,gBADN,GAEM;AAAEb,UAAAA,KAAK,EAAES,MAAT;AAAiBR,UAAAA,MAAM,EAAEU;AAAzB,SAHO;AAAA,OAAD,CAAhB;AAKH,KAPD,MAOO,IAAI3B,SAAJ,EAAe;AAClB;AACA8B,MAAAA,qBAAqB,CAACN,mBAAD,CAArB;AACH;AACJ,GAfI,EAgBL,CAACb,OAAD,aAACA,OAAD,uBAACA,OAAO,CAAEiB,YAAV,EAAwBjB,OAAxB,aAAwBA,OAAxB,uBAAwBA,OAAO,CAAEe,WAAjC,EAA8C1B,SAA9C,CAhBK,CAAT,CAZgB;;AAAA,mBAgCUZ,QAAQ,CAAgB,EAAhB,CAhClB;AAAA;AAAA,MAgCT2C,KAhCS;AAAA,MAgCFC,QAhCE;;AAiChBzC,EAAAA,SAAS,CAAC,YAAM;AACZ;AACA,QAAI,CAACsB,KAAD,IAAUC,WAAW,KAAKK,WAAW,CAACC,QAAtC,IAAmD,EAACrB,UAAD,aAACA,UAAD,uBAACA,UAAU,CAAEsB,CAAb,KAAkB,EAACtB,UAAD,aAACA,UAAD,uBAACA,UAAU,CAAEuB,CAAb,CAAzE,EAA0F;AACtF;AACH;;AACD,QAAI,CAACX,OAAD,IAAY,CAACX,SAAjB,EAA4B;AACxB;AACAgC,MAAAA,QAAQ,CAAC;AAAEC,QAAAA,UAAU,EAAE;AAAd,OAAD,CAAR;AACA;AACH;;AACD,QAAI,CAAChC,aAAL,EAAoB;AAChB;AACA+B,MAAAA,QAAQ,CAAC,EAAD,CAAR;AACA;AACH;;AAED,QAAME,WAAW,GAAGlC,SAAS,CAACiB,MAAV,GAAmBhB,aAAa,CAACgB,MAArD;AACA,QAAMkB,UAAU,GAAGnC,SAAS,CAACgB,KAAV,GAAkBf,aAAa,CAACe,KAAnD;AACA,QAAMlB,KAAK,GAAGQ,IAAI,CAACG,GAAL,CAAS0B,UAAT,EAAqBD,WAArB,CAAd,CAlBY;;AAqBZ,QAAME,iBAAiB,GAAG9B,IAAI,CAAC+B,GAAL,CAAS,CAAC,CAAAtC,UAAU,SAAV,IAAAA,UAAU,WAAV,YAAAA,UAAU,CAAEuB,CAAZ,KAAiB,CAAlB,IAAuB,CAAhC,IAAqC,CAA/D;AACA,QAAMA,CAAC,GAAGzB,aAAa,CAACC,KAAD,EAAQsC,iBAAR,EAA2BpC,SAAS,CAACiB,MAArC,EAA6ChB,aAAa,CAACgB,MAA3D,CAAvB,CAtBY;;AAyBZ,QAAMqB,kBAAkB,GAAGhC,IAAI,CAAC+B,GAAL,CAAS,CAAC,CAAAtC,UAAU,SAAV,IAAAA,UAAU,WAAV,YAAAA,UAAU,CAAEsB,CAAZ,KAAiB,CAAlB,IAAuB,CAAhC,IAAqC,CAAhE;AACA,QAAMA,CAAC,GAAGxB,aAAa,CAACC,KAAD,EAAQwC,kBAAR,EAA4BtC,SAAS,CAACgB,KAAtC,EAA6Cf,aAAa,CAACe,KAA3D,CAAvB;AAEA,QAAMuB,cAAc,aAAMlB,CAAN,eAAYC,CAAZ,MAApB,CA5BY;;AA+BZU,IAAAA,QAAQ,CAAC,UAACQ,QAAD;AAAA,aAAeA,QAAQ,CAACD,cAAT,KAA4BA,cAA5B,GAA6CC,QAA7C,GAAwD;AAAED,QAAAA,cAAc,EAAdA;AAAF,OAAvE;AAAA,KAAD,CAAR;AACH,GAhCQ,EAgCN,CAACzB,WAAD,EAAcb,aAAd,EAA6BU,OAA7B,EAAsCZ,UAAtC,aAAsCA,UAAtC,uBAAsCA,UAAU,CAAEsB,CAAlD,EAAqDtB,UAArD,aAAqDA,UAArD,uBAAqDA,UAAU,CAAEuB,CAAjE,EAAoET,KAApE,EAA2Eb,SAA3E,CAhCM,CAAT;AAkCA,SAAO+B,KAAP;AACH;;ACjBD;;;AAGA,IAAMU,cAAc,GAAG,WAAvB;AAEA;;;;AAGA,IAAMC,SAAS,GAAGC,gBAAgB,CAACF,cAAD,CAAlC;AAEA;;;;AAGA,IAAMG,aAAsC,GAAG;AAC3CC,EAAAA,QAAQ,EAAEC,cADiC;AAE3CC,EAAAA,OAAO,EAAE,MAFkC;AAG3CC,EAAAA,KAAK,EAAEC,KAAK,CAACC;AAH8B,CAA/C;AAMA;;;;;;;;IAOaC,SAA+B,GAAGC,UAAU,CAAC,UAACC,KAAD,EAAQC,GAAR,EAAgB;AAAA,MAElEC,KAFkE,GAwBlEF,KAxBkE,CAElEE,KAFkE;AAAA,MAGlEC,GAHkE,GAwBlEH,KAxBkE,CAGlEG,GAHkE;AAAA,2BAwBlEH,KAxBkE,CAIlEvC,WAJkE;AAAA,MAIlEA,WAJkE,mCAIpDK,WAAW,CAACC,QAJwC;AAAA,MAKlEqC,KALkE,GAwBlEJ,KAxBkE,CAKlEI,KALkE;AAAA,MAMlEC,SANkE,GAwBlEL,KAxBkE,CAMlEK,SANkE;AAAA,MAOlEC,WAPkE,GAwBlEN,KAxBkE,CAOlEM,WAPkE;AAAA,MAQlEd,QARkE,GAwBlEQ,KAxBkE,CAQlER,QARkE;AAAA,MASlEe,UATkE,GAwBlEP,KAxBkE,CASlEO,UATkE;AAAA,MAYlE7D,UAZkE,GAwBlEsD,KAxBkE,CAYlEtD,UAZkE;AAAA,MAalEc,KAbkE,GAwBlEwC,KAxBkE,CAalExC,KAbkE;AAAA,MAclEE,QAdkE,GAwBlEsC,KAxBkE,CAclEtC,QAdkE;AAAA,MAe1D8C,UAf0D,GAwBlER,KAxBkE,CAelElE,MAfkE;AAAA,MAgBvD2E,aAhBuD,GAwBlET,KAxBkE,CAgBlEU,SAhBkE;AAAA,MAiBlEhB,OAjBkE,GAwBlEM,KAxBkE,CAiBlEN,OAjBkE;AAAA,MAkBlEiB,IAlBkE,GAwBlEX,KAxBkE,CAkBlEW,IAlBkE;AAAA,MAmBlEhB,KAnBkE,GAwBlEK,KAxBkE,CAmBlEL,KAnBkE;AAAA,MAoBlEiB,OApBkE,GAwBlEZ,KAxBkE,CAoBlEY,OApBkE;AAAA,MAqBlEC,SArBkE,GAwBlEb,KAxBkE,CAqBlEa,SArBkE;AAAA,MAsBlEC,MAtBkE,GAwBlEd,KAxBkE,CAsBlEc,MAtBkE;AAAA,MAuB/DC,cAvB+D,4BAwBlEf,KAxBkE;;AAAA,kBAyBlCjE,QAAQ,EAzB0B;AAAA;AAAA,MAyB/DiF,UAzB+D;AAAA,MAyBnDC,aAzBmD;;;AA4BtE,MAAMC,YAAY,GAAGtF,YAAY,CAAC4B,KAAD,EAAQwD,UAAR,CAAjC;AACA,MAAMzD,QAAQ,GAAG2D,YAAY,KAAK,UAAlC;AACA,MAAMR,SAAS,GAAGD,aAAa,IAAIS,YAAY,KAAK,WAApD;AACA,MAAMC,QAAQ,GAAGD,YAAY,KAAK,UAAlC,CA/BsE;;AAkCtE,MAAME,eAAe,GAAG/D,kBAAkB,CAAC2C,KAAD,EAAQgB,UAAR,EAAoBzD,QAApB,CAA1C;AAEA,MAAM8D,oBAAoB,GAAGF,QAAQ,IAAI,OAAO3B,QAAP,KAAoB,QAA7D;AACA,MAAM8B,sBAAsB,GAAGH,QAAQ,IAAI,CAACE,oBAA5C;AACA,MAAME,eAA8B,GAAG,EAAvC;;AACA,MAAIF,oBAAJ,EAA0B;AACtB;AACAE,IAAAA,eAAe,CAAC3C,UAAhB,GAA6B,QAA7B;AACH,GAHD,MAGO,IAAI0C,sBAAJ,EAA4B;AAC/B;AACAC,IAAAA,eAAe,CAACC,OAAhB,GAA0B,MAA1B;AACH;;AAED,MAAMC,MAAM,GAAGC,OAAO,CAAC,CAAAb,SAAS,SAAT,IAAAA,SAAS,WAAT,YAAAA,SAAS,CAAEc,IAAX,KAAmBb,MAApB,CAAtB;AACA,MAAMc,QAAQ,GAAG,CAAC,CAACb,cAAc,CAACc,OAAlC;AACA,MAAMC,WAAW,GAAGF,QAAQ,IAAIH,MAAhC;AAEA,MAAIM,OAAY,GAAG,KAAnB;;AACA,MAAMC,YAAY,sBAAQjB,cAAR,CAAlB;;AACA,MAAIU,MAAJ,EAAY;AACRM,IAAAA,OAAO,GAAGjB,MAAM,IAAI,GAApB;AACAmB,IAAAA,MAAM,CAACC,MAAP,CAAcF,YAAd,EAA4BnB,SAA5B;AACH,GAHD,MAGO,IAAIe,QAAJ,EAAc;AACjBG,IAAAA,OAAO,GAAG,QAAV;AACAC,IAAAA,YAAY,CAACxG,IAAb,GAAoBuF,cAAc,CAACvF,IAAf,IAAuB,QAA3C;AACAwG,IAAAA,YAAY,CAAC,YAAD,CAAZ,GAA6BjB,cAAc,CAAC,YAAD,CAAd,IAAgCZ,GAA7D;AACH;;AAED,SACI,oBAAC,OAAD,eACQ6B,YADR;AAEI,IAAA,GAAG,EAAE/B,GAFT;AAGI,IAAA,SAAS,EAAEkC,UAAU,CACjBtB,SADiB,aACjBA,SADiB,uBACjBA,SAAS,CAAER,SADM,EAEjBA,SAFiB,EAGjB+B,kBAAkB,CAAC;AACflC,MAAAA,KAAK,EAALA,KADe;AAEfzC,MAAAA,WAAW,EAAXA,WAFe;AAGf4E,MAAAA,MAAM,EAAEhD,SAHO;AAIfsB,MAAAA,IAAI,EAAJA,IAJe;AAKfhB,MAAAA,KAAK,EAALA,KALe;AAMfiB,MAAAA,OAAO,EAAPA,OANe;AAOfkB,MAAAA,WAAW,EAAXA,WAPe;AAQfX,MAAAA,QAAQ,EAARA,QARe;AASfE,MAAAA,oBAAoB,EAApBA,oBATe;AAUfC,MAAAA,sBAAsB,EAAtBA,sBAVe;AAWfZ,MAAAA,SAAS,EAATA,SAXe;AAYf4B,MAAAA,QAAQ,EAAE,CAAC,CAAClC;AAZG,KAAD,CAHD,EAiBjBG,UAAU,cAAOlB,SAAP,kBAjBO;AAHzB,MAuBI;AAAK,IAAA,SAAS,YAAKA,SAAL;AAAd,KACI,wCACQ3B,QADR;AAEI,IAAA,KAAK,qBACEA,QADF,aACEA,QADF,uBACEA,QAAQ,CAAEgB,KADZ,MAEE6C,eAFF,MAGEH,eAHF,CAFT;AAOI,IAAA,GAAG,EAAEmB,SAAS,CAACtB,aAAD,EAAgBT,UAAhB,CAPlB;AAQI,IAAA,SAAS,EAAE2B,UAAU,CACjBC,kBAAkB,CAAC;AACfC,MAAAA,MAAM,YAAKhD,SAAL,YADS;AAEfqB,MAAAA,SAAS,EAATA,SAFe;AAGf8B,MAAAA,cAAc,EAAEd,OAAO,CAAC,CAAAhE,QAAQ,SAAR,IAAAA,QAAQ,WAAR,YAAAA,QAAQ,CAAEE,MAAV,KAAoBF,QAAQ,CAACC,KAA9B;AAHR,KAAD,CADD,EAMjBD,QANiB,aAMjBA,QANiB,uBAMjBA,QAAQ,CAAE2C,SANO,CARzB;AAgBI,IAAA,WAAW,EAAEC,WAhBjB;AAiBI,IAAA,GAAG,EAAE9C,KAjBT;AAkBI,IAAA,GAAG,EAAE2C,GAlBT;AAmBI,IAAA,OAAO,EAAET;AAnBb,KADJ,EAsBK,CAACgB,SAAD,IAAcS,QAAd,IACG;AAAK,IAAA,SAAS,YAAK9B,SAAL;AAAd,KACKgC,oBAAoB,GACjB,oBAAC,IAAD;AAAM,IAAA,IAAI,EAAE7B,QAAZ;AAAgC,IAAA,IAAI,EAAEiD,IAAI,CAACC,GAA3C;AAAgD,IAAA,KAAK,EAAE/C;AAAvD,IADiB,GAGjBH,QAJR,CAvBR,CAvBJ,EAuDKY,KAAK,IACFuC,KAAK,CAACC,YAAN,CAAmBxC,KAAnB,EAA0B;AAAEC,IAAAA,SAAS,EAAE8B,UAAU,WAAI9C,SAAJ,cAAwBe,KAAK,CAACJ,KAAN,CAAYK,SAApC;AAAvB,GAA1B,CAxDR,CADJ;AA4DH,CA1HwD;AA2HzDP,SAAS,CAAC+C,WAAV,GAAwBzD,cAAxB;AACAU,SAAS,CAACO,SAAV,GAAsBhB,SAAtB;AACAS,SAAS,CAACgD,YAAV,GAAyBvD,aAAzB;;;;"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { b as _objectWithoutProperties, c as _extends } from './
|
|
1
|
+
import { b as _objectWithoutProperties, c as _extends } from './_rollupPluginBabelHelpers.js';
|
|
2
2
|
import React, { forwardRef } from 'react';
|
|
3
|
-
import { g as getRootClassName, c as classnames, h as handleBasicClasses } from './
|
|
3
|
+
import { g as getRootClassName, c as classnames, h as handleBasicClasses } from './getRootClassName.js';
|
|
4
4
|
|
|
5
5
|
/**
|
|
6
6
|
* Defines the props of the component.
|
|
@@ -57,4 +57,4 @@ Toolbar.className = CLASSNAME;
|
|
|
57
57
|
Toolbar.defaultProps = DEFAULT_PROPS;
|
|
58
58
|
|
|
59
59
|
export { Toolbar as T };
|
|
60
|
-
//# sourceMappingURL=
|
|
60
|
+
//# sourceMappingURL=Toolbar2.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Toolbar2.js","sources":["../../../src/components/toolbar/Toolbar.tsx"],"sourcesContent":["import React, { forwardRef, ReactNode } from 'react';\n\nimport classNames from 'classnames';\n\nimport { Comp, GenericProps, getRootClassName, handleBasicClasses } from '@lumx/react/utils';\n\n/**\n * Defines the props of the component.\n */\nexport interface ToolbarProps extends GenericProps {\n /** After content (placed after the label). */\n after?: ReactNode;\n /** Before content (placed before the label). */\n before?: ReactNode;\n /** Label content. */\n label?: ReactNode;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'Toolbar';\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<ToolbarProps> = {};\n\n/**\n * Toolbar component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const Toolbar: Comp<ToolbarProps, HTMLDivElement> = forwardRef((props, ref) => {\n const { after, before, className, label, ...forwardedProps } = props;\n\n return (\n <div\n ref={ref}\n {...forwardedProps}\n className={classNames(\n className,\n handleBasicClasses({\n hasAfter: Boolean(after),\n hasBefore: Boolean(before),\n hasLabel: Boolean(label),\n prefix: CLASSNAME,\n }),\n )}\n >\n {before && <div className={`${CLASSNAME}__before`}>{before}</div>}\n {label && <div className={`${CLASSNAME}__label`}>{label}</div>}\n {after && <div className={`${CLASSNAME}__after`}>{after}</div>}\n </div>\n );\n});\nToolbar.displayName = COMPONENT_NAME;\nToolbar.className = CLASSNAME;\nToolbar.defaultProps = DEFAULT_PROPS;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","Toolbar","forwardRef","props","ref","after","before","className","label","forwardedProps","classNames","handleBasicClasses","hasAfter","Boolean","hasBefore","hasLabel","prefix","displayName","defaultProps"],"mappings":";;;;AAMA;;;;AAYA;;;AAGA,IAAMA,cAAc,GAAG,SAAvB;AAEA;;;;AAGA,IAAMC,SAAS,GAAGC,gBAAgB,CAACF,cAAD,CAAlC;AAEA;;;;AAGA,IAAMG,aAAoC,GAAG,EAA7C;AAEA;;;;;;;;IAOaC,OAA2C,GAAGC,UAAU,CAAC,UAACC,KAAD,EAAQC,GAAR,EAAgB;AAAA,MAC1EC,KAD0E,GACnBF,KADmB,CAC1EE,KAD0E;AAAA,MACnEC,MADmE,GACnBH,KADmB,CACnEG,MADmE;AAAA,MAC3DC,SAD2D,GACnBJ,KADmB,CAC3DI,SAD2D;AAAA,MAChDC,KADgD,GACnBL,KADmB,CAChDK,KADgD;AAAA,MACtCC,cADsC,4BACnBN,KADmB;;AAGlF,SACI;AACI,IAAA,GAAG,EAAEC;AADT,KAEQK,cAFR;AAGI,IAAA,SAAS,EAAEC,UAAU,CACjBH,SADiB,EAEjBI,kBAAkB,CAAC;AACfC,MAAAA,QAAQ,EAAEC,OAAO,CAACR,KAAD,CADF;AAEfS,MAAAA,SAAS,EAAED,OAAO,CAACP,MAAD,CAFH;AAGfS,MAAAA,QAAQ,EAAEF,OAAO,CAACL,KAAD,CAHF;AAIfQ,MAAAA,MAAM,EAAElB;AAJO,KAAD,CAFD;AAHzB,MAaKQ,MAAM,IAAI;AAAK,IAAA,SAAS,YAAKR,SAAL;AAAd,KAAyCQ,MAAzC,CAbf,EAcKE,KAAK,IAAI;AAAK,IAAA,SAAS,YAAKV,SAAL;AAAd,KAAwCU,KAAxC,CAdd,EAeKH,KAAK,IAAI;AAAK,IAAA,SAAS,YAAKP,SAAL;AAAd,KAAwCO,KAAxC,CAfd,CADJ;AAmBH,CAtBoE;AAuBrEJ,OAAO,CAACgB,WAAR,GAAsBpB,cAAtB;AACAI,OAAO,CAACM,SAAR,GAAoBT,SAApB;AACAG,OAAO,CAACiB,YAAR,GAAuBlB,aAAvB;;;;"}
|
|
@@ -1,11 +1,11 @@
|
|
|
1
|
-
import { _ as _objectSpread2, c as _extends, d as _slicedToArray, b as _objectWithoutProperties } from './
|
|
1
|
+
import { _ as _objectSpread2, c as _extends, d as _slicedToArray, b as _objectWithoutProperties } from './_rollupPluginBabelHelpers.js';
|
|
2
2
|
import React, { useMemo, cloneElement, useState, useEffect, forwardRef } from 'react';
|
|
3
|
-
import { f as onEscapePressed, T as TOOLTIP_LONG_PRESS_DELAY, i as TOOLTIP_HOVER_DELAY, g as getRootClassName, c as classnames, h as handleBasicClasses } from './
|
|
4
|
-
import { u as uid } from '
|
|
5
|
-
import { D as DOCUMENT } from './constants.
|
|
3
|
+
import { f as onEscapePressed, T as TOOLTIP_LONG_PRESS_DELAY, i as TOOLTIP_HOVER_DELAY, g as getRootClassName, c as classnames, h as handleBasicClasses } from './getRootClassName.js';
|
|
4
|
+
import { u as uid } from '../index2.js';
|
|
5
|
+
import { D as DOCUMENT } from './constants.js';
|
|
6
6
|
import get from 'lodash/get';
|
|
7
|
-
import {
|
|
8
|
-
import { m as mergeRefs } from './
|
|
7
|
+
import { c as usePopper, P as Placement } from './Popover2.js';
|
|
8
|
+
import { m as mergeRefs } from './mergeRefs.js';
|
|
9
9
|
import { createPortal } from 'react-dom';
|
|
10
10
|
|
|
11
11
|
/**
|
|
@@ -136,13 +136,15 @@ function useTooltipOpen(delay, anchorElement) {
|
|
|
136
136
|
var _events$_i = _slicedToArray(_events[_i], 3),
|
|
137
137
|
node = _events$_i[0],
|
|
138
138
|
eventType = _events$_i[1],
|
|
139
|
-
|
|
139
|
+
eventHandler = _events$_i[2];
|
|
140
140
|
|
|
141
|
-
node.addEventListener(eventType,
|
|
141
|
+
node.addEventListener(eventType, eventHandler);
|
|
142
142
|
}
|
|
143
143
|
|
|
144
144
|
return function () {
|
|
145
|
-
//
|
|
145
|
+
// Clear pending timers.
|
|
146
|
+
if (timer) clearTimeout(timer); // Detach events.
|
|
147
|
+
|
|
146
148
|
var _iteratorNormalCompletion = true;
|
|
147
149
|
var _didIteratorError = false;
|
|
148
150
|
var _iteratorError = undefined;
|
|
@@ -152,9 +154,9 @@ function useTooltipOpen(delay, anchorElement) {
|
|
|
152
154
|
var _step$value = _slicedToArray(_step.value, 3),
|
|
153
155
|
node = _step$value[0],
|
|
154
156
|
eventType = _step$value[1],
|
|
155
|
-
|
|
157
|
+
eventHandler = _step$value[2];
|
|
156
158
|
|
|
157
|
-
node.removeEventListener(eventType,
|
|
159
|
+
node.removeEventListener(eventType, eventHandler);
|
|
158
160
|
}
|
|
159
161
|
} catch (err) {
|
|
160
162
|
_didIteratorError = true;
|
|
@@ -281,4 +283,4 @@ Tooltip.className = CLASSNAME;
|
|
|
281
283
|
Tooltip.defaultProps = DEFAULT_PROPS;
|
|
282
284
|
|
|
283
285
|
export { Tooltip as T };
|
|
284
|
-
//# sourceMappingURL=
|
|
286
|
+
//# sourceMappingURL=Tooltip2.js.map
|