@chayns-components/core 5.5.59 → 5.5.61

package/lib/cjs/components/combobox/ComboBox.types.js.map

@@ -1 +1 @@
-{"version":3,"file":"ComboBox.types.js","names":["ComboBoxSize","exports"],"sources":["../../../../src/components/combobox/ComboBox.types.ts"],"sourcesContent":["import { ChangeEventHandler, CSSProperties, FocusEventHandler, ReactNode, type JSX } from 'react';\nimport { CSSPropertiesWithVars } from 'styled-components/dist/types';\nimport { DropdownDirection } from '../../types/dropdown';\n\n/**\n * Ref interface for the `ComboBox` component.\n */\nexport interface ComboBoxRef {\n    /**\n     * Hides the dropdown content.\n     */\n    hide: VoidFunction;\n    /**\n     * Shows the dropdown content.\n     */\n    show: VoidFunction;\n}\n\n/**\n * A grouped list definition used by the `ComboBox` component.\n */\nexport interface IComboBoxItems {\n    /**\n     * Optional group label shown above the list.\n     */\n    groupName?: string;\n    /**\n     * The items that should be rendered inside the group.\n     */\n    list: Array<IComboBoxItem>;\n    /**\n     * Whether the items in this group should use round images.\n     */\n    shouldShowRoundImage?: boolean;\n}\n\n/**\n * Optional text styling configuration for a combobox item.\n */\nexport interface ComboBoxTextStyles {\n    /**\n     * The HTML tag that should be used for the text wrapper.\n     */\n    tagName?: keyof JSX.IntrinsicElements;\n    /**\n     * Additional inline styles applied to the text wrapper.\n     */\n    styles?: CSSPropertiesWithVars;\n    /**\n     * Additional class name applied to the text wrapper.\n     */\n    className?: string;\n}\n\n/**\n * Single selectable item configuration for the `ComboBox` component.\n */\nexport interface IComboBoxItem {\n    /**\n     * Optional icon classes rendered before the text.\n     */\n    icons?: string[];\n    /**\n     * Optional background style used for the image placeholder.\n     */\n    imageBackground?: CSSProperties['background'];\n    /**\n     * Optional image URL rendered for the item.\n     */\n    imageUrl?: string;\n    /**\n     * Whether the item should be disabled.\n     */\n    isDisabled?: boolean;\n    /**\n     * Optional element rendered on the right side of the item.\n     */\n    rightElement?: ReactNode;\n    /**\n     * Optional secondary text rendered below the main text.\n     */\n    subtext?: string;\n    /**\n     * Optional suffix element rendered after the text.\n     */\n    suffixElement?: ReactNode;\n    /**\n     * Main label of the item.\n     */\n    text: string;\n    /**\n     * Stable item value used for selection and matching.\n     */\n    value: string | number;\n    /**\n     * Optional text styling overrides for the item label.\n     */\n    textStyles?: ComboBoxTextStyles;\n}\n\n/**\n * Available size variants for the `ComboBox` header.\n */\nexport enum ComboBoxSize {\n    /**\n     * Standard height and spacing.\n     */\n    NORMAL = 'normal',\n    /**\n     * Compact height and spacing.\n     */\n    SMALL = 'small',\n}\n\n/**\n * Props for the `ComboBox` component.\n */\nexport type ComboBoxProps = {\n    /**\n     * The width of the body.\n     * @default undefined\n     */\n    bodyWidth?: number;\n    /**\n     * The element where the content of the `ComboBox` should be rendered via React Portal.\n     * @default undefined\n     */\n    container?: Element;\n    /**\n     * The direction in which the combobox should open.\n     * @default DropdownDirection.RIGHT\n     */\n    direction?: DropdownDirection;\n    /**\n     * The value of the optional input.\n     * @default undefined\n     */\n    inputValue?: string;\n    /**\n     * Whether the combobox should be disabled.\n     * @default false\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     * @default 280\n     */\n    maxHeight?: number;\n    /**\n     * Function to be executed when the value of the optional input is changed.\n     * @default undefined\n     */\n    onInputChange?: ChangeEventHandler<HTMLInputElement>;\n    /**\n     * Function to be executed when the optional input lost its focus.\n     * @default undefined\n     */\n    onInputBlur?: FocusEventHandler<HTMLInputElement>;\n    /**\n     * Function to be executed when the optional input gets its focus.\n     * @default undefined\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     * @default undefined\n     */\n    onSelect?: (comboboxItem?: IComboBoxItem) => Promise<boolean> | boolean | void;\n    /**\n     * Function to be executed when the content of the `ComboBox` is shown.\n     * @default undefined\n     */\n    onShow?: () => void;\n    /**\n     * Function to be executed when the content of the `ComboBox` is hidden.\n     * @default undefined\n     */\n    onHide?: () => void;\n    /**\n     * A text that should be displayed when no item is selected.\n     */\n    placeholder: string;\n    /**\n     * A prefix that should be displayed before the placeholder.\n     * @default undefined\n     */\n    prefix?: string;\n    /**\n     * An item that should be preselected.\n     * @default undefined\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     * @default false\n     */\n    shouldShowBigImage?: boolean;\n    /**\n     * If true, a clear icon is displayed at the end of the combo box if an item is selected.\n     * @default false\n     */\n    shouldShowClearIcon?: boolean;\n    /**\n     * Whether the background should be transparent.\n     * @default false\n     */\n    shouldShowTransparentBackground?: boolean;\n    /**\n     * If true, the images of the items are displayed in a round shape.\n     * @default false\n     */\n    shouldShowRoundImage?: boolean;\n    /**\n     * Whether the width of the ComboBox should be the width of the current item.\n     * @default false\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     * @default false\n     */\n    shouldUseFullWidth?: boolean;\n    /**\n     * If true, the dropdown will use the maximum width of the items.\n     * @default false\n     */\n    shouldDropDownUseMaxItemWidth?: boolean;\n    /**\n     * Whether the outside events should be captured.\n     * @default undefined\n     */\n    shouldCaptureEvents?: boolean;\n    /**\n     * The size of the ComboBox.\n     * @default ComboBoxSize.NORMAL\n     */\n    size?: ComboBoxSize;\n    /**\n     * Enables the shared keyboard-only focus ring for the combobox header.\n     * @default false\n     */\n    shouldEnableKeyboardHighlighting?: boolean;\n    /**\n     * Optional min width for the prefix element.\n     * @default undefined\n     */\n    prefixMinWidth?: number;\n};\n"],"mappings":";;;;;;AAIA;AACA;AACA;AAYA;AACA;AACA;AAgBA;AACA;AACA;AAgBA;AACA;AACA;AA4CA;AACA;AACA;AAFA,IAGYA,YAAY,GAAAC,OAAA,CAAAD,YAAA,0BAAZA,YAAY;EACpB;AACJ;AACA;EAHYA,YAAY;EAKpB;AACJ;AACA;EAPYA,YAAY;EAAA,OAAZA,YAAY;AAAA;AAWxB;AACA;AACA","ignoreList":[]}
+{"version":3,"file":"ComboBox.types.js","names":["ComboBoxSize","exports"],"sources":["../../../../src/components/combobox/ComboBox.types.ts"],"sourcesContent":["import { ChangeEventHandler, CSSProperties, FocusEventHandler, ReactNode, type JSX } from 'react';\nimport { CSSPropertiesWithVars } from 'styled-components/dist/types';\nimport { DropdownDirection } from '../../types/dropdown';\n\n/**\n * Ref interface for the `ComboBox` component.\n */\nexport interface ComboBoxRef {\n    /**\n     * Hides the dropdown content.\n     */\n    hide: VoidFunction;\n    /**\n     * Shows the dropdown content.\n     */\n    show: VoidFunction;\n}\n\n/**\n * A grouped list definition used by the `ComboBox` component.\n */\nexport interface IComboBoxItems {\n    /**\n     * Optional group label shown above the list.\n     */\n    groupName?: string;\n    /**\n     * The items that should be rendered inside the group.\n     */\n    list: Array<IComboBoxItem>;\n    /**\n     * Whether the items in this group should use round images.\n     */\n    shouldShowRoundImage?: boolean;\n}\n\n/**\n * Optional text styling configuration for a combobox item.\n */\nexport interface ComboBoxTextStyles {\n    /**\n     * The HTML tag that should be used for the text wrapper.\n     */\n    tagName?: keyof JSX.IntrinsicElements;\n    /**\n     * Additional inline styles applied to the text wrapper.\n     */\n    styles?: CSSPropertiesWithVars;\n    /**\n     * Additional class name applied to the text wrapper.\n     */\n    className?: string;\n}\n\n/**\n * Single selectable item configuration for the `ComboBox` component.\n */\nexport interface IComboBoxItem {\n    /**\n     * Optional icon classes rendered before the text.\n     */\n    icons?: string[];\n    /**\n     * Optional background style used for the image placeholder.\n     */\n    imageBackground?: CSSProperties['background'];\n    /**\n     * Optional image URL rendered for the item.\n     */\n    imageUrl?: string;\n    /**\n     * Whether the item should be disabled.\n     */\n    isDisabled?: boolean;\n    /**\n     * Optional element rendered on the right side of the item.\n     */\n    rightElement?: ReactNode;\n    /**\n     * Optional secondary text rendered below the main text.\n     */\n    subtext?: string;\n    /**\n     * Optional suffix element rendered after the text.\n     */\n    suffixElement?: ReactNode;\n    /**\n     * Main label of the item.\n     */\n    text: string;\n    /**\n     * Stable item value used for selection and matching.\n     */\n    value: string | number;\n    /**\n     * Optional text styling overrides for the item label.\n     */\n    textStyles?: ComboBoxTextStyles;\n}\n\n/**\n * Available size variants for the `ComboBox` header.\n */\nexport enum ComboBoxSize {\n    /**\n     * Standard height and spacing.\n     */\n    NORMAL = 'normal',\n    /**\n     * Compact height and spacing.\n     */\n    SMALL = 'small',\n    /**\n     * Minimal height and spacing.\n     */\n    MINI = 'mini',\n}\n\n/**\n * Props for the `ComboBox` component.\n */\nexport type ComboBoxProps = {\n    /**\n     * The width of the body.\n     * @default undefined\n     */\n    bodyWidth?: number;\n    /**\n     * The element where the content of the `ComboBox` should be rendered via React Portal.\n     * @default undefined\n     */\n    container?: Element;\n    /**\n     * The direction in which the combobox should open.\n     * @default DropdownDirection.RIGHT\n     */\n    direction?: DropdownDirection;\n    /**\n     * The value of the optional input.\n     * @default undefined\n     */\n    inputValue?: string;\n    /**\n     * Whether the combobox should be disabled.\n     * @default false\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     * @default 280\n     */\n    maxHeight?: number;\n    /**\n     * Function to be executed when the value of the optional input is changed.\n     * @default undefined\n     */\n    onInputChange?: ChangeEventHandler<HTMLInputElement>;\n    /**\n     * Function to be executed when the optional input lost its focus.\n     * @default undefined\n     */\n    onInputBlur?: FocusEventHandler<HTMLInputElement>;\n    /**\n     * Function to be executed when the optional input gets its focus.\n     * @default undefined\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     * @default undefined\n     */\n    onSelect?: (comboboxItem?: IComboBoxItem) => Promise<boolean> | boolean | void;\n    /**\n     * Function to be executed when the content of the `ComboBox` is shown.\n     * @default undefined\n     */\n    onShow?: () => void;\n    /**\n     * Function to be executed when the content of the `ComboBox` is hidden.\n     * @default undefined\n     */\n    onHide?: () => void;\n    /**\n     * A text that should be displayed when no item is selected.\n     */\n    placeholder: string;\n    /**\n     * A prefix that should be displayed before the placeholder.\n     * @default undefined\n     */\n    prefix?: string;\n    /**\n     * An item that should be preselected.\n     * @default undefined\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     * @default false\n     */\n    shouldShowBigImage?: boolean;\n    /**\n     * If true, a clear icon is displayed at the end of the combo box if an item is selected.\n     * @default false\n     */\n    shouldShowClearIcon?: boolean;\n    /**\n     * Whether the background should be transparent.\n     * @default false\n     */\n    shouldShowTransparentBackground?: boolean;\n    /**\n     * If true, the images of the items are displayed in a round shape.\n     * @default false\n     */\n    shouldShowRoundImage?: boolean;\n    /**\n     * Whether the width of the ComboBox should be the width of the current item.\n     * @default false\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     * @default false\n     */\n    shouldUseFullWidth?: boolean;\n    /**\n     * If true, the dropdown will use the maximum width of the items.\n     * @default false\n     */\n    shouldDropDownUseMaxItemWidth?: boolean;\n    /**\n     * Whether the outside events should be captured.\n     * @default undefined\n     */\n    shouldCaptureEvents?: boolean;\n    /**\n     * The size of the ComboBox.\n     * @default ComboBoxSize.NORMAL\n     */\n    size?: ComboBoxSize;\n    /**\n     * Enables the shared keyboard-only focus ring for the combobox header.\n     * @default false\n     */\n    shouldEnableKeyboardHighlighting?: boolean;\n    /**\n     * Optional min width for the prefix element.\n     * @default undefined\n     */\n    prefixMinWidth?: number;\n};\n"],"mappings":";;;;;;AAIA;AACA;AACA;AAYA;AACA;AACA;AAgBA;AACA;AACA;AAgBA;AACA;AACA;AA4CA;AACA;AACA;AAFA,IAGYA,YAAY,GAAAC,OAAA,CAAAD,YAAA,0BAAZA,YAAY;EACpB;AACJ;AACA;EAHYA,YAAY;EAKpB;AACJ;AACA;EAPYA,YAAY;EASpB;AACJ;AACA;EAXYA,YAAY;EAAA,OAAZA,YAAY;AAAA;AAexB;AACA;AACA","ignoreList":[]}

package/lib/cjs/utils/uploadFile.js

@@ -10,6 +10,7 @@ const uploadFile = async ({
   fileToUpload,
   callback,
   shouldUploadImageToSite,
+  uploadPath,
   uploadUrls
 }) => {
   var _fileToUpload$file, _fileToUpload$file2;
@@ -32,6 +33,7 @@ const uploadFile = async ({
     const uploadedImage = await (0, _post.postImage)({
       file: fileToUpload.file,
       shouldUploadImageToSite,
+      uploadPath,
       uploadUrls
     });
     if (uploadedImage) {

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

@@ -1 +1 @@
-{"version":3,"file":"uploadFile.js","names":["_post","require","_post2","uploadFile","fileToUpload","callback","shouldUploadImageToSite","uploadUrls","_fileToUpload$file","_fileToUpload$file2","state","undefined","file","type","includes","uploadedVideo","postVideo","id","toString","uploadedImage","postImage","_uploadedImage$meta","_uploadedImage$meta2","_uploadedImage$meta3","_uploadedImage$meta4","url","base","key","meta","ratio","width","height","Number","exports"],"sources":["../../../src/utils/uploadFile.ts"],"sourcesContent":["import { postImage } from '../api/image/post';\nimport { postVideo } from '../api/video/post';\nimport type { UploadUrls } from '../config/uploadUrls';\nimport type { Image, InternalFileItem, Video } from '../types/file';\n\ninterface UploadFilesOptions {\n    fileToUpload: InternalFileItem;\n    callback: (UploadedFile: Video | Image) => void;\n    shouldUploadImageToSite?: boolean;\n    /**\n     * Overrides the globally configured upload service URLs for this upload.\n     */\n    uploadUrls?: Partial<UploadUrls>;\n}\n\nexport const uploadFile = async ({\n    fileToUpload,\n    callback,\n    shouldUploadImageToSite,\n    uploadUrls,\n}: UploadFilesOptions): Promise<void> => {\n    if (!fileToUpload || (fileToUpload.state !== undefined && fileToUpload.state !== 'none')) {\n        return;\n    }\n\n    if (fileToUpload.file?.type.includes('video/')) {\n        const uploadedVideo = await postVideo({ file: fileToUpload.file, uploadUrls });\n\n        if (uploadedVideo) {\n            callback({\n                ...uploadedVideo,\n                id: uploadedVideo.id.toString(),\n            });\n        }\n    }\n\n    if (fileToUpload.file?.type.includes('image/')) {\n        const uploadedImage = await postImage({\n            file: fileToUpload.file,\n            shouldUploadImageToSite,\n            uploadUrls,\n        });\n\n        if (uploadedImage) {\n            callback({\n                url: `${uploadedImage.base}/${uploadedImage.key}`,\n                id: uploadedImage.key,\n                meta: uploadedImage.meta,\n                ratio:\n                    uploadedImage.meta?.width && uploadedImage.meta?.height\n                        ? Number(uploadedImage.meta?.width) / Number(uploadedImage.meta?.height)\n                        : undefined,\n            });\n        }\n    }\n};\n"],"mappings":";;;;;;AAAA,IAAAA,KAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAD,OAAA;AAcO,MAAME,UAAU,GAAG,MAAAA,CAAO;EAC7BC,YAAY;EACZC,QAAQ;EACRC,uBAAuB;EACvBC;AACgB,CAAC,KAAoB;EAAA,IAAAC,kBAAA,EAAAC,mBAAA;EACrC,IAAI,CAACL,YAAY,IAAKA,YAAY,CAACM,KAAK,KAAKC,SAAS,IAAIP,YAAY,CAACM,KAAK,KAAK,MAAO,EAAE;IACtF;EACJ;EAEA,KAAAF,kBAAA,GAAIJ,YAAY,CAACQ,IAAI,cAAAJ,kBAAA,eAAjBA,kBAAA,CAAmBK,IAAI,CAACC,QAAQ,CAAC,QAAQ,CAAC,EAAE;IAC5C,MAAMC,aAAa,GAAG,MAAM,IAAAC,gBAAS,EAAC;MAAEJ,IAAI,EAAER,YAAY,CAACQ,IAAI;MAAEL;IAAW,CAAC,CAAC;IAE9E,IAAIQ,aAAa,EAAE;MACfV,QAAQ,CAAC;QACL,GAAGU,aAAa;QAChBE,EAAE,EAAEF,aAAa,CAACE,EAAE,CAACC,QAAQ,CAAC;MAClC,CAAC,CAAC;IACN;EACJ;EAEA,KAAAT,mBAAA,GAAIL,YAAY,CAACQ,IAAI,cAAAH,mBAAA,eAAjBA,mBAAA,CAAmBI,IAAI,CAACC,QAAQ,CAAC,QAAQ,CAAC,EAAE;IAC5C,MAAMK,aAAa,GAAG,MAAM,IAAAC,eAAS,EAAC;MAClCR,IAAI,EAAER,YAAY,CAACQ,IAAI;MACvBN,uBAAuB;MACvBC;IACJ,CAAC,CAAC;IAEF,IAAIY,aAAa,EAAE;MAAA,IAAAE,mBAAA,EAAAC,oBAAA,EAAAC,oBAAA,EAAAC,oBAAA;MACfnB,QAAQ,CAAC;QACLoB,GAAG,EAAE,GAAGN,aAAa,CAACO,IAAI,IAAIP,aAAa,CAACQ,GAAG,EAAE;QACjDV,EAAE,EAAEE,aAAa,CAACQ,GAAG;QACrBC,IAAI,EAAET,aAAa,CAACS,IAAI;QACxBC,KAAK,EACD,CAAAR,mBAAA,GAAAF,aAAa,CAACS,IAAI,cAAAP,mBAAA,eAAlBA,mBAAA,CAAoBS,KAAK,KAAAR,oBAAA,GAAIH,aAAa,CAACS,IAAI,cAAAN,oBAAA,eAAlBA,oBAAA,CAAoBS,MAAM,GACjDC,MAAM,EAAAT,oBAAA,GAACJ,aAAa,CAACS,IAAI,cAAAL,oBAAA,uBAAlBA,oBAAA,CAAoBO,KAAK,CAAC,GAAGE,MAAM,EAAAR,oBAAA,GAACL,aAAa,CAACS,IAAI,cAAAJ,oBAAA,uBAAlBA,oBAAA,CAAoBO,MAAM,CAAC,GACtEpB;MACd,CAAC,CAAC;IACN;EACJ;AACJ,CAAC;AAACsB,OAAA,CAAA9B,UAAA,GAAAA,UAAA","ignoreList":[]}
+{"version":3,"file":"uploadFile.js","names":["_post","require","_post2","uploadFile","fileToUpload","callback","shouldUploadImageToSite","uploadPath","uploadUrls","_fileToUpload$file","_fileToUpload$file2","state","undefined","file","type","includes","uploadedVideo","postVideo","id","toString","uploadedImage","postImage","_uploadedImage$meta","_uploadedImage$meta2","_uploadedImage$meta3","_uploadedImage$meta4","url","base","key","meta","ratio","width","height","Number","exports"],"sources":["../../../src/utils/uploadFile.ts"],"sourcesContent":["import { postImage } from '../api/image/post';\nimport { postVideo } from '../api/video/post';\nimport type { UploadUrls } from '../config/uploadUrls';\nimport type { Image, InternalFileItem, Video } from '../types/file';\n\ninterface UploadFilesOptions {\n    fileToUpload: InternalFileItem;\n    callback: (UploadedFile: Video | Image) => void;\n    shouldUploadImageToSite?: boolean;\n    /**\n     * Relative target path appended to the image service URL. When set, it\n     * takes precedence over the default user or site ID path.\n     */\n    uploadPath?: string;\n    /**\n     * Overrides the globally configured upload service URLs for this upload.\n     */\n    uploadUrls?: Partial<UploadUrls>;\n}\n\nexport const uploadFile = async ({\n    fileToUpload,\n    callback,\n    shouldUploadImageToSite,\n    uploadPath,\n    uploadUrls,\n}: UploadFilesOptions): Promise<void> => {\n    if (!fileToUpload || (fileToUpload.state !== undefined && fileToUpload.state !== 'none')) {\n        return;\n    }\n\n    if (fileToUpload.file?.type.includes('video/')) {\n        const uploadedVideo = await postVideo({ file: fileToUpload.file, uploadUrls });\n\n        if (uploadedVideo) {\n            callback({\n                ...uploadedVideo,\n                id: uploadedVideo.id.toString(),\n            });\n        }\n    }\n\n    if (fileToUpload.file?.type.includes('image/')) {\n        const uploadedImage = await postImage({\n            file: fileToUpload.file,\n            shouldUploadImageToSite,\n            uploadPath,\n            uploadUrls,\n        });\n\n        if (uploadedImage) {\n            callback({\n                url: `${uploadedImage.base}/${uploadedImage.key}`,\n                id: uploadedImage.key,\n                meta: uploadedImage.meta,\n                ratio:\n                    uploadedImage.meta?.width && uploadedImage.meta?.height\n                        ? Number(uploadedImage.meta?.width) / Number(uploadedImage.meta?.height)\n                        : undefined,\n            });\n        }\n    }\n};\n"],"mappings":";;;;;;AAAA,IAAAA,KAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAD,OAAA;AAmBO,MAAME,UAAU,GAAG,MAAAA,CAAO;EAC7BC,YAAY;EACZC,QAAQ;EACRC,uBAAuB;EACvBC,UAAU;EACVC;AACgB,CAAC,KAAoB;EAAA,IAAAC,kBAAA,EAAAC,mBAAA;EACrC,IAAI,CAACN,YAAY,IAAKA,YAAY,CAACO,KAAK,KAAKC,SAAS,IAAIR,YAAY,CAACO,KAAK,KAAK,MAAO,EAAE;IACtF;EACJ;EAEA,KAAAF,kBAAA,GAAIL,YAAY,CAACS,IAAI,cAAAJ,kBAAA,eAAjBA,kBAAA,CAAmBK,IAAI,CAACC,QAAQ,CAAC,QAAQ,CAAC,EAAE;IAC5C,MAAMC,aAAa,GAAG,MAAM,IAAAC,gBAAS,EAAC;MAAEJ,IAAI,EAAET,YAAY,CAACS,IAAI;MAAEL;IAAW,CAAC,CAAC;IAE9E,IAAIQ,aAAa,EAAE;MACfX,QAAQ,CAAC;QACL,GAAGW,aAAa;QAChBE,EAAE,EAAEF,aAAa,CAACE,EAAE,CAACC,QAAQ,CAAC;MAClC,CAAC,CAAC;IACN;EACJ;EAEA,KAAAT,mBAAA,GAAIN,YAAY,CAACS,IAAI,cAAAH,mBAAA,eAAjBA,mBAAA,CAAmBI,IAAI,CAACC,QAAQ,CAAC,QAAQ,CAAC,EAAE;IAC5C,MAAMK,aAAa,GAAG,MAAM,IAAAC,eAAS,EAAC;MAClCR,IAAI,EAAET,YAAY,CAACS,IAAI;MACvBP,uBAAuB;MACvBC,UAAU;MACVC;IACJ,CAAC,CAAC;IAEF,IAAIY,aAAa,EAAE;MAAA,IAAAE,mBAAA,EAAAC,oBAAA,EAAAC,oBAAA,EAAAC,oBAAA;MACfpB,QAAQ,CAAC;QACLqB,GAAG,EAAE,GAAGN,aAAa,CAACO,IAAI,IAAIP,aAAa,CAACQ,GAAG,EAAE;QACjDV,EAAE,EAAEE,aAAa,CAACQ,GAAG;QACrBC,IAAI,EAAET,aAAa,CAACS,IAAI;QACxBC,KAAK,EACD,CAAAR,mBAAA,GAAAF,aAAa,CAACS,IAAI,cAAAP,mBAAA,eAAlBA,mBAAA,CAAoBS,KAAK,KAAAR,oBAAA,GAAIH,aAAa,CAACS,IAAI,cAAAN,oBAAA,eAAlBA,oBAAA,CAAoBS,MAAM,GACjDC,MAAM,EAAAT,oBAAA,GAACJ,aAAa,CAACS,IAAI,cAAAL,oBAAA,uBAAlBA,oBAAA,CAAoBO,KAAK,CAAC,GAAGE,MAAM,EAAAR,oBAAA,GAACL,aAAa,CAACS,IAAI,cAAAJ,oBAAA,uBAAlBA,oBAAA,CAAoBO,MAAM,CAAC,GACtEpB;MACd,CAAC,CAAC;IACN;EACJ;AACJ,CAAC;AAACsB,OAAA,CAAA/B,UAAA,GAAAA,UAAA","ignoreList":[]}

package/lib/esm/api/image/post.js

@@ -6,6 +6,7 @@ import { getUploadUrls } from '../../config/uploadUrls';
 export const postImage = async ({
   file,
   shouldUploadImageToSite,
+  uploadPath,
   uploadUrls
 }) => {
   const {
@@ -25,7 +26,8 @@ export const postImage = async ({
     imageServiceUrl,
     imageResizerUrl
   } = getUploadUrls(uploadUrls);
-  const url = file.size > 10 * 1024 * 1024 ? `${imageResizerUrl}/${shouldUploadImageToSite ? site.id : user.personId}` : `${imageServiceUrl}/${shouldUploadImageToSite ? site.id : user.personId}`;
+  const targetPath = uploadPath ?? (shouldUploadImageToSite ? site.id : user.personId);
+  const url = file.size > 10 * 1024 * 1024 ? `${imageResizerUrl}/${targetPath}` : `${imageServiceUrl}/${targetPath}`;
   const response = await fetch(url, {
     body,
     headers: {

package/lib/esm/api/image/post.js.map

@@ -1 +1 @@
-{"version":3,"file":"post.js","names":["getAccessToken","getSite","getUser","getUploadUrls","postImage","file","shouldUploadImageToSite","uploadUrls","accessToken","user","site","personId","undefined","body","FormData","append","imageServiceUrl","imageResizerUrl","url","size","id","response","fetch","headers","Accept","Authorization","method","ok","image","baseDomain","json","key","path","base","endsWith","slice","meta","preview","width","String","height","Error","status"],"sources":["../../../../src/api/image/post.ts"],"sourcesContent":["import { getAccessToken, getSite, getUser } from 'chayns-api';\nimport { getUploadUrls, type UploadUrls } from '../../config/uploadUrls';\nimport type { Meta } from '../../types/file';\n\nexport interface PostImageResult {\n    key: string;\n    base: string;\n    meta?: Meta;\n}\n\ninterface Result {\n    requestId: string;\n    image: Image;\n    baseDomain: string;\n    signature: Signature;\n}\n\nexport interface Image {\n    path: string;\n    width: number;\n    height: number;\n    size: number;\n    hash: string;\n    preview: string;\n    isSecured: boolean;\n    format: string;\n    fileExtension: string;\n}\n\nexport interface Signature {\n    verify: string;\n    signature: string;\n    expires: Date;\n}\n\ninterface PostImageOptions {\n    file: File;\n    shouldUploadImageToSite?: boolean;\n    /**\n     * Overrides the globally configured upload service URLs for this upload.\n     */\n    uploadUrls?: Partial<UploadUrls>;\n}\n\n/**\n * Uploads an image to the tsimg cloud service\n */\nexport const postImage = async ({\n    file,\n    shouldUploadImageToSite,\n    uploadUrls,\n}: PostImageOptions): Promise<PostImageResult | undefined> => {\n    const { accessToken } = await getAccessToken();\n    const user = getUser();\n    const site = getSite();\n\n    if (!accessToken || !user?.personId) {\n        return undefined;\n    }\n\n    // const body = await getFileAsArrayBuffer(file);\n\n    const body = new FormData();\n\n    body.append('File', file);\n\n    const { imageServiceUrl, imageResizerUrl } = getUploadUrls(uploadUrls);\n\n    const url =\n        file.size > 10 * 1024 * 1024\n            ? `${imageResizerUrl}/${shouldUploadImageToSite ? site.id : user.personId}`\n            : `${imageServiceUrl}/${shouldUploadImageToSite ? site.id : user.personId}`;\n\n    const response = await fetch(url, {\n        body,\n        headers: {\n            Accept: 'application/json',\n            Authorization: `bearer ${accessToken}`,\n        },\n        method: 'POST',\n    });\n\n    if (response.ok) {\n        const { image, baseDomain } = (await response.json()) as Result;\n        // Maps image-service-api-v3 result to v2 result.\n        return {\n            key: image.path,\n            // Removes trailing slash from baseDomain, since image-service-api-v2 doesn't have a trailing slash on base.\n            base: baseDomain.endsWith('/') ? baseDomain.slice(0, -1) : baseDomain,\n            meta: {\n                preview: image.preview,\n                width: String(image.width),\n                height: String(image.height),\n            },\n        };\n    }\n\n    throw Error(`Failed to POST image (status code: ${response.status}).`);\n};\n"],"mappings":"AAAA,SAASA,cAAc,EAAEC,OAAO,EAAEC,OAAO,QAAQ,YAAY;AAC7D,SAASC,aAAa,QAAyB,yBAAyB;AA2CxE;AACA;AACA;AACA,OAAO,MAAMC,SAAS,GAAG,MAAAA,CAAO;EAC5BC,IAAI;EACJC,uBAAuB;EACvBC;AACc,CAAC,KAA2C;EAC1D,MAAM;IAAEC;EAAY,CAAC,GAAG,MAAMR,cAAc,CAAC,CAAC;EAC9C,MAAMS,IAAI,GAAGP,OAAO,CAAC,CAAC;EACtB,MAAMQ,IAAI,GAAGT,OAAO,CAAC,CAAC;EAEtB,IAAI,CAACO,WAAW,IAAI,CAACC,IAAI,EAAEE,QAAQ,EAAE;IACjC,OAAOC,SAAS;EACpB;;EAEA;;EAEA,MAAMC,IAAI,GAAG,IAAIC,QAAQ,CAAC,CAAC;EAE3BD,IAAI,CAACE,MAAM,CAAC,MAAM,EAAEV,IAAI,CAAC;EAEzB,MAAM;IAAEW,eAAe;IAAEC;EAAgB,CAAC,GAAGd,aAAa,CAACI,UAAU,CAAC;EAEtE,MAAMW,GAAG,GACLb,IAAI,CAACc,IAAI,GAAG,EAAE,GAAG,IAAI,GAAG,IAAI,GACtB,GAAGF,eAAe,IAAIX,uBAAuB,GAAGI,IAAI,CAACU,EAAE,GAAGX,IAAI,CAACE,QAAQ,EAAE,GACzE,GAAGK,eAAe,IAAIV,uBAAuB,GAAGI,IAAI,CAACU,EAAE,GAAGX,IAAI,CAACE,QAAQ,EAAE;EAEnF,MAAMU,QAAQ,GAAG,MAAMC,KAAK,CAACJ,GAAG,EAAE;IAC9BL,IAAI;IACJU,OAAO,EAAE;MACLC,MAAM,EAAE,kBAAkB;MAC1BC,aAAa,EAAE,UAAUjB,WAAW;IACxC,CAAC;IACDkB,MAAM,EAAE;EACZ,CAAC,CAAC;EAEF,IAAIL,QAAQ,CAACM,EAAE,EAAE;IACb,MAAM;MAAEC,KAAK;MAAEC;IAAW,CAAC,GAAI,MAAMR,QAAQ,CAACS,IAAI,CAAC,CAAY;IAC/D;IACA,OAAO;MACHC,GAAG,EAAEH,KAAK,CAACI,IAAI;MACf;MACAC,IAAI,EAAEJ,UAAU,CAACK,QAAQ,CAAC,GAAG,CAAC,GAAGL,UAAU,CAACM,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,GAAGN,UAAU;MACrEO,IAAI,EAAE;QACFC,OAAO,EAAET,KAAK,CAACS,OAAO;QACtBC,KAAK,EAAEC,MAAM,CAACX,KAAK,CAACU,KAAK,CAAC;QAC1BE,MAAM,EAAED,MAAM,CAACX,KAAK,CAACY,MAAM;MAC/B;IACJ,CAAC;EACL;EAEA,MAAMC,KAAK,CAAC,sCAAsCpB,QAAQ,CAACqB,MAAM,IAAI,CAAC;AAC1E,CAAC","ignoreList":[]}
+{"version":3,"file":"post.js","names":["getAccessToken","getSite","getUser","getUploadUrls","postImage","file","shouldUploadImageToSite","uploadPath","uploadUrls","accessToken","user","site","personId","undefined","body","FormData","append","imageServiceUrl","imageResizerUrl","targetPath","id","url","size","response","fetch","headers","Accept","Authorization","method","ok","image","baseDomain","json","key","path","base","endsWith","slice","meta","preview","width","String","height","Error","status"],"sources":["../../../../src/api/image/post.ts"],"sourcesContent":["import { getAccessToken, getSite, getUser } from 'chayns-api';\nimport { getUploadUrls, type UploadUrls } from '../../config/uploadUrls';\nimport type { Meta } from '../../types/file';\n\nexport interface PostImageResult {\n    key: string;\n    base: string;\n    meta?: Meta;\n}\n\ninterface Result {\n    requestId: string;\n    image: Image;\n    baseDomain: string;\n    signature: Signature;\n}\n\nexport interface Image {\n    path: string;\n    width: number;\n    height: number;\n    size: number;\n    hash: string;\n    preview: string;\n    isSecured: boolean;\n    format: string;\n    fileExtension: string;\n}\n\nexport interface Signature {\n    verify: string;\n    signature: string;\n    expires: Date;\n}\n\ninterface PostImageOptions {\n    file: File;\n    shouldUploadImageToSite?: boolean;\n    /**\n     * Relative target path appended to the image service URL. When set, it\n     * takes precedence over the default user or site ID path.\n     */\n    uploadPath?: string;\n    /**\n     * Overrides the globally configured upload service URLs for this upload.\n     */\n    uploadUrls?: Partial<UploadUrls>;\n}\n\n/**\n * Uploads an image to the tsimg cloud service\n */\nexport const postImage = async ({\n    file,\n    shouldUploadImageToSite,\n    uploadPath,\n    uploadUrls,\n}: PostImageOptions): Promise<PostImageResult | undefined> => {\n    const { accessToken } = await getAccessToken();\n    const user = getUser();\n    const site = getSite();\n\n    if (!accessToken || !user?.personId) {\n        return undefined;\n    }\n\n    // const body = await getFileAsArrayBuffer(file);\n\n    const body = new FormData();\n\n    body.append('File', file);\n\n    const { imageServiceUrl, imageResizerUrl } = getUploadUrls(uploadUrls);\n    const targetPath = uploadPath ?? (shouldUploadImageToSite ? site.id : user.personId);\n\n    const url =\n        file.size > 10 * 1024 * 1024\n            ? `${imageResizerUrl}/${targetPath}`\n            : `${imageServiceUrl}/${targetPath}`;\n\n    const response = await fetch(url, {\n        body,\n        headers: {\n            Accept: 'application/json',\n            Authorization: `bearer ${accessToken}`,\n        },\n        method: 'POST',\n    });\n\n    if (response.ok) {\n        const { image, baseDomain } = (await response.json()) as Result;\n        // Maps image-service-api-v3 result to v2 result.\n        return {\n            key: image.path,\n            // Removes trailing slash from baseDomain, since image-service-api-v2 doesn't have a trailing slash on base.\n            base: baseDomain.endsWith('/') ? baseDomain.slice(0, -1) : baseDomain,\n            meta: {\n                preview: image.preview,\n                width: String(image.width),\n                height: String(image.height),\n            },\n        };\n    }\n\n    throw Error(`Failed to POST image (status code: ${response.status}).`);\n};\n"],"mappings":"AAAA,SAASA,cAAc,EAAEC,OAAO,EAAEC,OAAO,QAAQ,YAAY;AAC7D,SAASC,aAAa,QAAyB,yBAAyB;AAgDxE;AACA;AACA;AACA,OAAO,MAAMC,SAAS,GAAG,MAAAA,CAAO;EAC5BC,IAAI;EACJC,uBAAuB;EACvBC,UAAU;EACVC;AACc,CAAC,KAA2C;EAC1D,MAAM;IAAEC;EAAY,CAAC,GAAG,MAAMT,cAAc,CAAC,CAAC;EAC9C,MAAMU,IAAI,GAAGR,OAAO,CAAC,CAAC;EACtB,MAAMS,IAAI,GAAGV,OAAO,CAAC,CAAC;EAEtB,IAAI,CAACQ,WAAW,IAAI,CAACC,IAAI,EAAEE,QAAQ,EAAE;IACjC,OAAOC,SAAS;EACpB;;EAEA;;EAEA,MAAMC,IAAI,GAAG,IAAIC,QAAQ,CAAC,CAAC;EAE3BD,IAAI,CAACE,MAAM,CAAC,MAAM,EAAEX,IAAI,CAAC;EAEzB,MAAM;IAAEY,eAAe;IAAEC;EAAgB,CAAC,GAAGf,aAAa,CAACK,UAAU,CAAC;EACtE,MAAMW,UAAU,GAAGZ,UAAU,KAAKD,uBAAuB,GAAGK,IAAI,CAACS,EAAE,GAAGV,IAAI,CAACE,QAAQ,CAAC;EAEpF,MAAMS,GAAG,GACLhB,IAAI,CAACiB,IAAI,GAAG,EAAE,GAAG,IAAI,GAAG,IAAI,GACtB,GAAGJ,eAAe,IAAIC,UAAU,EAAE,GAClC,GAAGF,eAAe,IAAIE,UAAU,EAAE;EAE5C,MAAMI,QAAQ,GAAG,MAAMC,KAAK,CAACH,GAAG,EAAE;IAC9BP,IAAI;IACJW,OAAO,EAAE;MACLC,MAAM,EAAE,kBAAkB;MAC1BC,aAAa,EAAE,UAAUlB,WAAW;IACxC,CAAC;IACDmB,MAAM,EAAE;EACZ,CAAC,CAAC;EAEF,IAAIL,QAAQ,CAACM,EAAE,EAAE;IACb,MAAM;MAAEC,KAAK;MAAEC;IAAW,CAAC,GAAI,MAAMR,QAAQ,CAACS,IAAI,CAAC,CAAY;IAC/D;IACA,OAAO;MACHC,GAAG,EAAEH,KAAK,CAACI,IAAI;MACf;MACAC,IAAI,EAAEJ,UAAU,CAACK,QAAQ,CAAC,GAAG,CAAC,GAAGL,UAAU,CAACM,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,GAAGN,UAAU;MACrEO,IAAI,EAAE;QACFC,OAAO,EAAET,KAAK,CAACS,OAAO;QACtBC,KAAK,EAAEC,MAAM,CAACX,KAAK,CAACU,KAAK,CAAC;QAC1BE,MAAM,EAAED,MAAM,CAACX,KAAK,CAACY,MAAM;MAC/B;IACJ,CAAC;EACL;EAEA,MAAMC,KAAK,CAAC,sCAAsCpB,QAAQ,CAACqB,MAAM,IAAI,CAAC;AAC1E,CAAC","ignoreList":[]}

package/lib/esm/api/image/post.test.js

@@ -0,0 +1,45 @@
+import { afterEach, describe, expect, it, vi } from 'vitest';
+import { resetUploadUrls } from '../../config/uploadUrls';
+import { postImage } from './post';
+vi.mock('chayns-api', () => ({
+  getAccessToken: vi.fn().mockResolvedValue({
+    accessToken: 'access-token'
+  }),
+  getSite: vi.fn().mockReturnValue({
+    id: 'site-id'
+  }),
+  getUser: vi.fn().mockReturnValue({
+    personId: 'person-id'
+  })
+}));
+describe('postImage', () => {
+  afterEach(() => {
+    resetUploadUrls();
+    vi.unstubAllGlobals();
+  });
+  it('uses an explicitly provided upload path instead of the default user path', async () => {
+    const fetchMock = vi.fn().mockResolvedValue({
+      ok: true,
+      json: vi.fn().mockResolvedValue({
+        baseDomain: 'https://tsimg.cloud/',
+        image: {
+          path: 'image-path',
+          preview: 'preview',
+          width: 1,
+          height: 1
+        }
+      })
+    });
+    vi.stubGlobal('fetch', fetchMock);
+    await postImage({
+      file: new File(['image'], 'image.png', {
+        type: 'image/png'
+      }),
+      uploadPath: 'threads/thread-id'
+    });
+    expect(fetchMock).toHaveBeenCalledWith('https://cube.tobit.cloud/image-service/v3/Images/threads/thread-id', expect.objectContaining({
+      method: 'POST'
+    }));
+  });
+});
+//# sourceMappingURL=post.test.js.map

package/lib/esm/api/image/post.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"post.test.js","names":["afterEach","describe","expect","it","vi","resetUploadUrls","postImage","mock","getAccessToken","fn","mockResolvedValue","accessToken","getSite","mockReturnValue","id","getUser","personId","unstubAllGlobals","fetchMock","ok","json","baseDomain","image","path","preview","width","height","stubGlobal","file","File","type","uploadPath","toHaveBeenCalledWith","objectContaining","method"],"sources":["../../../../src/api/image/post.test.ts"],"sourcesContent":["import { afterEach, describe, expect, it, vi } from 'vitest';\nimport { resetUploadUrls } from '../../config/uploadUrls';\nimport { postImage } from './post';\n\nvi.mock('chayns-api', () => ({\n    getAccessToken: vi.fn().mockResolvedValue({ accessToken: 'access-token' }),\n    getSite: vi.fn().mockReturnValue({ id: 'site-id' }),\n    getUser: vi.fn().mockReturnValue({ personId: 'person-id' }),\n}));\n\ndescribe('postImage', () => {\n    afterEach(() => {\n        resetUploadUrls();\n        vi.unstubAllGlobals();\n    });\n\n    it('uses an explicitly provided upload path instead of the default user path', async () => {\n        const fetchMock = vi.fn().mockResolvedValue({\n            ok: true,\n            json: vi.fn().mockResolvedValue({\n                baseDomain: 'https://tsimg.cloud/',\n                image: {\n                    path: 'image-path',\n                    preview: 'preview',\n                    width: 1,\n                    height: 1,\n                },\n            }),\n        });\n        vi.stubGlobal('fetch', fetchMock);\n\n        await postImage({\n            file: new File(['image'], 'image.png', { type: 'image/png' }),\n            uploadPath: 'threads/thread-id',\n        });\n\n        expect(fetchMock).toHaveBeenCalledWith(\n            'https://cube.tobit.cloud/image-service/v3/Images/threads/thread-id',\n            expect.objectContaining({ method: 'POST' }),\n        );\n    });\n});\n"],"mappings":"AAAA,SAASA,SAAS,EAAEC,QAAQ,EAAEC,MAAM,EAAEC,EAAE,EAAEC,EAAE,QAAQ,QAAQ;AAC5D,SAASC,eAAe,QAAQ,yBAAyB;AACzD,SAASC,SAAS,QAAQ,QAAQ;AAElCF,EAAE,CAACG,IAAI,CAAC,YAAY,EAAE,OAAO;EACzBC,cAAc,EAAEJ,EAAE,CAACK,EAAE,CAAC,CAAC,CAACC,iBAAiB,CAAC;IAAEC,WAAW,EAAE;EAAe,CAAC,CAAC;EAC1EC,OAAO,EAAER,EAAE,CAACK,EAAE,CAAC,CAAC,CAACI,eAAe,CAAC;IAAEC,EAAE,EAAE;EAAU,CAAC,CAAC;EACnDC,OAAO,EAAEX,EAAE,CAACK,EAAE,CAAC,CAAC,CAACI,eAAe,CAAC;IAAEG,QAAQ,EAAE;EAAY,CAAC;AAC9D,CAAC,CAAC,CAAC;AAEHf,QAAQ,CAAC,WAAW,EAAE,MAAM;EACxBD,SAAS,CAAC,MAAM;IACZK,eAAe,CAAC,CAAC;IACjBD,EAAE,CAACa,gBAAgB,CAAC,CAAC;EACzB,CAAC,CAAC;EAEFd,EAAE,CAAC,0EAA0E,EAAE,YAAY;IACvF,MAAMe,SAAS,GAAGd,EAAE,CAACK,EAAE,CAAC,CAAC,CAACC,iBAAiB,CAAC;MACxCS,EAAE,EAAE,IAAI;MACRC,IAAI,EAAEhB,EAAE,CAACK,EAAE,CAAC,CAAC,CAACC,iBAAiB,CAAC;QAC5BW,UAAU,EAAE,sBAAsB;QAClCC,KAAK,EAAE;UACHC,IAAI,EAAE,YAAY;UAClBC,OAAO,EAAE,SAAS;UAClBC,KAAK,EAAE,CAAC;UACRC,MAAM,EAAE;QACZ;MACJ,CAAC;IACL,CAAC,CAAC;IACFtB,EAAE,CAACuB,UAAU,CAAC,OAAO,EAAET,SAAS,CAAC;IAEjC,MAAMZ,SAAS,CAAC;MACZsB,IAAI,EAAE,IAAIC,IAAI,CAAC,CAAC,OAAO,CAAC,EAAE,WAAW,EAAE;QAAEC,IAAI,EAAE;MAAY,CAAC,CAAC;MAC7DC,UAAU,EAAE;IAChB,CAAC,CAAC;IAEF7B,MAAM,CAACgB,SAAS,CAAC,CAACc,oBAAoB,CAClC,oEAAoE,EACpE9B,MAAM,CAAC+B,gBAAgB,CAAC;MAAEC,MAAM,EAAE;IAAO,CAAC,CAC9C,CAAC;EACL,CAAC,CAAC;AACN,CAAC,CAAC","ignoreList":[]}

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

@@ -355,10 +355,14 @@ const ComboBox = /*#__PURE__*/forwardRef(({
     tabIndex: !isDisabled && typeof inputValue !== 'string' ? 0 : undefined,
     role: !isDisabled && typeof inputValue !== 'string' ? 'button' : undefined,
     "aria-expanded": !isDisabled && typeof inputValue !== 'string' ? isAnimating : undefined
-  }, /*#__PURE__*/React.createElement(StyledComboBoxPrefixAndPlaceholderWrapper, null, prefix && /*#__PURE__*/React.createElement(StyledComboBoxPrefix, {
-    $prefixMinWidth: prefixMinWidth
+  }, /*#__PURE__*/React.createElement(StyledComboBoxPrefixAndPlaceholderWrapper, {
+    $size: size
+  }, prefix && /*#__PURE__*/React.createElement(StyledComboBoxPrefix, {
+    $prefixMinWidth: prefixMinWidth,
+    $size: size
   }, prefix), /*#__PURE__*/React.createElement(StyledComboBoxPlaceholder, {
-    $shouldReduceOpacity: !selectedItem && !internalSelectedItem
+    $shouldReduceOpacity: !selectedItem && !internalSelectedItem,
+    $size: size
   }, placeholderImageUrl && /*#__PURE__*/React.createElement(StyledComboBoxPlaceholderImage, {
     src: placeholderImageUrl,
     $shouldShowBigImage: shouldShowBigImage,
@@ -375,16 +379,19 @@ const ComboBox = /*#__PURE__*/forwardRef(({
     placeholder: placeholderText
   }) : /*#__PURE__*/React.createElement(StyledComboBoxPlaceholderText, null, placeholderText), internalSelectedItem && internalSelectedItem.suffixElement && internalSelectedItem.suffixElement)), shouldShowClearIcon && internalSelectedItem && /*#__PURE__*/React.createElement(StyledComboBoxClearIconWrapper, {
     $isDisabled: isDisabled,
+    $size: size,
     onClick: handleClear
   }, /*#__PURE__*/React.createElement(Icon, {
-    icons: ['fa fa-times']
+    icons: ['fa fa-times'],
+    size: size === ComboBoxSize.MINI ? 13 : 15
   })), !shouldDisableActions && /*#__PURE__*/React.createElement(StyledComboBoxIconWrapper, {
     $isDisabled: isDisabled,
     $size: size,
     $shouldShowBorderLeft: shouldShowClearIcon === true && internalSelectedItem !== undefined
   }, /*#__PURE__*/React.createElement(Icon, {
     icons: ['fa fa-chevron-down'],
-    isDisabled: isDisabled
+    isDisabled: isDisabled,
+    size: size === ComboBoxSize.MINI ? 13 : 15
   }))), styledComboBoxElementRef.current && /*#__PURE__*/React.createElement(DropdownBodyWrapper, {
     anchorElement: styledComboBoxElementRef.current,
     bodyWidth: bodyWidth,

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

@@ -1 +1 @@
-{"version":3,"file":"ComboBox.js","names":["useFunctions","useValues","React","forwardRef","Fragment","useCallback","useContext","useEffect","useImperativeHandle","useMemo","useRef","useState","useIsTouch","AreaContext","Icon","ComboBoxItem","StyledComboBox","StyledComboBoxBody","StyledComboBoxClearIconWrapper","StyledComboBoxHeader","StyledComboBoxIconWrapper","StyledComboBoxInput","StyledComboBoxPlaceholder","StyledComboBoxPlaceholderImage","StyledComboBoxPlaceholderText","StyledComboBoxPrefix","StyledComboBoxPrefixAndPlaceholderWrapper","StyledComboBoxTopic","DropdownBodyWrapper","DropdownDirection","useElementSize","ComboBoxSize","getComboBoxWidthResult","useFocusRingPortal","useKeyboardFocusHighlighting","ComboBox","bodyWidth","direction","RIGHT","isDisabled","lists","maxHeight","onSelect","placeholder","prefix","container","shouldCaptureEvents","selectedItem","onHide","onShow","shouldShowBigImage","shouldShowClearIcon","shouldShowRoundImage","onInputFocus","prefixMinWidth","size","NORMAL","shouldUseFullWidth","onInputChange","shouldUseCurrentItemWidth","onInputBlur","shouldShowTransparentBackground","inputValue","shouldDropDownUseMaxItemWidth","shouldEnableKeyboardHighlighting","ref","internalSelectedItem","setInternalSelectedItem","isAnimating","setIsAnimating","minWidth","setMinWidth","undefined","bodyMinWidth","setBodyMinWidth","focusedIndex","setFocusedIndex","availableMaxHeight","setAvailableMaxHeight","isInputFocused","styledComboBoxElementRef","comboBoxHeaderRef","comboBoxInputRef","contentRef","parentSize","shouldUseParentElement","functions","values","isTouch","areaProvider","calculatedMinWidth","calculatedBodyMinWidth","parentWidth","width","shouldChangeColor","shouldShowKeyboardHighlighting","isEnabled","shouldDisableActions","combinedLists","flatMap","list","length","some","item","value","effectiveMaxHeight","Math","min","contentHeight","flatItems","height","reduce","isBigItem","subtext","trim","handleInputFocus","event","current","handleInputBlur","handleOpen","handleClose","handleContainerBlur","nextFocusedElement","relatedTarget","currentContainer","currentTarget","contains","restoreTriggerFocus","requestAnimationFrame","focus","handleSetSelectedItem","itemToSelect","onSelectResult","Promise","then","shouldPreventSelection","handleClear","preventDefault","stopPropagation","handleKeyDown","e","key","children","stepDirection","newIndex","attempts","newElement","shouldSkip","id","startsWith","endsWith","prevElement","tabIndex","focusedElement","element","newSelectedItem","find","String","replace","document","addEventListener","removeEventListener","placeholderImageUrl","imageUrl","placeholderIcon","icons","placeholderText","text","shouldShowRoundPlaceholderImage","selectedItemList","handleHeaderClick","handleHeaderKeyDown","hide","show","comboBoxGroups","map","createElement","groupName","isSelected","$minWidth","$shouldUseFullWidth","onBlur","$direction","onClick","$isOpen","$isTouch","$size","$shouldShowTransparentBackground","$isDisabled","$shouldChangeColor","$shouldShowBigImage","onKeyDown","role","$prefixMinWidth","$shouldReduceOpacity","src","$shouldShowRoundImage","disabled","onChange","onFocus","suffixElement","$shouldShowBorderLeft","anchorElement","onAvailableMaxHeightChange","onClose","shouldShowDropdown","minBodyWidth","$maxHeight","className","displayName"],"sources":["../../../../src/components/combobox/ComboBox.tsx"],"sourcesContent":["import { useFunctions, useValues } from 'chayns-api';\nimport React, {\n    FocusEventHandler,\n    KeyboardEventHandler,\n    forwardRef,\n    Fragment,\n    useCallback,\n    useContext,\n    useEffect,\n    useImperativeHandle,\n    useMemo,\n    useRef,\n    useState,\n} from 'react';\nimport { useIsTouch } from '../../utils/environment';\nimport { AreaContext } from '../area-provider/AreaContextProvider';\nimport Icon from '../icon/Icon';\nimport ComboBoxItem from './combobox-item/ComboBoxItem';\nimport {\n    StyledComboBox,\n    StyledComboBoxBody,\n    StyledComboBoxClearIconWrapper,\n    StyledComboBoxHeader,\n    StyledComboBoxIconWrapper,\n    StyledComboBoxInput,\n    StyledComboBoxPlaceholder,\n    StyledComboBoxPlaceholderImage,\n    StyledComboBoxPlaceholderText,\n    StyledComboBoxPrefix,\n    StyledComboBoxPrefixAndPlaceholderWrapper,\n    StyledComboBoxTopic,\n} from './ComboBox.styles';\nimport DropdownBodyWrapper from '../dropdown-body-wrapper/DropdownBodyWrapper';\nimport { DropdownDirection } from '../../types/dropdown';\nimport { useElementSize } from '../../hooks/element';\nimport { ComboBoxProps, ComboBoxRef, ComboBoxSize, IComboBoxItem } from './ComboBox.types';\nimport { getComboBoxWidthResult } from './ComboBox.utils';\nimport { useFocusRingPortal } from '../../hooks/useFocusRingPortal';\nimport { useKeyboardFocusHighlighting } from '../../hooks/useKeyboardFocusHighlighting';\n\nconst ComboBox = forwardRef<ComboBoxRef, ComboBoxProps>(\n    (\n        {\n            bodyWidth,\n            direction = DropdownDirection.RIGHT,\n            isDisabled = false,\n            lists,\n            maxHeight = 280,\n            onSelect,\n            placeholder,\n            prefix,\n            container,\n            shouldCaptureEvents,\n            selectedItem,\n            onHide,\n            onShow,\n            shouldShowBigImage,\n            shouldShowClearIcon,\n            shouldShowRoundImage,\n            onInputFocus,\n            prefixMinWidth,\n            size = ComboBoxSize.NORMAL,\n            shouldUseFullWidth = false,\n            onInputChange,\n            shouldUseCurrentItemWidth = false,\n            onInputBlur,\n            shouldShowTransparentBackground = false,\n            inputValue,\n            shouldDropDownUseMaxItemWidth = false,\n            shouldEnableKeyboardHighlighting,\n        },\n        ref,\n    ) => {\n        const [internalSelectedItem, setInternalSelectedItem] = useState<IComboBoxItem>();\n        const [isAnimating, setIsAnimating] = useState(false);\n        const [minWidth, setMinWidth] = useState<number | undefined>(undefined);\n        const [bodyMinWidth, setBodyMinWidth] = useState(0);\n        const [focusedIndex, setFocusedIndex] = useState<number | null>(null);\n        const [availableMaxHeight, setAvailableMaxHeight] = useState<number | undefined>(undefined);\n\n        const isInputFocused = useRef(false);\n        const styledComboBoxElementRef = useRef<HTMLDivElement>(null);\n        const comboBoxHeaderRef = useRef<HTMLDivElement>(null);\n        const comboBoxInputRef = useRef<HTMLInputElement>(null);\n        const contentRef = useRef<HTMLDivElement | null>(null);\n\n        const parentSize = useElementSize(styledComboBoxElementRef, {\n            shouldUseParentElement: true,\n        });\n\n        const functions = useFunctions();\n        const values = useValues();\n        const isTouch = useIsTouch();\n        const areaProvider = useContext(AreaContext);\n\n        useEffect(() => {\n            if (!parentSize) {\n                return;\n            }\n\n            const { minWidth: calculatedMinWidth, bodyMinWidth: calculatedBodyMinWidth } =\n                getComboBoxWidthResult({\n                    functions,\n                    internalSelectedItem,\n                    lists,\n                    parentWidth: parentSize.width,\n                    placeholder,\n                    prefix,\n                    prefixMinWidth,\n                    selectedItem,\n                    shouldDropDownUseMaxItemWidth,\n                    shouldShowBigImage,\n                    shouldShowClearIcon,\n                    shouldUseCurrentItemWidth,\n                    shouldUseFullWidth,\n                    values,\n                });\n\n            setMinWidth(calculatedMinWidth);\n            setBodyMinWidth(calculatedBodyMinWidth);\n        }, [\n            functions,\n            internalSelectedItem,\n            lists,\n            parentSize,\n            placeholder,\n            prefix,\n            prefixMinWidth,\n            selectedItem,\n            shouldDropDownUseMaxItemWidth,\n            shouldShowBigImage,\n            shouldShowClearIcon,\n            shouldUseCurrentItemWidth,\n            shouldUseFullWidth,\n            values,\n        ]);\n\n        const shouldChangeColor = useMemo(\n            () => areaProvider.shouldChangeColor ?? false,\n            [areaProvider.shouldChangeColor],\n        );\n\n        const shouldShowKeyboardHighlighting = useKeyboardFocusHighlighting(\n            shouldEnableKeyboardHighlighting && !isDisabled,\n        );\n        useFocusRingPortal(comboBoxHeaderRef, {\n            isEnabled: shouldShowKeyboardHighlighting && typeof inputValue !== 'string',\n        });\n        useFocusRingPortal(comboBoxInputRef, {\n            isEnabled: shouldShowKeyboardHighlighting && typeof inputValue === 'string',\n        });\n\n        const shouldDisableActions = useMemo(() => {\n            if (!selectedItem) {\n                return false;\n            }\n\n            const combinedLists = lists.flatMap((list) => list.list);\n\n            return (\n                combinedLists.length === 1 &&\n                combinedLists.some((item) => item.value === selectedItem.value)\n            );\n        }, [lists, selectedItem]);\n\n        // Limits the configured maxHeight by the height that is actually available inside the\n        // container (reported by the DropdownBodyWrapper). This prevents the dropdown from being cut\n        // off when it is opened to the top or bottom and there is not enough space.\n        const effectiveMaxHeight = useMemo(() => {\n            if (typeof availableMaxHeight === 'number' && availableMaxHeight > 0) {\n                return Math.min(maxHeight, availableMaxHeight);\n            }\n\n            return maxHeight;\n        }, [availableMaxHeight, maxHeight]);\n\n        const contentHeight = useMemo(() => {\n            const flatItems = lists.flatMap((list) => list.list);\n\n            let height = flatItems.reduce((value, item) => {\n                const isBigItem =\n                    shouldShowBigImage ||\n                    (typeof item.subtext === 'string' && item.subtext.trim() !== '');\n\n                return value + (isBigItem ? 56 : 38);\n            }, 0);\n\n            if (lists.length > 1) {\n                height += lists.length * 38;\n            }\n\n            if (effectiveMaxHeight < height) {\n                height = effectiveMaxHeight;\n            }\n\n            return height;\n        }, [effectiveMaxHeight, lists, shouldShowBigImage]);\n\n        const handleInputFocus: FocusEventHandler<HTMLInputElement> = useCallback(\n            (event) => {\n                isInputFocused.current = true;\n                onInputFocus?.(event);\n            },\n            [onInputFocus],\n        );\n\n        const handleInputBlur: FocusEventHandler<HTMLInputElement> = useCallback(\n            (event) => {\n                isInputFocused.current = false;\n                onInputBlur?.(event);\n            },\n            [onInputBlur],\n        );\n\n        const handleOpen = useCallback(() => {\n            if (typeof onShow === 'function') {\n                onShow();\n            }\n\n            setIsAnimating(true);\n        }, [onShow]);\n\n        const handleClose = useCallback(() => {\n            if (typeof onHide === 'function') {\n                onHide();\n            }\n\n            setIsAnimating(false);\n        }, [onHide]);\n\n        const handleContainerBlur = useCallback(\n            (event: React.FocusEvent<HTMLDivElement>) => {\n                const nextFocusedElement = event.relatedTarget as Node | null;\n                const currentContainer = event.currentTarget as HTMLElement;\n\n                if (\n                    !nextFocusedElement ||\n                    (!currentContainer.contains(nextFocusedElement) &&\n                        !contentRef.current?.contains(nextFocusedElement))\n                ) {\n                    handleClose();\n                }\n            },\n            [handleClose],\n        );\n\n        const restoreTriggerFocus = useCallback(() => {\n            // Delay is needed so focus happens after dropdown close/render cycle.\n            requestAnimationFrame(() => {\n                if (typeof inputValue === 'string') {\n                    comboBoxInputRef.current?.focus();\n                    return;\n                }\n\n                comboBoxHeaderRef.current?.focus();\n            });\n        }, [inputValue]);\n\n        /**\n         * This function sets the selected item\n         */\n        const handleSetSelectedItem = useCallback(\n            (itemToSelect?: IComboBoxItem) => {\n                if (typeof onSelect === 'function') {\n                    const onSelectResult = onSelect(itemToSelect);\n\n                    if (onSelectResult === false) {\n                        return;\n                    }\n\n                    if (onSelectResult instanceof Promise) {\n                        void onSelectResult.then((shouldPreventSelection) => {\n                            if (shouldPreventSelection) return;\n\n                            setInternalSelectedItem(itemToSelect);\n                            handleClose();\n                            restoreTriggerFocus();\n                        });\n\n                        return;\n                    }\n                }\n\n                setInternalSelectedItem(itemToSelect);\n                handleClose();\n                restoreTriggerFocus();\n            },\n            [handleClose, onSelect, restoreTriggerFocus],\n        );\n\n        const handleClear = useCallback(\n            (event: React.MouseEvent<HTMLDivElement>) => {\n                event.preventDefault();\n                event.stopPropagation();\n\n                handleSetSelectedItem(undefined);\n            },\n            [handleSetSelectedItem],\n        );\n\n        useEffect(() => {\n            const handleKeyDown = (e: KeyboardEvent) => {\n                if (!isAnimating) return;\n\n                if (e.key === 'Escape') {\n                    e.preventDefault();\n                    handleClose();\n                    restoreTriggerFocus();\n                    return;\n                }\n\n                if (e.key === 'ArrowUp' || e.key === 'ArrowDown') {\n                    e.preventDefault();\n\n                    const children = contentRef.current?.children;\n\n                    if (!children || children.length === 0) return;\n\n                    const stepDirection = e.key === 'ArrowUp' ? -1 : 1;\n\n                    let newIndex = focusedIndex ?? -1;\n\n                    let attempts = 0;\n\n                    do {\n                        newIndex = (newIndex + stepDirection + children.length) % children.length;\n\n                        const newElement = children[newIndex] as HTMLDivElement;\n\n                        let shouldSkip = false;\n\n                        if (\n                            newElement.id.startsWith('combobox-group--') ||\n                            newElement.id.endsWith('--disabled-item')\n                        ) {\n                            shouldSkip = true;\n                        }\n\n                        if (!shouldSkip) break;\n\n                        attempts++;\n                    } while (attempts < children.length);\n\n                    if (focusedIndex !== null) {\n                        const prevElement = children[focusedIndex] as HTMLDivElement;\n\n                        prevElement.tabIndex = -1;\n                    }\n\n                    setFocusedIndex(newIndex);\n\n                    const focusedElement = children[newIndex] as HTMLDivElement;\n\n                    focusedElement.tabIndex = 0;\n                    focusedElement.focus();\n                } else if ((e.key === 'Enter' || e.key === ' ') && focusedIndex !== null) {\n                    e.preventDefault();\n                    const element = contentRef.current?.children[focusedIndex];\n\n                    if (!element) return;\n\n                    const { id } = element;\n\n                    let newSelectedItem: IComboBoxItem | undefined;\n\n                    lists.some((list) => {\n                        newSelectedItem = list.list.find(\n                            ({ value }) => String(value) === id.replace('combobox-item__', ''),\n                        );\n\n                        return !!newSelectedItem;\n                    });\n\n                    if (newSelectedItem) {\n                        handleSetSelectedItem(newSelectedItem);\n                    }\n                }\n            };\n\n            document.addEventListener('keydown', handleKeyDown);\n\n            return () => document.removeEventListener('keydown', handleKeyDown);\n        }, [\n            focusedIndex,\n            handleClose,\n            handleSetSelectedItem,\n            isAnimating,\n            lists,\n            restoreTriggerFocus,\n        ]);\n\n        /**\n         * This function sets the external selected item\n         */\n        useEffect(() => {\n            setIsAnimating(false);\n            setInternalSelectedItem(selectedItem);\n        }, [selectedItem]);\n\n        const placeholderImageUrl = useMemo(() => {\n            if (selectedItem) {\n                return selectedItem.imageUrl;\n            }\n\n            if (internalSelectedItem) {\n                return internalSelectedItem.imageUrl;\n            }\n\n            return undefined;\n        }, [internalSelectedItem, selectedItem]);\n\n        const placeholderIcon = useMemo(() => {\n            if (selectedItem) {\n                return selectedItem.icons;\n            }\n\n            if (internalSelectedItem) {\n                return internalSelectedItem.icons;\n            }\n\n            return undefined;\n        }, [internalSelectedItem, selectedItem]);\n\n        /**\n         * This function resets the placeholder\n         */\n        const placeholderText = useMemo(() => {\n            let text = placeholder;\n\n            if (selectedItem) {\n                text = selectedItem.text;\n            } else if (internalSelectedItem) {\n                text = internalSelectedItem.text;\n            }\n\n            return text;\n        }, [internalSelectedItem, placeholder, selectedItem]);\n\n        const shouldShowRoundPlaceholderImage = useMemo(() => {\n            const selectedItemList = lists.find((list) =>\n                list.list.some(\n                    ({ value }) => value === (selectedItem?.value ?? internalSelectedItem?.value),\n                ),\n            );\n\n            return selectedItemList?.shouldShowRoundImage ?? shouldShowRoundImage;\n        }, [internalSelectedItem?.value, lists, selectedItem?.value, shouldShowRoundImage]);\n\n        /**\n         * This function opens the content of the combobox\n         */\n        const handleHeaderClick = useCallback(() => {\n            if (!isDisabled && !isInputFocused.current) {\n                if (isAnimating) {\n                    handleClose();\n                } else {\n                    handleOpen();\n                }\n            }\n        }, [handleClose, handleOpen, isAnimating, isDisabled]);\n\n        const handleHeaderKeyDown: KeyboardEventHandler<HTMLDivElement> = useCallback(\n            (event) => {\n                if (isDisabled || typeof inputValue === 'string') {\n                    return;\n                }\n\n                if (event.key === 'Escape' && isAnimating) {\n                    event.preventDefault();\n                    handleClose();\n                    restoreTriggerFocus();\n                    return;\n                }\n\n                if (event.key === 'Enter' || event.key === ' ') {\n                    event.preventDefault();\n                    handleHeaderClick();\n                }\n            },\n            [\n                handleClose,\n                handleHeaderClick,\n                inputValue,\n                isAnimating,\n                isDisabled,\n                restoreTriggerFocus,\n            ],\n        );\n\n        useImperativeHandle(\n            ref,\n            () => ({\n                hide: handleClose,\n                show: handleOpen,\n            }),\n            [handleClose, handleOpen],\n        );\n\n        const comboBoxGroups = useMemo(\n            () =>\n                lists.map((list) => (\n                    <Fragment key={list.groupName ?? 'default-group'}>\n                        {list.groupName && lists.length > 1 && (\n                            <StyledComboBoxTopic id={`combobox-group--${list.groupName}`}>\n                                {list.groupName}\n                            </StyledComboBoxTopic>\n                        )}\n                        {list.list.map((item) => (\n                            <ComboBoxItem\n                                key={`item-${item.text}`}\n                                item={item}\n                                isSelected={\n                                    selectedItem ? item.value === selectedItem.value : false\n                                }\n                                onSelect={handleSetSelectedItem}\n                                shouldShowBigImage={shouldShowBigImage}\n                                shouldShowRoundImage={\n                                    list.shouldShowRoundImage ?? shouldShowRoundImage\n                                }\n                            />\n                        ))}\n                    </Fragment>\n                )),\n            [handleSetSelectedItem, lists, selectedItem, shouldShowBigImage, shouldShowRoundImage],\n        );\n\n        return useMemo(\n            () => (\n                <StyledComboBox\n                    ref={styledComboBoxElementRef}\n                    $minWidth={minWidth}\n                    $shouldUseFullWidth={shouldUseFullWidth}\n                    onBlur={handleContainerBlur}\n                >\n                    <StyledComboBoxHeader\n                        ref={comboBoxHeaderRef}\n                        $direction={direction}\n                        onClick={handleHeaderClick}\n                        $isOpen={isAnimating}\n                        $isTouch={isTouch}\n                        $size={size}\n                        $shouldShowTransparentBackground={shouldShowTransparentBackground}\n                        $isDisabled={isDisabled}\n                        $shouldChangeColor={shouldChangeColor}\n                        $shouldShowBigImage={shouldShowBigImage}\n                        onKeyDown={handleHeaderKeyDown}\n                        tabIndex={!isDisabled && typeof inputValue !== 'string' ? 0 : undefined}\n                        role={!isDisabled && typeof inputValue !== 'string' ? 'button' : undefined}\n                        aria-expanded={\n                            !isDisabled && typeof inputValue !== 'string' ? isAnimating : undefined\n                        }\n                    >\n                        <StyledComboBoxPrefixAndPlaceholderWrapper>\n                            {prefix && (\n                                <StyledComboBoxPrefix $prefixMinWidth={prefixMinWidth}>\n                                    {prefix}\n                                </StyledComboBoxPrefix>\n                            )}\n                            <StyledComboBoxPlaceholder\n                                $shouldReduceOpacity={!selectedItem && !internalSelectedItem}\n                            >\n                                {placeholderImageUrl && (\n                                    <StyledComboBoxPlaceholderImage\n                                        src={placeholderImageUrl}\n                                        $shouldShowBigImage={shouldShowBigImage}\n                                        $shouldShowRoundImage={shouldShowRoundPlaceholderImage}\n                                    />\n                                )}\n                                {placeholderIcon && <Icon icons={placeholderIcon} />}\n                                {typeof inputValue === 'string' ? (\n                                    <StyledComboBoxInput\n                                        ref={comboBoxInputRef}\n                                        disabled={isDisabled}\n                                        value={inputValue}\n                                        onChange={onInputChange}\n                                        onBlur={handleInputBlur}\n                                        onFocus={handleInputFocus}\n                                        placeholder={placeholderText}\n                                    />\n                                ) : (\n                                    <StyledComboBoxPlaceholderText>\n                                        {placeholderText}\n                                    </StyledComboBoxPlaceholderText>\n                                )}\n                                {internalSelectedItem &&\n                                    internalSelectedItem.suffixElement &&\n                                    internalSelectedItem.suffixElement}\n                            </StyledComboBoxPlaceholder>\n                        </StyledComboBoxPrefixAndPlaceholderWrapper>\n                        {shouldShowClearIcon && internalSelectedItem && (\n                            <StyledComboBoxClearIconWrapper\n                                $isDisabled={isDisabled}\n                                onClick={handleClear}\n                            >\n                                <Icon icons={['fa fa-times']} />\n                            </StyledComboBoxClearIconWrapper>\n                        )}\n                        {!shouldDisableActions && (\n                            <StyledComboBoxIconWrapper\n                                $isDisabled={isDisabled}\n                                $size={size}\n                                $shouldShowBorderLeft={\n                                    shouldShowClearIcon === true &&\n                                    internalSelectedItem !== undefined\n                                }\n                            >\n                                <Icon icons={['fa fa-chevron-down']} isDisabled={isDisabled} />\n                            </StyledComboBoxIconWrapper>\n                        )}\n                    </StyledComboBoxHeader>\n                    {styledComboBoxElementRef.current && (\n                        <DropdownBodyWrapper\n                            anchorElement={styledComboBoxElementRef.current}\n                            bodyWidth={bodyWidth}\n                            contentHeight={contentHeight}\n                            shouldCaptureEvents={shouldCaptureEvents}\n                            onAvailableMaxHeightChange={setAvailableMaxHeight}\n                            onClose={handleClose}\n                            direction={direction}\n                            container={container}\n                            shouldShowDropdown={isAnimating}\n                            minBodyWidth={bodyWidth ?? bodyMinWidth}\n                        >\n                            <StyledComboBoxBody\n                                $maxHeight={effectiveMaxHeight}\n                                $minWidth={bodyWidth ?? bodyMinWidth}\n                                className=\"chayns-scrollbar\"\n                                ref={contentRef}\n                                tabIndex={0}\n                            >\n                                {comboBoxGroups}\n                            </StyledComboBoxBody>\n                        </DropdownBodyWrapper>\n                    )}\n                </StyledComboBox>\n            ),\n            [\n                bodyMinWidth,\n                bodyWidth,\n                comboBoxGroups,\n                container,\n                contentHeight,\n                direction,\n                handleClear,\n                handleClose,\n                handleHeaderClick,\n                handleHeaderKeyDown,\n                handleInputBlur,\n                handleInputFocus,\n                inputValue,\n                internalSelectedItem,\n                isAnimating,\n                isDisabled,\n                isTouch,\n                effectiveMaxHeight,\n                minWidth,\n                onInputChange,\n                placeholderIcon,\n                placeholderImageUrl,\n                placeholderText,\n                prefix,\n                prefixMinWidth,\n                selectedItem,\n                shouldChangeColor,\n                shouldDisableActions,\n                shouldCaptureEvents,\n                shouldShowKeyboardHighlighting,\n                shouldShowBigImage,\n                shouldShowClearIcon,\n                shouldShowRoundPlaceholderImage,\n                shouldShowTransparentBackground,\n                shouldUseFullWidth,\n                size,\n            ],\n        );\n    },\n);\n\nComboBox.displayName = 'ComboBox';\n\nexport default ComboBox;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"ComboBox.js","names":["useFunctions","useValues","React","forwardRef","Fragment","useCallback","useContext","useEffect","useImperativeHandle","useMemo","useRef","useState","useIsTouch","AreaContext","Icon","ComboBoxItem","StyledComboBox","StyledComboBoxBody","StyledComboBoxClearIconWrapper","StyledComboBoxHeader","StyledComboBoxIconWrapper","StyledComboBoxInput","StyledComboBoxPlaceholder","StyledComboBoxPlaceholderImage","StyledComboBoxPlaceholderText","StyledComboBoxPrefix","StyledComboBoxPrefixAndPlaceholderWrapper","StyledComboBoxTopic","DropdownBodyWrapper","DropdownDirection","useElementSize","ComboBoxSize","getComboBoxWidthResult","useFocusRingPortal","useKeyboardFocusHighlighting","ComboBox","bodyWidth","direction","RIGHT","isDisabled","lists","maxHeight","onSelect","placeholder","prefix","container","shouldCaptureEvents","selectedItem","onHide","onShow","shouldShowBigImage","shouldShowClearIcon","shouldShowRoundImage","onInputFocus","prefixMinWidth","size","NORMAL","shouldUseFullWidth","onInputChange","shouldUseCurrentItemWidth","onInputBlur","shouldShowTransparentBackground","inputValue","shouldDropDownUseMaxItemWidth","shouldEnableKeyboardHighlighting","ref","internalSelectedItem","setInternalSelectedItem","isAnimating","setIsAnimating","minWidth","setMinWidth","undefined","bodyMinWidth","setBodyMinWidth","focusedIndex","setFocusedIndex","availableMaxHeight","setAvailableMaxHeight","isInputFocused","styledComboBoxElementRef","comboBoxHeaderRef","comboBoxInputRef","contentRef","parentSize","shouldUseParentElement","functions","values","isTouch","areaProvider","calculatedMinWidth","calculatedBodyMinWidth","parentWidth","width","shouldChangeColor","shouldShowKeyboardHighlighting","isEnabled","shouldDisableActions","combinedLists","flatMap","list","length","some","item","value","effectiveMaxHeight","Math","min","contentHeight","flatItems","height","reduce","isBigItem","subtext","trim","handleInputFocus","event","current","handleInputBlur","handleOpen","handleClose","handleContainerBlur","nextFocusedElement","relatedTarget","currentContainer","currentTarget","contains","restoreTriggerFocus","requestAnimationFrame","focus","handleSetSelectedItem","itemToSelect","onSelectResult","Promise","then","shouldPreventSelection","handleClear","preventDefault","stopPropagation","handleKeyDown","e","key","children","stepDirection","newIndex","attempts","newElement","shouldSkip","id","startsWith","endsWith","prevElement","tabIndex","focusedElement","element","newSelectedItem","find","String","replace","document","addEventListener","removeEventListener","placeholderImageUrl","imageUrl","placeholderIcon","icons","placeholderText","text","shouldShowRoundPlaceholderImage","selectedItemList","handleHeaderClick","handleHeaderKeyDown","hide","show","comboBoxGroups","map","createElement","groupName","isSelected","$minWidth","$shouldUseFullWidth","onBlur","$direction","onClick","$isOpen","$isTouch","$size","$shouldShowTransparentBackground","$isDisabled","$shouldChangeColor","$shouldShowBigImage","onKeyDown","role","$prefixMinWidth","$shouldReduceOpacity","src","$shouldShowRoundImage","disabled","onChange","onFocus","suffixElement","MINI","$shouldShowBorderLeft","anchorElement","onAvailableMaxHeightChange","onClose","shouldShowDropdown","minBodyWidth","$maxHeight","className","displayName"],"sources":["../../../../src/components/combobox/ComboBox.tsx"],"sourcesContent":["import { useFunctions, useValues } from 'chayns-api';\nimport React, {\n    FocusEventHandler,\n    KeyboardEventHandler,\n    forwardRef,\n    Fragment,\n    useCallback,\n    useContext,\n    useEffect,\n    useImperativeHandle,\n    useMemo,\n    useRef,\n    useState,\n} from 'react';\nimport { useIsTouch } from '../../utils/environment';\nimport { AreaContext } from '../area-provider/AreaContextProvider';\nimport Icon from '../icon/Icon';\nimport ComboBoxItem from './combobox-item/ComboBoxItem';\nimport {\n    StyledComboBox,\n    StyledComboBoxBody,\n    StyledComboBoxClearIconWrapper,\n    StyledComboBoxHeader,\n    StyledComboBoxIconWrapper,\n    StyledComboBoxInput,\n    StyledComboBoxPlaceholder,\n    StyledComboBoxPlaceholderImage,\n    StyledComboBoxPlaceholderText,\n    StyledComboBoxPrefix,\n    StyledComboBoxPrefixAndPlaceholderWrapper,\n    StyledComboBoxTopic,\n} from './ComboBox.styles';\nimport DropdownBodyWrapper from '../dropdown-body-wrapper/DropdownBodyWrapper';\nimport { DropdownDirection } from '../../types/dropdown';\nimport { useElementSize } from '../../hooks/element';\nimport { ComboBoxProps, ComboBoxRef, ComboBoxSize, IComboBoxItem } from './ComboBox.types';\nimport { getComboBoxWidthResult } from './ComboBox.utils';\nimport { useFocusRingPortal } from '../../hooks/useFocusRingPortal';\nimport { useKeyboardFocusHighlighting } from '../../hooks/useKeyboardFocusHighlighting';\n\nconst ComboBox = forwardRef<ComboBoxRef, ComboBoxProps>(\n    (\n        {\n            bodyWidth,\n            direction = DropdownDirection.RIGHT,\n            isDisabled = false,\n            lists,\n            maxHeight = 280,\n            onSelect,\n            placeholder,\n            prefix,\n            container,\n            shouldCaptureEvents,\n            selectedItem,\n            onHide,\n            onShow,\n            shouldShowBigImage,\n            shouldShowClearIcon,\n            shouldShowRoundImage,\n            onInputFocus,\n            prefixMinWidth,\n            size = ComboBoxSize.NORMAL,\n            shouldUseFullWidth = false,\n            onInputChange,\n            shouldUseCurrentItemWidth = false,\n            onInputBlur,\n            shouldShowTransparentBackground = false,\n            inputValue,\n            shouldDropDownUseMaxItemWidth = false,\n            shouldEnableKeyboardHighlighting,\n        },\n        ref,\n    ) => {\n        const [internalSelectedItem, setInternalSelectedItem] = useState<IComboBoxItem>();\n        const [isAnimating, setIsAnimating] = useState(false);\n        const [minWidth, setMinWidth] = useState<number | undefined>(undefined);\n        const [bodyMinWidth, setBodyMinWidth] = useState(0);\n        const [focusedIndex, setFocusedIndex] = useState<number | null>(null);\n        const [availableMaxHeight, setAvailableMaxHeight] = useState<number | undefined>(undefined);\n\n        const isInputFocused = useRef(false);\n        const styledComboBoxElementRef = useRef<HTMLDivElement>(null);\n        const comboBoxHeaderRef = useRef<HTMLDivElement>(null);\n        const comboBoxInputRef = useRef<HTMLInputElement>(null);\n        const contentRef = useRef<HTMLDivElement | null>(null);\n\n        const parentSize = useElementSize(styledComboBoxElementRef, {\n            shouldUseParentElement: true,\n        });\n\n        const functions = useFunctions();\n        const values = useValues();\n        const isTouch = useIsTouch();\n        const areaProvider = useContext(AreaContext);\n\n        useEffect(() => {\n            if (!parentSize) {\n                return;\n            }\n\n            const { minWidth: calculatedMinWidth, bodyMinWidth: calculatedBodyMinWidth } =\n                getComboBoxWidthResult({\n                    functions,\n                    internalSelectedItem,\n                    lists,\n                    parentWidth: parentSize.width,\n                    placeholder,\n                    prefix,\n                    prefixMinWidth,\n                    selectedItem,\n                    shouldDropDownUseMaxItemWidth,\n                    shouldShowBigImage,\n                    shouldShowClearIcon,\n                    shouldUseCurrentItemWidth,\n                    shouldUseFullWidth,\n                    values,\n                });\n\n            setMinWidth(calculatedMinWidth);\n            setBodyMinWidth(calculatedBodyMinWidth);\n        }, [\n            functions,\n            internalSelectedItem,\n            lists,\n            parentSize,\n            placeholder,\n            prefix,\n            prefixMinWidth,\n            selectedItem,\n            shouldDropDownUseMaxItemWidth,\n            shouldShowBigImage,\n            shouldShowClearIcon,\n            shouldUseCurrentItemWidth,\n            shouldUseFullWidth,\n            values,\n        ]);\n\n        const shouldChangeColor = useMemo(\n            () => areaProvider.shouldChangeColor ?? false,\n            [areaProvider.shouldChangeColor],\n        );\n\n        const shouldShowKeyboardHighlighting = useKeyboardFocusHighlighting(\n            shouldEnableKeyboardHighlighting && !isDisabled,\n        );\n        useFocusRingPortal(comboBoxHeaderRef, {\n            isEnabled: shouldShowKeyboardHighlighting && typeof inputValue !== 'string',\n        });\n        useFocusRingPortal(comboBoxInputRef, {\n            isEnabled: shouldShowKeyboardHighlighting && typeof inputValue === 'string',\n        });\n\n        const shouldDisableActions = useMemo(() => {\n            if (!selectedItem) {\n                return false;\n            }\n\n            const combinedLists = lists.flatMap((list) => list.list);\n\n            return (\n                combinedLists.length === 1 &&\n                combinedLists.some((item) => item.value === selectedItem.value)\n            );\n        }, [lists, selectedItem]);\n\n        // Limits the configured maxHeight by the height that is actually available inside the\n        // container (reported by the DropdownBodyWrapper). This prevents the dropdown from being cut\n        // off when it is opened to the top or bottom and there is not enough space.\n        const effectiveMaxHeight = useMemo(() => {\n            if (typeof availableMaxHeight === 'number' && availableMaxHeight > 0) {\n                return Math.min(maxHeight, availableMaxHeight);\n            }\n\n            return maxHeight;\n        }, [availableMaxHeight, maxHeight]);\n\n        const contentHeight = useMemo(() => {\n            const flatItems = lists.flatMap((list) => list.list);\n\n            let height = flatItems.reduce((value, item) => {\n                const isBigItem =\n                    shouldShowBigImage ||\n                    (typeof item.subtext === 'string' && item.subtext.trim() !== '');\n\n                return value + (isBigItem ? 56 : 38);\n            }, 0);\n\n            if (lists.length > 1) {\n                height += lists.length * 38;\n            }\n\n            if (effectiveMaxHeight < height) {\n                height = effectiveMaxHeight;\n            }\n\n            return height;\n        }, [effectiveMaxHeight, lists, shouldShowBigImage]);\n\n        const handleInputFocus: FocusEventHandler<HTMLInputElement> = useCallback(\n            (event) => {\n                isInputFocused.current = true;\n                onInputFocus?.(event);\n            },\n            [onInputFocus],\n        );\n\n        const handleInputBlur: FocusEventHandler<HTMLInputElement> = useCallback(\n            (event) => {\n                isInputFocused.current = false;\n                onInputBlur?.(event);\n            },\n            [onInputBlur],\n        );\n\n        const handleOpen = useCallback(() => {\n            if (typeof onShow === 'function') {\n                onShow();\n            }\n\n            setIsAnimating(true);\n        }, [onShow]);\n\n        const handleClose = useCallback(() => {\n            if (typeof onHide === 'function') {\n                onHide();\n            }\n\n            setIsAnimating(false);\n        }, [onHide]);\n\n        const handleContainerBlur = useCallback(\n            (event: React.FocusEvent<HTMLDivElement>) => {\n                const nextFocusedElement = event.relatedTarget as Node | null;\n                const currentContainer = event.currentTarget as HTMLElement;\n\n                if (\n                    !nextFocusedElement ||\n                    (!currentContainer.contains(nextFocusedElement) &&\n                        !contentRef.current?.contains(nextFocusedElement))\n                ) {\n                    handleClose();\n                }\n            },\n            [handleClose],\n        );\n\n        const restoreTriggerFocus = useCallback(() => {\n            // Delay is needed so focus happens after dropdown close/render cycle.\n            requestAnimationFrame(() => {\n                if (typeof inputValue === 'string') {\n                    comboBoxInputRef.current?.focus();\n                    return;\n                }\n\n                comboBoxHeaderRef.current?.focus();\n            });\n        }, [inputValue]);\n\n        /**\n         * This function sets the selected item\n         */\n        const handleSetSelectedItem = useCallback(\n            (itemToSelect?: IComboBoxItem) => {\n                if (typeof onSelect === 'function') {\n                    const onSelectResult = onSelect(itemToSelect);\n\n                    if (onSelectResult === false) {\n                        return;\n                    }\n\n                    if (onSelectResult instanceof Promise) {\n                        void onSelectResult.then((shouldPreventSelection) => {\n                            if (shouldPreventSelection) return;\n\n                            setInternalSelectedItem(itemToSelect);\n                            handleClose();\n                            restoreTriggerFocus();\n                        });\n\n                        return;\n                    }\n                }\n\n                setInternalSelectedItem(itemToSelect);\n                handleClose();\n                restoreTriggerFocus();\n            },\n            [handleClose, onSelect, restoreTriggerFocus],\n        );\n\n        const handleClear = useCallback(\n            (event: React.MouseEvent<HTMLDivElement>) => {\n                event.preventDefault();\n                event.stopPropagation();\n\n                handleSetSelectedItem(undefined);\n            },\n            [handleSetSelectedItem],\n        );\n\n        useEffect(() => {\n            const handleKeyDown = (e: KeyboardEvent) => {\n                if (!isAnimating) return;\n\n                if (e.key === 'Escape') {\n                    e.preventDefault();\n                    handleClose();\n                    restoreTriggerFocus();\n                    return;\n                }\n\n                if (e.key === 'ArrowUp' || e.key === 'ArrowDown') {\n                    e.preventDefault();\n\n                    const children = contentRef.current?.children;\n\n                    if (!children || children.length === 0) return;\n\n                    const stepDirection = e.key === 'ArrowUp' ? -1 : 1;\n\n                    let newIndex = focusedIndex ?? -1;\n\n                    let attempts = 0;\n\n                    do {\n                        newIndex = (newIndex + stepDirection + children.length) % children.length;\n\n                        const newElement = children[newIndex] as HTMLDivElement;\n\n                        let shouldSkip = false;\n\n                        if (\n                            newElement.id.startsWith('combobox-group--') ||\n                            newElement.id.endsWith('--disabled-item')\n                        ) {\n                            shouldSkip = true;\n                        }\n\n                        if (!shouldSkip) break;\n\n                        attempts++;\n                    } while (attempts < children.length);\n\n                    if (focusedIndex !== null) {\n                        const prevElement = children[focusedIndex] as HTMLDivElement;\n\n                        prevElement.tabIndex = -1;\n                    }\n\n                    setFocusedIndex(newIndex);\n\n                    const focusedElement = children[newIndex] as HTMLDivElement;\n\n                    focusedElement.tabIndex = 0;\n                    focusedElement.focus();\n                } else if ((e.key === 'Enter' || e.key === ' ') && focusedIndex !== null) {\n                    e.preventDefault();\n                    const element = contentRef.current?.children[focusedIndex];\n\n                    if (!element) return;\n\n                    const { id } = element;\n\n                    let newSelectedItem: IComboBoxItem | undefined;\n\n                    lists.some((list) => {\n                        newSelectedItem = list.list.find(\n                            ({ value }) => String(value) === id.replace('combobox-item__', ''),\n                        );\n\n                        return !!newSelectedItem;\n                    });\n\n                    if (newSelectedItem) {\n                        handleSetSelectedItem(newSelectedItem);\n                    }\n                }\n            };\n\n            document.addEventListener('keydown', handleKeyDown);\n\n            return () => document.removeEventListener('keydown', handleKeyDown);\n        }, [\n            focusedIndex,\n            handleClose,\n            handleSetSelectedItem,\n            isAnimating,\n            lists,\n            restoreTriggerFocus,\n        ]);\n\n        /**\n         * This function sets the external selected item\n         */\n        useEffect(() => {\n            setIsAnimating(false);\n            setInternalSelectedItem(selectedItem);\n        }, [selectedItem]);\n\n        const placeholderImageUrl = useMemo(() => {\n            if (selectedItem) {\n                return selectedItem.imageUrl;\n            }\n\n            if (internalSelectedItem) {\n                return internalSelectedItem.imageUrl;\n            }\n\n            return undefined;\n        }, [internalSelectedItem, selectedItem]);\n\n        const placeholderIcon = useMemo(() => {\n            if (selectedItem) {\n                return selectedItem.icons;\n            }\n\n            if (internalSelectedItem) {\n                return internalSelectedItem.icons;\n            }\n\n            return undefined;\n        }, [internalSelectedItem, selectedItem]);\n\n        /**\n         * This function resets the placeholder\n         */\n        const placeholderText = useMemo(() => {\n            let text = placeholder;\n\n            if (selectedItem) {\n                text = selectedItem.text;\n            } else if (internalSelectedItem) {\n                text = internalSelectedItem.text;\n            }\n\n            return text;\n        }, [internalSelectedItem, placeholder, selectedItem]);\n\n        const shouldShowRoundPlaceholderImage = useMemo(() => {\n            const selectedItemList = lists.find((list) =>\n                list.list.some(\n                    ({ value }) => value === (selectedItem?.value ?? internalSelectedItem?.value),\n                ),\n            );\n\n            return selectedItemList?.shouldShowRoundImage ?? shouldShowRoundImage;\n        }, [internalSelectedItem?.value, lists, selectedItem?.value, shouldShowRoundImage]);\n\n        /**\n         * This function opens the content of the combobox\n         */\n        const handleHeaderClick = useCallback(() => {\n            if (!isDisabled && !isInputFocused.current) {\n                if (isAnimating) {\n                    handleClose();\n                } else {\n                    handleOpen();\n                }\n            }\n        }, [handleClose, handleOpen, isAnimating, isDisabled]);\n\n        const handleHeaderKeyDown: KeyboardEventHandler<HTMLDivElement> = useCallback(\n            (event) => {\n                if (isDisabled || typeof inputValue === 'string') {\n                    return;\n                }\n\n                if (event.key === 'Escape' && isAnimating) {\n                    event.preventDefault();\n                    handleClose();\n                    restoreTriggerFocus();\n                    return;\n                }\n\n                if (event.key === 'Enter' || event.key === ' ') {\n                    event.preventDefault();\n                    handleHeaderClick();\n                }\n            },\n            [\n                handleClose,\n                handleHeaderClick,\n                inputValue,\n                isAnimating,\n                isDisabled,\n                restoreTriggerFocus,\n            ],\n        );\n\n        useImperativeHandle(\n            ref,\n            () => ({\n                hide: handleClose,\n                show: handleOpen,\n            }),\n            [handleClose, handleOpen],\n        );\n\n        const comboBoxGroups = useMemo(\n            () =>\n                lists.map((list) => (\n                    <Fragment key={list.groupName ?? 'default-group'}>\n                        {list.groupName && lists.length > 1 && (\n                            <StyledComboBoxTopic id={`combobox-group--${list.groupName}`}>\n                                {list.groupName}\n                            </StyledComboBoxTopic>\n                        )}\n                        {list.list.map((item) => (\n                            <ComboBoxItem\n                                key={`item-${item.text}`}\n                                item={item}\n                                isSelected={\n                                    selectedItem ? item.value === selectedItem.value : false\n                                }\n                                onSelect={handleSetSelectedItem}\n                                shouldShowBigImage={shouldShowBigImage}\n                                shouldShowRoundImage={\n                                    list.shouldShowRoundImage ?? shouldShowRoundImage\n                                }\n                            />\n                        ))}\n                    </Fragment>\n                )),\n            [handleSetSelectedItem, lists, selectedItem, shouldShowBigImage, shouldShowRoundImage],\n        );\n\n        return useMemo(\n            () => (\n                <StyledComboBox\n                    ref={styledComboBoxElementRef}\n                    $minWidth={minWidth}\n                    $shouldUseFullWidth={shouldUseFullWidth}\n                    onBlur={handleContainerBlur}\n                >\n                    <StyledComboBoxHeader\n                        ref={comboBoxHeaderRef}\n                        $direction={direction}\n                        onClick={handleHeaderClick}\n                        $isOpen={isAnimating}\n                        $isTouch={isTouch}\n                        $size={size}\n                        $shouldShowTransparentBackground={shouldShowTransparentBackground}\n                        $isDisabled={isDisabled}\n                        $shouldChangeColor={shouldChangeColor}\n                        $shouldShowBigImage={shouldShowBigImage}\n                        onKeyDown={handleHeaderKeyDown}\n                        tabIndex={!isDisabled && typeof inputValue !== 'string' ? 0 : undefined}\n                        role={!isDisabled && typeof inputValue !== 'string' ? 'button' : undefined}\n                        aria-expanded={\n                            !isDisabled && typeof inputValue !== 'string' ? isAnimating : undefined\n                        }\n                    >\n                        <StyledComboBoxPrefixAndPlaceholderWrapper $size={size}>\n                            {prefix && (\n                                <StyledComboBoxPrefix $prefixMinWidth={prefixMinWidth} $size={size}>\n                                    {prefix}\n                                </StyledComboBoxPrefix>\n                            )}\n                            <StyledComboBoxPlaceholder\n                                $shouldReduceOpacity={!selectedItem && !internalSelectedItem}\n                                $size={size}\n                            >\n                                {placeholderImageUrl && (\n                                    <StyledComboBoxPlaceholderImage\n                                        src={placeholderImageUrl}\n                                        $shouldShowBigImage={shouldShowBigImage}\n                                        $shouldShowRoundImage={shouldShowRoundPlaceholderImage}\n                                    />\n                                )}\n                                {placeholderIcon && <Icon icons={placeholderIcon} />}\n                                {typeof inputValue === 'string' ? (\n                                    <StyledComboBoxInput\n                                        ref={comboBoxInputRef}\n                                        disabled={isDisabled}\n                                        value={inputValue}\n                                        onChange={onInputChange}\n                                        onBlur={handleInputBlur}\n                                        onFocus={handleInputFocus}\n                                        placeholder={placeholderText}\n                                    />\n                                ) : (\n                                    <StyledComboBoxPlaceholderText>\n                                        {placeholderText}\n                                    </StyledComboBoxPlaceholderText>\n                                )}\n                                {internalSelectedItem &&\n                                    internalSelectedItem.suffixElement &&\n                                    internalSelectedItem.suffixElement}\n                            </StyledComboBoxPlaceholder>\n                        </StyledComboBoxPrefixAndPlaceholderWrapper>\n                        {shouldShowClearIcon && internalSelectedItem && (\n                            <StyledComboBoxClearIconWrapper\n                                $isDisabled={isDisabled}\n                                $size={size}\n                                onClick={handleClear}\n                            >\n                                <Icon\n                                    icons={['fa fa-times']}\n                                    size={size === ComboBoxSize.MINI ? 13 : 15}\n                                />\n                            </StyledComboBoxClearIconWrapper>\n                        )}\n                        {!shouldDisableActions && (\n                            <StyledComboBoxIconWrapper\n                                $isDisabled={isDisabled}\n                                $size={size}\n                                $shouldShowBorderLeft={\n                                    shouldShowClearIcon === true &&\n                                    internalSelectedItem !== undefined\n                                }\n                            >\n                                <Icon\n                                    icons={['fa fa-chevron-down']}\n                                    isDisabled={isDisabled}\n                                    size={size === ComboBoxSize.MINI ? 13 : 15}\n                                />\n                            </StyledComboBoxIconWrapper>\n                        )}\n                    </StyledComboBoxHeader>\n                    {styledComboBoxElementRef.current && (\n                        <DropdownBodyWrapper\n                            anchorElement={styledComboBoxElementRef.current}\n                            bodyWidth={bodyWidth}\n                            contentHeight={contentHeight}\n                            shouldCaptureEvents={shouldCaptureEvents}\n                            onAvailableMaxHeightChange={setAvailableMaxHeight}\n                            onClose={handleClose}\n                            direction={direction}\n                            container={container}\n                            shouldShowDropdown={isAnimating}\n                            minBodyWidth={bodyWidth ?? bodyMinWidth}\n                        >\n                            <StyledComboBoxBody\n                                $maxHeight={effectiveMaxHeight}\n                                $minWidth={bodyWidth ?? bodyMinWidth}\n                                className=\"chayns-scrollbar\"\n                                ref={contentRef}\n                                tabIndex={0}\n                            >\n                                {comboBoxGroups}\n                            </StyledComboBoxBody>\n                        </DropdownBodyWrapper>\n                    )}\n                </StyledComboBox>\n            ),\n            [\n                bodyMinWidth,\n                bodyWidth,\n                comboBoxGroups,\n                container,\n                contentHeight,\n                direction,\n                handleClear,\n                handleClose,\n                handleHeaderClick,\n                handleHeaderKeyDown,\n                handleInputBlur,\n                handleInputFocus,\n                inputValue,\n                internalSelectedItem,\n                isAnimating,\n                isDisabled,\n                isTouch,\n                effectiveMaxHeight,\n                minWidth,\n                onInputChange,\n                placeholderIcon,\n                placeholderImageUrl,\n                placeholderText,\n                prefix,\n                prefixMinWidth,\n                selectedItem,\n                shouldChangeColor,\n                shouldDisableActions,\n                shouldCaptureEvents,\n                shouldShowKeyboardHighlighting,\n                shouldShowBigImage,\n                shouldShowClearIcon,\n                shouldShowRoundPlaceholderImage,\n                shouldShowTransparentBackground,\n                shouldUseFullWidth,\n                size,\n            ],\n        );\n    },\n);\n\nComboBox.displayName = 'ComboBox';\n\nexport default ComboBox;\n"],"mappings":"AAAA,SAASA,YAAY,EAAEC,SAAS,QAAQ,YAAY;AACpD,OAAOC,KAAK,IAGRC,UAAU,EACVC,QAAQ,EACRC,WAAW,EACXC,UAAU,EACVC,SAAS,EACTC,mBAAmB,EACnBC,OAAO,EACPC,MAAM,EACNC,QAAQ,QACL,OAAO;AACd,SAASC,UAAU,QAAQ,yBAAyB;AACpD,SAASC,WAAW,QAAQ,sCAAsC;AAClE,OAAOC,IAAI,MAAM,cAAc;AAC/B,OAAOC,YAAY,MAAM,8BAA8B;AACvD,SACIC,cAAc,EACdC,kBAAkB,EAClBC,8BAA8B,EAC9BC,oBAAoB,EACpBC,yBAAyB,EACzBC,mBAAmB,EACnBC,yBAAyB,EACzBC,8BAA8B,EAC9BC,6BAA6B,EAC7BC,oBAAoB,EACpBC,yCAAyC,EACzCC,mBAAmB,QAChB,mBAAmB;AAC1B,OAAOC,mBAAmB,MAAM,8CAA8C;AAC9E,SAASC,iBAAiB,QAAQ,sBAAsB;AACxD,SAASC,cAAc,QAAQ,qBAAqB;AACpD,SAAqCC,YAAY,QAAuB,kBAAkB;AAC1F,SAASC,sBAAsB,QAAQ,kBAAkB;AACzD,SAASC,kBAAkB,QAAQ,gCAAgC;AACnE,SAASC,4BAA4B,QAAQ,0CAA0C;AAEvF,MAAMC,QAAQ,gBAAGhC,UAAU,CACvB,CACI;EACIiC,SAAS;EACTC,SAAS,GAAGR,iBAAiB,CAACS,KAAK;EACnCC,UAAU,GAAG,KAAK;EAClBC,KAAK;EACLC,SAAS,GAAG,GAAG;EACfC,QAAQ;EACRC,WAAW;EACXC,MAAM;EACNC,SAAS;EACTC,mBAAmB;EACnBC,YAAY;EACZC,MAAM;EACNC,MAAM;EACNC,kBAAkB;EAClBC,mBAAmB;EACnBC,oBAAoB;EACpBC,YAAY;EACZC,cAAc;EACdC,IAAI,GAAGxB,YAAY,CAACyB,MAAM;EAC1BC,kBAAkB,GAAG,KAAK;EAC1BC,aAAa;EACbC,yBAAyB,GAAG,KAAK;EACjCC,WAAW;EACXC,+BAA+B,GAAG,KAAK;EACvCC,UAAU;EACVC,6BAA6B,GAAG,KAAK;EACrCC;AACJ,CAAC,EACDC,GAAG,KACF;EACD,MAAM,CAACC,oBAAoB,EAAEC,uBAAuB,CAAC,GAAGxD,QAAQ,CAAgB,CAAC;EACjF,MAAM,CAACyD,WAAW,EAAEC,cAAc,CAAC,GAAG1D,QAAQ,CAAC,KAAK,CAAC;EACrD,MAAM,CAAC2D,QAAQ,EAAEC,WAAW,CAAC,GAAG5D,QAAQ,CAAqB6D,SAAS,CAAC;EACvE,MAAM,CAACC,YAAY,EAAEC,eAAe,CAAC,GAAG/D,QAAQ,CAAC,CAAC,CAAC;EACnD,MAAM,CAACgE,YAAY,EAAEC,eAAe,CAAC,GAAGjE,QAAQ,CAAgB,IAAI,CAAC;EACrE,MAAM,CAACkE,kBAAkB,EAAEC,qBAAqB,CAAC,GAAGnE,QAAQ,CAAqB6D,SAAS,CAAC;EAE3F,MAAMO,cAAc,GAAGrE,MAAM,CAAC,KAAK,CAAC;EACpC,MAAMsE,wBAAwB,GAAGtE,MAAM,CAAiB,IAAI,CAAC;EAC7D,MAAMuE,iBAAiB,GAAGvE,MAAM,CAAiB,IAAI,CAAC;EACtD,MAAMwE,gBAAgB,GAAGxE,MAAM,CAAmB,IAAI,CAAC;EACvD,MAAMyE,UAAU,GAAGzE,MAAM,CAAwB,IAAI,CAAC;EAEtD,MAAM0E,UAAU,GAAGtD,cAAc,CAACkD,wBAAwB,EAAE;IACxDK,sBAAsB,EAAE;EAC5B,CAAC,CAAC;EAEF,MAAMC,SAAS,GAAGtF,YAAY,CAAC,CAAC;EAChC,MAAMuF,MAAM,GAAGtF,SAAS,CAAC,CAAC;EAC1B,MAAMuF,OAAO,GAAG5E,UAAU,CAAC,CAAC;EAC5B,MAAM6E,YAAY,GAAGnF,UAAU,CAACO,WAAW,CAAC;EAE5CN,SAAS,CAAC,MAAM;IACZ,IAAI,CAAC6E,UAAU,EAAE;MACb;IACJ;IAEA,MAAM;MAAEd,QAAQ,EAAEoB,kBAAkB;MAAEjB,YAAY,EAAEkB;IAAuB,CAAC,GACxE3D,sBAAsB,CAAC;MACnBsD,SAAS;MACTpB,oBAAoB;MACpB1B,KAAK;MACLoD,WAAW,EAAER,UAAU,CAACS,KAAK;MAC7BlD,WAAW;MACXC,MAAM;MACNU,cAAc;MACdP,YAAY;MACZgB,6BAA6B;MAC7Bb,kBAAkB;MAClBC,mBAAmB;MACnBQ,yBAAyB;MACzBF,kBAAkB;MAClB8B;IACJ,CAAC,CAAC;IAENhB,WAAW,CAACmB,kBAAkB,CAAC;IAC/BhB,eAAe,CAACiB,sBAAsB,CAAC;EAC3C,CAAC,EAAE,CACCL,SAAS,EACTpB,oBAAoB,EACpB1B,KAAK,EACL4C,UAAU,EACVzC,WAAW,EACXC,MAAM,EACNU,cAAc,EACdP,YAAY,EACZgB,6BAA6B,EAC7Bb,kBAAkB,EAClBC,mBAAmB,EACnBQ,yBAAyB,EACzBF,kBAAkB,EAClB8B,MAAM,CACT,CAAC;EAEF,MAAMO,iBAAiB,GAAGrF,OAAO,CAC7B,MAAMgF,YAAY,CAACK,iBAAiB,IAAI,KAAK,EAC7C,CAACL,YAAY,CAACK,iBAAiB,CACnC,CAAC;EAED,MAAMC,8BAA8B,GAAG7D,4BAA4B,CAC/D8B,gCAAgC,IAAI,CAACzB,UACzC,CAAC;EACDN,kBAAkB,CAACgD,iBAAiB,EAAE;IAClCe,SAAS,EAAED,8BAA8B,IAAI,OAAOjC,UAAU,KAAK;EACvE,CAAC,CAAC;EACF7B,kBAAkB,CAACiD,gBAAgB,EAAE;IACjCc,SAAS,EAAED,8BAA8B,IAAI,OAAOjC,UAAU,KAAK;EACvE,CAAC,CAAC;EAEF,MAAMmC,oBAAoB,GAAGxF,OAAO,CAAC,MAAM;IACvC,IAAI,CAACsC,YAAY,EAAE;MACf,OAAO,KAAK;IAChB;IAEA,MAAMmD,aAAa,GAAG1D,KAAK,CAAC2D,OAAO,CAAEC,IAAI,IAAKA,IAAI,CAACA,IAAI,CAAC;IAExD,OACIF,aAAa,CAACG,MAAM,KAAK,CAAC,IAC1BH,aAAa,CAACI,IAAI,CAAEC,IAAI,IAAKA,IAAI,CAACC,KAAK,KAAKzD,YAAY,CAACyD,KAAK,CAAC;EAEvE,CAAC,EAAE,CAAChE,KAAK,EAAEO,YAAY,CAAC,CAAC;;EAEzB;EACA;EACA;EACA,MAAM0D,kBAAkB,GAAGhG,OAAO,CAAC,MAAM;IACrC,IAAI,OAAOoE,kBAAkB,KAAK,QAAQ,IAAIA,kBAAkB,GAAG,CAAC,EAAE;MAClE,OAAO6B,IAAI,CAACC,GAAG,CAAClE,SAAS,EAAEoC,kBAAkB,CAAC;IAClD;IAEA,OAAOpC,SAAS;EACpB,CAAC,EAAE,CAACoC,kBAAkB,EAAEpC,SAAS,CAAC,CAAC;EAEnC,MAAMmE,aAAa,GAAGnG,OAAO,CAAC,MAAM;IAChC,MAAMoG,SAAS,GAAGrE,KAAK,CAAC2D,OAAO,CAAEC,IAAI,IAAKA,IAAI,CAACA,IAAI,CAAC;IAEpD,IAAIU,MAAM,GAAGD,SAAS,CAACE,MAAM,CAAC,CAACP,KAAK,EAAED,IAAI,KAAK;MAC3C,MAAMS,SAAS,GACX9D,kBAAkB,IACjB,OAAOqD,IAAI,CAACU,OAAO,KAAK,QAAQ,IAAIV,IAAI,CAACU,OAAO,CAACC,IAAI,CAAC,CAAC,KAAK,EAAG;MAEpE,OAAOV,KAAK,IAAIQ,SAAS,GAAG,EAAE,GAAG,EAAE,CAAC;IACxC,CAAC,EAAE,CAAC,CAAC;IAEL,IAAIxE,KAAK,CAAC6D,MAAM,GAAG,CAAC,EAAE;MAClBS,MAAM,IAAItE,KAAK,CAAC6D,MAAM,GAAG,EAAE;IAC/B;IAEA,IAAII,kBAAkB,GAAGK,MAAM,EAAE;MAC7BA,MAAM,GAAGL,kBAAkB;IAC/B;IAEA,OAAOK,MAAM;EACjB,CAAC,EAAE,CAACL,kBAAkB,EAAEjE,KAAK,EAAEU,kBAAkB,CAAC,CAAC;EAEnD,MAAMiE,gBAAqD,GAAG9G,WAAW,CACpE+G,KAAK,IAAK;IACPrC,cAAc,CAACsC,OAAO,GAAG,IAAI;IAC7BhE,YAAY,GAAG+D,KAAK,CAAC;EACzB,CAAC,EACD,CAAC/D,YAAY,CACjB,CAAC;EAED,MAAMiE,eAAoD,GAAGjH,WAAW,CACnE+G,KAAK,IAAK;IACPrC,cAAc,CAACsC,OAAO,GAAG,KAAK;IAC9BzD,WAAW,GAAGwD,KAAK,CAAC;EACxB,CAAC,EACD,CAACxD,WAAW,CAChB,CAAC;EAED,MAAM2D,UAAU,GAAGlH,WAAW,CAAC,MAAM;IACjC,IAAI,OAAO4C,MAAM,KAAK,UAAU,EAAE;MAC9BA,MAAM,CAAC,CAAC;IACZ;IAEAoB,cAAc,CAAC,IAAI,CAAC;EACxB,CAAC,EAAE,CAACpB,MAAM,CAAC,CAAC;EAEZ,MAAMuE,WAAW,GAAGnH,WAAW,CAAC,MAAM;IAClC,IAAI,OAAO2C,MAAM,KAAK,UAAU,EAAE;MAC9BA,MAAM,CAAC,CAAC;IACZ;IAEAqB,cAAc,CAAC,KAAK,CAAC;EACzB,CAAC,EAAE,CAACrB,MAAM,CAAC,CAAC;EAEZ,MAAMyE,mBAAmB,GAAGpH,WAAW,CAClC+G,KAAuC,IAAK;IACzC,MAAMM,kBAAkB,GAAGN,KAAK,CAACO,aAA4B;IAC7D,MAAMC,gBAAgB,GAAGR,KAAK,CAACS,aAA4B;IAE3D,IACI,CAACH,kBAAkB,IAClB,CAACE,gBAAgB,CAACE,QAAQ,CAACJ,kBAAkB,CAAC,IAC3C,CAACvC,UAAU,CAACkC,OAAO,EAAES,QAAQ,CAACJ,kBAAkB,CAAE,EACxD;MACEF,WAAW,CAAC,CAAC;IACjB;EACJ,CAAC,EACD,CAACA,WAAW,CAChB,CAAC;EAED,MAAMO,mBAAmB,GAAG1H,WAAW,CAAC,MAAM;IAC1C;IACA2H,qBAAqB,CAAC,MAAM;MACxB,IAAI,OAAOlE,UAAU,KAAK,QAAQ,EAAE;QAChCoB,gBAAgB,CAACmC,OAAO,EAAEY,KAAK,CAAC,CAAC;QACjC;MACJ;MAEAhD,iBAAiB,CAACoC,OAAO,EAAEY,KAAK,CAAC,CAAC;IACtC,CAAC,CAAC;EACN,CAAC,EAAE,CAACnE,UAAU,CAAC,CAAC;;EAEhB;AACR;AACA;EACQ,MAAMoE,qBAAqB,GAAG7H,WAAW,CACpC8H,YAA4B,IAAK;IAC9B,IAAI,OAAOzF,QAAQ,KAAK,UAAU,EAAE;MAChC,MAAM0F,cAAc,GAAG1F,QAAQ,CAACyF,YAAY,CAAC;MAE7C,IAAIC,cAAc,KAAK,KAAK,EAAE;QAC1B;MACJ;MAEA,IAAIA,cAAc,YAAYC,OAAO,EAAE;QACnC,KAAKD,cAAc,CAACE,IAAI,CAAEC,sBAAsB,IAAK;UACjD,IAAIA,sBAAsB,EAAE;UAE5BpE,uBAAuB,CAACgE,YAAY,CAAC;UACrCX,WAAW,CAAC,CAAC;UACbO,mBAAmB,CAAC,CAAC;QACzB,CAAC,CAAC;QAEF;MACJ;IACJ;IAEA5D,uBAAuB,CAACgE,YAAY,CAAC;IACrCX,WAAW,CAAC,CAAC;IACbO,mBAAmB,CAAC,CAAC;EACzB,CAAC,EACD,CAACP,WAAW,EAAE9E,QAAQ,EAAEqF,mBAAmB,CAC/C,CAAC;EAED,MAAMS,WAAW,GAAGnI,WAAW,CAC1B+G,KAAuC,IAAK;IACzCA,KAAK,CAACqB,cAAc,CAAC,CAAC;IACtBrB,KAAK,CAACsB,eAAe,CAAC,CAAC;IAEvBR,qBAAqB,CAAC1D,SAAS,CAAC;EACpC,CAAC,EACD,CAAC0D,qBAAqB,CAC1B,CAAC;EAED3H,SAAS,CAAC,MAAM;IACZ,MAAMoI,aAAa,GAAIC,CAAgB,IAAK;MACxC,IAAI,CAACxE,WAAW,EAAE;MAElB,IAAIwE,CAAC,CAACC,GAAG,KAAK,QAAQ,EAAE;QACpBD,CAAC,CAACH,cAAc,CAAC,CAAC;QAClBjB,WAAW,CAAC,CAAC;QACbO,mBAAmB,CAAC,CAAC;QACrB;MACJ;MAEA,IAAIa,CAAC,CAACC,GAAG,KAAK,SAAS,IAAID,CAAC,CAACC,GAAG,KAAK,WAAW,EAAE;QAC9CD,CAAC,CAACH,cAAc,CAAC,CAAC;QAElB,MAAMK,QAAQ,GAAG3D,UAAU,CAACkC,OAAO,EAAEyB,QAAQ;QAE7C,IAAI,CAACA,QAAQ,IAAIA,QAAQ,CAACzC,MAAM,KAAK,CAAC,EAAE;QAExC,MAAM0C,aAAa,GAAGH,CAAC,CAACC,GAAG,KAAK,SAAS,GAAG,CAAC,CAAC,GAAG,CAAC;QAElD,IAAIG,QAAQ,GAAGrE,YAAY,IAAI,CAAC,CAAC;QAEjC,IAAIsE,QAAQ,GAAG,CAAC;QAEhB,GAAG;UACCD,QAAQ,GAAG,CAACA,QAAQ,GAAGD,aAAa,GAAGD,QAAQ,CAACzC,MAAM,IAAIyC,QAAQ,CAACzC,MAAM;UAEzE,MAAM6C,UAAU,GAAGJ,QAAQ,CAACE,QAAQ,CAAmB;UAEvD,IAAIG,UAAU,GAAG,KAAK;UAEtB,IACID,UAAU,CAACE,EAAE,CAACC,UAAU,CAAC,kBAAkB,CAAC,IAC5CH,UAAU,CAACE,EAAE,CAACE,QAAQ,CAAC,iBAAiB,CAAC,EAC3C;YACEH,UAAU,GAAG,IAAI;UACrB;UAEA,IAAI,CAACA,UAAU,EAAE;UAEjBF,QAAQ,EAAE;QACd,CAAC,QAAQA,QAAQ,GAAGH,QAAQ,CAACzC,MAAM;QAEnC,IAAI1B,YAAY,KAAK,IAAI,EAAE;UACvB,MAAM4E,WAAW,GAAGT,QAAQ,CAACnE,YAAY,CAAmB;UAE5D4E,WAAW,CAACC,QAAQ,GAAG,CAAC,CAAC;QAC7B;QAEA5E,eAAe,CAACoE,QAAQ,CAAC;QAEzB,MAAMS,cAAc,GAAGX,QAAQ,CAACE,QAAQ,CAAmB;QAE3DS,cAAc,CAACD,QAAQ,GAAG,CAAC;QAC3BC,cAAc,CAACxB,KAAK,CAAC,CAAC;MAC1B,CAAC,MAAM,IAAI,CAACW,CAAC,CAACC,GAAG,KAAK,OAAO,IAAID,CAAC,CAACC,GAAG,KAAK,GAAG,KAAKlE,YAAY,KAAK,IAAI,EAAE;QACtEiE,CAAC,CAACH,cAAc,CAAC,CAAC;QAClB,MAAMiB,OAAO,GAAGvE,UAAU,CAACkC,OAAO,EAAEyB,QAAQ,CAACnE,YAAY,CAAC;QAE1D,IAAI,CAAC+E,OAAO,EAAE;QAEd,MAAM;UAAEN;QAAG,CAAC,GAAGM,OAAO;QAEtB,IAAIC,eAA0C;QAE9CnH,KAAK,CAAC8D,IAAI,CAAEF,IAAI,IAAK;UACjBuD,eAAe,GAAGvD,IAAI,CAACA,IAAI,CAACwD,IAAI,CAC5B,CAAC;YAAEpD;UAAM,CAAC,KAAKqD,MAAM,CAACrD,KAAK,CAAC,KAAK4C,EAAE,CAACU,OAAO,CAAC,iBAAiB,EAAE,EAAE,CACrE,CAAC;UAED,OAAO,CAAC,CAACH,eAAe;QAC5B,CAAC,CAAC;QAEF,IAAIA,eAAe,EAAE;UACjBzB,qBAAqB,CAACyB,eAAe,CAAC;QAC1C;MACJ;IACJ,CAAC;IAEDI,QAAQ,CAACC,gBAAgB,CAAC,SAAS,EAAErB,aAAa,CAAC;IAEnD,OAAO,MAAMoB,QAAQ,CAACE,mBAAmB,CAAC,SAAS,EAAEtB,aAAa,CAAC;EACvE,CAAC,EAAE,CACChE,YAAY,EACZ6C,WAAW,EACXU,qBAAqB,EACrB9D,WAAW,EACX5B,KAAK,EACLuF,mBAAmB,CACtB,CAAC;;EAEF;AACR;AACA;EACQxH,SAAS,CAAC,MAAM;IACZ8D,cAAc,CAAC,KAAK,CAAC;IACrBF,uBAAuB,CAACpB,YAAY,CAAC;EACzC,CAAC,EAAE,CAACA,YAAY,CAAC,CAAC;EAElB,MAAMmH,mBAAmB,GAAGzJ,OAAO,CAAC,MAAM;IACtC,IAAIsC,YAAY,EAAE;MACd,OAAOA,YAAY,CAACoH,QAAQ;IAChC;IAEA,IAAIjG,oBAAoB,EAAE;MACtB,OAAOA,oBAAoB,CAACiG,QAAQ;IACxC;IAEA,OAAO3F,SAAS;EACpB,CAAC,EAAE,CAACN,oBAAoB,EAAEnB,YAAY,CAAC,CAAC;EAExC,MAAMqH,eAAe,GAAG3J,OAAO,CAAC,MAAM;IAClC,IAAIsC,YAAY,EAAE;MACd,OAAOA,YAAY,CAACsH,KAAK;IAC7B;IAEA,IAAInG,oBAAoB,EAAE;MACtB,OAAOA,oBAAoB,CAACmG,KAAK;IACrC;IAEA,OAAO7F,SAAS;EACpB,CAAC,EAAE,CAACN,oBAAoB,EAAEnB,YAAY,CAAC,CAAC;;EAExC;AACR;AACA;EACQ,MAAMuH,eAAe,GAAG7J,OAAO,CAAC,MAAM;IAClC,IAAI8J,IAAI,GAAG5H,WAAW;IAEtB,IAAII,YAAY,EAAE;MACdwH,IAAI,GAAGxH,YAAY,CAACwH,IAAI;IAC5B,CAAC,MAAM,IAAIrG,oBAAoB,EAAE;MAC7BqG,IAAI,GAAGrG,oBAAoB,CAACqG,IAAI;IACpC;IAEA,OAAOA,IAAI;EACf,CAAC,EAAE,CAACrG,oBAAoB,EAAEvB,WAAW,EAAEI,YAAY,CAAC,CAAC;EAErD,MAAMyH,+BAA+B,GAAG/J,OAAO,CAAC,MAAM;IAClD,MAAMgK,gBAAgB,GAAGjI,KAAK,CAACoH,IAAI,CAAExD,IAAI,IACrCA,IAAI,CAACA,IAAI,CAACE,IAAI,CACV,CAAC;MAAEE;IAAM,CAAC,KAAKA,KAAK,MAAMzD,YAAY,EAAEyD,KAAK,IAAItC,oBAAoB,EAAEsC,KAAK,CAChF,CACJ,CAAC;IAED,OAAOiE,gBAAgB,EAAErH,oBAAoB,IAAIA,oBAAoB;EACzE,CAAC,EAAE,CAACc,oBAAoB,EAAEsC,KAAK,EAAEhE,KAAK,EAAEO,YAAY,EAAEyD,KAAK,EAAEpD,oBAAoB,CAAC,CAAC;;EAEnF;AACR;AACA;EACQ,MAAMsH,iBAAiB,GAAGrK,WAAW,CAAC,MAAM;IACxC,IAAI,CAACkC,UAAU,IAAI,CAACwC,cAAc,CAACsC,OAAO,EAAE;MACxC,IAAIjD,WAAW,EAAE;QACboD,WAAW,CAAC,CAAC;MACjB,CAAC,MAAM;QACHD,UAAU,CAAC,CAAC;MAChB;IACJ;EACJ,CAAC,EAAE,CAACC,WAAW,EAAED,UAAU,EAAEnD,WAAW,EAAE7B,UAAU,CAAC,CAAC;EAEtD,MAAMoI,mBAAyD,GAAGtK,WAAW,CACxE+G,KAAK,IAAK;IACP,IAAI7E,UAAU,IAAI,OAAOuB,UAAU,KAAK,QAAQ,EAAE;MAC9C;IACJ;IAEA,IAAIsD,KAAK,CAACyB,GAAG,KAAK,QAAQ,IAAIzE,WAAW,EAAE;MACvCgD,KAAK,CAACqB,cAAc,CAAC,CAAC;MACtBjB,WAAW,CAAC,CAAC;MACbO,mBAAmB,CAAC,CAAC;MACrB;IACJ;IAEA,IAAIX,KAAK,CAACyB,GAAG,KAAK,OAAO,IAAIzB,KAAK,CAACyB,GAAG,KAAK,GAAG,EAAE;MAC5CzB,KAAK,CAACqB,cAAc,CAAC,CAAC;MACtBiC,iBAAiB,CAAC,CAAC;IACvB;EACJ,CAAC,EACD,CACIlD,WAAW,EACXkD,iBAAiB,EACjB5G,UAAU,EACVM,WAAW,EACX7B,UAAU,EACVwF,mBAAmB,CAE3B,CAAC;EAEDvH,mBAAmB,CACfyD,GAAG,EACH,OAAO;IACH2G,IAAI,EAAEpD,WAAW;IACjBqD,IAAI,EAAEtD;EACV,CAAC,CAAC,EACF,CAACC,WAAW,EAAED,UAAU,CAC5B,CAAC;EAED,MAAMuD,cAAc,GAAGrK,OAAO,CAC1B,MACI+B,KAAK,CAACuI,GAAG,CAAE3E,IAAI,iBACXlG,KAAA,CAAA8K,aAAA,CAAC5K,QAAQ;IAACyI,GAAG,EAAEzC,IAAI,CAAC6E,SAAS,IAAI;EAAgB,GAC5C7E,IAAI,CAAC6E,SAAS,IAAIzI,KAAK,CAAC6D,MAAM,GAAG,CAAC,iBAC/BnG,KAAA,CAAA8K,aAAA,CAACrJ,mBAAmB;IAACyH,EAAE,EAAE,mBAAmBhD,IAAI,CAAC6E,SAAS;EAAG,GACxD7E,IAAI,CAAC6E,SACW,CACxB,EACA7E,IAAI,CAACA,IAAI,CAAC2E,GAAG,CAAExE,IAAI,iBAChBrG,KAAA,CAAA8K,aAAA,CAACjK,YAAY;IACT8H,GAAG,EAAE,QAAQtC,IAAI,CAACgE,IAAI,EAAG;IACzBhE,IAAI,EAAEA,IAAK;IACX2E,UAAU,EACNnI,YAAY,GAAGwD,IAAI,CAACC,KAAK,KAAKzD,YAAY,CAACyD,KAAK,GAAG,KACtD;IACD9D,QAAQ,EAAEwF,qBAAsB;IAChChF,kBAAkB,EAAEA,kBAAmB;IACvCE,oBAAoB,EAChBgD,IAAI,CAAChD,oBAAoB,IAAIA;EAChC,CACJ,CACJ,CACK,CACb,CAAC,EACN,CAAC8E,qBAAqB,EAAE1F,KAAK,EAAEO,YAAY,EAAEG,kBAAkB,EAAEE,oBAAoB,CACzF,CAAC;EAED,OAAO3C,OAAO,CACV,mBACIP,KAAA,CAAA8K,aAAA,CAAChK,cAAc;IACXiD,GAAG,EAAEe,wBAAyB;IAC9BmG,SAAS,EAAE7G,QAAS;IACpB8G,mBAAmB,EAAE3H,kBAAmB;IACxC4H,MAAM,EAAE5D;EAAoB,gBAE5BvH,KAAA,CAAA8K,aAAA,CAAC7J,oBAAoB;IACjB8C,GAAG,EAAEgB,iBAAkB;IACvBqG,UAAU,EAAEjJ,SAAU;IACtBkJ,OAAO,EAAEb,iBAAkB;IAC3Bc,OAAO,EAAEpH,WAAY;IACrBqH,QAAQ,EAAEjG,OAAQ;IAClBkG,KAAK,EAAEnI,IAAK;IACZoI,gCAAgC,EAAE9H,+BAAgC;IAClE+H,WAAW,EAAErJ,UAAW;IACxBsJ,kBAAkB,EAAE/F,iBAAkB;IACtCgG,mBAAmB,EAAE5I,kBAAmB;IACxC6I,SAAS,EAAEpB,mBAAoB;IAC/BnB,QAAQ,EAAE,CAACjH,UAAU,IAAI,OAAOuB,UAAU,KAAK,QAAQ,GAAG,CAAC,GAAGU,SAAU;IACxEwH,IAAI,EAAE,CAACzJ,UAAU,IAAI,OAAOuB,UAAU,KAAK,QAAQ,GAAG,QAAQ,GAAGU,SAAU;IAC3E,iBACI,CAACjC,UAAU,IAAI,OAAOuB,UAAU,KAAK,QAAQ,GAAGM,WAAW,GAAGI;EACjE,gBAEDtE,KAAA,CAAA8K,aAAA,CAACtJ,yCAAyC;IAACgK,KAAK,EAAEnI;EAAK,GAClDX,MAAM,iBACH1C,KAAA,CAAA8K,aAAA,CAACvJ,oBAAoB;IAACwK,eAAe,EAAE3I,cAAe;IAACoI,KAAK,EAAEnI;EAAK,GAC9DX,MACiB,CACzB,eACD1C,KAAA,CAAA8K,aAAA,CAAC1J,yBAAyB;IACtB4K,oBAAoB,EAAE,CAACnJ,YAAY,IAAI,CAACmB,oBAAqB;IAC7DwH,KAAK,EAAEnI;EAAK,GAEX2G,mBAAmB,iBAChBhK,KAAA,CAAA8K,aAAA,CAACzJ,8BAA8B;IAC3B4K,GAAG,EAAEjC,mBAAoB;IACzB4B,mBAAmB,EAAE5I,kBAAmB;IACxCkJ,qBAAqB,EAAE5B;EAAgC,CAC1D,CACJ,EACAJ,eAAe,iBAAIlK,KAAA,CAAA8K,aAAA,CAAClK,IAAI;IAACuJ,KAAK,EAAED;EAAgB,CAAE,CAAC,EACnD,OAAOtG,UAAU,KAAK,QAAQ,gBAC3B5D,KAAA,CAAA8K,aAAA,CAAC3J,mBAAmB;IAChB4C,GAAG,EAAEiB,gBAAiB;IACtBmH,QAAQ,EAAE9J,UAAW;IACrBiE,KAAK,EAAE1C,UAAW;IAClBwI,QAAQ,EAAE5I,aAAc;IACxB2H,MAAM,EAAE/D,eAAgB;IACxBiF,OAAO,EAAEpF,gBAAiB;IAC1BxE,WAAW,EAAE2H;EAAgB,CAChC,CAAC,gBAEFpK,KAAA,CAAA8K,aAAA,CAACxJ,6BAA6B,QACzB8I,eAC0B,CAClC,EACApG,oBAAoB,IACjBA,oBAAoB,CAACsI,aAAa,IAClCtI,oBAAoB,CAACsI,aACF,CACY,CAAC,EAC3CrJ,mBAAmB,IAAIe,oBAAoB,iBACxChE,KAAA,CAAA8K,aAAA,CAAC9J,8BAA8B;IAC3B0K,WAAW,EAAErJ,UAAW;IACxBmJ,KAAK,EAAEnI,IAAK;IACZgI,OAAO,EAAE/C;EAAY,gBAErBtI,KAAA,CAAA8K,aAAA,CAAClK,IAAI;IACDuJ,KAAK,EAAE,CAAC,aAAa,CAAE;IACvB9G,IAAI,EAAEA,IAAI,KAAKxB,YAAY,CAAC0K,IAAI,GAAG,EAAE,GAAG;EAAG,CAC9C,CAC2B,CACnC,EACA,CAACxG,oBAAoB,iBAClB/F,KAAA,CAAA8K,aAAA,CAAC5J,yBAAyB;IACtBwK,WAAW,EAAErJ,UAAW;IACxBmJ,KAAK,EAAEnI,IAAK;IACZmJ,qBAAqB,EACjBvJ,mBAAmB,KAAK,IAAI,IAC5Be,oBAAoB,KAAKM;EAC5B,gBAEDtE,KAAA,CAAA8K,aAAA,CAAClK,IAAI;IACDuJ,KAAK,EAAE,CAAC,oBAAoB,CAAE;IAC9B9H,UAAU,EAAEA,UAAW;IACvBgB,IAAI,EAAEA,IAAI,KAAKxB,YAAY,CAAC0K,IAAI,GAAG,EAAE,GAAG;EAAG,CAC9C,CACsB,CAEb,CAAC,EACtBzH,wBAAwB,CAACqC,OAAO,iBAC7BnH,KAAA,CAAA8K,aAAA,CAACpJ,mBAAmB;IAChB+K,aAAa,EAAE3H,wBAAwB,CAACqC,OAAQ;IAChDjF,SAAS,EAAEA,SAAU;IACrBwE,aAAa,EAAEA,aAAc;IAC7B9D,mBAAmB,EAAEA,mBAAoB;IACzC8J,0BAA0B,EAAE9H,qBAAsB;IAClD+H,OAAO,EAAErF,WAAY;IACrBnF,SAAS,EAAEA,SAAU;IACrBQ,SAAS,EAAEA,SAAU;IACrBiK,kBAAkB,EAAE1I,WAAY;IAChC2I,YAAY,EAAE3K,SAAS,IAAIqC;EAAa,gBAExCvE,KAAA,CAAA8K,aAAA,CAAC/J,kBAAkB;IACf+L,UAAU,EAAEvG,kBAAmB;IAC/B0E,SAAS,EAAE/I,SAAS,IAAIqC,YAAa;IACrCwI,SAAS,EAAC,kBAAkB;IAC5BhJ,GAAG,EAAEkB,UAAW;IAChBqE,QAAQ,EAAE;EAAE,GAEXsB,cACe,CACH,CAEb,CACnB,EACD,CACIrG,YAAY,EACZrC,SAAS,EACT0I,cAAc,EACdjI,SAAS,EACT+D,aAAa,EACbvE,SAAS,EACTmG,WAAW,EACXhB,WAAW,EACXkD,iBAAiB,EACjBC,mBAAmB,EACnBrD,eAAe,EACfH,gBAAgB,EAChBrD,UAAU,EACVI,oBAAoB,EACpBE,WAAW,EACX7B,UAAU,EACViD,OAAO,EACPiB,kBAAkB,EAClBnC,QAAQ,EACRZ,aAAa,EACb0G,eAAe,EACfF,mBAAmB,EACnBI,eAAe,EACf1H,MAAM,EACNU,cAAc,EACdP,YAAY,EACZ+C,iBAAiB,EACjBG,oBAAoB,EACpBnD,mBAAmB,EACnBiD,8BAA8B,EAC9B7C,kBAAkB,EAClBC,mBAAmB,EACnBqH,+BAA+B,EAC/B3G,+BAA+B,EAC/BJ,kBAAkB,EAClBF,IAAI,CAEZ,CAAC;AACL,CACJ,CAAC;AAEDpB,QAAQ,CAAC+K,WAAW,GAAG,UAAU;AAEjC,eAAe/K,QAAQ","ignoreList":[]}

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

@@ -47,6 +47,11 @@ export const StyledComboBoxHeader = styled.div`
   $size
 }) => {
   switch ($size) {
+    case ComboBoxSize.MINI:
+      return css`
+                    box-sizing: border-box;
+                    height: 28px;
+                `;
     case ComboBoxSize.SMALL:
       return css`
                     height: 34px;
@@ -67,12 +72,12 @@ export const StyledComboBoxHeader = styled.div`
   if ($shouldShowTransparentBackground) {
     if (theme.colorMode === 'dark') {
       return css`
-                    border-color: rgba(255, 255, 255, 0.5);
+                    border-color: rgba(255, 255, 255, 0.3);
                     background-color: transparent;
                 `;
     }
     return css`
-                border-color: rgba(0, 0, 0, 0.5);
+                border-color: rgba(0, 0, 0, 0.3);
                 background-color: transparent;
             `;
   }
@@ -132,6 +137,12 @@ export const StyledComboBoxPlaceholder = styled.div`
     opacity: ${({
   $shouldReduceOpacity
 }) => $shouldReduceOpacity ? 0.5 : 1};
+
+    ${({
+  $size
+}) => $size === ComboBoxSize.MINI && css`
+            font-size: 13px;
+        `}
 `;
 export const StyledComboBoxPlaceholderText = styled.div`
     overflow: hidden;
@@ -144,6 +155,12 @@ export const StyledComboBoxPrefixAndPlaceholderWrapper = styled.div`
     flex: 1 1 auto;
     min-width: 0;
     padding: 4px 10px;
+
+    ${({
+  $size
+}) => $size === ComboBoxSize.MINI && css`
+            padding: 2px 8px;
+        `}
 `;
 export const StyledComboBoxPrefix = styled.div`
     flex: 0 0 auto;
@@ -151,6 +168,13 @@ export const StyledComboBoxPrefix = styled.div`
   $prefixMinWidth
 }) => $prefixMinWidth ?? 0}px;
     padding-right: 5px;
+
+    ${({
+  $size
+}) => $size === ComboBoxSize.MINI && css`
+            font-size: 13px;
+            padding-right: 4px;
+        `}
 `;
 export const StyledComboBoxInput = styled.input`
     color: ${({
@@ -158,6 +182,7 @@ export const StyledComboBoxInput = styled.input`
 }) => theme.text};
     border: none;
     background-color: transparent;
+    font: inherit;
     width: 100%;
     min-width: 0;
 `;
@@ -189,6 +214,13 @@ export const StyledComboBoxClearIconWrapper = styled.div`
     height: 40px;
     justify-content: center;
     width: 40px;
+
+    ${({
+  $size
+}) => $size === ComboBoxSize.MINI && css`
+            height: 26px;
+            width: 28px;
+        `}
 `;
 export const StyledComboBoxIconWrapper = styled.div`
     align-items: center;
@@ -207,6 +239,11 @@ export const StyledComboBoxIconWrapper = styled.div`
   $size
 }) => {
   switch ($size) {
+    case ComboBoxSize.MINI:
+      return css`
+                    height: 26px;
+                    width: 28px;
+                `;
     case ComboBoxSize.SMALL:
       return css`
                     height: 30px;