react-loader-spinner/dist/line-wave.cjs

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

'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 i="#4fa94d",a={"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 A=({wrapperStyle:r={},visible:o=true,wrapperClass:p="",height:l=100,width:m=100,color:t=i,ariaLabel:g="line-wave-loading",firstLineColor:b,middleLineColor:d,lastLineColor:u})=>jsxRuntime.jsx(n,{style:r,$visible:o,className:p,"data-testid":"line-wave-wrapper","aria-label":g,...a,children:jsxRuntime.jsxs("svg",{version:"1.1",height:`${l}`,width:`${m}`,xmlns:s,x:"0px",y:"0px",viewBox:"0 0 100 100",enableBackground:"new 0 0 0 0",xmlSpace:"preserve","data-testid":"line-wave-svg",children:[jsxRuntime.jsx("rect",{x:"20",y:"50",width:"4",height:"10",fill:b||t,children:jsxRuntime.jsx("animateTransform",{attributeType:"xml",attributeName:"transform",type:"translate",values:"0 0; 0 20; 0 0",begin:"0",dur:"0.6s",repeatCount:"indefinite"})}),jsxRuntime.jsx("rect",{x:"30",y:"50",width:"4",height:"10",fill:d||t,children:jsxRuntime.jsx("animateTransform",{attributeType:"xml",attributeName:"transform",type:"translate",values:"0 0; 0 20; 0 0",begin:"0.2s",dur:"0.6s",repeatCount:"indefinite"})}),jsxRuntime.jsx("rect",{x:"40",y:"50",width:"4",height:"10",fill:u||t,children:jsxRuntime.jsx("animateTransform",{attributeType:"xml",attributeName:"transform",type:"translate",values:"0 0; 0 20; 0 0",begin:"0.4s",dur:"0.6s",repeatCount:"indefinite"})})]})});
exports.LineWave=A;//# sourceMappingURL=line-wave.cjs.map
//# sourceMappingURL=line-wave.cjs.map