{"version":3,"file":"static/js/55606.868050df.chunk.js","mappings":"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","sources":["components/Popup/style.ts","components/Popup/index.tsx"],"sourcesContent":["import styled, { keyframes } from 'styled-components';\n\nconst animationTypeOpen: Record = {\n toLeft: keyframes`{\n 0% {transform: translateX(100%);}\n 100% {transform: translateX(0);}\n }`,\n toRight: keyframes`{\n 0% {transform: translateX(-100%);}\n 100% {transform: translateX(0);}\n }`,\n toTop: keyframes`{\n 0% {transform: translateY(100%);}\n 100% {transform: translateY(0);}\n }`,\n toBottom: keyframes`{\n 0% {transform: translateY(-100%);}\n 100% {transform: translateY(0);}\n }`\n};\n\nconst animationTypeClose: Record = {\n toLeft: keyframes`{\n 0% {transform: translateX(0);}\n 100% {transform: translateX(100%);}\n }`,\n toRight: keyframes`{\n 0% {transform: translateX(0);}\n 100% {transform: translateX(-100%);}\n }`,\n toTop: keyframes`{\n 0% {transform: translateY(0);}\n 100% {transform: translateY(100%);}\n }`,\n toBottom: keyframes`{\n 0% {transform: translateY(0);}\n 100% {transform: translateY(-100%);}\n }`\n};\n\nexport const CustomMask = styled.div<{ maskBackground?: string }>`\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n height: 100%;\n background: ${props =>\n props.maskBackground ? props.maskBackground : 'rgba(0,0,0,0.3)'};\n z-index: 1;\n`;\n\nexport const Container = styled.div<{\n show: boolean;\n animationTime?: string;\n $maskPosTop?: string;\n}>`\n position: fixed;\n height: -webkit-fill-available;\n height: -moz-available;\n height: fill-available;\n top: ${props => (props.$maskPosTop ? props.$maskPosTop : 0)};\n left: 0;\n right: 0;\n opacity: ${props => (props.show ? 1 : 0)};\n z-index: 11;\n pointer-events: ${props => (props.show ? 'all' : 'none')};\n overflow: hidden;\n transition: opacity\n ${props => (props.animationTime ? props.animationTime : '0.3s')};\n\n ${CustomMask} {\n top: ${props => (props.$maskPosTop ? props.$maskPosTop : 0)};\n }\n`;\nexport const CustomData = styled.div<{\n animationType: string;\n animationTime?: string;\n posTop?: string;\n posBottom?: string;\n posLeft?: string;\n posRight?: string;\n}>`\n position: absolute;\n height: 100%;\n bottom: ${props => (props.posBottom ? props.posBottom : 0)};\n top: ${props => (props.posTop ? props.posTop : 0)};\n left: ${props => (props.posLeft ? props.posLeft : 0)};\n right: ${props => (props.posRight ? props.posRight : 0)};\n display: flex;\n flex-direction: column;\n z-index: 3;\n background: var(--v3-black-0);\n\n &.customPopup--open {\n animation: ${props => animationTypeOpen[props.animationType]}\n ${props => (props.animationTime ? props.animationTime : '0.3s')} ease\n forwards;\n }\n\n &.customPopup--close {\n animation: ${props => animationTypeClose[props.animationType]}\n ${props => (props.animationTime ? props.animationTime : '0.3s')} ease\n forwards;\n }\n`;\n","import {\n CSSProperties,\n memo,\n ReactElement,\n useEffect,\n useLayoutEffect,\n useMemo,\n useRef\n} from 'react';\nimport cc from 'classcat';\nimport SpringConfigs from 'utils/constants/swarm/spring-configs';\nimport { Container, CustomData, CustomMask } from './style';\nimport { Portal } from 'components/Shared/Portal';\n\ntype Props = {\n open: boolean;\n className?: string;\n children: any;\n onMaskClick?: (arg: boolean) => void;\n mask?: boolean;\n maskBackground?: string;\n maskPosTop?: {\n usePosTop?: boolean;\n posTop?: string;\n };\n animationType?: 'toRight' | 'toLeft' | 'toTop' | 'toBottom' | 'none';\n animationTime?: string;\n posTop?: string;\n posBottom?: string;\n posLeft?: string;\n posRight?: string;\n style?: CSSProperties;\n onBeforeOpen?: () => void;\n onAnimationEnd?: (value?: boolean) => void;\n initiallyLoaded?: boolean;\n};\n\nexport const Popup = memo(\n ({\n open,\n children,\n onMaskClick,\n mask,\n animationType,\n animationTime,\n className,\n posBottom,\n posLeft,\n posRight,\n posTop,\n maskPosTop,\n maskBackground,\n style = {},\n onBeforeOpen,\n onAnimationEnd,\n initiallyLoaded = false\n }: Props): ReactElement | null => {\n const loaded = useRef(initiallyLoaded);\n\n const animationTypeFromParams = useMemo(() => {\n if (animationType) {\n return animationType;\n }\n\n return 'toLeft';\n }, [animationType]);\n\n useLayoutEffect(() => {\n onBeforeOpen?.();\n }, []);\n\n useEffect(() => {\n if (open) {\n loaded.current = true;\n }\n }, [open]);\n\n if (SpringConfigs.MOCKED_DATA) {\n return null;\n }\n\n return (\n \n \n {mask && (\n onMaskClick?.(true)}\n />\n )}\n {\n onAnimationEnd?.(open);\n }}\n >\n {(open || loaded.current) && children}\n \n \n \n );\n }\n);\n"],"names":["animationTypeOpen","toLeft","keyframes","toRight","toTop","toBottom","animationTypeClose","CustomMask","styled","div","withConfig","displayName","componentId","props","maskBackground","Container","$maskPosTop","show","animationTime","CustomData","posBottom","posTop","posLeft","posRight","animationType","Popup","memo","_ref","open","children","onMaskClick","mask","className","maskPosTop","style","onBeforeOpen","onAnimationEnd","initiallyLoaded","loaded","useRef","animationTypeFromParams","useMemo","useLayoutEffect","useEffect","current","SpringConfigs","MOCKED_DATA","_jsx","Portal","_jsxs","usePosTop","onClick","cc"],"sourceRoot":""}