@chayns-components/core 5.4.12 → 5.4.13

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (35) hide show
  1. package/lib/cjs/components/page-provider/PageProvider.js +1 -1
  2. package/lib/cjs/components/page-provider/PageProvider.js.map +1 -1
  3. package/lib/cjs/components/search-box/SearchBox.js +69 -20
  4. package/lib/cjs/components/search-box/SearchBox.js.map +1 -1
  5. package/lib/cjs/components/search-box/search-box-body/SearchBoxBody.js +3 -1
  6. package/lib/cjs/components/search-box/search-box-body/SearchBoxBody.js.map +1 -1
  7. package/lib/cjs/components/search-box/search-box-body/SearchBoxBody.styles.js +6 -4
  8. package/lib/cjs/components/search-box/search-box-body/SearchBoxBody.styles.js.map +1 -1
  9. package/lib/cjs/components/search-box/search-box-item/SearchBoxItem.js +3 -1
  10. package/lib/cjs/components/search-box/search-box-item/SearchBoxItem.js.map +1 -1
  11. package/lib/cjs/components/search-box/search-box-item/SearchBoxItem.styles.js +6 -1
  12. package/lib/cjs/components/search-box/search-box-item/SearchBoxItem.styles.js.map +1 -1
  13. package/lib/cjs/utils/searchBox.js +22 -12
  14. package/lib/cjs/utils/searchBox.js.map +1 -1
  15. package/lib/esm/components/page-provider/PageProvider.js +1 -1
  16. package/lib/esm/components/page-provider/PageProvider.js.map +1 -1
  17. package/lib/esm/components/search-box/SearchBox.js +70 -21
  18. package/lib/esm/components/search-box/SearchBox.js.map +1 -1
  19. package/lib/esm/components/search-box/search-box-body/SearchBoxBody.js +3 -1
  20. package/lib/esm/components/search-box/search-box-body/SearchBoxBody.js.map +1 -1
  21. package/lib/esm/components/search-box/search-box-body/SearchBoxBody.styles.js +6 -4
  22. package/lib/esm/components/search-box/search-box-body/SearchBoxBody.styles.js.map +1 -1
  23. package/lib/esm/components/search-box/search-box-item/SearchBoxItem.js +3 -1
  24. package/lib/esm/components/search-box/search-box-item/SearchBoxItem.js.map +1 -1
  25. package/lib/esm/components/search-box/search-box-item/SearchBoxItem.styles.js +6 -1
  26. package/lib/esm/components/search-box/search-box-item/SearchBoxItem.styles.js.map +1 -1
  27. package/lib/esm/utils/searchBox.js +20 -11
  28. package/lib/esm/utils/searchBox.js.map +1 -1
  29. package/lib/types/components/search-box/SearchBox.d.ts +16 -0
  30. package/lib/types/components/search-box/search-box-body/SearchBoxBody.d.ts +1 -0
  31. package/lib/types/components/search-box/search-box-body/SearchBoxBody.styles.d.ts +4 -2
  32. package/lib/types/components/search-box/search-box-item/SearchBoxItem.d.ts +1 -0
  33. package/lib/types/components/search-box/search-box-item/SearchBoxItem.styles.d.ts +6 -2
  34. package/lib/types/utils/searchBox.d.ts +1 -0
  35. package/package.json +2 -2
@@ -1 +1 @@
1
- {"version":3,"file":"SearchBox.js","names":["useDevice","React","forwardRef","useCallback","useEffect","useImperativeHandle","useMemo","useRef","useState","useTheme","calculateContentHeight","searchList","Icon","Input","GroupName","SearchBoxBody","SearchBoxItem","StyledSearchBoxItemImage","StyledSearchBox","StyledSearchBoxHintText","StyledSearchBoxIcon","StyledSearchBoxLeftWrapper","useUuid","DropdownBodyWrapper","TagInput","SearchBox","container","customFilter","dropdownDirection","isInvalid","leftIcons","lists","onBlur","onChange","onKeyDown","onSelect","placeholder","presetValue","hintText","selectedId","shouldAddInputToList","shouldHideFilterButtons","shouldShowContentOnEmptyInput","shouldShowRoundImage","shouldShowToggleIcon","tagInputSettings","ref","matchingListsItems","setMatchingListsItems","selectedImage","setSelectedImage","value","setValue","height","setHeight","focusedIndex","setFocusedIndex","hasMultipleGroups","setHasMultipleGroups","length","filteredChildrenArray","setFilteredChildrenArray","inputToListValue","setInputToListValue","groups","setGroups","shouldShowBody","setShouldShowBody","uuid","boxRef","contentRef","inputRef","tagInputRef","hasFocusRef","isAnimatingRef","shouldShowPresetValue","theme","isTouch","filterButtons","items","forEach","groupName","push","id","text","activeList","newLists","list","includes","newMatchingItems","newList","searchString","undefined","filteredMatchingListItems","map","filter","item","handleOpen","handleClose","handleFilterButtonsGroupSelect","keys","textArray","selectedItem","find","imageUrl","createElement","src","$shouldShowRoundImage","current","handleFocus","toLowerCase","handleClick","rightElement","onClick","icons","color","leftElement","handleChange","event","filteredLists","target","handleBlur","handleDropdownOutsideClick","blur","handleSelect","newItem","replace","resetValue","content","index","key","name","listIndex","tabIndex","handleKeyDown","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","onFocus","onRemove","shouldAllowMultiple","shouldPreventEnter","tags","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 } from '../../utils/searchBox';\nimport type { Theme } from '../color-scheme-provider/ColorSchemeProvider';\nimport Icon from '../icon/Icon';\nimport Input 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\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 * 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 * 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 * 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 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 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 * 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 isInvalid = false,\n leftIcons,\n lists,\n onBlur,\n onChange,\n onKeyDown,\n onSelect,\n placeholder,\n presetValue,\n hintText,\n selectedId,\n shouldAddInputToList = true,\n shouldHideFilterButtons = false,\n shouldShowContentOnEmptyInput = true,\n shouldShowRoundImage,\n shouldShowToggleIcon = false,\n tagInputSettings,\n },\n ref,\n ) => {\n const [matchingListsItems, setMatchingListsItems] = useState<ISearchBoxItems[]>(lists);\n const [selectedImage, setSelectedImage] = useState<ReactElement>();\n const [value, setValue] = useState(\n typeof presetValue === 'string' && presetValue !== '' ? presetValue : '',\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\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 = searchList({ items: list, searchString: value });\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') {\n return customFilter(item);\n }\n return !(newMatchingItems.length === 1 && item.text === value);\n }),\n }));\n\n setMatchingListsItems(filteredMatchingListItems);\n\n return newLists;\n }, [groups, lists, customFilter, shouldAddInputToList, value]);\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 hasFocusRef.current = true;\n\n if (shouldShowContentOnEmptyInput) {\n const newMatchingItems: ISearchBoxItems[] = [];\n\n activeList.forEach(({ list, groupName }) => {\n const newList = searchList({ items: list, searchString: value });\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') {\n return customFilter(item);\n }\n return !(newMatchingItems.length === 1 && item.text === value);\n }),\n }));\n\n setMatchingListsItems(filteredMatchingListItems);\n\n if (filteredMatchingListItems.length !== 0 || hintText) {\n handleOpen();\n }\n }\n }, [\n shouldShowContentOnEmptyInput,\n activeList,\n shouldAddInputToList,\n hintText,\n value,\n customFilter,\n handleOpen,\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 = searchList({ items: list, searchString: value });\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 value,\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 = searchList({ items: list, searchString: event.target.value });\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 [activeList, handleOpen, onChange, shouldAddInputToList, shouldShowContentOnEmptyInput],\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 [onBlur],\n );\n\n const handleDropdownOutsideClick = useCallback(() => {\n tagInputRef.current?.blur();\n\n return hasFocusRef.current && isTouch;\n }, [isTouch]);\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 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 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 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') {\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 [],\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]);\n\n const shouldShowDropdown =\n shouldShowBody &&\n (matchingListsItems.length !== 0 || !!hintText) &&\n (value.trim() !== '' || shouldShowContentOnEmptyInput);\n\n return useMemo(\n () => (\n <StyledSearchBox ref={boxRef} key={`search-box-${uuid}`}>\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 shouldPreventEnter\n tags={tagInputSettings.tags}\n />\n ) : (\n <Input\n isInvalid={isInvalid}\n leftElement={leftElement}\n onBlur={handleBlur}\n onChange={handleChange}\n onFocus={handleFocus}\n onKeyDown={onKeyDown}\n placeholder={placeholder}\n ref={inputRef}\n rightElement={rightElement}\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 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 height,\n isInvalid,\n leftElement,\n onKeyDown,\n placeholder,\n rightElement,\n shouldHideFilterButtons,\n shouldShowDropdown,\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":[]}
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","isInvalid","leftIcons","lists","maxHeight","onBlur","onChange","onKeyDown","onSelect","placeholder","presetValue","hintText","shouldAddInputToList","shouldHideFilterButtons","shouldShowContentOnEmptyInput","shouldShowSmallItems","shouldShowRoundImage","shouldShowToggleIcon","tagInputSettings","ref","matchingListsItems","setMatchingListsItems","selectedImage","setSelectedImage","setValue","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","toLowerCase","handleClick","rightElement","onClick","icons","color","leftElement","handleChange","event","filteredLists","target","handleBlur","handleDropdownOutsideClick","blur","handleSelect","newItem","replace","resetValue","content","index","key","name","listIndex","tabIndex","handleKeyDown","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","onFocus","onRemove","shouldAllowMultiple","shouldPreventEnter","tags","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 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 * 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 * 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 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 },\n ref,\n ) => {\n const [matchingListsItems, setMatchingListsItems] = useState<ISearchBoxItems[]>(lists);\n const [selectedImage, setSelectedImage] = useState<ReactElement>();\n const [value, setValue] = useState(\n typeof presetValue === 'string' && presetValue !== '' ? presetValue : '',\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 hasFocusRef.current = true;\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(({ list, groupName }) => ({\n groupName,\n list: list.filter((item) => {\n if (typeof customFilter === 'function' && shouldUseCustomFilterOnly) {\n return true;\n }\n\n return !(\n newMatchingItems.length === 1 && item.text === dropdownSearchString\n );\n }),\n }));\n\n setMatchingListsItems(filteredMatchingListItems);\n\n if (filteredMatchingListItems.length !== 0 || hintText) {\n handleOpen();\n }\n }\n }, [\n shouldShowContentOnEmptyInput,\n activeList,\n shouldAddInputToList,\n hintText,\n dropdownSearchString,\n customFilter,\n shouldUseCustomFilterOnly,\n handleOpen,\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 [\n activeList,\n customFilter,\n handleOpen,\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 [onBlur],\n );\n\n const handleDropdownOutsideClick = useCallback(() => {\n tagInputRef.current?.blur();\n\n return hasFocusRef.current && isTouch;\n }, [isTouch]);\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') {\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 [],\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]);\n\n const shouldShowDropdown =\n shouldShowBody &&\n (matchingListsItems.length !== 0 || !!hintText) &&\n (value.trim() !== '' || shouldShowContentOnEmptyInput);\n\n return useMemo(\n () => (\n <StyledSearchBox ref={boxRef} key={`search-box-${uuid}`}>\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 shouldPreventEnter\n tags={tagInputSettings.tags}\n />\n ) : (\n <Input\n isInvalid={isInvalid}\n leftElement={leftElement}\n onBlur={handleBlur}\n onChange={handleChange}\n onFocus={handleFocus}\n onKeyDown={onKeyDown}\n placeholder={placeholder}\n ref={inputRef}\n rightElement={rightElement}\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 height,\n isInvalid,\n leftElement,\n maxHeight,\n onKeyDown,\n placeholder,\n rightElement,\n shouldHideFilterButtons,\n shouldShowDropdown,\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":[]}
@@ -8,6 +8,7 @@ const SearchBoxBody = /*#__PURE__*/forwardRef(({
8
8
  filterButtons,
9
9
  selectedGroups,
10
10
  height,
11
+ maxHeight = 300,
11
12
  children,
12
13
  shouldShow,
13
14
  onGroupSelect,
@@ -56,12 +57,13 @@ const SearchBoxBody = /*#__PURE__*/forwardRef(({
56
57
  }), /*#__PURE__*/React.createElement(StyledSearchBoxBodyHeadGroupName, null, currentGroupName.replace('_', ''))), /*#__PURE__*/React.createElement(StyledSearchBoxBodyContent, {
57
58
  $height: height,
58
59
  $headHeight: headHeight,
60
+ $maxHeight: maxHeight,
59
61
  key: "content",
60
62
  id: `searchBoxContent__${uuid}`,
61
63
  className: "chayns-scrollbar",
62
64
  tabIndex: 0,
63
65
  onScroll: handleScroll
64
- }, children)), [children, currentGroupName, filterButtons, handleScroll, hasScrolled, headHeight, height, onGroupSelect, ref, selectedGroups, shouldHideFilterButtons, shouldShow, uuid]);
66
+ }, children)), [children, currentGroupName, filterButtons, handleScroll, hasScrolled, headHeight, height, onGroupSelect, maxHeight, ref, selectedGroups, shouldHideFilterButtons, shouldShow, uuid]);
65
67
  });
66
68
  SearchBoxBody.displayName = 'SearchBoxBody';
67
69
  export default SearchBoxBody;
@@ -1 +1 @@
1
- {"version":3,"file":"SearchBoxBody.js","names":["React","forwardRef","useCallback","useEffect","useMemo","useRef","useState","useElementSize","useUuid","getCurrentGroupName","FilterButtons","StyledSearchBoxBody","StyledSearchBoxBodyContent","StyledSearchBoxBodyHead","StyledSearchBoxBodyHeadGroupName","SearchBoxBody","filterButtons","selectedGroups","height","children","shouldShow","onGroupSelect","shouldHideFilterButtons","ref","hasScrolled","setHasScrolled","currentGroupName","setCurrentGroupName","headRef","headSize","uuid","headHeight","element","document","getElementById","length","handlePreventDefault","event","preventDefault","stopPropagation","handleScroll","scrollTop","target","createElement","onClick","inert","undefined","$hasScrolled","$hasGroupName","items","size","onSelect","selectedItemIds","replace","$height","$headHeight","key","id","className","tabIndex","onScroll","displayName"],"sources":["../../../../../src/components/search-box/search-box-body/SearchBoxBody.tsx"],"sourcesContent":["import React, {\n forwardRef,\n MouseEvent,\n UIEvent,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n type ReactNode,\n} from 'react';\nimport { useElementSize } from '../../../hooks/element';\nimport { useUuid } from '../../../hooks/uuid';\nimport type { IFilterButtonItem } from '../../../types/filterButtons';\nimport { getCurrentGroupName } from '../../../utils/searchBox';\nimport FilterButtons from '../../filter-buttons/FilterButtons';\nimport {\n StyledSearchBoxBody,\n StyledSearchBoxBodyContent,\n StyledSearchBoxBodyHead,\n StyledSearchBoxBodyHeadGroupName,\n} from './SearchBoxBody.styles';\n\nexport type SearchBoxBodyProps = {\n children: ReactNode;\n filterButtons?: IFilterButtonItem[];\n selectedGroups?: string[];\n height: number;\n onGroupSelect?: (keys: string[]) => void;\n shouldHideFilterButtons?: boolean;\n shouldShow: boolean;\n};\n\nconst SearchBoxBody = forwardRef<HTMLDivElement, SearchBoxBodyProps>(\n (\n {\n filterButtons,\n selectedGroups,\n height,\n children,\n shouldShow,\n onGroupSelect,\n shouldHideFilterButtons,\n },\n ref,\n ) => {\n const [hasScrolled, setHasScrolled] = useState(false);\n const [currentGroupName, setCurrentGroupName] = useState('');\n\n const headRef = useRef<HTMLDivElement>(null);\n\n const headSize = useElementSize(headRef);\n\n const uuid = useUuid();\n\n const headHeight = useMemo(\n () => (headSize?.height ? headSize.height + 15 : 0),\n [headSize?.height],\n );\n\n useEffect(() => {\n const element = document.getElementById(`searchBoxContent__${uuid}`);\n\n if (\n element &&\n ((selectedGroups?.length === 1 && selectedGroups[0] === 'all') ||\n selectedGroups?.length !== 1)\n ) {\n setCurrentGroupName(getCurrentGroupName(element));\n } else {\n setCurrentGroupName('');\n }\n }, [uuid, children, selectedGroups]);\n\n const handlePreventDefault = (event: MouseEvent) => {\n event.preventDefault();\n event.stopPropagation();\n };\n\n const handleScroll = useCallback(\n (event: UIEvent) => {\n const { scrollTop } = event.target as HTMLDivElement;\n\n setHasScrolled(scrollTop > 1);\n\n if (\n (selectedGroups?.length === 1 && selectedGroups[0] === 'all') ||\n selectedGroups?.length !== 1\n ) {\n setCurrentGroupName(getCurrentGroupName(event.target as HTMLDivElement));\n }\n },\n [selectedGroups],\n );\n\n return useMemo(\n () => (\n <StyledSearchBoxBody\n onClick={handlePreventDefault}\n ref={ref}\n inert={!shouldShow ? 'true' : undefined}\n >\n {filterButtons && filterButtons?.length > 1 && (\n <StyledSearchBoxBodyHead\n ref={headRef}\n $hasScrolled={hasScrolled}\n $hasGroupName={!!currentGroupName}\n >\n {!shouldHideFilterButtons && (\n <FilterButtons\n items={filterButtons}\n size={0}\n onSelect={onGroupSelect}\n selectedItemIds={selectedGroups}\n />\n )}\n <StyledSearchBoxBodyHeadGroupName>\n {currentGroupName.replace('_', '')}\n </StyledSearchBoxBodyHeadGroupName>\n </StyledSearchBoxBodyHead>\n )}\n <StyledSearchBoxBodyContent\n $height={height}\n $headHeight={headHeight}\n key=\"content\"\n id={`searchBoxContent__${uuid}`}\n className=\"chayns-scrollbar\"\n tabIndex={0}\n onScroll={handleScroll}\n >\n {children}\n </StyledSearchBoxBodyContent>\n </StyledSearchBoxBody>\n ),\n [\n children,\n currentGroupName,\n filterButtons,\n handleScroll,\n hasScrolled,\n headHeight,\n height,\n onGroupSelect,\n ref,\n selectedGroups,\n shouldHideFilterButtons,\n shouldShow,\n uuid,\n ],\n );\n },\n);\n\nSearchBoxBody.displayName = 'SearchBoxBody';\n\nexport default SearchBoxBody;\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"SearchBoxBody.js","names":["React","forwardRef","useCallback","useEffect","useMemo","useRef","useState","useElementSize","useUuid","getCurrentGroupName","FilterButtons","StyledSearchBoxBody","StyledSearchBoxBodyContent","StyledSearchBoxBodyHead","StyledSearchBoxBodyHeadGroupName","SearchBoxBody","filterButtons","selectedGroups","height","maxHeight","children","shouldShow","onGroupSelect","shouldHideFilterButtons","ref","hasScrolled","setHasScrolled","currentGroupName","setCurrentGroupName","headRef","headSize","uuid","headHeight","element","document","getElementById","length","handlePreventDefault","event","preventDefault","stopPropagation","handleScroll","scrollTop","target","createElement","onClick","inert","undefined","$hasScrolled","$hasGroupName","items","size","onSelect","selectedItemIds","replace","$height","$headHeight","$maxHeight","key","id","className","tabIndex","onScroll","displayName"],"sources":["../../../../../src/components/search-box/search-box-body/SearchBoxBody.tsx"],"sourcesContent":["import React, {\n forwardRef,\n MouseEvent,\n UIEvent,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n type ReactNode,\n} from 'react';\nimport { useElementSize } from '../../../hooks/element';\nimport { useUuid } from '../../../hooks/uuid';\nimport type { IFilterButtonItem } from '../../../types/filterButtons';\nimport { getCurrentGroupName } from '../../../utils/searchBox';\nimport FilterButtons from '../../filter-buttons/FilterButtons';\nimport {\n StyledSearchBoxBody,\n StyledSearchBoxBodyContent,\n StyledSearchBoxBodyHead,\n StyledSearchBoxBodyHeadGroupName,\n} from './SearchBoxBody.styles';\n\nexport type SearchBoxBodyProps = {\n children: ReactNode;\n filterButtons?: IFilterButtonItem[];\n selectedGroups?: string[];\n height: number;\n maxHeight?: number;\n onGroupSelect?: (keys: string[]) => void;\n shouldHideFilterButtons?: boolean;\n shouldShow: boolean;\n};\n\nconst SearchBoxBody = forwardRef<HTMLDivElement, SearchBoxBodyProps>(\n (\n {\n filterButtons,\n selectedGroups,\n height,\n maxHeight = 300,\n children,\n shouldShow,\n onGroupSelect,\n shouldHideFilterButtons,\n },\n ref,\n ) => {\n const [hasScrolled, setHasScrolled] = useState(false);\n const [currentGroupName, setCurrentGroupName] = useState('');\n\n const headRef = useRef<HTMLDivElement>(null);\n\n const headSize = useElementSize(headRef);\n\n const uuid = useUuid();\n\n const headHeight = useMemo(\n () => (headSize?.height ? headSize.height + 15 : 0),\n [headSize?.height],\n );\n\n useEffect(() => {\n const element = document.getElementById(`searchBoxContent__${uuid}`);\n\n if (\n element &&\n ((selectedGroups?.length === 1 && selectedGroups[0] === 'all') ||\n selectedGroups?.length !== 1)\n ) {\n setCurrentGroupName(getCurrentGroupName(element));\n } else {\n setCurrentGroupName('');\n }\n }, [uuid, children, selectedGroups]);\n\n const handlePreventDefault = (event: MouseEvent) => {\n event.preventDefault();\n event.stopPropagation();\n };\n\n const handleScroll = useCallback(\n (event: UIEvent) => {\n const { scrollTop } = event.target as HTMLDivElement;\n\n setHasScrolled(scrollTop > 1);\n\n if (\n (selectedGroups?.length === 1 && selectedGroups[0] === 'all') ||\n selectedGroups?.length !== 1\n ) {\n setCurrentGroupName(getCurrentGroupName(event.target as HTMLDivElement));\n }\n },\n [selectedGroups],\n );\n\n return useMemo(\n () => (\n <StyledSearchBoxBody\n onClick={handlePreventDefault}\n ref={ref}\n inert={!shouldShow ? 'true' : undefined}\n >\n {filterButtons && filterButtons?.length > 1 && (\n <StyledSearchBoxBodyHead\n ref={headRef}\n $hasScrolled={hasScrolled}\n $hasGroupName={!!currentGroupName}\n >\n {!shouldHideFilterButtons && (\n <FilterButtons\n items={filterButtons}\n size={0}\n onSelect={onGroupSelect}\n selectedItemIds={selectedGroups}\n />\n )}\n <StyledSearchBoxBodyHeadGroupName>\n {currentGroupName.replace('_', '')}\n </StyledSearchBoxBodyHeadGroupName>\n </StyledSearchBoxBodyHead>\n )}\n <StyledSearchBoxBodyContent\n $height={height}\n $headHeight={headHeight}\n $maxHeight={maxHeight}\n key=\"content\"\n id={`searchBoxContent__${uuid}`}\n className=\"chayns-scrollbar\"\n tabIndex={0}\n onScroll={handleScroll}\n >\n {children}\n </StyledSearchBoxBodyContent>\n </StyledSearchBoxBody>\n ),\n [\n children,\n currentGroupName,\n filterButtons,\n handleScroll,\n hasScrolled,\n headHeight,\n height,\n onGroupSelect,\n maxHeight,\n ref,\n selectedGroups,\n shouldHideFilterButtons,\n shouldShow,\n uuid,\n ],\n );\n },\n);\n\nSearchBoxBody.displayName = 'SearchBoxBody';\n\nexport default SearchBoxBody;\n"],"mappings":"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","ignoreList":[]}
@@ -32,11 +32,13 @@ export const StyledSearchBoxBodyContent = styled.div`
32
32
  cursor: pointer;
33
33
  width: 100%;
34
34
  max-height: ${({
35
- $headHeight
36
- }) => 300 - $headHeight}px;
35
+ $headHeight,
36
+ $maxHeight
37
+ }) => $maxHeight - $headHeight}px;
37
38
  overflow-y: ${({
38
39
  $height,
39
- $headHeight
40
- }) => $height + $headHeight <= 300 ? 'hidden' : 'auto'};
40
+ $headHeight,
41
+ $maxHeight
42
+ }) => $height + $headHeight <= $maxHeight ? 'hidden' : 'auto'};
41
43
  `;
42
44
  //# sourceMappingURL=SearchBoxBody.styles.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"SearchBoxBody.styles.js","names":["styled","css","StyledSearchBoxBody","div","StyledSearchBoxBodyHead","$hasGroupName","$hasScrolled","StyledSearchBoxBodyHeadGroupName","theme","text","StyledSearchBoxBodyContent","$headHeight","$height"],"sources":["../../../../../src/components/search-box/search-box-body/SearchBoxBody.styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport type { WithTheme } from '../../color-scheme-provider/ColorSchemeProvider';\n\nexport const StyledSearchBoxBody = styled.div`\n display: flex;\n flex-direction: column;\n`;\n\nexport const StyledSearchBoxBodyHead = styled.div<StyledSearchBoxHeadProps>`\n padding: 10px 10px 5px;\n display: flex;\n flex-direction: column;\n\n ${({ $hasGroupName }) =>\n $hasGroupName &&\n css`\n gap: 15px;\n `}\n\n ${({ $hasScrolled }) =>\n $hasScrolled &&\n css`\n box-shadow: 0 1px 4px #0000001a;\n `}\n`;\n\ntype StyledSearchBoxHeadProps = WithTheme<{ $hasScrolled: boolean; $hasGroupName: boolean }>;\n\ntype StyledSearchBoxBodyHeadGroupNameNameProps = WithTheme<unknown>;\n\nexport const StyledSearchBoxBodyHeadGroupName = styled.div<StyledSearchBoxBodyHeadGroupNameNameProps>`\n color: ${({ theme }: StyledSearchBoxBodyHeadGroupNameNameProps) => theme.text};\n font-weight: bold;\n`;\n\ntype StyledSearchBoxBodyContentProps = WithTheme<{\n $height: number;\n $headHeight: number;\n}>;\n\nexport const StyledSearchBoxBodyContent = styled.div<StyledSearchBoxBodyContentProps>`\n display: flex;\n flex-direction: column;\n cursor: pointer;\n width: 100%;\n max-height: ${({ $headHeight }) => 300 - $headHeight}px;\n overflow-y: ${({ $height, $headHeight }) => ($height + $headHeight <= 300 ? 'hidden' : 'auto')};\n`;\n"],"mappings":"AAAA,OAAOA,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAG/C,OAAO,MAAMC,mBAAmB,GAAGF,MAAM,CAACG,GAAG;AAC7C;AACA;AACA,CAAC;AAED,OAAO,MAAMC,uBAAuB,GAAGJ,MAAM,CAACG,GAA6B;AAC3E;AACA;AACA;AACA;AACA,MAAM,CAAC;EAAEE;AAAc,CAAC,KAChBA,aAAa,IACbJ,GAAG;AACX;AACA,SAAS;AACT;AACA,MAAM,CAAC;EAAEK;AAAa,CAAC,KACfA,YAAY,IACZL,GAAG;AACX;AACA,SAAS;AACT,CAAC;AAMD,OAAO,MAAMM,gCAAgC,GAAGP,MAAM,CAACG,GAA8C;AACrG,aAAa,CAAC;EAAEK;AAAiD,CAAC,KAAKA,KAAK,CAACC,IAAI;AACjF;AACA,CAAC;AAOD,OAAO,MAAMC,0BAA0B,GAAGV,MAAM,CAACG,GAAoC;AACrF;AACA;AACA;AACA;AACA,kBAAkB,CAAC;EAAEQ;AAAY,CAAC,KAAK,GAAG,GAAGA,WAAW;AACxD,kBAAkB,CAAC;EAAEC,OAAO;EAAED;AAAY,CAAC,KAAMC,OAAO,GAAGD,WAAW,IAAI,GAAG,GAAG,QAAQ,GAAG,MAAO;AAClG,CAAC","ignoreList":[]}
1
+ {"version":3,"file":"SearchBoxBody.styles.js","names":["styled","css","StyledSearchBoxBody","div","StyledSearchBoxBodyHead","$hasGroupName","$hasScrolled","StyledSearchBoxBodyHeadGroupName","theme","text","StyledSearchBoxBodyContent","$headHeight","$maxHeight","$height"],"sources":["../../../../../src/components/search-box/search-box-body/SearchBoxBody.styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport type { WithTheme } from '../../color-scheme-provider/ColorSchemeProvider';\n\nexport const StyledSearchBoxBody = styled.div`\n display: flex;\n flex-direction: column;\n`;\n\nexport const StyledSearchBoxBodyHead = styled.div<StyledSearchBoxHeadProps>`\n padding: 10px 10px 5px;\n display: flex;\n flex-direction: column;\n\n ${({ $hasGroupName }) =>\n $hasGroupName &&\n css`\n gap: 15px;\n `}\n\n ${({ $hasScrolled }) =>\n $hasScrolled &&\n css`\n box-shadow: 0 1px 4px #0000001a;\n `}\n`;\n\ntype StyledSearchBoxHeadProps = WithTheme<{ $hasScrolled: boolean; $hasGroupName: boolean }>;\n\ntype StyledSearchBoxBodyHeadGroupNameNameProps = WithTheme<unknown>;\n\nexport const StyledSearchBoxBodyHeadGroupName = styled.div<StyledSearchBoxBodyHeadGroupNameNameProps>`\n color: ${({ theme }: StyledSearchBoxBodyHeadGroupNameNameProps) => theme.text};\n font-weight: bold;\n`;\n\ntype StyledSearchBoxBodyContentProps = WithTheme<{\n $height: number;\n $headHeight: number;\n $maxHeight: number;\n}>;\n\nexport const StyledSearchBoxBodyContent = styled.div<StyledSearchBoxBodyContentProps>`\n display: flex;\n flex-direction: column;\n cursor: pointer;\n width: 100%;\n max-height: ${({ $headHeight, $maxHeight }) => $maxHeight - $headHeight}px;\n overflow-y: ${({ $height, $headHeight, $maxHeight }) =>\n $height + $headHeight <= $maxHeight ? 'hidden' : 'auto'};\n`;\n"],"mappings":"AAAA,OAAOA,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAG/C,OAAO,MAAMC,mBAAmB,GAAGF,MAAM,CAACG,GAAG;AAC7C;AACA;AACA,CAAC;AAED,OAAO,MAAMC,uBAAuB,GAAGJ,MAAM,CAACG,GAA6B;AAC3E;AACA;AACA;AACA;AACA,MAAM,CAAC;EAAEE;AAAc,CAAC,KAChBA,aAAa,IACbJ,GAAG;AACX;AACA,SAAS;AACT;AACA,MAAM,CAAC;EAAEK;AAAa,CAAC,KACfA,YAAY,IACZL,GAAG;AACX;AACA,SAAS;AACT,CAAC;AAMD,OAAO,MAAMM,gCAAgC,GAAGP,MAAM,CAACG,GAA8C;AACrG,aAAa,CAAC;EAAEK;AAAiD,CAAC,KAAKA,KAAK,CAACC,IAAI;AACjF;AACA,CAAC;AAQD,OAAO,MAAMC,0BAA0B,GAAGV,MAAM,CAACG,GAAoC;AACrF;AACA;AACA;AACA;AACA,kBAAkB,CAAC;EAAEQ,WAAW;EAAEC;AAAW,CAAC,KAAKA,UAAU,GAAGD,WAAW;AAC3E,kBAAkB,CAAC;EAAEE,OAAO;EAAEF,WAAW;EAAEC;AAAW,CAAC,KAC/CC,OAAO,GAAGF,WAAW,IAAIC,UAAU,GAAG,QAAQ,GAAG,MAAM;AAC/D,CAAC","ignoreList":[]}
@@ -4,6 +4,7 @@ const SearchBoxItem = ({
4
4
  id,
5
5
  text,
6
6
  imageUrl,
7
+ shouldShowSmallItems,
7
8
  shouldShowRoundImage,
8
9
  onSelect,
9
10
  groupName,
@@ -30,10 +31,11 @@ const SearchBoxItem = ({
30
31
  src: imageUrl,
31
32
  $shouldShowRoundImage: shouldShowRoundImage
32
33
  }), /*#__PURE__*/React.createElement(StyledSearchBoxItemText, {
34
+ $shouldShowSmallItems: shouldShowSmallItems,
33
35
  dangerouslySetInnerHTML: {
34
36
  __html: text
35
37
  }
36
- })), [handleClick, idString, imageUrl, shouldShowRoundImage, text, tabIndex]);
38
+ })), [handleClick, idString, imageUrl, shouldShowRoundImage, shouldShowSmallItems, text, tabIndex]);
37
39
  };
38
40
  SearchBoxItem.displayName = 'SearchBoxItem';
39
41
  export default SearchBoxItem;
@@ -1 +1 @@
1
- {"version":3,"file":"SearchBoxItem.js","names":["React","useCallback","useMemo","StyledSearchBoxItem","StyledSearchBoxItemImage","StyledSearchBoxItemText","SearchBoxItem","id","text","imageUrl","shouldShowRoundImage","onSelect","groupName","tabIndex","handleClick","event","preventDefault","stopPropagation","idString","createElement","onClick","src","$shouldShowRoundImage","dangerouslySetInnerHTML","__html","displayName"],"sources":["../../../../../src/components/search-box/search-box-item/SearchBoxItem.tsx"],"sourcesContent":["import React, { FC, MouseEvent, useCallback, useMemo } from 'react';\nimport type { ISearchBoxItem, ISearchBoxItems } from '../../../types/searchBox';\nimport {\n StyledSearchBoxItem,\n StyledSearchBoxItemImage,\n StyledSearchBoxItemText,\n} from './SearchBoxItem.styles';\n\nexport type SearchBoxItemProps = {\n onSelect: (item: ISearchBoxItem, groupName?: ISearchBoxItems['groupName']) => void;\n id: ISearchBoxItem['id'];\n text: ISearchBoxItem['text'];\n imageUrl?: ISearchBoxItem['imageUrl'];\n shouldShowRoundImage?: boolean;\n groupName?: ISearchBoxItems['groupName'];\n tabIndex: number;\n};\n\nconst SearchBoxItem: FC<SearchBoxItemProps> = ({\n id,\n text,\n imageUrl,\n shouldShowRoundImage,\n onSelect,\n groupName,\n tabIndex,\n}) => {\n const handleClick = useCallback(\n (event: MouseEvent) => {\n event.preventDefault();\n event.stopPropagation();\n\n onSelect({ id: id === 'input-value' ? text : id, text, imageUrl }, groupName);\n },\n [onSelect, id, text, imageUrl, groupName],\n );\n\n let idString = `search-box-item__${id}`;\n\n if (groupName) {\n idString = `_${groupName}`;\n }\n\n return useMemo(\n () => (\n <StyledSearchBoxItem id={idString} onClick={handleClick} tabIndex={tabIndex}>\n {imageUrl && (\n <StyledSearchBoxItemImage\n src={imageUrl}\n $shouldShowRoundImage={shouldShowRoundImage}\n />\n )}\n <StyledSearchBoxItemText dangerouslySetInnerHTML={{ __html: text }} />\n </StyledSearchBoxItem>\n ),\n [handleClick, idString, imageUrl, shouldShowRoundImage, text, tabIndex],\n );\n};\n\nSearchBoxItem.displayName = 'SearchBoxItem';\n\nexport default SearchBoxItem;\n"],"mappings":"AAAA,OAAOA,KAAK,IAAoBC,WAAW,EAAEC,OAAO,QAAQ,OAAO;AAEnE,SACIC,mBAAmB,EACnBC,wBAAwB,EACxBC,uBAAuB,QACpB,wBAAwB;AAY/B,MAAMC,aAAqC,GAAGA,CAAC;EAC3CC,EAAE;EACFC,IAAI;EACJC,QAAQ;EACRC,oBAAoB;EACpBC,QAAQ;EACRC,SAAS;EACTC;AACJ,CAAC,KAAK;EACF,MAAMC,WAAW,GAAGb,WAAW,CAC1Bc,KAAiB,IAAK;IACnBA,KAAK,CAACC,cAAc,CAAC,CAAC;IACtBD,KAAK,CAACE,eAAe,CAAC,CAAC;IAEvBN,QAAQ,CAAC;MAAEJ,EAAE,EAAEA,EAAE,KAAK,aAAa,GAAGC,IAAI,GAAGD,EAAE;MAAEC,IAAI;MAAEC;IAAS,CAAC,EAAEG,SAAS,CAAC;EACjF,CAAC,EACD,CAACD,QAAQ,EAAEJ,EAAE,EAAEC,IAAI,EAAEC,QAAQ,EAAEG,SAAS,CAC5C,CAAC;EAED,IAAIM,QAAQ,GAAG,oBAAoBX,EAAE,EAAE;EAEvC,IAAIK,SAAS,EAAE;IACXM,QAAQ,GAAG,IAAIN,SAAS,EAAE;EAC9B;EAEA,OAAOV,OAAO,CACV,mBACIF,KAAA,CAAAmB,aAAA,CAAChB,mBAAmB;IAACI,EAAE,EAAEW,QAAS;IAACE,OAAO,EAAEN,WAAY;IAACD,QAAQ,EAAEA;EAAS,GACvEJ,QAAQ,iBACLT,KAAA,CAAAmB,aAAA,CAACf,wBAAwB;IACrBiB,GAAG,EAAEZ,QAAS;IACda,qBAAqB,EAAEZ;EAAqB,CAC/C,CACJ,eACDV,KAAA,CAAAmB,aAAA,CAACd,uBAAuB;IAACkB,uBAAuB,EAAE;MAAEC,MAAM,EAAEhB;IAAK;EAAE,CAAE,CACpD,CACxB,EACD,CAACM,WAAW,EAAEI,QAAQ,EAAET,QAAQ,EAAEC,oBAAoB,EAAEF,IAAI,EAAEK,QAAQ,CAC1E,CAAC;AACL,CAAC;AAEDP,aAAa,CAACmB,WAAW,GAAG,eAAe;AAE3C,eAAenB,aAAa","ignoreList":[]}
1
+ {"version":3,"file":"SearchBoxItem.js","names":["React","useCallback","useMemo","StyledSearchBoxItem","StyledSearchBoxItemImage","StyledSearchBoxItemText","SearchBoxItem","id","text","imageUrl","shouldShowSmallItems","shouldShowRoundImage","onSelect","groupName","tabIndex","handleClick","event","preventDefault","stopPropagation","idString","createElement","onClick","src","$shouldShowRoundImage","$shouldShowSmallItems","dangerouslySetInnerHTML","__html","displayName"],"sources":["../../../../../src/components/search-box/search-box-item/SearchBoxItem.tsx"],"sourcesContent":["import React, { FC, MouseEvent, useCallback, useMemo } from 'react';\nimport type { ISearchBoxItem, ISearchBoxItems } from '../../../types/searchBox';\nimport {\n StyledSearchBoxItem,\n StyledSearchBoxItemImage,\n StyledSearchBoxItemText,\n} from './SearchBoxItem.styles';\n\nexport type SearchBoxItemProps = {\n onSelect: (item: ISearchBoxItem, groupName?: ISearchBoxItems['groupName']) => void;\n id: ISearchBoxItem['id'];\n text: ISearchBoxItem['text'];\n imageUrl?: ISearchBoxItem['imageUrl'];\n shouldShowSmallItems?: boolean;\n shouldShowRoundImage?: boolean;\n groupName?: ISearchBoxItems['groupName'];\n tabIndex: number;\n};\n\nconst SearchBoxItem: FC<SearchBoxItemProps> = ({\n id,\n text,\n imageUrl,\n shouldShowSmallItems,\n shouldShowRoundImage,\n onSelect,\n groupName,\n tabIndex,\n}) => {\n const handleClick = useCallback(\n (event: MouseEvent) => {\n event.preventDefault();\n event.stopPropagation();\n\n onSelect({ id: id === 'input-value' ? text : id, text, imageUrl }, groupName);\n },\n [onSelect, id, text, imageUrl, groupName],\n );\n\n let idString = `search-box-item__${id}`;\n\n if (groupName) {\n idString = `_${groupName}`;\n }\n\n return useMemo(\n () => (\n <StyledSearchBoxItem id={idString} onClick={handleClick} tabIndex={tabIndex}>\n {imageUrl && (\n <StyledSearchBoxItemImage\n src={imageUrl}\n $shouldShowRoundImage={shouldShowRoundImage}\n />\n )}\n <StyledSearchBoxItemText\n $shouldShowSmallItems={shouldShowSmallItems}\n dangerouslySetInnerHTML={{ __html: text }}\n />\n </StyledSearchBoxItem>\n ),\n [\n handleClick,\n idString,\n imageUrl,\n shouldShowRoundImage,\n shouldShowSmallItems,\n text,\n tabIndex,\n ],\n );\n};\n\nSearchBoxItem.displayName = 'SearchBoxItem';\n\nexport default SearchBoxItem;\n"],"mappings":"AAAA,OAAOA,KAAK,IAAoBC,WAAW,EAAEC,OAAO,QAAQ,OAAO;AAEnE,SACIC,mBAAmB,EACnBC,wBAAwB,EACxBC,uBAAuB,QACpB,wBAAwB;AAa/B,MAAMC,aAAqC,GAAGA,CAAC;EAC3CC,EAAE;EACFC,IAAI;EACJC,QAAQ;EACRC,oBAAoB;EACpBC,oBAAoB;EACpBC,QAAQ;EACRC,SAAS;EACTC;AACJ,CAAC,KAAK;EACF,MAAMC,WAAW,GAAGd,WAAW,CAC1Be,KAAiB,IAAK;IACnBA,KAAK,CAACC,cAAc,CAAC,CAAC;IACtBD,KAAK,CAACE,eAAe,CAAC,CAAC;IAEvBN,QAAQ,CAAC;MAAEL,EAAE,EAAEA,EAAE,KAAK,aAAa,GAAGC,IAAI,GAAGD,EAAE;MAAEC,IAAI;MAAEC;IAAS,CAAC,EAAEI,SAAS,CAAC;EACjF,CAAC,EACD,CAACD,QAAQ,EAAEL,EAAE,EAAEC,IAAI,EAAEC,QAAQ,EAAEI,SAAS,CAC5C,CAAC;EAED,IAAIM,QAAQ,GAAG,oBAAoBZ,EAAE,EAAE;EAEvC,IAAIM,SAAS,EAAE;IACXM,QAAQ,GAAG,IAAIN,SAAS,EAAE;EAC9B;EAEA,OAAOX,OAAO,CACV,mBACIF,KAAA,CAAAoB,aAAA,CAACjB,mBAAmB;IAACI,EAAE,EAAEY,QAAS;IAACE,OAAO,EAAEN,WAAY;IAACD,QAAQ,EAAEA;EAAS,GACvEL,QAAQ,iBACLT,KAAA,CAAAoB,aAAA,CAAChB,wBAAwB;IACrBkB,GAAG,EAAEb,QAAS;IACdc,qBAAqB,EAAEZ;EAAqB,CAC/C,CACJ,eACDX,KAAA,CAAAoB,aAAA,CAACf,uBAAuB;IACpBmB,qBAAqB,EAAEd,oBAAqB;IAC5Ce,uBAAuB,EAAE;MAAEC,MAAM,EAAElB;IAAK;EAAE,CAC7C,CACgB,CACxB,EACD,CACIO,WAAW,EACXI,QAAQ,EACRV,QAAQ,EACRE,oBAAoB,EACpBD,oBAAoB,EACpBF,IAAI,EACJM,QAAQ,CAEhB,CAAC;AACL,CAAC;AAEDR,aAAa,CAACqB,WAAW,GAAG,eAAe;AAE3C,eAAerB,aAAa","ignoreList":[]}
@@ -35,7 +35,12 @@ export const StyledSearchBoxItemText = styled.p`
35
35
  color: ${({
36
36
  theme
37
37
  }) => theme.text};
38
- margin: 5px 0 !important;
38
+ font-size: ${({
39
+ $shouldShowSmallItems
40
+ }) => $shouldShowSmallItems ? '14px' : undefined};
41
+ margin: ${({
42
+ $shouldShowSmallItems
43
+ }) => $shouldShowSmallItems ? '0 !important' : '5px 0 !important'};
39
44
 
40
45
  b {
41
46
  color: ${({
@@ -1 +1 @@
1
- {"version":3,"file":"SearchBoxItem.styles.js","names":["styled","css","StyledSearchBoxItem","div","theme","StyledSearchBoxItemImage","img","$shouldShowRoundImage","StyledSearchBoxItemText","p","text","headline"],"sources":["../../../../../src/components/search-box/search-box-item/SearchBoxItem.styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport type { WithTheme } from '../../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledSearchBoxItemProps = WithTheme<unknown>;\nexport const StyledSearchBoxItem = styled.div<StyledSearchBoxItemProps>`\n display: flex;\n align-items: center;\n gap: 6px;\n padding: 4px 10px;\n\n &:hover {\n background: ${({ theme }: StyledSearchBoxItemProps) => theme['secondary-102']};\n }\n\n &[tabindex='0'] {\n background: ${({ theme }: StyledSearchBoxItemProps) => theme['secondary-102']};\n }\n`;\n\ntype StyledSearchBoxItemImageProps = WithTheme<{ $shouldShowRoundImage?: boolean }>;\n\nexport const StyledSearchBoxItemImage = styled.img<StyledSearchBoxItemImageProps>`\n box-shadow: 0 0 0 1px\n rgba(${({ theme }: StyledSearchBoxItemImageProps) => theme['009-rgb']}, 0.15);\n height: 22px;\n width: 22px;\n\n ${({ $shouldShowRoundImage }) =>\n $shouldShowRoundImage &&\n css`\n border-radius: 50%;\n `}\n`;\n\ntype StyledSearchBoxItemTextProps = WithTheme<unknown>;\n\nexport const StyledSearchBoxItemText = styled.p<StyledSearchBoxItemTextProps>`\n color: ${({ theme }: StyledSearchBoxItemTextProps) => theme.text};\n margin: 5px 0 !important;\n\n b {\n color: ${({ theme }: StyledSearchBoxItemTextProps) => theme.headline};\n }\n`;\n"],"mappings":"AAAA,OAAOA,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAI/C,OAAO,MAAMC,mBAAmB,GAAGF,MAAM,CAACG,GAA6B;AACvE;AACA;AACA;AACA;AACA;AACA;AACA,sBAAsB,CAAC;EAAEC;AAAgC,CAAC,KAAKA,KAAK,CAAC,eAAe,CAAC;AACrF;AACA;AACA;AACA,sBAAsB,CAAC;EAAEA;AAAgC,CAAC,KAAKA,KAAK,CAAC,eAAe,CAAC;AACrF;AACA,CAAC;AAID,OAAO,MAAMC,wBAAwB,GAAGL,MAAM,CAACM,GAAkC;AACjF;AACA,eAAe,CAAC;EAAEF;AAAqC,CAAC,KAAKA,KAAK,CAAC,SAAS,CAAC;AAC7E;AACA;AACA;AACA,MAAM,CAAC;EAAEG;AAAsB,CAAC,KACxBA,qBAAqB,IACrBN,GAAG;AACX;AACA,SAAS;AACT,CAAC;AAID,OAAO,MAAMO,uBAAuB,GAAGR,MAAM,CAACS,CAA+B;AAC7E,aAAa,CAAC;EAAEL;AAAoC,CAAC,KAAKA,KAAK,CAACM,IAAI;AACpE;AACA;AACA;AACA,iBAAiB,CAAC;EAAEN;AAAoC,CAAC,KAAKA,KAAK,CAACO,QAAQ;AAC5E;AACA,CAAC","ignoreList":[]}
1
+ {"version":3,"file":"SearchBoxItem.styles.js","names":["styled","css","StyledSearchBoxItem","div","theme","StyledSearchBoxItemImage","img","$shouldShowRoundImage","StyledSearchBoxItemText","p","text","$shouldShowSmallItems","undefined","headline"],"sources":["../../../../../src/components/search-box/search-box-item/SearchBoxItem.styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport type { WithTheme } from '../../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledSearchBoxItemProps = WithTheme<unknown>;\nexport const StyledSearchBoxItem = styled.div<StyledSearchBoxItemProps>`\n display: flex;\n align-items: center;\n gap: 6px;\n padding: 4px 10px;\n\n &:hover {\n background: ${({ theme }: StyledSearchBoxItemProps) => theme['secondary-102']};\n }\n\n &[tabindex='0'] {\n background: ${({ theme }: StyledSearchBoxItemProps) => theme['secondary-102']};\n }\n`;\n\ntype StyledSearchBoxItemImageProps = WithTheme<{ $shouldShowRoundImage?: boolean }>;\n\nexport const StyledSearchBoxItemImage = styled.img<StyledSearchBoxItemImageProps>`\n box-shadow: 0 0 0 1px\n rgba(${({ theme }: StyledSearchBoxItemImageProps) => theme['009-rgb']}, 0.15);\n height: 22px;\n width: 22px;\n\n ${({ $shouldShowRoundImage }) =>\n $shouldShowRoundImage &&\n css`\n border-radius: 50%;\n `}\n`;\n\ntype StyledSearchBoxItemTextProps = WithTheme<{ $shouldShowSmallItems?: boolean }>;\n\nexport const StyledSearchBoxItemText = styled.p<StyledSearchBoxItemTextProps>`\n color: ${({ theme }: StyledSearchBoxItemTextProps) => theme.text};\n font-size: ${({ $shouldShowSmallItems }) => ($shouldShowSmallItems ? '14px' : undefined)};\n margin: ${({ $shouldShowSmallItems }) =>\n $shouldShowSmallItems ? '0 !important' : '5px 0 !important'};\n\n b {\n color: ${({ theme }: StyledSearchBoxItemTextProps) => theme.headline};\n }\n`;\n"],"mappings":"AAAA,OAAOA,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAI/C,OAAO,MAAMC,mBAAmB,GAAGF,MAAM,CAACG,GAA6B;AACvE;AACA;AACA;AACA;AACA;AACA;AACA,sBAAsB,CAAC;EAAEC;AAAgC,CAAC,KAAKA,KAAK,CAAC,eAAe,CAAC;AACrF;AACA;AACA;AACA,sBAAsB,CAAC;EAAEA;AAAgC,CAAC,KAAKA,KAAK,CAAC,eAAe,CAAC;AACrF;AACA,CAAC;AAID,OAAO,MAAMC,wBAAwB,GAAGL,MAAM,CAACM,GAAkC;AACjF;AACA,eAAe,CAAC;EAAEF;AAAqC,CAAC,KAAKA,KAAK,CAAC,SAAS,CAAC;AAC7E;AACA;AACA;AACA,MAAM,CAAC;EAAEG;AAAsB,CAAC,KACxBA,qBAAqB,IACrBN,GAAG;AACX;AACA,SAAS;AACT,CAAC;AAID,OAAO,MAAMO,uBAAuB,GAAGR,MAAM,CAACS,CAA+B;AAC7E,aAAa,CAAC;EAAEL;AAAoC,CAAC,KAAKA,KAAK,CAACM,IAAI;AACpE,iBAAiB,CAAC;EAAEC;AAAsB,CAAC,KAAMA,qBAAqB,GAAG,MAAM,GAAGC,SAAU;AAC5F,cAAc,CAAC;EAAED;AAAsB,CAAC,KAChCA,qBAAqB,GAAG,cAAc,GAAG,kBAAkB;AACnE;AACA;AACA,iBAAiB,CAAC;EAAEP;AAAoC,CAAC,KAAKA,KAAK,CAACS,QAAQ;AAC5E;AACA,CAAC","ignoreList":[]}
@@ -37,6 +37,23 @@ export const getCurrentGroupName = element => {
37
37
  });
38
38
  return currentGroupName;
39
39
  };
40
+ export const sortSearchBoxItems = ({
41
+ searchString,
42
+ items
43
+ }) => {
44
+ const lowercaseSearchString = searchString.toLowerCase();
45
+ return [...items].sort((a, b) => {
46
+ const aStartsWithSearchString = a.text.toLowerCase().startsWith(lowercaseSearchString);
47
+ const bStartsWithSearchString = b.text.toLowerCase().startsWith(lowercaseSearchString);
48
+ if (aStartsWithSearchString && !bStartsWithSearchString) {
49
+ return -1;
50
+ }
51
+ if (!aStartsWithSearchString && bStartsWithSearchString) {
52
+ return 1;
53
+ }
54
+ return a.text.localeCompare(b.text);
55
+ });
56
+ };
40
57
  export const searchList = ({
41
58
  searchString,
42
59
  items
@@ -58,17 +75,9 @@ export const searchList = ({
58
75
  }
59
76
  }
60
77
  });
61
- matchingItems.sort((a, b) => {
62
- const aStartsWithSearchString = a.text.toLowerCase().startsWith(lowercaseSearchString);
63
- const bStartsWithSearchString = b.text.toLowerCase().startsWith(lowercaseSearchString);
64
- if (aStartsWithSearchString && !bStartsWithSearchString) {
65
- return -1;
66
- }
67
- if (!aStartsWithSearchString && bStartsWithSearchString) {
68
- return 1;
69
- }
70
- return a.text.localeCompare(b.text);
78
+ return sortSearchBoxItems({
79
+ items: matchingItems,
80
+ searchString
71
81
  });
72
- return matchingItems;
73
82
  };
74
83
  //# sourceMappingURL=searchBox.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"searchBox.js","names":["surroundWithBTag","text","startIndex","length","before","substring","highlighted","after","getCurrentGroupName","element","hasChildrenFound","currentGroupName","top","parentTop","getBoundingClientRect","children","Array","from","forEach","child","y","childrenY","height","childrenHeight","id","sum","currentGroup","startsWith","nummer","split","pop","searchList","searchString","items","matchingItems","lowercaseSearchString","toLowerCase","item","lowercaseText","includes","push","indexOf","highlightedText","sort","a","b","aStartsWithSearchString","bStartsWithSearchString","localeCompare"],"sources":["../../../src/utils/searchBox.ts"],"sourcesContent":["import type { ISearchBoxItem } from '../types/searchBox';\n\nconst surroundWithBTag = (text: string, startIndex: number, length: number) => {\n const before = text.substring(0, startIndex);\n const highlighted = text.substring(startIndex, startIndex + length);\n const after = text.substring(startIndex + length);\n\n return `${before}<b>${highlighted}</b>${after}`;\n};\n\nexport const getCurrentGroupName = (element: HTMLElement) => {\n let hasChildrenFound = false;\n let currentGroupName = '';\n\n const { top: parentTop } = element.getBoundingClientRect();\n const { children } = element;\n\n Array.from(children).forEach((child) => {\n if (hasChildrenFound) {\n return;\n }\n\n const { y: childrenY, height: childrenHeight } = child.getBoundingClientRect();\n const { id } = child;\n\n const sum = childrenY + childrenHeight - parentTop;\n\n if (sum >= 0) {\n hasChildrenFound = true;\n let currentGroup = id;\n\n if (id.startsWith('search-box-item__')) {\n const nummer = id.split('__')[1];\n currentGroup = nummer?.split('_').pop() ?? '';\n }\n\n currentGroupName = currentGroup;\n }\n });\n\n return currentGroupName;\n};\n\ninterface SearchListOptions {\n items: ISearchBoxItem[];\n searchString: string;\n}\n\nexport const searchList = ({ searchString, items }: SearchListOptions) => {\n const matchingItems: ISearchBoxItem[] = [];\n\n const lowercaseSearchString = searchString.toLowerCase();\n\n items.forEach((item) => {\n const lowercaseText = item.text.toLowerCase();\n\n if (lowercaseText.includes(lowercaseSearchString)) {\n if (searchString === '') {\n matchingItems.push(item);\n } else {\n const startIndex = lowercaseText.indexOf(lowercaseSearchString);\n const highlightedText = surroundWithBTag(\n item.text,\n startIndex,\n searchString.length,\n );\n matchingItems.push({ ...item, text: highlightedText });\n }\n }\n });\n\n matchingItems.sort((a, b) => {\n const aStartsWithSearchString = a.text.toLowerCase().startsWith(lowercaseSearchString);\n const bStartsWithSearchString = b.text.toLowerCase().startsWith(lowercaseSearchString);\n\n if (aStartsWithSearchString && !bStartsWithSearchString) {\n return -1;\n }\n if (!aStartsWithSearchString && bStartsWithSearchString) {\n return 1;\n }\n return a.text.localeCompare(b.text);\n });\n\n return matchingItems;\n};\n"],"mappings":"AAEA,MAAMA,gBAAgB,GAAGA,CAACC,IAAY,EAAEC,UAAkB,EAAEC,MAAc,KAAK;EAC3E,MAAMC,MAAM,GAAGH,IAAI,CAACI,SAAS,CAAC,CAAC,EAAEH,UAAU,CAAC;EAC5C,MAAMI,WAAW,GAAGL,IAAI,CAACI,SAAS,CAACH,UAAU,EAAEA,UAAU,GAAGC,MAAM,CAAC;EACnE,MAAMI,KAAK,GAAGN,IAAI,CAACI,SAAS,CAACH,UAAU,GAAGC,MAAM,CAAC;EAEjD,OAAO,GAAGC,MAAM,MAAME,WAAW,OAAOC,KAAK,EAAE;AACnD,CAAC;AAED,OAAO,MAAMC,mBAAmB,GAAIC,OAAoB,IAAK;EACzD,IAAIC,gBAAgB,GAAG,KAAK;EAC5B,IAAIC,gBAAgB,GAAG,EAAE;EAEzB,MAAM;IAAEC,GAAG,EAAEC;EAAU,CAAC,GAAGJ,OAAO,CAACK,qBAAqB,CAAC,CAAC;EAC1D,MAAM;IAAEC;EAAS,CAAC,GAAGN,OAAO;EAE5BO,KAAK,CAACC,IAAI,CAACF,QAAQ,CAAC,CAACG,OAAO,CAAEC,KAAK,IAAK;IACpC,IAAIT,gBAAgB,EAAE;MAClB;IACJ;IAEA,MAAM;MAAEU,CAAC,EAAEC,SAAS;MAAEC,MAAM,EAAEC;IAAe,CAAC,GAAGJ,KAAK,CAACL,qBAAqB,CAAC,CAAC;IAC9E,MAAM;MAAEU;IAAG,CAAC,GAAGL,KAAK;IAEpB,MAAMM,GAAG,GAAGJ,SAAS,GAAGE,cAAc,GAAGV,SAAS;IAElD,IAAIY,GAAG,IAAI,CAAC,EAAE;MACVf,gBAAgB,GAAG,IAAI;MACvB,IAAIgB,YAAY,GAAGF,EAAE;MAErB,IAAIA,EAAE,CAACG,UAAU,CAAC,mBAAmB,CAAC,EAAE;QACpC,MAAMC,MAAM,GAAGJ,EAAE,CAACK,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;QAChCH,YAAY,GAAGE,MAAM,EAAEC,KAAK,CAAC,GAAG,CAAC,CAACC,GAAG,CAAC,CAAC,IAAI,EAAE;MACjD;MAEAnB,gBAAgB,GAAGe,YAAY;IACnC;EACJ,CAAC,CAAC;EAEF,OAAOf,gBAAgB;AAC3B,CAAC;AAOD,OAAO,MAAMoB,UAAU,GAAGA,CAAC;EAAEC,YAAY;EAAEC;AAAyB,CAAC,KAAK;EACtE,MAAMC,aAA+B,GAAG,EAAE;EAE1C,MAAMC,qBAAqB,GAAGH,YAAY,CAACI,WAAW,CAAC,CAAC;EAExDH,KAAK,CAACf,OAAO,CAAEmB,IAAI,IAAK;IACpB,MAAMC,aAAa,GAAGD,IAAI,CAACpC,IAAI,CAACmC,WAAW,CAAC,CAAC;IAE7C,IAAIE,aAAa,CAACC,QAAQ,CAACJ,qBAAqB,CAAC,EAAE;MAC/C,IAAIH,YAAY,KAAK,EAAE,EAAE;QACrBE,aAAa,CAACM,IAAI,CAACH,IAAI,CAAC;MAC5B,CAAC,MAAM;QACH,MAAMnC,UAAU,GAAGoC,aAAa,CAACG,OAAO,CAACN,qBAAqB,CAAC;QAC/D,MAAMO,eAAe,GAAG1C,gBAAgB,CACpCqC,IAAI,CAACpC,IAAI,EACTC,UAAU,EACV8B,YAAY,CAAC7B,MACjB,CAAC;QACD+B,aAAa,CAACM,IAAI,CAAC;UAAE,GAAGH,IAAI;UAAEpC,IAAI,EAAEyC;QAAgB,CAAC,CAAC;MAC1D;IACJ;EACJ,CAAC,CAAC;EAEFR,aAAa,CAACS,IAAI,CAAC,CAACC,CAAC,EAAEC,CAAC,KAAK;IACzB,MAAMC,uBAAuB,GAAGF,CAAC,CAAC3C,IAAI,CAACmC,WAAW,CAAC,CAAC,CAACT,UAAU,CAACQ,qBAAqB,CAAC;IACtF,MAAMY,uBAAuB,GAAGF,CAAC,CAAC5C,IAAI,CAACmC,WAAW,CAAC,CAAC,CAACT,UAAU,CAACQ,qBAAqB,CAAC;IAEtF,IAAIW,uBAAuB,IAAI,CAACC,uBAAuB,EAAE;MACrD,OAAO,CAAC,CAAC;IACb;IACA,IAAI,CAACD,uBAAuB,IAAIC,uBAAuB,EAAE;MACrD,OAAO,CAAC;IACZ;IACA,OAAOH,CAAC,CAAC3C,IAAI,CAAC+C,aAAa,CAACH,CAAC,CAAC5C,IAAI,CAAC;EACvC,CAAC,CAAC;EAEF,OAAOiC,aAAa;AACxB,CAAC","ignoreList":[]}
1
+ {"version":3,"file":"searchBox.js","names":["surroundWithBTag","text","startIndex","length","before","substring","highlighted","after","getCurrentGroupName","element","hasChildrenFound","currentGroupName","top","parentTop","getBoundingClientRect","children","Array","from","forEach","child","y","childrenY","height","childrenHeight","id","sum","currentGroup","startsWith","nummer","split","pop","sortSearchBoxItems","searchString","items","lowercaseSearchString","toLowerCase","sort","a","b","aStartsWithSearchString","bStartsWithSearchString","localeCompare","searchList","matchingItems","item","lowercaseText","includes","push","indexOf","highlightedText"],"sources":["../../../src/utils/searchBox.ts"],"sourcesContent":["import type { ISearchBoxItem } from '../types/searchBox';\n\nconst surroundWithBTag = (text: string, startIndex: number, length: number) => {\n const before = text.substring(0, startIndex);\n const highlighted = text.substring(startIndex, startIndex + length);\n const after = text.substring(startIndex + length);\n\n return `${before}<b>${highlighted}</b>${after}`;\n};\n\nexport const getCurrentGroupName = (element: HTMLElement) => {\n let hasChildrenFound = false;\n let currentGroupName = '';\n\n const { top: parentTop } = element.getBoundingClientRect();\n const { children } = element;\n\n Array.from(children).forEach((child) => {\n if (hasChildrenFound) {\n return;\n }\n\n const { y: childrenY, height: childrenHeight } = child.getBoundingClientRect();\n const { id } = child;\n\n const sum = childrenY + childrenHeight - parentTop;\n\n if (sum >= 0) {\n hasChildrenFound = true;\n let currentGroup = id;\n\n if (id.startsWith('search-box-item__')) {\n const nummer = id.split('__')[1];\n currentGroup = nummer?.split('_').pop() ?? '';\n }\n\n currentGroupName = currentGroup;\n }\n });\n\n return currentGroupName;\n};\n\ninterface SearchListOptions {\n items: ISearchBoxItem[];\n searchString: string;\n}\n\nexport const sortSearchBoxItems = ({ searchString, items }: SearchListOptions) => {\n const lowercaseSearchString = searchString.toLowerCase();\n\n return [...items].sort((a, b) => {\n const aStartsWithSearchString = a.text.toLowerCase().startsWith(lowercaseSearchString);\n const bStartsWithSearchString = b.text.toLowerCase().startsWith(lowercaseSearchString);\n\n if (aStartsWithSearchString && !bStartsWithSearchString) {\n return -1;\n }\n if (!aStartsWithSearchString && bStartsWithSearchString) {\n return 1;\n }\n return a.text.localeCompare(b.text);\n });\n};\n\nexport const searchList = ({ searchString, items }: SearchListOptions) => {\n const matchingItems: ISearchBoxItem[] = [];\n\n const lowercaseSearchString = searchString.toLowerCase();\n\n items.forEach((item) => {\n const lowercaseText = item.text.toLowerCase();\n\n if (lowercaseText.includes(lowercaseSearchString)) {\n if (searchString === '') {\n matchingItems.push(item);\n } else {\n const startIndex = lowercaseText.indexOf(lowercaseSearchString);\n const highlightedText = surroundWithBTag(\n item.text,\n startIndex,\n searchString.length,\n );\n matchingItems.push({ ...item, text: highlightedText });\n }\n }\n });\n\n return sortSearchBoxItems({ items: matchingItems, searchString });\n};\n"],"mappings":"AAEA,MAAMA,gBAAgB,GAAGA,CAACC,IAAY,EAAEC,UAAkB,EAAEC,MAAc,KAAK;EAC3E,MAAMC,MAAM,GAAGH,IAAI,CAACI,SAAS,CAAC,CAAC,EAAEH,UAAU,CAAC;EAC5C,MAAMI,WAAW,GAAGL,IAAI,CAACI,SAAS,CAACH,UAAU,EAAEA,UAAU,GAAGC,MAAM,CAAC;EACnE,MAAMI,KAAK,GAAGN,IAAI,CAACI,SAAS,CAACH,UAAU,GAAGC,MAAM,CAAC;EAEjD,OAAO,GAAGC,MAAM,MAAME,WAAW,OAAOC,KAAK,EAAE;AACnD,CAAC;AAED,OAAO,MAAMC,mBAAmB,GAAIC,OAAoB,IAAK;EACzD,IAAIC,gBAAgB,GAAG,KAAK;EAC5B,IAAIC,gBAAgB,GAAG,EAAE;EAEzB,MAAM;IAAEC,GAAG,EAAEC;EAAU,CAAC,GAAGJ,OAAO,CAACK,qBAAqB,CAAC,CAAC;EAC1D,MAAM;IAAEC;EAAS,CAAC,GAAGN,OAAO;EAE5BO,KAAK,CAACC,IAAI,CAACF,QAAQ,CAAC,CAACG,OAAO,CAAEC,KAAK,IAAK;IACpC,IAAIT,gBAAgB,EAAE;MAClB;IACJ;IAEA,MAAM;MAAEU,CAAC,EAAEC,SAAS;MAAEC,MAAM,EAAEC;IAAe,CAAC,GAAGJ,KAAK,CAACL,qBAAqB,CAAC,CAAC;IAC9E,MAAM;MAAEU;IAAG,CAAC,GAAGL,KAAK;IAEpB,MAAMM,GAAG,GAAGJ,SAAS,GAAGE,cAAc,GAAGV,SAAS;IAElD,IAAIY,GAAG,IAAI,CAAC,EAAE;MACVf,gBAAgB,GAAG,IAAI;MACvB,IAAIgB,YAAY,GAAGF,EAAE;MAErB,IAAIA,EAAE,CAACG,UAAU,CAAC,mBAAmB,CAAC,EAAE;QACpC,MAAMC,MAAM,GAAGJ,EAAE,CAACK,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;QAChCH,YAAY,GAAGE,MAAM,EAAEC,KAAK,CAAC,GAAG,CAAC,CAACC,GAAG,CAAC,CAAC,IAAI,EAAE;MACjD;MAEAnB,gBAAgB,GAAGe,YAAY;IACnC;EACJ,CAAC,CAAC;EAEF,OAAOf,gBAAgB;AAC3B,CAAC;AAOD,OAAO,MAAMoB,kBAAkB,GAAGA,CAAC;EAAEC,YAAY;EAAEC;AAAyB,CAAC,KAAK;EAC9E,MAAMC,qBAAqB,GAAGF,YAAY,CAACG,WAAW,CAAC,CAAC;EAExD,OAAO,CAAC,GAAGF,KAAK,CAAC,CAACG,IAAI,CAAC,CAACC,CAAC,EAAEC,CAAC,KAAK;IAC7B,MAAMC,uBAAuB,GAAGF,CAAC,CAACpC,IAAI,CAACkC,WAAW,CAAC,CAAC,CAACR,UAAU,CAACO,qBAAqB,CAAC;IACtF,MAAMM,uBAAuB,GAAGF,CAAC,CAACrC,IAAI,CAACkC,WAAW,CAAC,CAAC,CAACR,UAAU,CAACO,qBAAqB,CAAC;IAEtF,IAAIK,uBAAuB,IAAI,CAACC,uBAAuB,EAAE;MACrD,OAAO,CAAC,CAAC;IACb;IACA,IAAI,CAACD,uBAAuB,IAAIC,uBAAuB,EAAE;MACrD,OAAO,CAAC;IACZ;IACA,OAAOH,CAAC,CAACpC,IAAI,CAACwC,aAAa,CAACH,CAAC,CAACrC,IAAI,CAAC;EACvC,CAAC,CAAC;AACN,CAAC;AAED,OAAO,MAAMyC,UAAU,GAAGA,CAAC;EAAEV,YAAY;EAAEC;AAAyB,CAAC,KAAK;EACtE,MAAMU,aAA+B,GAAG,EAAE;EAE1C,MAAMT,qBAAqB,GAAGF,YAAY,CAACG,WAAW,CAAC,CAAC;EAExDF,KAAK,CAACf,OAAO,CAAE0B,IAAI,IAAK;IACpB,MAAMC,aAAa,GAAGD,IAAI,CAAC3C,IAAI,CAACkC,WAAW,CAAC,CAAC;IAE7C,IAAIU,aAAa,CAACC,QAAQ,CAACZ,qBAAqB,CAAC,EAAE;MAC/C,IAAIF,YAAY,KAAK,EAAE,EAAE;QACrBW,aAAa,CAACI,IAAI,CAACH,IAAI,CAAC;MAC5B,CAAC,MAAM;QACH,MAAM1C,UAAU,GAAG2C,aAAa,CAACG,OAAO,CAACd,qBAAqB,CAAC;QAC/D,MAAMe,eAAe,GAAGjD,gBAAgB,CACpC4C,IAAI,CAAC3C,IAAI,EACTC,UAAU,EACV8B,YAAY,CAAC7B,MACjB,CAAC;QACDwC,aAAa,CAACI,IAAI,CAAC;UAAE,GAAGH,IAAI;UAAE3C,IAAI,EAAEgD;QAAgB,CAAC,CAAC;MAC1D;IACJ;EACJ,CAAC,CAAC;EAEF,OAAOlB,kBAAkB,CAAC;IAAEE,KAAK,EAAEU,aAAa;IAAEX;EAAa,CAAC,CAAC;AACrE,CAAC","ignoreList":[]}
@@ -20,6 +20,10 @@ export type SearchBoxProps = {
20
20
  * An optional callback function to filter the elements to be displayed
21
21
  */
22
22
  customFilter?: (item: ISearchBoxItem) => boolean;
23
+ /**
24
+ * If true, the custom filter replaces the built-in text search instead of narrowing its results.
25
+ */
26
+ shouldUseCustomFilterOnly?: boolean;
23
27
  /**
24
28
  * The direction in which the dropdown should be displayed. By default, it is displayed below the input.
25
29
  */
@@ -36,6 +40,10 @@ export type SearchBoxProps = {
36
40
  * 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.
37
41
  */
38
42
  lists: ISearchBoxItems[];
43
+ /**
44
+ * The maximum height of the dropdown body in pixels.
45
+ */
46
+ maxHeight?: number;
39
47
  /**
40
48
  * Function to be executed when the input lost focus.
41
49
  */
@@ -64,6 +72,10 @@ export type SearchBoxProps = {
64
72
  * Control the selected item. If you use this prop, make sure to update it when the user selects an item.
65
73
  */
66
74
  selectedId?: string;
75
+ /**
76
+ * If true, the selected item keeps its original position in the dropdown list.
77
+ */
78
+ shouldKeepSelectedItemPosition?: boolean;
67
79
  /**
68
80
  * If true, the value in the Input is displayed in the list.
69
81
  */
@@ -76,6 +88,10 @@ export type SearchBoxProps = {
76
88
  * Whether the full list of items should be displayed if the input is empty.
77
89
  */
78
90
  shouldShowContentOnEmptyInput?: boolean;
91
+ /**
92
+ * If true, the dropdown items are displayed more compactly.
93
+ */
94
+ shouldShowSmallItems?: boolean;
79
95
  /**
80
96
  * If true, the images of the items are displayed in a round shape.
81
97
  */
@@ -5,6 +5,7 @@ export type SearchBoxBodyProps = {
5
5
  filterButtons?: IFilterButtonItem[];
6
6
  selectedGroups?: string[];
7
7
  height: number;
8
+ maxHeight?: number;
8
9
  onGroupSelect?: (keys: string[]) => void;
9
10
  shouldHideFilterButtons?: boolean;
10
11
  shouldShow: boolean;