@chayns-components/core 5.0.0-beta.837 → 5.0.0-beta.841
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/cjs/components/combobox/ComboBox.js +1 -1
- package/lib/cjs/components/combobox/ComboBox.js.map +1 -1
- package/lib/cjs/components/context-menu/ContextMenu.js +1 -1
- package/lib/cjs/components/context-menu/ContextMenu.js.map +1 -1
- package/lib/cjs/components/file-input/FileInput.js +1 -1
- package/lib/cjs/components/file-input/FileInput.js.map +1 -1
- package/lib/cjs/components/filter-buttons/FilterButtons.js +1 -1
- package/lib/cjs/components/filter-buttons/FilterButtons.js.map +1 -1
- package/lib/cjs/components/popup/Popup.js +1 -1
- package/lib/cjs/components/popup/Popup.js.map +1 -1
- package/lib/cjs/components/scroll-view/ScrollView.js +18 -7
- package/lib/cjs/components/scroll-view/ScrollView.js.map +1 -1
- package/lib/cjs/components/scroll-view/ScrollView.styles.js +31 -3
- package/lib/cjs/components/scroll-view/ScrollView.styles.js.map +1 -1
- package/lib/cjs/components/search-box/SearchBox.js +5 -5
- package/lib/cjs/components/search-box/SearchBox.js.map +1 -1
- package/lib/cjs/components/tag-input/TagInput.js +1 -1
- package/lib/cjs/components/tag-input/TagInput.js.map +1 -1
- package/lib/cjs/components/tooltip/Tooltip.js +1 -1
- package/lib/cjs/components/tooltip/Tooltip.js.map +1 -1
- package/lib/cjs/utils/calculate.js +1 -1
- package/lib/cjs/utils/calculate.js.map +1 -1
- package/lib/esm/components/combobox/ComboBox.js +1 -1
- package/lib/esm/components/combobox/ComboBox.js.map +1 -1
- package/lib/esm/components/context-menu/ContextMenu.js +1 -1
- package/lib/esm/components/context-menu/ContextMenu.js.map +1 -1
- package/lib/esm/components/file-input/FileInput.js +1 -1
- package/lib/esm/components/file-input/FileInput.js.map +1 -1
- package/lib/esm/components/filter-buttons/FilterButtons.js +1 -1
- package/lib/esm/components/filter-buttons/FilterButtons.js.map +1 -1
- package/lib/esm/components/popup/Popup.js +1 -1
- package/lib/esm/components/popup/Popup.js.map +1 -1
- package/lib/esm/components/scroll-view/ScrollView.js +18 -7
- package/lib/esm/components/scroll-view/ScrollView.js.map +1 -1
- package/lib/esm/components/scroll-view/ScrollView.styles.js +49 -6
- package/lib/esm/components/scroll-view/ScrollView.styles.js.map +1 -1
- package/lib/esm/components/search-box/SearchBox.js +5 -5
- package/lib/esm/components/search-box/SearchBox.js.map +1 -1
- package/lib/esm/components/tag-input/TagInput.js +1 -1
- package/lib/esm/components/tag-input/TagInput.js.map +1 -1
- package/lib/esm/components/tooltip/Tooltip.js +1 -1
- package/lib/esm/components/tooltip/Tooltip.js.map +1 -1
- package/lib/esm/utils/calculate.js +1 -1
- package/lib/esm/utils/calculate.js.map +1 -1
- package/lib/types/components/scroll-view/ScrollView.d.ts +23 -3
- package/lib/types/components/scroll-view/ScrollView.styles.d.ts +6 -1
- package/package.json +9 -9
|
@@ -263,7 +263,7 @@ const ComboBox = ({
|
|
|
263
263
|
return styles;
|
|
264
264
|
}, [direction, internalCoordinates.x, internalCoordinates.y]);
|
|
265
265
|
(0, _react.useEffect)(() => {
|
|
266
|
-
setPortal(() => /*#__PURE__*/(0, _reactDom.createPortal)(
|
|
266
|
+
setPortal(() => /*#__PURE__*/(0, _reactDom.createPortal)(/*#__PURE__*/_react.default.createElement(_framerMotion.AnimatePresence, {
|
|
267
267
|
initial: false
|
|
268
268
|
}, isAnimating && /*#__PURE__*/_react.default.createElement(_ComboBox.StyledMotionComboBoxBody, {
|
|
269
269
|
$browser: browser === null || browser === void 0 ? void 0 : browser.name,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ComboBox.js","names":["_chaynsApi","require","_framerMotion","_react","_interopRequireWildcard","_reactDom","_comboBox","_calculate","_environment","_Icon","_interopRequireDefault","_ComboBoxItem","_ComboBox","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ComboBox","direction","ComboBoxDirection","BOTTOM","isDisabled","lists","maxHeight","onSelect","placeholder","container","document","body","selectedItem","shouldShowBigImage","shouldShowRoundImage","shouldUseFullWidth","internalSelectedItem","setInternalSelectedItem","useState","isAnimating","setIsAnimating","minWidth","setMinWidth","focusedIndex","setFocusedIndex","overflowY","setOverflowY","portal","setPortal","internalCoordinates","setInternalCoordinates","x","y","styledComboBoxElementRef","useRef","contentRef","browser","useDevice","isTouch","getIsTouch","handleClick","useCallback","event","current","contains","target","handleOpen","left","comboBoxLeft","top","comboBoxTop","height","getBoundingClientRect","containerLeft","containerTop","scrollLeft","scrollTop","TOP","handleClose","useEffect","addEventListener","removeEventListener","handleSetSelectedItem","itemToSelect","currentContent","scrollHeight","maxHeightInPixels","getMaxHeightInPixels","handleKeyDown","key","_contentRef$current","preventDefault","children","length","newIndex","prevElement","tabIndex","newElement","focus","_contentRef$current2","element","id","newSelectedItem","some","list","find","value","String","replace","_styledComboBoxElemen","allItems","flatMap","isAtLeastOneItemWithImageGiven","imageUrl","isAtLeastOneItemWithIconGiven","icons","width","parentElement","calculateContentWidth","text","placeholderImageUrl","useMemo","undefined","placeholderIcon","placeholderText","handleHeaderClick","comboBoxGroups","map","groupName","createElement","StyledComboBoxTopic","item","isSelected","rightElement","subtext","suffixElement","bodyStyles","styles","transform","createPortal","AnimatePresence","initial","StyledMotionComboBoxBody","$browser","name","animate","opacity","$overflowY","exit","$maxHeight","$minWidth","style","$direction","transition","duration","ref","StyledComboBox","$shouldUseFullWidth","StyledComboBoxHeader","onClick","$isOpen","$isTouch","$isDisabled","StyledComboBoxPlaceholder","$shouldReduceOpacity","StyledComboBoxPlaceholderImage","src","StyledComboBoxIconWrapper","displayName","_default","exports"],"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 { calculateContentWidth, getMaxHeightInPixels } 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 {\n StyledComboBox,\n StyledComboBoxHeader,\n StyledComboBoxIconWrapper,\n StyledComboBoxPlaceholder,\n StyledComboBoxPlaceholderImage,\n StyledComboBoxTopic,\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 isDisabled?: boolean;\n rightElement?: ReactNode;\n subtext?: 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 bigger shape. This prop will automatically be set to true if the subtext of an item is given.\n */\n shouldShowBigImage?: boolean;\n /**\n * If true, the images of the items are displayed in a round shape.\n */\n shouldShowRoundImage?: boolean;\n /**\n * Whether the width of the 'ComboBox' should be the width of the 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 shouldShowBigImage,\n shouldShowRoundImage,\n shouldUseFullWidth = false,\n}) => {\n const [internalSelectedItem, setInternalSelectedItem] = 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 contentRef.current &&\n !contentRef.current.contains(event.target as Node)\n ) {\n setIsAnimating(false);\n }\n },\n [styledComboBoxElementRef],\n );\n\n const handleOpen = useCallback(() => {\n if (styledComboBoxElementRef.current) {\n const {\n left: comboBoxLeft,\n top: comboBoxTop,\n height,\n } = styledComboBoxElementRef.current.getBoundingClientRect();\n const { left: containerLeft, top: containerTop } = container.getBoundingClientRect();\n\n const x = comboBoxLeft - containerLeft + container.scrollLeft;\n const y = comboBoxTop - containerTop + container.scrollTop;\n\n setInternalCoordinates({\n x,\n y: direction === ComboBoxDirection.TOP ? y : y + height,\n });\n\n setIsAnimating(true);\n }\n }, [container, 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 setInternalSelectedItem(itemToSelect);\n setIsAnimating(false);\n\n if (onSelect) {\n onSelect(itemToSelect);\n }\n },\n [onSelect],\n );\n\n useEffect(() => {\n const currentContent = contentRef.current;\n\n if (portal && isAnimating && currentContent) {\n const scrollHeight = currentContent.scrollHeight ?? 0;\n\n const maxHeightInPixels = getMaxHeightInPixels(\n maxHeight,\n styledComboBoxElementRef.current ?? document.body,\n );\n\n setOverflowY(scrollHeight > maxHeightInPixels ? 'scroll' : 'hidden');\n }\n }, [isAnimating, maxHeight, portal]);\n\n useEffect(() => {\n const handleKeyDown = (e: KeyboardEvent) => {\n if (!isAnimating) {\n return;\n }\n\n if (e.key === 'ArrowUp' || e.key === 'ArrowDown') {\n e.preventDefault();\n const children = contentRef.current?.children;\n if (children && children.length > 0) {\n const newIndex =\n focusedIndex !== null\n ? (focusedIndex + (e.key === 'ArrowUp' ? -1 : 1) + children.length) %\n children.length\n : 0;\n\n if (focusedIndex !== null) {\n const prevElement = children[focusedIndex] as HTMLDivElement;\n prevElement.tabIndex = -1;\n }\n\n setFocusedIndex(newIndex);\n\n const newElement = children[newIndex] as HTMLDivElement;\n newElement.tabIndex = 0;\n newElement.focus();\n }\n } else if (e.key === 'Enter' && focusedIndex !== null) {\n const element = contentRef.current?.children[focusedIndex];\n\n if (!element) {\n return;\n }\n\n const { id } = element;\n\n let newSelectedItem: IComboBoxItem | undefined;\n\n lists.some((list) => {\n newSelectedItem = list.list.find(\n ({ value }) => String(value) === id.replace('combobox-item__', ''),\n );\n return !!newSelectedItem;\n });\n\n if (!newSelectedItem) {\n return;\n }\n\n handleSetSelectedItem(newSelectedItem);\n }\n };\n\n document.addEventListener('keydown', handleKeyDown);\n\n return () => {\n document.removeEventListener('keydown', handleKeyDown);\n };\n }, [focusedIndex, handleSetSelectedItem, isAnimating, lists]);\n\n /**\n * This function calculates the greatest width\n */\n useEffect(() => {\n const allItems = lists.flatMap((list) => list.list);\n\n const isAtLeastOneItemWithImageGiven = allItems.some(({ imageUrl }) => imageUrl);\n const isAtLeastOneItemWithIconGiven = allItems.some(({ icons }) => icons);\n\n const width =\n styledComboBoxElementRef.current?.parentElement?.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 setInternalSelectedItem(selectedItem);\n }, [selectedItem]);\n\n const placeholderImageUrl = useMemo(() => {\n if (selectedItem) {\n return selectedItem.imageUrl;\n }\n\n if (internalSelectedItem) {\n return internalSelectedItem.imageUrl;\n }\n\n return undefined;\n }, [internalSelectedItem, selectedItem]);\n\n const placeholderIcon = useMemo(() => {\n if (selectedItem) {\n return selectedItem.icons;\n }\n\n if (internalSelectedItem) {\n return internalSelectedItem.icons;\n }\n\n return undefined;\n }, [internalSelectedItem, selectedItem]);\n\n /**\n * This function resets the placeholder\n */\n const placeholderText = useMemo(() => {\n let text = placeholder;\n\n if (selectedItem) {\n text = selectedItem.text;\n } else if (internalSelectedItem) {\n text = internalSelectedItem.text;\n }\n\n return text;\n }, [internalSelectedItem, placeholder, selectedItem]);\n\n /**\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((item) => (\n // ToDo: Cleanup this - item should be given as a prop to avoid full spreading\n <ComboBoxItem\n icons={item.icons}\n id={item.value}\n imageUrl={item.imageUrl}\n isDisabled={item.isDisabled}\n isSelected={selectedItem ? item.value === selectedItem.value : false}\n key={item.value}\n onSelect={handleSetSelectedItem}\n rightElement={item.rightElement}\n shouldShowBigImage={shouldShowBigImage}\n shouldShowRoundImage={shouldShowRoundImage}\n subtext={item.subtext}\n suffixElement={item.suffixElement}\n text={item.text}\n value={item.value}\n />\n ))}\n </div>\n )),\n [handleSetSelectedItem, lists, selectedItem, shouldShowBigImage, shouldShowRoundImage],\n );\n\n const bodyStyles = useMemo(() => {\n let styles: CSSProperties = { left: internalCoordinates.x, top: internalCoordinates.y };\n\n if (direction === ComboBoxDirection.TOP) {\n styles = { ...styles, transform: 'translateY(-100%)' };\n }\n\n return styles;\n }, [direction, internalCoordinates.x, internalCoordinates.y]);\n\n useEffect(() => {\n 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 $shouldReduceOpacity={!selectedItem && !internalSelectedItem}\n >\n {placeholderImageUrl && (\n <StyledComboBoxPlaceholderImage\n src={placeholderImageUrl}\n shouldShowRoundImage={shouldShowRoundImage}\n />\n )}\n {placeholderIcon && <Icon icons={placeholderIcon} />}\n {placeholderText}\n {internalSelectedItem &&\n internalSelectedItem.suffixElement &&\n internalSelectedItem.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 internalSelectedItem,\n minWidth,\n placeholderIcon,\n placeholderImageUrl,\n placeholderText,\n portal,\n selectedItem,\n shouldShowRoundImage,\n shouldUseFullWidth,\n ],\n );\n};\n\nComboBox.displayName = 'ComboBox';\n\nexport default ComboBox;\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"ComboBox.js","names":["_chaynsApi","require","_framerMotion","_react","_interopRequireWildcard","_reactDom","_comboBox","_calculate","_environment","_Icon","_interopRequireDefault","_ComboBoxItem","_ComboBox","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ComboBox","direction","ComboBoxDirection","BOTTOM","isDisabled","lists","maxHeight","onSelect","placeholder","container","document","body","selectedItem","shouldShowBigImage","shouldShowRoundImage","shouldUseFullWidth","internalSelectedItem","setInternalSelectedItem","useState","isAnimating","setIsAnimating","minWidth","setMinWidth","focusedIndex","setFocusedIndex","overflowY","setOverflowY","portal","setPortal","internalCoordinates","setInternalCoordinates","x","y","styledComboBoxElementRef","useRef","contentRef","browser","useDevice","isTouch","getIsTouch","handleClick","useCallback","event","current","contains","target","handleOpen","left","comboBoxLeft","top","comboBoxTop","height","getBoundingClientRect","containerLeft","containerTop","scrollLeft","scrollTop","TOP","handleClose","useEffect","addEventListener","removeEventListener","handleSetSelectedItem","itemToSelect","currentContent","scrollHeight","maxHeightInPixels","getMaxHeightInPixels","handleKeyDown","key","_contentRef$current","preventDefault","children","length","newIndex","prevElement","tabIndex","newElement","focus","_contentRef$current2","element","id","newSelectedItem","some","list","find","value","String","replace","_styledComboBoxElemen","allItems","flatMap","isAtLeastOneItemWithImageGiven","imageUrl","isAtLeastOneItemWithIconGiven","icons","width","parentElement","calculateContentWidth","text","placeholderImageUrl","useMemo","undefined","placeholderIcon","placeholderText","handleHeaderClick","comboBoxGroups","map","groupName","createElement","StyledComboBoxTopic","item","isSelected","rightElement","subtext","suffixElement","bodyStyles","styles","transform","createPortal","AnimatePresence","initial","StyledMotionComboBoxBody","$browser","name","animate","opacity","$overflowY","exit","$maxHeight","$minWidth","style","$direction","transition","duration","ref","StyledComboBox","$shouldUseFullWidth","StyledComboBoxHeader","onClick","$isOpen","$isTouch","$isDisabled","StyledComboBoxPlaceholder","$shouldReduceOpacity","StyledComboBoxPlaceholderImage","src","StyledComboBoxIconWrapper","displayName","_default","exports"],"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 { calculateContentWidth, getMaxHeightInPixels } 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 {\n StyledComboBox,\n StyledComboBoxHeader,\n StyledComboBoxIconWrapper,\n StyledComboBoxPlaceholder,\n StyledComboBoxPlaceholderImage,\n StyledComboBoxTopic,\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 isDisabled?: boolean;\n rightElement?: ReactNode;\n subtext?: 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 bigger shape. This prop will automatically be set to true if the subtext of an item is given.\n */\n shouldShowBigImage?: boolean;\n /**\n * If true, the images of the items are displayed in a round shape.\n */\n shouldShowRoundImage?: boolean;\n /**\n * Whether the width of the 'ComboBox' should be the width of the 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 shouldShowBigImage,\n shouldShowRoundImage,\n shouldUseFullWidth = false,\n}) => {\n const [internalSelectedItem, setInternalSelectedItem] = 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 contentRef.current &&\n !contentRef.current.contains(event.target as Node)\n ) {\n setIsAnimating(false);\n }\n },\n [styledComboBoxElementRef],\n );\n\n const handleOpen = useCallback(() => {\n if (styledComboBoxElementRef.current) {\n const {\n left: comboBoxLeft,\n top: comboBoxTop,\n height,\n } = styledComboBoxElementRef.current.getBoundingClientRect();\n const { left: containerLeft, top: containerTop } = container.getBoundingClientRect();\n\n const x = comboBoxLeft - containerLeft + container.scrollLeft;\n const y = comboBoxTop - containerTop + container.scrollTop;\n\n setInternalCoordinates({\n x,\n y: direction === ComboBoxDirection.TOP ? y : y + height,\n });\n\n setIsAnimating(true);\n }\n }, [container, 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 setInternalSelectedItem(itemToSelect);\n setIsAnimating(false);\n\n if (onSelect) {\n onSelect(itemToSelect);\n }\n },\n [onSelect],\n );\n\n useEffect(() => {\n const currentContent = contentRef.current;\n\n if (portal && isAnimating && currentContent) {\n const scrollHeight = currentContent.scrollHeight ?? 0;\n\n const maxHeightInPixels = getMaxHeightInPixels(\n maxHeight,\n styledComboBoxElementRef.current ?? document.body,\n );\n\n setOverflowY(scrollHeight > maxHeightInPixels ? 'scroll' : 'hidden');\n }\n }, [isAnimating, maxHeight, portal]);\n\n useEffect(() => {\n const handleKeyDown = (e: KeyboardEvent) => {\n if (!isAnimating) {\n return;\n }\n\n if (e.key === 'ArrowUp' || e.key === 'ArrowDown') {\n e.preventDefault();\n const children = contentRef.current?.children;\n if (children && children.length > 0) {\n const newIndex =\n focusedIndex !== null\n ? (focusedIndex + (e.key === 'ArrowUp' ? -1 : 1) + children.length) %\n children.length\n : 0;\n\n if (focusedIndex !== null) {\n const prevElement = children[focusedIndex] as HTMLDivElement;\n prevElement.tabIndex = -1;\n }\n\n setFocusedIndex(newIndex);\n\n const newElement = children[newIndex] as HTMLDivElement;\n newElement.tabIndex = 0;\n newElement.focus();\n }\n } else if (e.key === 'Enter' && focusedIndex !== null) {\n const element = contentRef.current?.children[focusedIndex];\n\n if (!element) {\n return;\n }\n\n const { id } = element;\n\n let newSelectedItem: IComboBoxItem | undefined;\n\n lists.some((list) => {\n newSelectedItem = list.list.find(\n ({ value }) => String(value) === id.replace('combobox-item__', ''),\n );\n return !!newSelectedItem;\n });\n\n if (!newSelectedItem) {\n return;\n }\n\n handleSetSelectedItem(newSelectedItem);\n }\n };\n\n document.addEventListener('keydown', handleKeyDown);\n\n return () => {\n document.removeEventListener('keydown', handleKeyDown);\n };\n }, [focusedIndex, handleSetSelectedItem, isAnimating, lists]);\n\n /**\n * This function calculates the greatest width\n */\n useEffect(() => {\n const allItems = lists.flatMap((list) => list.list);\n\n const isAtLeastOneItemWithImageGiven = allItems.some(({ imageUrl }) => imageUrl);\n const isAtLeastOneItemWithIconGiven = allItems.some(({ icons }) => icons);\n\n const width =\n styledComboBoxElementRef.current?.parentElement?.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 setInternalSelectedItem(selectedItem);\n }, [selectedItem]);\n\n const placeholderImageUrl = useMemo(() => {\n if (selectedItem) {\n return selectedItem.imageUrl;\n }\n\n if (internalSelectedItem) {\n return internalSelectedItem.imageUrl;\n }\n\n return undefined;\n }, [internalSelectedItem, selectedItem]);\n\n const placeholderIcon = useMemo(() => {\n if (selectedItem) {\n return selectedItem.icons;\n }\n\n if (internalSelectedItem) {\n return internalSelectedItem.icons;\n }\n\n return undefined;\n }, [internalSelectedItem, selectedItem]);\n\n /**\n * This function resets the placeholder\n */\n const placeholderText = useMemo(() => {\n let text = placeholder;\n\n if (selectedItem) {\n text = selectedItem.text;\n } else if (internalSelectedItem) {\n text = internalSelectedItem.text;\n }\n\n return text;\n }, [internalSelectedItem, placeholder, selectedItem]);\n\n /**\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((item) => (\n // ToDo: Cleanup this - item should be given as a prop to avoid full spreading\n <ComboBoxItem\n icons={item.icons}\n id={item.value}\n imageUrl={item.imageUrl}\n isDisabled={item.isDisabled}\n isSelected={selectedItem ? item.value === selectedItem.value : false}\n key={item.value}\n onSelect={handleSetSelectedItem}\n rightElement={item.rightElement}\n shouldShowBigImage={shouldShowBigImage}\n shouldShowRoundImage={shouldShowRoundImage}\n subtext={item.subtext}\n suffixElement={item.suffixElement}\n text={item.text}\n value={item.value}\n />\n ))}\n </div>\n )),\n [handleSetSelectedItem, lists, selectedItem, shouldShowBigImage, shouldShowRoundImage],\n );\n\n const bodyStyles = useMemo(() => {\n let styles: CSSProperties = { left: internalCoordinates.x, top: internalCoordinates.y };\n\n if (direction === ComboBoxDirection.TOP) {\n styles = { ...styles, transform: 'translateY(-100%)' };\n }\n\n return styles;\n }, [direction, internalCoordinates.x, internalCoordinates.y]);\n\n useEffect(() => {\n 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 $shouldReduceOpacity={!selectedItem && !internalSelectedItem}\n >\n {placeholderImageUrl && (\n <StyledComboBoxPlaceholderImage\n src={placeholderImageUrl}\n shouldShowRoundImage={shouldShowRoundImage}\n />\n )}\n {placeholderIcon && <Icon icons={placeholderIcon} />}\n {placeholderText}\n {internalSelectedItem &&\n internalSelectedItem.suffixElement &&\n internalSelectedItem.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 internalSelectedItem,\n minWidth,\n placeholderIcon,\n placeholderImageUrl,\n placeholderText,\n portal,\n selectedItem,\n shouldShowRoundImage,\n shouldUseFullWidth,\n ],\n );\n};\n\nComboBox.displayName = 'ComboBox';\n\nexport default ComboBox;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -132,7 +132,7 @@ const ContextMenu = /*#__PURE__*/(0, _react.forwardRef)(({
|
|
|
132
132
|
};
|
|
133
133
|
}, [handleDocumentClick, handleHide, isContentShown, onHide, onShow]);
|
|
134
134
|
(0, _react.useEffect)(() => {
|
|
135
|
-
setPortal(() => /*#__PURE__*/(0, _reactDom.createPortal)(
|
|
135
|
+
setPortal(() => /*#__PURE__*/(0, _reactDom.createPortal)(/*#__PURE__*/_react.default.createElement(_framerMotion.AnimatePresence, {
|
|
136
136
|
initial: false
|
|
137
137
|
}, isContentShown && /*#__PURE__*/_react.default.createElement(_ContextMenuContent.default, {
|
|
138
138
|
coordinates: coordinates ?? internalCoordinates,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ContextMenu.js","names":["_chaynsApi","require","_framerMotion","_react","_interopRequireWildcard","_reactDom","_uuid","_contextMenu","_environment","_Icon","_interopRequireDefault","_ContextMenuContent","_ContextMenu","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ContextMenu","forwardRef","alignment","children","createElement","icons","size","container","document","querySelector","body","coordinates","isInDialog","items","onHide","onShow","shouldCloseOnPopupClick","ref","internalCoordinates","setInternalCoordinates","useState","x","y","internalAlignment","setInternalAlignment","ContextMenuAlignment","TopLeft","isContentShown","setIsContentShown","portal","setPortal","uuid","useUuid","contextMenuContentRef","useRef","contextMenuRef","handleHide","useCallback","handleShow","isTouch","getIsTouch","result","createDialog","type","DialogType","SELECT","buttons","list","map","text","index","name","id","icon","open","_items$result$","onClick","current","height","childrenHeight","left","childrenLeft","top","childrenTop","width","childrenWidth","getBoundingClientRect","window","scrollX","scrollY","BottomRight","TopRight","BottomLeft","handleClick","event","preventDefault","stopPropagation","handleDocumentClick","_contextMenuContentRe","contains","target","useImperativeHandle","hide","show","useEffect","addEventListener","removeEventListener","createPortal","AnimatePresence","initial","key","Fragment","StyledContextMenu","className","displayName","_default","exports"],"sources":["../../../../src/components/context-menu/ContextMenu.tsx"],"sourcesContent":["import { createDialog, DialogType } from 'chayns-api';\nimport { AnimatePresence } from 'framer-motion';\nimport React, {\n forwardRef,\n MouseEvent,\n MouseEventHandler,\n ReactNode,\n ReactPortal,\n useCallback,\n useEffect,\n useImperativeHandle,\n useRef,\n useState,\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport { useUuid } from '../../hooks/uuid';\nimport { ContextMenuAlignment } from '../../types/contextMenu';\nimport { getIsTouch } from '../../utils/environment';\nimport Icon from '../icon/Icon';\nimport ContextMenuContent from './context-menu-content/ContextMenuContent';\nimport { StyledContextMenu } from './ContextMenu.styles';\n\nexport type ContextMenuCoordinates = {\n x: number;\n y: number;\n};\n\nexport type ContextMenuItem = {\n icons: string[];\n key: string;\n onClick: (event?: MouseEvent<HTMLDivElement>) => Promise<void> | void;\n text: string;\n};\n\nexport type ContextMenuRef = {\n hide: VoidFunction;\n show: VoidFunction;\n};\n\ntype ContextMenuProps = {\n /**\n * Optional custom alignment used instead of calculating it using the\n * alignment within the page. The available alignment can be taken from the\n * ContextMenuAlignment enum.\n */\n alignment?: ContextMenuAlignment;\n /**\n * The element over which the content of the `ContextMenu` should be displayed. The default is an ellipsis icon.\n */\n children?: ReactNode;\n /**\n * The element where the content of the `ContextMenu` should be rendered via React Portal.\n */\n container?: Element;\n /**\n * Optional own coordinates to be used instead of calculating the alignment\n * based on the alignment of the children.\n */\n coordinates?: ContextMenuCoordinates;\n /**\n * Whether the ContextMenu is inside a dialog.\n */\n isInDialog?: boolean;\n /**\n * The items that will be displayed in the content of the `ContextMenu`.\n */\n items: ContextMenuItem[];\n /**\n * Function to be executed when the content of the Context menu has been hidden.\n */\n onHide?: VoidFunction;\n /**\n * Function to be executed when the content of the Context menu has been shown.\n */\n onShow?: VoidFunction;\n /**\n * Whether the popup should be closed if its clicked.\n */\n shouldCloseOnPopupClick?: boolean;\n};\n\ninterface SelectDialogResult {\n buttonType: number;\n result: number[];\n}\n\nconst ContextMenu = forwardRef<ContextMenuRef, ContextMenuProps>(\n (\n {\n alignment,\n children = <Icon icons={['ts-ellipsis_v']} size={18} />,\n container = document.querySelector('.page-provider') ||\n document.querySelector('.tapp') ||\n document.body,\n coordinates,\n isInDialog = false,\n items,\n onHide,\n onShow,\n shouldCloseOnPopupClick = true,\n },\n ref,\n ) => {\n const [internalCoordinates, setInternalCoordinates] = useState<ContextMenuCoordinates>({\n x: 0,\n y: 0,\n });\n\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 {\n height: childrenHeight,\n left: childrenLeft,\n top: childrenTop,\n width: childrenWidth,\n } = contextMenuRef.current.getBoundingClientRect();\n\n const { height, width, top, left } = container.getBoundingClientRect();\n\n const x =\n childrenLeft + (isInDialog ? 0 : window.scrollX) + childrenWidth / 2 - left;\n const y =\n childrenTop + (isInDialog ? 0 : window.scrollY) + childrenHeight / 2 - top;\n\n setInternalCoordinates({ x, y });\n\n if (x < width / 2) {\n if (y < height / 2) {\n setInternalAlignment(ContextMenuAlignment.BottomRight);\n } else {\n setInternalAlignment(ContextMenuAlignment.TopRight);\n }\n } else if (y < height / 2) {\n setInternalAlignment(ContextMenuAlignment.BottomLeft);\n } else {\n setInternalAlignment(ContextMenuAlignment.TopLeft);\n }\n\n setIsContentShown(true);\n }\n }, [container, isInDialog, 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":["_chaynsApi","require","_framerMotion","_react","_interopRequireWildcard","_reactDom","_uuid","_contextMenu","_environment","_Icon","_interopRequireDefault","_ContextMenuContent","_ContextMenu","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ContextMenu","forwardRef","alignment","children","createElement","icons","size","container","document","querySelector","body","coordinates","isInDialog","items","onHide","onShow","shouldCloseOnPopupClick","ref","internalCoordinates","setInternalCoordinates","useState","x","y","internalAlignment","setInternalAlignment","ContextMenuAlignment","TopLeft","isContentShown","setIsContentShown","portal","setPortal","uuid","useUuid","contextMenuContentRef","useRef","contextMenuRef","handleHide","useCallback","handleShow","isTouch","getIsTouch","result","createDialog","type","DialogType","SELECT","buttons","list","map","text","index","name","id","icon","open","_items$result$","onClick","current","height","childrenHeight","left","childrenLeft","top","childrenTop","width","childrenWidth","getBoundingClientRect","window","scrollX","scrollY","BottomRight","TopRight","BottomLeft","handleClick","event","preventDefault","stopPropagation","handleDocumentClick","_contextMenuContentRe","contains","target","useImperativeHandle","hide","show","useEffect","addEventListener","removeEventListener","createPortal","AnimatePresence","initial","key","Fragment","StyledContextMenu","className","displayName","_default","exports"],"sources":["../../../../src/components/context-menu/ContextMenu.tsx"],"sourcesContent":["import { createDialog, DialogType } from 'chayns-api';\nimport { AnimatePresence } from 'framer-motion';\nimport React, {\n forwardRef,\n MouseEvent,\n MouseEventHandler,\n ReactNode,\n ReactPortal,\n useCallback,\n useEffect,\n useImperativeHandle,\n useRef,\n useState,\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport { useUuid } from '../../hooks/uuid';\nimport { ContextMenuAlignment } from '../../types/contextMenu';\nimport { getIsTouch } from '../../utils/environment';\nimport Icon from '../icon/Icon';\nimport ContextMenuContent from './context-menu-content/ContextMenuContent';\nimport { StyledContextMenu } from './ContextMenu.styles';\n\nexport type ContextMenuCoordinates = {\n x: number;\n y: number;\n};\n\nexport type ContextMenuItem = {\n icons: string[];\n key: string;\n onClick: (event?: MouseEvent<HTMLDivElement>) => Promise<void> | void;\n text: string;\n};\n\nexport type ContextMenuRef = {\n hide: VoidFunction;\n show: VoidFunction;\n};\n\ntype ContextMenuProps = {\n /**\n * Optional custom alignment used instead of calculating it using the\n * alignment within the page. The available alignment can be taken from the\n * ContextMenuAlignment enum.\n */\n alignment?: ContextMenuAlignment;\n /**\n * The element over which the content of the `ContextMenu` should be displayed. The default is an ellipsis icon.\n */\n children?: ReactNode;\n /**\n * The element where the content of the `ContextMenu` should be rendered via React Portal.\n */\n container?: Element;\n /**\n * Optional own coordinates to be used instead of calculating the alignment\n * based on the alignment of the children.\n */\n coordinates?: ContextMenuCoordinates;\n /**\n * Whether the ContextMenu is inside a dialog.\n */\n isInDialog?: boolean;\n /**\n * The items that will be displayed in the content of the `ContextMenu`.\n */\n items: ContextMenuItem[];\n /**\n * Function to be executed when the content of the Context menu has been hidden.\n */\n onHide?: VoidFunction;\n /**\n * Function to be executed when the content of the Context menu has been shown.\n */\n onShow?: VoidFunction;\n /**\n * Whether the popup should be closed if its clicked.\n */\n shouldCloseOnPopupClick?: boolean;\n};\n\ninterface SelectDialogResult {\n buttonType: number;\n result: number[];\n}\n\nconst ContextMenu = forwardRef<ContextMenuRef, ContextMenuProps>(\n (\n {\n alignment,\n children = <Icon icons={['ts-ellipsis_v']} size={18} />,\n container = document.querySelector('.page-provider') ||\n document.querySelector('.tapp') ||\n document.body,\n coordinates,\n isInDialog = false,\n items,\n onHide,\n onShow,\n shouldCloseOnPopupClick = true,\n },\n ref,\n ) => {\n const [internalCoordinates, setInternalCoordinates] = useState<ContextMenuCoordinates>({\n x: 0,\n y: 0,\n });\n\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 {\n height: childrenHeight,\n left: childrenLeft,\n top: childrenTop,\n width: childrenWidth,\n } = contextMenuRef.current.getBoundingClientRect();\n\n const { height, width, top, left } = container.getBoundingClientRect();\n\n const x =\n childrenLeft + (isInDialog ? 0 : window.scrollX) + childrenWidth / 2 - left;\n const y =\n childrenTop + (isInDialog ? 0 : window.scrollY) + childrenHeight / 2 - top;\n\n setInternalCoordinates({ x, y });\n\n if (x < width / 2) {\n if (y < height / 2) {\n setInternalAlignment(ContextMenuAlignment.BottomRight);\n } else {\n setInternalAlignment(ContextMenuAlignment.TopRight);\n }\n } else if (y < height / 2) {\n setInternalAlignment(ContextMenuAlignment.BottomLeft);\n } else {\n setInternalAlignment(ContextMenuAlignment.TopLeft);\n }\n\n setIsContentShown(true);\n }\n }, [container, isInDialog, 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":[]}
|
|
@@ -206,7 +206,7 @@ const FileInput = /*#__PURE__*/(0, _react.forwardRef)(({
|
|
|
206
206
|
id,
|
|
207
207
|
name
|
|
208
208
|
}) => {
|
|
209
|
-
items.push(
|
|
209
|
+
items.push(/*#__PURE__*/_react.default.createElement(_FileInput.StyledMotionFileInputList, {
|
|
210
210
|
animate: {
|
|
211
211
|
height: 'auto',
|
|
212
212
|
opacity: 1
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FileInput.js","names":["_chaynsApi","require","_framerMotion","_react","_interopRequireWildcard","_file","_fileDialog","_Icon","_interopRequireDefault","_List","_FileListItem","_FileInput","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","FileInput","forwardRef","fileSelectionIcons","imageSelectIcons","fileTypes","onMaxFilesReached","maxFiles","onRemove","files","maxFileSizeInMB","onAdd","fileSelectionPlaceholder","imageSelectPlaceholder","ref","internalFiles","setInternalFiles","useState","internalImages","setInternalImages","handleInputClear","useImperativeHandle","clear","handleAddImages","useCallback","images","newImages","forEach","image","filterDuplicateFileUrls","newFile","push","tmp","slice","length","prevState","handleAddFiles","newFiles","newFileItems","file","isValidFileType","types","filterDuplicateFile","handleDeleteFile","fileName","fileToDelete","filteredFiles","filter","name","filteredImages","url","isDisabled","useMemo","handleImageSelectionClick","buttonType","result","createDialog","dialogInput","upload","buttons","text","initialView","type","DialogType","MODULE","system","scope","module","open","handleFileSelectionClick","selectFiles","multiple","handleDrop","preventDefault","draggedFiles","Array","from","dataTransfer","content","combinedFiles","items","map","createElement","StyledMotionFileInputList","animate","height","opacity","exit","key","transition","duration","fileType","undefined","fileSize","size","uploadedFiles","cutFiles","splice","id","StyledFileInput","StyledFileInputWrapper","$isDisabled","StyledFileInputContainer","onClick","onDragOver","onDrop","icons","StyledFileInputText","$isImageSelection","AnimatePresence","initial","StyledUploadedFilesList","$shouldShowBorder","displayName","_default","exports"],"sources":["../../../../src/components/file-input/FileInput.tsx"],"sourcesContent":["import { createDialog, DialogType } from 'chayns-api';\nimport { AnimatePresence } from 'framer-motion';\nimport React, {\n DragEvent,\n forwardRef,\n ReactElement,\n useCallback,\n useImperativeHandle,\n useMemo,\n useState,\n} from 'react';\nimport type { FileInputFileItem, ImageDialogResult } from '../../types/fileInput';\nimport { filterDuplicateFile, filterDuplicateFileUrls, isValidFileType } from '../../utils/file';\nimport { selectFiles } from '../../utils/fileDialog';\nimport Icon from '../icon/Icon';\nimport List from '../list/List';\nimport FileListItem from './file-list/FileListItem';\nimport {\n StyledFileInput,\n StyledFileInputContainer,\n StyledFileInputText,\n StyledFileInputWrapper,\n StyledMotionFileInputList,\n StyledUploadedFilesList,\n} from './FileInput.styles';\n\nexport type FileInputProps = {\n /**\n * Already uploaded files to display.\n */\n files?: FileInputFileItem[];\n /**\n * An array of icons that should be displayed inside the FileInput\n */\n fileSelectionIcons?: string[];\n /**\n * The text that should be displayed inside the FileInput.\n */\n fileSelectionPlaceholder?: string;\n /**\n * The filetypes that could be selected. Example for multiple types: 'image/*, video/*'.\n */\n fileTypes?: string;\n /**\n * The icon of the image selection.\n */\n imageSelectIcons?: string[];\n /**\n * If set, pictures can be select via Pixabay.\n */\n imageSelectPlaceholder?: string;\n /**\n * The maximum amount of Files that can be uploaded.\n */\n maxFiles?: number;\n /**\n * The maximum size of a file in MB.\n */\n maxFileSizeInMB?: number;\n /**\n * A function to be executed when files are added.\n */\n onAdd?: (files: File[] | string[]) => void;\n /**\n * Function to be executed when the maximum amount of Files are reached.\n */\n onMaxFilesReached?: () => void;\n /**\n * A function to be executed when a file is removed.\n */\n onRemove?: (file: File | FileInputFileItem | string) => void;\n};\n\ntype DialogInput = {\n upload: boolean;\n buttons: {\n text: string;\n buttonType: number;\n }[];\n initialView: string;\n};\n\nexport type FileInputRef = {\n clear: () => void;\n};\n\nconst FileInput = forwardRef<FileInputRef, FileInputProps>(\n (\n {\n fileSelectionIcons = ['fa fa-upload'],\n imageSelectIcons = ['ts-image'],\n fileTypes,\n onMaxFilesReached,\n maxFiles,\n onRemove,\n files,\n maxFileSizeInMB,\n onAdd,\n fileSelectionPlaceholder = 'Dateien hochladen',\n imageSelectPlaceholder,\n },\n ref,\n ) => {\n const [internalFiles, setInternalFiles] = useState<File[]>([]);\n const [internalImages, setInternalImages] = useState<string[]>([]);\n\n const handleInputClear = () => {\n setInternalFiles([]);\n setInternalImages([]);\n };\n\n useImperativeHandle(\n ref,\n () => ({\n clear: handleInputClear,\n }),\n [],\n );\n\n const handleAddImages = useCallback(\n (images: string[]) => {\n const newImages: string[] = [];\n\n images.forEach((image) => {\n if (!filterDuplicateFileUrls({ files: internalImages, newFile: image })) {\n newImages.push(image);\n }\n });\n\n let tmp = newImages;\n\n if (maxFiles) {\n tmp = newImages.slice(\n 0,\n maxFiles -\n (internalFiles.length + internalImages.length + (files?.length ?? 0)),\n );\n }\n\n if (tmp.length > 0 && typeof onAdd === 'function') {\n onAdd(tmp);\n }\n\n setInternalImages((prevState) => [...prevState, ...tmp]);\n },\n [files?.length, internalFiles.length, internalImages, maxFiles, onAdd],\n );\n\n const handleAddFiles = useCallback(\n (newFiles: File[]) => {\n const newFileItems: File[] = [];\n\n newFiles.forEach((file) => {\n if (fileTypes && !isValidFileType({ file, types: fileTypes })) {\n return;\n }\n\n if (file && !filterDuplicateFile({ files: internalFiles, newFile: file })) {\n newFileItems.push(file);\n }\n });\n\n let tmp = newFileItems;\n\n if (maxFiles) {\n tmp = newFileItems.slice(\n 0,\n maxFiles -\n (internalFiles.length + internalImages.length + (files?.length ?? 0)),\n );\n }\n\n if (tmp.length > 0 && typeof onAdd === 'function') {\n onAdd(tmp);\n }\n\n setInternalFiles((prevState) => [...prevState, ...tmp]);\n },\n [fileTypes, files?.length, internalFiles, internalImages.length, maxFiles, onAdd],\n );\n\n const handleDeleteFile = useCallback(\n (fileName?: string) => {\n let fileToDelete: File | FileInputFileItem | string | undefined;\n\n const filteredFiles = internalFiles.filter((file) => {\n const { name } = file;\n\n if (name === fileName) {\n fileToDelete = file;\n }\n\n return name !== fileName;\n });\n\n setInternalFiles(filteredFiles);\n\n if (!fileToDelete) {\n const filteredImages = internalImages.filter((image) => {\n if (image === fileName) {\n fileToDelete = image;\n }\n\n return image !== fileName;\n });\n\n setInternalImages(filteredImages);\n }\n\n if (!fileToDelete) {\n files?.forEach((file) => {\n if (file.url === fileName || file.name === fileName) {\n fileToDelete = file;\n }\n });\n }\n\n if (!fileToDelete || typeof onRemove !== 'function') {\n return;\n }\n\n onRemove(fileToDelete);\n },\n [files, internalFiles, internalImages, onRemove],\n );\n\n const isDisabled = useMemo(() => {\n if (maxFiles) {\n if (internalFiles.length + internalImages.length >= maxFiles) {\n if (typeof onMaxFilesReached === 'function') {\n onMaxFilesReached();\n }\n\n return true;\n }\n }\n\n return false;\n }, [internalFiles.length, internalImages.length, maxFiles, onMaxFilesReached]);\n\n const handleImageSelectionClick = useCallback(async () => {\n if (isDisabled) {\n return;\n }\n\n const { buttonType, result } = (await createDialog<DialogInput>({\n dialogInput: {\n upload: true,\n buttons: [\n { text: 'hello', buttonType: 1 },\n { text: 'can', buttonType: -1 },\n ],\n initialView: 'pixabay',\n },\n type: DialogType.MODULE,\n system: {\n url: 'https://tapp.chayns-static.space/api/dialog-image-editor/v1/remoteEntry.js',\n scope: 'dialog_image_editor',\n module: './ImageEditorEntry',\n },\n buttons: [],\n }).open()) as ImageDialogResult;\n\n if (buttonType === 1 && result?.url) {\n handleAddImages([result.url]);\n }\n }, [handleAddImages, isDisabled]);\n\n const handleFileSelectionClick = useCallback(async () => {\n if (isDisabled) {\n return;\n }\n\n const newFiles = await selectFiles({\n multiple: true,\n type: fileTypes,\n maxFileSizeInMB,\n });\n\n handleAddFiles(newFiles);\n }, [fileTypes, handleAddFiles, isDisabled, maxFileSizeInMB]);\n\n const handleDrop = useCallback(\n (e: DragEvent<HTMLDivElement>) => {\n e.preventDefault();\n const draggedFiles = Array.from(e.dataTransfer.files);\n\n handleAddFiles(draggedFiles);\n },\n [handleAddFiles],\n );\n\n const content = useMemo(() => {\n const combinedFiles = [...internalImages, ...internalFiles];\n\n const items: ReactElement[] = combinedFiles.map((file) => (\n <StyledMotionFileInputList\n animate={{ height: 'auto', opacity: 1 }}\n exit={{ height: 0, opacity: 0 }}\n key={typeof file === 'string' ? file : file.name}\n transition={{ duration: 0.25, type: 'tween' }}\n >\n <FileListItem\n fileType={typeof file !== 'string' ? file.type : undefined}\n fileName={typeof file !== 'string' ? file.name : undefined}\n fileSize={typeof file !== 'string' ? file.size : undefined}\n url={typeof file === 'string' ? file : undefined}\n onRemove={handleDeleteFile}\n />\n </StyledMotionFileInputList>\n ));\n\n return items;\n }, [handleDeleteFile, internalFiles, internalImages]);\n\n const uploadedFiles = useMemo(() => {\n const items: ReactElement[] = [];\n\n const cutFiles = maxFiles ? files?.splice(0, maxFiles) : files;\n\n cutFiles?.forEach(({ url, id, name }) => {\n items.push(\n <StyledMotionFileInputList\n animate={{ height: 'auto', opacity: 1 }}\n exit={{ height: 0, opacity: 0 }}\n key={id}\n transition={{ duration: 0.25, type: 'tween' }}\n >\n <FileListItem url={url} onRemove={handleDeleteFile} fileName={name} />\n </StyledMotionFileInputList>,\n );\n });\n\n return items;\n }, [files, handleDeleteFile, maxFiles]);\n\n return useMemo(\n () => (\n <StyledFileInput>\n <StyledFileInputWrapper $isDisabled={isDisabled}>\n <StyledFileInputContainer\n onClick={() => void handleFileSelectionClick()}\n onDragOver={(e: DragEvent<HTMLDivElement>) => e.preventDefault()}\n onDrop={(e: DragEvent<HTMLDivElement>) => void handleDrop(e)}\n >\n <Icon icons={fileSelectionIcons} />\n <StyledFileInputText>{fileSelectionPlaceholder}</StyledFileInputText>\n </StyledFileInputContainer>\n {imageSelectPlaceholder && (\n <StyledFileInputContainer\n $isImageSelection\n onClick={() => void handleImageSelectionClick()}\n >\n <Icon icons={imageSelectIcons} />\n <StyledFileInputText>{imageSelectPlaceholder}</StyledFileInputText>\n </StyledFileInputContainer>\n )}\n </StyledFileInputWrapper>\n <List>\n <AnimatePresence initial={false}>{content}</AnimatePresence>\n </List>\n {uploadedFiles.length > 0 && (\n <StyledUploadedFilesList $shouldShowBorder={content.length > 0}>\n <List>\n <AnimatePresence initial={false}>{uploadedFiles}</AnimatePresence>\n </List>\n </StyledUploadedFilesList>\n )}\n </StyledFileInput>\n ),\n [\n isDisabled,\n fileSelectionIcons,\n fileSelectionPlaceholder,\n imageSelectPlaceholder,\n imageSelectIcons,\n content,\n uploadedFiles,\n handleFileSelectionClick,\n handleDrop,\n handleImageSelectionClick,\n ],\n );\n },\n);\n\nFileInput.displayName = 'FileInput';\n\nexport default FileInput;\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"FileInput.js","names":["_chaynsApi","require","_framerMotion","_react","_interopRequireWildcard","_file","_fileDialog","_Icon","_interopRequireDefault","_List","_FileListItem","_FileInput","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","FileInput","forwardRef","fileSelectionIcons","imageSelectIcons","fileTypes","onMaxFilesReached","maxFiles","onRemove","files","maxFileSizeInMB","onAdd","fileSelectionPlaceholder","imageSelectPlaceholder","ref","internalFiles","setInternalFiles","useState","internalImages","setInternalImages","handleInputClear","useImperativeHandle","clear","handleAddImages","useCallback","images","newImages","forEach","image","filterDuplicateFileUrls","newFile","push","tmp","slice","length","prevState","handleAddFiles","newFiles","newFileItems","file","isValidFileType","types","filterDuplicateFile","handleDeleteFile","fileName","fileToDelete","filteredFiles","filter","name","filteredImages","url","isDisabled","useMemo","handleImageSelectionClick","buttonType","result","createDialog","dialogInput","upload","buttons","text","initialView","type","DialogType","MODULE","system","scope","module","open","handleFileSelectionClick","selectFiles","multiple","handleDrop","preventDefault","draggedFiles","Array","from","dataTransfer","content","combinedFiles","items","map","createElement","StyledMotionFileInputList","animate","height","opacity","exit","key","transition","duration","fileType","undefined","fileSize","size","uploadedFiles","cutFiles","splice","id","StyledFileInput","StyledFileInputWrapper","$isDisabled","StyledFileInputContainer","onClick","onDragOver","onDrop","icons","StyledFileInputText","$isImageSelection","AnimatePresence","initial","StyledUploadedFilesList","$shouldShowBorder","displayName","_default","exports"],"sources":["../../../../src/components/file-input/FileInput.tsx"],"sourcesContent":["import { createDialog, DialogType } from 'chayns-api';\nimport { AnimatePresence } from 'framer-motion';\nimport React, {\n DragEvent,\n forwardRef,\n ReactElement,\n useCallback,\n useImperativeHandle,\n useMemo,\n useState,\n} from 'react';\nimport type { FileInputFileItem, ImageDialogResult } from '../../types/fileInput';\nimport { filterDuplicateFile, filterDuplicateFileUrls, isValidFileType } from '../../utils/file';\nimport { selectFiles } from '../../utils/fileDialog';\nimport Icon from '../icon/Icon';\nimport List from '../list/List';\nimport FileListItem from './file-list/FileListItem';\nimport {\n StyledFileInput,\n StyledFileInputContainer,\n StyledFileInputText,\n StyledFileInputWrapper,\n StyledMotionFileInputList,\n StyledUploadedFilesList,\n} from './FileInput.styles';\n\nexport type FileInputProps = {\n /**\n * Already uploaded files to display.\n */\n files?: FileInputFileItem[];\n /**\n * An array of icons that should be displayed inside the FileInput\n */\n fileSelectionIcons?: string[];\n /**\n * The text that should be displayed inside the FileInput.\n */\n fileSelectionPlaceholder?: string;\n /**\n * The filetypes that could be selected. Example for multiple types: 'image/*, video/*'.\n */\n fileTypes?: string;\n /**\n * The icon of the image selection.\n */\n imageSelectIcons?: string[];\n /**\n * If set, pictures can be select via Pixabay.\n */\n imageSelectPlaceholder?: string;\n /**\n * The maximum amount of Files that can be uploaded.\n */\n maxFiles?: number;\n /**\n * The maximum size of a file in MB.\n */\n maxFileSizeInMB?: number;\n /**\n * A function to be executed when files are added.\n */\n onAdd?: (files: File[] | string[]) => void;\n /**\n * Function to be executed when the maximum amount of Files are reached.\n */\n onMaxFilesReached?: () => void;\n /**\n * A function to be executed when a file is removed.\n */\n onRemove?: (file: File | FileInputFileItem | string) => void;\n};\n\ntype DialogInput = {\n upload: boolean;\n buttons: {\n text: string;\n buttonType: number;\n }[];\n initialView: string;\n};\n\nexport type FileInputRef = {\n clear: () => void;\n};\n\nconst FileInput = forwardRef<FileInputRef, FileInputProps>(\n (\n {\n fileSelectionIcons = ['fa fa-upload'],\n imageSelectIcons = ['ts-image'],\n fileTypes,\n onMaxFilesReached,\n maxFiles,\n onRemove,\n files,\n maxFileSizeInMB,\n onAdd,\n fileSelectionPlaceholder = 'Dateien hochladen',\n imageSelectPlaceholder,\n },\n ref,\n ) => {\n const [internalFiles, setInternalFiles] = useState<File[]>([]);\n const [internalImages, setInternalImages] = useState<string[]>([]);\n\n const handleInputClear = () => {\n setInternalFiles([]);\n setInternalImages([]);\n };\n\n useImperativeHandle(\n ref,\n () => ({\n clear: handleInputClear,\n }),\n [],\n );\n\n const handleAddImages = useCallback(\n (images: string[]) => {\n const newImages: string[] = [];\n\n images.forEach((image) => {\n if (!filterDuplicateFileUrls({ files: internalImages, newFile: image })) {\n newImages.push(image);\n }\n });\n\n let tmp = newImages;\n\n if (maxFiles) {\n tmp = newImages.slice(\n 0,\n maxFiles -\n (internalFiles.length + internalImages.length + (files?.length ?? 0)),\n );\n }\n\n if (tmp.length > 0 && typeof onAdd === 'function') {\n onAdd(tmp);\n }\n\n setInternalImages((prevState) => [...prevState, ...tmp]);\n },\n [files?.length, internalFiles.length, internalImages, maxFiles, onAdd],\n );\n\n const handleAddFiles = useCallback(\n (newFiles: File[]) => {\n const newFileItems: File[] = [];\n\n newFiles.forEach((file) => {\n if (fileTypes && !isValidFileType({ file, types: fileTypes })) {\n return;\n }\n\n if (file && !filterDuplicateFile({ files: internalFiles, newFile: file })) {\n newFileItems.push(file);\n }\n });\n\n let tmp = newFileItems;\n\n if (maxFiles) {\n tmp = newFileItems.slice(\n 0,\n maxFiles -\n (internalFiles.length + internalImages.length + (files?.length ?? 0)),\n );\n }\n\n if (tmp.length > 0 && typeof onAdd === 'function') {\n onAdd(tmp);\n }\n\n setInternalFiles((prevState) => [...prevState, ...tmp]);\n },\n [fileTypes, files?.length, internalFiles, internalImages.length, maxFiles, onAdd],\n );\n\n const handleDeleteFile = useCallback(\n (fileName?: string) => {\n let fileToDelete: File | FileInputFileItem | string | undefined;\n\n const filteredFiles = internalFiles.filter((file) => {\n const { name } = file;\n\n if (name === fileName) {\n fileToDelete = file;\n }\n\n return name !== fileName;\n });\n\n setInternalFiles(filteredFiles);\n\n if (!fileToDelete) {\n const filteredImages = internalImages.filter((image) => {\n if (image === fileName) {\n fileToDelete = image;\n }\n\n return image !== fileName;\n });\n\n setInternalImages(filteredImages);\n }\n\n if (!fileToDelete) {\n files?.forEach((file) => {\n if (file.url === fileName || file.name === fileName) {\n fileToDelete = file;\n }\n });\n }\n\n if (!fileToDelete || typeof onRemove !== 'function') {\n return;\n }\n\n onRemove(fileToDelete);\n },\n [files, internalFiles, internalImages, onRemove],\n );\n\n const isDisabled = useMemo(() => {\n if (maxFiles) {\n if (internalFiles.length + internalImages.length >= maxFiles) {\n if (typeof onMaxFilesReached === 'function') {\n onMaxFilesReached();\n }\n\n return true;\n }\n }\n\n return false;\n }, [internalFiles.length, internalImages.length, maxFiles, onMaxFilesReached]);\n\n const handleImageSelectionClick = useCallback(async () => {\n if (isDisabled) {\n return;\n }\n\n const { buttonType, result } = (await createDialog<DialogInput>({\n dialogInput: {\n upload: true,\n buttons: [\n { text: 'hello', buttonType: 1 },\n { text: 'can', buttonType: -1 },\n ],\n initialView: 'pixabay',\n },\n type: DialogType.MODULE,\n system: {\n url: 'https://tapp.chayns-static.space/api/dialog-image-editor/v1/remoteEntry.js',\n scope: 'dialog_image_editor',\n module: './ImageEditorEntry',\n },\n buttons: [],\n }).open()) as ImageDialogResult;\n\n if (buttonType === 1 && result?.url) {\n handleAddImages([result.url]);\n }\n }, [handleAddImages, isDisabled]);\n\n const handleFileSelectionClick = useCallback(async () => {\n if (isDisabled) {\n return;\n }\n\n const newFiles = await selectFiles({\n multiple: true,\n type: fileTypes,\n maxFileSizeInMB,\n });\n\n handleAddFiles(newFiles);\n }, [fileTypes, handleAddFiles, isDisabled, maxFileSizeInMB]);\n\n const handleDrop = useCallback(\n (e: DragEvent<HTMLDivElement>) => {\n e.preventDefault();\n const draggedFiles = Array.from(e.dataTransfer.files);\n\n handleAddFiles(draggedFiles);\n },\n [handleAddFiles],\n );\n\n const content = useMemo(() => {\n const combinedFiles = [...internalImages, ...internalFiles];\n\n const items: ReactElement[] = combinedFiles.map((file) => (\n <StyledMotionFileInputList\n animate={{ height: 'auto', opacity: 1 }}\n exit={{ height: 0, opacity: 0 }}\n key={typeof file === 'string' ? file : file.name}\n transition={{ duration: 0.25, type: 'tween' }}\n >\n <FileListItem\n fileType={typeof file !== 'string' ? file.type : undefined}\n fileName={typeof file !== 'string' ? file.name : undefined}\n fileSize={typeof file !== 'string' ? file.size : undefined}\n url={typeof file === 'string' ? file : undefined}\n onRemove={handleDeleteFile}\n />\n </StyledMotionFileInputList>\n ));\n\n return items;\n }, [handleDeleteFile, internalFiles, internalImages]);\n\n const uploadedFiles = useMemo(() => {\n const items: ReactElement[] = [];\n\n const cutFiles = maxFiles ? files?.splice(0, maxFiles) : files;\n\n cutFiles?.forEach(({ url, id, name }) => {\n items.push(\n <StyledMotionFileInputList\n animate={{ height: 'auto', opacity: 1 }}\n exit={{ height: 0, opacity: 0 }}\n key={id}\n transition={{ duration: 0.25, type: 'tween' }}\n >\n <FileListItem url={url} onRemove={handleDeleteFile} fileName={name} />\n </StyledMotionFileInputList>,\n );\n });\n\n return items;\n }, [files, handleDeleteFile, maxFiles]);\n\n return useMemo(\n () => (\n <StyledFileInput>\n <StyledFileInputWrapper $isDisabled={isDisabled}>\n <StyledFileInputContainer\n onClick={() => void handleFileSelectionClick()}\n onDragOver={(e: DragEvent<HTMLDivElement>) => e.preventDefault()}\n onDrop={(e: DragEvent<HTMLDivElement>) => void handleDrop(e)}\n >\n <Icon icons={fileSelectionIcons} />\n <StyledFileInputText>{fileSelectionPlaceholder}</StyledFileInputText>\n </StyledFileInputContainer>\n {imageSelectPlaceholder && (\n <StyledFileInputContainer\n $isImageSelection\n onClick={() => void handleImageSelectionClick()}\n >\n <Icon icons={imageSelectIcons} />\n <StyledFileInputText>{imageSelectPlaceholder}</StyledFileInputText>\n </StyledFileInputContainer>\n )}\n </StyledFileInputWrapper>\n <List>\n <AnimatePresence initial={false}>{content}</AnimatePresence>\n </List>\n {uploadedFiles.length > 0 && (\n <StyledUploadedFilesList $shouldShowBorder={content.length > 0}>\n <List>\n <AnimatePresence initial={false}>{uploadedFiles}</AnimatePresence>\n </List>\n </StyledUploadedFilesList>\n )}\n </StyledFileInput>\n ),\n [\n isDisabled,\n fileSelectionIcons,\n fileSelectionPlaceholder,\n imageSelectPlaceholder,\n imageSelectIcons,\n content,\n uploadedFiles,\n handleFileSelectionClick,\n handleDrop,\n handleImageSelectionClick,\n ],\n );\n },\n);\n\nFileInput.displayName = 'FileInput';\n\nexport default FileInput;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FilterButtons.js","names":["_react","_interopRequireWildcard","require","_filterButtons","_FilterButton","_interopRequireDefault","_FilterButtons","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","FilterButtons","selectedItemIds","onSelect","items","size","FilterButtonSize","Normal","selectedIds","setSelectedIds","useState","useEffect","handleSelect","useCallback","id","newIds","includes","filter","filteredId","length","selectedId","reactItems","useMemo","array","createElement","key","isSelected","Array","isArray","shape","FilterButtonItemShape","Rectangular","text","forEach","icons","color","count","push","Round","StyledFilterButton","displayName","_default","exports"],"sources":["../../../../src/components/filter-buttons/FilterButtons.tsx"],"sourcesContent":["import React, { FC, ReactElement, useCallback, useEffect, useMemo, useState } from 'react';\nimport {\n FilterButtonItemShape,\n FilterButtonSize,\n IFilterButtonItem,\n} from '../../types/filterButtons';\nimport FilterButton from './filter-button/FilterButton';\nimport { StyledFilterButton } from './FilterButtons.styles';\n\nexport type FilterButtonsProps = {\n /**\n * The items that should be displayed.\n */\n items: IFilterButtonItem[];\n /**\n * A function that should be executed when an item is selected.\n */\n onSelect?: (keys: string[]) => void;\n /**\n * The keys of items that should be selected.\n */\n selectedItemIds?: string[];\n /**\n * The size auf the filter buttons. Use the FilterButtonSize enum.\n */\n size?: FilterButtonSize;\n};\n\nconst FilterButtons: FC<FilterButtonsProps> = ({\n selectedItemIds,\n onSelect,\n items,\n size = FilterButtonSize.Normal,\n}) => {\n const [selectedIds, setSelectedIds] = useState<string[]>(['all']);\n\n /**\n * This function set the selectedItemKey\n */\n useEffect(() => {\n if (selectedItemIds) {\n setSelectedIds(selectedItemIds);\n }\n }, [selectedItemIds]);\n\n /**\n * Function to update the selected items\n */\n const handleSelect = useCallback(\n (id: string) => {\n let newIds: string[];\n\n if (id === 'all') {\n newIds = selectedIds.includes('all') ? ['all'] : [];\n } else {\n newIds = selectedIds.includes(id)\n ? selectedIds.filter((filteredId) => filteredId !== id)\n : [...selectedIds.filter((filteredId) => filteredId !== 'all'), id];\n }\n\n if (newIds.length === 0) {\n newIds = ['all'];\n }\n\n setSelectedIds(newIds);\n\n if (typeof onSelect === 'function') {\n onSelect(newIds.filter((selectedId) => selectedId !== 'all'));\n }\n },\n [onSelect, selectedIds],\n );\n\n const reactItems = useMemo(() => {\n if (items.length === 0) {\n return null;\n }\n\n const array: ReactElement[] = [\n <FilterButton\n id=\"all\"\n key=\"all\"\n onSelect={handleSelect}\n isSelected={\n selectedIds.includes('all') ||\n (Array.isArray(selectedIds) && selectedIds.length === 0)\n }\n shape={FilterButtonItemShape.Rectangular}\n size={size}\n text=\"Alle\"\n />,\n ];\n\n items.forEach(({ icons, text, color, count, id }) => {\n array.push(\n <FilterButton\n color={color}\n icons={icons}\n id={id}\n key={id}\n count={count}\n onSelect={handleSelect}\n isSelected={selectedIds.includes(id)}\n shape={FilterButtonItemShape.Round}\n size={size}\n text={text}\n />,\n );\n });\n\n return array;\n }, [handleSelect, items, selectedIds, size]);\n\n return useMemo(() => <StyledFilterButton>{reactItems}</StyledFilterButton>, [reactItems]);\n};\n\nFilterButtons.displayName = 'FilterButtons';\n\nexport default FilterButtons;\n"],"mappings":"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
|
|
1
|
+
{"version":3,"file":"FilterButtons.js","names":["_react","_interopRequireWildcard","require","_filterButtons","_FilterButton","_interopRequireDefault","_FilterButtons","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","FilterButtons","selectedItemIds","onSelect","items","size","FilterButtonSize","Normal","selectedIds","setSelectedIds","useState","useEffect","handleSelect","useCallback","id","newIds","includes","filter","filteredId","length","selectedId","reactItems","useMemo","array","createElement","key","isSelected","Array","isArray","shape","FilterButtonItemShape","Rectangular","text","forEach","icons","color","count","push","Round","StyledFilterButton","displayName","_default","exports"],"sources":["../../../../src/components/filter-buttons/FilterButtons.tsx"],"sourcesContent":["import React, { FC, ReactElement, useCallback, useEffect, useMemo, useState } from 'react';\nimport {\n FilterButtonItemShape,\n FilterButtonSize,\n IFilterButtonItem,\n} from '../../types/filterButtons';\nimport FilterButton from './filter-button/FilterButton';\nimport { StyledFilterButton } from './FilterButtons.styles';\n\nexport type FilterButtonsProps = {\n /**\n * The items that should be displayed.\n */\n items: IFilterButtonItem[];\n /**\n * A function that should be executed when an item is selected.\n */\n onSelect?: (keys: string[]) => void;\n /**\n * The keys of items that should be selected.\n */\n selectedItemIds?: string[];\n /**\n * The size auf the filter buttons. Use the FilterButtonSize enum.\n */\n size?: FilterButtonSize;\n};\n\nconst FilterButtons: FC<FilterButtonsProps> = ({\n selectedItemIds,\n onSelect,\n items,\n size = FilterButtonSize.Normal,\n}) => {\n const [selectedIds, setSelectedIds] = useState<string[]>(['all']);\n\n /**\n * This function set the selectedItemKey\n */\n useEffect(() => {\n if (selectedItemIds) {\n setSelectedIds(selectedItemIds);\n }\n }, [selectedItemIds]);\n\n /**\n * Function to update the selected items\n */\n const handleSelect = useCallback(\n (id: string) => {\n let newIds: string[];\n\n if (id === 'all') {\n newIds = selectedIds.includes('all') ? ['all'] : [];\n } else {\n newIds = selectedIds.includes(id)\n ? selectedIds.filter((filteredId) => filteredId !== id)\n : [...selectedIds.filter((filteredId) => filteredId !== 'all'), id];\n }\n\n if (newIds.length === 0) {\n newIds = ['all'];\n }\n\n setSelectedIds(newIds);\n\n if (typeof onSelect === 'function') {\n onSelect(newIds.filter((selectedId) => selectedId !== 'all'));\n }\n },\n [onSelect, selectedIds],\n );\n\n const reactItems = useMemo(() => {\n if (items.length === 0) {\n return null;\n }\n\n const array: ReactElement[] = [\n <FilterButton\n id=\"all\"\n key=\"all\"\n onSelect={handleSelect}\n isSelected={\n selectedIds.includes('all') ||\n (Array.isArray(selectedIds) && selectedIds.length === 0)\n }\n shape={FilterButtonItemShape.Rectangular}\n size={size}\n text=\"Alle\"\n />,\n ];\n\n items.forEach(({ icons, text, color, count, id }) => {\n array.push(\n <FilterButton\n color={color}\n icons={icons}\n id={id}\n key={id}\n count={count}\n onSelect={handleSelect}\n isSelected={selectedIds.includes(id)}\n shape={FilterButtonItemShape.Round}\n size={size}\n text={text}\n />,\n );\n });\n\n return array;\n }, [handleSelect, items, selectedIds, size]);\n\n return useMemo(() => <StyledFilterButton>{reactItems}</StyledFilterButton>, [reactItems]);\n};\n\nFilterButtons.displayName = 'FilterButtons';\n\nexport default FilterButtons;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -189,7 +189,7 @@ const Popup = /*#__PURE__*/(0, _react.forwardRef)(({
|
|
|
189
189
|
};
|
|
190
190
|
}, [handleDocumentClick, handleHide, isOpen, onHide, onShow]);
|
|
191
191
|
(0, _react.useEffect)(() => {
|
|
192
|
-
setPortal(() => /*#__PURE__*/(0, _reactDom.createPortal)(
|
|
192
|
+
setPortal(() => /*#__PURE__*/(0, _reactDom.createPortal)(/*#__PURE__*/_react.default.createElement(_framerMotion.AnimatePresence, {
|
|
193
193
|
initial: false
|
|
194
194
|
}, isOpen && /*#__PURE__*/_react.default.createElement(_PopupContentWrapper.default, {
|
|
195
195
|
width: (pseudoSize === null || pseudoSize === void 0 ? void 0 : pseudoSize.width) ?? 0,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Popup.js","names":["_chaynsApi","require","_framerMotion","_react","_interopRequireWildcard","_reactDom","_uuid","_popup","_AreaContextProvider","_interopRequireDefault","_PopupContentWrapper","_Popup","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","Popup","forwardRef","content","onShow","container","document","querySelector","body","onHide","children","shouldShowOnHover","shouldUseChildrenWidth","yOffset","ref","coordinates","setCoordinates","useState","x","y","alignment","setAlignment","PopupAlignment","TopLeft","offset","setOffset","isOpen","setIsOpen","portal","setPortal","menuHeight","setMenuHeight","isMeasuring","setIsMeasuring","pseudoSize","setPseudoSize","timeout","useRef","uuid","useUuid","popupContentRef","popupPseudoContentRef","popupRef","measureHeight","current","height","offsetHeight","width","offsetWidth","useEffect","handleResize","setTimeout","window","addEventListener","removeEventListener","handleShow","useCallback","pseudoHeight","pseudoWidth","childrenHeight","left","childrenLeft","top","childrenTop","childrenWidth","getBoundingClientRect","isRight","BottomRight","BottomLeft","newOffset","innerWidth","right","newX","TopRight","handleChildrenClick","handleHide","handleMouseEnter","clearTimeout","handleMouseLeave","handleDocumentClick","event","_popupContentRef$curr","contains","target","useImperativeHandle","hide","show","getWindowMetrics","then","result","topBarHeight","createPortal","createElement","AnimatePresence","initial","key","onMouseLeave","onMouseEnter","shouldChangeColor","Fragment","StyledPopupPseudo","$menuHeight","StyledPopup","onClick","$shouldUseChildrenWidth","displayName","_default","exports"],"sources":["../../../../src/components/popup/Popup.tsx"],"sourcesContent":["import { getWindowMetrics } from 'chayns-api';\nimport { AnimatePresence } from 'framer-motion';\nimport React, {\n forwardRef,\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 { PopupAlignment, PopupCoordinates, PopupRef } from '../../types/popup';\nimport AreaContextProvider from '../area-provider/AreaContextProvider';\nimport PopupContentWrapper from './popup-content-wrapper/PopupContentWrapper';\nimport { StyledPopup, StyledPopupPseudo } from './Popup.styles';\n\nexport type PopupProps = {\n /**\n * The element over which the content of the `ContextMenu` should be displayed.\n */\n children?: ReactNode;\n /**\n * The element where the content of the `Popup` should be rendered via React Portal.\n */\n container?: Element;\n /**\n * The content that should be displayed inside the popup.\n */\n content: ReactNode;\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 opened on hover. If not, the popup will be opened on click.\n */\n shouldShowOnHover?: boolean;\n /**\n * Whether the width of the children should be used.\n */\n shouldUseChildrenWidth?: boolean;\n /**\n * The Y offset of the popup to the children.\n */\n yOffset?: number;\n};\n\nconst Popup = forwardRef<PopupRef, PopupProps>(\n (\n {\n content,\n onShow,\n container = document.querySelector('.page-provider') ||\n document.querySelector('.tapp') ||\n document.body,\n onHide,\n children,\n shouldShowOnHover = false,\n shouldUseChildrenWidth = true,\n yOffset = 0,\n },\n ref,\n ) => {\n const [coordinates, setCoordinates] = useState<PopupCoordinates>({\n x: 0,\n y: 0,\n });\n\n const [alignment, setAlignment] = useState<PopupAlignment>(PopupAlignment.TopLeft);\n const [offset, setOffset] = useState<number>(0);\n const [isOpen, setIsOpen] = useState(false);\n const [portal, setPortal] = useState<ReactPortal>();\n const [menuHeight, setMenuHeight] = useState(0);\n const [isMeasuring, setIsMeasuring] = useState(true);\n const [pseudoSize, setPseudoSize] = useState<{ height: number; width: number }>();\n\n const timeout = useRef<number>();\n\n const uuid = useUuid();\n\n // ToDo: Replace with hook if new chayns api is ready\n\n const popupContentRef = useRef<HTMLDivElement>(null);\n const popupPseudoContentRef = useRef<HTMLDivElement>(null);\n const popupRef = useRef<HTMLDivElement>(null);\n\n const measureHeight = () => {\n if (popupPseudoContentRef.current) {\n const height = popupPseudoContentRef.current.offsetHeight;\n const width = popupPseudoContentRef.current.offsetWidth + 1;\n\n setPseudoSize({ height, width });\n }\n };\n\n useEffect(() => {\n measureHeight();\n\n setIsMeasuring(false);\n }, []);\n\n useEffect(() => {\n const handleResize = () => {\n setIsMeasuring(true);\n\n setTimeout(() => {\n measureHeight();\n setIsMeasuring(false);\n }, 0);\n };\n\n window.addEventListener('resize', handleResize);\n\n return () => {\n window.removeEventListener('resize', handleResize);\n };\n }, []);\n\n const handleShow = useCallback(() => {\n if (popupRef.current && pseudoSize) {\n const { height: pseudoHeight, width: pseudoWidth } = pseudoSize;\n\n const {\n height: childrenHeight,\n left: childrenLeft,\n top: childrenTop,\n width: childrenWidth,\n } = popupRef.current.getBoundingClientRect();\n\n if (pseudoHeight > childrenTop - 25) {\n let isRight = false;\n\n if (pseudoWidth > childrenLeft + childrenWidth / 2 - 25) {\n setAlignment(PopupAlignment.BottomRight);\n\n isRight = true;\n } else {\n setAlignment(PopupAlignment.BottomLeft);\n }\n\n const x = childrenLeft + childrenWidth / 2;\n const y = childrenTop + childrenHeight + yOffset;\n\n let newOffset;\n\n if (isRight) {\n newOffset =\n x + pseudoWidth >= window.innerWidth\n ? x + pseudoWidth - window.innerWidth\n : 0;\n } else {\n newOffset = 0;\n\n const right = window.innerWidth - (childrenLeft + childrenWidth / 2);\n\n newOffset =\n right + pseudoWidth >= window.innerWidth\n ? right + pseudoWidth - window.innerWidth\n : 0;\n }\n\n setOffset(newOffset);\n\n const newX = x - newOffset;\n\n setCoordinates({\n x: newX < 23 ? 23 : newX,\n y: y - yOffset,\n });\n } else {\n let isRight = false;\n\n if (pseudoWidth > childrenLeft + childrenWidth / 2 - 25) {\n setAlignment(PopupAlignment.TopRight);\n\n isRight = true;\n } else {\n setAlignment(PopupAlignment.TopLeft);\n }\n\n const x = childrenLeft + childrenWidth / 2;\n const y = childrenTop - yOffset;\n\n let newOffset;\n\n if (isRight) {\n newOffset =\n x + pseudoWidth >= window.innerWidth\n ? x + pseudoWidth - window.innerWidth\n : 0;\n } else {\n newOffset = 0;\n\n const right = window.innerWidth - (childrenLeft + childrenWidth / 2);\n\n newOffset =\n right + pseudoWidth >= window.innerWidth\n ? right + pseudoWidth - window.innerWidth\n : 0;\n }\n\n setOffset(newOffset);\n\n const newX = x - newOffset;\n\n setCoordinates({\n x: newX < 23 ? 23 : newX,\n y: y - yOffset,\n });\n }\n\n setIsOpen(true);\n }\n }, [pseudoSize, yOffset]);\n\n const handleChildrenClick = () => {\n handleShow();\n };\n\n const handleHide = useCallback(() => {\n setIsOpen(false);\n }, []);\n\n const handleMouseEnter = useCallback(() => {\n if (shouldShowOnHover) {\n window.clearTimeout(timeout.current);\n handleShow();\n }\n }, [handleShow, shouldShowOnHover]);\n\n const handleMouseLeave = useCallback(() => {\n if (!shouldShowOnHover) {\n return;\n }\n\n timeout.current = window.setTimeout(() => {\n handleHide();\n }, 500);\n }, [handleHide, shouldShowOnHover]);\n\n const handleDocumentClick = useCallback<EventListener>(\n (event) => {\n if (!popupContentRef.current?.contains(event.target as Node)) {\n handleHide();\n }\n },\n [handleHide],\n );\n\n useImperativeHandle(\n ref,\n () => ({\n hide: handleHide,\n show: handleShow,\n }),\n [handleHide, handleShow],\n );\n\n useEffect(() => {\n void getWindowMetrics().then((result) => {\n if (result.topBarHeight) {\n setMenuHeight(result.topBarHeight);\n }\n });\n }, []);\n\n useEffect(() => {\n if (isOpen) {\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, isOpen, onHide, onShow]);\n\n useEffect(() => {\n setPortal(() =>\n createPortal(\n <AnimatePresence initial={false}>\n {isOpen && (\n <PopupContentWrapper\n width={pseudoSize?.width ?? 0}\n offset={offset}\n coordinates={coordinates}\n key={`tooltip_${uuid}`}\n alignment={alignment}\n ref={popupContentRef}\n onMouseLeave={handleMouseLeave}\n onMouseEnter={handleMouseEnter}\n >\n <AreaContextProvider shouldChangeColor={false}>\n {content}\n </AreaContextProvider>\n </PopupContentWrapper>\n )}\n </AnimatePresence>,\n container,\n ),\n );\n }, [\n alignment,\n container,\n content,\n coordinates,\n handleMouseEnter,\n handleMouseLeave,\n isOpen,\n offset,\n pseudoSize?.width,\n uuid,\n ]);\n\n return (\n <>\n {isMeasuring && (\n <StyledPopupPseudo ref={popupPseudoContentRef} $menuHeight={menuHeight}>\n {content}\n </StyledPopupPseudo>\n )}\n <StyledPopup\n ref={popupRef}\n onClick={handleChildrenClick}\n onMouseLeave={handleMouseLeave}\n onMouseEnter={handleMouseEnter}\n $shouldUseChildrenWidth={shouldUseChildrenWidth}\n >\n {children}\n </StyledPopup>\n {portal}\n </>\n );\n },\n);\n\nPopup.displayName = 'Popup';\n\nexport default Popup;\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"Popup.js","names":["_chaynsApi","require","_framerMotion","_react","_interopRequireWildcard","_reactDom","_uuid","_popup","_AreaContextProvider","_interopRequireDefault","_PopupContentWrapper","_Popup","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","Popup","forwardRef","content","onShow","container","document","querySelector","body","onHide","children","shouldShowOnHover","shouldUseChildrenWidth","yOffset","ref","coordinates","setCoordinates","useState","x","y","alignment","setAlignment","PopupAlignment","TopLeft","offset","setOffset","isOpen","setIsOpen","portal","setPortal","menuHeight","setMenuHeight","isMeasuring","setIsMeasuring","pseudoSize","setPseudoSize","timeout","useRef","uuid","useUuid","popupContentRef","popupPseudoContentRef","popupRef","measureHeight","current","height","offsetHeight","width","offsetWidth","useEffect","handleResize","setTimeout","window","addEventListener","removeEventListener","handleShow","useCallback","pseudoHeight","pseudoWidth","childrenHeight","left","childrenLeft","top","childrenTop","childrenWidth","getBoundingClientRect","isRight","BottomRight","BottomLeft","newOffset","innerWidth","right","newX","TopRight","handleChildrenClick","handleHide","handleMouseEnter","clearTimeout","handleMouseLeave","handleDocumentClick","event","_popupContentRef$curr","contains","target","useImperativeHandle","hide","show","getWindowMetrics","then","result","topBarHeight","createPortal","createElement","AnimatePresence","initial","key","onMouseLeave","onMouseEnter","shouldChangeColor","Fragment","StyledPopupPseudo","$menuHeight","StyledPopup","onClick","$shouldUseChildrenWidth","displayName","_default","exports"],"sources":["../../../../src/components/popup/Popup.tsx"],"sourcesContent":["import { getWindowMetrics } from 'chayns-api';\nimport { AnimatePresence } from 'framer-motion';\nimport React, {\n forwardRef,\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 { PopupAlignment, PopupCoordinates, PopupRef } from '../../types/popup';\nimport AreaContextProvider from '../area-provider/AreaContextProvider';\nimport PopupContentWrapper from './popup-content-wrapper/PopupContentWrapper';\nimport { StyledPopup, StyledPopupPseudo } from './Popup.styles';\n\nexport type PopupProps = {\n /**\n * The element over which the content of the `ContextMenu` should be displayed.\n */\n children?: ReactNode;\n /**\n * The element where the content of the `Popup` should be rendered via React Portal.\n */\n container?: Element;\n /**\n * The content that should be displayed inside the popup.\n */\n content: ReactNode;\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 opened on hover. If not, the popup will be opened on click.\n */\n shouldShowOnHover?: boolean;\n /**\n * Whether the width of the children should be used.\n */\n shouldUseChildrenWidth?: boolean;\n /**\n * The Y offset of the popup to the children.\n */\n yOffset?: number;\n};\n\nconst Popup = forwardRef<PopupRef, PopupProps>(\n (\n {\n content,\n onShow,\n container = document.querySelector('.page-provider') ||\n document.querySelector('.tapp') ||\n document.body,\n onHide,\n children,\n shouldShowOnHover = false,\n shouldUseChildrenWidth = true,\n yOffset = 0,\n },\n ref,\n ) => {\n const [coordinates, setCoordinates] = useState<PopupCoordinates>({\n x: 0,\n y: 0,\n });\n\n const [alignment, setAlignment] = useState<PopupAlignment>(PopupAlignment.TopLeft);\n const [offset, setOffset] = useState<number>(0);\n const [isOpen, setIsOpen] = useState(false);\n const [portal, setPortal] = useState<ReactPortal>();\n const [menuHeight, setMenuHeight] = useState(0);\n const [isMeasuring, setIsMeasuring] = useState(true);\n const [pseudoSize, setPseudoSize] = useState<{ height: number; width: number }>();\n\n const timeout = useRef<number>();\n\n const uuid = useUuid();\n\n // ToDo: Replace with hook if new chayns api is ready\n\n const popupContentRef = useRef<HTMLDivElement>(null);\n const popupPseudoContentRef = useRef<HTMLDivElement>(null);\n const popupRef = useRef<HTMLDivElement>(null);\n\n const measureHeight = () => {\n if (popupPseudoContentRef.current) {\n const height = popupPseudoContentRef.current.offsetHeight;\n const width = popupPseudoContentRef.current.offsetWidth + 1;\n\n setPseudoSize({ height, width });\n }\n };\n\n useEffect(() => {\n measureHeight();\n\n setIsMeasuring(false);\n }, []);\n\n useEffect(() => {\n const handleResize = () => {\n setIsMeasuring(true);\n\n setTimeout(() => {\n measureHeight();\n setIsMeasuring(false);\n }, 0);\n };\n\n window.addEventListener('resize', handleResize);\n\n return () => {\n window.removeEventListener('resize', handleResize);\n };\n }, []);\n\n const handleShow = useCallback(() => {\n if (popupRef.current && pseudoSize) {\n const { height: pseudoHeight, width: pseudoWidth } = pseudoSize;\n\n const {\n height: childrenHeight,\n left: childrenLeft,\n top: childrenTop,\n width: childrenWidth,\n } = popupRef.current.getBoundingClientRect();\n\n if (pseudoHeight > childrenTop - 25) {\n let isRight = false;\n\n if (pseudoWidth > childrenLeft + childrenWidth / 2 - 25) {\n setAlignment(PopupAlignment.BottomRight);\n\n isRight = true;\n } else {\n setAlignment(PopupAlignment.BottomLeft);\n }\n\n const x = childrenLeft + childrenWidth / 2;\n const y = childrenTop + childrenHeight + yOffset;\n\n let newOffset;\n\n if (isRight) {\n newOffset =\n x + pseudoWidth >= window.innerWidth\n ? x + pseudoWidth - window.innerWidth\n : 0;\n } else {\n newOffset = 0;\n\n const right = window.innerWidth - (childrenLeft + childrenWidth / 2);\n\n newOffset =\n right + pseudoWidth >= window.innerWidth\n ? right + pseudoWidth - window.innerWidth\n : 0;\n }\n\n setOffset(newOffset);\n\n const newX = x - newOffset;\n\n setCoordinates({\n x: newX < 23 ? 23 : newX,\n y: y - yOffset,\n });\n } else {\n let isRight = false;\n\n if (pseudoWidth > childrenLeft + childrenWidth / 2 - 25) {\n setAlignment(PopupAlignment.TopRight);\n\n isRight = true;\n } else {\n setAlignment(PopupAlignment.TopLeft);\n }\n\n const x = childrenLeft + childrenWidth / 2;\n const y = childrenTop - yOffset;\n\n let newOffset;\n\n if (isRight) {\n newOffset =\n x + pseudoWidth >= window.innerWidth\n ? x + pseudoWidth - window.innerWidth\n : 0;\n } else {\n newOffset = 0;\n\n const right = window.innerWidth - (childrenLeft + childrenWidth / 2);\n\n newOffset =\n right + pseudoWidth >= window.innerWidth\n ? right + pseudoWidth - window.innerWidth\n : 0;\n }\n\n setOffset(newOffset);\n\n const newX = x - newOffset;\n\n setCoordinates({\n x: newX < 23 ? 23 : newX,\n y: y - yOffset,\n });\n }\n\n setIsOpen(true);\n }\n }, [pseudoSize, yOffset]);\n\n const handleChildrenClick = () => {\n handleShow();\n };\n\n const handleHide = useCallback(() => {\n setIsOpen(false);\n }, []);\n\n const handleMouseEnter = useCallback(() => {\n if (shouldShowOnHover) {\n window.clearTimeout(timeout.current);\n handleShow();\n }\n }, [handleShow, shouldShowOnHover]);\n\n const handleMouseLeave = useCallback(() => {\n if (!shouldShowOnHover) {\n return;\n }\n\n timeout.current = window.setTimeout(() => {\n handleHide();\n }, 500);\n }, [handleHide, shouldShowOnHover]);\n\n const handleDocumentClick = useCallback<EventListener>(\n (event) => {\n if (!popupContentRef.current?.contains(event.target as Node)) {\n handleHide();\n }\n },\n [handleHide],\n );\n\n useImperativeHandle(\n ref,\n () => ({\n hide: handleHide,\n show: handleShow,\n }),\n [handleHide, handleShow],\n );\n\n useEffect(() => {\n void getWindowMetrics().then((result) => {\n if (result.topBarHeight) {\n setMenuHeight(result.topBarHeight);\n }\n });\n }, []);\n\n useEffect(() => {\n if (isOpen) {\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, isOpen, onHide, onShow]);\n\n useEffect(() => {\n setPortal(() =>\n createPortal(\n <AnimatePresence initial={false}>\n {isOpen && (\n <PopupContentWrapper\n width={pseudoSize?.width ?? 0}\n offset={offset}\n coordinates={coordinates}\n key={`tooltip_${uuid}`}\n alignment={alignment}\n ref={popupContentRef}\n onMouseLeave={handleMouseLeave}\n onMouseEnter={handleMouseEnter}\n >\n <AreaContextProvider shouldChangeColor={false}>\n {content}\n </AreaContextProvider>\n </PopupContentWrapper>\n )}\n </AnimatePresence>,\n container,\n ),\n );\n }, [\n alignment,\n container,\n content,\n coordinates,\n handleMouseEnter,\n handleMouseLeave,\n isOpen,\n offset,\n pseudoSize?.width,\n uuid,\n ]);\n\n return (\n <>\n {isMeasuring && (\n <StyledPopupPseudo ref={popupPseudoContentRef} $menuHeight={menuHeight}>\n {content}\n </StyledPopupPseudo>\n )}\n <StyledPopup\n ref={popupRef}\n onClick={handleChildrenClick}\n onMouseLeave={handleMouseLeave}\n onMouseEnter={handleMouseEnter}\n $shouldUseChildrenWidth={shouldUseChildrenWidth}\n >\n {children}\n </StyledPopup>\n {portal}\n </>\n );\n },\n);\n\nPopup.displayName = 'Popup';\n\nexport default Popup;\n"],"mappings":"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","ignoreList":[]}
|