{"version":3,"file":"ImageTrial.CBitmieO.mjs","names":["React.useContext","React.useMemo","React.Fragment","useRef","React.useId","useState","useRef"],"sources":["https:/framerusercontent.com/modules/855LtizXKU4qQZbdgiNE/eAabMprbwAQ58AK81J92/M1QFS_6Hn.js","https:/framerusercontent.com/modules/mqBDNyuVM4C27OwqcJGd/o4JIJrrvRpr9dUS94gEN/ImageTrial.js"],"sourcesContent":["// Generated by Framer (f36d8c8)\nimport{jsx as _jsx}from\"react/jsx-runtime\";import{addFonts,addPropertyControls,ControlType,cx,useComponentViewport,useLocaleInfo,useVariantState,withCSS}from\"framer\";import{LayoutGroup,motion,MotionConfigContext}from\"framer-motion\";import*as React from\"react\";import{useRef}from\"react\";const cycleOrder=[\"NAmkv1fD4\",\"BKEkyMbef\",\"Q0tIKS_z4\"];const serializationHash=\"framer-9C16s\";const variantClassNames={BKEkyMbef:\"framer-v-1sip4c2\",NAmkv1fD4:\"framer-v-1c70v6m\",Q0tIKS_z4:\"framer-v-1ns9pmn\"};function addPropertyOverrides(overrides,...variants){const nextOverrides={};variants?.forEach(variant=>variant&&Object.assign(nextOverrides,overrides[variant]));return nextOverrides;}const OpDlGlNaB=undefined;const transition1={delay:.2,duration:.35,ease:[.59,.01,.28,1],type:\"tween\"};const transition2={duration:0,type:\"tween\"};const Transition=({value,children})=>{const config=React.useContext(MotionConfigContext);const transition=value??config.transition;const contextValue=React.useMemo(()=>({...config,transition}),[JSON.stringify(transition)]);return /*#__PURE__*/_jsx(MotionConfigContext.Provider,{value:contextValue,children:children});};const humanReadableVariantMap={\"Line - Complete\":\"BKEkyMbef\",\"Line - Start\":\"NAmkv1fD4\",Static:\"Q0tIKS_z4\"};const Variants=motion.create(React.Fragment);const getProps=({fill,height,id,width,...props})=>{return{...props,OpDlGlNaB:fill??props.OpDlGlNaB??\"var(--token-e1a39dad-68f0-46a5-8f09-dedde5a29bd4, rgb(255, 252, 246))\",variant:humanReadableVariantMap[props.variant]??props.variant??\"NAmkv1fD4\"};};const createLayoutDependency=(props,variants)=>{if(props.layoutDependency)return variants.join(\"-\")+props.layoutDependency;return variants.join(\"-\");};const Component=/*#__PURE__*/React.forwardRef(function(props,ref){const fallbackRef=useRef(null);const refBinding=ref??fallbackRef;const defaultLayoutId=React.useId();const{activeLocale,setLocale}=useLocaleInfo();const componentViewport=useComponentViewport();const{style,className,layoutId,variant,OpDlGlNaB,...restProps}=getProps(props);const{baseVariant,classNames,clearLoadingGesture,gestureHandlers,gestureVariant,isLoading,setGestureState,setVariant,variants}=useVariantState({cycleOrder,defaultVariant:\"NAmkv1fD4\",ref:refBinding,variant,variantClassNames});const layoutDependency=createLayoutDependency(props,variants);const sharedStyleClassNames=[];const scopingClassNames=cx(serializationHash,...sharedStyleClassNames);return /*#__PURE__*/_jsx(LayoutGroup,{id:layoutId??defaultLayoutId,children:/*#__PURE__*/_jsx(Variants,{animate:variants,initial:false,children:/*#__PURE__*/_jsx(Transition,{value:transition1,...addPropertyOverrides({Q0tIKS_z4:{value:transition2}},baseVariant,gestureVariant),children:/*#__PURE__*/_jsx(motion.figure,{...restProps,...gestureHandlers,className:cx(scopingClassNames,\"framer-1c70v6m\",className,classNames),\"data-framer-name\":\"Line - Start\",layoutDependency:layoutDependency,layoutId:\"NAmkv1fD4\",ref:refBinding,style:{...style},...addPropertyOverrides({BKEkyMbef:{\"data-framer-name\":\"Line - Complete\"},Q0tIKS_z4:{\"data-framer-name\":\"Static\"}},baseVariant,gestureVariant),children:/*#__PURE__*/_jsx(motion.div,{className:\"framer-ny6fly\",layoutDependency:layoutDependency,layoutId:\"W0XryWvCf\",style:{backgroundColor:OpDlGlNaB}})})})})});});const css=[\"@supports (aspect-ratio: 1) { body { --framer-aspect-ratio-supported: auto; } }\",\".framer-9C16s.framer-cdf2a5, .framer-9C16s .framer-cdf2a5 { display: block; }\",\".framer-9C16s.framer-1c70v6m { align-content: flex-start; align-items: flex-start; display: flex; flex-direction: column; flex-wrap: nowrap; gap: 20px; height: min-content; justify-content: center; overflow: var(--overflow-clip-fallback, clip); padding: 0px; position: relative; width: 540px; }\",\".framer-9C16s .framer-ny6fly { flex: none; height: 1px; overflow: visible; position: relative; width: 1px; }\",\".framer-9C16s.framer-v-1sip4c2 .framer-ny6fly, .framer-9C16s.framer-v-1ns9pmn .framer-ny6fly { width: 100%; }\"];/**\n * This is a generated Framer component.\n * @framerIntrinsicHeight 1\n * @framerIntrinsicWidth 540\n * @framerCanvasComponentVariantDetails {\"propertyName\":\"variant\",\"data\":{\"default\":{\"layout\":[\"fixed\",\"auto\"]},\"BKEkyMbef\":{\"layout\":[\"fixed\",\"auto\"]},\"Q0tIKS_z4\":{\"layout\":[\"fixed\",\"auto\"]}}}\n * @framerVariables {\"OpDlGlNaB\":\"fill\"}\n * @framerImmutableVariables true\n * @framerDisplayContentsDiv false\n * @framerAutoSizeImages true\n * @framerComponentViewportWidth true\n * @framerColorSyntax true\n */const FramerM1QFS_6Hn=withCSS(Component,css,\"framer-9C16s\");export default FramerM1QFS_6Hn;FramerM1QFS_6Hn.displayName=\"Line\";FramerM1QFS_6Hn.defaultProps={height:1,width:540};addPropertyControls(FramerM1QFS_6Hn,{variant:{options:[\"NAmkv1fD4\",\"BKEkyMbef\",\"Q0tIKS_z4\"],optionTitles:[\"Line - Start\",\"Line - Complete\",\"Static\"],title:\"Variant\",type:ControlType.Enum},OpDlGlNaB:{defaultValue:'var(--token-e1a39dad-68f0-46a5-8f09-dedde5a29bd4, rgb(255, 252, 246)) /* {\"name\":\"Off White\"} */',title:\"Fill\",type:ControlType.Color}});addFonts(FramerM1QFS_6Hn,[{explicitInter:true,fonts:[]}],{supportsExplicitInterCodegen:true});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"FramerM1QFS_6Hn\",\"slots\":[],\"annotations\":{\"framerDisplayContentsDiv\":\"false\",\"framerIntrinsicHeight\":\"1\",\"framerColorSyntax\":\"true\",\"framerImmutableVariables\":\"true\",\"framerVariables\":\"{\\\"OpDlGlNaB\\\":\\\"fill\\\"}\",\"framerAutoSizeImages\":\"true\",\"framerComponentViewportWidth\":\"true\",\"framerCanvasComponentVariantDetails\":\"{\\\"propertyName\\\":\\\"variant\\\",\\\"data\\\":{\\\"default\\\":{\\\"layout\\\":[\\\"fixed\\\",\\\"auto\\\"]},\\\"BKEkyMbef\\\":{\\\"layout\\\":[\\\"fixed\\\",\\\"auto\\\"]},\\\"Q0tIKS_z4\\\":{\\\"layout\\\":[\\\"fixed\\\",\\\"auto\\\"]}}}\",\"framerContractVersion\":\"1\",\"framerIntrinsicWidth\":\"540\"}},\"Props\":{\"type\":\"tsType\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./M1QFS_6Hn.map","import{jsx as _jsx}from\"react/jsx-runtime\";import{addPropertyControls,ControlType,RenderTarget}from\"framer\";import{motion}from\"framer-motion\";import{useRef,useState}from\"react\";// ─── Variants ─────────────────────────────────────────────────────────────────\n// initial receives the tile's spawn position via the `custom` prop\nconst tileAnimationVariants={initial:tile=>({x:tile.x,y:tile.y,scale:1}),animate:{opacity:[0,1,0],scale:[.5,1,1],transition:{duration:1,ease:[.25,.46,.45,.94],times:[0,.35,1]}}};// ─── Component ────────────────────────────────────────────────────────────────\n/**\n * @framerSupportedLayoutWidth any\n * @framerSupportedLayoutHeight any\n * @framerIntrinsicWidth 600\n * @framerIntrinsicHeight 400\n */export function ImageTrail({style,distanceThreshold=140,images=[]}){const isCanvas=RenderTarget.current()===RenderTarget.canvas;const[tiles,setTiles]=useState([]);// useRef instead of useState — updated on every pointer move without triggering re-renders\nconst lastSpawnPosition=useRef({x:0,y:0});const spawnCounter=useRef(0);if(isCanvas||!images.length)return /*#__PURE__*/_jsx(\"div\",{style:{width:\"100%\",height:\"100%\",...style}});// onPointerMove works for mouse, touch, and stylus — replacing onMouseMove\nfunction handlePointerMove(event){const containerBounds=event.currentTarget.getBoundingClientRect();const currentPointerPosition={x:event.clientX-containerBounds.left,y:event.clientY-containerBounds.top};// Calculate how far the pointer has travelled since the last tile was spawned\nconst distanceTravelledX=currentPointerPosition.x-lastSpawnPosition.current.x;const distanceTravelledY=currentPointerPosition.y-lastSpawnPosition.current.y;const distanceTravelledTotal=Math.sqrt(distanceTravelledX*distanceTravelledX+distanceTravelledY*distanceTravelledY);if(distanceTravelledTotal<distanceThreshold)return;lastSpawnPosition.current=currentPointerPosition;const tileId=spawnCounter.current++;// Modulo cycles through the images array indefinitely —\n// e.g. with 3 images: tile 0→img 0, tile 1→img 1, tile 2→img 2, tile 3→img 0, ...\nconst imageForTile=images[tileId%images.length];setTiles(prevTiles=>[...prevTiles.slice(-images.length),{id:tileId,x:currentPointerPosition.x,y:currentPointerPosition.y,container:imageForTile}]);}return /*#__PURE__*/_jsx(\"section\",{onPointerMove:handlePointerMove,\"aria-label\":\"Image trail — move your cursor to reveal images\",style:{position:\"relative\",overflow:\"visible\",width:\"100%\",height:\"100%\",cursor:\"default\",touchAction:\"pan-y\",...style},children:tiles.map(tile=>/*#__PURE__*/_jsx(motion.figure,{custom:tile,variants:tileAnimationVariants,initial:\"initial\",animate:\"animate\",\"aria-hidden\":\"true\",style:{position:\"absolute\",top:0,left:0,width:tile.container.width,height:tile.container.height,overflow:\"hidden\",margin:0,pointerEvents:\"none\",translateX:\"-50%\",translateY:\"-50%\",zIndex:tile.id},children:/*#__PURE__*/_jsx(\"img\",{src:tile.container.image.src,srcSet:tile.container.image.srcSet,alt:tile.container.image.alt??\"\",style:{width:\"100%\",height:\"100%\",objectFit:\"cover\",display:\"block\"}})},tile.id))});}ImageTrail.defaultProps={distanceThreshold:140,images:[]};addPropertyControls(ImageTrail,{distanceThreshold:{type:ControlType.Number,title:\"Spawn Gap\",description:\"Pointer travel (px) before a new image appears\",defaultValue:100,min:20,max:400,step:10,displayStepper:true},images:{type:ControlType.Array,title:\"Images\",control:{type:ControlType.Object,controls:{image:{type:ControlType.ResponsiveImage,title:\"Image\"},width:{type:ControlType.Number,title:\"W\",defaultValue:240,min:10,max:800,step:1,displayStepper:true},height:{type:ControlType.Number,title:\"H\",defaultValue:160,min:10,max:800,step:1,displayStepper:true}}},defaultValue:[]}});\nexport const __FramerMetadata__ = {\"exports\":{\"ImageTrail\":{\"type\":\"reactComponent\",\"name\":\"ImageTrail\",\"slots\":[],\"annotations\":{\"framerContractVersion\":\"1\",\"framerSupportedLayoutHeight\":\"any\",\"framerIntrinsicWidth\":\"600\",\"framerSupportedLayoutWidth\":\"any\",\"framerIntrinsicHeight\":\"400\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./ImageTrial.map"],"mappings":"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"}