@chayns-components/core 5.4.7 → 5.4.8-alpha.0
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/AGENTS.md +12 -0
- package/lib/cjs/components/accordion/Accordion.js +107 -12
- package/lib/cjs/components/accordion/Accordion.js.map +1 -1
- package/lib/cjs/components/accordion/Accordion.styles.js +23 -3
- package/lib/cjs/components/accordion/Accordion.styles.js.map +1 -1
- package/lib/cjs/components/accordion/accordion-body/AccordionBody.styles.js +3 -1
- package/lib/cjs/components/accordion/accordion-body/AccordionBody.styles.js.map +1 -1
- package/lib/cjs/components/accordion/accordion-group/AccordionGroup.js +36 -19
- package/lib/cjs/components/accordion/accordion-group/AccordionGroup.js.map +1 -1
- package/lib/cjs/components/accordion/accordion-head/AccordionHead.js +6 -3
- package/lib/cjs/components/accordion/accordion-head/AccordionHead.js.map +1 -1
- package/lib/cjs/components/accordion/accordion-head/AccordionHead.styles.js +14 -0
- package/lib/cjs/components/accordion/accordion-head/AccordionHead.styles.js.map +1 -1
- package/lib/cjs/components/amount-control/AmountControl.js +31 -17
- package/lib/cjs/components/amount-control/AmountControl.js.map +1 -1
- package/lib/cjs/components/amount-control/AmountControl.styles.js +18 -2
- package/lib/cjs/components/amount-control/AmountControl.styles.js.map +1 -1
- package/lib/cjs/components/button/Button.js +5 -1
- package/lib/cjs/components/button/Button.js.map +1 -1
- package/lib/cjs/components/button/Button.styles.js +10 -0
- package/lib/cjs/components/button/Button.styles.js.map +1 -1
- package/lib/cjs/components/button/Button.types.js.map +1 -1
- package/lib/cjs/components/checkbox/Checkbox.js +5 -1
- package/lib/cjs/components/checkbox/Checkbox.js.map +1 -1
- package/lib/cjs/components/checkbox/Checkbox.styles.js +29 -2
- package/lib/cjs/components/checkbox/Checkbox.styles.js.map +1 -1
- package/lib/cjs/components/color-scheme-provider/ColorSchemeProvider.js +7 -2
- package/lib/cjs/components/color-scheme-provider/ColorSchemeProvider.js.map +1 -1
- package/lib/cjs/components/color-scheme-provider/ColorSchemeProvider.styles.js +8 -2
- package/lib/cjs/components/color-scheme-provider/ColorSchemeProvider.styles.js.map +1 -1
- package/lib/cjs/components/combobox/ComboBox.js +68 -11
- package/lib/cjs/components/combobox/ComboBox.js.map +1 -1
- package/lib/cjs/components/combobox/ComboBox.styles.js +11 -0
- package/lib/cjs/components/combobox/ComboBox.styles.js.map +1 -1
- package/lib/cjs/components/combobox/ComboBox.types.js.map +1 -1
- package/lib/cjs/components/context-menu/ContextMenu.js +146 -42
- package/lib/cjs/components/context-menu/ContextMenu.js.map +1 -1
- package/lib/cjs/components/context-menu/ContextMenu.styles.js +38 -0
- package/lib/cjs/components/context-menu/ContextMenu.styles.js.map +1 -1
- package/lib/cjs/components/context-menu/ContextMenu.types.js.map +1 -1
- package/lib/cjs/components/context-menu/ContextMenu.utils.js +27 -1
- package/lib/cjs/components/context-menu/ContextMenu.utils.js.map +1 -1
- package/lib/cjs/components/context-menu/context-menu-content/ContextMenuContent.js +3 -8
- package/lib/cjs/components/context-menu/context-menu-content/ContextMenuContent.js.map +1 -1
- package/lib/cjs/components/file-input/FileInput.js +4 -2
- package/lib/cjs/components/file-input/FileInput.js.map +1 -1
- package/lib/cjs/components/file-list/file-item/FileItem.js +48 -25
- package/lib/cjs/components/file-list/file-item/FileItem.js.map +1 -1
- package/lib/cjs/components/file-list/file-item/FileItem.styles.js +25 -1
- package/lib/cjs/components/file-list/file-item/FileItem.styles.js.map +1 -1
- package/lib/cjs/components/file-select/FileSelect.js +27 -4
- package/lib/cjs/components/file-select/FileSelect.js.map +1 -1
- package/lib/cjs/components/file-select/FileSelect.styles.js +10 -0
- package/lib/cjs/components/file-select/FileSelect.styles.js.map +1 -1
- package/lib/cjs/components/filter/Filter.js +51 -16
- package/lib/cjs/components/filter/Filter.js.map +1 -1
- package/lib/cjs/components/filter/Filter.styles.js +9 -0
- package/lib/cjs/components/filter/Filter.styles.js.map +1 -1
- package/lib/cjs/components/filter/filter-content/FilterContent.js +14 -5
- package/lib/cjs/components/filter/filter-content/FilterContent.js.map +1 -1
- package/lib/cjs/components/filter/filter-content/FilterContent.types.js.map +1 -1
- package/lib/cjs/components/filter-buttons/FilterButtons.js +69 -4
- package/lib/cjs/components/filter-buttons/FilterButtons.js.map +1 -1
- package/lib/cjs/components/filter-buttons/filter-button/FilterButton.js +40 -2
- package/lib/cjs/components/filter-buttons/filter-button/FilterButton.js.map +1 -1
- package/lib/cjs/components/filter-buttons/filter-button/FilterButton.styles.js +11 -0
- package/lib/cjs/components/filter-buttons/filter-button/FilterButton.styles.js.map +1 -1
- package/lib/cjs/components/grid-image/GridImage.js +20 -2
- package/lib/cjs/components/grid-image/GridImage.js.map +1 -1
- package/lib/cjs/components/grid-image/GridImage.styles.js +11 -2
- package/lib/cjs/components/grid-image/GridImage.styles.js.map +1 -1
- package/lib/cjs/components/grouped-image/GroupedImage.js +23 -4
- package/lib/cjs/components/grouped-image/GroupedImage.js.map +1 -1
- package/lib/cjs/components/grouped-image/GroupedImage.styles.js +9 -0
- package/lib/cjs/components/grouped-image/GroupedImage.styles.js.map +1 -1
- package/lib/cjs/components/highlight-slider/HighlightSlider.js +13 -3
- package/lib/cjs/components/highlight-slider/HighlightSlider.js.map +1 -1
- package/lib/cjs/components/highlight-slider/highlight-slider-item/HighlightSliderItem.js +21 -4
- package/lib/cjs/components/highlight-slider/highlight-slider-item/HighlightSliderItem.js.map +1 -1
- package/lib/cjs/components/highlight-slider/highlight-slider-item/HighlightSliderItem.styles.js +11 -2
- package/lib/cjs/components/highlight-slider/highlight-slider-item/HighlightSliderItem.styles.js.map +1 -1
- package/lib/cjs/components/icon/Icon.js +24 -5
- package/lib/cjs/components/icon/Icon.js.map +1 -1
- package/lib/cjs/components/icon/Icon.styles.js +23 -0
- package/lib/cjs/components/icon/Icon.styles.js.map +1 -1
- package/lib/cjs/components/input/Input.js +29 -8
- package/lib/cjs/components/input/Input.js.map +1 -1
- package/lib/cjs/components/input/Input.styles.js +38 -3
- package/lib/cjs/components/input/Input.styles.js.map +1 -1
- package/lib/cjs/components/list/List.js +124 -37
- package/lib/cjs/components/list/List.js.map +1 -1
- package/lib/cjs/components/list/List.utils.js +213 -1
- package/lib/cjs/components/list/List.utils.js.map +1 -1
- package/lib/cjs/components/list/list-item/ListItem.js +84 -3
- package/lib/cjs/components/list/list-item/ListItem.js.map +1 -1
- package/lib/cjs/components/list/list-item/ListItem.styles.js +7 -0
- package/lib/cjs/components/list/list-item/ListItem.styles.js.map +1 -1
- package/lib/cjs/components/list/list-item/list-item-head/ListItemHead.js +5 -1
- package/lib/cjs/components/list/list-item/list-item-head/ListItemHead.js.map +1 -1
- package/lib/cjs/components/list/list-item/list-item-head/ListItemHead.styles.js +5 -1
- package/lib/cjs/components/list/list-item/list-item-head/ListItemHead.styles.js.map +1 -1
- package/lib/cjs/components/list/list-item/list-item-head/list-item-right-element/ListItemRightElement.js +1 -0
- package/lib/cjs/components/list/list-item/list-item-head/list-item-right-element/ListItemRightElement.js.map +1 -1
- package/lib/cjs/components/list/list-item/list-item-head/list-item-subtitle/ListItemSubtitle.js +3 -0
- package/lib/cjs/components/list/list-item/list-item-head/list-item-subtitle/ListItemSubtitle.js.map +1 -1
- package/lib/cjs/components/list/list-item/list-item-head/list-item-title/ListItemTitle.js +1 -0
- package/lib/cjs/components/list/list-item/list-item-head/list-item-title/ListItemTitle.js.map +1 -1
- package/lib/cjs/components/list/list-item/useListItemFocus.js +47 -0
- package/lib/cjs/components/list/list-item/useListItemFocus.js.map +1 -0
- package/lib/cjs/components/mention-finder/MentionFinder.js +43 -5
- package/lib/cjs/components/mention-finder/MentionFinder.js.map +1 -1
- package/lib/cjs/components/mention-finder/mention-finder-item/MentionFinderItem.styles.js.map +1 -1
- package/lib/cjs/components/multi-action-button/MultiActionButton.js +36 -3
- package/lib/cjs/components/multi-action-button/MultiActionButton.js.map +1 -1
- package/lib/cjs/components/multi-action-button/MultiActionButton.styles.js +6 -0
- package/lib/cjs/components/multi-action-button/MultiActionButton.styles.js.map +1 -1
- package/lib/cjs/components/multi-action-button/MultiActionButton.types.js.map +1 -1
- package/lib/cjs/components/multi-action-button/action-button/ActionButton.js +7 -1
- package/lib/cjs/components/multi-action-button/action-button/ActionButton.js.map +1 -1
- package/lib/cjs/components/multi-action-button/action-button/ActionButton.styles.js +12 -0
- package/lib/cjs/components/multi-action-button/action-button/ActionButton.styles.js.map +1 -1
- package/lib/cjs/components/number-input/NumberInput.js +13 -10
- package/lib/cjs/components/number-input/NumberInput.js.map +1 -1
- package/lib/cjs/components/page-provider/PageProvider.js +4 -2
- package/lib/cjs/components/page-provider/PageProvider.js.map +1 -1
- package/lib/cjs/components/popup/Popup.js +8 -1
- package/lib/cjs/components/popup/Popup.js.map +1 -1
- package/lib/cjs/components/radio-button/RadioButton.js +29 -15
- package/lib/cjs/components/radio-button/RadioButton.js.map +1 -1
- package/lib/cjs/components/radio-button/RadioButton.styles.js +19 -8
- package/lib/cjs/components/radio-button/RadioButton.styles.js.map +1 -1
- package/lib/cjs/components/radio-button/radio-button-group/RadioButtonGroup.js +7 -4
- package/lib/cjs/components/radio-button/radio-button-group/RadioButtonGroup.js.map +1 -1
- package/lib/cjs/components/search-box/SearchBox.js +21 -6
- package/lib/cjs/components/search-box/SearchBox.js.map +1 -1
- package/lib/cjs/components/search-input/SearchInput.js +56 -43
- package/lib/cjs/components/search-input/SearchInput.js.map +1 -1
- package/lib/cjs/components/search-input/SearchInput.styles.js +26 -2
- package/lib/cjs/components/search-input/SearchInput.styles.js.map +1 -1
- package/lib/cjs/components/select-button/SelectButton.js +4 -2
- package/lib/cjs/components/select-button/SelectButton.js.map +1 -1
- package/lib/cjs/components/setup-wizard/SetupWizard.js +10 -4
- package/lib/cjs/components/setup-wizard/SetupWizard.js.map +1 -1
- package/lib/cjs/components/setup-wizard/setup-wizard-item/SetupWizardItem.js +5 -3
- package/lib/cjs/components/setup-wizard/setup-wizard-item/SetupWizardItem.js.map +1 -1
- package/lib/cjs/components/sharing-bar/SharingBar.js +31 -6
- package/lib/cjs/components/sharing-bar/SharingBar.js.map +1 -1
- package/lib/cjs/components/sharing-bar/SharingBar.styles.js +5 -0
- package/lib/cjs/components/sharing-bar/SharingBar.styles.js.map +1 -1
- package/lib/cjs/components/sharing-button/SharingButton.js +4 -2
- package/lib/cjs/components/sharing-button/SharingButton.js.map +1 -1
- package/lib/cjs/components/sharing-context-menu/SharingContextMenu.js +3 -1
- package/lib/cjs/components/sharing-context-menu/SharingContextMenu.js.map +1 -1
- package/lib/cjs/components/signature/Signature.js +6 -3
- package/lib/cjs/components/signature/Signature.js.map +1 -1
- package/lib/cjs/components/slider/Slider.js +30 -7
- package/lib/cjs/components/slider/Slider.js.map +1 -1
- package/lib/cjs/components/slider/Slider.styles.js +9 -2
- package/lib/cjs/components/slider/Slider.styles.js.map +1 -1
- package/lib/cjs/components/slider-button/SliderButton.js +63 -6
- package/lib/cjs/components/slider-button/SliderButton.js.map +1 -1
- package/lib/cjs/components/slider-button/SliderButton.styles.js +15 -2
- package/lib/cjs/components/slider-button/SliderButton.styles.js.map +1 -1
- package/lib/cjs/components/slider-button/SliderButton.types.js +6 -0
- package/lib/cjs/components/slider-button/SliderButton.types.js.map +1 -0
- package/lib/cjs/components/slider-button/useSliderButtonPopupKeyboard.js +66 -0
- package/lib/cjs/components/slider-button/useSliderButtonPopupKeyboard.js.map +1 -0
- package/lib/cjs/components/slider-button/useSliderButtonThumbKeyboard.js +47 -0
- package/lib/cjs/components/slider-button/useSliderButtonThumbKeyboard.js.map +1 -0
- package/lib/cjs/components/tag-input/TagInput.js +92 -36
- package/lib/cjs/components/tag-input/TagInput.js.map +1 -1
- package/lib/cjs/components/tag-input/TagInput.styles.js +29 -3
- package/lib/cjs/components/tag-input/TagInput.styles.js.map +1 -1
- package/lib/cjs/components/text-area/TextArea.js +17 -8
- package/lib/cjs/components/text-area/TextArea.js.map +1 -1
- package/lib/cjs/components/text-area/TextArea.styles.js +15 -1
- package/lib/cjs/components/text-area/TextArea.styles.js.map +1 -1
- package/lib/cjs/components/truncation/Truncation.js +17 -3
- package/lib/cjs/components/truncation/Truncation.js.map +1 -1
- package/lib/cjs/components/truncation/Truncation.styles.js +18 -1
- package/lib/cjs/components/truncation/Truncation.styles.js.map +1 -1
- package/lib/cjs/hooks/useKeyboardFocusHighlighting.js +68 -0
- package/lib/cjs/hooks/useKeyboardFocusHighlighting.js.map +1 -0
- package/lib/cjs/utils/file.js.map +1 -1
- package/lib/cjs/utils/keyboardFocusHighlighting.styles.js +29 -0
- package/lib/cjs/utils/keyboardFocusHighlighting.styles.js.map +1 -0
- package/lib/esm/components/accordion/Accordion.js +105 -12
- package/lib/esm/components/accordion/Accordion.js.map +1 -1
- package/lib/esm/components/accordion/Accordion.styles.js +23 -3
- package/lib/esm/components/accordion/Accordion.styles.js.map +1 -1
- package/lib/esm/components/accordion/accordion-body/AccordionBody.styles.js +3 -1
- package/lib/esm/components/accordion/accordion-body/AccordionBody.styles.js.map +1 -1
- package/lib/esm/components/accordion/accordion-group/AccordionGroup.js +33 -19
- package/lib/esm/components/accordion/accordion-group/AccordionGroup.js.map +1 -1
- package/lib/esm/components/accordion/accordion-head/AccordionHead.js +6 -3
- package/lib/esm/components/accordion/accordion-head/AccordionHead.js.map +1 -1
- package/lib/esm/components/accordion/accordion-head/AccordionHead.styles.js +14 -0
- package/lib/esm/components/accordion/accordion-head/AccordionHead.styles.js.map +1 -1
- package/lib/esm/components/amount-control/AmountControl.js +30 -16
- package/lib/esm/components/amount-control/AmountControl.js.map +1 -1
- package/lib/esm/components/amount-control/AmountControl.styles.js +18 -2
- package/lib/esm/components/amount-control/AmountControl.styles.js.map +1 -1
- package/lib/esm/components/button/Button.js +5 -1
- package/lib/esm/components/button/Button.js.map +1 -1
- package/lib/esm/components/button/Button.styles.js +10 -0
- package/lib/esm/components/button/Button.styles.js.map +1 -1
- package/lib/esm/components/button/Button.types.js.map +1 -1
- package/lib/esm/components/checkbox/Checkbox.js +5 -1
- package/lib/esm/components/checkbox/Checkbox.js.map +1 -1
- package/lib/esm/components/checkbox/Checkbox.styles.js +29 -2
- package/lib/esm/components/checkbox/Checkbox.styles.js.map +1 -1
- package/lib/esm/components/color-scheme-provider/ColorSchemeProvider.js +7 -2
- package/lib/esm/components/color-scheme-provider/ColorSchemeProvider.js.map +1 -1
- package/lib/esm/components/color-scheme-provider/ColorSchemeProvider.styles.js +8 -2
- package/lib/esm/components/color-scheme-provider/ColorSchemeProvider.styles.js.map +1 -1
- package/lib/esm/components/combobox/ComboBox.js +61 -7
- package/lib/esm/components/combobox/ComboBox.js.map +1 -1
- package/lib/esm/components/combobox/ComboBox.styles.js +11 -0
- package/lib/esm/components/combobox/ComboBox.styles.js.map +1 -1
- package/lib/esm/components/combobox/ComboBox.types.js.map +1 -1
- package/lib/esm/components/context-menu/ContextMenu.js +145 -42
- package/lib/esm/components/context-menu/ContextMenu.js.map +1 -1
- package/lib/esm/components/context-menu/ContextMenu.styles.js +38 -0
- package/lib/esm/components/context-menu/ContextMenu.styles.js.map +1 -1
- package/lib/esm/components/context-menu/ContextMenu.types.js.map +1 -1
- package/lib/esm/components/context-menu/ContextMenu.utils.js +24 -0
- package/lib/esm/components/context-menu/ContextMenu.utils.js.map +1 -1
- package/lib/esm/components/context-menu/context-menu-content/ContextMenuContent.js +3 -8
- package/lib/esm/components/context-menu/context-menu-content/ContextMenuContent.js.map +1 -1
- package/lib/esm/components/file-input/FileInput.js +4 -2
- package/lib/esm/components/file-input/FileInput.js.map +1 -1
- package/lib/esm/components/file-list/file-item/FileItem.js +49 -26
- package/lib/esm/components/file-list/file-item/FileItem.js.map +1 -1
- package/lib/esm/components/file-list/file-item/FileItem.styles.js +24 -0
- package/lib/esm/components/file-list/file-item/FileItem.styles.js.map +1 -1
- package/lib/esm/components/file-select/FileSelect.js +27 -4
- package/lib/esm/components/file-select/FileSelect.js.map +1 -1
- package/lib/esm/components/file-select/FileSelect.styles.js +10 -0
- package/lib/esm/components/file-select/FileSelect.styles.js.map +1 -1
- package/lib/esm/components/filter/Filter.js +52 -16
- package/lib/esm/components/filter/Filter.js.map +1 -1
- package/lib/esm/components/filter/Filter.styles.js +9 -0
- package/lib/esm/components/filter/Filter.styles.js.map +1 -1
- package/lib/esm/components/filter/filter-content/FilterContent.js +15 -5
- package/lib/esm/components/filter/filter-content/FilterContent.js.map +1 -1
- package/lib/esm/components/filter/filter-content/FilterContent.types.js.map +1 -1
- package/lib/esm/components/filter-buttons/FilterButtons.js +69 -5
- package/lib/esm/components/filter-buttons/FilterButtons.js.map +1 -1
- package/lib/esm/components/filter-buttons/filter-button/FilterButton.js +40 -2
- package/lib/esm/components/filter-buttons/filter-button/FilterButton.js.map +1 -1
- package/lib/esm/components/filter-buttons/filter-button/FilterButton.styles.js +11 -0
- package/lib/esm/components/filter-buttons/filter-button/FilterButton.styles.js.map +1 -1
- package/lib/esm/components/grid-image/GridImage.js +20 -2
- package/lib/esm/components/grid-image/GridImage.js.map +1 -1
- package/lib/esm/components/grid-image/GridImage.styles.js +10 -1
- package/lib/esm/components/grid-image/GridImage.styles.js.map +1 -1
- package/lib/esm/components/grouped-image/GroupedImage.js +22 -4
- package/lib/esm/components/grouped-image/GroupedImage.js.map +1 -1
- package/lib/esm/components/grouped-image/GroupedImage.styles.js +9 -0
- package/lib/esm/components/grouped-image/GroupedImage.styles.js.map +1 -1
- package/lib/esm/components/highlight-slider/HighlightSlider.js +13 -3
- package/lib/esm/components/highlight-slider/HighlightSlider.js.map +1 -1
- package/lib/esm/components/highlight-slider/highlight-slider-item/HighlightSliderItem.js +20 -3
- package/lib/esm/components/highlight-slider/highlight-slider-item/HighlightSliderItem.js.map +1 -1
- package/lib/esm/components/highlight-slider/highlight-slider-item/HighlightSliderItem.styles.js +10 -1
- package/lib/esm/components/highlight-slider/highlight-slider-item/HighlightSliderItem.styles.js.map +1 -1
- package/lib/esm/components/icon/Icon.js +26 -7
- package/lib/esm/components/icon/Icon.js.map +1 -1
- package/lib/esm/components/icon/Icon.styles.js +23 -0
- package/lib/esm/components/icon/Icon.styles.js.map +1 -1
- package/lib/esm/components/input/Input.js +24 -4
- package/lib/esm/components/input/Input.js.map +1 -1
- package/lib/esm/components/input/Input.styles.js +38 -3
- package/lib/esm/components/input/Input.styles.js.map +1 -1
- package/lib/esm/components/list/List.js +123 -37
- package/lib/esm/components/list/List.js.map +1 -1
- package/lib/esm/components/list/List.utils.js +202 -0
- package/lib/esm/components/list/List.utils.js.map +1 -1
- package/lib/esm/components/list/list-item/ListItem.js +85 -4
- package/lib/esm/components/list/list-item/ListItem.js.map +1 -1
- package/lib/esm/components/list/list-item/ListItem.styles.js +7 -0
- package/lib/esm/components/list/list-item/ListItem.styles.js.map +1 -1
- package/lib/esm/components/list/list-item/list-item-head/ListItemHead.js +6 -2
- package/lib/esm/components/list/list-item/list-item-head/ListItemHead.js.map +1 -1
- package/lib/esm/components/list/list-item/list-item-head/ListItemHead.styles.js +4 -0
- package/lib/esm/components/list/list-item/list-item-head/ListItemHead.styles.js.map +1 -1
- package/lib/esm/components/list/list-item/list-item-head/list-item-right-element/ListItemRightElement.js +1 -0
- package/lib/esm/components/list/list-item/list-item-head/list-item-right-element/ListItemRightElement.js.map +1 -1
- package/lib/esm/components/list/list-item/list-item-head/list-item-subtitle/ListItemSubtitle.js +4 -1
- package/lib/esm/components/list/list-item/list-item-head/list-item-subtitle/ListItemSubtitle.js.map +1 -1
- package/lib/esm/components/list/list-item/list-item-head/list-item-title/ListItemTitle.js +1 -0
- package/lib/esm/components/list/list-item/list-item-head/list-item-title/ListItemTitle.js.map +1 -1
- package/lib/esm/components/list/list-item/useListItemFocus.js +40 -0
- package/lib/esm/components/list/list-item/useListItemFocus.js.map +1 -0
- package/lib/esm/components/mention-finder/MentionFinder.js +39 -3
- package/lib/esm/components/mention-finder/MentionFinder.js.map +1 -1
- package/lib/esm/components/mention-finder/mention-finder-item/MentionFinderItem.styles.js.map +1 -1
- package/lib/esm/components/multi-action-button/MultiActionButton.js +36 -3
- package/lib/esm/components/multi-action-button/MultiActionButton.js.map +1 -1
- package/lib/esm/components/multi-action-button/MultiActionButton.styles.js +6 -0
- package/lib/esm/components/multi-action-button/MultiActionButton.styles.js.map +1 -1
- package/lib/esm/components/multi-action-button/MultiActionButton.types.js.map +1 -1
- package/lib/esm/components/multi-action-button/action-button/ActionButton.js +7 -1
- package/lib/esm/components/multi-action-button/action-button/ActionButton.js.map +1 -1
- package/lib/esm/components/multi-action-button/action-button/ActionButton.styles.js +12 -0
- package/lib/esm/components/multi-action-button/action-button/ActionButton.styles.js.map +1 -1
- package/lib/esm/components/number-input/NumberInput.js +13 -10
- package/lib/esm/components/number-input/NumberInput.js.map +1 -1
- package/lib/esm/components/page-provider/PageProvider.js +4 -2
- package/lib/esm/components/page-provider/PageProvider.js.map +1 -1
- package/lib/esm/components/popup/Popup.js +8 -1
- package/lib/esm/components/popup/Popup.js.map +1 -1
- package/lib/esm/components/radio-button/RadioButton.js +29 -15
- package/lib/esm/components/radio-button/RadioButton.js.map +1 -1
- package/lib/esm/components/radio-button/RadioButton.styles.js +19 -8
- package/lib/esm/components/radio-button/RadioButton.styles.js.map +1 -1
- package/lib/esm/components/radio-button/radio-button-group/RadioButtonGroup.js +7 -4
- package/lib/esm/components/radio-button/radio-button-group/RadioButtonGroup.js.map +1 -1
- package/lib/esm/components/search-box/SearchBox.js +18 -4
- package/lib/esm/components/search-box/SearchBox.js.map +1 -1
- package/lib/esm/components/search-input/SearchInput.js +56 -44
- package/lib/esm/components/search-input/SearchInput.js.map +1 -1
- package/lib/esm/components/search-input/SearchInput.styles.js +25 -1
- package/lib/esm/components/search-input/SearchInput.styles.js.map +1 -1
- package/lib/esm/components/select-button/SelectButton.js +4 -2
- package/lib/esm/components/select-button/SelectButton.js.map +1 -1
- package/lib/esm/components/setup-wizard/SetupWizard.js +10 -4
- package/lib/esm/components/setup-wizard/SetupWizard.js.map +1 -1
- package/lib/esm/components/setup-wizard/setup-wizard-item/SetupWizardItem.js +5 -3
- package/lib/esm/components/setup-wizard/setup-wizard-item/SetupWizardItem.js.map +1 -1
- package/lib/esm/components/sharing-bar/SharingBar.js +30 -5
- package/lib/esm/components/sharing-bar/SharingBar.js.map +1 -1
- package/lib/esm/components/sharing-bar/SharingBar.styles.js +5 -0
- package/lib/esm/components/sharing-bar/SharingBar.styles.js.map +1 -1
- package/lib/esm/components/sharing-button/SharingButton.js +4 -2
- package/lib/esm/components/sharing-button/SharingButton.js.map +1 -1
- package/lib/esm/components/sharing-context-menu/SharingContextMenu.js +3 -1
- package/lib/esm/components/sharing-context-menu/SharingContextMenu.js.map +1 -1
- package/lib/esm/components/signature/Signature.js +6 -3
- package/lib/esm/components/signature/Signature.js.map +1 -1
- package/lib/esm/components/slider/Slider.js +30 -7
- package/lib/esm/components/slider/Slider.js.map +1 -1
- package/lib/esm/components/slider/Slider.styles.js +8 -1
- package/lib/esm/components/slider/Slider.styles.js.map +1 -1
- package/lib/esm/components/slider-button/SliderButton.js +62 -6
- package/lib/esm/components/slider-button/SliderButton.js.map +1 -1
- package/lib/esm/components/slider-button/SliderButton.styles.js +14 -1
- package/lib/esm/components/slider-button/SliderButton.styles.js.map +1 -1
- package/lib/esm/components/slider-button/SliderButton.types.js +2 -0
- package/lib/esm/components/slider-button/SliderButton.types.js.map +1 -0
- package/lib/esm/components/slider-button/useSliderButtonPopupKeyboard.js +56 -0
- package/lib/esm/components/slider-button/useSliderButtonPopupKeyboard.js.map +1 -0
- package/lib/esm/components/slider-button/useSliderButtonThumbKeyboard.js +38 -0
- package/lib/esm/components/slider-button/useSliderButtonThumbKeyboard.js.map +1 -0
- package/lib/esm/components/tag-input/TagInput.js +86 -35
- package/lib/esm/components/tag-input/TagInput.js.map +1 -1
- package/lib/esm/components/tag-input/TagInput.styles.js +27 -1
- package/lib/esm/components/tag-input/TagInput.styles.js.map +1 -1
- package/lib/esm/components/text-area/TextArea.js +18 -9
- package/lib/esm/components/text-area/TextArea.js.map +1 -1
- package/lib/esm/components/text-area/TextArea.styles.js +14 -0
- package/lib/esm/components/text-area/TextArea.styles.js.map +1 -1
- package/lib/esm/components/truncation/Truncation.js +18 -4
- package/lib/esm/components/truncation/Truncation.js.map +1 -1
- package/lib/esm/components/truncation/Truncation.styles.js +17 -0
- package/lib/esm/components/truncation/Truncation.styles.js.map +1 -1
- package/lib/esm/hooks/useKeyboardFocusHighlighting.js +61 -0
- package/lib/esm/hooks/useKeyboardFocusHighlighting.js.map +1 -0
- package/lib/esm/utils/file.js.map +1 -1
- package/lib/esm/utils/keyboardFocusHighlighting.styles.js +24 -0
- package/lib/esm/utils/keyboardFocusHighlighting.styles.js.map +1 -0
- package/lib/types/components/accordion/Accordion.d.ts +5 -0
- package/lib/types/components/accordion/Accordion.styles.d.ts +8 -4
- package/lib/types/components/accordion/accordion-body/AccordionBody.styles.d.ts +2 -2
- package/lib/types/components/accordion/accordion-group/AccordionGroup.d.ts +7 -2
- package/lib/types/components/accordion/accordion-head/AccordionHead.d.ts +1 -0
- package/lib/types/components/accordion/accordion-head/AccordionHead.styles.d.ts +18 -18
- package/lib/types/components/amount-control/AmountControl.d.ts +5 -0
- package/lib/types/components/amount-control/AmountControl.styles.d.ts +8 -4
- package/lib/types/components/button/Button.styles.d.ts +8 -6
- package/lib/types/components/button/Button.types.d.ts +8 -0
- package/lib/types/components/checkbox/Checkbox.d.ts +4 -0
- package/lib/types/components/checkbox/Checkbox.styles.d.ts +5 -1
- package/lib/types/components/color-scheme-provider/ColorSchemeProvider.d.ts +5 -0
- package/lib/types/components/combobox/ComboBox.styles.d.ts +4 -2
- package/lib/types/components/combobox/ComboBox.types.d.ts +5 -0
- package/lib/types/components/context-menu/ContextMenu.styles.d.ts +4 -2
- package/lib/types/components/context-menu/ContextMenu.types.d.ts +6 -0
- package/lib/types/components/context-menu/ContextMenu.utils.d.ts +10 -0
- package/lib/types/components/context-menu/context-menu-content/ContextMenuContent.d.ts +1 -1
- package/lib/types/components/context-menu/context-menu-content/ContextMenuContent.styles.d.ts +2 -2
- package/lib/types/components/dropdown-body-wrapper/delayed-dropdown-content/DelayedDropdownContent.styles.d.ts +2 -2
- package/lib/types/components/expandable-content/ExpandableContent.styles.d.ts +2 -2
- package/lib/types/components/file-input/FileInput.d.ts +4 -0
- package/lib/types/components/file-input/FileInput.styles.d.ts +2 -2
- package/lib/types/components/file-list/file-item/FileItem.styles.d.ts +3 -0
- package/lib/types/components/file-select/FileSelect.d.ts +4 -0
- package/lib/types/components/file-select/FileSelect.styles.d.ts +6 -4
- package/lib/types/components/filter/Filter.d.ts +1 -0
- package/lib/types/components/filter/Filter.styles.d.ts +6 -4
- package/lib/types/components/filter/filter-content/FilterContent.types.d.ts +4 -0
- package/lib/types/components/filter-buttons/FilterButtons.d.ts +4 -0
- package/lib/types/components/filter-buttons/filter-button/FilterButton.d.ts +5 -0
- package/lib/types/components/filter-buttons/filter-button/FilterButton.styles.d.ts +12 -8
- package/lib/types/components/grid-image/GridImage.d.ts +4 -0
- package/lib/types/components/grid-image/GridImage.styles.d.ts +4 -2
- package/lib/types/components/grouped-image/GroupedImage.d.ts +4 -0
- package/lib/types/components/grouped-image/GroupedImage.styles.d.ts +8 -6
- package/lib/types/components/highlight-slider/HighlightSlider.d.ts +4 -0
- package/lib/types/components/highlight-slider/highlight-slider-item/HighlightSliderItem.d.ts +3 -0
- package/lib/types/components/highlight-slider/highlight-slider-item/HighlightSliderItem.styles.d.ts +9 -5
- package/lib/types/components/icon/Icon.d.ts +4 -0
- package/lib/types/components/icon/Icon.styles.d.ts +1 -0
- package/lib/types/components/input/Input.d.ts +4 -0
- package/lib/types/components/input/Input.styles.d.ts +17 -9
- package/lib/types/components/list/List.d.ts +11 -0
- package/lib/types/components/list/List.utils.d.ts +32 -1
- package/lib/types/components/list/list-item/ListItem.d.ts +4 -0
- package/lib/types/components/list/list-item/ListItem.styles.d.ts +64 -64
- package/lib/types/components/list/list-item/list-item-body/ListItemBody.styles.d.ts +2 -2
- package/lib/types/components/list/list-item/list-item-head/ListItemHead.styles.d.ts +195 -194
- package/lib/types/components/list/list-item/useListItemFocus.d.ts +13 -0
- package/lib/types/components/masonry/masonry-item/MasonryItem.styles.d.ts +2 -2
- package/lib/types/components/mention-finder/MentionFinder.styles.d.ts +4 -4
- package/lib/types/components/multi-action-button/MultiActionButton.styles.d.ts +2 -2
- package/lib/types/components/multi-action-button/MultiActionButton.types.d.ts +7 -0
- package/lib/types/components/multi-action-button/action-button/ActionButton.d.ts +4 -1
- package/lib/types/components/multi-action-button/action-button/ActionButton.styles.d.ts +4 -2
- package/lib/types/components/number-input/NumberInput.d.ts +4 -0
- package/lib/types/components/popup/popup-content-wrapper/PopupContentWrapper.styles.d.ts +2 -2
- package/lib/types/components/progress-bar/ProgressBar.styles.d.ts +6 -6
- package/lib/types/components/radio-button/RadioButton.d.ts +4 -0
- package/lib/types/components/radio-button/RadioButton.styles.d.ts +15 -9
- package/lib/types/components/radio-button/radio-button-group/RadioButtonGroup.d.ts +5 -0
- package/lib/types/components/search-box/SearchBox.d.ts +4 -0
- package/lib/types/components/search-box/SearchBox.styles.d.ts +2 -2
- package/lib/types/components/search-input/SearchInput.d.ts +4 -0
- package/lib/types/components/search-input/SearchInput.styles.d.ts +17 -9
- package/lib/types/components/select-button/SelectButton.d.ts +4 -0
- package/lib/types/components/setup-wizard/SetupWizard.d.ts +5 -0
- package/lib/types/components/sharing-bar/SharingBar.d.ts +4 -0
- package/lib/types/components/sharing-button/SharingButton.d.ts +1 -1
- package/lib/types/components/sharing-context-menu/SharingContextMenu.d.ts +10 -2
- package/lib/types/components/signature/Signature.d.ts +4 -0
- package/lib/types/components/skeleton/base-skeleton/BaseSkeleton.styles.d.ts +4 -4
- package/lib/types/components/slider/Slider.d.ts +8 -0
- package/lib/types/components/slider/Slider.styles.d.ts +18 -14
- package/lib/types/components/slider-button/SliderButton.d.ts +1 -28
- package/lib/types/components/slider-button/SliderButton.styles.d.ts +6 -4
- package/lib/types/components/slider-button/SliderButton.types.d.ts +32 -0
- package/lib/types/components/slider-button/useSliderButtonPopupKeyboard.d.ts +17 -0
- package/lib/types/components/slider-button/useSliderButtonThumbKeyboard.d.ts +13 -0
- package/lib/types/components/tag-input/TagInput.d.ts +4 -0
- package/lib/types/components/tag-input/TagInput.styles.d.ts +12 -2
- package/lib/types/components/text-area/TextArea.d.ts +4 -0
- package/lib/types/components/text-area/TextArea.styles.d.ts +1 -0
- package/lib/types/components/truncation/Truncation.d.ts +4 -0
- package/lib/types/components/truncation/Truncation.styles.d.ts +7 -2
- package/lib/types/hooks/useKeyboardFocusHighlighting.d.ts +5 -0
- package/lib/types/utils/file.d.ts +1 -1
- package/lib/types/utils/keyboardFocusHighlighting.styles.d.ts +9 -0
- package/package.json +3 -3
package/AGENTS.md
CHANGED
|
@@ -4664,6 +4664,18 @@ import { TagInput } from '@chayns-components/core';
|
|
|
4664
4664
|
/>
|
|
4665
4665
|
```
|
|
4666
4666
|
|
|
4667
|
+
#### With Keyboard Highlighting
|
|
4668
|
+
|
|
4669
|
+
```tsx
|
|
4670
|
+
<TagInput
|
|
4671
|
+
tags={[
|
|
4672
|
+
{ id: 'pizza', text: 'Pizza' },
|
|
4673
|
+
{ id: 'nudeln', text: 'Nudeln' },
|
|
4674
|
+
]}
|
|
4675
|
+
shouldEnableKeyboardHighlighting
|
|
4676
|
+
/>
|
|
4677
|
+
```
|
|
4678
|
+
|
|
4667
4679
|
### Props
|
|
4668
4680
|
|
|
4669
4681
|
No prop documentation available.
|
|
@@ -7,7 +7,9 @@ exports.default = exports.AccordionContext = void 0;
|
|
|
7
7
|
var _react = require("motion/react");
|
|
8
8
|
var _react2 = _interopRequireWildcard(require("react"));
|
|
9
9
|
var _uuid = require("../../hooks/uuid");
|
|
10
|
+
var _useKeyboardFocusHighlighting = require("../../hooks/useKeyboardFocusHighlighting");
|
|
10
11
|
var _AreaContextProvider = require("../area-provider/AreaContextProvider");
|
|
12
|
+
var _ColorSchemeProvider = require("../color-scheme-provider/ColorSchemeProvider");
|
|
11
13
|
var _AccordionBody = _interopRequireDefault(require("./accordion-body/AccordionBody"));
|
|
12
14
|
var _AccordionGroup = require("./accordion-group/AccordionGroup");
|
|
13
15
|
var _AccordionHead = _interopRequireDefault(require("./accordion-head/AccordionHead"));
|
|
@@ -49,14 +51,19 @@ const Accordion = ({
|
|
|
49
51
|
shouldSkipAnimation: shouldSkipAnimationProp = false,
|
|
50
52
|
colors,
|
|
51
53
|
shouldIndex = false,
|
|
52
|
-
onBodyAnimationComplete
|
|
54
|
+
onBodyAnimationComplete,
|
|
55
|
+
shouldEnableKeyboardHighlighting
|
|
53
56
|
}) => {
|
|
54
57
|
const {
|
|
55
58
|
isWrapped: groupIsWrapped,
|
|
56
59
|
openAccordionUuid,
|
|
57
60
|
accordionGroupUuid,
|
|
58
61
|
accordionUuids,
|
|
59
|
-
updateOpenAccordionUuid
|
|
62
|
+
updateOpenAccordionUuid,
|
|
63
|
+
activeAccordionUuid,
|
|
64
|
+
updateActiveAccordionUuid,
|
|
65
|
+
registerAccordionUuid,
|
|
66
|
+
unregisterAccordionUuid
|
|
60
67
|
} = (0, _react2.useContext)(_AccordionGroup.AccordionGroupContext);
|
|
61
68
|
const {
|
|
62
69
|
isWrapped: isParentWrapped
|
|
@@ -64,8 +71,11 @@ const Accordion = ({
|
|
|
64
71
|
const {
|
|
65
72
|
isWrapped: contextIsWrapped
|
|
66
73
|
} = (0, _react2.useContext)(_AccordionContextProvider.AccordionWrappedContext);
|
|
74
|
+
const colorScheme = (0, _ColorSchemeProvider.useColorScheme)();
|
|
75
|
+
const shouldEnableKeyboardHighlightingEffective = shouldEnableKeyboardHighlighting ?? (colorScheme === null || colorScheme === void 0 ? void 0 : colorScheme.shouldEnableKeyboardHighlighting) ?? false;
|
|
67
76
|
const isWrapped = (0, _react2.useMemo)(() => groupIsWrapped ?? contextIsWrapped, [contextIsWrapped, groupIsWrapped]);
|
|
68
77
|
const [isAccordionOpen, setIsAccordionOpen] = (0, _react2.useState)(isDefaultOpen ?? isOpened);
|
|
78
|
+
const [isGroupFocusWithin, setIsGroupFocusWithin] = (0, _react2.useState)(false);
|
|
69
79
|
const uuid = (0, _uuid.useUuid)();
|
|
70
80
|
const isInitialRenderRef = (0, _react2.useRef)(true);
|
|
71
81
|
const initialRenderSkipRef = (0, _ref.useInitialRenderRef)(true);
|
|
@@ -75,6 +85,18 @@ const Accordion = ({
|
|
|
75
85
|
const isOpenRef = (0, _react2.useRef)(isOpen);
|
|
76
86
|
const onCloseRef = (0, _react2.useRef)(onClose);
|
|
77
87
|
const onOpenRef = (0, _react2.useRef)(onOpen);
|
|
88
|
+
const shouldShowKeyboardHighlighting = (0, _useKeyboardFocusHighlighting.useKeyboardFocusHighlighting)(shouldEnableKeyboardHighlightingEffective);
|
|
89
|
+
const isKeyboardFocusable = !isDisabled && (shouldIndex || shouldEnableKeyboardHighlightingEffective);
|
|
90
|
+
const isInKeyboardNavigationGroup = isKeyboardFocusable && typeof updateActiveAccordionUuid === 'function' && typeof accordionGroupUuid === 'string';
|
|
91
|
+
(0, _react2.useEffect)(() => {
|
|
92
|
+
if (typeof accordionGroupUuid === 'string' && typeof registerAccordionUuid === 'function' && typeof unregisterAccordionUuid === 'function') {
|
|
93
|
+
registerAccordionUuid(uuid);
|
|
94
|
+
return () => {
|
|
95
|
+
unregisterAccordionUuid(uuid);
|
|
96
|
+
};
|
|
97
|
+
}
|
|
98
|
+
return undefined;
|
|
99
|
+
}, [accordionGroupUuid, registerAccordionUuid, unregisterAccordionUuid, uuid]);
|
|
78
100
|
const isLastAccordion = (0, _react2.useMemo)(() => accordionUuids ? accordionUuids[accordionUuids.length - 1] === uuid : false, [accordionUuids, uuid]);
|
|
79
101
|
(0, _react2.useEffect)(() => {
|
|
80
102
|
isOpenRef.current = isOpen;
|
|
@@ -85,11 +107,14 @@ const Accordion = ({
|
|
|
85
107
|
if (isDisabled) {
|
|
86
108
|
return;
|
|
87
109
|
}
|
|
110
|
+
if (isKeyboardFocusable && typeof updateActiveAccordionUuid === 'function') {
|
|
111
|
+
updateActiveAccordionUuid(uuid);
|
|
112
|
+
}
|
|
88
113
|
if (typeof updateOpenAccordionUuid === 'function') {
|
|
89
114
|
updateOpenAccordionUuid(uuid);
|
|
90
115
|
}
|
|
91
116
|
setIsAccordionOpen(currentIsAccordionOpen => !currentIsAccordionOpen);
|
|
92
|
-
}, [isDisabled, updateOpenAccordionUuid, uuid]);
|
|
117
|
+
}, [isDisabled, isKeyboardFocusable, updateActiveAccordionUuid, updateOpenAccordionUuid, uuid]);
|
|
93
118
|
(0, _react2.useEffect)(() => {
|
|
94
119
|
if (isDisabled && isOpen) {
|
|
95
120
|
if (typeof updateOpenAccordionUuid === 'function') {
|
|
@@ -153,6 +178,77 @@ const Accordion = ({
|
|
|
153
178
|
opacity: 0
|
|
154
179
|
};
|
|
155
180
|
}, [isOpen, shouldSkipAnimation]);
|
|
181
|
+
const tabIndex = (0, _react2.useMemo)(() => isKeyboardFocusable ? 0 : -1, [isKeyboardFocusable]);
|
|
182
|
+
const handleKeyDown = (0, _react2.useCallback)(e => {
|
|
183
|
+
const isCurrentAccordionTarget = e.currentTarget === e.target;
|
|
184
|
+
if (isCurrentAccordionTarget && isInKeyboardNavigationGroup && accordionUuids !== null && accordionUuids !== void 0 && accordionUuids.length && (e.key === 'ArrowDown' || e.key === 'ArrowUp')) {
|
|
185
|
+
const currentIndex = accordionUuids.indexOf(uuid);
|
|
186
|
+
if (currentIndex !== -1) {
|
|
187
|
+
const nextIndex = e.key === 'ArrowDown' ? (currentIndex + 1) % accordionUuids.length : (currentIndex - 1 + accordionUuids.length) % accordionUuids.length;
|
|
188
|
+
const nextAccordionUuid = accordionUuids[nextIndex];
|
|
189
|
+
if (nextAccordionUuid && nextAccordionUuid !== uuid) {
|
|
190
|
+
const nextAccordionElement = document.querySelector(`[data-uuid="${accordionGroupUuid}---${nextAccordionUuid}"]`);
|
|
191
|
+
if (nextAccordionElement) {
|
|
192
|
+
updateActiveAccordionUuid(nextAccordionUuid);
|
|
193
|
+
nextAccordionElement.focus();
|
|
194
|
+
return;
|
|
195
|
+
}
|
|
196
|
+
}
|
|
197
|
+
}
|
|
198
|
+
}
|
|
199
|
+
if (isCurrentAccordionTarget && (e.key === 'Enter' || e.key === ' ') && isKeyboardFocusable) {
|
|
200
|
+
handleHeadClick();
|
|
201
|
+
}
|
|
202
|
+
if (isCurrentAccordionTarget && e.key === 'ArrowRight' && isKeyboardFocusable && !isOpen) {
|
|
203
|
+
e.preventDefault();
|
|
204
|
+
handleHeadClick();
|
|
205
|
+
}
|
|
206
|
+
if (isCurrentAccordionTarget && (e.key === 'Escape' || e.key === 'ArrowLeft')) {
|
|
207
|
+
if (isOpen && isKeyboardFocusable) {
|
|
208
|
+
e.preventDefault();
|
|
209
|
+
handleHeadClick();
|
|
210
|
+
return;
|
|
211
|
+
}
|
|
212
|
+
if (isInKeyboardNavigationGroup && typeof updateActiveAccordionUuid === 'function') {
|
|
213
|
+
var _e$currentTarget$pare;
|
|
214
|
+
e.preventDefault();
|
|
215
|
+
updateActiveAccordionUuid(undefined);
|
|
216
|
+
let parentAccordion = (_e$currentTarget$pare = e.currentTarget.parentElement) === null || _e$currentTarget$pare === void 0 ? void 0 : _e$currentTarget$pare.closest('.beta-chayns-accordion');
|
|
217
|
+
while (parentAccordion) {
|
|
218
|
+
var _parentAccordion$getA, _parentAccordion$pare;
|
|
219
|
+
const parentGroupId = (_parentAccordion$getA = parentAccordion.getAttribute('data-uuid')) === null || _parentAccordion$getA === void 0 ? void 0 : _parentAccordion$getA.split('---')[0];
|
|
220
|
+
if (parentGroupId !== accordionGroupUuid) {
|
|
221
|
+
parentAccordion.focus();
|
|
222
|
+
break;
|
|
223
|
+
}
|
|
224
|
+
parentAccordion = (_parentAccordion$pare = parentAccordion.parentElement) === null || _parentAccordion$pare === void 0 ? void 0 : _parentAccordion$pare.closest('.beta-chayns-accordion');
|
|
225
|
+
}
|
|
226
|
+
}
|
|
227
|
+
}
|
|
228
|
+
}, [accordionGroupUuid, accordionUuids, handleHeadClick, isInKeyboardNavigationGroup, isKeyboardFocusable, isOpen, updateActiveAccordionUuid, uuid]);
|
|
229
|
+
const handleFocus = (0, _react2.useCallback)(e => {
|
|
230
|
+
if (e.currentTarget === e.target && isInKeyboardNavigationGroup && typeof updateActiveAccordionUuid === 'function') {
|
|
231
|
+
setIsGroupFocusWithin(true);
|
|
232
|
+
updateActiveAccordionUuid(uuid);
|
|
233
|
+
}
|
|
234
|
+
}, [isInKeyboardNavigationGroup, updateActiveAccordionUuid, uuid]);
|
|
235
|
+
const handleBlur = (0, _react2.useCallback)(e => {
|
|
236
|
+
if (isInKeyboardNavigationGroup && typeof updateActiveAccordionUuid === 'function' && typeof accordionGroupUuid === 'string') {
|
|
237
|
+
const nextFocusedElement = e.relatedTarget;
|
|
238
|
+
const currentGroupElement = e.currentTarget;
|
|
239
|
+
if (!nextFocusedElement || !currentGroupElement.contains(nextFocusedElement)) {
|
|
240
|
+
setIsGroupFocusWithin(false);
|
|
241
|
+
updateActiveAccordionUuid(undefined);
|
|
242
|
+
}
|
|
243
|
+
}
|
|
244
|
+
}, [accordionGroupUuid, isInKeyboardNavigationGroup, updateActiveAccordionUuid]);
|
|
245
|
+
(0, _react2.useEffect)(() => {
|
|
246
|
+
if (!isInKeyboardNavigationGroup) {
|
|
247
|
+
setIsGroupFocusWithin(false);
|
|
248
|
+
} else if (activeAccordionUuid == null && typeof updateActiveAccordionUuid === 'function' && (accordionUuids === null || accordionUuids === void 0 ? void 0 : accordionUuids[0]) === uuid) {
|
|
249
|
+
updateActiveAccordionUuid(uuid);
|
|
250
|
+
}
|
|
251
|
+
}, [accordionUuids, activeAccordionUuid, isInKeyboardNavigationGroup, updateActiveAccordionUuid, uuid]);
|
|
156
252
|
return /*#__PURE__*/_react2.default.createElement(_Accordion.StyledMotionAccordion, {
|
|
157
253
|
animate: {
|
|
158
254
|
height: 'auto',
|
|
@@ -166,7 +262,7 @@ const Accordion = ({
|
|
|
166
262
|
},
|
|
167
263
|
initial: initialAnimation,
|
|
168
264
|
$isOpen: isOpen,
|
|
169
|
-
tabIndex:
|
|
265
|
+
tabIndex: tabIndex,
|
|
170
266
|
$shouldShowLines: !isLastAccordion || !isWrapped,
|
|
171
267
|
$isParentWrapped: isParentWrapped,
|
|
172
268
|
$isWrapped: isWrapped,
|
|
@@ -174,13 +270,11 @@ const Accordion = ({
|
|
|
174
270
|
$shouldHideBackground: shouldHideBackground,
|
|
175
271
|
$shouldHideBottomLine: shouldHideBottomLine,
|
|
176
272
|
$bottomBorderColor: colors === null || colors === void 0 ? void 0 : colors.borderBottomColor,
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
}
|
|
183
|
-
},
|
|
273
|
+
$shouldEnableKeyboardHighlighting: shouldEnableKeyboardHighlightingEffective,
|
|
274
|
+
$shouldShowKeyboardHighlighting: shouldShowKeyboardHighlighting,
|
|
275
|
+
onKeyDown: handleKeyDown,
|
|
276
|
+
onFocus: handleFocus,
|
|
277
|
+
onBlur: handleBlur,
|
|
184
278
|
onMouseEnter: onHoverStart,
|
|
185
279
|
onMouseLeave: onHoverEnd,
|
|
186
280
|
transition: {
|
|
@@ -210,7 +304,8 @@ const Accordion = ({
|
|
|
210
304
|
titleElement: titleElement,
|
|
211
305
|
onTitleInputChange: onTitleInputChange,
|
|
212
306
|
titleInputProps: titleInputProps,
|
|
213
|
-
titleColor: colors === null || colors === void 0 ? void 0 : colors.titleColor
|
|
307
|
+
titleColor: colors === null || colors === void 0 ? void 0 : colors.titleColor,
|
|
308
|
+
shouldEnableKeyboardHighlighting: shouldEnableKeyboardHighlightingEffective
|
|
214
309
|
}), /*#__PURE__*/_react2.default.createElement(_react.AnimatePresence, {
|
|
215
310
|
initial: false
|
|
216
311
|
}, (isOpen || shouldRenderClosed) && /*#__PURE__*/_react2.default.createElement(_AccordionBody.default, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Accordion.js","names":["_react","require","_react2","_interopRequireWildcard","_uuid","_AreaContextProvider","_AccordionBody","_interopRequireDefault","_AccordionGroup","_AccordionHead","_AccordionContextProvider","_Accordion","_ref","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","AccordionContext","exports","React","createContext","isWrapped","undefined","Accordion","bodyMaxHeight","children","icon","isDefaultOpen","isDisabled","isFixed","isOpened","isTitleGreyed","onBodyScroll","onClose","onHoverEnd","onHoverStart","onOpen","onSearchChange","rightElement","searchPlaceholder","searchValue","shouldForceBackground","shouldHideBackground","shouldRenderClosed","shouldRotateIcon","shouldHideBottomLine","title","titleElement","onTitleInputChange","titleInputProps","shouldSkipAnimation","shouldSkipAnimationProp","colors","shouldIndex","onBodyAnimationComplete","groupIsWrapped","openAccordionUuid","accordionGroupUuid","accordionUuids","updateOpenAccordionUuid","useContext","AccordionGroupContext","isParentWrapped","contextIsWrapped","AccordionWrappedContext","useMemo","isAccordionOpen","setIsAccordionOpen","useState","uuid","useUuid","isInitialRenderRef","useRef","initialRenderSkipRef","useInitialRenderRef","current","isInGroup","isOpen","isOpenRef","onCloseRef","onOpenRef","isLastAccordion","length","useEffect","handleHeadClick","useCallback","currentIsAccordionOpen","shouldOnlyOpen","accordionContextProviderValue","areaContextProviderValue","shouldChangeColor","accordionWrappedContextProviderValue","initialAnimation","height","opacity","createElement","StyledMotionAccordion","animate","className","exit","initial","$isOpen","tabIndex","$shouldShowLines","$isParentWrapped","$isWrapped","$shouldForceBackground","$shouldHideBackground","$shouldHideBottomLine","$bottomBorderColor","borderBottomColor","onKeyDown","key","target","includes","preventDefault","stopPropagation","onMouseEnter","onMouseLeave","transition","duration","Provider","value","MotionConfig","type","onClick","titleColor","AnimatePresence","maxHeight","onScroll","onAnimationComplete","shouldHideBody","AreaContext","displayName","_default"],"sources":["../../../../src/components/accordion/Accordion.tsx"],"sourcesContent":["import { AnimatePresence, MotionConfig } from 'motion/react';\nimport React, {\n ChangeEventHandler,\n type CSSProperties,\n FC,\n type MouseEventHandler,\n ReactNode,\n UIEvent,\n useCallback,\n useContext,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport { useUuid } from '../../hooks/uuid';\nimport { AreaContext } from '../area-provider/AreaContextProvider';\nimport type { InputProps } from '../input/Input';\nimport AccordionBody from './accordion-body/AccordionBody';\nimport { AccordionGroupContext } from './accordion-group/AccordionGroup';\nimport AccordionHead from './accordion-head/AccordionHead';\nimport { AccordionWrappedContext } from './accordion-provider/AccordionContextProvider';\nimport { StyledMotionAccordion } from './Accordion.styles';\nimport { useInitialRenderRef } from '../../hooks/ref';\n\nexport const AccordionContext = React.createContext<{ isWrapped?: boolean }>({\n isWrapped: undefined,\n});\n\ntype AccordionColors = {\n titleColor?: CSSProperties['color'];\n borderBottomColor?: CSSProperties['borderBottomColor'];\n};\n\nexport type AccordionProps = {\n /**\n * Maximum height of the accordion body element. This automatically makes the content of the\n * body element scrollable.\n */\n bodyMaxHeight?: number;\n /**\n * The content of the accordion body\n */\n children: ReactNode;\n /**\n * The icon that is displayed in front of the title\n */\n icon?: string;\n /**\n * This can be used to automatically expand the Accordion during the first render.\n */\n isDefaultOpen?: boolean;\n /**\n * This will disable the Accordion so that it cannot be opened and will gray out the title. Does not work with isOpened.\n */\n isDisabled?: boolean;\n /**\n * This can be used so that the Accordion cannot be opened or closed.\n * In addition, in this case the icon is exchanged to mark the Accordions.\n */\n isFixed?: boolean;\n /**\n * This can be used to open the Accordion from the outside\n */\n isOpened?: boolean;\n /**\n * This will gray out the title of the Accordion to indicate hidden content, for example.\n */\n isTitleGreyed?: boolean;\n /**\n * Function that is executed when the accordion body will be scrolled\n */\n onBodyScroll?: (event: UIEvent<HTMLDivElement>) => void;\n /**\n * Function that is executed when the accordion will be closed.\n */\n onClose?: VoidFunction;\n /**\n * Function to be executed when the accordion is no longer hovered.\n */\n onHoverEnd?: MouseEventHandler<HTMLDivElement>;\n /**\n * Function to be executed when the accordion is hovered.\n */\n onHoverStart?: MouseEventHandler<HTMLDivElement>;\n /**\n * Function that is executed when the accordion will be opened.\n */\n onOpen?: VoidFunction;\n /**\n * Function that is executed when the accordion body is animated\n */\n onBodyAnimationComplete?: VoidFunction;\n /**\n * Function that is executed when the text of the search in the accordion\n * head changes. When this function is given, the search field is displayed\n * in the Accordion Head.\n */\n onSearchChange?: ChangeEventHandler<HTMLInputElement>;\n /**\n * Function that is executed when the text of the search in the accordion\n * title changes. When this function is given, the search field is displayed\n * as the Accordion title.\n */\n onTitleInputChange?: ChangeEventHandler<HTMLInputElement>;\n /**\n * Content to be displayed on the right side in the head of the Accordion\n */\n rightElement?: ReactNode;\n /**\n * The placeholder to be used for the search\n */\n searchPlaceholder?: string;\n /**\n * The value that is displayed inside the search\n */\n searchValue?: string;\n /**\n * This will force the background color of the accordion to be used even if it is closed and not hovered.\n */\n shouldForceBackground?: boolean;\n /**\n * This will hide the background color of the accordion\n */\n shouldHideBackground?: boolean;\n /**\n * Whether the bottom line should be hidden.\n */\n shouldHideBottomLine?: boolean;\n /**\n * This will render the Accordion closed on the first render.\n */\n shouldRenderClosed?: boolean;\n /**\n * Whether the icon should be rotating.\n */\n shouldRotateIcon?: boolean;\n /**\n * Whether the animation should be skipped.\n * If 'isDefaultOpen' is true the initial animation will be skipped even this prop is false\n */\n shouldSkipAnimation?: boolean;\n /**\n * Title of the Accordion displayed in the head\n */\n title?: string;\n /**\n * Additional elements to be displayed in the header next to the title.\n */\n titleElement?: ReactNode;\n /**\n * The props of the title Input.\n */\n titleInputProps?: InputProps;\n /**\n * Provide custom colors to the Accordion Component\n */\n colors?: AccordionColors;\n /**\n * Whether the accordion should be indexed.\n */\n shouldIndex?: boolean;\n};\n\nconst Accordion: FC<AccordionProps> = ({\n bodyMaxHeight,\n children,\n icon,\n isDefaultOpen = false,\n isDisabled = false,\n isFixed = false,\n isOpened,\n isTitleGreyed = false,\n onBodyScroll,\n onClose,\n onHoverEnd,\n onHoverStart,\n onOpen,\n onSearchChange,\n rightElement,\n searchPlaceholder,\n searchValue,\n shouldForceBackground = false,\n shouldHideBackground = false,\n shouldRenderClosed = false,\n shouldRotateIcon = true,\n shouldHideBottomLine = false,\n title,\n titleElement,\n onTitleInputChange,\n titleInputProps,\n shouldSkipAnimation: shouldSkipAnimationProp = false,\n colors,\n shouldIndex = false,\n onBodyAnimationComplete,\n}) => {\n const {\n isWrapped: groupIsWrapped,\n openAccordionUuid,\n accordionGroupUuid,\n accordionUuids,\n updateOpenAccordionUuid,\n } = useContext(AccordionGroupContext);\n const { isWrapped: isParentWrapped } = useContext(AccordionContext);\n\n const { isWrapped: contextIsWrapped } = useContext(AccordionWrappedContext);\n const isWrapped = useMemo(\n () => groupIsWrapped ?? contextIsWrapped,\n [contextIsWrapped, groupIsWrapped],\n );\n\n const [isAccordionOpen, setIsAccordionOpen] = useState<boolean>(isDefaultOpen ?? isOpened);\n\n const uuid = useUuid();\n\n const isInitialRenderRef = useRef(true);\n\n const initialRenderSkipRef = useInitialRenderRef(true);\n\n const shouldSkipAnimation =\n shouldSkipAnimationProp ?? (initialRenderSkipRef.current && isDefaultOpen);\n\n const isInGroup = shouldSkipAnimation ? false : typeof updateOpenAccordionUuid === 'function';\n\n const isOpen = isInGroup ? openAccordionUuid === uuid : isAccordionOpen;\n\n const isOpenRef = useRef(isOpen);\n const onCloseRef = useRef(onClose);\n const onOpenRef = useRef(onOpen);\n\n const isLastAccordion = useMemo(\n () => (accordionUuids ? accordionUuids[accordionUuids.length - 1] === uuid : false),\n [accordionUuids, uuid],\n );\n\n useEffect(() => {\n isOpenRef.current = isOpen;\n onCloseRef.current = onClose;\n onOpenRef.current = onOpen;\n }, [isOpen, onClose, onOpen]);\n\n const handleHeadClick = useCallback(() => {\n if (isDisabled) {\n return;\n }\n\n if (typeof updateOpenAccordionUuid === 'function') {\n updateOpenAccordionUuid(uuid);\n }\n\n setIsAccordionOpen((currentIsAccordionOpen) => !currentIsAccordionOpen);\n }, [isDisabled, updateOpenAccordionUuid, uuid]);\n\n useEffect(() => {\n if (isDisabled && isOpen) {\n if (typeof updateOpenAccordionUuid === 'function') {\n updateOpenAccordionUuid(uuid);\n }\n\n setIsAccordionOpen((currentIsAccordionOpen) => !currentIsAccordionOpen);\n }\n }, [isDisabled, isOpen, updateOpenAccordionUuid, uuid]);\n\n useEffect(() => {\n if (isInitialRenderRef.current) {\n isInitialRenderRef.current = false;\n } else if (isOpen) {\n if (typeof onOpenRef.current === 'function') {\n onOpenRef.current();\n }\n } else if (typeof onCloseRef.current === 'function') {\n onCloseRef.current();\n }\n }, [isOpen]);\n\n useEffect(() => {\n if (isDefaultOpen) {\n if (typeof updateOpenAccordionUuid === 'function') {\n updateOpenAccordionUuid(uuid, { shouldOnlyOpen: true });\n } else {\n setIsAccordionOpen(true);\n }\n }\n }, [isDefaultOpen, updateOpenAccordionUuid, uuid]);\n\n useEffect(() => {\n if (typeof isOpened === 'boolean') {\n if (typeof updateOpenAccordionUuid === 'function' && isOpened !== isOpenRef.current) {\n updateOpenAccordionUuid(uuid);\n } else {\n setIsAccordionOpen(isOpened);\n }\n }\n }, [isOpened, updateOpenAccordionUuid, uuid]);\n\n const accordionContextProviderValue = useMemo(\n () => ({ isWrapped: isWrapped === true }),\n [isWrapped],\n );\n\n const areaContextProviderValue = useMemo(\n () => ({ shouldChangeColor: !shouldHideBackground }),\n [shouldHideBackground],\n );\n\n const accordionWrappedContextProviderValue = useMemo(() => ({ isWrapped: true }), []);\n\n const initialAnimation = useMemo(() => {\n if (shouldSkipAnimation) {\n return { height: 'auto', opacity: 1 };\n }\n\n return isOpen ? { height: 'auto', opacity: 1 } : { height: 0, opacity: 0 };\n }, [isOpen, shouldSkipAnimation]);\n\n return (\n <StyledMotionAccordion\n animate={{ height: 'auto', opacity: 1 }}\n data-uuid={`${accordionGroupUuid ?? ''}---${uuid}`}\n className=\"beta-chayns-accordion\"\n exit={{ height: 0, opacity: 0 }}\n initial={initialAnimation}\n $isOpen={isOpen}\n tabIndex={shouldIndex ? 0 : -1}\n $shouldShowLines={!isLastAccordion || !isWrapped}\n $isParentWrapped={isParentWrapped}\n $isWrapped={isWrapped}\n $shouldForceBackground={shouldForceBackground}\n $shouldHideBackground={shouldHideBackground}\n $shouldHideBottomLine={shouldHideBottomLine}\n $bottomBorderColor={colors?.borderBottomColor}\n onKeyDown={(e) => {\n if (\n (e.key === 'Enter' || e.key === ' ') &&\n (e.target as HTMLDivElement).className.includes('beta-chayns-accordion') &&\n shouldIndex\n ) {\n e.preventDefault();\n e.stopPropagation();\n handleHeadClick();\n }\n }}\n onMouseEnter={onHoverStart}\n onMouseLeave={onHoverEnd}\n transition={{ duration: shouldSkipAnimation ? 0 : 0.25 }}\n >\n <AccordionContext.Provider value={accordionContextProviderValue}>\n <MotionConfig transition={{ type: 'tween' }}>\n <AccordionHead\n uuid={uuid}\n icon={icon}\n isOpen={isOpen}\n shouldSkipAnimation={shouldSkipAnimation}\n isFixed={isFixed}\n isTitleGreyed={isTitleGreyed || isDisabled}\n isWrapped={isWrapped === true}\n onClick={handleHeadClick}\n onSearchChange={onSearchChange}\n rightElement={rightElement}\n searchPlaceholder={searchPlaceholder}\n searchValue={searchValue}\n shouldRotateIcon={shouldRotateIcon}\n title={title}\n titleElement={titleElement}\n onTitleInputChange={onTitleInputChange}\n titleInputProps={titleInputProps}\n titleColor={colors?.titleColor}\n />\n <AnimatePresence initial={false}>\n {(isOpen || shouldRenderClosed) && (\n <AccordionBody\n shouldSkipAnimation={shouldSkipAnimation}\n maxHeight={bodyMaxHeight}\n onScroll={onBodyScroll}\n onAnimationComplete={onBodyAnimationComplete}\n shouldHideBody={shouldRenderClosed && !isOpen}\n >\n <AccordionWrappedContext.Provider\n value={accordionWrappedContextProviderValue}\n >\n <AreaContext.Provider value={areaContextProviderValue}>\n {children}\n </AreaContext.Provider>\n </AccordionWrappedContext.Provider>\n </AccordionBody>\n )}\n </AnimatePresence>\n </MotionConfig>\n </AccordionContext.Provider>\n </StyledMotionAccordion>\n );\n};\n\nAccordion.displayName = 'Accordion';\n\nexport default Accordion;\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"Accordion.js","names":["_react","require","_react2","_interopRequireWildcard","_uuid","_useKeyboardFocusHighlighting","_AreaContextProvider","_ColorSchemeProvider","_AccordionBody","_interopRequireDefault","_AccordionGroup","_AccordionHead","_AccordionContextProvider","_Accordion","_ref","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","AccordionContext","exports","React","createContext","isWrapped","undefined","Accordion","bodyMaxHeight","children","icon","isDefaultOpen","isDisabled","isFixed","isOpened","isTitleGreyed","onBodyScroll","onClose","onHoverEnd","onHoverStart","onOpen","onSearchChange","rightElement","searchPlaceholder","searchValue","shouldForceBackground","shouldHideBackground","shouldRenderClosed","shouldRotateIcon","shouldHideBottomLine","title","titleElement","onTitleInputChange","titleInputProps","shouldSkipAnimation","shouldSkipAnimationProp","colors","shouldIndex","onBodyAnimationComplete","shouldEnableKeyboardHighlighting","groupIsWrapped","openAccordionUuid","accordionGroupUuid","accordionUuids","updateOpenAccordionUuid","activeAccordionUuid","updateActiveAccordionUuid","registerAccordionUuid","unregisterAccordionUuid","useContext","AccordionGroupContext","isParentWrapped","contextIsWrapped","AccordionWrappedContext","colorScheme","useColorScheme","shouldEnableKeyboardHighlightingEffective","useMemo","isAccordionOpen","setIsAccordionOpen","useState","isGroupFocusWithin","setIsGroupFocusWithin","uuid","useUuid","isInitialRenderRef","useRef","initialRenderSkipRef","useInitialRenderRef","current","isInGroup","isOpen","isOpenRef","onCloseRef","onOpenRef","shouldShowKeyboardHighlighting","useKeyboardFocusHighlighting","isKeyboardFocusable","isInKeyboardNavigationGroup","useEffect","isLastAccordion","length","handleHeadClick","useCallback","currentIsAccordionOpen","shouldOnlyOpen","accordionContextProviderValue","areaContextProviderValue","shouldChangeColor","accordionWrappedContextProviderValue","initialAnimation","height","opacity","tabIndex","handleKeyDown","isCurrentAccordionTarget","currentTarget","target","key","currentIndex","indexOf","nextIndex","nextAccordionUuid","nextAccordionElement","document","querySelector","focus","preventDefault","_e$currentTarget$pare","parentAccordion","parentElement","closest","_parentAccordion$getA","_parentAccordion$pare","parentGroupId","getAttribute","split","handleFocus","handleBlur","nextFocusedElement","relatedTarget","currentGroupElement","contains","createElement","StyledMotionAccordion","animate","className","exit","initial","$isOpen","$shouldShowLines","$isParentWrapped","$isWrapped","$shouldForceBackground","$shouldHideBackground","$shouldHideBottomLine","$bottomBorderColor","borderBottomColor","$shouldEnableKeyboardHighlighting","$shouldShowKeyboardHighlighting","onKeyDown","onFocus","onBlur","onMouseEnter","onMouseLeave","transition","duration","Provider","value","MotionConfig","type","onClick","titleColor","AnimatePresence","maxHeight","onScroll","onAnimationComplete","shouldHideBody","AreaContext","displayName","_default"],"sources":["../../../../src/components/accordion/Accordion.tsx"],"sourcesContent":["import { AnimatePresence, MotionConfig } from 'motion/react';\nimport React, {\n ChangeEventHandler,\n type CSSProperties,\n FC,\n type MouseEventHandler,\n ReactNode,\n UIEvent,\n useCallback,\n useContext,\n useEffect,\n useMemo,\n useRef,\n useState,\n KeyboardEvent,\n FocusEvent,\n} from 'react';\nimport { useUuid } from '../../hooks/uuid';\nimport { useKeyboardFocusHighlighting } from '../../hooks/useKeyboardFocusHighlighting';\nimport { AreaContext } from '../area-provider/AreaContextProvider';\nimport { useColorScheme } from '../color-scheme-provider/ColorSchemeProvider';\nimport type { InputProps } from '../input/Input';\nimport AccordionBody from './accordion-body/AccordionBody';\nimport { AccordionGroupContext } from './accordion-group/AccordionGroup';\nimport AccordionHead from './accordion-head/AccordionHead';\nimport { AccordionWrappedContext } from './accordion-provider/AccordionContextProvider';\nimport { StyledMotionAccordion } from './Accordion.styles';\nimport { useInitialRenderRef } from '../../hooks/ref';\n\nexport const AccordionContext = React.createContext<{ isWrapped?: boolean }>({\n isWrapped: undefined,\n});\n\ntype AccordionColors = {\n titleColor?: CSSProperties['color'];\n borderBottomColor?: CSSProperties['borderBottomColor'];\n};\n\nexport type AccordionProps = {\n /**\n * Maximum height of the accordion body element. This automatically makes the content of the\n * body element scrollable.\n */\n bodyMaxHeight?: number;\n /**\n * The content of the accordion body\n */\n children: ReactNode;\n /**\n * The icon that is displayed in front of the title\n */\n icon?: string;\n /**\n * This can be used to automatically expand the Accordion during the first render.\n */\n isDefaultOpen?: boolean;\n /**\n * This will disable the Accordion so that it cannot be opened and will gray out the title. Does not work with isOpened.\n */\n isDisabled?: boolean;\n /**\n * This can be used so that the Accordion cannot be opened or closed.\n * In addition, in this case the icon is exchanged to mark the Accordions.\n */\n isFixed?: boolean;\n /**\n * This can be used to open the Accordion from the outside\n */\n isOpened?: boolean;\n /**\n * This will gray out the title of the Accordion to indicate hidden content, for example.\n */\n isTitleGreyed?: boolean;\n /**\n * Function that is executed when the accordion body will be scrolled\n */\n onBodyScroll?: (event: UIEvent<HTMLDivElement>) => void;\n /**\n * Function that is executed when the accordion will be closed.\n */\n onClose?: VoidFunction;\n /**\n * Function to be executed when the accordion is no longer hovered.\n */\n onHoverEnd?: MouseEventHandler<HTMLDivElement>;\n /**\n * Function to be executed when the accordion is hovered.\n */\n onHoverStart?: MouseEventHandler<HTMLDivElement>;\n /**\n * Function that is executed when the accordion will be opened.\n */\n onOpen?: VoidFunction;\n /**\n * Function that is executed when the accordion body is animated\n */\n onBodyAnimationComplete?: VoidFunction;\n /**\n * Function that is executed when the text of the search in the accordion\n * head changes. When this function is given, the search field is displayed\n * in the Accordion Head.\n */\n onSearchChange?: ChangeEventHandler<HTMLInputElement>;\n /**\n * Function that is executed when the text of the search in the accordion\n * title changes. When this function is given, the search field is displayed\n * as the Accordion title.\n */\n onTitleInputChange?: ChangeEventHandler<HTMLInputElement>;\n /**\n * Content to be displayed on the right side in the head of the Accordion\n */\n rightElement?: ReactNode;\n /**\n * The placeholder to be used for the search\n */\n searchPlaceholder?: string;\n /**\n * The value that is displayed inside the search\n */\n searchValue?: string;\n /**\n * This will force the background color of the accordion to be used even if it is closed and not hovered.\n */\n shouldForceBackground?: boolean;\n /**\n * This will hide the background color of the accordion\n */\n shouldHideBackground?: boolean;\n /**\n * Whether the bottom line should be hidden.\n */\n shouldHideBottomLine?: boolean;\n /**\n * This will render the Accordion closed on the first render.\n */\n shouldRenderClosed?: boolean;\n /**\n * Whether the icon should be rotating.\n */\n shouldRotateIcon?: boolean;\n /**\n * Whether the animation should be skipped.\n * If 'isDefaultOpen' is true the initial animation will be skipped even this prop is false\n */\n shouldSkipAnimation?: boolean;\n /**\n * Title of the Accordion displayed in the head\n */\n title?: string;\n /**\n * Additional elements to be displayed in the header next to the title.\n */\n titleElement?: ReactNode;\n /**\n * The props of the title Input.\n */\n titleInputProps?: InputProps;\n /**\n * Provide custom colors to the Accordion Component\n */\n colors?: AccordionColors;\n /**\n * Whether the accordion should be indexed.\n */\n shouldIndex?: boolean;\n /**\n * Enables keyboard-only focus highlighting. The highlighting is only visible while the\n * user navigates with the keyboard and is reset on mouse movement or click.\n */\n shouldEnableKeyboardHighlighting?: boolean;\n};\n\nconst Accordion: FC<AccordionProps> = ({\n bodyMaxHeight,\n children,\n icon,\n isDefaultOpen = false,\n isDisabled = false,\n isFixed = false,\n isOpened,\n isTitleGreyed = false,\n onBodyScroll,\n onClose,\n onHoverEnd,\n onHoverStart,\n onOpen,\n onSearchChange,\n rightElement,\n searchPlaceholder,\n searchValue,\n shouldForceBackground = false,\n shouldHideBackground = false,\n shouldRenderClosed = false,\n shouldRotateIcon = true,\n shouldHideBottomLine = false,\n title,\n titleElement,\n onTitleInputChange,\n titleInputProps,\n shouldSkipAnimation: shouldSkipAnimationProp = false,\n colors,\n shouldIndex = false,\n onBodyAnimationComplete,\n shouldEnableKeyboardHighlighting,\n}) => {\n const {\n isWrapped: groupIsWrapped,\n openAccordionUuid,\n accordionGroupUuid,\n accordionUuids,\n updateOpenAccordionUuid,\n activeAccordionUuid,\n updateActiveAccordionUuid,\n registerAccordionUuid,\n unregisterAccordionUuid,\n } = useContext(AccordionGroupContext);\n const { isWrapped: isParentWrapped } = useContext(AccordionContext);\n\n const { isWrapped: contextIsWrapped } = useContext(AccordionWrappedContext);\n const colorScheme = useColorScheme();\n const shouldEnableKeyboardHighlightingEffective =\n shouldEnableKeyboardHighlighting ?? colorScheme?.shouldEnableKeyboardHighlighting ?? false;\n\n const isWrapped = useMemo(\n () => groupIsWrapped ?? contextIsWrapped,\n [contextIsWrapped, groupIsWrapped],\n );\n\n const [isAccordionOpen, setIsAccordionOpen] = useState<boolean>(isDefaultOpen ?? isOpened);\n const [isGroupFocusWithin, setIsGroupFocusWithin] = useState(false);\n\n const uuid = useUuid();\n\n const isInitialRenderRef = useRef(true);\n\n const initialRenderSkipRef = useInitialRenderRef(true);\n\n const shouldSkipAnimation =\n shouldSkipAnimationProp ?? (initialRenderSkipRef.current && isDefaultOpen);\n\n const isInGroup = shouldSkipAnimation ? false : typeof updateOpenAccordionUuid === 'function';\n\n const isOpen = isInGroup ? openAccordionUuid === uuid : isAccordionOpen;\n\n const isOpenRef = useRef(isOpen);\n const onCloseRef = useRef(onClose);\n const onOpenRef = useRef(onOpen);\n const shouldShowKeyboardHighlighting = useKeyboardFocusHighlighting(\n shouldEnableKeyboardHighlightingEffective,\n );\n const isKeyboardFocusable =\n !isDisabled && (shouldIndex || shouldEnableKeyboardHighlightingEffective);\n\n const isInKeyboardNavigationGroup =\n isKeyboardFocusable &&\n typeof updateActiveAccordionUuid === 'function' &&\n typeof accordionGroupUuid === 'string';\n\n useEffect(() => {\n if (\n typeof accordionGroupUuid === 'string' &&\n typeof registerAccordionUuid === 'function' &&\n typeof unregisterAccordionUuid === 'function'\n ) {\n registerAccordionUuid(uuid);\n\n return () => {\n unregisterAccordionUuid(uuid);\n };\n }\n\n return undefined;\n }, [accordionGroupUuid, registerAccordionUuid, unregisterAccordionUuid, uuid]);\n\n const isLastAccordion = useMemo(\n () => (accordionUuids ? accordionUuids[accordionUuids.length - 1] === uuid : false),\n [accordionUuids, uuid],\n );\n\n useEffect(() => {\n isOpenRef.current = isOpen;\n onCloseRef.current = onClose;\n onOpenRef.current = onOpen;\n }, [isOpen, onClose, onOpen]);\n\n const handleHeadClick = useCallback(() => {\n if (isDisabled) {\n return;\n }\n\n if (isKeyboardFocusable && typeof updateActiveAccordionUuid === 'function') {\n updateActiveAccordionUuid(uuid);\n }\n\n if (typeof updateOpenAccordionUuid === 'function') {\n updateOpenAccordionUuid(uuid);\n }\n\n setIsAccordionOpen((currentIsAccordionOpen) => !currentIsAccordionOpen);\n }, [isDisabled, isKeyboardFocusable, updateActiveAccordionUuid, updateOpenAccordionUuid, uuid]);\n\n useEffect(() => {\n if (isDisabled && isOpen) {\n if (typeof updateOpenAccordionUuid === 'function') {\n updateOpenAccordionUuid(uuid);\n }\n\n setIsAccordionOpen((currentIsAccordionOpen) => !currentIsAccordionOpen);\n }\n }, [isDisabled, isOpen, updateOpenAccordionUuid, uuid]);\n\n useEffect(() => {\n if (isInitialRenderRef.current) {\n isInitialRenderRef.current = false;\n } else if (isOpen) {\n if (typeof onOpenRef.current === 'function') {\n onOpenRef.current();\n }\n } else if (typeof onCloseRef.current === 'function') {\n onCloseRef.current();\n }\n }, [isOpen]);\n\n useEffect(() => {\n if (isDefaultOpen) {\n if (typeof updateOpenAccordionUuid === 'function') {\n updateOpenAccordionUuid(uuid, { shouldOnlyOpen: true });\n } else {\n setIsAccordionOpen(true);\n }\n }\n }, [isDefaultOpen, updateOpenAccordionUuid, uuid]);\n\n useEffect(() => {\n if (typeof isOpened === 'boolean') {\n if (typeof updateOpenAccordionUuid === 'function' && isOpened !== isOpenRef.current) {\n updateOpenAccordionUuid(uuid);\n } else {\n setIsAccordionOpen(isOpened);\n }\n }\n }, [isOpened, updateOpenAccordionUuid, uuid]);\n\n const accordionContextProviderValue = useMemo(\n () => ({ isWrapped: isWrapped === true }),\n [isWrapped],\n );\n\n const areaContextProviderValue = useMemo(\n () => ({ shouldChangeColor: !shouldHideBackground }),\n [shouldHideBackground],\n );\n\n const accordionWrappedContextProviderValue = useMemo(() => ({ isWrapped: true }), []);\n\n const initialAnimation = useMemo(() => {\n if (shouldSkipAnimation) {\n return { height: 'auto', opacity: 1 };\n }\n\n return isOpen ? { height: 'auto', opacity: 1 } : { height: 0, opacity: 0 };\n }, [isOpen, shouldSkipAnimation]);\n\n const tabIndex = useMemo(() => (isKeyboardFocusable ? 0 : -1), [isKeyboardFocusable]);\n\n const handleKeyDown = useCallback(\n (e: KeyboardEvent<HTMLDivElement>) => {\n const isCurrentAccordionTarget = e.currentTarget === e.target;\n\n if (\n isCurrentAccordionTarget &&\n isInKeyboardNavigationGroup &&\n accordionUuids?.length &&\n (e.key === 'ArrowDown' || e.key === 'ArrowUp')\n ) {\n const currentIndex = accordionUuids.indexOf(uuid);\n\n if (currentIndex !== -1) {\n const nextIndex =\n e.key === 'ArrowDown'\n ? (currentIndex + 1) % accordionUuids.length\n : (currentIndex - 1 + accordionUuids.length) % accordionUuids.length;\n const nextAccordionUuid = accordionUuids[nextIndex];\n\n if (nextAccordionUuid && nextAccordionUuid !== uuid) {\n const nextAccordionElement = document.querySelector<HTMLDivElement>(\n `[data-uuid=\"${accordionGroupUuid}---${nextAccordionUuid}\"]`,\n );\n\n if (nextAccordionElement) {\n updateActiveAccordionUuid(nextAccordionUuid);\n nextAccordionElement.focus();\n return;\n }\n }\n }\n }\n\n if (\n isCurrentAccordionTarget &&\n (e.key === 'Enter' || e.key === ' ') &&\n isKeyboardFocusable\n ) {\n handleHeadClick();\n }\n\n if (\n isCurrentAccordionTarget &&\n e.key === 'ArrowRight' &&\n isKeyboardFocusable &&\n !isOpen\n ) {\n e.preventDefault();\n handleHeadClick();\n }\n\n if (isCurrentAccordionTarget && (e.key === 'Escape' || e.key === 'ArrowLeft')) {\n if (isOpen && isKeyboardFocusable) {\n e.preventDefault();\n handleHeadClick();\n return;\n }\n\n if (\n isInKeyboardNavigationGroup &&\n typeof updateActiveAccordionUuid === 'function'\n ) {\n e.preventDefault();\n updateActiveAccordionUuid(undefined);\n let parentAccordion =\n e.currentTarget.parentElement?.closest<HTMLElement>(\n '.beta-chayns-accordion',\n );\n while (parentAccordion) {\n const parentGroupId = parentAccordion\n .getAttribute('data-uuid')\n ?.split('---')[0];\n if (parentGroupId !== accordionGroupUuid) {\n parentAccordion.focus();\n break;\n }\n parentAccordion =\n parentAccordion.parentElement?.closest<HTMLElement>(\n '.beta-chayns-accordion',\n );\n }\n }\n }\n },\n [\n accordionGroupUuid,\n accordionUuids,\n handleHeadClick,\n isInKeyboardNavigationGroup,\n isKeyboardFocusable,\n isOpen,\n updateActiveAccordionUuid,\n uuid,\n ],\n );\n\n const handleFocus = useCallback(\n (e: FocusEvent<HTMLDivElement>) => {\n if (\n e.currentTarget === e.target &&\n isInKeyboardNavigationGroup &&\n typeof updateActiveAccordionUuid === 'function'\n ) {\n setIsGroupFocusWithin(true);\n updateActiveAccordionUuid(uuid);\n }\n },\n [isInKeyboardNavigationGroup, updateActiveAccordionUuid, uuid],\n );\n\n const handleBlur = useCallback(\n (e: FocusEvent<HTMLDivElement>) => {\n if (\n isInKeyboardNavigationGroup &&\n typeof updateActiveAccordionUuid === 'function' &&\n typeof accordionGroupUuid === 'string'\n ) {\n const nextFocusedElement = e.relatedTarget as Node | null;\n const currentGroupElement = e.currentTarget as HTMLElement;\n\n if (!nextFocusedElement || !currentGroupElement.contains(nextFocusedElement)) {\n setIsGroupFocusWithin(false);\n updateActiveAccordionUuid(undefined);\n }\n }\n },\n [accordionGroupUuid, isInKeyboardNavigationGroup, updateActiveAccordionUuid],\n );\n\n useEffect(() => {\n if (!isInKeyboardNavigationGroup) {\n setIsGroupFocusWithin(false);\n } else if (\n activeAccordionUuid == null &&\n typeof updateActiveAccordionUuid === 'function' &&\n accordionUuids?.[0] === uuid\n ) {\n updateActiveAccordionUuid(uuid);\n }\n }, [\n accordionUuids,\n activeAccordionUuid,\n isInKeyboardNavigationGroup,\n updateActiveAccordionUuid,\n uuid,\n ]);\n\n return (\n <StyledMotionAccordion\n animate={{ height: 'auto', opacity: 1 }}\n data-uuid={`${accordionGroupUuid ?? ''}---${uuid}`}\n className=\"beta-chayns-accordion\"\n exit={{ height: 0, opacity: 0 }}\n initial={initialAnimation}\n $isOpen={isOpen}\n tabIndex={tabIndex}\n $shouldShowLines={!isLastAccordion || !isWrapped}\n $isParentWrapped={isParentWrapped}\n $isWrapped={isWrapped}\n $shouldForceBackground={shouldForceBackground}\n $shouldHideBackground={shouldHideBackground}\n $shouldHideBottomLine={shouldHideBottomLine}\n $bottomBorderColor={colors?.borderBottomColor}\n $shouldEnableKeyboardHighlighting={shouldEnableKeyboardHighlightingEffective}\n $shouldShowKeyboardHighlighting={shouldShowKeyboardHighlighting}\n onKeyDown={handleKeyDown}\n onFocus={handleFocus}\n onBlur={handleBlur}\n onMouseEnter={onHoverStart}\n onMouseLeave={onHoverEnd}\n transition={{ duration: shouldSkipAnimation ? 0 : 0.25 }}\n >\n <AccordionContext.Provider value={accordionContextProviderValue}>\n <MotionConfig transition={{ type: 'tween' }}>\n <AccordionHead\n uuid={uuid}\n icon={icon}\n isOpen={isOpen}\n shouldSkipAnimation={shouldSkipAnimation}\n isFixed={isFixed}\n isTitleGreyed={isTitleGreyed || isDisabled}\n isWrapped={isWrapped === true}\n onClick={handleHeadClick}\n onSearchChange={onSearchChange}\n rightElement={rightElement}\n searchPlaceholder={searchPlaceholder}\n searchValue={searchValue}\n shouldRotateIcon={shouldRotateIcon}\n title={title}\n titleElement={titleElement}\n onTitleInputChange={onTitleInputChange}\n titleInputProps={titleInputProps}\n titleColor={colors?.titleColor}\n shouldEnableKeyboardHighlighting={shouldEnableKeyboardHighlightingEffective}\n />\n <AnimatePresence initial={false}>\n {(isOpen || shouldRenderClosed) && (\n <AccordionBody\n shouldSkipAnimation={shouldSkipAnimation}\n maxHeight={bodyMaxHeight}\n onScroll={onBodyScroll}\n onAnimationComplete={onBodyAnimationComplete}\n shouldHideBody={shouldRenderClosed && !isOpen}\n >\n <AccordionWrappedContext.Provider\n value={accordionWrappedContextProviderValue}\n >\n <AreaContext.Provider value={areaContextProviderValue}>\n {children}\n </AreaContext.Provider>\n </AccordionWrappedContext.Provider>\n </AccordionBody>\n )}\n </AnimatePresence>\n </MotionConfig>\n </AccordionContext.Provider>\n </StyledMotionAccordion>\n );\n};\n\nAccordion.displayName = 'Accordion';\n\nexport default Accordion;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,OAAA,GAAAC,uBAAA,CAAAF,OAAA;AAgBA,IAAAG,KAAA,GAAAH,OAAA;AACA,IAAAI,6BAAA,GAAAJ,OAAA;AACA,IAAAK,oBAAA,GAAAL,OAAA;AACA,IAAAM,oBAAA,GAAAN,OAAA;AAEA,IAAAO,cAAA,GAAAC,sBAAA,CAAAR,OAAA;AACA,IAAAS,eAAA,GAAAT,OAAA;AACA,IAAAU,cAAA,GAAAF,sBAAA,CAAAR,OAAA;AACA,IAAAW,yBAAA,GAAAX,OAAA;AACA,IAAAY,UAAA,GAAAZ,OAAA;AACA,IAAAa,IAAA,GAAAb,OAAA;AAAsD,SAAAQ,uBAAAM,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAAA,SAAAZ,wBAAAY,CAAA,EAAAG,CAAA,6BAAAC,OAAA,MAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAhB,uBAAA,YAAAA,CAAAY,CAAA,EAAAG,CAAA,SAAAA,CAAA,IAAAH,CAAA,IAAAA,CAAA,CAAAC,UAAA,SAAAD,CAAA,MAAAO,CAAA,EAAAC,CAAA,EAAAC,CAAA,KAAAC,SAAA,QAAAR,OAAA,EAAAF,CAAA,iBAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,SAAAS,CAAA,MAAAF,CAAA,GAAAJ,CAAA,GAAAG,CAAA,GAAAD,CAAA,QAAAE,CAAA,CAAAI,GAAA,CAAAX,CAAA,UAAAO,CAAA,CAAAK,GAAA,CAAAZ,CAAA,GAAAO,CAAA,CAAAM,GAAA,CAAAb,CAAA,EAAAS,CAAA,gBAAAN,CAAA,IAAAH,CAAA,gBAAAG,CAAA,OAAAW,cAAA,CAAAC,IAAA,CAAAf,CAAA,EAAAG,CAAA,OAAAK,CAAA,IAAAD,CAAA,GAAAS,MAAA,CAAAC,cAAA,KAAAD,MAAA,CAAAE,wBAAA,CAAAlB,CAAA,EAAAG,CAAA,OAAAK,CAAA,CAAAI,GAAA,IAAAJ,CAAA,CAAAK,GAAA,IAAAN,CAAA,CAAAE,CAAA,EAAAN,CAAA,EAAAK,CAAA,IAAAC,CAAA,CAAAN,CAAA,IAAAH,CAAA,CAAAG,CAAA,WAAAM,CAAA,KAAAT,CAAA,EAAAG,CAAA;AAE/C,MAAMgB,gBAAgB,GAAAC,OAAA,CAAAD,gBAAA,gBAAGE,eAAK,CAACC,aAAa,CAA0B;EACzEC,SAAS,EAAEC;AACf,CAAC,CAAC;AA8IF,MAAMC,SAA6B,GAAGA,CAAC;EACnCC,aAAa;EACbC,QAAQ;EACRC,IAAI;EACJC,aAAa,GAAG,KAAK;EACrBC,UAAU,GAAG,KAAK;EAClBC,OAAO,GAAG,KAAK;EACfC,QAAQ;EACRC,aAAa,GAAG,KAAK;EACrBC,YAAY;EACZC,OAAO;EACPC,UAAU;EACVC,YAAY;EACZC,MAAM;EACNC,cAAc;EACdC,YAAY;EACZC,iBAAiB;EACjBC,WAAW;EACXC,qBAAqB,GAAG,KAAK;EAC7BC,oBAAoB,GAAG,KAAK;EAC5BC,kBAAkB,GAAG,KAAK;EAC1BC,gBAAgB,GAAG,IAAI;EACvBC,oBAAoB,GAAG,KAAK;EAC5BC,KAAK;EACLC,YAAY;EACZC,kBAAkB;EAClBC,eAAe;EACfC,mBAAmB,EAAEC,uBAAuB,GAAG,KAAK;EACpDC,MAAM;EACNC,WAAW,GAAG,KAAK;EACnBC,uBAAuB;EACvBC;AACJ,CAAC,KAAK;EACF,MAAM;IACFlC,SAAS,EAAEmC,cAAc;IACzBC,iBAAiB;IACjBC,kBAAkB;IAClBC,cAAc;IACdC,uBAAuB;IACvBC,mBAAmB;IACnBC,yBAAyB;IACzBC,qBAAqB;IACrBC;EACJ,CAAC,GAAG,IAAAC,kBAAU,EAACC,qCAAqB,CAAC;EACrC,MAAM;IAAE7C,SAAS,EAAE8C;EAAgB,CAAC,GAAG,IAAAF,kBAAU,EAAChD,gBAAgB,CAAC;EAEnE,MAAM;IAAEI,SAAS,EAAE+C;EAAiB,CAAC,GAAG,IAAAH,kBAAU,EAACI,iDAAuB,CAAC;EAC3E,MAAMC,WAAW,GAAG,IAAAC,mCAAc,EAAC,CAAC;EACpC,MAAMC,yCAAyC,GAC3CjB,gCAAgC,KAAIe,WAAW,aAAXA,WAAW,uBAAXA,WAAW,CAAEf,gCAAgC,KAAI,KAAK;EAE9F,MAAMlC,SAAS,GAAG,IAAAoD,eAAO,EACrB,MAAMjB,cAAc,IAAIY,gBAAgB,EACxC,CAACA,gBAAgB,EAAEZ,cAAc,CACrC,CAAC;EAED,MAAM,CAACkB,eAAe,EAAEC,kBAAkB,CAAC,GAAG,IAAAC,gBAAQ,EAAUjD,aAAa,IAAIG,QAAQ,CAAC;EAC1F,MAAM,CAAC+C,kBAAkB,EAAEC,qBAAqB,CAAC,GAAG,IAAAF,gBAAQ,EAAC,KAAK,CAAC;EAEnE,MAAMG,IAAI,GAAG,IAAAC,aAAO,EAAC,CAAC;EAEtB,MAAMC,kBAAkB,GAAG,IAAAC,cAAM,EAAC,IAAI,CAAC;EAEvC,MAAMC,oBAAoB,GAAG,IAAAC,wBAAmB,EAAC,IAAI,CAAC;EAEtD,MAAMlC,mBAAmB,GACrBC,uBAAuB,KAAKgC,oBAAoB,CAACE,OAAO,IAAI1D,aAAa,CAAC;EAE9E,MAAM2D,SAAS,GAAGpC,mBAAmB,GAAG,KAAK,GAAG,OAAOU,uBAAuB,KAAK,UAAU;EAE7F,MAAM2B,MAAM,GAAGD,SAAS,GAAG7B,iBAAiB,KAAKsB,IAAI,GAAGL,eAAe;EAEvE,MAAMc,SAAS,GAAG,IAAAN,cAAM,EAACK,MAAM,CAAC;EAChC,MAAME,UAAU,GAAG,IAAAP,cAAM,EAACjD,OAAO,CAAC;EAClC,MAAMyD,SAAS,GAAG,IAAAR,cAAM,EAAC9C,MAAM,CAAC;EAChC,MAAMuD,8BAA8B,GAAG,IAAAC,0DAA4B,EAC/DpB,yCACJ,CAAC;EACD,MAAMqB,mBAAmB,GACrB,CAACjE,UAAU,KAAKyB,WAAW,IAAImB,yCAAyC,CAAC;EAE7E,MAAMsB,2BAA2B,GAC7BD,mBAAmB,IACnB,OAAO/B,yBAAyB,KAAK,UAAU,IAC/C,OAAOJ,kBAAkB,KAAK,QAAQ;EAE1C,IAAAqC,iBAAS,EAAC,MAAM;IACZ,IACI,OAAOrC,kBAAkB,KAAK,QAAQ,IACtC,OAAOK,qBAAqB,KAAK,UAAU,IAC3C,OAAOC,uBAAuB,KAAK,UAAU,EAC/C;MACED,qBAAqB,CAACgB,IAAI,CAAC;MAE3B,OAAO,MAAM;QACTf,uBAAuB,CAACe,IAAI,CAAC;MACjC,CAAC;IACL;IAEA,OAAOzD,SAAS;EACpB,CAAC,EAAE,CAACoC,kBAAkB,EAAEK,qBAAqB,EAAEC,uBAAuB,EAAEe,IAAI,CAAC,CAAC;EAE9E,MAAMiB,eAAe,GAAG,IAAAvB,eAAO,EAC3B,MAAOd,cAAc,GAAGA,cAAc,CAACA,cAAc,CAACsC,MAAM,GAAG,CAAC,CAAC,KAAKlB,IAAI,GAAG,KAAM,EACnF,CAACpB,cAAc,EAAEoB,IAAI,CACzB,CAAC;EAED,IAAAgB,iBAAS,EAAC,MAAM;IACZP,SAAS,CAACH,OAAO,GAAGE,MAAM;IAC1BE,UAAU,CAACJ,OAAO,GAAGpD,OAAO;IAC5ByD,SAAS,CAACL,OAAO,GAAGjD,MAAM;EAC9B,CAAC,EAAE,CAACmD,MAAM,EAAEtD,OAAO,EAAEG,MAAM,CAAC,CAAC;EAE7B,MAAM8D,eAAe,GAAG,IAAAC,mBAAW,EAAC,MAAM;IACtC,IAAIvE,UAAU,EAAE;MACZ;IACJ;IAEA,IAAIiE,mBAAmB,IAAI,OAAO/B,yBAAyB,KAAK,UAAU,EAAE;MACxEA,yBAAyB,CAACiB,IAAI,CAAC;IACnC;IAEA,IAAI,OAAOnB,uBAAuB,KAAK,UAAU,EAAE;MAC/CA,uBAAuB,CAACmB,IAAI,CAAC;IACjC;IAEAJ,kBAAkB,CAAEyB,sBAAsB,IAAK,CAACA,sBAAsB,CAAC;EAC3E,CAAC,EAAE,CAACxE,UAAU,EAAEiE,mBAAmB,EAAE/B,yBAAyB,EAAEF,uBAAuB,EAAEmB,IAAI,CAAC,CAAC;EAE/F,IAAAgB,iBAAS,EAAC,MAAM;IACZ,IAAInE,UAAU,IAAI2D,MAAM,EAAE;MACtB,IAAI,OAAO3B,uBAAuB,KAAK,UAAU,EAAE;QAC/CA,uBAAuB,CAACmB,IAAI,CAAC;MACjC;MAEAJ,kBAAkB,CAAEyB,sBAAsB,IAAK,CAACA,sBAAsB,CAAC;IAC3E;EACJ,CAAC,EAAE,CAACxE,UAAU,EAAE2D,MAAM,EAAE3B,uBAAuB,EAAEmB,IAAI,CAAC,CAAC;EAEvD,IAAAgB,iBAAS,EAAC,MAAM;IACZ,IAAId,kBAAkB,CAACI,OAAO,EAAE;MAC5BJ,kBAAkB,CAACI,OAAO,GAAG,KAAK;IACtC,CAAC,MAAM,IAAIE,MAAM,EAAE;MACf,IAAI,OAAOG,SAAS,CAACL,OAAO,KAAK,UAAU,EAAE;QACzCK,SAAS,CAACL,OAAO,CAAC,CAAC;MACvB;IACJ,CAAC,MAAM,IAAI,OAAOI,UAAU,CAACJ,OAAO,KAAK,UAAU,EAAE;MACjDI,UAAU,CAACJ,OAAO,CAAC,CAAC;IACxB;EACJ,CAAC,EAAE,CAACE,MAAM,CAAC,CAAC;EAEZ,IAAAQ,iBAAS,EAAC,MAAM;IACZ,IAAIpE,aAAa,EAAE;MACf,IAAI,OAAOiC,uBAAuB,KAAK,UAAU,EAAE;QAC/CA,uBAAuB,CAACmB,IAAI,EAAE;UAAEsB,cAAc,EAAE;QAAK,CAAC,CAAC;MAC3D,CAAC,MAAM;QACH1B,kBAAkB,CAAC,IAAI,CAAC;MAC5B;IACJ;EACJ,CAAC,EAAE,CAAChD,aAAa,EAAEiC,uBAAuB,EAAEmB,IAAI,CAAC,CAAC;EAElD,IAAAgB,iBAAS,EAAC,MAAM;IACZ,IAAI,OAAOjE,QAAQ,KAAK,SAAS,EAAE;MAC/B,IAAI,OAAO8B,uBAAuB,KAAK,UAAU,IAAI9B,QAAQ,KAAK0D,SAAS,CAACH,OAAO,EAAE;QACjFzB,uBAAuB,CAACmB,IAAI,CAAC;MACjC,CAAC,MAAM;QACHJ,kBAAkB,CAAC7C,QAAQ,CAAC;MAChC;IACJ;EACJ,CAAC,EAAE,CAACA,QAAQ,EAAE8B,uBAAuB,EAAEmB,IAAI,CAAC,CAAC;EAE7C,MAAMuB,6BAA6B,GAAG,IAAA7B,eAAO,EACzC,OAAO;IAAEpD,SAAS,EAAEA,SAAS,KAAK;EAAK,CAAC,CAAC,EACzC,CAACA,SAAS,CACd,CAAC;EAED,MAAMkF,wBAAwB,GAAG,IAAA9B,eAAO,EACpC,OAAO;IAAE+B,iBAAiB,EAAE,CAAC9D;EAAqB,CAAC,CAAC,EACpD,CAACA,oBAAoB,CACzB,CAAC;EAED,MAAM+D,oCAAoC,GAAG,IAAAhC,eAAO,EAAC,OAAO;IAAEpD,SAAS,EAAE;EAAK,CAAC,CAAC,EAAE,EAAE,CAAC;EAErF,MAAMqF,gBAAgB,GAAG,IAAAjC,eAAO,EAAC,MAAM;IACnC,IAAIvB,mBAAmB,EAAE;MACrB,OAAO;QAAEyD,MAAM,EAAE,MAAM;QAAEC,OAAO,EAAE;MAAE,CAAC;IACzC;IAEA,OAAOrB,MAAM,GAAG;MAAEoB,MAAM,EAAE,MAAM;MAAEC,OAAO,EAAE;IAAE,CAAC,GAAG;MAAED,MAAM,EAAE,CAAC;MAAEC,OAAO,EAAE;IAAE,CAAC;EAC9E,CAAC,EAAE,CAACrB,MAAM,EAAErC,mBAAmB,CAAC,CAAC;EAEjC,MAAM2D,QAAQ,GAAG,IAAApC,eAAO,EAAC,MAAOoB,mBAAmB,GAAG,CAAC,GAAG,CAAC,CAAE,EAAE,CAACA,mBAAmB,CAAC,CAAC;EAErF,MAAMiB,aAAa,GAAG,IAAAX,mBAAW,EAC5BrG,CAAgC,IAAK;IAClC,MAAMiH,wBAAwB,GAAGjH,CAAC,CAACkH,aAAa,KAAKlH,CAAC,CAACmH,MAAM;IAE7D,IACIF,wBAAwB,IACxBjB,2BAA2B,IAC3BnC,cAAc,aAAdA,cAAc,eAAdA,cAAc,CAAEsC,MAAM,KACrBnG,CAAC,CAACoH,GAAG,KAAK,WAAW,IAAIpH,CAAC,CAACoH,GAAG,KAAK,SAAS,CAAC,EAChD;MACE,MAAMC,YAAY,GAAGxD,cAAc,CAACyD,OAAO,CAACrC,IAAI,CAAC;MAEjD,IAAIoC,YAAY,KAAK,CAAC,CAAC,EAAE;QACrB,MAAME,SAAS,GACXvH,CAAC,CAACoH,GAAG,KAAK,WAAW,GACf,CAACC,YAAY,GAAG,CAAC,IAAIxD,cAAc,CAACsC,MAAM,GAC1C,CAACkB,YAAY,GAAG,CAAC,GAAGxD,cAAc,CAACsC,MAAM,IAAItC,cAAc,CAACsC,MAAM;QAC5E,MAAMqB,iBAAiB,GAAG3D,cAAc,CAAC0D,SAAS,CAAC;QAEnD,IAAIC,iBAAiB,IAAIA,iBAAiB,KAAKvC,IAAI,EAAE;UACjD,MAAMwC,oBAAoB,GAAGC,QAAQ,CAACC,aAAa,CAC/C,eAAe/D,kBAAkB,MAAM4D,iBAAiB,IAC5D,CAAC;UAED,IAAIC,oBAAoB,EAAE;YACtBzD,yBAAyB,CAACwD,iBAAiB,CAAC;YAC5CC,oBAAoB,CAACG,KAAK,CAAC,CAAC;YAC5B;UACJ;QACJ;MACJ;IACJ;IAEA,IACIX,wBAAwB,KACvBjH,CAAC,CAACoH,GAAG,KAAK,OAAO,IAAIpH,CAAC,CAACoH,GAAG,KAAK,GAAG,CAAC,IACpCrB,mBAAmB,EACrB;MACEK,eAAe,CAAC,CAAC;IACrB;IAEA,IACIa,wBAAwB,IACxBjH,CAAC,CAACoH,GAAG,KAAK,YAAY,IACtBrB,mBAAmB,IACnB,CAACN,MAAM,EACT;MACEzF,CAAC,CAAC6H,cAAc,CAAC,CAAC;MAClBzB,eAAe,CAAC,CAAC;IACrB;IAEA,IAAIa,wBAAwB,KAAKjH,CAAC,CAACoH,GAAG,KAAK,QAAQ,IAAIpH,CAAC,CAACoH,GAAG,KAAK,WAAW,CAAC,EAAE;MAC3E,IAAI3B,MAAM,IAAIM,mBAAmB,EAAE;QAC/B/F,CAAC,CAAC6H,cAAc,CAAC,CAAC;QAClBzB,eAAe,CAAC,CAAC;QACjB;MACJ;MAEA,IACIJ,2BAA2B,IAC3B,OAAOhC,yBAAyB,KAAK,UAAU,EACjD;QAAA,IAAA8D,qBAAA;QACE9H,CAAC,CAAC6H,cAAc,CAAC,CAAC;QAClB7D,yBAAyB,CAACxC,SAAS,CAAC;QACpC,IAAIuG,eAAe,IAAAD,qBAAA,GACf9H,CAAC,CAACkH,aAAa,CAACc,aAAa,cAAAF,qBAAA,uBAA7BA,qBAAA,CAA+BG,OAAO,CAClC,wBACJ,CAAC;QACL,OAAOF,eAAe,EAAE;UAAA,IAAAG,qBAAA,EAAAC,qBAAA;UACpB,MAAMC,aAAa,IAAAF,qBAAA,GAAGH,eAAe,CAChCM,YAAY,CAAC,WAAW,CAAC,cAAAH,qBAAA,uBADRA,qBAAA,CAEhBI,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;UACrB,IAAIF,aAAa,KAAKxE,kBAAkB,EAAE;YACtCmE,eAAe,CAACH,KAAK,CAAC,CAAC;YACvB;UACJ;UACAG,eAAe,IAAAI,qBAAA,GACXJ,eAAe,CAACC,aAAa,cAAAG,qBAAA,uBAA7BA,qBAAA,CAA+BF,OAAO,CAClC,wBACJ,CAAC;QACT;MACJ;IACJ;EACJ,CAAC,EACD,CACIrE,kBAAkB,EAClBC,cAAc,EACduC,eAAe,EACfJ,2BAA2B,EAC3BD,mBAAmB,EACnBN,MAAM,EACNzB,yBAAyB,EACzBiB,IAAI,CAEZ,CAAC;EAED,MAAMsD,WAAW,GAAG,IAAAlC,mBAAW,EAC1BrG,CAA6B,IAAK;IAC/B,IACIA,CAAC,CAACkH,aAAa,KAAKlH,CAAC,CAACmH,MAAM,IAC5BnB,2BAA2B,IAC3B,OAAOhC,yBAAyB,KAAK,UAAU,EACjD;MACEgB,qBAAqB,CAAC,IAAI,CAAC;MAC3BhB,yBAAyB,CAACiB,IAAI,CAAC;IACnC;EACJ,CAAC,EACD,CAACe,2BAA2B,EAAEhC,yBAAyB,EAAEiB,IAAI,CACjE,CAAC;EAED,MAAMuD,UAAU,GAAG,IAAAnC,mBAAW,EACzBrG,CAA6B,IAAK;IAC/B,IACIgG,2BAA2B,IAC3B,OAAOhC,yBAAyB,KAAK,UAAU,IAC/C,OAAOJ,kBAAkB,KAAK,QAAQ,EACxC;MACE,MAAM6E,kBAAkB,GAAGzI,CAAC,CAAC0I,aAA4B;MACzD,MAAMC,mBAAmB,GAAG3I,CAAC,CAACkH,aAA4B;MAE1D,IAAI,CAACuB,kBAAkB,IAAI,CAACE,mBAAmB,CAACC,QAAQ,CAACH,kBAAkB,CAAC,EAAE;QAC1EzD,qBAAqB,CAAC,KAAK,CAAC;QAC5BhB,yBAAyB,CAACxC,SAAS,CAAC;MACxC;IACJ;EACJ,CAAC,EACD,CAACoC,kBAAkB,EAAEoC,2BAA2B,EAAEhC,yBAAyB,CAC/E,CAAC;EAED,IAAAiC,iBAAS,EAAC,MAAM;IACZ,IAAI,CAACD,2BAA2B,EAAE;MAC9BhB,qBAAqB,CAAC,KAAK,CAAC;IAChC,CAAC,MAAM,IACHjB,mBAAmB,IAAI,IAAI,IAC3B,OAAOC,yBAAyB,KAAK,UAAU,IAC/C,CAAAH,cAAc,aAAdA,cAAc,uBAAdA,cAAc,CAAG,CAAC,CAAC,MAAKoB,IAAI,EAC9B;MACEjB,yBAAyB,CAACiB,IAAI,CAAC;IACnC;EACJ,CAAC,EAAE,CACCpB,cAAc,EACdE,mBAAmB,EACnBiC,2BAA2B,EAC3BhC,yBAAyB,EACzBiB,IAAI,CACP,CAAC;EAEF,oBACI9F,OAAA,CAAAe,OAAA,CAAA2I,aAAA,CAAC/I,UAAA,CAAAgJ,qBAAqB;IAClBC,OAAO,EAAE;MAAElC,MAAM,EAAE,MAAM;MAAEC,OAAO,EAAE;IAAE,CAAE;IACxC,aAAW,GAAGlD,kBAAkB,IAAI,EAAE,MAAMqB,IAAI,EAAG;IACnD+D,SAAS,EAAC,uBAAuB;IACjCC,IAAI,EAAE;MAAEpC,MAAM,EAAE,CAAC;MAAEC,OAAO,EAAE;IAAE,CAAE;IAChCoC,OAAO,EAAEtC,gBAAiB;IAC1BuC,OAAO,EAAE1D,MAAO;IAChBsB,QAAQ,EAAEA,QAAS;IACnBqC,gBAAgB,EAAE,CAAClD,eAAe,IAAI,CAAC3E,SAAU;IACjD8H,gBAAgB,EAAEhF,eAAgB;IAClCiF,UAAU,EAAE/H,SAAU;IACtBgI,sBAAsB,EAAE5G,qBAAsB;IAC9C6G,qBAAqB,EAAE5G,oBAAqB;IAC5C6G,qBAAqB,EAAE1G,oBAAqB;IAC5C2G,kBAAkB,EAAEpG,MAAM,aAANA,MAAM,uBAANA,MAAM,CAAEqG,iBAAkB;IAC9CC,iCAAiC,EAAElF,yCAA0C;IAC7EmF,+BAA+B,EAAEhE,8BAA+B;IAChEiE,SAAS,EAAE9C,aAAc;IACzB+C,OAAO,EAAExB,WAAY;IACrByB,MAAM,EAAExB,UAAW;IACnByB,YAAY,EAAE5H,YAAa;IAC3B6H,YAAY,EAAE9H,UAAW;IACzB+H,UAAU,EAAE;MAAEC,QAAQ,EAAEhH,mBAAmB,GAAG,CAAC,GAAG;IAAK;EAAE,gBAEzDjE,OAAA,CAAAe,OAAA,CAAA2I,aAAA,CAAC1H,gBAAgB,CAACkJ,QAAQ;IAACC,KAAK,EAAE9D;EAA8B,gBAC5DrH,OAAA,CAAAe,OAAA,CAAA2I,aAAA,CAAC5J,MAAA,CAAAsL,YAAY;IAACJ,UAAU,EAAE;MAAEK,IAAI,EAAE;IAAQ;EAAE,gBACxCrL,OAAA,CAAAe,OAAA,CAAA2I,aAAA,CAACjJ,cAAA,CAAAM,OAAa;IACV+E,IAAI,EAAEA,IAAK;IACXrD,IAAI,EAAEA,IAAK;IACX6D,MAAM,EAAEA,MAAO;IACfrC,mBAAmB,EAAEA,mBAAoB;IACzCrB,OAAO,EAAEA,OAAQ;IACjBE,aAAa,EAAEA,aAAa,IAAIH,UAAW;IAC3CP,SAAS,EAAEA,SAAS,KAAK,IAAK;IAC9BkJ,OAAO,EAAErE,eAAgB;IACzB7D,cAAc,EAAEA,cAAe;IAC/BC,YAAY,EAAEA,YAAa;IAC3BC,iBAAiB,EAAEA,iBAAkB;IACrCC,WAAW,EAAEA,WAAY;IACzBI,gBAAgB,EAAEA,gBAAiB;IACnCE,KAAK,EAAEA,KAAM;IACbC,YAAY,EAAEA,YAAa;IAC3BC,kBAAkB,EAAEA,kBAAmB;IACvCC,eAAe,EAAEA,eAAgB;IACjCuH,UAAU,EAAEpH,MAAM,aAANA,MAAM,uBAANA,MAAM,CAAEoH,UAAW;IAC/BjH,gCAAgC,EAAEiB;EAA0C,CAC/E,CAAC,eACFvF,OAAA,CAAAe,OAAA,CAAA2I,aAAA,CAAC5J,MAAA,CAAA0L,eAAe;IAACzB,OAAO,EAAE;EAAM,GAC3B,CAACzD,MAAM,IAAI5C,kBAAkB,kBAC1B1D,OAAA,CAAAe,OAAA,CAAA2I,aAAA,CAACpJ,cAAA,CAAAS,OAAa;IACVkD,mBAAmB,EAAEA,mBAAoB;IACzCwH,SAAS,EAAElJ,aAAc;IACzBmJ,QAAQ,EAAE3I,YAAa;IACvB4I,mBAAmB,EAAEtH,uBAAwB;IAC7CuH,cAAc,EAAElI,kBAAkB,IAAI,CAAC4C;EAAO,gBAE9CtG,OAAA,CAAAe,OAAA,CAAA2I,aAAA,CAAChJ,yBAAA,CAAA0E,uBAAuB,CAAC8F,QAAQ;IAC7BC,KAAK,EAAE3D;EAAqC,gBAE5CxH,OAAA,CAAAe,OAAA,CAAA2I,aAAA,CAACtJ,oBAAA,CAAAyL,WAAW,CAACX,QAAQ;IAACC,KAAK,EAAE7D;EAAyB,GACjD9E,QACiB,CACQ,CACvB,CAEN,CACP,CACS,CACR,CAAC;AAEhC,CAAC;AAEDF,SAAS,CAACwJ,WAAW,GAAG,WAAW;AAAC,IAAAC,QAAA,GAAA9J,OAAA,CAAAlB,OAAA,GAErBuB,SAAS","ignoreList":[]}
|
|
@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
exports.StyledMotionAccordion = void 0;
|
|
7
7
|
var _react = require("motion/react");
|
|
8
8
|
var _styledComponents = _interopRequireWildcard(require("styled-components"));
|
|
9
|
+
var _keyboardFocusHighlighting = require("../../utils/keyboardFocusHighlighting.styles");
|
|
9
10
|
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
|
|
10
11
|
const StyledMotionAccordion = exports.StyledMotionAccordion = (0, _styledComponents.default)(_react.motion.div)`
|
|
11
12
|
${({
|
|
@@ -76,12 +77,31 @@ const StyledMotionAccordion = exports.StyledMotionAccordion = (0, _styledCompone
|
|
|
76
77
|
${({
|
|
77
78
|
$isWrapped,
|
|
78
79
|
$shouldHideBackground,
|
|
79
|
-
theme
|
|
80
|
+
theme,
|
|
81
|
+
$shouldEnableKeyboardHighlighting
|
|
80
82
|
}) => !$isWrapped && !$shouldHideBackground && (0, _styledComponents.css)`
|
|
81
|
-
&:hover
|
|
82
|
-
&:focus-visible {
|
|
83
|
+
&:hover {
|
|
83
84
|
background-color: rgba(${theme['100-rgb']}, ${theme.cardBackgroundOpacity});
|
|
84
85
|
}
|
|
86
|
+
${!$shouldEnableKeyboardHighlighting ? (0, _styledComponents.css)`
|
|
87
|
+
&:focus-visible {
|
|
88
|
+
background-color: rgba(
|
|
89
|
+
${theme['100-rgb']},
|
|
90
|
+
${theme.cardBackgroundOpacity}
|
|
91
|
+
);
|
|
92
|
+
}
|
|
93
|
+
` : null}
|
|
94
|
+
`};
|
|
95
|
+
|
|
96
|
+
${({
|
|
97
|
+
$shouldEnableKeyboardHighlighting,
|
|
98
|
+
$shouldShowKeyboardHighlighting,
|
|
99
|
+
$shouldHideBackground
|
|
100
|
+
}) => $shouldEnableKeyboardHighlighting && $shouldShowKeyboardHighlighting && !$shouldHideBackground && (0, _styledComponents.css)`
|
|
101
|
+
&:focus-visible {
|
|
102
|
+
transition: none;
|
|
103
|
+
${_keyboardFocusHighlighting.keyboardFocusHighlightingRingCss};
|
|
104
|
+
}
|
|
85
105
|
`};
|
|
86
106
|
`;
|
|
87
107
|
//# sourceMappingURL=Accordion.styles.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Accordion.styles.js","names":["_react","require","_styledComponents","_interopRequireWildcard","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","StyledMotionAccordion","exports","styled","motion","div","$isOpen","$isWrapped","$shouldForceBackground","$shouldHideBackground","theme","css","cardBackgroundOpacity","cardBorderRadius","cardShadow","accordionLines","$shouldShowLines","$shouldHideBottomLine","$bottomBorderColor","undefined","shouldShowBottomBorder","$isParentWrapped"],"sources":["../../../../src/components/accordion/Accordion.styles.ts"],"sourcesContent":["import { motion } from 'motion/react';\nimport styled, { css } from 'styled-components';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledMotionAccordionProps = WithTheme<{\n $isOpen: boolean;\n $isParentWrapped?: boolean;\n $isWrapped?: boolean;\n $shouldForceBackground?: boolean;\n $shouldHideBackground?: boolean;\n $shouldShowLines?: boolean;\n $shouldHideBottomLine: boolean;\n $bottomBorderColor?: string;\n}>;\n\nexport const StyledMotionAccordion = styled(motion.div)<StyledMotionAccordionProps>`\n ${({\n $isOpen,\n $isWrapped,\n $shouldForceBackground,\n $shouldHideBackground,\n theme,\n }: StyledMotionAccordionProps) =>\n ($isOpen || $shouldForceBackground) &&\n !$isWrapped &&\n !$shouldHideBackground &&\n css`\n background-color: rgba(${theme['100-rgb']}, ${theme.cardBackgroundOpacity});\n border-radius: ${theme.cardBorderRadius}px;\n box-shadow: 0 2px 6px 0 rgba(0, 0, 0, ${theme.cardShadow});\n `}\n\n ${({ theme }: StyledMotionAccordionProps) =>\n theme.accordionLines &&\n css`\n border-bottom: 1px solid transparent;\n `}\n\n margin-bottom: ${({ $isOpen, $isWrapped }: StyledMotionAccordionProps) =>\n $isOpen && !$isWrapped ? '30px' : '0px'};\n transition:\n background-color 0.3s ease,\n border-bottom-color 0.3s ease,\n border-radius 0.3s ease,\n box-shadow 0.3s ease,\n margin-bottom 0.3s ease;\n will-change: unset !important;\n\n margin-top: 10px;\n\n ${({\n $isOpen,\n $isWrapped,\n $shouldForceBackground,\n $shouldShowLines,\n $shouldHideBottomLine,\n theme,\n $bottomBorderColor,\n }: StyledMotionAccordionProps) => {\n if ($shouldForceBackground || $shouldHideBottomLine) return undefined;\n const shouldShowBottomBorder =\n theme.accordionLines && $shouldShowLines && ($isWrapped || !$isOpen);\n\n if ($bottomBorderColor && shouldShowBottomBorder)\n return css`\n border-bottom-color: ${$bottomBorderColor};\n `;\n\n if (shouldShowBottomBorder) {\n return css`\n border-bottom-color: rgba(${theme['headline-rgb']}, 1);\n `;\n }\n\n return undefined;\n }}\n ${({ $isParentWrapped }: StyledMotionAccordionProps) =>\n $isParentWrapped &&\n css`\n padding-left: 17px;\n `}\n ${({ $isWrapped }: StyledMotionAccordionProps) =>\n !$isWrapped\n ? css`\n margin-top: 5px;\n `\n : css`\n margin: 0;\n `}\n ${({
|
|
1
|
+
{"version":3,"file":"Accordion.styles.js","names":["_react","require","_styledComponents","_interopRequireWildcard","_keyboardFocusHighlighting","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","StyledMotionAccordion","exports","styled","motion","div","$isOpen","$isWrapped","$shouldForceBackground","$shouldHideBackground","theme","css","cardBackgroundOpacity","cardBorderRadius","cardShadow","accordionLines","$shouldShowLines","$shouldHideBottomLine","$bottomBorderColor","undefined","shouldShowBottomBorder","$isParentWrapped","$shouldEnableKeyboardHighlighting","$shouldShowKeyboardHighlighting","keyboardFocusHighlightingRingCss"],"sources":["../../../../src/components/accordion/Accordion.styles.ts"],"sourcesContent":["import { motion } from 'motion/react';\nimport styled, { css } from 'styled-components';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\nimport { keyboardFocusHighlightingRingCss } from '../../utils/keyboardFocusHighlighting.styles';\n\ntype StyledMotionAccordionProps = WithTheme<{\n $isOpen: boolean;\n $isParentWrapped?: boolean;\n $isWrapped?: boolean;\n $shouldForceBackground?: boolean;\n $shouldHideBackground?: boolean;\n $shouldShowLines?: boolean;\n $shouldHideBottomLine: boolean;\n $bottomBorderColor?: string;\n $shouldEnableKeyboardHighlighting?: boolean;\n $shouldShowKeyboardHighlighting?: boolean;\n}>;\n\nexport const StyledMotionAccordion = styled(motion.div)<StyledMotionAccordionProps>`\n ${({\n $isOpen,\n $isWrapped,\n $shouldForceBackground,\n $shouldHideBackground,\n theme,\n }: StyledMotionAccordionProps) =>\n ($isOpen || $shouldForceBackground) &&\n !$isWrapped &&\n !$shouldHideBackground &&\n css`\n background-color: rgba(${theme['100-rgb']}, ${theme.cardBackgroundOpacity});\n border-radius: ${theme.cardBorderRadius}px;\n box-shadow: 0 2px 6px 0 rgba(0, 0, 0, ${theme.cardShadow});\n `}\n\n ${({ theme }: StyledMotionAccordionProps) =>\n theme.accordionLines &&\n css`\n border-bottom: 1px solid transparent;\n `}\n\n margin-bottom: ${({ $isOpen, $isWrapped }: StyledMotionAccordionProps) =>\n $isOpen && !$isWrapped ? '30px' : '0px'};\n transition:\n background-color 0.3s ease,\n border-bottom-color 0.3s ease,\n border-radius 0.3s ease,\n box-shadow 0.3s ease,\n margin-bottom 0.3s ease;\n will-change: unset !important;\n\n margin-top: 10px;\n\n ${({\n $isOpen,\n $isWrapped,\n $shouldForceBackground,\n $shouldShowLines,\n $shouldHideBottomLine,\n theme,\n $bottomBorderColor,\n }: StyledMotionAccordionProps) => {\n if ($shouldForceBackground || $shouldHideBottomLine) return undefined;\n const shouldShowBottomBorder =\n theme.accordionLines && $shouldShowLines && ($isWrapped || !$isOpen);\n\n if ($bottomBorderColor && shouldShowBottomBorder)\n return css`\n border-bottom-color: ${$bottomBorderColor};\n `;\n\n if (shouldShowBottomBorder) {\n return css`\n border-bottom-color: rgba(${theme['headline-rgb']}, 1);\n `;\n }\n\n return undefined;\n }}\n ${({ $isParentWrapped }: StyledMotionAccordionProps) =>\n $isParentWrapped &&\n css`\n padding-left: 17px;\n `}\n ${({ $isWrapped }: StyledMotionAccordionProps) =>\n !$isWrapped\n ? css`\n margin-top: 5px;\n `\n : css`\n margin: 0;\n `}\n ${({\n $isWrapped,\n $shouldHideBackground,\n theme,\n $shouldEnableKeyboardHighlighting,\n }: StyledMotionAccordionProps) =>\n !$isWrapped &&\n !$shouldHideBackground &&\n css`\n &:hover {\n background-color: rgba(${theme['100-rgb']}, ${theme.cardBackgroundOpacity});\n }\n ${!$shouldEnableKeyboardHighlighting\n ? css`\n &:focus-visible {\n background-color: rgba(\n ${theme['100-rgb']},\n ${theme.cardBackgroundOpacity}\n );\n }\n `\n : null}\n `};\n\n ${({\n $shouldEnableKeyboardHighlighting,\n $shouldShowKeyboardHighlighting,\n $shouldHideBackground,\n }: StyledMotionAccordionProps) =>\n $shouldEnableKeyboardHighlighting &&\n $shouldShowKeyboardHighlighting &&\n !$shouldHideBackground &&\n css`\n &:focus-visible {\n transition: none;\n ${keyboardFocusHighlightingRingCss};\n }\n `};\n`;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -8,7 +8,9 @@ var _react = require("motion/react");
|
|
|
8
8
|
var _styledComponents = _interopRequireWildcard(require("styled-components"));
|
|
9
9
|
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
|
|
10
10
|
const StyledMotionAccordionBody = exports.StyledMotionAccordionBody = (0, _styledComponents.default)(_react.motion.div)`
|
|
11
|
-
overflow:
|
|
11
|
+
/* overflow: clip erlaubt overflow-clip-margin, sodass der Fokusring sichtbar bleibt */
|
|
12
|
+
overflow: clip;
|
|
13
|
+
overflow-clip-margin: 4px;
|
|
12
14
|
transition: none !important;
|
|
13
15
|
|
|
14
16
|
${({
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AccordionBody.styles.js","names":["_react","require","_styledComponents","_interopRequireWildcard","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","StyledMotionAccordionBody","exports","styled","motion","div","$maxHeight","css"],"sources":["../../../../../src/components/accordion/accordion-body/AccordionBody.styles.ts"],"sourcesContent":["import { motion } from 'motion/react';\nimport styled, { css } from 'styled-components';\nimport type { WithTheme } from '../../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledMotionAccordionBodyProps = WithTheme<{\n $maxHeight?: number;\n}>;\n\nexport const StyledMotionAccordionBody = styled(motion.div)<StyledMotionAccordionBodyProps>`\n overflow:
|
|
1
|
+
{"version":3,"file":"AccordionBody.styles.js","names":["_react","require","_styledComponents","_interopRequireWildcard","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","StyledMotionAccordionBody","exports","styled","motion","div","$maxHeight","css"],"sources":["../../../../../src/components/accordion/accordion-body/AccordionBody.styles.ts"],"sourcesContent":["import { motion } from 'motion/react';\nimport styled, { css } from 'styled-components';\nimport type { WithTheme } from '../../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledMotionAccordionBodyProps = WithTheme<{\n $maxHeight?: number;\n}>;\n\nexport const StyledMotionAccordionBody = styled(motion.div)<StyledMotionAccordionBodyProps>`\n /* overflow: clip erlaubt overflow-clip-margin, sodass der Fokusring sichtbar bleibt */\n overflow: clip;\n overflow-clip-margin: 4px;\n transition: none !important;\n\n ${({ $maxHeight }) =>\n typeof $maxHeight === 'number' &&\n css`\n max-height: ${$maxHeight}px;\n overflow-y: scroll;\n `}\n`;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,iBAAA,GAAAC,uBAAA,CAAAF,OAAA;AAAgD,SAAAE,wBAAAC,CAAA,EAAAC,CAAA,6BAAAC,OAAA,MAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAH,uBAAA,YAAAA,CAAAC,CAAA,EAAAC,CAAA,SAAAA,CAAA,IAAAD,CAAA,IAAAA,CAAA,CAAAK,UAAA,SAAAL,CAAA,MAAAM,CAAA,EAAAC,CAAA,EAAAC,CAAA,KAAAC,SAAA,QAAAC,OAAA,EAAAV,CAAA,iBAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,SAAAQ,CAAA,MAAAF,CAAA,GAAAL,CAAA,GAAAG,CAAA,GAAAD,CAAA,QAAAG,CAAA,CAAAK,GAAA,CAAAX,CAAA,UAAAM,CAAA,CAAAM,GAAA,CAAAZ,CAAA,GAAAM,CAAA,CAAAO,GAAA,CAAAb,CAAA,EAAAQ,CAAA,gBAAAP,CAAA,IAAAD,CAAA,gBAAAC,CAAA,OAAAa,cAAA,CAAAC,IAAA,CAAAf,CAAA,EAAAC,CAAA,OAAAM,CAAA,IAAAD,CAAA,GAAAU,MAAA,CAAAC,cAAA,KAAAD,MAAA,CAAAE,wBAAA,CAAAlB,CAAA,EAAAC,CAAA,OAAAM,CAAA,CAAAK,GAAA,IAAAL,CAAA,CAAAM,GAAA,IAAAP,CAAA,CAAAE,CAAA,EAAAP,CAAA,EAAAM,CAAA,IAAAC,CAAA,CAAAP,CAAA,IAAAD,CAAA,CAAAC,CAAA,WAAAO,CAAA,KAAAR,CAAA,EAAAC,CAAA;AAOzC,MAAMkB,yBAAyB,GAAAC,OAAA,CAAAD,yBAAA,GAAG,IAAAE,yBAAM,EAACC,aAAM,CAACC,GAAG,CAAiC;AAC3F;AACA;AACA;AACA;AACA;AACA,MAAM,CAAC;EAAEC;AAAW,CAAC,KACb,OAAOA,UAAU,KAAK,QAAQ,IAC9B,IAAAC,qBAAG;AACX,0BAA0BD,UAAU;AACpC;AACA,SAAS;AACT,CAAC","ignoreList":[]}
|
|
@@ -15,7 +15,10 @@ const AccordionGroupContext = exports.AccordionGroupContext = /*#__PURE__*/_reac
|
|
|
15
15
|
setOpenAccordionUuid: undefined,
|
|
16
16
|
updateOpenAccordionUuid: undefined,
|
|
17
17
|
accordionUuids: undefined,
|
|
18
|
-
|
|
18
|
+
registerAccordionUuid: undefined,
|
|
19
|
+
unregisterAccordionUuid: undefined,
|
|
20
|
+
activeAccordionUuid: undefined,
|
|
21
|
+
updateActiveAccordionUuid: undefined,
|
|
19
22
|
accordionGroupUuid: undefined
|
|
20
23
|
});
|
|
21
24
|
AccordionGroupContext.displayName = 'AccordionGroupContext';
|
|
@@ -27,13 +30,10 @@ const AccordionGroup = ({
|
|
|
27
30
|
}) => {
|
|
28
31
|
const [openAccordionUuid, setOpenAccordionUuid] = (0, _react2.useState)(undefined);
|
|
29
32
|
const [accordionUuids, setAccordionUuids] = (0, _react2.useState)();
|
|
33
|
+
const [activeAccordionUuid, setActiveAccordionUuid] = (0, _react2.useState)(undefined);
|
|
30
34
|
const accordionGroupId = (0, _uuid.useUuid)();
|
|
31
35
|
const isInitialRenderRef = (0, _react2.useRef)(true);
|
|
32
|
-
const updateAccordionUuids = (0, _react2.useCallback)(uuids => {
|
|
33
|
-
setAccordionUuids(uuids);
|
|
34
|
-
}, []);
|
|
35
36
|
const areaProvider = (0, _react2.useContext)(_AreaContextProvider.AreaContext);
|
|
36
|
-
const childrenCount = _react2.default.Children.count(children);
|
|
37
37
|
const shouldWrap = areaProvider.shouldChangeColor ? true : isWrapped;
|
|
38
38
|
const updateOpenAccordionUuid = (0, _react2.useCallback)((uuid, {
|
|
39
39
|
shouldOnlyOpen
|
|
@@ -45,19 +45,33 @@ const AccordionGroup = ({
|
|
|
45
45
|
return uuid;
|
|
46
46
|
});
|
|
47
47
|
}, [setOpenAccordionUuid]);
|
|
48
|
-
(0, _react2.
|
|
49
|
-
if (
|
|
50
|
-
const
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
48
|
+
const sortAccordionUuidsByDom = (0, _react2.useCallback)(uuids => {
|
|
49
|
+
if (typeof document === 'undefined') return uuids;
|
|
50
|
+
const domOrderedUuids = Array.from(document.querySelectorAll(`[data-uuid^="${accordionGroupId}---"]`)).map(element => {
|
|
51
|
+
var _element$getAttribute;
|
|
52
|
+
return (_element$getAttribute = element.getAttribute('data-uuid')) === null || _element$getAttribute === void 0 ? void 0 : _element$getAttribute.split('---')[1];
|
|
53
|
+
}).filter(uuid => Boolean(uuid));
|
|
54
|
+
return domOrderedUuids.filter(uuid => uuids.includes(uuid));
|
|
55
|
+
}, [accordionGroupId]);
|
|
56
|
+
const registerAccordionUuid = (0, _react2.useCallback)(uuid => {
|
|
57
|
+
setAccordionUuids((currentAccordionUuids = []) => {
|
|
58
|
+
const nextAccordionUuids = currentAccordionUuids.includes(uuid) ? currentAccordionUuids : [...currentAccordionUuids, uuid];
|
|
59
|
+
return sortAccordionUuidsByDom(nextAccordionUuids);
|
|
58
60
|
});
|
|
59
|
-
|
|
60
|
-
|
|
61
|
+
}, [sortAccordionUuidsByDom]);
|
|
62
|
+
const unregisterAccordionUuid = (0, _react2.useCallback)(uuid => {
|
|
63
|
+
setAccordionUuids((currentAccordionUuids = []) => currentAccordionUuids.filter(currentUuid => currentUuid !== uuid));
|
|
64
|
+
}, []);
|
|
65
|
+
const updateActiveAccordionUuid = (0, _react2.useCallback)(uuid => {
|
|
66
|
+
setActiveAccordionUuid(uuid);
|
|
67
|
+
}, []);
|
|
68
|
+
(0, _react2.useEffect)(() => {
|
|
69
|
+
if (!(accordionUuids !== null && accordionUuids !== void 0 && accordionUuids.length)) {
|
|
70
|
+
setActiveAccordionUuid(undefined);
|
|
71
|
+
return;
|
|
72
|
+
}
|
|
73
|
+
setActiveAccordionUuid(currentActiveAccordionUuid => currentActiveAccordionUuid && accordionUuids.includes(currentActiveAccordionUuid) ? currentActiveAccordionUuid : undefined);
|
|
74
|
+
}, [accordionUuids]);
|
|
61
75
|
(0, _react2.useEffect)(() => {
|
|
62
76
|
if (isInitialRenderRef.current) {
|
|
63
77
|
isInitialRenderRef.current = false;
|
|
@@ -74,10 +88,13 @@ const AccordionGroup = ({
|
|
|
74
88
|
openAccordionUuid,
|
|
75
89
|
setOpenAccordionUuid,
|
|
76
90
|
updateOpenAccordionUuid,
|
|
77
|
-
updateAccordionUuids,
|
|
78
91
|
accordionUuids,
|
|
92
|
+
registerAccordionUuid,
|
|
93
|
+
unregisterAccordionUuid,
|
|
94
|
+
activeAccordionUuid,
|
|
95
|
+
updateActiveAccordionUuid,
|
|
79
96
|
accordionGroupUuid: accordionGroupId
|
|
80
|
-
}), [accordionGroupId, accordionUuids, shouldWrap, openAccordionUuid,
|
|
97
|
+
}), [accordionGroupId, accordionUuids, shouldWrap, openAccordionUuid, registerAccordionUuid, unregisterAccordionUuid, updateOpenAccordionUuid, activeAccordionUuid, updateActiveAccordionUuid]);
|
|
81
98
|
return /*#__PURE__*/_react2.default.createElement(AccordionGroupContext.Provider, {
|
|
82
99
|
value: providerValue
|
|
83
100
|
}, /*#__PURE__*/_react2.default.createElement(_react.MotionConfig, {
|