{"version":3,"file":"SparkleButton.XRB8Gcn2.mjs","names":["useRef","useState"],"sources":["https:/framerusercontent.com/modules/NvSUF6BbRg9ZpvZJZvEn/PwzpzEyVyB8TIsGzHbk3/SparkleButton.js"],"sourcesContent":["import{jsx as _jsx,jsxs as _jsxs}from\"react/jsx-runtime\";import{addPropertyControls,ControlType}from\"framer\";import{useRef,useState}from\"react\";import{motion}from\"framer-motion\";/**\n * These annotations control how your component sizes\n * Learn more: https://www.framer.com/developers/#code-components-auto-sizing\n *\n * @framerSupportedLayoutWidth 200\n * @framerSupportedLayoutHeight 200\n */export default function SparkleButton(props){const ref=useRef(null);const[isHover,setHover]=useState(false);const[isPressed,setPressed]=useState(false);const handleMouseDown=()=>{setPressed(true);};const handleMouseUp=()=>{setPressed(false);};const handleCick=event=>{setHover(true);if(props.smoothScroll){var _this;event.preventDefault();const link=event.currentTarget;const anchorId=new URL((_this=link)===null||_this===void 0?void 0:_this.href).hash.replace(\"#\",\"\");const anchor=document.getElementById(anchorId);window.scrollTo({top:anchor===null||anchor===void 0?void 0:anchor.offsetTop,behavior:\"smooth\"});}};const handleMouseEnter=()=>{setHover(true);};const handleMouseLeave=()=>{setHover(false);setPressed(false);};const borderRadius=props.border.isMixed?`${props.border.topLeft}px ${props.border.topRight}px ${props.border.bottomRight}px ${props.border.bottomLeft}px`:`${props.border.radius}px`;const borderColor=isHover?props.hover.border:props.border.color;const style={display:\"flex\",justifyContent:\"center\",cursor:\"pointer\",position:\"relative\",alignItems:\"center\",gap:`${props.gap}px`,borderRadius,paddingBlockStart:props.size*5-1,paddingBlockEnd:props.size*5,paddingInline:props.label?props.size*9:props.size*7,backgroundColor:isHover?props.hover.background:props.background,borderWidth:props.border.width,borderColor,width:props.width,borderStyle:props.border.style,color:isHover?props.hover.color:props.text.color,textAlign:props.text.align,textTransform:props.text.transform,fontFamily:\"Manrope, sans-serif\",fontWeight:700,letterSpacing:\"0.05em\",fontSize:\"16px\",textDecoration:\"none\",scale:isPressed?.95:1,transition:\"all 0.2s ease\",...props.text.font};const beforeAfterStyle={position:\"absolute\",width:\"150%\",left:\"50%\",height:\"100%\",transform:\"translateX(-50%)\",backgroundRepeat:\"no-repeat\",pointerEvents:\"none\",fontSize:\"100px\"};const beforeHoverStyle={...beforeAfterStyle,top:\"-70%\",backgroundImage:`radial-gradient(circle, ${borderColor} 20%, transparent 20%), radial-gradient(circle, transparent 20%, ${borderColor} 20%, transparent 30%), radial-gradient(circle, ${borderColor} 20%, transparent 20%), radial-gradient(circle, ${borderColor} 20%, transparent 20%), radial-gradient(circle, transparent 10%, ${borderColor} 15%, transparent 20%), radial-gradient(circle, ${borderColor} 20%, transparent 20%), radial-gradient(circle, ${borderColor} 20%, transparent 20%), radial-gradient(circle, ${borderColor} 20%, transparent 20%), radial-gradient(circle, ${borderColor} 20%, transparent 20%)`,backgroundSize:\"0.1em 0.1em, 0.2em 0.2em, 0.15em 0.15em, 0.2em 0.2em, 0.18em 0.18em, 0.1em 0.1em, 0.15em 0.15em, 0.1em 0.1em, 0.18em 0.18em\",backgroundPosition:\"50% 120%\"};const afterHoverStyle={...beforeAfterStyle,bottom:\"-70%\",backgroundImage:`radial-gradient(circle, ${borderColor} 20%, transparent 20%), radial-gradient(circle, ${borderColor} 20%, transparent 20%), radial-gradient(circle, transparent 10%, ${borderColor} 15%, transparent 20%), radial-gradient(circle, ${borderColor} 20%, transparent 20%), radial-gradient(circle, ${borderColor} 20%, transparent 20%), radial-gradient(circle, ${borderColor} 20%, transparent 20%), radial-gradient(circle, ${borderColor} 20%, transparent 20%)`,backgroundSize:\"0.15em 0.15em, 0.2em 0.2em, 0.18em 0.18em, 0.2em 0.2em, 0.15em 0.15em, 0.2em 0.2em, 0.18em 0.18em\",backgroundPosition:\"50% 0%\"};const before=/*#__PURE__*/_jsx(motion.span,{\"aria-hidden\":\"true\",style:isHover?beforeHoverStyle:beforeAfterStyle,transition:{duration:.32,ease:\"easeInOut\"},animate:isHover?{backgroundPosition:[\"5% 90%, 10% 90%, 10% 90%, 15% 90%, 25% 90%, 25% 90%, 40% 90%, 55% 90%, 70% 90%\",\"0% 80%, 0% 20%, 10% 40%, 20% 0%, 30% 30%, 22% 50%, 50% 50%, 65% 20%, 90% 30%\",\"0% 70%, 0% 10%, 10% 30%, 20% -10%, 30% 20%, 22% 40%, 50% 40%, 65% 10%, 90% 20%\"],backgroundSize:\"0em 0em, 0em 0em, 0em 0em, 0em 0em, 0em 0em, 0em 0em\"}:null});const after=/*#__PURE__*/_jsx(motion.span,{\"aria-hidden\":\"true\",style:isHover?afterHoverStyle:beforeAfterStyle,transition:{duration:.32,ease:\"easeInOut\"},animate:isHover?{backgroundPosition:[\"10% -10%, 30% 10%, 55% -10%, 70% -10%, 85% -10%,70% -10%, 70% 0%\",\"0% 80%, 20% 80%, 45% 60%, 60% 100%, 75% 70%, 95% 60%, 105% 0%\",\"0% 90%, 20% 90%, 45% 70%, 60% 110%, 75% 80%, 95% 70%, 110% 10%\"],backgroundSize:\"0em 0em, 0em 0em, 0em 0em, 0em 0em, 0em 0em, 0em 0em\"}:null});const iconStart=props.iconStart.length>0?props.iconStart:null;const hoverIconStart=props.hoverIconStart.length>0?props.hoverIconStart:iconStart;const iconEnd=props.iconEnd.length>0?props.iconEnd:null;const hoverIconEnd=props.hoverIconEnd.length>0?props.hoverIconEnd:iconEnd;return props.link?/*#__PURE__*/_jsxs(motion.a,{\"aria-label\":props.label,href:props.link,target:props.newTab?\"_blank\":\"_self\",ref:ref,onMouseEnter:props.action==\"hover\"?handleMouseEnter:null,onClick:props.action==\"click\"?handleCick:null,onMouseDown:handleMouseDown,onMouseUp:handleMouseUp,onMouseLeave:handleMouseLeave,style:{...style,display:\"inline-flex\"},children:[before,props.showIcon?isHover?hoverIconStart:iconStart:null,props.label,props.showIcon?isHover?hoverIconEnd:iconEnd:null,after]}):/*#__PURE__*/_jsxs(motion.button,{\"aria-label\":props.label,onTap:props.onTap,ref:ref,onMouseEnter:props.action==\"hover\"?handleMouseEnter:null,onClick:props.action==\"click\"?handleCick:null,onMouseDown:handleMouseDown,onMouseUp:handleMouseUp,onMouseLeave:handleMouseLeave,style:style,children:[before,props.showIcon?isHover?hoverIconStart:iconStart:null,props.label,props.showIcon?isHover?hoverIconEnd:iconEnd:null,after]});}SparkleButton.defaultProps={label:\"Label\",text:{font:{},color:\"#fafafa\",align:\"left\",transform:\"none\"},background:\"#4171E0\",border:{width:1,style:\"solid\",color:\"#4171E0\",radius:100,isMixed:true,topLeft:100,topRight:100,bottomRight:100,bottomLeft:100},size:2,action:\"hover\",hover:{background:\"#4171E0\",color:\"#fafafa\",border:\"#4171E0\"},showIcon:true,iconStart:null,iconEnd:null,hoverIconStart:null,hoverIconEnd:null,gap:12};addPropertyControls(SparkleButton,{label:{title:\"Label\",type:ControlType.String},text:{title:\"Font\",type:ControlType.Object,controls:{font:{type:\"font\",controls:\"extended\"},color:{title:\"Color\",type:ControlType.Color},align:{title:\"Text Align\",type:ControlType.Enum,displaySegmentedControl:true,optionTitles:[\"Left\",\"Center\",\"Right\"],options:[\"left\",\"center\",\"right\"]},transform:{title:\"Text Transform\",type:ControlType.Enum,optionTitles:[\"None\",\"Capitalize\",\"Uppercase\",\"Lowercase\"],options:[\"none\",\"capitalize\",\"uppercase\",\"lowercase\"]}}},background:{title:\"Background\",type:ControlType.Color},border:{title:\"Border\",type:ControlType.Object,controls:{width:{title:\"Width\",type:ControlType.Number,max:10,min:0,step:1},style:{type:ControlType.Enum,options:[\"solid\",\"dashed\",\"dotted\",\"double\"],optionTitles:[\"Solid\",\"Dashed\",\"Dotted\",\"Double\"]},color:{title:\"Color\",type:ControlType.Color},radius:{type:ControlType.FusedNumber,title:\"Radius\",defaultValue:100,toggleKey:\"isMixed\",toggleTitles:[\"All\",\"Individual\"],valueKeys:[\"topLeft\",\"topRight\",\"bottomRight\",\"bottomLeft\"],valueLabels:[\"TL\",\"TR\",\"BR\",\"BL\"],min:0}}},size:{title:\"Size\",type:ControlType.Number,max:5,min:1,step:1,displayStepper:true,defaultValue:2},action:{title:\"Action\",type:ControlType.SegmentedEnum,options:[\"hover\",\"click\"],optionTitles:[\"Hover\",\"Click\"]},hover:{title:\"Hover\",type:ControlType.Object,controls:{background:{title:\"Background\",type:ControlType.Color},color:{title:\"Color\",type:ControlType.Color},border:{title:\"Border Color\",type:ControlType.Color}}},onTap:{type:ControlType.EventHandler},showIcon:{title:\"Show Icons\",type:ControlType.Boolean},iconStart:{title:\"Start Icon\",type:ControlType.ComponentInstance},hoverIconStart:{title:\"Hover Start Icon\",type:ControlType.ComponentInstance},iconEnd:{title:\"End Icon\",type:ControlType.ComponentInstance},hoverIconEnd:{title:\"Hover End Icon\",type:ControlType.ComponentInstance},gap:{title:\"Gap\",type:ControlType.Number,max:24,min:0,step:1},link:{title:\"Link To\",type:ControlType.Link},newTab:{title:\"New Tab\",type:ControlType.Boolean,defaultValue:false},smoothScroll:{title:\"Smooth Scroll\",type:ControlType.Boolean,defaultValue:false}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"SparkleButton\",\"slots\":[],\"annotations\":{\"framerContractVersion\":\"1\",\"framerSupportedLayoutHeight\":\"200\",\"framerSupportedLayoutWidth\":\"200\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./SparkleButton.map"],"mappings":"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"}