{
  "version": 3,
  "sources": ["ssg:https://framerusercontent.com/modules/qegDtnpPGe4XLrzdP3L6/h1dMGSDqAx9ECG7W6qul/Rings.js"],
  "sourcesContent": ["import{jsx as _jsx}from\"react/jsx-runtime\";import{Frame,addPropertyControls,ControlType,motion}from\"framer\";export function ConcentricRings({smallestRingDiameter,thickness,ringCount,color,opacityVariation,opaqueRing}){const rings=[];// Calculate the outer diameter of the largest ring based on the smallest ring and thickness\nconst largestRingDiameter=smallestRingDiameter+2*thickness*(ringCount-1);for(let i=0;i<ringCount;i++){const outerDiameter=largestRingDiameter-i*2*thickness;const innerDiameter=outerDiameter-2*thickness;// Ensure that the opacity starts at 1 for either smallest or largest\nconst opacity=opaqueRing===\"Smallest\"?1-i/(ringCount-1)*opacityVariation// Smallest is opaque, fade outward\n:1-(ringCount-1-i)/(ringCount-1)*opacityVariation// Largest is opaque, fade inward\n;rings.push(/*#__PURE__*/_jsx(motion.div,{style:{position:\"absolute\",top:\"50%\",left:\"50%\",width:`${outerDiameter}px`,height:`${outerDiameter}px`,borderRadius:\"50%\",backgroundColor:color,opacity:opacity,display:\"flex\",justifyContent:\"center\",alignItems:\"center\",transform:\"translate(-50%, -50%)\",boxSizing:\"border-box\"},children:/*#__PURE__*/_jsx(motion.div,{style:{width:`${innerDiameter}px`,height:`${innerDiameter}px`,borderRadius:\"50%\",backgroundColor:\"white\"}})},i));}return /*#__PURE__*/_jsx(Frame,{style:{position:\"relative\",overflow:\"hidden\",width:\"100%\",height:\"100%\",background:\"none\"},children:rings});}// Add property controls to customize the rings in Framer\naddPropertyControls(ConcentricRings,{smallestRingDiameter:{type:ControlType.Number,title:\"Smallest Ring Diameter\",min:10,max:300,defaultValue:50},thickness:{type:ControlType.Number,title:\"Thickness\",min:1,max:50,defaultValue:20},ringCount:{type:ControlType.Number,title:\"Number of Rings\",min:1,max:10,defaultValue:5},opacityVariation:{type:ControlType.Number,title:\"Opacity Variation\",min:0,max:1,step:.1,defaultValue:.8},opaqueRing:{type:ControlType.Enum,title:\"Opaque Ring\",options:[\"Smallest\",\"Largest\"],optionTitles:[\"Smallest\",\"Largest\"],defaultValue:\"Smallest\"},color:{type:ControlType.Color,title:\"Ring Color\",defaultValue:\"#FF5733\"}});\nexport const __FramerMetadata__ = {\"exports\":{\"ConcentricRings\":{\"type\":\"reactComponent\",\"name\":\"ConcentricRings\",\"slots\":[],\"annotations\":{\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./Rings.map"],
  "mappings": "qEAAmH,SAASA,EAAgB,CAAC,qBAAAC,EAAqB,UAAAC,EAAU,UAAAC,EAAU,MAAAC,EAAM,iBAAAC,EAAiB,WAAAC,CAAU,EAAE,CAAC,IAAMC,EAAM,CAAC,EACjOC,EAAoBP,EAAqB,EAAEC,GAAWC,EAAU,GAAG,QAAQM,EAAE,EAAEA,EAAEN,EAAUM,IAAI,CAAC,IAAMC,EAAcF,EAAoBC,EAAE,EAAEP,EAAgBS,EAAcD,EAAc,EAAER,EAC1LU,EAAQN,IAAa,WAAW,EAAEG,GAAGN,EAAU,GAAGE,EACvD,GAAGF,EAAU,EAAEM,IAAIN,EAAU,GAAGE,EAChCE,EAAM,KAAkBM,EAAKC,EAAO,IAAI,CAAC,MAAM,CAAC,SAAS,WAAW,IAAI,MAAM,KAAK,MAAM,MAAM,GAAGJ,CAAa,KAAK,OAAO,GAAGA,CAAa,KAAK,aAAa,MAAM,gBAAgBN,EAAM,QAAQQ,EAAQ,QAAQ,OAAO,eAAe,SAAS,WAAW,SAAS,UAAU,wBAAwB,UAAU,YAAY,EAAE,SAAsBC,EAAKC,EAAO,IAAI,CAAC,MAAM,CAAC,MAAM,GAAGH,CAAa,KAAK,OAAO,GAAGA,CAAa,KAAK,aAAa,MAAM,gBAAgB,OAAO,CAAC,CAAC,CAAC,EAAEF,CAAC,CAAC,CAAE,CAAC,OAAoBI,EAAKE,EAAM,CAAC,MAAM,CAAC,SAAS,WAAW,SAAS,SAAS,MAAM,OAAO,OAAO,OAAO,WAAW,MAAM,EAAE,SAASR,CAAK,CAAC,CAAE,CACpmBS,EAAoBhB,EAAgB,CAAC,qBAAqB,CAAC,KAAKiB,EAAY,OAAO,MAAM,yBAAyB,IAAI,GAAG,IAAI,IAAI,aAAa,EAAE,EAAE,UAAU,CAAC,KAAKA,EAAY,OAAO,MAAM,YAAY,IAAI,EAAE,IAAI,GAAG,aAAa,EAAE,EAAE,UAAU,CAAC,KAAKA,EAAY,OAAO,MAAM,kBAAkB,IAAI,EAAE,IAAI,GAAG,aAAa,CAAC,EAAE,iBAAiB,CAAC,KAAKA,EAAY,OAAO,MAAM,oBAAoB,IAAI,EAAE,IAAI,EAAE,KAAK,GAAG,aAAa,EAAE,EAAE,WAAW,CAAC,KAAKA,EAAY,KAAK,MAAM,cAAc,QAAQ,CAAC,WAAW,SAAS,EAAE,aAAa,CAAC,WAAW,SAAS,EAAE,aAAa,UAAU,EAAE,MAAM,CAAC,KAAKA,EAAY,MAAM,MAAM,aAAa,aAAa,SAAS,CAAC,CAAC",
  "names": ["ConcentricRings", "smallestRingDiameter", "thickness", "ringCount", "color", "opacityVariation", "opaqueRing", "rings", "largestRingDiameter", "i", "outerDiameter", "innerDiameter", "opacity", "p", "motion", "Frame", "addPropertyControls", "ControlType"]
}
