UNPKG

spinners-react

Version:

Lightweight SVG/CSS spinners for React

3 lines (2 loc) 10.5 kB
!function(e,r){"object"==typeof exports&&"undefined"!=typeof module?r(exports,require("react")):"function"==typeof define&&define.amd?define(["exports","react"],r):r((e="undefined"!=typeof globalThis?globalThis:e||self).SpinnersReact={},e.React)}(this,(function(e,r){"use strict";var t=function(){return t=Object.assign||function(e){for(var r,t=1,n=arguments.length;t<n;t++)for(var s in r=arguments[t])Object.prototype.hasOwnProperty.call(r,s)&&(e[s]=r[s]);return e},t.apply(this,arguments)};function n(e,r){var t={};for(var n in e)Object.prototype.hasOwnProperty.call(e,n)&&r.indexOf(n)<0&&(t[n]=e[n]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var s=0;for(n=Object.getOwnPropertySymbols(e);s<n.length;s++)r.indexOf(n[s])<0&&Object.prototype.propertyIsEnumerable.call(e,n[s])&&(t[n[s]]=e[n[s]])}return t}"function"==typeof SuppressedError&&SuppressedError;var s={speed:100,still:!1,thickness:100},o=t(t({},s),{secondaryColor:"rgba(0,0,0,0.44)"}),i={color:"#38ad48",enabled:!0,size:50,style:{}},a=function(e){return parseFloat(e.toString()).toString()===e.toString()?"".concat(e,"px"):e.toString()},c=function(e){return function(s){var o=s.color,c=void 0===o?i.color:o,l=s.enabled,d=void 0===l?i.enabled:l,f=s.size,y=void 0===f?i.size:f,p=s.style,u=void 0===p?i.style:p,k=n(s,["color","enabled","size","style"]),m=t(t({},k),{style:t({color:c,overflow:"visible",width:a(y)},u)});return d?r.createElement(e,t({},m)):null}};function l(e,r){void 0===r&&(r={});var t=r.insertAt;if(e&&"undefined"!=typeof document){var n=document.head||document.getElementsByTagName("head")[0],s=document.createElement("style");s.type="text/css","top"===t&&n.firstChild?n.insertBefore(s,n.firstChild):n.appendChild(s),s.styleSheet?s.styleSheet.cssText=e:s.appendChild(document.createTextNode(e))}}l("@keyframes spinners-react-circular{0%{stroke-dashoffset:306}50%{stroke-dasharray:40,134}to{stroke-dasharray:1,174;stroke-dashoffset:132}}");var d=c((function(e){var s=e.secondaryColor,i=void 0===s?o.secondaryColor:s,a=e.speed,c=void 0===a?o.speed:a,l=e.still,d=void 0===l?o.still:l,f=e.thickness,y=void 0===f?o.thickness:f,p=n(e,["secondaryColor","speed","still","thickness"]),u=y/100*4,k=d?{}:{animation:"spinners-react-circular ".concat(140/c,"s linear infinite")};return r.createElement("svg",t({fill:"none"},p,{viewBox:"0 0 66 66"}),r.createElement("circle",{cx:"33",cy:"33",fill:"none",r:"28",stroke:i,strokeWidth:u}),r.createElement("circle",{cx:"33",cy:"33",fill:"none",r:"28",stroke:"currentColor",strokeDasharray:"1, 174",strokeDashoffset:"306",strokeLinecap:"round",strokeWidth:u,style:k}))}));l("@keyframes spinners-react-circular-fixed{0%{stroke-dashoffset:325}to{stroke-dashoffset:151}}");var f=c((function(e){var s=e.secondaryColor,i=void 0===s?o.secondaryColor:s,a=e.speed,c=void 0===a?o.speed:a,l=e.still,d=void 0===l?o.still:l,f=e.thickness,y=void 0===f?o.thickness:f,p=n(e,["secondaryColor","speed","still","thickness"]),u=y/100*4,k=d?{}:{animation:"spinners-react-circular-fixed ".concat(140/c,"s linear infinite")};return r.createElement("svg",t({fill:"none"},p,{viewBox:"0 0 66 66"}),r.createElement("circle",{cx:"33",cy:"33",fill:"none",r:"28",stroke:i,strokeWidth:u}),r.createElement("circle",{cx:"33",cy:"33",fill:"none",r:"28",stroke:"currentColor",strokeDasharray:"40, 134",strokeDashoffset:"325",strokeLinecap:"round",strokeWidth:u,style:k}))}));l("@keyframes spinners-react-circular-split{0%{stroke-dashoffset:1;stroke-dasharray:5,170}10%{stroke-dashoffset:13;stroke-dasharray:30,145}13%{stroke-dashoffset:-11;stroke-dasharray:5,145}50%{stroke-dasharray:5,0,5,165;stroke-dashoffset:-82}51%{stroke-dasharray:2,0,2,139;stroke-dashoffset:-85}61%{stroke-dasharray:15,0,15,165;stroke-dashoffset:-72}64%{stroke-dasharray:5,20,5,145;stroke-dashoffset:-72}}");var y=c((function(e){var s=e.secondaryColor,i=void 0===s?o.secondaryColor:s,a=e.speed,c=void 0===a?o.speed:a,l=e.still,d=void 0===l?o.still:l,f=e.thickness,y=void 0===f?o.thickness:f,p=n(e,["secondaryColor","speed","still","thickness"]),u=y/100*4,k=d?{}:{animation:"spinners-react-circular-split ".concat(140/c,"s linear infinite")};return r.createElement("svg",t({fill:"none"},p,{viewBox:"0 0 66 66"}),r.createElement("circle",{cx:"33",cy:"33",fill:"none",r:"28",stroke:i,strokeWidth:u}),r.createElement("circle",{cx:"33",cy:"33",fill:"none",r:"28",stroke:"currentColor",strokeDasharray:"5, 170",strokeDashoffset:"1",strokeLinecap:"round",strokeWidth:u,style:k,transform:"rotate(-90 33 33)"}))}));l("@keyframes spinners-react-infinity{0%{stroke-dasharray:1,347;stroke-dashoffset:75}25%,75%{stroke-dasharray:17,330}50%{stroke-dasharray:1,347}to{stroke-dasharray:1,347;stroke-dashoffset:423}}");var p=c((function(e){var s=e.secondaryColor,i=void 0===s?o.secondaryColor:s,a=e.speed,c=void 0===a?o.speed:a,l=e.still,d=void 0===l?o.still:l,f=e.thickness,y=void 0===f?o.thickness:f,p=n(e,["secondaryColor","speed","still","thickness"]),u=y/100*7,k=d?{}:{animation:"spinners-react-infinity ".concat(140/c,"s linear infinite")};return r.createElement("svg",t({fill:"none",viewBox:"0 0 131 55"},p),r.createElement("defs",null,r.createElement("path",{d:"M46.57 45.5138C36.346 55.4954 19.8919 55.4954 9.66794 45.5138C-0.55598 35.5321 -0.55598 19.4678 9.66794 9.48624C19.8919 -0.495412 36.346 -0.495412 46.57 9.48624L84.4303 45.5138C94.6543 55.4954 111.108 55.4954 121.332 45.5138C131.556 35.5321 131.556 19.4678 121.332 9.48624C111.108 -0.495412 94.6543 -0.495412 84.4303 9.48624L46.57 45.5138Z",id:"spinners-react-infinity-path"})),r.createElement("use",{stroke:i,strokeWidth:u,xlinkHref:"#spinners-react-infinity-path"}),r.createElement("use",{fill:"none",stroke:"currentColor",strokeDasharray:"1, 347",strokeDashoffset:"75",strokeLinecap:"round",strokeWidth:u,style:k,xlinkHref:"#spinners-react-infinity-path"}))}));l("@keyframes spinners-react-dotted-center{0%,15%,85%,to{transform:scale(0)}40%,50%{transform:scale(1)}84%{transform:scale(.45)}}@keyframes spinners-react-dotted-shrink{50%{transform:translate(0)}}");var u=[{x:22,y:-20},{x:29,y:0},{x:22,y:20},{x:0,y:30},{x:-23,y:20},{x:-30,y:0},{x:-23,y:-20},{x:0,y:-30}];function k(e){var o=e.speed,i=void 0===o?s.speed:o,a=e.still,c=void 0===a?s.still:a,l=e.thickness,d=void 0===l?s.thickness:l,f=n(e,["speed","still","thickness"]),y=200/i,p=function(e){return c?{}:{animation:"spinners-react-dotted-shrink ".concat(y,"s cubic-bezier(0, 0.9, 0, 0.9) ").concat(y/20*e,"s infinite")}},k=c?{display:"none"}:{animation:"spinners-react-dotted-center ".concat(y,"s ease-out infinite"),transformOrigin:"center"};return r.createElement("svg",t({fill:"none",viewBox:"0 0 66 66"},f),u.map((function(e,n){return r.createElement("circle",{key:"".concat(e.x,"-").concat(e.y),cx:"33",cy:"33",fill:"currentColor",r:d/100*3,style:t({transform:"translate(".concat(e.x,"px, ").concat(e.y,"px)")},p(n))})})),r.createElement("circle",{cx:"33",cy:"33",fill:"currentColor",r:d/100*6,style:k}))}var m=c(k);l("@keyframes spinners-react-round{27%,73%{r:2px;stroke-width:4}}");var h=c((function(e){var o=e.speed,i=void 0===o?s.speed:o,a=e.still,c=void 0===a?s.still:a,l=e.thickness,d=void 0===l?s.thickness:l,f=n(e,["speed","still","thickness"]),y=d/100*3,p={animation:"spinners-react-round ".concat(140/i,"s ease-in-out infinite"),transformOrigin:"center"};return c&&(p.animation="none"),r.createElement("svg",t({fill:"none"},f,{viewBox:"0 0 66 66"}),r.createElement("circle",{cx:"33",cy:"33",fill:"none",r:28,stroke:"currentColor",strokeWidth:y,style:p}))}));l("@keyframes spinners-react-round-outlined{35%,65%{r:2px;stroke-width:4}}");var v=[{r:2},{name:"spinners-react-round-outlined",r:14},{name:"spinners-react-round-outlined",r:28}];var x=c((function(e){var o=e.speed,i=void 0===o?s.speed:o,a=e.still,c=void 0===a?s.still:a,l=e.thickness,d=void 0===l?s.thickness:l,f=n(e,["speed","still","thickness"]),y=d/100*3;return r.createElement("svg",t({fill:"none"},f,{viewBox:"0 0 66 66"}),v.map((function(e,t){return r.createElement("circle",{key:"spinner-round-outlined-r".concat(e.r),cx:"33",cy:"33",fill:"none",r:e.r,stroke:"currentColor",strokeWidth:t?y:4,style:e.name&&!c?{animation:"".concat(e.name," ").concat(140/i,"s ease-in-out infinite")}:{}})})))}));l("@keyframes spinners-react-round-filled-outer{40%,60%{transform:scale(0)}}@keyframes spinners-react-round-filled-center{30%,70%{transform:scale(0)}}@keyframes spinners-react-round-filled-inner{20%,80%{transform:scale(0)}}");var C=[{r:4},{name:"spinners-react-round-filled-inner",r:12.66},{name:"spinners-react-round-filled-center",r:20.32},{name:"spinners-react-round-filled-outer",r:27.5}];var E=c((function(e){var o=e.speed,i=void 0===o?s.speed:o,a=e.still,c=void 0===a?s.still:a,l=e.thickness,d=void 0===l?s.thickness:l,f=n(e,["speed","still","thickness"]);return r.createElement("svg",t({fill:"none"},f,{viewBox:"0 0 66 66"}),C.map((function(e){return r.createElement("circle",{key:e.name||"still",cx:"33",cy:"33",fill:"currentColor",r:e.r*(e.name?d/100:1),style:{opacity:e.name?.25:1,transformOrigin:"center",animation:!e.name||c?"none":"".concat(e.name," ").concat(140/i,"s ease-in-out infinite")}})})))}));l("@keyframes spinners-react-diamond{25%{transform:translate(30px,-30px)}50%{transform:translate(60px)}75%{transform:translate(30px,30px)}}");var g=[{x:3,y:48},{x:18,y:33},{x:18,y:48},{x:18,y:63},{x:33,y:48},{x:33,y:18},{x:33,y:33},{x:33,y:63},{x:33,y:78},{x:48,y:3},{x:48,y:18},{x:48,y:33},{x:48,y:48},{x:48,y:63},{x:48,y:78},{x:48,y:93},{x:63,y:18},{x:63,y:33},{x:63,y:48},{x:63,y:63},{x:63,y:78},{x:78,y:33},{x:78,y:48},{x:78,y:63},{x:93,y:48}];function S(e){var s=e.secondaryColor,i=void 0===s?o.secondaryColor:s,a=e.speed,c=void 0===a?o.speed:a,l=e.still,d=void 0===l?o.still:l,f=e.thickness,y=void 0===f?o.thickness:f,p=n(e,["secondaryColor","speed","still","thickness"]),u={animation:"spinners-react-diamond ".concat(140/c,"s steps(2, end) infinite")};return d&&(u.animation="none"),r.createElement("svg",t({fill:"currentColor"},p,{viewBox:"0 0 96 96"}),g.map((function(e){return r.createElement("circle",{key:"".concat(e.x,"-").concat(e.y),cx:e.x,cy:e.y,fill:i,r:y/100*2.5})})),r.createElement("g",{style:u},g.filter((function(e,r){return r<5})).map((function(e){return r.createElement("circle",{key:"h-".concat(e.x,"-").concat(e.y),cx:e.x,cy:e.y,r:y/100*3.5})}))))}var b=c(S),w=c(S);e.Component=k,e.SpinnerCircular=d,e.SpinnerCircularFixed=f,e.SpinnerCircularSplit=y,e.SpinnerDiamond=w,e.SpinnerDotted=m,e.SpinnerInfinity=p,e.SpinnerRomb=b,e.SpinnerRound=h,e.SpinnerRoundFilled=E,e.SpinnerRoundOutlined=x})); //# sourceMappingURL=index.min.js.map