@chayns-components/core 5.0.0-beta.878 → 5.0.0-beta.880

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.
@@ -28,14 +28,17 @@ const ComboBox = ({
28
28
  selectedItem,
29
29
  shouldShowBigImage,
30
30
  shouldShowRoundImage,
31
+ onInputFocus,
31
32
  shouldUseFullWidth = false,
32
33
  onInputChange,
34
+ shouldUseCurrentItemWidth = false,
33
35
  onInputBlur,
34
36
  inputValue
35
37
  }) => {
36
38
  const [internalSelectedItem, setInternalSelectedItem] = (0, _react.useState)();
37
39
  const [isAnimating, setIsAnimating] = (0, _react.useState)(false);
38
40
  const [minWidth, setMinWidth] = (0, _react.useState)(0);
41
+ const [bodyMinWidth, setBodyMinWidth] = (0, _react.useState)(0);
39
42
  const [focusedIndex, setFocusedIndex] = (0, _react.useState)(null);
40
43
  const [overflowY, setOverflowY] = (0, _react.useState)('hidden');
41
44
  const [portal, setPortal] = (0, _react.useState)();
@@ -160,22 +163,40 @@ const ComboBox = ({
160
163
  (0, _react.useEffect)(() => {
161
164
  var _styledComboBoxElemen;
162
165
  const allItems = lists.flatMap(list => list.list);
163
- const isAtLeastOneItemWithImageGiven = allItems.some(({
166
+ const hasImage = allItems.some(({
164
167
  imageUrl
165
168
  }) => imageUrl);
166
- const isAtLeastOneItemWithIconGiven = allItems.some(({
169
+ const hasIcon = allItems.some(({
167
170
  icons
168
171
  }) => icons);
169
- const width = ((_styledComboBoxElemen = styledComboBoxElementRef.current) === null || _styledComboBoxElemen === void 0 || (_styledComboBoxElemen = _styledComboBoxElemen.parentElement) === null || _styledComboBoxElemen === void 0 ? void 0 : _styledComboBoxElemen.getBoundingClientRect().width) ?? 0;
172
+ const parentWidth = ((_styledComboBoxElemen = styledComboBoxElementRef.current) === null || _styledComboBoxElemen === void 0 || (_styledComboBoxElemen = _styledComboBoxElemen.parentElement) === null || _styledComboBoxElemen === void 0 ? void 0 : _styledComboBoxElemen.getBoundingClientRect().width) ?? 0;
173
+ const paddingWidth = 45; // padding + border + arrow icon
174
+ const imageWidth = hasImage ? 32 : 0; // image width + gap if images present
175
+ const iconWidth = hasIcon ? 40 : 0; // icon width + gap if icons present
170
176
 
171
- // 45px = padding left + padding right + border left + border right + arrow icon width + arrow icon margin left
172
- // 32px = image width + flex gap
173
- // 40px = icon width + flex gap
174
- setMinWidth(shouldUseFullWidth ? width : (0, _calculate.calculateContentWidth)([...allItems, {
177
+ const baseWidth = (0, _calculate.calculateContentWidth)([...allItems, {
175
178
  text: placeholder,
176
179
  value: 'placeholder'
177
- }]) + 45 + (isAtLeastOneItemWithImageGiven ? 32 : 0) + (isAtLeastOneItemWithIconGiven ? 40 : 0));
178
- }, [lists, maxHeight, placeholder, shouldUseFullWidth]);
180
+ }]);
181
+ const calculatedWidth = baseWidth + paddingWidth + imageWidth + iconWidth;
182
+ let tmpMinWidth = calculatedWidth;
183
+ let tmpBodyMinWidth = calculatedWidth;
184
+
185
+ // Full width settings
186
+ if (shouldUseFullWidth) {
187
+ tmpMinWidth = parentWidth;
188
+ tmpBodyMinWidth = calculatedWidth > parentWidth ? calculatedWidth : parentWidth;
189
+ }
190
+
191
+ // Current item width settings
192
+ else if (shouldUseCurrentItemWidth && internalSelectedItem) {
193
+ const itemWidth = (0, _calculate.calculateContentWidth)([internalSelectedItem]) + paddingWidth + imageWidth + iconWidth;
194
+ tmpMinWidth = itemWidth;
195
+ tmpBodyMinWidth = itemWidth < calculatedWidth ? calculatedWidth : itemWidth;
196
+ }
197
+ setMinWidth(tmpMinWidth);
198
+ setBodyMinWidth(tmpBodyMinWidth);
199
+ }, [lists, placeholder, shouldUseFullWidth, shouldUseCurrentItemWidth, internalSelectedItem]);
179
200
 
180
201
  /**
181
202
  * This function sets the external selected item
@@ -284,7 +305,7 @@ const ComboBox = ({
284
305
  opacity: 0
285
306
  },
286
307
  $maxHeight: maxHeight,
287
- $minWidth: minWidth,
308
+ $minWidth: bodyMinWidth,
288
309
  style: bodyStyles,
289
310
  $direction: direction,
290
311
  transition: {
@@ -293,7 +314,7 @@ const ComboBox = ({
293
314
  tabIndex: 0,
294
315
  ref: contentRef
295
316
  }, comboBoxGroups)), container));
296
- }, [bodyStyles, browser === null || browser === void 0 ? void 0 : browser.name, comboBoxGroups, container, direction, isAnimating, maxHeight, minWidth, overflowY]);
317
+ }, [bodyMinWidth, bodyStyles, browser === null || browser === void 0 ? void 0 : browser.name, comboBoxGroups, container, direction, isAnimating, maxHeight, minWidth, overflowY]);
297
318
  return (0, _react.useMemo)(() => /*#__PURE__*/_react.default.createElement(_ComboBox.StyledComboBox, {
298
319
  ref: styledComboBoxElementRef,
299
320
  $shouldUseFullWidth: shouldUseFullWidth,
@@ -309,6 +330,7 @@ const ComboBox = ({
309
330
  value: inputValue,
310
331
  onChange: onInputChange,
311
332
  onBlur: onInputBlur,
333
+ onFocus: onInputFocus,
312
334
  placeholder: placeholderText
313
335
  }) : /*#__PURE__*/_react.default.createElement(_ComboBox.StyledComboBoxPlaceholder, {
314
336
  $shouldReduceOpacity: !selectedItem && !internalSelectedItem
@@ -319,7 +341,7 @@ const ComboBox = ({
319
341
  icons: placeholderIcon
320
342
  }), placeholderText, internalSelectedItem && internalSelectedItem.suffixElement && internalSelectedItem.suffixElement), /*#__PURE__*/_react.default.createElement(_ComboBox.StyledComboBoxIconWrapper, null, /*#__PURE__*/_react.default.createElement(_Icon.default, {
321
343
  icons: ['fa fa-chevron-down']
322
- }))), portal), [shouldUseFullWidth, minWidth, direction, handleHeaderClick, isAnimating, isTouch, isDisabled, inputValue, onInputChange, onInputBlur, placeholderText, selectedItem, internalSelectedItem, placeholderImageUrl, shouldShowRoundImage, placeholderIcon, portal]);
344
+ }))), portal), [shouldUseFullWidth, minWidth, direction, handleHeaderClick, isAnimating, isTouch, isDisabled, inputValue, onInputChange, onInputBlur, onInputFocus, placeholderText, selectedItem, internalSelectedItem, placeholderImageUrl, shouldShowRoundImage, placeholderIcon, portal]);
323
345
  };
324
346
  ComboBox.displayName = 'ComboBox';
325
347
  var _default = exports.default = ComboBox;
@@ -1 +1 @@
1
- {"version":3,"file":"ComboBox.js","names":["_chaynsApi","require","_framerMotion","_react","_interopRequireWildcard","_reactDom","_comboBox","_calculate","_environment","_Icon","_interopRequireDefault","_ComboBoxItem","_ComboBox","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ComboBox","direction","ComboBoxDirection","BOTTOM","isDisabled","lists","maxHeight","onSelect","placeholder","container","document","body","selectedItem","shouldShowBigImage","shouldShowRoundImage","shouldUseFullWidth","onInputChange","onInputBlur","inputValue","internalSelectedItem","setInternalSelectedItem","useState","isAnimating","setIsAnimating","minWidth","setMinWidth","focusedIndex","setFocusedIndex","overflowY","setOverflowY","portal","setPortal","internalCoordinates","setInternalCoordinates","x","y","styledComboBoxElementRef","useRef","contentRef","browser","useDevice","isTouch","getIsTouch","handleClick","useCallback","event","current","contains","target","handleOpen","left","comboBoxLeft","top","comboBoxTop","height","getBoundingClientRect","containerLeft","containerTop","scrollLeft","scrollTop","TOP","handleClose","useEffect","addEventListener","removeEventListener","handleSetSelectedItem","itemToSelect","currentContent","scrollHeight","maxHeightInPixels","getMaxHeightInPixels","handleKeyDown","key","_contentRef$current","preventDefault","children","length","newIndex","prevElement","tabIndex","newElement","focus","_contentRef$current2","element","id","newSelectedItem","some","list","find","value","String","replace","_styledComboBoxElemen","allItems","flatMap","isAtLeastOneItemWithImageGiven","imageUrl","isAtLeastOneItemWithIconGiven","icons","width","parentElement","calculateContentWidth","text","placeholderImageUrl","useMemo","undefined","placeholderIcon","placeholderText","handleHeaderClick","comboBoxGroups","map","groupName","createElement","StyledComboBoxTopic","item","isSelected","rightElement","subtext","suffixElement","bodyStyles","styles","transform","createPortal","AnimatePresence","initial","StyledMotionComboBoxBody","$browser","name","animate","opacity","$overflowY","exit","$maxHeight","$minWidth","style","$direction","transition","duration","ref","StyledComboBox","$shouldUseFullWidth","StyledComboBoxHeader","onClick","$isOpen","$isTouch","$isDisabled","StyledComboBoxInput","disabled","onChange","onBlur","StyledComboBoxPlaceholder","$shouldReduceOpacity","StyledComboBoxPlaceholderImage","src","StyledComboBoxIconWrapper","displayName","_default","exports"],"sources":["../../../../src/components/combobox/ComboBox.tsx"],"sourcesContent":["import { useDevice } from 'chayns-api';\nimport { AnimatePresence } from 'framer-motion';\nimport React, {\n FC,\n ReactPortal,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n type CSSProperties,\n type ReactNode,\n ChangeEventHandler,\n FocusEventHandler,\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport { ComboBoxDirection } from '../../types/comboBox';\nimport { calculateContentWidth, getMaxHeightInPixels } from '../../utils/calculate';\nimport { getIsTouch } from '../../utils/environment';\nimport type { ContextMenuCoordinates } from '../context-menu/ContextMenu';\nimport Icon from '../icon/Icon';\nimport ComboBoxItem from './combobox-item/ComboBoxItem';\nimport {\n StyledComboBox,\n StyledComboBoxHeader,\n StyledComboBoxIconWrapper,\n StyledComboBoxInput,\n StyledComboBoxPlaceholder,\n StyledComboBoxPlaceholderImage,\n StyledComboBoxTopic,\n StyledMotionComboBoxBody,\n} from './ComboBox.styles';\n\nexport interface IComboBoxItems {\n groupName?: string;\n list: Array<IComboBoxItem>;\n}\n\nexport interface IComboBoxItem {\n icons?: string[];\n imageUrl?: string;\n isDisabled?: boolean;\n rightElement?: ReactNode;\n subtext?: string;\n suffixElement?: ReactNode;\n text: string;\n value: string | number;\n}\n\nexport type ComboBoxProps = {\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?: ComboBoxDirection;\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?: CSSProperties['maxHeight'];\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 that should be executed when an item is selected.\n */\n onSelect?: (comboboxItem: IComboBoxItem) => void;\n /**\n * A text that should be displayed when no item is selected.\n */\n placeholder: 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, 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 parent or of the widest item.\n */\n shouldUseFullWidth?: boolean;\n};\n\nconst ComboBox: FC<ComboBoxProps> = ({\n direction = ComboBoxDirection.BOTTOM,\n isDisabled = false,\n lists,\n maxHeight = '280px',\n onSelect,\n placeholder,\n container = document.body,\n selectedItem,\n shouldShowBigImage,\n shouldShowRoundImage,\n shouldUseFullWidth = false,\n onInputChange,\n onInputBlur,\n inputValue,\n}) => {\n const [internalSelectedItem, setInternalSelectedItem] = useState<IComboBoxItem>();\n const [isAnimating, setIsAnimating] = useState(false);\n const [minWidth, setMinWidth] = useState(0);\n const [focusedIndex, setFocusedIndex] = useState<number | null>(null);\n const [overflowY, setOverflowY] = useState<CSSProperties['overflowY']>('hidden');\n const [portal, setPortal] = useState<ReactPortal>();\n const [internalCoordinates, setInternalCoordinates] = useState<ContextMenuCoordinates>({\n x: 0,\n y: 0,\n });\n\n const styledComboBoxElementRef = useRef<HTMLDivElement>(null);\n const contentRef = useRef<HTMLDivElement | null>(null);\n\n const { browser } = useDevice();\n\n const isTouch = getIsTouch();\n\n const handleClick = useCallback(\n (event: MouseEvent) => {\n if (\n styledComboBoxElementRef.current &&\n !styledComboBoxElementRef.current.contains(event.target as Node) &&\n contentRef.current &&\n !contentRef.current.contains(event.target as Node)\n ) {\n setIsAnimating(false);\n }\n },\n [styledComboBoxElementRef],\n );\n\n const handleOpen = useCallback(() => {\n if (styledComboBoxElementRef.current) {\n const {\n left: comboBoxLeft,\n top: comboBoxTop,\n height,\n } = styledComboBoxElementRef.current.getBoundingClientRect();\n const { left: containerLeft, top: containerTop } = container.getBoundingClientRect();\n\n const x = comboBoxLeft - containerLeft + container.scrollLeft;\n const y = comboBoxTop - containerTop + container.scrollTop;\n\n setInternalCoordinates({\n x,\n y: direction === ComboBoxDirection.TOP ? y : y + height,\n });\n\n setIsAnimating(true);\n }\n }, [container, direction]);\n\n const handleClose = useCallback(() => {\n setIsAnimating(false);\n }, []);\n\n /**\n * This function adds an event listener to the document to close the combobox when the user clicks outside of it\n */\n useEffect(() => {\n document.addEventListener('click', handleClick);\n\n return () => {\n document.removeEventListener('click', handleClick);\n };\n }, [handleClick, styledComboBoxElementRef]);\n\n /**\n * This function sets the selected item\n */\n const handleSetSelectedItem = useCallback(\n (itemToSelect: IComboBoxItem) => {\n setInternalSelectedItem(itemToSelect);\n setIsAnimating(false);\n\n if (onSelect) {\n onSelect(itemToSelect);\n }\n },\n [onSelect],\n );\n\n useEffect(() => {\n const currentContent = contentRef.current;\n\n if (portal && isAnimating && currentContent) {\n const scrollHeight = currentContent.scrollHeight ?? 0;\n\n const maxHeightInPixels = getMaxHeightInPixels(\n maxHeight,\n styledComboBoxElementRef.current ?? document.body,\n );\n\n setOverflowY(scrollHeight > maxHeightInPixels ? 'scroll' : 'hidden');\n }\n }, [isAnimating, maxHeight, portal]);\n\n useEffect(() => {\n const handleKeyDown = (e: KeyboardEvent) => {\n if (!isAnimating) {\n return;\n }\n\n if (e.key === 'ArrowUp' || e.key === 'ArrowDown') {\n e.preventDefault();\n const children = contentRef.current?.children;\n if (children && children.length > 0) {\n const newIndex =\n focusedIndex !== null\n ? (focusedIndex + (e.key === 'ArrowUp' ? -1 : 1) + children.length) %\n children.length\n : 0;\n\n if (focusedIndex !== null) {\n const prevElement = children[focusedIndex] as HTMLDivElement;\n prevElement.tabIndex = -1;\n }\n\n setFocusedIndex(newIndex);\n\n const newElement = children[newIndex] as HTMLDivElement;\n newElement.tabIndex = 0;\n newElement.focus();\n }\n } else if (e.key === 'Enter' && focusedIndex !== null) {\n const element = contentRef.current?.children[focusedIndex];\n\n if (!element) {\n return;\n }\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 return !!newSelectedItem;\n });\n\n if (!newSelectedItem) {\n return;\n }\n\n handleSetSelectedItem(newSelectedItem);\n }\n };\n\n document.addEventListener('keydown', handleKeyDown);\n\n return () => {\n document.removeEventListener('keydown', handleKeyDown);\n };\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 const isAtLeastOneItemWithImageGiven = allItems.some(({ imageUrl }) => imageUrl);\n const isAtLeastOneItemWithIconGiven = allItems.some(({ icons }) => icons);\n\n const width =\n styledComboBoxElementRef.current?.parentElement?.getBoundingClientRect().width ?? 0;\n\n // 45px = padding left + padding right + border left + border right + arrow icon width + arrow icon margin left\n // 32px = image width + flex gap\n // 40px = icon width + flex gap\n setMinWidth(\n shouldUseFullWidth\n ? width\n : calculateContentWidth([\n ...allItems,\n { text: placeholder, value: 'placeholder' },\n ]) +\n 45 +\n (isAtLeastOneItemWithImageGiven ? 32 : 0) +\n (isAtLeastOneItemWithIconGiven ? 40 : 0),\n );\n }, [lists, maxHeight, placeholder, shouldUseFullWidth]);\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 /**\n * This function opens the content of the combobox\n */\n const handleHeaderClick = useCallback(() => {\n if (!isDisabled) {\n if (isAnimating) {\n handleClose();\n } else {\n handleOpen();\n }\n }\n }, [handleClose, handleOpen, isAnimating, isDisabled]);\n\n const comboBoxGroups = useMemo(\n () =>\n lists.map(({ groupName, list }) => (\n <div key={groupName ?? 'default-group'}>\n {groupName && lists.length > 1 && (\n <StyledComboBoxTopic>{groupName}</StyledComboBoxTopic>\n )}\n {list.map((item) => (\n // ToDo: Cleanup this - item should be given as a prop to avoid full spreading\n <ComboBoxItem\n icons={item.icons}\n id={item.value}\n imageUrl={item.imageUrl}\n isDisabled={item.isDisabled}\n isSelected={selectedItem ? item.value === selectedItem.value : false}\n key={item.value}\n onSelect={handleSetSelectedItem}\n rightElement={item.rightElement}\n shouldShowBigImage={shouldShowBigImage}\n shouldShowRoundImage={shouldShowRoundImage}\n subtext={item.subtext}\n suffixElement={item.suffixElement}\n text={item.text}\n value={item.value}\n />\n ))}\n </div>\n )),\n [handleSetSelectedItem, lists, selectedItem, shouldShowBigImage, shouldShowRoundImage],\n );\n\n const bodyStyles = useMemo(() => {\n let styles: CSSProperties = { left: internalCoordinates.x, top: internalCoordinates.y };\n\n if (direction === ComboBoxDirection.TOP) {\n styles = { ...styles, transform: 'translateY(-100%)' };\n }\n\n return styles;\n }, [direction, internalCoordinates.x, internalCoordinates.y]);\n\n useEffect(() => {\n setPortal(() =>\n createPortal(\n <AnimatePresence initial={false}>\n {isAnimating && (\n <StyledMotionComboBoxBody\n $browser={browser?.name}\n animate={{ height: 'fit-content', opacity: 1 }}\n $overflowY={overflowY}\n initial={{ height: 0, opacity: 0 }}\n exit={{ height: 0, opacity: 0 }}\n $maxHeight={maxHeight}\n $minWidth={minWidth}\n style={bodyStyles}\n $direction={direction}\n transition={{ duration: 0.2 }}\n tabIndex={0}\n ref={contentRef}\n >\n {comboBoxGroups}\n </StyledMotionComboBoxBody>\n )}\n </AnimatePresence>,\n container,\n ),\n );\n }, [\n bodyStyles,\n browser?.name,\n comboBoxGroups,\n container,\n direction,\n isAnimating,\n maxHeight,\n minWidth,\n overflowY,\n ]);\n\n return useMemo(\n () => (\n <StyledComboBox\n ref={styledComboBoxElementRef}\n $shouldUseFullWidth={shouldUseFullWidth}\n $minWidth={minWidth}\n >\n <StyledComboBoxHeader\n $direction={direction}\n onClick={handleHeaderClick}\n $isOpen={isAnimating}\n $isTouch={isTouch}\n $isDisabled={isDisabled}\n >\n {typeof inputValue === 'string' ? (\n <StyledComboBoxInput\n disabled={isDisabled}\n value={inputValue}\n onChange={onInputChange}\n onBlur={onInputBlur}\n placeholder={placeholderText}\n />\n ) : (\n <StyledComboBoxPlaceholder\n $shouldReduceOpacity={!selectedItem && !internalSelectedItem}\n >\n {placeholderImageUrl && (\n <StyledComboBoxPlaceholderImage\n src={placeholderImageUrl}\n shouldShowRoundImage={shouldShowRoundImage}\n />\n )}\n {placeholderIcon && <Icon icons={placeholderIcon} />}\n {placeholderText}\n {internalSelectedItem &&\n internalSelectedItem.suffixElement &&\n internalSelectedItem.suffixElement}\n </StyledComboBoxPlaceholder>\n )}\n <StyledComboBoxIconWrapper>\n <Icon icons={['fa fa-chevron-down']} />\n </StyledComboBoxIconWrapper>\n </StyledComboBoxHeader>\n {portal}\n </StyledComboBox>\n ),\n [\n shouldUseFullWidth,\n minWidth,\n direction,\n handleHeaderClick,\n isAnimating,\n isTouch,\n isDisabled,\n inputValue,\n onInputChange,\n onInputBlur,\n placeholderText,\n selectedItem,\n internalSelectedItem,\n placeholderImageUrl,\n shouldShowRoundImage,\n placeholderIcon,\n portal,\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":["_chaynsApi","require","_framerMotion","_react","_interopRequireWildcard","_reactDom","_comboBox","_calculate","_environment","_Icon","_interopRequireDefault","_ComboBoxItem","_ComboBox","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ComboBox","direction","ComboBoxDirection","BOTTOM","isDisabled","lists","maxHeight","onSelect","placeholder","container","document","body","selectedItem","shouldShowBigImage","shouldShowRoundImage","onInputFocus","shouldUseFullWidth","onInputChange","shouldUseCurrentItemWidth","onInputBlur","inputValue","internalSelectedItem","setInternalSelectedItem","useState","isAnimating","setIsAnimating","minWidth","setMinWidth","bodyMinWidth","setBodyMinWidth","focusedIndex","setFocusedIndex","overflowY","setOverflowY","portal","setPortal","internalCoordinates","setInternalCoordinates","x","y","styledComboBoxElementRef","useRef","contentRef","browser","useDevice","isTouch","getIsTouch","handleClick","useCallback","event","current","contains","target","handleOpen","left","comboBoxLeft","top","comboBoxTop","height","getBoundingClientRect","containerLeft","containerTop","scrollLeft","scrollTop","TOP","handleClose","useEffect","addEventListener","removeEventListener","handleSetSelectedItem","itemToSelect","currentContent","scrollHeight","maxHeightInPixels","getMaxHeightInPixels","handleKeyDown","key","_contentRef$current","preventDefault","children","length","newIndex","prevElement","tabIndex","newElement","focus","_contentRef$current2","element","id","newSelectedItem","some","list","find","value","String","replace","_styledComboBoxElemen","allItems","flatMap","hasImage","imageUrl","hasIcon","icons","parentWidth","parentElement","width","paddingWidth","imageWidth","iconWidth","baseWidth","calculateContentWidth","text","calculatedWidth","tmpMinWidth","tmpBodyMinWidth","itemWidth","placeholderImageUrl","useMemo","undefined","placeholderIcon","placeholderText","handleHeaderClick","comboBoxGroups","map","groupName","createElement","StyledComboBoxTopic","item","isSelected","rightElement","subtext","suffixElement","bodyStyles","styles","transform","createPortal","AnimatePresence","initial","StyledMotionComboBoxBody","$browser","name","animate","opacity","$overflowY","exit","$maxHeight","$minWidth","style","$direction","transition","duration","ref","StyledComboBox","$shouldUseFullWidth","StyledComboBoxHeader","onClick","$isOpen","$isTouch","$isDisabled","StyledComboBoxInput","disabled","onChange","onBlur","onFocus","StyledComboBoxPlaceholder","$shouldReduceOpacity","StyledComboBoxPlaceholderImage","src","StyledComboBoxIconWrapper","displayName","_default","exports"],"sources":["../../../../src/components/combobox/ComboBox.tsx"],"sourcesContent":["import { useDevice } from 'chayns-api';\nimport { AnimatePresence } from 'framer-motion';\nimport React, {\n FC,\n ReactPortal,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n type CSSProperties,\n type ReactNode,\n ChangeEventHandler,\n FocusEventHandler,\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport { ComboBoxDirection } from '../../types/comboBox';\nimport { calculateContentWidth, getMaxHeightInPixels } from '../../utils/calculate';\nimport { getIsTouch } from '../../utils/environment';\nimport type { ContextMenuCoordinates } from '../context-menu/ContextMenu';\nimport Icon from '../icon/Icon';\nimport ComboBoxItem from './combobox-item/ComboBoxItem';\nimport {\n StyledComboBox,\n StyledComboBoxHeader,\n StyledComboBoxIconWrapper,\n StyledComboBoxInput,\n StyledComboBoxPlaceholder,\n StyledComboBoxPlaceholderImage,\n StyledComboBoxTopic,\n StyledMotionComboBoxBody,\n} from './ComboBox.styles';\n\nexport interface IComboBoxItems {\n groupName?: string;\n list: Array<IComboBoxItem>;\n}\n\nexport interface IComboBoxItem {\n icons?: string[];\n imageUrl?: string;\n isDisabled?: boolean;\n rightElement?: ReactNode;\n subtext?: string;\n suffixElement?: ReactNode;\n text: string;\n value: string | number;\n}\n\nexport type ComboBoxProps = {\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?: ComboBoxDirection;\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?: CSSProperties['maxHeight'];\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 * 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.\n */\n onSelect?: (comboboxItem: IComboBoxItem) => void;\n /**\n * A text that should be displayed when no item is selected.\n */\n placeholder: 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, 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\nconst ComboBox: FC<ComboBoxProps> = ({\n direction = ComboBoxDirection.BOTTOM,\n isDisabled = false,\n lists,\n maxHeight = '280px',\n onSelect,\n placeholder,\n container = document.body,\n selectedItem,\n shouldShowBigImage,\n shouldShowRoundImage,\n onInputFocus,\n shouldUseFullWidth = false,\n onInputChange,\n shouldUseCurrentItemWidth = false,\n onInputBlur,\n inputValue,\n}) => {\n const [internalSelectedItem, setInternalSelectedItem] = useState<IComboBoxItem>();\n const [isAnimating, setIsAnimating] = useState(false);\n const [minWidth, setMinWidth] = useState(0);\n const [bodyMinWidth, setBodyMinWidth] = useState(0);\n const [focusedIndex, setFocusedIndex] = useState<number | null>(null);\n const [overflowY, setOverflowY] = useState<CSSProperties['overflowY']>('hidden');\n const [portal, setPortal] = useState<ReactPortal>();\n const [internalCoordinates, setInternalCoordinates] = useState<ContextMenuCoordinates>({\n x: 0,\n y: 0,\n });\n\n const styledComboBoxElementRef = useRef<HTMLDivElement>(null);\n const contentRef = useRef<HTMLDivElement | null>(null);\n\n const { browser } = useDevice();\n\n const isTouch = getIsTouch();\n\n const handleClick = useCallback(\n (event: MouseEvent) => {\n if (\n styledComboBoxElementRef.current &&\n !styledComboBoxElementRef.current.contains(event.target as Node) &&\n contentRef.current &&\n !contentRef.current.contains(event.target as Node)\n ) {\n setIsAnimating(false);\n }\n },\n [styledComboBoxElementRef],\n );\n\n const handleOpen = useCallback(() => {\n if (styledComboBoxElementRef.current) {\n const {\n left: comboBoxLeft,\n top: comboBoxTop,\n height,\n } = styledComboBoxElementRef.current.getBoundingClientRect();\n const { left: containerLeft, top: containerTop } = container.getBoundingClientRect();\n\n const x = comboBoxLeft - containerLeft + container.scrollLeft;\n const y = comboBoxTop - containerTop + container.scrollTop;\n\n setInternalCoordinates({\n x,\n y: direction === ComboBoxDirection.TOP ? y : y + height,\n });\n\n setIsAnimating(true);\n }\n }, [container, direction]);\n\n const handleClose = useCallback(() => {\n setIsAnimating(false);\n }, []);\n\n /**\n * This function adds an event listener to the document to close the combobox when the user clicks outside of it\n */\n useEffect(() => {\n document.addEventListener('click', handleClick);\n\n return () => {\n document.removeEventListener('click', handleClick);\n };\n }, [handleClick, styledComboBoxElementRef]);\n\n /**\n * This function sets the selected item\n */\n const handleSetSelectedItem = useCallback(\n (itemToSelect: IComboBoxItem) => {\n setInternalSelectedItem(itemToSelect);\n setIsAnimating(false);\n\n if (onSelect) {\n onSelect(itemToSelect);\n }\n },\n [onSelect],\n );\n\n useEffect(() => {\n const currentContent = contentRef.current;\n\n if (portal && isAnimating && currentContent) {\n const scrollHeight = currentContent.scrollHeight ?? 0;\n\n const maxHeightInPixels = getMaxHeightInPixels(\n maxHeight,\n styledComboBoxElementRef.current ?? document.body,\n );\n\n setOverflowY(scrollHeight > maxHeightInPixels ? 'scroll' : 'hidden');\n }\n }, [isAnimating, maxHeight, portal]);\n\n useEffect(() => {\n const handleKeyDown = (e: KeyboardEvent) => {\n if (!isAnimating) {\n return;\n }\n\n if (e.key === 'ArrowUp' || e.key === 'ArrowDown') {\n e.preventDefault();\n const children = contentRef.current?.children;\n if (children && children.length > 0) {\n const newIndex =\n focusedIndex !== null\n ? (focusedIndex + (e.key === 'ArrowUp' ? -1 : 1) + children.length) %\n children.length\n : 0;\n\n if (focusedIndex !== null) {\n const prevElement = children[focusedIndex] as HTMLDivElement;\n prevElement.tabIndex = -1;\n }\n\n setFocusedIndex(newIndex);\n\n const newElement = children[newIndex] as HTMLDivElement;\n newElement.tabIndex = 0;\n newElement.focus();\n }\n } else if (e.key === 'Enter' && focusedIndex !== null) {\n const element = contentRef.current?.children[focusedIndex];\n\n if (!element) {\n return;\n }\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 return !!newSelectedItem;\n });\n\n if (!newSelectedItem) {\n return;\n }\n\n handleSetSelectedItem(newSelectedItem);\n }\n };\n\n document.addEventListener('keydown', handleKeyDown);\n\n return () => {\n document.removeEventListener('keydown', handleKeyDown);\n };\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 const hasImage = allItems.some(({ imageUrl }) => imageUrl);\n const hasIcon = allItems.some(({ icons }) => icons);\n\n const parentWidth =\n styledComboBoxElementRef.current?.parentElement?.getBoundingClientRect().width ?? 0;\n\n const paddingWidth = 45; // padding + border + arrow 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 const baseWidth = calculateContentWidth([\n ...allItems,\n { text: placeholder, value: 'placeholder' },\n ]);\n const calculatedWidth = baseWidth + paddingWidth + imageWidth + iconWidth;\n\n let tmpMinWidth = calculatedWidth;\n let tmpBodyMinWidth = calculatedWidth;\n\n // Full width settings\n if (shouldUseFullWidth) {\n tmpMinWidth = parentWidth;\n tmpBodyMinWidth = calculatedWidth > parentWidth ? calculatedWidth : parentWidth;\n }\n\n // Current item width settings\n else if (shouldUseCurrentItemWidth && internalSelectedItem) {\n const itemWidth =\n calculateContentWidth([internalSelectedItem]) +\n paddingWidth +\n imageWidth +\n iconWidth;\n\n tmpMinWidth = itemWidth;\n\n tmpBodyMinWidth = itemWidth < calculatedWidth ? calculatedWidth : itemWidth;\n }\n\n setMinWidth(tmpMinWidth);\n setBodyMinWidth(tmpBodyMinWidth);\n }, [lists, placeholder, shouldUseFullWidth, shouldUseCurrentItemWidth, internalSelectedItem]);\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 /**\n * This function opens the content of the combobox\n */\n const handleHeaderClick = useCallback(() => {\n if (!isDisabled) {\n if (isAnimating) {\n handleClose();\n } else {\n handleOpen();\n }\n }\n }, [handleClose, handleOpen, isAnimating, isDisabled]);\n\n const comboBoxGroups = useMemo(\n () =>\n lists.map(({ groupName, list }) => (\n <div key={groupName ?? 'default-group'}>\n {groupName && lists.length > 1 && (\n <StyledComboBoxTopic>{groupName}</StyledComboBoxTopic>\n )}\n {list.map((item) => (\n // ToDo: Cleanup this - item should be given as a prop to avoid full spreading\n <ComboBoxItem\n icons={item.icons}\n id={item.value}\n imageUrl={item.imageUrl}\n isDisabled={item.isDisabled}\n isSelected={selectedItem ? item.value === selectedItem.value : false}\n key={item.value}\n onSelect={handleSetSelectedItem}\n rightElement={item.rightElement}\n shouldShowBigImage={shouldShowBigImage}\n shouldShowRoundImage={shouldShowRoundImage}\n subtext={item.subtext}\n suffixElement={item.suffixElement}\n text={item.text}\n value={item.value}\n />\n ))}\n </div>\n )),\n [handleSetSelectedItem, lists, selectedItem, shouldShowBigImage, shouldShowRoundImage],\n );\n\n const bodyStyles = useMemo(() => {\n let styles: CSSProperties = { left: internalCoordinates.x, top: internalCoordinates.y };\n\n if (direction === ComboBoxDirection.TOP) {\n styles = { ...styles, transform: 'translateY(-100%)' };\n }\n\n return styles;\n }, [direction, internalCoordinates.x, internalCoordinates.y]);\n\n useEffect(() => {\n setPortal(() =>\n createPortal(\n <AnimatePresence initial={false}>\n {isAnimating && (\n <StyledMotionComboBoxBody\n $browser={browser?.name}\n animate={{ height: 'fit-content', opacity: 1 }}\n $overflowY={overflowY}\n initial={{ height: 0, opacity: 0 }}\n exit={{ height: 0, opacity: 0 }}\n $maxHeight={maxHeight}\n $minWidth={bodyMinWidth}\n style={bodyStyles}\n $direction={direction}\n transition={{ duration: 0.2 }}\n tabIndex={0}\n ref={contentRef}\n >\n {comboBoxGroups}\n </StyledMotionComboBoxBody>\n )}\n </AnimatePresence>,\n container,\n ),\n );\n }, [\n bodyMinWidth,\n bodyStyles,\n browser?.name,\n comboBoxGroups,\n container,\n direction,\n isAnimating,\n maxHeight,\n minWidth,\n overflowY,\n ]);\n\n return useMemo(\n () => (\n <StyledComboBox\n ref={styledComboBoxElementRef}\n $shouldUseFullWidth={shouldUseFullWidth}\n $minWidth={minWidth}\n >\n <StyledComboBoxHeader\n $direction={direction}\n onClick={handleHeaderClick}\n $isOpen={isAnimating}\n $isTouch={isTouch}\n $isDisabled={isDisabled}\n >\n {typeof inputValue === 'string' ? (\n <StyledComboBoxInput\n disabled={isDisabled}\n value={inputValue}\n onChange={onInputChange}\n onBlur={onInputBlur}\n onFocus={onInputFocus}\n placeholder={placeholderText}\n />\n ) : (\n <StyledComboBoxPlaceholder\n $shouldReduceOpacity={!selectedItem && !internalSelectedItem}\n >\n {placeholderImageUrl && (\n <StyledComboBoxPlaceholderImage\n src={placeholderImageUrl}\n shouldShowRoundImage={shouldShowRoundImage}\n />\n )}\n {placeholderIcon && <Icon icons={placeholderIcon} />}\n {placeholderText}\n {internalSelectedItem &&\n internalSelectedItem.suffixElement &&\n internalSelectedItem.suffixElement}\n </StyledComboBoxPlaceholder>\n )}\n <StyledComboBoxIconWrapper>\n <Icon icons={['fa fa-chevron-down']} />\n </StyledComboBoxIconWrapper>\n </StyledComboBoxHeader>\n {portal}\n </StyledComboBox>\n ),\n [\n shouldUseFullWidth,\n minWidth,\n direction,\n handleHeaderClick,\n isAnimating,\n isTouch,\n isDisabled,\n inputValue,\n onInputChange,\n onInputBlur,\n onInputFocus,\n placeholderText,\n selectedItem,\n internalSelectedItem,\n placeholderImageUrl,\n shouldShowRoundImage,\n placeholderIcon,\n portal,\n ],\n );\n};\n\nComboBox.displayName = 'ComboBox';\n\nexport default ComboBox;\n"],"mappings":"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","ignoreList":[]}
@@ -20,14 +20,17 @@ const ComboBox = _ref => {
20
20
  selectedItem,
21
21
  shouldShowBigImage,
22
22
  shouldShowRoundImage,
23
+ onInputFocus,
23
24
  shouldUseFullWidth = false,
24
25
  onInputChange,
26
+ shouldUseCurrentItemWidth = false,
25
27
  onInputBlur,
26
28
  inputValue
27
29
  } = _ref;
28
30
  const [internalSelectedItem, setInternalSelectedItem] = useState();
29
31
  const [isAnimating, setIsAnimating] = useState(false);
30
32
  const [minWidth, setMinWidth] = useState(0);
33
+ const [bodyMinWidth, setBodyMinWidth] = useState(0);
31
34
  const [focusedIndex, setFocusedIndex] = useState(null);
32
35
  const [overflowY, setOverflowY] = useState('hidden');
33
36
  const [portal, setPortal] = useState();
@@ -152,28 +155,46 @@ const ComboBox = _ref => {
152
155
  */
153
156
  useEffect(() => {
154
157
  const allItems = lists.flatMap(list => list.list);
155
- const isAtLeastOneItemWithImageGiven = allItems.some(_ref3 => {
158
+ const hasImage = allItems.some(_ref3 => {
156
159
  let {
157
160
  imageUrl
158
161
  } = _ref3;
159
162
  return imageUrl;
160
163
  });
161
- const isAtLeastOneItemWithIconGiven = allItems.some(_ref4 => {
164
+ const hasIcon = allItems.some(_ref4 => {
162
165
  let {
163
166
  icons
164
167
  } = _ref4;
165
168
  return icons;
166
169
  });
167
- const width = styledComboBoxElementRef.current?.parentElement?.getBoundingClientRect().width ?? 0;
170
+ const parentWidth = styledComboBoxElementRef.current?.parentElement?.getBoundingClientRect().width ?? 0;
171
+ const paddingWidth = 45; // padding + border + arrow icon
172
+ const imageWidth = hasImage ? 32 : 0; // image width + gap if images present
173
+ const iconWidth = hasIcon ? 40 : 0; // icon width + gap if icons present
168
174
 
169
- // 45px = padding left + padding right + border left + border right + arrow icon width + arrow icon margin left
170
- // 32px = image width + flex gap
171
- // 40px = icon width + flex gap
172
- setMinWidth(shouldUseFullWidth ? width : calculateContentWidth([...allItems, {
175
+ const baseWidth = calculateContentWidth([...allItems, {
173
176
  text: placeholder,
174
177
  value: 'placeholder'
175
- }]) + 45 + (isAtLeastOneItemWithImageGiven ? 32 : 0) + (isAtLeastOneItemWithIconGiven ? 40 : 0));
176
- }, [lists, maxHeight, placeholder, shouldUseFullWidth]);
178
+ }]);
179
+ const calculatedWidth = baseWidth + paddingWidth + imageWidth + iconWidth;
180
+ let tmpMinWidth = calculatedWidth;
181
+ let tmpBodyMinWidth = calculatedWidth;
182
+
183
+ // Full width settings
184
+ if (shouldUseFullWidth) {
185
+ tmpMinWidth = parentWidth;
186
+ tmpBodyMinWidth = calculatedWidth > parentWidth ? calculatedWidth : parentWidth;
187
+ }
188
+
189
+ // Current item width settings
190
+ else if (shouldUseCurrentItemWidth && internalSelectedItem) {
191
+ const itemWidth = calculateContentWidth([internalSelectedItem]) + paddingWidth + imageWidth + iconWidth;
192
+ tmpMinWidth = itemWidth;
193
+ tmpBodyMinWidth = itemWidth < calculatedWidth ? calculatedWidth : itemWidth;
194
+ }
195
+ setMinWidth(tmpMinWidth);
196
+ setBodyMinWidth(tmpBodyMinWidth);
197
+ }, [lists, placeholder, shouldUseFullWidth, shouldUseCurrentItemWidth, internalSelectedItem]);
177
198
 
178
199
  /**
179
200
  * This function sets the external selected item
@@ -285,7 +306,7 @@ const ComboBox = _ref => {
285
306
  opacity: 0
286
307
  },
287
308
  $maxHeight: maxHeight,
288
- $minWidth: minWidth,
309
+ $minWidth: bodyMinWidth,
289
310
  style: bodyStyles,
290
311
  $direction: direction,
291
312
  transition: {
@@ -294,7 +315,7 @@ const ComboBox = _ref => {
294
315
  tabIndex: 0,
295
316
  ref: contentRef
296
317
  }, comboBoxGroups)), container));
297
- }, [bodyStyles, browser?.name, comboBoxGroups, container, direction, isAnimating, maxHeight, minWidth, overflowY]);
318
+ }, [bodyMinWidth, bodyStyles, browser?.name, comboBoxGroups, container, direction, isAnimating, maxHeight, minWidth, overflowY]);
298
319
  return useMemo(() => /*#__PURE__*/React.createElement(StyledComboBox, {
299
320
  ref: styledComboBoxElementRef,
300
321
  $shouldUseFullWidth: shouldUseFullWidth,
@@ -310,6 +331,7 @@ const ComboBox = _ref => {
310
331
  value: inputValue,
311
332
  onChange: onInputChange,
312
333
  onBlur: onInputBlur,
334
+ onFocus: onInputFocus,
313
335
  placeholder: placeholderText
314
336
  }) : /*#__PURE__*/React.createElement(StyledComboBoxPlaceholder, {
315
337
  $shouldReduceOpacity: !selectedItem && !internalSelectedItem
@@ -320,7 +342,7 @@ const ComboBox = _ref => {
320
342
  icons: placeholderIcon
321
343
  }), placeholderText, internalSelectedItem && internalSelectedItem.suffixElement && internalSelectedItem.suffixElement), /*#__PURE__*/React.createElement(StyledComboBoxIconWrapper, null, /*#__PURE__*/React.createElement(Icon, {
322
344
  icons: ['fa fa-chevron-down']
323
- }))), portal), [shouldUseFullWidth, minWidth, direction, handleHeaderClick, isAnimating, isTouch, isDisabled, inputValue, onInputChange, onInputBlur, placeholderText, selectedItem, internalSelectedItem, placeholderImageUrl, shouldShowRoundImage, placeholderIcon, portal]);
345
+ }))), portal), [shouldUseFullWidth, minWidth, direction, handleHeaderClick, isAnimating, isTouch, isDisabled, inputValue, onInputChange, onInputBlur, onInputFocus, placeholderText, selectedItem, internalSelectedItem, placeholderImageUrl, shouldShowRoundImage, placeholderIcon, portal]);
324
346
  };
325
347
  ComboBox.displayName = 'ComboBox';
326
348
  export default ComboBox;
@@ -1 +1 @@
1
- {"version":3,"file":"ComboBox.js","names":["useDevice","AnimatePresence","React","useCallback","useEffect","useMemo","useRef","useState","createPortal","ComboBoxDirection","calculateContentWidth","getMaxHeightInPixels","getIsTouch","Icon","ComboBoxItem","StyledComboBox","StyledComboBoxHeader","StyledComboBoxIconWrapper","StyledComboBoxInput","StyledComboBoxPlaceholder","StyledComboBoxPlaceholderImage","StyledComboBoxTopic","StyledMotionComboBoxBody","ComboBox","_ref","direction","BOTTOM","isDisabled","lists","maxHeight","onSelect","placeholder","container","document","body","selectedItem","shouldShowBigImage","shouldShowRoundImage","shouldUseFullWidth","onInputChange","onInputBlur","inputValue","internalSelectedItem","setInternalSelectedItem","isAnimating","setIsAnimating","minWidth","setMinWidth","focusedIndex","setFocusedIndex","overflowY","setOverflowY","portal","setPortal","internalCoordinates","setInternalCoordinates","x","y","styledComboBoxElementRef","contentRef","browser","isTouch","handleClick","event","current","contains","target","handleOpen","left","comboBoxLeft","top","comboBoxTop","height","getBoundingClientRect","containerLeft","containerTop","scrollLeft","scrollTop","TOP","handleClose","addEventListener","removeEventListener","handleSetSelectedItem","itemToSelect","currentContent","scrollHeight","maxHeightInPixels","handleKeyDown","e","key","preventDefault","children","length","newIndex","prevElement","tabIndex","newElement","focus","element","id","newSelectedItem","some","list","find","_ref2","value","String","replace","allItems","flatMap","isAtLeastOneItemWithImageGiven","_ref3","imageUrl","isAtLeastOneItemWithIconGiven","_ref4","icons","width","parentElement","text","placeholderImageUrl","undefined","placeholderIcon","placeholderText","handleHeaderClick","comboBoxGroups","map","_ref5","groupName","createElement","item","isSelected","rightElement","subtext","suffixElement","bodyStyles","styles","transform","initial","$browser","name","animate","opacity","$overflowY","exit","$maxHeight","$minWidth","style","$direction","transition","duration","ref","$shouldUseFullWidth","onClick","$isOpen","$isTouch","$isDisabled","disabled","onChange","onBlur","$shouldReduceOpacity","src","displayName"],"sources":["../../../../src/components/combobox/ComboBox.tsx"],"sourcesContent":["import { useDevice } from 'chayns-api';\nimport { AnimatePresence } from 'framer-motion';\nimport React, {\n FC,\n ReactPortal,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n type CSSProperties,\n type ReactNode,\n ChangeEventHandler,\n FocusEventHandler,\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport { ComboBoxDirection } from '../../types/comboBox';\nimport { calculateContentWidth, getMaxHeightInPixels } from '../../utils/calculate';\nimport { getIsTouch } from '../../utils/environment';\nimport type { ContextMenuCoordinates } from '../context-menu/ContextMenu';\nimport Icon from '../icon/Icon';\nimport ComboBoxItem from './combobox-item/ComboBoxItem';\nimport {\n StyledComboBox,\n StyledComboBoxHeader,\n StyledComboBoxIconWrapper,\n StyledComboBoxInput,\n StyledComboBoxPlaceholder,\n StyledComboBoxPlaceholderImage,\n StyledComboBoxTopic,\n StyledMotionComboBoxBody,\n} from './ComboBox.styles';\n\nexport interface IComboBoxItems {\n groupName?: string;\n list: Array<IComboBoxItem>;\n}\n\nexport interface IComboBoxItem {\n icons?: string[];\n imageUrl?: string;\n isDisabled?: boolean;\n rightElement?: ReactNode;\n subtext?: string;\n suffixElement?: ReactNode;\n text: string;\n value: string | number;\n}\n\nexport type ComboBoxProps = {\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?: ComboBoxDirection;\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?: CSSProperties['maxHeight'];\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 that should be executed when an item is selected.\n */\n onSelect?: (comboboxItem: IComboBoxItem) => void;\n /**\n * A text that should be displayed when no item is selected.\n */\n placeholder: 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, 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 parent or of the widest item.\n */\n shouldUseFullWidth?: boolean;\n};\n\nconst ComboBox: FC<ComboBoxProps> = ({\n direction = ComboBoxDirection.BOTTOM,\n isDisabled = false,\n lists,\n maxHeight = '280px',\n onSelect,\n placeholder,\n container = document.body,\n selectedItem,\n shouldShowBigImage,\n shouldShowRoundImage,\n shouldUseFullWidth = false,\n onInputChange,\n onInputBlur,\n inputValue,\n}) => {\n const [internalSelectedItem, setInternalSelectedItem] = useState<IComboBoxItem>();\n const [isAnimating, setIsAnimating] = useState(false);\n const [minWidth, setMinWidth] = useState(0);\n const [focusedIndex, setFocusedIndex] = useState<number | null>(null);\n const [overflowY, setOverflowY] = useState<CSSProperties['overflowY']>('hidden');\n const [portal, setPortal] = useState<ReactPortal>();\n const [internalCoordinates, setInternalCoordinates] = useState<ContextMenuCoordinates>({\n x: 0,\n y: 0,\n });\n\n const styledComboBoxElementRef = useRef<HTMLDivElement>(null);\n const contentRef = useRef<HTMLDivElement | null>(null);\n\n const { browser } = useDevice();\n\n const isTouch = getIsTouch();\n\n const handleClick = useCallback(\n (event: MouseEvent) => {\n if (\n styledComboBoxElementRef.current &&\n !styledComboBoxElementRef.current.contains(event.target as Node) &&\n contentRef.current &&\n !contentRef.current.contains(event.target as Node)\n ) {\n setIsAnimating(false);\n }\n },\n [styledComboBoxElementRef],\n );\n\n const handleOpen = useCallback(() => {\n if (styledComboBoxElementRef.current) {\n const {\n left: comboBoxLeft,\n top: comboBoxTop,\n height,\n } = styledComboBoxElementRef.current.getBoundingClientRect();\n const { left: containerLeft, top: containerTop } = container.getBoundingClientRect();\n\n const x = comboBoxLeft - containerLeft + container.scrollLeft;\n const y = comboBoxTop - containerTop + container.scrollTop;\n\n setInternalCoordinates({\n x,\n y: direction === ComboBoxDirection.TOP ? y : y + height,\n });\n\n setIsAnimating(true);\n }\n }, [container, direction]);\n\n const handleClose = useCallback(() => {\n setIsAnimating(false);\n }, []);\n\n /**\n * This function adds an event listener to the document to close the combobox when the user clicks outside of it\n */\n useEffect(() => {\n document.addEventListener('click', handleClick);\n\n return () => {\n document.removeEventListener('click', handleClick);\n };\n }, [handleClick, styledComboBoxElementRef]);\n\n /**\n * This function sets the selected item\n */\n const handleSetSelectedItem = useCallback(\n (itemToSelect: IComboBoxItem) => {\n setInternalSelectedItem(itemToSelect);\n setIsAnimating(false);\n\n if (onSelect) {\n onSelect(itemToSelect);\n }\n },\n [onSelect],\n );\n\n useEffect(() => {\n const currentContent = contentRef.current;\n\n if (portal && isAnimating && currentContent) {\n const scrollHeight = currentContent.scrollHeight ?? 0;\n\n const maxHeightInPixels = getMaxHeightInPixels(\n maxHeight,\n styledComboBoxElementRef.current ?? document.body,\n );\n\n setOverflowY(scrollHeight > maxHeightInPixels ? 'scroll' : 'hidden');\n }\n }, [isAnimating, maxHeight, portal]);\n\n useEffect(() => {\n const handleKeyDown = (e: KeyboardEvent) => {\n if (!isAnimating) {\n return;\n }\n\n if (e.key === 'ArrowUp' || e.key === 'ArrowDown') {\n e.preventDefault();\n const children = contentRef.current?.children;\n if (children && children.length > 0) {\n const newIndex =\n focusedIndex !== null\n ? (focusedIndex + (e.key === 'ArrowUp' ? -1 : 1) + children.length) %\n children.length\n : 0;\n\n if (focusedIndex !== null) {\n const prevElement = children[focusedIndex] as HTMLDivElement;\n prevElement.tabIndex = -1;\n }\n\n setFocusedIndex(newIndex);\n\n const newElement = children[newIndex] as HTMLDivElement;\n newElement.tabIndex = 0;\n newElement.focus();\n }\n } else if (e.key === 'Enter' && focusedIndex !== null) {\n const element = contentRef.current?.children[focusedIndex];\n\n if (!element) {\n return;\n }\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 return !!newSelectedItem;\n });\n\n if (!newSelectedItem) {\n return;\n }\n\n handleSetSelectedItem(newSelectedItem);\n }\n };\n\n document.addEventListener('keydown', handleKeyDown);\n\n return () => {\n document.removeEventListener('keydown', handleKeyDown);\n };\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 const isAtLeastOneItemWithImageGiven = allItems.some(({ imageUrl }) => imageUrl);\n const isAtLeastOneItemWithIconGiven = allItems.some(({ icons }) => icons);\n\n const width =\n styledComboBoxElementRef.current?.parentElement?.getBoundingClientRect().width ?? 0;\n\n // 45px = padding left + padding right + border left + border right + arrow icon width + arrow icon margin left\n // 32px = image width + flex gap\n // 40px = icon width + flex gap\n setMinWidth(\n shouldUseFullWidth\n ? width\n : calculateContentWidth([\n ...allItems,\n { text: placeholder, value: 'placeholder' },\n ]) +\n 45 +\n (isAtLeastOneItemWithImageGiven ? 32 : 0) +\n (isAtLeastOneItemWithIconGiven ? 40 : 0),\n );\n }, [lists, maxHeight, placeholder, shouldUseFullWidth]);\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 /**\n * This function opens the content of the combobox\n */\n const handleHeaderClick = useCallback(() => {\n if (!isDisabled) {\n if (isAnimating) {\n handleClose();\n } else {\n handleOpen();\n }\n }\n }, [handleClose, handleOpen, isAnimating, isDisabled]);\n\n const comboBoxGroups = useMemo(\n () =>\n lists.map(({ groupName, list }) => (\n <div key={groupName ?? 'default-group'}>\n {groupName && lists.length > 1 && (\n <StyledComboBoxTopic>{groupName}</StyledComboBoxTopic>\n )}\n {list.map((item) => (\n // ToDo: Cleanup this - item should be given as a prop to avoid full spreading\n <ComboBoxItem\n icons={item.icons}\n id={item.value}\n imageUrl={item.imageUrl}\n isDisabled={item.isDisabled}\n isSelected={selectedItem ? item.value === selectedItem.value : false}\n key={item.value}\n onSelect={handleSetSelectedItem}\n rightElement={item.rightElement}\n shouldShowBigImage={shouldShowBigImage}\n shouldShowRoundImage={shouldShowRoundImage}\n subtext={item.subtext}\n suffixElement={item.suffixElement}\n text={item.text}\n value={item.value}\n />\n ))}\n </div>\n )),\n [handleSetSelectedItem, lists, selectedItem, shouldShowBigImage, shouldShowRoundImage],\n );\n\n const bodyStyles = useMemo(() => {\n let styles: CSSProperties = { left: internalCoordinates.x, top: internalCoordinates.y };\n\n if (direction === ComboBoxDirection.TOP) {\n styles = { ...styles, transform: 'translateY(-100%)' };\n }\n\n return styles;\n }, [direction, internalCoordinates.x, internalCoordinates.y]);\n\n useEffect(() => {\n setPortal(() =>\n createPortal(\n <AnimatePresence initial={false}>\n {isAnimating && (\n <StyledMotionComboBoxBody\n $browser={browser?.name}\n animate={{ height: 'fit-content', opacity: 1 }}\n $overflowY={overflowY}\n initial={{ height: 0, opacity: 0 }}\n exit={{ height: 0, opacity: 0 }}\n $maxHeight={maxHeight}\n $minWidth={minWidth}\n style={bodyStyles}\n $direction={direction}\n transition={{ duration: 0.2 }}\n tabIndex={0}\n ref={contentRef}\n >\n {comboBoxGroups}\n </StyledMotionComboBoxBody>\n )}\n </AnimatePresence>,\n container,\n ),\n );\n }, [\n bodyStyles,\n browser?.name,\n comboBoxGroups,\n container,\n direction,\n isAnimating,\n maxHeight,\n minWidth,\n overflowY,\n ]);\n\n return useMemo(\n () => (\n <StyledComboBox\n ref={styledComboBoxElementRef}\n $shouldUseFullWidth={shouldUseFullWidth}\n $minWidth={minWidth}\n >\n <StyledComboBoxHeader\n $direction={direction}\n onClick={handleHeaderClick}\n $isOpen={isAnimating}\n $isTouch={isTouch}\n $isDisabled={isDisabled}\n >\n {typeof inputValue === 'string' ? (\n <StyledComboBoxInput\n disabled={isDisabled}\n value={inputValue}\n onChange={onInputChange}\n onBlur={onInputBlur}\n placeholder={placeholderText}\n />\n ) : (\n <StyledComboBoxPlaceholder\n $shouldReduceOpacity={!selectedItem && !internalSelectedItem}\n >\n {placeholderImageUrl && (\n <StyledComboBoxPlaceholderImage\n src={placeholderImageUrl}\n shouldShowRoundImage={shouldShowRoundImage}\n />\n )}\n {placeholderIcon && <Icon icons={placeholderIcon} />}\n {placeholderText}\n {internalSelectedItem &&\n internalSelectedItem.suffixElement &&\n internalSelectedItem.suffixElement}\n </StyledComboBoxPlaceholder>\n )}\n <StyledComboBoxIconWrapper>\n <Icon icons={['fa fa-chevron-down']} />\n </StyledComboBoxIconWrapper>\n </StyledComboBoxHeader>\n {portal}\n </StyledComboBox>\n ),\n [\n shouldUseFullWidth,\n minWidth,\n direction,\n handleHeaderClick,\n isAnimating,\n isTouch,\n isDisabled,\n inputValue,\n onInputChange,\n onInputBlur,\n placeholderText,\n selectedItem,\n internalSelectedItem,\n placeholderImageUrl,\n shouldShowRoundImage,\n placeholderIcon,\n portal,\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","AnimatePresence","React","useCallback","useEffect","useMemo","useRef","useState","createPortal","ComboBoxDirection","calculateContentWidth","getMaxHeightInPixels","getIsTouch","Icon","ComboBoxItem","StyledComboBox","StyledComboBoxHeader","StyledComboBoxIconWrapper","StyledComboBoxInput","StyledComboBoxPlaceholder","StyledComboBoxPlaceholderImage","StyledComboBoxTopic","StyledMotionComboBoxBody","ComboBox","_ref","direction","BOTTOM","isDisabled","lists","maxHeight","onSelect","placeholder","container","document","body","selectedItem","shouldShowBigImage","shouldShowRoundImage","onInputFocus","shouldUseFullWidth","onInputChange","shouldUseCurrentItemWidth","onInputBlur","inputValue","internalSelectedItem","setInternalSelectedItem","isAnimating","setIsAnimating","minWidth","setMinWidth","bodyMinWidth","setBodyMinWidth","focusedIndex","setFocusedIndex","overflowY","setOverflowY","portal","setPortal","internalCoordinates","setInternalCoordinates","x","y","styledComboBoxElementRef","contentRef","browser","isTouch","handleClick","event","current","contains","target","handleOpen","left","comboBoxLeft","top","comboBoxTop","height","getBoundingClientRect","containerLeft","containerTop","scrollLeft","scrollTop","TOP","handleClose","addEventListener","removeEventListener","handleSetSelectedItem","itemToSelect","currentContent","scrollHeight","maxHeightInPixels","handleKeyDown","e","key","preventDefault","children","length","newIndex","prevElement","tabIndex","newElement","focus","element","id","newSelectedItem","some","list","find","_ref2","value","String","replace","allItems","flatMap","hasImage","_ref3","imageUrl","hasIcon","_ref4","icons","parentWidth","parentElement","width","paddingWidth","imageWidth","iconWidth","baseWidth","text","calculatedWidth","tmpMinWidth","tmpBodyMinWidth","itemWidth","placeholderImageUrl","undefined","placeholderIcon","placeholderText","handleHeaderClick","comboBoxGroups","map","_ref5","groupName","createElement","item","isSelected","rightElement","subtext","suffixElement","bodyStyles","styles","transform","initial","$browser","name","animate","opacity","$overflowY","exit","$maxHeight","$minWidth","style","$direction","transition","duration","ref","$shouldUseFullWidth","onClick","$isOpen","$isTouch","$isDisabled","disabled","onChange","onBlur","onFocus","$shouldReduceOpacity","src","displayName"],"sources":["../../../../src/components/combobox/ComboBox.tsx"],"sourcesContent":["import { useDevice } from 'chayns-api';\nimport { AnimatePresence } from 'framer-motion';\nimport React, {\n FC,\n ReactPortal,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n type CSSProperties,\n type ReactNode,\n ChangeEventHandler,\n FocusEventHandler,\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport { ComboBoxDirection } from '../../types/comboBox';\nimport { calculateContentWidth, getMaxHeightInPixels } from '../../utils/calculate';\nimport { getIsTouch } from '../../utils/environment';\nimport type { ContextMenuCoordinates } from '../context-menu/ContextMenu';\nimport Icon from '../icon/Icon';\nimport ComboBoxItem from './combobox-item/ComboBoxItem';\nimport {\n StyledComboBox,\n StyledComboBoxHeader,\n StyledComboBoxIconWrapper,\n StyledComboBoxInput,\n StyledComboBoxPlaceholder,\n StyledComboBoxPlaceholderImage,\n StyledComboBoxTopic,\n StyledMotionComboBoxBody,\n} from './ComboBox.styles';\n\nexport interface IComboBoxItems {\n groupName?: string;\n list: Array<IComboBoxItem>;\n}\n\nexport interface IComboBoxItem {\n icons?: string[];\n imageUrl?: string;\n isDisabled?: boolean;\n rightElement?: ReactNode;\n subtext?: string;\n suffixElement?: ReactNode;\n text: string;\n value: string | number;\n}\n\nexport type ComboBoxProps = {\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?: ComboBoxDirection;\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?: CSSProperties['maxHeight'];\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 * 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.\n */\n onSelect?: (comboboxItem: IComboBoxItem) => void;\n /**\n * A text that should be displayed when no item is selected.\n */\n placeholder: 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, 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\nconst ComboBox: FC<ComboBoxProps> = ({\n direction = ComboBoxDirection.BOTTOM,\n isDisabled = false,\n lists,\n maxHeight = '280px',\n onSelect,\n placeholder,\n container = document.body,\n selectedItem,\n shouldShowBigImage,\n shouldShowRoundImage,\n onInputFocus,\n shouldUseFullWidth = false,\n onInputChange,\n shouldUseCurrentItemWidth = false,\n onInputBlur,\n inputValue,\n}) => {\n const [internalSelectedItem, setInternalSelectedItem] = useState<IComboBoxItem>();\n const [isAnimating, setIsAnimating] = useState(false);\n const [minWidth, setMinWidth] = useState(0);\n const [bodyMinWidth, setBodyMinWidth] = useState(0);\n const [focusedIndex, setFocusedIndex] = useState<number | null>(null);\n const [overflowY, setOverflowY] = useState<CSSProperties['overflowY']>('hidden');\n const [portal, setPortal] = useState<ReactPortal>();\n const [internalCoordinates, setInternalCoordinates] = useState<ContextMenuCoordinates>({\n x: 0,\n y: 0,\n });\n\n const styledComboBoxElementRef = useRef<HTMLDivElement>(null);\n const contentRef = useRef<HTMLDivElement | null>(null);\n\n const { browser } = useDevice();\n\n const isTouch = getIsTouch();\n\n const handleClick = useCallback(\n (event: MouseEvent) => {\n if (\n styledComboBoxElementRef.current &&\n !styledComboBoxElementRef.current.contains(event.target as Node) &&\n contentRef.current &&\n !contentRef.current.contains(event.target as Node)\n ) {\n setIsAnimating(false);\n }\n },\n [styledComboBoxElementRef],\n );\n\n const handleOpen = useCallback(() => {\n if (styledComboBoxElementRef.current) {\n const {\n left: comboBoxLeft,\n top: comboBoxTop,\n height,\n } = styledComboBoxElementRef.current.getBoundingClientRect();\n const { left: containerLeft, top: containerTop } = container.getBoundingClientRect();\n\n const x = comboBoxLeft - containerLeft + container.scrollLeft;\n const y = comboBoxTop - containerTop + container.scrollTop;\n\n setInternalCoordinates({\n x,\n y: direction === ComboBoxDirection.TOP ? y : y + height,\n });\n\n setIsAnimating(true);\n }\n }, [container, direction]);\n\n const handleClose = useCallback(() => {\n setIsAnimating(false);\n }, []);\n\n /**\n * This function adds an event listener to the document to close the combobox when the user clicks outside of it\n */\n useEffect(() => {\n document.addEventListener('click', handleClick);\n\n return () => {\n document.removeEventListener('click', handleClick);\n };\n }, [handleClick, styledComboBoxElementRef]);\n\n /**\n * This function sets the selected item\n */\n const handleSetSelectedItem = useCallback(\n (itemToSelect: IComboBoxItem) => {\n setInternalSelectedItem(itemToSelect);\n setIsAnimating(false);\n\n if (onSelect) {\n onSelect(itemToSelect);\n }\n },\n [onSelect],\n );\n\n useEffect(() => {\n const currentContent = contentRef.current;\n\n if (portal && isAnimating && currentContent) {\n const scrollHeight = currentContent.scrollHeight ?? 0;\n\n const maxHeightInPixels = getMaxHeightInPixels(\n maxHeight,\n styledComboBoxElementRef.current ?? document.body,\n );\n\n setOverflowY(scrollHeight > maxHeightInPixels ? 'scroll' : 'hidden');\n }\n }, [isAnimating, maxHeight, portal]);\n\n useEffect(() => {\n const handleKeyDown = (e: KeyboardEvent) => {\n if (!isAnimating) {\n return;\n }\n\n if (e.key === 'ArrowUp' || e.key === 'ArrowDown') {\n e.preventDefault();\n const children = contentRef.current?.children;\n if (children && children.length > 0) {\n const newIndex =\n focusedIndex !== null\n ? (focusedIndex + (e.key === 'ArrowUp' ? -1 : 1) + children.length) %\n children.length\n : 0;\n\n if (focusedIndex !== null) {\n const prevElement = children[focusedIndex] as HTMLDivElement;\n prevElement.tabIndex = -1;\n }\n\n setFocusedIndex(newIndex);\n\n const newElement = children[newIndex] as HTMLDivElement;\n newElement.tabIndex = 0;\n newElement.focus();\n }\n } else if (e.key === 'Enter' && focusedIndex !== null) {\n const element = contentRef.current?.children[focusedIndex];\n\n if (!element) {\n return;\n }\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 return !!newSelectedItem;\n });\n\n if (!newSelectedItem) {\n return;\n }\n\n handleSetSelectedItem(newSelectedItem);\n }\n };\n\n document.addEventListener('keydown', handleKeyDown);\n\n return () => {\n document.removeEventListener('keydown', handleKeyDown);\n };\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 const hasImage = allItems.some(({ imageUrl }) => imageUrl);\n const hasIcon = allItems.some(({ icons }) => icons);\n\n const parentWidth =\n styledComboBoxElementRef.current?.parentElement?.getBoundingClientRect().width ?? 0;\n\n const paddingWidth = 45; // padding + border + arrow 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 const baseWidth = calculateContentWidth([\n ...allItems,\n { text: placeholder, value: 'placeholder' },\n ]);\n const calculatedWidth = baseWidth + paddingWidth + imageWidth + iconWidth;\n\n let tmpMinWidth = calculatedWidth;\n let tmpBodyMinWidth = calculatedWidth;\n\n // Full width settings\n if (shouldUseFullWidth) {\n tmpMinWidth = parentWidth;\n tmpBodyMinWidth = calculatedWidth > parentWidth ? calculatedWidth : parentWidth;\n }\n\n // Current item width settings\n else if (shouldUseCurrentItemWidth && internalSelectedItem) {\n const itemWidth =\n calculateContentWidth([internalSelectedItem]) +\n paddingWidth +\n imageWidth +\n iconWidth;\n\n tmpMinWidth = itemWidth;\n\n tmpBodyMinWidth = itemWidth < calculatedWidth ? calculatedWidth : itemWidth;\n }\n\n setMinWidth(tmpMinWidth);\n setBodyMinWidth(tmpBodyMinWidth);\n }, [lists, placeholder, shouldUseFullWidth, shouldUseCurrentItemWidth, internalSelectedItem]);\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 /**\n * This function opens the content of the combobox\n */\n const handleHeaderClick = useCallback(() => {\n if (!isDisabled) {\n if (isAnimating) {\n handleClose();\n } else {\n handleOpen();\n }\n }\n }, [handleClose, handleOpen, isAnimating, isDisabled]);\n\n const comboBoxGroups = useMemo(\n () =>\n lists.map(({ groupName, list }) => (\n <div key={groupName ?? 'default-group'}>\n {groupName && lists.length > 1 && (\n <StyledComboBoxTopic>{groupName}</StyledComboBoxTopic>\n )}\n {list.map((item) => (\n // ToDo: Cleanup this - item should be given as a prop to avoid full spreading\n <ComboBoxItem\n icons={item.icons}\n id={item.value}\n imageUrl={item.imageUrl}\n isDisabled={item.isDisabled}\n isSelected={selectedItem ? item.value === selectedItem.value : false}\n key={item.value}\n onSelect={handleSetSelectedItem}\n rightElement={item.rightElement}\n shouldShowBigImage={shouldShowBigImage}\n shouldShowRoundImage={shouldShowRoundImage}\n subtext={item.subtext}\n suffixElement={item.suffixElement}\n text={item.text}\n value={item.value}\n />\n ))}\n </div>\n )),\n [handleSetSelectedItem, lists, selectedItem, shouldShowBigImage, shouldShowRoundImage],\n );\n\n const bodyStyles = useMemo(() => {\n let styles: CSSProperties = { left: internalCoordinates.x, top: internalCoordinates.y };\n\n if (direction === ComboBoxDirection.TOP) {\n styles = { ...styles, transform: 'translateY(-100%)' };\n }\n\n return styles;\n }, [direction, internalCoordinates.x, internalCoordinates.y]);\n\n useEffect(() => {\n setPortal(() =>\n createPortal(\n <AnimatePresence initial={false}>\n {isAnimating && (\n <StyledMotionComboBoxBody\n $browser={browser?.name}\n animate={{ height: 'fit-content', opacity: 1 }}\n $overflowY={overflowY}\n initial={{ height: 0, opacity: 0 }}\n exit={{ height: 0, opacity: 0 }}\n $maxHeight={maxHeight}\n $minWidth={bodyMinWidth}\n style={bodyStyles}\n $direction={direction}\n transition={{ duration: 0.2 }}\n tabIndex={0}\n ref={contentRef}\n >\n {comboBoxGroups}\n </StyledMotionComboBoxBody>\n )}\n </AnimatePresence>,\n container,\n ),\n );\n }, [\n bodyMinWidth,\n bodyStyles,\n browser?.name,\n comboBoxGroups,\n container,\n direction,\n isAnimating,\n maxHeight,\n minWidth,\n overflowY,\n ]);\n\n return useMemo(\n () => (\n <StyledComboBox\n ref={styledComboBoxElementRef}\n $shouldUseFullWidth={shouldUseFullWidth}\n $minWidth={minWidth}\n >\n <StyledComboBoxHeader\n $direction={direction}\n onClick={handleHeaderClick}\n $isOpen={isAnimating}\n $isTouch={isTouch}\n $isDisabled={isDisabled}\n >\n {typeof inputValue === 'string' ? (\n <StyledComboBoxInput\n disabled={isDisabled}\n value={inputValue}\n onChange={onInputChange}\n onBlur={onInputBlur}\n onFocus={onInputFocus}\n placeholder={placeholderText}\n />\n ) : (\n <StyledComboBoxPlaceholder\n $shouldReduceOpacity={!selectedItem && !internalSelectedItem}\n >\n {placeholderImageUrl && (\n <StyledComboBoxPlaceholderImage\n src={placeholderImageUrl}\n shouldShowRoundImage={shouldShowRoundImage}\n />\n )}\n {placeholderIcon && <Icon icons={placeholderIcon} />}\n {placeholderText}\n {internalSelectedItem &&\n internalSelectedItem.suffixElement &&\n internalSelectedItem.suffixElement}\n </StyledComboBoxPlaceholder>\n )}\n <StyledComboBoxIconWrapper>\n <Icon icons={['fa fa-chevron-down']} />\n </StyledComboBoxIconWrapper>\n </StyledComboBoxHeader>\n {portal}\n </StyledComboBox>\n ),\n [\n shouldUseFullWidth,\n minWidth,\n direction,\n handleHeaderClick,\n isAnimating,\n isTouch,\n isDisabled,\n inputValue,\n onInputChange,\n onInputBlur,\n onInputFocus,\n placeholderText,\n selectedItem,\n internalSelectedItem,\n placeholderImageUrl,\n shouldShowRoundImage,\n placeholderIcon,\n portal,\n ],\n );\n};\n\nComboBox.displayName = 'ComboBox';\n\nexport default ComboBox;\n"],"mappings":"AAAA,SAASA,SAAS,QAAQ,YAAY;AACtC,SAASC,eAAe,QAAQ,eAAe;AAC/C,OAAOC,KAAK,IAGRC,WAAW,EACXC,SAAS,EACTC,OAAO,EACPC,MAAM,EACNC,QAAQ,QAKL,OAAO;AACd,SAASC,YAAY,QAAQ,WAAW;AACxC,SAASC,iBAAiB,QAAQ,sBAAsB;AACxD,SAASC,qBAAqB,EAAEC,oBAAoB,QAAQ,uBAAuB;AACnF,SAASC,UAAU,QAAQ,yBAAyB;AAEpD,OAAOC,IAAI,MAAM,cAAc;AAC/B,OAAOC,YAAY,MAAM,8BAA8B;AACvD,SACIC,cAAc,EACdC,oBAAoB,EACpBC,yBAAyB,EACzBC,mBAAmB,EACnBC,yBAAyB,EACzBC,8BAA8B,EAC9BC,mBAAmB,EACnBC,wBAAwB,QACrB,mBAAmB;AAoF1B,MAAMC,QAA2B,GAAGC,IAAA,IAiB9B;EAAA,IAjB+B;IACjCC,SAAS,GAAGhB,iBAAiB,CAACiB,MAAM;IACpCC,UAAU,GAAG,KAAK;IAClBC,KAAK;IACLC,SAAS,GAAG,OAAO;IACnBC,QAAQ;IACRC,WAAW;IACXC,SAAS,GAAGC,QAAQ,CAACC,IAAI;IACzBC,YAAY;IACZC,kBAAkB;IAClBC,oBAAoB;IACpBC,YAAY;IACZC,kBAAkB,GAAG,KAAK;IAC1BC,aAAa;IACbC,yBAAyB,GAAG,KAAK;IACjCC,WAAW;IACXC;EACJ,CAAC,GAAAnB,IAAA;EACG,MAAM,CAACoB,oBAAoB,EAAEC,uBAAuB,CAAC,GAAGtC,QAAQ,CAAgB,CAAC;EACjF,MAAM,CAACuC,WAAW,EAAEC,cAAc,CAAC,GAAGxC,QAAQ,CAAC,KAAK,CAAC;EACrD,MAAM,CAACyC,QAAQ,EAAEC,WAAW,CAAC,GAAG1C,QAAQ,CAAC,CAAC,CAAC;EAC3C,MAAM,CAAC2C,YAAY,EAAEC,eAAe,CAAC,GAAG5C,QAAQ,CAAC,CAAC,CAAC;EACnD,MAAM,CAAC6C,YAAY,EAAEC,eAAe,CAAC,GAAG9C,QAAQ,CAAgB,IAAI,CAAC;EACrE,MAAM,CAAC+C,SAAS,EAAEC,YAAY,CAAC,GAAGhD,QAAQ,CAA6B,QAAQ,CAAC;EAChF,MAAM,CAACiD,MAAM,EAAEC,SAAS,CAAC,GAAGlD,QAAQ,CAAc,CAAC;EACnD,MAAM,CAACmD,mBAAmB,EAAEC,sBAAsB,CAAC,GAAGpD,QAAQ,CAAyB;IACnFqD,CAAC,EAAE,CAAC;IACJC,CAAC,EAAE;EACP,CAAC,CAAC;EAEF,MAAMC,wBAAwB,GAAGxD,MAAM,CAAiB,IAAI,CAAC;EAC7D,MAAMyD,UAAU,GAAGzD,MAAM,CAAwB,IAAI,CAAC;EAEtD,MAAM;IAAE0D;EAAQ,CAAC,GAAGhE,SAAS,CAAC,CAAC;EAE/B,MAAMiE,OAAO,GAAGrD,UAAU,CAAC,CAAC;EAE5B,MAAMsD,WAAW,GAAG/D,WAAW,CAC1BgE,KAAiB,IAAK;IACnB,IACIL,wBAAwB,CAACM,OAAO,IAChC,CAACN,wBAAwB,CAACM,OAAO,CAACC,QAAQ,CAACF,KAAK,CAACG,MAAc,CAAC,IAChEP,UAAU,CAACK,OAAO,IAClB,CAACL,UAAU,CAACK,OAAO,CAACC,QAAQ,CAACF,KAAK,CAACG,MAAc,CAAC,EACpD;MACEvB,cAAc,CAAC,KAAK,CAAC;IACzB;EACJ,CAAC,EACD,CAACe,wBAAwB,CAC7B,CAAC;EAED,MAAMS,UAAU,GAAGpE,WAAW,CAAC,MAAM;IACjC,IAAI2D,wBAAwB,CAACM,OAAO,EAAE;MAClC,MAAM;QACFI,IAAI,EAAEC,YAAY;QAClBC,GAAG,EAAEC,WAAW;QAChBC;MACJ,CAAC,GAAGd,wBAAwB,CAACM,OAAO,CAACS,qBAAqB,CAAC,CAAC;MAC5D,MAAM;QAAEL,IAAI,EAAEM,aAAa;QAAEJ,GAAG,EAAEK;MAAa,CAAC,GAAG/C,SAAS,CAAC6C,qBAAqB,CAAC,CAAC;MAEpF,MAAMjB,CAAC,GAAGa,YAAY,GAAGK,aAAa,GAAG9C,SAAS,CAACgD,UAAU;MAC7D,MAAMnB,CAAC,GAAGc,WAAW,GAAGI,YAAY,GAAG/C,SAAS,CAACiD,SAAS;MAE1DtB,sBAAsB,CAAC;QACnBC,CAAC;QACDC,CAAC,EAAEpC,SAAS,KAAKhB,iBAAiB,CAACyE,GAAG,GAAGrB,CAAC,GAAGA,CAAC,GAAGe;MACrD,CAAC,CAAC;MAEF7B,cAAc,CAAC,IAAI,CAAC;IACxB;EACJ,CAAC,EAAE,CAACf,SAAS,EAAEP,SAAS,CAAC,CAAC;EAE1B,MAAM0D,WAAW,GAAGhF,WAAW,CAAC,MAAM;IAClC4C,cAAc,CAAC,KAAK,CAAC;EACzB,CAAC,EAAE,EAAE,CAAC;;EAEN;AACJ;AACA;EACI3C,SAAS,CAAC,MAAM;IACZ6B,QAAQ,CAACmD,gBAAgB,CAAC,OAAO,EAAElB,WAAW,CAAC;IAE/C,OAAO,MAAM;MACTjC,QAAQ,CAACoD,mBAAmB,CAAC,OAAO,EAAEnB,WAAW,CAAC;IACtD,CAAC;EACL,CAAC,EAAE,CAACA,WAAW,EAAEJ,wBAAwB,CAAC,CAAC;;EAE3C;AACJ;AACA;EACI,MAAMwB,qBAAqB,GAAGnF,WAAW,CACpCoF,YAA2B,IAAK;IAC7B1C,uBAAuB,CAAC0C,YAAY,CAAC;IACrCxC,cAAc,CAAC,KAAK,CAAC;IAErB,IAAIjB,QAAQ,EAAE;MACVA,QAAQ,CAACyD,YAAY,CAAC;IAC1B;EACJ,CAAC,EACD,CAACzD,QAAQ,CACb,CAAC;EAED1B,SAAS,CAAC,MAAM;IACZ,MAAMoF,cAAc,GAAGzB,UAAU,CAACK,OAAO;IAEzC,IAAIZ,MAAM,IAAIV,WAAW,IAAI0C,cAAc,EAAE;MACzC,MAAMC,YAAY,GAAGD,cAAc,CAACC,YAAY,IAAI,CAAC;MAErD,MAAMC,iBAAiB,GAAG/E,oBAAoB,CAC1CkB,SAAS,EACTiC,wBAAwB,CAACM,OAAO,IAAInC,QAAQ,CAACC,IACjD,CAAC;MAEDqB,YAAY,CAACkC,YAAY,GAAGC,iBAAiB,GAAG,QAAQ,GAAG,QAAQ,CAAC;IACxE;EACJ,CAAC,EAAE,CAAC5C,WAAW,EAAEjB,SAAS,EAAE2B,MAAM,CAAC,CAAC;EAEpCpD,SAAS,CAAC,MAAM;IACZ,MAAMuF,aAAa,GAAIC,CAAgB,IAAK;MACxC,IAAI,CAAC9C,WAAW,EAAE;QACd;MACJ;MAEA,IAAI8C,CAAC,CAACC,GAAG,KAAK,SAAS,IAAID,CAAC,CAACC,GAAG,KAAK,WAAW,EAAE;QAC9CD,CAAC,CAACE,cAAc,CAAC,CAAC;QAClB,MAAMC,QAAQ,GAAGhC,UAAU,CAACK,OAAO,EAAE2B,QAAQ;QAC7C,IAAIA,QAAQ,IAAIA,QAAQ,CAACC,MAAM,GAAG,CAAC,EAAE;UACjC,MAAMC,QAAQ,GACV7C,YAAY,KAAK,IAAI,GACf,CAACA,YAAY,IAAIwC,CAAC,CAACC,GAAG,KAAK,SAAS,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,GAAGE,QAAQ,CAACC,MAAM,IAChED,QAAQ,CAACC,MAAM,GACf,CAAC;UAEX,IAAI5C,YAAY,KAAK,IAAI,EAAE;YACvB,MAAM8C,WAAW,GAAGH,QAAQ,CAAC3C,YAAY,CAAmB;YAC5D8C,WAAW,CAACC,QAAQ,GAAG,CAAC,CAAC;UAC7B;UAEA9C,eAAe,CAAC4C,QAAQ,CAAC;UAEzB,MAAMG,UAAU,GAAGL,QAAQ,CAACE,QAAQ,CAAmB;UACvDG,UAAU,CAACD,QAAQ,GAAG,CAAC;UACvBC,UAAU,CAACC,KAAK,CAAC,CAAC;QACtB;MACJ,CAAC,MAAM,IAAIT,CAAC,CAACC,GAAG,KAAK,OAAO,IAAIzC,YAAY,KAAK,IAAI,EAAE;QACnD,MAAMkD,OAAO,GAAGvC,UAAU,CAACK,OAAO,EAAE2B,QAAQ,CAAC3C,YAAY,CAAC;QAE1D,IAAI,CAACkD,OAAO,EAAE;UACV;QACJ;QAEA,MAAM;UAAEC;QAAG,CAAC,GAAGD,OAAO;QAEtB,IAAIE,eAA0C;QAE9C5E,KAAK,CAAC6E,IAAI,CAAEC,IAAI,IAAK;UACjBF,eAAe,GAAGE,IAAI,CAACA,IAAI,CAACC,IAAI,CAC5BC,KAAA;YAAA,IAAC;cAAEC;YAAM,CAAC,GAAAD,KAAA;YAAA,OAAKE,MAAM,CAACD,KAAK,CAAC,KAAKN,EAAE,CAACQ,OAAO,CAAC,iBAAiB,EAAE,EAAE,CAAC;UAAA,CACtE,CAAC;UACD,OAAO,CAAC,CAACP,eAAe;QAC5B,CAAC,CAAC;QAEF,IAAI,CAACA,eAAe,EAAE;UAClB;QACJ;QAEAlB,qBAAqB,CAACkB,eAAe,CAAC;MAC1C;IACJ,CAAC;IAEDvE,QAAQ,CAACmD,gBAAgB,CAAC,SAAS,EAAEO,aAAa,CAAC;IAEnD,OAAO,MAAM;MACT1D,QAAQ,CAACoD,mBAAmB,CAAC,SAAS,EAAEM,aAAa,CAAC;IAC1D,CAAC;EACL,CAAC,EAAE,CAACvC,YAAY,EAAEkC,qBAAqB,EAAExC,WAAW,EAAElB,KAAK,CAAC,CAAC;;EAE7D;AACJ;AACA;EACIxB,SAAS,CAAC,MAAM;IACZ,MAAM4G,QAAQ,GAAGpF,KAAK,CAACqF,OAAO,CAAEP,IAAI,IAAKA,IAAI,CAACA,IAAI,CAAC;IACnD,MAAMQ,QAAQ,GAAGF,QAAQ,CAACP,IAAI,CAACU,KAAA;MAAA,IAAC;QAAEC;MAAS,CAAC,GAAAD,KAAA;MAAA,OAAKC,QAAQ;IAAA,EAAC;IAC1D,MAAMC,OAAO,GAAGL,QAAQ,CAACP,IAAI,CAACa,KAAA;MAAA,IAAC;QAAEC;MAAM,CAAC,GAAAD,KAAA;MAAA,OAAKC,KAAK;IAAA,EAAC;IAEnD,MAAMC,WAAW,GACb1D,wBAAwB,CAACM,OAAO,EAAEqD,aAAa,EAAE5C,qBAAqB,CAAC,CAAC,CAAC6C,KAAK,IAAI,CAAC;IAEvF,MAAMC,YAAY,GAAG,EAAE,CAAC,CAAC;IACzB,MAAMC,UAAU,GAAGV,QAAQ,GAAG,EAAE,GAAG,CAAC,CAAC,CAAC;IACtC,MAAMW,SAAS,GAAGR,OAAO,GAAG,EAAE,GAAG,CAAC,CAAC,CAAC;;IAEpC,MAAMS,SAAS,GAAGpH,qBAAqB,CAAC,CACpC,GAAGsG,QAAQ,EACX;MAAEe,IAAI,EAAEhG,WAAW;MAAE8E,KAAK,EAAE;IAAc,CAAC,CAC9C,CAAC;IACF,MAAMmB,eAAe,GAAGF,SAAS,GAAGH,YAAY,GAAGC,UAAU,GAAGC,SAAS;IAEzE,IAAII,WAAW,GAAGD,eAAe;IACjC,IAAIE,eAAe,GAAGF,eAAe;;IAErC;IACA,IAAIzF,kBAAkB,EAAE;MACpB0F,WAAW,GAAGT,WAAW;MACzBU,eAAe,GAAGF,eAAe,GAAGR,WAAW,GAAGQ,eAAe,GAAGR,WAAW;IACnF;;IAEA;IAAA,KACK,IAAI/E,yBAAyB,IAAIG,oBAAoB,EAAE;MACxD,MAAMuF,SAAS,GACXzH,qBAAqB,CAAC,CAACkC,oBAAoB,CAAC,CAAC,GAC7C+E,YAAY,GACZC,UAAU,GACVC,SAAS;MAEbI,WAAW,GAAGE,SAAS;MAEvBD,eAAe,GAAGC,SAAS,GAAGH,eAAe,GAAGA,eAAe,GAAGG,SAAS;IAC/E;IAEAlF,WAAW,CAACgF,WAAW,CAAC;IACxB9E,eAAe,CAAC+E,eAAe,CAAC;EACpC,CAAC,EAAE,CAACtG,KAAK,EAAEG,WAAW,EAAEQ,kBAAkB,EAAEE,yBAAyB,EAAEG,oBAAoB,CAAC,CAAC;;EAE7F;AACJ;AACA;EACIxC,SAAS,CAAC,MAAM;IACZ2C,cAAc,CAAC,KAAK,CAAC;IACrBF,uBAAuB,CAACV,YAAY,CAAC;EACzC,CAAC,EAAE,CAACA,YAAY,CAAC,CAAC;EAElB,MAAMiG,mBAAmB,GAAG/H,OAAO,CAAC,MAAM;IACtC,IAAI8B,YAAY,EAAE;MACd,OAAOA,YAAY,CAACiF,QAAQ;IAChC;IAEA,IAAIxE,oBAAoB,EAAE;MACtB,OAAOA,oBAAoB,CAACwE,QAAQ;IACxC;IAEA,OAAOiB,SAAS;EACpB,CAAC,EAAE,CAACzF,oBAAoB,EAAET,YAAY,CAAC,CAAC;EAExC,MAAMmG,eAAe,GAAGjI,OAAO,CAAC,MAAM;IAClC,IAAI8B,YAAY,EAAE;MACd,OAAOA,YAAY,CAACoF,KAAK;IAC7B;IAEA,IAAI3E,oBAAoB,EAAE;MACtB,OAAOA,oBAAoB,CAAC2E,KAAK;IACrC;IAEA,OAAOc,SAAS;EACpB,CAAC,EAAE,CAACzF,oBAAoB,EAAET,YAAY,CAAC,CAAC;;EAExC;AACJ;AACA;EACI,MAAMoG,eAAe,GAAGlI,OAAO,CAAC,MAAM;IAClC,IAAI0H,IAAI,GAAGhG,WAAW;IAEtB,IAAII,YAAY,EAAE;MACd4F,IAAI,GAAG5F,YAAY,CAAC4F,IAAI;IAC5B,CAAC,MAAM,IAAInF,oBAAoB,EAAE;MAC7BmF,IAAI,GAAGnF,oBAAoB,CAACmF,IAAI;IACpC;IAEA,OAAOA,IAAI;EACf,CAAC,EAAE,CAACnF,oBAAoB,EAAEb,WAAW,EAAEI,YAAY,CAAC,CAAC;;EAErD;AACJ;AACA;EACI,MAAMqG,iBAAiB,GAAGrI,WAAW,CAAC,MAAM;IACxC,IAAI,CAACwB,UAAU,EAAE;MACb,IAAImB,WAAW,EAAE;QACbqC,WAAW,CAAC,CAAC;MACjB,CAAC,MAAM;QACHZ,UAAU,CAAC,CAAC;MAChB;IACJ;EACJ,CAAC,EAAE,CAACY,WAAW,EAAEZ,UAAU,EAAEzB,WAAW,EAAEnB,UAAU,CAAC,CAAC;EAEtD,MAAM8G,cAAc,GAAGpI,OAAO,CAC1B,MACIuB,KAAK,CAAC8G,GAAG,CAACC,KAAA;IAAA,IAAC;MAAEC,SAAS;MAAElC;IAAK,CAAC,GAAAiC,KAAA;IAAA,oBAC1BzI,KAAA,CAAA2I,aAAA;MAAKhD,GAAG,EAAE+C,SAAS,IAAI;IAAgB,GAClCA,SAAS,IAAIhH,KAAK,CAACoE,MAAM,GAAG,CAAC,iBAC1B9F,KAAA,CAAA2I,aAAA,CAACxH,mBAAmB,QAAEuH,SAA+B,CACxD,EACAlC,IAAI,CAACgC,GAAG,CAAEI,IAAI;IAAA;IACX;IACA5I,KAAA,CAAA2I,aAAA,CAAC/H,YAAY;MACTyG,KAAK,EAAEuB,IAAI,CAACvB,KAAM;MAClBhB,EAAE,EAAEuC,IAAI,CAACjC,KAAM;MACfO,QAAQ,EAAE0B,IAAI,CAAC1B,QAAS;MACxBzF,UAAU,EAAEmH,IAAI,CAACnH,UAAW;MAC5BoH,UAAU,EAAE5G,YAAY,GAAG2G,IAAI,CAACjC,KAAK,KAAK1E,YAAY,CAAC0E,KAAK,GAAG,KAAM;MACrEhB,GAAG,EAAEiD,IAAI,CAACjC,KAAM;MAChB/E,QAAQ,EAAEwD,qBAAsB;MAChC0D,YAAY,EAAEF,IAAI,CAACE,YAAa;MAChC5G,kBAAkB,EAAEA,kBAAmB;MACvCC,oBAAoB,EAAEA,oBAAqB;MAC3C4G,OAAO,EAAEH,IAAI,CAACG,OAAQ;MACtBC,aAAa,EAAEJ,IAAI,CAACI,aAAc;MAClCnB,IAAI,EAAEe,IAAI,CAACf,IAAK;MAChBlB,KAAK,EAAEiC,IAAI,CAACjC;IAAM,CACrB,CACJ,CACA,CAAC;EAAA,CACT,CAAC,EACN,CAACvB,qBAAqB,EAAE1D,KAAK,EAAEO,YAAY,EAAEC,kBAAkB,EAAEC,oBAAoB,CACzF,CAAC;EAED,MAAM8G,UAAU,GAAG9I,OAAO,CAAC,MAAM;IAC7B,IAAI+I,MAAqB,GAAG;MAAE5E,IAAI,EAAEd,mBAAmB,CAACE,CAAC;MAAEc,GAAG,EAAEhB,mBAAmB,CAACG;IAAE,CAAC;IAEvF,IAAIpC,SAAS,KAAKhB,iBAAiB,CAACyE,GAAG,EAAE;MACrCkE,MAAM,GAAG;QAAE,GAAGA,MAAM;QAAEC,SAAS,EAAE;MAAoB,CAAC;IAC1D;IAEA,OAAOD,MAAM;EACjB,CAAC,EAAE,CAAC3H,SAAS,EAAEiC,mBAAmB,CAACE,CAAC,EAAEF,mBAAmB,CAACG,CAAC,CAAC,CAAC;EAE7DzD,SAAS,CAAC,MAAM;IACZqD,SAAS,CAAC,mBACNjD,YAAY,cACRN,KAAA,CAAA2I,aAAA,CAAC5I,eAAe;MAACqJ,OAAO,EAAE;IAAM,GAC3BxG,WAAW,iBACR5C,KAAA,CAAA2I,aAAA,CAACvH,wBAAwB;MACrBiI,QAAQ,EAAEvF,OAAO,EAAEwF,IAAK;MACxBC,OAAO,EAAE;QAAE7E,MAAM,EAAE,aAAa;QAAE8E,OAAO,EAAE;MAAE,CAAE;MAC/CC,UAAU,EAAErG,SAAU;MACtBgG,OAAO,EAAE;QAAE1E,MAAM,EAAE,CAAC;QAAE8E,OAAO,EAAE;MAAE,CAAE;MACnCE,IAAI,EAAE;QAAEhF,MAAM,EAAE,CAAC;QAAE8E,OAAO,EAAE;MAAE,CAAE;MAChCG,UAAU,EAAEhI,SAAU;MACtBiI,SAAS,EAAE5G,YAAa;MACxB6G,KAAK,EAAEZ,UAAW;MAClBa,UAAU,EAAEvI,SAAU;MACtBwI,UAAU,EAAE;QAAEC,QAAQ,EAAE;MAAI,CAAE;MAC9B/D,QAAQ,EAAE,CAAE;MACZgE,GAAG,EAAEpG;IAAW,GAEf0E,cACqB,CAEjB,CAAC,EAClBzG,SACJ,CACJ,CAAC;EACL,CAAC,EAAE,CACCkB,YAAY,EACZiG,UAAU,EACVnF,OAAO,EAAEwF,IAAI,EACbf,cAAc,EACdzG,SAAS,EACTP,SAAS,EACTqB,WAAW,EACXjB,SAAS,EACTmB,QAAQ,EACRM,SAAS,CACZ,CAAC;EAEF,OAAOjD,OAAO,CACV,mBACIH,KAAA,CAAA2I,aAAA,CAAC9H,cAAc;IACXoJ,GAAG,EAAErG,wBAAyB;IAC9BsG,mBAAmB,EAAE7H,kBAAmB;IACxCuH,SAAS,EAAE9G;EAAS,gBAEpB9C,KAAA,CAAA2I,aAAA,CAAC7H,oBAAoB;IACjBgJ,UAAU,EAAEvI,SAAU;IACtB4I,OAAO,EAAE7B,iBAAkB;IAC3B8B,OAAO,EAAExH,WAAY;IACrByH,QAAQ,EAAEtG,OAAQ;IAClBuG,WAAW,EAAE7I;EAAW,GAEvB,OAAOgB,UAAU,KAAK,QAAQ,gBAC3BzC,KAAA,CAAA2I,aAAA,CAAC3H,mBAAmB;IAChBuJ,QAAQ,EAAE9I,UAAW;IACrBkF,KAAK,EAAElE,UAAW;IAClB+H,QAAQ,EAAElI,aAAc;IACxBmI,MAAM,EAAEjI,WAAY;IACpBkI,OAAO,EAAEtI,YAAa;IACtBP,WAAW,EAAEwG;EAAgB,CAChC,CAAC,gBAEFrI,KAAA,CAAA2I,aAAA,CAAC1H,yBAAyB;IACtB0J,oBAAoB,EAAE,CAAC1I,YAAY,IAAI,CAACS;EAAqB,GAE5DwF,mBAAmB,iBAChBlI,KAAA,CAAA2I,aAAA,CAACzH,8BAA8B;IAC3B0J,GAAG,EAAE1C,mBAAoB;IACzB/F,oBAAoB,EAAEA;EAAqB,CAC9C,CACJ,EACAiG,eAAe,iBAAIpI,KAAA,CAAA2I,aAAA,CAAChI,IAAI;IAAC0G,KAAK,EAAEe;EAAgB,CAAE,CAAC,EACnDC,eAAe,EACf3F,oBAAoB,IACjBA,oBAAoB,CAACsG,aAAa,IAClCtG,oBAAoB,CAACsG,aACF,CAC9B,eACDhJ,KAAA,CAAA2I,aAAA,CAAC5H,yBAAyB,qBACtBf,KAAA,CAAA2I,aAAA,CAAChI,IAAI;IAAC0G,KAAK,EAAE,CAAC,oBAAoB;EAAE,CAAE,CACf,CACT,CAAC,EACtB/D,MACW,CACnB,EACD,CACIjB,kBAAkB,EAClBS,QAAQ,EACRvB,SAAS,EACT+G,iBAAiB,EACjB1F,WAAW,EACXmB,OAAO,EACPtC,UAAU,EACVgB,UAAU,EACVH,aAAa,EACbE,WAAW,EACXJ,YAAY,EACZiG,eAAe,EACfpG,YAAY,EACZS,oBAAoB,EACpBwF,mBAAmB,EACnB/F,oBAAoB,EACpBiG,eAAe,EACf9E,MAAM,CAEd,CAAC;AACL,CAAC;AAEDjC,QAAQ,CAACwJ,WAAW,GAAG,UAAU;AAEjC,eAAexJ,QAAQ","ignoreList":[]}
@@ -46,7 +46,10 @@ export type ComboBoxProps = {
46
46
  /**
47
47
  * Function to be executed when the optional input lost its focus.
48
48
  */
49
- onInputBlur?: FocusEventHandler<HTMLInputElement>;
49
+ onInputBlur?: FocusEventHandler<HTMLInputElement> /**
50
+ * Function to be executed when the optional input gets its focus.
51
+ */;
52
+ onInputFocus?: FocusEventHandler<HTMLInputElement>;
50
53
  /**
51
54
  * Function that should be executed when an item is selected.
52
55
  */
@@ -67,6 +70,10 @@ export type ComboBoxProps = {
67
70
  * If true, the images of the items are displayed in a round shape.
68
71
  */
69
72
  shouldShowRoundImage?: boolean;
73
+ /**
74
+ * Whether the width of the ComboBox should be the width of the current item.
75
+ */
76
+ shouldUseCurrentItemWidth?: boolean;
70
77
  /**
71
78
  * Whether the width of the 'ComboBox' should be the width of the parent or of the widest item.
72
79
  */
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@chayns-components/core",
3
- "version": "5.0.0-beta.878",
3
+ "version": "5.0.0-beta.880",
4
4
  "description": "A set of beautiful React components for developing your own applications with chayns.",
5
5
  "sideEffects": false,
6
6
  "browserslist": [
@@ -87,5 +87,5 @@
87
87
  "publishConfig": {
88
88
  "access": "public"
89
89
  },
90
- "gitHead": "82f177633ae02b6c7478c4fdc383312a32e025db"
90
+ "gitHead": "084d50d3069a5e02724f83f09b4500063d54c175"
91
91
  }