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.33 kB
'use strict';var v=require('styled-components'),jsxRuntime=require('react/jsx-runtime');function _interopDefault(e){return e&&e.__esModule?e:{default:e}}var v__default=/*#__PURE__*/_interopDefault(v);var o="#4fa94d",i={"aria-busy":true,role:"progressbar"};var n=v__default.default.div` display: ${r=>r.$visible?"flex":"none"}; `;var s="http://www.w3.org/2000/svg";var x=({radius:r=45,strokeWidth:a=5,color:t=o,secondaryColor:l,ariaLabel:p="revolving-dot-loading",wrapperStyle:c,wrapperClass:g,visible:m=true})=>jsxRuntime.jsx(n,{style:c,$visible:m,className:g,"aria-label":p,"data-testid":"revolving-dot-loading",...i,children:jsxRuntime.jsxs("svg",{version:"1.1",width:`calc(${r} * 2.5)`,height:`calc(${r} * 2.5)`,xmlns:s,x:"0px",y:"0px","data-testid":"revolving-dot-svg",children:[jsxRuntime.jsx("circle",{fill:"none",stroke:l||t,strokeWidth:a,cx:`calc(${r} * 1.28)`,cy:`calc(${r} * 1.28)`,r,style:{opacity:.5}}),jsxRuntime.jsx("circle",{fill:t,stroke:t,strokeWidth:"3",cx:`calc(${r} * 1.28)`,cy:`calc(${r} / 3.5)`,r:`calc(${r} / 5)`,style:{transformOrigin:"50% 50%"},children:jsxRuntime.jsx("animateTransform",{attributeName:"transform",dur:"2s",type:"rotate",from:"0",to:"360",repeatCount:"indefinite"})})]})}); exports.RevolvingDot=x;//# sourceMappingURL=revolving-dot.cjs.map //# sourceMappingURL=revolving-dot.cjs.map