@chayns-components/core 5.0.0-beta.934 → 5.0.0-beta.936
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.
- package/lib/cjs/components/combobox/ComboBox.js +8 -7
- package/lib/cjs/components/combobox/ComboBox.js.map +1 -1
- package/lib/cjs/components/context-menu/ContextMenu.js +5 -0
- package/lib/cjs/components/context-menu/ContextMenu.js.map +1 -1
- package/lib/cjs/components/popup/Popup.js +5 -0
- package/lib/cjs/components/popup/Popup.js.map +1 -1
- package/lib/cjs/components/search-box/SearchBox.js +5 -0
- package/lib/cjs/components/search-box/SearchBox.js.map +1 -1
- package/lib/esm/components/combobox/ComboBox.js +10 -15
- package/lib/esm/components/combobox/ComboBox.js.map +1 -1
- package/lib/esm/components/context-menu/ContextMenu.js +5 -0
- package/lib/esm/components/context-menu/ContextMenu.js.map +1 -1
- package/lib/esm/components/popup/Popup.js +5 -0
- package/lib/esm/components/popup/Popup.js.map +1 -1
- package/lib/esm/components/search-box/SearchBox.js +5 -0
- package/lib/esm/components/search-box/SearchBox.js.map +1 -1
- package/package.json +2 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SearchBox.js","names":["_chaynsApi","require","_framerMotion","_react","_interopRequireWildcard","_reactDom","_styledComponents","_calculate","_searchBox","_Icon","_interopRequireDefault","_Input","_GroupName","_SearchBoxBody","_SearchBoxItem","_SearchBoxItem2","_SearchBox","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","SearchBox","forwardRef","placeholder","lists","onChange","onBlur","onSelect","onKeyDown","selectedId","container","shouldShowRoundImage","shouldShowContentOnEmptyInput","shouldAddInputToList","shouldShowToggleIcon","ref","matchingListsItems","setMatchingListsItems","useState","selectedImage","setSelectedImage","value","setValue","isAnimating","setIsAnimating","height","setHeight","width","setWidth","focusedIndex","setFocusedIndex","hasMultipleGroups","setHasMultipleGroups","length","filteredChildrenArray","setFilteredChildrenArray","inputToListValue","setInputToListValue","groups","setGroups","portal","setPortal","internalCoordinates","setInternalCoordinates","x","y","newContainer","setNewContainer","boxRef","useRef","contentRef","inputRef","theme","useTheme","browser","getDevice","useEffect","current","el","element","closest","getBoundingClientRect","filterbuttons","useMemo","items","forEach","groupName","push","id","text","activeList","newLists","list","includes","newMatchingItems","newList","searchList","searchString","undefined","filteredMatchingListItems","map","filter","item","handleOpen","useCallback","bodyHeight","handleClose","handleFilterButtonsGroupSelect","keys","handleOutsideClick","event","contains","target","document","addEventListener","window","removeEventListener","textArray","calculateContentHeight","input","getElementById","getInputWidth","offsetWidth","ResizeObserver","observe","selectedItem","find","imageUrl","createElement","StyledSearchBoxItemImage","src","$shouldShowRoundImage","handleFocus","toLowerCase","handleClick","rightElement","StyledSearchBoxIcon","onClick","icons","color","handleChange","filteredLists","handleBlur","handleSelect","newItem","replace","content","index","key","name","handleKeyDown","_contentRef$current","_childrenArray$find","preventDefault","children","childrenArray","Array","from","newChildren","child","startsWith","filteredChildren","dataset","isgroupname","newIndex","prevElement","tabIndex","newElement","focus","_element$children$","textContent","attributes","_element$children$2","nodeValue","handleKeyPress","keyCode","useImperativeHandle","clear","createPortal","AnimatePresence","initial","selectedGroups","coordinates","onGroupSelect","StyledSearchBox","onFocus","leftElement","displayName","_default","exports"],"sources":["../../../../src/components/search-box/SearchBox.tsx"],"sourcesContent":["import { getDevice } from 'chayns-api';\nimport { AnimatePresence } from 'framer-motion';\nimport React, {\n ChangeEvent,\n ChangeEventHandler,\n FC,\n FocusEvent,\n FocusEventHandler,\n forwardRef,\n KeyboardEventHandler,\n ReactElement,\n ReactPortal,\n useCallback,\n useEffect,\n useImperativeHandle,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport { createPortal } from 'react-dom';\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 { ContextMenuCoordinates } from '../context-menu/ContextMenu';\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 { StyledSearchBox, StyledSearchBoxIcon } from './SearchBox.styles';\n\nexport type SearchBoxRef = {\n clear: VoidFunction;\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 * 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 placeholder that should be displayed.\n */\n placeholder?: string;\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 * 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 * 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\nconst SearchBox: FC<SearchBoxProps> = forwardRef<SearchBoxRef, SearchBoxProps>(\n (\n {\n placeholder,\n lists,\n onChange,\n onBlur,\n onSelect,\n onKeyDown,\n selectedId,\n container,\n shouldShowRoundImage,\n shouldShowContentOnEmptyInput = true,\n shouldAddInputToList = true,\n shouldShowToggleIcon = false,\n },\n ref,\n ) => {\n const [matchingListsItems, setMatchingListsItems] = useState<ISearchBoxItems[]>(lists);\n const [selectedImage, setSelectedImage] = useState<ReactElement>();\n const [value, setValue] = useState('');\n const [isAnimating, setIsAnimating] = useState(false);\n const [height, setHeight] = useState<number>(0);\n const [width, setWidth] = useState(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 [portal, setPortal] = useState<ReactPortal>();\n const [internalCoordinates, setInternalCoordinates] = useState<ContextMenuCoordinates>({\n x: 0,\n y: 0,\n });\n const [newContainer, setNewContainer] = useState<Element | null>(container ?? null);\n\n const boxRef = useRef<HTMLDivElement>(null);\n const contentRef = useRef<HTMLDivElement>(null);\n const inputRef = useRef<HTMLInputElement | null>(null);\n\n const theme = useTheme();\n\n const { browser } = getDevice();\n\n useEffect(() => {\n if (boxRef.current && !container) {\n const el = boxRef.current as HTMLElement;\n\n const element = el.closest('.dialog-inner') || el.closest('body');\n\n setNewContainer(element);\n }\n }, [container]);\n\n useEffect(() => {\n if (boxRef.current) {\n const { x, y } = boxRef.current.getBoundingClientRect();\n\n setInternalCoordinates({\n x,\n y,\n });\n }\n }, []);\n\n /**\n * Checks if Lists are smaller then 1\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(\n (item) => !(newMatchingItems.length === 1 && item.text === value),\n ),\n }));\n\n setMatchingListsItems(filteredMatchingListItems);\n\n return newLists;\n }, [groups, lists, shouldAddInputToList, value]);\n\n const handleOpen = useCallback(() => {\n if (boxRef.current) {\n const { x, y, height: bodyHeight } = boxRef.current.getBoundingClientRect();\n\n setInternalCoordinates({\n x,\n y: y + bodyHeight,\n });\n\n setIsAnimating(true);\n }\n }, []);\n\n const handleClose = useCallback(() => {\n setIsAnimating(false);\n }, []);\n\n const handleFilterButtonsGroupSelect = (keys: string[]) => {\n setGroups(keys.length === 0 ? ['all'] : keys);\n };\n\n /**\n * This function closes the list of items\n */\n const handleOutsideClick = useCallback(\n (event: MouseEvent) => {\n if (\n boxRef.current &&\n !boxRef.current.contains(event.target as Node) &&\n contentRef.current &&\n !contentRef.current.contains(event.target as Node)\n ) {\n handleClose();\n }\n },\n [handleClose],\n );\n\n /**\n * This hook listens for clicks\n */\n useEffect(() => {\n document.addEventListener('click', handleOutsideClick);\n window.addEventListener('blur', () => handleClose());\n\n return () => {\n document.removeEventListener('click', handleOutsideClick);\n window.addEventListener('blur', () => handleClose());\n };\n }, [handleOutsideClick, boxRef, handleClose]);\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 /**\n * This hook calculates the width\n */\n useEffect(() => {\n const input = document.getElementById('search_box_input');\n\n const getInputWidth = () => {\n if (input) {\n setWidth(input.offsetWidth);\n }\n };\n\n if (input) {\n new ResizeObserver(getInputWidth).observe(input);\n }\n }, []);\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) {\n setValue('');\n }\n }, [selectedId]);\n\n /**\n * This function sets the items on focus if shouldShowContentOnEmptyInput\n */\n const handleFocus = useCallback(() => {\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(\n (item) => !(newMatchingItems.length === 1 && item.text === value),\n ),\n }));\n\n setMatchingListsItems(filteredMatchingListItems);\n\n if (filteredMatchingListItems.length !== 0) {\n handleOpen();\n } else {\n handleClose();\n }\n }\n }, [\n activeList,\n handleClose,\n handleOpen,\n shouldAddInputToList,\n shouldShowContentOnEmptyInput,\n value,\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 (isAnimating) {\n handleClose();\n } else {\n handleOpen();\n }\n }, [handleClose, handleOpen, isAnimating]);\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 /**\n * This function handles changes of the input\n */\n const handleChange = useCallback(\n (event: ChangeEvent<HTMLInputElement>) => {\n const filteredLists: ISearchBoxItems[] = [];\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 if (filteredLists.length !== 0) {\n handleOpen();\n } else {\n handleClose();\n }\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 handleClose,\n handleOpen,\n onChange,\n shouldAddInputToList,\n shouldShowContentOnEmptyInput,\n ],\n );\n\n /**\n * This function handles the blur event of the input\n */\n const handleBlur = useCallback(\n (event: FocusEvent<HTMLInputElement>) => {\n if (typeof onBlur === 'function') {\n onBlur(event);\n }\n },\n [onBlur],\n );\n\n /**\n * This function handles the item selection\n */\n const handleSelect = useCallback(\n (item: ISearchBoxItem) => {\n const newItem = {\n ...item,\n text: item.text.replace('<b>', '').replace('</b>', '').replace('</b', ''),\n };\n\n setValue(newItem.text);\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],\n );\n\n const content = useMemo(() => {\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 }) => {\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 />,\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 />,\n );\n }\n\n return items;\n }, [\n matchingListsItems,\n shouldAddInputToList,\n inputToListValue,\n hasMultipleGroups,\n shouldShowRoundImage,\n handleSelect,\n ]);\n\n useEffect(() => {\n const handleKeyDown = (e: KeyboardEvent) => {\n if (!isAnimating) {\n return;\n }\n\n if (e.key === 'ArrowUp' || e.key === 'ArrowDown') {\n e.preventDefault();\n const children = contentRef.current?.children;\n\n if (!children) {\n return;\n }\n\n const childrenArray = Array.from(children);\n\n const newChildren = childrenArray.find((child) =>\n child.id.startsWith('searchbox-content__'),\n )?.children;\n\n if (newChildren && newChildren.length > 0) {\n const filteredChildren = Array.from(newChildren).filter(\n (child) => (child as HTMLElement).dataset.isgroupname !== 'true',\n );\n setFilteredChildrenArray(filteredChildren);\n\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 newElement.tabIndex = 0;\n newElement.focus();\n }\n } else if (e.key === 'Enter' && focusedIndex !== null) {\n if (filteredChildrenArray) {\n const element = filteredChildrenArray[focusedIndex];\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 handleSelect({\n id: id.replace('search-box-item__', ''),\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 }, [filteredChildrenArray, focusedIndex, handleSelect, isAnimating]);\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 useEffect(() => {\n if (!newContainer) {\n return;\n }\n\n setPortal(() =>\n createPortal(\n <AnimatePresence initial={false}>\n {isAnimating && (\n <SearchBoxBody\n filterbuttons={filterbuttons}\n selectedGroups={groups}\n width={width}\n coordinates={internalCoordinates}\n browser={browser?.name}\n height={height}\n ref={contentRef}\n onGroupSelect={handleFilterButtonsGroupSelect}\n >\n {content}\n </SearchBoxBody>\n )}\n </AnimatePresence>,\n newContainer,\n ),\n );\n }, [\n browser?.name,\n newContainer,\n content,\n filterbuttons,\n groups,\n height,\n internalCoordinates,\n isAnimating,\n width,\n ]);\n\n return useMemo(\n () => (\n <StyledSearchBox ref={boxRef}>\n <div id=\"search_box_input\">\n <Input\n ref={inputRef}\n onChange={handleChange}\n onBlur={handleBlur}\n onFocus={handleFocus}\n placeholder={placeholder}\n onKeyDown={onKeyDown}\n leftElement={selectedImage}\n rightElement={rightElement}\n value={value}\n />\n </div>\n {portal}\n </StyledSearchBox>\n ),\n [\n handleBlur,\n handleChange,\n handleFocus,\n onKeyDown,\n placeholder,\n portal,\n rightElement,\n selectedImage,\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":["_chaynsApi","require","_framerMotion","_react","_interopRequireWildcard","_reactDom","_styledComponents","_calculate","_searchBox","_Icon","_interopRequireDefault","_Input","_GroupName","_SearchBoxBody","_SearchBoxItem","_SearchBoxItem2","_SearchBox","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","SearchBox","forwardRef","placeholder","lists","onChange","onBlur","onSelect","onKeyDown","selectedId","container","shouldShowRoundImage","shouldShowContentOnEmptyInput","shouldAddInputToList","shouldShowToggleIcon","ref","matchingListsItems","setMatchingListsItems","useState","selectedImage","setSelectedImage","value","setValue","isAnimating","setIsAnimating","height","setHeight","width","setWidth","focusedIndex","setFocusedIndex","hasMultipleGroups","setHasMultipleGroups","length","filteredChildrenArray","setFilteredChildrenArray","inputToListValue","setInputToListValue","groups","setGroups","portal","setPortal","internalCoordinates","setInternalCoordinates","x","y","newContainer","setNewContainer","boxRef","useRef","contentRef","inputRef","theme","useTheme","browser","getDevice","useEffect","current","el","element","closest","Element","getBoundingClientRect","filterbuttons","useMemo","items","forEach","groupName","push","id","text","activeList","newLists","list","includes","newMatchingItems","newList","searchList","searchString","undefined","filteredMatchingListItems","map","filter","item","handleOpen","useCallback","bodyHeight","handleClose","handleFilterButtonsGroupSelect","keys","handleOutsideClick","event","contains","target","document","addEventListener","window","removeEventListener","textArray","calculateContentHeight","input","getElementById","getInputWidth","offsetWidth","ResizeObserver","observe","selectedItem","find","imageUrl","createElement","StyledSearchBoxItemImage","src","$shouldShowRoundImage","handleFocus","toLowerCase","handleClick","rightElement","StyledSearchBoxIcon","onClick","icons","color","handleChange","filteredLists","handleBlur","handleSelect","newItem","replace","content","index","key","name","handleKeyDown","_contentRef$current","_childrenArray$find","preventDefault","children","childrenArray","Array","from","newChildren","child","startsWith","filteredChildren","dataset","isgroupname","newIndex","prevElement","tabIndex","newElement","focus","_element$children$","textContent","attributes","_element$children$2","nodeValue","handleKeyPress","keyCode","useImperativeHandle","clear","createPortal","AnimatePresence","initial","selectedGroups","coordinates","onGroupSelect","StyledSearchBox","onFocus","leftElement","displayName","_default","exports"],"sources":["../../../../src/components/search-box/SearchBox.tsx"],"sourcesContent":["import { getDevice } from 'chayns-api';\nimport { AnimatePresence } from 'framer-motion';\nimport React, {\n ChangeEvent,\n ChangeEventHandler,\n FC,\n FocusEvent,\n FocusEventHandler,\n forwardRef,\n KeyboardEventHandler,\n ReactElement,\n ReactPortal,\n useCallback,\n useEffect,\n useImperativeHandle,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport { createPortal } from 'react-dom';\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 { ContextMenuCoordinates } from '../context-menu/ContextMenu';\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 { StyledSearchBox, StyledSearchBoxIcon } from './SearchBox.styles';\n\nexport type SearchBoxRef = {\n clear: VoidFunction;\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 * 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 placeholder that should be displayed.\n */\n placeholder?: string;\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 * 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 * 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\nconst SearchBox: FC<SearchBoxProps> = forwardRef<SearchBoxRef, SearchBoxProps>(\n (\n {\n placeholder,\n lists,\n onChange,\n onBlur,\n onSelect,\n onKeyDown,\n selectedId,\n container,\n shouldShowRoundImage,\n shouldShowContentOnEmptyInput = true,\n shouldAddInputToList = true,\n shouldShowToggleIcon = false,\n },\n ref,\n ) => {\n const [matchingListsItems, setMatchingListsItems] = useState<ISearchBoxItems[]>(lists);\n const [selectedImage, setSelectedImage] = useState<ReactElement>();\n const [value, setValue] = useState('');\n const [isAnimating, setIsAnimating] = useState(false);\n const [height, setHeight] = useState<number>(0);\n const [width, setWidth] = useState(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 [portal, setPortal] = useState<ReactPortal>();\n const [internalCoordinates, setInternalCoordinates] = useState<ContextMenuCoordinates>({\n x: 0,\n y: 0,\n });\n const [newContainer, setNewContainer] = useState<Element | null>(container ?? null);\n\n const boxRef = useRef<HTMLDivElement>(null);\n const contentRef = useRef<HTMLDivElement>(null);\n const inputRef = useRef<HTMLInputElement | null>(null);\n\n const theme = useTheme();\n\n const { browser } = getDevice();\n\n useEffect(() => {\n if (boxRef.current && !container) {\n const el = boxRef.current as HTMLElement;\n\n const element = el.closest('.dialog-inner') || el.closest('body');\n\n setNewContainer(element);\n }\n }, [container]);\n\n useEffect(() => {\n if(container instanceof Element){\n setNewContainer(container)\n }\n }, [container]);\n\n useEffect(() => {\n if (boxRef.current) {\n const { x, y } = boxRef.current.getBoundingClientRect();\n\n setInternalCoordinates({\n x,\n y,\n });\n }\n }, []);\n\n /**\n * Checks if Lists are smaller then 1\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(\n (item) => !(newMatchingItems.length === 1 && item.text === value),\n ),\n }));\n\n setMatchingListsItems(filteredMatchingListItems);\n\n return newLists;\n }, [groups, lists, shouldAddInputToList, value]);\n\n const handleOpen = useCallback(() => {\n if (boxRef.current) {\n const { x, y, height: bodyHeight } = boxRef.current.getBoundingClientRect();\n\n setInternalCoordinates({\n x,\n y: y + bodyHeight,\n });\n\n setIsAnimating(true);\n }\n }, []);\n\n const handleClose = useCallback(() => {\n setIsAnimating(false);\n }, []);\n\n const handleFilterButtonsGroupSelect = (keys: string[]) => {\n setGroups(keys.length === 0 ? ['all'] : keys);\n };\n\n /**\n * This function closes the list of items\n */\n const handleOutsideClick = useCallback(\n (event: MouseEvent) => {\n if (\n boxRef.current &&\n !boxRef.current.contains(event.target as Node) &&\n contentRef.current &&\n !contentRef.current.contains(event.target as Node)\n ) {\n handleClose();\n }\n },\n [handleClose],\n );\n\n /**\n * This hook listens for clicks\n */\n useEffect(() => {\n document.addEventListener('click', handleOutsideClick);\n window.addEventListener('blur', () => handleClose());\n\n return () => {\n document.removeEventListener('click', handleOutsideClick);\n window.addEventListener('blur', () => handleClose());\n };\n }, [handleOutsideClick, boxRef, handleClose]);\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 /**\n * This hook calculates the width\n */\n useEffect(() => {\n const input = document.getElementById('search_box_input');\n\n const getInputWidth = () => {\n if (input) {\n setWidth(input.offsetWidth);\n }\n };\n\n if (input) {\n new ResizeObserver(getInputWidth).observe(input);\n }\n }, []);\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) {\n setValue('');\n }\n }, [selectedId]);\n\n /**\n * This function sets the items on focus if shouldShowContentOnEmptyInput\n */\n const handleFocus = useCallback(() => {\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(\n (item) => !(newMatchingItems.length === 1 && item.text === value),\n ),\n }));\n\n setMatchingListsItems(filteredMatchingListItems);\n\n if (filteredMatchingListItems.length !== 0) {\n handleOpen();\n } else {\n handleClose();\n }\n }\n }, [\n activeList,\n handleClose,\n handleOpen,\n shouldAddInputToList,\n shouldShowContentOnEmptyInput,\n value,\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 (isAnimating) {\n handleClose();\n } else {\n handleOpen();\n }\n }, [handleClose, handleOpen, isAnimating]);\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 /**\n * This function handles changes of the input\n */\n const handleChange = useCallback(\n (event: ChangeEvent<HTMLInputElement>) => {\n const filteredLists: ISearchBoxItems[] = [];\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 if (filteredLists.length !== 0) {\n handleOpen();\n } else {\n handleClose();\n }\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 handleClose,\n handleOpen,\n onChange,\n shouldAddInputToList,\n shouldShowContentOnEmptyInput,\n ],\n );\n\n /**\n * This function handles the blur event of the input\n */\n const handleBlur = useCallback(\n (event: FocusEvent<HTMLInputElement>) => {\n if (typeof onBlur === 'function') {\n onBlur(event);\n }\n },\n [onBlur],\n );\n\n /**\n * This function handles the item selection\n */\n const handleSelect = useCallback(\n (item: ISearchBoxItem) => {\n const newItem = {\n ...item,\n text: item.text.replace('<b>', '').replace('</b>', '').replace('</b', ''),\n };\n\n setValue(newItem.text);\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],\n );\n\n const content = useMemo(() => {\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 }) => {\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 />,\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 />,\n );\n }\n\n return items;\n }, [\n matchingListsItems,\n shouldAddInputToList,\n inputToListValue,\n hasMultipleGroups,\n shouldShowRoundImage,\n handleSelect,\n ]);\n\n useEffect(() => {\n const handleKeyDown = (e: KeyboardEvent) => {\n if (!isAnimating) {\n return;\n }\n\n if (e.key === 'ArrowUp' || e.key === 'ArrowDown') {\n e.preventDefault();\n const children = contentRef.current?.children;\n\n if (!children) {\n return;\n }\n\n const childrenArray = Array.from(children);\n\n const newChildren = childrenArray.find((child) =>\n child.id.startsWith('searchbox-content__'),\n )?.children;\n\n if (newChildren && newChildren.length > 0) {\n const filteredChildren = Array.from(newChildren).filter(\n (child) => (child as HTMLElement).dataset.isgroupname !== 'true',\n );\n setFilteredChildrenArray(filteredChildren);\n\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 newElement.tabIndex = 0;\n newElement.focus();\n }\n } else if (e.key === 'Enter' && focusedIndex !== null) {\n if (filteredChildrenArray) {\n const element = filteredChildrenArray[focusedIndex];\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 handleSelect({\n id: id.replace('search-box-item__', ''),\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 }, [filteredChildrenArray, focusedIndex, handleSelect, isAnimating]);\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 useEffect(() => {\n if (!newContainer) {\n return;\n }\n\n setPortal(() =>\n createPortal(\n <AnimatePresence initial={false}>\n {isAnimating && (\n <SearchBoxBody\n filterbuttons={filterbuttons}\n selectedGroups={groups}\n width={width}\n coordinates={internalCoordinates}\n browser={browser?.name}\n height={height}\n ref={contentRef}\n onGroupSelect={handleFilterButtonsGroupSelect}\n >\n {content}\n </SearchBoxBody>\n )}\n </AnimatePresence>,\n newContainer,\n ),\n );\n }, [\n browser?.name,\n newContainer,\n content,\n filterbuttons,\n groups,\n height,\n internalCoordinates,\n isAnimating,\n width,\n ]);\n\n return useMemo(\n () => (\n <StyledSearchBox ref={boxRef}>\n <div id=\"search_box_input\">\n <Input\n ref={inputRef}\n onChange={handleChange}\n onBlur={handleBlur}\n onFocus={handleFocus}\n placeholder={placeholder}\n onKeyDown={onKeyDown}\n leftElement={selectedImage}\n rightElement={rightElement}\n value={value}\n />\n </div>\n {portal}\n </StyledSearchBox>\n ),\n [\n handleBlur,\n handleChange,\n handleFocus,\n onKeyDown,\n placeholder,\n portal,\n rightElement,\n selectedImage,\n value,\n ],\n );\n },\n);\n\nSearchBox.displayName = 'SearchBox';\n\nexport default SearchBox;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -56,6 +56,11 @@ const ComboBox = _ref => {
|
|
|
56
56
|
setNewContainer(element);
|
|
57
57
|
}
|
|
58
58
|
}, [container]);
|
|
59
|
+
useEffect(() => {
|
|
60
|
+
if (container instanceof Element) {
|
|
61
|
+
setNewContainer(container);
|
|
62
|
+
}
|
|
63
|
+
}, [container]);
|
|
59
64
|
const handleClick = useCallback(event => {
|
|
60
65
|
if (styledComboBoxElementRef.current && !styledComboBoxElementRef.current.contains(event.target) && contentRef.current && !contentRef.current.contains(event.target)) {
|
|
61
66
|
setIsAnimating(false);
|
|
@@ -168,18 +173,8 @@ const ComboBox = _ref => {
|
|
|
168
173
|
*/
|
|
169
174
|
useEffect(() => {
|
|
170
175
|
const allItems = lists.flatMap(list => list.list);
|
|
171
|
-
const hasImage = allItems.some(
|
|
172
|
-
|
|
173
|
-
imageUrl
|
|
174
|
-
} = _ref3;
|
|
175
|
-
return imageUrl;
|
|
176
|
-
});
|
|
177
|
-
const hasIcon = allItems.some(_ref4 => {
|
|
178
|
-
let {
|
|
179
|
-
icons
|
|
180
|
-
} = _ref4;
|
|
181
|
-
return icons;
|
|
182
|
-
});
|
|
176
|
+
const hasImage = [selectedItem, ...allItems].some(item => item?.imageUrl);
|
|
177
|
+
const hasIcon = [selectedItem, ...allItems].some(item => item?.icons);
|
|
183
178
|
const parentWidth = styledComboBoxElementRef.current?.parentElement?.getBoundingClientRect().width ?? 0;
|
|
184
179
|
const paddingWidth = 45; // padding + border + arrow icon
|
|
185
180
|
const imageWidth = hasImage ? 32 : 0; // image width + gap if images present
|
|
@@ -196,7 +191,7 @@ const ComboBox = _ref => {
|
|
|
196
191
|
const baseWidth = calculateContentWidth([...allItems, {
|
|
197
192
|
text: placeholder,
|
|
198
193
|
value: 'placeholder'
|
|
199
|
-
}]);
|
|
194
|
+
}, ...(selectedItem ? [selectedItem] : [])]);
|
|
200
195
|
const calculatedWidth = baseWidth + paddingWidth + imageWidth + iconWidth + prefixWidth;
|
|
201
196
|
let tmpMinWidth = calculatedWidth;
|
|
202
197
|
let tmpBodyMinWidth = calculatedWidth;
|
|
@@ -256,10 +251,10 @@ const ComboBox = _ref => {
|
|
|
256
251
|
return text;
|
|
257
252
|
}, [internalSelectedItem, placeholder, selectedItem]);
|
|
258
253
|
const shouldShowRoundPlaceholderImage = useMemo(() => {
|
|
259
|
-
const selectedItemList = lists.find(list => list.list.some(
|
|
254
|
+
const selectedItemList = lists.find(list => list.list.some(_ref3 => {
|
|
260
255
|
let {
|
|
261
256
|
value
|
|
262
|
-
} =
|
|
257
|
+
} = _ref3;
|
|
263
258
|
return value === (selectedItem?.value ?? internalSelectedItem?.value);
|
|
264
259
|
}));
|
|
265
260
|
return selectedItemList?.shouldShowRoundImage ?? shouldShowRoundImage;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ComboBox.js","names":["useDevice","AnimatePresence","React","useCallback","useContext","useEffect","useMemo","useRef","useState","createPortal","ComboBoxDirection","calculateContentWidth","getMaxHeightInPixels","getIsTouch","AreaContext","Icon","ComboBoxItem","StyledComboBox","StyledComboBoxHeader","StyledComboBoxIconWrapper","StyledComboBoxInput","StyledComboBoxPlaceholder","StyledComboBoxPlaceholderImage","StyledComboBoxPrefix","StyledComboBoxPrefixAndPlaceholderWrapper","StyledComboBoxTopic","StyledMotionComboBoxBody","ComboBox","_ref","direction","BOTTOM","isDisabled","lists","maxHeight","onSelect","placeholder","prefix","container","selectedItem","shouldShowBigImage","shouldShowRoundImage","onInputFocus","shouldUseFullWidth","onInputChange","shouldUseCurrentItemWidth","onInputBlur","inputValue","internalSelectedItem","setInternalSelectedItem","isAnimating","setIsAnimating","minWidth","setMinWidth","bodyMinWidth","setBodyMinWidth","focusedIndex","setFocusedIndex","overflowY","setOverflowY","portal","setPortal","internalCoordinates","setInternalCoordinates","x","y","newContainer","setNewContainer","styledComboBoxElementRef","contentRef","browser","isTouch","areaProvider","shouldChangeColor","current","el","element","closest","handleClick","event","contains","target","handleOpen","left","comboBoxLeft","top","comboBoxTop","height","getBoundingClientRect","containerLeft","containerTop","scrollLeft","scrollTop","TOP","handleClose","document","addEventListener","removeEventListener","handleSetSelectedItem","itemToSelect","shouldPreventSelection","currentContent","scrollHeight","maxHeightInPixels","body","handleKeyDown","e","key","preventDefault","children","length","newIndex","prevElement","tabIndex","newElement","focus","id","newSelectedItem","some","list","find","_ref2","value","String","replace","allItems","flatMap","hasImage","_ref3","imageUrl","hasIcon","_ref4","icons","parentWidth","parentElement","width","paddingWidth","imageWidth","iconWidth","prefixWidth","prefixTextWidth","text","Math","max","baseWidth","calculatedWidth","tmpMinWidth","tmpBodyMinWidth","itemWidth","placeholderImageUrl","undefined","placeholderIcon","placeholderText","shouldShowRoundPlaceholderImage","selectedItemList","_ref5","handleHeaderClick","comboBoxGroups","map","createElement","groupName","item","isSelected","rightElement","subtext","suffixElement","textStyles","bodyStyles","styles","transform","initial","$browser","name","animate","opacity","$overflowY","exit","$maxHeight","$minWidth","style","$direction","transition","duration","ref","$shouldUseFullWidth","onClick","$isOpen","$isTouch","$isDisabled","$shouldChangeColor","$shouldShowBigImage","disabled","onChange","onBlur","onFocus","$shouldReduceOpacity","src","$shouldShowRoundImage","displayName"],"sources":["../../../../src/components/combobox/ComboBox.tsx"],"sourcesContent":["import { useDevice } from 'chayns-api';\nimport { AnimatePresence } from 'framer-motion';\nimport React, {\n ChangeEventHandler,\n FC,\n FocusEventHandler,\n ReactHTML,\n ReactPortal,\n useCallback,\n useContext,\n useEffect,\n useMemo,\n useRef,\n useState,\n type CSSProperties,\n type ReactNode,\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport { ComboBoxDirection } from '../../types/comboBox';\nimport { calculateContentWidth, getMaxHeightInPixels } from '../../utils/calculate';\nimport { getIsTouch } from '../../utils/environment';\nimport { AreaContext } from '../area-provider/AreaContextProvider';\nimport type { ContextMenuCoordinates } from '../context-menu/ContextMenu';\nimport Icon from '../icon/Icon';\nimport ComboBoxItem from './combobox-item/ComboBoxItem';\nimport {\n StyledComboBox,\n StyledComboBoxHeader,\n StyledComboBoxIconWrapper,\n StyledComboBoxInput,\n StyledComboBoxPlaceholder,\n StyledComboBoxPlaceholderImage,\n StyledComboBoxPrefix,\n StyledComboBoxPrefixAndPlaceholderWrapper,\n StyledComboBoxTopic,\n StyledMotionComboBoxBody,\n} from './ComboBox.styles';\n\nexport interface IComboBoxItems {\n groupName?: string;\n list: Array<IComboBoxItem>;\n shouldShowRoundImage?: boolean;\n}\n\nexport interface ComboBoxTextStyles {\n tagName?: keyof ReactHTML;\n styles?: CSSProperties;\n}\n\nexport interface IComboBoxItem {\n icons?: string[];\n imageUrl?: string;\n isDisabled?: boolean;\n rightElement?: ReactNode;\n subtext?: string;\n suffixElement?: ReactNode;\n text: string;\n value: string | number;\n textStyles?: ComboBoxTextStyles;\n}\n\nexport type ComboBoxProps = {\n /**\n * The element where the content of the `ComboBox` should be rendered via React Portal.\n */\n container?: Element;\n /**\n * The direction in which the combobox should open.\n */\n direction?: ComboBoxDirection;\n /**\n * The value of the optional input.\n */\n inputValue?: string;\n /**\n * Whether the combobox should be disabled.\n */\n isDisabled?: boolean;\n /**\n * The list of the items that should be displayed.\n */\n lists: IComboBoxItems[];\n /**\n * The maximum height of the combobox content.\n */\n maxHeight?: CSSProperties['maxHeight'];\n /**\n * Function to be executed when the value of the optional input is changed.\n */\n onInputChange?: ChangeEventHandler<HTMLInputElement>;\n /**\n * Function to be executed when the optional input lost its focus.\n */\n onInputBlur?: FocusEventHandler<HTMLInputElement> /**\n * Function to be executed when the optional input gets its focus.\n */;\n onInputFocus?: FocusEventHandler<HTMLInputElement>;\n /**\n * Function that should be executed when an item is selected. If the function returns false, the item will not be selected.\n */\n onSelect?: (comboboxItem: IComboBoxItem) => boolean | void;\n /**\n * A text that should be displayed when no item is selected.\n */\n placeholder: string;\n /**\n * A prefix that should be displayed before the placeholder.\n */\n prefix?: string;\n /**\n * An item that should be preselected.\n */\n selectedItem?: IComboBoxItem;\n /**\n * If true, the images of the items are displayed in a bigger shape. This prop will automatically be set to true if the subtext of an item is given.\n */\n shouldShowBigImage?: boolean;\n /**\n * If true, the images of the items are displayed in a round shape.\n */\n shouldShowRoundImage?: boolean;\n /**\n * Whether the width of the ComboBox should be the width of the current item.\n */\n shouldUseCurrentItemWidth?: boolean;\n /**\n * Whether the width of the 'ComboBox' should be the width of the parent or of the widest item.\n */\n shouldUseFullWidth?: boolean;\n};\n\nconst ComboBox: FC<ComboBoxProps> = ({\n direction = ComboBoxDirection.BOTTOM,\n isDisabled = false,\n lists,\n maxHeight = '280px',\n onSelect,\n placeholder,\n prefix,\n container,\n selectedItem,\n shouldShowBigImage,\n shouldShowRoundImage,\n onInputFocus,\n shouldUseFullWidth = false,\n onInputChange,\n shouldUseCurrentItemWidth = false,\n onInputBlur,\n inputValue,\n}) => {\n const [internalSelectedItem, setInternalSelectedItem] = useState<IComboBoxItem>();\n const [isAnimating, setIsAnimating] = useState(false);\n const [minWidth, setMinWidth] = useState(0);\n const [bodyMinWidth, setBodyMinWidth] = useState(0);\n const [focusedIndex, setFocusedIndex] = useState<number | null>(null);\n const [overflowY, setOverflowY] = useState<CSSProperties['overflowY']>('hidden');\n const [portal, setPortal] = useState<ReactPortal>();\n const [internalCoordinates, setInternalCoordinates] = useState<ContextMenuCoordinates>({\n x: 0,\n y: 0,\n });\n const [newContainer, setNewContainer] = useState<Element | null>(container ?? null);\n\n const styledComboBoxElementRef = useRef<HTMLDivElement>(null);\n const contentRef = useRef<HTMLDivElement | null>(null);\n\n const { browser } = useDevice();\n\n const isTouch = getIsTouch();\n\n const areaProvider = useContext(AreaContext);\n\n const shouldChangeColor = useMemo(\n () => areaProvider.shouldChangeColor ?? false,\n [areaProvider.shouldChangeColor],\n );\n\n useEffect(() => {\n if (styledComboBoxElementRef.current && !container) {\n const el = styledComboBoxElementRef.current as HTMLElement;\n\n const element = el.closest('.dialog-inner') || el.closest('body');\n\n setNewContainer(element);\n }\n }, [container]);\n\n const handleClick = useCallback(\n (event: MouseEvent) => {\n if (\n styledComboBoxElementRef.current &&\n !styledComboBoxElementRef.current.contains(event.target as Node) &&\n contentRef.current &&\n !contentRef.current.contains(event.target as Node)\n ) {\n setIsAnimating(false);\n }\n },\n [styledComboBoxElementRef],\n );\n\n const handleOpen = useCallback(() => {\n if (styledComboBoxElementRef.current && newContainer) {\n const {\n left: comboBoxLeft,\n top: comboBoxTop,\n height,\n } = styledComboBoxElementRef.current.getBoundingClientRect();\n const { left: containerLeft, top: containerTop } = newContainer.getBoundingClientRect();\n\n const x = comboBoxLeft - containerLeft + newContainer.scrollLeft;\n const y = comboBoxTop - containerTop + newContainer.scrollTop;\n\n setInternalCoordinates({\n x,\n y: direction === ComboBoxDirection.TOP ? y : y + height,\n });\n\n setIsAnimating(true);\n }\n }, [newContainer, direction]);\n\n const handleClose = useCallback(() => {\n setIsAnimating(false);\n }, []);\n\n /**\n * This function adds an event listener to the document to close the combobox when the user clicks outside of it\n */\n useEffect(() => {\n document.addEventListener('click', handleClick);\n\n return () => {\n document.removeEventListener('click', handleClick);\n };\n }, [handleClick, styledComboBoxElementRef]);\n\n /**\n * This function sets the selected item\n */\n const handleSetSelectedItem = useCallback(\n (itemToSelect: IComboBoxItem) => {\n if (typeof onSelect === 'function') {\n const shouldPreventSelection = onSelect(itemToSelect) === false;\n\n if (shouldPreventSelection) return;\n }\n\n setInternalSelectedItem(itemToSelect);\n setIsAnimating(false);\n },\n [onSelect],\n );\n\n useEffect(() => {\n const currentContent = contentRef.current;\n\n if (portal && isAnimating && currentContent) {\n const scrollHeight = currentContent.scrollHeight ?? 0;\n\n const maxHeightInPixels = getMaxHeightInPixels(\n maxHeight,\n styledComboBoxElementRef.current ?? document.body,\n );\n\n setOverflowY(scrollHeight > maxHeightInPixels ? 'scroll' : 'hidden');\n }\n }, [isAnimating, maxHeight, portal]);\n\n useEffect(() => {\n const handleKeyDown = (e: KeyboardEvent) => {\n if (!isAnimating) {\n return;\n }\n\n if (e.key === 'ArrowUp' || e.key === 'ArrowDown') {\n e.preventDefault();\n const children = contentRef.current?.children;\n if (children && children.length > 0) {\n const newIndex =\n focusedIndex !== null\n ? (focusedIndex + (e.key === 'ArrowUp' ? -1 : 1) + children.length) %\n children.length\n : 0;\n\n if (focusedIndex !== null) {\n const prevElement = children[focusedIndex] as HTMLDivElement;\n prevElement.tabIndex = -1;\n }\n\n setFocusedIndex(newIndex);\n\n const newElement = children[newIndex] as HTMLDivElement;\n newElement.tabIndex = 0;\n newElement.focus();\n }\n } else if (e.key === 'Enter' && focusedIndex !== null) {\n const element = contentRef.current?.children[focusedIndex];\n\n if (!element) {\n return;\n }\n\n const { id } = element;\n\n let newSelectedItem: IComboBoxItem | undefined;\n\n lists.some((list) => {\n newSelectedItem = list.list.find(\n ({ value }) => String(value) === id.replace('combobox-item__', ''),\n );\n return !!newSelectedItem;\n });\n\n if (!newSelectedItem) {\n return;\n }\n\n handleSetSelectedItem(newSelectedItem);\n }\n };\n\n document.addEventListener('keydown', handleKeyDown);\n\n return () => {\n document.removeEventListener('keydown', handleKeyDown);\n };\n }, [focusedIndex, handleSetSelectedItem, isAnimating, lists]);\n\n /**\n * This function calculates the greatest width\n */\n useEffect(() => {\n const allItems = lists.flatMap((list) => list.list);\n const hasImage = allItems.some(({ imageUrl }) => imageUrl);\n const hasIcon = allItems.some(({ icons }) => icons);\n\n const parentWidth =\n styledComboBoxElementRef.current?.parentElement?.getBoundingClientRect().width ?? 0;\n\n const paddingWidth = 45; // padding + border + arrow icon\n const imageWidth = hasImage ? 32 : 0; // image width + gap if images present\n const iconWidth = hasIcon ? 40 : 0; // icon width + gap if icons present\n\n let prefixWidth = 0;\n\n if (prefix) {\n const prefixTextWidth = calculateContentWidth([{ text: prefix, value: 'prefix' }]) + 5;\n\n prefixWidth = Math.max(prefixTextWidth, 32);\n }\n\n const baseWidth = calculateContentWidth([\n ...allItems,\n { text: placeholder, value: 'placeholder' },\n ]);\n\n const calculatedWidth = baseWidth + paddingWidth + imageWidth + iconWidth + prefixWidth;\n\n let tmpMinWidth = calculatedWidth;\n let tmpBodyMinWidth = calculatedWidth;\n\n // Full width settings\n if (shouldUseFullWidth) {\n tmpMinWidth = parentWidth;\n\n tmpBodyMinWidth =\n parentWidth < calculatedWidth - 20 ? calculatedWidth - 20 : parentWidth;\n }\n\n // Current item width settings\n else if (shouldUseCurrentItemWidth && internalSelectedItem) {\n const itemWidth =\n calculateContentWidth([internalSelectedItem]) +\n paddingWidth +\n imageWidth +\n iconWidth +\n prefixWidth;\n\n tmpMinWidth = itemWidth;\n\n tmpBodyMinWidth = itemWidth < calculatedWidth - 20 ? calculatedWidth - 20 : itemWidth;\n }\n\n setMinWidth(tmpMinWidth);\n setBodyMinWidth(tmpBodyMinWidth);\n }, [\n lists,\n placeholder,\n shouldUseFullWidth,\n shouldUseCurrentItemWidth,\n internalSelectedItem,\n prefix,\n ]);\n\n /**\n * This function sets the external selected item\n */\n useEffect(() => {\n setIsAnimating(false);\n setInternalSelectedItem(selectedItem);\n }, [selectedItem]);\n\n const placeholderImageUrl = useMemo(() => {\n if (selectedItem) {\n return selectedItem.imageUrl;\n }\n\n if (internalSelectedItem) {\n return internalSelectedItem.imageUrl;\n }\n\n return undefined;\n }, [internalSelectedItem, selectedItem]);\n\n const placeholderIcon = useMemo(() => {\n if (selectedItem) {\n return selectedItem.icons;\n }\n\n if (internalSelectedItem) {\n return internalSelectedItem.icons;\n }\n\n return undefined;\n }, [internalSelectedItem, selectedItem]);\n\n /**\n * This function resets the placeholder\n */\n const placeholderText = useMemo(() => {\n let text = placeholder;\n\n if (selectedItem) {\n text = selectedItem.text;\n } else if (internalSelectedItem) {\n text = internalSelectedItem.text;\n }\n\n return text;\n }, [internalSelectedItem, placeholder, selectedItem]);\n\n const shouldShowRoundPlaceholderImage = useMemo(() => {\n const selectedItemList = lists.find((list) =>\n list.list.some(\n ({ value }) => value === (selectedItem?.value ?? internalSelectedItem?.value),\n ),\n );\n\n return selectedItemList?.shouldShowRoundImage ?? shouldShowRoundImage;\n }, [internalSelectedItem?.value, lists, selectedItem?.value, shouldShowRoundImage]);\n\n /**\n * This function opens the content of the combobox\n */\n const handleHeaderClick = useCallback(() => {\n if (!isDisabled) {\n if (isAnimating) {\n handleClose();\n } else {\n handleOpen();\n }\n }\n }, [handleClose, handleOpen, isAnimating, isDisabled]);\n\n const comboBoxGroups = useMemo(\n () =>\n lists.map((list) => (\n <div key={list.groupName ?? 'default-group'}>\n {list.groupName && lists.length > 1 && (\n <StyledComboBoxTopic>{list.groupName}</StyledComboBoxTopic>\n )}\n {list.list.map((item) => (\n // ToDo: Cleanup this - item should be given as a prop to avoid full spreading\n <ComboBoxItem\n icons={item.icons}\n id={item.value}\n imageUrl={item.imageUrl}\n isDisabled={item.isDisabled}\n isSelected={selectedItem ? item.value === selectedItem.value : false}\n key={item.value}\n onSelect={handleSetSelectedItem}\n rightElement={item.rightElement}\n shouldShowBigImage={shouldShowBigImage}\n shouldShowRoundImage={list.shouldShowRoundImage ?? shouldShowRoundImage}\n subtext={item.subtext}\n suffixElement={item.suffixElement}\n text={item.text}\n value={item.value}\n textStyles={item.textStyles}\n />\n ))}\n </div>\n )),\n [handleSetSelectedItem, lists, selectedItem, shouldShowBigImage, shouldShowRoundImage],\n );\n\n const bodyStyles = useMemo(() => {\n let styles: CSSProperties = { left: internalCoordinates.x, top: internalCoordinates.y };\n\n if (direction === ComboBoxDirection.TOP) {\n styles = { ...styles, transform: 'translateY(-100%)' };\n }\n\n return styles;\n }, [direction, internalCoordinates.x, internalCoordinates.y]);\n\n useEffect(() => {\n if (!newContainer) {\n return;\n }\n\n setPortal(() =>\n createPortal(\n <AnimatePresence initial={false}>\n {isAnimating && (\n <StyledMotionComboBoxBody\n $browser={browser?.name}\n animate={{ height: 'fit-content', opacity: 1 }}\n $overflowY={overflowY}\n initial={{ height: 0, opacity: 0 }}\n exit={{ height: 0, opacity: 0 }}\n $maxHeight={maxHeight}\n $minWidth={bodyMinWidth}\n style={bodyStyles}\n $direction={direction}\n transition={{ duration: 0.2 }}\n tabIndex={0}\n ref={contentRef}\n >\n {comboBoxGroups}\n </StyledMotionComboBoxBody>\n )}\n </AnimatePresence>,\n newContainer,\n ),\n );\n }, [\n bodyMinWidth,\n bodyStyles,\n browser?.name,\n comboBoxGroups,\n newContainer,\n direction,\n isAnimating,\n maxHeight,\n minWidth,\n overflowY,\n ]);\n\n return useMemo(\n () => (\n <StyledComboBox\n ref={styledComboBoxElementRef}\n $minWidth={minWidth}\n $shouldUseFullWidth={shouldUseFullWidth}\n >\n <StyledComboBoxHeader\n $direction={direction}\n onClick={handleHeaderClick}\n $isOpen={isAnimating}\n $isTouch={isTouch}\n $isDisabled={isDisabled}\n $shouldChangeColor={shouldChangeColor}\n $shouldShowBigImage={shouldShowBigImage}\n >\n <StyledComboBoxPrefixAndPlaceholderWrapper>\n {prefix && <StyledComboBoxPrefix>{prefix}</StyledComboBoxPrefix>}\n {typeof inputValue === 'string' ? (\n <StyledComboBoxInput\n disabled={isDisabled}\n value={inputValue}\n onChange={onInputChange}\n onBlur={onInputBlur}\n onFocus={onInputFocus}\n placeholder={placeholderText}\n />\n ) : (\n <StyledComboBoxPlaceholder\n $shouldReduceOpacity={!selectedItem && !internalSelectedItem}\n >\n {placeholderImageUrl && (\n <StyledComboBoxPlaceholderImage\n src={placeholderImageUrl}\n $shouldShowBigImage={shouldShowBigImage}\n $shouldShowRoundImage={shouldShowRoundPlaceholderImage}\n />\n )}\n {placeholderIcon && <Icon icons={placeholderIcon} />}\n {placeholderText}\n {internalSelectedItem &&\n internalSelectedItem.suffixElement &&\n internalSelectedItem.suffixElement}\n </StyledComboBoxPlaceholder>\n )}\n </StyledComboBoxPrefixAndPlaceholderWrapper>\n <StyledComboBoxIconWrapper>\n <Icon icons={['fa fa-chevron-down']} />\n </StyledComboBoxIconWrapper>\n </StyledComboBoxHeader>\n {portal}\n </StyledComboBox>\n ),\n [\n minWidth,\n shouldUseFullWidth,\n direction,\n handleHeaderClick,\n isAnimating,\n isTouch,\n isDisabled,\n shouldChangeColor,\n shouldShowBigImage,\n prefix,\n inputValue,\n onInputChange,\n onInputBlur,\n onInputFocus,\n placeholderText,\n selectedItem,\n internalSelectedItem,\n placeholderImageUrl,\n shouldShowRoundPlaceholderImage,\n placeholderIcon,\n portal,\n ],\n );\n};\n\nComboBox.displayName = 'ComboBox';\n\nexport default ComboBox;\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"ComboBox.js","names":["useDevice","AnimatePresence","React","useCallback","useContext","useEffect","useMemo","useRef","useState","createPortal","ComboBoxDirection","calculateContentWidth","getMaxHeightInPixels","getIsTouch","AreaContext","Icon","ComboBoxItem","StyledComboBox","StyledComboBoxHeader","StyledComboBoxIconWrapper","StyledComboBoxInput","StyledComboBoxPlaceholder","StyledComboBoxPlaceholderImage","StyledComboBoxPrefix","StyledComboBoxPrefixAndPlaceholderWrapper","StyledComboBoxTopic","StyledMotionComboBoxBody","ComboBox","_ref","direction","BOTTOM","isDisabled","lists","maxHeight","onSelect","placeholder","prefix","container","selectedItem","shouldShowBigImage","shouldShowRoundImage","onInputFocus","shouldUseFullWidth","onInputChange","shouldUseCurrentItemWidth","onInputBlur","inputValue","internalSelectedItem","setInternalSelectedItem","isAnimating","setIsAnimating","minWidth","setMinWidth","bodyMinWidth","setBodyMinWidth","focusedIndex","setFocusedIndex","overflowY","setOverflowY","portal","setPortal","internalCoordinates","setInternalCoordinates","x","y","newContainer","setNewContainer","styledComboBoxElementRef","contentRef","browser","isTouch","areaProvider","shouldChangeColor","current","el","element","closest","Element","handleClick","event","contains","target","handleOpen","left","comboBoxLeft","top","comboBoxTop","height","getBoundingClientRect","containerLeft","containerTop","scrollLeft","scrollTop","TOP","handleClose","document","addEventListener","removeEventListener","handleSetSelectedItem","itemToSelect","shouldPreventSelection","currentContent","scrollHeight","maxHeightInPixels","body","handleKeyDown","e","key","preventDefault","children","length","newIndex","prevElement","tabIndex","newElement","focus","id","newSelectedItem","some","list","find","_ref2","value","String","replace","allItems","flatMap","hasImage","item","imageUrl","hasIcon","icons","parentWidth","parentElement","width","paddingWidth","imageWidth","iconWidth","prefixWidth","prefixTextWidth","text","Math","max","baseWidth","calculatedWidth","tmpMinWidth","tmpBodyMinWidth","itemWidth","placeholderImageUrl","undefined","placeholderIcon","placeholderText","shouldShowRoundPlaceholderImage","selectedItemList","_ref3","handleHeaderClick","comboBoxGroups","map","createElement","groupName","isSelected","rightElement","subtext","suffixElement","textStyles","bodyStyles","styles","transform","initial","$browser","name","animate","opacity","$overflowY","exit","$maxHeight","$minWidth","style","$direction","transition","duration","ref","$shouldUseFullWidth","onClick","$isOpen","$isTouch","$isDisabled","$shouldChangeColor","$shouldShowBigImage","disabled","onChange","onBlur","onFocus","$shouldReduceOpacity","src","$shouldShowRoundImage","displayName"],"sources":["../../../../src/components/combobox/ComboBox.tsx"],"sourcesContent":["import { useDevice } from 'chayns-api';\nimport { AnimatePresence } from 'framer-motion';\nimport React, {\n ChangeEventHandler,\n FC,\n FocusEventHandler,\n ReactHTML,\n ReactPortal,\n useCallback,\n useContext,\n useEffect,\n useMemo,\n useRef,\n useState,\n type CSSProperties,\n type ReactNode,\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport { ComboBoxDirection } from '../../types/comboBox';\nimport { calculateContentWidth, getMaxHeightInPixels } from '../../utils/calculate';\nimport { getIsTouch } from '../../utils/environment';\nimport { AreaContext } from '../area-provider/AreaContextProvider';\nimport type { ContextMenuCoordinates } from '../context-menu/ContextMenu';\nimport Icon from '../icon/Icon';\nimport ComboBoxItem from './combobox-item/ComboBoxItem';\nimport {\n StyledComboBox,\n StyledComboBoxHeader,\n StyledComboBoxIconWrapper,\n StyledComboBoxInput,\n StyledComboBoxPlaceholder,\n StyledComboBoxPlaceholderImage,\n StyledComboBoxPrefix,\n StyledComboBoxPrefixAndPlaceholderWrapper,\n StyledComboBoxTopic,\n StyledMotionComboBoxBody,\n} from './ComboBox.styles';\n\nexport interface IComboBoxItems {\n groupName?: string;\n list: Array<IComboBoxItem>;\n shouldShowRoundImage?: boolean;\n}\n\nexport interface ComboBoxTextStyles {\n tagName?: keyof ReactHTML;\n styles?: CSSProperties;\n}\n\nexport interface IComboBoxItem {\n icons?: string[];\n imageUrl?: string;\n isDisabled?: boolean;\n rightElement?: ReactNode;\n subtext?: string;\n suffixElement?: ReactNode;\n text: string;\n value: string | number;\n textStyles?: ComboBoxTextStyles;\n}\n\nexport type ComboBoxProps = {\n /**\n * The element where the content of the `ComboBox` should be rendered via React Portal.\n */\n container?: Element;\n /**\n * The direction in which the combobox should open.\n */\n direction?: ComboBoxDirection;\n /**\n * The value of the optional input.\n */\n inputValue?: string;\n /**\n * Whether the combobox should be disabled.\n */\n isDisabled?: boolean;\n /**\n * The list of the items that should be displayed.\n */\n lists: IComboBoxItems[];\n /**\n * The maximum height of the combobox content.\n */\n maxHeight?: CSSProperties['maxHeight'];\n /**\n * Function to be executed when the value of the optional input is changed.\n */\n onInputChange?: ChangeEventHandler<HTMLInputElement>;\n /**\n * Function to be executed when the optional input lost its focus.\n */\n onInputBlur?: FocusEventHandler<HTMLInputElement> /**\n * Function to be executed when the optional input gets its focus.\n */;\n onInputFocus?: FocusEventHandler<HTMLInputElement>;\n /**\n * Function that should be executed when an item is selected. If the function returns false, the item will not be selected.\n */\n onSelect?: (comboboxItem: IComboBoxItem) => boolean | void;\n /**\n * A text that should be displayed when no item is selected.\n */\n placeholder: string;\n /**\n * A prefix that should be displayed before the placeholder.\n */\n prefix?: string;\n /**\n * An item that should be preselected.\n */\n selectedItem?: IComboBoxItem;\n /**\n * If true, the images of the items are displayed in a bigger shape. This prop will automatically be set to true if the subtext of an item is given.\n */\n shouldShowBigImage?: boolean;\n /**\n * If true, the images of the items are displayed in a round shape.\n */\n shouldShowRoundImage?: boolean;\n /**\n * Whether the width of the ComboBox should be the width of the current item.\n */\n shouldUseCurrentItemWidth?: boolean;\n /**\n * Whether the width of the 'ComboBox' should be the width of the parent or of the widest item.\n */\n shouldUseFullWidth?: boolean;\n};\n\nconst ComboBox: FC<ComboBoxProps> = ({\n direction = ComboBoxDirection.BOTTOM,\n isDisabled = false,\n lists,\n maxHeight = '280px',\n onSelect,\n placeholder,\n prefix,\n container,\n selectedItem,\n shouldShowBigImage,\n shouldShowRoundImage,\n onInputFocus,\n shouldUseFullWidth = false,\n onInputChange,\n shouldUseCurrentItemWidth = false,\n onInputBlur,\n inputValue,\n}) => {\n const [internalSelectedItem, setInternalSelectedItem] = useState<IComboBoxItem>();\n const [isAnimating, setIsAnimating] = useState(false);\n const [minWidth, setMinWidth] = useState(0);\n const [bodyMinWidth, setBodyMinWidth] = useState(0);\n const [focusedIndex, setFocusedIndex] = useState<number | null>(null);\n const [overflowY, setOverflowY] = useState<CSSProperties['overflowY']>('hidden');\n const [portal, setPortal] = useState<ReactPortal>();\n const [internalCoordinates, setInternalCoordinates] = useState<ContextMenuCoordinates>({\n x: 0,\n y: 0,\n });\n const [newContainer, setNewContainer] = useState<Element | null>(container ?? null);\n\n const styledComboBoxElementRef = useRef<HTMLDivElement>(null);\n const contentRef = useRef<HTMLDivElement | null>(null);\n\n const { browser } = useDevice();\n\n const isTouch = getIsTouch();\n\n const areaProvider = useContext(AreaContext);\n\n const shouldChangeColor = useMemo(\n () => areaProvider.shouldChangeColor ?? false,\n [areaProvider.shouldChangeColor],\n );\n\n useEffect(() => {\n if (styledComboBoxElementRef.current && !container) {\n const el = styledComboBoxElementRef.current as HTMLElement;\n\n const element = el.closest('.dialog-inner') || el.closest('body');\n\n setNewContainer(element);\n }\n }, [container]);\n\n useEffect(() => {\n if(container instanceof Element){\n setNewContainer(container)\n }\n }, [container]);\n\n const handleClick = useCallback(\n (event: MouseEvent) => {\n if (\n styledComboBoxElementRef.current &&\n !styledComboBoxElementRef.current.contains(event.target as Node) &&\n contentRef.current &&\n !contentRef.current.contains(event.target as Node)\n ) {\n setIsAnimating(false);\n }\n },\n [styledComboBoxElementRef],\n );\n\n const handleOpen = useCallback(() => {\n if (styledComboBoxElementRef.current && newContainer) {\n const {\n left: comboBoxLeft,\n top: comboBoxTop,\n height,\n } = styledComboBoxElementRef.current.getBoundingClientRect();\n const { left: containerLeft, top: containerTop } = newContainer.getBoundingClientRect();\n\n const x = comboBoxLeft - containerLeft + newContainer.scrollLeft;\n const y = comboBoxTop - containerTop + newContainer.scrollTop;\n\n setInternalCoordinates({\n x,\n y: direction === ComboBoxDirection.TOP ? y : y + height,\n });\n\n setIsAnimating(true);\n }\n }, [newContainer, direction]);\n\n const handleClose = useCallback(() => {\n setIsAnimating(false);\n }, []);\n\n /**\n * This function adds an event listener to the document to close the combobox when the user clicks outside of it\n */\n useEffect(() => {\n document.addEventListener('click', handleClick);\n\n return () => {\n document.removeEventListener('click', handleClick);\n };\n }, [handleClick, styledComboBoxElementRef]);\n\n /**\n * This function sets the selected item\n */\n const handleSetSelectedItem = useCallback(\n (itemToSelect: IComboBoxItem) => {\n if (typeof onSelect === 'function') {\n const shouldPreventSelection = onSelect(itemToSelect) === false;\n\n if (shouldPreventSelection) return;\n }\n\n setInternalSelectedItem(itemToSelect);\n setIsAnimating(false);\n },\n [onSelect],\n );\n\n useEffect(() => {\n const currentContent = contentRef.current;\n\n if (portal && isAnimating && currentContent) {\n const scrollHeight = currentContent.scrollHeight ?? 0;\n\n const maxHeightInPixels = getMaxHeightInPixels(\n maxHeight,\n styledComboBoxElementRef.current ?? document.body,\n );\n\n setOverflowY(scrollHeight > maxHeightInPixels ? 'scroll' : 'hidden');\n }\n }, [isAnimating, maxHeight, portal]);\n\n useEffect(() => {\n const handleKeyDown = (e: KeyboardEvent) => {\n if (!isAnimating) {\n return;\n }\n\n if (e.key === 'ArrowUp' || e.key === 'ArrowDown') {\n e.preventDefault();\n const children = contentRef.current?.children;\n if (children && children.length > 0) {\n const newIndex =\n focusedIndex !== null\n ? (focusedIndex + (e.key === 'ArrowUp' ? -1 : 1) + children.length) %\n children.length\n : 0;\n\n if (focusedIndex !== null) {\n const prevElement = children[focusedIndex] as HTMLDivElement;\n prevElement.tabIndex = -1;\n }\n\n setFocusedIndex(newIndex);\n\n const newElement = children[newIndex] as HTMLDivElement;\n newElement.tabIndex = 0;\n newElement.focus();\n }\n } else if (e.key === 'Enter' && focusedIndex !== null) {\n const element = contentRef.current?.children[focusedIndex];\n\n if (!element) {\n return;\n }\n\n const { id } = element;\n\n let newSelectedItem: IComboBoxItem | undefined;\n\n lists.some((list) => {\n newSelectedItem = list.list.find(\n ({ value }) => String(value) === id.replace('combobox-item__', ''),\n );\n return !!newSelectedItem;\n });\n\n if (!newSelectedItem) {\n return;\n }\n\n handleSetSelectedItem(newSelectedItem);\n }\n };\n\n document.addEventListener('keydown', handleKeyDown);\n\n return () => {\n document.removeEventListener('keydown', handleKeyDown);\n };\n }, [focusedIndex, handleSetSelectedItem, isAnimating, lists]);\n\n /**\n * This function calculates the greatest width\n */\n useEffect(() => {\n const allItems = lists.flatMap((list) => list.list);\n const hasImage = [selectedItem, ...allItems].some(\n item => item?.imageUrl\n );\n const hasIcon = [selectedItem, ...allItems].some(\n item => item?.icons\n );\n\n const parentWidth =\n styledComboBoxElementRef.current?.parentElement?.getBoundingClientRect().width ?? 0;\n\n const paddingWidth = 45; // padding + border + arrow icon\n const imageWidth = hasImage ? 32 : 0; // image width + gap if images present\n const iconWidth = hasIcon ? 40 : 0; // icon width + gap if icons present\n\n let prefixWidth = 0;\n\n if (prefix) {\n const prefixTextWidth = calculateContentWidth([{ text: prefix, value: 'prefix' }]) + 5;\n\n prefixWidth = Math.max(prefixTextWidth, 32);\n }\n\n const baseWidth = calculateContentWidth([\n ...allItems,\n { text: placeholder, value: 'placeholder' },\n ...(selectedItem ? [selectedItem] : [])\n ]);\n\n const calculatedWidth = baseWidth + paddingWidth + imageWidth + iconWidth + prefixWidth;\n\n let tmpMinWidth = calculatedWidth;\n let tmpBodyMinWidth = calculatedWidth;\n\n // Full width settings\n if (shouldUseFullWidth) {\n tmpMinWidth = parentWidth;\n\n tmpBodyMinWidth =\n parentWidth < calculatedWidth - 20 ? calculatedWidth - 20 : parentWidth;\n }\n\n // Current item width settings\n else if (shouldUseCurrentItemWidth && internalSelectedItem) {\n const itemWidth =\n calculateContentWidth([internalSelectedItem]) +\n paddingWidth +\n imageWidth +\n iconWidth +\n prefixWidth;\n\n tmpMinWidth = itemWidth;\n\n tmpBodyMinWidth = itemWidth < calculatedWidth - 20 ? calculatedWidth - 20 : itemWidth;\n }\n\n setMinWidth(tmpMinWidth);\n setBodyMinWidth(tmpBodyMinWidth);\n }, [\n lists,\n placeholder,\n shouldUseFullWidth,\n shouldUseCurrentItemWidth,\n internalSelectedItem,\n prefix,\n ]);\n\n /**\n * This function sets the external selected item\n */\n useEffect(() => {\n setIsAnimating(false);\n setInternalSelectedItem(selectedItem);\n }, [selectedItem]);\n\n const placeholderImageUrl = useMemo(() => {\n if (selectedItem) {\n return selectedItem.imageUrl;\n }\n\n if (internalSelectedItem) {\n return internalSelectedItem.imageUrl;\n }\n\n return undefined;\n }, [internalSelectedItem, selectedItem]);\n\n const placeholderIcon = useMemo(() => {\n if (selectedItem) {\n return selectedItem.icons;\n }\n\n if (internalSelectedItem) {\n return internalSelectedItem.icons;\n }\n\n return undefined;\n }, [internalSelectedItem, selectedItem]);\n\n /**\n * This function resets the placeholder\n */\n const placeholderText = useMemo(() => {\n let text = placeholder;\n\n if (selectedItem) {\n text = selectedItem.text;\n } else if (internalSelectedItem) {\n text = internalSelectedItem.text;\n }\n\n return text;\n }, [internalSelectedItem, placeholder, selectedItem]);\n\n const shouldShowRoundPlaceholderImage = useMemo(() => {\n const selectedItemList = lists.find((list) =>\n list.list.some(\n ({ value }) => value === (selectedItem?.value ?? internalSelectedItem?.value),\n ),\n );\n\n return selectedItemList?.shouldShowRoundImage ?? shouldShowRoundImage;\n }, [internalSelectedItem?.value, lists, selectedItem?.value, shouldShowRoundImage]);\n\n /**\n * This function opens the content of the combobox\n */\n const handleHeaderClick = useCallback(() => {\n if (!isDisabled) {\n if (isAnimating) {\n handleClose();\n } else {\n handleOpen();\n }\n }\n }, [handleClose, handleOpen, isAnimating, isDisabled]);\n\n const comboBoxGroups = useMemo(\n () =>\n lists.map((list) => (\n <div key={list.groupName ?? 'default-group'}>\n {list.groupName && lists.length > 1 && (\n <StyledComboBoxTopic>{list.groupName}</StyledComboBoxTopic>\n )}\n {list.list.map((item) => (\n // ToDo: Cleanup this - item should be given as a prop to avoid full spreading\n <ComboBoxItem\n icons={item.icons}\n id={item.value}\n imageUrl={item.imageUrl}\n isDisabled={item.isDisabled}\n isSelected={selectedItem ? item.value === selectedItem.value : false}\n key={item.value}\n onSelect={handleSetSelectedItem}\n rightElement={item.rightElement}\n shouldShowBigImage={shouldShowBigImage}\n shouldShowRoundImage={list.shouldShowRoundImage ?? shouldShowRoundImage}\n subtext={item.subtext}\n suffixElement={item.suffixElement}\n text={item.text}\n value={item.value}\n textStyles={item.textStyles}\n />\n ))}\n </div>\n )),\n [handleSetSelectedItem, lists, selectedItem, shouldShowBigImage, shouldShowRoundImage],\n );\n\n const bodyStyles = useMemo(() => {\n let styles: CSSProperties = { left: internalCoordinates.x, top: internalCoordinates.y };\n\n if (direction === ComboBoxDirection.TOP) {\n styles = { ...styles, transform: 'translateY(-100%)' };\n }\n\n return styles;\n }, [direction, internalCoordinates.x, internalCoordinates.y]);\n\n useEffect(() => {\n if (!newContainer) {\n return;\n }\n\n setPortal(() =>\n createPortal(\n <AnimatePresence initial={false}>\n {isAnimating && (\n <StyledMotionComboBoxBody\n $browser={browser?.name}\n animate={{ height: 'fit-content', opacity: 1 }}\n $overflowY={overflowY}\n initial={{ height: 0, opacity: 0 }}\n exit={{ height: 0, opacity: 0 }}\n $maxHeight={maxHeight}\n $minWidth={bodyMinWidth}\n style={bodyStyles}\n $direction={direction}\n transition={{ duration: 0.2 }}\n tabIndex={0}\n ref={contentRef}\n >\n {comboBoxGroups}\n </StyledMotionComboBoxBody>\n )}\n </AnimatePresence>,\n newContainer,\n ),\n );\n }, [\n bodyMinWidth,\n bodyStyles,\n browser?.name,\n comboBoxGroups,\n newContainer,\n direction,\n isAnimating,\n maxHeight,\n minWidth,\n overflowY,\n ]);\n\n return useMemo(\n () => (\n <StyledComboBox\n ref={styledComboBoxElementRef}\n $minWidth={minWidth}\n $shouldUseFullWidth={shouldUseFullWidth}\n >\n <StyledComboBoxHeader\n $direction={direction}\n onClick={handleHeaderClick}\n $isOpen={isAnimating}\n $isTouch={isTouch}\n $isDisabled={isDisabled}\n $shouldChangeColor={shouldChangeColor}\n $shouldShowBigImage={shouldShowBigImage}\n >\n <StyledComboBoxPrefixAndPlaceholderWrapper>\n {prefix && <StyledComboBoxPrefix>{prefix}</StyledComboBoxPrefix>}\n {typeof inputValue === 'string' ? (\n <StyledComboBoxInput\n disabled={isDisabled}\n value={inputValue}\n onChange={onInputChange}\n onBlur={onInputBlur}\n onFocus={onInputFocus}\n placeholder={placeholderText}\n />\n ) : (\n <StyledComboBoxPlaceholder\n $shouldReduceOpacity={!selectedItem && !internalSelectedItem}\n >\n {placeholderImageUrl && (\n <StyledComboBoxPlaceholderImage\n src={placeholderImageUrl}\n $shouldShowBigImage={shouldShowBigImage}\n $shouldShowRoundImage={shouldShowRoundPlaceholderImage}\n />\n )}\n {placeholderIcon && <Icon icons={placeholderIcon} />}\n {placeholderText}\n {internalSelectedItem &&\n internalSelectedItem.suffixElement &&\n internalSelectedItem.suffixElement}\n </StyledComboBoxPlaceholder>\n )}\n </StyledComboBoxPrefixAndPlaceholderWrapper>\n <StyledComboBoxIconWrapper>\n <Icon icons={['fa fa-chevron-down']} />\n </StyledComboBoxIconWrapper>\n </StyledComboBoxHeader>\n {portal}\n </StyledComboBox>\n ),\n [\n minWidth,\n shouldUseFullWidth,\n direction,\n handleHeaderClick,\n isAnimating,\n isTouch,\n isDisabled,\n shouldChangeColor,\n shouldShowBigImage,\n prefix,\n inputValue,\n onInputChange,\n onInputBlur,\n onInputFocus,\n placeholderText,\n selectedItem,\n internalSelectedItem,\n placeholderImageUrl,\n shouldShowRoundPlaceholderImage,\n placeholderIcon,\n portal,\n ],\n );\n};\n\nComboBox.displayName = 'ComboBox';\n\nexport default ComboBox;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -43,6 +43,11 @@ const ContextMenu = /*#__PURE__*/forwardRef((_ref, ref) => {
|
|
|
43
43
|
setNewContainer(element);
|
|
44
44
|
}
|
|
45
45
|
}, [container]);
|
|
46
|
+
useEffect(() => {
|
|
47
|
+
if (container instanceof Element) {
|
|
48
|
+
setNewContainer(container);
|
|
49
|
+
}
|
|
50
|
+
}, [container]);
|
|
46
51
|
const handleHide = useCallback(() => {
|
|
47
52
|
setIsContentShown(false);
|
|
48
53
|
}, []);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ContextMenu.js","names":["createDialog","DialogType","AnimatePresence","React","forwardRef","useCallback","useEffect","useImperativeHandle","useRef","useState","createPortal","useUuid","ContextMenuAlignment","getIsTouch","Icon","ContextMenuContent","StyledContextMenu","ContextMenu","_ref","ref","alignment","children","createElement","icons","size","container","coordinates","isInDialog","items","onHide","onShow","shouldCloseOnPopupClick","internalCoordinates","setInternalCoordinates","x","y","newContainer","setNewContainer","internalAlignment","setInternalAlignment","TopLeft","isContentShown","setIsContentShown","portal","setPortal","uuid","contextMenuContentRef","contextMenuRef","current","el","element","closest","handleHide","handleShow","isTouch","result","type","SELECT","buttons","list","map","_ref2","index","text","name","id","icon","open","onClick","height","childrenHeight","left","childrenLeft","top","childrenTop","width","childrenWidth","getBoundingClientRect","window","scrollX","scrollY","BottomRight","TopRight","BottomLeft","handleClick","event","preventDefault","stopPropagation","handleDocumentClick","contains","target","hide","show","document","addEventListener","removeEventListener","initial","key","Fragment","className","displayName"],"sources":["../../../../src/components/context-menu/ContextMenu.tsx"],"sourcesContent":["import { createDialog, DialogType } from 'chayns-api';\nimport { AnimatePresence } from 'framer-motion';\nimport React, {\n forwardRef,\n MouseEvent,\n MouseEventHandler,\n ReactNode,\n ReactPortal,\n useCallback,\n useEffect,\n useImperativeHandle,\n useRef,\n useState,\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport { useUuid } from '../../hooks/uuid';\nimport { ContextMenuAlignment } from '../../types/contextMenu';\nimport { getIsTouch } from '../../utils/environment';\nimport Icon from '../icon/Icon';\nimport ContextMenuContent from './context-menu-content/ContextMenuContent';\nimport { StyledContextMenu } from './ContextMenu.styles';\n\nexport type ContextMenuCoordinates = {\n x: number;\n y: number;\n};\n\nexport type ContextMenuItem = {\n icons: string[];\n key: string;\n onClick: (event?: MouseEvent<HTMLDivElement>) => Promise<void> | void;\n text: string;\n};\n\nexport type ContextMenuRef = {\n hide: VoidFunction;\n show: VoidFunction;\n};\n\ntype ContextMenuProps = {\n /**\n * Optional custom alignment used instead of calculating it using the\n * alignment within the page. The available alignment can be taken from the\n * ContextMenuAlignment enum.\n */\n alignment?: ContextMenuAlignment;\n /**\n * The element over which the content of the `ContextMenu` should be displayed. The default is an ellipsis icon.\n */\n children?: ReactNode;\n /**\n * The element where the content of the `ContextMenu` should be rendered via React Portal.\n */\n container?: Element;\n /**\n * Optional own coordinates to be used instead of calculating the alignment\n * based on the alignment of the children.\n */\n coordinates?: ContextMenuCoordinates;\n /**\n * Whether the ContextMenu is inside a dialog.\n */\n isInDialog?: boolean;\n /**\n * The items that will be displayed in the content of the `ContextMenu`.\n */\n items: ContextMenuItem[];\n /**\n * Function to be executed when the content of the Context menu has been hidden.\n */\n onHide?: VoidFunction;\n /**\n * Function to be executed when the content of the Context menu has been shown.\n */\n onShow?: VoidFunction;\n /**\n * Whether the popup should be closed if its clicked.\n */\n shouldCloseOnPopupClick?: boolean;\n};\n\ninterface SelectDialogResult {\n buttonType: number;\n result: number[];\n}\n\nconst ContextMenu = forwardRef<ContextMenuRef, ContextMenuProps>(\n (\n {\n alignment,\n children = <Icon icons={['ts-ellipsis_v']} size={18} />,\n container,\n coordinates,\n isInDialog = false,\n items,\n onHide,\n onShow,\n shouldCloseOnPopupClick = true,\n },\n ref,\n ) => {\n const [internalCoordinates, setInternalCoordinates] = useState<ContextMenuCoordinates>({\n x: 0,\n y: 0,\n });\n const [newContainer, setNewContainer] = useState<Element | null>(container ?? null);\n\n const [internalAlignment, setInternalAlignment] = useState<ContextMenuAlignment>(\n ContextMenuAlignment.TopLeft,\n );\n\n const [isContentShown, setIsContentShown] = useState(false);\n const [portal, setPortal] = useState<ReactPortal>();\n\n const uuid = useUuid();\n\n // ToDo: Replace with hook if new chayns api is ready\n const contextMenuContentRef = useRef<HTMLDivElement>(null);\n const contextMenuRef = useRef<HTMLSpanElement>(null);\n\n useEffect(() => {\n if (contextMenuRef.current && !container) {\n const el = contextMenuRef.current as HTMLElement;\n\n const element =\n el.closest('.dialog-inner') ||\n el.closest('.page-provider') ||\n el.closest('.tapp') ||\n el.closest('body');\n\n setNewContainer(element);\n }\n }, [container]);\n\n const handleHide = useCallback(() => {\n setIsContentShown(false);\n }, []);\n\n const handleShow = useCallback(async () => {\n const isTouch = getIsTouch();\n\n if (isTouch) {\n const { result } = (await createDialog({\n type: DialogType.SELECT,\n buttons: [],\n list: items.map(({ icons, text }, index) => ({\n name: text,\n id: index,\n icon: icons[0],\n })),\n }).open()) as SelectDialogResult;\n\n if (result && typeof result[0] === 'number') {\n void items[result[0]]?.onClick();\n }\n } else if (contextMenuRef.current) {\n if (!newContainer) {\n return;\n }\n\n const {\n height: childrenHeight,\n left: childrenLeft,\n top: childrenTop,\n width: childrenWidth,\n } = contextMenuRef.current.getBoundingClientRect();\n\n const { height, width, top, left } = newContainer.getBoundingClientRect();\n\n const x =\n childrenLeft + (isInDialog ? 0 : window.scrollX) + childrenWidth / 2 - left;\n const y =\n childrenTop + (isInDialog ? 0 : window.scrollY) + childrenHeight / 2 - top;\n\n setInternalCoordinates({ x, y });\n\n if (x < width / 2) {\n if (y < height / 2) {\n setInternalAlignment(ContextMenuAlignment.BottomRight);\n } else {\n setInternalAlignment(ContextMenuAlignment.TopRight);\n }\n } else if (y < height / 2) {\n setInternalAlignment(ContextMenuAlignment.BottomLeft);\n } else {\n setInternalAlignment(ContextMenuAlignment.TopLeft);\n }\n\n setIsContentShown(true);\n }\n }, [isInDialog, items, newContainer]);\n\n const handleClick = useCallback<MouseEventHandler<HTMLDivElement>>(\n (event) => {\n event.preventDefault();\n event.stopPropagation();\n\n void handleShow();\n },\n [handleShow],\n );\n\n const handleDocumentClick = useCallback<EventListener>(\n (event) => {\n if (\n !shouldCloseOnPopupClick &&\n contextMenuContentRef.current?.contains(event.target as Node)\n ) {\n return;\n }\n\n handleHide();\n },\n [handleHide, shouldCloseOnPopupClick],\n );\n\n useImperativeHandle(\n ref,\n () => ({\n hide: handleHide,\n show: handleShow,\n }),\n [handleHide, handleShow],\n );\n\n useEffect(() => {\n if (isContentShown) {\n document.addEventListener('click', handleDocumentClick, true);\n window.addEventListener('blur', handleHide);\n\n if (typeof onShow === 'function') {\n onShow();\n }\n } else if (typeof onHide === 'function') {\n onHide();\n }\n\n return () => {\n document.removeEventListener('click', handleDocumentClick, true);\n window.removeEventListener('blur', handleHide);\n };\n }, [handleDocumentClick, handleHide, isContentShown, onHide, onShow]);\n\n useEffect(() => {\n if (!newContainer) {\n return;\n }\n\n setPortal(() =>\n createPortal(\n <AnimatePresence initial={false}>\n {isContentShown && (\n <ContextMenuContent\n coordinates={coordinates ?? internalCoordinates}\n items={items}\n key={`contextMenu_${uuid}`}\n alignment={alignment ?? internalAlignment}\n ref={contextMenuContentRef}\n />\n )}\n </AnimatePresence>,\n newContainer,\n ),\n );\n }, [\n alignment,\n newContainer,\n coordinates,\n internalAlignment,\n internalCoordinates,\n isContentShown,\n items,\n uuid,\n ]);\n\n return (\n <>\n <StyledContextMenu\n className=\"beta-chayns-context-menu\"\n onClick={handleClick}\n ref={contextMenuRef}\n >\n {children}\n </StyledContextMenu>\n {portal}\n </>\n );\n },\n);\n\nContextMenu.displayName = 'ContextMenu';\n\nexport default ContextMenu;\n"],"mappings":"AAAA,SAASA,YAAY,EAAEC,UAAU,QAAQ,YAAY;AACrD,SAASC,eAAe,QAAQ,eAAe;AAC/C,OAAOC,KAAK,IACRC,UAAU,EAKVC,WAAW,EACXC,SAAS,EACTC,mBAAmB,EACnBC,MAAM,EACNC,QAAQ,QACL,OAAO;AACd,SAASC,YAAY,QAAQ,WAAW;AACxC,SAASC,OAAO,QAAQ,kBAAkB;AAC1C,SAASC,oBAAoB,QAAQ,yBAAyB;AAC9D,SAASC,UAAU,QAAQ,yBAAyB;AACpD,OAAOC,IAAI,MAAM,cAAc;AAC/B,OAAOC,kBAAkB,MAAM,2CAA2C;AAC1E,SAASC,iBAAiB,QAAQ,sBAAsB;AAkExD,MAAMC,WAAW,gBAAGb,UAAU,CAC1B,CAAAc,IAAA,EAYIC,GAAG,KACF;EAAA,IAZD;IACIC,SAAS;IACTC,QAAQ,gBAAGlB,KAAA,CAAAmB,aAAA,CAACR,IAAI;MAACS,KAAK,EAAE,CAAC,eAAe,CAAE;MAACC,IAAI,EAAE;IAAG,CAAE,CAAC;IACvDC,SAAS;IACTC,WAAW;IACXC,UAAU,GAAG,KAAK;IAClBC,KAAK;IACLC,MAAM;IACNC,MAAM;IACNC,uBAAuB,GAAG;EAC9B,CAAC,GAAAb,IAAA;EAGD,MAAM,CAACc,mBAAmB,EAAEC,sBAAsB,CAAC,GAAGxB,QAAQ,CAAyB;IACnFyB,CAAC,EAAE,CAAC;IACJC,CAAC,EAAE;EACP,CAAC,CAAC;EACF,MAAM,CAACC,YAAY,EAAEC,eAAe,CAAC,GAAG5B,QAAQ,CAAiBgB,SAAS,IAAI,IAAI,CAAC;EAEnF,MAAM,CAACa,iBAAiB,EAAEC,oBAAoB,CAAC,GAAG9B,QAAQ,CACtDG,oBAAoB,CAAC4B,OACzB,CAAC;EAED,MAAM,CAACC,cAAc,EAAEC,iBAAiB,CAAC,GAAGjC,QAAQ,CAAC,KAAK,CAAC;EAC3D,MAAM,CAACkC,MAAM,EAAEC,SAAS,CAAC,GAAGnC,QAAQ,CAAc,CAAC;EAEnD,MAAMoC,IAAI,GAAGlC,OAAO,CAAC,CAAC;;EAEtB;EACA,MAAMmC,qBAAqB,GAAGtC,MAAM,CAAiB,IAAI,CAAC;EAC1D,MAAMuC,cAAc,GAAGvC,MAAM,CAAkB,IAAI,CAAC;EAEpDF,SAAS,CAAC,MAAM;IACZ,IAAIyC,cAAc,CAACC,OAAO,IAAI,CAACvB,SAAS,EAAE;MACtC,MAAMwB,EAAE,GAAGF,cAAc,CAACC,OAAsB;MAEhD,MAAME,OAAO,GACTD,EAAE,CAACE,OAAO,CAAC,eAAe,CAAC,IAC3BF,EAAE,CAACE,OAAO,CAAC,gBAAgB,CAAC,IAC5BF,EAAE,CAACE,OAAO,CAAC,OAAO,CAAC,IACnBF,EAAE,CAACE,OAAO,CAAC,MAAM,CAAC;MAEtBd,eAAe,CAACa,OAAO,CAAC;IAC5B;EACJ,CAAC,EAAE,CAACzB,SAAS,CAAC,CAAC;EAEf,MAAM2B,UAAU,GAAG/C,WAAW,CAAC,MAAM;IACjCqC,iBAAiB,CAAC,KAAK,CAAC;EAC5B,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMW,UAAU,GAAGhD,WAAW,CAAC,YAAY;IACvC,MAAMiD,OAAO,GAAGzC,UAAU,CAAC,CAAC;IAE5B,IAAIyC,OAAO,EAAE;MACT,MAAM;QAAEC;MAAO,CAAC,GAAI,MAAMvD,YAAY,CAAC;QACnCwD,IAAI,EAAEvD,UAAU,CAACwD,MAAM;QACvBC,OAAO,EAAE,EAAE;QACXC,IAAI,EAAE/B,KAAK,CAACgC,GAAG,CAAC,CAAAC,KAAA,EAAkBC,KAAK;UAAA,IAAtB;YAAEvC,KAAK;YAAEwC;UAAK,CAAC,GAAAF,KAAA;UAAA,OAAa;YACzCG,IAAI,EAAED,IAAI;YACVE,EAAE,EAAEH,KAAK;YACTI,IAAI,EAAE3C,KAAK,CAAC,CAAC;UACjB,CAAC;QAAA,CAAC;MACN,CAAC,CAAC,CAAC4C,IAAI,CAAC,CAAwB;MAEhC,IAAIZ,MAAM,IAAI,OAAOA,MAAM,CAAC,CAAC,CAAC,KAAK,QAAQ,EAAE;QACzC,KAAK3B,KAAK,CAAC2B,MAAM,CAAC,CAAC,CAAC,CAAC,EAAEa,OAAO,CAAC,CAAC;MACpC;IACJ,CAAC,MAAM,IAAIrB,cAAc,CAACC,OAAO,EAAE;MAC/B,IAAI,CAACZ,YAAY,EAAE;QACf;MACJ;MAEA,MAAM;QACFiC,MAAM,EAAEC,cAAc;QACtBC,IAAI,EAAEC,YAAY;QAClBC,GAAG,EAAEC,WAAW;QAChBC,KAAK,EAAEC;MACX,CAAC,GAAG7B,cAAc,CAACC,OAAO,CAAC6B,qBAAqB,CAAC,CAAC;MAElD,MAAM;QAAER,MAAM;QAAEM,KAAK;QAAEF,GAAG;QAAEF;MAAK,CAAC,GAAGnC,YAAY,CAACyC,qBAAqB,CAAC,CAAC;MAEzE,MAAM3C,CAAC,GACHsC,YAAY,IAAI7C,UAAU,GAAG,CAAC,GAAGmD,MAAM,CAACC,OAAO,CAAC,GAAGH,aAAa,GAAG,CAAC,GAAGL,IAAI;MAC/E,MAAMpC,CAAC,GACHuC,WAAW,IAAI/C,UAAU,GAAG,CAAC,GAAGmD,MAAM,CAACE,OAAO,CAAC,GAAGV,cAAc,GAAG,CAAC,GAAGG,GAAG;MAE9ExC,sBAAsB,CAAC;QAAEC,CAAC;QAAEC;MAAE,CAAC,CAAC;MAEhC,IAAID,CAAC,GAAGyC,KAAK,GAAG,CAAC,EAAE;QACf,IAAIxC,CAAC,GAAGkC,MAAM,GAAG,CAAC,EAAE;UAChB9B,oBAAoB,CAAC3B,oBAAoB,CAACqE,WAAW,CAAC;QAC1D,CAAC,MAAM;UACH1C,oBAAoB,CAAC3B,oBAAoB,CAACsE,QAAQ,CAAC;QACvD;MACJ,CAAC,MAAM,IAAI/C,CAAC,GAAGkC,MAAM,GAAG,CAAC,EAAE;QACvB9B,oBAAoB,CAAC3B,oBAAoB,CAACuE,UAAU,CAAC;MACzD,CAAC,MAAM;QACH5C,oBAAoB,CAAC3B,oBAAoB,CAAC4B,OAAO,CAAC;MACtD;MAEAE,iBAAiB,CAAC,IAAI,CAAC;IAC3B;EACJ,CAAC,EAAE,CAACf,UAAU,EAAEC,KAAK,EAAEQ,YAAY,CAAC,CAAC;EAErC,MAAMgD,WAAW,GAAG/E,WAAW,CAC1BgF,KAAK,IAAK;IACPA,KAAK,CAACC,cAAc,CAAC,CAAC;IACtBD,KAAK,CAACE,eAAe,CAAC,CAAC;IAEvB,KAAKlC,UAAU,CAAC,CAAC;EACrB,CAAC,EACD,CAACA,UAAU,CACf,CAAC;EAED,MAAMmC,mBAAmB,GAAGnF,WAAW,CAClCgF,KAAK,IAAK;IACP,IACI,CAACtD,uBAAuB,IACxBe,qBAAqB,CAACE,OAAO,EAAEyC,QAAQ,CAACJ,KAAK,CAACK,MAAc,CAAC,EAC/D;MACE;IACJ;IAEAtC,UAAU,CAAC,CAAC;EAChB,CAAC,EACD,CAACA,UAAU,EAAErB,uBAAuB,CACxC,CAAC;EAEDxB,mBAAmB,CACfY,GAAG,EACH,OAAO;IACHwE,IAAI,EAAEvC,UAAU;IAChBwC,IAAI,EAAEvC;EACV,CAAC,CAAC,EACF,CAACD,UAAU,EAAEC,UAAU,CAC3B,CAAC;EAED/C,SAAS,CAAC,MAAM;IACZ,IAAImC,cAAc,EAAE;MAChBoD,QAAQ,CAACC,gBAAgB,CAAC,OAAO,EAAEN,mBAAmB,EAAE,IAAI,CAAC;MAC7DV,MAAM,CAACgB,gBAAgB,CAAC,MAAM,EAAE1C,UAAU,CAAC;MAE3C,IAAI,OAAOtB,MAAM,KAAK,UAAU,EAAE;QAC9BA,MAAM,CAAC,CAAC;MACZ;IACJ,CAAC,MAAM,IAAI,OAAOD,MAAM,KAAK,UAAU,EAAE;MACrCA,MAAM,CAAC,CAAC;IACZ;IAEA,OAAO,MAAM;MACTgE,QAAQ,CAACE,mBAAmB,CAAC,OAAO,EAAEP,mBAAmB,EAAE,IAAI,CAAC;MAChEV,MAAM,CAACiB,mBAAmB,CAAC,MAAM,EAAE3C,UAAU,CAAC;IAClD,CAAC;EACL,CAAC,EAAE,CAACoC,mBAAmB,EAAEpC,UAAU,EAAEX,cAAc,EAAEZ,MAAM,EAAEC,MAAM,CAAC,CAAC;EAErExB,SAAS,CAAC,MAAM;IACZ,IAAI,CAAC8B,YAAY,EAAE;MACf;IACJ;IAEAQ,SAAS,CAAC,mBACNlC,YAAY,cACRP,KAAA,CAAAmB,aAAA,CAACpB,eAAe;MAAC8F,OAAO,EAAE;IAAM,GAC3BvD,cAAc,iBACXtC,KAAA,CAAAmB,aAAA,CAACP,kBAAkB;MACfW,WAAW,EAAEA,WAAW,IAAIM,mBAAoB;MAChDJ,KAAK,EAAEA,KAAM;MACbqE,GAAG,EAAE,eAAepD,IAAI,EAAG;MAC3BzB,SAAS,EAAEA,SAAS,IAAIkB,iBAAkB;MAC1CnB,GAAG,EAAE2B;IAAsB,CAC9B,CAEQ,CAAC,EAClBV,YACJ,CACJ,CAAC;EACL,CAAC,EAAE,CACChB,SAAS,EACTgB,YAAY,EACZV,WAAW,EACXY,iBAAiB,EACjBN,mBAAmB,EACnBS,cAAc,EACdb,KAAK,EACLiB,IAAI,CACP,CAAC;EAEF,oBACI1C,KAAA,CAAAmB,aAAA,CAAAnB,KAAA,CAAA+F,QAAA,qBACI/F,KAAA,CAAAmB,aAAA,CAACN,iBAAiB;IACdmF,SAAS,EAAC,0BAA0B;IACpC/B,OAAO,EAAEgB,WAAY;IACrBjE,GAAG,EAAE4B;EAAe,GAEnB1B,QACc,CAAC,EACnBsB,MACH,CAAC;AAEX,CACJ,CAAC;AAED1B,WAAW,CAACmF,WAAW,GAAG,aAAa;AAEvC,eAAenF,WAAW","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"ContextMenu.js","names":["createDialog","DialogType","AnimatePresence","React","forwardRef","useCallback","useEffect","useImperativeHandle","useRef","useState","createPortal","useUuid","ContextMenuAlignment","getIsTouch","Icon","ContextMenuContent","StyledContextMenu","ContextMenu","_ref","ref","alignment","children","createElement","icons","size","container","coordinates","isInDialog","items","onHide","onShow","shouldCloseOnPopupClick","internalCoordinates","setInternalCoordinates","x","y","newContainer","setNewContainer","internalAlignment","setInternalAlignment","TopLeft","isContentShown","setIsContentShown","portal","setPortal","uuid","contextMenuContentRef","contextMenuRef","current","el","element","closest","Element","handleHide","handleShow","isTouch","result","type","SELECT","buttons","list","map","_ref2","index","text","name","id","icon","open","onClick","height","childrenHeight","left","childrenLeft","top","childrenTop","width","childrenWidth","getBoundingClientRect","window","scrollX","scrollY","BottomRight","TopRight","BottomLeft","handleClick","event","preventDefault","stopPropagation","handleDocumentClick","contains","target","hide","show","document","addEventListener","removeEventListener","initial","key","Fragment","className","displayName"],"sources":["../../../../src/components/context-menu/ContextMenu.tsx"],"sourcesContent":["import { createDialog, DialogType } from 'chayns-api';\nimport { AnimatePresence } from 'framer-motion';\nimport React, {\n forwardRef,\n MouseEvent,\n MouseEventHandler,\n ReactNode,\n ReactPortal,\n useCallback,\n useEffect,\n useImperativeHandle,\n useRef,\n useState,\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport { useUuid } from '../../hooks/uuid';\nimport { ContextMenuAlignment } from '../../types/contextMenu';\nimport { getIsTouch } from '../../utils/environment';\nimport Icon from '../icon/Icon';\nimport ContextMenuContent from './context-menu-content/ContextMenuContent';\nimport { StyledContextMenu } from './ContextMenu.styles';\n\nexport type ContextMenuCoordinates = {\n x: number;\n y: number;\n};\n\nexport type ContextMenuItem = {\n icons: string[];\n key: string;\n onClick: (event?: MouseEvent<HTMLDivElement>) => Promise<void> | void;\n text: string;\n};\n\nexport type ContextMenuRef = {\n hide: VoidFunction;\n show: VoidFunction;\n};\n\ntype ContextMenuProps = {\n /**\n * Optional custom alignment used instead of calculating it using the\n * alignment within the page. The available alignment can be taken from the\n * ContextMenuAlignment enum.\n */\n alignment?: ContextMenuAlignment;\n /**\n * The element over which the content of the `ContextMenu` should be displayed. The default is an ellipsis icon.\n */\n children?: ReactNode;\n /**\n * The element where the content of the `ContextMenu` should be rendered via React Portal.\n */\n container?: Element;\n /**\n * Optional own coordinates to be used instead of calculating the alignment\n * based on the alignment of the children.\n */\n coordinates?: ContextMenuCoordinates;\n /**\n * Whether the ContextMenu is inside a dialog.\n */\n isInDialog?: boolean;\n /**\n * The items that will be displayed in the content of the `ContextMenu`.\n */\n items: ContextMenuItem[];\n /**\n * Function to be executed when the content of the Context menu has been hidden.\n */\n onHide?: VoidFunction;\n /**\n * Function to be executed when the content of the Context menu has been shown.\n */\n onShow?: VoidFunction;\n /**\n * Whether the popup should be closed if its clicked.\n */\n shouldCloseOnPopupClick?: boolean;\n};\n\ninterface SelectDialogResult {\n buttonType: number;\n result: number[];\n}\n\nconst ContextMenu = forwardRef<ContextMenuRef, ContextMenuProps>(\n (\n {\n alignment,\n children = <Icon icons={['ts-ellipsis_v']} size={18} />,\n container,\n coordinates,\n isInDialog = false,\n items,\n onHide,\n onShow,\n shouldCloseOnPopupClick = true,\n },\n ref,\n ) => {\n const [internalCoordinates, setInternalCoordinates] = useState<ContextMenuCoordinates>({\n x: 0,\n y: 0,\n });\n const [newContainer, setNewContainer] = useState<Element | null>(container ?? null);\n\n const [internalAlignment, setInternalAlignment] = useState<ContextMenuAlignment>(\n ContextMenuAlignment.TopLeft,\n );\n\n const [isContentShown, setIsContentShown] = useState(false);\n const [portal, setPortal] = useState<ReactPortal>();\n\n const uuid = useUuid();\n\n // ToDo: Replace with hook if new chayns api is ready\n const contextMenuContentRef = useRef<HTMLDivElement>(null);\n const contextMenuRef = useRef<HTMLSpanElement>(null);\n\n useEffect(() => {\n if (contextMenuRef.current && !container) {\n const el = contextMenuRef.current as HTMLElement;\n\n const element =\n el.closest('.dialog-inner') ||\n el.closest('.page-provider') ||\n el.closest('.tapp') ||\n el.closest('body');\n\n setNewContainer(element);\n }\n }, [container]);\n\n useEffect(() => {\n if(container instanceof Element){\n setNewContainer(container)\n }\n }, [container]);\n\n const handleHide = useCallback(() => {\n setIsContentShown(false);\n }, []);\n\n const handleShow = useCallback(async () => {\n const isTouch = getIsTouch();\n\n if (isTouch) {\n const { result } = (await createDialog({\n type: DialogType.SELECT,\n buttons: [],\n list: items.map(({ icons, text }, index) => ({\n name: text,\n id: index,\n icon: icons[0],\n })),\n }).open()) as SelectDialogResult;\n\n if (result && typeof result[0] === 'number') {\n void items[result[0]]?.onClick();\n }\n } else if (contextMenuRef.current) {\n if (!newContainer) {\n return;\n }\n\n const {\n height: childrenHeight,\n left: childrenLeft,\n top: childrenTop,\n width: childrenWidth,\n } = contextMenuRef.current.getBoundingClientRect();\n\n const { height, width, top, left } = newContainer.getBoundingClientRect();\n\n const x =\n childrenLeft + (isInDialog ? 0 : window.scrollX) + childrenWidth / 2 - left;\n const y =\n childrenTop + (isInDialog ? 0 : window.scrollY) + childrenHeight / 2 - top;\n\n setInternalCoordinates({ x, y });\n\n if (x < width / 2) {\n if (y < height / 2) {\n setInternalAlignment(ContextMenuAlignment.BottomRight);\n } else {\n setInternalAlignment(ContextMenuAlignment.TopRight);\n }\n } else if (y < height / 2) {\n setInternalAlignment(ContextMenuAlignment.BottomLeft);\n } else {\n setInternalAlignment(ContextMenuAlignment.TopLeft);\n }\n\n setIsContentShown(true);\n }\n }, [isInDialog, items, newContainer]);\n\n const handleClick = useCallback<MouseEventHandler<HTMLDivElement>>(\n (event) => {\n event.preventDefault();\n event.stopPropagation();\n\n void handleShow();\n },\n [handleShow],\n );\n\n const handleDocumentClick = useCallback<EventListener>(\n (event) => {\n if (\n !shouldCloseOnPopupClick &&\n contextMenuContentRef.current?.contains(event.target as Node)\n ) {\n return;\n }\n\n handleHide();\n },\n [handleHide, shouldCloseOnPopupClick],\n );\n\n useImperativeHandle(\n ref,\n () => ({\n hide: handleHide,\n show: handleShow,\n }),\n [handleHide, handleShow],\n );\n\n useEffect(() => {\n if (isContentShown) {\n document.addEventListener('click', handleDocumentClick, true);\n window.addEventListener('blur', handleHide);\n\n if (typeof onShow === 'function') {\n onShow();\n }\n } else if (typeof onHide === 'function') {\n onHide();\n }\n\n return () => {\n document.removeEventListener('click', handleDocumentClick, true);\n window.removeEventListener('blur', handleHide);\n };\n }, [handleDocumentClick, handleHide, isContentShown, onHide, onShow]);\n\n useEffect(() => {\n if (!newContainer) {\n return;\n }\n\n setPortal(() =>\n createPortal(\n <AnimatePresence initial={false}>\n {isContentShown && (\n <ContextMenuContent\n coordinates={coordinates ?? internalCoordinates}\n items={items}\n key={`contextMenu_${uuid}`}\n alignment={alignment ?? internalAlignment}\n ref={contextMenuContentRef}\n />\n )}\n </AnimatePresence>,\n newContainer,\n ),\n );\n }, [\n alignment,\n newContainer,\n coordinates,\n internalAlignment,\n internalCoordinates,\n isContentShown,\n items,\n uuid,\n ]);\n\n return (\n <>\n <StyledContextMenu\n className=\"beta-chayns-context-menu\"\n onClick={handleClick}\n ref={contextMenuRef}\n >\n {children}\n </StyledContextMenu>\n {portal}\n </>\n );\n },\n);\n\nContextMenu.displayName = 'ContextMenu';\n\nexport default ContextMenu;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -45,6 +45,11 @@ const Popup = /*#__PURE__*/forwardRef((_ref, ref) => {
|
|
|
45
45
|
setNewContainer(element);
|
|
46
46
|
}
|
|
47
47
|
}, [container]);
|
|
48
|
+
useEffect(() => {
|
|
49
|
+
if (container instanceof Element) {
|
|
50
|
+
setNewContainer(container);
|
|
51
|
+
}
|
|
52
|
+
}, [container]);
|
|
48
53
|
const measureHeight = () => {
|
|
49
54
|
if (popupPseudoContentRef.current) {
|
|
50
55
|
const height = popupPseudoContentRef.current.offsetHeight;
|