import { type HTMLAttributes, type ReactNode } from "react";
import AnimatedDiv from "./AnimatedDiv";
import { cn } from "~/lib/utils";
const AnimatePopUp = ({
  children,
  position,
  className,
  duration=1,
  ease='elastic',
  scrollOnly=false,
  once=false,
  debugId,
}:{
    children:ReactNode
    position:gsap.Position,
    className?:HTMLAttributes<HTMLDivElement>['className']
    duration?:number,
    ease?:gsap.EaseString|gsap.EaseFunction,
    scrollOnly?:boolean,
    once?:boolean,
    debugId?:string,
  }) => {
  return (
    <AnimatedDiv children={children} position={position} scrollOnly={scrollOnly} once={once} debugId={debugId} className={cn(className,'h-0 translate-y-[50] overflow-hidden')} height='auto' y={0} overflow='' ease={ease} duration={duration} />
  )
}

export default AnimatePopUp;