npm - @chayns-components/core - Versions diffs - 5.0.0-beta.890 → 5.0.0-beta.892 - Mend

@chayns-components/core 5.0.0-beta.890 → 5.0.0-beta.892

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 (38) hide show

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

	@@ -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","coordinates","isInDialog","items","onHide","onShow","shouldCloseOnPopupClick","ref","internalCoordinates","setInternalCoordinates","useState","x","y","newContainer","setNewContainer","internalAlignment","setInternalAlignment","ContextMenuAlignment","TopLeft","isContentShown","setIsContentShown","portal","setPortal","uuid","useUuid","contextMenuContentRef","useRef","contextMenuRef","useEffect","current","el","element","closest","handleHide","useCallback","handleShow","isTouch","getIsTouch","result","createDialog","type","DialogType","SELECT","buttons","list","map","text","index","name","id","icon","open","_items$result$","onClick","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","document","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,\n coordinates,\n isInDialog = false,\n items,\n onHide,\n onShow,\n shouldCloseOnPopupClick = true,\n },\n ref,\n ) => {\n const [internalCoordinates, setInternalCoordinates] = useState<ContextMenuCoordinates>({\n x: 0,\n y: 0,\n });\n const [newContainer, setNewContainer] = useState<Element \| null>(container ?? null);\n\n const [internalAlignment, setInternalAlignment] = useState<ContextMenuAlignment>(\n ContextMenuAlignment.TopLeft,\n );\n\n const [isContentShown, setIsContentShown] = useState(false);\n const [portal, setPortal] = useState<ReactPortal>();\n\n const uuid = useUuid();\n\n // ToDo: Replace with hook if new chayns api is ready\n const contextMenuContentRef = useRef<HTMLDivElement>(null);\n const contextMenuRef = useRef<HTMLSpanElement>(null);\n\n useEffect(() => {\n if (contextMenuRef.current && !container) {\n const el = contextMenuRef.current as HTMLElement;\n\n const element =\n el.closest('.dialog-inner') \|\|\n el.closest('.page-provider') \|\|\n el.closest('.tapp') \|\|\n el.closest('body');\n\n setNewContainer(element);\n }\n }, [container]);\n\n const handleHide = useCallback(() => {\n setIsContentShown(false);\n }, []);\n\n const handleShow = useCallback(async () => {\n const isTouch = getIsTouch();\n\n if (isTouch) {\n const { result } = (await createDialog({\n type: DialogType.SELECT,\n buttons: [],\n list: items.map(({ icons, text }, index) => ({\n name: text,\n id: index,\n icon: icons[0],\n })),\n }).open()) as SelectDialogResult;\n\n if (result && typeof result[0] === 'number') {\n void items[result[0]]?.onClick();\n }\n } else if (contextMenuRef.current) {\n if (!newContainer) {\n return;\n }\n\n const {\n height: childrenHeight,\n left: childrenLeft,\n top: childrenTop,\n width: childrenWidth,\n } = contextMenuRef.current.getBoundingClientRect();\n\n const { height, width, top, left } = newContainer.getBoundingClientRect();\n\n const x =\n childrenLeft + (isInDialog ? 0 : window.scrollX) + childrenWidth / 2 - left;\n const y =\n childrenTop + (isInDialog ? 0 : window.scrollY) + childrenHeight / 2 - top;\n\n setInternalCoordinates({ x, y });\n\n if (x < width / 2) {\n if (y < height / 2) {\n setInternalAlignment(ContextMenuAlignment.BottomRight);\n } else {\n setInternalAlignment(ContextMenuAlignment.TopRight);\n }\n } else if (y < height / 2) {\n setInternalAlignment(ContextMenuAlignment.BottomLeft);\n } else {\n setInternalAlignment(ContextMenuAlignment.TopLeft);\n }\n\n setIsContentShown(true);\n }\n }, [isInDialog, items, newContainer]);\n\n const handleClick = useCallback<MouseEventHandler<HTMLDivElement>>(\n (event) => {\n event.preventDefault();\n event.stopPropagation();\n\n void handleShow();\n },\n [handleShow],\n );\n\n const handleDocumentClick = useCallback<EventListener>(\n (event) => {\n if (\n !shouldCloseOnPopupClick &&\n contextMenuContentRef.current?.contains(event.target as Node)\n ) {\n return;\n }\n\n handleHide();\n },\n [handleHide, shouldCloseOnPopupClick],\n );\n\n useImperativeHandle(\n ref,\n () => ({\n hide: handleHide,\n show: handleShow,\n }),\n [handleHide, handleShow],\n );\n\n useEffect(() => {\n if (isContentShown) {\n document.addEventListener('click', handleDocumentClick, true);\n window.addEventListener('blur', handleHide);\n\n if (typeof onShow === 'function') {\n onShow();\n }\n } else if (typeof onHide === 'function') {\n onHide();\n }\n\n return () => {\n document.removeEventListener('click', handleDocumentClick, true);\n window.removeEventListener('blur', handleHide);\n };\n }, [handleDocumentClick, handleHide, isContentShown, onHide, onShow]);\n\n useEffect(() => {\n if (!newContainer) {\n return;\n }\n\n setPortal(() =>\n createPortal(\n <AnimatePresence initial={false}>\n {isContentShown && (\n <ContextMenuContent\n coordinates={coordinates ?? internalCoordinates}\n items={items}\n key={`contextMenu_${uuid}`}\n alignment={alignment ?? internalAlignment}\n ref={contextMenuContentRef}\n />\n )}\n </AnimatePresence>,\n newContainer,\n ),\n );\n }, [\n alignment,\n newContainer,\n coordinates,\n internalAlignment,\n internalCoordinates,\n isContentShown,\n items,\n uuid,\n ]);\n\n return (\n <>\n <StyledContextMenu\n className=\"beta-chayns-context-menu\"\n onClick={handleClick}\n ref={contextMenuRef}\n >\n {children}\n </StyledContextMenu>\n {portal}\n </>\n );\n },\n);\n\nContextMenu.displayName = 'ContextMenu';\n\nexport default ContextMenu;\n"],"mappings":"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","ignoreList":[]}

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

@@ -19,7 +19,7 @@ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e;
 const Popup = /*#__PURE__*/(0, _react.forwardRef)(({
   content,
   onShow,
-  container = document.querySelector('.page-provider') || document.querySelector('.tapp') || document.body,
+  container,
   onHide,
   children,
   shouldShowOnHover = false,
@@ -37,6 +37,7 @@ const Popup = /*#__PURE__*/(0, _react.forwardRef)(({
   const [menuHeight, setMenuHeight] = (0, _react.useState)(0);
   const [isMeasuring, setIsMeasuring] = (0, _react.useState)(true);
   const [pseudoSize, setPseudoSize] = (0, _react.useState)();
+  const [newContainer, setNewContainer] = (0, _react.useState)(container ?? null);
   const timeout = (0, _react.useRef)();
   const uuid = (0, _uuid.useUuid)();
@@ -45,6 +46,13 @@ const Popup = /*#__PURE__*/(0, _react.forwardRef)(({
   const popupContentRef = (0, _react.useRef)(null);
   const popupPseudoContentRef = (0, _react.useRef)(null);
   const popupRef = (0, _react.useRef)(null);
+  (0, _react.useEffect)(() => {
+    if (popupRef.current && !container) {
+      const el = popupRef.current;
+      const element = el.closest('.dialog-inner') || el.closest('.page-provider') || el.closest('.tapp') || el.closest('body');
+      setNewContainer(element);
+    }
+  }, [container]);
   const measureHeight = () => {
     if (popupPseudoContentRef.current) {
       const height = popupPseudoContentRef.current.offsetHeight;
@@ -189,6 +197,9 @@ const Popup = /*#__PURE__*/(0, _react.forwardRef)(({
     };
   }, [handleDocumentClick, handleHide, isOpen, onHide, onShow]);
   (0, _react.useEffect)(() => {
+    if (!newContainer) {
+      return;
+    }
     setPortal(() => /*#__PURE__*/(0, _reactDom.createPortal)(/*#__PURE__*/_react.default.createElement(_framerMotion.AnimatePresence, {
       initial: false
     }, isOpen && /*#__PURE__*/_react.default.createElement(_PopupContentWrapper.default, {
@@ -202,8 +213,8 @@ const Popup = /*#__PURE__*/(0, _react.forwardRef)(({
       onMouseEnter: handleMouseEnter
     }, /*#__PURE__*/_react.default.createElement(_AreaContextProvider.default, {
       shouldChangeColor: false
-    }, content))), container));
-  }, [alignment, container, content, coordinates, handleMouseEnter, handleMouseLeave, isOpen, offset, pseudoSize === null || pseudoSize === void 0 ? void 0 : pseudoSize.width, uuid]);
+    }, content))), newContainer));
+  }, [alignment, newContainer, content, coordinates, handleMouseEnter, handleMouseLeave, isOpen, offset, pseudoSize === null || pseudoSize === void 0 ? void 0 : pseudoSize.width, uuid]);
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, isMeasuring && /*#__PURE__*/_react.default.createElement(_Popup.StyledPopupPseudo, {
     ref: popupPseudoContentRef,
     $menuHeight: menuHeight

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

	@@ -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","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","newContainer","setNewContainer","timeout","useRef","uuid","useUuid","popupContentRef","popupPseudoContentRef","popupRef","useEffect","current","el","element","closest","measureHeight","height","offsetHeight","width","offsetWidth","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","document","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,\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 const [newContainer, setNewContainer] = useState<Element \| null>(container ?? null);\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 useEffect(() => {\n if (popupRef.current && !container) {\n const el = popupRef.current as HTMLElement;\n\n const element =\n el.closest('.dialog-inner') \|\|\n el.closest('.page-provider') \|\|\n el.closest('.tapp') \|\|\n el.closest('body');\n\n setNewContainer(element);\n }\n }, [container]);\n\n const 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 if (!newContainer) {\n return;\n }\n\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 newContainer,\n ),\n );\n }, [\n alignment,\n newContainer,\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/cjs/components/scroll-view/ScrollView.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ScrollView.js","names":["_chaynsApi","require","_react","_interopRequireWildcard","_ScrollView","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ScrollView","forwardRef","maxHeight","height","maxWidth","width","children","overflowX","overflowY","ref","browser","getDevice","useMemo","createElement","StyledScrollView","$browser","name","$maxHeight","$height","$maxWidth","$width","$overflowX","$overflowY","displayName","_default","exports"],"sources":["../../../../src/components/scroll-view/ScrollView.tsx"],"sourcesContent":["import { getDevice } from 'chayns-api';\nimport React, { CSSProperties, forwardRef, ReactNode, useMemo } from 'react';\nimport { StyledScrollView } from './ScrollView.styles';\n\nexport type ScrollViewProps = {\n /*\n The elements that should be shown inside the scrollview\n /\n children: ReactNode;\n /\n The maximum height of the scroll view.\n /\n maxHeight?: CSSProperties['height'];\n /\n The height of the scroll view.\n /\n height?: CSSProperties['height'];\n /\n The maximum width of the scroll view.\n /\n maxWidth?: CSSProperties['width'];\n /\n The width of the scroll view.\n /\n width?: CSSProperties['width'];\n /\n The overflow-x style of the scroll view.\n /\n overflowX?: 'scroll' \| 'auto';\n /\n The overflow-y style of the scroll view.\n */\n overflowY?: 'scroll' \| 'auto';\n};\n\nconst ScrollView = forwardRef<HTMLDivElement, ScrollViewProps>(\n ({ maxHeight = 300, height, maxWidth, width, children, overflowX = 'auto', overflowY = 'auto' }, ref) => {\n const { browser } = getDevice();\n\n return useMemo(\n () => (\n <StyledScrollView\n $browser={browser?.name}\n $maxHeight={maxHeight}\n $height={height}\n $maxWidth={maxWidth}\n $width={width}\n $overflowX={overflowX}\n $overflowY={overflowY}\n ref={ref}\n >\n {children}\n </StyledScrollView>\n ),\n [browser?.name, children, height, maxHeight, maxWidth, overflowX, overflowY, ref, width],\n );\n },\n);\n\nScrollView.displayName = 'ScrollView';\n\nexport default ScrollView;\n"],"mappings":";;;;;;AAAA,IAAAA,UAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAC,uBAAA,CAAAF,OAAA;AACA,IAAAG,WAAA,GAAAH,OAAA;AAAuD,SAAAI,yBAAAC,CAAA,6BAAAC,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,CAAAC,CAAA,WAAAA,CAAA,GAAAG,CAAA,GAAAD,CAAA,KAAAF,CAAA;AAAA,SAAAH,wBAAAG,CAAA,EAAAE,CAAA,SAAAA,CAAA,IAAAF,CAAA,IAAAA,CAAA,CAAAI,UAAA,SAAAJ,CAAA,eAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,WAAAK,OAAA,EAAAL,CAAA,QAAAG,CAAA,GAAAJ,wBAAA,CAAAG,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAG,GAAA,CAAAN,CAAA,UAAAG,CAAA,CAAAI,GAAA,CAAAP,CAAA,OAAAQ,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAd,CAAA,oBAAAc,CAAA,OAAAC,cAAA,CAAAC,IAAA,CAAAhB,CAAA,EAAAc,CAAA,SAAAG,CAAA,GAAAP,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAb,CAAA,EAAAc,CAAA,UAAAG,CAAA,KAAAA,CAAA,CAAAV,GAAA,IAAAU,CAAA,CAAAC,GAAA,IAAAP,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAG,CAAA,IAAAT,CAAA,CAAAM,CAAA,IAAAd,CAAA,CAAAc,CAAA,YAAAN,CAAA,CAAAH,OAAA,GAAAL,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAe,GAAA,CAAAlB,CAAA,EAAAQ,CAAA,GAAAA,CAAA;AAiCvD,MAAMW,UAAU,gBAAG,IAAAC,iBAAU,EACzB,~~CAAC~~;~~EAAEC~~,SAAS,GAAG,GAAG;~~EAAEC~~,MAAM;~~EAAEC~~,QAAQ;~~EAAEC~~,KAAK;~~EAAEC~~,QAAQ;~~EAAEC~~,SAAS,GAAG,MAAM;~~EAAEC~~,SAAS,GAAG;~~AAAO~~,CAAC,~~EAAEC~~,GAAG,~~KAAK~~;~~EACrG~~,MAAM;IAAEC;EAAQ,CAAC,GAAG,IAAAC,oBAAS,EAAC,CAAC;EAE/B,OAAO,IAAAC,cAAO,EACV,mBACInC,MAAA,CAAAS,OAAA,CAAA2B,aAAA,CAAClC,WAAA,CAAAmC,gBAAgB;IACbC,QAAQ,EAAEL,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEM,IAAK;IACxBC,UAAU,EAAEf,SAAU;IACtBgB,OAAO,EAAEf,MAAO;IAChBgB,SAAS,EAAEf,QAAS;IACpBgB,MAAM,EAAEf,KAAM;IACdgB,UAAU,EAAEd,SAAU;IACtBe,UAAU,EAAEd,SAAU;IACtBC,GAAG,EAAEA;EAAI,GAERH,QACa,CACrB,EACD,~~CAACI~~,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEM,IAAI,~~EAAEV~~,QAAQ,~~EAAEH~~,MAAM,~~EAAED~~,SAAS,~~EAAEE~~,QAAQ,~~EAAEG~~,SAAS,~~EAAEC~~,SAAS,~~EAAEC~~,GAAG,~~EAAEJ~~,KAAK,~~CAC3F~~,CAAC;AACL,CACJ,CAAC;AAEDL,UAAU,CAACuB,WAAW,GAAG,YAAY;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAvC,OAAA,GAEvBc,UAAU","ignoreList":[]}
1	+ {"version":3,"file":"ScrollView.js","names":["_chaynsApi","require","_react","_interopRequireWildcard","_ScrollView","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ScrollView","forwardRef","maxHeight","height","maxWidth","width","children","overflowX","overflowY","ref","browser","getDevice","useMemo","createElement","StyledScrollView","$browser","name","$maxHeight","$height","$maxWidth","$width","$overflowX","$overflowY","displayName","_default","exports"],"sources":["../../../../src/components/scroll-view/ScrollView.tsx"],"sourcesContent":["import { getDevice } from 'chayns-api';\nimport React, { CSSProperties, forwardRef, ReactNode, useMemo } from 'react';\nimport { StyledScrollView } from './ScrollView.styles';\n\nexport type ScrollViewProps = {\n /*\n The elements that should be shown inside the scrollview\n /\n children: ReactNode;\n /\n The maximum height of the scroll view.\n /\n maxHeight?: CSSProperties['height'] \| null;\n /\n The height of the scroll view.\n /\n height?: CSSProperties['height'];\n /\n The maximum width of the scroll view.\n /\n maxWidth?: CSSProperties['width'];\n /\n The width of the scroll view.\n /\n width?: CSSProperties['width'];\n /\n The overflow-x style of the scroll view.\n /\n overflowX?: 'scroll' \| 'auto';\n /\n The overflow-y style of the scroll view.\n */\n overflowY?: 'scroll' \| 'auto';\n};\n\nconst ScrollView = forwardRef<HTMLDivElement, ScrollViewProps>(\n (\n {\n maxHeight = 300,\n height,\n maxWidth,\n width,\n children,\n overflowX = 'auto',\n overflowY = 'auto',\n },\n ref,\n ) => {\n const { browser } = getDevice();\n\n return useMemo(\n () => (\n <StyledScrollView\n $browser={browser?.name}\n $maxHeight={maxHeight}\n $height={height}\n $maxWidth={maxWidth}\n $width={width}\n $overflowX={overflowX}\n $overflowY={overflowY}\n ref={ref}\n >\n {children}\n </StyledScrollView>\n ),\n [\n browser?.name,\n children,\n height,\n maxHeight,\n maxWidth,\n overflowX,\n overflowY,\n ref,\n width,\n ],\n );\n },\n);\n\nScrollView.displayName = 'ScrollView';\n\nexport default ScrollView;\n"],"mappings":";;;;;;AAAA,IAAAA,UAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAC,uBAAA,CAAAF,OAAA;AACA,IAAAG,WAAA,GAAAH,OAAA;AAAuD,SAAAI,yBAAAC,CAAA,6BAAAC,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,CAAAC,CAAA,WAAAA,CAAA,GAAAG,CAAA,GAAAD,CAAA,KAAAF,CAAA;AAAA,SAAAH,wBAAAG,CAAA,EAAAE,CAAA,SAAAA,CAAA,IAAAF,CAAA,IAAAA,CAAA,CAAAI,UAAA,SAAAJ,CAAA,eAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,WAAAK,OAAA,EAAAL,CAAA,QAAAG,CAAA,GAAAJ,wBAAA,CAAAG,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAG,GAAA,CAAAN,CAAA,UAAAG,CAAA,CAAAI,GAAA,CAAAP,CAAA,OAAAQ,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAd,CAAA,oBAAAc,CAAA,OAAAC,cAAA,CAAAC,IAAA,CAAAhB,CAAA,EAAAc,CAAA,SAAAG,CAAA,GAAAP,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAb,CAAA,EAAAc,CAAA,UAAAG,CAAA,KAAAA,CAAA,CAAAV,GAAA,IAAAU,CAAA,CAAAC,GAAA,IAAAP,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAG,CAAA,IAAAT,CAAA,CAAAM,CAAA,IAAAd,CAAA,CAAAc,CAAA,YAAAN,CAAA,CAAAH,OAAA,GAAAL,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAe,GAAA,CAAAlB,CAAA,EAAAQ,CAAA,GAAAA,CAAA;AAiCvD,MAAMW,UAAU,gBAAG,IAAAC,iBAAU,EACzB,CACI;EACIC,SAAS,GAAG,GAAG;EACfC,MAAM;EACNC,QAAQ;EACRC,KAAK;EACLC,QAAQ;EACRC,SAAS,GAAG,MAAM;EAClBC,SAAS,GAAG;AAChB,CAAC,EACDC,GAAG,KACF;EACD,MAAM;IAAEC;EAAQ,CAAC,GAAG,IAAAC,oBAAS,EAAC,CAAC;EAE/B,OAAO,IAAAC,cAAO,EACV,mBACInC,MAAA,CAAAS,OAAA,CAAA2B,aAAA,CAAClC,WAAA,CAAAmC,gBAAgB;IACbC,QAAQ,EAAEL,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEM,IAAK;IACxBC,UAAU,EAAEf,SAAU;IACtBgB,OAAO,EAAEf,MAAO;IAChBgB,SAAS,EAAEf,QAAS;IACpBgB,MAAM,EAAEf,KAAM;IACdgB,UAAU,EAAEd,SAAU;IACtBe,UAAU,EAAEd,SAAU;IACtBC,GAAG,EAAEA;EAAI,GAERH,QACa,CACrB,EACD,CACII,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEM,IAAI,EACbV,QAAQ,EACRH,MAAM,EACND,SAAS,EACTE,QAAQ,EACRG,SAAS,EACTC,SAAS,EACTC,GAAG,EACHJ,KAAK,CAEb,CAAC;AACL,CACJ,CAAC;AAEDL,UAAU,CAACuB,WAAW,GAAG,YAAY;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAvC,OAAA,GAEvBc,UAAU","ignoreList":[]}

package/lib/cjs/components/scroll-view/ScrollView.styles.js CHANGED Viewed

@@ -30,10 +30,14 @@ const StyledScrollView = exports.StyledScrollView = _styledComponents.default.di
         `}
     ${({
   $overflowX
-}) => (0, _styledComponents.css)`overflow-x: ${$overflowX};`}
+}) => (0, _styledComponents.css)`
+        overflow-x: ${$overflowX};
+    `}
     ${({
   $overflowY
-}) => (0, _styledComponents.css)`overflow-y: ${$overflowY};`}
+}) => (0, _styledComponents.css)`
+        overflow-y: ${$overflowY};
+    `}
     // Styles for custom scrollbar
     ${({
@@ -45,7 +49,7 @@ const StyledScrollView = exports.StyledScrollView = _styledComponents.default.di
               ` : (0, _styledComponents.css)`
                   &::-webkit-scrollbar {
                       width: 10px;
-                      height: 10px
+                      height: 10px;
                   }
                   &::-webkit-scrollbar-track {
@@ -64,7 +68,7 @@ const StyledScrollView = exports.StyledScrollView = _styledComponents.default.di
                       background-clip: padding-box;
                       border: solid 3px transparent;
                   }
                   &::-webkit-scrollbar-corner {
                       background-color: transparent;
                   }

package/lib/cjs/components/scroll-view/ScrollView.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ScrollView.styles.js","names":["_styledComponents","_interopRequireWildcard","require","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","StyledScrollView","exports","styled","div","$maxHeight","css","$height","$maxWidth","$width","$overflowX","$overflowY","$browser","theme"],"sources":["../../../../src/components/scroll-view/ScrollView.styles.ts"],"sourcesContent":["import type { Browser } from 'detect-browser';\nimport type { CSSProperties } from 'react';\nimport styled, { css } from 'styled-components';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledScrollViewProps = WithTheme<{\n $maxHeight?: CSSProperties['height'];\n $height?: CSSProperties['height'];\n $maxWidth?: CSSProperties['width'];\n $width?: CSSProperties['width'];\n $overflowX: 'scroll' \| 'auto';\n $overflowY: 'scroll' \| 'auto';\n $browser: Browser \| 'bot' \| null \| undefined;\n}>;\n\nexport const StyledScrollView = styled.div<StyledScrollViewProps>`\n ${({ $maxHeight }) =>\n $maxHeight &&\n css`\n max-height: ${typeof $maxHeight === 'number' ? `${$maxHeight}px` : $maxHeight};\n `}\n ${({ $height }) =>\n $height &&\n css`\n height: ${typeof $height === 'number' ? `${$height}px` : $height};\n `} \n ${({ $maxWidth }) =>\n $maxWidth &&\n css`\n max-width: ${typeof $maxWidth === 'number' ? `${$maxWidth}px` : $maxWidth};\n `} \n ${({ $width }) =>\n $width &&\n css`\n width: ${typeof $width === 'number' ? `${$width}px` : $width};\n `} \n ${({ $overflowX }) => css`overflow-x: ${$overflowX};`}\n ${({ $overflowY }) => css`overflow-y: ${$overflowY};`}\n\n // Styles for custom scrollbar\n ${({ $browser, theme }: StyledScrollViewProps) =>\n $browser === 'firefox'\n ? css`\n scrollbar-color: rgba(${theme['text-rgb']}, 0.15) transparent;\n scrollbar-width: thin;\n `\n : css`\n &::-webkit-scrollbar {\n width: 10px;\n height: 10px\n }\n\n &::-webkit-scrollbar-track {\n background-color: transparent;\n }\n\n &::-webkit-scrollbar-button {\n background-color: transparent;\n height: 5px;\n width: 5px;\n }\n\n &::-webkit-scrollbar-thumb {\n background-color: rgba(${theme['text-rgb']}, 0.15);\n border-radius: 20px;\n background-clip: padding-box;\n border: solid 3px transparent;\n }\n \n &::-webkit-scrollbar-corner {\n background-color: transparent;\n }\n `}\n`;\n"],"mappings":";;;;;;AAEA,IAAAA,iBAAA,GAAAC,uBAAA,CAAAC,OAAA;AAAgD,SAAAC,yBAAAC,CAAA,6BAAAC,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,CAAAC,CAAA,WAAAA,CAAA,GAAAG,CAAA,GAAAD,CAAA,KAAAF,CAAA;AAAA,SAAAH,wBAAAG,CAAA,EAAAE,CAAA,SAAAA,CAAA,IAAAF,CAAA,IAAAA,CAAA,CAAAI,UAAA,SAAAJ,CAAA,eAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,WAAAK,OAAA,EAAAL,CAAA,QAAAG,CAAA,GAAAJ,wBAAA,CAAAG,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAG,GAAA,CAAAN,CAAA,UAAAG,CAAA,CAAAI,GAAA,CAAAP,CAAA,OAAAQ,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAd,CAAA,oBAAAc,CAAA,OAAAC,cAAA,CAAAC,IAAA,CAAAhB,CAAA,EAAAc,CAAA,SAAAG,CAAA,GAAAP,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAb,CAAA,EAAAc,CAAA,UAAAG,CAAA,KAAAA,CAAA,CAAAV,GAAA,IAAAU,CAAA,CAAAC,GAAA,IAAAP,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAG,CAAA,IAAAT,CAAA,CAAAM,CAAA,IAAAd,CAAA,CAAAc,CAAA,YAAAN,CAAA,CAAAH,OAAA,GAAAL,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAe,GAAA,CAAAlB,CAAA,EAAAQ,CAAA,GAAAA,CAAA;AAazC,MAAMW,gBAAgB,GAAAC,OAAA,CAAAD,gBAAA,GAAGE,yBAAM,CAACC,GAA0B;AACjE,MAAM,CAAC;EAAEC;AAAW,CAAC,KACbA,UAAU,IACV,IAAAC,qBAAG;AACX,0BAA0B,OAAOD,UAAU,KAAK,QAAQ,GAAG,GAAGA,UAAU,IAAI,GAAGA,UAAU;AACzF,SAAS;AACT,MAAM,CAAC;EAAEE;AAAQ,CAAC,KACVA,OAAO,IACP,IAAAD,qBAAG;AACX,sBAAsB,OAAOC,OAAO,KAAK,QAAQ,GAAG,GAAGA,OAAO,IAAI,GAAGA,OAAO;AAC5E,SAAS;AACT,MAAM,CAAC;EAAEC;AAAU,CAAC,KACZA,SAAS,IACT,IAAAF,qBAAG;AACX,yBAAyB,OAAOE,SAAS,KAAK,QAAQ,GAAG,GAAGA,SAAS,IAAI,GAAGA,SAAS;AACrF,SAAS;AACT,MAAM,CAAC;EAAEC;AAAO,CAAC,KACTA,MAAM,IACN,IAAAH,qBAAG;AACX,qBAAqB,OAAOG,MAAM,KAAK,QAAQ,GAAG,GAAGA,MAAM,IAAI,GAAGA,MAAM;AACxE,SAAS;AACT,MAAM,CAAC;EAAEC;AAAW,CAAC,KAAK,IAAAJ,qBAAG,~~gBAAeI~~,UAAU,~~GAAG~~;~~AACzD~~,MAAM,CAAC;EAAEC;AAAW,CAAC,KAAK,IAAAL,qBAAG,~~gBAAeK~~,UAAU,~~GAAG~~;~~AACzD~~;AACA;AACA,MAAM,CAAC;EAAEC,QAAQ;EAAEC;AAA6B,CAAC,KACzCD,QAAQ,KAAK,SAAS,GAChB,IAAAN,qBAAG;AACjB,0CAA0CO,KAAK,CAAC,UAAU,CAAC;AAC3D;AACA,eAAe,GACD,IAAAP,qBAAG;AACjB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,+CAA+CO,KAAK,CAAC,UAAU,CAAC;AAChE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,eAAe;AACf,CAAC","ignoreList":[]}
1	+ {"version":3,"file":"ScrollView.styles.js","names":["_styledComponents","_interopRequireWildcard","require","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","StyledScrollView","exports","styled","div","$maxHeight","css","$height","$maxWidth","$width","$overflowX","$overflowY","$browser","theme"],"sources":["../../../../src/components/scroll-view/ScrollView.styles.ts"],"sourcesContent":["import type { Browser } from 'detect-browser';\nimport type { CSSProperties } from 'react';\nimport styled, { css } from 'styled-components';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledScrollViewProps = WithTheme<{\n $maxHeight?: CSSProperties['height'] \| null;\n $height?: CSSProperties['height'];\n $maxWidth?: CSSProperties['width'];\n $width?: CSSProperties['width'];\n $overflowX: 'scroll' \| 'auto';\n $overflowY: 'scroll' \| 'auto';\n $browser: Browser \| 'bot' \| null \| undefined;\n}>;\n\nexport const StyledScrollView = styled.div<StyledScrollViewProps>`\n ${({ $maxHeight }) =>\n $maxHeight &&\n css`\n max-height: ${typeof $maxHeight === 'number' ? `${$maxHeight}px` : $maxHeight};\n `}\n ${({ $height }) =>\n $height &&\n css`\n height: ${typeof $height === 'number' ? `${$height}px` : $height};\n `} \n ${({ $maxWidth }) =>\n $maxWidth &&\n css`\n max-width: ${typeof $maxWidth === 'number' ? `${$maxWidth}px` : $maxWidth};\n `} \n ${({ $width }) =>\n $width &&\n css`\n width: ${typeof $width === 'number' ? `${$width}px` : $width};\n `} \n ${({ $overflowX }) => css`\n overflow-x: ${$overflowX};\n `}\n ${({ $overflowY }) => css`\n overflow-y: ${$overflowY};\n `}\n\n // Styles for custom scrollbar\n ${({ $browser, theme }: StyledScrollViewProps) =>\n $browser === 'firefox'\n ? css`\n scrollbar-color: rgba(${theme['text-rgb']}, 0.15) transparent;\n scrollbar-width: thin;\n `\n : css`\n &::-webkit-scrollbar {\n width: 10px;\n height: 10px;\n }\n\n &::-webkit-scrollbar-track {\n background-color: transparent;\n }\n\n &::-webkit-scrollbar-button {\n background-color: transparent;\n height: 5px;\n width: 5px;\n }\n\n &::-webkit-scrollbar-thumb {\n background-color: rgba(${theme['text-rgb']}, 0.15);\n border-radius: 20px;\n background-clip: padding-box;\n border: solid 3px transparent;\n }\n\n &::-webkit-scrollbar-corner {\n background-color: transparent;\n }\n `}\n`;\n"],"mappings":"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","ignoreList":[]}

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

@@ -29,7 +29,7 @@ const SearchBox = /*#__PURE__*/(0, _react.forwardRef)(({
   onSelect,
   onKeyDown,
   selectedId,
-  container = document.body,
+  container,
   shouldShowRoundImage,
   shouldShowContentOnEmptyInput = true,
   shouldAddInputToList = true,
@@ -51,6 +51,7 @@ const SearchBox = /*#__PURE__*/(0, _react.forwardRef)(({
     x: 0,
     y: 0
   });
+  const [newContainer, setNewContainer] = (0, _react.useState)(container ?? null);
   const boxRef = (0, _react.useRef)(null);
   const contentRef = (0, _react.useRef)(null);
   const inputRef = (0, _react.useRef)(null);
@@ -58,6 +59,13 @@ const SearchBox = /*#__PURE__*/(0, _react.forwardRef)(({
   const {
     browser
   } = (0, _chaynsApi.getDevice)();
+  (0, _react.useEffect)(() => {
+    if (boxRef.current && !container) {
+      const el = boxRef.current;
+      const element = el.closest('.dialog-inner') || el.closest('body');
+      setNewContainer(element);
+    }
+  }, [container]);
   (0, _react.useEffect)(() => {
     if (boxRef.current) {
       const {
@@ -546,6 +554,9 @@ const SearchBox = /*#__PURE__*/(0, _react.forwardRef)(({
     };
   }, [handleKeyPress]);
   (0, _react.useEffect)(() => {
+    if (!newContainer) {
+      return;
+    }
     setPortal(() => /*#__PURE__*/(0, _reactDom.createPortal)(/*#__PURE__*/_react.default.createElement(_framerMotion.AnimatePresence, {
       initial: false
     }, isAnimating && /*#__PURE__*/_react.default.createElement(_SearchBoxBody.default, {
@@ -557,8 +568,8 @@ const SearchBox = /*#__PURE__*/(0, _react.forwardRef)(({
       height: height,
       ref: contentRef,
       onGroupSelect: handleFilterButtonsGroupSelect
-    }, content)), container));
-  }, [browser === null || browser === void 0 ? void 0 : browser.name, container, content, filterbuttons, groups, height, internalCoordinates, isAnimating, width]);
+    }, content)), newContainer));
+  }, [browser === null || browser === void 0 ? void 0 : browser.name, newContainer, content, filterbuttons, groups, height, internalCoordinates, isAnimating, width]);
   return (0, _react.useMemo)(() => /*#__PURE__*/_react.default.createElement(_SearchBox.StyledSearchBox, {
     ref: boxRef
   }, /*#__PURE__*/_react.default.createElement("div", {