{"version":3,"file":"static/js/55606.a207d092.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<string, any> = {\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<string, any> = {\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      <Portal>\n        <Container\n          show={open}\n          animationTime={animationTime}\n          className={className}\n          style={style}\n          $maskPosTop={maskPosTop?.usePosTop ? posTop : maskPosTop?.posTop}\n        >\n          {mask && (\n            <CustomMask\n              className=\"customMask\"\n              maskBackground={maskBackground}\n              onClick={() => onMaskClick?.(true)}\n            />\n          )}\n          <CustomData\n            className={cc([\n              'custom-data',\n              {\n                'customPopup--open': open,\n                'customPopup--close': !open\n              }\n            ])}\n            animationType={animationTypeFromParams}\n            animationTime={animationTime}\n            posTop={posTop}\n            posRight={posRight}\n            posLeft={posLeft}\n            posBottom={posBottom}\n            onAnimationEnd={() => {\n              onAnimationEnd?.(open);\n            }}\n          >\n            {(open || loaded.current) && children}\n          </CustomData>\n        </Container>\n      </Portal>\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":""}