{"version":3,"file":"CardStack.CIuJCmLQ.mjs","names":["React.useState","React.useRef"],"sources":["https:/framerusercontent.com/modules/wGEPEqVT23Toyy7QACjR/ULqMktCLff1kIPsn043y/CardStack.js"],"sourcesContent":["/**\n * CardStack — paper-stack slideshow. One card visible, the rest\n * peeking beneath. Drag the top card left to send it under, right\n * to pull the previous card back up. Click the left/right thirds\n * to navigate, or use the arrows and dots below.\n *\n * @framerSupportedLayoutWidth any\n * @framerSupportedLayoutHeight auto\n */import{jsx as _jsx,jsxs as _jsxs}from\"react/jsx-runtime\";import*as React from\"react\";import{motion}from\"framer-motion\";import{addPropertyControls,ControlType,RenderTarget}from\"framer\";export default function CardStack(props){const{pages=[],aspectRatio=1.294,speed=.65,peek=1.6,cardRadius=12,shadow=true,showNav=true,navColor=\"#1A1814\"}=props;const imageList=(pages||[]).filter(Boolean);const total=imageList.length;const isCanvas=RenderTarget.current()===RenderTarget.canvas;const[current,setCurrent]=React.useState(0);const[mover,setMover]=React.useState(null);// On a backward move the old top card is dropped by the drag\n// system the instant it stops being the top card, which cancels\n// its snap-home spring and leaves it stranded at the dragged\n// position. Tracking it explicitly gives it a guaranteed return\n// animation into its new slot.\nconst[returner,setReturner]=React.useState(null);const[busy,setBusy]=React.useState(false);const[hoverZone,setHoverZone]=React.useState(null);const stageRef=React.useRef(null);const timers=React.useRef([]);// True from drag start until shortly after drag end. Used to\n// suppress the tap that browsers/motion can fire on release at\n// the end of a drag, which otherwise triggers zone navigation\n// in whatever third the pointer happened to land in.\nconst draggedRecently=React.useRef(false);React.useEffect(()=>{return()=>timers.current.forEach(t=>clearTimeout(t));},[]);const go=(dir,fromDrag=false)=>{if(busy||total<2)return;setBusy(true);const w=stageRef.current?.offsetWidth??800;const exit=-(w*1.12);if(dir===\"fwd\"){setMover({index:current,dir,exit,fromDrag});setCurrent((current+1)%total);}else{const prev=(current-1+total)%total;setMover({index:prev,dir,exit,fromDrag});setReturner(current);setCurrent(prev);}timers.current.push(window.setTimeout(()=>setMover(null),speed*1e3*.5));timers.current.push(window.setTimeout(()=>{setBusy(false);setReturner(null);},speed*1e3));};const zoneFromX=clientX=>{const rect=stageRef.current?.getBoundingClientRect();if(!rect)return\"mid\";const relX=(clientX-rect.left)/rect.width;if(relX<.33)return\"left\";if(relX>.67)return\"right\";return\"mid\";};const handleTap=event=>{// A release at the end of a drag is not a click.\nif(draggedRecently.current)return;const clientX=event?.clientX;if(typeof clientX!==\"number\")return;const zone=zoneFromX(clientX);if(zone===\"left\")go(\"back\");if(zone===\"right\")go(\"fwd\");// Middle does nothing, by design.\n};const cursorForZone=hoverZone===\"left\"?\"w-resize\":hoverZone===\"right\"?\"e-resize\":\"default\";// The stacked cards hang below the stage by up to 3 depth levels\n// of peek. Percentage margins resolve against width, so divide by\n// the aspect ratio to convert height-relative overhang to a\n// width-relative margin. Keeps the nav clear at any peek setting.\nconst navClearance=`calc(${3*peek/aspectRatio}% + 8px)`;if(total===0){return /*#__PURE__*/_jsx(\"div\",{style:{...stageStyle(aspectRatio),...placeholderStyle},children:\"Add page images in the properties panel\"});}return /*#__PURE__*/_jsxs(\"div\",{style:{position:\"relative\",width:\"100%\",display:\"flex\",flexDirection:\"column\",overflow:\"visible\"},children:[/*#__PURE__*/_jsx(\"div\",{ref:stageRef,style:stageStyle(aspectRatio),children:imageList.map((src,i)=>{const order=(i-current+total)%total;const isMover=mover?.index===i;const isReturner=returner===i;const moverDir=mover?.dir;const isTop=order===0;const zIndex=isMover?moverDir===\"fwd\"?1e3:0:total-order;const depth=Math.min(order,3);const restY=depth*peek;const restRot=isTop?0:(i%2===0?-1:1)*depth*.5;const restScale=1-depth*.012;return /*#__PURE__*/_jsx(motion.div,{initial:false,// Drag stays enabled for the top card for\n// the whole gesture; toggling it mid-gesture\n// cancels animations and strands cards.\n// Busy-gating happens in the handlers.\ndrag:!isCanvas&&isTop?\"x\":false,dragMomentum:false,dragSnapToOrigin:true,onDragStart:()=>{draggedRecently.current=true;},onDragEnd:(_,info)=>{timers.current.push(window.setTimeout(()=>{draggedRecently.current=false;},180));if(busy)return;if(info.offset.x<-80)go(\"fwd\",true);else if(info.offset.x>80)go(\"back\",true);// Below threshold: dragSnapToOrigin\n// springs the card home.\n},onTap:!isCanvas&&isTop?handleTap:undefined,onPointerMove:!isCanvas&&isTop?e=>setHoverZone(zoneFromX(e.clientX)):undefined,onPointerLeave:!isCanvas&&isTop?()=>setHoverZone(null):undefined,animate:isCanvas?undefined:isMover?{// Pixel keyframes so the exit\n// continues seamlessly from a\n// dragged position and\n// overrides the snap-home.\nx:[null,mover.exit,0],y:[null,`${restY}%`,`${restY}%`],rotate:[null,moverDir===\"fwd\"?-5:5,restRot],scale:[null,1,restScale]}:isReturner?{// Explicit return from the\n// dragged position into the\n// new slot beneath the top.\nx:[null,0],y:[null,`${restY}%`],rotate:[null,restRot],scale:[null,restScale]}:{x:0,y:`${restY}%`,rotate:restRot,scale:restScale},transition:isMover?{duration:speed,times:mover.fromDrag?[0,.4,1]:[0,.5,1],ease:mover.fromDrag?[\"easeOut\",\"easeOut\"]:[\"easeIn\",\"easeOut\"]}:isReturner?{duration:speed*.55,ease:\"easeOut\"}:{duration:speed*.6,ease:[.3,.7,.4,1]},style:{position:\"absolute\",top:0,left:0,right:0,bottom:0,zIndex,borderRadius:cardRadius,overflow:\"hidden\",cursor:isTop?cursorForZone:\"default\",boxShadow:!shadow?\"none\":isTop?\"0 10px 26px rgba(0,0,0,0.18)\":\"0 2px 6px rgba(0,0,0,0.05)\",backgroundColor:\"#FFFCF2\"},children:/*#__PURE__*/_jsx(\"img\",{src:src,alt:\"\",draggable:false,style:{width:\"100%\",height:\"100%\",objectFit:\"fill\",display:\"block\",pointerEvents:\"none\",userSelect:\"none\"}})},i);})}),showNav&&total>1&&/*#__PURE__*/_jsxs(\"div\",{style:{...navRowStyle,marginTop:navClearance,position:\"relative\",zIndex:1500},children:[/*#__PURE__*/_jsx(\"button\",{\"aria-label\":\"Previous page\",onClick:()=>go(\"back\"),style:arrowStyle,children:/*#__PURE__*/_jsx(\"svg\",{width:\"14\",height:\"14\",viewBox:\"0 0 14 14\",children:/*#__PURE__*/_jsx(\"path\",{d:\"M9.5 2 L4.5 7 L9.5 12\",fill:\"none\",stroke:navColor,strokeWidth:\"2\",strokeLinecap:\"round\",strokeLinejoin:\"round\"})})}),/*#__PURE__*/_jsx(\"div\",{style:dotsRowStyle,children:imageList.map((_,i)=>/*#__PURE__*/_jsx(\"button\",{\"aria-label\":`Go to page ${i+1}`,onClick:()=>{if(!busy&&i!==current)setCurrent(i);},style:{...dotStyle,width:i===current?9:6,height:i===current?9:6,backgroundColor:navColor,opacity:i===current?1:.35}},i))}),/*#__PURE__*/_jsx(\"button\",{\"aria-label\":\"Next page\",onClick:()=>go(\"fwd\"),style:arrowStyle,children:/*#__PURE__*/_jsx(\"svg\",{width:\"14\",height:\"14\",viewBox:\"0 0 14 14\",children:/*#__PURE__*/_jsx(\"path\",{d:\"M4.5 2 L9.5 7 L4.5 12\",fill:\"none\",stroke:navColor,strokeWidth:\"2\",strokeLinecap:\"round\",strokeLinejoin:\"round\"})})})]})]});}const stageStyle=ratio=>({position:\"relative\",width:\"100%\",aspectRatio:`${ratio}`,overflow:\"visible\",flexShrink:0});const navRowStyle={display:\"flex\",alignItems:\"center\",justifyContent:\"center\",gap:16,height:40,flexShrink:0};const arrowStyle={display:\"flex\",alignItems:\"center\",justifyContent:\"center\",width:32,height:32,borderRadius:\"50%\",border:\"none\",background:\"transparent\",cursor:\"pointer\",padding:0};const dotsRowStyle={display:\"flex\",alignItems:\"center\",gap:8};const dotStyle={borderRadius:\"50%\",border:\"none\",padding:0,cursor:\"pointer\",transition:\"all 200ms ease\"};const placeholderStyle={display:\"flex\",justifyContent:\"center\",alignItems:\"center\",fontFamily:\"sans-serif\",fontSize:14,color:\"#78736A\",background:\"#E8E3DA\",borderRadius:8,textAlign:\"center\",padding:20};addPropertyControls(CardStack,{pages:{type:ControlType.Array,title:\"Pages\",control:{type:ControlType.Image}},aspectRatio:{type:ControlType.Number,title:\"Ratio W/H\",defaultValue:1.294,min:.4,max:3,step:.001},speed:{type:ControlType.Number,title:\"Speed s\",defaultValue:.65,min:.3,max:2,step:.05},peek:{type:ControlType.Number,title:\"Stack Peek %\",defaultValue:1.6,min:0,max:5,step:.2},cardRadius:{type:ControlType.Number,title:\"Radius\",defaultValue:12,min:0,max:60},shadow:{type:ControlType.Boolean,title:\"Shadow\",defaultValue:true},showNav:{type:ControlType.Boolean,title:\"Navigation\",defaultValue:true},navColor:{type:ControlType.Color,title:\"Nav Color\",defaultValue:\"#1A1814\"}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"CardStack\",\"slots\":[],\"annotations\":{\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./CardStack.map"],"mappings":"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"}