UNPKG

react-loader-spinner

Version:

react-spinner-loader provides simple React.js spinner component which can be implemented for async wait operation before data load to the view.

5 lines 1.24 kB
import d from'styled-components';import {jsx,jsxs}from'react/jsx-runtime';var p="#4fa94d",g={"aria-busy":true,role:"progressbar"};var b=d.div` display: ${r=>r.$visible?"flex":"none"}; `;var l=20,S=r=>["M"+r+" 0c0-9.94-8.06",r,r,r].join("-"),f=(r,s,e)=>{let o=Math.max(r,s),n=-e-o/2+1,i=e*2+o;return [n,n,i,i].join(" ")},P=({height:r=80,width:s=80,color:e=p,secondaryColor:o=p,ariaLabel:n="oval-loading",wrapperStyle:i,wrapperClass:c,visible:u=true,strokeWidth:a=2,strokeWidthSecondary:m,animationDuration:v=1})=>jsx(b,{style:i,$visible:u,className:c,"data-testid":"oval-loading","aria-label":n,...g,children:jsx("svg",{width:s,height:r,viewBox:f(Number(a),Number(m||a),l),xmlns:"http://www.w3.org/2000/svg",stroke:e,"data-testid":"oval-svg",children:jsx("g",{fill:"none",fillRule:"evenodd",children:jsxs("g",{transform:"translate(1 1)",strokeWidth:Number(m||a),"data-testid":"oval-secondary-group",children:[jsx("circle",{strokeOpacity:".5",cx:"0",cy:"0",r:l,stroke:o,strokeWidth:a}),jsx("path",{d:S(l),children:jsx("animateTransform",{attributeName:"transform",type:"rotate",from:"0 0 0",to:"360 0 0",dur:`${v}s`,repeatCount:"indefinite"})})]})})})}); export{P as Oval};//# sourceMappingURL=oval.mjs.map //# sourceMappingURL=oval.mjs.map