@chayns-components/core 5.0.0-beta.796 → 5.0.0-beta.798

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

@@ -1 +1 @@
-{"version":3,"file":"Popup.js","names":["getWindowMetrics","AnimatePresence","React","forwardRef","useCallback","useEffect","useImperativeHandle","useLayoutEffect","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","pseudoSize","setPseudoSize","timeout","uuid","popupContentRef","popupPseudoContentRef","popupRef","current","height","width","getBoundingClientRect","resizeObserver","ResizeObserver","entries","observedHeight","contentRect","observedWidth","observe","disconnect","handleShow","pseudoHeight","pseudoWidth","childrenHeight","left","childrenLeft","top","childrenTop","childrenWidth","isRight","BottomRight","BottomLeft","newOffset","window","innerWidth","right","newX","TopRight","handleChildrenClick","handleHide","handleMouseEnter","clearTimeout","handleMouseLeave","setTimeout","handleDocumentClick","event","contains","target","preventDefault","stopPropagation","hide","show","then","result","topBarHeight","addEventListener","removeEventListener","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    useLayoutEffect,\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('.tapp') || 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 [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        useEffect(() => {\n            if (popupPseudoContentRef.current) {\n                const { height, width } = popupPseudoContentRef.current.getBoundingClientRect();\n\n                setPseudoSize({ height, width });\n            }\n        }, []);\n\n        useLayoutEffect(() => {\n            if (popupPseudoContentRef.current) {\n                const resizeObserver = new ResizeObserver((entries) => {\n                    if (entries && entries[0]) {\n                        const observedHeight = entries[0].contentRect.height;\n                        const observedWidth = entries[0].contentRect.width;\n\n                        setPseudoSize({ height: observedHeight, width: observedWidth });\n                    }\n                });\n\n                resizeObserver.observe(popupPseudoContentRef.current);\n\n                return () => {\n                    resizeObserver.disconnect();\n                };\n            }\n\n            return () => {};\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            if (!shouldShowOnHover) {\n                handleShow();\n            }\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 (\n                    !popupContentRef.current?.contains(event.target as Node) &&\n                    !shouldShowOnHover\n                ) {\n                    event.preventDefault();\n                    event.stopPropagation();\n\n                    handleHide();\n                }\n            },\n            [handleHide, shouldShowOnHover],\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                <StyledPopupPseudo ref={popupPseudoContentRef} $menuHeight={menuHeight}>\n                    {content}\n                </StyledPopupPseudo>\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":[]}
+{"version":3,"file":"Popup.js","names":["getWindowMetrics","AnimatePresence","React","forwardRef","useCallback","useEffect","useImperativeHandle","useLayoutEffect","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","pseudoSize","setPseudoSize","timeout","uuid","popupContentRef","popupPseudoContentRef","popupRef","current","height","width","getBoundingClientRect","resizeObserver","ResizeObserver","entries","observedHeight","contentRect","observedWidth","observe","disconnect","handleShow","pseudoHeight","pseudoWidth","childrenHeight","left","childrenLeft","top","childrenTop","childrenWidth","isRight","BottomRight","BottomLeft","newOffset","window","innerWidth","right","newX","TopRight","handleChildrenClick","handleHide","handleMouseEnter","clearTimeout","handleMouseLeave","setTimeout","handleDocumentClick","event","contains","target","preventDefault","stopPropagation","hide","show","then","result","topBarHeight","addEventListener","removeEventListener","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    useLayoutEffect,\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') || 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 [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        useEffect(() => {\n            if (popupPseudoContentRef.current) {\n                const { height, width } = popupPseudoContentRef.current.getBoundingClientRect();\n\n                setPseudoSize({ height, width });\n            }\n        }, []);\n\n        useLayoutEffect(() => {\n            if (popupPseudoContentRef.current) {\n                const resizeObserver = new ResizeObserver((entries) => {\n                    if (entries && entries[0]) {\n                        const observedHeight = entries[0].contentRect.height;\n                        const observedWidth = entries[0].contentRect.width;\n\n                        setPseudoSize({ height: observedHeight, width: observedWidth });\n                    }\n                });\n\n                resizeObserver.observe(popupPseudoContentRef.current);\n\n                return () => {\n                    resizeObserver.disconnect();\n                };\n            }\n\n            return () => {};\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            if (!shouldShowOnHover) {\n                handleShow();\n            }\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 (\n                    !popupContentRef.current?.contains(event.target as Node) &&\n                    !shouldShowOnHover\n                ) {\n                    event.preventDefault();\n                    event.stopPropagation();\n\n                    handleHide();\n                }\n            },\n            [handleHide, shouldShowOnHover],\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                <StyledPopupPseudo ref={popupPseudoContentRef} $menuHeight={menuHeight}>\n                    {content}\n                </StyledPopupPseudo>\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/constants/pageProvider.js

@@ -0,0 +1,10 @@
+export const PAGE_BREAKPOINTS = {
+  mobile: 'screen and (max-width: 37.438em)',
+  // less than 600px
+  desktop: 'screen and (min-width: 33.5em)',
+  // more than 600px; could:  and (max-width: 63.9375em)
+  desk: 'screen and (min-width: 53.125em)',
+  // more than 850px
+  retina: '(-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi), (min-resolution: 2dppx)'
+};
+//# sourceMappingURL=pageProvider.js.map

package/lib/esm/constants/pageProvider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"pageProvider.js","names":["PAGE_BREAKPOINTS","mobile","desktop","desk","retina"],"sources":["../../../src/constants/pageProvider.ts"],"sourcesContent":["export const PAGE_BREAKPOINTS = {\n    mobile: 'screen and (max-width: 37.438em)', // less than 600px\n    desktop: 'screen and (min-width: 33.5em)', // more than 600px; could:  and (max-width: 63.9375em)\n    desk: 'screen and (min-width: 53.125em)', // more than 850px\n    retina: '(-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi), (min-resolution: 2dppx)',\n};\n"],"mappings":"AAAA,OAAO,MAAMA,gBAAgB,GAAG;EAC5BC,MAAM,EAAE,kCAAkC;EAAE;EAC5CC,OAAO,EAAE,gCAAgC;EAAE;EAC3CC,IAAI,EAAE,kCAAkC;EAAE;EAC1CC,MAAM,EAAE;AACZ,CAAC","ignoreList":[]}

package/lib/esm/index.js

@@ -24,6 +24,7 @@ export { default as ListItemContent } from './components/list/list-item/list-ite
 export { default as ListItem } from './components/list/list-item/ListItem';
 export { default as MentionFinder } from './components/mention-finder/MentionFinder';
 export { default as NumberInput } from './components/number-input/NumberInput';
+export { default as PageProvider } from './components/page-provider/PageProvider';
 export { default as Popup } from './components/popup/Popup';
 export { default as PopupContent } from './components/popup/popup-content/PopupContent';
 export { default as ProgressBar } from './components/progress-bar/ProgressBar';
@@ -54,5 +55,6 @@ export { ClampPosition } from './types/truncation';
 export { getIsTouch } from './utils/environment';
 export { getFileAsArrayBuffer, selectFiles } from './utils/fileDialog';
 export { isTobitEmployee } from './utils/isTobitEmployee';
+export { getUsableHeight } from './utils/pageProvider';
 export { uploadFile } from './utils/uploadFile';
 //# sourceMappingURL=index.js.map

package/lib/esm/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["default","Accordion","AccordionContent","AccordionGroup","AccordionIntro","AccordionItem","AmountControl","AreaContext","AreaProvider","Badge","Button","Checkbox","ColorSchemeProvider","ComboBox","ContentCard","ContextMenu","ExpandableContent","FileInput","FilterButtons","GridImage","Icon","Input","List","ListItemContent","ListItem","MentionFinder","NumberInput","Popup","PopupContent","ProgressBar","RadioButtonGroup","RadioButton","ScrollView","SearchBox","SearchInput","SelectButton","SetupWizardItem","SetupWizard","SharingBar","Signature","SliderButton","Slider","SmallWaitCursor","SmallWaitCursorSize","SmallWaitCursorSpeed","TagInput","TextArea","Tooltip","Truncation","MentionFinderPopupAlignment","useElementSize","ComboBoxDirection","ContentCardType","ContextMenuAlignment","FilterButtonItemShape","FilterButtonSize","ClampPosition","getIsTouch","getFileAsArrayBuffer","selectFiles","isTobitEmployee","uploadFile"],"sources":["../../src/index.ts"],"sourcesContent":["// noinspection JSUnusedGlobalSymbols\nexport { default as Accordion } from './components/accordion/Accordion';\nexport { default as AccordionContent } from './components/accordion/accordion-content/AccordionContent';\nexport { default as AccordionGroup } from './components/accordion/accordion-group/AccordionGroup';\nexport { default as AccordionIntro } from './components/accordion/accordion-intro/AccordionIntro';\nexport { default as AccordionItem } from './components/accordion/accordion-item/AccordionItem';\nexport { default as AmountControl } from './components/amount-control/AmountControl';\nexport {\n    AreaContext,\n    default as AreaProvider,\n} from './components/area-provider/AreaContextProvider';\nexport { default as Badge } from './components/badge/Badge';\nexport { default as Button } from './components/button/Button';\nexport { default as Checkbox } from './components/checkbox/Checkbox';\nexport { default as ColorSchemeProvider } from './components/color-scheme-provider/ColorSchemeProvider';\nexport type {\n    FramerMotionBugFix,\n    WithTheme,\n} from './components/color-scheme-provider/ColorSchemeProvider';\nexport {\n    default as ComboBox,\n    type IComboBoxItem as ComboBoxItem,\n    type IComboBoxItems as ComboBoxItems,\n} from './components/combobox/ComboBox';\nexport { default as ContentCard } from './components/content-card/ContentCard';\nexport { default as ContextMenu, type ContextMenuRef } from './components/context-menu/ContextMenu';\nexport { default as ExpandableContent } from './components/expandable-content/ExpandableContent';\nexport { default as FileInput, type FileInputRef } from './components/file-input/FileInput';\nexport { default as FilterButtons } from './components/filter-buttons/FilterButtons';\nexport { default as GridImage } from './components/grid-image/GridImage';\nexport { default as Icon } from './components/icon/Icon';\nexport { default as Input } from './components/input/Input';\nexport { default as List } from './components/list/List';\nexport { default as ListItemContent } from './components/list/list-item/list-item-content/ListItemContent';\nexport {\n    default as ListItem,\n    type ListItemElements,\n    type ListItemProps,\n} from './components/list/list-item/ListItem';\nexport { default as MentionFinder } from './components/mention-finder/MentionFinder';\nexport type { MentionMember } from './components/mention-finder/MentionFinder';\nexport { default as NumberInput } from './components/number-input/NumberInput';\nexport { default as Popup } from './components/popup/Popup';\nexport { default as PopupContent } from './components/popup/popup-content/PopupContent';\nexport { default as ProgressBar } from './components/progress-bar/ProgressBar';\nexport {\n    default as RadioButtonGroup,\n    type RadioButtonGroupRef,\n} from './components/radio-button/radio-button-group/RadioButtonGroup';\nexport { default as RadioButton } from './components/radio-button/RadioButton';\nexport { default as ScrollView } from './components/scroll-view/ScrollView';\nexport { default as SearchBox } from './components/search-box/SearchBox';\nexport { default as SearchInput } from './components/search-input/SearchInput';\nexport { default as SelectButton } from './components/select-button/SelectButton';\nexport { default as SetupWizardItem } from './components/setup-wizard/setup-wizard-item/SetupWizardItem';\nexport { default as SetupWizard } from './components/setup-wizard/SetupWizard';\nexport type { SetupWizardRef } from './components/setup-wizard/SetupWizard';\nexport { default as SharingBar } from './components/sharing-bar/SharingBar';\nexport { default as Signature } from './components/signature/Signature';\nexport type { SignatureRef } from './components/signature/Signature';\nexport { default as SliderButton } from './components/slider-button/SliderButton';\nexport { default as Slider } from './components/slider/Slider';\nexport {\n    default as SmallWaitCursor,\n    SmallWaitCursorSize,\n    SmallWaitCursorSpeed,\n} from './components/small-wait-cursor/SmallWaitCursor';\nexport { default as TagInput } from './components/tag-input/TagInput';\nexport { default as TextArea } from './components/text-area/TextArea';\nexport { default as Tooltip } from './components/tooltip/Tooltip';\nexport { default as Truncation } from './components/truncation/Truncation';\nexport { MentionFinderPopupAlignment } from './constants/mentionFinder';\nexport { useElementSize } from './hooks/useElementSize';\nexport { ComboBoxDirection } from './types/comboBox';\nexport { ContentCardType } from './types/contentCard';\nexport { ContextMenuAlignment } from './types/contextMenu';\nexport type { FileItem, Image, InternalFileItem, Meta, Video } from './types/file';\nexport type { FileInputFileItem } from './types/fileInput';\nexport { FilterButtonItemShape, FilterButtonSize } from './types/filterButtons';\nexport type { IFilterButtonItem as FilterButtonItem } from './types/filterButtons';\nexport type { IListItemRightElements } from './types/list';\nexport type { PopupRef } from './types/popup';\nexport type { RadioButtonItem } from './types/radioButton';\nexport type {\n    ISearchBoxItem as SearchBoxItem,\n    ISearchBoxItems as SearchBoxItems,\n} from './types/searchBox';\nexport type { SelectButtonItem } from './types/selectButton';\nexport type { SliderButtonItem } from './types/slider-button';\nexport { ClampPosition } from './types/truncation';\nexport { getIsTouch } from './utils/environment';\nexport { getFileAsArrayBuffer, selectFiles } from './utils/fileDialog';\nexport { isTobitEmployee } from './utils/isTobitEmployee';\nexport { uploadFile } from './utils/uploadFile';\n"],"mappings":"AAAA;AACA,SAASA,OAAO,IAAIC,SAAS,QAAQ,kCAAkC;AACvE,SAASD,OAAO,IAAIE,gBAAgB,QAAQ,2DAA2D;AACvG,SAASF,OAAO,IAAIG,cAAc,QAAQ,uDAAuD;AACjG,SAASH,OAAO,IAAII,cAAc,QAAQ,uDAAuD;AACjG,SAASJ,OAAO,IAAIK,aAAa,QAAQ,qDAAqD;AAC9F,SAASL,OAAO,IAAIM,aAAa,QAAQ,2CAA2C;AACpF,SACIC,WAAW,EACXP,OAAO,IAAIQ,YAAY,QACpB,gDAAgD;AACvD,SAASR,OAAO,IAAIS,KAAK,QAAQ,0BAA0B;AAC3D,SAAST,OAAO,IAAIU,MAAM,QAAQ,4BAA4B;AAC9D,SAASV,OAAO,IAAIW,QAAQ,QAAQ,gCAAgC;AACpE,SAASX,OAAO,IAAIY,mBAAmB,QAAQ,wDAAwD;AAKvG,SACIZ,OAAO,IAAIa,QAAQ,QAGhB,gCAAgC;AACvC,SAASb,OAAO,IAAIc,WAAW,QAAQ,uCAAuC;AAC9E,SAASd,OAAO,IAAIe,WAAW,QAA6B,uCAAuC;AACnG,SAASf,OAAO,IAAIgB,iBAAiB,QAAQ,mDAAmD;AAChG,SAAShB,OAAO,IAAIiB,SAAS,QAA2B,mCAAmC;AAC3F,SAASjB,OAAO,IAAIkB,aAAa,QAAQ,2CAA2C;AACpF,SAASlB,OAAO,IAAImB,SAAS,QAAQ,mCAAmC;AACxE,SAASnB,OAAO,IAAIoB,IAAI,QAAQ,wBAAwB;AACxD,SAASpB,OAAO,IAAIqB,KAAK,QAAQ,0BAA0B;AAC3D,SAASrB,OAAO,IAAIsB,IAAI,QAAQ,wBAAwB;AACxD,SAAStB,OAAO,IAAIuB,eAAe,QAAQ,+DAA+D;AAC1G,SACIvB,OAAO,IAAIwB,QAAQ,QAGhB,sCAAsC;AAC7C,SAASxB,OAAO,IAAIyB,aAAa,QAAQ,2CAA2C;AAEpF,SAASzB,OAAO,IAAI0B,WAAW,QAAQ,uCAAuC;AAC9E,SAAS1B,OAAO,IAAI2B,KAAK,QAAQ,0BAA0B;AAC3D,SAAS3B,OAAO,IAAI4B,YAAY,QAAQ,+CAA+C;AACvF,SAAS5B,OAAO,IAAI6B,WAAW,QAAQ,uCAAuC;AAC9E,SACI7B,OAAO,IAAI8B,gBAAgB,QAExB,+DAA+D;AACtE,SAAS9B,OAAO,IAAI+B,WAAW,QAAQ,uCAAuC;AAC9E,SAAS/B,OAAO,IAAIgC,UAAU,QAAQ,qCAAqC;AAC3E,SAAShC,OAAO,IAAIiC,SAAS,QAAQ,mCAAmC;AACxE,SAASjC,OAAO,IAAIkC,WAAW,QAAQ,uCAAuC;AAC9E,SAASlC,OAAO,IAAImC,YAAY,QAAQ,yCAAyC;AACjF,SAASnC,OAAO,IAAIoC,eAAe,QAAQ,6DAA6D;AACxG,SAASpC,OAAO,IAAIqC,WAAW,QAAQ,uCAAuC;AAE9E,SAASrC,OAAO,IAAIsC,UAAU,QAAQ,qCAAqC;AAC3E,SAAStC,OAAO,IAAIuC,SAAS,QAAQ,kCAAkC;AAEvE,SAASvC,OAAO,IAAIwC,YAAY,QAAQ,yCAAyC;AACjF,SAASxC,OAAO,IAAIyC,MAAM,QAAQ,4BAA4B;AAC9D,SACIzC,OAAO,IAAI0C,eAAe,EAC1BC,mBAAmB,EACnBC,oBAAoB,QACjB,gDAAgD;AACvD,SAAS5C,OAAO,IAAI6C,QAAQ,QAAQ,iCAAiC;AACrE,SAAS7C,OAAO,IAAI8C,QAAQ,QAAQ,iCAAiC;AACrE,SAAS9C,OAAO,IAAI+C,OAAO,QAAQ,8BAA8B;AACjE,SAAS/C,OAAO,IAAIgD,UAAU,QAAQ,oCAAoC;AAC1E,SAASC,2BAA2B,QAAQ,2BAA2B;AACvE,SAASC,cAAc,QAAQ,wBAAwB;AACvD,SAASC,iBAAiB,QAAQ,kBAAkB;AACpD,SAASC,eAAe,QAAQ,qBAAqB;AACrD,SAASC,oBAAoB,QAAQ,qBAAqB;AAG1D,SAASC,qBAAqB,EAAEC,gBAAgB,QAAQ,uBAAuB;AAW/E,SAASC,aAAa,QAAQ,oBAAoB;AAClD,SAASC,UAAU,QAAQ,qBAAqB;AAChD,SAASC,oBAAoB,EAAEC,WAAW,QAAQ,oBAAoB;AACtE,SAASC,eAAe,QAAQ,yBAAyB;AACzD,SAASC,UAAU,QAAQ,oBAAoB","ignoreList":[]}
+{"version":3,"file":"index.js","names":["default","Accordion","AccordionContent","AccordionGroup","AccordionIntro","AccordionItem","AmountControl","AreaContext","AreaProvider","Badge","Button","Checkbox","ColorSchemeProvider","ComboBox","ContentCard","ContextMenu","ExpandableContent","FileInput","FilterButtons","GridImage","Icon","Input","List","ListItemContent","ListItem","MentionFinder","NumberInput","PageProvider","Popup","PopupContent","ProgressBar","RadioButtonGroup","RadioButton","ScrollView","SearchBox","SearchInput","SelectButton","SetupWizardItem","SetupWizard","SharingBar","Signature","SliderButton","Slider","SmallWaitCursor","SmallWaitCursorSize","SmallWaitCursorSpeed","TagInput","TextArea","Tooltip","Truncation","MentionFinderPopupAlignment","useElementSize","ComboBoxDirection","ContentCardType","ContextMenuAlignment","FilterButtonItemShape","FilterButtonSize","ClampPosition","getIsTouch","getFileAsArrayBuffer","selectFiles","isTobitEmployee","getUsableHeight","uploadFile"],"sources":["../../src/index.ts"],"sourcesContent":["// noinspection JSUnusedGlobalSymbols\nexport { default as Accordion } from './components/accordion/Accordion';\nexport { default as AccordionContent } from './components/accordion/accordion-content/AccordionContent';\nexport { default as AccordionGroup } from './components/accordion/accordion-group/AccordionGroup';\nexport { default as AccordionIntro } from './components/accordion/accordion-intro/AccordionIntro';\nexport { default as AccordionItem } from './components/accordion/accordion-item/AccordionItem';\nexport { default as AmountControl } from './components/amount-control/AmountControl';\nexport {\n    AreaContext,\n    default as AreaProvider,\n} from './components/area-provider/AreaContextProvider';\nexport { default as Badge } from './components/badge/Badge';\nexport { default as Button } from './components/button/Button';\nexport { default as Checkbox } from './components/checkbox/Checkbox';\nexport { default as ColorSchemeProvider } from './components/color-scheme-provider/ColorSchemeProvider';\nexport type {\n    FramerMotionBugFix,\n    WithTheme,\n} from './components/color-scheme-provider/ColorSchemeProvider';\nexport {\n    default as ComboBox,\n    type IComboBoxItem as ComboBoxItem,\n    type IComboBoxItems as ComboBoxItems,\n} from './components/combobox/ComboBox';\nexport { default as ContentCard } from './components/content-card/ContentCard';\nexport { default as ContextMenu, type ContextMenuRef } from './components/context-menu/ContextMenu';\nexport { default as ExpandableContent } from './components/expandable-content/ExpandableContent';\nexport { default as FileInput, type FileInputRef } from './components/file-input/FileInput';\nexport { default as FilterButtons } from './components/filter-buttons/FilterButtons';\nexport { default as GridImage } from './components/grid-image/GridImage';\nexport { default as Icon } from './components/icon/Icon';\nexport { default as Input } from './components/input/Input';\nexport { default as List } from './components/list/List';\nexport { default as ListItemContent } from './components/list/list-item/list-item-content/ListItemContent';\nexport {\n    default as ListItem,\n    type ListItemElements,\n    type ListItemProps,\n} from './components/list/list-item/ListItem';\nexport { default as MentionFinder } from './components/mention-finder/MentionFinder';\nexport type { MentionMember } from './components/mention-finder/MentionFinder';\nexport { default as NumberInput } from './components/number-input/NumberInput';\nexport { default as PageProvider } from './components/page-provider/PageProvider';\nexport { default as Popup } from './components/popup/Popup';\nexport { default as PopupContent } from './components/popup/popup-content/PopupContent';\nexport { default as ProgressBar } from './components/progress-bar/ProgressBar';\nexport {\n    default as RadioButtonGroup,\n    type RadioButtonGroupRef,\n} from './components/radio-button/radio-button-group/RadioButtonGroup';\nexport { default as RadioButton } from './components/radio-button/RadioButton';\nexport { default as ScrollView } from './components/scroll-view/ScrollView';\nexport { default as SearchBox } from './components/search-box/SearchBox';\nexport { default as SearchInput } from './components/search-input/SearchInput';\nexport { default as SelectButton } from './components/select-button/SelectButton';\nexport { default as SetupWizardItem } from './components/setup-wizard/setup-wizard-item/SetupWizardItem';\nexport { default as SetupWizard } from './components/setup-wizard/SetupWizard';\nexport type { SetupWizardRef } from './components/setup-wizard/SetupWizard';\nexport { default as SharingBar } from './components/sharing-bar/SharingBar';\nexport { default as Signature } from './components/signature/Signature';\nexport type { SignatureRef } from './components/signature/Signature';\nexport { default as SliderButton } from './components/slider-button/SliderButton';\nexport { default as Slider } from './components/slider/Slider';\nexport {\n    default as SmallWaitCursor,\n    SmallWaitCursorSize,\n    SmallWaitCursorSpeed,\n} from './components/small-wait-cursor/SmallWaitCursor';\nexport { default as TagInput } from './components/tag-input/TagInput';\nexport { default as TextArea } from './components/text-area/TextArea';\nexport { default as Tooltip } from './components/tooltip/Tooltip';\nexport { default as Truncation } from './components/truncation/Truncation';\nexport { MentionFinderPopupAlignment } from './constants/mentionFinder';\nexport { useElementSize } from './hooks/useElementSize';\nexport { ComboBoxDirection } from './types/comboBox';\nexport { ContentCardType } from './types/contentCard';\nexport { ContextMenuAlignment } from './types/contextMenu';\nexport type { FileItem, Image, InternalFileItem, Meta, Video } from './types/file';\nexport type { FileInputFileItem } from './types/fileInput';\nexport { FilterButtonItemShape, FilterButtonSize } from './types/filterButtons';\nexport type { IFilterButtonItem as FilterButtonItem } from './types/filterButtons';\nexport type { IListItemRightElements } from './types/list';\nexport type { PopupRef } from './types/popup';\nexport type { RadioButtonItem } from './types/radioButton';\nexport type {\n    ISearchBoxItem as SearchBoxItem,\n    ISearchBoxItems as SearchBoxItems,\n} from './types/searchBox';\nexport type { SelectButtonItem } from './types/selectButton';\nexport type { SliderButtonItem } from './types/slider-button';\nexport { ClampPosition } from './types/truncation';\nexport { getIsTouch } from './utils/environment';\nexport { getFileAsArrayBuffer, selectFiles } from './utils/fileDialog';\nexport { isTobitEmployee } from './utils/isTobitEmployee';\nexport { getUsableHeight } from './utils/pageProvider';\nexport { uploadFile } from './utils/uploadFile';\n"],"mappings":"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","ignoreList":[]}

package/lib/esm/utils/pageProvider.js

@@ -0,0 +1,84 @@
+import { getEnvironment, getWindowMetrics } from 'chayns-api';
+import { PAGE_BREAKPOINTS } from '../constants/pageProvider';
+export const getPagePadding = () => {
+  const {
+    runtimeEnvironment
+  } = getEnvironment();
+  if (typeof runtimeEnvironment === 'number' && [4, 5].includes(runtimeEnvironment)) {
+    return '0';
+  }
+  if (matchMedia(PAGE_BREAKPOINTS.desktop).matches) {
+    return '35px 43px 30px';
+  }
+  return '15px 10px 20px';
+};
+const getPageProviderInformation = customPadding => {
+  const padding = (customPadding ?? getPagePadding()).split(' ');
+  const parseValue = value => {
+    const parsed = parseInt(value.replace('px', ''), 10);
+    return Number.isNaN(parsed) ? 0 : parsed;
+  };
+  if (padding.length === 1) {
+    const value = parseValue(padding[0] ?? '');
+    return {
+      top: value,
+      right: value,
+      bottom: value,
+      left: value
+    };
+  }
+  if (padding.length === 2) {
+    const [vertical, horizontal] = padding.map(parseValue);
+    return {
+      top: vertical ?? 0,
+      right: horizontal ?? 0,
+      bottom: vertical ?? 0,
+      left: horizontal ?? 0
+    };
+  }
+  if (padding.length === 3) {
+    const [top, horizontal, bottom] = padding.map(parseValue);
+    return {
+      top: top ?? 0,
+      right: horizontal ?? 0,
+      bottom: bottom ?? 0,
+      left: horizontal ?? 0
+    };
+  }
+  if (padding.length === 4) {
+    const [top, right, bottom, left] = padding.map(parseValue);
+    return {
+      top: top ?? 0,
+      right: right ?? 0,
+      bottom: bottom ?? 0,
+      left: left ?? 0
+    };
+  }
+  return {
+    top: 0,
+    right: 0,
+    bottom: 0,
+    left: 0
+  };
+};
+export const getUsableHeight = async customPadding => {
+  let usableHeight;
+  const {
+    bottomBarHeight,
+    topBarHeight,
+    windowHeight
+  } = await getWindowMetrics();
+  const {
+    top,
+    bottom
+  } = getPageProviderInformation(customPadding);
+  usableHeight = windowHeight - bottom - top;
+  if (bottomBarHeight) {
+    usableHeight -= bottomBarHeight;
+  }
+  if (topBarHeight) {
+    usableHeight -= topBarHeight;
+  }
+  return usableHeight;
+};
+//# sourceMappingURL=pageProvider.js.map

package/lib/esm/utils/pageProvider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"pageProvider.js","names":["getEnvironment","getWindowMetrics","PAGE_BREAKPOINTS","getPagePadding","runtimeEnvironment","includes","matchMedia","desktop","matches","getPageProviderInformation","customPadding","padding","split","parseValue","value","parsed","parseInt","replace","Number","isNaN","length","top","right","bottom","left","vertical","horizontal","map","getUsableHeight","usableHeight","bottomBarHeight","topBarHeight","windowHeight"],"sources":["../../../src/utils/pageProvider.ts"],"sourcesContent":["import { getEnvironment, getWindowMetrics } from 'chayns-api';\nimport { PAGE_BREAKPOINTS } from '../constants/pageProvider';\n\nexport const getPagePadding = () => {\n    const { runtimeEnvironment } = getEnvironment();\n\n    if (typeof runtimeEnvironment === 'number' && [4, 5].includes(runtimeEnvironment)) {\n        return '0';\n    }\n\n    if (matchMedia(PAGE_BREAKPOINTS.desktop).matches) {\n        return '35px 43px 30px';\n    }\n\n    return '15px 10px 20px';\n};\n\ntype PaddingValues = {\n    top: number;\n    right: number;\n    bottom: number;\n    left: number;\n};\n\nconst getPageProviderInformation = (customPadding?: string): PaddingValues => {\n    const padding = (customPadding ?? getPagePadding()).split(' ');\n\n    const parseValue = (value: string): number => {\n        const parsed = parseInt(value.replace('px', ''), 10);\n        return Number.isNaN(parsed) ? 0 : parsed;\n    };\n\n    if (padding.length === 1) {\n        const value = parseValue(padding[0] ?? '');\n        return { top: value, right: value, bottom: value, left: value };\n    }\n\n    if (padding.length === 2) {\n        const [vertical, horizontal] = padding.map(parseValue);\n        return {\n            top: vertical ?? 0,\n            right: horizontal ?? 0,\n            bottom: vertical ?? 0,\n            left: horizontal ?? 0,\n        };\n    }\n\n    if (padding.length === 3) {\n        const [top, horizontal, bottom] = padding.map(parseValue);\n        return {\n            top: top ?? 0,\n            right: horizontal ?? 0,\n            bottom: bottom ?? 0,\n            left: horizontal ?? 0,\n        };\n    }\n\n    if (padding.length === 4) {\n        const [top, right, bottom, left] = padding.map(parseValue);\n        return { top: top ?? 0, right: right ?? 0, bottom: bottom ?? 0, left: left ?? 0 };\n    }\n\n    return { top: 0, right: 0, bottom: 0, left: 0 };\n};\n\nexport const getUsableHeight = async (customPadding?: string) => {\n    let usableHeight;\n\n    const { bottomBarHeight, topBarHeight, windowHeight } = await getWindowMetrics();\n\n    const { top, bottom } = getPageProviderInformation(customPadding);\n\n    usableHeight = windowHeight - bottom - top;\n\n    if (bottomBarHeight) {\n        usableHeight -= bottomBarHeight;\n    }\n\n    if (topBarHeight) {\n        usableHeight -= topBarHeight;\n    }\n\n    return usableHeight;\n};\n"],"mappings":"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","ignoreList":[]}

package/lib/types/components/accordion/Accordion.styles.d.ts

@@ -11,6 +11,7 @@ export declare const StyledMotionAccordion: import("styled-components/dist/types
     slot?: string | undefined;
     title?: string | undefined;
     color?: string | undefined;
+    className?: string | undefined;
     rel?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -18,7 +19,6 @@ export declare const StyledMotionAccordion: import("styled-components/dist/types
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
-    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;

package/lib/types/components/accordion/accordion-body/AccordionBody.styles.d.ts

@@ -8,6 +8,7 @@ export declare const StyledMotionAccordionBody: import("styled-components/dist/t
     slot?: string | undefined;
     title?: string | undefined;
     color?: string | undefined;
+    className?: string | undefined;
     rel?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -15,7 +16,6 @@ export declare const StyledMotionAccordionBody: import("styled-components/dist/t
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
-    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;

package/lib/types/components/accordion/accordion-head/AccordionHead.styles.d.ts

@@ -4,6 +4,7 @@ export declare const StyledMotionAccordionHead: import("styled-components/dist/t
     slot?: string | undefined;
     title?: string | undefined;
     color?: string | undefined;
+    className?: string | undefined;
     rel?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -11,7 +12,6 @@ export declare const StyledMotionAccordionHead: import("styled-components/dist/t
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
-    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;
@@ -269,6 +269,7 @@ export declare const StyledMotionIconWrapper: import("styled-components/dist/typ
     slot?: string | undefined;
     title?: string | undefined;
     color?: string | undefined;
+    className?: string | undefined;
     rel?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -276,7 +277,6 @@ export declare const StyledMotionIconWrapper: import("styled-components/dist/typ
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
-    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;
@@ -538,6 +538,7 @@ export declare const StyledMotionContentWrapper: import("styled-components/dist/
     slot?: string | undefined;
     title?: string | undefined;
     color?: string | undefined;
+    className?: string | undefined;
     rel?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -545,7 +546,6 @@ export declare const StyledMotionContentWrapper: import("styled-components/dist/
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
-    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;
@@ -803,6 +803,7 @@ export declare const StyledMotionTitleWrapper: import("styled-components/dist/ty
     slot?: string | undefined;
     title?: string | undefined;
     color?: string | undefined;
+    className?: string | undefined;
     rel?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -810,7 +811,6 @@ export declare const StyledMotionTitleWrapper: import("styled-components/dist/ty
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
-    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;
@@ -1073,6 +1073,7 @@ export declare const StyledMotionTitle: import("styled-components/dist/types").I
     slot?: string | undefined;
     title?: string | undefined;
     color?: string | undefined;
+    className?: string | undefined;
     rel?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -1080,7 +1081,6 @@ export declare const StyledMotionTitle: import("styled-components/dist/types").I
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
-    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;
@@ -1336,6 +1336,7 @@ export declare const StyledMotionTitleElementWrapper: import("styled-components/
     slot?: string | undefined;
     title?: string | undefined;
     color?: string | undefined;
+    className?: string | undefined;
     rel?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -1343,7 +1344,6 @@ export declare const StyledMotionTitleElementWrapper: import("styled-components/
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
-    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;
@@ -1602,6 +1602,7 @@ export declare const StyledMotionSearchWrapper: import("styled-components/dist/t
     slot?: string | undefined;
     title?: string | undefined;
     color?: string | undefined;
+    className?: string | undefined;
     rel?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -1609,7 +1610,6 @@ export declare const StyledMotionSearchWrapper: import("styled-components/dist/t
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
-    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;
@@ -1867,6 +1867,7 @@ export declare const StyledMotionRightElementWrapper: import("styled-components/
     slot?: string | undefined;
     title?: string | undefined;
     color?: string | undefined;
+    className?: string | undefined;
     rel?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -1874,7 +1875,6 @@ export declare const StyledMotionRightElementWrapper: import("styled-components/
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
-    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;
@@ -2140,6 +2140,7 @@ export declare const StyledMotionRightInput: import("styled-components/dist/type
     size?: number | undefined;
     color?: string | undefined;
     type?: import("react").HTMLInputTypeAttribute | undefined;
+    className?: string | undefined;
     rel?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -2147,7 +2148,6 @@ export declare const StyledMotionRightInput: import("styled-components/dist/type
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
-    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;
@@ -2429,6 +2429,7 @@ export declare const StyledMotionRightInputIconWrapper: import("styled-component
     slot?: string | undefined;
     title?: string | undefined;
     color?: string | undefined;
+    className?: string | undefined;
     rel?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -2436,7 +2437,6 @@ export declare const StyledMotionRightInputIconWrapper: import("styled-component
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
-    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;

package/lib/types/components/amount-control/AmountControl.styles.d.ts

@@ -26,6 +26,7 @@ export declare const StyledMotionAmountControlButton: import("styled-components/
     value?: string | number | readonly string[] | undefined;
     color?: string | undefined;
     type?: "button" | "reset" | "submit" | undefined;
+    className?: string | undefined;
     rel?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -33,7 +34,6 @@ export declare const StyledMotionAmountControlButton: import("styled-components/
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
-    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;

package/lib/types/components/button/Button.styles.d.ts

@@ -14,6 +14,7 @@ export declare const StyledMotionButton: import("styled-components/dist/types").
     value?: string | number | readonly string[] | undefined;
     color?: string | undefined;
     type?: "button" | "reset" | "submit" | undefined;
+    className?: string | undefined;
     rel?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -21,7 +22,6 @@ export declare const StyledMotionButton: import("styled-components/dist/types").
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
-    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;
@@ -285,6 +285,7 @@ export declare const StyledMotionChildrenWrapper: import("styled-components/dist
     slot?: string | undefined;
     title?: string | undefined;
     color?: string | undefined;
+    className?: string | undefined;
     rel?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -292,7 +293,6 @@ export declare const StyledMotionChildrenWrapper: import("styled-components/dist
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
-    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;
@@ -550,6 +550,7 @@ export declare const StyledMotionWaitCursorWrapper: import("styled-components/di
     slot?: string | undefined;
     title?: string | undefined;
     color?: string | undefined;
+    className?: string | undefined;
     rel?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -557,7 +558,6 @@ export declare const StyledMotionWaitCursorWrapper: import("styled-components/di
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
-    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;

package/lib/types/components/color-scheme-provider/ColorSchemeProvider.d.ts

@@ -5,7 +5,7 @@ declare enum ColorMode {
     Dark = 1,
     Light = 2
 }
-type ColorSchemeProviderProps = {
+export type ColorSchemeProviderProps = {
     /**
      * The content of the application or the components for which the styles should be set
      */

package/lib/types/components/combobox/ComboBox.styles.d.ts

@@ -33,6 +33,7 @@ export declare const StyledMotionComboBoxBody: import("styled-components/dist/ty
     slot?: string | undefined;
     title?: string | undefined;
     color?: string | undefined;
+    className?: string | undefined;
     rel?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -40,7 +41,6 @@ export declare const StyledMotionComboBoxBody: import("styled-components/dist/ty
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
-    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;

package/lib/types/components/context-menu/context-menu-content/ContextMenuContent.styles.d.ts

@@ -7,6 +7,7 @@ export declare const StyledMotionContextMenuContent: import("styled-components/d
     slot?: string | undefined;
     title?: string | undefined;
     color?: string | undefined;
+    className?: string | undefined;
     rel?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -14,7 +15,6 @@ export declare const StyledMotionContextMenuContent: import("styled-components/d
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
-    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;

package/lib/types/components/expandable-content/ExpandableContent.styles.d.ts

@@ -5,6 +5,7 @@ export declare const StyledMotionExpandableContent: import("styled-components/di
     slot?: string | undefined;
     title?: string | undefined;
     color?: string | undefined;
+    className?: string | undefined;
     rel?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -12,7 +13,6 @@ export declare const StyledMotionExpandableContent: import("styled-components/di
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
-    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;

package/lib/types/components/file-input/FileInput.styles.d.ts

@@ -19,6 +19,7 @@ export declare const StyledMotionFileInputList: import("styled-components/dist/t
     slot?: string | undefined;
     title?: string | undefined;
     color?: string | undefined;
+    className?: string | undefined;
     rel?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -26,7 +27,6 @@ export declare const StyledMotionFileInputList: import("styled-components/dist/t
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
-    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;