{"version":3,"file":"ParallaxImage.Cl4cso6V.mjs","names":["useRef","useMemo"],"sources":["https:/framerusercontent.com/modules/2DlPXu6vOuo3jG5kFNDU/dU55bEE18zyS5aqVEILw/ParallaxImage.js"],"sourcesContent":["import{jsx as _jsx}from\"react/jsx-runtime\";import{useMemo,useRef}from\"react\";import{motion,useScroll,useTransform,useSpring,useReducedMotion}from\"framer-motion\";import{addPropertyControls,ControlType}from\"framer\";export default function ParallaxImage(props){const{image,direction,intensity,smoothing,positionX,positionY,zoomAmount,staticZoom,style}=props;const ref=useRef(null);const reducedMotion=useReducedMotion();const{scrollYProgress}=useScroll({target:ref,offset:[\"start end\",\"end start\"]});const smoothed=useSpring(scrollYProgress,smoothing?{stiffness:100,damping:30,mass:1}:{stiffness:1e3,damping:100,mass:.1});const isVertical=direction===\"up\"||direction===\"down\";const isZoom=direction===\"zoom-in\"||direction===\"zoom-out\";const travel=intensity;const overshoot=`calc(100% + ${travel*2}px)`;const scaleFactor=1+zoomAmount/100;const zoomScale=staticZoom/100;const hasStaticZoom=zoomScale>1;const motionValue=useTransform(smoothed,[0,1],[0,travel*2]);const reverseMotionValue=useTransform(smoothed,[0,1],[0,-travel*2]);const scaleIn=useTransform(smoothed,[0,1],[zoomScale,zoomScale*scaleFactor]);const scaleOut=useTransform(smoothed,[0,1],[zoomScale*scaleFactor,zoomScale]);const motionStyle=useMemo(()=>{if(reducedMotion)return{};switch(direction){case\"up\":return{y:reverseMotionValue};case\"down\":return{y:motionValue};case\"left\":return{x:reverseMotionValue};case\"right\":return{x:motionValue};case\"zoom-in\":return{scale:scaleIn};case\"zoom-out\":return{scale:scaleOut};default:return{};}},[direction,reducedMotion,motionValue,reverseMotionValue,scaleIn,scaleOut]);const motionWrapStyle=useMemo(()=>({position:\"absolute\",top:isZoom?0:direction===\"down\"?\"auto\":0,bottom:isZoom?0:direction===\"up\"?\"auto\":0,left:isZoom?0:direction===\"right\"?\"auto\":0,right:isZoom?0:direction===\"left\"?\"auto\":0,width:isZoom||isVertical?\"100%\":overshoot,height:isZoom?\"100%\":isVertical?overshoot:\"100%\",willChange:reducedMotion?\"auto\":\"transform\"}),[isZoom,isVertical,direction,overshoot,reducedMotion]);const imgStyle=useMemo(()=>({position:\"absolute\",inset:0,width:\"100%\",height:\"100%\",objectFit:\"cover\",objectPosition:`${positionX}% ${positionY}%`,display:\"block\",userSelect:\"none\",pointerEvents:\"none\",transform:!isZoom&&hasStaticZoom?`scale(${zoomScale})`:undefined,transformOrigin:`${positionX}% ${positionY}%`,willChange:hasStaticZoom?\"transform\":\"auto\"}),[positionX,positionY,isZoom,hasStaticZoom,zoomScale]);const src=image?.src??image??\"https://images.unsplash.com/photo-1506905925346-21bda4d32df4?w=1200\";return /*#__PURE__*/_jsx(\"div\",{ref:ref,style:{position:\"relative\",overflow:\"hidden\",width:\"100%\",height:\"100%\",...style},children:/*#__PURE__*/_jsx(motion.div,{style:{...motionWrapStyle,...motionStyle,transformOrigin:`${positionX}% ${positionY}%`},children:/*#__PURE__*/_jsx(\"img\",{src:src,alt:\"\",style:imgStyle,draggable:false,loading:\"lazy\",decoding:\"async\"})})});}ParallaxImage.defaultProps={direction:\"up\",intensity:60,smoothing:true,positionX:50,positionY:50,zoomAmount:20,staticZoom:100};addPropertyControls(ParallaxImage,{image:{type:ControlType.ResponsiveImage,title:\"Image\"},direction:{type:ControlType.Enum,title:\"Direction\",options:[\"up\",\"down\",\"left\",\"right\",\"zoom-in\",\"zoom-out\"],optionTitles:[\"Up ↑\",\"Down ↓\",\"Left ←\",\"Right →\",\"Zoom In ⊕\",\"Zoom Out ⊖\"],defaultValue:\"up\"},intensity:{type:ControlType.Number,title:\"Intensity\",defaultValue:60,min:10,max:300,step:5,unit:\"px\",description:\"Total px the image travels during scroll\",hidden:props=>props.direction===\"zoom-in\"||props.direction===\"zoom-out\"},zoomAmount:{type:ControlType.Number,title:\"Zoom Amount\",defaultValue:20,min:1,max:100,step:1,unit:\"%\",description:\"Scale change across the scroll range\",hidden:props=>props.direction!==\"zoom-in\"&&props.direction!==\"zoom-out\"},staticZoom:{type:ControlType.Number,title:\"Image Zoom\",defaultValue:100,min:100,max:300,step:5,unit:\"%\",description:\"Zoom into the image. Position X/Y sets the focal point.\"},positionX:{type:ControlType.Number,title:\"Position X\",defaultValue:50,min:0,max:100,step:1,unit:\"%\",description:\"Horizontal focal point\"},positionY:{type:ControlType.Number,title:\"Position Y\",defaultValue:50,min:0,max:100,step:1,unit:\"%\",description:\"Vertical focal point\"},smoothing:{type:ControlType.Boolean,title:\"Smooth\",defaultValue:true,description:\"Spring-eased movement\"}});ParallaxImage.displayName=\"<parallax_image>\";\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"ParallaxImage\",\"slots\":[],\"annotations\":{\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./ParallaxImage.map"],"mappings":"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"}