{"version":3,"file":"LoadingButton.COZyw-LP.mjs","names":["useState","p"],"sources":["https:/framerusercontent.com/modules/CzOCM2863CQY9GHZqDkC/32DbkOWeA52mvt5fBfsO/LoadingButton.js"],"sourcesContent":["// Button with loading + confetti + subtle hover animation that fills the entire button\nimport{jsx as _jsx,jsxs as _jsxs}from\"react/jsx-runtime\";import{useState,useEffect,startTransition}from\"react\";import{addPropertyControls,ControlType}from\"framer\";import{motion,AnimatePresence}from\"framer-motion\";/**\n * @framerIntrinsicWidth 127\n * @framerIntrinsicHeight 40\n *\n * @framerSupportedLayoutWidth any-prefer-fixed\n * @framerSupportedLayoutHeight any-prefer-fixed\n */export default function LoadingButton(props){const{label,loadingDuration,resetDelay,backgroundColor,hoverColor,textColor,buttonFont,borderRadius,confettiColors,strokeWidth,strokeColor,doneText,doneTextColor,buttonType}=props;const[state,setState]=useState(\"idle\");const[isHover,setIsHover]=useState(false);const[confetti,setConfetti]=useState([]);useEffect(()=>{if(state===\"loading\"){const timer=setTimeout(()=>{startTransition(()=>setState(\"drop\"));},loadingDuration*1e3);return()=>clearTimeout(timer);}if(state===\"drop\"){const timer=setTimeout(()=>{startTransition(()=>{setState(\"confetti\");const particles=Array.from({length:36},(_,i)=>{const angle=-Math.PI/2+(Math.random()-.5)*Math.PI*.9;const distance=100+Math.random()*110;return{id:i,delay:Math.random()*.06,baseSize:6+Math.random()*6,rotation:360+Math.random()*720,color:confettiColors[Math.floor(Math.random()*confettiColors.length)],x:Math.cos(angle)*distance,y:Math.sin(angle)*distance,widthFactor:.6+Math.random()*1.4,heightFactor:.4+Math.random()*1.2,radius:Math.random()>.7?\"50%\":`${Math.random()*3}px`,startRotate:Math.random()*360};});setConfetti(particles);});},250);return()=>clearTimeout(timer);}if(state===\"confetti\"){const timer=setTimeout(()=>{startTransition(()=>setState(\"done\"));},1600);return()=>clearTimeout(timer);}if(state===\"done\"){const timer=setTimeout(()=>{startTransition(()=>{setState(\"idle\");setConfetti([]);});},resetDelay*1e3);return()=>clearTimeout(timer);}},[state]);const handleClick=e=>{if(state===\"idle\"){// If button type is submit, check form validity\nif(buttonType===\"submit\"){const button=e.currentTarget;const form=button.form;// If there's a form and it's invalid, don't trigger animation\nif(form&&!form.checkValidity()){return;}}startTransition(()=>setState(\"loading\"));}};return /*#__PURE__*/_jsxs(\"div\",{style:{position:\"relative\",display:\"inline-block\",width:\"100%\",height:\"100%\"},children:[/*#__PURE__*/_jsxs(motion.button,{type:buttonType,onClick:handleClick,disabled:state===\"loading\",onHoverStart:()=>setIsHover(true),onHoverEnd:()=>setIsHover(false),style:{...props.style,width:\"100%\",height:\"100%\",display:\"flex\",alignItems:\"center\",justifyContent:\"center\",padding:\"12px 24px\",backgroundColor,color:textColor,border:`${strokeWidth}px solid ${strokeColor}`,borderRadius,cursor:\"pointer\",overflow:\"hidden\",position:\"relative\",WebkitTapHighlightColor:\"transparent\",touchAction:\"manipulation\",...buttonFont},children:[/*#__PURE__*/_jsx(motion.div,{initial:{x:\"-100%\"},animate:{x:isHover?\"100%\":\"-100%\"},transition:{duration:isHover?.6:0,ease:\"easeInOut\"},style:{position:\"absolute\",inset:0,background:`linear-gradient(90deg, transparent 0%, ${hoverColor} 50%, transparent 100%)`,borderRadius,zIndex:0,pointerEvents:\"none\",opacity:.4}}),/*#__PURE__*/_jsxs(\"span\",{style:{position:\"relative\",zIndex:1,display:\"flex\",alignItems:\"center\",justifyContent:\"center\"},children:[state===\"idle\"&&label,(state===\"loading\"||state===\"drop\")&&/*#__PURE__*/_jsx(\"span\",{style:{display:\"flex\",alignItems:\"center\",justifyContent:\"center\",gap:4},children:[0,1,2].map(i=>/*#__PURE__*/_jsx(motion.span,{animate:state===\"loading\"?{opacity:[.3,1,.3]}:{y:14,opacity:0},transition:state===\"loading\"?{duration:1,repeat:Infinity,delay:i*.2}:{duration:.25,ease:\"easeIn\"},children:\"•\"},i))}),(state===\"confetti\"||state===\"done\")&&/*#__PURE__*/_jsx(\"span\",{style:{color:doneTextColor},children:doneText})]})]}),/*#__PURE__*/_jsx(AnimatePresence,{children:state===\"confetti\"&&confetti.map(p=>/*#__PURE__*/_jsx(motion.div,{initial:{position:\"absolute\",bottom:0,left:\"50%\",width:p.baseSize*p.widthFactor,height:p.baseSize*p.heightFactor,backgroundColor:p.color,borderRadius:p.radius,opacity:1,rotate:p.startRotate,translateX:\"-50%\"},animate:{x:p.x,y:p.y,rotate:p.rotation,opacity:[1,1,0]},transition:{duration:1.4,delay:p.delay,ease:[.2,.9,.2,1]},style:{pointerEvents:\"none\"}},p.id))})]});}addPropertyControls(LoadingButton,{label:{type:ControlType.String,title:\"Label\",defaultValue:\"Join Waitlist\"},doneText:{type:ControlType.String,title:\"Done Text\",defaultValue:\"You're In!\"},loadingDuration:{type:ControlType.Number,title:\"Loading\",defaultValue:2,min:.5,max:10,step:.5,unit:\"s\"},resetDelay:{type:ControlType.Number,title:\"Reset After\",defaultValue:.5,min:.1,max:10,step:.5,unit:\"s\"},backgroundColor:{type:ControlType.Color,title:\"Background\",defaultValue:\"#000\"},hoverColor:{type:ControlType.Color,title:\"Hover Color\",defaultValue:\"rgba(0, 143, 12, 0.86)\"},textColor:{type:ControlType.Color,title:\"Text\",defaultValue:\"#fff\"},confettiColors:{type:ControlType.Array,title:\"Confetti Colors\",control:{type:ControlType.Color},defaultValue:[\"#000\",\"#00FF11\",\"#000\",\"#00FF11\",\"#000\",\"#00FF11\"]},buttonFont:{type:ControlType.Font,title:\"Font\",controls:\"extended\",defaultFontType:\"sans-serif\",defaultValue:{fontSize:\"10px\",variant:\"Regular\"}},borderRadius:{type:ControlType.Number,title:\"Radius\",defaultValue:50,min:0,max:50,unit:\"px\"},strokeWidth:{type:ControlType.Number,title:\"Stroke Width\",defaultValue:.5,min:0,max:10,step:.1,unit:\"px\"},strokeColor:{type:ControlType.Color,title:\"Stroke Color\",defaultValue:\"#828282\"},doneTextColor:{type:ControlType.Color,title:\"Done Text Color\",defaultValue:\"#00FF11\"},buttonType:{type:ControlType.Enum,title:\"Button Type\",options:[\"submit\",\"button\"],optionTitles:[\"Submit\",\"Button\"],defaultValue:\"submit\",displaySegmentedControl:true}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"LoadingButton\",\"slots\":[],\"annotations\":{\"framerSupportedLayoutHeight\":\"any-prefer-fixed\",\"framerSupportedLayoutWidth\":\"any-prefer-fixed\",\"framerIntrinsicWidth\":\"127\",\"framerContractVersion\":\"1\",\"framerIntrinsicHeight\":\"40\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./LoadingButton.map"],"mappings":"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"}