@chayns-components/core 5.0.0-beta.891 → 5.0.0-beta.893

package/lib/cjs/components/select-button/SelectButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectButton.js","names":["_chaynsApi","require","_react","_interopRequireWildcard","_Button","_interopRequireDefault","_SelectButton","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","SelectButton","buttonText","isDisabled","list","onSelect","selectedItemIds","shouldAllowMultiSelect","shouldShowButtonTextWithSelection","shouldShowSearch","title","itemList","useMemo","items","forEach","text","id","isSelected","includes","push","name","internalButtonText","length","addedCount","newText","additionalCount","handleClick","createDialog","undefined","type","DialogType","SELECT","multiselect","quickfind","open","then","result","buttonType","map","Number","createElement","StyledSelectButton","onClick","isSecondary","shouldShowTextAsRobotoMedium","displayName","_default","exports"],"sources":["../../../../src/components/select-button/SelectButton.tsx"],"sourcesContent":["import { createDialog, DialogType, type DialogSelectListItemType } from 'chayns-api';\nimport React, { useMemo, type FC } from 'react';\nimport type { SelectButtonItem } from '../../types/selectButton';\nimport Button from '../button/Button';\nimport { StyledSelectButton } from './SelectButton.styles';\n\nexport type SelectButtonProps = {\n    /**\n     * The text that should be displayed inside the button.\n     */\n    buttonText: string;\n    /**\n     * Whether the button should be disabled.\n     */\n    isDisabled?: boolean;\n    /**\n     * A list of item that could be selected.\n     */\n    list: SelectButtonItem[];\n    /**\n     * Function to be executed after an item is selected.\n     */\n    onSelect?: (ids: number[]) => void;\n    /**\n     * The id of an item that should be preselected.\n     */\n    selectedItemIds?: number[];\n    /**\n     * Whether more than one item should be selectable.\n     */\n    shouldAllowMultiSelect?: boolean;\n    /**\n     * Whether the button text should be displayed also if items are selected.\n     */\n    shouldShowButtonTextWithSelection?: boolean;\n    /**\n     * Whether the search should be displayed inside the dialog.\n     */\n    shouldShowSearch?: boolean;\n    /**\n     * The title of the dialog.\n     */\n    title?: string;\n};\n\nconst SelectButton: FC<SelectButtonProps> = ({\n    buttonText,\n    isDisabled,\n    list,\n    onSelect,\n    selectedItemIds,\n    shouldAllowMultiSelect,\n    shouldShowButtonTextWithSelection,\n    shouldShowSearch,\n    title,\n}) => {\n    const itemList = useMemo(() => {\n        const items: DialogSelectListItemType[] = [];\n\n        list.forEach(({ text, id }) => {\n            const isSelected = selectedItemIds ? selectedItemIds.includes(id) : false;\n\n            items.push({\n                name: text,\n                id,\n                isSelected,\n            });\n        });\n\n        return items;\n    }, [list, selectedItemIds]);\n\n    const internalButtonText = useMemo(() => {\n        if (shouldShowButtonTextWithSelection || !selectedItemIds || selectedItemIds.length === 0) {\n            return buttonText;\n        }\n\n        let addedCount = 0;\n        let newText = '';\n\n        const additionalCount = selectedItemIds.length - 2;\n\n        list.forEach(({ text, id }) => {\n            if ((addedCount < 2 || additionalCount <= 1) && selectedItemIds?.includes(id)) {\n                addedCount += 1;\n                newText += newText.length === 0 ? `${text}` : `, ${text}`;\n            }\n        });\n\n        if (additionalCount > 1) {\n            newText += `, ${additionalCount} weitere`;\n        }\n\n        return newText;\n    }, [buttonText, list, selectedItemIds, shouldShowButtonTextWithSelection]);\n\n    const handleClick = () => {\n        void createDialog({\n            text: title ? `[h1]${title}[/h1]` : undefined,\n            type: DialogType.SELECT,\n            list: itemList,\n            multiselect: shouldAllowMultiSelect,\n            quickfind: shouldShowSearch,\n        })\n            .open()\n            .then((result) => {\n                // Ignore because there is no type\n                // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n                // @ts-ignore\n                if (result && result.buttonType === 1 && typeof onSelect === 'function') {\n                    // Ignore because there is no type\n                    // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n                    // @ts-ignore\n                    onSelect((result.result as string[]).map(Number));\n                }\n            });\n    };\n\n    return (\n        <StyledSelectButton>\n            <Button\n                onClick={handleClick}\n                isDisabled={isDisabled}\n                isSecondary\n                shouldShowTextAsRobotoMedium={false}\n            >\n                {internalButtonText}\n            </Button>\n        </StyledSelectButton>\n    );\n};\n\nSelectButton.displayName = 'SelectButton';\n\nexport default SelectButton;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"SelectButton.js","names":["_chaynsApi","require","_react","_interopRequireWildcard","_Button","_interopRequireDefault","_SelectButton","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","SelectButton","buttonText","isDisabled","list","onSelect","selectedItemIds","shouldAllowMultiSelect","shouldShowButtonTextWithSelection","shouldShowSearch","selectAllText","title","itemList","useMemo","items","forEach","text","id","isSelected","includes","push","name","internalButtonText","length","addedCount","newText","additionalCount","handleClick","createDialog","undefined","type","DialogType","SELECT","multiselect","quickfind","selectAllCheckbox","open","then","result","buttonType","map","Number","createElement","StyledSelectButton","onClick","isSecondary","shouldShowTextAsRobotoMedium","displayName","_default","exports"],"sources":["../../../../src/components/select-button/SelectButton.tsx"],"sourcesContent":["import { createDialog, DialogType, type DialogSelectListItemType } from 'chayns-api';\nimport React, { useMemo, type FC } from 'react';\nimport type { SelectButtonItem } from '../../types/selectButton';\nimport Button from '../button/Button';\nimport { StyledSelectButton } from './SelectButton.styles';\n\nexport type SelectButtonProps = {\n    /**\n     * The text that should be displayed inside the button.\n     */\n    buttonText: string;\n    /**\n     * Whether the button should be disabled.\n     */\n    isDisabled?: boolean;\n    /**\n     * A list of item that could be selected.\n     */\n    list: SelectButtonItem[];\n    /**\n     * Function to be executed after an item is selected.\n     */\n    onSelect?: (ids: number[]) => void;\n    /**\n     * If a string is given and `shouldAllowMultiSelect` is true, the dialog displays a checkbox to select all items at once.\n     */\n    selectAllText?: string;\n    /**\n     * The id of an item that should be preselected.\n     */\n    selectedItemIds?: number[];\n    /**\n     * Whether more than one item should be selectable.\n     */\n    shouldAllowMultiSelect?: boolean;\n    /**\n     * Whether the button text should be displayed also if items are selected.\n     */\n    shouldShowButtonTextWithSelection?: boolean;\n    /**\n     * Whether the search should be displayed inside the dialog.\n     */\n    shouldShowSearch?: boolean;\n    /**\n     * The title of the dialog.\n     */\n    title?: string;\n};\n\nconst SelectButton: FC<SelectButtonProps> = ({\n    buttonText,\n    isDisabled,\n    list,\n    onSelect,\n    selectedItemIds,\n    shouldAllowMultiSelect,\n    shouldShowButtonTextWithSelection,\n    shouldShowSearch,\n    selectAllText,\n    title,\n}) => {\n    const itemList = useMemo(() => {\n        const items: DialogSelectListItemType[] = [];\n\n        list.forEach(({ text, id }) => {\n            const isSelected = selectedItemIds ? selectedItemIds.includes(id) : false;\n\n            items.push({\n                name: text,\n                id,\n                isSelected,\n            });\n        });\n\n        return items;\n    }, [list, selectedItemIds]);\n\n    const internalButtonText = useMemo(() => {\n        if (shouldShowButtonTextWithSelection || !selectedItemIds || selectedItemIds.length === 0) {\n            return buttonText;\n        }\n\n        let addedCount = 0;\n        let newText = '';\n\n        const additionalCount = selectedItemIds.length - 2;\n\n        list.forEach(({ text, id }) => {\n            if ((addedCount < 2 || additionalCount <= 1) && selectedItemIds?.includes(id)) {\n                addedCount += 1;\n                newText += newText.length === 0 ? `${text}` : `, ${text}`;\n            }\n        });\n\n        if (additionalCount > 1) {\n            newText += `, ${additionalCount} weitere`;\n        }\n\n        return newText;\n    }, [buttonText, list, selectedItemIds, shouldShowButtonTextWithSelection]);\n\n    const handleClick = () => {\n        void createDialog({\n            text: title ? `[h1]${title}[/h1]` : undefined,\n            type: DialogType.SELECT,\n            list: itemList,\n            multiselect: shouldAllowMultiSelect,\n            quickfind: shouldShowSearch,\n            selectAllCheckbox: selectAllText,\n        })\n            .open()\n            .then((result) => {\n                // Ignore because there is no type\n                // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n                // @ts-ignore\n                if (result && result.buttonType === 1 && typeof onSelect === 'function') {\n                    // Ignore because there is no type\n                    // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n                    // @ts-ignore\n                    onSelect((result.result as string[]).map(Number));\n                }\n            });\n    };\n\n    return (\n        <StyledSelectButton>\n            <Button\n                onClick={handleClick}\n                isDisabled={isDisabled}\n                isSecondary\n                shouldShowTextAsRobotoMedium={false}\n            >\n                {internalButtonText}\n            </Button>\n        </StyledSelectButton>\n    );\n};\n\nSelectButton.displayName = 'SelectButton';\n\nexport default SelectButton;\n"],"mappings":"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","ignoreList":[]}

package/lib/cjs/utils/accordion.js

@@ -3,7 +3,8 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.getAccordionHeadHeight = void 0;
+exports.getElementClickEvent = exports.getAccordionHeadHeight = void 0;
+var _react = require("react");
 const getAccordionHeadHeight = ({
   isWrapped,
   title,
@@ -34,4 +35,20 @@ const getAccordionHeadHeight = ({
   };
 };
 exports.getAccordionHeadHeight = getAccordionHeadHeight;
+const getElementClickEvent = element => {
+  let hasClickHandler = false;
+  const checkForClickHandler = el => {
+    if (! /*#__PURE__*/(0, _react.isValidElement)(el)) return;
+    if (el.props.onClick) {
+      hasClickHandler = true;
+      return;
+    }
+    if (el.props.children) {
+      _react.Children.forEach(el.props.children, checkForClickHandler);
+    }
+  };
+  checkForClickHandler(element);
+  return hasClickHandler;
+};
+exports.getElementClickEvent = getElementClickEvent;
 //# sourceMappingURL=accordion.js.map

package/lib/cjs/utils/accordion.js.map

@@ -1 +1 @@
-{"version":3,"file":"accordion.js","names":["getAccordionHeadHeight","isWrapped","title","width","hasSearch","element","document","createElement","style","fontSize","opacity","pointerEvents","whiteSpace","innerText","body","appendChild","closedHeight","Math","max","clientHeight","fontWeight","openHeight","removeChild","closed","open","exports"],"sources":["../../../src/utils/accordion.ts"],"sourcesContent":["import type { AccordionHeadProps } from '../components/accordion/accordion-head/AccordionHead';\n\ntype GetAccordionHeadHeightOptions = Pick<AccordionHeadProps, 'isWrapped' | 'title'> & {\n    width: number;\n    hasSearch: boolean;\n};\n\ninterface GetAccordionHeadHeightResult {\n    closed: number;\n    open: number;\n}\n\nexport const getAccordionHeadHeight = ({\n    isWrapped,\n    title,\n    width,\n    hasSearch,\n}: GetAccordionHeadHeightOptions): GetAccordionHeadHeightResult => {\n    const element = document.createElement('div');\n\n    element.style.fontSize = '1rem';\n    element.style.opacity = '0';\n    element.style.pointerEvents = 'none';\n    element.style.whiteSpace = 'nowrap';\n    element.style.width = `${width}px`;\n\n    element.innerText = title;\n\n    document.body.appendChild(element);\n\n    const closedHeight = Math.max(element.clientHeight + 8, isWrapped ? 40 : 33);\n\n    if (isWrapped) {\n        element.style.fontWeight = 'bold';\n        element.style.whiteSpace = 'nowrap';\n    } else {\n        element.style.fontSize = '1.3rem';\n        element.style.whiteSpace = hasSearch ? 'nowrap' : 'normal';\n    }\n\n    const openHeight = Math.max(element.clientHeight + 8, isWrapped ? 40 : 33);\n\n    document.body.removeChild(element);\n\n    return { closed: closedHeight, open: openHeight };\n};\n"],"mappings":";;;;;;AAYO,MAAMA,sBAAsB,GAAGA,CAAC;EACnCC,SAAS;EACTC,KAAK;EACLC,KAAK;EACLC;AAC2B,CAAC,KAAmC;EAC/D,MAAMC,OAAO,GAAGC,QAAQ,CAACC,aAAa,CAAC,KAAK,CAAC;EAE7CF,OAAO,CAACG,KAAK,CAACC,QAAQ,GAAG,MAAM;EAC/BJ,OAAO,CAACG,KAAK,CAACE,OAAO,GAAG,GAAG;EAC3BL,OAAO,CAACG,KAAK,CAACG,aAAa,GAAG,MAAM;EACpCN,OAAO,CAACG,KAAK,CAACI,UAAU,GAAG,QAAQ;EACnCP,OAAO,CAACG,KAAK,CAACL,KAAK,GAAG,GAAGA,KAAK,IAAI;EAElCE,OAAO,CAACQ,SAAS,GAAGX,KAAK;EAEzBI,QAAQ,CAACQ,IAAI,CAACC,WAAW,CAACV,OAAO,CAAC;EAElC,MAAMW,YAAY,GAAGC,IAAI,CAACC,GAAG,CAACb,OAAO,CAACc,YAAY,GAAG,CAAC,EAAElB,SAAS,GAAG,EAAE,GAAG,EAAE,CAAC;EAE5E,IAAIA,SAAS,EAAE;IACXI,OAAO,CAACG,KAAK,CAACY,UAAU,GAAG,MAAM;IACjCf,OAAO,CAACG,KAAK,CAACI,UAAU,GAAG,QAAQ;EACvC,CAAC,MAAM;IACHP,OAAO,CAACG,KAAK,CAACC,QAAQ,GAAG,QAAQ;IACjCJ,OAAO,CAACG,KAAK,CAACI,UAAU,GAAGR,SAAS,GAAG,QAAQ,GAAG,QAAQ;EAC9D;EAEA,MAAMiB,UAAU,GAAGJ,IAAI,CAACC,GAAG,CAACb,OAAO,CAACc,YAAY,GAAG,CAAC,EAAElB,SAAS,GAAG,EAAE,GAAG,EAAE,CAAC;EAE1EK,QAAQ,CAACQ,IAAI,CAACQ,WAAW,CAACjB,OAAO,CAAC;EAElC,OAAO;IAAEkB,MAAM,EAAEP,YAAY;IAAEQ,IAAI,EAAEH;EAAW,CAAC;AACrD,CAAC;AAACI,OAAA,CAAAzB,sBAAA,GAAAA,sBAAA","ignoreList":[]}
+{"version":3,"file":"accordion.js","names":["_react","require","getAccordionHeadHeight","isWrapped","title","width","hasSearch","element","document","createElement","style","fontSize","opacity","pointerEvents","whiteSpace","innerText","body","appendChild","closedHeight","Math","max","clientHeight","fontWeight","openHeight","removeChild","closed","open","exports","getElementClickEvent","hasClickHandler","checkForClickHandler","el","isValidElement","props","onClick","children","Children","forEach"],"sources":["../../../src/utils/accordion.ts"],"sourcesContent":["import type { AccordionHeadProps } from '../components/accordion/accordion-head/AccordionHead';\nimport { Children, isValidElement, ReactNode } from 'react';\n\ntype GetAccordionHeadHeightOptions = Pick<AccordionHeadProps, 'isWrapped' | 'title'> & {\n    width: number;\n    hasSearch: boolean;\n};\n\ninterface GetAccordionHeadHeightResult {\n    closed: number;\n    open: number;\n}\n\nexport const getAccordionHeadHeight = ({\n    isWrapped,\n    title,\n    width,\n    hasSearch,\n}: GetAccordionHeadHeightOptions): GetAccordionHeadHeightResult => {\n    const element = document.createElement('div');\n\n    element.style.fontSize = '1rem';\n    element.style.opacity = '0';\n    element.style.pointerEvents = 'none';\n    element.style.whiteSpace = 'nowrap';\n    element.style.width = `${width}px`;\n\n    element.innerText = title;\n\n    document.body.appendChild(element);\n\n    const closedHeight = Math.max(element.clientHeight + 8, isWrapped ? 40 : 33);\n\n    if (isWrapped) {\n        element.style.fontWeight = 'bold';\n        element.style.whiteSpace = 'nowrap';\n    } else {\n        element.style.fontSize = '1.3rem';\n        element.style.whiteSpace = hasSearch ? 'nowrap' : 'normal';\n    }\n\n    const openHeight = Math.max(element.clientHeight + 8, isWrapped ? 40 : 33);\n\n    document.body.removeChild(element);\n\n    return { closed: closedHeight, open: openHeight };\n};\n\nexport const getElementClickEvent = (element: ReactNode) => {\n    let hasClickHandler = false;\n\n    const checkForClickHandler = (el: ReactNode) => {\n        if (!isValidElement(el)) return;\n\n        if (el.props.onClick) {\n            hasClickHandler = true;\n\n            return;\n        }\n\n        if (el.props.children) {\n            Children.forEach(el.props.children, checkForClickHandler);\n        }\n    };\n\n    checkForClickHandler(element);\n\n    return hasClickHandler;\n};\n"],"mappings":";;;;;;AACA,IAAAA,MAAA,GAAAC,OAAA;AAYO,MAAMC,sBAAsB,GAAGA,CAAC;EACnCC,SAAS;EACTC,KAAK;EACLC,KAAK;EACLC;AAC2B,CAAC,KAAmC;EAC/D,MAAMC,OAAO,GAAGC,QAAQ,CAACC,aAAa,CAAC,KAAK,CAAC;EAE7CF,OAAO,CAACG,KAAK,CAACC,QAAQ,GAAG,MAAM;EAC/BJ,OAAO,CAACG,KAAK,CAACE,OAAO,GAAG,GAAG;EAC3BL,OAAO,CAACG,KAAK,CAACG,aAAa,GAAG,MAAM;EACpCN,OAAO,CAACG,KAAK,CAACI,UAAU,GAAG,QAAQ;EACnCP,OAAO,CAACG,KAAK,CAACL,KAAK,GAAG,GAAGA,KAAK,IAAI;EAElCE,OAAO,CAACQ,SAAS,GAAGX,KAAK;EAEzBI,QAAQ,CAACQ,IAAI,CAACC,WAAW,CAACV,OAAO,CAAC;EAElC,MAAMW,YAAY,GAAGC,IAAI,CAACC,GAAG,CAACb,OAAO,CAACc,YAAY,GAAG,CAAC,EAAElB,SAAS,GAAG,EAAE,GAAG,EAAE,CAAC;EAE5E,IAAIA,SAAS,EAAE;IACXI,OAAO,CAACG,KAAK,CAACY,UAAU,GAAG,MAAM;IACjCf,OAAO,CAACG,KAAK,CAACI,UAAU,GAAG,QAAQ;EACvC,CAAC,MAAM;IACHP,OAAO,CAACG,KAAK,CAACC,QAAQ,GAAG,QAAQ;IACjCJ,OAAO,CAACG,KAAK,CAACI,UAAU,GAAGR,SAAS,GAAG,QAAQ,GAAG,QAAQ;EAC9D;EAEA,MAAMiB,UAAU,GAAGJ,IAAI,CAACC,GAAG,CAACb,OAAO,CAACc,YAAY,GAAG,CAAC,EAAElB,SAAS,GAAG,EAAE,GAAG,EAAE,CAAC;EAE1EK,QAAQ,CAACQ,IAAI,CAACQ,WAAW,CAACjB,OAAO,CAAC;EAElC,OAAO;IAAEkB,MAAM,EAAEP,YAAY;IAAEQ,IAAI,EAAEH;EAAW,CAAC;AACrD,CAAC;AAACI,OAAA,CAAAzB,sBAAA,GAAAA,sBAAA;AAEK,MAAM0B,oBAAoB,GAAIrB,OAAkB,IAAK;EACxD,IAAIsB,eAAe,GAAG,KAAK;EAE3B,MAAMC,oBAAoB,GAAIC,EAAa,IAAK;IAC5C,IAAI,eAAC,IAAAC,qBAAc,EAACD,EAAE,CAAC,EAAE;IAEzB,IAAIA,EAAE,CAACE,KAAK,CAACC,OAAO,EAAE;MAClBL,eAAe,GAAG,IAAI;MAEtB;IACJ;IAEA,IAAIE,EAAE,CAACE,KAAK,CAACE,QAAQ,EAAE;MACnBC,eAAQ,CAACC,OAAO,CAACN,EAAE,CAACE,KAAK,CAACE,QAAQ,EAAEL,oBAAoB,CAAC;IAC7D;EACJ,CAAC;EAEDA,oBAAoB,CAACvB,OAAO,CAAC;EAE7B,OAAOsB,eAAe;AAC1B,CAAC;AAACF,OAAA,CAAAC,oBAAA,GAAAA,oBAAA","ignoreList":[]}

package/lib/esm/components/accordion/accordion-head/AccordionHead.js

@@ -3,7 +3,7 @@ import { AnimatePresence, LayoutGroup } from 'framer-motion';
 import React, { useEffect, useMemo, useRef, useState } from 'react';
 import { useTheme } from 'styled-components';
 import { useElementSize } from '../../../hooks/useElementSize';
-import { getAccordionHeadHeight } from '../../../utils/accordion';
+import { getAccordionHeadHeight, getElementClickEvent } from '../../../utils/accordion';
 import { AreaContext } from '../../area-provider/AreaContextProvider';
 import Icon from '../../icon/Icon';
 import Input, { InputSize } from '../../input/Input';
@@ -49,6 +49,7 @@ const AccordionHead = _ref => {
   const titleElementChildrenSize = useElementSize(titleElementWrapperRef, {
     shouldUseChildElement: true
   });
+  const shouldPreventRightElementClick = useMemo(() => getElementClickEvent(rightElement), [rightElement]);
   useEffect(() => {
     if (typeof onTitleInputChange === 'function') {
       setHeadHeight({
@@ -194,7 +195,8 @@ const AccordionHead = _ref => {
     initial: {
       opacity: 0
     },
-    key: `rightElementWrapper--${uuid}`
+    key: `rightElementWrapper--${uuid}`,
+    onClick: !isFixed && !shouldPreventRightElementClick ? onClick : undefined
   }, rightElement))));
 };
 AccordionHead.displayName = 'AccordionHead';

package/lib/esm/components/accordion/accordion-head/AccordionHead.js.map

@@ -1 +1 @@
-{"version":3,"file":"AccordionHead.js","names":["AnimatePresence","LayoutGroup","React","useEffect","useMemo","useRef","useState","useTheme","useElementSize","getAccordionHeadHeight","AreaContext","Icon","Input","InputSize","SearchInput","StyledAccordionIcon","StyledMotionAccordionHead","StyledMotionContentWrapper","StyledMotionIconWrapper","StyledMotionRightElementWrapper","StyledMotionSearchWrapper","StyledMotionTitle","StyledMotionTitleElementWrapper","StyledMotionTitleWrapper","StyledRightWrapper","AccordionHead","_ref","icon","isOpen","isFixed","isTitleGreyed","isWrapped","onClick","onSearchChange","rightElement","searchPlaceholder","searchValue","shouldRotateIcon","title","titleElement","uuid","titleInputProps","onTitleInputChange","titleColor","headHeight","setHeadHeight","closed","open","theme","titleElementWrapperRef","titleWrapperRef","internalSearchValue","setInternalSearchValue","handleOnSearchChance","event","target","value","titleElementChildrenSize","shouldUseChildElement","width","current","clientWidth","hasSearch","fontSize","iconElement","createElement","icons","internalIcon","accordionIcon","toString","internalIconStyle","iconStyle","className","$icon","accordionHeadHeight","height","tmp","setTmp","animate","initial","key","rotate","undefined","opacity","ref","$isWrapped","Provider","shouldChangeColor","_extends","onFocus","onBlur","onChange","scale","exit","$isOpen","$color","$hasSearch","transition","duration","layout","placeholder","size","Small","displayName"],"sources":["../../../../../src/components/accordion/accordion-head/AccordionHead.tsx"],"sourcesContent":["import { AnimatePresence, LayoutGroup } from 'framer-motion';\nimport React, {\n    ChangeEvent,\n    ChangeEventHandler,\n    FC,\n    MouseEventHandler,\n    ReactNode,\n    useEffect,\n    useMemo,\n    useRef,\n    useState,\n    type CSSProperties,\n} from 'react';\nimport { useTheme } from 'styled-components';\nimport { useElementSize } from '../../../hooks/useElementSize';\nimport { getAccordionHeadHeight } from '../../../utils/accordion';\nimport { AreaContext } from '../../area-provider/AreaContextProvider';\nimport Icon from '../../icon/Icon';\nimport Input, { InputSize, type InputProps } from '../../input/Input';\nimport SearchInput from '../../search-input/SearchInput';\nimport {\n    StyledAccordionIcon,\n    StyledMotionAccordionHead,\n    StyledMotionContentWrapper,\n    StyledMotionIconWrapper,\n    StyledMotionRightElementWrapper,\n    StyledMotionSearchWrapper,\n    StyledMotionTitle,\n    StyledMotionTitleElementWrapper,\n    StyledMotionTitleWrapper,\n    StyledRightWrapper,\n} from './AccordionHead.styles';\n\nexport type AccordionHeadProps = {\n    icon?: string;\n    isOpen: boolean;\n    isFixed: boolean;\n    isTitleGreyed: boolean;\n    isWrapped: boolean;\n    onClick: MouseEventHandler<HTMLDivElement>;\n    onSearchChange?: ChangeEventHandler<HTMLInputElement>;\n    rightElement?: ReactNode;\n    searchPlaceholder?: string;\n    searchValue?: string;\n    shouldRotateIcon?: boolean;\n    title: string;\n    titleElement?: ReactNode;\n    uuid: string;\n    onTitleInputChange?: ChangeEventHandler<HTMLInputElement>;\n    titleInputProps?: InputProps;\n    titleColor?: CSSProperties['color'];\n};\n\ninterface HeadHeight {\n    closed: number;\n    open: number;\n}\n\nconst AccordionHead: FC<AccordionHeadProps> = ({\n    icon,\n    isOpen,\n    isFixed,\n    isTitleGreyed,\n    isWrapped,\n    onClick,\n    onSearchChange,\n    rightElement,\n    searchPlaceholder,\n    searchValue,\n    shouldRotateIcon,\n    title,\n    titleElement,\n    uuid,\n    titleInputProps,\n    onTitleInputChange,\n    titleColor,\n}) => {\n    const [headHeight, setHeadHeight] = useState<HeadHeight>({\n        closed: isWrapped ? 40 : 33,\n        open: isWrapped ? 40 : 33,\n    });\n\n    const theme = useTheme();\n\n    const titleElementWrapperRef = useRef<HTMLDivElement>(null);\n    const titleWrapperRef = useRef<HTMLDivElement>(null);\n\n    const [internalSearchValue, setInternalSearchValue] = useState<string>();\n\n    useEffect(() => {\n        setInternalSearchValue(searchValue);\n    }, [searchValue]);\n\n    const handleOnSearchChance = (event: ChangeEvent<HTMLInputElement>) => {\n        setInternalSearchValue(event.target.value);\n        if (typeof onSearchChange === 'function') {\n            onSearchChange(event);\n        }\n    };\n\n    const titleElementChildrenSize = useElementSize(titleElementWrapperRef, {\n        shouldUseChildElement: true,\n    });\n    useEffect(() => {\n        if (typeof onTitleInputChange === 'function') {\n            setHeadHeight({ closed: 50, open: 50 });\n        } else {\n            setHeadHeight(\n                getAccordionHeadHeight({\n                    isWrapped,\n                    title,\n                    width: (titleWrapperRef.current?.clientWidth ?? 0) - 10,\n                    hasSearch: typeof onSearchChange === 'function',\n                }),\n            );\n        }\n        // The fontSize need to be included to trigger a new calculation.\n        // After the size is increased, the Title is cut at the bottom.\n    }, [isWrapped, onSearchChange, onTitleInputChange, theme.fontSize, title]);\n\n    const iconElement = useMemo(() => {\n        if (icon || isFixed) {\n            return (\n                <Icon\n                    icons={[isFixed ? 'fa fa-horizontal-rule' : (icon ?? 'fa fa-chevron-right')]}\n                />\n            );\n        }\n\n        let internalIcon = 'f105';\n\n        if (\n            theme?.accordionIcon &&\n            theme.accordionIcon !== 110 &&\n            theme.accordionIcon !== 1110100\n        ) {\n            internalIcon = (theme.accordionIcon as number).toString(16);\n        }\n\n        const internalIconStyle = theme?.iconStyle ? (theme.iconStyle as string) : 'fa-regular';\n\n        return <StyledAccordionIcon className={internalIconStyle} $icon={internalIcon} />;\n    }, [icon, theme, isFixed]);\n\n    let accordionHeadHeight = isOpen ? headHeight.open : headHeight.closed;\n\n    if (titleElementChildrenSize && titleElementChildrenSize.height > accordionHeadHeight) {\n        // If the titleElement is bigger than the title, the height of the accordion head should be increased.\n        // The height of the titleElement is increased by 8px because of the padding of the accordion head element.\n        accordionHeadHeight = titleElementChildrenSize.height + 8;\n    }\n\n    const [tmp, setTmp] = useState(true);\n\n    return (\n        <StyledMotionAccordionHead\n            animate={{ height: accordionHeadHeight }}\n            className=\"beta-chayns-accordion-head\"\n            initial={false}\n            key={`accordionHead--${uuid}`}\n        >\n            <StyledMotionIconWrapper\n                animate={{ rotate: (isOpen || isFixed) && shouldRotateIcon ? 90 : 0 }}\n                initial={false}\n                onClick={!isFixed ? onClick : undefined}\n                key={`accordionHeadIcon--${uuid}`}\n            >\n                {iconElement}\n            </StyledMotionIconWrapper>\n            <StyledMotionContentWrapper\n                animate={{ opacity: isTitleGreyed ? 0.5 : 1 }}\n                initial={false}\n                onClick={!isFixed && tmp ? onClick : undefined}\n                ref={titleWrapperRef}\n                $isWrapped={isWrapped}\n                key={`accordionHeadContentWrapper--${uuid}`}\n            >\n                {typeof onTitleInputChange === 'function' ? (\n                    // eslint-disable-next-line react/jsx-no-constructed-context-values\n                    <AreaContext.Provider value={{ shouldChangeColor: true }}>\n                        <Input\n                            {...titleInputProps}\n                            value={title}\n                            onFocus={(event) => {\n                                setTmp(false);\n\n                                if (titleInputProps?.onFocus) {\n                                    titleInputProps.onFocus(event);\n                                }\n                            }}\n                            onBlur={(event) => {\n                                setTmp(true);\n\n                                if (titleInputProps?.onBlur) {\n                                    titleInputProps.onBlur(event);\n                                }\n                            }}\n                            onChange={onTitleInputChange}\n                        />\n                    </AreaContext.Provider>\n                ) : (\n                    <LayoutGroup key={`accordionHeadLayoutGroup--${uuid}`}>\n                        <StyledMotionTitleWrapper key={`accordionHeadTitleWrapperWrapper--${uuid}`}>\n                            <AnimatePresence\n                                initial={false}\n                                key={`accordionHeadTitleWrapper--${uuid}`}\n                            >\n                                <StyledMotionTitle\n                                    animate={{ scale: 1 }}\n                                    initial={{ scale: isOpen && !isWrapped ? 1 / 1.3 : 1.3 }}\n                                    exit={{ opacity: 0 }}\n                                    $isOpen={isOpen}\n                                    $isWrapped={isWrapped}\n                                    $color={titleColor}\n                                    $hasSearch={typeof onSearchChange === 'function'}\n                                    transition={{\n                                        opacity: {\n                                            duration: 0,\n                                        },\n                                    }}\n                                    key={\n                                        isOpen && !isWrapped\n                                            ? `accordionHeadTitleBig--${uuid}`\n                                            : `accordionHeadTitle--${uuid}`\n                                    }\n                                >\n                                    {title}\n                                </StyledMotionTitle>\n                            </AnimatePresence>\n                        </StyledMotionTitleWrapper>\n                        {titleElement && (\n                            <StyledMotionTitleElementWrapper\n                                layout\n                                key={`accordionTitleElement--${uuid}`}\n                                ref={titleElementWrapperRef}\n                            >\n                                {titleElement}\n                            </StyledMotionTitleElementWrapper>\n                        )}\n                    </LayoutGroup>\n                )}\n            </StyledMotionContentWrapper>\n            {(typeof onSearchChange === 'function' || rightElement) && (\n                <StyledRightWrapper>\n                    <AnimatePresence initial={false} key={`accordionRightWrapper--${uuid}`}>\n                        {typeof onSearchChange === 'function' && isOpen && (\n                            <StyledMotionSearchWrapper\n                                animate={{ opacity: 1 }}\n                                exit={{ opacity: 0 }}\n                                initial={{ opacity: 0 }}\n                                key={`searchWrapper--${uuid}`}\n                            >\n                                <SearchInput\n                                    onChange={handleOnSearchChance}\n                                    placeholder={searchPlaceholder}\n                                    size={InputSize.Small}\n                                    value={internalSearchValue}\n                                />\n                            </StyledMotionSearchWrapper>\n                        )}\n                        {rightElement && (\n                            <StyledMotionRightElementWrapper\n                                animate={{ opacity: 1 }}\n                                exit={{ opacity: 0 }}\n                                initial={{ opacity: 0 }}\n                                key={`rightElementWrapper--${uuid}`}\n                            >\n                                {rightElement}\n                            </StyledMotionRightElementWrapper>\n                        )}\n                    </AnimatePresence>\n                </StyledRightWrapper>\n            )}\n        </StyledMotionAccordionHead>\n    );\n};\n\nAccordionHead.displayName = 'AccordionHead';\n\nexport default AccordionHead;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"AccordionHead.js","names":["AnimatePresence","LayoutGroup","React","useEffect","useMemo","useRef","useState","useTheme","useElementSize","getAccordionHeadHeight","getElementClickEvent","AreaContext","Icon","Input","InputSize","SearchInput","StyledAccordionIcon","StyledMotionAccordionHead","StyledMotionContentWrapper","StyledMotionIconWrapper","StyledMotionRightElementWrapper","StyledMotionSearchWrapper","StyledMotionTitle","StyledMotionTitleElementWrapper","StyledMotionTitleWrapper","StyledRightWrapper","AccordionHead","_ref","icon","isOpen","isFixed","isTitleGreyed","isWrapped","onClick","onSearchChange","rightElement","searchPlaceholder","searchValue","shouldRotateIcon","title","titleElement","uuid","titleInputProps","onTitleInputChange","titleColor","headHeight","setHeadHeight","closed","open","theme","titleElementWrapperRef","titleWrapperRef","internalSearchValue","setInternalSearchValue","handleOnSearchChance","event","target","value","titleElementChildrenSize","shouldUseChildElement","shouldPreventRightElementClick","width","current","clientWidth","hasSearch","fontSize","iconElement","createElement","icons","internalIcon","accordionIcon","toString","internalIconStyle","iconStyle","className","$icon","accordionHeadHeight","height","tmp","setTmp","animate","initial","key","rotate","undefined","opacity","ref","$isWrapped","Provider","shouldChangeColor","_extends","onFocus","onBlur","onChange","scale","exit","$isOpen","$color","$hasSearch","transition","duration","layout","placeholder","size","Small","displayName"],"sources":["../../../../../src/components/accordion/accordion-head/AccordionHead.tsx"],"sourcesContent":["import { AnimatePresence, LayoutGroup } from 'framer-motion';\nimport React, {\n    ChangeEvent,\n    ChangeEventHandler,\n    FC,\n    MouseEventHandler,\n    ReactNode,\n    useEffect,\n    useMemo,\n    useRef,\n    useState,\n    type CSSProperties,\n} from 'react';\nimport { useTheme } from 'styled-components';\nimport { useElementSize } from '../../../hooks/useElementSize';\nimport { getAccordionHeadHeight, getElementClickEvent } from '../../../utils/accordion';\nimport { AreaContext } from '../../area-provider/AreaContextProvider';\nimport Icon from '../../icon/Icon';\nimport Input, { InputSize, type InputProps } from '../../input/Input';\nimport SearchInput from '../../search-input/SearchInput';\nimport {\n    StyledAccordionIcon,\n    StyledMotionAccordionHead,\n    StyledMotionContentWrapper,\n    StyledMotionIconWrapper,\n    StyledMotionRightElementWrapper,\n    StyledMotionSearchWrapper,\n    StyledMotionTitle,\n    StyledMotionTitleElementWrapper,\n    StyledMotionTitleWrapper,\n    StyledRightWrapper,\n} from './AccordionHead.styles';\n\nexport type AccordionHeadProps = {\n    icon?: string;\n    isOpen: boolean;\n    isFixed: boolean;\n    isTitleGreyed: boolean;\n    isWrapped: boolean;\n    onClick: MouseEventHandler<HTMLDivElement>;\n    onSearchChange?: ChangeEventHandler<HTMLInputElement>;\n    rightElement?: ReactNode;\n    searchPlaceholder?: string;\n    searchValue?: string;\n    shouldRotateIcon?: boolean;\n    title: string;\n    titleElement?: ReactNode;\n    uuid: string;\n    onTitleInputChange?: ChangeEventHandler<HTMLInputElement>;\n    titleInputProps?: InputProps;\n    titleColor?: CSSProperties['color'];\n};\n\ninterface HeadHeight {\n    closed: number;\n    open: number;\n}\n\nconst AccordionHead: FC<AccordionHeadProps> = ({\n    icon,\n    isOpen,\n    isFixed,\n    isTitleGreyed,\n    isWrapped,\n    onClick,\n    onSearchChange,\n    rightElement,\n    searchPlaceholder,\n    searchValue,\n    shouldRotateIcon,\n    title,\n    titleElement,\n    uuid,\n    titleInputProps,\n    onTitleInputChange,\n    titleColor,\n}) => {\n    const [headHeight, setHeadHeight] = useState<HeadHeight>({\n        closed: isWrapped ? 40 : 33,\n        open: isWrapped ? 40 : 33,\n    });\n\n    const theme = useTheme();\n\n    const titleElementWrapperRef = useRef<HTMLDivElement>(null);\n    const titleWrapperRef = useRef<HTMLDivElement>(null);\n\n    const [internalSearchValue, setInternalSearchValue] = useState<string>();\n\n    useEffect(() => {\n        setInternalSearchValue(searchValue);\n    }, [searchValue]);\n\n    const handleOnSearchChance = (event: ChangeEvent<HTMLInputElement>) => {\n        setInternalSearchValue(event.target.value);\n        if (typeof onSearchChange === 'function') {\n            onSearchChange(event);\n        }\n    };\n\n    const titleElementChildrenSize = useElementSize(titleElementWrapperRef, {\n        shouldUseChildElement: true,\n    });\n\n    const shouldPreventRightElementClick = useMemo(\n        () => getElementClickEvent(rightElement),\n        [rightElement],\n    );\n\n    useEffect(() => {\n        if (typeof onTitleInputChange === 'function') {\n            setHeadHeight({ closed: 50, open: 50 });\n        } else {\n            setHeadHeight(\n                getAccordionHeadHeight({\n                    isWrapped,\n                    title,\n                    width: (titleWrapperRef.current?.clientWidth ?? 0) - 10,\n                    hasSearch: typeof onSearchChange === 'function',\n                }),\n            );\n        }\n        // The fontSize need to be included to trigger a new calculation.\n        // After the size is increased, the Title is cut at the bottom.\n    }, [isWrapped, onSearchChange, onTitleInputChange, theme.fontSize, title]);\n\n    const iconElement = useMemo(() => {\n        if (icon || isFixed) {\n            return (\n                <Icon\n                    icons={[isFixed ? 'fa fa-horizontal-rule' : (icon ?? 'fa fa-chevron-right')]}\n                />\n            );\n        }\n\n        let internalIcon = 'f105';\n\n        if (\n            theme?.accordionIcon &&\n            theme.accordionIcon !== 110 &&\n            theme.accordionIcon !== 1110100\n        ) {\n            internalIcon = (theme.accordionIcon as number).toString(16);\n        }\n\n        const internalIconStyle = theme?.iconStyle ? (theme.iconStyle as string) : 'fa-regular';\n\n        return <StyledAccordionIcon className={internalIconStyle} $icon={internalIcon} />;\n    }, [icon, theme, isFixed]);\n\n    let accordionHeadHeight = isOpen ? headHeight.open : headHeight.closed;\n\n    if (titleElementChildrenSize && titleElementChildrenSize.height > accordionHeadHeight) {\n        // If the titleElement is bigger than the title, the height of the accordion head should be increased.\n        // The height of the titleElement is increased by 8px because of the padding of the accordion head element.\n        accordionHeadHeight = titleElementChildrenSize.height + 8;\n    }\n\n    const [tmp, setTmp] = useState(true);\n\n    return (\n        <StyledMotionAccordionHead\n            animate={{ height: accordionHeadHeight }}\n            className=\"beta-chayns-accordion-head\"\n            initial={false}\n            key={`accordionHead--${uuid}`}\n        >\n            <StyledMotionIconWrapper\n                animate={{ rotate: (isOpen || isFixed) && shouldRotateIcon ? 90 : 0 }}\n                initial={false}\n                onClick={!isFixed ? onClick : undefined}\n                key={`accordionHeadIcon--${uuid}`}\n            >\n                {iconElement}\n            </StyledMotionIconWrapper>\n            <StyledMotionContentWrapper\n                animate={{ opacity: isTitleGreyed ? 0.5 : 1 }}\n                initial={false}\n                onClick={!isFixed && tmp ? onClick : undefined}\n                ref={titleWrapperRef}\n                $isWrapped={isWrapped}\n                key={`accordionHeadContentWrapper--${uuid}`}\n            >\n                {typeof onTitleInputChange === 'function' ? (\n                    // eslint-disable-next-line react/jsx-no-constructed-context-values\n                    <AreaContext.Provider value={{ shouldChangeColor: true }}>\n                        <Input\n                            {...titleInputProps}\n                            value={title}\n                            onFocus={(event) => {\n                                setTmp(false);\n\n                                if (titleInputProps?.onFocus) {\n                                    titleInputProps.onFocus(event);\n                                }\n                            }}\n                            onBlur={(event) => {\n                                setTmp(true);\n\n                                if (titleInputProps?.onBlur) {\n                                    titleInputProps.onBlur(event);\n                                }\n                            }}\n                            onChange={onTitleInputChange}\n                        />\n                    </AreaContext.Provider>\n                ) : (\n                    <LayoutGroup key={`accordionHeadLayoutGroup--${uuid}`}>\n                        <StyledMotionTitleWrapper key={`accordionHeadTitleWrapperWrapper--${uuid}`}>\n                            <AnimatePresence\n                                initial={false}\n                                key={`accordionHeadTitleWrapper--${uuid}`}\n                            >\n                                <StyledMotionTitle\n                                    animate={{ scale: 1 }}\n                                    initial={{ scale: isOpen && !isWrapped ? 1 / 1.3 : 1.3 }}\n                                    exit={{ opacity: 0 }}\n                                    $isOpen={isOpen}\n                                    $isWrapped={isWrapped}\n                                    $color={titleColor}\n                                    $hasSearch={typeof onSearchChange === 'function'}\n                                    transition={{\n                                        opacity: {\n                                            duration: 0,\n                                        },\n                                    }}\n                                    key={\n                                        isOpen && !isWrapped\n                                            ? `accordionHeadTitleBig--${uuid}`\n                                            : `accordionHeadTitle--${uuid}`\n                                    }\n                                >\n                                    {title}\n                                </StyledMotionTitle>\n                            </AnimatePresence>\n                        </StyledMotionTitleWrapper>\n                        {titleElement && (\n                            <StyledMotionTitleElementWrapper\n                                layout\n                                key={`accordionTitleElement--${uuid}`}\n                                ref={titleElementWrapperRef}\n                            >\n                                {titleElement}\n                            </StyledMotionTitleElementWrapper>\n                        )}\n                    </LayoutGroup>\n                )}\n            </StyledMotionContentWrapper>\n            {(typeof onSearchChange === 'function' || rightElement) && (\n                <StyledRightWrapper>\n                    <AnimatePresence initial={false} key={`accordionRightWrapper--${uuid}`}>\n                        {typeof onSearchChange === 'function' && isOpen && (\n                            <StyledMotionSearchWrapper\n                                animate={{ opacity: 1 }}\n                                exit={{ opacity: 0 }}\n                                initial={{ opacity: 0 }}\n                                key={`searchWrapper--${uuid}`}\n                            >\n                                <SearchInput\n                                    onChange={handleOnSearchChance}\n                                    placeholder={searchPlaceholder}\n                                    size={InputSize.Small}\n                                    value={internalSearchValue}\n                                />\n                            </StyledMotionSearchWrapper>\n                        )}\n                        {rightElement && (\n                            <StyledMotionRightElementWrapper\n                                animate={{ opacity: 1 }}\n                                exit={{ opacity: 0 }}\n                                initial={{ opacity: 0 }}\n                                key={`rightElementWrapper--${uuid}`}\n                                onClick={\n                                    !isFixed && !shouldPreventRightElementClick\n                                        ? onClick\n                                        : undefined\n                                }\n                            >\n                                {rightElement}\n                            </StyledMotionRightElementWrapper>\n                        )}\n                    </AnimatePresence>\n                </StyledRightWrapper>\n            )}\n        </StyledMotionAccordionHead>\n    );\n};\n\nAccordionHead.displayName = 'AccordionHead';\n\nexport default AccordionHead;\n"],"mappings":"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","ignoreList":[]}

package/lib/esm/components/accordion/accordion-head/AccordionHead.styles.js

@@ -150,31 +150,38 @@ export const StyledMotionRightElementWrapper = styled(motion.div)`
     align-items: center;
     display: flex;
 
+    cursor: ${_ref13 => {
+  let {
+    onClick
+  } = _ref13;
+  return typeof onClick === 'function' ? 'pointer' : 'default';
+}};
+
     will-change: unset !important;
 `;
 export const StyledMotionRightInput = styled(motion.input)`
     background-color: transparent;
     border: 1px solid transparent;
     border-bottom-color: rgba(
-        ${_ref13 => {
+        ${_ref14 => {
   let {
     theme
-  } = _ref13;
+  } = _ref14;
   return theme['headline-rgb'];
 }},
         0.45
     );
-    color: ${_ref14 => {
+    color: ${_ref15 => {
   let {
     theme
-  } = _ref14;
+  } = _ref15;
   return theme.text;
 }};
     grid-area: header;
-    padding: ${_ref15 => {
+    padding: ${_ref16 => {
   let {
     $hasIcon
-  } = _ref15;
+  } = _ref16;
   return $hasIcon ? '5px 23px 5px 1px' : '5px 1px';
 }};
 `;

package/lib/esm/components/accordion/accordion-head/AccordionHead.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"AccordionHead.styles.js","names":["motion","styled","css","StyledMotionAccordionHead","div","_ref","theme","text","StyledMotionIconWrapper","_ref2","onClick","StyledAccordionIcon","i","_ref3","headline","_ref4","$icon","StyledMotionContentWrapper","_ref5","_ref6","$isWrapped","StyledMotionTitleWrapper","StyledMotionTitle","_ref7","$isOpen","undefined","_ref8","_ref9","$hasSearch","_ref10","$color","_ref11","_ref12","StyledMotionTitleElementWrapper","StyledRightWrapper","StyledMotionSearchWrapper","StyledMotionRightElementWrapper","StyledMotionRightInput","input","_ref13","_ref14","_ref15","$hasIcon","StyledMotionRightInputIconWrapper"],"sources":["../../../../../src/components/accordion/accordion-head/AccordionHead.styles.ts"],"sourcesContent":["import { motion } from 'framer-motion';\nimport type { CSSProperties } from 'react';\nimport styled, { css } from 'styled-components';\nimport type {\n    FramerMotionBugFix,\n    WithTheme,\n} from '../../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledMotionAccordionHeadProps = WithTheme<unknown>;\n\nexport const StyledMotionAccordionHead = styled(motion.div)<StyledMotionAccordionHeadProps>`\n    align-items: center;\n    color: ${({ theme }: StyledMotionAccordionHeadProps) => theme.text};\n    display: flex;\n    overflow: hidden;\n    padding: 4px 0;\n`;\n\nexport const StyledMotionIconWrapper = styled(motion.div)<FramerMotionBugFix>`\n    align-items: center;\n    cursor: ${({ onClick }) => (typeof onClick === 'function' ? 'pointer' : 'default')};\n    display: flex;\n    flex: 0 0 auto;\n    height: 25px;\n    justify-content: center;\n    width: 25px;\n`;\n\ntype StyledAccordionIconProps = WithTheme<{ $icon: string }>;\n\nexport const StyledAccordionIcon = styled.i<StyledAccordionIconProps>`\n    align-items: center;\n    justify-content: center;\n    display: flex;\n    color: ${({ theme }: StyledAccordionIconProps) => theme.headline};\n\n    &:before {\n        content: ${({ $icon }) => `\"\\\\${$icon}\"`};\n        font-family: 'Font Awesome 6 Pro', Fontawesome !important;\n    }\n`;\n\ntype StyledMotionContentWrapperProps = WithTheme<{ $isWrapped: boolean }>;\n\nexport const StyledMotionContentWrapper = styled(motion.div)<StyledMotionContentWrapperProps>`\n    align-self: flex-start;\n    cursor: ${({ onClick }) => (typeof onClick === 'function' ? 'pointer' : 'default')};\n    display: flex;\n    flex: 1 1 auto;\n    height: 100%;\n    overflow: hidden;\n    margin-right: 10px;\n\n    ${({ $isWrapped }) =>\n        $isWrapped &&\n        css`\n            align-items: center;\n        `}\n`;\n\nexport const StyledMotionTitleWrapper = styled(motion.div)<FramerMotionBugFix>`\n    display: grid;\n    flex: 0 1 auto;\n    grid-template-areas: 'header';\n`;\n\ntype StyledMotionTitleProps = WithTheme<{\n    $isOpen: boolean;\n    $isWrapped: boolean;\n    $color?: CSSProperties['color'];\n    $hasSearch: boolean;\n}>;\n\nexport const StyledMotionTitle = styled(motion.div)<StyledMotionTitleProps>`\n    font-size: ${({ $isOpen, $isWrapped }) => ($isOpen && !$isWrapped ? '1.3rem' : undefined)};\n    font-weight: ${({ $isOpen, $isWrapped }) => ($isOpen && $isWrapped ? 700 : 'normal')};\n    grid-area: header;\n    height: ${({ $isWrapped, $hasSearch }) => ($isWrapped || $hasSearch ? '100%' : undefined)};\n    overflow: hidden;\n    text-overflow: ellipsis;\n    transform-origin: top left;\n    user-select: none;\n    color: ${({ $color, theme }: StyledMotionTitleProps) => $color ?? theme.text};\n    white-space: ${({ $isOpen, $isWrapped, $hasSearch }) =>\n        $isOpen && !$isWrapped && !$hasSearch ? 'normal' : 'nowrap'};\n\n    will-change: unset !important;\n\n    ${({ $isWrapped }) =>\n        $isWrapped &&\n        css`\n            align-content: center;\n        `}\n`;\n\nexport const StyledMotionTitleElementWrapper = styled(motion.div)<FramerMotionBugFix>`\n    align-items: center;\n    display: flex;\n    margin-left: 8px;\n`;\n\nexport const StyledRightWrapper = styled.div`\n    display: flex;\n    flex: 0 0 auto;\n    gap: 8px;\n    margin-right: 5px;\n    overflow: hidden;\n    position: relative;\n`;\n\nexport const StyledMotionSearchWrapper = styled(motion.div)<FramerMotionBugFix>`\n    align-items: center;\n    display: flex;\n`;\n\nexport const StyledMotionRightElementWrapper = styled(motion.div)<FramerMotionBugFix>`\n    align-items: center;\n    display: flex;\n\n    will-change: unset !important;\n`;\n\ntype StyledMotionRightInputProps = WithTheme<{\n    $hasIcon: boolean;\n}>;\n\nexport const StyledMotionRightInput = styled(motion.input)<StyledMotionRightInputProps>`\n    background-color: transparent;\n    border: 1px solid transparent;\n    border-bottom-color: rgba(\n        ${({ theme }: StyledMotionRightInputProps) => theme['headline-rgb']},\n        0.45\n    );\n    color: ${({ theme }: StyledMotionRightInputProps) => theme.text};\n    grid-area: header;\n    padding: ${({ $hasIcon }) => ($hasIcon ? '5px 23px 5px 1px' : '5px 1px')};\n`;\n\nexport const StyledMotionRightInputIconWrapper = styled(motion.div)<FramerMotionBugFix>`\n    align-items: center;\n    display: flex;\n    height: 100%;\n    justify-content: center;\n    position: absolute;\n    right: 4px;\n    top: 0;\n`;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"AccordionHead.styles.js","names":["motion","styled","css","StyledMotionAccordionHead","div","_ref","theme","text","StyledMotionIconWrapper","_ref2","onClick","StyledAccordionIcon","i","_ref3","headline","_ref4","$icon","StyledMotionContentWrapper","_ref5","_ref6","$isWrapped","StyledMotionTitleWrapper","StyledMotionTitle","_ref7","$isOpen","undefined","_ref8","_ref9","$hasSearch","_ref10","$color","_ref11","_ref12","StyledMotionTitleElementWrapper","StyledRightWrapper","StyledMotionSearchWrapper","StyledMotionRightElementWrapper","_ref13","StyledMotionRightInput","input","_ref14","_ref15","_ref16","$hasIcon","StyledMotionRightInputIconWrapper"],"sources":["../../../../../src/components/accordion/accordion-head/AccordionHead.styles.ts"],"sourcesContent":["import { motion } from 'framer-motion';\nimport type { CSSProperties } from 'react';\nimport styled, { css } from 'styled-components';\nimport type {\n    FramerMotionBugFix,\n    WithTheme,\n} from '../../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledMotionAccordionHeadProps = WithTheme<unknown>;\n\nexport const StyledMotionAccordionHead = styled(motion.div)<StyledMotionAccordionHeadProps>`\n    align-items: center;\n    color: ${({ theme }: StyledMotionAccordionHeadProps) => theme.text};\n    display: flex;\n    overflow: hidden;\n    padding: 4px 0;\n`;\n\nexport const StyledMotionIconWrapper = styled(motion.div)<FramerMotionBugFix>`\n    align-items: center;\n    cursor: ${({ onClick }) => (typeof onClick === 'function' ? 'pointer' : 'default')};\n    display: flex;\n    flex: 0 0 auto;\n    height: 25px;\n    justify-content: center;\n    width: 25px;\n`;\n\ntype StyledAccordionIconProps = WithTheme<{ $icon: string }>;\n\nexport const StyledAccordionIcon = styled.i<StyledAccordionIconProps>`\n    align-items: center;\n    justify-content: center;\n    display: flex;\n    color: ${({ theme }: StyledAccordionIconProps) => theme.headline};\n\n    &:before {\n        content: ${({ $icon }) => `\"\\\\${$icon}\"`};\n        font-family: 'Font Awesome 6 Pro', Fontawesome !important;\n    }\n`;\n\ntype StyledMotionContentWrapperProps = WithTheme<{ $isWrapped: boolean }>;\n\nexport const StyledMotionContentWrapper = styled(motion.div)<StyledMotionContentWrapperProps>`\n    align-self: flex-start;\n    cursor: ${({ onClick }) => (typeof onClick === 'function' ? 'pointer' : 'default')};\n    display: flex;\n    flex: 1 1 auto;\n    height: 100%;\n    overflow: hidden;\n    margin-right: 10px;\n\n    ${({ $isWrapped }) =>\n        $isWrapped &&\n        css`\n            align-items: center;\n        `}\n`;\n\nexport const StyledMotionTitleWrapper = styled(motion.div)<FramerMotionBugFix>`\n    display: grid;\n    flex: 0 1 auto;\n    grid-template-areas: 'header';\n`;\n\ntype StyledMotionTitleProps = WithTheme<{\n    $isOpen: boolean;\n    $isWrapped: boolean;\n    $color?: CSSProperties['color'];\n    $hasSearch: boolean;\n}>;\n\nexport const StyledMotionTitle = styled(motion.div)<StyledMotionTitleProps>`\n    font-size: ${({ $isOpen, $isWrapped }) => ($isOpen && !$isWrapped ? '1.3rem' : undefined)};\n    font-weight: ${({ $isOpen, $isWrapped }) => ($isOpen && $isWrapped ? 700 : 'normal')};\n    grid-area: header;\n    height: ${({ $isWrapped, $hasSearch }) => ($isWrapped || $hasSearch ? '100%' : undefined)};\n    overflow: hidden;\n    text-overflow: ellipsis;\n    transform-origin: top left;\n    user-select: none;\n    color: ${({ $color, theme }: StyledMotionTitleProps) => $color ?? theme.text};\n    white-space: ${({ $isOpen, $isWrapped, $hasSearch }) =>\n        $isOpen && !$isWrapped && !$hasSearch ? 'normal' : 'nowrap'};\n\n    will-change: unset !important;\n\n    ${({ $isWrapped }) =>\n        $isWrapped &&\n        css`\n            align-content: center;\n        `}\n`;\n\nexport const StyledMotionTitleElementWrapper = styled(motion.div)<FramerMotionBugFix>`\n    align-items: center;\n    display: flex;\n    margin-left: 8px;\n`;\n\nexport const StyledRightWrapper = styled.div`\n    display: flex;\n    flex: 0 0 auto;\n    gap: 8px;\n    margin-right: 5px;\n    overflow: hidden;\n    position: relative;\n`;\n\nexport const StyledMotionSearchWrapper = styled(motion.div)<FramerMotionBugFix>`\n    align-items: center;\n    display: flex;\n`;\n\nexport const StyledMotionRightElementWrapper = styled(motion.div)<FramerMotionBugFix>`\n    align-items: center;\n    display: flex;\n\n    cursor: ${({ onClick }) => (typeof onClick === 'function' ? 'pointer' : 'default')};\n\n    will-change: unset !important;\n`;\n\ntype StyledMotionRightInputProps = WithTheme<{\n    $hasIcon: boolean;\n}>;\n\nexport const StyledMotionRightInput = styled(motion.input)<StyledMotionRightInputProps>`\n    background-color: transparent;\n    border: 1px solid transparent;\n    border-bottom-color: rgba(\n        ${({ theme }: StyledMotionRightInputProps) => theme['headline-rgb']},\n        0.45\n    );\n    color: ${({ theme }: StyledMotionRightInputProps) => theme.text};\n    grid-area: header;\n    padding: ${({ $hasIcon }) => ($hasIcon ? '5px 23px 5px 1px' : '5px 1px')};\n`;\n\nexport const StyledMotionRightInputIconWrapper = styled(motion.div)<FramerMotionBugFix>`\n    align-items: center;\n    display: flex;\n    height: 100%;\n    justify-content: center;\n    position: absolute;\n    right: 4px;\n    top: 0;\n`;\n"],"mappings":"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","ignoreList":[]}

package/lib/esm/components/combobox/ComboBox.js

@@ -16,7 +16,7 @@ const ComboBox = _ref => {
     maxHeight = '280px',
     onSelect,
     placeholder,
-    container = document.body,
+    container,
     selectedItem,
     shouldShowBigImage,
     shouldShowRoundImage,
@@ -38,19 +38,27 @@ const ComboBox = _ref => {
     x: 0,
     y: 0
   });
+  const [newContainer, setNewContainer] = useState(container ?? null);
   const styledComboBoxElementRef = useRef(null);
   const contentRef = useRef(null);
   const {
     browser
   } = useDevice();
   const isTouch = getIsTouch();
+  useEffect(() => {
+    if (styledComboBoxElementRef.current && !container) {
+      const el = styledComboBoxElementRef.current;
+      const element = el.closest('.dialog-inner') || el.closest('body');
+      setNewContainer(element);
+    }
+  }, [container]);
   const handleClick = useCallback(event => {
     if (styledComboBoxElementRef.current && !styledComboBoxElementRef.current.contains(event.target) && contentRef.current && !contentRef.current.contains(event.target)) {
       setIsAnimating(false);
     }
   }, [styledComboBoxElementRef]);
   const handleOpen = useCallback(() => {
-    if (styledComboBoxElementRef.current) {
+    if (styledComboBoxElementRef.current && newContainer) {
       const {
         left: comboBoxLeft,
         top: comboBoxTop,
@@ -59,16 +67,16 @@ const ComboBox = _ref => {
       const {
         left: containerLeft,
         top: containerTop
-      } = container.getBoundingClientRect();
-      const x = comboBoxLeft - containerLeft + container.scrollLeft;
-      const y = comboBoxTop - containerTop + container.scrollTop;
+      } = newContainer.getBoundingClientRect();
+      const x = comboBoxLeft - containerLeft + newContainer.scrollLeft;
+      const y = comboBoxTop - containerTop + newContainer.scrollTop;
       setInternalCoordinates({
         x,
         y: direction === ComboBoxDirection.TOP ? y : y + height
       });
       setIsAnimating(true);
     }
-  }, [container, direction]);
+  }, [newContainer, direction]);
   const handleClose = useCallback(() => {
     setIsAnimating(false);
   }, []);
@@ -290,6 +298,9 @@ const ComboBox = _ref => {
     return styles;
   }, [direction, internalCoordinates.x, internalCoordinates.y]);
   useEffect(() => {
+    if (!newContainer) {
+      return;
+    }
     setPortal(() => /*#__PURE__*/createPortal(/*#__PURE__*/React.createElement(AnimatePresence, {
       initial: false
     }, isAnimating && /*#__PURE__*/React.createElement(StyledMotionComboBoxBody, {
@@ -316,8 +327,8 @@ const ComboBox = _ref => {
       },
       tabIndex: 0,
       ref: contentRef
-    }, comboBoxGroups)), container));
-  }, [bodyMinWidth, bodyStyles, browser?.name, comboBoxGroups, container, direction, isAnimating, maxHeight, minWidth, overflowY]);
+    }, comboBoxGroups)), newContainer));
+  }, [bodyMinWidth, bodyStyles, browser?.name, comboBoxGroups, newContainer, direction, isAnimating, maxHeight, minWidth, overflowY]);
   return useMemo(() => /*#__PURE__*/React.createElement(StyledComboBox, {
     ref: styledComboBoxElementRef,
     $shouldUseFullWidth: shouldUseFullWidth,

package/lib/esm/components/combobox/ComboBox.js.map

@@ -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","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","shouldPreventSelection","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","textStyles","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    ChangeEventHandler,\n    FC,\n    FocusEventHandler,\n    ReactHTML,\n    ReactPortal,\n    useCallback,\n    useEffect,\n    useMemo,\n    useRef,\n    useState,\n    type CSSProperties,\n    type ReactNode,\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 ComboBoxTextStyles {\n    tagName?: keyof ReactHTML;\n    styles?: CSSProperties;\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    textStyles?: ComboBoxTextStyles;\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. If the function returns false, the item will not be selected.\n     */\n    onSelect?: (comboboxItem: IComboBoxItem) => boolean | 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            if (typeof onSelect === 'function') {\n                const shouldPreventSelection = onSelect(itemToSelect) === false;\n\n                if (shouldPreventSelection) return;\n            }\n\n            setInternalSelectedItem(itemToSelect);\n            setIsAnimating(false);\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\n            tmpBodyMinWidth =\n                parentWidth < calculatedWidth - 20 ? calculatedWidth - 20 : 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 - 20 ? calculatedWidth - 20 : 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                            textStyles={item.textStyles}\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,IAMRC,WAAW,EACXC,SAAS,EACTC,OAAO,EACPC,MAAM,EACNC,QAAQ,QAGL,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;AA0F1B,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;IAC7B,IAAI,OAAOzD,QAAQ,KAAK,UAAU,EAAE;MAChC,MAAM0D,sBAAsB,GAAG1D,QAAQ,CAACyD,YAAY,CAAC,KAAK,KAAK;MAE/D,IAAIC,sBAAsB,EAAE;IAChC;IAEA3C,uBAAuB,CAAC0C,YAAY,CAAC;IACrCxC,cAAc,CAAC,KAAK,CAAC;EACzB,CAAC,EACD,CAACjB,QAAQ,CACb,CAAC;EAED1B,SAAS,CAAC,MAAM;IACZ,MAAMqF,cAAc,GAAG1B,UAAU,CAACK,OAAO;IAEzC,IAAIZ,MAAM,IAAIV,WAAW,IAAI2C,cAAc,EAAE;MACzC,MAAMC,YAAY,GAAGD,cAAc,CAACC,YAAY,IAAI,CAAC;MAErD,MAAMC,iBAAiB,GAAGhF,oBAAoB,CAC1CkB,SAAS,EACTiC,wBAAwB,CAACM,OAAO,IAAInC,QAAQ,CAACC,IACjD,CAAC;MAEDqB,YAAY,CAACmC,YAAY,GAAGC,iBAAiB,GAAG,QAAQ,GAAG,QAAQ,CAAC;IACxE;EACJ,CAAC,EAAE,CAAC7C,WAAW,EAAEjB,SAAS,EAAE2B,MAAM,CAAC,CAAC;EAEpCpD,SAAS,CAAC,MAAM;IACZ,MAAMwF,aAAa,GAAIC,CAAgB,IAAK;MACxC,IAAI,CAAC/C,WAAW,EAAE;QACd;MACJ;MAEA,IAAI+C,CAAC,CAACC,GAAG,KAAK,SAAS,IAAID,CAAC,CAACC,GAAG,KAAK,WAAW,EAAE;QAC9CD,CAAC,CAACE,cAAc,CAAC,CAAC;QAClB,MAAMC,QAAQ,GAAGjC,UAAU,CAACK,OAAO,EAAE4B,QAAQ;QAC7C,IAAIA,QAAQ,IAAIA,QAAQ,CAACC,MAAM,GAAG,CAAC,EAAE;UACjC,MAAMC,QAAQ,GACV9C,YAAY,KAAK,IAAI,GACf,CAACA,YAAY,IAAIyC,CAAC,CAACC,GAAG,KAAK,SAAS,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,GAAGE,QAAQ,CAACC,MAAM,IAChED,QAAQ,CAACC,MAAM,GACf,CAAC;UAEX,IAAI7C,YAAY,KAAK,IAAI,EAAE;YACvB,MAAM+C,WAAW,GAAGH,QAAQ,CAAC5C,YAAY,CAAmB;YAC5D+C,WAAW,CAACC,QAAQ,GAAG,CAAC,CAAC;UAC7B;UAEA/C,eAAe,CAAC6C,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,IAAI1C,YAAY,KAAK,IAAI,EAAE;QACnD,MAAMmD,OAAO,GAAGxC,UAAU,CAACK,OAAO,EAAE4B,QAAQ,CAAC5C,YAAY,CAAC;QAE1D,IAAI,CAACmD,OAAO,EAAE;UACV;QACJ;QAEA,MAAM;UAAEC;QAAG,CAAC,GAAGD,OAAO;QAEtB,IAAIE,eAA0C;QAE9C7E,KAAK,CAAC8E,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;QAEAnB,qBAAqB,CAACmB,eAAe,CAAC;MAC1C;IACJ,CAAC;IAEDxE,QAAQ,CAACmD,gBAAgB,CAAC,SAAS,EAAEQ,aAAa,CAAC;IAEnD,OAAO,MAAM;MACT3D,QAAQ,CAACoD,mBAAmB,CAAC,SAAS,EAAEO,aAAa,CAAC;IAC1D,CAAC;EACL,CAAC,EAAE,CAACxC,YAAY,EAAEkC,qBAAqB,EAAExC,WAAW,EAAElB,KAAK,CAAC,CAAC;;EAE7D;AACJ;AACA;EACIxB,SAAS,CAAC,MAAM;IACZ,MAAM6G,QAAQ,GAAGrF,KAAK,CAACsF,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,GACb3D,wBAAwB,CAACM,OAAO,EAAEsD,aAAa,EAAE7C,qBAAqB,CAAC,CAAC,CAAC8C,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,GAAGrH,qBAAqB,CAAC,CACpC,GAAGuG,QAAQ,EACX;MAAEe,IAAI,EAAEjG,WAAW;MAAE+E,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,IAAI1F,kBAAkB,EAAE;MACpB2F,WAAW,GAAGT,WAAW;MAEzBU,eAAe,GACXV,WAAW,GAAGQ,eAAe,GAAG,EAAE,GAAGA,eAAe,GAAG,EAAE,GAAGR,WAAW;IAC/E;;IAEA;IAAA,KACK,IAAIhF,yBAAyB,IAAIG,oBAAoB,EAAE;MACxD,MAAMwF,SAAS,GACX1H,qBAAqB,CAAC,CAACkC,oBAAoB,CAAC,CAAC,GAC7CgF,YAAY,GACZC,UAAU,GACVC,SAAS;MAEbI,WAAW,GAAGE,SAAS;MAEvBD,eAAe,GAAGC,SAAS,GAAGH,eAAe,GAAG,EAAE,GAAGA,eAAe,GAAG,EAAE,GAAGG,SAAS;IACzF;IAEAnF,WAAW,CAACiF,WAAW,CAAC;IACxB/E,eAAe,CAACgF,eAAe,CAAC;EACpC,CAAC,EAAE,CAACvG,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,MAAMkG,mBAAmB,GAAGhI,OAAO,CAAC,MAAM;IACtC,IAAI8B,YAAY,EAAE;MACd,OAAOA,YAAY,CAACkF,QAAQ;IAChC;IAEA,IAAIzE,oBAAoB,EAAE;MACtB,OAAOA,oBAAoB,CAACyE,QAAQ;IACxC;IAEA,OAAOiB,SAAS;EACpB,CAAC,EAAE,CAAC1F,oBAAoB,EAAET,YAAY,CAAC,CAAC;EAExC,MAAMoG,eAAe,GAAGlI,OAAO,CAAC,MAAM;IAClC,IAAI8B,YAAY,EAAE;MACd,OAAOA,YAAY,CAACqF,KAAK;IAC7B;IAEA,IAAI5E,oBAAoB,EAAE;MACtB,OAAOA,oBAAoB,CAAC4E,KAAK;IACrC;IAEA,OAAOc,SAAS;EACpB,CAAC,EAAE,CAAC1F,oBAAoB,EAAET,YAAY,CAAC,CAAC;;EAExC;AACJ;AACA;EACI,MAAMqG,eAAe,GAAGnI,OAAO,CAAC,MAAM;IAClC,IAAI2H,IAAI,GAAGjG,WAAW;IAEtB,IAAII,YAAY,EAAE;MACd6F,IAAI,GAAG7F,YAAY,CAAC6F,IAAI;IAC5B,CAAC,MAAM,IAAIpF,oBAAoB,EAAE;MAC7BoF,IAAI,GAAGpF,oBAAoB,CAACoF,IAAI;IACpC;IAEA,OAAOA,IAAI;EACf,CAAC,EAAE,CAACpF,oBAAoB,EAAEb,WAAW,EAAEI,YAAY,CAAC,CAAC;;EAErD;AACJ;AACA;EACI,MAAMsG,iBAAiB,GAAGtI,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,MAAM+G,cAAc,GAAGrI,OAAO,CAC1B,MACIuB,KAAK,CAAC+G,GAAG,CAACC,KAAA;IAAA,IAAC;MAAEC,SAAS;MAAElC;IAAK,CAAC,GAAAiC,KAAA;IAAA,oBAC1B1I,KAAA,CAAA4I,aAAA;MAAKhD,GAAG,EAAE+C,SAAS,IAAI;IAAgB,GAClCA,SAAS,IAAIjH,KAAK,CAACqE,MAAM,GAAG,CAAC,iBAC1B/F,KAAA,CAAA4I,aAAA,CAACzH,mBAAmB,QAAEwH,SAA+B,CACxD,EACAlC,IAAI,CAACgC,GAAG,CAAEI,IAAI;IAAA;IACX;IACA7I,KAAA,CAAA4I,aAAA,CAAChI,YAAY;MACT0G,KAAK,EAAEuB,IAAI,CAACvB,KAAM;MAClBhB,EAAE,EAAEuC,IAAI,CAACjC,KAAM;MACfO,QAAQ,EAAE0B,IAAI,CAAC1B,QAAS;MACxB1F,UAAU,EAAEoH,IAAI,CAACpH,UAAW;MAC5BqH,UAAU,EAAE7G,YAAY,GAAG4G,IAAI,CAACjC,KAAK,KAAK3E,YAAY,CAAC2E,KAAK,GAAG,KAAM;MACrEhB,GAAG,EAAEiD,IAAI,CAACjC,KAAM;MAChBhF,QAAQ,EAAEwD,qBAAsB;MAChC2D,YAAY,EAAEF,IAAI,CAACE,YAAa;MAChC7G,kBAAkB,EAAEA,kBAAmB;MACvCC,oBAAoB,EAAEA,oBAAqB;MAC3C6G,OAAO,EAAEH,IAAI,CAACG,OAAQ;MACtBC,aAAa,EAAEJ,IAAI,CAACI,aAAc;MAClCnB,IAAI,EAAEe,IAAI,CAACf,IAAK;MAChBlB,KAAK,EAAEiC,IAAI,CAACjC,KAAM;MAClBsC,UAAU,EAAEL,IAAI,CAACK;IAAW,CAC/B,CACJ,CACA,CAAC;EAAA,CACT,CAAC,EACN,CAAC9D,qBAAqB,EAAE1D,KAAK,EAAEO,YAAY,EAAEC,kBAAkB,EAAEC,oBAAoB,CACzF,CAAC;EAED,MAAMgH,UAAU,GAAGhJ,OAAO,CAAC,MAAM;IAC7B,IAAIiJ,MAAqB,GAAG;MAAE9E,IAAI,EAAEd,mBAAmB,CAACE,CAAC;MAAEc,GAAG,EAAEhB,mBAAmB,CAACG;IAAE,CAAC;IAEvF,IAAIpC,SAAS,KAAKhB,iBAAiB,CAACyE,GAAG,EAAE;MACrCoE,MAAM,GAAG;QAAE,GAAGA,MAAM;QAAEC,SAAS,EAAE;MAAoB,CAAC;IAC1D;IAEA,OAAOD,MAAM;EACjB,CAAC,EAAE,CAAC7H,SAAS,EAAEiC,mBAAmB,CAACE,CAAC,EAAEF,mBAAmB,CAACG,CAAC,CAAC,CAAC;EAE7DzD,SAAS,CAAC,MAAM;IACZqD,SAAS,CAAC,mBACNjD,YAAY,cACRN,KAAA,CAAA4I,aAAA,CAAC7I,eAAe;MAACuJ,OAAO,EAAE;IAAM,GAC3B1G,WAAW,iBACR5C,KAAA,CAAA4I,aAAA,CAACxH,wBAAwB;MACrBmI,QAAQ,EAAEzF,OAAO,EAAE0F,IAAK;MACxBC,OAAO,EAAE;QAAE/E,MAAM,EAAE,aAAa;QAAEgF,OAAO,EAAE;MAAE,CAAE;MAC/CC,UAAU,EAAEvG,SAAU;MACtBkG,OAAO,EAAE;QAAE5E,MAAM,EAAE,CAAC;QAAEgF,OAAO,EAAE;MAAE,CAAE;MACnCE,IAAI,EAAE;QAAElF,MAAM,EAAE,CAAC;QAAEgF,OAAO,EAAE;MAAE,CAAE;MAChCG,UAAU,EAAElI,SAAU;MACtBmI,SAAS,EAAE9G,YAAa;MACxB+G,KAAK,EAAEZ,UAAW;MAClBa,UAAU,EAAEzI,SAAU;MACtB0I,UAAU,EAAE;QAAEC,QAAQ,EAAE;MAAI,CAAE;MAC9BhE,QAAQ,EAAE,CAAE;MACZiE,GAAG,EAAEtG;IAAW,GAEf2E,cACqB,CAEjB,CAAC,EAClB1G,SACJ,CACJ,CAAC;EACL,CAAC,EAAE,CACCkB,YAAY,EACZmG,UAAU,EACVrF,OAAO,EAAE0F,IAAI,EACbhB,cAAc,EACd1G,SAAS,EACTP,SAAS,EACTqB,WAAW,EACXjB,SAAS,EACTmB,QAAQ,EACRM,SAAS,CACZ,CAAC;EAEF,OAAOjD,OAAO,CACV,mBACIH,KAAA,CAAA4I,aAAA,CAAC/H,cAAc;IACXsJ,GAAG,EAAEvG,wBAAyB;IAC9BwG,mBAAmB,EAAE/H,kBAAmB;IACxCyH,SAAS,EAAEhH;EAAS,gBAEpB9C,KAAA,CAAA4I,aAAA,CAAC9H,oBAAoB;IACjBkJ,UAAU,EAAEzI,SAAU;IACtB8I,OAAO,EAAE9B,iBAAkB;IAC3B+B,OAAO,EAAE1H,WAAY;IACrB2H,QAAQ,EAAExG,OAAQ;IAClByG,WAAW,EAAE/I;EAAW,GAEvB,OAAOgB,UAAU,KAAK,QAAQ,gBAC3BzC,KAAA,CAAA4I,aAAA,CAAC5H,mBAAmB;IAChByJ,QAAQ,EAAEhJ,UAAW;IACrBmF,KAAK,EAAEnE,UAAW;IAClBiI,QAAQ,EAAEpI,aAAc;IACxBqI,MAAM,EAAEnI,WAAY;IACpBoI,OAAO,EAAExI,YAAa;IACtBP,WAAW,EAAEyG;EAAgB,CAChC,CAAC,gBAEFtI,KAAA,CAAA4I,aAAA,CAAC3H,yBAAyB;IACtB4J,oBAAoB,EAAE,CAAC5I,YAAY,IAAI,CAACS;EAAqB,GAE5DyF,mBAAmB,iBAChBnI,KAAA,CAAA4I,aAAA,CAAC1H,8BAA8B;IAC3B4J,GAAG,EAAE3C,mBAAoB;IACzBhG,oBAAoB,EAAEA;EAAqB,CAC9C,CACJ,EACAkG,eAAe,iBAAIrI,KAAA,CAAA4I,aAAA,CAACjI,IAAI;IAAC2G,KAAK,EAAEe;EAAgB,CAAE,CAAC,EACnDC,eAAe,EACf5F,oBAAoB,IACjBA,oBAAoB,CAACuG,aAAa,IAClCvG,oBAAoB,CAACuG,aACF,CAC9B,eACDjJ,KAAA,CAAA4I,aAAA,CAAC7H,yBAAyB,qBACtBf,KAAA,CAAA4I,aAAA,CAACjI,IAAI;IAAC2G,KAAK,EAAE,CAAC,oBAAoB;EAAE,CAAE,CACf,CACT,CAAC,EACtBhE,MACW,CACnB,EACD,CACIjB,kBAAkB,EAClBS,QAAQ,EACRvB,SAAS,EACTgH,iBAAiB,EACjB3F,WAAW,EACXmB,OAAO,EACPtC,UAAU,EACVgB,UAAU,EACVH,aAAa,EACbE,WAAW,EACXJ,YAAY,EACZkG,eAAe,EACfrG,YAAY,EACZS,oBAAoB,EACpByF,mBAAmB,EACnBhG,oBAAoB,EACpBkG,eAAe,EACf/E,MAAM,CAEd,CAAC;AACL,CAAC;AAEDjC,QAAQ,CAAC0J,WAAW,GAAG,UAAU;AAEjC,eAAe1J,QAAQ","ignoreList":[]}
+{"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","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","newContainer","setNewContainer","styledComboBoxElementRef","contentRef","browser","isTouch","current","el","element","closest","handleClick","event","contains","target","handleOpen","left","comboBoxLeft","top","comboBoxTop","height","getBoundingClientRect","containerLeft","containerTop","scrollLeft","scrollTop","TOP","handleClose","document","addEventListener","removeEventListener","handleSetSelectedItem","itemToSelect","shouldPreventSelection","currentContent","scrollHeight","maxHeightInPixels","body","handleKeyDown","e","key","preventDefault","children","length","newIndex","prevElement","tabIndex","newElement","focus","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","textStyles","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    ChangeEventHandler,\n    FC,\n    FocusEventHandler,\n    ReactHTML,\n    ReactPortal,\n    useCallback,\n    useEffect,\n    useMemo,\n    useRef,\n    useState,\n    type CSSProperties,\n    type ReactNode,\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 ComboBoxTextStyles {\n    tagName?: keyof ReactHTML;\n    styles?: CSSProperties;\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    textStyles?: ComboBoxTextStyles;\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. If the function returns false, the item will not be selected.\n     */\n    onSelect?: (comboboxItem: IComboBoxItem) => boolean | 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,\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    const [newContainer, setNewContainer] = useState<Element | null>(container ?? null);\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    useEffect(() => {\n        if (styledComboBoxElementRef.current && !container) {\n            const el = styledComboBoxElementRef.current as HTMLElement;\n\n            const element = el.closest('.dialog-inner') || el.closest('body');\n\n            setNewContainer(element);\n        }\n    }, [container]);\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 && newContainer) {\n            const {\n                left: comboBoxLeft,\n                top: comboBoxTop,\n                height,\n            } = styledComboBoxElementRef.current.getBoundingClientRect();\n            const { left: containerLeft, top: containerTop } = newContainer.getBoundingClientRect();\n\n            const x = comboBoxLeft - containerLeft + newContainer.scrollLeft;\n            const y = comboBoxTop - containerTop + newContainer.scrollTop;\n\n            setInternalCoordinates({\n                x,\n                y: direction === ComboBoxDirection.TOP ? y : y + height,\n            });\n\n            setIsAnimating(true);\n        }\n    }, [newContainer, 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            if (typeof onSelect === 'function') {\n                const shouldPreventSelection = onSelect(itemToSelect) === false;\n\n                if (shouldPreventSelection) return;\n            }\n\n            setInternalSelectedItem(itemToSelect);\n            setIsAnimating(false);\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\n            tmpBodyMinWidth =\n                parentWidth < calculatedWidth - 20 ? calculatedWidth - 20 : 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 - 20 ? calculatedWidth - 20 : 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                            textStyles={item.textStyles}\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        if (!newContainer) {\n            return;\n        }\n\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                newContainer,\n            ),\n        );\n    }, [\n        bodyMinWidth,\n        bodyStyles,\n        browser?.name,\n        comboBoxGroups,\n        newContainer,\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":[]}