@chayns-components/core 5.0.0-beta.414 → 5.0.0-beta.415

package/lib/components/icon/Icon.js.map

@@ -1 +1 @@
-{"version":3,"file":"Icon.js","names":["_clsx","_interopRequireDefault","require","_react","_Icon","_utils","obj","__esModule","default","Icon","_ref","className","color","icons","isDisabled","onClick","onDoubleClick","onMouseDown","size","shouldStopPropagation","handleClick","event","stopPropagation","handleDoubleClick","maxStackSizeFactor","forEach","icon","stackSizeFactor","getStackSizeFactor","shouldUseStackedIcon","length","wrapperClasses","clsx","createElement","StyledIconWrapper","undefined","map","iconClasses","StyledIcon","includes","fontSize","isStacked","key","displayName","_default","exports"],"sources":["../../../src/components/icon/Icon.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport React, { FC, MouseEventHandler } from 'react';\nimport { StyledIcon, StyledIconWrapper } from './Icon.styles';\nimport { getStackSizeFactor } from './utils';\n\nexport type IconProps = {\n    /**\n     * Additional class names for the root element\n     */\n    className?: string;\n    /**\n     * The color of the icon\n     */\n    color?: string;\n    /**\n     * The FontAwesome or tobit icons to render. Multiple icons are stacked.\n     */\n    icons: string[];\n    /**\n     * Disables the icon so that it cannot be clicked anymore\n     */\n    isDisabled?: boolean;\n    /**\n     * Function to be executed when the icon was clicked\n     */\n    onClick?: MouseEventHandler<HTMLSpanElement>;\n    /**\n     * Function to be executed when the icon was double-clicked\n     */\n    onDoubleClick?: MouseEventHandler<HTMLSpanElement>;\n    /**\n     * Function to be executed when a mouse button is pressed on the icon\n     */\n    onMouseDown?: MouseEventHandler<HTMLSpanElement>;\n    /**\n     * Size of the icon in pixel\n     */\n    size?: number;\n    /**\n     * Stops event propagation on click\n     */\n    shouldStopPropagation?: boolean;\n};\n\nconst Icon: FC<IconProps> = ({\n    className,\n    color,\n    icons,\n    isDisabled,\n    onClick,\n    onDoubleClick,\n    onMouseDown,\n    size = 15,\n    shouldStopPropagation,\n}) => {\n    const handleClick: MouseEventHandler<HTMLSpanElement> = (event) => {\n        if (shouldStopPropagation) {\n            event.stopPropagation();\n        }\n\n        if (typeof onClick === 'function') {\n            onClick(event);\n        }\n    };\n\n    const handleDoubleClick: MouseEventHandler<HTMLSpanElement> = (event) => {\n        if (shouldStopPropagation) {\n            event.stopPropagation();\n        }\n\n        if (typeof onDoubleClick === 'function') {\n            onDoubleClick(event);\n        }\n    };\n\n    let maxStackSizeFactor = 1;\n\n    icons.forEach((icon) => {\n        const stackSizeFactor = getStackSizeFactor(icon);\n\n        if (stackSizeFactor && stackSizeFactor > maxStackSizeFactor) {\n            maxStackSizeFactor = stackSizeFactor;\n        }\n    });\n\n    const shouldUseStackedIcon = icons.length > 1;\n\n    const wrapperClasses = clsx(\n        'beta-chayns-icon',\n        shouldUseStackedIcon ? 'fa-stack' : '',\n        className,\n    );\n\n    return (\n        <StyledIconWrapper\n            className={wrapperClasses}\n            isDisabled={isDisabled}\n            onClick={typeof onClick === 'function' ? handleClick : undefined}\n            onDoubleClick={typeof onDoubleClick === 'function' ? handleDoubleClick : undefined}\n            onMouseDown={onMouseDown}\n            size={size}\n        >\n            {icons.map((icon) => {\n                const stackSizeFactor = getStackSizeFactor(icon);\n\n                const iconClasses = clsx(icon, {\n                    'fa-stack-1x': shouldUseStackedIcon && stackSizeFactor === undefined,\n                });\n\n                return (\n                    <StyledIcon\n                        className={iconClasses}\n                        color={icon.includes('fa-inverse') ? 'white' : color}\n                        fontSize={((stackSizeFactor || 1) / maxStackSizeFactor) * size}\n                        isStacked={shouldUseStackedIcon}\n                        key={icon}\n                        size={size}\n                    />\n                );\n            })}\n        </StyledIconWrapper>\n    );\n};\n\nIcon.displayName = 'Icon';\n\nexport default Icon;\n"],"mappings":";;;;;;AAAA,IAAAA,KAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,MAAA,GAAAF,sBAAA,CAAAC,OAAA;AACA,IAAAE,KAAA,GAAAF,OAAA;AACA,IAAAG,MAAA,GAAAH,OAAA;AAA6C,SAAAD,uBAAAK,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAyC7C,MAAMG,IAAmB,GAAGC,IAAA,IAUtB;EAAA,IAVuB;IACzBC,SAAS;IACTC,KAAK;IACLC,KAAK;IACLC,UAAU;IACVC,OAAO;IACPC,aAAa;IACbC,WAAW;IACXC,IAAI,GAAG,EAAE;IACTC;EACJ,CAAC,GAAAT,IAAA;EACG,MAAMU,WAA+C,GAAIC,KAAK,IAAK;IAC/D,IAAIF,qBAAqB,EAAE;MACvBE,KAAK,CAACC,eAAe,CAAC,CAAC;IAC3B;IAEA,IAAI,OAAOP,OAAO,KAAK,UAAU,EAAE;MAC/BA,OAAO,CAACM,KAAK,CAAC;IAClB;EACJ,CAAC;EAED,MAAME,iBAAqD,GAAIF,KAAK,IAAK;IACrE,IAAIF,qBAAqB,EAAE;MACvBE,KAAK,CAACC,eAAe,CAAC,CAAC;IAC3B;IAEA,IAAI,OAAON,aAAa,KAAK,UAAU,EAAE;MACrCA,aAAa,CAACK,KAAK,CAAC;IACxB;EACJ,CAAC;EAED,IAAIG,kBAAkB,GAAG,CAAC;EAE1BX,KAAK,CAACY,OAAO,CAAEC,IAAI,IAAK;IACpB,MAAMC,eAAe,GAAG,IAAAC,yBAAkB,EAACF,IAAI,CAAC;IAEhD,IAAIC,eAAe,IAAIA,eAAe,GAAGH,kBAAkB,EAAE;MACzDA,kBAAkB,GAAGG,eAAe;IACxC;EACJ,CAAC,CAAC;EAEF,MAAME,oBAAoB,GAAGhB,KAAK,CAACiB,MAAM,GAAG,CAAC;EAE7C,MAAMC,cAAc,GAAG,IAAAC,aAAI,EACvB,kBAAkB,EAClBH,oBAAoB,GAAG,UAAU,GAAG,EAAE,EACtClB,SACJ,CAAC;EAED,oBACIR,MAAA,CAAAK,OAAA,CAAAyB,aAAA,CAAC7B,KAAA,CAAA8B,iBAAiB;IACdvB,SAAS,EAAEoB,cAAe;IAC1BjB,UAAU,EAAEA,UAAW;IACvBC,OAAO,EAAE,OAAOA,OAAO,KAAK,UAAU,GAAGK,WAAW,GAAGe,SAAU;IACjEnB,aAAa,EAAE,OAAOA,aAAa,KAAK,UAAU,GAAGO,iBAAiB,GAAGY,SAAU;IACnFlB,WAAW,EAAEA,WAAY;IACzBC,IAAI,EAAEA;EAAK,GAEVL,KAAK,CAACuB,GAAG,CAAEV,IAAI,IAAK;IACjB,MAAMC,eAAe,GAAG,IAAAC,yBAAkB,EAACF,IAAI,CAAC;IAEhD,MAAMW,WAAW,GAAG,IAAAL,aAAI,EAACN,IAAI,EAAE;MAC3B,aAAa,EAAEG,oBAAoB,IAAIF,eAAe,KAAKQ;IAC/D,CAAC,CAAC;IAEF,oBACIhC,MAAA,CAAAK,OAAA,CAAAyB,aAAA,CAAC7B,KAAA,CAAAkC,UAAU;MACP3B,SAAS,EAAE0B,WAAY;MACvBzB,KAAK,EAAEc,IAAI,CAACa,QAAQ,CAAC,YAAY,CAAC,GAAG,OAAO,GAAG3B,KAAM;MACrD4B,QAAQ,EAAG,CAACb,eAAe,IAAI,CAAC,IAAIH,kBAAkB,GAAIN,IAAK;MAC/DuB,SAAS,EAAEZ,oBAAqB;MAChCa,GAAG,EAAEhB,IAAK;MACVR,IAAI,EAAEA;IAAK,CACd,CAAC;EAEV,CAAC,CACc,CAAC;AAE5B,CAAC;AAEDT,IAAI,CAACkC,WAAW,GAAG,MAAM;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAArC,OAAA,GAEXC,IAAI"}
+{"version":3,"file":"Icon.js","names":["_clsx","_interopRequireDefault","require","_react","_Icon","_icon","obj","__esModule","default","Icon","_ref","className","color","icons","isDisabled","onClick","onDoubleClick","onMouseDown","size","shouldStopPropagation","handleClick","event","stopPropagation","handleDoubleClick","maxStackSizeFactor","forEach","icon","stackSizeFactor","getStackSizeFactor","shouldUseStackedIcon","length","wrapperClasses","clsx","createElement","StyledIconWrapper","undefined","map","iconClasses","StyledIcon","includes","fontSize","isStacked","key","displayName","_default","exports"],"sources":["../../../src/components/icon/Icon.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport React, { FC, MouseEventHandler } from 'react';\nimport { StyledIcon, StyledIconWrapper } from './Icon.styles';\nimport { getStackSizeFactor } from '../../utils/icon';\n\nexport type IconProps = {\n    /**\n     * Additional class names for the root element\n     */\n    className?: string;\n    /**\n     * The color of the icon\n     */\n    color?: string;\n    /**\n     * The FontAwesome or tobit icons to render. Multiple icons are stacked.\n     */\n    icons: string[];\n    /**\n     * Disables the icon so that it cannot be clicked anymore\n     */\n    isDisabled?: boolean;\n    /**\n     * Function to be executed when the icon was clicked\n     */\n    onClick?: MouseEventHandler<HTMLSpanElement>;\n    /**\n     * Function to be executed when the icon was double-clicked\n     */\n    onDoubleClick?: MouseEventHandler<HTMLSpanElement>;\n    /**\n     * Function to be executed when a mouse button is pressed on the icon\n     */\n    onMouseDown?: MouseEventHandler<HTMLSpanElement>;\n    /**\n     * Size of the icon in pixel\n     */\n    size?: number;\n    /**\n     * Stops event propagation on click\n     */\n    shouldStopPropagation?: boolean;\n};\n\nconst Icon: FC<IconProps> = ({\n    className,\n    color,\n    icons,\n    isDisabled,\n    onClick,\n    onDoubleClick,\n    onMouseDown,\n    size = 15,\n    shouldStopPropagation,\n}) => {\n    const handleClick: MouseEventHandler<HTMLSpanElement> = (event) => {\n        if (shouldStopPropagation) {\n            event.stopPropagation();\n        }\n\n        if (typeof onClick === 'function') {\n            onClick(event);\n        }\n    };\n\n    const handleDoubleClick: MouseEventHandler<HTMLSpanElement> = (event) => {\n        if (shouldStopPropagation) {\n            event.stopPropagation();\n        }\n\n        if (typeof onDoubleClick === 'function') {\n            onDoubleClick(event);\n        }\n    };\n\n    let maxStackSizeFactor = 1;\n\n    icons.forEach((icon) => {\n        const stackSizeFactor = getStackSizeFactor(icon);\n\n        if (stackSizeFactor && stackSizeFactor > maxStackSizeFactor) {\n            maxStackSizeFactor = stackSizeFactor;\n        }\n    });\n\n    const shouldUseStackedIcon = icons.length > 1;\n\n    const wrapperClasses = clsx(\n        'beta-chayns-icon',\n        shouldUseStackedIcon ? 'fa-stack' : '',\n        className,\n    );\n\n    return (\n        <StyledIconWrapper\n            className={wrapperClasses}\n            isDisabled={isDisabled}\n            onClick={typeof onClick === 'function' ? handleClick : undefined}\n            onDoubleClick={typeof onDoubleClick === 'function' ? handleDoubleClick : undefined}\n            onMouseDown={onMouseDown}\n            size={size}\n        >\n            {icons.map((icon) => {\n                const stackSizeFactor = getStackSizeFactor(icon);\n\n                const iconClasses = clsx(icon, {\n                    'fa-stack-1x': shouldUseStackedIcon && stackSizeFactor === undefined,\n                });\n\n                return (\n                    <StyledIcon\n                        className={iconClasses}\n                        color={icon.includes('fa-inverse') ? 'white' : color}\n                        fontSize={((stackSizeFactor || 1) / maxStackSizeFactor) * size}\n                        isStacked={shouldUseStackedIcon}\n                        key={icon}\n                        size={size}\n                    />\n                );\n            })}\n        </StyledIconWrapper>\n    );\n};\n\nIcon.displayName = 'Icon';\n\nexport default Icon;\n"],"mappings":"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"}

package/lib/components/input/Input.styles.js

@@ -16,6 +16,7 @@ const StyledInput = exports.StyledInput = _styledComponents.default.div`
   return isDisabled ? 0.5 : 1;
 }};
     display: flex;
+    width: 100%;
 `;
 const StyledInputContentWrapper = exports.StyledInputContentWrapper = _styledComponents.default.div`
     align-items: center;

package/lib/components/input/Input.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Input.styles.js","names":["_framerMotion","require","_styledComponents","_interopRequireWildcard","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","StyledInput","exports","styled","div","_ref","isDisabled","StyledInputContentWrapper","_ref2","theme","_ref3","isInvalid","wrong","_ref4","_ref5","shouldRoundRightCorners","shouldShowOnlyBottomBorder","css","StyledInputContent","StyledInputField","input","_ref6","text","StyledMotionInputLabel","motion","label","_ref7","undefined","StyledMotionInputClearIcon","_ref8","StyledInputIconWrapper","StyledInputRightElement"],"sources":["../../../src/components/input/Input.styles.ts"],"sourcesContent":["import { motion } from 'framer-motion';\nimport styled, { css } from 'styled-components';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\nimport type { InputProps } from './Input';\n\ntype StyledInputProps = WithTheme<Pick<InputProps, 'isDisabled' | 'isInvalid'>>;\n\nexport const StyledInput = styled.div<StyledInputProps>`\n    opacity: ${({ isDisabled }) => (isDisabled ? 0.5 : 1)};\n    display: flex;\n`;\n\ntype StyledInputContentWrapperProps = WithTheme<{\n    shouldRoundRightCorners: boolean;\n    shouldShowOnlyBottomBorder?: boolean;\n}>;\n\nexport const StyledInputContentWrapper = styled.div<StyledInputContentWrapperProps>`\n    align-items: center;\n    background-color: ${({ theme }: StyledInputProps) => theme['100']};\n    border: 1px solid\n        ${({ theme, isInvalid }: StyledInputProps) =>\n            isInvalid ? theme.wrong : 'rgba(160, 160, 160, 0.3)'};\n    color: ${({ theme }: StyledInputProps) => theme['006']};\n    display: flex;\n    justify-content: space-between;\n    min-height: 42px;\n    width: 100%;\n    transition: opacity 0.3s ease;\n\n    ${({ shouldRoundRightCorners, shouldShowOnlyBottomBorder, theme }) => {\n        if (shouldShowOnlyBottomBorder) {\n            return css`\n                border-top: none;\n                border-right: none;\n                border-left: none;\n                background-color: transparent;\n                border-color: ${theme['408']};\n            `;\n        }\n\n        if (shouldRoundRightCorners) {\n            return css`\n                border-radius: 3px;\n            `;\n        }\n\n        return css`\n            border-bottom-left-radius: 3px;\n            border-top-left-radius: 3px;\n        `;\n    }}\n`;\n\nexport const StyledInputContent = styled.div`\n    display: flex;\n    flex: 1 1 auto;\n    min-width: 0;\n    margin: 8px 10px;\n    position: relative;\n`;\n\ntype StyledInputFieldProps = WithTheme<Pick<InputProps, 'isInvalid'>>;\n\nexport const StyledInputField = styled.input<StyledInputFieldProps>`\n    background: none;\n    border: none;\n    color: ${({ theme, isInvalid }: StyledInputFieldProps) =>\n        isInvalid ? theme.wrong : theme.text};\n    padding: 0;\n    width: 100%;\n`;\n\ntype StyledMotionInputLabelProps = WithTheme<Pick<InputProps, 'isInvalid'>>;\n\nexport const StyledMotionInputLabel = styled(motion.label)<StyledMotionInputLabelProps>`\n    align-items: baseline;\n    display: flex;\n    flex: 0 0 auto;\n    gap: 4px;\n    line-height: 1.3;\n    pointer-events: none;\n    position: absolute;\n    user-select: none;\n    color: ${({ theme, isInvalid }: StyledMotionInputLabelProps) =>\n        isInvalid ? theme.wrong : undefined};\n`;\n\ntype StyledMotionInputClearIconProps = WithTheme<{ shouldShowOnlyBottomBorder?: boolean }>;\n\nexport const StyledMotionInputClearIcon = styled(motion.div)<StyledMotionInputClearIconProps>`\n    align-items: center;\n    border-left: ${({ shouldShowOnlyBottomBorder }) =>\n        shouldShowOnlyBottomBorder ? 'none' : '1px solid rgba(160, 160, 160, 0.3)'};\n    cursor: pointer;\n    display: flex;\n    flex: 0 0 auto;\n    height: 40px;\n    justify-content: center;\n    width: 40px;\n`;\n\nexport const StyledInputIconWrapper = styled.div`\n    align-items: baseline;\n    display: flex;\n    flex: 0 0 auto;\n    justify-content: center;\n    margin-left: 10px;\n`;\n\nexport const StyledInputRightElement = styled.div`\n    border-bottom-right-radius: 3px;\n    border-top-right-radius: 3px;\n    overflow: hidden;\n    flex: 0 0 auto;\n`;\n"],"mappings":"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"}
+{"version":3,"file":"Input.styles.js","names":["_framerMotion","require","_styledComponents","_interopRequireWildcard","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","StyledInput","exports","styled","div","_ref","isDisabled","StyledInputContentWrapper","_ref2","theme","_ref3","isInvalid","wrong","_ref4","_ref5","shouldRoundRightCorners","shouldShowOnlyBottomBorder","css","StyledInputContent","StyledInputField","input","_ref6","text","StyledMotionInputLabel","motion","label","_ref7","undefined","StyledMotionInputClearIcon","_ref8","StyledInputIconWrapper","StyledInputRightElement"],"sources":["../../../src/components/input/Input.styles.ts"],"sourcesContent":["import { motion } from 'framer-motion';\nimport styled, { css } from 'styled-components';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\nimport type { InputProps } from './Input';\n\ntype StyledInputProps = WithTheme<Pick<InputProps, 'isDisabled' | 'isInvalid'>>;\n\nexport const StyledInput = styled.div<StyledInputProps>`\n    opacity: ${({ isDisabled }) => (isDisabled ? 0.5 : 1)};\n    display: flex;\n    width: 100%;\n`;\n\ntype StyledInputContentWrapperProps = WithTheme<{\n    shouldRoundRightCorners: boolean;\n    shouldShowOnlyBottomBorder?: boolean;\n}>;\n\nexport const StyledInputContentWrapper = styled.div<StyledInputContentWrapperProps>`\n    align-items: center;\n    background-color: ${({ theme }: StyledInputProps) => theme['100']};\n    border: 1px solid\n        ${({ theme, isInvalid }: StyledInputProps) =>\n            isInvalid ? theme.wrong : 'rgba(160, 160, 160, 0.3)'};\n    color: ${({ theme }: StyledInputProps) => theme['006']};\n    display: flex;\n    justify-content: space-between;\n    min-height: 42px;\n    width: 100%;\n    transition: opacity 0.3s ease;\n\n    ${({ shouldRoundRightCorners, shouldShowOnlyBottomBorder, theme }) => {\n        if (shouldShowOnlyBottomBorder) {\n            return css`\n                border-top: none;\n                border-right: none;\n                border-left: none;\n                background-color: transparent;\n                border-color: ${theme['408']};\n            `;\n        }\n\n        if (shouldRoundRightCorners) {\n            return css`\n                border-radius: 3px;\n            `;\n        }\n\n        return css`\n            border-bottom-left-radius: 3px;\n            border-top-left-radius: 3px;\n        `;\n    }}\n`;\n\nexport const StyledInputContent = styled.div`\n    display: flex;\n    flex: 1 1 auto;\n    min-width: 0;\n    margin: 8px 10px;\n    position: relative;\n`;\n\ntype StyledInputFieldProps = WithTheme<Pick<InputProps, 'isInvalid'>>;\n\nexport const StyledInputField = styled.input<StyledInputFieldProps>`\n    background: none;\n    border: none;\n    color: ${({ theme, isInvalid }: StyledInputFieldProps) =>\n        isInvalid ? theme.wrong : theme.text};\n    padding: 0;\n    width: 100%;\n`;\n\ntype StyledMotionInputLabelProps = WithTheme<Pick<InputProps, 'isInvalid'>>;\n\nexport const StyledMotionInputLabel = styled(motion.label)<StyledMotionInputLabelProps>`\n    align-items: baseline;\n    display: flex;\n    flex: 0 0 auto;\n    gap: 4px;\n    line-height: 1.3;\n    pointer-events: none;\n    position: absolute;\n    user-select: none;\n    color: ${({ theme, isInvalid }: StyledMotionInputLabelProps) =>\n        isInvalid ? theme.wrong : undefined};\n`;\n\ntype StyledMotionInputClearIconProps = WithTheme<{ shouldShowOnlyBottomBorder?: boolean }>;\n\nexport const StyledMotionInputClearIcon = styled(motion.div)<StyledMotionInputClearIconProps>`\n    align-items: center;\n    border-left: ${({ shouldShowOnlyBottomBorder }) =>\n        shouldShowOnlyBottomBorder ? 'none' : '1px solid rgba(160, 160, 160, 0.3)'};\n    cursor: pointer;\n    display: flex;\n    flex: 0 0 auto;\n    height: 40px;\n    justify-content: center;\n    width: 40px;\n`;\n\nexport const StyledInputIconWrapper = styled.div`\n    align-items: baseline;\n    display: flex;\n    flex: 0 0 auto;\n    justify-content: center;\n    margin-left: 10px;\n`;\n\nexport const StyledInputRightElement = styled.div`\n    border-bottom-right-radius: 3px;\n    border-top-right-radius: 3px;\n    overflow: hidden;\n    flex: 0 0 auto;\n`;\n"],"mappings":"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"}

package/lib/components/list/list-item/list-item-head/ListItemHead.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListItemHead.js","names":["_react","_interopRequireWildcard","require","_Icon","_interopRequireDefault","_ListItemIcon","_ListItemImage","_ListItemHead","obj","__esModule","default","_getRequireWildcardCache","e","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","ListItemHead","_ref","hoverItem","icons","images","isAnyItemExpandable","isExpandable","isOpen","onClick","onLongPress","rightElements","subtitle","shouldShowRoundImage","title","leftElements","shouldShowHoverItem","setShouldShowHoverItem","useState","longPressTimeoutRef","useRef","handleMouseEnter","useCallback","handleMouseLeave","handleTouchStart","event","current","window","setTimeout","handleTouchEnd","clearTimeout","iconOrImageElement","useMemo","createElement","undefined","StyledListItemHead","className","isClickable","onMouseEnter","onMouseLeave","onTouchStart","onTouchEnd","StyledMotionListItemHeadIndicator","animate","rotate","initial","transition","type","StyledListItemHeadContent","isIconOrImageGiven","StyledListItemHeadTitle","StyledListItemHeadTitleText","length","StyledListItemHeadTopRightElement","StyledListItemHeadSubtitle","StyledListItemHeadSubtitleText","StyledListItemHeadBottomRightElement","StyledListItemHeadRightElement","StyledMotionListItemHeadHoverItem","marginLeft","opacity","width","duration","displayName","_default","exports"],"sources":["../../../../../src/components/list/list-item/list-item-head/ListItemHead.tsx"],"sourcesContent":["import React, {\n    FC,\n    MouseEventHandler,\n    ReactNode,\n    TouchEventHandler,\n    useCallback,\n    useMemo,\n    useRef,\n    useState,\n} from 'react';\nimport Icon from '../../../icon/Icon';\nimport ListItemIcon from './list-item-icon/ListItemIcon';\nimport ListItemImage from './list-item-image/ListItemImage';\nimport {\n    StyledListItemHead,\n    StyledListItemHeadBottomRightElement,\n    StyledListItemHeadContent,\n    StyledListItemHeadRightElement,\n    StyledListItemHeadSubtitle,\n    StyledListItemHeadSubtitleText,\n    StyledListItemHeadTitle,\n    StyledListItemHeadTitleText,\n    StyledListItemHeadTopRightElement,\n    StyledMotionListItemHeadHoverItem,\n    StyledMotionListItemHeadIndicator,\n} from './ListItemHead.styles';\n\ntype ListItemHeadProps = {\n    hoverItem?: ReactNode;\n    icons?: string[];\n    images?: string[];\n    isAnyItemExpandable: boolean;\n    isExpandable: boolean;\n    isOpen: boolean;\n    onClick?: MouseEventHandler<HTMLDivElement>;\n    onLongPress?: TouchEventHandler<HTMLDivElement>;\n    rightElements?: [ReactNode, ...ReactNode[]];\n    subtitle?: ReactNode;\n    leftElements?: ReactNode;\n    shouldShowRoundImage?: boolean;\n    title: ReactNode;\n};\n\nconst ListItemHead: FC<ListItemHeadProps> = ({\n    hoverItem,\n    icons,\n    images,\n    isAnyItemExpandable,\n    isExpandable,\n    isOpen,\n    onClick,\n    onLongPress,\n    rightElements,\n    subtitle,\n    shouldShowRoundImage,\n    title,\n    leftElements,\n}) => {\n    const [shouldShowHoverItem, setShouldShowHoverItem] = useState(false);\n\n    const longPressTimeoutRef = useRef<number>();\n\n    const handleMouseEnter = useCallback(() => setShouldShowHoverItem(true), []);\n\n    const handleMouseLeave = useCallback(() => setShouldShowHoverItem(false), []);\n\n    const handleTouchStart = useCallback<TouchEventHandler<HTMLDivElement>>(\n        (event) => {\n            longPressTimeoutRef.current = window.setTimeout(() => {\n                if (typeof onLongPress === 'function') {\n                    onLongPress(event);\n                }\n            }, 400);\n        },\n        [onLongPress]\n    );\n\n    const handleTouchEnd = useCallback(() => {\n        clearTimeout(longPressTimeoutRef.current);\n    }, []);\n\n    const iconOrImageElement = useMemo(() => {\n        if (icons) {\n            return <ListItemIcon icons={icons} />;\n        }\n\n        if (images) {\n            return <ListItemImage images={images} shouldShowRoundImage={!!shouldShowRoundImage} />;\n        }\n\n        return undefined;\n    }, [icons, images, shouldShowRoundImage]);\n\n    return (\n        <StyledListItemHead\n            className=\"beta-chayns-list-item-head\"\n            isClickable={typeof onClick === 'function' || isExpandable}\n            onClick={onClick}\n            onMouseEnter={handleMouseEnter}\n            onMouseLeave={handleMouseLeave}\n            onTouchStart={typeof onLongPress === 'function' ? handleTouchStart : undefined}\n            onTouchEnd={typeof onLongPress === 'function' ? handleTouchEnd : undefined}\n        >\n            {isAnyItemExpandable && (\n                <StyledMotionListItemHeadIndicator\n                    animate={{ rotate: isOpen ? 90 : 0 }}\n                    initial={false}\n                    transition={{ type: 'tween' }}\n                >\n                    {isExpandable && <Icon icons={['fa fa-chevron-right']} />}\n                </StyledMotionListItemHeadIndicator>\n            )}\n            {leftElements}\n            {iconOrImageElement}\n            <StyledListItemHeadContent\n                isIconOrImageGiven={iconOrImageElement !== undefined}\n                isOpen={isOpen}\n            >\n                <StyledListItemHeadTitle>\n                    <StyledListItemHeadTitleText className=\"ellipsis\">\n                        {title}\n                    </StyledListItemHeadTitleText>\n                    {rightElements && rightElements.length > 1 && rightElements[0] && (\n                        <StyledListItemHeadTopRightElement>\n                            {rightElements[0]}\n                        </StyledListItemHeadTopRightElement>\n                    )}\n                </StyledListItemHeadTitle>\n                {subtitle && (\n                    <StyledListItemHeadSubtitle>\n                        <StyledListItemHeadSubtitleText className=\"ellipsis\">\n                            {subtitle}\n                        </StyledListItemHeadSubtitleText>\n                        {rightElements && rightElements.length > 1 && rightElements[1] && (\n                            <StyledListItemHeadBottomRightElement>\n                                {rightElements[1]}\n                            </StyledListItemHeadBottomRightElement>\n                        )}\n                    </StyledListItemHeadSubtitle>\n                )}\n            </StyledListItemHeadContent>\n            {rightElements?.length === 1 && (\n                <StyledListItemHeadRightElement>{rightElements[0]}</StyledListItemHeadRightElement>\n            )}\n            {hoverItem && (\n                <StyledMotionListItemHeadHoverItem\n                    animate={{\n                        marginLeft: shouldShowHoverItem ? 8 : 0,\n                        opacity: shouldShowHoverItem ? 1 : 0,\n                        width: shouldShowHoverItem ? 'auto' : 0,\n                    }}\n                    initial={false}\n                    transition={{ duration: 0.15, type: 'tween' }}\n                >\n                    {hoverItem}\n                </StyledMotionListItemHeadHoverItem>\n            )}\n        </StyledListItemHead>\n    );\n};\n\nListItemHead.displayName = 'ListItemHead';\n\nexport default ListItemHead;\n"],"mappings":"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"}
+{"version":3,"file":"ListItemHead.js","names":["_react","_interopRequireWildcard","require","_Icon","_interopRequireDefault","_ListItemIcon","_ListItemImage","_ListItemHead","obj","__esModule","default","_getRequireWildcardCache","e","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","ListItemHead","_ref","hoverItem","icons","images","isAnyItemExpandable","isExpandable","isOpen","onClick","onLongPress","rightElements","subtitle","shouldShowRoundImage","title","leftElements","shouldShowHoverItem","setShouldShowHoverItem","useState","longPressTimeoutRef","useRef","handleMouseEnter","useCallback","handleMouseLeave","handleTouchStart","event","current","window","setTimeout","handleTouchEnd","clearTimeout","iconOrImageElement","useMemo","createElement","undefined","StyledListItemHead","className","isClickable","onMouseEnter","onMouseLeave","onTouchStart","onTouchEnd","StyledMotionListItemHeadIndicator","animate","rotate","initial","transition","type","StyledListItemHeadContent","isIconOrImageGiven","StyledListItemHeadTitle","StyledListItemHeadTitleText","length","StyledListItemHeadTopRightElement","StyledListItemHeadSubtitle","StyledListItemHeadSubtitleText","StyledListItemHeadBottomRightElement","StyledListItemHeadRightElement","StyledMotionListItemHeadHoverItem","marginLeft","opacity","width","duration","displayName","_default","exports"],"sources":["../../../../../src/components/list/list-item/list-item-head/ListItemHead.tsx"],"sourcesContent":["import React, {\n    FC,\n    MouseEventHandler,\n    ReactNode,\n    TouchEventHandler,\n    useCallback,\n    useMemo,\n    useRef,\n    useState,\n} from 'react';\nimport Icon from '../../../icon/Icon';\nimport ListItemIcon from './list-item-icon/ListItemIcon';\nimport ListItemImage from './list-item-image/ListItemImage';\nimport {\n    StyledListItemHead,\n    StyledListItemHeadBottomRightElement,\n    StyledListItemHeadContent,\n    StyledListItemHeadRightElement,\n    StyledListItemHeadSubtitle,\n    StyledListItemHeadSubtitleText,\n    StyledListItemHeadTitle,\n    StyledListItemHeadTitleText,\n    StyledListItemHeadTopRightElement,\n    StyledMotionListItemHeadHoverItem,\n    StyledMotionListItemHeadIndicator,\n} from './ListItemHead.styles';\n\ntype ListItemHeadProps = {\n    hoverItem?: ReactNode;\n    icons?: string[];\n    images?: string[];\n    isAnyItemExpandable: boolean;\n    isExpandable: boolean;\n    isOpen: boolean;\n    onClick?: MouseEventHandler<HTMLDivElement>;\n    onLongPress?: TouchEventHandler<HTMLDivElement>;\n    rightElements?: [ReactNode, ...ReactNode[]];\n    subtitle?: ReactNode;\n    leftElements?: ReactNode;\n    shouldShowRoundImage?: boolean;\n    title: ReactNode;\n};\n\nconst ListItemHead: FC<ListItemHeadProps> = ({\n    hoverItem,\n    icons,\n    images,\n    isAnyItemExpandable,\n    isExpandable,\n    isOpen,\n    onClick,\n    onLongPress,\n    rightElements,\n    subtitle,\n    shouldShowRoundImage,\n    title,\n    leftElements,\n}) => {\n    const [shouldShowHoverItem, setShouldShowHoverItem] = useState(false);\n\n    const longPressTimeoutRef = useRef<number>();\n\n    const handleMouseEnter = useCallback(() => setShouldShowHoverItem(true), []);\n\n    const handleMouseLeave = useCallback(() => setShouldShowHoverItem(false), []);\n\n    const handleTouchStart = useCallback<TouchEventHandler<HTMLDivElement>>(\n        (event) => {\n            longPressTimeoutRef.current = window.setTimeout(() => {\n                if (typeof onLongPress === 'function') {\n                    onLongPress(event);\n                }\n            }, 400);\n        },\n        [onLongPress],\n    );\n\n    const handleTouchEnd = useCallback(() => {\n        clearTimeout(longPressTimeoutRef.current);\n    }, []);\n\n    const iconOrImageElement = useMemo(() => {\n        if (icons) {\n            return <ListItemIcon icons={icons} />;\n        }\n\n        if (images) {\n            return <ListItemImage images={images} shouldShowRoundImage={!!shouldShowRoundImage} />;\n        }\n\n        return undefined;\n    }, [icons, images, shouldShowRoundImage]);\n\n    return (\n        <StyledListItemHead\n            className=\"beta-chayns-list-item-head\"\n            isClickable={typeof onClick === 'function' || isExpandable}\n            onClick={onClick}\n            onMouseEnter={handleMouseEnter}\n            onMouseLeave={handleMouseLeave}\n            onTouchStart={typeof onLongPress === 'function' ? handleTouchStart : undefined}\n            onTouchEnd={typeof onLongPress === 'function' ? handleTouchEnd : undefined}\n        >\n            {isAnyItemExpandable && (\n                <StyledMotionListItemHeadIndicator\n                    animate={{ rotate: isOpen ? 90 : 0 }}\n                    initial={false}\n                    transition={{ type: 'tween' }}\n                >\n                    {isExpandable && <Icon icons={['fa fa-chevron-right']} />}\n                </StyledMotionListItemHeadIndicator>\n            )}\n            {leftElements}\n            {iconOrImageElement}\n            <StyledListItemHeadContent\n                isIconOrImageGiven={iconOrImageElement !== undefined}\n                isOpen={isOpen}\n            >\n                <StyledListItemHeadTitle>\n                    <StyledListItemHeadTitleText className=\"ellipsis\">\n                        {title}\n                    </StyledListItemHeadTitleText>\n                    {rightElements && rightElements.length > 1 && rightElements[0] && (\n                        <StyledListItemHeadTopRightElement>\n                            {rightElements[0]}\n                        </StyledListItemHeadTopRightElement>\n                    )}\n                </StyledListItemHeadTitle>\n                {subtitle && (\n                    <StyledListItemHeadSubtitle>\n                        <StyledListItemHeadSubtitleText className=\"ellipsis\">\n                            {subtitle}\n                        </StyledListItemHeadSubtitleText>\n                        {rightElements && rightElements.length > 1 && rightElements[1] && (\n                            <StyledListItemHeadBottomRightElement>\n                                {rightElements[1]}\n                            </StyledListItemHeadBottomRightElement>\n                        )}\n                    </StyledListItemHeadSubtitle>\n                )}\n            </StyledListItemHeadContent>\n            {rightElements?.length === 1 && (\n                <StyledListItemHeadRightElement>{rightElements[0]}</StyledListItemHeadRightElement>\n            )}\n            {hoverItem && (\n                <StyledMotionListItemHeadHoverItem\n                    animate={{\n                        marginLeft: shouldShowHoverItem ? 8 : 0,\n                        opacity: shouldShowHoverItem ? 1 : 0,\n                        width: shouldShowHoverItem ? 'auto' : 0,\n                    }}\n                    initial={false}\n                    transition={{ duration: 0.15, type: 'tween' }}\n                >\n                    {hoverItem}\n                </StyledMotionListItemHeadHoverItem>\n            )}\n        </StyledListItemHead>\n    );\n};\n\nListItemHead.displayName = 'ListItemHead';\n\nexport default ListItemHead;\n"],"mappings":"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"}

package/lib/components/mention-finder/MentionFinder.d.ts

@@ -1,5 +1,5 @@
 import { FC } from 'react';
-import type { MentionFinderPopupAlignment } from './constants/alignment';
+import type { MentionFinderPopupAlignment } from '../../constants/mentionFinder';
 export type MentionMember = {
     id: string;
     info: string;

package/lib/components/mention-finder/MentionFinder.js.map

@@ -1 +1 @@
-{"version":3,"file":"MentionFinder.js","names":["_framerMotion","require","_react","_interopRequireWildcard","_MentionFinderItem","_interopRequireDefault","_MentionFinder","obj","__esModule","default","_getRequireWildcardCache","e","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","MentionFinder","_ref","inputValue","members","onSelect","popupAlignment","activeMember","setActiveMember","useState","fullMatch","searchString","useMemo","regExpMatchArray","match","toLowerCase","filteredMembers","filter","_ref2","id","info","name","includes","replace","handleKeyDown","useCallback","event","shouldPreventDefault","key","currentIndex","findIndex","_ref3","prevIndex","Math","max","member","_ref4","nextIndex","min","length","preventDefault","stopPropagation","handleMemberClick","handleMemberHover","useEffect","isActiveMemberShown","some","_ref5","items","map","createElement","isActive","onClick","onHover","shouldShowPopup","window","addEventListener","removeEventListener","StyledMentionFinder","className","AnimatePresence","initial","StyledMotionMentionFinderPopup","animate","height","opacity","exit","transition","duration","displayName","_default","exports"],"sources":["../../../src/components/mention-finder/MentionFinder.tsx"],"sourcesContent":["import { AnimatePresence } from 'framer-motion';\nimport React, { FC, useCallback, useEffect, useMemo, useState } from 'react';\nimport type { MentionFinderPopupAlignment } from './constants/alignment';\nimport MentionFinderItem from './mention-finder-item/MentionFinderItem';\nimport { StyledMentionFinder, StyledMotionMentionFinderPopup } from './MentionFinder.styles';\n\nexport type MentionMember = {\n    id: string;\n    info: string;\n    imageUrl: string;\n    name: string;\n};\n\nexport type MentionFinderProps = {\n    /**\n     * The text from the input field\n     */\n    inputValue: string;\n    /**\n     * Members that can be selected\n     */\n    members: MentionMember[];\n    /**\n     * Function to be executed when a member is selected\n     */\n    onSelect: ({ fullMatch, member }: { fullMatch: string; member: MentionMember }) => void;\n    /**\n     * Alignment of the popup\n     */\n    popupAlignment: MentionFinderPopupAlignment;\n};\n\nconst MentionFinder: FC<MentionFinderProps> = ({\n    inputValue,\n    members,\n    onSelect,\n    popupAlignment,\n}) => {\n    const [activeMember, setActiveMember] = useState(members[0]);\n\n    const [fullMatch, searchString] = useMemo(() => {\n        // eslint-disable-next-line no-irregular-whitespace\n        const regExpMatchArray = inputValue.match(/@([^\\s​]*)/);\n\n        return [regExpMatchArray?.[0], regExpMatchArray?.[1]?.toLowerCase() ?? ''];\n    }, [inputValue]);\n\n    const filteredMembers = useMemo(\n        () =>\n            searchString !== ''\n                ? members.filter(\n                      ({ id, info, name }) =>\n                          id.toLowerCase().includes(searchString) ||\n                          info.replace('chayns', '').toLowerCase().includes(searchString) ||\n                          name.toLowerCase().includes(searchString)\n                  )\n                : members,\n        [members, searchString]\n    );\n\n    const handleKeyDown = useCallback(\n        (event: KeyboardEvent) => {\n            let shouldPreventDefault = false;\n\n            if (event.key === 'ArrowUp') {\n                const currentIndex = filteredMembers.findIndex(({ id }) => id === activeMember?.id);\n\n                const prevIndex = Math.max(currentIndex - 1, 0);\n\n                const member = filteredMembers[prevIndex];\n\n                setActiveMember(member);\n\n                shouldPreventDefault = true;\n            } else if (event.key === 'ArrowDown') {\n                const currentIndex = filteredMembers.findIndex(({ id }) => id === activeMember?.id);\n\n                const nextIndex = Math.min(currentIndex + 1, filteredMembers.length - 1);\n\n                const member = filteredMembers[nextIndex];\n\n                setActiveMember(member);\n\n                shouldPreventDefault = true;\n            } else if (event.key === 'Enter') {\n                if (fullMatch && activeMember) {\n                    onSelect({ fullMatch, member: activeMember });\n\n                    shouldPreventDefault = true;\n                }\n            }\n\n            if (shouldPreventDefault) {\n                event.preventDefault();\n                event.stopPropagation();\n            }\n        },\n        [activeMember, filteredMembers, fullMatch, onSelect]\n    );\n\n    const handleMemberClick = useCallback(\n        (member: MentionMember) => {\n            if (fullMatch) {\n                onSelect({ fullMatch, member });\n            }\n        },\n        [fullMatch, onSelect]\n    );\n\n    const handleMemberHover = useCallback((member: MentionMember) => {\n        setActiveMember(member);\n    }, []);\n\n    useEffect(() => {\n        if (filteredMembers.length > 0) {\n            const isActiveMemberShown = filteredMembers.some(({ id }) => id === activeMember?.id);\n\n            if (!isActiveMemberShown) {\n                setActiveMember(filteredMembers[0]);\n            }\n        }\n    }, [activeMember?.id, filteredMembers]);\n\n    const items = useMemo(\n        () =>\n            filteredMembers.map((member) => (\n                <MentionFinderItem\n                    isActive={member.id === activeMember?.id}\n                    key={member.id}\n                    member={member}\n                    onClick={handleMemberClick}\n                    onHover={handleMemberHover}\n                />\n            )),\n        [activeMember, filteredMembers, handleMemberClick, handleMemberHover]\n    );\n\n    const shouldShowPopup = useMemo(() => fullMatch && items.length > 0, [fullMatch, items.length]);\n\n    useEffect(() => {\n        if (shouldShowPopup) {\n            window.addEventListener('keydown', handleKeyDown, true);\n        }\n\n        return () => {\n            window.removeEventListener('keydown', handleKeyDown, true);\n        };\n    }, [handleKeyDown, shouldShowPopup]);\n\n    return (\n        <StyledMentionFinder className=\"beta-chayns-mention-finder\">\n            <AnimatePresence initial={false}>\n                {shouldShowPopup && (\n                    <StyledMotionMentionFinderPopup\n                        animate={{ height: 'auto', opacity: 1 }}\n                        className=\"prevent-lose-focus\"\n                        exit={{ height: 0, opacity: 0 }}\n                        initial={{ height: 0, opacity: 0 }}\n                        popupAlignment={popupAlignment}\n                        transition={{ duration: 0.15 }}\n                    >\n                        {items}\n                    </StyledMotionMentionFinderPopup>\n                )}\n            </AnimatePresence>\n        </StyledMentionFinder>\n    );\n};\n\nMentionFinder.displayName = 'MentionFinder';\n\nexport default MentionFinder;\n"],"mappings":";;;;;;AAAA,IAAAA,aAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAC,uBAAA,CAAAF,OAAA;AAEA,IAAAG,kBAAA,GAAAC,sBAAA,CAAAJ,OAAA;AACA,IAAAK,cAAA,GAAAL,OAAA;AAA6F,SAAAI,uBAAAE,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAAA,SAAAG,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,SAAAR,wBAAAQ,CAAA,EAAAE,CAAA,SAAAA,CAAA,IAAAF,CAAA,IAAAA,CAAA,CAAAH,UAAA,SAAAG,CAAA,eAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,WAAAF,OAAA,EAAAE,CAAA,QAAAG,CAAA,GAAAJ,wBAAA,CAAAG,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAC,GAAA,CAAAJ,CAAA,UAAAG,CAAA,CAAAE,GAAA,CAAAL,CAAA,OAAAM,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAZ,CAAA,oBAAAY,CAAA,IAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAf,CAAA,EAAAY,CAAA,SAAAI,CAAA,GAAAR,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAX,CAAA,EAAAY,CAAA,UAAAI,CAAA,KAAAA,CAAA,CAAAX,GAAA,IAAAW,CAAA,CAAAC,GAAA,IAAAR,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAI,CAAA,IAAAV,CAAA,CAAAM,CAAA,IAAAZ,CAAA,CAAAY,CAAA,YAAAN,CAAA,CAAAR,OAAA,GAAAE,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAc,GAAA,CAAAjB,CAAA,EAAAM,CAAA,GAAAA,CAAA;AA4B7F,MAAMY,aAAqC,GAAGC,IAAA,IAKxC;EAAA,IALyC;IAC3CC,UAAU;IACVC,OAAO;IACPC,QAAQ;IACRC;EACJ,CAAC,GAAAJ,IAAA;EACG,MAAM,CAACK,YAAY,EAAEC,eAAe,CAAC,GAAG,IAAAC,eAAQ,EAACL,OAAO,CAAC,CAAC,CAAC,CAAC;EAE5D,MAAM,CAACM,SAAS,EAAEC,YAAY,CAAC,GAAG,IAAAC,cAAO,EAAC,MAAM;IAC5C;IACA,MAAMC,gBAAgB,GAAGV,UAAU,CAACW,KAAK,CAAC,YAAY,CAAC;IAEvD,OAAO,CAACD,gBAAgB,GAAG,CAAC,CAAC,EAAEA,gBAAgB,GAAG,CAAC,CAAC,EAAEE,WAAW,CAAC,CAAC,IAAI,EAAE,CAAC;EAC9E,CAAC,EAAE,CAACZ,UAAU,CAAC,CAAC;EAEhB,MAAMa,eAAe,GAAG,IAAAJ,cAAO,EAC3B,MACID,YAAY,KAAK,EAAE,GACbP,OAAO,CAACa,MAAM,CACVC,KAAA;IAAA,IAAC;MAAEC,EAAE;MAAEC,IAAI;MAAEC;IAAK,CAAC,GAAAH,KAAA;IAAA,OACfC,EAAE,CAACJ,WAAW,CAAC,CAAC,CAACO,QAAQ,CAACX,YAAY,CAAC,IACvCS,IAAI,CAACG,OAAO,CAAC,QAAQ,EAAE,EAAE,CAAC,CAACR,WAAW,CAAC,CAAC,CAACO,QAAQ,CAACX,YAAY,CAAC,IAC/DU,IAAI,CAACN,WAAW,CAAC,CAAC,CAACO,QAAQ,CAACX,YAAY,CAAC;EAAA,CACjD,CAAC,GACDP,OAAO,EACjB,CAACA,OAAO,EAAEO,YAAY,CAC1B,CAAC;EAED,MAAMa,aAAa,GAAG,IAAAC,kBAAW,EAC5BC,KAAoB,IAAK;IACtB,IAAIC,oBAAoB,GAAG,KAAK;IAEhC,IAAID,KAAK,CAACE,GAAG,KAAK,SAAS,EAAE;MACzB,MAAMC,YAAY,GAAGb,eAAe,CAACc,SAAS,CAACC,KAAA;QAAA,IAAC;UAAEZ;QAAG,CAAC,GAAAY,KAAA;QAAA,OAAKZ,EAAE,KAAKZ,YAAY,EAAEY,EAAE;MAAA,EAAC;MAEnF,MAAMa,SAAS,GAAGC,IAAI,CAACC,GAAG,CAACL,YAAY,GAAG,CAAC,EAAE,CAAC,CAAC;MAE/C,MAAMM,MAAM,GAAGnB,eAAe,CAACgB,SAAS,CAAC;MAEzCxB,eAAe,CAAC2B,MAAM,CAAC;MAEvBR,oBAAoB,GAAG,IAAI;IAC/B,CAAC,MAAM,IAAID,KAAK,CAACE,GAAG,KAAK,WAAW,EAAE;MAClC,MAAMC,YAAY,GAAGb,eAAe,CAACc,SAAS,CAACM,KAAA;QAAA,IAAC;UAAEjB;QAAG,CAAC,GAAAiB,KAAA;QAAA,OAAKjB,EAAE,KAAKZ,YAAY,EAAEY,EAAE;MAAA,EAAC;MAEnF,MAAMkB,SAAS,GAAGJ,IAAI,CAACK,GAAG,CAACT,YAAY,GAAG,CAAC,EAAEb,eAAe,CAACuB,MAAM,GAAG,CAAC,CAAC;MAExE,MAAMJ,MAAM,GAAGnB,eAAe,CAACqB,SAAS,CAAC;MAEzC7B,eAAe,CAAC2B,MAAM,CAAC;MAEvBR,oBAAoB,GAAG,IAAI;IAC/B,CAAC,MAAM,IAAID,KAAK,CAACE,GAAG,KAAK,OAAO,EAAE;MAC9B,IAAIlB,SAAS,IAAIH,YAAY,EAAE;QAC3BF,QAAQ,CAAC;UAAEK,SAAS;UAAEyB,MAAM,EAAE5B;QAAa,CAAC,CAAC;QAE7CoB,oBAAoB,GAAG,IAAI;MAC/B;IACJ;IAEA,IAAIA,oBAAoB,EAAE;MACtBD,KAAK,CAACc,cAAc,CAAC,CAAC;MACtBd,KAAK,CAACe,eAAe,CAAC,CAAC;IAC3B;EACJ,CAAC,EACD,CAAClC,YAAY,EAAES,eAAe,EAAEN,SAAS,EAAEL,QAAQ,CACvD,CAAC;EAED,MAAMqC,iBAAiB,GAAG,IAAAjB,kBAAW,EAChCU,MAAqB,IAAK;IACvB,IAAIzB,SAAS,EAAE;MACXL,QAAQ,CAAC;QAAEK,SAAS;QAAEyB;MAAO,CAAC,CAAC;IACnC;EACJ,CAAC,EACD,CAACzB,SAAS,EAAEL,QAAQ,CACxB,CAAC;EAED,MAAMsC,iBAAiB,GAAG,IAAAlB,kBAAW,EAAEU,MAAqB,IAAK;IAC7D3B,eAAe,CAAC2B,MAAM,CAAC;EAC3B,CAAC,EAAE,EAAE,CAAC;EAEN,IAAAS,gBAAS,EAAC,MAAM;IACZ,IAAI5B,eAAe,CAACuB,MAAM,GAAG,CAAC,EAAE;MAC5B,MAAMM,mBAAmB,GAAG7B,eAAe,CAAC8B,IAAI,CAACC,KAAA;QAAA,IAAC;UAAE5B;QAAG,CAAC,GAAA4B,KAAA;QAAA,OAAK5B,EAAE,KAAKZ,YAAY,EAAEY,EAAE;MAAA,EAAC;MAErF,IAAI,CAAC0B,mBAAmB,EAAE;QACtBrC,eAAe,CAACQ,eAAe,CAAC,CAAC,CAAC,CAAC;MACvC;IACJ;EACJ,CAAC,EAAE,CAACT,YAAY,EAAEY,EAAE,EAAEH,eAAe,CAAC,CAAC;EAEvC,MAAMgC,KAAK,GAAG,IAAApC,cAAO,EACjB,MACII,eAAe,CAACiC,GAAG,CAAEd,MAAM,iBACvB7D,MAAA,CAAAO,OAAA,CAAAqE,aAAA,CAAC1E,kBAAA,CAAAK,OAAiB;IACdsE,QAAQ,EAAEhB,MAAM,CAAChB,EAAE,KAAKZ,YAAY,EAAEY,EAAG;IACzCS,GAAG,EAAEO,MAAM,CAAChB,EAAG;IACfgB,MAAM,EAAEA,MAAO;IACfiB,OAAO,EAAEV,iBAAkB;IAC3BW,OAAO,EAAEV;EAAkB,CAC9B,CACJ,CAAC,EACN,CAACpC,YAAY,EAAES,eAAe,EAAE0B,iBAAiB,EAAEC,iBAAiB,CACxE,CAAC;EAED,MAAMW,eAAe,GAAG,IAAA1C,cAAO,EAAC,MAAMF,SAAS,IAAIsC,KAAK,CAACT,MAAM,GAAG,CAAC,EAAE,CAAC7B,SAAS,EAAEsC,KAAK,CAACT,MAAM,CAAC,CAAC;EAE/F,IAAAK,gBAAS,EAAC,MAAM;IACZ,IAAIU,eAAe,EAAE;MACjBC,MAAM,CAACC,gBAAgB,CAAC,SAAS,EAAEhC,aAAa,EAAE,IAAI,CAAC;IAC3D;IAEA,OAAO,MAAM;MACT+B,MAAM,CAACE,mBAAmB,CAAC,SAAS,EAAEjC,aAAa,EAAE,IAAI,CAAC;IAC9D,CAAC;EACL,CAAC,EAAE,CAACA,aAAa,EAAE8B,eAAe,CAAC,CAAC;EAEpC,oBACIhF,MAAA,CAAAO,OAAA,CAAAqE,aAAA,CAACxE,cAAA,CAAAgF,mBAAmB;IAACC,SAAS,EAAC;EAA4B,gBACvDrF,MAAA,CAAAO,OAAA,CAAAqE,aAAA,CAAC9E,aAAA,CAAAwF,eAAe;IAACC,OAAO,EAAE;EAAM,GAC3BP,eAAe,iBACZhF,MAAA,CAAAO,OAAA,CAAAqE,aAAA,CAACxE,cAAA,CAAAoF,8BAA8B;IAC3BC,OAAO,EAAE;MAAEC,MAAM,EAAE,MAAM;MAAEC,OAAO,EAAE;IAAE,CAAE;IACxCN,SAAS,EAAC,oBAAoB;IAC9BO,IAAI,EAAE;MAAEF,MAAM,EAAE,CAAC;MAAEC,OAAO,EAAE;IAAE,CAAE;IAChCJ,OAAO,EAAE;MAAEG,MAAM,EAAE,CAAC;MAAEC,OAAO,EAAE;IAAE,CAAE;IACnC3D,cAAc,EAAEA,cAAe;IAC/B6D,UAAU,EAAE;MAAEC,QAAQ,EAAE;IAAK;EAAE,GAE9BpB,KAC2B,CAEvB,CACA,CAAC;AAE9B,CAAC;AAED/C,aAAa,CAACoE,WAAW,GAAG,eAAe;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAA1F,OAAA,GAE7BoB,aAAa"}
+{"version":3,"file":"MentionFinder.js","names":["_framerMotion","require","_react","_interopRequireWildcard","_MentionFinderItem","_interopRequireDefault","_MentionFinder","obj","__esModule","default","_getRequireWildcardCache","e","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","MentionFinder","_ref","inputValue","members","onSelect","popupAlignment","activeMember","setActiveMember","useState","fullMatch","searchString","useMemo","regExpMatchArray","match","toLowerCase","filteredMembers","filter","_ref2","id","info","name","includes","replace","handleKeyDown","useCallback","event","shouldPreventDefault","key","currentIndex","findIndex","_ref3","prevIndex","Math","max","member","_ref4","nextIndex","min","length","preventDefault","stopPropagation","handleMemberClick","handleMemberHover","useEffect","isActiveMemberShown","some","_ref5","items","map","createElement","isActive","onClick","onHover","shouldShowPopup","window","addEventListener","removeEventListener","StyledMentionFinder","className","AnimatePresence","initial","StyledMotionMentionFinderPopup","animate","height","opacity","exit","transition","duration","displayName","_default","exports"],"sources":["../../../src/components/mention-finder/MentionFinder.tsx"],"sourcesContent":["import { AnimatePresence } from 'framer-motion';\nimport React, { FC, useCallback, useEffect, useMemo, useState } from 'react';\nimport type { MentionFinderPopupAlignment } from '../../constants/mentionFinder';\nimport MentionFinderItem from './mention-finder-item/MentionFinderItem';\nimport { StyledMentionFinder, StyledMotionMentionFinderPopup } from './MentionFinder.styles';\n\nexport type MentionMember = {\n    id: string;\n    info: string;\n    imageUrl: string;\n    name: string;\n};\n\nexport type MentionFinderProps = {\n    /**\n     * The text from the input field\n     */\n    inputValue: string;\n    /**\n     * Members that can be selected\n     */\n    members: MentionMember[];\n    /**\n     * Function to be executed when a member is selected\n     */\n    onSelect: ({ fullMatch, member }: { fullMatch: string; member: MentionMember }) => void;\n    /**\n     * Alignment of the popup\n     */\n    popupAlignment: MentionFinderPopupAlignment;\n};\n\nconst MentionFinder: FC<MentionFinderProps> = ({\n    inputValue,\n    members,\n    onSelect,\n    popupAlignment,\n}) => {\n    const [activeMember, setActiveMember] = useState(members[0]);\n\n    const [fullMatch, searchString] = useMemo(() => {\n        // eslint-disable-next-line no-irregular-whitespace\n        const regExpMatchArray = inputValue.match(/@([^\\s​]*)/);\n\n        return [regExpMatchArray?.[0], regExpMatchArray?.[1]?.toLowerCase() ?? ''];\n    }, [inputValue]);\n\n    const filteredMembers = useMemo(\n        () =>\n            searchString !== ''\n                ? members.filter(\n                      ({ id, info, name }) =>\n                          id.toLowerCase().includes(searchString) ||\n                          info.replace('chayns', '').toLowerCase().includes(searchString) ||\n                          name.toLowerCase().includes(searchString),\n                  )\n                : members,\n        [members, searchString],\n    );\n\n    const handleKeyDown = useCallback(\n        (event: KeyboardEvent) => {\n            let shouldPreventDefault = false;\n\n            if (event.key === 'ArrowUp') {\n                const currentIndex = filteredMembers.findIndex(({ id }) => id === activeMember?.id);\n\n                const prevIndex = Math.max(currentIndex - 1, 0);\n\n                const member = filteredMembers[prevIndex];\n\n                setActiveMember(member);\n\n                shouldPreventDefault = true;\n            } else if (event.key === 'ArrowDown') {\n                const currentIndex = filteredMembers.findIndex(({ id }) => id === activeMember?.id);\n\n                const nextIndex = Math.min(currentIndex + 1, filteredMembers.length - 1);\n\n                const member = filteredMembers[nextIndex];\n\n                setActiveMember(member);\n\n                shouldPreventDefault = true;\n            } else if (event.key === 'Enter') {\n                if (fullMatch && activeMember) {\n                    onSelect({ fullMatch, member: activeMember });\n\n                    shouldPreventDefault = true;\n                }\n            }\n\n            if (shouldPreventDefault) {\n                event.preventDefault();\n                event.stopPropagation();\n            }\n        },\n        [activeMember, filteredMembers, fullMatch, onSelect],\n    );\n\n    const handleMemberClick = useCallback(\n        (member: MentionMember) => {\n            if (fullMatch) {\n                onSelect({ fullMatch, member });\n            }\n        },\n        [fullMatch, onSelect],\n    );\n\n    const handleMemberHover = useCallback((member: MentionMember) => {\n        setActiveMember(member);\n    }, []);\n\n    useEffect(() => {\n        if (filteredMembers.length > 0) {\n            const isActiveMemberShown = filteredMembers.some(({ id }) => id === activeMember?.id);\n\n            if (!isActiveMemberShown) {\n                setActiveMember(filteredMembers[0]);\n            }\n        }\n    }, [activeMember?.id, filteredMembers]);\n\n    const items = useMemo(\n        () =>\n            filteredMembers.map((member) => (\n                <MentionFinderItem\n                    isActive={member.id === activeMember?.id}\n                    key={member.id}\n                    member={member}\n                    onClick={handleMemberClick}\n                    onHover={handleMemberHover}\n                />\n            )),\n        [activeMember, filteredMembers, handleMemberClick, handleMemberHover],\n    );\n\n    const shouldShowPopup = useMemo(() => fullMatch && items.length > 0, [fullMatch, items.length]);\n\n    useEffect(() => {\n        if (shouldShowPopup) {\n            window.addEventListener('keydown', handleKeyDown, true);\n        }\n\n        return () => {\n            window.removeEventListener('keydown', handleKeyDown, true);\n        };\n    }, [handleKeyDown, shouldShowPopup]);\n\n    return (\n        <StyledMentionFinder className=\"beta-chayns-mention-finder\">\n            <AnimatePresence initial={false}>\n                {shouldShowPopup && (\n                    <StyledMotionMentionFinderPopup\n                        animate={{ height: 'auto', opacity: 1 }}\n                        className=\"prevent-lose-focus\"\n                        exit={{ height: 0, opacity: 0 }}\n                        initial={{ height: 0, opacity: 0 }}\n                        popupAlignment={popupAlignment}\n                        transition={{ duration: 0.15 }}\n                    >\n                        {items}\n                    </StyledMotionMentionFinderPopup>\n                )}\n            </AnimatePresence>\n        </StyledMentionFinder>\n    );\n};\n\nMentionFinder.displayName = 'MentionFinder';\n\nexport default MentionFinder;\n"],"mappings":"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"}

package/lib/components/mention-finder/MentionFinder.styles.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.StyledMotionMentionFinderPopup = exports.StyledMentionFinder = void 0;
 var _framerMotion = require("framer-motion");
 var _styledComponents = _interopRequireWildcard(require("styled-components"));
-var _alignment = require("./constants/alignment");
+var _mentionFinder = require("../../constants/mentionFinder");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 const StyledMentionFinder = exports.StyledMentionFinder = _styledComponents.default.div`
@@ -33,11 +33,11 @@ const StyledMotionMentionFinderPopup = exports.StyledMotionMentionFinderPopup =
     popupAlignment
   } = _ref2;
   switch (popupAlignment) {
-    case _alignment.MentionFinderPopupAlignment.Bottom:
+    case _mentionFinder.MentionFinderPopupAlignment.Bottom:
       return (0, _styledComponents.css)`
                     top: 0;
                 `;
-    case _alignment.MentionFinderPopupAlignment.Top:
+    case _mentionFinder.MentionFinderPopupAlignment.Top:
       return (0, _styledComponents.css)`
                     bottom: 0;
                 `;

package/lib/components/mention-finder/MentionFinder.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"MentionFinder.styles.js","names":["_framerMotion","require","_styledComponents","_interopRequireWildcard","_alignment","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","StyledMentionFinder","exports","styled","div","StyledMotionMentionFinderPopup","motion","_ref","theme","_ref2","popupAlignment","MentionFinderPopupAlignment","Bottom","css","Top","undefined","_ref3","_ref4"],"sources":["../../../src/components/mention-finder/MentionFinder.styles.ts"],"sourcesContent":["import { motion } from 'framer-motion';\nimport styled, { css } from 'styled-components';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\nimport { MentionFinderPopupAlignment } from './constants/alignment';\nimport type { MentionFinderProps } from './MentionFinder';\n\nexport const StyledMentionFinder = styled.div`\n    position: relative;\n`;\n\ntype StyledMentionFinderPopupProps = WithTheme<Pick<MentionFinderProps, 'popupAlignment'>>;\n\nexport const StyledMotionMentionFinderPopup = styled(motion.div)<StyledMentionFinderPopupProps>`\n    background-color: ${({ theme }: StyledMentionFinderPopupProps) => theme['001']};\n    border: 1px solid rgba(0, 0, 0, 0.1);\n    border-radius: 3px;\n    box-shadow: 1px 3px 8px rgba(0, 0, 0, 0.1);\n    left: 0;\n    max-height: 300px;\n    overflow-y: scroll;\n    position: absolute;\n    width: 100%;\n\n    ${({ popupAlignment }) => {\n        switch (popupAlignment) {\n            case MentionFinderPopupAlignment.Bottom:\n                return css`\n                    top: 0;\n                `;\n            case MentionFinderPopupAlignment.Top:\n                return css`\n                    bottom: 0;\n                `;\n            default:\n                return undefined;\n        }\n    }}\n\n    // Styles for custom scrollbar\n    &::-webkit-scrollbar {\n        width: 5px;\n    }\n\n    &::-webkit-scrollbar-track {\n        background-color: transparent;\n    }\n\n    &::-webkit-scrollbar-button {\n        background-color: transparent;\n        height: 5px;\n    }\n\n    &::-webkit-scrollbar-thumb {\n        background-color: rgba(\n            ${({ theme }: StyledMentionFinderPopupProps) => theme['text-rgb']},\n            0.15\n        );\n        border-radius: 20px;\n    }\n\n    // Scrollbar styles for Firefox. The above styles are not supported in Firefox, these styles are\n    // only supported in Firefox:\n    * {\n        scrollbar-color: rgba(\n                ${({ theme }: StyledMentionFinderPopupProps) => theme['text-rgb']},\n                0.15\n            )\n            transparent;\n        scrollbar-width: thin;\n    }\n`;\n"],"mappings":";;;;;;AAAA,IAAAA,aAAA,GAAAC,OAAA;AACA,IAAAC,iBAAA,GAAAC,uBAAA,CAAAF,OAAA;AAEA,IAAAG,UAAA,GAAAH,OAAA;AAAoE,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,IAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAjB,CAAA,EAAAc,CAAA,SAAAI,CAAA,GAAAR,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAb,CAAA,EAAAc,CAAA,UAAAI,CAAA,KAAAA,CAAA,CAAAX,GAAA,IAAAW,CAAA,CAAAC,GAAA,IAAAR,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAI,CAAA,IAAAV,CAAA,CAAAM,CAAA,IAAAd,CAAA,CAAAc,CAAA,YAAAN,CAAA,CAAAH,OAAA,GAAAL,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAgB,GAAA,CAAAnB,CAAA,EAAAQ,CAAA,GAAAA,CAAA;AAG7D,MAAMY,mBAAmB,GAAAC,OAAA,CAAAD,mBAAA,GAAGE,yBAAM,CAACC,GAAI;AAC9C;AACA,CAAC;AAIM,MAAMC,8BAA8B,GAAAH,OAAA,CAAAG,8BAAA,GAAG,IAAAF,yBAAM,EAACG,oBAAM,CAACF,GAAG,CAAiC;AAChG,wBAAwBG,IAAA;EAAA,IAAC;IAAEC;EAAqC,CAAC,GAAAD,IAAA;EAAA,OAAKC,KAAK,CAAC,KAAK,CAAC;AAAA,CAAC;AACnF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMC,KAAA,IAAwB;EAAA,IAAvB;IAAEC;EAAe,CAAC,GAAAD,KAAA;EACjB,QAAQC,cAAc;IAClB,KAAKC,sCAA2B,CAACC,MAAM;MACnC,OAAO,IAAAC,qBAAG,CAAC;AAC3B;AACA,iBAAiB;IACL,KAAKF,sCAA2B,CAACG,GAAG;MAChC,OAAO,IAAAD,qBAAG,CAAC;AAC3B;AACA,iBAAiB;IACL;MACI,OAAOE,SAAS;EACxB;AACJ,CAAE;AACN;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,cAAcC,KAAA;EAAA,IAAC;IAAER;EAAqC,CAAC,GAAAQ,KAAA;EAAA,OAAKR,KAAK,CAAC,UAAU,CAAC;AAAA,CAAC;AAC9E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,kBAAkBS,KAAA;EAAA,IAAC;IAAET;EAAqC,CAAC,GAAAS,KAAA;EAAA,OAAKT,KAAK,CAAC,UAAU,CAAC;AAAA,CAAC;AAClF;AACA;AACA;AACA;AACA;AACA,CAAC"}
+{"version":3,"file":"MentionFinder.styles.js","names":["_framerMotion","require","_styledComponents","_interopRequireWildcard","_mentionFinder","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","StyledMentionFinder","exports","styled","div","StyledMotionMentionFinderPopup","motion","_ref","theme","_ref2","popupAlignment","MentionFinderPopupAlignment","Bottom","css","Top","undefined","_ref3","_ref4"],"sources":["../../../src/components/mention-finder/MentionFinder.styles.ts"],"sourcesContent":["import { motion } from 'framer-motion';\nimport styled, { css } from 'styled-components';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\nimport { MentionFinderPopupAlignment } from '../../constants/mentionFinder';\nimport type { MentionFinderProps } from './MentionFinder';\n\nexport const StyledMentionFinder = styled.div`\n    position: relative;\n`;\n\ntype StyledMentionFinderPopupProps = WithTheme<Pick<MentionFinderProps, 'popupAlignment'>>;\n\nexport const StyledMotionMentionFinderPopup = styled(motion.div)<StyledMentionFinderPopupProps>`\n    background-color: ${({ theme }: StyledMentionFinderPopupProps) => theme['001']};\n    border: 1px solid rgba(0, 0, 0, 0.1);\n    border-radius: 3px;\n    box-shadow: 1px 3px 8px rgba(0, 0, 0, 0.1);\n    left: 0;\n    max-height: 300px;\n    overflow-y: scroll;\n    position: absolute;\n    width: 100%;\n\n    ${({ popupAlignment }) => {\n        switch (popupAlignment) {\n            case MentionFinderPopupAlignment.Bottom:\n                return css`\n                    top: 0;\n                `;\n            case MentionFinderPopupAlignment.Top:\n                return css`\n                    bottom: 0;\n                `;\n            default:\n                return undefined;\n        }\n    }}\n\n    // Styles for custom scrollbar\n    &::-webkit-scrollbar {\n        width: 5px;\n    }\n\n    &::-webkit-scrollbar-track {\n        background-color: transparent;\n    }\n\n    &::-webkit-scrollbar-button {\n        background-color: transparent;\n        height: 5px;\n    }\n\n    &::-webkit-scrollbar-thumb {\n        background-color: rgba(\n            ${({ theme }: StyledMentionFinderPopupProps) => theme['text-rgb']},\n            0.15\n        );\n        border-radius: 20px;\n    }\n\n    // Scrollbar styles for Firefox. The above styles are not supported in Firefox, these styles are\n    // only supported in Firefox:\n    * {\n        scrollbar-color: rgba(\n                ${({ theme }: StyledMentionFinderPopupProps) => theme['text-rgb']},\n                0.15\n            )\n            transparent;\n        scrollbar-width: thin;\n    }\n`;\n"],"mappings":";;;;;;AAAA,IAAAA,aAAA,GAAAC,OAAA;AACA,IAAAC,iBAAA,GAAAC,uBAAA,CAAAF,OAAA;AAEA,IAAAG,cAAA,GAAAH,OAAA;AAA4E,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,IAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAjB,CAAA,EAAAc,CAAA,SAAAI,CAAA,GAAAR,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAb,CAAA,EAAAc,CAAA,UAAAI,CAAA,KAAAA,CAAA,CAAAX,GAAA,IAAAW,CAAA,CAAAC,GAAA,IAAAR,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAI,CAAA,IAAAV,CAAA,CAAAM,CAAA,IAAAd,CAAA,CAAAc,CAAA,YAAAN,CAAA,CAAAH,OAAA,GAAAL,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAgB,GAAA,CAAAnB,CAAA,EAAAQ,CAAA,GAAAA,CAAA;AAGrE,MAAMY,mBAAmB,GAAAC,OAAA,CAAAD,mBAAA,GAAGE,yBAAM,CAACC,GAAI;AAC9C;AACA,CAAC;AAIM,MAAMC,8BAA8B,GAAAH,OAAA,CAAAG,8BAAA,GAAG,IAAAF,yBAAM,EAACG,oBAAM,CAACF,GAAG,CAAiC;AAChG,wBAAwBG,IAAA;EAAA,IAAC;IAAEC;EAAqC,CAAC,GAAAD,IAAA;EAAA,OAAKC,KAAK,CAAC,KAAK,CAAC;AAAA,CAAC;AACnF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMC,KAAA,IAAwB;EAAA,IAAvB;IAAEC;EAAe,CAAC,GAAAD,KAAA;EACjB,QAAQC,cAAc;IAClB,KAAKC,0CAA2B,CAACC,MAAM;MACnC,OAAO,IAAAC,qBAAG,CAAC;AAC3B;AACA,iBAAiB;IACL,KAAKF,0CAA2B,CAACG,GAAG;MAChC,OAAO,IAAAD,qBAAG,CAAC;AAC3B;AACA,iBAAiB;IACL;MACI,OAAOE,SAAS;EACxB;AACJ,CAAE;AACN;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,cAAcC,KAAA;EAAA,IAAC;IAAER;EAAqC,CAAC,GAAAQ,KAAA;EAAA,OAAKR,KAAK,CAAC,UAAU,CAAC;AAAA,CAAC;AAC9E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,kBAAkBS,KAAA;EAAA,IAAC;IAAET;EAAqC,CAAC,GAAAS,KAAA;EAAA,OAAKT,KAAK,CAAC,UAAU,CAAC;AAAA,CAAC;AAClF;AACA;AACA;AACA;AACA;AACA,CAAC"}

package/lib/components/number-input/NumberInput.js

@@ -6,8 +6,8 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _Input = _interopRequireDefault(require("../input/Input"));
-var _number = require("./constants/number");
-var _number2 = require("./utils/number");
+var _numberInput = require("../../constants/numberInput");
+var _numberInput2 = require("../../utils/numberInput");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
@@ -39,9 +39,9 @@ const NumberInput = _ref => {
     }
     const sanitizedValueString = newValue
     // Removes everything except numbers, commas and points
-    .replace(_number.NUMBER_CLEAR_REGEX, '');
+    .replace(_numberInput.NUMBER_CLEAR_REGEX, '');
     const valueToCheck = sanitizedValueString.replaceAll(',', '.');
-    if (!(0, _number2.isValidString)({
+    if (!(0, _numberInput2.isValidString)({
       string: valueToCheck,
       isMoneyInput,
       isDecimalInput,
@@ -59,7 +59,7 @@ const NumberInput = _ref => {
     let isInvalid = false;
     let parsedNumber = null;
     if (!isTimeInput) {
-      parsedNumber = (0, _number2.parseFloatWithDecimals)({
+      parsedNumber = (0, _numberInput2.parseFloatWithDecimals)({
         stringValue: sanitizedValue.replace(',', '.').replaceAll(':', ''),
         decimals: isMoneyInput ? 2 : undefined
       });
@@ -68,7 +68,7 @@ const NumberInput = _ref => {
       }
       setIsValueInvalid(isInvalid);
     }
-    const newStringValue = plainText.length === 0 ? '' : (0, _number2.formateNumber)({
+    const newStringValue = plainText.length === 0 ? '' : (0, _numberInput2.formateNumber)({
       number: isTimeInput ? sanitizedValue : parsedNumber,
       isMoneyInput,
       isTimeInput
@@ -104,7 +104,7 @@ const NumberInput = _ref => {
   (0, _react.useEffect)(() => {
     let parsedNumber = null;
     if (!isTimeInput) {
-      parsedNumber = (0, _number2.parseFloatWithDecimals)({
+      parsedNumber = (0, _numberInput2.parseFloatWithDecimals)({
         stringValue: plainText.replace(',', '.').replaceAll(':', ''),
         decimals: isMoneyInput ? 2 : undefined
       });
@@ -114,7 +114,7 @@ const NumberInput = _ref => {
         setIsValueInvalid(parsedNumber > maxNumber || parsedNumber < minNumber);
       }
     }
-    setFormattedValue(plainText.length === 0 ? '' : (0, _number2.formateNumber)({
+    setFormattedValue(plainText.length === 0 ? '' : (0, _numberInput2.formateNumber)({
       number: isTimeInput ? plainText : parsedNumber,
       isMoneyInput,
       isTimeInput

package/lib/components/number-input/NumberInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"NumberInput.js","names":["_react","_interopRequireWildcard","require","_Input","_interopRequireDefault","_number","_number2","obj","__esModule","default","_getRequireWildcardCache","e","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","NumberInput","_ref","isDecimalInput","isMoneyInput","isTimeInput","maxNumber","Infinity","value","placeholder","onBlur","isDisabled","onChange","shouldShowOnlyBottomBorder","minNumber","plainText","setPlainText","useState","formattedValue","setFormattedValue","hasFocus","setHasFocus","isValueInvalid","setIsValueInvalid","localPlaceholder","undefined","onLocalChange","event","newValue","target","replaceAll","length","sanitizedValueString","replace","NUMBER_CLEAR_REGEX","valueToCheck","isValidString","string","onLocalBlur","sanitizedValue","isInvalid","parsedNumber","parseFloatWithDecimals","stringValue","decimals","newStringValue","formateNumber","number","onLocalFocus","useEffect","createElement","inputMode","onFocus","displayName","_default","exports"],"sources":["../../../src/components/number-input/NumberInput.tsx"],"sourcesContent":["import React, { ChangeEventHandler, FC, useEffect, useState } from 'react';\nimport Input from '../input/Input';\nimport { NUMBER_CLEAR_REGEX } from './constants/number';\nimport { formateNumber, isValidString, parseFloatWithDecimals } from './utils/number';\n\nexport type NumberInputProps = {\n    /**\n     * Applies rules for decimal input.\n     * Enables the user to input one zero as number before the comma\n     */\n    isDecimalInput?: boolean;\n    /**\n     * Whether the input is disabled\n     */\n    isDisabled?: boolean;\n    /**\n     * Applies rules for money input.\n     * Rules: only two decimal places, one zero before the comma\n     */\n    isMoneyInput?: boolean;\n    /**\n     * Whether the value should be formatted as a time.\n     */\n    isTimeInput?: boolean;\n    /**\n     * Limits the number to this value\n     */\n    maxNumber?: number;\n    /**\n     * Limits the number to this value\n     */\n    minNumber?: number;\n    /**\n     * Callback function that is called when the input gets out of focus\n     */\n    onBlur?: (newNumber: number | string | null, isInvalid: boolean) => void;\n    /**\n     * Callback function that is called when the input changes\n     * It will pass the text from the input\n     */\n    onChange?: (newValue: string) => void;\n    /**\n     * Placeholder for the input field\n     */\n    placeholder?: string;\n    /**\n     * Whether only the bottom border should be displayed\n     */\n    shouldShowOnlyBottomBorder?: boolean;\n    /**\n     * The value, that should be displayed in the input, when it is in focus.\n     * You can also pass a stringified number as default value.\n     * NOTE: If you pass a stringified number, it will be formatted to the selected format\n     */\n    value?: string;\n};\n\nconst NumberInput: FC<NumberInputProps> = ({\n    isDecimalInput,\n    isMoneyInput,\n    isTimeInput,\n    maxNumber = Infinity,\n    value,\n    placeholder,\n    onBlur,\n    isDisabled,\n    onChange,\n    shouldShowOnlyBottomBorder,\n    minNumber = -Infinity,\n}) => {\n    // the plainText will be shown in the input, when it is in focus\n    const [plainText, setPlainText] = useState<string>('');\n    // the formattedValue will be shown in the input, when it is not in focus\n    const [formattedValue, setFormattedValue] = useState<string>('');\n    const [hasFocus, setHasFocus] = useState<boolean>(false);\n\n    const [isValueInvalid, setIsValueInvalid] = useState(false);\n    const localPlaceholder = placeholder ?? (isMoneyInput ? '€' : undefined);\n\n    const onLocalChange: ChangeEventHandler<HTMLInputElement> = (event) => {\n        const newValue = event.target.value;\n\n        if (newValue.replaceAll(':', '').length > 4) {\n            return;\n        }\n\n        const sanitizedValueString = newValue\n            // Removes everything except numbers, commas and points\n            .replace(NUMBER_CLEAR_REGEX, '');\n\n        const valueToCheck = sanitizedValueString.replaceAll(',', '.');\n\n        if (!isValidString({ string: valueToCheck, isMoneyInput, isDecimalInput, isTimeInput })) {\n            return;\n        }\n\n        setPlainText(sanitizedValueString.replaceAll('.', ','));\n\n        if (typeof onChange === 'function') {\n            onChange(sanitizedValueString.replaceAll('.', ','));\n        }\n    };\n\n    const onLocalBlur = () => {\n        const sanitizedValue = plainText.length === 0 ? '0' : plainText;\n        let isInvalid = false;\n        let parsedNumber = null;\n\n        if (!isTimeInput) {\n            parsedNumber = parseFloatWithDecimals({\n                stringValue: sanitizedValue.replace(',', '.').replaceAll(':', ''),\n                decimals: isMoneyInput ? 2 : undefined,\n            });\n\n            if (parsedNumber !== 0 && (parsedNumber > maxNumber || parsedNumber < minNumber)) {\n                isInvalid = true;\n            }\n\n            setIsValueInvalid(isInvalid);\n        }\n\n        const newStringValue =\n            plainText.length === 0\n                ? ''\n                : formateNumber({\n                      number: isTimeInput ? sanitizedValue : parsedNumber,\n                      isMoneyInput,\n                      isTimeInput,\n                  });\n\n        setFormattedValue(newStringValue);\n        setPlainText(newStringValue.replaceAll('.', ''));\n        setHasFocus(false);\n\n        if (typeof onChange === 'function') {\n            onChange(newStringValue.replaceAll('.', ''));\n        }\n\n        if (typeof onBlur === 'function') {\n            if (isTimeInput) {\n                onBlur(newStringValue, isInvalid);\n            } else {\n                onBlur(parsedNumber === 0 ? null : parsedNumber, isInvalid);\n            }\n        }\n    };\n\n    const onLocalFocus = () => {\n        // formattedValue will be a number string with german number format (e.g. 1.000,00)\n        // It will remove all dots, so that the user can type in the number\n        setPlainText(formattedValue.replaceAll('.', ''));\n\n        // This will update the external state\n        if (typeof onChange === 'function') {\n            onChange(formattedValue.replaceAll('.', ''));\n        }\n\n        setIsValueInvalid(false);\n        setHasFocus(true);\n    };\n\n    // updates the formattedValue, when the value changes\n    useEffect(() => {\n        let parsedNumber = null;\n\n        if (!isTimeInput) {\n            parsedNumber = parseFloatWithDecimals({\n                stringValue: plainText.replace(',', '.').replaceAll(':', ''),\n                decimals: isMoneyInput ? 2 : undefined,\n            });\n\n            // checks, if a given number is invalid, if the input is not in focus\n            if (!hasFocus) {\n                setIsValueInvalid(parsedNumber > maxNumber || parsedNumber < minNumber);\n            }\n        }\n\n        setFormattedValue(\n            plainText.length === 0\n                ? ''\n                : formateNumber({\n                      number: isTimeInput ? plainText : parsedNumber,\n                      isMoneyInput,\n                      isTimeInput,\n                  }),\n        );\n    }, [hasFocus, isMoneyInput, isTimeInput, maxNumber, minNumber, plainText]);\n\n    useEffect(() => {\n        if (typeof value === 'string') {\n            setPlainText(value);\n        }\n    }, [value]);\n\n    return (\n        <Input\n            shouldShowOnlyBottomBorder={shouldShowOnlyBottomBorder}\n            inputMode=\"decimal\"\n            onChange={onLocalChange}\n            value={hasFocus ? plainText : formattedValue}\n            placeholder={localPlaceholder}\n            onBlur={onLocalBlur}\n            onFocus={onLocalFocus}\n            isDisabled={isDisabled}\n            isInvalid={isValueInvalid}\n        />\n    );\n};\n\nNumberInput.displayName = 'NumberInput';\n\nexport default NumberInput;\n"],"mappings":"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"}
+{"version":3,"file":"NumberInput.js","names":["_react","_interopRequireWildcard","require","_Input","_interopRequireDefault","_numberInput","_numberInput2","obj","__esModule","default","_getRequireWildcardCache","e","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","NumberInput","_ref","isDecimalInput","isMoneyInput","isTimeInput","maxNumber","Infinity","value","placeholder","onBlur","isDisabled","onChange","shouldShowOnlyBottomBorder","minNumber","plainText","setPlainText","useState","formattedValue","setFormattedValue","hasFocus","setHasFocus","isValueInvalid","setIsValueInvalid","localPlaceholder","undefined","onLocalChange","event","newValue","target","replaceAll","length","sanitizedValueString","replace","NUMBER_CLEAR_REGEX","valueToCheck","isValidString","string","onLocalBlur","sanitizedValue","isInvalid","parsedNumber","parseFloatWithDecimals","stringValue","decimals","newStringValue","formateNumber","number","onLocalFocus","useEffect","createElement","inputMode","onFocus","displayName","_default","exports"],"sources":["../../../src/components/number-input/NumberInput.tsx"],"sourcesContent":["import React, { ChangeEventHandler, FC, useEffect, useState } from 'react';\nimport Input from '../input/Input';\nimport { NUMBER_CLEAR_REGEX } from '../../constants/numberInput';\nimport { formateNumber, isValidString, parseFloatWithDecimals } from '../../utils/numberInput';\n\nexport type NumberInputProps = {\n    /**\n     * Applies rules for decimal input.\n     * Enables the user to input one zero as number before the comma\n     */\n    isDecimalInput?: boolean;\n    /**\n     * Whether the input is disabled\n     */\n    isDisabled?: boolean;\n    /**\n     * Applies rules for money input.\n     * Rules: only two decimal places, one zero before the comma\n     */\n    isMoneyInput?: boolean;\n    /**\n     * Whether the value should be formatted as a time.\n     */\n    isTimeInput?: boolean;\n    /**\n     * Limits the number to this value\n     */\n    maxNumber?: number;\n    /**\n     * Limits the number to this value\n     */\n    minNumber?: number;\n    /**\n     * Callback function that is called when the input gets out of focus\n     */\n    onBlur?: (newNumber: number | string | null, isInvalid: boolean) => void;\n    /**\n     * Callback function that is called when the input changes\n     * It will pass the text from the input\n     */\n    onChange?: (newValue: string) => void;\n    /**\n     * Placeholder for the input field\n     */\n    placeholder?: string;\n    /**\n     * Whether only the bottom border should be displayed\n     */\n    shouldShowOnlyBottomBorder?: boolean;\n    /**\n     * The value, that should be displayed in the input, when it is in focus.\n     * You can also pass a stringified number as default value.\n     * NOTE: If you pass a stringified number, it will be formatted to the selected format\n     */\n    value?: string;\n};\n\nconst NumberInput: FC<NumberInputProps> = ({\n    isDecimalInput,\n    isMoneyInput,\n    isTimeInput,\n    maxNumber = Infinity,\n    value,\n    placeholder,\n    onBlur,\n    isDisabled,\n    onChange,\n    shouldShowOnlyBottomBorder,\n    minNumber = -Infinity,\n}) => {\n    // the plainText will be shown in the input, when it is in focus\n    const [plainText, setPlainText] = useState<string>('');\n    // the formattedValue will be shown in the input, when it is not in focus\n    const [formattedValue, setFormattedValue] = useState<string>('');\n    const [hasFocus, setHasFocus] = useState<boolean>(false);\n\n    const [isValueInvalid, setIsValueInvalid] = useState(false);\n    const localPlaceholder = placeholder ?? (isMoneyInput ? '€' : undefined);\n\n    const onLocalChange: ChangeEventHandler<HTMLInputElement> = (event) => {\n        const newValue = event.target.value;\n\n        if (newValue.replaceAll(':', '').length > 4) {\n            return;\n        }\n\n        const sanitizedValueString = newValue\n            // Removes everything except numbers, commas and points\n            .replace(NUMBER_CLEAR_REGEX, '');\n\n        const valueToCheck = sanitizedValueString.replaceAll(',', '.');\n\n        if (!isValidString({ string: valueToCheck, isMoneyInput, isDecimalInput, isTimeInput })) {\n            return;\n        }\n\n        setPlainText(sanitizedValueString.replaceAll('.', ','));\n\n        if (typeof onChange === 'function') {\n            onChange(sanitizedValueString.replaceAll('.', ','));\n        }\n    };\n\n    const onLocalBlur = () => {\n        const sanitizedValue = plainText.length === 0 ? '0' : plainText;\n        let isInvalid = false;\n        let parsedNumber = null;\n\n        if (!isTimeInput) {\n            parsedNumber = parseFloatWithDecimals({\n                stringValue: sanitizedValue.replace(',', '.').replaceAll(':', ''),\n                decimals: isMoneyInput ? 2 : undefined,\n            });\n\n            if (parsedNumber !== 0 && (parsedNumber > maxNumber || parsedNumber < minNumber)) {\n                isInvalid = true;\n            }\n\n            setIsValueInvalid(isInvalid);\n        }\n\n        const newStringValue =\n            plainText.length === 0\n                ? ''\n                : formateNumber({\n                      number: isTimeInput ? sanitizedValue : parsedNumber,\n                      isMoneyInput,\n                      isTimeInput,\n                  });\n\n        setFormattedValue(newStringValue);\n        setPlainText(newStringValue.replaceAll('.', ''));\n        setHasFocus(false);\n\n        if (typeof onChange === 'function') {\n            onChange(newStringValue.replaceAll('.', ''));\n        }\n\n        if (typeof onBlur === 'function') {\n            if (isTimeInput) {\n                onBlur(newStringValue, isInvalid);\n            } else {\n                onBlur(parsedNumber === 0 ? null : parsedNumber, isInvalid);\n            }\n        }\n    };\n\n    const onLocalFocus = () => {\n        // formattedValue will be a number string with german number format (e.g. 1.000,00)\n        // It will remove all dots, so that the user can type in the number\n        setPlainText(formattedValue.replaceAll('.', ''));\n\n        // This will update the external state\n        if (typeof onChange === 'function') {\n            onChange(formattedValue.replaceAll('.', ''));\n        }\n\n        setIsValueInvalid(false);\n        setHasFocus(true);\n    };\n\n    // updates the formattedValue, when the value changes\n    useEffect(() => {\n        let parsedNumber = null;\n\n        if (!isTimeInput) {\n            parsedNumber = parseFloatWithDecimals({\n                stringValue: plainText.replace(',', '.').replaceAll(':', ''),\n                decimals: isMoneyInput ? 2 : undefined,\n            });\n\n            // checks, if a given number is invalid, if the input is not in focus\n            if (!hasFocus) {\n                setIsValueInvalid(parsedNumber > maxNumber || parsedNumber < minNumber);\n            }\n        }\n\n        setFormattedValue(\n            plainText.length === 0\n                ? ''\n                : formateNumber({\n                      number: isTimeInput ? plainText : parsedNumber,\n                      isMoneyInput,\n                      isTimeInput,\n                  }),\n        );\n    }, [hasFocus, isMoneyInput, isTimeInput, maxNumber, minNumber, plainText]);\n\n    useEffect(() => {\n        if (typeof value === 'string') {\n            setPlainText(value);\n        }\n    }, [value]);\n\n    return (\n        <Input\n            shouldShowOnlyBottomBorder={shouldShowOnlyBottomBorder}\n            inputMode=\"decimal\"\n            onChange={onLocalChange}\n            value={hasFocus ? plainText : formattedValue}\n            placeholder={localPlaceholder}\n            onBlur={onLocalBlur}\n            onFocus={onLocalFocus}\n            isDisabled={isDisabled}\n            isInvalid={isValueInvalid}\n        />\n    );\n};\n\nNumberInput.displayName = 'NumberInput';\n\nexport default NumberInput;\n"],"mappings":"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"}

package/lib/components/popup/Popup.d.ts

@@ -1,5 +1,5 @@
 import React, { ReactNode } from 'react';
-import { PopupRef } from './types';
+import { PopupRef } from '../../types/popup';
 export type PopupProps = {
     /**
      * The element over which the content of the `ContextMenu` should be displayed.

package/lib/components/popup/Popup.js

@@ -11,7 +11,7 @@ var _reactDom = require("react-dom");
 var _uuid = require("../../hooks/uuid");
 var _PopupContent = _interopRequireDefault(require("./popup-content/PopupContent"));
 var _Popup = require("./Popup.styles");
-var _types = require("./types");
+var _popup = require("../../types/popup");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
@@ -29,7 +29,7 @@ const Popup = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
     y: 0
   });
   const container = document.querySelector('.tapp') || document.body;
-  const [alignment, setAlignment] = (0, _react.useState)(_types.PopupAlignment.TopLeft);
+  const [alignment, setAlignment] = (0, _react.useState)(_popup.PopupAlignment.TopLeft);
   const [isOpen, setIsOpen] = (0, _react.useState)(false);
   const [portal, setPortal] = (0, _react.useState)();
   const [menuHeight, setMenuHeight] = (0, _react.useState)(0);
@@ -53,9 +53,9 @@ const Popup = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
       } = popupRef.current.getBoundingClientRect();
       if (pseudoHeight > childrenTop - 25) {
         if (pseudoWidth > childrenLeft + childrenWidth / 2 - 25) {
-          setAlignment(_types.PopupAlignment.BottomRight);
+          setAlignment(_popup.PopupAlignment.BottomRight);
         } else {
-          setAlignment(_types.PopupAlignment.BottomLeft);
+          setAlignment(_popup.PopupAlignment.BottomLeft);
         }
         setCoordinates({
           x: childrenLeft + childrenWidth / 2,
@@ -63,9 +63,9 @@ const Popup = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
         });
       } else {
         if (pseudoWidth > childrenLeft + childrenWidth / 2 - 25) {
-          setAlignment(_types.PopupAlignment.TopRight);
+          setAlignment(_popup.PopupAlignment.TopRight);
         } else {
-          setAlignment(_types.PopupAlignment.TopLeft);
+          setAlignment(_popup.PopupAlignment.TopLeft);
         }
         setCoordinates({
           x: childrenLeft + childrenWidth / 2,

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

@@ -1 +1 @@
-{"version":3,"file":"Popup.js","names":["_chaynsApi","require","_framerMotion","_react","_interopRequireWildcard","_reactDom","_uuid","_PopupContent","_interopRequireDefault","_Popup","_types","obj","__esModule","default","_getRequireWildcardCache","e","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","Popup","forwardRef","_ref","ref","content","onShow","onHide","children","shouldShowOnHover","yOffset","coordinates","setCoordinates","useState","x","y","container","document","querySelector","body","alignment","setAlignment","PopupAlignment","TopLeft","isOpen","setIsOpen","portal","setPortal","menuHeight","setMenuHeight","uuid","useUuid","popupContentRef","useRef","popupPseudoContentRef","popupRef","handleShow","useCallback","current","height","pseudoHeight","width","pseudoWidth","getBoundingClientRect","childrenHeight","left","childrenLeft","top","childrenTop","childrenWidth","BottomRight","BottomLeft","TopRight","handleChildrenClick","handleHide","handleMouseEnter","handleMouseLeave","event","currentTarget","dataset","ispopup","relatedTarget","contains","handleDocumentClick","target","preventDefault","stopPropagation","useImperativeHandle","hide","show","useEffect","getWindowMetrics","then","result","topBarHeight","addEventListener","window","removeEventListener","createPortal","createElement","AnimatePresence","initial","key","onMouseLeave","Fragment","StyledPopupPseudo","StyledPopup","onClick","onMouseEnter","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    MouseEvent,\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 PopupContent from './popup-content/PopupContent';\nimport { StyledPopup, StyledPopupPseudo } from './Popup.styles';\nimport { PopupAlignment, PopupCoordinates, PopupRef } from './types';\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 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     * The Y offset of the popup to the children.\n     */\n    yOffset?: number;\n};\n\nconst Popup = forwardRef<PopupRef, PopupProps>(\n    ({ content, onShow, onHide, children, shouldShowOnHover = false, yOffset = 0 }, ref) => {\n        const [coordinates, setCoordinates] = useState<PopupCoordinates>({\n            x: 0,\n            y: 0,\n        });\n        const container = document.querySelector('.tapp') || document.body;\n\n        const [alignment, setAlignment] = useState<PopupAlignment>(PopupAlignment.TopLeft);\n        const [isOpen, setIsOpen] = useState(false);\n        const [portal, setPortal] = useState<ReactPortal>();\n        const [menuHeight, setMenuHeight] = useState(0);\n\n        const uuid = useUuid();\n\n        // ToDo: Replace with hook if new chayns api is ready\n        const popupContentRef = useRef<HTMLDivElement>(null);\n        const popupPseudoContentRef = useRef<HTMLDivElement>(null);\n        const popupRef = useRef<HTMLDivElement>(null);\n\n        const handleShow = useCallback(() => {\n            if (popupRef.current && popupPseudoContentRef.current) {\n                const { height: pseudoHeight, width: pseudoWidth } =\n                    popupPseudoContentRef.current.getBoundingClientRect();\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                    if (pseudoWidth > childrenLeft + childrenWidth / 2 - 25) {\n                        setAlignment(PopupAlignment.BottomRight);\n                    } else {\n                        setAlignment(PopupAlignment.BottomLeft);\n                    }\n\n                    setCoordinates({\n                        x: childrenLeft + childrenWidth / 2,\n                        y: childrenTop + childrenHeight + yOffset,\n                    });\n                } else {\n                    if (pseudoWidth > childrenLeft + childrenWidth / 2 - 25) {\n                        setAlignment(PopupAlignment.TopRight);\n                    } else {\n                        setAlignment(PopupAlignment.TopLeft);\n                    }\n\n                    setCoordinates({\n                        x: childrenLeft + childrenWidth / 2,\n                        y: childrenTop - yOffset,\n                    });\n                }\n\n                setIsOpen(true);\n            }\n        }, [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 = () => {\n            if (shouldShowOnHover) {\n                handleShow();\n            }\n        };\n\n        const handleMouseLeave = useCallback(\n            (event: MouseEvent) => {\n                if (shouldShowOnHover) {\n                    if ((event.currentTarget as HTMLElement).dataset.ispopup === 'true') {\n                        handleHide();\n                    }\n\n                    if (\n                        event.relatedTarget &&\n                        (event.relatedTarget === popupContentRef.current ||\n                            popupContentRef.current?.contains(event.relatedTarget as Node))\n                    ) {\n                        return;\n                    }\n\n                    handleHide();\n                }\n            },\n            [handleHide, shouldShowOnHover]\n        );\n\n        const handleDocumentClick = useCallback<EventListener>(\n            (event) => {\n                if (!popupContentRef.current?.contains(event.target as Node)) {\n                    event.preventDefault();\n                    event.stopPropagation();\n\n                    if (!shouldShowOnHover) {\n                        handleHide();\n                    }\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                            <PopupContent\n                                coordinates={coordinates}\n                                content={content}\n                                key={`tooltip_${uuid}`}\n                                alignment={alignment}\n                                ref={popupContentRef}\n                                onMouseLeave={handleMouseLeave}\n                            />\n                        )}\n                    </AnimatePresence>,\n                    container\n                )\n            );\n        }, [alignment, container, content, coordinates, handleMouseLeave, isOpen, uuid]);\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                >\n                    {children}\n                </StyledPopup>\n                {portal}\n            </>\n        );\n    }\n);\n\nPopup.displayName = 'Popup';\n\nexport default Popup;\n"],"mappings":"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"}
+{"version":3,"file":"Popup.js","names":["_chaynsApi","require","_framerMotion","_react","_interopRequireWildcard","_reactDom","_uuid","_PopupContent","_interopRequireDefault","_Popup","_popup","obj","__esModule","default","_getRequireWildcardCache","e","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","Popup","forwardRef","_ref","ref","content","onShow","onHide","children","shouldShowOnHover","yOffset","coordinates","setCoordinates","useState","x","y","container","document","querySelector","body","alignment","setAlignment","PopupAlignment","TopLeft","isOpen","setIsOpen","portal","setPortal","menuHeight","setMenuHeight","uuid","useUuid","popupContentRef","useRef","popupPseudoContentRef","popupRef","handleShow","useCallback","current","height","pseudoHeight","width","pseudoWidth","getBoundingClientRect","childrenHeight","left","childrenLeft","top","childrenTop","childrenWidth","BottomRight","BottomLeft","TopRight","handleChildrenClick","handleHide","handleMouseEnter","handleMouseLeave","event","currentTarget","dataset","ispopup","relatedTarget","contains","handleDocumentClick","target","preventDefault","stopPropagation","useImperativeHandle","hide","show","useEffect","getWindowMetrics","then","result","topBarHeight","addEventListener","window","removeEventListener","createPortal","createElement","AnimatePresence","initial","key","onMouseLeave","Fragment","StyledPopupPseudo","StyledPopup","onClick","onMouseEnter","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    MouseEvent,\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 PopupContent from './popup-content/PopupContent';\nimport { StyledPopup, StyledPopupPseudo } from './Popup.styles';\nimport { PopupAlignment, PopupCoordinates, PopupRef } from '../../types/popup';\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 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     * The Y offset of the popup to the children.\n     */\n    yOffset?: number;\n};\n\nconst Popup = forwardRef<PopupRef, PopupProps>(\n    ({ content, onShow, onHide, children, shouldShowOnHover = false, yOffset = 0 }, ref) => {\n        const [coordinates, setCoordinates] = useState<PopupCoordinates>({\n            x: 0,\n            y: 0,\n        });\n        const container = document.querySelector('.tapp') || document.body;\n\n        const [alignment, setAlignment] = useState<PopupAlignment>(PopupAlignment.TopLeft);\n        const [isOpen, setIsOpen] = useState(false);\n        const [portal, setPortal] = useState<ReactPortal>();\n        const [menuHeight, setMenuHeight] = useState(0);\n\n        const uuid = useUuid();\n\n        // ToDo: Replace with hook if new chayns api is ready\n        const popupContentRef = useRef<HTMLDivElement>(null);\n        const popupPseudoContentRef = useRef<HTMLDivElement>(null);\n        const popupRef = useRef<HTMLDivElement>(null);\n\n        const handleShow = useCallback(() => {\n            if (popupRef.current && popupPseudoContentRef.current) {\n                const { height: pseudoHeight, width: pseudoWidth } =\n                    popupPseudoContentRef.current.getBoundingClientRect();\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                    if (pseudoWidth > childrenLeft + childrenWidth / 2 - 25) {\n                        setAlignment(PopupAlignment.BottomRight);\n                    } else {\n                        setAlignment(PopupAlignment.BottomLeft);\n                    }\n\n                    setCoordinates({\n                        x: childrenLeft + childrenWidth / 2,\n                        y: childrenTop + childrenHeight + yOffset,\n                    });\n                } else {\n                    if (pseudoWidth > childrenLeft + childrenWidth / 2 - 25) {\n                        setAlignment(PopupAlignment.TopRight);\n                    } else {\n                        setAlignment(PopupAlignment.TopLeft);\n                    }\n\n                    setCoordinates({\n                        x: childrenLeft + childrenWidth / 2,\n                        y: childrenTop - yOffset,\n                    });\n                }\n\n                setIsOpen(true);\n            }\n        }, [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 = () => {\n            if (shouldShowOnHover) {\n                handleShow();\n            }\n        };\n\n        const handleMouseLeave = useCallback(\n            (event: MouseEvent) => {\n                if (shouldShowOnHover) {\n                    if ((event.currentTarget as HTMLElement).dataset.ispopup === 'true') {\n                        handleHide();\n                    }\n\n                    if (\n                        event.relatedTarget &&\n                        (event.relatedTarget === popupContentRef.current ||\n                            popupContentRef.current?.contains(event.relatedTarget as Node))\n                    ) {\n                        return;\n                    }\n\n                    handleHide();\n                }\n            },\n            [handleHide, shouldShowOnHover],\n        );\n\n        const handleDocumentClick = useCallback<EventListener>(\n            (event) => {\n                if (!popupContentRef.current?.contains(event.target as Node)) {\n                    event.preventDefault();\n                    event.stopPropagation();\n\n                    if (!shouldShowOnHover) {\n                        handleHide();\n                    }\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                            <PopupContent\n                                coordinates={coordinates}\n                                content={content}\n                                key={`tooltip_${uuid}`}\n                                alignment={alignment}\n                                ref={popupContentRef}\n                                onMouseLeave={handleMouseLeave}\n                            />\n                        )}\n                    </AnimatePresence>,\n                    container,\n                ),\n            );\n        }, [alignment, container, content, coordinates, handleMouseLeave, isOpen, uuid]);\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                >\n                    {children}\n                </StyledPopup>\n                {portal}\n            </>\n        );\n    },\n);\n\nPopup.displayName = 'Popup';\n\nexport default Popup;\n"],"mappings":"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"}

package/lib/components/popup/popup-content/PopupContent.d.ts

@@ -1,5 +1,5 @@
 import React, { type MouseEventHandler, ReactNode } from 'react';
-import { PopupAlignment, PopupCoordinates } from '../types';
+import { PopupAlignment, PopupCoordinates } from '../../../types/popup';
 type PopupContentProps = {
     alignment: PopupAlignment;
     coordinates: PopupCoordinates;

package/lib/components/popup/popup-content/PopupContent.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _colorMode = require("../../../hooks/colorMode");
-var _types = require("../types");
+var _popup = require("../../../types/popup");
 var _PopupContent = require("./PopupContent.styles");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 const PopupContent = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
@@ -17,9 +17,9 @@ const PopupContent = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
     onMouseLeave
   } = _ref;
   const colorMode = (0, _colorMode.useColorMode)();
-  const isBottomLeftAlignment = alignment === _types.PopupAlignment.BottomLeft;
-  const isTopLeftAlignment = alignment === _types.PopupAlignment.TopLeft;
-  const isTopRightAlignment = alignment === _types.PopupAlignment.TopRight;
+  const isBottomLeftAlignment = alignment === _popup.PopupAlignment.BottomLeft;
+  const isTopLeftAlignment = alignment === _popup.PopupAlignment.TopLeft;
+  const isTopRightAlignment = alignment === _popup.PopupAlignment.TopRight;
   const percentageOffsetX = isBottomLeftAlignment || isTopLeftAlignment ? -100 : 0;
   const percentageOffsetY = isTopRightAlignment || isTopLeftAlignment ? -100 : 0;
   const anchorOffsetX = isBottomLeftAlignment || isTopLeftAlignment ? 21 : -21;