UNPKG

ldrs

Version:

Minimalist loading animations for React and web components

3 lines (2 loc) 820 B
import{jsx as e,jsxs as t}from"react/jsx-runtime";var a="container_5b72ca",r="inner_4fdcf0",c="car_dffe76",i="track_5abec2";const s=({size:s=40,color:n="black",speed:o=.8,stroke:l=5,strokeLength:p=.25,bgOpacity:h=.1})=>{const d=parseInt(s+""),b=parseInt(l+""),g=d/2,u=Math.max(0,d/2-b/2);return e("div",{className:a,style:{"--uib-size":s+"px","--uib-color":n,"--uib-speed":o+"s","--uib-dash":String(100*parseFloat(p+"")),"--uib-gap":String(100-100*parseFloat(p+"")),"--uib-bg-opacity":h+""},children:t("svg",{className:r,viewBox:`${g} ${g} ${s} ${s}`,height:s,width:s,children:[e("circle",{className:i,cx:s,cy:s,r:u,pathLength:"100",strokeWidth:`${l}px`,fill:"none"}),e("circle",{className:c,cx:s,cy:s,r:u,pathLength:"100",strokeWidth:`${l}px`,fill:"none"})]})})};export{s as default}; //# sourceMappingURL=Ring2.js.map