@chayns-components/core 5.0.13 → 5.0.15
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/lib/cjs/components/combobox/ComboBox.js +10 -2
- package/lib/cjs/components/combobox/ComboBox.js.map +1 -1
- package/lib/cjs/components/combobox/ComboBox.styles.js +32 -2
- package/lib/cjs/components/combobox/ComboBox.styles.js.map +1 -1
- package/lib/cjs/components/multi-action-button/MultiActionButton.js +2 -2
- package/lib/cjs/components/multi-action-button/MultiActionButton.js.map +1 -1
- package/lib/cjs/components/multi-action-button/MultiActionButton.types.js.map +1 -1
- package/lib/cjs/index.js +7 -1
- package/lib/cjs/index.js.map +1 -1
- package/lib/esm/components/combobox/ComboBox.js +9 -1
- package/lib/esm/components/combobox/ComboBox.js.map +1 -1
- package/lib/esm/components/combobox/ComboBox.styles.js +32 -2
- package/lib/esm/components/combobox/ComboBox.styles.js.map +1 -1
- package/lib/esm/components/multi-action-button/MultiActionButton.js +2 -2
- package/lib/esm/components/multi-action-button/MultiActionButton.js.map +1 -1
- package/lib/esm/components/multi-action-button/MultiActionButton.types.js.map +1 -1
- package/lib/esm/index.js +1 -1
- package/lib/esm/index.js.map +1 -1
- package/lib/types/components/combobox/ComboBox.d.ts +8 -0
- package/lib/types/components/combobox/ComboBox.styles.d.ts +3 -1
- package/lib/types/components/multi-action-button/MultiActionButton.types.d.ts +7 -0
- package/lib/types/index.d.ts +1 -1
- package/package.json +2 -2
package/lib/cjs/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["_Accordion","_interopRequireDefault","require","_AccordionContent","_AccordionGroup","_AccordionIntro","_AccordionItem","_AmountControl","_VerificationBadge","_AreaContextProvider","_interopRequireWildcard","_Badge","_Button","_Checkbox","_ColorSchemeProvider","_Badge2","_container","_dropdown","_element","_ref","_Filter","_AnimatedNumber","_FileList","_FileSelect","_DropdownBodyWrapper","_ComboBox","_ContentCard","_HighlightSlider","_ContextMenu","_ContextMenu2","_ExpandableContent","_FileInput","_FilterButton","_FilterButtons","_GridImage","_GroupedImage","_Icon","_Input","_List","_ListItemContent","_ListItem","_MentionFinder","_MultiActionButton","_NumberInput","_PageProvider","_Popup","_PopupContent","_ProgressBar","_popup","_RadioButtonGroup","_RadioButton","_ScrollView","_SearchBox","_SearchInput","_SelectButton","_SetupWizardItem","_SetupWizard","_SharingBar","_Signature","_SliderButton","_Slider","_SmallWaitCursor","_TagInput","_TextArea","_Tooltip","_Truncation","_mentionFinder","_contentCard","_file","_filterButtons","_MultiActionButton2","_truncation","_environment","_fileDialog","_isTobitEmployee","_pageProvider","_uploadFile","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor"],"sources":["../../src/index.ts"],"sourcesContent":["// noinspection JSUnusedGlobalSymbols\n\nexport { default as Accordion } from './components/accordion/Accordion';\nexport { default as AccordionContent } from './components/accordion/accordion-content/AccordionContent';\nexport { default as AccordionGroup } from './components/accordion/accordion-group/AccordionGroup';\nexport { default as AccordionIntro } from './components/accordion/accordion-intro/AccordionIntro';\nexport { default as AccordionItem } from './components/accordion/accordion-item/AccordionItem';\nexport { default as AmountControl } from './components/amount-control/AmountControl';\nexport { default as VerificationBadge } from './components/verification-badge/VerificationBadge';\nexport {\n AreaContext,\n default as AreaProvider,\n} from './components/area-provider/AreaContextProvider';\nexport { default as Badge } from './components/badge/Badge';\nexport { default as Button } from './components/button/Button';\nexport { default as Checkbox } from './components/checkbox/Checkbox';\nexport {\n default as ColorSchemeProvider,\n useColorScheme,\n} from './components/color-scheme-provider/ColorSchemeProvider';\nexport { BadgeSize, BadgeDesign } from './components/badge/Badge.types';\nexport type {\n ColorSchemeContextProps,\n WithTheme,\n} from './components/color-scheme-provider/ColorSchemeProvider';\nexport { useContainer, ContainerAnchor } from './hooks/container';\nexport { DropdownDirection, type DropdownCoordinates } from './types/dropdown';\nexport { useIsMeasuredClone } from './hooks/element';\nexport { useCombinedRefs } from './hooks/ref';\nexport { default as Filter, type FilterRightIcon } from './components/filter/Filter';\nexport {\n type SortItem,\n type SearchConfig,\n type SortConfig,\n type CheckboxConfig,\n type FilterButtonConfig,\n type FilterRef,\n} from './types/filter';\nexport { default as AnimatedNumber } from './components/animated-number/AnimatedNumber';\nexport {\n default as FileList,\n type IFileItem as FileListItem,\n} from './components/file-list/FileList';\nexport { default as FileSelect } from './components/file-select/FileSelect';\nexport { default as DropdownBodyWrapper } from './components/dropdown-body-wrapper/DropdownBodyWrapper';\nexport {\n default as ComboBox,\n type ComboBoxTextStyles,\n type IComboBoxItem as ComboBoxItem,\n type IComboBoxItems as ComboBoxItems,\n type ComboBoxRef,\n} from './components/combobox/ComboBox';\nexport { default as ContentCard } from './components/content-card/ContentCard';\nexport { default as HighlightSlider } from './components/highlight-slider/HighlightSlider';\nexport type { HighlightSliderItemColors as HighlightSliderColors } from './components/highlight-slider/highlight-slider-item/HighlightSliderItem';\nexport { default as ContextMenu } from './components/context-menu/ContextMenu';\nexport {\n ContextMenuAlignment,\n type ContextMenuCoordinates,\n type ContextMenuItem,\n type ContextMenuProps,\n type ContextMenuRef,\n} from './components/context-menu/ContextMenu.types';\nexport { default as ExpandableContent } from './components/expandable-content/ExpandableContent';\nexport {\n default as FileInput,\n type FileInputRef,\n STREAMINGSERVICE_FILE_TYPES,\n TSIMG_FILE_TYPES,\n} from './components/file-input/FileInput';\nexport { default as FilterButton } from './components/filter-buttons/filter-button/FilterButton';\nexport { default as FilterButtons } from './components/filter-buttons/FilterButtons';\nexport { default as GridImage } from './components/grid-image/GridImage';\nexport { default as GroupedImage } from './components/grouped-image/GroupedImage';\nexport { default as Icon, type IconProps } from './components/icon/Icon';\nexport { default as Input, InputSize } from './components/input/Input';\nexport { default as List } from './components/list/List';\nexport { default as ListItemContent } from './components/list/list-item/list-item-content/ListItemContent';\nexport {\n default as ListItem,\n type ListItemElements,\n type ListItemProps,\n type ListItemRef,\n} from './components/list/list-item/ListItem';\nexport { default as MentionFinder } from './components/mention-finder/MentionFinder';\nexport type { MentionMember } from './components/mention-finder/MentionFinder';\nexport { default as MultiActionButton } from './components/multi-action-button/MultiActionButton';\nexport { default as NumberInput } from './components/number-input/NumberInput';\nexport { default as PageProvider } from './components/page-provider/PageProvider';\nexport { default as Popup } from './components/popup/Popup';\nexport { default as PopupContent } from './components/popup/popup-content/PopupContent';\nexport { default as ProgressBar } from './components/progress-bar/ProgressBar';\nexport { PopupAlignment } from './types/popup';\nexport {\n default as RadioButtonGroup,\n type RadioButtonGroupRef,\n} from './components/radio-button/radio-button-group/RadioButtonGroup';\nexport { default as RadioButton } from './components/radio-button/RadioButton';\nexport { default as ScrollView } from './components/scroll-view/ScrollView';\nexport { default as SearchBox } from './components/search-box/SearchBox';\nexport { default as SearchInput } from './components/search-input/SearchInput';\nexport { default as SelectButton } from './components/select-button/SelectButton';\nexport { default as SetupWizardItem } from './components/setup-wizard/setup-wizard-item/SetupWizardItem';\nexport { default as SetupWizard } from './components/setup-wizard/SetupWizard';\nexport type { SetupWizardRef } from './components/setup-wizard/SetupWizard';\nexport { default as SharingBar } from './components/sharing-bar/SharingBar';\nexport { default as Signature } from './components/signature/Signature';\nexport type { SignatureRef } from './components/signature/Signature';\nexport { default as SliderButton } from './components/slider-button/SliderButton';\nexport { default as Slider } from './components/slider/Slider';\nexport {\n default as SmallWaitCursor,\n SmallWaitCursorSize,\n SmallWaitCursorSpeed,\n} from './components/small-wait-cursor/SmallWaitCursor';\nexport type { Tag } from './types/tagInput';\nexport { default as TagInput } from './components/tag-input/TagInput';\nexport type { TagInputRef } from './components/tag-input/TagInput';\nexport { default as TextArea } from './components/text-area/TextArea';\nexport { default as Tooltip } from './components/tooltip/Tooltip';\nexport { default as Truncation } from './components/truncation/Truncation';\nexport { MentionFinderPopupAlignment } from './constants/mentionFinder';\nexport { useElementSize } from './hooks/element';\nexport type { BrowserName } from './types/chayns';\nexport { ContentCardType } from './types/contentCard';\nexport type { FileItem, Image, InternalFileItem, Meta, Video } from './types/file';\nexport { isValidFileType } from './utils/file';\nexport type { FileInputFileItem } from './types/fileInput';\nexport { FilterButtonItemShape, FilterButtonSize } from './types/filterButtons';\nexport type { IFilterButtonItem as FilterButtonItem } from './types/filterButtons';\nexport type { IListItemRightElements } from './types/list';\nexport type { PopupRef } from './types/popup';\nexport type { RadioButtonItem } from './types/radioButton';\nexport type {\n ISearchBoxItem as SearchBoxItem,\n ISearchBoxItems as SearchBoxItems,\n} from './types/searchBox';\nexport type { SelectButtonItem } from './types/selectButton';\nexport type { SliderButtonItem } from './types/slider-button';\nexport {\n type MultiActionButtonAction,\n type MultiActionButtonActionEvent,\n type MultiActionButtonActionStatus,\n MultiActionButtonHeight,\n type MultiActionButtonProps,\n MultiActionButtonStatusType,\n} from './components/multi-action-button/MultiActionButton.types';\nexport { ClampPosition } from './types/truncation';\nexport { useIsTouch } from './utils/environment';\nexport { filterFilesByMimeType, getFileAsArrayBuffer, selectFiles } from './utils/fileDialog';\nexport { isTobitEmployee } from './utils/isTobitEmployee';\nexport { getUsableHeight } from './utils/pageProvider';\nexport { uploadFile } from './utils/uploadFile';\nexport type { Theme } from './components/color-scheme-provider/ColorSchemeProvider';\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"index.js","names":["_Accordion","_interopRequireDefault","require","_AccordionContent","_AccordionGroup","_AccordionIntro","_AccordionItem","_AmountControl","_VerificationBadge","_AreaContextProvider","_interopRequireWildcard","_Badge","_Button","_Checkbox","_ColorSchemeProvider","_Badge2","_container","_dropdown","_element","_ref","_Filter","_AnimatedNumber","_FileList","_FileSelect","_DropdownBodyWrapper","_ComboBox","_ContentCard","_HighlightSlider","_ContextMenu","_ContextMenu2","_ExpandableContent","_FileInput","_FilterButton","_FilterButtons","_GridImage","_GroupedImage","_Icon","_Input","_List","_ListItemContent","_ListItem","_MentionFinder","_MultiActionButton","_NumberInput","_PageProvider","_Popup","_PopupContent","_ProgressBar","_popup","_RadioButtonGroup","_RadioButton","_ScrollView","_SearchBox","_SearchInput","_SelectButton","_SetupWizardItem","_SetupWizard","_SharingBar","_Signature","_SliderButton","_Slider","_SmallWaitCursor","_TagInput","_TextArea","_Tooltip","_Truncation","_mentionFinder","_contentCard","_file","_filterButtons","_MultiActionButton2","_truncation","_environment","_fileDialog","_isTobitEmployee","_pageProvider","_uploadFile","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor"],"sources":["../../src/index.ts"],"sourcesContent":["// noinspection JSUnusedGlobalSymbols\n\nexport { default as Accordion } from './components/accordion/Accordion';\nexport { default as AccordionContent } from './components/accordion/accordion-content/AccordionContent';\nexport { default as AccordionGroup } from './components/accordion/accordion-group/AccordionGroup';\nexport { default as AccordionIntro } from './components/accordion/accordion-intro/AccordionIntro';\nexport { default as AccordionItem } from './components/accordion/accordion-item/AccordionItem';\nexport { default as AmountControl } from './components/amount-control/AmountControl';\nexport { default as VerificationBadge } from './components/verification-badge/VerificationBadge';\nexport {\n AreaContext,\n default as AreaProvider,\n} from './components/area-provider/AreaContextProvider';\nexport { default as Badge } from './components/badge/Badge';\nexport { default as Button } from './components/button/Button';\nexport { default as Checkbox } from './components/checkbox/Checkbox';\nexport {\n default as ColorSchemeProvider,\n useColorScheme,\n} from './components/color-scheme-provider/ColorSchemeProvider';\nexport { BadgeSize, BadgeDesign } from './components/badge/Badge.types';\nexport type {\n ColorSchemeContextProps,\n WithTheme,\n} from './components/color-scheme-provider/ColorSchemeProvider';\nexport { useContainer, ContainerAnchor } from './hooks/container';\nexport { DropdownDirection, type DropdownCoordinates } from './types/dropdown';\nexport { useIsMeasuredClone } from './hooks/element';\nexport { useCombinedRefs } from './hooks/ref';\nexport { default as Filter, type FilterRightIcon } from './components/filter/Filter';\nexport {\n type SortItem,\n type SearchConfig,\n type SortConfig,\n type CheckboxConfig,\n type FilterButtonConfig,\n type FilterRef,\n} from './types/filter';\nexport { default as AnimatedNumber } from './components/animated-number/AnimatedNumber';\nexport {\n default as FileList,\n type IFileItem as FileListItem,\n} from './components/file-list/FileList';\nexport { default as FileSelect } from './components/file-select/FileSelect';\nexport { default as DropdownBodyWrapper } from './components/dropdown-body-wrapper/DropdownBodyWrapper';\nexport {\n default as ComboBox,\n type ComboBoxTextStyles,\n type IComboBoxItem as ComboBoxItem,\n type IComboBoxItems as ComboBoxItems,\n type ComboBoxRef,\n ComboBoxSize,\n} from './components/combobox/ComboBox';\nexport { default as ContentCard } from './components/content-card/ContentCard';\nexport { default as HighlightSlider } from './components/highlight-slider/HighlightSlider';\nexport type { HighlightSliderItemColors as HighlightSliderColors } from './components/highlight-slider/highlight-slider-item/HighlightSliderItem';\nexport { default as ContextMenu } from './components/context-menu/ContextMenu';\nexport {\n ContextMenuAlignment,\n type ContextMenuCoordinates,\n type ContextMenuItem,\n type ContextMenuProps,\n type ContextMenuRef,\n} from './components/context-menu/ContextMenu.types';\nexport { default as ExpandableContent } from './components/expandable-content/ExpandableContent';\nexport {\n default as FileInput,\n type FileInputRef,\n STREAMINGSERVICE_FILE_TYPES,\n TSIMG_FILE_TYPES,\n} from './components/file-input/FileInput';\nexport { default as FilterButton } from './components/filter-buttons/filter-button/FilterButton';\nexport { default as FilterButtons } from './components/filter-buttons/FilterButtons';\nexport { default as GridImage } from './components/grid-image/GridImage';\nexport { default as GroupedImage } from './components/grouped-image/GroupedImage';\nexport { default as Icon, type IconProps } from './components/icon/Icon';\nexport { default as Input, InputSize } from './components/input/Input';\nexport { default as List } from './components/list/List';\nexport { default as ListItemContent } from './components/list/list-item/list-item-content/ListItemContent';\nexport {\n default as ListItem,\n type ListItemElements,\n type ListItemProps,\n type ListItemRef,\n} from './components/list/list-item/ListItem';\nexport { default as MentionFinder } from './components/mention-finder/MentionFinder';\nexport type { MentionMember } from './components/mention-finder/MentionFinder';\nexport { default as MultiActionButton } from './components/multi-action-button/MultiActionButton';\nexport { default as NumberInput } from './components/number-input/NumberInput';\nexport { default as PageProvider } from './components/page-provider/PageProvider';\nexport { default as Popup } from './components/popup/Popup';\nexport { default as PopupContent } from './components/popup/popup-content/PopupContent';\nexport { default as ProgressBar } from './components/progress-bar/ProgressBar';\nexport { PopupAlignment } from './types/popup';\nexport {\n default as RadioButtonGroup,\n type RadioButtonGroupRef,\n} from './components/radio-button/radio-button-group/RadioButtonGroup';\nexport { default as RadioButton } from './components/radio-button/RadioButton';\nexport { default as ScrollView } from './components/scroll-view/ScrollView';\nexport { default as SearchBox } from './components/search-box/SearchBox';\nexport { default as SearchInput } from './components/search-input/SearchInput';\nexport { default as SelectButton } from './components/select-button/SelectButton';\nexport { default as SetupWizardItem } from './components/setup-wizard/setup-wizard-item/SetupWizardItem';\nexport { default as SetupWizard } from './components/setup-wizard/SetupWizard';\nexport type { SetupWizardRef } from './components/setup-wizard/SetupWizard';\nexport { default as SharingBar } from './components/sharing-bar/SharingBar';\nexport { default as Signature } from './components/signature/Signature';\nexport type { SignatureRef } from './components/signature/Signature';\nexport { default as SliderButton } from './components/slider-button/SliderButton';\nexport { default as Slider } from './components/slider/Slider';\nexport {\n default as SmallWaitCursor,\n SmallWaitCursorSize,\n SmallWaitCursorSpeed,\n} from './components/small-wait-cursor/SmallWaitCursor';\nexport type { Tag } from './types/tagInput';\nexport { default as TagInput } from './components/tag-input/TagInput';\nexport type { TagInputRef } from './components/tag-input/TagInput';\nexport { default as TextArea } from './components/text-area/TextArea';\nexport { default as Tooltip } from './components/tooltip/Tooltip';\nexport { default as Truncation } from './components/truncation/Truncation';\nexport { MentionFinderPopupAlignment } from './constants/mentionFinder';\nexport { useElementSize } from './hooks/element';\nexport type { BrowserName } from './types/chayns';\nexport { ContentCardType } from './types/contentCard';\nexport type { FileItem, Image, InternalFileItem, Meta, Video } from './types/file';\nexport { isValidFileType } from './utils/file';\nexport type { FileInputFileItem } from './types/fileInput';\nexport { FilterButtonItemShape, FilterButtonSize } from './types/filterButtons';\nexport type { IFilterButtonItem as FilterButtonItem } from './types/filterButtons';\nexport type { IListItemRightElements } from './types/list';\nexport type { PopupRef } from './types/popup';\nexport type { RadioButtonItem } from './types/radioButton';\nexport type {\n ISearchBoxItem as SearchBoxItem,\n ISearchBoxItems as SearchBoxItems,\n} from './types/searchBox';\nexport type { SelectButtonItem } from './types/selectButton';\nexport type { SliderButtonItem } from './types/slider-button';\nexport {\n type MultiActionButtonAction,\n type MultiActionButtonActionEvent,\n type MultiActionButtonActionStatus,\n MultiActionButtonHeight,\n type MultiActionButtonProps,\n MultiActionButtonStatusType,\n} from './components/multi-action-button/MultiActionButton.types';\nexport { ClampPosition } from './types/truncation';\nexport { useIsTouch } from './utils/environment';\nexport { filterFilesByMimeType, getFileAsArrayBuffer, selectFiles } from './utils/fileDialog';\nexport { isTobitEmployee } from './utils/isTobitEmployee';\nexport { getUsableHeight } from './utils/pageProvider';\nexport { uploadFile } from './utils/uploadFile';\nexport type { Theme } from './components/color-scheme-provider/ColorSchemeProvider';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA,IAAAA,UAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,iBAAA,GAAAF,sBAAA,CAAAC,OAAA;AACA,IAAAE,eAAA,GAAAH,sBAAA,CAAAC,OAAA;AACA,IAAAG,eAAA,GAAAJ,sBAAA,CAAAC,OAAA;AACA,IAAAI,cAAA,GAAAL,sBAAA,CAAAC,OAAA;AACA,IAAAK,cAAA,GAAAN,sBAAA,CAAAC,OAAA;AACA,IAAAM,kBAAA,GAAAP,sBAAA,CAAAC,OAAA;AACA,IAAAO,oBAAA,GAAAC,uBAAA,CAAAR,OAAA;AAIA,IAAAS,MAAA,GAAAV,sBAAA,CAAAC,OAAA;AACA,IAAAU,OAAA,GAAAX,sBAAA,CAAAC,OAAA;AACA,IAAAW,SAAA,GAAAZ,sBAAA,CAAAC,OAAA;AACA,IAAAY,oBAAA,GAAAJ,uBAAA,CAAAR,OAAA;AAIA,IAAAa,OAAA,GAAAb,OAAA;AAKA,IAAAc,UAAA,GAAAd,OAAA;AACA,IAAAe,SAAA,GAAAf,OAAA;AACA,IAAAgB,QAAA,GAAAhB,OAAA;AACA,IAAAiB,IAAA,GAAAjB,OAAA;AACA,IAAAkB,OAAA,GAAAnB,sBAAA,CAAAC,OAAA;AASA,IAAAmB,eAAA,GAAApB,sBAAA,CAAAC,OAAA;AACA,IAAAoB,SAAA,GAAArB,sBAAA,CAAAC,OAAA;AAIA,IAAAqB,WAAA,GAAAtB,sBAAA,CAAAC,OAAA;AACA,IAAAsB,oBAAA,GAAAvB,sBAAA,CAAAC,OAAA;AACA,IAAAuB,SAAA,GAAAf,uBAAA,CAAAR,OAAA;AAQA,IAAAwB,YAAA,GAAAzB,sBAAA,CAAAC,OAAA;AACA,IAAAyB,gBAAA,GAAA1B,sBAAA,CAAAC,OAAA;AAEA,IAAA0B,YAAA,GAAA3B,sBAAA,CAAAC,OAAA;AACA,IAAA2B,aAAA,GAAA3B,OAAA;AAOA,IAAA4B,kBAAA,GAAA7B,sBAAA,CAAAC,OAAA;AACA,IAAA6B,UAAA,GAAArB,uBAAA,CAAAR,OAAA;AAMA,IAAA8B,aAAA,GAAA/B,sBAAA,CAAAC,OAAA;AACA,IAAA+B,cAAA,GAAAhC,sBAAA,CAAAC,OAAA;AACA,IAAAgC,UAAA,GAAAjC,sBAAA,CAAAC,OAAA;AACA,IAAAiC,aAAA,GAAAlC,sBAAA,CAAAC,OAAA;AACA,IAAAkC,KAAA,GAAAnC,sBAAA,CAAAC,OAAA;AACA,IAAAmC,MAAA,GAAA3B,uBAAA,CAAAR,OAAA;AACA,IAAAoC,KAAA,GAAArC,sBAAA,CAAAC,OAAA;AACA,IAAAqC,gBAAA,GAAAtC,sBAAA,CAAAC,OAAA;AACA,IAAAsC,SAAA,GAAAvC,sBAAA,CAAAC,OAAA;AAMA,IAAAuC,cAAA,GAAAxC,sBAAA,CAAAC,OAAA;AAEA,IAAAwC,kBAAA,GAAAzC,sBAAA,CAAAC,OAAA;AACA,IAAAyC,YAAA,GAAA1C,sBAAA,CAAAC,OAAA;AACA,IAAA0C,aAAA,GAAA3C,sBAAA,CAAAC,OAAA;AACA,IAAA2C,MAAA,GAAA5C,sBAAA,CAAAC,OAAA;AACA,IAAA4C,aAAA,GAAA7C,sBAAA,CAAAC,OAAA;AACA,IAAA6C,YAAA,GAAA9C,sBAAA,CAAAC,OAAA;AACA,IAAA8C,MAAA,GAAA9C,OAAA;AACA,IAAA+C,iBAAA,GAAAhD,sBAAA,CAAAC,OAAA;AAIA,IAAAgD,YAAA,GAAAjD,sBAAA,CAAAC,OAAA;AACA,IAAAiD,WAAA,GAAAlD,sBAAA,CAAAC,OAAA;AACA,IAAAkD,UAAA,GAAAnD,sBAAA,CAAAC,OAAA;AACA,IAAAmD,YAAA,GAAApD,sBAAA,CAAAC,OAAA;AACA,IAAAoD,aAAA,GAAArD,sBAAA,CAAAC,OAAA;AACA,IAAAqD,gBAAA,GAAAtD,sBAAA,CAAAC,OAAA;AACA,IAAAsD,YAAA,GAAAvD,sBAAA,CAAAC,OAAA;AAEA,IAAAuD,WAAA,GAAAxD,sBAAA,CAAAC,OAAA;AACA,IAAAwD,UAAA,GAAAzD,sBAAA,CAAAC,OAAA;AAEA,IAAAyD,aAAA,GAAA1D,sBAAA,CAAAC,OAAA;AACA,IAAA0D,OAAA,GAAA3D,sBAAA,CAAAC,OAAA;AACA,IAAA2D,gBAAA,GAAAnD,uBAAA,CAAAR,OAAA;AAMA,IAAA4D,SAAA,GAAA7D,sBAAA,CAAAC,OAAA;AAEA,IAAA6D,SAAA,GAAA9D,sBAAA,CAAAC,OAAA;AACA,IAAA8D,QAAA,GAAA/D,sBAAA,CAAAC,OAAA;AACA,IAAA+D,WAAA,GAAAhE,sBAAA,CAAAC,OAAA;AACA,IAAAgE,cAAA,GAAAhE,OAAA;AAGA,IAAAiE,YAAA,GAAAjE,OAAA;AAEA,IAAAkE,KAAA,GAAAlE,OAAA;AAEA,IAAAmE,cAAA,GAAAnE,OAAA;AAWA,IAAAoE,mBAAA,GAAApE,OAAA;AAQA,IAAAqE,WAAA,GAAArE,OAAA;AACA,IAAAsE,YAAA,GAAAtE,OAAA;AACA,IAAAuE,WAAA,GAAAvE,OAAA;AACA,IAAAwE,gBAAA,GAAAxE,OAAA;AACA,IAAAyE,aAAA,GAAAzE,OAAA;AACA,IAAA0E,WAAA,GAAA1E,OAAA;AAAgD,SAAAQ,wBAAAmE,CAAA,EAAAC,CAAA,6BAAAC,OAAA,MAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAArE,uBAAA,YAAAA,CAAAmE,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;AAAA,SAAA7E,uBAAA4E,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAK,UAAA,GAAAL,CAAA,KAAAU,OAAA,EAAAV,CAAA","ignoreList":[]}
|
|
@@ -9,6 +9,11 @@ import { StyledComboBox, StyledComboBoxBody, StyledComboBoxClearIconWrapper, Sty
|
|
|
9
9
|
import DropdownBodyWrapper from '../dropdown-body-wrapper/DropdownBodyWrapper';
|
|
10
10
|
import { DropdownDirection } from '../../types/dropdown';
|
|
11
11
|
import { useElementSize } from '../../hooks/element';
|
|
12
|
+
export let ComboBoxSize = /*#__PURE__*/function (ComboBoxSize) {
|
|
13
|
+
ComboBoxSize["NORMAL"] = "normal";
|
|
14
|
+
ComboBoxSize["SMALL"] = "small";
|
|
15
|
+
return ComboBoxSize;
|
|
16
|
+
}({});
|
|
12
17
|
const ComboBox = /*#__PURE__*/forwardRef(({
|
|
13
18
|
bodyWidth,
|
|
14
19
|
direction = DropdownDirection.RIGHT,
|
|
@@ -25,6 +30,7 @@ const ComboBox = /*#__PURE__*/forwardRef(({
|
|
|
25
30
|
shouldShowRoundImage,
|
|
26
31
|
onInputFocus,
|
|
27
32
|
prefixMinWidth,
|
|
33
|
+
size = ComboBoxSize.NORMAL,
|
|
28
34
|
shouldUseFullWidth = false,
|
|
29
35
|
onInputChange,
|
|
30
36
|
shouldUseCurrentItemWidth = false,
|
|
@@ -323,6 +329,7 @@ const ComboBox = /*#__PURE__*/forwardRef(({
|
|
|
323
329
|
onClick: handleHeaderClick,
|
|
324
330
|
$isOpen: isAnimating,
|
|
325
331
|
$isTouch: isTouch,
|
|
332
|
+
$size: size,
|
|
326
333
|
$shouldShowTransparentBackground: shouldShowTransparentBackground,
|
|
327
334
|
$isDisabled: isDisabled,
|
|
328
335
|
$shouldChangeColor: shouldChangeColor,
|
|
@@ -351,6 +358,7 @@ const ComboBox = /*#__PURE__*/forwardRef(({
|
|
|
351
358
|
icons: ['fa fa-times']
|
|
352
359
|
})), !shouldDisableActions && /*#__PURE__*/React.createElement(StyledComboBoxIconWrapper, {
|
|
353
360
|
$isDisabled: isDisabled,
|
|
361
|
+
$size: size,
|
|
354
362
|
$shouldShowBorderLeft: shouldShowClearIcon === true && internalSelectedItem !== undefined
|
|
355
363
|
}, /*#__PURE__*/React.createElement(Icon, {
|
|
356
364
|
icons: ['fa fa-chevron-down'],
|
|
@@ -372,7 +380,7 @@ const ComboBox = /*#__PURE__*/forwardRef(({
|
|
|
372
380
|
$browser: browser?.name,
|
|
373
381
|
ref: contentRef,
|
|
374
382
|
tabIndex: 0
|
|
375
|
-
}, comboBoxGroups))), [minWidth, shouldUseFullWidth, shouldUseCurrentItemWidth, direction, handleHeaderClick, isAnimating, isTouch, shouldShowTransparentBackground, isDisabled, shouldChangeColor, shouldShowBigImage, prefix, prefixMinWidth, selectedItem, internalSelectedItem, placeholderImageUrl, shouldShowRoundPlaceholderImage, placeholderIcon, inputValue, onInputChange, handleInputBlur, handleInputFocus, placeholderText, shouldShowClearIcon, handleClear, shouldDisableActions, bodyWidth, contentHeight, handleClose, container, bodyMinWidth, maxHeight, browser?.name, comboBoxGroups]);
|
|
383
|
+
}, comboBoxGroups))), [minWidth, shouldUseFullWidth, shouldUseCurrentItemWidth, direction, handleHeaderClick, isAnimating, isTouch, size, shouldShowTransparentBackground, isDisabled, shouldChangeColor, shouldShowBigImage, prefix, prefixMinWidth, selectedItem, internalSelectedItem, placeholderImageUrl, shouldShowRoundPlaceholderImage, placeholderIcon, inputValue, onInputChange, handleInputBlur, handleInputFocus, placeholderText, shouldShowClearIcon, handleClear, shouldDisableActions, bodyWidth, contentHeight, handleClose, container, bodyMinWidth, maxHeight, browser?.name, comboBoxGroups]);
|
|
376
384
|
});
|
|
377
385
|
ComboBox.displayName = 'ComboBox';
|
|
378
386
|
export default ComboBox;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ComboBox.js","names":["useDevice","useFunctions","useValues","React","forwardRef","Fragment","useCallback","useContext","useEffect","useImperativeHandle","useMemo","useRef","useState","calculateMaxComboBoxItemWidth","useIsTouch","AreaContext","Icon","ComboBoxItem","StyledComboBox","StyledComboBoxBody","StyledComboBoxClearIconWrapper","StyledComboBoxHeader","StyledComboBoxIconWrapper","StyledComboBoxInput","StyledComboBoxPlaceholder","StyledComboBoxPlaceholderImage","StyledComboBoxPlaceholderText","StyledComboBoxPrefix","StyledComboBoxPrefixAndPlaceholderWrapper","StyledComboBoxTopic","DropdownBodyWrapper","DropdownDirection","useElementSize","ComboBox","bodyWidth","direction","RIGHT","isDisabled","lists","maxHeight","onSelect","placeholder","prefix","container","selectedItem","shouldShowBigImage","shouldShowClearIcon","shouldShowRoundImage","onInputFocus","prefixMinWidth","shouldUseFullWidth","onInputChange","shouldUseCurrentItemWidth","onInputBlur","shouldShowTransparentBackground","inputValue","shouldDropDownUseMaxItemWidth","ref","internalSelectedItem","setInternalSelectedItem","isAnimating","setIsAnimating","minWidth","setMinWidth","undefined","bodyMinWidth","setBodyMinWidth","focusedIndex","setFocusedIndex","isInputFocused","styledComboBoxElementRef","contentRef","parentSize","shouldUseParentElement","functions","values","isTouch","browser","areaProvider","width","shouldChangeColor","shouldDisableActions","combinedLists","flatMap","list","length","some","item","value","contentHeight","flatItems","height","reduce","isBigItem","subtext","trim","handleInputFocus","event","current","handleInputBlur","handleOpen","handleClose","handleSetSelectedItem","itemToSelect","onSelectResult","Promise","then","shouldPreventSelection","handleClear","preventDefault","stopPropagation","handleKeyDown","e","key","children","stepDirection","newIndex","attempts","newElement","shouldSkip","id","startsWith","endsWith","prevElement","tabIndex","focusedElement","focus","element","newSelectedItem","find","String","replace","document","addEventListener","removeEventListener","allItems","maxItemWidth","text","hasImage","imageUrl","hasIcon","icons","parentWidth","parentElement","getBoundingClientRect","paddingWidth","imageWidth","iconWidth","prefixWidth","prefixTextWidth","Math","max","calculatedWidth","tmpMinWidth","tmpBodyMinWidth","internalSelectedItemWidth","itemWidth","placeholderImageUrl","placeholderIcon","placeholderText","shouldShowRoundPlaceholderImage","selectedItemList","handleHeaderClick","hide","show","comboBoxGroups","map","createElement","groupName","isSelected","$minWidth","$shouldUseFullWidth","$shouldUseCurrentItemWidth","$direction","onClick","$isOpen","$isTouch","$shouldShowTransparentBackground","$isDisabled","$shouldChangeColor","$shouldShowBigImage","$prefixMinWidth","$shouldReduceOpacity","src","$shouldShowRoundImage","disabled","onChange","onBlur","onFocus","suffixElement","$shouldShowBorderLeft","anchorElement","onClose","shouldShowDropdown","minBodyWidth","$maxHeight","$browser","name","displayName"],"sources":["../../../../src/components/combobox/ComboBox.tsx"],"sourcesContent":["import { useDevice, useFunctions, useValues } from 'chayns-api';\nimport React, {\n ChangeEventHandler,\n type CSSProperties,\n FocusEventHandler,\n forwardRef,\n Fragment,\n ReactHTML,\n type ReactNode,\n useCallback,\n useContext,\n useEffect,\n useImperativeHandle,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport { CSSPropertiesWithVars } from 'styled-components/dist/types';\nimport { BrowserName } from '../../types/chayns';\nimport { calculateMaxComboBoxItemWidth } from '../../utils/calculate';\nimport { useIsTouch } from '../../utils/environment';\nimport { AreaContext } from '../area-provider/AreaContextProvider';\nimport Icon from '../icon/Icon';\nimport ComboBoxItem from './combobox-item/ComboBoxItem';\nimport {\n StyledComboBox,\n StyledComboBoxBody,\n StyledComboBoxClearIconWrapper,\n StyledComboBoxHeader,\n StyledComboBoxIconWrapper,\n StyledComboBoxInput,\n StyledComboBoxPlaceholder,\n StyledComboBoxPlaceholderImage,\n StyledComboBoxPlaceholderText,\n StyledComboBoxPrefix,\n StyledComboBoxPrefixAndPlaceholderWrapper,\n StyledComboBoxTopic,\n} from './ComboBox.styles';\nimport DropdownBodyWrapper from '../dropdown-body-wrapper/DropdownBodyWrapper';\nimport { DropdownDirection } from '../../types/dropdown';\nimport { useElementSize } from '../../hooks/element';\n\nexport interface ComboBoxRef {\n hide: VoidFunction;\n show: VoidFunction;\n}\n\nexport interface IComboBoxItems {\n groupName?: string;\n list: Array<IComboBoxItem>;\n shouldShowRoundImage?: boolean;\n}\n\nexport interface ComboBoxTextStyles {\n tagName?: keyof ReactHTML;\n styles?: CSSPropertiesWithVars;\n className?: string;\n}\n\nexport interface IComboBoxItem {\n icons?: string[];\n imageBackground?: CSSProperties['background'];\n imageUrl?: string;\n isDisabled?: boolean;\n rightElement?: ReactNode;\n subtext?: string;\n suffixElement?: ReactNode;\n text: string;\n value: string | number;\n textStyles?: ComboBoxTextStyles;\n}\n\nexport type ComboBoxProps = {\n /**\n * The width of the body.\n */\n bodyWidth?: number;\n /**\n * The element where the content of the `ComboBox` should be rendered via React Portal.\n */\n container?: Element;\n /**\n * The direction in which the combobox should open.\n */\n direction?: DropdownDirection;\n /**\n * The value of the optional input.\n */\n inputValue?: string;\n /**\n * Whether the combobox should be disabled.\n */\n isDisabled?: boolean;\n /**\n * The list of the items that should be displayed.\n */\n lists: IComboBoxItems[];\n /**\n * The maximum height of the combobox content.\n */\n maxHeight?: number;\n /**\n * Function to be executed when the value of the optional input is changed.\n */\n onInputChange?: ChangeEventHandler<HTMLInputElement>;\n /**\n * Function to be executed when the optional input lost its focus.\n */\n onInputBlur?: FocusEventHandler<HTMLInputElement>;\n /**\n * Function to be executed when the optional input gets its focus.\n */\n onInputFocus?: FocusEventHandler<HTMLInputElement>;\n /**\n * Function that should be executed when an item is selected. If the function returns false, the item will not be selected.\n */\n onSelect?: (comboboxItem?: IComboBoxItem) => Promise<boolean> | boolean | void;\n /**\n * A text that should be displayed when no item is selected.\n */\n placeholder: string;\n /**\n * A prefix that should be displayed before the placeholder.\n */\n prefix?: string;\n /**\n * An item that should be preselected.\n */\n selectedItem?: IComboBoxItem;\n /**\n * If true, the images of the items are displayed in a bigger shape. This prop will automatically be set to true if the subtext of an item is given.\n */\n shouldShowBigImage?: boolean;\n /**\n * If true, a clear icon is displayed at the end of the combo box if an item is selected.\n */\n shouldShowClearIcon?: boolean;\n /**\n * Whether the background should be transparent.\n */\n shouldShowTransparentBackground?: boolean;\n /**\n * If true, the images of the items are displayed in a round shape.\n */\n shouldShowRoundImage?: boolean;\n /**\n * Whether the width of the ComboBox should be the width of the current item.\n */\n shouldUseCurrentItemWidth?: boolean;\n /**\n * Whether the width of the 'ComboBox' should be the width of the parent or of the widest item.\n */\n shouldUseFullWidth?: boolean;\n /**\n * If true, the dropdown will use the maximum width of the items.\n */\n shouldDropDownUseMaxItemWidth?: boolean;\n /**\n * Optional min width for the prefix element.\n */\n prefixMinWidth?: number;\n};\n\nconst ComboBox = forwardRef<ComboBoxRef, ComboBoxProps>(\n (\n {\n bodyWidth,\n direction = DropdownDirection.RIGHT,\n isDisabled = false,\n lists,\n maxHeight = 280,\n onSelect,\n placeholder,\n prefix,\n container,\n selectedItem,\n shouldShowBigImage,\n shouldShowClearIcon,\n shouldShowRoundImage,\n onInputFocus,\n prefixMinWidth,\n shouldUseFullWidth = false,\n onInputChange,\n shouldUseCurrentItemWidth = false,\n onInputBlur,\n shouldShowTransparentBackground = false,\n inputValue,\n shouldDropDownUseMaxItemWidth = false,\n },\n ref,\n ) => {\n const [internalSelectedItem, setInternalSelectedItem] = useState<IComboBoxItem>();\n const [isAnimating, setIsAnimating] = useState(false);\n const [minWidth, setMinWidth] = useState<number | undefined>(undefined);\n const [bodyMinWidth, setBodyMinWidth] = useState(0);\n const [focusedIndex, setFocusedIndex] = useState<number | null>(null);\n\n const isInputFocused = useRef(false);\n\n const styledComboBoxElementRef = useRef<HTMLDivElement>(null);\n const contentRef = useRef<HTMLDivElement | null>(null);\n\n const parentSize = useElementSize(styledComboBoxElementRef, {\n shouldUseParentElement: true,\n });\n\n const functions = useFunctions();\n const values = useValues();\n\n const isTouch = useIsTouch();\n\n const { browser } = useDevice();\n\n const areaProvider = useContext(AreaContext);\n\n useEffect(() => {\n if (shouldUseFullWidth && parentSize) {\n setMinWidth(parentSize.width);\n }\n }, [parentSize, shouldUseFullWidth]);\n\n const shouldChangeColor = useMemo(\n () => areaProvider.shouldChangeColor ?? false,\n [areaProvider.shouldChangeColor],\n );\n\n const shouldDisableActions = useMemo(() => {\n if (!selectedItem) {\n return false;\n }\n\n const combinedLists = lists.flatMap((list) => list.list);\n\n return (\n combinedLists.length === 1 &&\n combinedLists.some((item) => item.value === selectedItem.value)\n );\n }, [lists, selectedItem]);\n\n const contentHeight = useMemo(() => {\n const flatItems = lists.flatMap((list) => list.list);\n\n let height = flatItems.reduce((value, item) => {\n const isBigItem =\n shouldShowBigImage ||\n (typeof item.subtext === 'string' && item.subtext.trim() !== '');\n\n return value + (isBigItem ? 56 : 38);\n }, 0);\n\n if (lists.length > 1) {\n height += lists.length * 38;\n }\n\n if (maxHeight < height) {\n height = maxHeight;\n }\n\n return height;\n }, [lists, maxHeight, shouldShowBigImage]);\n\n const handleInputFocus: FocusEventHandler<HTMLInputElement> = useCallback(\n (event) => {\n isInputFocused.current = true;\n onInputFocus?.(event);\n },\n [onInputFocus],\n );\n\n const handleInputBlur: FocusEventHandler<HTMLInputElement> = useCallback(\n (event) => {\n isInputFocused.current = false;\n onInputBlur?.(event);\n },\n [onInputBlur],\n );\n\n const handleOpen = useCallback(() => {\n setIsAnimating(true);\n }, []);\n\n const handleClose = useCallback(() => {\n setIsAnimating(false);\n }, []);\n\n /**\n * This function sets the selected item\n */\n const handleSetSelectedItem = useCallback(\n (itemToSelect?: IComboBoxItem) => {\n if (typeof onSelect === 'function') {\n const onSelectResult = onSelect(itemToSelect);\n\n if (onSelectResult === false) {\n return;\n }\n\n if (onSelectResult instanceof Promise) {\n void onSelectResult.then((shouldPreventSelection) => {\n if (shouldPreventSelection) return;\n\n setInternalSelectedItem(itemToSelect);\n setIsAnimating(false);\n });\n\n return;\n }\n }\n\n setInternalSelectedItem(itemToSelect);\n setIsAnimating(false);\n },\n [onSelect],\n );\n\n const handleClear = useCallback(\n (event: React.MouseEvent<HTMLDivElement>) => {\n event.preventDefault();\n event.stopPropagation();\n\n handleSetSelectedItem(undefined);\n },\n [handleSetSelectedItem],\n );\n\n useEffect(() => {\n const handleKeyDown = (e: KeyboardEvent) => {\n if (!isAnimating) return;\n\n if (e.key === 'ArrowUp' || e.key === 'ArrowDown') {\n e.preventDefault();\n\n const children = contentRef.current?.children;\n\n if (!children || children.length === 0) return;\n\n const stepDirection = e.key === 'ArrowUp' ? -1 : 1;\n\n let newIndex = focusedIndex ?? -1;\n\n let attempts = 0;\n\n do {\n newIndex = (newIndex + stepDirection + children.length) % children.length;\n\n const newElement = children[newIndex] as HTMLDivElement;\n\n let shouldSkip = false;\n\n if (\n newElement.id.startsWith('combobox-group--') ||\n newElement.id.endsWith('--disabled-item')\n ) {\n shouldSkip = true;\n }\n\n if (!shouldSkip) break;\n\n attempts++;\n } while (attempts < children.length);\n\n if (focusedIndex !== null) {\n const prevElement = children[focusedIndex] as HTMLDivElement;\n\n prevElement.tabIndex = -1;\n }\n\n setFocusedIndex(newIndex);\n\n const focusedElement = children[newIndex] as HTMLDivElement;\n\n focusedElement.tabIndex = 0;\n\n focusedElement.focus();\n } else if (e.key === 'Enter' && focusedIndex !== null) {\n const element = contentRef.current?.children[focusedIndex];\n\n if (!element) return;\n\n const { id } = element;\n\n let newSelectedItem: IComboBoxItem | undefined;\n\n lists.some((list) => {\n newSelectedItem = list.list.find(\n ({ value }) => String(value) === id.replace('combobox-item__', ''),\n );\n\n return !!newSelectedItem;\n });\n\n if (newSelectedItem) {\n handleSetSelectedItem(newSelectedItem);\n }\n }\n };\n\n document.addEventListener('keydown', handleKeyDown);\n\n return () => document.removeEventListener('keydown', handleKeyDown);\n }, [focusedIndex, handleSetSelectedItem, isAnimating, lists]);\n\n /**\n * This function calculates the greatest width\n */\n useEffect(() => {\n const allItems = lists.flatMap((list) => list.list);\n\n let maxItemWidth = calculateMaxComboBoxItemWidth({\n list: [\n ...allItems,\n { text: placeholder, value: 'placeholder' },\n ...(selectedItem ? [selectedItem] : []),\n ],\n functions,\n shouldShowBigImage,\n values,\n });\n\n if (shouldDropDownUseMaxItemWidth) {\n maxItemWidth += 20 + 2 + 1; // 20px padding (left and right), 2px border, 1px puffer for rounding errors\n\n setBodyMinWidth(maxItemWidth);\n setMinWidth(maxItemWidth);\n\n return;\n }\n\n const hasImage = [selectedItem, ...allItems].some((item) => item?.imageUrl);\n const hasIcon = [selectedItem, ...allItems].some((item) => item?.icons);\n\n const parentWidth =\n styledComboBoxElementRef.current?.parentElement?.getBoundingClientRect().width ?? 0;\n\n const paddingWidth = 20 + 2 + 40 + 40; // padding + border + arrow icon + optional clear icon\n const imageWidth = hasImage ? 32 : 0; // image width + gap if images present\n const iconWidth = hasIcon ? 40 : 0; // icon width + gap if icons present\n\n let prefixWidth = 0;\n\n if (prefix) {\n const prefixTextWidth = calculateMaxComboBoxItemWidth({\n list: [{ text: prefix, value: 'prefix' }],\n functions,\n values,\n });\n\n prefixWidth = Math.max(prefixTextWidth + 5, 32);\n }\n\n const calculatedWidth =\n maxItemWidth + paddingWidth + imageWidth + iconWidth + prefixWidth;\n\n let tmpMinWidth = calculatedWidth;\n let tmpBodyMinWidth = calculatedWidth;\n\n // Full width settings\n if (shouldUseFullWidth) {\n tmpMinWidth = parentWidth;\n\n tmpBodyMinWidth =\n parentWidth < calculatedWidth - 20 ? calculatedWidth - 20 : parentWidth;\n }\n // Current item width settings\n else if (shouldUseCurrentItemWidth && internalSelectedItem) {\n const internalSelectedItemWidth = calculateMaxComboBoxItemWidth({\n list: [internalSelectedItem],\n functions,\n shouldShowBigImage,\n values,\n });\n\n const itemWidth =\n internalSelectedItemWidth + paddingWidth + imageWidth + iconWidth + prefixWidth;\n\n tmpMinWidth = itemWidth;\n\n tmpBodyMinWidth =\n itemWidth < calculatedWidth - 20 ? calculatedWidth - 20 : itemWidth;\n }\n\n if (tmpMinWidth > parentWidth) {\n tmpMinWidth = parentWidth;\n }\n\n if (tmpBodyMinWidth > parentWidth) {\n tmpBodyMinWidth = parentWidth;\n }\n\n setMinWidth(tmpMinWidth);\n setBodyMinWidth(shouldUseCurrentItemWidth ? tmpMinWidth : tmpBodyMinWidth);\n }, [\n functions,\n internalSelectedItem,\n lists,\n placeholder,\n prefix,\n selectedItem,\n shouldDropDownUseMaxItemWidth,\n shouldShowBigImage,\n shouldUseCurrentItemWidth,\n shouldUseFullWidth,\n values,\n ]);\n\n /**\n * This function sets the external selected item\n */\n useEffect(() => {\n setIsAnimating(false);\n setInternalSelectedItem(selectedItem);\n }, [selectedItem]);\n\n const placeholderImageUrl = useMemo(() => {\n if (selectedItem) {\n return selectedItem.imageUrl;\n }\n\n if (internalSelectedItem) {\n return internalSelectedItem.imageUrl;\n }\n\n return undefined;\n }, [internalSelectedItem, selectedItem]);\n\n const placeholderIcon = useMemo(() => {\n if (selectedItem) {\n return selectedItem.icons;\n }\n\n if (internalSelectedItem) {\n return internalSelectedItem.icons;\n }\n\n return undefined;\n }, [internalSelectedItem, selectedItem]);\n\n /**\n * This function resets the placeholder\n */\n const placeholderText = useMemo(() => {\n let text = placeholder;\n\n if (selectedItem) {\n text = selectedItem.text;\n } else if (internalSelectedItem) {\n text = internalSelectedItem.text;\n }\n\n return text;\n }, [internalSelectedItem, placeholder, selectedItem]);\n\n const shouldShowRoundPlaceholderImage = useMemo(() => {\n const selectedItemList = lists.find((list) =>\n list.list.some(\n ({ value }) => value === (selectedItem?.value ?? internalSelectedItem?.value),\n ),\n );\n\n return selectedItemList?.shouldShowRoundImage ?? shouldShowRoundImage;\n }, [internalSelectedItem?.value, lists, selectedItem?.value, shouldShowRoundImage]);\n\n /**\n * This function opens the content of the combobox\n */\n const handleHeaderClick = useCallback(() => {\n if (!isDisabled && !isInputFocused.current) {\n if (isAnimating) {\n handleClose();\n } else {\n handleOpen();\n }\n }\n }, [handleClose, handleOpen, isAnimating, isDisabled]);\n\n useImperativeHandle(\n ref,\n () => ({\n hide: handleClose,\n show: handleOpen,\n }),\n [handleClose, handleOpen],\n );\n\n const comboBoxGroups = useMemo(\n () =>\n lists.map((list) => (\n <Fragment key={list.groupName ?? 'default-group'}>\n {list.groupName && lists.length > 1 && (\n <StyledComboBoxTopic id={`combobox-group--${list.groupName}`}>\n {list.groupName}\n </StyledComboBoxTopic>\n )}\n {list.list.map((item) => (\n <ComboBoxItem\n key={`item-${item.text}`}\n item={item}\n isSelected={\n selectedItem ? item.value === selectedItem.value : false\n }\n onSelect={handleSetSelectedItem}\n shouldShowBigImage={shouldShowBigImage}\n shouldShowRoundImage={\n list.shouldShowRoundImage ?? shouldShowRoundImage\n }\n />\n ))}\n </Fragment>\n )),\n [handleSetSelectedItem, lists, selectedItem, shouldShowBigImage, shouldShowRoundImage],\n );\n\n return useMemo(\n () => (\n <StyledComboBox\n ref={styledComboBoxElementRef}\n $minWidth={minWidth}\n $shouldUseFullWidth={shouldUseFullWidth}\n $shouldUseCurrentItemWidth={shouldUseCurrentItemWidth}\n >\n <StyledComboBoxHeader\n $direction={direction}\n onClick={handleHeaderClick}\n $isOpen={isAnimating}\n $isTouch={isTouch}\n $shouldShowTransparentBackground={shouldShowTransparentBackground}\n $isDisabled={isDisabled}\n $shouldChangeColor={shouldChangeColor}\n $shouldShowBigImage={shouldShowBigImage}\n >\n <StyledComboBoxPrefixAndPlaceholderWrapper>\n {prefix && (\n <StyledComboBoxPrefix $prefixMinWidth={prefixMinWidth}>\n {prefix}\n </StyledComboBoxPrefix>\n )}\n <StyledComboBoxPlaceholder\n $shouldReduceOpacity={!selectedItem && !internalSelectedItem}\n >\n {placeholderImageUrl && (\n <StyledComboBoxPlaceholderImage\n src={placeholderImageUrl}\n $shouldShowBigImage={shouldShowBigImage}\n $shouldShowRoundImage={shouldShowRoundPlaceholderImage}\n />\n )}\n {placeholderIcon && <Icon icons={placeholderIcon} />}\n {typeof inputValue === 'string' ? (\n <StyledComboBoxInput\n disabled={isDisabled}\n value={inputValue}\n onChange={onInputChange}\n onBlur={handleInputBlur}\n onFocus={handleInputFocus}\n placeholder={placeholderText}\n />\n ) : (\n <StyledComboBoxPlaceholderText>\n {placeholderText}\n </StyledComboBoxPlaceholderText>\n )}\n {internalSelectedItem &&\n internalSelectedItem.suffixElement &&\n internalSelectedItem.suffixElement}\n </StyledComboBoxPlaceholder>\n </StyledComboBoxPrefixAndPlaceholderWrapper>\n {shouldShowClearIcon && internalSelectedItem && (\n <StyledComboBoxClearIconWrapper\n $isDisabled={isDisabled}\n onClick={handleClear}\n >\n <Icon icons={['fa fa-times']} />\n </StyledComboBoxClearIconWrapper>\n )}\n {!shouldDisableActions && (\n <StyledComboBoxIconWrapper\n $isDisabled={isDisabled}\n $shouldShowBorderLeft={\n shouldShowClearIcon === true &&\n internalSelectedItem !== undefined\n }\n >\n <Icon icons={['fa fa-chevron-down']} isDisabled={isDisabled} />\n </StyledComboBoxIconWrapper>\n )}\n </StyledComboBoxHeader>\n {styledComboBoxElementRef.current && (\n <DropdownBodyWrapper\n anchorElement={styledComboBoxElementRef.current}\n bodyWidth={bodyWidth}\n contentHeight={contentHeight}\n onClose={handleClose}\n direction={direction}\n container={container}\n shouldShowDropdown={isAnimating}\n minBodyWidth={bodyWidth ?? bodyMinWidth}\n maxHeight={maxHeight}\n >\n <StyledComboBoxBody\n $shouldUseCurrentItemWidth={shouldUseCurrentItemWidth}\n $maxHeight={maxHeight}\n $minWidth={bodyWidth ?? bodyMinWidth}\n $browser={browser?.name as BrowserName}\n ref={contentRef}\n tabIndex={0}\n >\n {comboBoxGroups}\n </StyledComboBoxBody>\n </DropdownBodyWrapper>\n )}\n </StyledComboBox>\n ),\n [\n minWidth,\n shouldUseFullWidth,\n shouldUseCurrentItemWidth,\n direction,\n handleHeaderClick,\n isAnimating,\n isTouch,\n shouldShowTransparentBackground,\n isDisabled,\n shouldChangeColor,\n shouldShowBigImage,\n prefix,\n prefixMinWidth,\n selectedItem,\n internalSelectedItem,\n placeholderImageUrl,\n shouldShowRoundPlaceholderImage,\n placeholderIcon,\n inputValue,\n onInputChange,\n handleInputBlur,\n handleInputFocus,\n placeholderText,\n shouldShowClearIcon,\n handleClear,\n shouldDisableActions,\n bodyWidth,\n contentHeight,\n handleClose,\n container,\n bodyMinWidth,\n maxHeight,\n browser?.name,\n comboBoxGroups,\n ],\n );\n },\n);\n\nComboBox.displayName = 'ComboBox';\n\nexport default ComboBox;\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"ComboBox.js","names":["useDevice","useFunctions","useValues","React","forwardRef","Fragment","useCallback","useContext","useEffect","useImperativeHandle","useMemo","useRef","useState","calculateMaxComboBoxItemWidth","useIsTouch","AreaContext","Icon","ComboBoxItem","StyledComboBox","StyledComboBoxBody","StyledComboBoxClearIconWrapper","StyledComboBoxHeader","StyledComboBoxIconWrapper","StyledComboBoxInput","StyledComboBoxPlaceholder","StyledComboBoxPlaceholderImage","StyledComboBoxPlaceholderText","StyledComboBoxPrefix","StyledComboBoxPrefixAndPlaceholderWrapper","StyledComboBoxTopic","DropdownBodyWrapper","DropdownDirection","useElementSize","ComboBoxSize","ComboBox","bodyWidth","direction","RIGHT","isDisabled","lists","maxHeight","onSelect","placeholder","prefix","container","selectedItem","shouldShowBigImage","shouldShowClearIcon","shouldShowRoundImage","onInputFocus","prefixMinWidth","size","NORMAL","shouldUseFullWidth","onInputChange","shouldUseCurrentItemWidth","onInputBlur","shouldShowTransparentBackground","inputValue","shouldDropDownUseMaxItemWidth","ref","internalSelectedItem","setInternalSelectedItem","isAnimating","setIsAnimating","minWidth","setMinWidth","undefined","bodyMinWidth","setBodyMinWidth","focusedIndex","setFocusedIndex","isInputFocused","styledComboBoxElementRef","contentRef","parentSize","shouldUseParentElement","functions","values","isTouch","browser","areaProvider","width","shouldChangeColor","shouldDisableActions","combinedLists","flatMap","list","length","some","item","value","contentHeight","flatItems","height","reduce","isBigItem","subtext","trim","handleInputFocus","event","current","handleInputBlur","handleOpen","handleClose","handleSetSelectedItem","itemToSelect","onSelectResult","Promise","then","shouldPreventSelection","handleClear","preventDefault","stopPropagation","handleKeyDown","e","key","children","stepDirection","newIndex","attempts","newElement","shouldSkip","id","startsWith","endsWith","prevElement","tabIndex","focusedElement","focus","element","newSelectedItem","find","String","replace","document","addEventListener","removeEventListener","allItems","maxItemWidth","text","hasImage","imageUrl","hasIcon","icons","parentWidth","parentElement","getBoundingClientRect","paddingWidth","imageWidth","iconWidth","prefixWidth","prefixTextWidth","Math","max","calculatedWidth","tmpMinWidth","tmpBodyMinWidth","internalSelectedItemWidth","itemWidth","placeholderImageUrl","placeholderIcon","placeholderText","shouldShowRoundPlaceholderImage","selectedItemList","handleHeaderClick","hide","show","comboBoxGroups","map","createElement","groupName","isSelected","$minWidth","$shouldUseFullWidth","$shouldUseCurrentItemWidth","$direction","onClick","$isOpen","$isTouch","$size","$shouldShowTransparentBackground","$isDisabled","$shouldChangeColor","$shouldShowBigImage","$prefixMinWidth","$shouldReduceOpacity","src","$shouldShowRoundImage","disabled","onChange","onBlur","onFocus","suffixElement","$shouldShowBorderLeft","anchorElement","onClose","shouldShowDropdown","minBodyWidth","$maxHeight","$browser","name","displayName"],"sources":["../../../../src/components/combobox/ComboBox.tsx"],"sourcesContent":["import { useDevice, useFunctions, useValues } from 'chayns-api';\nimport React, {\n ChangeEventHandler,\n type CSSProperties,\n FocusEventHandler,\n forwardRef,\n Fragment,\n ReactHTML,\n type ReactNode,\n useCallback,\n useContext,\n useEffect,\n useImperativeHandle,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport { CSSPropertiesWithVars } from 'styled-components/dist/types';\nimport { BrowserName } from '../../types/chayns';\nimport { calculateMaxComboBoxItemWidth } from '../../utils/calculate';\nimport { useIsTouch } from '../../utils/environment';\nimport { AreaContext } from '../area-provider/AreaContextProvider';\nimport Icon from '../icon/Icon';\nimport ComboBoxItem from './combobox-item/ComboBoxItem';\nimport {\n StyledComboBox,\n StyledComboBoxBody,\n StyledComboBoxClearIconWrapper,\n StyledComboBoxHeader,\n StyledComboBoxIconWrapper,\n StyledComboBoxInput,\n StyledComboBoxPlaceholder,\n StyledComboBoxPlaceholderImage,\n StyledComboBoxPlaceholderText,\n StyledComboBoxPrefix,\n StyledComboBoxPrefixAndPlaceholderWrapper,\n StyledComboBoxTopic,\n} from './ComboBox.styles';\nimport DropdownBodyWrapper from '../dropdown-body-wrapper/DropdownBodyWrapper';\nimport { DropdownDirection } from '../../types/dropdown';\nimport { useElementSize } from '../../hooks/element';\n\nexport interface ComboBoxRef {\n hide: VoidFunction;\n show: VoidFunction;\n}\n\nexport interface IComboBoxItems {\n groupName?: string;\n list: Array<IComboBoxItem>;\n shouldShowRoundImage?: boolean;\n}\n\nexport interface ComboBoxTextStyles {\n tagName?: keyof ReactHTML;\n styles?: CSSPropertiesWithVars;\n className?: string;\n}\n\nexport interface IComboBoxItem {\n icons?: string[];\n imageBackground?: CSSProperties['background'];\n imageUrl?: string;\n isDisabled?: boolean;\n rightElement?: ReactNode;\n subtext?: string;\n suffixElement?: ReactNode;\n text: string;\n value: string | number;\n textStyles?: ComboBoxTextStyles;\n}\n\nexport enum ComboBoxSize {\n NORMAL = 'normal',\n SMALL = 'small',\n}\n\nexport type ComboBoxProps = {\n /**\n * The width of the body.\n */\n bodyWidth?: number;\n /**\n * The element where the content of the `ComboBox` should be rendered via React Portal.\n */\n container?: Element;\n /**\n * The direction in which the combobox should open.\n */\n direction?: DropdownDirection;\n /**\n * The value of the optional input.\n */\n inputValue?: string;\n /**\n * Whether the combobox should be disabled.\n */\n isDisabled?: boolean;\n /**\n * The list of the items that should be displayed.\n */\n lists: IComboBoxItems[];\n /**\n * The maximum height of the combobox content.\n */\n maxHeight?: number;\n /**\n * Function to be executed when the value of the optional input is changed.\n */\n onInputChange?: ChangeEventHandler<HTMLInputElement>;\n /**\n * Function to be executed when the optional input lost its focus.\n */\n onInputBlur?: FocusEventHandler<HTMLInputElement>;\n /**\n * Function to be executed when the optional input gets its focus.\n */\n onInputFocus?: FocusEventHandler<HTMLInputElement>;\n /**\n * Function that should be executed when an item is selected. If the function returns false, the item will not be selected.\n */\n onSelect?: (comboboxItem?: IComboBoxItem) => Promise<boolean> | boolean | void;\n /**\n * A text that should be displayed when no item is selected.\n */\n placeholder: string;\n /**\n * A prefix that should be displayed before the placeholder.\n */\n prefix?: string;\n /**\n * An item that should be preselected.\n */\n selectedItem?: IComboBoxItem;\n /**\n * If true, the images of the items are displayed in a bigger shape. This prop will automatically be set to true if the subtext of an item is given.\n */\n shouldShowBigImage?: boolean;\n /**\n * If true, a clear icon is displayed at the end of the combo box if an item is selected.\n */\n shouldShowClearIcon?: boolean;\n /**\n * Whether the background should be transparent.\n */\n shouldShowTransparentBackground?: boolean;\n /**\n * If true, the images of the items are displayed in a round shape.\n */\n shouldShowRoundImage?: boolean;\n /**\n * Whether the width of the ComboBox should be the width of the current item.\n */\n shouldUseCurrentItemWidth?: boolean;\n /**\n * Whether the width of the 'ComboBox' should be the width of the parent or of the widest item.\n */\n shouldUseFullWidth?: boolean;\n /**\n * If true, the dropdown will use the maximum width of the items.\n */\n shouldDropDownUseMaxItemWidth?: boolean;\n /**\n * The size of the ComboBox.\n */\n size?: ComboBoxSize;\n /**\n * Optional min width for the prefix element.\n */\n prefixMinWidth?: number;\n};\n\nconst ComboBox = forwardRef<ComboBoxRef, ComboBoxProps>(\n (\n {\n bodyWidth,\n direction = DropdownDirection.RIGHT,\n isDisabled = false,\n lists,\n maxHeight = 280,\n onSelect,\n placeholder,\n prefix,\n container,\n selectedItem,\n shouldShowBigImage,\n shouldShowClearIcon,\n shouldShowRoundImage,\n onInputFocus,\n prefixMinWidth,\n size = ComboBoxSize.NORMAL,\n shouldUseFullWidth = false,\n onInputChange,\n shouldUseCurrentItemWidth = false,\n onInputBlur,\n shouldShowTransparentBackground = false,\n inputValue,\n shouldDropDownUseMaxItemWidth = false,\n },\n ref,\n ) => {\n const [internalSelectedItem, setInternalSelectedItem] = useState<IComboBoxItem>();\n const [isAnimating, setIsAnimating] = useState(false);\n const [minWidth, setMinWidth] = useState<number | undefined>(undefined);\n const [bodyMinWidth, setBodyMinWidth] = useState(0);\n const [focusedIndex, setFocusedIndex] = useState<number | null>(null);\n\n const isInputFocused = useRef(false);\n\n const styledComboBoxElementRef = useRef<HTMLDivElement>(null);\n const contentRef = useRef<HTMLDivElement | null>(null);\n\n const parentSize = useElementSize(styledComboBoxElementRef, {\n shouldUseParentElement: true,\n });\n\n const functions = useFunctions();\n const values = useValues();\n\n const isTouch = useIsTouch();\n\n const { browser } = useDevice();\n\n const areaProvider = useContext(AreaContext);\n\n useEffect(() => {\n if (shouldUseFullWidth && parentSize) {\n setMinWidth(parentSize.width);\n }\n }, [parentSize, shouldUseFullWidth]);\n\n const shouldChangeColor = useMemo(\n () => areaProvider.shouldChangeColor ?? false,\n [areaProvider.shouldChangeColor],\n );\n\n const shouldDisableActions = useMemo(() => {\n if (!selectedItem) {\n return false;\n }\n\n const combinedLists = lists.flatMap((list) => list.list);\n\n return (\n combinedLists.length === 1 &&\n combinedLists.some((item) => item.value === selectedItem.value)\n );\n }, [lists, selectedItem]);\n\n const contentHeight = useMemo(() => {\n const flatItems = lists.flatMap((list) => list.list);\n\n let height = flatItems.reduce((value, item) => {\n const isBigItem =\n shouldShowBigImage ||\n (typeof item.subtext === 'string' && item.subtext.trim() !== '');\n\n return value + (isBigItem ? 56 : 38);\n }, 0);\n\n if (lists.length > 1) {\n height += lists.length * 38;\n }\n\n if (maxHeight < height) {\n height = maxHeight;\n }\n\n return height;\n }, [lists, maxHeight, shouldShowBigImage]);\n\n const handleInputFocus: FocusEventHandler<HTMLInputElement> = useCallback(\n (event) => {\n isInputFocused.current = true;\n onInputFocus?.(event);\n },\n [onInputFocus],\n );\n\n const handleInputBlur: FocusEventHandler<HTMLInputElement> = useCallback(\n (event) => {\n isInputFocused.current = false;\n onInputBlur?.(event);\n },\n [onInputBlur],\n );\n\n const handleOpen = useCallback(() => {\n setIsAnimating(true);\n }, []);\n\n const handleClose = useCallback(() => {\n setIsAnimating(false);\n }, []);\n\n /**\n * This function sets the selected item\n */\n const handleSetSelectedItem = useCallback(\n (itemToSelect?: IComboBoxItem) => {\n if (typeof onSelect === 'function') {\n const onSelectResult = onSelect(itemToSelect);\n\n if (onSelectResult === false) {\n return;\n }\n\n if (onSelectResult instanceof Promise) {\n void onSelectResult.then((shouldPreventSelection) => {\n if (shouldPreventSelection) return;\n\n setInternalSelectedItem(itemToSelect);\n setIsAnimating(false);\n });\n\n return;\n }\n }\n\n setInternalSelectedItem(itemToSelect);\n setIsAnimating(false);\n },\n [onSelect],\n );\n\n const handleClear = useCallback(\n (event: React.MouseEvent<HTMLDivElement>) => {\n event.preventDefault();\n event.stopPropagation();\n\n handleSetSelectedItem(undefined);\n },\n [handleSetSelectedItem],\n );\n\n useEffect(() => {\n const handleKeyDown = (e: KeyboardEvent) => {\n if (!isAnimating) return;\n\n if (e.key === 'ArrowUp' || e.key === 'ArrowDown') {\n e.preventDefault();\n\n const children = contentRef.current?.children;\n\n if (!children || children.length === 0) return;\n\n const stepDirection = e.key === 'ArrowUp' ? -1 : 1;\n\n let newIndex = focusedIndex ?? -1;\n\n let attempts = 0;\n\n do {\n newIndex = (newIndex + stepDirection + children.length) % children.length;\n\n const newElement = children[newIndex] as HTMLDivElement;\n\n let shouldSkip = false;\n\n if (\n newElement.id.startsWith('combobox-group--') ||\n newElement.id.endsWith('--disabled-item')\n ) {\n shouldSkip = true;\n }\n\n if (!shouldSkip) break;\n\n attempts++;\n } while (attempts < children.length);\n\n if (focusedIndex !== null) {\n const prevElement = children[focusedIndex] as HTMLDivElement;\n\n prevElement.tabIndex = -1;\n }\n\n setFocusedIndex(newIndex);\n\n const focusedElement = children[newIndex] as HTMLDivElement;\n\n focusedElement.tabIndex = 0;\n\n focusedElement.focus();\n } else if (e.key === 'Enter' && focusedIndex !== null) {\n const element = contentRef.current?.children[focusedIndex];\n\n if (!element) return;\n\n const { id } = element;\n\n let newSelectedItem: IComboBoxItem | undefined;\n\n lists.some((list) => {\n newSelectedItem = list.list.find(\n ({ value }) => String(value) === id.replace('combobox-item__', ''),\n );\n\n return !!newSelectedItem;\n });\n\n if (newSelectedItem) {\n handleSetSelectedItem(newSelectedItem);\n }\n }\n };\n\n document.addEventListener('keydown', handleKeyDown);\n\n return () => document.removeEventListener('keydown', handleKeyDown);\n }, [focusedIndex, handleSetSelectedItem, isAnimating, lists]);\n\n /**\n * This function calculates the greatest width\n */\n useEffect(() => {\n const allItems = lists.flatMap((list) => list.list);\n\n let maxItemWidth = calculateMaxComboBoxItemWidth({\n list: [\n ...allItems,\n { text: placeholder, value: 'placeholder' },\n ...(selectedItem ? [selectedItem] : []),\n ],\n functions,\n shouldShowBigImage,\n values,\n });\n\n if (shouldDropDownUseMaxItemWidth) {\n maxItemWidth += 20 + 2 + 1; // 20px padding (left and right), 2px border, 1px puffer for rounding errors\n\n setBodyMinWidth(maxItemWidth);\n setMinWidth(maxItemWidth);\n\n return;\n }\n\n const hasImage = [selectedItem, ...allItems].some((item) => item?.imageUrl);\n const hasIcon = [selectedItem, ...allItems].some((item) => item?.icons);\n\n const parentWidth =\n styledComboBoxElementRef.current?.parentElement?.getBoundingClientRect().width ?? 0;\n\n const paddingWidth = 20 + 2 + 40 + 40; // padding + border + arrow icon + optional clear icon\n const imageWidth = hasImage ? 32 : 0; // image width + gap if images present\n const iconWidth = hasIcon ? 40 : 0; // icon width + gap if icons present\n\n let prefixWidth = 0;\n\n if (prefix) {\n const prefixTextWidth = calculateMaxComboBoxItemWidth({\n list: [{ text: prefix, value: 'prefix' }],\n functions,\n values,\n });\n\n prefixWidth = Math.max(prefixTextWidth + 5, 32);\n }\n\n const calculatedWidth =\n maxItemWidth + paddingWidth + imageWidth + iconWidth + prefixWidth;\n\n let tmpMinWidth = calculatedWidth;\n let tmpBodyMinWidth = calculatedWidth;\n\n // Full width settings\n if (shouldUseFullWidth) {\n tmpMinWidth = parentWidth;\n\n tmpBodyMinWidth =\n parentWidth < calculatedWidth - 20 ? calculatedWidth - 20 : parentWidth;\n }\n // Current item width settings\n else if (shouldUseCurrentItemWidth && internalSelectedItem) {\n const internalSelectedItemWidth = calculateMaxComboBoxItemWidth({\n list: [internalSelectedItem],\n functions,\n shouldShowBigImage,\n values,\n });\n\n const itemWidth =\n internalSelectedItemWidth + paddingWidth + imageWidth + iconWidth + prefixWidth;\n\n tmpMinWidth = itemWidth;\n\n tmpBodyMinWidth =\n itemWidth < calculatedWidth - 20 ? calculatedWidth - 20 : itemWidth;\n }\n\n if (tmpMinWidth > parentWidth) {\n tmpMinWidth = parentWidth;\n }\n\n if (tmpBodyMinWidth > parentWidth) {\n tmpBodyMinWidth = parentWidth;\n }\n\n setMinWidth(tmpMinWidth);\n setBodyMinWidth(shouldUseCurrentItemWidth ? tmpMinWidth : tmpBodyMinWidth);\n }, [\n functions,\n internalSelectedItem,\n lists,\n placeholder,\n prefix,\n selectedItem,\n shouldDropDownUseMaxItemWidth,\n shouldShowBigImage,\n shouldUseCurrentItemWidth,\n shouldUseFullWidth,\n values,\n ]);\n\n /**\n * This function sets the external selected item\n */\n useEffect(() => {\n setIsAnimating(false);\n setInternalSelectedItem(selectedItem);\n }, [selectedItem]);\n\n const placeholderImageUrl = useMemo(() => {\n if (selectedItem) {\n return selectedItem.imageUrl;\n }\n\n if (internalSelectedItem) {\n return internalSelectedItem.imageUrl;\n }\n\n return undefined;\n }, [internalSelectedItem, selectedItem]);\n\n const placeholderIcon = useMemo(() => {\n if (selectedItem) {\n return selectedItem.icons;\n }\n\n if (internalSelectedItem) {\n return internalSelectedItem.icons;\n }\n\n return undefined;\n }, [internalSelectedItem, selectedItem]);\n\n /**\n * This function resets the placeholder\n */\n const placeholderText = useMemo(() => {\n let text = placeholder;\n\n if (selectedItem) {\n text = selectedItem.text;\n } else if (internalSelectedItem) {\n text = internalSelectedItem.text;\n }\n\n return text;\n }, [internalSelectedItem, placeholder, selectedItem]);\n\n const shouldShowRoundPlaceholderImage = useMemo(() => {\n const selectedItemList = lists.find((list) =>\n list.list.some(\n ({ value }) => value === (selectedItem?.value ?? internalSelectedItem?.value),\n ),\n );\n\n return selectedItemList?.shouldShowRoundImage ?? shouldShowRoundImage;\n }, [internalSelectedItem?.value, lists, selectedItem?.value, shouldShowRoundImage]);\n\n /**\n * This function opens the content of the combobox\n */\n const handleHeaderClick = useCallback(() => {\n if (!isDisabled && !isInputFocused.current) {\n if (isAnimating) {\n handleClose();\n } else {\n handleOpen();\n }\n }\n }, [handleClose, handleOpen, isAnimating, isDisabled]);\n\n useImperativeHandle(\n ref,\n () => ({\n hide: handleClose,\n show: handleOpen,\n }),\n [handleClose, handleOpen],\n );\n\n const comboBoxGroups = useMemo(\n () =>\n lists.map((list) => (\n <Fragment key={list.groupName ?? 'default-group'}>\n {list.groupName && lists.length > 1 && (\n <StyledComboBoxTopic id={`combobox-group--${list.groupName}`}>\n {list.groupName}\n </StyledComboBoxTopic>\n )}\n {list.list.map((item) => (\n <ComboBoxItem\n key={`item-${item.text}`}\n item={item}\n isSelected={\n selectedItem ? item.value === selectedItem.value : false\n }\n onSelect={handleSetSelectedItem}\n shouldShowBigImage={shouldShowBigImage}\n shouldShowRoundImage={\n list.shouldShowRoundImage ?? shouldShowRoundImage\n }\n />\n ))}\n </Fragment>\n )),\n [handleSetSelectedItem, lists, selectedItem, shouldShowBigImage, shouldShowRoundImage],\n );\n\n return useMemo(\n () => (\n <StyledComboBox\n ref={styledComboBoxElementRef}\n $minWidth={minWidth}\n $shouldUseFullWidth={shouldUseFullWidth}\n $shouldUseCurrentItemWidth={shouldUseCurrentItemWidth}\n >\n <StyledComboBoxHeader\n $direction={direction}\n onClick={handleHeaderClick}\n $isOpen={isAnimating}\n $isTouch={isTouch}\n $size={size}\n $shouldShowTransparentBackground={shouldShowTransparentBackground}\n $isDisabled={isDisabled}\n $shouldChangeColor={shouldChangeColor}\n $shouldShowBigImage={shouldShowBigImage}\n >\n <StyledComboBoxPrefixAndPlaceholderWrapper>\n {prefix && (\n <StyledComboBoxPrefix $prefixMinWidth={prefixMinWidth}>\n {prefix}\n </StyledComboBoxPrefix>\n )}\n <StyledComboBoxPlaceholder\n $shouldReduceOpacity={!selectedItem && !internalSelectedItem}\n >\n {placeholderImageUrl && (\n <StyledComboBoxPlaceholderImage\n src={placeholderImageUrl}\n $shouldShowBigImage={shouldShowBigImage}\n $shouldShowRoundImage={shouldShowRoundPlaceholderImage}\n />\n )}\n {placeholderIcon && <Icon icons={placeholderIcon} />}\n {typeof inputValue === 'string' ? (\n <StyledComboBoxInput\n disabled={isDisabled}\n value={inputValue}\n onChange={onInputChange}\n onBlur={handleInputBlur}\n onFocus={handleInputFocus}\n placeholder={placeholderText}\n />\n ) : (\n <StyledComboBoxPlaceholderText>\n {placeholderText}\n </StyledComboBoxPlaceholderText>\n )}\n {internalSelectedItem &&\n internalSelectedItem.suffixElement &&\n internalSelectedItem.suffixElement}\n </StyledComboBoxPlaceholder>\n </StyledComboBoxPrefixAndPlaceholderWrapper>\n {shouldShowClearIcon && internalSelectedItem && (\n <StyledComboBoxClearIconWrapper\n $isDisabled={isDisabled}\n onClick={handleClear}\n >\n <Icon icons={['fa fa-times']} />\n </StyledComboBoxClearIconWrapper>\n )}\n {!shouldDisableActions && (\n <StyledComboBoxIconWrapper\n $isDisabled={isDisabled}\n $size={size}\n $shouldShowBorderLeft={\n shouldShowClearIcon === true &&\n internalSelectedItem !== undefined\n }\n >\n <Icon icons={['fa fa-chevron-down']} isDisabled={isDisabled} />\n </StyledComboBoxIconWrapper>\n )}\n </StyledComboBoxHeader>\n {styledComboBoxElementRef.current && (\n <DropdownBodyWrapper\n anchorElement={styledComboBoxElementRef.current}\n bodyWidth={bodyWidth}\n contentHeight={contentHeight}\n onClose={handleClose}\n direction={direction}\n container={container}\n shouldShowDropdown={isAnimating}\n minBodyWidth={bodyWidth ?? bodyMinWidth}\n maxHeight={maxHeight}\n >\n <StyledComboBoxBody\n $shouldUseCurrentItemWidth={shouldUseCurrentItemWidth}\n $maxHeight={maxHeight}\n $minWidth={bodyWidth ?? bodyMinWidth}\n $browser={browser?.name as BrowserName}\n ref={contentRef}\n tabIndex={0}\n >\n {comboBoxGroups}\n </StyledComboBoxBody>\n </DropdownBodyWrapper>\n )}\n </StyledComboBox>\n ),\n [\n minWidth,\n shouldUseFullWidth,\n shouldUseCurrentItemWidth,\n direction,\n handleHeaderClick,\n isAnimating,\n isTouch,\n size,\n shouldShowTransparentBackground,\n isDisabled,\n shouldChangeColor,\n shouldShowBigImage,\n prefix,\n prefixMinWidth,\n selectedItem,\n internalSelectedItem,\n placeholderImageUrl,\n shouldShowRoundPlaceholderImage,\n placeholderIcon,\n inputValue,\n onInputChange,\n handleInputBlur,\n handleInputFocus,\n placeholderText,\n shouldShowClearIcon,\n handleClear,\n shouldDisableActions,\n bodyWidth,\n contentHeight,\n handleClose,\n container,\n bodyMinWidth,\n maxHeight,\n browser?.name,\n comboBoxGroups,\n ],\n );\n },\n);\n\nComboBox.displayName = 'ComboBox';\n\nexport default ComboBox;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import styled, { css } from 'styled-components';
|
|
2
|
+
import { ComboBoxSize } from './ComboBox';
|
|
2
3
|
import { DropdownDirection } from '../../types/dropdown';
|
|
3
4
|
export const StyledComboBox = styled.div`
|
|
4
5
|
user-select: none;
|
|
@@ -41,7 +42,21 @@ export const StyledComboBoxHeader = styled.div`
|
|
|
41
42
|
}) => $isDisabled ? 0.5 : 1};
|
|
42
43
|
transition: background-color 0.2s ease-in-out;
|
|
43
44
|
|
|
44
|
-
|
|
45
|
+
${({
|
|
46
|
+
$size
|
|
47
|
+
}) => {
|
|
48
|
+
switch ($size) {
|
|
49
|
+
case ComboBoxSize.SMALL:
|
|
50
|
+
return css`
|
|
51
|
+
height: 34px;
|
|
52
|
+
`;
|
|
53
|
+
case ComboBoxSize.NORMAL:
|
|
54
|
+
default:
|
|
55
|
+
return css`
|
|
56
|
+
min-height: 42px;
|
|
57
|
+
`;
|
|
58
|
+
}
|
|
59
|
+
}}
|
|
45
60
|
|
|
46
61
|
${({
|
|
47
62
|
theme,
|
|
@@ -179,9 +194,24 @@ export const StyledComboBoxIconWrapper = styled.div`
|
|
|
179
194
|
}) => !$isDisabled ? 'pointer' : 'default'};
|
|
180
195
|
display: flex;
|
|
181
196
|
flex: 0 0 auto;
|
|
182
|
-
height: 40px;
|
|
183
197
|
justify-content: center;
|
|
184
198
|
width: 40px;
|
|
199
|
+
|
|
200
|
+
${({
|
|
201
|
+
$size
|
|
202
|
+
}) => {
|
|
203
|
+
switch ($size) {
|
|
204
|
+
case ComboBoxSize.SMALL:
|
|
205
|
+
return css`
|
|
206
|
+
height: 30px;
|
|
207
|
+
`;
|
|
208
|
+
case ComboBoxSize.NORMAL:
|
|
209
|
+
default:
|
|
210
|
+
return css`
|
|
211
|
+
height: 40px;
|
|
212
|
+
`;
|
|
213
|
+
}
|
|
214
|
+
}}
|
|
185
215
|
`;
|
|
186
216
|
export const StyledComboBoxBody = styled.div`
|
|
187
217
|
display: flex;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ComboBox.styles.js","names":["styled","css","DropdownDirection","StyledComboBox","div","$shouldUseFullWidth","$minWidth","$shouldUseCurrentItemWidth","StyledComboBoxHeader","$isDisabled","theme","$shouldShowTransparentBackground","$shouldChangeColor","colorMode","$shouldShowBigImage","$isOpen","$direction","BOTTOM","BOTTOM_LEFT","BOTTOM_RIGHT","includes","$isTouch","StyledComboBoxPlaceholder","text","$shouldReduceOpacity","StyledComboBoxPlaceholderText","StyledComboBoxPrefixAndPlaceholderWrapper","StyledComboBoxPrefix","$prefixMinWidth","StyledComboBoxInput","input","StyledComboBoxPlaceholderImage","img","$shouldShowRoundImage","StyledComboBoxClearIconWrapper","StyledComboBoxIconWrapper","$shouldShowBorderLeft","StyledComboBoxBody","$maxHeight","$browser","StyledComboBoxTopic"],"sources":["../../../../src/components/combobox/ComboBox.styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport { BrowserName } from '../../types/chayns';\nimport type { Theme, WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\nimport type { ComboBoxProps } from './ComboBox';\nimport { DropdownDirection } from '../../types/dropdown';\n\ntype StyledComboBoxProps = WithTheme<{\n $minWidth?: number;\n $shouldUseFullWidth: ComboBoxProps['shouldUseFullWidth'];\n $shouldUseCurrentItemWidth: ComboBoxProps['shouldUseCurrentItemWidth'];\n}>;\n\nexport const StyledComboBox = styled.div<StyledComboBoxProps>`\n user-select: none;\n position: relative;\n\n ${({ $shouldUseFullWidth, $minWidth, $shouldUseCurrentItemWidth }) => {\n if (typeof $minWidth !== 'number') {\n return css`\n width: fit-content;\n `;\n }\n\n if ($shouldUseFullWidth) {\n return css`\n min-width: ${$minWidth}px;\n width: 100%;\n `;\n }\n\n if ($shouldUseCurrentItemWidth) {\n return '';\n }\n\n return css`\n min-width: ${$minWidth}px;\n max-width: ${$minWidth}px;\n `;\n }}\n`;\n\ntype StyledComboBoxHeaderProps = WithTheme<{\n $isTouch: boolean;\n $isOpen: boolean;\n $direction: DropdownDirection;\n $isDisabled?: boolean;\n $shouldChangeColor: boolean;\n $shouldShowBigImage: ComboBoxProps['shouldShowBigImage'];\n $shouldShowTransparentBackground: boolean;\n}>;\n\nexport const StyledComboBoxHeader = styled.div<StyledComboBoxHeaderProps>`\n display: flex;\n border: 1px solid transparent;\n cursor: ${({ $isDisabled }) => (!$isDisabled ? 'pointer' : 'default')};\n justify-content: space-between;\n opacity: ${({ $isDisabled }) => ($isDisabled ? 0.5 : 1)};\n transition: background-color 0.2s ease-in-out;\n\n min-height: 42px;\n\n ${({ theme, $shouldShowTransparentBackground, $shouldChangeColor }) => {\n if ($shouldShowTransparentBackground) {\n if (theme.colorMode === 'dark') {\n return css`\n border-color: rgba(255, 255, 255, 0.5);\n background-color: transparent;\n `;\n }\n\n return css`\n border-color: rgba(0, 0, 0, 0.5);\n background-color: transparent;\n `;\n }\n\n return css`\n border-color: rgba(160, 160, 160, 0.3);\n background-color: ${theme.colorMode === 'classic' || $shouldChangeColor\n ? theme['000']\n : theme['100']};\n `;\n }}\n\n ${({ $shouldShowBigImage }) =>\n $shouldShowBigImage &&\n css`\n height: 42px;\n `}\n\n ${({ $isOpen, $direction }) => {\n if ($isOpen) {\n return [\n DropdownDirection.BOTTOM,\n DropdownDirection.BOTTOM_LEFT,\n DropdownDirection.BOTTOM_RIGHT,\n ].includes($direction)\n ? css`\n border-top-left-radius: 3px;\n border-top-right-radius: 3px;\n `\n : css`\n border-bottom-left-radius: 3px;\n border-bottom-right-radius: 3px;\n `;\n }\n\n return css`\n border-radius: 3px;\n `;\n }}\n\n ${({ $isTouch, $isDisabled, theme }: StyledComboBoxHeaderProps) =>\n !$isTouch &&\n !$isDisabled &&\n css`\n &:hover {\n background-color: ${theme['secondary-102']};\n }\n `}\n`;\n\ntype StyledComboBoxPlaceholderProps = WithTheme<{ $shouldReduceOpacity: boolean }>;\n\nexport const StyledComboBoxPlaceholder = styled.div<StyledComboBoxPlaceholderProps>`\n align-items: center;\n color: ${({ theme }: StyledComboBoxPlaceholderProps) => theme.text};\n display: flex;\n flex: 1 1 auto;\n gap: 10px;\n min-width: 0;\n opacity: ${({ $shouldReduceOpacity }) => ($shouldReduceOpacity ? 0.5 : 1)};\n`;\n\nexport const StyledComboBoxPlaceholderText = styled.div`\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n`;\n\nexport const StyledComboBoxPrefixAndPlaceholderWrapper = styled.div`\n align-items: center;\n display: flex;\n flex: 1 1 auto;\n min-width: 0;\n padding: 4px 10px;\n`;\n\ntype StyledComboBoxPrefixProps = {\n $prefixMinWidth?: number;\n};\n\nexport const StyledComboBoxPrefix = styled.div<StyledComboBoxPrefixProps>`\n flex: 0 0 auto;\n min-width: ${({ $prefixMinWidth }) => $prefixMinWidth ?? 0}px;\n padding-right: 5px;\n`;\n\nexport const StyledComboBoxInput = styled.input`\n color: ${({ theme }: { theme: Theme }) => theme.text};\n border: none;\n background-color: transparent;\n width: 100%;\n`;\n\ntype StyledComboBoxPlaceholderImageProps = WithTheme<{\n $shouldShowBigImage: ComboBoxProps['shouldShowBigImage'];\n $shouldShowRoundImage: ComboBoxProps['shouldShowRoundImage'];\n}>;\n\nexport const StyledComboBoxPlaceholderImage = styled.img<StyledComboBoxPlaceholderImageProps>`\n box-shadow: 0 0 0 1px\n rgba(${({ theme }: StyledComboBoxPlaceholderImageProps) => theme['009-rgb']}, 0.15);\n height: ${({ $shouldShowBigImage }) => ($shouldShowBigImage ? '32px' : '22px')};\n width: ${({ $shouldShowBigImage }) => ($shouldShowBigImage ? '32px' : '22px')};\n\n ${({ $shouldShowRoundImage }) =>\n $shouldShowRoundImage &&\n css`\n border-radius: 50%;\n `}\n`;\n\ntype StyledComboBoxClearIconWrapperProps = { $isDisabled: boolean };\n\nexport const StyledComboBoxClearIconWrapper = styled.div<StyledComboBoxClearIconWrapperProps>`\n align-items: center;\n cursor: ${({ $isDisabled }) => (!$isDisabled ? 'pointer' : 'default')};\n display: flex;\n flex: 0 0 auto;\n height: 40px;\n justify-content: center;\n width: 40px;\n`;\n\ntype StyledComboBoxIconWrapperProps = { $shouldShowBorderLeft: boolean; $isDisabled: boolean };\n\nexport const StyledComboBoxIconWrapper = styled.div<StyledComboBoxIconWrapperProps>`\n align-items: center;\n border-left: ${({ $shouldShowBorderLeft }) =>\n $shouldShowBorderLeft ? '1px solid rgba(160, 160, 160, 0.3)' : 'none'};\n cursor: ${({ $isDisabled }) => (!$isDisabled ? 'pointer' : 'default')};\n display: flex;\n flex: 0 0 auto;\n height: 40px;\n justify-content: center;\n width: 40px;\n`;\n\ntype StyledComboBoxBodyProps = WithTheme<{\n $shouldUseCurrentItemWidth: boolean;\n $browser: BrowserName;\n $maxHeight: number;\n $minWidth: number;\n}>;\n\nexport const StyledComboBoxBody = styled.div<StyledComboBoxBodyProps>`\n display: flex;\n flex-direction: column;\n cursor: pointer;\n\n overflow-x: hidden;\n overflow-y: auto;\n\n max-height: ${({ $maxHeight }) => $maxHeight}px;\n\n // Styles for custom scrollbar\n ${({ $browser, theme }: StyledComboBoxBodyProps) =>\n $browser === 'firefox'\n ? css`\n scrollbar-color: rgba(${theme['text-rgb']}, 0.15) transparent;\n scrollbar-width: thin;\n `\n : css`\n &::-webkit-scrollbar {\n width: 10px;\n height: 10px;\n }\n\n &::-webkit-scrollbar-track {\n background-color: transparent;\n }\n\n &::-webkit-scrollbar-button {\n background-color: transparent;\n height: 5px;\n width: 5px;\n }\n\n &::-webkit-scrollbar-thumb {\n background-color: rgba(${theme['text-rgb']}, 0.15);\n border-radius: 20px;\n background-clip: padding-box;\n border: solid 3px transparent;\n }\n\n &::-webkit-scrollbar-corner {\n background-color: transparent;\n }\n `}\n`;\n\ntype StyledComboBoxTopicProps = WithTheme<unknown>;\n\nexport const StyledComboBoxTopic = styled.div`\n align-items: center;\n background-color: ${({ theme }: StyledComboBoxTopicProps) => theme['secondary-102']};\n color: rgba(${({ theme }: StyledComboBoxTopicProps) => theme['text-rgb']}, 0.65);\n cursor: default;\n display: flex;\n flex: 0 0 auto;\n font-weight: bold;\n min-height: 38px;\n line-height: normal;\n padding: 8px 10px;\n position: sticky;\n top: 0;\n z-index: 10;\n`;\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"ComboBox.styles.js","names":["styled","css","ComboBoxSize","DropdownDirection","StyledComboBox","div","$shouldUseFullWidth","$minWidth","$shouldUseCurrentItemWidth","StyledComboBoxHeader","$isDisabled","$size","SMALL","NORMAL","theme","$shouldShowTransparentBackground","$shouldChangeColor","colorMode","$shouldShowBigImage","$isOpen","$direction","BOTTOM","BOTTOM_LEFT","BOTTOM_RIGHT","includes","$isTouch","StyledComboBoxPlaceholder","text","$shouldReduceOpacity","StyledComboBoxPlaceholderText","StyledComboBoxPrefixAndPlaceholderWrapper","StyledComboBoxPrefix","$prefixMinWidth","StyledComboBoxInput","input","StyledComboBoxPlaceholderImage","img","$shouldShowRoundImage","StyledComboBoxClearIconWrapper","StyledComboBoxIconWrapper","$shouldShowBorderLeft","StyledComboBoxBody","$maxHeight","$browser","StyledComboBoxTopic"],"sources":["../../../../src/components/combobox/ComboBox.styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport { BrowserName } from '../../types/chayns';\nimport type { Theme, WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\nimport { ComboBoxProps, ComboBoxSize } from './ComboBox';\nimport { DropdownDirection } from '../../types/dropdown';\n\ntype StyledComboBoxProps = WithTheme<{\n $minWidth?: number;\n $shouldUseFullWidth: ComboBoxProps['shouldUseFullWidth'];\n $shouldUseCurrentItemWidth: ComboBoxProps['shouldUseCurrentItemWidth'];\n}>;\n\nexport const StyledComboBox = styled.div<StyledComboBoxProps>`\n user-select: none;\n position: relative;\n\n ${({ $shouldUseFullWidth, $minWidth, $shouldUseCurrentItemWidth }) => {\n if (typeof $minWidth !== 'number') {\n return css`\n width: fit-content;\n `;\n }\n\n if ($shouldUseFullWidth) {\n return css`\n min-width: ${$minWidth}px;\n width: 100%;\n `;\n }\n\n if ($shouldUseCurrentItemWidth) {\n return '';\n }\n\n return css`\n min-width: ${$minWidth}px;\n max-width: ${$minWidth}px;\n `;\n }}\n`;\n\ntype StyledComboBoxHeaderProps = WithTheme<{\n $isTouch: boolean;\n $isOpen: boolean;\n $direction: DropdownDirection;\n $isDisabled?: boolean;\n $shouldChangeColor: boolean;\n $shouldShowBigImage: ComboBoxProps['shouldShowBigImage'];\n $shouldShowTransparentBackground: boolean;\n $size: ComboBoxSize;\n}>;\n\nexport const StyledComboBoxHeader = styled.div<StyledComboBoxHeaderProps>`\n display: flex;\n border: 1px solid transparent;\n cursor: ${({ $isDisabled }) => (!$isDisabled ? 'pointer' : 'default')};\n justify-content: space-between;\n opacity: ${({ $isDisabled }) => ($isDisabled ? 0.5 : 1)};\n transition: background-color 0.2s ease-in-out;\n\n ${({ $size }) => {\n switch ($size) {\n case ComboBoxSize.SMALL:\n return css`\n height: 34px;\n `;\n case ComboBoxSize.NORMAL:\n default:\n return css`\n min-height: 42px;\n `;\n }\n }}\n\n ${({ theme, $shouldShowTransparentBackground, $shouldChangeColor }) => {\n if ($shouldShowTransparentBackground) {\n if (theme.colorMode === 'dark') {\n return css`\n border-color: rgba(255, 255, 255, 0.5);\n background-color: transparent;\n `;\n }\n\n return css`\n border-color: rgba(0, 0, 0, 0.5);\n background-color: transparent;\n `;\n }\n\n return css`\n border-color: rgba(160, 160, 160, 0.3);\n background-color: ${theme.colorMode === 'classic' || $shouldChangeColor\n ? theme['000']\n : theme['100']};\n `;\n }}\n\n ${({ $shouldShowBigImage }) =>\n $shouldShowBigImage &&\n css`\n height: 42px;\n `}\n\n ${({ $isOpen, $direction }) => {\n if ($isOpen) {\n return [\n DropdownDirection.BOTTOM,\n DropdownDirection.BOTTOM_LEFT,\n DropdownDirection.BOTTOM_RIGHT,\n ].includes($direction)\n ? css`\n border-top-left-radius: 3px;\n border-top-right-radius: 3px;\n `\n : css`\n border-bottom-left-radius: 3px;\n border-bottom-right-radius: 3px;\n `;\n }\n\n return css`\n border-radius: 3px;\n `;\n }}\n\n ${({ $isTouch, $isDisabled, theme }: StyledComboBoxHeaderProps) =>\n !$isTouch &&\n !$isDisabled &&\n css`\n &:hover {\n background-color: ${theme['secondary-102']};\n }\n `}\n`;\n\ntype StyledComboBoxPlaceholderProps = WithTheme<{ $shouldReduceOpacity: boolean }>;\n\nexport const StyledComboBoxPlaceholder = styled.div<StyledComboBoxPlaceholderProps>`\n align-items: center;\n color: ${({ theme }: StyledComboBoxPlaceholderProps) => theme.text};\n display: flex;\n flex: 1 1 auto;\n gap: 10px;\n min-width: 0;\n opacity: ${({ $shouldReduceOpacity }) => ($shouldReduceOpacity ? 0.5 : 1)};\n`;\n\nexport const StyledComboBoxPlaceholderText = styled.div`\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n`;\n\nexport const StyledComboBoxPrefixAndPlaceholderWrapper = styled.div`\n align-items: center;\n display: flex;\n flex: 1 1 auto;\n min-width: 0;\n padding: 4px 10px;\n`;\n\ntype StyledComboBoxPrefixProps = {\n $prefixMinWidth?: number;\n};\n\nexport const StyledComboBoxPrefix = styled.div<StyledComboBoxPrefixProps>`\n flex: 0 0 auto;\n min-width: ${({ $prefixMinWidth }) => $prefixMinWidth ?? 0}px;\n padding-right: 5px;\n`;\n\nexport const StyledComboBoxInput = styled.input`\n color: ${({ theme }: { theme: Theme }) => theme.text};\n border: none;\n background-color: transparent;\n width: 100%;\n`;\n\ntype StyledComboBoxPlaceholderImageProps = WithTheme<{\n $shouldShowBigImage: ComboBoxProps['shouldShowBigImage'];\n $shouldShowRoundImage: ComboBoxProps['shouldShowRoundImage'];\n}>;\n\nexport const StyledComboBoxPlaceholderImage = styled.img<StyledComboBoxPlaceholderImageProps>`\n box-shadow: 0 0 0 1px\n rgba(${({ theme }: StyledComboBoxPlaceholderImageProps) => theme['009-rgb']}, 0.15);\n height: ${({ $shouldShowBigImage }) => ($shouldShowBigImage ? '32px' : '22px')};\n width: ${({ $shouldShowBigImage }) => ($shouldShowBigImage ? '32px' : '22px')};\n\n ${({ $shouldShowRoundImage }) =>\n $shouldShowRoundImage &&\n css`\n border-radius: 50%;\n `}\n`;\n\ntype StyledComboBoxClearIconWrapperProps = { $isDisabled: boolean };\n\nexport const StyledComboBoxClearIconWrapper = styled.div<StyledComboBoxClearIconWrapperProps>`\n align-items: center;\n cursor: ${({ $isDisabled }) => (!$isDisabled ? 'pointer' : 'default')};\n display: flex;\n flex: 0 0 auto;\n height: 40px;\n justify-content: center;\n width: 40px;\n`;\n\ntype StyledComboBoxIconWrapperProps = {\n $shouldShowBorderLeft: boolean;\n $isDisabled: boolean;\n $size: ComboBoxSize;\n};\n\nexport const StyledComboBoxIconWrapper = styled.div<StyledComboBoxIconWrapperProps>`\n align-items: center;\n border-left: ${({ $shouldShowBorderLeft }) =>\n $shouldShowBorderLeft ? '1px solid rgba(160, 160, 160, 0.3)' : 'none'};\n cursor: ${({ $isDisabled }) => (!$isDisabled ? 'pointer' : 'default')};\n display: flex;\n flex: 0 0 auto;\n justify-content: center;\n width: 40px;\n\n ${({ $size }) => {\n switch ($size) {\n case ComboBoxSize.SMALL:\n return css`\n height: 30px;\n `;\n case ComboBoxSize.NORMAL:\n default:\n return css`\n height: 40px;\n `;\n }\n }}\n`;\n\ntype StyledComboBoxBodyProps = WithTheme<{\n $shouldUseCurrentItemWidth: boolean;\n $browser: BrowserName;\n $maxHeight: number;\n $minWidth: number;\n}>;\n\nexport const StyledComboBoxBody = styled.div<StyledComboBoxBodyProps>`\n display: flex;\n flex-direction: column;\n cursor: pointer;\n\n overflow-x: hidden;\n overflow-y: auto;\n\n max-height: ${({ $maxHeight }) => $maxHeight}px;\n\n // Styles for custom scrollbar\n ${({ $browser, theme }: StyledComboBoxBodyProps) =>\n $browser === 'firefox'\n ? css`\n scrollbar-color: rgba(${theme['text-rgb']}, 0.15) transparent;\n scrollbar-width: thin;\n `\n : css`\n &::-webkit-scrollbar {\n width: 10px;\n height: 10px;\n }\n\n &::-webkit-scrollbar-track {\n background-color: transparent;\n }\n\n &::-webkit-scrollbar-button {\n background-color: transparent;\n height: 5px;\n width: 5px;\n }\n\n &::-webkit-scrollbar-thumb {\n background-color: rgba(${theme['text-rgb']}, 0.15);\n border-radius: 20px;\n background-clip: padding-box;\n border: solid 3px transparent;\n }\n\n &::-webkit-scrollbar-corner {\n background-color: transparent;\n }\n `}\n`;\n\ntype StyledComboBoxTopicProps = WithTheme<unknown>;\n\nexport const StyledComboBoxTopic = styled.div`\n align-items: center;\n background-color: ${({ theme }: StyledComboBoxTopicProps) => theme['secondary-102']};\n color: rgba(${({ theme }: StyledComboBoxTopicProps) => theme['text-rgb']}, 0.65);\n cursor: default;\n display: flex;\n flex: 0 0 auto;\n font-weight: bold;\n min-height: 38px;\n line-height: normal;\n padding: 8px 10px;\n position: sticky;\n top: 0;\n z-index: 10;\n`;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -142,7 +142,7 @@ const MultiActionButton = ({
|
|
|
142
142
|
}, /*#__PURE__*/React.createElement(ActionButton, {
|
|
143
143
|
action: primaryAction,
|
|
144
144
|
actionType: "primary",
|
|
145
|
-
backgroundColor: backgroundColor,
|
|
145
|
+
backgroundColor: primaryAction.backgroundColor ?? backgroundColor,
|
|
146
146
|
isCollapsed: isCollapsed,
|
|
147
147
|
isDisabled: isDisabled,
|
|
148
148
|
isShrunk: hasSecondaryAction && isSecondaryExpanded,
|
|
@@ -156,7 +156,7 @@ const MultiActionButton = ({
|
|
|
156
156
|
}), /*#__PURE__*/React.createElement(ActionButton, {
|
|
157
157
|
action: secondaryAction,
|
|
158
158
|
actionType: "secondary",
|
|
159
|
-
backgroundColor: backgroundColor,
|
|
159
|
+
backgroundColor: secondaryAction.backgroundColor ?? backgroundColor,
|
|
160
160
|
isCollapsed: isCollapsed,
|
|
161
161
|
isDisabled: isDisabled,
|
|
162
162
|
isExpanded: isSecondaryExpanded,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MultiActionButton.js","names":["clsx","React","useCallback","useEffect","useRef","useState","useIsTouch","ActionButton","StyledMultiActionButton","StyledSeparator","MultiActionButtonHeight","MultiActionButton","backgroundColor","className","extendedTimeoutMs","gapColor","height","Medium","isCollapsed","isDisabled","primaryAction","secondaryAction","shouldUseFullWidth","width","isExtendedByClick","setIsExtendedByClick","isSecondaryExpanded","setIsSecondaryExpanded","isSecondaryHovered","setIsSecondaryHovered","autoCollapseTimeoutRef","isTouch","hasSecondaryAction","Boolean","shouldUseContentWidth","resolvedWidth","resetAutoCollapseTimeout","current","window","clearTimeout","setTimeout","expandSecondaryByClick","handlePrimaryClick","event","payload","action","isExtended","onClick","handleSecondaryClick","handleSecondaryMouseEnter","handleSecondaryMouseLeave","isSecondaryLabelVisible","createElement","style","maxWidth","actionType","isShrunk","isSolo","showLabel","Fragment","$gapColor","isExpanded","isHidden","onMouseEnter","onMouseLeave","displayName"],"sources":["../../../../src/components/multi-action-button/MultiActionButton.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport React, { FC, MouseEvent, useCallback, useEffect, useRef, useState } from 'react';\nimport { useIsTouch } from '../../utils/environment';\nimport ActionButton from './action-button/ActionButton';\nimport { StyledMultiActionButton, StyledSeparator } from './MultiActionButton.styles';\nimport { MultiActionButtonHeight } from './MultiActionButton.types';\nimport type {\n MultiActionButtonActionEvent,\n MultiActionButtonProps,\n} from './MultiActionButton.types';\n\n/**\n * Multi-action button with optional secondary action that can expand on hover/click.\n */\nconst MultiActionButton: FC<MultiActionButtonProps> = ({\n backgroundColor,\n className,\n extendedTimeoutMs = 3000,\n gapColor,\n height = MultiActionButtonHeight.Medium,\n isCollapsed = false,\n isDisabled = false,\n primaryAction,\n secondaryAction,\n shouldUseFullWidth,\n width,\n}) => {\n const [isExtendedByClick, setIsExtendedByClick] = useState(false);\n const [isSecondaryExpanded, setIsSecondaryExpanded] = useState(false);\n const [isSecondaryHovered, setIsSecondaryHovered] = useState(false);\n\n const autoCollapseTimeoutRef = useRef<number | null>(null);\n\n const isTouch = useIsTouch();\n\n const hasSecondaryAction = Boolean(secondaryAction);\n const shouldUseContentWidth = !width && !shouldUseFullWidth;\n\n const resolvedWidth = isCollapsed\n ? height\n : (width ?? (shouldUseFullWidth ? '100%' : 'fit-content'));\n\n /**\n * Clears and restarts the auto-collapse timer used after click-triggered expansion.\n */\n const resetAutoCollapseTimeout = useCallback(() => {\n if (autoCollapseTimeoutRef.current) {\n window.clearTimeout(autoCollapseTimeoutRef.current);\n }\n\n if (extendedTimeoutMs <= 0) {\n autoCollapseTimeoutRef.current = null;\n return;\n }\n\n autoCollapseTimeoutRef.current = window.setTimeout(() => {\n setIsSecondaryExpanded(false);\n setIsExtendedByClick(false);\n }, extendedTimeoutMs);\n }, [extendedTimeoutMs]);\n\n /**\n * Expands the secondary action and remembers that it originated from a click.\n */\n const expandSecondaryByClick = useCallback(() => {\n setIsSecondaryExpanded(true);\n setIsExtendedByClick(true);\n resetAutoCollapseTimeout();\n }, [resetAutoCollapseTimeout]);\n\n /**\n * Cleanup timers on unmount.\n */\n useEffect(\n () => () => {\n if (autoCollapseTimeoutRef.current) {\n window.clearTimeout(autoCollapseTimeoutRef.current);\n }\n },\n [],\n );\n\n /**\n * Collapsing the control should also reset any temporary expansion state.\n */\n useEffect(() => {\n if (isCollapsed) {\n setIsSecondaryExpanded(false);\n setIsExtendedByClick(false);\n }\n }, [isCollapsed]);\n\n /**\n * Handler for the primary action button.\n */\n const handlePrimaryClick = useCallback(\n (event: MouseEvent<HTMLButtonElement>) => {\n if (isDisabled || primaryAction.isDisabled) {\n return;\n }\n\n const payload: MultiActionButtonActionEvent = {\n action: 'primary',\n event,\n isExtended: isSecondaryExpanded,\n isTouch,\n };\n\n primaryAction.onClick?.(payload);\n },\n [isDisabled, isSecondaryExpanded, isTouch, primaryAction],\n );\n\n /**\n * Handler for the secondary action button.\n */\n const handleSecondaryClick = useCallback(\n (event: MouseEvent<HTMLButtonElement>) => {\n if (!secondaryAction || isCollapsed || isDisabled || secondaryAction.isDisabled) {\n return;\n }\n\n const payload: MultiActionButtonActionEvent = {\n action: 'secondary',\n event,\n isExtended: isSecondaryExpanded,\n isTouch,\n };\n\n secondaryAction.onClick?.(payload);\n expandSecondaryByClick();\n },\n [\n expandSecondaryByClick,\n isCollapsed,\n isDisabled,\n isSecondaryExpanded,\n isTouch,\n secondaryAction,\n ],\n );\n\n /**\n * Desktop hover behavior keeps the secondary action expanded while hovered.\n */\n const handleSecondaryMouseEnter = useCallback(() => {\n if (\n !secondaryAction ||\n isCollapsed ||\n isTouch ||\n isDisabled ||\n secondaryAction.isDisabled\n ) {\n return;\n }\n\n setIsSecondaryHovered(true);\n if (!isExtendedByClick) {\n setIsSecondaryExpanded(true);\n }\n }, [isCollapsed, isDisabled, isExtendedByClick, isTouch, secondaryAction]);\n\n const handleSecondaryMouseLeave = useCallback(() => {\n if (isTouch) {\n return;\n }\n\n setIsSecondaryHovered(false);\n if (!isExtendedByClick && !isCollapsed) {\n setIsSecondaryExpanded(false);\n }\n }, [isCollapsed, isExtendedByClick, isTouch]);\n\n /**\n * Secondary label is visible when expanded or when hovered (desktop only).\n */\n const isSecondaryLabelVisible = isSecondaryExpanded || (!isTouch && isSecondaryHovered);\n\n return (\n <StyledMultiActionButton\n className={clsx('beta-chayns-multi-action', className)}\n style={{ maxWidth: '100%', width: resolvedWidth }}\n >\n <ActionButton\n action={primaryAction}\n actionType=\"primary\"\n backgroundColor={backgroundColor}\n isCollapsed={isCollapsed}\n isDisabled={isDisabled}\n isShrunk={hasSecondaryAction && isSecondaryExpanded}\n isSolo={!hasSecondaryAction && !isCollapsed}\n onClick={handlePrimaryClick}\n showLabel={!isCollapsed && (!hasSecondaryAction || !isSecondaryExpanded)}\n shouldUseContentWidth={shouldUseContentWidth}\n height={height}\n />\n {secondaryAction && (\n <>\n {!isCollapsed && <StyledSeparator $gapColor={gapColor} />}\n <ActionButton\n action={secondaryAction}\n actionType=\"secondary\"\n backgroundColor={backgroundColor}\n isCollapsed={isCollapsed}\n isDisabled={isDisabled}\n isExpanded={isSecondaryExpanded}\n isHidden={isCollapsed}\n onClick={handleSecondaryClick}\n onMouseEnter={handleSecondaryMouseEnter}\n onMouseLeave={handleSecondaryMouseLeave}\n showLabel={isSecondaryLabelVisible}\n shouldUseContentWidth={shouldUseContentWidth}\n height={height}\n />\n </>\n )}\n </StyledMultiActionButton>\n );\n};\n\nMultiActionButton.displayName = 'MultiActionButton';\n\nexport default MultiActionButton;\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"MultiActionButton.js","names":["clsx","React","useCallback","useEffect","useRef","useState","useIsTouch","ActionButton","StyledMultiActionButton","StyledSeparator","MultiActionButtonHeight","MultiActionButton","backgroundColor","className","extendedTimeoutMs","gapColor","height","Medium","isCollapsed","isDisabled","primaryAction","secondaryAction","shouldUseFullWidth","width","isExtendedByClick","setIsExtendedByClick","isSecondaryExpanded","setIsSecondaryExpanded","isSecondaryHovered","setIsSecondaryHovered","autoCollapseTimeoutRef","isTouch","hasSecondaryAction","Boolean","shouldUseContentWidth","resolvedWidth","resetAutoCollapseTimeout","current","window","clearTimeout","setTimeout","expandSecondaryByClick","handlePrimaryClick","event","payload","action","isExtended","onClick","handleSecondaryClick","handleSecondaryMouseEnter","handleSecondaryMouseLeave","isSecondaryLabelVisible","createElement","style","maxWidth","actionType","isShrunk","isSolo","showLabel","Fragment","$gapColor","isExpanded","isHidden","onMouseEnter","onMouseLeave","displayName"],"sources":["../../../../src/components/multi-action-button/MultiActionButton.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport React, { FC, MouseEvent, useCallback, useEffect, useRef, useState } from 'react';\nimport { useIsTouch } from '../../utils/environment';\nimport ActionButton from './action-button/ActionButton';\nimport { StyledMultiActionButton, StyledSeparator } from './MultiActionButton.styles';\nimport { MultiActionButtonHeight } from './MultiActionButton.types';\nimport type {\n MultiActionButtonActionEvent,\n MultiActionButtonProps,\n} from './MultiActionButton.types';\n\n/**\n * Multi-action button with optional secondary action that can expand on hover/click.\n */\nconst MultiActionButton: FC<MultiActionButtonProps> = ({\n backgroundColor,\n className,\n extendedTimeoutMs = 3000,\n gapColor,\n height = MultiActionButtonHeight.Medium,\n isCollapsed = false,\n isDisabled = false,\n primaryAction,\n secondaryAction,\n shouldUseFullWidth,\n width,\n}) => {\n const [isExtendedByClick, setIsExtendedByClick] = useState(false);\n const [isSecondaryExpanded, setIsSecondaryExpanded] = useState(false);\n const [isSecondaryHovered, setIsSecondaryHovered] = useState(false);\n\n const autoCollapseTimeoutRef = useRef<number | null>(null);\n\n const isTouch = useIsTouch();\n\n const hasSecondaryAction = Boolean(secondaryAction);\n const shouldUseContentWidth = !width && !shouldUseFullWidth;\n\n const resolvedWidth = isCollapsed\n ? height\n : (width ?? (shouldUseFullWidth ? '100%' : 'fit-content'));\n\n /**\n * Clears and restarts the auto-collapse timer used after click-triggered expansion.\n */\n const resetAutoCollapseTimeout = useCallback(() => {\n if (autoCollapseTimeoutRef.current) {\n window.clearTimeout(autoCollapseTimeoutRef.current);\n }\n\n if (extendedTimeoutMs <= 0) {\n autoCollapseTimeoutRef.current = null;\n return;\n }\n\n autoCollapseTimeoutRef.current = window.setTimeout(() => {\n setIsSecondaryExpanded(false);\n setIsExtendedByClick(false);\n }, extendedTimeoutMs);\n }, [extendedTimeoutMs]);\n\n /**\n * Expands the secondary action and remembers that it originated from a click.\n */\n const expandSecondaryByClick = useCallback(() => {\n setIsSecondaryExpanded(true);\n setIsExtendedByClick(true);\n resetAutoCollapseTimeout();\n }, [resetAutoCollapseTimeout]);\n\n /**\n * Cleanup timers on unmount.\n */\n useEffect(\n () => () => {\n if (autoCollapseTimeoutRef.current) {\n window.clearTimeout(autoCollapseTimeoutRef.current);\n }\n },\n [],\n );\n\n /**\n * Collapsing the control should also reset any temporary expansion state.\n */\n useEffect(() => {\n if (isCollapsed) {\n setIsSecondaryExpanded(false);\n setIsExtendedByClick(false);\n }\n }, [isCollapsed]);\n\n /**\n * Handler for the primary action button.\n */\n const handlePrimaryClick = useCallback(\n (event: MouseEvent<HTMLButtonElement>) => {\n if (isDisabled || primaryAction.isDisabled) {\n return;\n }\n\n const payload: MultiActionButtonActionEvent = {\n action: 'primary',\n event,\n isExtended: isSecondaryExpanded,\n isTouch,\n };\n\n primaryAction.onClick?.(payload);\n },\n [isDisabled, isSecondaryExpanded, isTouch, primaryAction],\n );\n\n /**\n * Handler for the secondary action button.\n */\n const handleSecondaryClick = useCallback(\n (event: MouseEvent<HTMLButtonElement>) => {\n if (!secondaryAction || isCollapsed || isDisabled || secondaryAction.isDisabled) {\n return;\n }\n\n const payload: MultiActionButtonActionEvent = {\n action: 'secondary',\n event,\n isExtended: isSecondaryExpanded,\n isTouch,\n };\n\n secondaryAction.onClick?.(payload);\n expandSecondaryByClick();\n },\n [\n expandSecondaryByClick,\n isCollapsed,\n isDisabled,\n isSecondaryExpanded,\n isTouch,\n secondaryAction,\n ],\n );\n\n /**\n * Desktop hover behavior keeps the secondary action expanded while hovered.\n */\n const handleSecondaryMouseEnter = useCallback(() => {\n if (\n !secondaryAction ||\n isCollapsed ||\n isTouch ||\n isDisabled ||\n secondaryAction.isDisabled\n ) {\n return;\n }\n\n setIsSecondaryHovered(true);\n if (!isExtendedByClick) {\n setIsSecondaryExpanded(true);\n }\n }, [isCollapsed, isDisabled, isExtendedByClick, isTouch, secondaryAction]);\n\n const handleSecondaryMouseLeave = useCallback(() => {\n if (isTouch) {\n return;\n }\n\n setIsSecondaryHovered(false);\n if (!isExtendedByClick && !isCollapsed) {\n setIsSecondaryExpanded(false);\n }\n }, [isCollapsed, isExtendedByClick, isTouch]);\n\n /**\n * Secondary label is visible when expanded or when hovered (desktop only).\n */\n const isSecondaryLabelVisible = isSecondaryExpanded || (!isTouch && isSecondaryHovered);\n\n return (\n <StyledMultiActionButton\n className={clsx('beta-chayns-multi-action', className)}\n style={{ maxWidth: '100%', width: resolvedWidth }}\n >\n <ActionButton\n action={primaryAction}\n actionType=\"primary\"\n backgroundColor={primaryAction.backgroundColor ?? backgroundColor}\n isCollapsed={isCollapsed}\n isDisabled={isDisabled}\n isShrunk={hasSecondaryAction && isSecondaryExpanded}\n isSolo={!hasSecondaryAction && !isCollapsed}\n onClick={handlePrimaryClick}\n showLabel={!isCollapsed && (!hasSecondaryAction || !isSecondaryExpanded)}\n shouldUseContentWidth={shouldUseContentWidth}\n height={height}\n />\n {secondaryAction && (\n <>\n {!isCollapsed && <StyledSeparator $gapColor={gapColor} />}\n <ActionButton\n action={secondaryAction}\n actionType=\"secondary\"\n backgroundColor={secondaryAction.backgroundColor ?? backgroundColor}\n isCollapsed={isCollapsed}\n isDisabled={isDisabled}\n isExpanded={isSecondaryExpanded}\n isHidden={isCollapsed}\n onClick={handleSecondaryClick}\n onMouseEnter={handleSecondaryMouseEnter}\n onMouseLeave={handleSecondaryMouseLeave}\n showLabel={isSecondaryLabelVisible}\n shouldUseContentWidth={shouldUseContentWidth}\n height={height}\n />\n </>\n )}\n </StyledMultiActionButton>\n );\n};\n\nMultiActionButton.displayName = 'MultiActionButton';\n\nexport default MultiActionButton;\n"],"mappings":"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","ignoreList":[]}
|