npm - @chayns-components/core - Versions diffs - 5.0.0-beta.840 → 5.0.0-beta.844 - Mend

@chayns-components/core 5.0.0-beta.840 → 5.0.0-beta.844

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

Files changed (42) hide show

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

	@@ -1 +1 @@
1	- {"version":3,"file":"ContextMenu.js","names":["createDialog","DialogType","AnimatePresence","React","forwardRef","useCallback","useEffect","useImperativeHandle","useRef","useState","createPortal","useUuid","ContextMenuAlignment","getIsTouch","Icon","ContextMenuContent","StyledContextMenu","ContextMenu","_ref","ref","alignment","children","createElement","icons","size","container","document","querySelector","body","coordinates","isInDialog","items","onHide","onShow","shouldCloseOnPopupClick","internalCoordinates","setInternalCoordinates","x","y","internalAlignment","setInternalAlignment","TopLeft","isContentShown","setIsContentShown","portal","setPortal","uuid","contextMenuContentRef","contextMenuRef","handleHide","handleShow","isTouch","result","type","SELECT","buttons","list","map","_ref2","index","text","name","id","icon","open","onClick","current","height","childrenHeight","left","childrenLeft","top","childrenTop","width","childrenWidth","getBoundingClientRect","window","scrollX","scrollY","BottomRight","TopRight","BottomLeft","handleClick","event","preventDefault","stopPropagation","handleDocumentClick","contains","target","hide","show","addEventListener","removeEventListener","initial","key","Fragment","className","displayName"],"sources":["../../../../src/components/context-menu/ContextMenu.tsx"],"sourcesContent":["import { createDialog, DialogType } from 'chayns-api';\nimport { AnimatePresence } from 'framer-motion';\nimport React, {\n forwardRef,\n MouseEvent,\n MouseEventHandler,\n ReactNode,\n ReactPortal,\n useCallback,\n useEffect,\n useImperativeHandle,\n useRef,\n useState,\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport { useUuid } from '../../hooks/uuid';\nimport { ContextMenuAlignment } from '../../types/contextMenu';\nimport { getIsTouch } from '../../utils/environment';\nimport Icon from '../icon/Icon';\nimport ContextMenuContent from './context-menu-content/ContextMenuContent';\nimport { StyledContextMenu } from './ContextMenu.styles';\n\nexport type ContextMenuCoordinates = {\n x: number;\n y: number;\n};\n\nexport type ContextMenuItem = {\n icons: string[];\n key: string;\n onClick: (event?: MouseEvent<HTMLDivElement>) => Promise<void> \| void;\n text: string;\n};\n\nexport type ContextMenuRef = {\n hide: VoidFunction;\n show: VoidFunction;\n};\n\ntype ContextMenuProps = {\n /*\n Optional custom alignment used instead of calculating it using the\n * alignment within the page. The available alignment can be taken from the\n * ContextMenuAlignment enum.\n /\n alignment?: ContextMenuAlignment;\n /\n The element over which the content of the `ContextMenu` should be displayed. The default is an ellipsis icon.\n /\n children?: ReactNode;\n /\n The element where the content of the `ContextMenu` should be rendered via React Portal.\n /\n container?: Element;\n /\n Optional own coordinates to be used instead of calculating the alignment\n * based on the alignment of the children.\n /\n coordinates?: ContextMenuCoordinates;\n /\n 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":["createDialog","DialogType","AnimatePresence","React","forwardRef","useCallback","useEffect","useImperativeHandle","useRef","useState","createPortal","useUuid","ContextMenuAlignment","getIsTouch","Icon","ContextMenuContent","StyledContextMenu","ContextMenu","_ref","ref","alignment","children","createElement","icons","size","container","document","querySelector","body","coordinates","isInDialog","items","onHide","onShow","shouldCloseOnPopupClick","internalCoordinates","setInternalCoordinates","x","y","internalAlignment","setInternalAlignment","TopLeft","isContentShown","setIsContentShown","portal","setPortal","uuid","contextMenuContentRef","contextMenuRef","handleHide","handleShow","isTouch","result","type","SELECT","buttons","list","map","_ref2","index","text","name","id","icon","open","onClick","current","height","childrenHeight","left","childrenLeft","top","childrenTop","width","childrenWidth","getBoundingClientRect","window","scrollX","scrollY","BottomRight","TopRight","BottomLeft","handleClick","event","preventDefault","stopPropagation","handleDocumentClick","contains","target","hide","show","addEventListener","removeEventListener","initial","key","Fragment","className","displayName"],"sources":["../../../../src/components/context-menu/ContextMenu.tsx"],"sourcesContent":["import { createDialog, DialogType } from 'chayns-api';\nimport { AnimatePresence } from 'framer-motion';\nimport React, {\n forwardRef,\n MouseEvent,\n MouseEventHandler,\n ReactNode,\n ReactPortal,\n useCallback,\n useEffect,\n useImperativeHandle,\n useRef,\n useState,\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport { useUuid } from '../../hooks/uuid';\nimport { ContextMenuAlignment } from '../../types/contextMenu';\nimport { getIsTouch } from '../../utils/environment';\nimport Icon from '../icon/Icon';\nimport ContextMenuContent from './context-menu-content/ContextMenuContent';\nimport { StyledContextMenu } from './ContextMenu.styles';\n\nexport type ContextMenuCoordinates = {\n x: number;\n y: number;\n};\n\nexport type ContextMenuItem = {\n icons: string[];\n key: string;\n onClick: (event?: MouseEvent<HTMLDivElement>) => Promise<void> \| void;\n text: string;\n};\n\nexport type ContextMenuRef = {\n hide: VoidFunction;\n show: VoidFunction;\n};\n\ntype ContextMenuProps = {\n /*\n Optional custom alignment used instead of calculating it using the\n * alignment within the page. The available alignment can be taken from the\n * ContextMenuAlignment enum.\n /\n alignment?: ContextMenuAlignment;\n /\n The element over which the content of the `ContextMenu` should be displayed. The default is an ellipsis icon.\n /\n children?: ReactNode;\n /\n The element where the content of the `ContextMenu` should be rendered via React Portal.\n /\n container?: Element;\n /\n Optional own coordinates to be used instead of calculating the alignment\n * based on the alignment of the children.\n /\n coordinates?: ContextMenuCoordinates;\n /\n 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":"AAAA,SAASA,YAAY,EAAEC,UAAU,QAAQ,YAAY;AACrD,SAASC,eAAe,QAAQ,eAAe;AAC/C,OAAOC,KAAK,IACRC,UAAU,EAKVC,WAAW,EACXC,SAAS,EACTC,mBAAmB,EACnBC,MAAM,EACNC,QAAQ,QACL,OAAO;AACd,SAASC,YAAY,QAAQ,WAAW;AACxC,SAASC,OAAO,QAAQ,kBAAkB;AAC1C,SAASC,oBAAoB,QAAQ,yBAAyB;AAC9D,SAASC,UAAU,QAAQ,yBAAyB;AACpD,OAAOC,IAAI,MAAM,cAAc;AAC/B,OAAOC,kBAAkB,MAAM,2CAA2C;AAC1E,SAASC,iBAAiB,QAAQ,sBAAsB;AAkExD,MAAMC,WAAW,gBAAGb,UAAU,CAC1B,CAAAc,IAAA,EAcIC,GAAG,KACF;EAAA,IAdD;IACIC,SAAS;IACTC,QAAQ,gBAAGlB,KAAA,CAAAmB,aAAA,CAACR,IAAI;MAACS,KAAK,EAAE,CAAC,eAAe,CAAE;MAACC,IAAI,EAAE;IAAG,CAAE,CAAC;IACvDC,SAAS,GAAGC,QAAQ,CAACC,aAAa,CAAC,gBAAgB,CAAC,IAChDD,QAAQ,CAACC,aAAa,CAAC,OAAO,CAAC,IAC/BD,QAAQ,CAACE,IAAI;IACjBC,WAAW;IACXC,UAAU,GAAG,KAAK;IAClBC,KAAK;IACLC,MAAM;IACNC,MAAM;IACNC,uBAAuB,GAAG;EAC9B,CAAC,GAAAhB,IAAA;EAGD,MAAM,CAACiB,mBAAmB,EAAEC,sBAAsB,CAAC,GAAG3B,QAAQ,CAAyB;IACnF4B,CAAC,EAAE,CAAC;IACJC,CAAC,EAAE;EACP,CAAC,CAAC;EAEF,MAAM,CAACC,iBAAiB,EAAEC,oBAAoB,CAAC,GAAG/B,QAAQ,CACtDG,oBAAoB,CAAC6B,OACzB,CAAC;EAED,MAAM,CAACC,cAAc,EAAEC,iBAAiB,CAAC,GAAGlC,QAAQ,CAAC,KAAK,CAAC;EAC3D,MAAM,CAACmC,MAAM,EAAEC,SAAS,CAAC,GAAGpC,QAAQ,CAAc,CAAC;EAEnD,MAAMqC,IAAI,GAAGnC,OAAO,CAAC,CAAC;;EAEtB;EACA,MAAMoC,qBAAqB,GAAGvC,MAAM,CAAiB,IAAI,CAAC;EAC1D,MAAMwC,cAAc,GAAGxC,MAAM,CAAkB,IAAI,CAAC;EAEpD,MAAMyC,UAAU,GAAG5C,WAAW,CAAC,MAAM;IACjCsC,iBAAiB,CAAC,KAAK,CAAC;EAC5B,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMO,UAAU,GAAG7C,WAAW,CAAC,YAAY;IACvC,MAAM8C,OAAO,GAAGtC,UAAU,CAAC,CAAC;IAE5B,IAAIsC,OAAO,EAAE;MACT,MAAM;QAAEC;MAAO,CAAC,GAAI,MAAMpD,YAAY,CAAC;QACnCqD,IAAI,EAAEpD,UAAU,CAACqD,MAAM;QACvBC,OAAO,EAAE,EAAE;QACXC,IAAI,EAAEzB,KAAK,CAAC0B,GAAG,CAAC,CAAAC,KAAA,EAAkBC,KAAK;UAAA,IAAtB;YAAEpC,KAAK;YAAEqC;UAAK,CAAC,GAAAF,KAAA;UAAA,OAAa;YACzCG,IAAI,EAAED,IAAI;YACVE,EAAE,EAAEH,KAAK;YACTI,IAAI,EAAExC,KAAK,CAAC,CAAC;UACjB,CAAC;QAAA,CAAC;MACN,CAAC,CAAC,CAACyC,IAAI,CAAC,CAAwB;MAEhC,IAAIZ,MAAM,IAAI,OAAOA,MAAM,CAAC,CAAC,CAAC,KAAK,QAAQ,EAAE;QACzC,KAAKrB,KAAK,CAACqB,MAAM,CAAC,CAAC,CAAC,CAAC,EAAEa,OAAO,CAAC,CAAC;MACpC;IACJ,CAAC,MAAM,IAAIjB,cAAc,CAACkB,OAAO,EAAE;MAC/B,MAAM;QACFC,MAAM,EAAEC,cAAc;QACtBC,IAAI,EAAEC,YAAY;QAClBC,GAAG,EAAEC,WAAW;QAChBC,KAAK,EAAEC;MACX,CAAC,GAAG1B,cAAc,CAACkB,OAAO,CAACS,qBAAqB,CAAC,CAAC;MAElD,MAAM;QAAER,MAAM;QAAEM,KAAK;QAAEF,GAAG;QAAEF;MAAK,CAAC,GAAG5C,SAAS,CAACkD,qBAAqB,CAAC,CAAC;MAEtE,MAAMtC,CAAC,GACHiC,YAAY,IAAIxC,UAAU,GAAG,CAAC,GAAG8C,MAAM,CAACC,OAAO,CAAC,GAAGH,aAAa,GAAG,CAAC,GAAGL,IAAI;MAC/E,MAAM/B,CAAC,GACHkC,WAAW,IAAI1C,UAAU,GAAG,CAAC,GAAG8C,MAAM,CAACE,OAAO,CAAC,GAAGV,cAAc,GAAG,CAAC,GAAGG,GAAG;MAE9EnC,sBAAsB,CAAC;QAAEC,CAAC;QAAEC;MAAE,CAAC,CAAC;MAEhC,IAAID,CAAC,GAAGoC,KAAK,GAAG,CAAC,EAAE;QACf,IAAInC,CAAC,GAAG6B,MAAM,GAAG,CAAC,EAAE;UAChB3B,oBAAoB,CAAC5B,oBAAoB,CAACmE,WAAW,CAAC;QAC1D,CAAC,MAAM;UACHvC,oBAAoB,CAAC5B,oBAAoB,CAACoE,QAAQ,CAAC;QACvD;MACJ,CAAC,MAAM,IAAI1C,CAAC,GAAG6B,MAAM,GAAG,CAAC,EAAE;QACvB3B,oBAAoB,CAAC5B,oBAAoB,CAACqE,UAAU,CAAC;MACzD,CAAC,MAAM;QACHzC,oBAAoB,CAAC5B,oBAAoB,CAAC6B,OAAO,CAAC;MACtD;MAEAE,iBAAiB,CAAC,IAAI,CAAC;IAC3B;EACJ,CAAC,EAAE,CAAClB,SAAS,EAAEK,UAAU,EAAEC,KAAK,CAAC,CAAC;EAElC,MAAMmD,WAAW,GAAG7E,WAAW,CAC1B8E,KAAK,IAAK;IACPA,KAAK,CAACC,cAAc,CAAC,CAAC;IACtBD,KAAK,CAACE,eAAe,CAAC,CAAC;IAEvB,KAAKnC,UAAU,CAAC,CAAC;EACrB,CAAC,EACD,CAACA,UAAU,CACf,CAAC;EAED,MAAMoC,mBAAmB,GAAGjF,WAAW,CAClC8E,KAAK,IAAK;IACP,IACI,CAACjD,uBAAuB,IACxBa,qBAAqB,CAACmB,OAAO,EAAEqB,QAAQ,CAACJ,KAAK,CAACK,MAAc,CAAC,EAC/D;MACE;IACJ;IAEAvC,UAAU,CAAC,CAAC;EAChB,CAAC,EACD,CAACA,UAAU,EAAEf,uBAAuB,CACxC,CAAC;EAED3B,mBAAmB,CACfY,GAAG,EACH,OAAO;IACHsE,IAAI,EAAExC,UAAU;IAChByC,IAAI,EAAExC;EACV,CAAC,CAAC,EACF,CAACD,UAAU,EAAEC,UAAU,CAC3B,CAAC;EAED5C,SAAS,CAAC,MAAM;IACZ,IAAIoC,cAAc,EAAE;MAChBhB,QAAQ,CAACiE,gBAAgB,CAAC,OAAO,EAAEL,mBAAmB,EAAE,IAAI,CAAC;MAC7DV,MAAM,CAACe,gBAAgB,CAAC,MAAM,EAAE1C,UAAU,CAAC;MAE3C,IAAI,OAAOhB,MAAM,KAAK,UAAU,EAAE;QAC9BA,MAAM,CAAC,CAAC;MACZ;IACJ,CAAC,MAAM,IAAI,OAAOD,MAAM,KAAK,UAAU,EAAE;MACrCA,MAAM,CAAC,CAAC;IACZ;IAEA,OAAO,MAAM;MACTN,QAAQ,CAACkE,mBAAmB,CAAC,OAAO,EAAEN,mBAAmB,EAAE,IAAI,CAAC;MAChEV,MAAM,CAACgB,mBAAmB,CAAC,MAAM,EAAE3C,UAAU,CAAC;IAClD,CAAC;EACL,CAAC,EAAE,CAACqC,mBAAmB,EAAErC,UAAU,EAAEP,cAAc,EAAEV,MAAM,EAAEC,MAAM,CAAC,CAAC;EAErE3B,SAAS,CAAC,MAAM;IACZuC,SAAS,CAAC,mBACNnC,YAAY,cACRP,KAAA,CAAAmB,aAAA,CAACpB,eAAe;MAAC2F,OAAO,EAAE;IAAM,GAC3BnD,cAAc,iBACXvC,KAAA,CAAAmB,aAAA,CAACP,kBAAkB;MACfc,WAAW,EAAEA,WAAW,IAAIM,mBAAoB;MAChDJ,KAAK,EAAEA,KAAM;MACb+D,GAAG,EAAE,eAAehD,IAAI,EAAG;MAC3B1B,SAAS,EAAEA,SAAS,IAAImB,iBAAkB;MAC1CpB,GAAG,EAAE4B;IAAsB,CAC9B,CAEQ,CAAC,EAClBtB,SACJ,CACJ,CAAC;EACL,CAAC,EAAE,CACCL,SAAS,EACTK,SAAS,EACTI,WAAW,EACXU,iBAAiB,EACjBJ,mBAAmB,EACnBO,cAAc,EACdX,KAAK,EACLe,IAAI,CACP,CAAC;EAEF,oBACI3C,KAAA,CAAAmB,aAAA,CAAAnB,KAAA,CAAA4F,QAAA,qBACI5F,KAAA,CAAAmB,aAAA,CAACN,iBAAiB;IACdgF,SAAS,EAAC,0BAA0B;IACpC/B,OAAO,EAAEiB,WAAY;IACrB/D,GAAG,EAAE6B;EAAe,GAEnB3B,QACc,CAAC,EACnBuB,MACH,CAAC;AAEX,CACJ,CAAC;AAED3B,WAAW,CAACgF,WAAW,GAAG,aAAa;AAEvC,eAAehF,WAAW","ignoreList":[]}

package/lib/esm/components/file-input/FileInput.js CHANGED Viewed

@@ -199,7 +199,7 @@ const FileInput = /*#__PURE__*/forwardRef((_ref, ref) => {
         id,
         name
       } = _ref2;
-      items.push( /*#__PURE__*/React.createElement(StyledMotionFileInputList, {
+      items.push(/*#__PURE__*/React.createElement(StyledMotionFileInputList, {
         animate: {
           height: 'auto',
           opacity: 1

package/lib/esm/components/file-input/FileInput.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FileInput.js","names":["createDialog","DialogType","AnimatePresence","React","forwardRef","useCallback","useImperativeHandle","useMemo","useState","filterDuplicateFile","filterDuplicateFileUrls","isValidFileType","selectFiles","Icon","List","FileListItem","StyledFileInput","StyledFileInputContainer","StyledFileInputText","StyledFileInputWrapper","StyledMotionFileInputList","StyledUploadedFilesList","FileInput","_ref","ref","fileSelectionIcons","imageSelectIcons","fileTypes","onMaxFilesReached","maxFiles","onRemove","files","maxFileSizeInMB","onAdd","fileSelectionPlaceholder","imageSelectPlaceholder","internalFiles","setInternalFiles","internalImages","setInternalImages","handleInputClear","clear","handleAddImages","images","newImages","forEach","image","newFile","push","tmp","slice","length","prevState","handleAddFiles","newFiles","newFileItems","file","types","handleDeleteFile","fileName","fileToDelete","filteredFiles","filter","name","filteredImages","url","isDisabled","handleImageSelectionClick","buttonType","result","dialogInput","upload","buttons","text","initialView","type","MODULE","system","scope","module","open","handleFileSelectionClick","multiple","handleDrop","e","preventDefault","draggedFiles","Array","from","dataTransfer","content","combinedFiles","items","map","createElement","animate","height","opacity","exit","key","transition","duration","fileType","undefined","fileSize","size","uploadedFiles","cutFiles","splice","_ref2","id","$isDisabled","onClick","onDragOver","onDrop","icons","$isImageSelection","initial","$shouldShowBorder","displayName"],"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":["createDialog","DialogType","AnimatePresence","React","forwardRef","useCallback","useImperativeHandle","useMemo","useState","filterDuplicateFile","filterDuplicateFileUrls","isValidFileType","selectFiles","Icon","List","FileListItem","StyledFileInput","StyledFileInputContainer","StyledFileInputText","StyledFileInputWrapper","StyledMotionFileInputList","StyledUploadedFilesList","FileInput","_ref","ref","fileSelectionIcons","imageSelectIcons","fileTypes","onMaxFilesReached","maxFiles","onRemove","files","maxFileSizeInMB","onAdd","fileSelectionPlaceholder","imageSelectPlaceholder","internalFiles","setInternalFiles","internalImages","setInternalImages","handleInputClear","clear","handleAddImages","images","newImages","forEach","image","newFile","push","tmp","slice","length","prevState","handleAddFiles","newFiles","newFileItems","file","types","handleDeleteFile","fileName","fileToDelete","filteredFiles","filter","name","filteredImages","url","isDisabled","handleImageSelectionClick","buttonType","result","dialogInput","upload","buttons","text","initialView","type","MODULE","system","scope","module","open","handleFileSelectionClick","multiple","handleDrop","e","preventDefault","draggedFiles","Array","from","dataTransfer","content","combinedFiles","items","map","createElement","animate","height","opacity","exit","key","transition","duration","fileType","undefined","fileSize","size","uploadedFiles","cutFiles","splice","_ref2","id","$isDisabled","onClick","onDragOver","onDrop","icons","$isImageSelection","initial","$shouldShowBorder","displayName"],"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":"AAAA,SAASA,YAAY,EAAEC,UAAU,QAAQ,YAAY;AACrD,SAASC,eAAe,QAAQ,eAAe;AAC/C,OAAOC,KAAK,IAERC,UAAU,EAEVC,WAAW,EACXC,mBAAmB,EACnBC,OAAO,EACPC,QAAQ,QACL,OAAO;AAEd,SAASC,mBAAmB,EAAEC,uBAAuB,EAAEC,eAAe,QAAQ,kBAAkB;AAChG,SAASC,WAAW,QAAQ,wBAAwB;AACpD,OAAOC,IAAI,MAAM,cAAc;AAC/B,OAAOC,IAAI,MAAM,cAAc;AAC/B,OAAOC,YAAY,MAAM,0BAA0B;AACnD,SACIC,eAAe,EACfC,wBAAwB,EACxBC,mBAAmB,EACnBC,sBAAsB,EACtBC,yBAAyB,EACzBC,uBAAuB,QACpB,oBAAoB;AA8D3B,MAAMC,SAAS,gBAAGlB,UAAU,CACxB,CAAAmB,IAAA,EAcIC,GAAG,KACF;EAAA,IAdD;IACIC,kBAAkB,GAAG,CAAC,cAAc,CAAC;IACrCC,gBAAgB,GAAG,CAAC,UAAU,CAAC;IAC/BC,SAAS;IACTC,iBAAiB;IACjBC,QAAQ;IACRC,QAAQ;IACRC,KAAK;IACLC,eAAe;IACfC,KAAK;IACLC,wBAAwB,GAAG,mBAAmB;IAC9CC;EACJ,CAAC,GAAAZ,IAAA;EAGD,MAAM,CAACa,aAAa,EAAEC,gBAAgB,CAAC,GAAG7B,QAAQ,CAAS,EAAE,CAAC;EAC9D,MAAM,CAAC8B,cAAc,EAAEC,iBAAiB,CAAC,GAAG/B,QAAQ,CAAW,EAAE,CAAC;EAElE,MAAMgC,gBAAgB,GAAGA,CAAA,KAAM;IAC3BH,gBAAgB,CAAC,EAAE,CAAC;IACpBE,iBAAiB,CAAC,EAAE,CAAC;EACzB,CAAC;EAEDjC,mBAAmB,CACfkB,GAAG,EACH,OAAO;IACHiB,KAAK,EAAED;EACX,CAAC,CAAC,EACF,EACJ,CAAC;EAED,MAAME,eAAe,GAAGrC,WAAW,CAC9BsC,MAAgB,IAAK;IAClB,MAAMC,SAAmB,GAAG,EAAE;IAE9BD,MAAM,CAACE,OAAO,CAAEC,KAAK,IAAK;MACtB,IAAI,CAACpC,uBAAuB,CAAC;QAAEqB,KAAK,EAAEO,cAAc;QAAES,OAAO,EAAED;MAAM,CAAC,CAAC,EAAE;QACrEF,SAAS,CAACI,IAAI,CAACF,KAAK,CAAC;MACzB;IACJ,CAAC,CAAC;IAEF,IAAIG,GAAG,GAAGL,SAAS;IAEnB,IAAIf,QAAQ,EAAE;MACVoB,GAAG,GAAGL,SAAS,CAACM,KAAK,CACjB,CAAC,EACDrB,QAAQ,IACHO,aAAa,CAACe,MAAM,GAAGb,cAAc,CAACa,MAAM,IAAIpB,KAAK,EAAEoB,MAAM,IAAI,CAAC,CAAC,CAC5E,CAAC;IACL;IAEA,IAAIF,GAAG,CAACE,MAAM,GAAG,CAAC,IAAI,OAAOlB,KAAK,KAAK,UAAU,EAAE;MAC/CA,KAAK,CAACgB,GAAG,CAAC;IACd;IAEAV,iBAAiB,CAAEa,SAAS,IAAK,CAAC,GAAGA,SAAS,EAAE,GAAGH,GAAG,CAAC,CAAC;EAC5D,CAAC,EACD,CAAClB,KAAK,EAAEoB,MAAM,EAAEf,aAAa,CAACe,MAAM,EAAEb,cAAc,EAAET,QAAQ,EAAEI,KAAK,CACzE,CAAC;EAED,MAAMoB,cAAc,GAAGhD,WAAW,CAC7BiD,QAAgB,IAAK;IAClB,MAAMC,YAAoB,GAAG,EAAE;IAE/BD,QAAQ,CAACT,OAAO,CAAEW,IAAI,IAAK;MACvB,IAAI7B,SAAS,IAAI,CAAChB,eAAe,CAAC;QAAE6C,IAAI;QAAEC,KAAK,EAAE9B;MAAU,CAAC,CAAC,EAAE;QAC3D;MACJ;MAEA,IAAI6B,IAAI,IAAI,CAAC/C,mBAAmB,CAAC;QAAEsB,KAAK,EAAEK,aAAa;QAAEW,OAAO,EAAES;MAAK,CAAC,CAAC,EAAE;QACvED,YAAY,CAACP,IAAI,CAACQ,IAAI,CAAC;MAC3B;IACJ,CAAC,CAAC;IAEF,IAAIP,GAAG,GAAGM,YAAY;IAEtB,IAAI1B,QAAQ,EAAE;MACVoB,GAAG,GAAGM,YAAY,CAACL,KAAK,CACpB,CAAC,EACDrB,QAAQ,IACHO,aAAa,CAACe,MAAM,GAAGb,cAAc,CAACa,MAAM,IAAIpB,KAAK,EAAEoB,MAAM,IAAI,CAAC,CAAC,CAC5E,CAAC;IACL;IAEA,IAAIF,GAAG,CAACE,MAAM,GAAG,CAAC,IAAI,OAAOlB,KAAK,KAAK,UAAU,EAAE;MAC/CA,KAAK,CAACgB,GAAG,CAAC;IACd;IAEAZ,gBAAgB,CAAEe,SAAS,IAAK,CAAC,GAAGA,SAAS,EAAE,GAAGH,GAAG,CAAC,CAAC;EAC3D,CAAC,EACD,CAACtB,SAAS,EAAEI,KAAK,EAAEoB,MAAM,EAAEf,aAAa,EAAEE,cAAc,CAACa,MAAM,EAAEtB,QAAQ,EAAEI,KAAK,CACpF,CAAC;EAED,MAAMyB,gBAAgB,GAAGrD,WAAW,CAC/BsD,QAAiB,IAAK;IACnB,IAAIC,YAA2D;IAE/D,MAAMC,aAAa,GAAGzB,aAAa,CAAC0B,MAAM,CAAEN,IAAI,IAAK;MACjD,MAAM;QAAEO;MAAK,CAAC,GAAGP,IAAI;MAErB,IAAIO,IAAI,KAAKJ,QAAQ,EAAE;QACnBC,YAAY,GAAGJ,IAAI;MACvB;MAEA,OAAOO,IAAI,KAAKJ,QAAQ;IAC5B,CAAC,CAAC;IAEFtB,gBAAgB,CAACwB,aAAa,CAAC;IAE/B,IAAI,CAACD,YAAY,EAAE;MACf,MAAMI,cAAc,GAAG1B,cAAc,CAACwB,MAAM,CAAEhB,KAAK,IAAK;QACpD,IAAIA,KAAK,KAAKa,QAAQ,EAAE;UACpBC,YAAY,GAAGd,KAAK;QACxB;QAEA,OAAOA,KAAK,KAAKa,QAAQ;MAC7B,CAAC,CAAC;MAEFpB,iBAAiB,CAACyB,cAAc,CAAC;IACrC;IAEA,IAAI,CAACJ,YAAY,EAAE;MACf7B,KAAK,EAAEc,OAAO,CAAEW,IAAI,IAAK;QACrB,IAAIA,IAAI,CAACS,GAAG,KAAKN,QAAQ,IAAIH,IAAI,CAACO,IAAI,KAAKJ,QAAQ,EAAE;UACjDC,YAAY,GAAGJ,IAAI;QACvB;MACJ,CAAC,CAAC;IACN;IAEA,IAAI,CAACI,YAAY,IAAI,OAAO9B,QAAQ,KAAK,UAAU,EAAE;MACjD;IACJ;IAEAA,QAAQ,CAAC8B,YAAY,CAAC;EAC1B,CAAC,EACD,CAAC7B,KAAK,EAAEK,aAAa,EAAEE,cAAc,EAAER,QAAQ,CACnD,CAAC;EAED,MAAMoC,UAAU,GAAG3D,OAAO,CAAC,MAAM;IAC7B,IAAIsB,QAAQ,EAAE;MACV,IAAIO,aAAa,CAACe,MAAM,GAAGb,cAAc,CAACa,MAAM,IAAItB,QAAQ,EAAE;QAC1D,IAAI,OAAOD,iBAAiB,KAAK,UAAU,EAAE;UACzCA,iBAAiB,CAAC,CAAC;QACvB;QAEA,OAAO,IAAI;MACf;IACJ;IAEA,OAAO,KAAK;EAChB,CAAC,EAAE,CAACQ,aAAa,CAACe,MAAM,EAAEb,cAAc,CAACa,MAAM,EAAEtB,QAAQ,EAAED,iBAAiB,CAAC,CAAC;EAE9E,MAAMuC,yBAAyB,GAAG9D,WAAW,CAAC,YAAY;IACtD,IAAI6D,UAAU,EAAE;MACZ;IACJ;IAEA,MAAM;MAAEE,UAAU;MAAEC;IAAO,CAAC,GAAI,MAAMrE,YAAY,CAAc;MAC5DsE,WAAW,EAAE;QACTC,MAAM,EAAE,IAAI;QACZC,OAAO,EAAE,CACL;UAAEC,IAAI,EAAE,OAAO;UAAEL,UAAU,EAAE;QAAE,CAAC,EAChC;UAAEK,IAAI,EAAE,KAAK;UAAEL,UAAU,EAAE,CAAC;QAAE,CAAC,CAClC;QACDM,WAAW,EAAE;MACjB,CAAC;MACDC,IAAI,EAAE1E,UAAU,CAAC2E,MAAM;MACvBC,MAAM,EAAE;QACJZ,GAAG,EAAE,4EAA4E;QACjFa,KAAK,EAAE,qBAAqB;QAC5BC,MAAM,EAAE;MACZ,CAAC;MACDP,OAAO,EAAE;IACb,CAAC,CAAC,CAACQ,IAAI,CAAC,CAAuB;IAE/B,IAAIZ,UAAU,KAAK,CAAC,IAAIC,MAAM,EAAEJ,GAAG,EAAE;MACjCvB,eAAe,CAAC,CAAC2B,MAAM,CAACJ,GAAG,CAAC,CAAC;IACjC;EACJ,CAAC,EAAE,CAACvB,eAAe,EAAEwB,UAAU,CAAC,CAAC;EAEjC,MAAMe,wBAAwB,GAAG5E,WAAW,CAAC,YAAY;IACrD,IAAI6D,UAAU,EAAE;MACZ;IACJ;IAEA,MAAMZ,QAAQ,GAAG,MAAM1C,WAAW,CAAC;MAC/BsE,QAAQ,EAAE,IAAI;MACdP,IAAI,EAAEhD,SAAS;MACfK;IACJ,CAAC,CAAC;IAEFqB,cAAc,CAACC,QAAQ,CAAC;EAC5B,CAAC,EAAE,CAAC3B,SAAS,EAAE0B,cAAc,EAAEa,UAAU,EAAElC,eAAe,CAAC,CAAC;EAE5D,MAAMmD,UAAU,GAAG9E,WAAW,CACzB+E,CAA4B,IAAK;IAC9BA,CAAC,CAACC,cAAc,CAAC,CAAC;IAClB,MAAMC,YAAY,GAAGC,KAAK,CAACC,IAAI,CAACJ,CAAC,CAACK,YAAY,CAAC1D,KAAK,CAAC;IAErDsB,cAAc,CAACiC,YAAY,CAAC;EAChC,CAAC,EACD,CAACjC,cAAc,CACnB,CAAC;EAED,MAAMqC,OAAO,GAAGnF,OAAO,CAAC,MAAM;IAC1B,MAAMoF,aAAa,GAAG,CAAC,GAAGrD,cAAc,EAAE,GAAGF,aAAa,CAAC;IAE3D,MAAMwD,KAAqB,GAAGD,aAAa,CAACE,GAAG,CAAErC,IAAI,iBACjDrD,KAAA,CAAA2F,aAAA,CAAC1E,yBAAyB;MACtB2E,OAAO,EAAE;QAAEC,MAAM,EAAE,MAAM;QAAEC,OAAO,EAAE;MAAE,CAAE;MACxCC,IAAI,EAAE;QAAEF,MAAM,EAAE,CAAC;QAAEC,OAAO,EAAE;MAAE,CAAE;MAChCE,GAAG,EAAE,OAAO3C,IAAI,KAAK,QAAQ,GAAGA,IAAI,GAAGA,IAAI,CAACO,IAAK;MACjDqC,UAAU,EAAE;QAAEC,QAAQ,EAAE,IAAI;QAAE1B,IAAI,EAAE;MAAQ;IAAE,gBAE9CxE,KAAA,CAAA2F,aAAA,CAAC/E,YAAY;MACTuF,QAAQ,EAAE,OAAO9C,IAAI,KAAK,QAAQ,GAAGA,IAAI,CAACmB,IAAI,GAAG4B,SAAU;MAC3D5C,QAAQ,EAAE,OAAOH,IAAI,KAAK,QAAQ,GAAGA,IAAI,CAACO,IAAI,GAAGwC,SAAU;MAC3DC,QAAQ,EAAE,OAAOhD,IAAI,KAAK,QAAQ,GAAGA,IAAI,CAACiD,IAAI,GAAGF,SAAU;MAC3DtC,GAAG,EAAE,OAAOT,IAAI,KAAK,QAAQ,GAAGA,IAAI,GAAG+C,SAAU;MACjDzE,QAAQ,EAAE4B;IAAiB,CAC9B,CACsB,CAC9B,CAAC;IAEF,OAAOkC,KAAK;EAChB,CAAC,EAAE,CAAClC,gBAAgB,EAAEtB,aAAa,EAAEE,cAAc,CAAC,CAAC;EAErD,MAAMoE,aAAa,GAAGnG,OAAO,CAAC,MAAM;IAChC,MAAMqF,KAAqB,GAAG,EAAE;IAEhC,MAAMe,QAAQ,GAAG9E,QAAQ,GAAGE,KAAK,EAAE6E,MAAM,CAAC,CAAC,EAAE/E,QAAQ,CAAC,GAAGE,KAAK;IAE9D4E,QAAQ,EAAE9D,OAAO,CAACgE,KAAA,IAAuB;MAAA,IAAtB;QAAE5C,GAAG;QAAE6C,EAAE;QAAE/C;MAAK,CAAC,GAAA8C,KAAA;MAChCjB,KAAK,CAAC5C,IAAI,cACN7C,KAAA,CAAA2F,aAAA,CAAC1E,yBAAyB;QACtB2E,OAAO,EAAE;UAAEC,MAAM,EAAE,MAAM;UAAEC,OAAO,EAAE;QAAE,CAAE;QACxCC,IAAI,EAAE;UAAEF,MAAM,EAAE,CAAC;UAAEC,OAAO,EAAE;QAAE,CAAE;QAChCE,GAAG,EAAEW,EAAG;QACRV,UAAU,EAAE;UAAEC,QAAQ,EAAE,IAAI;UAAE1B,IAAI,EAAE;QAAQ;MAAE,gBAE9CxE,KAAA,CAAA2F,aAAA,CAAC/E,YAAY;QAACkD,GAAG,EAAEA,GAAI;QAACnC,QAAQ,EAAE4B,gBAAiB;QAACC,QAAQ,EAAEI;MAAK,CAAE,CAC9C,CAC/B,CAAC;IACL,CAAC,CAAC;IAEF,OAAO6B,KAAK;EAChB,CAAC,EAAE,CAAC7D,KAAK,EAAE2B,gBAAgB,EAAE7B,QAAQ,CAAC,CAAC;EAEvC,OAAOtB,OAAO,CACV,mBACIJ,KAAA,CAAA2F,aAAA,CAAC9E,eAAe,qBACZb,KAAA,CAAA2F,aAAA,CAAC3E,sBAAsB;IAAC4F,WAAW,EAAE7C;EAAW,gBAC5C/D,KAAA,CAAA2F,aAAA,CAAC7E,wBAAwB;IACrB+F,OAAO,EAAEA,CAAA,KAAM,KAAK/B,wBAAwB,CAAC,CAAE;IAC/CgC,UAAU,EAAG7B,CAA4B,IAAKA,CAAC,CAACC,cAAc,CAAC,CAAE;IACjE6B,MAAM,EAAG9B,CAA4B,IAAK,KAAKD,UAAU,CAACC,CAAC;EAAE,gBAE7DjF,KAAA,CAAA2F,aAAA,CAACjF,IAAI;IAACsG,KAAK,EAAE1F;EAAmB,CAAE,CAAC,eACnCtB,KAAA,CAAA2F,aAAA,CAAC5E,mBAAmB,QAAEgB,wBAA8C,CAC9C,CAAC,EAC1BC,sBAAsB,iBACnBhC,KAAA,CAAA2F,aAAA,CAAC7E,wBAAwB;IACrBmG,iBAAiB;IACjBJ,OAAO,EAAEA,CAAA,KAAM,KAAK7C,yBAAyB,CAAC;EAAE,gBAEhDhE,KAAA,CAAA2F,aAAA,CAACjF,IAAI;IAACsG,KAAK,EAAEzF;EAAiB,CAAE,CAAC,eACjCvB,KAAA,CAAA2F,aAAA,CAAC5E,mBAAmB,QAAEiB,sBAA4C,CAC5C,CAEV,CAAC,eACzBhC,KAAA,CAAA2F,aAAA,CAAChF,IAAI,qBACDX,KAAA,CAAA2F,aAAA,CAAC5F,eAAe;IAACmH,OAAO,EAAE;EAAM,GAAE3B,OAAyB,CACzD,CAAC,EACNgB,aAAa,CAACvD,MAAM,GAAG,CAAC,iBACrBhD,KAAA,CAAA2F,aAAA,CAACzE,uBAAuB;IAACiG,iBAAiB,EAAE5B,OAAO,CAACvC,MAAM,GAAG;EAAE,gBAC3DhD,KAAA,CAAA2F,aAAA,CAAChF,IAAI,qBACDX,KAAA,CAAA2F,aAAA,CAAC5F,eAAe;IAACmH,OAAO,EAAE;EAAM,GAAEX,aAA+B,CAC/D,CACe,CAEhB,CACpB,EACD,CACIxC,UAAU,EACVzC,kBAAkB,EAClBS,wBAAwB,EACxBC,sBAAsB,EACtBT,gBAAgB,EAChBgE,OAAO,EACPgB,aAAa,EACbzB,wBAAwB,EACxBE,UAAU,EACVhB,yBAAyB,CAEjC,CAAC;AACL,CACJ,CAAC;AAED7C,SAAS,CAACiG,WAAW,GAAG,WAAW;AAEnC,eAAejG,SAAS","ignoreList":[]}

package/lib/esm/components/filter-buttons/FilterButtons.js CHANGED Viewed

@@ -59,7 +59,7 @@ const FilterButtons = _ref => {
         count,
         id
       } = _ref2;
-      array.push( /*#__PURE__*/React.createElement(FilterButton, {
+      array.push(/*#__PURE__*/React.createElement(FilterButton, {
         color: color,
         icons: icons,
         id: id,

package/lib/esm/components/filter-buttons/FilterButtons.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FilterButtons.js","names":["React","useCallback","useEffect","useMemo","useState","FilterButtonItemShape","FilterButtonSize","FilterButton","StyledFilterButton","FilterButtons","_ref","selectedItemIds","onSelect","items","size","Normal","selectedIds","setSelectedIds","handleSelect","id","newIds","includes","filter","filteredId","length","selectedId","reactItems","array","createElement","key","isSelected","Array","isArray","shape","Rectangular","text","forEach","_ref2","icons","color","count","push","Round","displayName"],"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":"AAAA,OAAOA,KAAK,IAAsBC,WAAW,EAAEC,SAAS,EAAEC,OAAO,EAAEC,QAAQ,QAAQ,OAAO;AAC1F,SACIC,qBAAqB,EACrBC,gBAAgB,QAEb,2BAA2B;AAClC,OAAOC,YAAY,MAAM,8BAA8B;AACvD,SAASC,kBAAkB,QAAQ,wBAAwB;AAqB3D,MAAMC,aAAqC,GAAGC,IAAA,IAKxC;EAAA,IALyC;IAC3CC,eAAe;IACfC,QAAQ;IACRC,KAAK;IACLC,IAAI,GAAGR,gBAAgB,CAACS;EAC5B,CAAC,GAAAL,IAAA;EACG,MAAM,CAACM,WAAW,EAAEC,cAAc,CAAC,GAAGb,QAAQ,CAAW,CAAC,KAAK,CAAC,CAAC;;EAEjE;AACJ;AACA;EACIF,SAAS,CAAC,MAAM;IACZ,IAAIS,eAAe,EAAE;MACjBM,cAAc,CAACN,eAAe,CAAC;IACnC;EACJ,CAAC,EAAE,CAACA,eAAe,CAAC,CAAC;;EAErB;AACJ;AACA;EACI,MAAMO,YAAY,GAAGjB,WAAW,CAC3BkB,EAAU,IAAK;IACZ,IAAIC,MAAgB;IAEpB,IAAID,EAAE,KAAK,KAAK,EAAE;MACdC,MAAM,GAAGJ,WAAW,CAACK,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC,KAAK,CAAC,GAAG,EAAE;IACvD,CAAC,MAAM;MACHD,MAAM,GAAGJ,WAAW,CAACK,QAAQ,CAACF,EAAE,CAAC,GAC3BH,WAAW,CAACM,MAAM,CAAEC,UAAU,IAAKA,UAAU,KAAKJ,EAAE,CAAC,GACrD,CAAC,GAAGH,WAAW,CAACM,MAAM,CAAEC,UAAU,IAAKA,UAAU,KAAK,KAAK,CAAC,EAAEJ,EAAE,CAAC;IAC3E;IAEA,IAAIC,MAAM,CAACI,MAAM,KAAK,CAAC,EAAE;MACrBJ,MAAM,GAAG,CAAC,KAAK,CAAC;IACpB;IAEAH,cAAc,CAACG,MAAM,CAAC;IAEtB,IAAI,OAAOR,QAAQ,KAAK,UAAU,EAAE;MAChCA,QAAQ,CAACQ,MAAM,CAACE,MAAM,CAAEG,UAAU,IAAKA,UAAU,KAAK,KAAK,CAAC,CAAC;IACjE;EACJ,CAAC,EACD,CAACb,QAAQ,EAAEI,WAAW,CAC1B,CAAC;EAED,MAAMU,UAAU,GAAGvB,OAAO,CAAC,MAAM;IAC7B,IAAIU,KAAK,CAACW,MAAM,KAAK,CAAC,EAAE;MACpB,OAAO,IAAI;IACf;IAEA,MAAMG,KAAqB,GAAG,cAC1B3B,KAAA,CAAA4B,aAAA,CAACrB,YAAY;MACTY,EAAE,EAAC,KAAK;MACRU,GAAG,EAAC,KAAK;MACTjB,QAAQ,EAAEM,YAAa;MACvBY,UAAU,EACNd,WAAW,CAACK,QAAQ,CAAC,KAAK,CAAC,IAC1BU,KAAK,CAACC,OAAO,CAAChB,WAAW,CAAC,IAAIA,WAAW,CAACQ,MAAM,KAAK,CACzD;MACDS,KAAK,EAAE5B,qBAAqB,CAAC6B,WAAY;MACzCpB,IAAI,EAAEA,IAAK;MACXqB,IAAI,EAAC;IAAM,CACd,CAAC,CACL;IAEDtB,KAAK,CAACuB,OAAO,CAACC,KAAA,IAAuC;MAAA,IAAtC;QAAEC,KAAK;QAAEH,IAAI;QAAEI,KAAK;QAAEC,KAAK;QAAErB;MAAG,CAAC,GAAAkB,KAAA;MAC5CV,KAAK,CAACc,IAAI,~~eACNzC~~,KAAA,CAAA4B,aAAA,CAACrB,YAAY;QACTgC,KAAK,EAAEA,KAAM;QACbD,KAAK,EAAEA,KAAM;QACbnB,EAAE,EAAEA,EAAG;QACPU,GAAG,EAAEV,EAAG;QACRqB,KAAK,EAAEA,KAAM;QACb5B,QAAQ,EAAEM,YAAa;QACvBY,UAAU,EAAEd,WAAW,CAACK,QAAQ,CAACF,EAAE,CAAE;QACrCc,KAAK,EAAE5B,qBAAqB,CAACqC,KAAM;QACnC5B,IAAI,EAAEA,IAAK;QACXqB,IAAI,EAAEA;MAAK,CACd,CACL,CAAC;IACL,CAAC,CAAC;IAEF,OAAOR,KAAK;EAChB,CAAC,EAAE,CAACT,YAAY,EAAEL,KAAK,EAAEG,WAAW,EAAEF,IAAI,CAAC,CAAC;EAE5C,OAAOX,OAAO,CAAC,mBAAMH,KAAA,CAAA4B,aAAA,CAACpB,kBAAkB,QAAEkB,UAA+B,CAAC,EAAE,CAACA,UAAU,CAAC,CAAC;AAC7F,CAAC;AAEDjB,aAAa,CAACkC,WAAW,GAAG,eAAe;AAE3C,eAAelC,aAAa","ignoreList":[]}
1	+ {"version":3,"file":"FilterButtons.js","names":["React","useCallback","useEffect","useMemo","useState","FilterButtonItemShape","FilterButtonSize","FilterButton","StyledFilterButton","FilterButtons","_ref","selectedItemIds","onSelect","items","size","Normal","selectedIds","setSelectedIds","handleSelect","id","newIds","includes","filter","filteredId","length","selectedId","reactItems","array","createElement","key","isSelected","Array","isArray","shape","Rectangular","text","forEach","_ref2","icons","color","count","push","Round","displayName"],"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":[]}

package/lib/esm/components/popup/Popup.js CHANGED Viewed

@@ -180,7 +180,7 @@ const Popup = /*#__PURE__*/forwardRef((_ref, ref) => {
     };
   }, [handleDocumentClick, handleHide, isOpen, onHide, onShow]);
   useEffect(() => {
-    setPortal(() => /*#__PURE__*/createPortal( /*#__PURE__*/React.createElement(AnimatePresence, {
+    setPortal(() => /*#__PURE__*/createPortal(/*#__PURE__*/React.createElement(AnimatePresence, {
       initial: false
     }, isOpen && /*#__PURE__*/React.createElement(PopupContentWrapper, {
       width: pseudoSize?.width ?? 0,

package/lib/esm/components/popup/Popup.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Popup.js","names":["getWindowMetrics","AnimatePresence","React","forwardRef","useCallback","useEffect","useImperativeHandle","useRef","useState","createPortal","useUuid","PopupAlignment","AreaContextProvider","PopupContentWrapper","StyledPopup","StyledPopupPseudo","Popup","_ref","ref","content","onShow","container","document","querySelector","body","onHide","children","shouldShowOnHover","shouldUseChildrenWidth","yOffset","coordinates","setCoordinates","x","y","alignment","setAlignment","TopLeft","offset","setOffset","isOpen","setIsOpen","portal","setPortal","menuHeight","setMenuHeight","isMeasuring","setIsMeasuring","pseudoSize","setPseudoSize","timeout","uuid","popupContentRef","popupPseudoContentRef","popupRef","measureHeight","current","height","offsetHeight","width","offsetWidth","handleResize","setTimeout","window","addEventListener","removeEventListener","handleShow","pseudoHeight","pseudoWidth","childrenHeight","left","childrenLeft","top","childrenTop","childrenWidth","getBoundingClientRect","isRight","BottomRight","BottomLeft","newOffset","innerWidth","right","newX","TopRight","handleChildrenClick","handleHide","handleMouseEnter","clearTimeout","handleMouseLeave","handleDocumentClick","event","contains","target","hide","show","then","result","topBarHeight","createElement","initial","key","onMouseLeave","onMouseEnter","shouldChangeColor","Fragment","$menuHeight","onClick","$shouldUseChildrenWidth","displayName"],"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":["getWindowMetrics","AnimatePresence","React","forwardRef","useCallback","useEffect","useImperativeHandle","useRef","useState","createPortal","useUuid","PopupAlignment","AreaContextProvider","PopupContentWrapper","StyledPopup","StyledPopupPseudo","Popup","_ref","ref","content","onShow","container","document","querySelector","body","onHide","children","shouldShowOnHover","shouldUseChildrenWidth","yOffset","coordinates","setCoordinates","x","y","alignment","setAlignment","TopLeft","offset","setOffset","isOpen","setIsOpen","portal","setPortal","menuHeight","setMenuHeight","isMeasuring","setIsMeasuring","pseudoSize","setPseudoSize","timeout","uuid","popupContentRef","popupPseudoContentRef","popupRef","measureHeight","current","height","offsetHeight","width","offsetWidth","handleResize","setTimeout","window","addEventListener","removeEventListener","handleShow","pseudoHeight","pseudoWidth","childrenHeight","left","childrenLeft","top","childrenTop","childrenWidth","getBoundingClientRect","isRight","BottomRight","BottomLeft","newOffset","innerWidth","right","newX","TopRight","handleChildrenClick","handleHide","handleMouseEnter","clearTimeout","handleMouseLeave","handleDocumentClick","event","contains","target","hide","show","then","result","topBarHeight","createElement","initial","key","onMouseLeave","onMouseEnter","shouldChangeColor","Fragment","$menuHeight","onClick","$shouldUseChildrenWidth","displayName"],"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":[]}

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

@@ -236,7 +236,7 @@ const SearchBox = /*#__PURE__*/forwardRef((_ref, ref) => {
         if (selectedItem) {
           setValue(selectedItem.text);
           if (selectedItem.imageUrl) {
-            setSelectedImage( /*#__PURE__*/React.createElement(StyledSearchBoxItemImage, {
+            setSelectedImage(/*#__PURE__*/React.createElement(StyledSearchBoxItemImage, {
               src: selectedItem.imageUrl,
               $shouldShowRoundImage: shouldShowRoundImage
             }));
@@ -451,7 +451,7 @@ const SearchBox = /*#__PURE__*/forwardRef((_ref, ref) => {
           return;
         }
         if (index !== 0) {
-          items.push( /*#__PURE__*/React.createElement(GroupName, {
+          items.push(/*#__PURE__*/React.createElement(GroupName, {
             key: groupName,
             name: groupName ?? ''
           }));
@@ -463,7 +463,7 @@ const SearchBox = /*#__PURE__*/forwardRef((_ref, ref) => {
           text,
           imageUrl
         } = _ref16;
-        items.push( /*#__PURE__*/React.createElement(SearchBoxItem, {
+        items.push(/*#__PURE__*/React.createElement(SearchBoxItem, {
           key: `${id}_${groupName ?? ''}`,
           id: id,
           text: text,
@@ -475,7 +475,7 @@ const SearchBox = /*#__PURE__*/forwardRef((_ref, ref) => {
       });
     });
     if (shouldAddInputToList && inputToListValue !== '') {
-      items.push( /*#__PURE__*/React.createElement(SearchBoxItem, {
+      items.push(/*#__PURE__*/React.createElement(SearchBoxItem, {
         id: "input-value",
         onSelect: handleSelect,
         text: `<b>${inputToListValue}</b`
@@ -558,7 +558,7 @@ const SearchBox = /*#__PURE__*/forwardRef((_ref, ref) => {
     };
   }, [handleKeyPress]);
   useEffect(() => {
-    setPortal(() => /*#__PURE__*/createPortal( /*#__PURE__*/React.createElement(AnimatePresence, {
+    setPortal(() => /*#__PURE__*/createPortal(/*#__PURE__*/React.createElement(AnimatePresence, {
       initial: false
     }, isAnimating && /*#__PURE__*/React.createElement(SearchBoxBody, {
       filterbuttons: filterbuttons,