npm - @chayns-components/core - Versions diffs - 5.0.0-beta.719 → 5.0.0-beta.721 - Mend

@chayns-components/core 5.0.0-beta.719 → 5.0.0-beta.721

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (23) hide show

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

	@@ -1 +1 @@
1	- {"version":3,"file":"ComboBox.js","names":["useDevice","AnimatePresence","React","useCallback","useEffect","useMemo","useRef","useState","createPortal","ComboBoxDirection","calculateContentHeight","calculateContentWidth","getMaxHeightInPixels","getIsTouch","Icon","ComboBoxItem","StyledComboBoxTopic","StyledComboBox","StyledComboBoxHeader","StyledComboBoxIconWrapper","StyledComboBoxPlaceholder","StyledComboBoxPlaceholderImage","StyledMotionComboBoxBody","ComboBox","_ref","direction","BOTTOM","isDisabled","lists","maxHeight","onSelect","placeholder","container","document","body","selectedItem","shouldShowRoundImage","shouldUseFullWidth","item","setItem","isAnimating","setIsAnimating","minWidth","setMinWidth","focusedIndex","setFocusedIndex","overflowY","setOverflowY","portal","setPortal","internalCoordinates","setInternalCoordinates","x","y","styledComboBoxElementRef","contentRef","browser","isTouch","handleClick","event","current","contains","target","handleOpen","height","getBoundingClientRect","TOP","handleClose","addEventListener","removeEventListener","handleSetSelectedItem","itemToSelect","handleKeyDown","e","key","preventDefault","children","length","newIndex","prevElement","tabIndex","newElement","focus","element","id","newSelectedItem","some","list","find","_ref2","value","String","replace","allItems","flatMap","isAtLeastOneItemWithImageGiven","_ref3","imageUrl","isAtLeastOneItemWithIconGiven","_ref4","icons","textArray","map","_ref5","text","contentHeight","maxHeightInPixels","push","width","placeholderImageUrl","undefined","placeholderIcon","placeholderText","handleHeaderClick","comboBoxGroups","_ref6","groupName","createElement","_ref7","suffixElement","isSelected","bodyStyles","styles","left","top","transform","initial","$browser","name","animate","opacity","$overflowY","exit","$maxHeight","$minWidth","style","$direction","transition","duration","ref","$shouldUseFullWidth","onClick","$isOpen","$isTouch","$isDisabled","src","displayName"],"sources":["../../../../src/components/combobox/ComboBox.tsx"],"sourcesContent":["import { useDevice } from 'chayns-api';\nimport { AnimatePresence } from 'framer-motion';\nimport React, {\n FC,\n ReactPortal,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n type CSSProperties,\n type ReactNode,\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport { ComboBoxDirection } from '../../types/comboBox';\nimport {\n calculateContentHeight,\n calculateContentWidth,\n getMaxHeightInPixels,\n} from '../../utils/calculate';\nimport { getIsTouch } from '../../utils/environment';\nimport type { ContextMenuCoordinates } from '../context-menu/ContextMenu';\nimport Icon from '../icon/Icon';\nimport ComboBoxItem from './combobox-item/ComboBoxItem';\nimport { StyledComboBoxTopic } from './combobox-item/ComboBoxItem.styles';\nimport {\n StyledComboBox,\n StyledComboBoxHeader,\n StyledComboBoxIconWrapper,\n StyledComboBoxPlaceholder,\n StyledComboBoxPlaceholderImage,\n StyledMotionComboBoxBody,\n} from './ComboBox.styles';\n\nexport interface IComboBoxItems {\n groupName?: string;\n list: Array<IComboBoxItem>;\n}\n\nexport interface IComboBoxItem {\n icons?: string[];\n imageUrl?: string;\n suffixElement?: ReactNode;\n text: string;\n value: string \| number;\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 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 that should be executed when an item is selected.\n /\n onSelect?: (comboboxItem: IComboBoxItem) => void;\n /\n A text that should be displayed when no item is selected.\n /\n placeholder: string;\n /\n An item that should be preselected.\n /\n selectedItem?: IComboBoxItem;\n /\n If true, the images of the items are displayed in a round shape.\n /\n shouldShowRoundImage?: boolean;\n /\n Whether the width of the 'ComboBox' should be the width of the parent or of the widest item.\n /\n shouldUseFullWidth?: boolean;\n};\n\nconst ComboBox: FC<ComboBoxProps> = ({\n direction = ComboBoxDirection.BOTTOM,\n isDisabled = false,\n lists,\n maxHeight = '280px',\n onSelect,\n placeholder,\n container = document.body,\n selectedItem,\n shouldShowRoundImage,\n shouldUseFullWidth = false,\n}) => {\n const [item, setItem] = useState<IComboBoxItem>();\n const [isAnimating, setIsAnimating] = useState(false);\n const [minWidth, setMinWidth] = useState(0);\n const [focusedIndex, setFocusedIndex] = useState<number \| null>(null);\n const [overflowY, setOverflowY] = useState<CSSProperties['overflowY']>('hidden');\n const [portal, setPortal] = useState<ReactPortal>();\n const [internalCoordinates, setInternalCoordinates] = useState<ContextMenuCoordinates>({\n x: 0,\n y: 0,\n });\n\n const styledComboBoxElementRef = useRef<HTMLDivElement>(null);\n const contentRef = useRef<HTMLDivElement \| null>(null);\n\n const { browser } = useDevice();\n\n const isTouch = getIsTouch();\n\n const handleClick = useCallback(\n (event: MouseEvent) => {\n if (\n styledComboBoxElementRef.current &&\n !styledComboBoxElementRef.current.contains(event.target as Node)\n ) {\n setIsAnimating(false);\n }\n },\n [styledComboBoxElementRef],\n );\n\n const handleOpen = useCallback(() => {\n if (styledComboBoxElementRef.current) {\n const { x, y, height } = styledComboBoxElementRef.current.getBoundingClientRect();\n\n setInternalCoordinates({\n x,\n y: direction === ComboBoxDirection.TOP ? y : y + height,\n });\n\n setIsAnimating(true);\n }\n }, [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 setItem(itemToSelect);\n setIsAnimating(false);\n\n if (onSelect) {\n onSelect(itemToSelect);\n }\n },\n [onSelect],\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 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\n const isAtLeastOneItemWithImageGiven = allItems.some(({ imageUrl }) => imageUrl);\n const isAtLeastOneItemWithIconGiven = allItems.some(({ icons }) => icons);\n\n const textArray = allItems?.map(({ text }) => text);\n\n const contentHeight = calculateContentHeight(textArray);\n\n const maxHeightInPixels = getMaxHeightInPixels(\n maxHeight,\n styledComboBoxElementRef.current ?? document.body,\n );\n\n setOverflowY(contentHeight > maxHeightInPixels ? 'scroll' : 'hidden');\n\n textArray.push(placeholder);\n\n const width = styledComboBoxElementRef.current?.getBoundingClientRect().width ?? 0;\n\n // 45px = padding left + padding right + border left + border right + arrow icon width + arrow icon margin left\n // 32px = image width + flex gap\n // 40px = icon width + flex gap\n setMinWidth(\n shouldUseFullWidth\n ? width\n : calculateContentWidth([\n ...allItems,\n { text: placeholder, value: 'placeholder' },\n ]) +\n 45 +\n (isAtLeastOneItemWithImageGiven ? 32 : 0) +\n (isAtLeastOneItemWithIconGiven ? 40 : 0),\n );\n }, [lists, maxHeight, placeholder, shouldUseFullWidth]);\n\n /\n This function sets the external selected item\n /\n useEffect(() => {\n setIsAnimating(false);\n setItem(selectedItem);\n }, [selectedItem]);\n\n const placeholderImageUrl = useMemo(() => {\n if (selectedItem) {\n return selectedItem.imageUrl;\n }\n\n if (item) {\n return item.imageUrl;\n }\n\n return undefined;\n }, [item, selectedItem]);\n\n const placeholderIcon = useMemo(() => {\n if (selectedItem) {\n return selectedItem.icons;\n }\n\n if (item) {\n return item.icons;\n }\n\n return undefined;\n }, [item, 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 (item) {\n text = item.text;\n }\n\n return text;\n }, [item, placeholder, selectedItem]);\n\n /\n This function opens the content of the combobox\n */\n const handleHeaderClick = useCallback(() => {\n if (!isDisabled) {\n if (isAnimating) {\n handleClose();\n } else {\n handleOpen();\n }\n }\n }, [handleClose, handleOpen, isAnimating, isDisabled]);\n\n const comboBoxGroups = useMemo(\n () =>\n lists.map(({ groupName, list }) => (\n <div key={groupName ?? 'default-group'}>\n {groupName && lists.length > 1 && (\n <StyledComboBoxTopic>{groupName}</StyledComboBoxTopic>\n )}\n {list.map(({ imageUrl, icons, suffixElement, text, value }) => (\n <ComboBoxItem\n imageUrl={imageUrl}\n icons={icons}\n isSelected={selectedItem ? value === selectedItem.value : false}\n key={value}\n id={value}\n onSelect={handleSetSelectedItem}\n shouldShowRoundImage={shouldShowRoundImage}\n suffixElement={suffixElement}\n text={text}\n value={value}\n />\n ))}\n </div>\n )),\n [handleSetSelectedItem, lists, selectedItem, shouldShowRoundImage],\n );\n\n const bodyStyles = useMemo(() => {\n let styles: CSSProperties = { left: internalCoordinates.x, top: internalCoordinates.y };\n\n if (direction === ComboBoxDirection.TOP) {\n styles = { ...styles, transform: 'translateY(-100%)' };\n }\n\n return styles;\n }, [direction, internalCoordinates.x, internalCoordinates.y]);\n\n useEffect(() => {\n setPortal(() =>\n createPortal(\n <AnimatePresence initial={false}>\n {isAnimating && (\n <StyledMotionComboBoxBody\n $browser={browser?.name}\n animate={{ height: 'fit-content', opacity: 1 }}\n $overflowY={overflowY}\n initial={{ height: 0, opacity: 0 }}\n exit={{ height: 0, opacity: 0 }}\n $maxHeight={maxHeight}\n $minWidth={minWidth}\n style={bodyStyles}\n $direction={direction}\n transition={{ duration: 0.2 }}\n tabIndex={0}\n ref={contentRef}\n >\n {comboBoxGroups}\n </StyledMotionComboBoxBody>\n )}\n </AnimatePresence>,\n container,\n ),\n );\n }, [\n bodyStyles,\n browser?.name,\n comboBoxGroups,\n container,\n direction,\n isAnimating,\n maxHeight,\n minWidth,\n overflowY,\n ]);\n\n return useMemo(\n () => (\n <StyledComboBox\n ref={styledComboBoxElementRef}\n $shouldUseFullWidth={shouldUseFullWidth}\n $minWidth={minWidth}\n >\n <StyledComboBoxHeader\n $direction={direction}\n onClick={handleHeaderClick}\n $isOpen={isAnimating}\n $isTouch={isTouch}\n $isDisabled={isDisabled}\n >\n <StyledComboBoxPlaceholder>\n {placeholderImageUrl && (\n <StyledComboBoxPlaceholderImage\n src={placeholderImageUrl}\n shouldShowRoundImage={shouldShowRoundImage}\n />\n )}\n {placeholderIcon && <Icon icons={placeholderIcon} />}\n {placeholderText}\n {item && item.suffixElement && item.suffixElement}\n </StyledComboBoxPlaceholder>\n <StyledComboBoxIconWrapper>\n <Icon icons={['fa fa-chevron-down']} />\n </StyledComboBoxIconWrapper>\n </StyledComboBoxHeader>\n {portal}\n </StyledComboBox>\n ),\n [\n direction,\n handleHeaderClick,\n isAnimating,\n isDisabled,\n isTouch,\n item,\n minWidth,\n placeholderIcon,\n placeholderImageUrl,\n placeholderText,\n portal,\n shouldShowRoundImage,\n shouldUseFullWidth,\n ],\n );\n};\n\nComboBox.displayName = 'ComboBox';\n\nexport default ComboBox;\n"],"mappings":"AAAA,SAASA,SAAS,QAAQ,YAAY;AACtC,SAASC,eAAe,QAAQ,eAAe;AAC/C,OAAOC,KAAK,IAGRC,WAAW,EACXC,SAAS,EACTC,OAAO,EACPC,MAAM,EACNC,QAAQ,QAGL,OAAO;AACd,SAASC,YAAY,QAAQ,WAAW;AACxC,SAASC,iBAAiB,QAAQ,sBAAsB;AACxD,SACIC,sBAAsB,EACtBC,qBAAqB,EACrBC,oBAAoB,QACjB,uBAAuB;AAC9B,SAASC,UAAU,QAAQ,yBAAyB;AAEpD,OAAOC,IAAI,MAAM,cAAc;AAC/B,OAAOC,YAAY,MAAM,8BAA8B;AACvD,SAASC,mBAAmB,QAAQ,qCAAqC;AACzE,SACIC,cAAc,EACdC,oBAAoB,EACpBC,yBAAyB,EACzBC,yBAAyB,EACzBC,8BAA8B,EAC9BC,wBAAwB,QACrB,mBAAmB;AA0D1B,MAAMC,QAA2B,GAAGC,IAAA,IAW9B;EAAA,IAX+B;IACjCC,SAAS,GAAGhB,iBAAiB,CAACiB,MAAM;IACpCC,UAAU,GAAG,KAAK;IAClBC,KAAK;IACLC,SAAS,GAAG,OAAO;IACnBC,QAAQ;IACRC,WAAW;IACXC,SAAS,GAAGC,QAAQ,CAACC,IAAI;IACzBC,YAAY;IACZC,oBAAoB;IACpBC,kBAAkB,GAAG;EACzB,CAAC,GAAAb,IAAA;EACG,MAAM,CAACc,IAAI,EAAEC,OAAO,CAAC,GAAGhC,QAAQ,CAAgB,CAAC;EACjD,MAAM,CAACiC,WAAW,EAAEC,cAAc,CAAC,GAAGlC,QAAQ,CAAC,KAAK,CAAC;EACrD,MAAM,CAACmC,QAAQ,EAAEC,WAAW,CAAC,GAAGpC,QAAQ,CAAC,CAAC,CAAC;EAC3C,MAAM,CAACqC,YAAY,EAAEC,eAAe,CAAC,GAAGtC,QAAQ,CAAgB,IAAI,CAAC;EACrE,MAAM,CAACuC,SAAS,EAAEC,YAAY,CAAC,GAAGxC,QAAQ,CAA6B,QAAQ,CAAC;EAChF,MAAM,CAACyC,MAAM,EAAEC,SAAS,CAAC,GAAG1C,QAAQ,CAAc,CAAC;EACnD,MAAM,CAAC2C,mBAAmB,EAAEC,sBAAsB,CAAC,GAAG5C,QAAQ,CAAyB;IACnF6C,CAAC,EAAE,CAAC;IACJC,CAAC,EAAE;EACP,CAAC,CAAC;EAEF,MAAMC,wBAAwB,GAAGhD,MAAM,CAAiB,IAAI,CAAC;EAC7D,MAAMiD,UAAU,GAAGjD,MAAM,CAAwB,IAAI,CAAC;EAEtD,MAAM;IAAEkD;EAAQ,CAAC,GAAGxD,SAAS,CAAC,CAAC;EAE/B,MAAMyD,OAAO,GAAG5C,UAAU,CAAC,CAAC;EAE5B,MAAM6C,WAAW,GAAGvD,WAAW,CAC1BwD,KAAiB,IAAK;IACnB,IACIL,wBAAwB,CAACM,OAAO,IAChC,CAACN,wBAAwB,CAACM,OAAO,CAACC,QAAQ,CAACF,KAAK,CAACG,MAAc,CAAC,EAClE;MACErB,cAAc,CAAC,KAAK,CAAC;IACzB;EACJ,CAAC,EACD,CAACa,wBAAwB,CAC7B,CAAC;EAED,MAAMS,UAAU,GAAG5D,WAAW,CAAC,MAAM;IACjC,IAAImD,wBAAwB,CAACM,OAAO,EAAE;MAClC,MAAM;QAAER,CAAC;QAAEC,CAAC;QAAEW;MAAO,CAAC,GAAGV,wBAAwB,CAACM,OAAO,CAACK,qBAAqB,CAAC,CAAC;MAEjFd,sBAAsB,CAAC;QACnBC,CAAC;QACDC,CAAC,EAAE5B,SAAS,KAAKhB,iBAAiB,CAACyD,GAAG,GAAGb,CAAC,GAAGA,CAAC,GAAGW;MACrD,CAAC,CAAC;MAEFvB,cAAc,CAAC,IAAI,CAAC;IACxB;EACJ,CAAC,EAAE,CAAChB,SAAS,CAAC,CAAC;EAEf,MAAM0C,WAAW,GAAGhE,WAAW,CAAC,MAAM;IAClCsC,cAAc,CAAC,KAAK,CAAC;EACzB,CAAC,EAAE,EAAE,CAAC;;EAEN;AACJ;AACA;EACIrC,SAAS,CAAC,MAAM;IACZ6B,QAAQ,CAACmC,gBAAgB,CAAC,OAAO,EAAEV,WAAW,CAAC;IAE/C,OAAO,MAAM;MACTzB,QAAQ,CAACoC,mBAAmB,CAAC,OAAO,EAAEX,WAAW,CAAC;IACtD,CAAC;EACL,CAAC,EAAE,CAACA,WAAW,EAAEJ,wBAAwB,CAAC,CAAC;;EAE3C;AACJ;AACA;EACI,MAAMgB,qBAAqB,GAAGnE,WAAW,CACpCoE,YAA2B,IAAK;IAC7BhC,OAAO,CAACgC,YAAY,CAAC;IACrB9B,cAAc,CAAC,KAAK,CAAC;IAErB,IAAIX,QAAQ,EAAE;MACVA,QAAQ,CAACyC,YAAY,CAAC;IAC1B;EACJ,CAAC,EACD,CAACzC,QAAQ,CACb,CAAC;EAED1B,SAAS,CAAC,MAAM;IACZ,MAAMoE,aAAa,GAAIC,CAAgB,IAAK;MACxC,IAAI,CAACjC,WAAW,EAAE;QACd;MACJ;MAEA,IAAIiC,CAAC,CAACC,GAAG,KAAK,SAAS,IAAID,CAAC,CAACC,GAAG,KAAK,WAAW,EAAE;QAC9CD,CAAC,CAACE,cAAc,CAAC,CAAC;QAClB,MAAMC,QAAQ,GAAGrB,UAAU,CAACK,OAAO,EAAEgB,QAAQ;QAC7C,IAAIA,QAAQ,IAAIA,QAAQ,CAACC,MAAM,GAAG,CAAC,EAAE;UACjC,MAAMC,QAAQ,GACVlC,YAAY,KAAK,IAAI,GACf,CAACA,YAAY,IAAI6B,CAAC,CAACC,GAAG,KAAK,SAAS,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,GAAGE,QAAQ,CAACC,MAAM,IAChED,QAAQ,CAACC,MAAM,GACf,CAAC;UAEX,IAAIjC,YAAY,KAAK,IAAI,EAAE;YACvB,MAAMmC,WAAW,GAAGH,QAAQ,CAAChC,YAAY,CAAmB;YAC5DmC,WAAW,CAACC,QAAQ,GAAG,CAAC,CAAC;UAC7B;UAEAnC,eAAe,CAACiC,QAAQ,CAAC;UAEzB,MAAMG,UAAU,GAAGL,QAAQ,CAACE,QAAQ,CAAmB;UACvDG,UAAU,CAACD,QAAQ,GAAG,CAAC;UACvBC,UAAU,CAACC,KAAK,CAAC,CAAC;QACtB;MACJ,CAAC,MAAM,IAAIT,CAAC,CAACC,GAAG,KAAK,OAAO,IAAI9B,YAAY,KAAK,IAAI,EAAE;QACnD,MAAMuC,OAAO,GAAG5B,UAAU,CAACK,OAAO,EAAEgB,QAAQ,CAAChC,YAAY,CAAC;QAE1D,IAAI,CAACuC,OAAO,EAAE;UACV;QACJ;QAEA,MAAM;UAAEC;QAAG,CAAC,GAAGD,OAAO;QAEtB,IAAIE,eAA0C;QAE9CzD,KAAK,CAAC0D,IAAI,CAAEC,IAAI,IAAK;UACjBF,eAAe,GAAGE,IAAI,CAACA,IAAI,CAACC,IAAI,CAC5BC,KAAA;YAAA,IAAC;cAAEC;YAAM,CAAC,GAAAD,KAAA;YAAA,OAAKE,MAAM,CAACD,KAAK,CAAC,KAAKN,EAAE,CAACQ,OAAO,CAAC,iBAAiB,EAAE,EAAE,CAAC;UAAA,CACtE,CAAC;UACD,OAAO,CAAC,CAACP,eAAe;QAC5B,CAAC,CAAC;QAEF,IAAI,CAACA,eAAe,EAAE;UAClB;QACJ;QAEAf,qBAAqB,CAACe,eAAe,CAAC;MAC1C;IACJ,CAAC;IAEDpD,QAAQ,CAACmC,gBAAgB,CAAC,SAAS,EAAEI,aAAa,CAAC;IAEnD,OAAO,MAAM;MACTvC,QAAQ,CAACoC,mBAAmB,CAAC,SAAS,EAAEG,aAAa,CAAC;IAC1D,CAAC;EACL,CAAC,EAAE,CAAC5B,YAAY,EAAE0B,qBAAqB,EAAE9B,WAAW,EAAEZ,KAAK,CAAC,CAAC;;EAE7D;AACJ;AACA;EACIxB,SAAS,CAAC,MAAM;IACZ,MAAMyF,QAAQ,GAAGjE,KAAK,CAACkE,OAAO,CAAEP,IAAI,IAAKA,IAAI,CAACA,IAAI,CAAC;IAEnD,MAAMQ,8BAA8B,GAAGF,QAAQ,CAACP,IAAI,CAACU,KAAA;MAAA,IAAC;QAAEC;MAAS,CAAC,GAAAD,KAAA;MAAA,OAAKC,QAAQ;IAAA,EAAC;IAChF,MAAMC,6BAA6B,GAAGL,QAAQ,CAACP,IAAI,CAACa,KAAA;MAAA,IAAC;QAAEC;MAAM,CAAC,GAAAD,KAAA;MAAA,OAAKC,KAAK;IAAA,EAAC;IAEzE,MAAMC,SAAS,GAAGR,QAAQ,EAAES,GAAG,CAACC,KAAA;MAAA,IAAC;QAAEC;MAAK,CAAC,GAAAD,KAAA;MAAA,OAAKC,IAAI;IAAA,EAAC;IAEnD,MAAMC,aAAa,GAAG/F,sBAAsB,CAAC2F,SAAS,CAAC;IAEvD,MAAMK,iBAAiB,GAAG9F,oBAAoB,CAC1CiB,SAAS,EACTyB,wBAAwB,CAACM,OAAO,IAAI3B,QAAQ,CAACC,IACjD,CAAC;IAEDa,YAAY,CAAC0D,aAAa,GAAGC,iBAAiB,GAAG,QAAQ,GAAG,QAAQ,CAAC;IAErEL,SAAS,CAACM,IAAI,CAAC5E,WAAW,CAAC;IAE3B,MAAM6E,KAAK,GAAGtD,wBAAwB,CAACM,OAAO,EAAEK,qBAAqB,CAAC,CAAC,CAAC2C,KAAK,IAAI,CAAC;;IAElF;IACA;IACA;IACAjE,WAAW,CACPN,kBAAkB,GACZuE,KAAK,GACLjG,qBAAqB,CAAC,CAClB,GAAGkF,QAAQ,EACX;MAAEW,IAAI,EAAEzE,WAAW;MAAE2D,KAAK,EAAE;IAAc,CAAC,CAC9C,CAAC,GACE,EAAE,IACDK,8BAA8B,GAAG,EAAE,GAAG,CAAC,CAAC,IACxCG,6BAA6B,GAAG,EAAE,GAAG,CAAC,CACrD,CAAC;EACL,CAAC,EAAE,CAACtE,KAAK,EAAEC,SAAS,EAAEE,WAAW,EAAEM,kBAAkB,CAAC,CAAC;;EAEvD;AACJ;AACA;EACIjC,SAAS,CAAC,MAAM;IACZqC,cAAc,CAAC,KAAK,CAAC;IACrBF,OAAO,CAACJ,YAAY,CAAC;EACzB,CAAC,EAAE,CAACA,YAAY,CAAC,CAAC;EAElB,MAAM0E,mBAAmB,GAAGxG,OAAO,CAAC,MAAM;IACtC,IAAI8B,YAAY,EAAE;MACd,OAAOA,YAAY,CAAC8D,QAAQ;IAChC;IAEA,IAAI3D,IAAI,EAAE;MACN,OAAOA,IAAI,CAAC2D,QAAQ;IACxB;IAEA,OAAOa,SAAS;EACpB,CAAC,EAAE,CAACxE,IAAI,EAAEH,YAAY,CAAC,CAAC;EAExB,MAAM4E,eAAe,GAAG1G,OAAO,CAAC,MAAM;IAClC,IAAI8B,YAAY,EAAE;MACd,OAAOA,YAAY,CAACiE,KAAK;IAC7B;IAEA,IAAI9D,IAAI,EAAE;MACN,OAAOA,IAAI,CAAC8D,KAAK;IACrB;IAEA,OAAOU,SAAS;EACpB,CAAC,EAAE,CAACxE,IAAI,EAAEH,YAAY,CAAC,CAAC;;EAExB;AACJ;AACA;EACI,MAAM6E,eAAe,GAAG3G,OAAO,CAAC,MAAM;IAClC,IAAImG,IAAI,GAAGzE,WAAW;IAEtB,IAAII,YAAY,EAAE;MACdqE,IAAI,GAAGrE,YAAY,CAACqE,IAAI;IAC5B,CAAC,MAAM,IAAIlE,IAAI,EAAE;MACbkE,IAAI,GAAGlE,IAAI,CAACkE,IAAI;IACpB;IAEA,OAAOA,IAAI;EACf,CAAC,EAAE,CAAClE,IAAI,EAAEP,WAAW,EAAEI,YAAY,CAAC,CAAC;;EAErC;AACJ;AACA;EACI,MAAM8E,iBAAiB,GAAG9G,WAAW,CAAC,MAAM;IACxC,IAAI,CAACwB,UAAU,EAAE;MACb,IAAIa,WAAW,EAAE;QACb2B,WAAW,CAAC,CAAC;MACjB,CAAC,MAAM;QACHJ,UAAU,CAAC,CAAC;MAChB;IACJ;EACJ,CAAC,EAAE,CAACI,WAAW,EAAEJ,UAAU,EAAEvB,WAAW,EAAEb,UAAU,CAAC,CAAC;EAEtD,MAAMuF,cAAc,GAAG7G,OAAO,CAC1B,MACIuB,KAAK,CAAC0E,GAAG,CAACa,KAAA;IAAA,IAAC;MAAEC,SAAS;MAAE7B;IAAK,CAAC,GAAA4B,KAAA;IAAA,oBAC1BjH,KAAA,CAAAmH,aAAA;MAAK3C,GAAG,EAAE0C,SAAS,IAAI;IAAgB,GAClCA,SAAS,IAAIxF,KAAK,CAACiD,MAAM,GAAG,CAAC,iBAC1B3E,KAAA,CAAAmH,aAAA,CAACrG,mBAAmB,QAAEoG,SAA+B,CACxD,EACA7B,IAAI,CAACe,GAAG,CAACgB,KAAA;MAAA,IAAC;QAAErB,QAAQ;QAAEG,KAAK;QAAEmB,aAAa;QAAEf,IAAI;QAAEd;MAAM,CAAC,GAAA4B,KAAA;MAAA,oBACtDpH,KAAA,CAAAmH,aAAA,CAACtG,YAAY;QACTkF,QAAQ,EAAEA,QAAS;QACnBG,KAAK,EAAEA,KAAM;QACboB,UAAU,EAAErF,YAAY,GAAGuD,KAAK,KAAKvD,YAAY,CAACuD,KAAK,GAAG,KAAM;QAChEhB,GAAG,EAAEgB,KAAM;QACXN,EAAE,EAAEM,KAAM;QACV5D,QAAQ,EAAEwC,qBAAsB;QAChClC,oBAAoB,EAAEA,oBAAqB;QAC3CmF,aAAa,EAAEA,aAAc;QAC7Bf,IAAI,EAAEA,IAAK;QACXd,KAAK,EAAEA;MAAM,CAChB,CAAC;IAAA,CACL,CACA,CAAC;EAAA,CACT,CAAC,EACN,CAACpB,qBAAqB,EAAE1C,KAAK,EAAEO,YAAY,EAAEC,oBAAoB,CACrE,CAAC;EAED,MAAMqF,UAAU,GAAGpH,OAAO,CAAC,MAAM;IAC7B,IAAIqH,MAAqB,GAAG;MAAEC,IAAI,EAAEzE,mBAAmB,CAACE,CAAC;MAAEwE,GAAG,EAAE1E,mBAAmB,CAACG;IAAE,CAAC;IAEvF,IAAI5B,SAAS,KAAKhB,iBAAiB,CAACyD,GAAG,EAAE;MACrCwD,MAAM,GAAG;QAAE,GAAGA,MAAM;QAAEG,SAAS,EAAE;MAAoB,CAAC;IAC1D;IAEA,OAAOH,MAAM;EACjB,CAAC,EAAE,CAACjG,SAAS,EAAEyB,mBAAmB,CAACE,CAAC,EAAEF,mBAAmB,CAACG,CAAC,CAAC,CAAC;EAE7DjD,SAAS,CAAC,MAAM;IACZ6C,SAAS,CAAC,mBACNzC,YAAY,eACRN,KAAA,CAAAmH,aAAA,CAACpH,eAAe;MAAC6H,OAAO,EAAE;IAAM,GAC3BtF,WAAW,iBACRtC,KAAA,CAAAmH,aAAA,CAAC/F,wBAAwB;MACrByG,QAAQ,EAAEvE,OAAO,EAAEwE,IAAK;MACxBC,OAAO,EAAE;QAAEjE,MAAM,EAAE,aAAa;QAAEkE,OAAO,EAAE;MAAE,CAAE;MAC/CC,UAAU,EAAErF,SAAU;MACtBgF,OAAO,EAAE;QAAE9D,MAAM,EAAE,CAAC;QAAEkE,OAAO,EAAE;MAAE,CAAE;MACnCE,IAAI,EAAE;QAAEpE,MAAM,EAAE,CAAC;QAAEkE,OAAO,EAAE;MAAE,CAAE;MAChCG,UAAU,EAAExG,SAAU;MACtByG,SAAS,EAAE5F,QAAS;MACpB6F,KAAK,EAAEd,UAAW;MAClBe,UAAU,EAAE/G,SAAU;MACtBgH,UAAU,EAAE;QAAEC,QAAQ,EAAE;MAAI,CAAE;MAC9B1D,QAAQ,EAAE,CAAE;MACZ2D,GAAG,EAAEpF;IAAW,GAEf2D,cACqB,CAEjB,CAAC,EAClBlF,SACJ,CACJ,CAAC;EACL,CAAC,EAAE,CACCyF,UAAU,EACVjE,OAAO,EAAEwE,IAAI,EACbd,cAAc,EACdlF,SAAS,EACTP,SAAS,EACTe,WAAW,EACXX,SAAS,EACTa,QAAQ,EACRI,SAAS,CACZ,CAAC;EAEF,OAAOzC,OAAO,CACV,mBACIH,KAAA,CAAAmH,aAAA,CAACpG,cAAc;IACX0H,GAAG,EAAErF,wBAAyB;IAC9BsF,mBAAmB,EAAEvG,kBAAmB;IACxCiG,SAAS,EAAE5F;EAAS,gBAEpBxC,KAAA,CAAAmH,aAAA,CAACnG,oBAAoB;IACjBsH,UAAU,EAAE/G,SAAU;IACtBoH,OAAO,EAAE5B,iBAAkB;IAC3B6B,OAAO,EAAEtG,WAAY;IACrBuG,QAAQ,EAAEtF,OAAQ;IAClBuF,WAAW,EAAErH;EAAW,gBAExBzB,KAAA,CAAAmH,aAAA,CAACjG,yBAAyB,QACrByF,mBAAmB,iBAChB3G,KAAA,CAAAmH,aAAA,CAAChG,8BAA8B;IAC3B4H,GAAG,EAAEpC,mBAAoB;IACzBzE,oBAAoB,EAAEA;EAAqB,CAC9C,CACJ,EACA2E,eAAe,iBAAI7G,KAAA,CAAAmH,aAAA,CAACvG,IAAI;IAACsF,KAAK,EAAEW;EAAgB,CAAE,CAAC,EACnDC,eAAe,EACf1E,IAAI,IAAIA,IAAI,CAACiF,aAAa,IAAIjF,IAAI,CAACiF,aACb,CAAC,eAC5BrH,KAAA,CAAAmH,aAAA,CAAClG,yBAAyB,qBACtBjB,KAAA,CAAAmH,aAAA,CAACvG,IAAI;IAACsF,KAAK,EAAE,CAAC,oBAAoB;EAAE,CAAE,CACf,CACT,CAAC,EACtBpD,MACW,CACnB,EACD,CACIvB,SAAS,EACTwF,iBAAiB,EACjBzE,WAAW,EACXb,UAAU,EACV8B,OAAO,EACPnB,IAAI,EACJI,QAAQ,EACRqE,eAAe,EACfF,mBAAmB,EACnBG,eAAe,EACfhE,MAAM,EACNZ,oBAAoB,EACpBC,kBAAkB,CAE1B,CAAC;AACL,CAAC;AAEDd,QAAQ,CAAC2H,WAAW,GAAG,UAAU;AAEjC,eAAe3H,QAAQ","ignoreList":[]}
1	+ {"version":3,"file":"ComboBox.js","names":["useDevice","AnimatePresence","React","useCallback","useEffect","useMemo","useRef","useState","createPortal","ComboBoxDirection","calculateContentHeight","calculateContentWidth","getMaxHeightInPixels","getIsTouch","Icon","ComboBoxItem","StyledComboBoxTopic","StyledComboBox","StyledComboBoxHeader","StyledComboBoxIconWrapper","StyledComboBoxPlaceholder","StyledComboBoxPlaceholderImage","StyledMotionComboBoxBody","ComboBox","_ref","direction","BOTTOM","isDisabled","lists","maxHeight","onSelect","placeholder","container","document","querySelector","body","selectedItem","shouldShowRoundImage","shouldUseFullWidth","item","setItem","isAnimating","setIsAnimating","minWidth","setMinWidth","focusedIndex","setFocusedIndex","overflowY","setOverflowY","portal","setPortal","internalCoordinates","setInternalCoordinates","x","y","styledComboBoxElementRef","contentRef","browser","isTouch","handleClick","event","current","contains","target","handleOpen","height","getBoundingClientRect","TOP","handleClose","addEventListener","removeEventListener","handleSetSelectedItem","itemToSelect","handleKeyDown","e","key","preventDefault","children","length","newIndex","prevElement","tabIndex","newElement","focus","element","id","newSelectedItem","some","list","find","_ref2","value","String","replace","allItems","flatMap","isAtLeastOneItemWithImageGiven","_ref3","imageUrl","isAtLeastOneItemWithIconGiven","_ref4","icons","textArray","map","_ref5","text","contentHeight","maxHeightInPixels","push","width","placeholderImageUrl","undefined","placeholderIcon","placeholderText","handleHeaderClick","comboBoxGroups","_ref6","groupName","createElement","_ref7","suffixElement","isSelected","bodyStyles","styles","left","top","transform","initial","$browser","name","animate","opacity","$overflowY","exit","$maxHeight","$minWidth","style","$direction","transition","duration","ref","$shouldUseFullWidth","onClick","$isOpen","$isTouch","$isDisabled","src","displayName"],"sources":["../../../../src/components/combobox/ComboBox.tsx"],"sourcesContent":["import { useDevice } from 'chayns-api';\nimport { AnimatePresence } from 'framer-motion';\nimport React, {\n FC,\n ReactPortal,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n type CSSProperties,\n type ReactNode,\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport { ComboBoxDirection } from '../../types/comboBox';\nimport {\n calculateContentHeight,\n calculateContentWidth,\n getMaxHeightInPixels,\n} from '../../utils/calculate';\nimport { getIsTouch } from '../../utils/environment';\nimport type { ContextMenuCoordinates } from '../context-menu/ContextMenu';\nimport Icon from '../icon/Icon';\nimport ComboBoxItem from './combobox-item/ComboBoxItem';\nimport { StyledComboBoxTopic } from './combobox-item/ComboBoxItem.styles';\nimport {\n StyledComboBox,\n StyledComboBoxHeader,\n StyledComboBoxIconWrapper,\n StyledComboBoxPlaceholder,\n StyledComboBoxPlaceholderImage,\n StyledMotionComboBoxBody,\n} from './ComboBox.styles';\n\nexport interface IComboBoxItems {\n groupName?: string;\n list: Array<IComboBoxItem>;\n}\n\nexport interface IComboBoxItem {\n icons?: string[];\n imageUrl?: string;\n suffixElement?: ReactNode;\n text: string;\n value: string \| number;\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 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 that should be executed when an item is selected.\n /\n onSelect?: (comboboxItem: IComboBoxItem) => void;\n /\n A text that should be displayed when no item is selected.\n /\n placeholder: string;\n /\n An item that should be preselected.\n /\n selectedItem?: IComboBoxItem;\n /\n If true, the images of the items are displayed in a round shape.\n /\n shouldShowRoundImage?: boolean;\n /\n Whether the width of the 'ComboBox' should be the width of the parent or of the widest item.\n /\n shouldUseFullWidth?: boolean;\n};\n\nconst ComboBox: FC<ComboBoxProps> = ({\n direction = ComboBoxDirection.BOTTOM,\n isDisabled = false,\n lists,\n maxHeight = '280px',\n onSelect,\n placeholder,\n container = document.querySelector('.tapp') \|\| document.body,\n selectedItem,\n shouldShowRoundImage,\n shouldUseFullWidth = false,\n}) => {\n const [item, setItem] = useState<IComboBoxItem>();\n const [isAnimating, setIsAnimating] = useState(false);\n const [minWidth, setMinWidth] = useState(0);\n const [focusedIndex, setFocusedIndex] = useState<number \| null>(null);\n const [overflowY, setOverflowY] = useState<CSSProperties['overflowY']>('hidden');\n const [portal, setPortal] = useState<ReactPortal>();\n const [internalCoordinates, setInternalCoordinates] = useState<ContextMenuCoordinates>({\n x: 0,\n y: 0,\n });\n\n const styledComboBoxElementRef = useRef<HTMLDivElement>(null);\n const contentRef = useRef<HTMLDivElement \| null>(null);\n\n const { browser } = useDevice();\n\n const isTouch = getIsTouch();\n\n const handleClick = useCallback(\n (event: MouseEvent) => {\n if (\n styledComboBoxElementRef.current &&\n !styledComboBoxElementRef.current.contains(event.target as Node)\n ) {\n setIsAnimating(false);\n }\n },\n [styledComboBoxElementRef],\n );\n\n const handleOpen = useCallback(() => {\n if (styledComboBoxElementRef.current) {\n const { x, y, height } = styledComboBoxElementRef.current.getBoundingClientRect();\n\n setInternalCoordinates({\n x,\n y: direction === ComboBoxDirection.TOP ? y : y + height,\n });\n\n setIsAnimating(true);\n }\n }, [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 setItem(itemToSelect);\n setIsAnimating(false);\n\n if (onSelect) {\n onSelect(itemToSelect);\n }\n },\n [onSelect],\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 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\n const isAtLeastOneItemWithImageGiven = allItems.some(({ imageUrl }) => imageUrl);\n const isAtLeastOneItemWithIconGiven = allItems.some(({ icons }) => icons);\n\n const textArray = allItems?.map(({ text }) => text);\n\n const contentHeight = calculateContentHeight(textArray);\n\n const maxHeightInPixels = getMaxHeightInPixels(\n maxHeight,\n styledComboBoxElementRef.current ?? document.body,\n );\n\n setOverflowY(contentHeight > maxHeightInPixels ? 'scroll' : 'hidden');\n\n textArray.push(placeholder);\n\n const width = styledComboBoxElementRef.current?.getBoundingClientRect().width ?? 0;\n\n // 45px = padding left + padding right + border left + border right + arrow icon width + arrow icon margin left\n // 32px = image width + flex gap\n // 40px = icon width + flex gap\n setMinWidth(\n shouldUseFullWidth\n ? width\n : calculateContentWidth([\n ...allItems,\n { text: placeholder, value: 'placeholder' },\n ]) +\n 45 +\n (isAtLeastOneItemWithImageGiven ? 32 : 0) +\n (isAtLeastOneItemWithIconGiven ? 40 : 0),\n );\n }, [lists, maxHeight, placeholder, shouldUseFullWidth]);\n\n /\n This function sets the external selected item\n /\n useEffect(() => {\n setIsAnimating(false);\n setItem(selectedItem);\n }, [selectedItem]);\n\n const placeholderImageUrl = useMemo(() => {\n if (selectedItem) {\n return selectedItem.imageUrl;\n }\n\n if (item) {\n return item.imageUrl;\n }\n\n return undefined;\n }, [item, selectedItem]);\n\n const placeholderIcon = useMemo(() => {\n if (selectedItem) {\n return selectedItem.icons;\n }\n\n if (item) {\n return item.icons;\n }\n\n return undefined;\n }, [item, 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 (item) {\n text = item.text;\n }\n\n return text;\n }, [item, placeholder, selectedItem]);\n\n /\n This function opens the content of the combobox\n */\n const handleHeaderClick = useCallback(() => {\n if (!isDisabled) {\n if (isAnimating) {\n handleClose();\n } else {\n handleOpen();\n }\n }\n }, [handleClose, handleOpen, isAnimating, isDisabled]);\n\n const comboBoxGroups = useMemo(\n () =>\n lists.map(({ groupName, list }) => (\n <div key={groupName ?? 'default-group'}>\n {groupName && lists.length > 1 && (\n <StyledComboBoxTopic>{groupName}</StyledComboBoxTopic>\n )}\n {list.map(({ imageUrl, icons, suffixElement, text, value }) => (\n <ComboBoxItem\n imageUrl={imageUrl}\n icons={icons}\n isSelected={selectedItem ? value === selectedItem.value : false}\n key={value}\n id={value}\n onSelect={handleSetSelectedItem}\n shouldShowRoundImage={shouldShowRoundImage}\n suffixElement={suffixElement}\n text={text}\n value={value}\n />\n ))}\n </div>\n )),\n [handleSetSelectedItem, lists, selectedItem, shouldShowRoundImage],\n );\n\n const bodyStyles = useMemo(() => {\n let styles: CSSProperties = { left: internalCoordinates.x, top: internalCoordinates.y };\n\n if (direction === ComboBoxDirection.TOP) {\n styles = { ...styles, transform: 'translateY(-100%)' };\n }\n\n return styles;\n }, [direction, internalCoordinates.x, internalCoordinates.y]);\n\n useEffect(() => {\n setPortal(() =>\n createPortal(\n <AnimatePresence initial={false}>\n {isAnimating && (\n <StyledMotionComboBoxBody\n $browser={browser?.name}\n animate={{ height: 'fit-content', opacity: 1 }}\n $overflowY={overflowY}\n initial={{ height: 0, opacity: 0 }}\n exit={{ height: 0, opacity: 0 }}\n $maxHeight={maxHeight}\n $minWidth={minWidth}\n style={bodyStyles}\n $direction={direction}\n transition={{ duration: 0.2 }}\n tabIndex={0}\n ref={contentRef}\n >\n {comboBoxGroups}\n </StyledMotionComboBoxBody>\n )}\n </AnimatePresence>,\n container,\n ),\n );\n }, [\n bodyStyles,\n browser?.name,\n comboBoxGroups,\n container,\n direction,\n isAnimating,\n maxHeight,\n minWidth,\n overflowY,\n ]);\n\n return useMemo(\n () => (\n <StyledComboBox\n ref={styledComboBoxElementRef}\n $shouldUseFullWidth={shouldUseFullWidth}\n $minWidth={minWidth}\n >\n <StyledComboBoxHeader\n $direction={direction}\n onClick={handleHeaderClick}\n $isOpen={isAnimating}\n $isTouch={isTouch}\n $isDisabled={isDisabled}\n >\n <StyledComboBoxPlaceholder>\n {placeholderImageUrl && (\n <StyledComboBoxPlaceholderImage\n src={placeholderImageUrl}\n shouldShowRoundImage={shouldShowRoundImage}\n />\n )}\n {placeholderIcon && <Icon icons={placeholderIcon} />}\n {placeholderText}\n {item && item.suffixElement && item.suffixElement}\n </StyledComboBoxPlaceholder>\n <StyledComboBoxIconWrapper>\n <Icon icons={['fa fa-chevron-down']} />\n </StyledComboBoxIconWrapper>\n </StyledComboBoxHeader>\n {portal}\n </StyledComboBox>\n ),\n [\n direction,\n handleHeaderClick,\n isAnimating,\n isDisabled,\n isTouch,\n item,\n minWidth,\n placeholderIcon,\n placeholderImageUrl,\n placeholderText,\n portal,\n shouldShowRoundImage,\n shouldUseFullWidth,\n ],\n );\n};\n\nComboBox.displayName = 'ComboBox';\n\nexport default ComboBox;\n"],"mappings":"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","ignoreList":[]}

package/lib/esm/components/context-menu/ContextMenu.js CHANGED Viewed

@@ -15,7 +15,7 @@ const ContextMenu = /*#__PURE__*/forwardRef((_ref, ref) => {
       icons: ['ts-ellipsis_v'],
       size: 18
     }),
-    container = document.body,
+    container = document.querySelector('.tapp') || document.body,
     coordinates,
     items,
     onHide,

package/lib/esm/components/context-menu/ContextMenu.js.map CHANGED Viewed

	@@ -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","document","body","coordinates","items","onHide","onShow","shouldCloseOnPopupClick","internalCoordinates","setInternalCoordinates","x","y","internalAlignment","setInternalAlignment","TopLeft","isContentShown","setIsContentShown","portal","setPortal","uuid","contextMenuContentRef","contextMenuRef","handleHide","handleShow","isTouch","result","type","SELECT","buttons","list","map","_ref2","index","text","name","id","icon","open","onClick","current","rootElement","querySelector","height","childrenHeight","left","childrenLeft","top","childrenTop","width","childrenWidth","getBoundingClientRect","window","scrollX","scrollY","BottomRight","TopRight","BottomLeft","handleClick","event","preventDefault","stopPropagation","handleDocumentClick","contains","target","hide","show","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 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 = document.body,\n coordinates,\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\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 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 const rootElement = document.querySelector('.tapp') \|\| document.body;\n\n const {\n height: childrenHeight,\n left: childrenLeft,\n top: childrenTop,\n width: childrenWidth,\n } = contextMenuRef.current.getBoundingClientRect();\n\n const x = childrenLeft + window.scrollX + childrenWidth / 2;\n const y = childrenTop + window.scrollY + childrenHeight / 2;\n\n setInternalCoordinates({ x, y });\n\n const { height, width } = rootElement.getBoundingClientRect();\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 }, [items]);\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 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 container,\n ),\n );\n }, [\n alignment,\n container,\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":[]}
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","document","querySelector","body","coordinates","items","onHide","onShow","shouldCloseOnPopupClick","internalCoordinates","setInternalCoordinates","x","y","internalAlignment","setInternalAlignment","TopLeft","isContentShown","setIsContentShown","portal","setPortal","uuid","contextMenuContentRef","contextMenuRef","handleHide","handleShow","isTouch","result","type","SELECT","buttons","list","map","_ref2","index","text","name","id","icon","open","onClick","current","rootElement","height","childrenHeight","left","childrenLeft","top","childrenTop","width","childrenWidth","getBoundingClientRect","window","scrollX","scrollY","BottomRight","TopRight","BottomLeft","handleClick","event","preventDefault","stopPropagation","handleDocumentClick","contains","target","hide","show","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 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 = document.querySelector('.tapp') \|\| document.body,\n coordinates,\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\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 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 const rootElement = document.querySelector('.tapp') \|\| document.body;\n\n const {\n height: childrenHeight,\n left: childrenLeft,\n top: childrenTop,\n width: childrenWidth,\n } = contextMenuRef.current.getBoundingClientRect();\n\n const x = childrenLeft + window.scrollX + childrenWidth / 2;\n const y = childrenTop + window.scrollY + childrenHeight / 2;\n\n setInternalCoordinates({ x, y });\n\n const { height, width } = rootElement.getBoundingClientRect();\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 }, [items]);\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 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 container,\n ),\n );\n }, [\n alignment,\n container,\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":[]}

package/lib/esm/components/search-box/SearchBox.js CHANGED Viewed

@@ -21,7 +21,7 @@ const SearchBox = /*#__PURE__*/forwardRef((_ref, ref) => {
     onSelect,
     onKeyDown,
     selectedId,
-    container = document.body,
+    container = document.querySelector('.tapp') || document.body,
     shouldShowRoundImage,
     shouldShowContentOnEmptyInput = true,
     shouldAddInputToList = true,

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

	@@ -1 +1 @@
1	- {"version":3,"file":"SearchBox.js","names":["getDevice","AnimatePresence","React","forwardRef","useCallback","useEffect","useImperativeHandle","useMemo","useRef","useState","createPortal","useTheme","calculateContentHeight","searchList","Icon","Input","GroupName","SearchBoxBody","SearchBoxItem","StyledSearchBoxItemImage","StyledSearchBox","StyledSearchBoxIcon","SearchBox","_ref","ref","placeholder","lists","onChange","onBlur","onSelect","onKeyDown","selectedId","container","document","body","shouldShowRoundImage","shouldShowContentOnEmptyInput","shouldAddInputToList","shouldShowToggleIcon","matchingListsItems","setMatchingListsItems","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","boxRef","contentRef","inputRef","theme","browser","current","getBoundingClientRect","filterbuttons","items","forEach","_ref2","groupName","push","id","text","activeList","newLists","list","includes","newMatchingItems","_ref3","newList","searchString","undefined","filteredMatchingListItems","map","_ref4","filter","item","handleOpen","bodyHeight","handleClose","handleFilterButtonsGroupSelect","keys","handleOutsideClick","event","contains","target","addEventListener","window","removeEventListener","textArray","_ref5","_ref6","input","getElementById","getInputWidth","offsetWidth","ResizeObserver","observe","_ref7","selectedItem","find","_ref8","imageUrl","createElement","src","$shouldShowRoundImage","handleFocus","_ref9","_ref10","_ref11","_ref12","_ref13","toLowerCase","handleClick","rightElement","onClick","icons","color","handleChange","filteredLists","_ref14","handleBlur","handleSelect","newItem","replace","content","_ref15","index","key","name","_ref16","handleKeyDown","e","preventDefault","children","filteredChildren","Array","from","child","dataset","isgroupname","newIndex","prevElement","tabIndex","newElement","focus","element","textContent","attributes","nodeValue","handleKeyPress","keyCode","clear","initial","selectedGroups","coordinates","onGroupSelect","onFocus","leftElement","displayName"],"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 = document.body,\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\n const boxRef = useRef<HTMLDivElement>(null);\n const contentRef = useRef<HTMLDivElement \| null>(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) {\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 (boxRef.current && !boxRef.current.contains(event.target as Node)) {\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 && children.length > 0) {\n const filteredChildren = Array.from(children).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 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 container,\n ),\n );\n }, [\n browser?.name,\n container,\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":["getDevice","AnimatePresence","React","forwardRef","useCallback","useEffect","useImperativeHandle","useMemo","useRef","useState","createPortal","useTheme","calculateContentHeight","searchList","Icon","Input","GroupName","SearchBoxBody","SearchBoxItem","StyledSearchBoxItemImage","StyledSearchBox","StyledSearchBoxIcon","SearchBox","_ref","ref","placeholder","lists","onChange","onBlur","onSelect","onKeyDown","selectedId","container","document","querySelector","body","shouldShowRoundImage","shouldShowContentOnEmptyInput","shouldAddInputToList","shouldShowToggleIcon","matchingListsItems","setMatchingListsItems","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","boxRef","contentRef","inputRef","theme","browser","current","getBoundingClientRect","filterbuttons","items","forEach","_ref2","groupName","push","id","text","activeList","newLists","list","includes","newMatchingItems","_ref3","newList","searchString","undefined","filteredMatchingListItems","map","_ref4","filter","item","handleOpen","bodyHeight","handleClose","handleFilterButtonsGroupSelect","keys","handleOutsideClick","event","contains","target","addEventListener","window","removeEventListener","textArray","_ref5","_ref6","input","getElementById","getInputWidth","offsetWidth","ResizeObserver","observe","_ref7","selectedItem","find","_ref8","imageUrl","createElement","src","$shouldShowRoundImage","handleFocus","_ref9","_ref10","_ref11","_ref12","_ref13","toLowerCase","handleClick","rightElement","onClick","icons","color","handleChange","filteredLists","_ref14","handleBlur","handleSelect","newItem","replace","content","_ref15","index","key","name","_ref16","handleKeyDown","e","preventDefault","children","filteredChildren","Array","from","child","dataset","isgroupname","newIndex","prevElement","tabIndex","newElement","focus","element","textContent","attributes","nodeValue","handleKeyPress","keyCode","clear","initial","selectedGroups","coordinates","onGroupSelect","onFocus","leftElement","displayName"],"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 = document.querySelector('.tapp') \|\| document.body,\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\n const boxRef = useRef<HTMLDivElement>(null);\n const contentRef = useRef<HTMLDivElement \| null>(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) {\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 (boxRef.current && !boxRef.current.contains(event.target as Node)) {\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 && children.length > 0) {\n const filteredChildren = Array.from(children).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 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 container,\n ),\n );\n }, [\n browser?.name,\n container,\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":[]}

package/lib/esm/components/small-wait-cursor/SmallWaitCursor.js CHANGED Viewed

@@ -18,7 +18,8 @@ const SmallWaitCursor = _ref => {
     shouldHideBackground = false,
     shouldHideWaitCursor = false,
     size = SmallWaitCursorSize.Medium,
-    speed = SmallWaitCursorSpeed.Medium
+    speed = SmallWaitCursorSpeed.Medium,
+    color
   } = _ref;
   return /*#__PURE__*/React.createElement(StyledSmallWaitCursor, {
     $shouldShowWaitCursor: !shouldHideWaitCursor,
@@ -26,7 +27,8 @@ const SmallWaitCursor = _ref => {
   }, /*#__PURE__*/React.createElement(StyledSmallWaitCursorWaitCursor, {
     $shouldHideBackground: shouldHideBackground,
     $size: size,
-    $speed: speed
+    $speed: speed,
+    $color: color
   }), !shouldHideBackground && /*#__PURE__*/React.createElement(StyledSmallWaitCursorBackground, null));
 };
 SmallWaitCursor.displayName = 'SmallWaitCursor';

package/lib/esm/components/small-wait-cursor/SmallWaitCursor.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SmallWaitCursor.js","names":["React","StyledSmallWaitCursor","StyledSmallWaitCursorBackground","StyledSmallWaitCursorWaitCursor","SmallWaitCursorSize","SmallWaitCursorSpeed","SmallWaitCursor","_ref","shouldHideBackground","shouldHideWaitCursor","size","Medium","speed","createElement","$shouldShowWaitCursor","$size","$shouldHideBackground","$speed","displayName"],"sources":["../../../../src/components/small-wait-cursor/SmallWaitCursor.tsx"],"sourcesContent":["// noinspection JSUnusedGlobalSymbols\n\nimport React, { FC } from 'react';\nimport {\n StyledSmallWaitCursor,\n StyledSmallWaitCursorBackground,\n StyledSmallWaitCursorWaitCursor,\n} from './SmallWaitCursor.styles';\n\nexport enum SmallWaitCursorSize {\n Small = 16,\n Medium = 30,\n}\n\nexport enum SmallWaitCursorSpeed {\n Slow = 1.5,\n Medium = 1,\n Fast = 0.5,\n}\n\nexport type SmallWaitCursorProps = {\n /*\n Specifies whether the wait cursor should be displayed with a background.\n /\n shouldHideBackground?: boolean;\n /\n Specifies whether the wait cursor should be displayed.\n /\n shouldHideWaitCursor?: boolean;\n /\n The size of the wait cursor in pixels. Use the SmallWaitCursorSize enum for this prop.\n /\n size?: SmallWaitCursorSize \| number;\n /\n The speed of the animation in seconds. Use the SmallWaitCursorSpeed enum for this prop.\n */\n speed?: SmallWaitCursorSpeed;\n};\n\nconst SmallWaitCursor: FC<SmallWaitCursorProps> = ({\n shouldHideBackground = false,\n shouldHideWaitCursor = false,\n size = SmallWaitCursorSize.Medium,\n speed = SmallWaitCursorSpeed.Medium,\n}) => (\n <StyledSmallWaitCursor $shouldShowWaitCursor={!shouldHideWaitCursor} $size={size}>\n <StyledSmallWaitCursorWaitCursor\n $shouldHideBackground={shouldHideBackground}\n $size={size}\n $speed={speed}\n />\n {!shouldHideBackground && <StyledSmallWaitCursorBackground />}\n </StyledSmallWaitCursor>\n);\n\nSmallWaitCursor.displayName = 'SmallWaitCursor';\n\nexport default SmallWaitCursor;\n"],"mappings":"AAAA;;AAEA,OAAOA,KAAK,MAAc,OAAO;AACjC,SACIC,qBAAqB,EACrBC,+BAA+B,EAC/BC,+BAA+B,QAC5B,0BAA0B;AAEjC,WAAYC,mBAAmB,0BAAnBA,mBAAmB;EAAnBA,mBAAmB,CAAnBA,mBAAmB;EAAnBA,mBAAmB,CAAnBA,mBAAmB;EAAA,OAAnBA,mBAAmB;AAAA;AAK/B,WAAYC,oBAAoB,0BAApBA,oBAAoB;EAApBA,oBAAoB,CAApBA,oBAAoB;EAApBA,oBAAoB,CAApBA,oBAAoB;EAApBA,oBAAoB,CAApBA,oBAAoB;EAAA,OAApBA,oBAAoB;AAAA;~~AAyBhC~~,MAAMC,eAAyC,GAAGC,IAAA;EAAA,IAAC;IAC/CC,oBAAoB,GAAG,KAAK;IAC5BC,oBAAoB,GAAG,KAAK;IAC5BC,IAAI,GAAGN,mBAAmB,CAACO,MAAM;IACjCC,KAAK,GAAGP,oBAAoB,CAACM;~~EACjC~~,CAAC,~~GAAAJ~~,IAAA;EAAA,oBACGP,KAAA,~~CAAAa~~,aAAA,~~CAACZ~~,qBAAqB;~~IAACa~~,qBAAqB,EAAE,~~CAACL~~,oBAAqB;~~IAACM~~,KAAK,~~EAAEL~~;EAAK,gBAC7EV,KAAA,~~CAAAa~~,aAAA,~~CAACV~~,+BAA+B;~~IAC5Ba~~,qBAAqB,~~EAAER~~,oBAAqB;~~IAC5CO~~,KAAK,~~EAAEL~~,IAAK;~~IACZO~~,MAAM,~~EAAEL~~;EAAM,CACjB,CAAC,EACD,~~CAACJ~~,oBAAoB,iBAAIR,KAAA,~~CAAAa~~,aAAA,~~CAACX~~,+BAA+B,MAAE,CACzC,CAAC;AAAA,CAC3B;AAEDI,eAAe,~~CAACY~~,WAAW,GAAG,iBAAiB;AAE/C,~~eAAeZ~~,eAAe","ignoreList":[]}
1	+ {"version":3,"file":"SmallWaitCursor.js","names":["React","StyledSmallWaitCursor","StyledSmallWaitCursorBackground","StyledSmallWaitCursorWaitCursor","SmallWaitCursorSize","SmallWaitCursorSpeed","SmallWaitCursor","_ref","shouldHideBackground","shouldHideWaitCursor","size","Medium","speed","color","createElement","$shouldShowWaitCursor","$size","$shouldHideBackground","$speed","$color","displayName"],"sources":["../../../../src/components/small-wait-cursor/SmallWaitCursor.tsx"],"sourcesContent":["// noinspection JSUnusedGlobalSymbols\n\nimport React, { FC } from 'react';\nimport {\n StyledSmallWaitCursor,\n StyledSmallWaitCursorBackground,\n StyledSmallWaitCursorWaitCursor,\n} from './SmallWaitCursor.styles';\n\nexport enum SmallWaitCursorSize {\n Small = 16,\n Medium = 30,\n}\n\nexport enum SmallWaitCursorSpeed {\n Slow = 1.5,\n Medium = 1,\n Fast = 0.5,\n}\n\nexport type SmallWaitCursorProps = {\n /*\n Specifies whether the wait cursor should be displayed with a background.\n /\n shouldHideBackground?: boolean;\n /\n Specifies whether the wait cursor should be displayed.\n /\n shouldHideWaitCursor?: boolean;\n /\n The size of the wait cursor in pixels. Use the SmallWaitCursorSize enum for this prop.\n /\n size?: SmallWaitCursorSize \| number;\n /\n The speed of the animation in seconds. Use the SmallWaitCursorSpeed enum for this prop.\n /\n speed?: SmallWaitCursorSpeed;\n /\n The color of the inner circle of the wait cursor.\n */\n color?: string;\n};\n\nconst SmallWaitCursor: FC<SmallWaitCursorProps> = ({\n shouldHideBackground = false,\n shouldHideWaitCursor = false,\n size = SmallWaitCursorSize.Medium,\n speed = SmallWaitCursorSpeed.Medium,\n color,\n}) => (\n <StyledSmallWaitCursor $shouldShowWaitCursor={!shouldHideWaitCursor} $size={size}>\n <StyledSmallWaitCursorWaitCursor\n $shouldHideBackground={shouldHideBackground}\n $size={size}\n $speed={speed}\n $color={color}\n />\n {!shouldHideBackground && <StyledSmallWaitCursorBackground />}\n </StyledSmallWaitCursor>\n);\n\nSmallWaitCursor.displayName = 'SmallWaitCursor';\n\nexport default SmallWaitCursor;\n"],"mappings":"AAAA;;AAEA,OAAOA,KAAK,MAAc,OAAO;AACjC,SACIC,qBAAqB,EACrBC,+BAA+B,EAC/BC,+BAA+B,QAC5B,0BAA0B;AAEjC,WAAYC,mBAAmB,0BAAnBA,mBAAmB;EAAnBA,mBAAmB,CAAnBA,mBAAmB;EAAnBA,mBAAmB,CAAnBA,mBAAmB;EAAA,OAAnBA,mBAAmB;AAAA;AAK/B,WAAYC,oBAAoB,0BAApBA,oBAAoB;EAApBA,oBAAoB,CAApBA,oBAAoB;EAApBA,oBAAoB,CAApBA,oBAAoB;EAApBA,oBAAoB,CAApBA,oBAAoB;EAAA,OAApBA,oBAAoB;AAAA;AA6BhC,MAAMC,eAAyC,GAAGC,IAAA;EAAA,IAAC;IAC/CC,oBAAoB,GAAG,KAAK;IAC5BC,oBAAoB,GAAG,KAAK;IAC5BC,IAAI,GAAGN,mBAAmB,CAACO,MAAM;IACjCC,KAAK,GAAGP,oBAAoB,CAACM,MAAM;IACnCE;EACJ,CAAC,GAAAN,IAAA;EAAA,oBACGP,KAAA,CAAAc,aAAA,CAACb,qBAAqB;IAACc,qBAAqB,EAAE,CAACN,oBAAqB;IAACO,KAAK,EAAEN;EAAK,gBAC7EV,KAAA,CAAAc,aAAA,CAACX,+BAA+B;IAC5Bc,qBAAqB,EAAET,oBAAqB;IAC5CQ,KAAK,EAAEN,IAAK;IACZQ,MAAM,EAAEN,KAAM;IACdO,MAAM,EAAEN;EAAM,CACjB,CAAC,EACD,CAACL,oBAAoB,iBAAIR,KAAA,CAAAc,aAAA,CAACZ,+BAA+B,MAAE,CACzC,CAAC;AAAA,CAC3B;AAEDI,eAAe,CAACc,WAAW,GAAG,iBAAiB;AAE/C,eAAed,eAAe","ignoreList":[]}

package/lib/esm/components/small-wait-cursor/SmallWaitCursor.styles.js CHANGED Viewed

@@ -49,8 +49,12 @@ export const StyledSmallWaitCursorWaitCursor = styled.div`
     border-color: ${_ref4 => {
   let {
     theme,
-    $shouldHideBackground
+    $shouldHideBackground,
+    $color
   } = _ref4;
+  if ($color) {
+    return $color;
+  }
   return theme.colorMode === 'dark' && $shouldHideBackground ? theme.headline : theme.primary;
 }};
     height: ${_ref5 => {

package/lib/esm/components/small-wait-cursor/SmallWaitCursor.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SmallWaitCursor.styles.js","names":["styled","keyframes","StyledSmallWaitCursor","div","_ref","$size","_ref2","_ref3","$shouldShowWaitCursor","StyledSmallWaitCursorBackground","spin","StyledSmallWaitCursorWaitCursor","_ref4","theme","$shouldHideBackground","colorMode","headline","primary","_ref5","_ref6","_ref7","$speed"],"sources":["../../../../src/components/small-wait-cursor/SmallWaitCursor.styles.ts"],"sourcesContent":["import styled, { keyframes } from 'styled-components';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\nimport type { SmallWaitCursorSize, SmallWaitCursorSpeed } from './SmallWaitCursor';\n\ntype StyledSmallWaitCursorProps = WithTheme<{\n $shouldShowWaitCursor: boolean;\n $size: SmallWaitCursorSize \| number;\n}>;\n\nexport const StyledSmallWaitCursor = styled.div<StyledSmallWaitCursorProps>`\n position: relative;\n height: ${({ $size }) => $size}px;\n width: ${({ $size }) => $size}px;\n opacity: ${({ $shouldShowWaitCursor }) => ($shouldShowWaitCursor ? 1 : 0)};\n`;\n\ntype StyledSmallWaitCursorBackgroundProps = WithTheme<unknown>;\n\nexport const StyledSmallWaitCursorBackground = styled.div<StyledSmallWaitCursorBackgroundProps>`\n background-color: white;\n border-radius: 50%;\n height: 100%;\n width: 100%;\n position: relative;\n z-index: 1;\n box-shadow:\n 0 4px 12px 0 rgba(0, 0, 0, 0.2),\n 0 1px 1px rgba(0, 0, 0, 0.2);\n`;\n\ntype StyledSmallWaitCursorWaitCursorProps = WithTheme<{\n $size: SmallWaitCursorSize \| number;\n $speed: SmallWaitCursorSpeed;\n $shouldHideBackground: boolean;\n}>;\n\nconst spin = keyframes`\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n`;\n\nexport const StyledSmallWaitCursorWaitCursor = styled.div<StyledSmallWaitCursorWaitCursorProps>`\n position: absolute;\n top: 5px;\n left: 5px;\n z-index: 2;\n border-style: solid;\n border-width: 3px;\n border-color: ${({ theme, $shouldHideBackground }: StyledSmallWaitCursorWaitCursorProps) ~~=>\~~n theme.colorMode === 'dark' && $shouldHideBackground ? theme.headline : theme.primary};\n height: ${({ $size }) => `${$size - 10}px`};\n width: ${({ $size }) => `${$size - 10}px`};\n border-radius: 50%;\n display: inline-block;\n border-top: 3px solid transparent;\n\n animation: ${spin} ${({ $speed }) => $speed}s linear infinite;\n`;\n"],"mappings":"AAAA,OAAOA,MAAM,IAAIC,SAAS,QAAQ,mBAAmB;AASrD,OAAO,MAAMC,qBAAqB,GAAGF,MAAM,CAACG,GAA+B;AAC3E;AACA,cAAcC,IAAA;EAAA,IAAC;IAAEC;EAAM,CAAC,GAAAD,IAAA;EAAA,OAAKC,KAAK;AAAA;AAClC,aAAaC,KAAA;EAAA,IAAC;IAAED;EAAM,CAAC,GAAAC,KAAA;EAAA,OAAKD,KAAK;AAAA;AACjC,eAAeE,KAAA;EAAA,IAAC;IAAEC;EAAsB,CAAC,GAAAD,KAAA;EAAA,OAAMC,qBAAqB,GAAG,CAAC,GAAG,CAAC;AAAA,CAAC;AAC7E,CAAC;AAID,OAAO,MAAMC,+BAA+B,GAAGT,MAAM,CAACG,GAAyC;AAC/F;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;~~AAQD~~,MAAMO,IAAI,GAAGT,SAAS;AACtB;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAED,OAAO,MAAMU,+BAA+B,GAAGX,MAAM,CAACG,GAAyC;AAC/F;AACA;AACA;AACA;AACA;AACA;AACA,oBAAoBS,KAAA;EAAA,~~IAAC~~;~~IAAEC~~,KAAK;~~IAAEC~~;~~EAA4D~~,CAAC,~~GAAAF~~,KAAA;~~EAAA~~,~~OACnFC~~,KAAK,~~CAACE~~,SAAS,KAAK,MAAM,~~IAAID~~,qBAAqB,GAAGD,KAAK,~~CAACG~~,QAAQ,~~GAAGH~~,KAAK,~~CAACI~~,OAAO;~~AAAA~~;~~AAC5F~~,cAAcC,KAAA;EAAA,IAAC;~~IAAEb~~;EAAM,CAAC,~~GAAAa~~,KAAA;EAAA,OAAK,~~GAAGb~~,KAAK,GAAG,EAAE,IAAI;AAAA;AAC9C,~~aAAac~~,KAAA;EAAA,IAAC;~~IAAEd~~;EAAM,CAAC,~~GAAAc~~,KAAA;EAAA,OAAK,~~GAAGd~~,KAAK,GAAG,EAAE,IAAI;AAAA;AAC7C;AACA;AACA;AACA;AACA,iBAAiBK,IAAI,~~IAAIU~~,KAAA;EAAA,IAAC;IAAEC;EAAO,CAAC,GAAAD,KAAA;EAAA,OAAKC,MAAM;AAAA;AAC/C,CAAC","ignoreList":[]}
1	+ {"version":3,"file":"SmallWaitCursor.styles.js","names":["styled","keyframes","StyledSmallWaitCursor","div","_ref","$size","_ref2","_ref3","$shouldShowWaitCursor","StyledSmallWaitCursorBackground","spin","StyledSmallWaitCursorWaitCursor","_ref4","theme","$shouldHideBackground","$color","colorMode","headline","primary","_ref5","_ref6","_ref7","$speed"],"sources":["../../../../src/components/small-wait-cursor/SmallWaitCursor.styles.ts"],"sourcesContent":["import styled, { keyframes } from 'styled-components';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\nimport type { SmallWaitCursorSize, SmallWaitCursorSpeed } from './SmallWaitCursor';\n\ntype StyledSmallWaitCursorProps = WithTheme<{\n $shouldShowWaitCursor: boolean;\n $size: SmallWaitCursorSize \| number;\n}>;\n\nexport const StyledSmallWaitCursor = styled.div<StyledSmallWaitCursorProps>`\n position: relative;\n height: ${({ $size }) => $size}px;\n width: ${({ $size }) => $size}px;\n opacity: ${({ $shouldShowWaitCursor }) => ($shouldShowWaitCursor ? 1 : 0)};\n`;\n\ntype StyledSmallWaitCursorBackgroundProps = WithTheme<unknown>;\n\nexport const StyledSmallWaitCursorBackground = styled.div<StyledSmallWaitCursorBackgroundProps>`\n background-color: white;\n border-radius: 50%;\n height: 100%;\n width: 100%;\n position: relative;\n z-index: 1;\n box-shadow:\n 0 4px 12px 0 rgba(0, 0, 0, 0.2),\n 0 1px 1px rgba(0, 0, 0, 0.2);\n`;\n\ntype StyledSmallWaitCursorWaitCursorProps = WithTheme<{\n $size: SmallWaitCursorSize \| number;\n $speed: SmallWaitCursorSpeed;\n $shouldHideBackground: boolean;\n $color?: string;\n}>;\n\nconst spin = keyframes`\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n`;\n\nexport const StyledSmallWaitCursorWaitCursor = styled.div<StyledSmallWaitCursorWaitCursorProps>`\n position: absolute;\n top: 5px;\n left: 5px;\n z-index: 2;\n border-style: solid;\n border-width: 3px;\n border-color: ${({\n theme,\n $shouldHideBackground,\n $color,\n }: StyledSmallWaitCursorWaitCursorProps) => {\n if ($color) {\n return $color;\n }\n\n return theme.colorMode === 'dark' && $shouldHideBackground ? theme.headline : theme.primary;\n }};\n height: ${({ $size }) => `${$size - 10}px`};\n width: ${({ $size }) => `${$size - 10}px`};\n border-radius: 50%;\n display: inline-block;\n border-top: 3px solid transparent;\n\n animation: ${spin} ${({ $speed }) => $speed}s linear infinite;\n`;\n"],"mappings":"AAAA,OAAOA,MAAM,IAAIC,SAAS,QAAQ,mBAAmB;AASrD,OAAO,MAAMC,qBAAqB,GAAGF,MAAM,CAACG,GAA+B;AAC3E;AACA,cAAcC,IAAA;EAAA,IAAC;IAAEC;EAAM,CAAC,GAAAD,IAAA;EAAA,OAAKC,KAAK;AAAA;AAClC,aAAaC,KAAA;EAAA,IAAC;IAAED;EAAM,CAAC,GAAAC,KAAA;EAAA,OAAKD,KAAK;AAAA;AACjC,eAAeE,KAAA;EAAA,IAAC;IAAEC;EAAsB,CAAC,GAAAD,KAAA;EAAA,OAAMC,qBAAqB,GAAG,CAAC,GAAG,CAAC;AAAA,CAAC;AAC7E,CAAC;AAID,OAAO,MAAMC,+BAA+B,GAAGT,MAAM,CAACG,GAAyC;AAC/F;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AASD,MAAMO,IAAI,GAAGT,SAAS;AACtB;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAED,OAAO,MAAMU,+BAA+B,GAAGX,MAAM,CAACG,GAAyC;AAC/F;AACA;AACA;AACA;AACA;AACA;AACA,oBAAoBS,KAAA,IAI4B;EAAA,IAJ3B;IACbC,KAAK;IACLC,qBAAqB;IACrBC;EACkC,CAAC,GAAAH,KAAA;EACnC,IAAIG,MAAM,EAAE;IACR,OAAOA,MAAM;EACjB;EAEA,OAAOF,KAAK,CAACG,SAAS,KAAK,MAAM,IAAIF,qBAAqB,GAAGD,KAAK,CAACI,QAAQ,GAAGJ,KAAK,CAACK,OAAO;AAC/F,CAAC;AACL,cAAcC,KAAA;EAAA,IAAC;IAAEd;EAAM,CAAC,GAAAc,KAAA;EAAA,OAAK,GAAGd,KAAK,GAAG,EAAE,IAAI;AAAA;AAC9C,aAAae,KAAA;EAAA,IAAC;IAAEf;EAAM,CAAC,GAAAe,KAAA;EAAA,OAAK,GAAGf,KAAK,GAAG,EAAE,IAAI;AAAA;AAC7C;AACA;AACA;AACA;AACA,iBAAiBK,IAAI,IAAIW,KAAA;EAAA,IAAC;IAAEC;EAAO,CAAC,GAAAD,KAAA;EAAA,OAAKC,MAAM;AAAA;AAC/C,CAAC","ignoreList":[]}

package/lib/types/components/small-wait-cursor/SmallWaitCursor.d.ts CHANGED Viewed

@@ -25,6 +25,10 @@ export type SmallWaitCursorProps = {
      * The speed of the animation in seconds. Use the SmallWaitCursorSpeed enum for this prop.
      */
     speed?: SmallWaitCursorSpeed;
+    /**
+     * The color of the inner circle of the wait cursor.
+     */
+    color?: string;
 };
 declare const SmallWaitCursor: FC<SmallWaitCursorProps>;
 export default SmallWaitCursor;

package/lib/types/components/small-wait-cursor/SmallWaitCursor.styles.d.ts CHANGED Viewed

@@ -12,6 +12,7 @@ type StyledSmallWaitCursorWaitCursorProps = WithTheme<{
     $size: SmallWaitCursorSize | number;
     $speed: SmallWaitCursorSpeed;
     $shouldHideBackground: boolean;
+    $color?: string;
 }>;
 export declare const StyledSmallWaitCursorWaitCursor: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, StyledSmallWaitCursorWaitCursorProps>> & string;
 export {};

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
     "name": "@chayns-components/core",
-    "version": "5.0.0-beta.719",
+    "version": "5.0.0-beta.721",
     "description": "A set of beautiful React components for developing your own applications with chayns.",
     "sideEffects": false,
     "browserslist": [
@@ -61,7 +61,7 @@
         "@types/uuid": "^9.0.8",
         "babel-loader": "^9.1.3",
         "cross-env": "^7.0.3",
-        "lerna": "^8.1.7",
+        "lerna": "^8.1.8",
         "react": "^18.3.1",
         "react-dom": "^18.3.1",
         "styled-components": "^6.1.12",
@@ -85,5 +85,5 @@
     "publishConfig": {
         "access": "public"
     },
-    "gitHead": "d40c2613880a6867019a5a42d560312df5496ae2"
+    "gitHead": "7387e7b75e9d85bec0ebd7d3cbde49b39dea3d50"
 }