@chayns-components/core 5.5.2 → 5.5.4

package/lib/esm/components/search-box/SearchBox.js.map

@@ -1 +1 @@
-{"version":3,"file":"SearchBox.js","names":["useDevice","React","forwardRef","useCallback","useEffect","useImperativeHandle","useMemo","useRef","useState","useTheme","calculateContentHeight","searchList","sortSearchBoxItems","Icon","Input","GroupName","SearchBoxBody","SearchBoxItem","StyledSearchBoxItemImage","StyledSearchBox","StyledSearchBoxHintText","StyledSearchBoxIcon","StyledSearchBoxLeftWrapper","useUuid","DropdownBodyWrapper","TagInput","filterSearchBoxItems","customFilter","items","searchString","shouldUseCustomFilterOnly","filteredItems","filter","getDropdownSearchString","selectedId","shouldKeepSelectedItemPosition","value","SearchBox","container","dropdownDirection","inputProps","isInvalid","leftIcons","lists","maxHeight","onBlur","onChange","onKeyDown","onSelect","placeholder","presetValue","hintText","shouldAddInputToList","shouldHideFilterButtons","shouldShowContentOnEmptyInput","shouldShowSmallItems","shouldShowRoundImage","shouldShowToggleIcon","tagInputSettings","shouldEnableKeyboardHighlighting","ref","matchingListsItems","setMatchingListsItems","selectedImage","setSelectedImage","internalValue","setInternalValue","inputValue","setValue","nextValue","height","setHeight","focusedIndex","setFocusedIndex","hasMultipleGroups","setHasMultipleGroups","length","filteredChildrenArray","setFilteredChildrenArray","inputToListValue","setInputToListValue","groups","setGroups","shouldShowBody","setShouldShowBody","uuid","boxRef","contentRef","inputRef","tagInputRef","hasFocusRef","isAnimatingRef","shouldShowPresetValue","theme","dropdownSearchString","isTouch","filterButtons","forEach","groupName","push","id","text","activeList","newLists","list","includes","newMatchingItems","newList","undefined","filteredMatchingListItems","map","item","handleOpen","handleClose","handleFilterButtonsGroupSelect","keys","textArray","selectedItem","find","imageUrl","createElement","src","$shouldShowRoundImage","current","handleFocus","event","onFocus","handleKeyDown","toLowerCase","handleClick","rightElement","onClick","icons","color","leftElement","handleChange","filteredLists","target","handleBlur","handleDropdownOutsideClick","blur","handleContainerBlur","nextFocusedElement","relatedTarget","currentContainer","currentTarget","contains","handleSelect","newItem","replace","resetValue","content","index","key","name","listIndex","tabIndex","e","children","childrenArray","Array","from","newChildren","child","startsWith","filteredChildren","dataset","isgroupname","preventDefault","newIndex","prevElement","newElement","stopPropagation","element","textContent","attributes","nodeValue","newId","document","addEventListener","removeEventListener","handleKeyPress","keyCode","clear","shouldShowDropdown","trim","onAdd","onRemove","shouldAllowMultiple","shouldPreventEnter","tags","_extends","anchorElement","direction","onClose","onOutsideClick","shouldShow","onGroupSelect","selectedGroups","displayName"],"sources":["../../../../src/components/search-box/SearchBox.tsx"],"sourcesContent":["import { useDevice } from 'chayns-api';\nimport React, {\n    ChangeEvent,\n    ChangeEventHandler,\n    FC,\n    FocusEvent,\n    FocusEventHandler,\n    forwardRef,\n    KeyboardEventHandler,\n    ReactElement,\n    useCallback,\n    useEffect,\n    useImperativeHandle,\n    useMemo,\n    useRef,\n    useState,\n} from 'react';\nimport { useTheme } from 'styled-components';\nimport type { IFilterButtonItem } from '../../types/filterButtons';\nimport type { ISearchBoxItem, ISearchBoxItems } from '../../types/searchBox';\nimport { calculateContentHeight } from '../../utils/calculate';\nimport { searchList, sortSearchBoxItems } from '../../utils/searchBox';\nimport type { Theme } from '../color-scheme-provider/ColorSchemeProvider';\nimport Icon from '../icon/Icon';\nimport Input, { type InputProps } from '../input/Input';\nimport GroupName from './group-name/GroupName';\nimport SearchBoxBody from './search-box-body/SearchBoxBody';\nimport SearchBoxItem from './search-box-item/SearchBoxItem';\nimport { StyledSearchBoxItemImage } from './search-box-item/SearchBoxItem.styles';\nimport {\n    StyledSearchBox,\n    StyledSearchBoxHintText,\n    StyledSearchBoxIcon,\n    StyledSearchBoxLeftWrapper,\n} from './SearchBox.styles';\nimport { useUuid } from '../../hooks/uuid';\nimport DropdownBodyWrapper from '../dropdown-body-wrapper/DropdownBodyWrapper';\nimport TagInput, { TagInputProps, TagInputRef } from '../tag-input/TagInput';\nimport type { DropdownDirection } from '../../types/dropdown';\n\nexport interface SearchBoxRef {\n    clear: VoidFunction;\n}\n\nexport interface TagInputSettings {\n    onAdd?: TagInputProps['onAdd'];\n    onRemove?: TagInputProps['onRemove'];\n    shouldAllowMultiple?: TagInputProps['shouldAllowMultiple'];\n    tags?: TagInputProps['tags'];\n}\n\nconst filterSearchBoxItems = ({\n    customFilter,\n    items,\n    searchString,\n    shouldUseCustomFilterOnly,\n}: {\n    customFilter?: (item: ISearchBoxItem) => boolean;\n    items: ISearchBoxItem[];\n    searchString: string;\n    shouldUseCustomFilterOnly?: boolean;\n}) => {\n    if (typeof customFilter !== 'function') {\n        return searchList({ items, searchString });\n    }\n\n    if (shouldUseCustomFilterOnly) {\n        const filteredItems = items.filter(customFilter);\n\n        return sortSearchBoxItems({ items: filteredItems, searchString });\n    }\n\n    return searchList({ items, searchString }).filter(customFilter);\n};\n\nconst getDropdownSearchString = ({\n    selectedId,\n    shouldKeepSelectedItemPosition,\n    value,\n}: {\n    selectedId?: string;\n    shouldKeepSelectedItemPosition?: boolean;\n    value: string;\n}) => (shouldKeepSelectedItemPosition && selectedId ? '' : value);\n\nexport type SearchBoxProps = {\n    /**\n     * The element where the content of the `ComboBox` should be rendered via React Portal.\n     */\n    container?: Element;\n    /**\n     * An optional callback function to filter the elements to be displayed\n     */\n    customFilter?: (item: ISearchBoxItem) => boolean;\n    /**\n     * If true, the custom filter replaces the built-in text search instead of narrowing its results.\n     */\n    shouldUseCustomFilterOnly?: boolean;\n    /**\n     * The direction in which the dropdown should be displayed. By default, it is displayed below the input.\n     */\n    dropdownDirection?: DropdownDirection;\n    /**\n     * If true, the input field is marked as invalid\n     */\n    isInvalid?: boolean;\n    /**\n     * An optional icon that is displayed inside the left side of the input.\n     */\n    leftIcons?: string[];\n    /**\n     * Props that are passed to the underlying Input component.\n     */\n    inputProps?: InputProps;\n    /**\n     * List of groups with items that can be searched. It is possible to give only one list; if multiple lists are provided, the 'group name' parameter becomes mandatory.\n     */\n    lists: ISearchBoxItems[];\n    /**\n     * The maximum height of the dropdown body in pixels.\n     */\n    maxHeight?: number;\n    /**\n     * Function to be executed when the input lost focus.\n     */\n    onBlur?: FocusEventHandler<HTMLInputElement>;\n    /**\n     * Function to be executed when the input is changed.\n     */\n    onChange?: ChangeEventHandler<HTMLInputElement>;\n    /**\n     * Function that is executed when a letter is pressed\n     */\n    onKeyDown?: KeyboardEventHandler<HTMLInputElement>;\n    /**\n     * Function to be executed when an item is selected.\n     */\n    onSelect?: (item: ISearchBoxItem) => void;\n    /**\n     * The placeholder that should be displayed.\n     */\n    placeholder?: string;\n    /**\n     * Set an input for the search box - it is not an item of a list, just a string.\n     */\n    presetValue?: string;\n    /**\n     * Control the selected item. If you use this prop, make sure to update it when the user selects an item.\n     */\n    selectedId?: string;\n    /**\n     * If true, the selected item keeps its original position in the dropdown list.\n     */\n    shouldKeepSelectedItemPosition?: boolean;\n    /**\n     * If true, the value in the Input is displayed in the list.\n     */\n    shouldAddInputToList: boolean;\n    /**\n     * If true, the filter buttons are hidden.\n     */\n    shouldHideFilterButtons?: boolean;\n    /**\n     * Whether the full list of items should be displayed if the input is empty.\n     */\n    shouldShowContentOnEmptyInput?: boolean;\n    /**\n     * If true, the dropdown items are displayed more compactly.\n     */\n    shouldShowSmallItems?: boolean;\n    /**\n     * If true, the images of the items are displayed in a round shape.\n     */\n    shouldShowRoundImage?: boolean;\n    /**\n     * Whether the icon to open and close the list should be displayed.\n     */\n    shouldShowToggleIcon?: boolean;\n    /**\n     * Settings for the TagInput.\n     */\n    tagInputSettings?: TagInputSettings;\n    /**\n     * Enables keyboard-only focus highlighting.\n     */\n    shouldEnableKeyboardHighlighting?: boolean;\n    /**\n     * A text that should be displayed if no results are found.\n     */\n    hintText?: string;\n};\n\nconst SearchBox: FC<SearchBoxProps> = forwardRef<SearchBoxRef, SearchBoxProps>(\n    (\n        {\n            container,\n            customFilter,\n            dropdownDirection,\n            inputProps,\n            isInvalid = false,\n            leftIcons,\n            lists,\n            maxHeight = 300,\n            onBlur,\n            onChange,\n            onKeyDown,\n            onSelect,\n            placeholder,\n            presetValue,\n            hintText,\n            selectedId,\n            shouldAddInputToList = true,\n            shouldKeepSelectedItemPosition = false,\n            shouldUseCustomFilterOnly = false,\n            shouldHideFilterButtons = false,\n            shouldShowContentOnEmptyInput = true,\n            shouldShowSmallItems = false,\n            shouldShowRoundImage,\n            shouldShowToggleIcon = false,\n            tagInputSettings,\n            shouldEnableKeyboardHighlighting,\n        },\n        ref,\n    ) => {\n        const [matchingListsItems, setMatchingListsItems] = useState<ISearchBoxItems[]>(lists);\n        const [selectedImage, setSelectedImage] = useState<ReactElement>();\n        const [internalValue, setInternalValue] = useState(\n            typeof presetValue === 'string' && presetValue !== '' ? presetValue : '',\n        );\n        const inputValue = inputProps?.value;\n        const value = inputValue ?? internalValue;\n        const setValue = useCallback(\n            (nextValue: string) => {\n                if (typeof inputValue !== 'string') {\n                    setInternalValue(nextValue);\n                }\n            },\n            [inputValue],\n        );\n        const [height, setHeight] = useState<number>(0);\n        const [focusedIndex, setFocusedIndex] = useState<number | null>(null);\n        const [hasMultipleGroups, setHasMultipleGroups] = useState<boolean>(lists.length > 1);\n        const [filteredChildrenArray, setFilteredChildrenArray] = useState<Element[]>();\n        const [inputToListValue, setInputToListValue] = useState<string>('');\n        const [groups, setGroups] = useState<string[]>(['all']);\n        const [shouldShowBody, setShouldShowBody] = useState(false);\n\n        const uuid = useUuid();\n\n        const boxRef = useRef<HTMLDivElement>(null);\n        const contentRef = useRef<HTMLDivElement>(null);\n        const inputRef = useRef<HTMLInputElement | null>(null);\n        const tagInputRef = useRef<TagInputRef>(null);\n\n        const hasFocusRef = useRef<boolean>(false);\n        const isAnimatingRef = useRef<boolean>(false);\n        const shouldShowPresetValue = useRef<boolean>(\n            typeof presetValue === 'string' && presetValue !== '',\n        );\n\n        const theme = useTheme() as Theme;\n        const dropdownSearchString = getDropdownSearchString({\n            selectedId,\n            shouldKeepSelectedItemPosition,\n            value,\n        });\n\n        const { isTouch } = useDevice();\n\n        /**\n         * Checks if there are multiple groups in the lists\n         */\n        useEffect(() => {\n            setHasMultipleGroups(lists.length > 1);\n        }, [lists]);\n\n        const filterButtons = useMemo(() => {\n            const items: IFilterButtonItem[] = [];\n\n            if (lists.length <= 1) {\n                return items;\n            }\n\n            lists.forEach(({ groupName }) => {\n                if (groupName) {\n                    items.push({\n                        id: groupName,\n                        text: groupName,\n                    });\n                }\n            });\n\n            return items;\n        }, [lists]);\n\n        /**\n         * Filters the lists by the FilterButtons\n         */\n        const activeList = useMemo(() => {\n            let newLists: ISearchBoxItems[] = [];\n\n            if (groups[0] === 'all') {\n                newLists = lists;\n            } else {\n                lists.forEach((list) => {\n                    if (list.groupName && groups.includes(list.groupName)) {\n                        newLists.push(list);\n                    }\n                });\n            }\n\n            const newMatchingItems: ISearchBoxItems[] = [];\n\n            newLists.forEach(({ list, groupName }) => {\n                const newList = filterSearchBoxItems({\n                    customFilter,\n                    items: list,\n                    searchString: dropdownSearchString,\n                    shouldUseCustomFilterOnly,\n                });\n\n                if (newList.length > 0) {\n                    newMatchingItems.push({\n                        groupName,\n                        list: newList,\n                    });\n                }\n            });\n\n            if (newMatchingItems.length === 0 && shouldAddInputToList) {\n                newMatchingItems.push({\n                    groupName: undefined,\n                    list: [],\n                });\n            }\n\n            const filteredMatchingListItems = newMatchingItems.map(({ list, groupName }) => ({\n                groupName,\n                list: list.filter((item) => {\n                    if (typeof customFilter === 'function' && shouldUseCustomFilterOnly) {\n                        return true;\n                    }\n\n                    return !(newMatchingItems.length === 1 && item.text === dropdownSearchString);\n                }),\n            }));\n\n            setMatchingListsItems(filteredMatchingListItems);\n\n            return newLists;\n        }, [\n            groups,\n            lists,\n            customFilter,\n            dropdownSearchString,\n            shouldAddInputToList,\n            shouldUseCustomFilterOnly,\n        ]);\n\n        const handleOpen = useCallback(() => {\n            setShouldShowBody(true);\n        }, []);\n\n        const handleClose = useCallback(() => {\n            setShouldShowBody(false);\n        }, []);\n\n        const handleFilterButtonsGroupSelect = (keys: string[]) => {\n            setGroups(keys.length === 0 ? ['all'] : keys);\n        };\n\n        /**\n         * This hook calculates the height\n         */\n        useEffect(() => {\n            const textArray: string[] = [];\n\n            activeList.forEach(({ list, groupName }) => {\n                list.forEach(({ text }) => textArray.push(text));\n                if (!groupName) {\n                    return;\n                }\n                textArray.push(groupName);\n            });\n\n            if (shouldAddInputToList && inputToListValue !== '') {\n                textArray.push(inputToListValue);\n            }\n\n            setHeight(calculateContentHeight(textArray));\n        }, [inputToListValue, activeList, placeholder, shouldAddInputToList]);\n\n        useEffect(() => {\n            if (selectedId) {\n                activeList.forEach(({ list }) => {\n                    const selectedItem = list.find(({ id }) => id === selectedId);\n                    if (selectedItem) {\n                        setValue(selectedItem.text);\n\n                        if (selectedItem.imageUrl) {\n                            setSelectedImage(\n                                <StyledSearchBoxItemImage\n                                    src={selectedItem.imageUrl}\n                                    $shouldShowRoundImage={shouldShowRoundImage}\n                                />,\n                            );\n                        }\n                    }\n                });\n            }\n        }, [activeList, selectedId, shouldShowRoundImage]);\n\n        /**\n         * This hook resets the value if the selectedId changes to undefined. This is an own useEffect because the value\n         * should not be reset if the list changes and the selectedId is still undefined.\n         */\n        useEffect(() => {\n            if (!selectedId && !shouldShowPresetValue.current) {\n                setValue('');\n            }\n        }, [selectedId]);\n\n        useEffect(() => {\n            isAnimatingRef.current = shouldShowBody;\n        }, [shouldShowBody]);\n\n        useEffect(() => {\n            if (\n                (matchingListsItems.length !== 0 || hintText) &&\n                !isAnimatingRef.current &&\n                hasFocusRef.current\n            ) {\n                handleOpen();\n            }\n        }, [handleOpen, hintText, matchingListsItems.length]);\n\n        /**\n         * This function handles the focus event of the input and opens the dropdown if the input\n         * should show content on an empty input\n         */\n        const handleFocus = useCallback(\n            (event: FocusEvent<HTMLInputElement>) => {\n                hasFocusRef.current = true;\n\n                if (typeof inputProps?.onFocus === 'function') {\n                    inputProps.onFocus(event);\n                }\n\n                if (shouldShowContentOnEmptyInput) {\n                    const newMatchingItems: ISearchBoxItems[] = [];\n\n                    activeList.forEach(({ list, groupName }) => {\n                        const newList = filterSearchBoxItems({\n                            customFilter,\n                            items: list,\n                            searchString: dropdownSearchString,\n                            shouldUseCustomFilterOnly,\n                        });\n\n                        if (newList.length > 0) {\n                            newMatchingItems.push({\n                                groupName,\n                                list: newList,\n                            });\n                        }\n                    });\n\n                    if (newMatchingItems.length === 0 && shouldAddInputToList) {\n                        newMatchingItems.push({\n                            groupName: undefined,\n                            list: [],\n                        });\n                    }\n\n                    const filteredMatchingListItems = newMatchingItems.map(\n                        ({ list, groupName }) => ({\n                            groupName,\n                            list: list.filter((item) => {\n                                if (\n                                    typeof customFilter === 'function' &&\n                                    shouldUseCustomFilterOnly\n                                ) {\n                                    return true;\n                                }\n\n                                return !(\n                                    newMatchingItems.length === 1 &&\n                                    item.text === dropdownSearchString\n                                );\n                            }),\n                        }),\n                    );\n\n                    setMatchingListsItems(filteredMatchingListItems);\n\n                    if (filteredMatchingListItems.length !== 0 || hintText) {\n                        handleOpen();\n                    }\n                }\n            },\n            [\n                shouldShowContentOnEmptyInput,\n                activeList,\n                shouldAddInputToList,\n                hintText,\n                dropdownSearchString,\n                customFilter,\n                shouldUseCustomFilterOnly,\n                handleOpen,\n                inputProps,\n            ],\n        );\n\n        const handleKeyDown = useCallback<KeyboardEventHandler<HTMLInputElement>>(\n            (event) => {\n                if (typeof onKeyDown === 'function') {\n                    onKeyDown(event);\n                }\n\n                if (typeof inputProps?.onKeyDown === 'function') {\n                    inputProps.onKeyDown(event);\n                }\n            },\n            [inputProps, onKeyDown],\n        );\n\n        /**\n         * This function filters the lists by input\n         */\n\n        useEffect(() => {\n            const newMatchingItems: ISearchBoxItems[] = [];\n\n            activeList.forEach(({ list, groupName }) => {\n                const newList = filterSearchBoxItems({\n                    customFilter,\n                    items: list,\n                    searchString: dropdownSearchString,\n                    shouldUseCustomFilterOnly,\n                });\n\n                if (newList.length > 0) {\n                    newMatchingItems.push({\n                        groupName,\n                        list: newList,\n                    });\n                }\n            });\n\n            if (newMatchingItems.length === 0 && shouldAddInputToList) {\n                newMatchingItems.push({\n                    groupName: undefined,\n                    list: [],\n                });\n            }\n\n            if (shouldAddInputToList && inputToListValue !== '') {\n                newMatchingItems.forEach(({ list }) => {\n                    list.forEach(({ text }) => {\n                        if (text.toLowerCase() === inputToListValue.toLowerCase()) {\n                            setInputToListValue('');\n                        }\n                    });\n                });\n            }\n        }, [\n            inputToListValue,\n            activeList,\n            shouldAddInputToList,\n            shouldShowContentOnEmptyInput,\n            dropdownSearchString,\n            customFilter,\n            shouldUseCustomFilterOnly,\n        ]);\n\n        const handleClick = useCallback(() => {\n            if (shouldShowBody) {\n                handleClose();\n            } else {\n                handleOpen();\n            }\n        }, [handleClose, handleOpen, shouldShowBody]);\n\n        const rightElement = useMemo(() => {\n            if (!shouldShowToggleIcon) {\n                return undefined;\n            }\n\n            return (\n                <StyledSearchBoxIcon onClick={handleClick}>\n                    <Icon icons={['fa fa-chevron-down']} color={theme['006'] as string} />\n                </StyledSearchBoxIcon>\n            );\n        }, [handleClick, shouldShowToggleIcon, theme]);\n\n        const leftElement = useMemo(\n            () =>\n                (leftIcons || selectedImage) && (\n                    <StyledSearchBoxLeftWrapper>\n                        {leftIcons && <Icon icons={leftIcons} />}\n                        {selectedImage && selectedImage}\n                    </StyledSearchBoxLeftWrapper>\n                ),\n            [leftIcons, selectedImage],\n        );\n\n        /**\n         * This function handles changes of the input\n         */\n        const handleChange = useCallback(\n            (event: ChangeEvent<HTMLInputElement>) => {\n                const filteredLists: ISearchBoxItems[] = [];\n                shouldShowPresetValue.current = false;\n\n                activeList.forEach(({ list, groupName }) => {\n                    const newList = filterSearchBoxItems({\n                        customFilter,\n                        items: list,\n                        searchString: event.target.value,\n                        shouldUseCustomFilterOnly,\n                    });\n\n                    if (newList.length > 0) {\n                        filteredLists.push({\n                            groupName,\n                            list: newList,\n                        });\n                    }\n                });\n\n                if (filteredLists.length === 0 && shouldAddInputToList) {\n                    filteredLists.push({\n                        groupName: undefined,\n                        list: [],\n                    });\n                }\n\n                setSelectedImage(undefined);\n\n                if (!shouldShowContentOnEmptyInput && !event.target.value) {\n                    setMatchingListsItems([]);\n                } else {\n                    setMatchingListsItems(filteredLists);\n                }\n\n                if (filteredLists.length !== 0) {\n                    handleOpen();\n                }\n\n                setValue(event.target.value);\n                setInputToListValue(event.target.value);\n\n                if (typeof onChange === 'function') {\n                    onChange(event);\n                }\n\n                if (typeof inputProps?.onChange === 'function') {\n                    inputProps.onChange(event);\n                }\n            },\n            [\n                activeList,\n                customFilter,\n                handleOpen,\n                inputProps,\n                onChange,\n                shouldAddInputToList,\n                shouldShowContentOnEmptyInput,\n                shouldUseCustomFilterOnly,\n            ],\n        );\n\n        /**\n         * This function handles the blur event of the input\n         */\n        const handleBlur = useCallback(\n            (event: FocusEvent<HTMLInputElement>) => {\n                hasFocusRef.current = false;\n\n                if (typeof onBlur === 'function') {\n                    onBlur(event);\n                }\n\n                if (typeof inputProps?.onBlur === 'function') {\n                    inputProps.onBlur(event);\n                }\n            },\n            [inputProps, onBlur],\n        );\n\n        const handleDropdownOutsideClick = useCallback(() => {\n            tagInputRef.current?.blur();\n\n            return hasFocusRef.current && isTouch;\n        }, [isTouch]);\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                // Check if focus is moving outside the SearchBox container\n                // Also check the dropdown content (contentRef) since it's rendered in a portal\n                if (\n                    !nextFocusedElement ||\n                    (!currentContainer.contains(nextFocusedElement) &&\n                        !contentRef.current?.contains(nextFocusedElement))\n                ) {\n                    handleClose();\n                }\n            },\n            [handleClose],\n        );\n\n        /**\n         * This function handles the item selection\n         */\n        const handleSelect = useCallback(\n            (item: ISearchBoxItem) => {\n                const newItem = {\n                    ...item,\n                    text: item.text.replace('<b>', '').replace('</b>', '').replace('</b', ''),\n                };\n\n                if (tagInputSettings) {\n                    setValue('');\n                    setInputToListValue('');\n                    tagInputRef.current?.resetValue();\n                } else {\n                    setValue(newItem.text);\n                }\n\n                handleClose();\n\n                setSelectedImage(\n                    newItem.imageUrl ? (\n                        <StyledSearchBoxItemImage\n                            src={newItem.imageUrl}\n                            $shouldShowRoundImage={shouldShowRoundImage}\n                        />\n                    ) : undefined,\n                );\n\n                setMatchingListsItems([]);\n\n                if (typeof onSelect === 'function') {\n                    onSelect(newItem);\n                }\n            },\n            [handleClose, onSelect, shouldShowRoundImage, tagInputSettings],\n        );\n\n        const content = useMemo(() => {\n            if (hintText && matchingListsItems.length === 0) {\n                return (\n                    <StyledSearchBoxHintText>\n                        {hintText.replace('##value##', value)}\n                    </StyledSearchBoxHintText>\n                );\n            }\n\n            const items: ReactElement[] = [];\n\n            matchingListsItems.forEach(({ groupName, list }, index) => {\n                if (hasMultipleGroups) {\n                    if (list.length <= 0) {\n                        return;\n                    }\n\n                    if (index !== 0) {\n                        items.push(<GroupName key={groupName} name={groupName ?? ''} />);\n                    }\n                }\n\n                list.forEach(({ id, text, imageUrl }, listIndex) => {\n                    items.push(\n                        <SearchBoxItem\n                            key={`${id}_${groupName ?? ''}`}\n                            id={id}\n                            text={text}\n                            imageUrl={imageUrl}\n                            shouldShowSmallItems={shouldShowSmallItems}\n                            shouldShowRoundImage={shouldShowRoundImage}\n                            onSelect={handleSelect}\n                            groupName={groupName}\n                            tabIndex={index === 0 && listIndex === 0 ? 0 : -1}\n                        />,\n                    );\n                });\n            });\n\n            if (shouldAddInputToList && inputToListValue !== '') {\n                items.push(\n                    <SearchBoxItem\n                        id=\"input-value\"\n                        onSelect={handleSelect}\n                        shouldShowSmallItems={shouldShowSmallItems}\n                        text={`<b>${inputToListValue}</b`}\n                        tabIndex={items.length === 0 ? 0 : -1}\n                    />,\n                );\n            }\n\n            return items;\n        }, [\n            hintText,\n            matchingListsItems,\n            shouldAddInputToList,\n            inputToListValue,\n            value,\n            hasMultipleGroups,\n            shouldShowSmallItems,\n            shouldShowRoundImage,\n            handleSelect,\n        ]);\n\n        useEffect(() => {\n            const handleKeyDown = (e: KeyboardEvent) => {\n                if (!shouldShowBody || matchingListsItems.length === 0) {\n                    return;\n                }\n\n                const children = contentRef.current?.children;\n\n                if (!children) {\n                    return;\n                }\n\n                const childrenArray = Array.from(children);\n\n                const newChildren = childrenArray.find((child) =>\n                    child.id.startsWith('searchBoxContent__'),\n                )?.children;\n\n                if (!(newChildren && newChildren.length > 0)) {\n                    return;\n                }\n\n                const filteredChildren = Array.from(newChildren).filter(\n                    (child) => (child as HTMLElement).dataset.isgroupname !== 'true',\n                );\n\n                setFilteredChildrenArray(filteredChildren);\n\n                if (e.key === 'ArrowUp' || e.key === 'ArrowDown') {\n                    e.preventDefault();\n\n                    if (newChildren && newChildren.length > 0) {\n                        const newIndex =\n                            focusedIndex !== null\n                                ? (focusedIndex +\n                                      (e.key === 'ArrowUp' ? -1 : 1) +\n                                      filteredChildren.length) %\n                                  filteredChildren.length\n                                : 0;\n\n                        if (focusedIndex !== null) {\n                            const prevElement = filteredChildren[focusedIndex] as HTMLDivElement;\n                            prevElement.tabIndex = -1;\n                        }\n\n                        setFocusedIndex(newIndex);\n\n                        const newElement = filteredChildren[newIndex] as HTMLDivElement;\n\n                        newElement.tabIndex = 0;\n                    }\n                } else if (e.key === 'Enter' || e.key === ' ') {\n                    e.preventDefault();\n                    e.stopPropagation();\n\n                    if (filteredChildren) {\n                        const element = filteredChildren[focusedIndex ?? 0];\n\n                        if (!element) {\n                            return;\n                        }\n\n                        const { id, textContent } = element;\n\n                        let imageUrl: string | undefined;\n\n                        // Just Ignore, it works\n                        // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n                        // @ts-ignore\n                        if (element.children[0]?.attributes.src) {\n                            // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n                            // @ts-ignore\n                            // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access\n                            imageUrl = element.children[0]?.attributes.src.nodeValue as string;\n                        }\n\n                        const newId = id.replace('search-box-item__', '');\n\n                        handleSelect({\n                            id: newId === 'input-value' ? textContent : newId,\n                            text: textContent ?? '',\n                            imageUrl,\n                        });\n                    }\n                }\n            };\n\n            document.addEventListener('keydown', handleKeyDown);\n\n            return () => {\n                document.removeEventListener('keydown', handleKeyDown);\n            };\n        }, [\n            filteredChildrenArray,\n            focusedIndex,\n            handleSelect,\n            matchingListsItems.length,\n            shouldShowBody,\n        ]);\n\n        const handleKeyPress = useCallback((event: KeyboardEvent) => {\n            if (event.keyCode === 27) {\n                setMatchingListsItems([]);\n            }\n        }, []);\n\n        useImperativeHandle(\n            ref,\n            () => ({\n                clear: () => setValue(''),\n            }),\n            [setValue],\n        );\n\n        useEffect(() => {\n            document.addEventListener('keydown', handleKeyPress);\n\n            return () => {\n                document.addEventListener('keydown', handleKeyPress);\n            };\n        }, [handleKeyPress]);\n\n        /**\n         * Update the value if preset value changes\n         */\n        useEffect(() => {\n            if (presetValue) {\n                setValue(presetValue);\n            }\n        }, [presetValue, setValue]);\n\n        const shouldShowDropdown =\n            shouldShowBody &&\n            (matchingListsItems.length !== 0 || !!hintText) &&\n            (value.trim() !== '' || shouldShowContentOnEmptyInput);\n\n        return useMemo(\n            () => (\n                <StyledSearchBox\n                    ref={boxRef}\n                    key={`search-box-${uuid}`}\n                    onBlur={handleContainerBlur}\n                >\n                    <div id={`search_box_input${uuid}`}>\n                        {tagInputSettings ? (\n                            <TagInput\n                                leftElement={leftElement}\n                                onAdd={tagInputSettings.onAdd}\n                                onBlur={handleBlur}\n                                onChange={handleChange}\n                                onFocus={handleFocus}\n                                onRemove={tagInputSettings.onRemove}\n                                placeholder={placeholder}\n                                ref={tagInputRef}\n                                shouldAllowMultiple={tagInputSettings.shouldAllowMultiple}\n                                shouldEnableKeyboardHighlighting={shouldEnableKeyboardHighlighting}\n                                shouldPreventEnter\n                                tags={tagInputSettings.tags}\n                            />\n                        ) : (\n                            <Input\n                                /* eslint-disable-next-line react/jsx-props-no-spreading */\n                                {...inputProps}\n                                isInvalid={isInvalid}\n                                leftElement={leftElement}\n                                onBlur={handleBlur}\n                                onChange={handleChange}\n                                onFocus={handleFocus}\n                                onKeyDown={handleKeyDown}\n                                placeholder={placeholder}\n                                ref={inputRef}\n                                rightElement={rightElement}\n                                shouldEnableKeyboardHighlighting={\n                                    inputProps?.shouldEnableKeyboardHighlighting ??\n                                    shouldEnableKeyboardHighlighting\n                                }\n                                value={value}\n                            />\n                        )}\n                    </div>\n                    {boxRef.current && (\n                        <DropdownBodyWrapper\n                            anchorElement={boxRef.current}\n                            container={container}\n                            direction={dropdownDirection}\n                            onClose={handleClose}\n                            onOutsideClick={handleDropdownOutsideClick}\n                            shouldShowDropdown={shouldShowDropdown}\n                        >\n                            <SearchBoxBody\n                                filterButtons={filterButtons}\n                                height={height}\n                                maxHeight={maxHeight}\n                                shouldShow={shouldShowDropdown}\n                                key={`search-box-body-${uuid}`}\n                                onGroupSelect={handleFilterButtonsGroupSelect}\n                                ref={contentRef}\n                                selectedGroups={groups}\n                                shouldHideFilterButtons={shouldHideFilterButtons}\n                            >\n                                {content}\n                            </SearchBoxBody>\n                        </DropdownBodyWrapper>\n                    )}\n                </StyledSearchBox>\n            ),\n            [\n                container,\n                content,\n                dropdownDirection,\n                filterButtons,\n                groups,\n                handleBlur,\n                handleChange,\n                handleClose,\n                handleDropdownOutsideClick,\n                handleFocus,\n                handleKeyDown,\n                height,\n                inputProps,\n                isInvalid,\n                leftElement,\n                maxHeight,\n                onKeyDown,\n                placeholder,\n                rightElement,\n                shouldHideFilterButtons,\n                shouldShowDropdown,\n                shouldEnableKeyboardHighlighting,\n                tagInputSettings,\n                uuid,\n                value,\n            ],\n        );\n    },\n);\n\nSearchBox.displayName = 'SearchBox';\n\nexport default SearchBox;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"SearchBox.js","names":["useDevice","React","forwardRef","useCallback","useEffect","useImperativeHandle","useMemo","useRef","useState","useTheme","calculateContentHeight","searchList","sortSearchBoxItems","Icon","Input","GroupName","SearchBoxBody","SearchBoxItem","StyledSearchBoxItemImage","StyledSearchBox","StyledSearchBoxHintText","StyledSearchBoxIcon","StyledSearchBoxLeftWrapper","useUuid","DropdownBodyWrapper","TagInput","filterSearchBoxItems","customFilter","items","searchString","shouldUseCustomFilterOnly","filteredItems","filter","getDropdownSearchString","selectedId","shouldKeepSelectedItemPosition","value","SearchBox","container","dropdownDirection","inputProps","isInvalid","leftIcons","lists","maxHeight","onBlur","onChange","onKeyDown","onSelect","placeholder","presetValue","hintText","shouldAddInputToList","shouldHideFilterButtons","shouldShowContentOnEmptyInput","shouldShowSmallItems","shouldShowRoundImage","shouldShowToggleIcon","tagInputSettings","shouldEnableKeyboardHighlighting","ref","matchingListsItems","setMatchingListsItems","selectedImage","setSelectedImage","internalValue","setInternalValue","inputValue","setValue","nextValue","height","setHeight","focusedIndex","setFocusedIndex","hasMultipleGroups","setHasMultipleGroups","length","filteredChildrenArray","setFilteredChildrenArray","inputToListValue","setInputToListValue","groups","setGroups","shouldShowBody","setShouldShowBody","uuid","boxRef","contentRef","inputRef","tagInputRef","hasFocusRef","isAnimatingRef","shouldShowPresetValue","theme","dropdownSearchString","isTouch","filterButtons","forEach","groupName","push","id","text","activeList","newLists","list","includes","newMatchingItems","newList","undefined","filteredMatchingListItems","map","item","handleOpen","handleClose","handleFilterButtonsGroupSelect","keys","textArray","selectedItem","find","imageUrl","createElement","src","$shouldShowRoundImage","current","handleFocus","event","onFocus","handleKeyDown","toLowerCase","handleClick","rightElement","onClick","icons","color","leftElement","handleChange","filteredLists","target","handleBlur","handleDropdownOutsideClick","blur","handleContainerBlur","nextFocusedElement","relatedTarget","currentContainer","currentTarget","contains","handleSelect","newItem","replace","resetValue","content","index","key","name","listIndex","tabIndex","e","children","childrenArray","Array","from","newChildren","child","startsWith","filteredChildren","dataset","isgroupname","preventDefault","newIndex","prevElement","newElement","stopPropagation","element","textContent","attributes","nodeValue","newId","document","addEventListener","removeEventListener","handleKeyPress","keyCode","clear","shouldShowDropdown","trim","onAdd","onRemove","size","shouldAllowMultiple","shouldPreventEnter","tags","_extends","anchorElement","direction","onClose","onOutsideClick","shouldShow","onGroupSelect","selectedGroups","displayName"],"sources":["../../../../src/components/search-box/SearchBox.tsx"],"sourcesContent":["import { useDevice } from 'chayns-api';\nimport React, {\n    ChangeEvent,\n    ChangeEventHandler,\n    FC,\n    FocusEvent,\n    FocusEventHandler,\n    forwardRef,\n    KeyboardEventHandler,\n    ReactElement,\n    useCallback,\n    useEffect,\n    useImperativeHandle,\n    useMemo,\n    useRef,\n    useState,\n} from 'react';\nimport { useTheme } from 'styled-components';\nimport type { IFilterButtonItem } from '../../types/filterButtons';\nimport type { ISearchBoxItem, ISearchBoxItems } from '../../types/searchBox';\nimport { calculateContentHeight } from '../../utils/calculate';\nimport { searchList, sortSearchBoxItems } from '../../utils/searchBox';\nimport type { Theme } from '../color-scheme-provider/ColorSchemeProvider';\nimport Icon from '../icon/Icon';\nimport Input, { type InputProps } from '../input/Input';\nimport GroupName from './group-name/GroupName';\nimport SearchBoxBody from './search-box-body/SearchBoxBody';\nimport SearchBoxItem from './search-box-item/SearchBoxItem';\nimport { StyledSearchBoxItemImage } from './search-box-item/SearchBoxItem.styles';\nimport {\n    StyledSearchBox,\n    StyledSearchBoxHintText,\n    StyledSearchBoxIcon,\n    StyledSearchBoxLeftWrapper,\n} from './SearchBox.styles';\nimport { useUuid } from '../../hooks/uuid';\nimport DropdownBodyWrapper from '../dropdown-body-wrapper/DropdownBodyWrapper';\nimport TagInput, { TagInputProps, TagInputRef } from '../tag-input/TagInput';\nimport type { DropdownDirection } from '../../types/dropdown';\n\nexport interface SearchBoxRef {\n    clear: VoidFunction;\n}\n\nexport interface TagInputSettings {\n    onAdd?: TagInputProps['onAdd'];\n    onRemove?: TagInputProps['onRemove'];\n    size?: TagInputProps['size'];\n    shouldAllowMultiple?: TagInputProps['shouldAllowMultiple'];\n    tags?: TagInputProps['tags'];\n}\n\nconst filterSearchBoxItems = ({\n    customFilter,\n    items,\n    searchString,\n    shouldUseCustomFilterOnly,\n}: {\n    customFilter?: (item: ISearchBoxItem) => boolean;\n    items: ISearchBoxItem[];\n    searchString: string;\n    shouldUseCustomFilterOnly?: boolean;\n}) => {\n    if (typeof customFilter !== 'function') {\n        return searchList({ items, searchString });\n    }\n\n    if (shouldUseCustomFilterOnly) {\n        const filteredItems = items.filter(customFilter);\n\n        return sortSearchBoxItems({ items: filteredItems, searchString });\n    }\n\n    return searchList({ items, searchString }).filter(customFilter);\n};\n\nconst getDropdownSearchString = ({\n    selectedId,\n    shouldKeepSelectedItemPosition,\n    value,\n}: {\n    selectedId?: string;\n    shouldKeepSelectedItemPosition?: boolean;\n    value: string;\n}) => (shouldKeepSelectedItemPosition && selectedId ? '' : value);\n\nexport type SearchBoxProps = {\n    /**\n     * The element where the content of the `ComboBox` should be rendered via React Portal.\n     */\n    container?: Element;\n    /**\n     * An optional callback function to filter the elements to be displayed\n     */\n    customFilter?: (item: ISearchBoxItem) => boolean;\n    /**\n     * If true, the custom filter replaces the built-in text search instead of narrowing its results.\n     */\n    shouldUseCustomFilterOnly?: boolean;\n    /**\n     * The direction in which the dropdown should be displayed. By default, it is displayed below the input.\n     */\n    dropdownDirection?: DropdownDirection;\n    /**\n     * If true, the input field is marked as invalid\n     */\n    isInvalid?: boolean;\n    /**\n     * An optional icon that is displayed inside the left side of the input.\n     */\n    leftIcons?: string[];\n    /**\n     * Props that are passed to the underlying Input component.\n     */\n    inputProps?: InputProps;\n    /**\n     * List of groups with items that can be searched. It is possible to give only one list; if multiple lists are provided, the 'group name' parameter becomes mandatory.\n     */\n    lists: ISearchBoxItems[];\n    /**\n     * The maximum height of the dropdown body in pixels.\n     */\n    maxHeight?: number;\n    /**\n     * Function to be executed when the input lost focus.\n     */\n    onBlur?: FocusEventHandler<HTMLInputElement>;\n    /**\n     * Function to be executed when the input is changed.\n     */\n    onChange?: ChangeEventHandler<HTMLInputElement>;\n    /**\n     * Function that is executed when a letter is pressed\n     */\n    onKeyDown?: KeyboardEventHandler<HTMLInputElement>;\n    /**\n     * Function to be executed when an item is selected.\n     */\n    onSelect?: (item: ISearchBoxItem) => void;\n    /**\n     * The placeholder that should be displayed.\n     */\n    placeholder?: string;\n    /**\n     * Set an input for the search box - it is not an item of a list, just a string.\n     */\n    presetValue?: string;\n    /**\n     * Control the selected item. If you use this prop, make sure to update it when the user selects an item.\n     */\n    selectedId?: string;\n    /**\n     * If true, the selected item keeps its original position in the dropdown list.\n     */\n    shouldKeepSelectedItemPosition?: boolean;\n    /**\n     * If true, the value in the Input is displayed in the list.\n     */\n    shouldAddInputToList: boolean;\n    /**\n     * If true, the filter buttons are hidden.\n     */\n    shouldHideFilterButtons?: boolean;\n    /**\n     * Whether the full list of items should be displayed if the input is empty.\n     */\n    shouldShowContentOnEmptyInput?: boolean;\n    /**\n     * If true, the dropdown items are displayed more compactly.\n     */\n    shouldShowSmallItems?: boolean;\n    /**\n     * If true, the images of the items are displayed in a round shape.\n     */\n    shouldShowRoundImage?: boolean;\n    /**\n     * Whether the icon to open and close the list should be displayed.\n     */\n    shouldShowToggleIcon?: boolean;\n    /**\n     * Settings for the TagInput.\n     */\n    tagInputSettings?: TagInputSettings;\n    /**\n     * Enables keyboard-only focus highlighting.\n     */\n    shouldEnableKeyboardHighlighting?: boolean;\n    /**\n     * A text that should be displayed if no results are found.\n     */\n    hintText?: string;\n};\n\nconst SearchBox: FC<SearchBoxProps> = forwardRef<SearchBoxRef, SearchBoxProps>(\n    (\n        {\n            container,\n            customFilter,\n            dropdownDirection,\n            inputProps,\n            isInvalid = false,\n            leftIcons,\n            lists,\n            maxHeight = 300,\n            onBlur,\n            onChange,\n            onKeyDown,\n            onSelect,\n            placeholder,\n            presetValue,\n            hintText,\n            selectedId,\n            shouldAddInputToList = true,\n            shouldKeepSelectedItemPosition = false,\n            shouldUseCustomFilterOnly = false,\n            shouldHideFilterButtons = false,\n            shouldShowContentOnEmptyInput = true,\n            shouldShowSmallItems = false,\n            shouldShowRoundImage,\n            shouldShowToggleIcon = false,\n            tagInputSettings,\n            shouldEnableKeyboardHighlighting,\n        },\n        ref,\n    ) => {\n        const [matchingListsItems, setMatchingListsItems] = useState<ISearchBoxItems[]>(lists);\n        const [selectedImage, setSelectedImage] = useState<ReactElement>();\n        const [internalValue, setInternalValue] = useState(\n            typeof presetValue === 'string' && presetValue !== '' ? presetValue : '',\n        );\n        const inputValue = inputProps?.value;\n        const value = inputValue ?? internalValue;\n        const setValue = useCallback(\n            (nextValue: string) => {\n                if (typeof inputValue !== 'string') {\n                    setInternalValue(nextValue);\n                }\n            },\n            [inputValue],\n        );\n        const [height, setHeight] = useState<number>(0);\n        const [focusedIndex, setFocusedIndex] = useState<number | null>(null);\n        const [hasMultipleGroups, setHasMultipleGroups] = useState<boolean>(lists.length > 1);\n        const [filteredChildrenArray, setFilteredChildrenArray] = useState<Element[]>();\n        const [inputToListValue, setInputToListValue] = useState<string>('');\n        const [groups, setGroups] = useState<string[]>(['all']);\n        const [shouldShowBody, setShouldShowBody] = useState(false);\n\n        const uuid = useUuid();\n\n        const boxRef = useRef<HTMLDivElement>(null);\n        const contentRef = useRef<HTMLDivElement>(null);\n        const inputRef = useRef<HTMLInputElement | null>(null);\n        const tagInputRef = useRef<TagInputRef>(null);\n\n        const hasFocusRef = useRef<boolean>(false);\n        const isAnimatingRef = useRef<boolean>(false);\n        const shouldShowPresetValue = useRef<boolean>(\n            typeof presetValue === 'string' && presetValue !== '',\n        );\n\n        const theme = useTheme() as Theme;\n        const dropdownSearchString = getDropdownSearchString({\n            selectedId,\n            shouldKeepSelectedItemPosition,\n            value,\n        });\n\n        const { isTouch } = useDevice();\n\n        /**\n         * Checks if there are multiple groups in the lists\n         */\n        useEffect(() => {\n            setHasMultipleGroups(lists.length > 1);\n        }, [lists]);\n\n        const filterButtons = useMemo(() => {\n            const items: IFilterButtonItem[] = [];\n\n            if (lists.length <= 1) {\n                return items;\n            }\n\n            lists.forEach(({ groupName }) => {\n                if (groupName) {\n                    items.push({\n                        id: groupName,\n                        text: groupName,\n                    });\n                }\n            });\n\n            return items;\n        }, [lists]);\n\n        /**\n         * Filters the lists by the FilterButtons\n         */\n        const activeList = useMemo(() => {\n            let newLists: ISearchBoxItems[] = [];\n\n            if (groups[0] === 'all') {\n                newLists = lists;\n            } else {\n                lists.forEach((list) => {\n                    if (list.groupName && groups.includes(list.groupName)) {\n                        newLists.push(list);\n                    }\n                });\n            }\n\n            const newMatchingItems: ISearchBoxItems[] = [];\n\n            newLists.forEach(({ list, groupName }) => {\n                const newList = filterSearchBoxItems({\n                    customFilter,\n                    items: list,\n                    searchString: dropdownSearchString,\n                    shouldUseCustomFilterOnly,\n                });\n\n                if (newList.length > 0) {\n                    newMatchingItems.push({\n                        groupName,\n                        list: newList,\n                    });\n                }\n            });\n\n            if (newMatchingItems.length === 0 && shouldAddInputToList) {\n                newMatchingItems.push({\n                    groupName: undefined,\n                    list: [],\n                });\n            }\n\n            const filteredMatchingListItems = newMatchingItems.map(({ list, groupName }) => ({\n                groupName,\n                list: list.filter((item) => {\n                    if (typeof customFilter === 'function' && shouldUseCustomFilterOnly) {\n                        return true;\n                    }\n\n                    return !(newMatchingItems.length === 1 && item.text === dropdownSearchString);\n                }),\n            }));\n\n            setMatchingListsItems(filteredMatchingListItems);\n\n            return newLists;\n        }, [\n            groups,\n            lists,\n            customFilter,\n            dropdownSearchString,\n            shouldAddInputToList,\n            shouldUseCustomFilterOnly,\n        ]);\n\n        const handleOpen = useCallback(() => {\n            setShouldShowBody(true);\n        }, []);\n\n        const handleClose = useCallback(() => {\n            setShouldShowBody(false);\n        }, []);\n\n        const handleFilterButtonsGroupSelect = (keys: string[]) => {\n            setGroups(keys.length === 0 ? ['all'] : keys);\n        };\n\n        /**\n         * This hook calculates the height\n         */\n        useEffect(() => {\n            const textArray: string[] = [];\n\n            activeList.forEach(({ list, groupName }) => {\n                list.forEach(({ text }) => textArray.push(text));\n                if (!groupName) {\n                    return;\n                }\n                textArray.push(groupName);\n            });\n\n            if (shouldAddInputToList && inputToListValue !== '') {\n                textArray.push(inputToListValue);\n            }\n\n            setHeight(calculateContentHeight(textArray));\n        }, [inputToListValue, activeList, placeholder, shouldAddInputToList]);\n\n        useEffect(() => {\n            if (selectedId) {\n                activeList.forEach(({ list }) => {\n                    const selectedItem = list.find(({ id }) => id === selectedId);\n                    if (selectedItem) {\n                        setValue(selectedItem.text);\n\n                        if (selectedItem.imageUrl) {\n                            setSelectedImage(\n                                <StyledSearchBoxItemImage\n                                    src={selectedItem.imageUrl}\n                                    $shouldShowRoundImage={shouldShowRoundImage}\n                                />,\n                            );\n                        }\n                    }\n                });\n            }\n        }, [activeList, selectedId, shouldShowRoundImage]);\n\n        /**\n         * This hook resets the value if the selectedId changes to undefined. This is an own useEffect because the value\n         * should not be reset if the list changes and the selectedId is still undefined.\n         */\n        useEffect(() => {\n            if (!selectedId && !shouldShowPresetValue.current) {\n                setValue('');\n            }\n        }, [selectedId]);\n\n        useEffect(() => {\n            isAnimatingRef.current = shouldShowBody;\n        }, [shouldShowBody]);\n\n        useEffect(() => {\n            if (\n                (matchingListsItems.length !== 0 || hintText) &&\n                !isAnimatingRef.current &&\n                hasFocusRef.current\n            ) {\n                handleOpen();\n            }\n        }, [handleOpen, hintText, matchingListsItems.length]);\n\n        /**\n         * This function handles the focus event of the input and opens the dropdown if the input\n         * should show content on an empty input\n         */\n        const handleFocus = useCallback(\n            (event: FocusEvent<HTMLInputElement>) => {\n                hasFocusRef.current = true;\n\n                if (typeof inputProps?.onFocus === 'function') {\n                    inputProps.onFocus(event);\n                }\n\n                if (shouldShowContentOnEmptyInput) {\n                    const newMatchingItems: ISearchBoxItems[] = [];\n\n                    activeList.forEach(({ list, groupName }) => {\n                        const newList = filterSearchBoxItems({\n                            customFilter,\n                            items: list,\n                            searchString: dropdownSearchString,\n                            shouldUseCustomFilterOnly,\n                        });\n\n                        if (newList.length > 0) {\n                            newMatchingItems.push({\n                                groupName,\n                                list: newList,\n                            });\n                        }\n                    });\n\n                    if (newMatchingItems.length === 0 && shouldAddInputToList) {\n                        newMatchingItems.push({\n                            groupName: undefined,\n                            list: [],\n                        });\n                    }\n\n                    const filteredMatchingListItems = newMatchingItems.map(\n                        ({ list, groupName }) => ({\n                            groupName,\n                            list: list.filter((item) => {\n                                if (\n                                    typeof customFilter === 'function' &&\n                                    shouldUseCustomFilterOnly\n                                ) {\n                                    return true;\n                                }\n\n                                return !(\n                                    newMatchingItems.length === 1 &&\n                                    item.text === dropdownSearchString\n                                );\n                            }),\n                        }),\n                    );\n\n                    setMatchingListsItems(filteredMatchingListItems);\n\n                    if (filteredMatchingListItems.length !== 0 || hintText) {\n                        handleOpen();\n                    }\n                }\n            },\n            [\n                shouldShowContentOnEmptyInput,\n                activeList,\n                shouldAddInputToList,\n                hintText,\n                dropdownSearchString,\n                customFilter,\n                shouldUseCustomFilterOnly,\n                handleOpen,\n                inputProps,\n            ],\n        );\n\n        const handleKeyDown = useCallback<KeyboardEventHandler<HTMLInputElement>>(\n            (event) => {\n                if (typeof onKeyDown === 'function') {\n                    onKeyDown(event);\n                }\n\n                if (typeof inputProps?.onKeyDown === 'function') {\n                    inputProps.onKeyDown(event);\n                }\n            },\n            [inputProps, onKeyDown],\n        );\n\n        /**\n         * This function filters the lists by input\n         */\n\n        useEffect(() => {\n            const newMatchingItems: ISearchBoxItems[] = [];\n\n            activeList.forEach(({ list, groupName }) => {\n                const newList = filterSearchBoxItems({\n                    customFilter,\n                    items: list,\n                    searchString: dropdownSearchString,\n                    shouldUseCustomFilterOnly,\n                });\n\n                if (newList.length > 0) {\n                    newMatchingItems.push({\n                        groupName,\n                        list: newList,\n                    });\n                }\n            });\n\n            if (newMatchingItems.length === 0 && shouldAddInputToList) {\n                newMatchingItems.push({\n                    groupName: undefined,\n                    list: [],\n                });\n            }\n\n            if (shouldAddInputToList && inputToListValue !== '') {\n                newMatchingItems.forEach(({ list }) => {\n                    list.forEach(({ text }) => {\n                        if (text.toLowerCase() === inputToListValue.toLowerCase()) {\n                            setInputToListValue('');\n                        }\n                    });\n                });\n            }\n        }, [\n            inputToListValue,\n            activeList,\n            shouldAddInputToList,\n            shouldShowContentOnEmptyInput,\n            dropdownSearchString,\n            customFilter,\n            shouldUseCustomFilterOnly,\n        ]);\n\n        const handleClick = useCallback(() => {\n            if (shouldShowBody) {\n                handleClose();\n            } else {\n                handleOpen();\n            }\n        }, [handleClose, handleOpen, shouldShowBody]);\n\n        const rightElement = useMemo(() => {\n            if (!shouldShowToggleIcon) {\n                return undefined;\n            }\n\n            return (\n                <StyledSearchBoxIcon onClick={handleClick}>\n                    <Icon icons={['fa fa-chevron-down']} color={theme['006'] as string} />\n                </StyledSearchBoxIcon>\n            );\n        }, [handleClick, shouldShowToggleIcon, theme]);\n\n        const leftElement = useMemo(\n            () =>\n                (leftIcons || selectedImage) && (\n                    <StyledSearchBoxLeftWrapper>\n                        {leftIcons && <Icon icons={leftIcons} />}\n                        {selectedImage && selectedImage}\n                    </StyledSearchBoxLeftWrapper>\n                ),\n            [leftIcons, selectedImage],\n        );\n\n        /**\n         * This function handles changes of the input\n         */\n        const handleChange = useCallback(\n            (event: ChangeEvent<HTMLInputElement>) => {\n                const filteredLists: ISearchBoxItems[] = [];\n                shouldShowPresetValue.current = false;\n\n                activeList.forEach(({ list, groupName }) => {\n                    const newList = filterSearchBoxItems({\n                        customFilter,\n                        items: list,\n                        searchString: event.target.value,\n                        shouldUseCustomFilterOnly,\n                    });\n\n                    if (newList.length > 0) {\n                        filteredLists.push({\n                            groupName,\n                            list: newList,\n                        });\n                    }\n                });\n\n                if (filteredLists.length === 0 && shouldAddInputToList) {\n                    filteredLists.push({\n                        groupName: undefined,\n                        list: [],\n                    });\n                }\n\n                setSelectedImage(undefined);\n\n                if (!shouldShowContentOnEmptyInput && !event.target.value) {\n                    setMatchingListsItems([]);\n                } else {\n                    setMatchingListsItems(filteredLists);\n                }\n\n                if (filteredLists.length !== 0) {\n                    handleOpen();\n                }\n\n                setValue(event.target.value);\n                setInputToListValue(event.target.value);\n\n                if (typeof onChange === 'function') {\n                    onChange(event);\n                }\n\n                if (typeof inputProps?.onChange === 'function') {\n                    inputProps.onChange(event);\n                }\n            },\n            [\n                activeList,\n                customFilter,\n                handleOpen,\n                inputProps,\n                onChange,\n                shouldAddInputToList,\n                shouldShowContentOnEmptyInput,\n                shouldUseCustomFilterOnly,\n            ],\n        );\n\n        /**\n         * This function handles the blur event of the input\n         */\n        const handleBlur = useCallback(\n            (event: FocusEvent<HTMLInputElement>) => {\n                hasFocusRef.current = false;\n\n                if (typeof onBlur === 'function') {\n                    onBlur(event);\n                }\n\n                if (typeof inputProps?.onBlur === 'function') {\n                    inputProps.onBlur(event);\n                }\n            },\n            [inputProps, onBlur],\n        );\n\n        const handleDropdownOutsideClick = useCallback(() => {\n            tagInputRef.current?.blur();\n\n            return hasFocusRef.current && isTouch;\n        }, [isTouch]);\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                // Check if focus is moving outside the SearchBox container\n                // Also check the dropdown content (contentRef) since it's rendered in a portal\n                if (\n                    !nextFocusedElement ||\n                    (!currentContainer.contains(nextFocusedElement) &&\n                        !contentRef.current?.contains(nextFocusedElement))\n                ) {\n                    handleClose();\n                }\n            },\n            [handleClose],\n        );\n\n        /**\n         * This function handles the item selection\n         */\n        const handleSelect = useCallback(\n            (item: ISearchBoxItem) => {\n                const newItem = {\n                    ...item,\n                    text: item.text.replace('<b>', '').replace('</b>', '').replace('</b', ''),\n                };\n\n                if (tagInputSettings) {\n                    setValue('');\n                    setInputToListValue('');\n                    tagInputRef.current?.resetValue();\n                } else {\n                    setValue(newItem.text);\n                }\n\n                handleClose();\n\n                setSelectedImage(\n                    newItem.imageUrl ? (\n                        <StyledSearchBoxItemImage\n                            src={newItem.imageUrl}\n                            $shouldShowRoundImage={shouldShowRoundImage}\n                        />\n                    ) : undefined,\n                );\n\n                setMatchingListsItems([]);\n\n                if (typeof onSelect === 'function') {\n                    onSelect(newItem);\n                }\n            },\n            [handleClose, onSelect, shouldShowRoundImage, tagInputSettings],\n        );\n\n        const content = useMemo(() => {\n            if (hintText && matchingListsItems.length === 0) {\n                return (\n                    <StyledSearchBoxHintText>\n                        {hintText.replace('##value##', value)}\n                    </StyledSearchBoxHintText>\n                );\n            }\n\n            const items: ReactElement[] = [];\n\n            matchingListsItems.forEach(({ groupName, list }, index) => {\n                if (hasMultipleGroups) {\n                    if (list.length <= 0) {\n                        return;\n                    }\n\n                    if (index !== 0) {\n                        items.push(<GroupName key={groupName} name={groupName ?? ''} />);\n                    }\n                }\n\n                list.forEach(({ id, text, imageUrl }, listIndex) => {\n                    items.push(\n                        <SearchBoxItem\n                            key={`${id}_${groupName ?? ''}`}\n                            id={id}\n                            text={text}\n                            imageUrl={imageUrl}\n                            shouldShowSmallItems={shouldShowSmallItems}\n                            shouldShowRoundImage={shouldShowRoundImage}\n                            onSelect={handleSelect}\n                            groupName={groupName}\n                            tabIndex={index === 0 && listIndex === 0 ? 0 : -1}\n                        />,\n                    );\n                });\n            });\n\n            if (shouldAddInputToList && inputToListValue !== '') {\n                items.push(\n                    <SearchBoxItem\n                        id=\"input-value\"\n                        onSelect={handleSelect}\n                        shouldShowSmallItems={shouldShowSmallItems}\n                        text={`<b>${inputToListValue}</b`}\n                        tabIndex={items.length === 0 ? 0 : -1}\n                    />,\n                );\n            }\n\n            return items;\n        }, [\n            hintText,\n            matchingListsItems,\n            shouldAddInputToList,\n            inputToListValue,\n            value,\n            hasMultipleGroups,\n            shouldShowSmallItems,\n            shouldShowRoundImage,\n            handleSelect,\n        ]);\n\n        useEffect(() => {\n            const handleKeyDown = (e: KeyboardEvent) => {\n                if (!shouldShowBody || matchingListsItems.length === 0) {\n                    return;\n                }\n\n                const children = contentRef.current?.children;\n\n                if (!children) {\n                    return;\n                }\n\n                const childrenArray = Array.from(children);\n\n                const newChildren = childrenArray.find((child) =>\n                    child.id.startsWith('searchBoxContent__'),\n                )?.children;\n\n                if (!(newChildren && newChildren.length > 0)) {\n                    return;\n                }\n\n                const filteredChildren = Array.from(newChildren).filter(\n                    (child) => (child as HTMLElement).dataset.isgroupname !== 'true',\n                );\n\n                setFilteredChildrenArray(filteredChildren);\n\n                if (e.key === 'ArrowUp' || e.key === 'ArrowDown') {\n                    e.preventDefault();\n\n                    if (newChildren && newChildren.length > 0) {\n                        const newIndex =\n                            focusedIndex !== null\n                                ? (focusedIndex +\n                                      (e.key === 'ArrowUp' ? -1 : 1) +\n                                      filteredChildren.length) %\n                                  filteredChildren.length\n                                : 0;\n\n                        if (focusedIndex !== null) {\n                            const prevElement = filteredChildren[focusedIndex] as HTMLDivElement;\n                            prevElement.tabIndex = -1;\n                        }\n\n                        setFocusedIndex(newIndex);\n\n                        const newElement = filteredChildren[newIndex] as HTMLDivElement;\n\n                        newElement.tabIndex = 0;\n                    }\n                } else if (e.key === 'Enter' || e.key === ' ') {\n                    e.preventDefault();\n                    e.stopPropagation();\n\n                    if (filteredChildren) {\n                        const element = filteredChildren[focusedIndex ?? 0];\n\n                        if (!element) {\n                            return;\n                        }\n\n                        const { id, textContent } = element;\n\n                        let imageUrl: string | undefined;\n\n                        // Just Ignore, it works\n                        // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n                        // @ts-ignore\n                        if (element.children[0]?.attributes.src) {\n                            // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n                            // @ts-ignore\n                            // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access\n                            imageUrl = element.children[0]?.attributes.src.nodeValue as string;\n                        }\n\n                        const newId = id.replace('search-box-item__', '');\n\n                        handleSelect({\n                            id: newId === 'input-value' ? textContent : newId,\n                            text: textContent ?? '',\n                            imageUrl,\n                        });\n                    }\n                }\n            };\n\n            document.addEventListener('keydown', handleKeyDown);\n\n            return () => {\n                document.removeEventListener('keydown', handleKeyDown);\n            };\n        }, [\n            filteredChildrenArray,\n            focusedIndex,\n            handleSelect,\n            matchingListsItems.length,\n            shouldShowBody,\n        ]);\n\n        const handleKeyPress = useCallback((event: KeyboardEvent) => {\n            if (event.keyCode === 27) {\n                setMatchingListsItems([]);\n            }\n        }, []);\n\n        useImperativeHandle(\n            ref,\n            () => ({\n                clear: () => setValue(''),\n            }),\n            [setValue],\n        );\n\n        useEffect(() => {\n            document.addEventListener('keydown', handleKeyPress);\n\n            return () => {\n                document.addEventListener('keydown', handleKeyPress);\n            };\n        }, [handleKeyPress]);\n\n        /**\n         * Update the value if preset value changes\n         */\n        useEffect(() => {\n            if (presetValue) {\n                setValue(presetValue);\n            }\n        }, [presetValue, setValue]);\n\n        const shouldShowDropdown =\n            shouldShowBody &&\n            (matchingListsItems.length !== 0 || !!hintText) &&\n            (value.trim() !== '' || shouldShowContentOnEmptyInput);\n\n        return useMemo(\n            () => (\n                <StyledSearchBox\n                    ref={boxRef}\n                    key={`search-box-${uuid}`}\n                    onBlur={handleContainerBlur}\n                >\n                    <div id={`search_box_input${uuid}`}>\n                        {tagInputSettings ? (\n                            <TagInput\n                                leftElement={leftElement}\n                                onAdd={tagInputSettings.onAdd}\n                                onBlur={handleBlur}\n                                onChange={handleChange}\n                                onFocus={handleFocus}\n                                onRemove={tagInputSettings.onRemove}\n                                placeholder={placeholder}\n                                ref={tagInputRef}\n                                size={tagInputSettings.size}\n                                shouldAllowMultiple={tagInputSettings.shouldAllowMultiple}\n                                shouldEnableKeyboardHighlighting={shouldEnableKeyboardHighlighting}\n                                shouldPreventEnter\n                                tags={tagInputSettings.tags}\n                            />\n                        ) : (\n                            <Input\n                                /* eslint-disable-next-line react/jsx-props-no-spreading */\n                                {...inputProps}\n                                isInvalid={isInvalid}\n                                leftElement={leftElement}\n                                onBlur={handleBlur}\n                                onChange={handleChange}\n                                onFocus={handleFocus}\n                                onKeyDown={handleKeyDown}\n                                placeholder={placeholder}\n                                ref={inputRef}\n                                rightElement={rightElement}\n                                shouldEnableKeyboardHighlighting={\n                                    inputProps?.shouldEnableKeyboardHighlighting ??\n                                    shouldEnableKeyboardHighlighting\n                                }\n                                value={value}\n                            />\n                        )}\n                    </div>\n                    {boxRef.current && (\n                        <DropdownBodyWrapper\n                            anchorElement={boxRef.current}\n                            container={container}\n                            direction={dropdownDirection}\n                            onClose={handleClose}\n                            onOutsideClick={handleDropdownOutsideClick}\n                            shouldShowDropdown={shouldShowDropdown}\n                        >\n                            <SearchBoxBody\n                                filterButtons={filterButtons}\n                                height={height}\n                                maxHeight={maxHeight}\n                                shouldShow={shouldShowDropdown}\n                                key={`search-box-body-${uuid}`}\n                                onGroupSelect={handleFilterButtonsGroupSelect}\n                                ref={contentRef}\n                                selectedGroups={groups}\n                                shouldHideFilterButtons={shouldHideFilterButtons}\n                            >\n                                {content}\n                            </SearchBoxBody>\n                        </DropdownBodyWrapper>\n                    )}\n                </StyledSearchBox>\n            ),\n            [\n                container,\n                content,\n                dropdownDirection,\n                filterButtons,\n                groups,\n                handleBlur,\n                handleChange,\n                handleClose,\n                handleDropdownOutsideClick,\n                handleFocus,\n                handleKeyDown,\n                height,\n                inputProps,\n                isInvalid,\n                leftElement,\n                maxHeight,\n                onKeyDown,\n                placeholder,\n                rightElement,\n                shouldHideFilterButtons,\n                shouldShowDropdown,\n                shouldEnableKeyboardHighlighting,\n                tagInputSettings,\n                uuid,\n                value,\n            ],\n        );\n    },\n);\n\nSearchBox.displayName = 'SearchBox';\n\nexport default SearchBox;\n"],"mappings":"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","ignoreList":[]}

package/lib/esm/components/tag-input/TagInput.js

@@ -2,6 +2,8 @@ import React, { forwardRef, useCallback, useMemo, useState, useImperativeHandle,
 import { useTheme } from 'styled-components';
 import { v4 as uuidv4 } from 'uuid';
 import Badge from '../badge/Badge';
+import { BadgeSize } from '../badge/Badge.types';
+import { InputSize } from '../input/Input';
 import Icon from '../icon/Icon';
 import { StyledTagInput, StyledTagInputTagFocusWrapper, StyledTagInputIconWrapper, StyledTagInputTagInput, StyledTagInputTagWrapper, StyledTagInputTagWrapperText } from './TagInput.styles';
 import { AreaContext } from '../area-provider/AreaContextProvider';
@@ -18,6 +20,7 @@ const TagInput = /*#__PURE__*/forwardRef(({
   shouldAllowMultiple = true,
   shouldEnableKeyboardHighlighting,
   shouldPreventEnter,
+  size = InputSize.Medium,
   tags
 }, ref) => {
   const [currentValue, setCurrentValue] = useState('');
@@ -157,9 +160,15 @@ const TagInput = /*#__PURE__*/forwardRef(({
         $shouldShowKeyboardHighlighting: shouldShowKeyboardHighlighting,
         key: `tag-input-${id}`
       }, /*#__PURE__*/React.createElement(Badge, {
-        backgroundColor: isSelected ? theme['206'] ?? undefined : undefined
-      }, /*#__PURE__*/React.createElement(StyledTagInputTagWrapper, null, /*#__PURE__*/React.createElement(StyledTagInputTagWrapperText, null, text), rightElement, /*#__PURE__*/React.createElement(Icon, {
+        backgroundColor: isSelected ? theme['206'] ?? undefined : undefined,
+        size: size === InputSize.Small ? BadgeSize.SMALL : BadgeSize.DEFAULT
+      }, /*#__PURE__*/React.createElement(StyledTagInputTagWrapper, {
+        $size: size
+      }, /*#__PURE__*/React.createElement(StyledTagInputTagWrapperText, {
+        $size: size
+      }, text), rightElement, /*#__PURE__*/React.createElement(Icon, {
         icons: ['ts-wrong'],
+        size: size === InputSize.Small ? 14 : 16,
         shouldEnableKeyboardHighlighting: false,
         onClick: event => {
           event.preventDefault();
@@ -169,21 +178,25 @@ const TagInput = /*#__PURE__*/forwardRef(({
       })))));
     });
     return items;
-  }, [tags, shouldAllowMultiple, selectedId, shouldShowKeyboardHighlighting, theme, handleIconClick]);
+  }, [tags, shouldAllowMultiple, selectedId, shouldShowKeyboardHighlighting, theme, handleIconClick, size]);
   const shouldShowInput = useMemo(() => shouldAllowMultiple || (tags?.length ?? 0) < 1, [tags?.length, shouldAllowMultiple]);
   return useMemo(() => /*#__PURE__*/React.createElement(StyledTagInput, {
     $shouldChangeColor: shouldChangeColor,
     $shouldShowKeyboardHighlighting: shouldShowKeyboardHighlighting,
-    $shouldShowTagHighlighting: shouldShowTagHighlighting
-  }, leftElement && /*#__PURE__*/React.createElement(StyledTagInputIconWrapper, null, leftElement), content, shouldShowInput && /*#__PURE__*/React.createElement(StyledTagInputTagInput, {
+    $shouldShowTagHighlighting: shouldShowTagHighlighting,
+    $size: size
+  }, leftElement && /*#__PURE__*/React.createElement(StyledTagInputIconWrapper, {
+    $size: size
+  }, leftElement), content, shouldShowInput && /*#__PURE__*/React.createElement(StyledTagInputTagInput, {
     onBlur: onBlur,
     onChange: handleChange,
     onFocus: onFocus,
     onKeyDown: handleKeyDown,
     placeholder: tags && tags.length > 0 ? undefined : placeholder,
     ref: inputRef,
+    $size: size,
     value: currentValue
-  })), [content, currentValue, handleChange, handleKeyDown, leftElement, onBlur, onFocus, placeholder, shouldChangeColor, shouldShowInput, shouldShowKeyboardHighlighting, shouldShowTagHighlighting, tags]);
+  })), [content, currentValue, handleChange, handleKeyDown, leftElement, onBlur, onFocus, placeholder, shouldChangeColor, shouldShowInput, shouldShowKeyboardHighlighting, shouldShowTagHighlighting, size, tags]);
 });
 export default TagInput;
 //# sourceMappingURL=TagInput.js.map

package/lib/esm/components/tag-input/TagInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"TagInput.js","names":["React","forwardRef","useCallback","useMemo","useState","useImperativeHandle","useContext","useRef","useTheme","v4","uuidv4","Badge","Icon","StyledTagInput","StyledTagInputTagFocusWrapper","StyledTagInputIconWrapper","StyledTagInputTagInput","StyledTagInputTagWrapper","StyledTagInputTagWrapperText","AreaContext","useCursorRepaint","useKeyboardFocusHighlighting","TagInput","leftElement","onAdd","onBlur","onChange","onFocus","onRemove","placeholder","shouldAllowMultiple","shouldEnableKeyboardHighlighting","shouldPreventEnter","tags","ref","currentValue","setCurrentValue","selectedId","setSelectedId","areaProvider","inputRef","theme","handleResetValue","shouldChangeColor","shouldShowKeyboardHighlighting","shouldShowTagHighlighting","blur","current","getUnsavedTagText","undefined","resetValue","handleRemoveTag","id","currentTags","removedTagIndex","findIndex","tag","handleKeyDown","event","visibleTags","slice","selectedTagIndex","selectedTag","isSpaceKey","key","isEnterKey","isDeleteKey","length","preventDefault","prevValue","newTag","text","onAddResult","Promise","then","shouldAddTag","handleChange","target","value","handleIconClick","content","items","forEach","rightElement","isSelected","push","createElement","$isSelected","$shouldShowKeyboardHighlighting","backgroundColor","icons","onClick","stopPropagation","shouldShowInput","$shouldChangeColor","$shouldShowTagHighlighting","onKeyDown"],"sources":["../../../../src/components/tag-input/TagInput.tsx"],"sourcesContent":["import React, {\n    forwardRef,\n    useCallback,\n    useMemo,\n    useState,\n    type ChangeEvent,\n    type KeyboardEvent,\n    type ReactElement,\n    useImperativeHandle,\n    useContext,\n    ChangeEventHandler,\n    ReactNode,\n    FocusEventHandler,\n    useRef,\n} from 'react';\nimport { useTheme } from 'styled-components';\nimport { v4 as uuidv4 } from 'uuid';\nimport type { Tag } from '../../types/tagInput';\nimport Badge from '../badge/Badge';\nimport Icon from '../icon/Icon';\nimport {\n    StyledTagInput,\n    StyledTagInputTagFocusWrapper,\n    StyledTagInputIconWrapper,\n    StyledTagInputTagInput,\n    StyledTagInputTagWrapper,\n    StyledTagInputTagWrapperText,\n} from './TagInput.styles';\nimport { AreaContext } from '../area-provider/AreaContextProvider';\nimport type { Theme } from '../color-scheme-provider/ColorSchemeProvider';\nimport { useCursorRepaint } from '../../hooks/resize';\nimport { useKeyboardFocusHighlighting } from '../../hooks/useKeyboardFocusHighlighting';\n\nexport type TagInputProps = {\n    /**\n     * An element that should be displayed on the left side of the input.\n     */\n    leftElement?: ReactNode;\n    /**\n     * Function to be executed when a tag is added.\n     */\n    onAdd?: (tag: Tag) => Promise<boolean> | boolean | void;\n    /**\n     * Function to be executed when the input is blurred.\n     */\n    onBlur?: FocusEventHandler;\n    /**\n     * Function to be executed when the value of the input is changed.\n     */\n    onChange?: ChangeEventHandler<HTMLInputElement>;\n    /**\n     * Function to be executed when the input is focused.\n     */\n    onFocus?: FocusEventHandler;\n    /**\n     * Enables keyboard-only focus highlighting.\n     */\n    shouldEnableKeyboardHighlighting?: boolean;\n    /**\n     * Function to be executed when a tag is removed.\n     */\n    onRemove?: (id: string) => void;\n    /**\n     * The placeholder that should be displayed.\n     */\n    placeholder?: string;\n    /**\n     * Whether multiple tags should be allowed.\n     */\n    shouldAllowMultiple?: boolean;\n    /**\n     * Whether the enter key should be prevented.\n     */\n    shouldPreventEnter?: boolean;\n    /**\n     * The tags that should be displayed.\n     */\n    tags?: Tag[];\n};\n\nexport interface TagInputRef {\n    blur: () => void;\n    getUnsavedTagText: Tag['text'] | undefined;\n    resetValue: () => void;\n}\n\nconst TagInput = forwardRef<TagInputRef, TagInputProps>(\n    (\n        {\n            leftElement,\n            onAdd,\n            onBlur,\n            onChange,\n            onFocus,\n            onRemove,\n            placeholder,\n            shouldAllowMultiple = true,\n            shouldEnableKeyboardHighlighting,\n            shouldPreventEnter,\n            tags,\n        },\n        ref,\n    ) => {\n        const [currentValue, setCurrentValue] = useState('');\n        const [selectedId, setSelectedId] = useState<Tag['id']>();\n\n        const areaProvider = useContext(AreaContext);\n\n        const inputRef = useRef<HTMLInputElement | null>(null);\n\n        useCursorRepaint(inputRef);\n\n        const theme = useTheme() as Theme;\n\n        const handleResetValue = () => {\n            setCurrentValue('');\n        };\n\n        const shouldChangeColor = useMemo(\n            () => areaProvider.shouldChangeColor ?? false,\n            [areaProvider.shouldChangeColor],\n        );\n\n        const shouldShowKeyboardHighlighting = useKeyboardFocusHighlighting(\n            shouldEnableKeyboardHighlighting,\n        );\n\n        const shouldShowTagHighlighting =\n            shouldShowKeyboardHighlighting && typeof selectedId === 'string';\n\n        useImperativeHandle(\n            ref,\n            () => ({\n                blur: () => inputRef.current?.blur(),\n                getUnsavedTagText: currentValue !== '' ? currentValue : undefined,\n                resetValue: handleResetValue,\n            }),\n            [currentValue],\n        );\n\n        const handleRemoveTag = useCallback(\n            (id: string, currentTags: Tag[]) => {\n                const removedTagIndex = currentTags.findIndex((tag) => tag.id === id);\n\n                if (typeof onRemove === 'function') {\n                    onRemove(id);\n                }\n\n                if (removedTagIndex < 0) {\n                    setSelectedId(undefined);\n                    return;\n                }\n\n                setSelectedId(\n                    currentTags[removedTagIndex + 1]?.id ?? currentTags[removedTagIndex - 1]?.id,\n                );\n            },\n            [onRemove],\n        );\n\n        const handleKeyDown = useCallback(\n            (event: KeyboardEvent<HTMLInputElement>) => {\n                const visibleTags = shouldAllowMultiple ? (tags ?? []) : (tags ?? []).slice(0, 1);\n                const selectedTagIndex = visibleTags.findIndex((tag) => tag.id === selectedId);\n                const selectedTag =\n                    selectedTagIndex >= 0 ? visibleTags[selectedTagIndex] : undefined;\n                const isSpaceKey = event.key === ' ';\n                const isEnterKey = event.key === 'Enter';\n                const isDeleteKey = event.key === 'Delete';\n\n                if (currentValue === '' && visibleTags.length > 0) {\n                    if (event.key === 'ArrowLeft') {\n                        event.preventDefault();\n\n                        if (!selectedId) {\n                            setSelectedId(visibleTags[visibleTags.length - 1]?.id);\n                            return;\n                        }\n\n                        if (selectedTagIndex <= 0) {\n                            setSelectedId(undefined);\n                            return;\n                        }\n\n                        setSelectedId(visibleTags[selectedTagIndex - 1]?.id);\n                        return;\n                    }\n\n                    if (event.key === 'ArrowRight') {\n                        event.preventDefault();\n\n                        if (!selectedId || selectedTagIndex < 0) {\n                            return;\n                        }\n\n                        if (selectedTagIndex >= visibleTags.length - 1) {\n                            setSelectedId(undefined);\n                            return;\n                        }\n\n                        setSelectedId(visibleTags[selectedTagIndex + 1]?.id);\n                        return;\n                    }\n\n                    if (event.key === 'Home') {\n                        event.preventDefault();\n                        setSelectedId(visibleTags[0]?.id);\n                        return;\n                    }\n\n                    if (event.key === 'End') {\n                        event.preventDefault();\n                        setSelectedId(visibleTags[visibleTags.length - 1]?.id);\n                        return;\n                    }\n\n                    if (isEnterKey || isSpaceKey || event.key === 'Backspace' || isDeleteKey) {\n                        event.preventDefault();\n\n                        if (!selectedTag) {\n                            setSelectedId(visibleTags[visibleTags.length - 1]?.id);\n                            return;\n                        }\n\n                        handleRemoveTag(selectedTag.id, visibleTags);\n                        return;\n                    }\n                }\n\n                if (isEnterKey && !shouldPreventEnter) {\n                    setCurrentValue((prevValue) => {\n                        if (!prevValue) {\n                            return '';\n                        }\n\n                        if (!shouldAllowMultiple && (tags?.length ?? 0) > 0) return '';\n\n                        const newTag = { id: uuidv4(), text: prevValue };\n\n                        if (typeof onAdd === 'function') {\n                            const onAddResult = onAdd(newTag);\n\n                            if (typeof onAddResult === 'boolean' && !onAddResult) {\n                                return prevValue;\n                            }\n\n                            if (onAddResult instanceof Promise) {\n                                void onAddResult.then((shouldAddTag) => {\n                                    if (!shouldAddTag) {\n                                        return prevValue;\n                                    }\n\n                                    return '';\n                                });\n                            }\n                        }\n\n                        return '';\n                    });\n                }\n            },\n            [\n                currentValue,\n                onAdd,\n                handleRemoveTag,\n                selectedId,\n                shouldAllowMultiple,\n                shouldPreventEnter,\n                tags,\n            ],\n        );\n\n        const handleChange = useCallback(\n            (event: ChangeEvent<HTMLInputElement>) => {\n                setCurrentValue(event.target.value);\n\n                if (typeof onChange === 'function') {\n                    onChange(event);\n                }\n\n                if (event.target.value !== '') {\n                    setSelectedId(undefined);\n                }\n            },\n            [onChange],\n        );\n\n        const handleIconClick = useCallback(\n            (id: string) => {\n                handleRemoveTag(id, shouldAllowMultiple ? (tags ?? []) : (tags ?? []).slice(0, 1));\n            },\n            [handleRemoveTag, shouldAllowMultiple, tags],\n        );\n\n        const content = useMemo(() => {\n            const items: ReactElement[] = [];\n\n            if (!tags) {\n                return items;\n            }\n\n            (shouldAllowMultiple ? tags : tags.slice(0, 1)).forEach(\n                ({ text, id, rightElement }) => {\n                    const isSelected = id === selectedId;\n\n                    items.push(\n                        <StyledTagInputTagFocusWrapper\n                            $isSelected={isSelected}\n                            $shouldShowKeyboardHighlighting={shouldShowKeyboardHighlighting}\n                            key={`tag-input-${id}`}\n                        >\n                            <Badge\n                                backgroundColor={\n                                    isSelected ? ((theme['206'] as string) ?? undefined) : undefined\n                                }\n                            >\n                                <StyledTagInputTagWrapper>\n                                    <StyledTagInputTagWrapperText>\n                                        {text}\n                                    </StyledTagInputTagWrapperText>\n                                    {rightElement}\n                                    <Icon\n                                        icons={['ts-wrong']}\n                                        shouldEnableKeyboardHighlighting={false}\n                                        onClick={(event) => {\n                                            event.preventDefault();\n                                            event.stopPropagation();\n\n                                            handleIconClick(id);\n                                        }}\n                                    />\n                                </StyledTagInputTagWrapper>\n                            </Badge>\n                        </StyledTagInputTagFocusWrapper>,\n                    );\n                },\n            );\n\n            return items;\n        }, [\n            tags,\n            shouldAllowMultiple,\n            selectedId,\n            shouldShowKeyboardHighlighting,\n            theme,\n            handleIconClick,\n        ]);\n\n        const shouldShowInput = useMemo(\n            () => shouldAllowMultiple || (tags?.length ?? 0) < 1,\n            [tags?.length, shouldAllowMultiple],\n        );\n\n        return useMemo(\n            () => (\n                <StyledTagInput\n                    $shouldChangeColor={shouldChangeColor}\n                    $shouldShowKeyboardHighlighting={shouldShowKeyboardHighlighting}\n                    $shouldShowTagHighlighting={shouldShowTagHighlighting}\n                >\n                    {leftElement && (\n                        <StyledTagInputIconWrapper>{leftElement}</StyledTagInputIconWrapper>\n                    )}\n                    {content}\n                    {shouldShowInput && (\n                        <StyledTagInputTagInput\n                            onBlur={onBlur}\n                            onChange={handleChange}\n                            onFocus={onFocus}\n                            onKeyDown={handleKeyDown}\n                            placeholder={tags && tags.length > 0 ? undefined : placeholder}\n                            ref={inputRef}\n                            value={currentValue}\n                        />\n                    )}\n                </StyledTagInput>\n            ),\n            [\n                content,\n                currentValue,\n                handleChange,\n                handleKeyDown,\n                leftElement,\n                onBlur,\n                onFocus,\n                placeholder,\n                shouldChangeColor,\n                shouldShowInput,\n                shouldShowKeyboardHighlighting,\n                shouldShowTagHighlighting,\n                tags,\n            ],\n        );\n    },\n);\n\nexport default TagInput;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"TagInput.js","names":["React","forwardRef","useCallback","useMemo","useState","useImperativeHandle","useContext","useRef","useTheme","v4","uuidv4","Badge","BadgeSize","InputSize","Icon","StyledTagInput","StyledTagInputTagFocusWrapper","StyledTagInputIconWrapper","StyledTagInputTagInput","StyledTagInputTagWrapper","StyledTagInputTagWrapperText","AreaContext","useCursorRepaint","useKeyboardFocusHighlighting","TagInput","leftElement","onAdd","onBlur","onChange","onFocus","onRemove","placeholder","shouldAllowMultiple","shouldEnableKeyboardHighlighting","shouldPreventEnter","size","Medium","tags","ref","currentValue","setCurrentValue","selectedId","setSelectedId","areaProvider","inputRef","theme","handleResetValue","shouldChangeColor","shouldShowKeyboardHighlighting","shouldShowTagHighlighting","blur","current","getUnsavedTagText","undefined","resetValue","handleRemoveTag","id","currentTags","removedTagIndex","findIndex","tag","handleKeyDown","event","visibleTags","slice","selectedTagIndex","selectedTag","isSpaceKey","key","isEnterKey","isDeleteKey","length","preventDefault","prevValue","newTag","text","onAddResult","Promise","then","shouldAddTag","handleChange","target","value","handleIconClick","content","items","forEach","rightElement","isSelected","push","createElement","$isSelected","$shouldShowKeyboardHighlighting","backgroundColor","Small","SMALL","DEFAULT","$size","icons","onClick","stopPropagation","shouldShowInput","$shouldChangeColor","$shouldShowTagHighlighting","onKeyDown"],"sources":["../../../../src/components/tag-input/TagInput.tsx"],"sourcesContent":["import React, {\n    forwardRef,\n    useCallback,\n    useMemo,\n    useState,\n    type ChangeEvent,\n    type KeyboardEvent,\n    type ReactElement,\n    useImperativeHandle,\n    useContext,\n    ChangeEventHandler,\n    ReactNode,\n    FocusEventHandler,\n    useRef,\n} from 'react';\nimport { useTheme } from 'styled-components';\nimport { v4 as uuidv4 } from 'uuid';\nimport type { Tag } from '../../types/tagInput';\nimport Badge from '../badge/Badge';\nimport { BadgeSize } from '../badge/Badge.types';\nimport { InputSize } from '../input/Input';\nimport Icon from '../icon/Icon';\nimport {\n    StyledTagInput,\n    StyledTagInputTagFocusWrapper,\n    StyledTagInputIconWrapper,\n    StyledTagInputTagInput,\n    StyledTagInputTagWrapper,\n    StyledTagInputTagWrapperText,\n} from './TagInput.styles';\nimport { AreaContext } from '../area-provider/AreaContextProvider';\nimport type { Theme } from '../color-scheme-provider/ColorSchemeProvider';\nimport { useCursorRepaint } from '../../hooks/resize';\nimport { useKeyboardFocusHighlighting } from '../../hooks/useKeyboardFocusHighlighting';\n\nexport type TagInputProps = {\n    /**\n     * An element that should be displayed on the left side of the input.\n     */\n    leftElement?: ReactNode;\n    /**\n     * Function to be executed when a tag is added.\n     */\n    onAdd?: (tag: Tag) => Promise<boolean> | boolean | void;\n    /**\n     * Function to be executed when the input is blurred.\n     */\n    onBlur?: FocusEventHandler;\n    /**\n     * Function to be executed when the value of the input is changed.\n     */\n    onChange?: ChangeEventHandler<HTMLInputElement>;\n    /**\n     * Function to be executed when the input is focused.\n     */\n    onFocus?: FocusEventHandler;\n    /**\n     * Enables keyboard-only focus highlighting.\n     */\n    shouldEnableKeyboardHighlighting?: boolean;\n    /**\n     * Function to be executed when a tag is removed.\n     */\n    onRemove?: (id: string) => void;\n    /**\n     * The placeholder that should be displayed.\n     */\n    placeholder?: string;\n    /**\n     * Whether multiple tags should be allowed.\n     */\n    shouldAllowMultiple?: boolean;\n    /**\n     * Whether the enter key should be prevented.\n     */\n    shouldPreventEnter?: boolean;\n    /**\n     * The tags that should be displayed.\n     */\n    tags?: Tag[];\n    /**\n     * The size of the input field.\n     */\n    size?: InputSize;\n};\n\nexport interface TagInputRef {\n    blur: () => void;\n    getUnsavedTagText: Tag['text'] | undefined;\n    resetValue: () => void;\n}\n\nconst TagInput = forwardRef<TagInputRef, TagInputProps>(\n    (\n        {\n            leftElement,\n            onAdd,\n            onBlur,\n            onChange,\n            onFocus,\n            onRemove,\n            placeholder,\n            shouldAllowMultiple = true,\n            shouldEnableKeyboardHighlighting,\n            shouldPreventEnter,\n            size = InputSize.Medium,\n            tags,\n        },\n        ref,\n    ) => {\n        const [currentValue, setCurrentValue] = useState('');\n        const [selectedId, setSelectedId] = useState<Tag['id']>();\n\n        const areaProvider = useContext(AreaContext);\n\n        const inputRef = useRef<HTMLInputElement | null>(null);\n\n        useCursorRepaint(inputRef);\n\n        const theme = useTheme() as Theme;\n\n        const handleResetValue = () => {\n            setCurrentValue('');\n        };\n\n        const shouldChangeColor = useMemo(\n            () => areaProvider.shouldChangeColor ?? false,\n            [areaProvider.shouldChangeColor],\n        );\n\n        const shouldShowKeyboardHighlighting = useKeyboardFocusHighlighting(\n            shouldEnableKeyboardHighlighting,\n        );\n\n        const shouldShowTagHighlighting =\n            shouldShowKeyboardHighlighting && typeof selectedId === 'string';\n\n        useImperativeHandle(\n            ref,\n            () => ({\n                blur: () => inputRef.current?.blur(),\n                getUnsavedTagText: currentValue !== '' ? currentValue : undefined,\n                resetValue: handleResetValue,\n            }),\n            [currentValue],\n        );\n\n        const handleRemoveTag = useCallback(\n            (id: string, currentTags: Tag[]) => {\n                const removedTagIndex = currentTags.findIndex((tag) => tag.id === id);\n\n                if (typeof onRemove === 'function') {\n                    onRemove(id);\n                }\n\n                if (removedTagIndex < 0) {\n                    setSelectedId(undefined);\n                    return;\n                }\n\n                setSelectedId(\n                    currentTags[removedTagIndex + 1]?.id ?? currentTags[removedTagIndex - 1]?.id,\n                );\n            },\n            [onRemove],\n        );\n\n        const handleKeyDown = useCallback(\n            (event: KeyboardEvent<HTMLInputElement>) => {\n                const visibleTags = shouldAllowMultiple ? (tags ?? []) : (tags ?? []).slice(0, 1);\n                const selectedTagIndex = visibleTags.findIndex((tag) => tag.id === selectedId);\n                const selectedTag =\n                    selectedTagIndex >= 0 ? visibleTags[selectedTagIndex] : undefined;\n                const isSpaceKey = event.key === ' ';\n                const isEnterKey = event.key === 'Enter';\n                const isDeleteKey = event.key === 'Delete';\n\n                if (currentValue === '' && visibleTags.length > 0) {\n                    if (event.key === 'ArrowLeft') {\n                        event.preventDefault();\n\n                        if (!selectedId) {\n                            setSelectedId(visibleTags[visibleTags.length - 1]?.id);\n                            return;\n                        }\n\n                        if (selectedTagIndex <= 0) {\n                            setSelectedId(undefined);\n                            return;\n                        }\n\n                        setSelectedId(visibleTags[selectedTagIndex - 1]?.id);\n                        return;\n                    }\n\n                    if (event.key === 'ArrowRight') {\n                        event.preventDefault();\n\n                        if (!selectedId || selectedTagIndex < 0) {\n                            return;\n                        }\n\n                        if (selectedTagIndex >= visibleTags.length - 1) {\n                            setSelectedId(undefined);\n                            return;\n                        }\n\n                        setSelectedId(visibleTags[selectedTagIndex + 1]?.id);\n                        return;\n                    }\n\n                    if (event.key === 'Home') {\n                        event.preventDefault();\n                        setSelectedId(visibleTags[0]?.id);\n                        return;\n                    }\n\n                    if (event.key === 'End') {\n                        event.preventDefault();\n                        setSelectedId(visibleTags[visibleTags.length - 1]?.id);\n                        return;\n                    }\n\n                    if (isEnterKey || isSpaceKey || event.key === 'Backspace' || isDeleteKey) {\n                        event.preventDefault();\n\n                        if (!selectedTag) {\n                            setSelectedId(visibleTags[visibleTags.length - 1]?.id);\n                            return;\n                        }\n\n                        handleRemoveTag(selectedTag.id, visibleTags);\n                        return;\n                    }\n                }\n\n                if (isEnterKey && !shouldPreventEnter) {\n                    setCurrentValue((prevValue) => {\n                        if (!prevValue) {\n                            return '';\n                        }\n\n                        if (!shouldAllowMultiple && (tags?.length ?? 0) > 0) return '';\n\n                        const newTag = { id: uuidv4(), text: prevValue };\n\n                        if (typeof onAdd === 'function') {\n                            const onAddResult = onAdd(newTag);\n\n                            if (typeof onAddResult === 'boolean' && !onAddResult) {\n                                return prevValue;\n                            }\n\n                            if (onAddResult instanceof Promise) {\n                                void onAddResult.then((shouldAddTag) => {\n                                    if (!shouldAddTag) {\n                                        return prevValue;\n                                    }\n\n                                    return '';\n                                });\n                            }\n                        }\n\n                        return '';\n                    });\n                }\n            },\n            [\n                currentValue,\n                onAdd,\n                handleRemoveTag,\n                selectedId,\n                shouldAllowMultiple,\n                shouldPreventEnter,\n                tags,\n            ],\n        );\n\n        const handleChange = useCallback(\n            (event: ChangeEvent<HTMLInputElement>) => {\n                setCurrentValue(event.target.value);\n\n                if (typeof onChange === 'function') {\n                    onChange(event);\n                }\n\n                if (event.target.value !== '') {\n                    setSelectedId(undefined);\n                }\n            },\n            [onChange],\n        );\n\n        const handleIconClick = useCallback(\n            (id: string) => {\n                handleRemoveTag(id, shouldAllowMultiple ? (tags ?? []) : (tags ?? []).slice(0, 1));\n            },\n            [handleRemoveTag, shouldAllowMultiple, tags],\n        );\n\n        const content = useMemo(() => {\n            const items: ReactElement[] = [];\n\n            if (!tags) {\n                return items;\n            }\n\n            (shouldAllowMultiple ? tags : tags.slice(0, 1)).forEach(\n                ({ text, id, rightElement }) => {\n                    const isSelected = id === selectedId;\n\n                    items.push(\n                        <StyledTagInputTagFocusWrapper\n                            $isSelected={isSelected}\n                            $shouldShowKeyboardHighlighting={shouldShowKeyboardHighlighting}\n                            key={`tag-input-${id}`}\n                        >\n                            <Badge\n                                backgroundColor={\n                                    isSelected ? ((theme['206'] as string) ?? undefined) : undefined\n                                }\n                                size={\n                                    size === InputSize.Small ? BadgeSize.SMALL : BadgeSize.DEFAULT\n                                }\n                            >\n                                <StyledTagInputTagWrapper $size={size}>\n                                    <StyledTagInputTagWrapperText $size={size}>\n                                        {text}\n                                    </StyledTagInputTagWrapperText>\n                                    {rightElement}\n                                    <Icon\n                                        icons={['ts-wrong']}\n                                        size={size === InputSize.Small ? 14 : 16}\n                                        shouldEnableKeyboardHighlighting={false}\n                                        onClick={(event) => {\n                                            event.preventDefault();\n                                            event.stopPropagation();\n\n                                            handleIconClick(id);\n                                        }}\n                                    />\n                                </StyledTagInputTagWrapper>\n                            </Badge>\n                        </StyledTagInputTagFocusWrapper>,\n                    );\n                },\n            );\n\n            return items;\n        }, [\n            tags,\n            shouldAllowMultiple,\n            selectedId,\n            shouldShowKeyboardHighlighting,\n            theme,\n            handleIconClick,\n            size,\n        ]);\n\n        const shouldShowInput = useMemo(\n            () => shouldAllowMultiple || (tags?.length ?? 0) < 1,\n            [tags?.length, shouldAllowMultiple],\n        );\n\n        return useMemo(\n            () => (\n                <StyledTagInput\n                    $shouldChangeColor={shouldChangeColor}\n                    $shouldShowKeyboardHighlighting={shouldShowKeyboardHighlighting}\n                    $shouldShowTagHighlighting={shouldShowTagHighlighting}\n                    $size={size}\n                >\n                    {leftElement && (\n                        <StyledTagInputIconWrapper $size={size}>\n                            {leftElement}\n                        </StyledTagInputIconWrapper>\n                    )}\n                    {content}\n                    {shouldShowInput && (\n                        <StyledTagInputTagInput\n                            onBlur={onBlur}\n                            onChange={handleChange}\n                            onFocus={onFocus}\n                            onKeyDown={handleKeyDown}\n                            placeholder={tags && tags.length > 0 ? undefined : placeholder}\n                            ref={inputRef}\n                            $size={size}\n                            value={currentValue}\n                        />\n                    )}\n                </StyledTagInput>\n            ),\n            [\n                content,\n                currentValue,\n                handleChange,\n                handleKeyDown,\n                leftElement,\n                onBlur,\n                onFocus,\n                placeholder,\n                shouldChangeColor,\n                shouldShowInput,\n                shouldShowKeyboardHighlighting,\n                shouldShowTagHighlighting,\n                size,\n                tags,\n            ],\n        );\n    },\n);\n\nexport default TagInput;\n"],"mappings":"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","ignoreList":[]}

package/lib/esm/components/tag-input/TagInput.styles.js

@@ -3,10 +3,16 @@ import { keyboardFocusHighlightingRingCss } from '../../utils/keyboardFocusHighl
 export const StyledTagInput = styled.div`
     display: flex;
     flex-wrap: wrap;
-    min-height: 42px;
-    padding: 5px;
+    min-height: ${({
+  $size
+}) => $size === 'medium' ? '42px' : '32px'};
+    padding: ${({
+  $size
+}) => $size === 'medium' ? '5px' : '4px'};
     align-items: center;
-    gap: 6px;
+    gap: ${({
+  $size
+}) => $size === 'medium' ? '6px' : '4px'};
     background-color: ${({
   theme,
   $shouldChangeColor
@@ -26,7 +32,9 @@ export const StyledTagInput = styled.div`
 export const StyledTagInputTagWrapper = styled.div`
     display: flex;
     align-items: center;
-    gap: 4px;
+    gap: ${({
+  $size
+}) => $size === 'medium' ? '4px' : '2px'};
 `;
 export const StyledTagInputTagFocusWrapper = styled.div`
     display: inline-flex;
@@ -49,22 +57,31 @@ export const StyledTagInputTagWrapperText = styled.p`
     white-space: nowrap;
     overflow: hidden;
     text-overflow: ellipsis;
-    font-size: 15px;
+    font-size: ${({
+  $size
+}) => $size === 'medium' ? '15px' : '13px'};
 `;
 export const StyledTagInputTagInput = styled.input`
     border: none;
-    height: 24px;
+    height: ${({
+  $size
+}) => $size === 'medium' ? '24px' : '20px'};
     flex-grow: 1;
     background-color: transparent;
     color: ${({
   theme
 }) => theme.text};
+    font-size: ${({
+  $size
+}) => $size === 'medium' ? '15px' : '13px'};
 `;
 export const StyledTagInputIconWrapper = styled.div`
     align-items: baseline;
     display: flex;
     flex: 0 0 auto;
     justify-content: center;
-    margin-left: 5px;
+    margin-left: ${({
+  $size
+}) => $size === 'medium' ? '5px' : '4px'};
 `;
 //# sourceMappingURL=TagInput.styles.js.map

package/lib/esm/components/tag-input/TagInput.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"TagInput.styles.js","names":["styled","css","keyboardFocusHighlightingRingCss","StyledTagInput","div","theme","$shouldChangeColor","colorMode","$shouldShowKeyboardHighlighting","$shouldShowTagHighlighting","StyledTagInputTagWrapper","StyledTagInputTagFocusWrapper","$isSelected","StyledTagInputTagWrapperText","p","StyledTagInputTagInput","input","text","StyledTagInputIconWrapper"],"sources":["../../../../src/components/tag-input/TagInput.styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\nimport { keyboardFocusHighlightingRingCss } from '../../utils/keyboardFocusHighlighting.styles';\n\ntype StyledTagInputProps = WithTheme<{\n    $shouldChangeColor: boolean;\n    $shouldShowKeyboardHighlighting: boolean;\n    $shouldShowTagHighlighting: boolean;\n}>;\n\ntype StyledTagInputTagFocusWrapperProps = {\n    $isSelected: boolean;\n    $shouldShowKeyboardHighlighting: boolean;\n};\n\nexport const StyledTagInput = styled.div<StyledTagInputProps>`\n    display: flex;\n    flex-wrap: wrap;\n    min-height: 42px;\n    padding: 5px;\n    align-items: center;\n    gap: 6px;\n    background-color: ${({ theme, $shouldChangeColor }: StyledTagInputProps) =>\n        theme.colorMode === 'classic' || $shouldChangeColor ? theme['000'] : theme['100']};\n    border: 1px solid rgba(160, 160, 160, 0.3);\n\n    ${({ $shouldShowKeyboardHighlighting, $shouldShowTagHighlighting }) =>\n        $shouldShowKeyboardHighlighting &&\n        !$shouldShowTagHighlighting &&\n        css`\n            &:focus-within {\n                transition: none;\n                ${keyboardFocusHighlightingRingCss}\n            }\n        `}\n`;\n\nexport const StyledTagInputTagWrapper = styled.div`\n    display: flex;\n    align-items: center;\n    gap: 4px;\n`;\n\nexport const StyledTagInputTagFocusWrapper = styled.div<StyledTagInputTagFocusWrapperProps>`\n    display: inline-flex;\n\n    ${({ $isSelected, $shouldShowKeyboardHighlighting }) =>\n        $isSelected &&\n        $shouldShowKeyboardHighlighting &&\n        css`\n            ${StyledTagInput}:focus-within & > .beta-chayns-badge {\n                transition: none;\n                ${keyboardFocusHighlightingRingCss}\n                border-radius: 999px;\n                outline-offset: 0;\n            }\n        `}\n`;\n\nexport const StyledTagInputTagWrapperText = styled.p`\n    margin: 0;\n    flex-grow: 1;\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    font-size: 15px;\n`;\n\ntype StyledTagInputTagInputProps = WithTheme<unknown>;\n\nexport const StyledTagInputTagInput = styled.input<StyledTagInputTagInputProps>`\n    border: none;\n    height: 24px;\n    flex-grow: 1;\n    background-color: transparent;\n    color: ${({ theme }: StyledTagInputTagInputProps) => theme.text};\n`;\n\nexport const StyledTagInputIconWrapper = styled.div`\n    align-items: baseline;\n    display: flex;\n    flex: 0 0 auto;\n    justify-content: center;\n    margin-left: 5px;\n`;\n"],"mappings":"AAAA,OAAOA,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAE/C,SAASC,gCAAgC,QAAQ,8CAA8C;AAa/F,OAAO,MAAMC,cAAc,GAAGH,MAAM,CAACI,GAAwB;AAC7D;AACA;AACA;AACA;AACA;AACA;AACA,wBAAwB,CAAC;EAAEC,KAAK;EAAEC;AAAwC,CAAC,KACnED,KAAK,CAACE,SAAS,KAAK,SAAS,IAAID,kBAAkB,GAAGD,KAAK,CAAC,KAAK,CAAC,GAAGA,KAAK,CAAC,KAAK,CAAC;AACzF;AACA;AACA,MAAM,CAAC;EAAEG,+BAA+B;EAAEC;AAA2B,CAAC,KAC9DD,+BAA+B,IAC/B,CAACC,0BAA0B,IAC3BR,GAAG;AACX;AACA;AACA,kBAAkBC,gCAAgC;AAClD;AACA,SAAS;AACT,CAAC;AAED,OAAO,MAAMQ,wBAAwB,GAAGV,MAAM,CAACI,GAAG;AAClD;AACA;AACA;AACA,CAAC;AAED,OAAO,MAAMO,6BAA6B,GAAGX,MAAM,CAACI,GAAuC;AAC3F;AACA;AACA,MAAM,CAAC;EAAEQ,WAAW;EAAEJ;AAAgC,CAAC,KAC/CI,WAAW,IACXJ,+BAA+B,IAC/BP,GAAG;AACX,cAAcE,cAAc;AAC5B;AACA,kBAAkBD,gCAAgC;AAClD;AACA;AACA;AACA,SAAS;AACT,CAAC;AAED,OAAO,MAAMW,4BAA4B,GAAGb,MAAM,CAACc,CAAC;AACpD;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAID,OAAO,MAAMC,sBAAsB,GAAGf,MAAM,CAACgB,KAAkC;AAC/E;AACA;AACA;AACA;AACA,aAAa,CAAC;EAAEX;AAAmC,CAAC,KAAKA,KAAK,CAACY,IAAI;AACnE,CAAC;AAED,OAAO,MAAMC,yBAAyB,GAAGlB,MAAM,CAACI,GAAG;AACnD;AACA;AACA;AACA;AACA;AACA,CAAC","ignoreList":[]}
+{"version":3,"file":"TagInput.styles.js","names":["styled","css","keyboardFocusHighlightingRingCss","StyledTagInput","div","$size","theme","$shouldChangeColor","colorMode","$shouldShowKeyboardHighlighting","$shouldShowTagHighlighting","StyledTagInputTagWrapper","StyledTagInputTagFocusWrapper","$isSelected","StyledTagInputTagWrapperText","p","StyledTagInputTagInput","input","text","StyledTagInputIconWrapper"],"sources":["../../../../src/components/tag-input/TagInput.styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\nimport { keyboardFocusHighlightingRingCss } from '../../utils/keyboardFocusHighlighting.styles';\nimport type { InputSize } from '../input/Input';\n\ntype StyledTagInputProps = WithTheme<{\n    $shouldChangeColor: boolean;\n    $shouldShowKeyboardHighlighting: boolean;\n    $shouldShowTagHighlighting: boolean;\n    $size: InputSize;\n}>;\n\ntype StyledTagInputTagFocusWrapperProps = {\n    $isSelected: boolean;\n    $shouldShowKeyboardHighlighting: boolean;\n};\n\nexport const StyledTagInput = styled.div<StyledTagInputProps>`\n    display: flex;\n    flex-wrap: wrap;\n    min-height: ${({ $size }) => ($size === 'medium' ? '42px' : '32px')};\n    padding: ${({ $size }) => ($size === 'medium' ? '5px' : '4px')};\n    align-items: center;\n    gap: ${({ $size }) => ($size === 'medium' ? '6px' : '4px')};\n    background-color: ${({ theme, $shouldChangeColor }: StyledTagInputProps) =>\n        theme.colorMode === 'classic' || $shouldChangeColor ? theme['000'] : theme['100']};\n    border: 1px solid rgba(160, 160, 160, 0.3);\n\n    ${({ $shouldShowKeyboardHighlighting, $shouldShowTagHighlighting }) =>\n        $shouldShowKeyboardHighlighting &&\n        !$shouldShowTagHighlighting &&\n        css`\n            &:focus-within {\n                transition: none;\n                ${keyboardFocusHighlightingRingCss}\n            }\n        `}\n`;\n\ntype StyledTagInputTagWrapperProps = {\n    $size: InputSize;\n};\n\nexport const StyledTagInputTagWrapper = styled.div<StyledTagInputTagWrapperProps>`\n    display: flex;\n    align-items: center;\n    gap: ${({ $size }) => ($size === 'medium' ? '4px' : '2px')};\n`;\n\nexport const StyledTagInputTagFocusWrapper = styled.div<StyledTagInputTagFocusWrapperProps>`\n    display: inline-flex;\n\n    ${({ $isSelected, $shouldShowKeyboardHighlighting }) =>\n        $isSelected &&\n        $shouldShowKeyboardHighlighting &&\n        css`\n            ${StyledTagInput}:focus-within & > .beta-chayns-badge {\n                transition: none;\n                ${keyboardFocusHighlightingRingCss}\n                border-radius: 999px;\n                outline-offset: 0;\n            }\n        `}\n`;\n\ntype StyledTagInputTagWrapperTextProps = {\n    $size: InputSize;\n};\n\nexport const StyledTagInputTagWrapperText = styled.p<StyledTagInputTagWrapperTextProps>`\n    margin: 0;\n    flex-grow: 1;\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    font-size: ${({ $size }) => ($size === 'medium' ? '15px' : '13px')};\n`;\n\ntype StyledTagInputTagInputProps = WithTheme<{\n    $size: InputSize;\n}>;\n\nexport const StyledTagInputTagInput = styled.input<StyledTagInputTagInputProps>`\n    border: none;\n    height: ${({ $size }) => ($size === 'medium' ? '24px' : '20px')};\n    flex-grow: 1;\n    background-color: transparent;\n    color: ${({ theme }: StyledTagInputTagInputProps) => theme.text};\n    font-size: ${({ $size }) => ($size === 'medium' ? '15px' : '13px')};\n`;\n\ntype StyledTagInputIconWrapperProps = {\n    $size: InputSize;\n};\n\nexport const StyledTagInputIconWrapper = styled.div<StyledTagInputIconWrapperProps>`\n    align-items: baseline;\n    display: flex;\n    flex: 0 0 auto;\n    justify-content: center;\n    margin-left: ${({ $size }) => ($size === 'medium' ? '5px' : '4px')};\n`;\n"],"mappings":"AAAA,OAAOA,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAE/C,SAASC,gCAAgC,QAAQ,8CAA8C;AAe/F,OAAO,MAAMC,cAAc,GAAGH,MAAM,CAACI,GAAwB;AAC7D;AACA;AACA,kBAAkB,CAAC;EAAEC;AAAM,CAAC,KAAMA,KAAK,KAAK,QAAQ,GAAG,MAAM,GAAG,MAAO;AACvE,eAAe,CAAC;EAAEA;AAAM,CAAC,KAAMA,KAAK,KAAK,QAAQ,GAAG,KAAK,GAAG,KAAM;AAClE;AACA,WAAW,CAAC;EAAEA;AAAM,CAAC,KAAMA,KAAK,KAAK,QAAQ,GAAG,KAAK,GAAG,KAAM;AAC9D,wBAAwB,CAAC;EAAEC,KAAK;EAAEC;AAAwC,CAAC,KACnED,KAAK,CAACE,SAAS,KAAK,SAAS,IAAID,kBAAkB,GAAGD,KAAK,CAAC,KAAK,CAAC,GAAGA,KAAK,CAAC,KAAK,CAAC;AACzF;AACA;AACA,MAAM,CAAC;EAAEG,+BAA+B;EAAEC;AAA2B,CAAC,KAC9DD,+BAA+B,IAC/B,CAACC,0BAA0B,IAC3BT,GAAG;AACX;AACA;AACA,kBAAkBC,gCAAgC;AAClD;AACA,SAAS;AACT,CAAC;AAMD,OAAO,MAAMS,wBAAwB,GAAGX,MAAM,CAACI,GAAkC;AACjF;AACA;AACA,WAAW,CAAC;EAAEC;AAAM,CAAC,KAAMA,KAAK,KAAK,QAAQ,GAAG,KAAK,GAAG,KAAM;AAC9D,CAAC;AAED,OAAO,MAAMO,6BAA6B,GAAGZ,MAAM,CAACI,GAAuC;AAC3F;AACA;AACA,MAAM,CAAC;EAAES,WAAW;EAAEJ;AAAgC,CAAC,KAC/CI,WAAW,IACXJ,+BAA+B,IAC/BR,GAAG;AACX,cAAcE,cAAc;AAC5B;AACA,kBAAkBD,gCAAgC;AAClD;AACA;AACA;AACA,SAAS;AACT,CAAC;AAMD,OAAO,MAAMY,4BAA4B,GAAGd,MAAM,CAACe,CAAoC;AACvF;AACA;AACA;AACA;AACA;AACA,iBAAiB,CAAC;EAAEV;AAAM,CAAC,KAAMA,KAAK,KAAK,QAAQ,GAAG,MAAM,GAAG,MAAO;AACtE,CAAC;AAMD,OAAO,MAAMW,sBAAsB,GAAGhB,MAAM,CAACiB,KAAkC;AAC/E;AACA,cAAc,CAAC;EAAEZ;AAAM,CAAC,KAAMA,KAAK,KAAK,QAAQ,GAAG,MAAM,GAAG,MAAO;AACnE;AACA;AACA,aAAa,CAAC;EAAEC;AAAmC,CAAC,KAAKA,KAAK,CAACY,IAAI;AACnE,iBAAiB,CAAC;EAAEb;AAAM,CAAC,KAAMA,KAAK,KAAK,QAAQ,GAAG,MAAM,GAAG,MAAO;AACtE,CAAC;AAMD,OAAO,MAAMc,yBAAyB,GAAGnB,MAAM,CAACI,GAAmC;AACnF;AACA;AACA;AACA;AACA,mBAAmB,CAAC;EAAEC;AAAM,CAAC,KAAMA,KAAK,KAAK,QAAQ,GAAG,KAAK,GAAG,KAAM;AACtE,CAAC","ignoreList":[]}

package/lib/types/components/search-box/SearchBox.d.ts

@@ -9,6 +9,7 @@ export interface SearchBoxRef {
 export interface TagInputSettings {
     onAdd?: TagInputProps['onAdd'];
     onRemove?: TagInputProps['onRemove'];
+    size?: TagInputProps['size'];
     shouldAllowMultiple?: TagInputProps['shouldAllowMultiple'];
     tags?: TagInputProps['tags'];
 }

package/lib/types/components/tag-input/TagInput.d.ts

@@ -1,5 +1,6 @@
 import React, { ChangeEventHandler, ReactNode, FocusEventHandler } from 'react';
 import type { Tag } from '../../types/tagInput';
+import { InputSize } from '../input/Input';
 export type TagInputProps = {
     /**
      * An element that should be displayed on the left side of the input.
@@ -45,6 +46,10 @@ export type TagInputProps = {
      * The tags that should be displayed.
      */
     tags?: Tag[];
+    /**
+     * The size of the input field.
+     */
+    size?: InputSize;
 };
 export interface TagInputRef {
     blur: () => void;