ldrs/dist/react/Reuleaux.js

Minimalist loading animations for React and web components

import{jsx as e,jsxs as t}from"react/jsx-runtime";import{s}from"../scaleD-CuhdI9fg.js";var a="container_f315c9",i="inner_223de4",r="car_f1f6ed",o="track_497741";const c=({size:c=37,color:n="black",speed:p=.9,stroke:l=5,strokeLength:d=.15,bgOpacity:h=.1})=>{const g=parseInt(c+""),m=s(g/50,"M49.5,42.9c0-18.1-9.9-34-24.5-42.4C10.4,9,0.5,24.8,0.5,42.9c7.2,4.2,15.6,6.6,24.5,6.6S42.3,47.1,49.5,42.9z");return e("div",{className:a,style:{"--uib-size":c+"px","--uib-color":n,"--uib-speed":p+"s","--uib-dash":String(100*parseFloat(d+"")),"--uib-gap":String(100-100*parseFloat(d+"")),"--uib-bg-opacity":h+""},children:t("svg",{className:i,x:"0px",y:"0px",viewBox:`0 0 ${c} ${c}`,height:c,width:c,preserveAspectRatio:"xMidYMid meet",children:[e("path",{className:o,strokeWidth:l,fill:"none",pathLength:"100",d:m}),e("path",{className:r,strokeWidth:l,fill:"none",pathLength:"100",d:m})]})})};export{c as default};
//# sourceMappingURL=Reuleaux.js.map