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.
3 lines • 13 kB
JavaScript
'use strict';var u=require('tinycolor2'),jsxRuntime=require('react/jsx-runtime');function _interopDefault(e){return e&&e.__esModule?e:{default:e}}var u__default=/*#__PURE__*/_interopDefault(u);var r={"aria-busy":true,role:"progressbar"};var m="http://www.w3.org/2000/svg";var $=({visible:l=true,width:c="80",height:b="80",wrapperClass:p="",wrapperStyle:y={},ariaLabel:f="dna-loading",dnaColorOne:i="rgba(233, 12, 89, 0.51)",dnaColorTwo:t="#46dff0"})=>{let n=u__default.default(i).lighten(15).setAlpha(1).toRgbString(),s=u__default.default(t).desaturate(60).setAlpha(.15).toRgbString();return l?jsxRuntime.jsxs("svg",{xmlns:m,width:c,height:b,viewBox:"0 0 100 100",preserveAspectRatio:"xMidYMid",className:p,style:y,"aria-label":f,"data-testid":"dna-svg",...r,children:[jsxRuntime.jsxs("circle",{cx:"6.451612903225806",cy:"60.6229",r:"3.41988",fill:i,children:[jsxRuntime.jsx("animate",{attributeName:"r",keyTimes:"0;0.5;1",values:"2.4000000000000004;3.5999999999999996;2.4000000000000004",dur:"2s",repeatCount:"indefinite",begin:"-0.5s"}),jsxRuntime.jsx("animate",{attributeName:"cy",keyTimes:"0;0.5;1",values:"30.5;69.5;30.5",dur:"2s",repeatCount:"indefinite",begin:"0s",keySplines:"0.5 0 0.5 1;0.5 0 0.5 1",calcMode:"spline"}),jsxRuntime.jsx("animate",{attributeName:"fill",keyTimes:"0;0.5;1",values:`${i};${n};${i}`,dur:"2s",repeatCount:"indefinite",begin:"-0.5s"})]}),jsxRuntime.jsxs("circle",{cx:"6.451612903225806",cy:"39.3771",r:"2.58012",fill:t,children:[jsxRuntime.jsx("animate",{attributeName:"r",keyTimes:"0;0.5;1",values:"2.4000000000000004;3.5999999999999996;2.4000000000000004",dur:"2s",repeatCount:"indefinite",begin:"-1.5s"}),jsxRuntime.jsx("animate",{attributeName:"cy",keyTimes:"0;0.5;1",values:"30.5;69.5;30.5",dur:"2s",repeatCount:"indefinite",begin:"-1s",keySplines:"0.5 0 0.5 1;0.5 0 0.5 1",calcMode:"spline"}),jsxRuntime.jsx("animate",{attributeName:"fill",keyTimes:"0;0.5;1",values:`${t};${s};${t}`,dur:"2s",repeatCount:"indefinite",begin:"-0.5s"})]}),jsxRuntime.jsxs("circle",{cx:"16.129032258064512",cy:"68.1552",r:"3.17988",fill:i,children:[jsxRuntime.jsx("animate",{attributeName:"r",keyTimes:"0;0.5;1",values:"2.4000000000000004;3.5999999999999996;2.4000000000000004",dur:"2s",repeatCount:"indefinite",begin:"-0.7s"}),jsxRuntime.jsx("animate",{attributeName:"cy",keyTimes:"0;0.5;1",values:"30.5;69.5;30.5",dur:"2s",repeatCount:"indefinite",begin:"-0.2s",keySplines:"0.5 0 0.5 1;0.5 0 0.5 1",calcMode:"spline"}),jsxRuntime.jsx("animate",{attributeName:"fill",keyTimes:"0;0.5;1",values:`${i};${n};${i}`,dur:"2s",repeatCount:"indefinite",begin:"-0.7s"})]}),jsxRuntime.jsxs("circle",{cx:"16.129032258064512",cy:"31.8448",r:"2.82012",fill:t,children:[jsxRuntime.jsx("animate",{attributeName:"r",keyTimes:"0;0.5;1",values:"2.4000000000000004;3.5999999999999996;2.4000000000000004",dur:"2s",repeatCount:"indefinite",begin:"-1.7s"}),jsxRuntime.jsx("animate",{attributeName:"cy",keyTimes:"0;0.5;1",values:"30.5;69.5;30.5",dur:"2s",repeatCount:"indefinite",begin:"-1.2s",keySplines:"0.5 0 0.5 1;0.5 0 0.5 1",calcMode:"spline"}),jsxRuntime.jsx("animate",{attributeName:"fill",keyTimes:"0;0.5;1",values:`${t};${s};${t}`,dur:"2s",repeatCount:"indefinite",begin:"-0.7s"})]}),jsxRuntime.jsxs("circle",{cx:"25.806451612903224",cy:"69.3634",r:"2.93988",fill:i,children:[jsxRuntime.jsx("animate",{attributeName:"r",keyTimes:"0;0.5;1",values:"2.4000000000000004;3.5999999999999996;2.4000000000000004",dur:"2s",repeatCount:"indefinite",begin:"-0.9s"}),jsxRuntime.jsx("animate",{attributeName:"cy",keyTimes:"0;0.5;1",values:"30.5;69.5;30.5",dur:"2s",repeatCount:"indefinite",begin:"-0.4s",keySplines:"0.5 0 0.5 1;0.5 0 0.5 1",calcMode:"spline"}),jsxRuntime.jsx("animate",{attributeName:"fill",keyTimes:"0;0.5;1",values:`${i};${n};${i}`,dur:"2s",repeatCount:"indefinite",begin:"-0.9s"})]}),jsxRuntime.jsxs("circle",{cx:"25.806451612903224",cy:"30.6366",r:"3.06012",fill:t,children:[jsxRuntime.jsx("animate",{attributeName:"r",keyTimes:"0;0.5;1",values:"2.4000000000000004;3.5999999999999996;2.4000000000000004",dur:"2s",repeatCount:"indefinite",begin:"-1.9s"}),jsxRuntime.jsx("animate",{attributeName:"cy",keyTimes:"0;0.5;1",values:"30.5;69.5;30.5",dur:"2s",repeatCount:"indefinite",begin:"-1.4s",keySplines:"0.5 0 0.5 1;0.5 0 0.5 1",calcMode:"spline"}),jsxRuntime.jsx("animate",{attributeName:"fill",keyTimes:"0;0.5;1",values:`${t};${s};${t}`,dur:"2s",repeatCount:"indefinite",begin:"-0.9s"})]}),jsxRuntime.jsxs("circle",{cx:"35.48387096774193",cy:"65.3666",r:"2.69988",fill:i,children:[jsxRuntime.jsx("animate",{attributeName:"r",keyTimes:"0;0.5;1",values:"2.4000000000000004;3.5999999999999996;2.4000000000000004",dur:"2s",repeatCount:"indefinite",begin:"-1.1s"}),jsxRuntime.jsx("animate",{attributeName:"cy",keyTimes:"0;0.5;1",values:"30.5;69.5;30.5",dur:"2s",repeatCount:"indefinite",begin:"-0.6s",keySplines:"0.5 0 0.5 1;0.5 0 0.5 1",calcMode:"spline"}),jsxRuntime.jsx("animate",{attributeName:"fill",keyTimes:"0;0.5;1",values:`${i};${n};${i}`,dur:"2s",repeatCount:"indefinite",begin:"-1.1s"})]}),jsxRuntime.jsxs("circle",{cx:"35.48387096774193",cy:"34.6334",r:"3.30012",fill:t,children:[jsxRuntime.jsx("animate",{attributeName:"r",keyTimes:"0;0.5;1",values:"2.4000000000000004;3.5999999999999996;2.4000000000000004",dur:"2s",repeatCount:"indefinite",begin:"-2.1s"}),jsxRuntime.jsx("animate",{attributeName:"cy",keyTimes:"0;0.5;1",values:"30.5;69.5;30.5",dur:"2s",repeatCount:"indefinite",begin:"-1.6s",keySplines:"0.5 0 0.5 1;0.5 0 0.5 1",calcMode:"spline"}),jsxRuntime.jsx("animate",{attributeName:"fill",keyTimes:"0;0.5;1",values:`${t};${s};${t}`,dur:"2s",repeatCount:"indefinite",begin:"-1.1s"})]}),jsxRuntime.jsxs("circle",{cx:"45.16129032258064",cy:"53.8474",r:"2.45988",fill:i,children:[jsxRuntime.jsx("animate",{attributeName:"r",keyTimes:"0;0.5;1",values:"2.4000000000000004;3.5999999999999996;2.4000000000000004",dur:"2s",repeatCount:"indefinite",begin:"-1.3s"}),jsxRuntime.jsx("animate",{attributeName:"cy",keyTimes:"0;0.5;1",values:"30.5;69.5;30.5",dur:"2s",repeatCount:"indefinite",begin:"-0.8s",keySplines:"0.5 0 0.5 1;0.5 0 0.5 1",calcMode:"spline"}),jsxRuntime.jsx("animate",{attributeName:"fill",keyTimes:"0;0.5;1",values:`${i};${n};${i}`,dur:"2s",repeatCount:"indefinite",begin:"-1.3s"})]}),jsxRuntime.jsxs("circle",{cx:"45.16129032258064",cy:"46.1526",r:"3.54012",fill:t,children:[jsxRuntime.jsx("animate",{attributeName:"r",keyTimes:"0;0.5;1",values:"2.4000000000000004;3.5999999999999996;2.4000000000000004",dur:"2s",repeatCount:"indefinite",begin:"-2.3s"}),jsxRuntime.jsx("animate",{attributeName:"cy",keyTimes:"0;0.5;1",values:"30.5;69.5;30.5",dur:"2s",repeatCount:"indefinite",begin:"-1.8s",keySplines:"0.5 0 0.5 1;0.5 0 0.5 1",calcMode:"spline"}),jsxRuntime.jsx("animate",{attributeName:"fill",keyTimes:"0;0.5;1",values:`${t};${s};${t}`,dur:"2s",repeatCount:"indefinite",begin:"-1.3s"})]}),jsxRuntime.jsxs("circle",{cx:"54.838709677419345",cy:"39.3771",r:"2.58012",fill:i,children:[jsxRuntime.jsx("animate",{attributeName:"r",keyTimes:"0;0.5;1",values:"2.4000000000000004;3.5999999999999996;2.4000000000000004",dur:"2s",repeatCount:"indefinite",begin:"-1.5s"}),jsxRuntime.jsx("animate",{attributeName:"cy",keyTimes:"0;0.5;1",values:"30.5;69.5;30.5",dur:"2s",repeatCount:"indefinite",begin:"-1s",keySplines:"0.5 0 0.5 1;0.5 0 0.5 1",calcMode:"spline"}),jsxRuntime.jsx("animate",{attributeName:"fill",keyTimes:"0;0.5;1",values:`${i};${n};${i}`,dur:"2s",repeatCount:"indefinite",begin:"-1.5s"})]}),jsxRuntime.jsxs("circle",{cx:"54.838709677419345",cy:"60.6229",r:"3.41988",fill:t,children:[jsxRuntime.jsx("animate",{attributeName:"r",keyTimes:"0;0.5;1",values:"2.4000000000000004;3.5999999999999996;2.4000000000000004",dur:"2s",repeatCount:"indefinite",begin:"-2.5s"}),jsxRuntime.jsx("animate",{attributeName:"cy",keyTimes:"0;0.5;1",values:"30.5;69.5;30.5",dur:"2s",repeatCount:"indefinite",begin:"-2s",keySplines:"0.5 0 0.5 1;0.5 0 0.5 1",calcMode:"spline"}),jsxRuntime.jsx("animate",{attributeName:"fill",keyTimes:"0;0.5;1",values:`${t};${s};${t}`,dur:"2s",repeatCount:"indefinite",begin:"-1.5s"})]}),jsxRuntime.jsxs("circle",{cx:"64.51612903225805",cy:"31.8448",r:"2.82012",fill:i,children:[jsxRuntime.jsx("animate",{attributeName:"r",keyTimes:"0;0.5;1",values:"2.4000000000000004;3.5999999999999996;2.4000000000000004",dur:"2s",repeatCount:"indefinite",begin:"-1.7s"}),jsxRuntime.jsx("animate",{attributeName:"cy",keyTimes:"0;0.5;1",values:"30.5;69.5;30.5",dur:"2s",repeatCount:"indefinite",begin:"-1.2s",keySplines:"0.5 0 0.5 1;0.5 0 0.5 1",calcMode:"spline"}),jsxRuntime.jsx("animate",{attributeName:"fill",keyTimes:"0;0.5;1",values:`${i};${n};${i}`,dur:"2s",repeatCount:"indefinite",begin:"-1.7s"})]}),jsxRuntime.jsxs("circle",{cx:"64.51612903225805",cy:"68.1552",r:"3.17988",fill:t,children:[jsxRuntime.jsx("animate",{attributeName:"r",keyTimes:"0;0.5;1",values:"2.4000000000000004;3.5999999999999996;2.4000000000000004",dur:"2s",repeatCount:"indefinite",begin:"-2.7s"}),jsxRuntime.jsx("animate",{attributeName:"cy",keyTimes:"0;0.5;1",values:"30.5;69.5;30.5",dur:"2s",repeatCount:"indefinite",begin:"-2.2s",keySplines:"0.5 0 0.5 1;0.5 0 0.5 1",calcMode:"spline"}),jsxRuntime.jsx("animate",{attributeName:"fill",keyTimes:"0;0.5;1",values:`${t};${s};${t}`,dur:"2s",repeatCount:"indefinite",begin:"-1.7s"})]}),jsxRuntime.jsxs("circle",{cx:"74.19354838709677",cy:"30.6366",r:"3.06012",fill:i,children:[jsxRuntime.jsx("animate",{attributeName:"r",keyTimes:"0;0.5;1",values:"2.4000000000000004;3.5999999999999996;2.4000000000000004",dur:"2s",repeatCount:"indefinite",begin:"-1.9s"}),jsxRuntime.jsx("animate",{attributeName:"cy",keyTimes:"0;0.5;1",values:"30.5;69.5;30.5",dur:"2s",repeatCount:"indefinite",begin:"-1.4s",keySplines:"0.5 0 0.5 1;0.5 0 0.5 1",calcMode:"spline"}),jsxRuntime.jsx("animate",{attributeName:"fill",keyTimes:"0;0.5;1",values:`${i};${n};${i}`,dur:"2s",repeatCount:"indefinite",begin:"-1.9s"})]}),jsxRuntime.jsxs("circle",{cx:"74.19354838709677",cy:"69.3634",r:"2.93988",fill:t,children:[jsxRuntime.jsx("animate",{attributeName:"r",keyTimes:"0;0.5;1",values:"2.4000000000000004;3.5999999999999996;2.4000000000000004",dur:"2s",repeatCount:"indefinite",begin:"-2.9s"}),jsxRuntime.jsx("animate",{attributeName:"cy",keyTimes:"0;0.5;1",values:"30.5;69.5;30.5",dur:"2s",repeatCount:"indefinite",begin:"-2.4s",keySplines:"0.5 0 0.5 1;0.5 0 0.5 1",calcMode:"spline"}),jsxRuntime.jsx("animate",{attributeName:"fill",keyTimes:"0;0.5;1",values:`${t};${s};${t}`,dur:"2s",repeatCount:"indefinite",begin:"-1.9s"})]}),jsxRuntime.jsxs("circle",{cx:"83.87096774193547",cy:"34.6334",r:"3.30012",fill:i,children:[jsxRuntime.jsx("animate",{attributeName:"r",keyTimes:"0;0.5;1",values:"2.4000000000000004;3.5999999999999996;2.4000000000000004",dur:"2s",repeatCount:"indefinite",begin:"-2.1s"}),jsxRuntime.jsx("animate",{attributeName:"cy",keyTimes:"0;0.5;1",values:"30.5;69.5;30.5",dur:"2s",repeatCount:"indefinite",begin:"-1.6s",keySplines:"0.5 0 0.5 1;0.5 0 0.5 1",calcMode:"spline"}),jsxRuntime.jsx("animate",{attributeName:"fill",keyTimes:"0;0.5;1",values:`${i};${n};${i}`,dur:"2s",repeatCount:"indefinite",begin:"-2.1s"})]}),jsxRuntime.jsxs("circle",{cx:"83.87096774193547",cy:"65.3666",r:"2.69988",fill:t,children:[jsxRuntime.jsx("animate",{attributeName:"r",keyTimes:"0;0.5;1",values:"2.4000000000000004;3.5999999999999996;2.4000000000000004",dur:"2s",repeatCount:"indefinite",begin:"-3.1s"}),jsxRuntime.jsx("animate",{attributeName:"cy",keyTimes:"0;0.5;1",values:"30.5;69.5;30.5",dur:"2s",repeatCount:"indefinite",begin:"-2.6s",keySplines:"0.5 0 0.5 1;0.5 0 0.5 1",calcMode:"spline"}),jsxRuntime.jsx("animate",{attributeName:"fill",keyTimes:"0;0.5;1",values:`${t};${s};${t}`,dur:"2s",repeatCount:"indefinite",begin:"-2.1s"})]}),jsxRuntime.jsxs("circle",{cx:"93.54838709677418",cy:"46.1526",r:"3.54012",fill:i,children:[jsxRuntime.jsx("animate",{attributeName:"r",keyTimes:"0;0.5;1",values:"2.4000000000000004;3.5999999999999996;2.4000000000000004",dur:"2s",repeatCount:"indefinite",begin:"-2.3s"}),jsxRuntime.jsx("animate",{attributeName:"cy",keyTimes:"0;0.5;1",values:"30.5;69.5;30.5",dur:"2s",repeatCount:"indefinite",begin:"-1.8s",keySplines:"0.5 0 0.5 1;0.5 0 0.5 1",calcMode:"spline"}),jsxRuntime.jsx("animate",{attributeName:"fill",keyTimes:"0;0.5;1",values:`${i};${n};${i}`,dur:"2s",repeatCount:"indefinite",begin:"-2.3s"})]}),jsxRuntime.jsxs("circle",{cx:"93.54838709677418",cy:"53.8474",r:"2.45988",fill:t,children:[jsxRuntime.jsx("animate",{attributeName:"r",keyTimes:"0;0.5;1",values:"2.4000000000000004;3.5999999999999996;2.4000000000000004",dur:"2s",repeatCount:"indefinite",begin:"-3.3s"}),jsxRuntime.jsx("animate",{attributeName:"cy",keyTimes:"0;0.5;1",values:"30.5;69.5;30.5",dur:"2s",repeatCount:"indefinite",begin:"-2.8s",keySplines:"0.5 0 0.5 1;0.5 0 0.5 1",calcMode:"spline"}),jsxRuntime.jsx("animate",{attributeName:"fill",keyTimes:"0;0.5;1",values:`${t};${s};${t}`,dur:"2s",repeatCount:"indefinite",begin:"-2.3s"})]})]}):null};
exports.DNA=$;//# sourceMappingURL=dna.cjs.map
//# sourceMappingURL=dna.cjs.map