{"version":3,"file":"PingAnimation.Ca-IicdR.mjs","names":["useId","useState","useMemo","startTransition"],"sources":["https:/framerusercontent.com/modules/agvm4splgKmHsqtnFnsF/Xi0n0V0q47qHXoWXJjzO/PingAnimation.js"],"sourcesContent":["// User instructions: Make the dot colour a gradient\n// Simple ping animation - a dot with expanding rings\nimport{jsx as _jsx,jsxs as _jsxs}from\"react/jsx-runtime\";import{motion,useReducedMotion}from\"framer-motion\";import{addPropertyControls,ControlType}from\"framer\";import{startTransition,useId,useMemo,useState}from\"react\";/**\n * @framerSupportedLayoutWidth fixed\n * @framerSupportedLayoutHeight fixed\n */export default function PingAnimation(props){const{dotColor,dotColor2,ringColor,dotSize,ringSize,animationSpeed,ringCount,loop,ariaLabel,ariaDescription,focusable}=props;const descId=useId();const shouldReduceMotion=useReducedMotion();const[isFocused,setIsFocused]=useState(false);const a11yDescription=useMemo(()=>{if(!ariaDescription)return\"\";return ariaDescription;},[ariaDescription]);return /*#__PURE__*/_jsxs(\"div\",{role:\"img\",\"aria-label\":ariaLabel,\"aria-describedby\":a11yDescription?descId:undefined,tabIndex:focusable?0:-1,onFocus:focusable?()=>startTransition(()=>setIsFocused(true)):undefined,onBlur:focusable?()=>startTransition(()=>setIsFocused(false)):undefined,style:{width:\"100%\",height:\"100%\",display:\"flex\",alignItems:\"center\",justifyContent:\"center\",position:\"relative\",outline:\"none\",boxShadow:isFocused?\"0 0 0 3px rgba(0, 153, 255, 0.35)\":\"none\",borderRadius:9999},children:[a11yDescription?/*#__PURE__*/_jsx(\"span\",{id:descId,style:{position:\"absolute\",width:1,height:1,padding:0,margin:-1,overflow:\"hidden\",clip:\"rect(0, 0, 0, 0)\",whiteSpace:\"nowrap\",border:0},children:a11yDescription}):null,Array.from({length:ringCount}).map((_,index)=>/*#__PURE__*/_jsx(motion.div,{\"aria-hidden\":\"true\",style:{position:\"absolute\",top:\"50%\",left:\"50%\",width:dotSize,height:dotSize,borderRadius:\"50%\",backgroundColor:ringColor,transform:\"translate(-50%, -50%)\",willChange:shouldReduceMotion?undefined:\"width, height, opacity\"},initial:shouldReduceMotion?false:{width:dotSize,height:dotSize,opacity:0},animate:shouldReduceMotion?undefined:{width:[dotSize,ringSize],height:[dotSize,ringSize],opacity:[0,.35,.35,0]},transition:shouldReduceMotion?undefined:{type:\"tween\",duration:animationSpeed,repeat:loop?Infinity:0,ease:[.22,1,.36,1],repeatType:\"loop\",delay:index*(animationSpeed/ringCount),times:[0,.3,.7,1]}},index)),/*#__PURE__*/_jsx(\"div\",{\"aria-hidden\":\"true\",style:{width:dotSize,height:dotSize,borderRadius:\"50%\",backgroundColor:dotColor,backgroundImage:`radial-gradient(circle, ${dotColor} 0%, ${dotColor2} 100%)`,backgroundSize:\"cover\",position:\"relative\",zIndex:1}})]});}addPropertyControls(PingAnimation,{ariaLabel:{type:ControlType.String,title:\"ARIA Label\",defaultValue:\"Ping animation\"},ariaDescription:{type:ControlType.String,title:\"ARIA Description\",defaultValue:\"An animated indicator consisting of a central dot with expanding rings.\",displayTextArea:true},focusable:{type:ControlType.Boolean,title:\"Focusable\",defaultValue:true,enabledTitle:\"Yes\",disabledTitle:\"No\"},loop:{type:ControlType.Boolean,title:\"Loop\",defaultValue:true,enabledTitle:\"On\",disabledTitle:\"Off\"},dotColor:{type:ControlType.Color,title:\"Dot Color 1\",defaultValue:\"#0099FF\"},dotColor2:{type:ControlType.Color,title:\"Dot Color 2\",defaultValue:\"#8855FF\"},ringColor:{type:ControlType.Color,title:\"Ring Color\",defaultValue:\"#0099FF\"},dotSize:{type:ControlType.Number,title:\"Dot Size\",defaultValue:700,min:1,max:1200,step:1,unit:\"px\"},ringSize:{type:ControlType.Number,title:\"Ring Size\",defaultValue:1200,min:1,max:2e3,step:1,unit:\"px\"},animationSpeed:{type:ControlType.Number,title:\"Speed\",defaultValue:1.5,min:.5,max:5,step:.1,unit:\"s\"},ringCount:{type:ControlType.Number,title:\"Ring Count\",defaultValue:3,min:1,max:5,step:1,displayStepper:true}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"PingAnimation\",\"slots\":[],\"annotations\":{\"framerSupportedLayoutWidth\":\"fixed\",\"framerContractVersion\":\"1\",\"framerSupportedLayoutHeight\":\"fixed\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./PingAnimation.map"],"mappings":"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"}