react-fancy-loader/build/index.esm.js

A lightweight set of fancy loaders for your React applications. The package uses ESM, which enables tree shaking.

import n,{css as r}from"styled-components";import t from"react";function i(n,r){return r||(r=n.slice(0)),Object.freeze(Object.defineProperties(n,{raw:{value:Object.freeze(r)}}))}function e(){var n=i(["\n  -webkit-@keyframes spin {\n    -webkit-from {\n      -webkit-transform: rotate(0deg);\n      -ms-transform: rotate(0deg);\n      transform: rotate(0deg);\n    }\n\n    -webkit-to {\n      -webkit-transform: rotate(360deg);\n      -ms-transform: rotate(360deg);\n      transform: rotate(360deg);\n    }\n  }\n\n  @-webkit-keyframes spin {\n    from {\n      -webkit-transform: rotate(0deg);\n      transform: rotate(0deg);\n    }\n\n    to {\n      -webkit-transform: rotate(360deg);\n      transform: rotate(360deg);\n    }\n  }\n\n  @keyframes spin {\n    from {\n      -webkit-transform: rotate(0deg);\n      transform: rotate(0deg);\n    }\n\n    to {\n      -webkit-transform: rotate(360deg);\n      transform: rotate(360deg);\n    }\n  }\n"]);return e=function(){return n},n}var o=n.div(e());function a(){var n=i(["\n        width: ","px !important;\n        height: ","px !important;\n        border-top: ","px solid "," !important;\n        -webkit-animation: ","s spin linear infinite !important;\n        animation: ","s spin linear infinite !important;\n      "]);return a=function(){return n},n}function s(){var n=i(["\n  &&& {\n    margin: 0 !important;\n    background: transparent !important;\n    border-right: 4px solid transparent !important;\n    border-radius: 50% !important;\n\n    ",";\n  }\n"]);return s=function(){return n},n}var u=n(o)(s(),(function(n){var t=n.size,i=void 0===t?75:t,e=n.color,o=void 0===e?"#009688":e,s=n.stroke,u=void 0===s?4:s,m=n.duration,f=void 0===m?1e3:m;return r(a(),i,i,u,o,f/1e3,f/1e3)})),m=function(n){return t.createElement("div",{className:"no-border-spinner"},t.createElement("div",{className:"no-border-spinner-2"},t.createElement("div",{className:"no-border-spinner-3"},t.createElement(u,n))))};function f(){var n=i(["\n  @-webkit-keyframes grow {\n    0%,\n    40%,\n    100% {\n      -webkit-transform: scale(0);\n      transform: scale(0);\n    }\n\n    40% {\n      -webkit-transform: scale(1);\n      transform: scale(1);\n    }\n  }\n\n  @keyframes grow {\n    0%,\n    40%,\n    100% {\n      -webkit-transform: scale(0);\n      transform: scale(0);\n    }\n\n    40% {\n      -webkit-transform: scale(1);\n      transform: scale(1);\n    }\n  }\n"]);return f=function(){return n},n}var d=n.div(f());function c(){var n=i(["\n  display: flex;\n"]);return c=function(){return n},n}var p=n.div(c());function v(){var n=i(["\n        -webkit-animation: ","s grow ease-in-out infinite 0.3s !important;\n        animation: ","s grow ease-in-out infinite 0.3s !important;\n      "]);return v=function(){return n},n}function l(){var n=i(["\n  &&&&&&&&&&&& {\n    ",";\n  }\n"]);return l=function(){return n},n}function b(){var n=i(["\n        margin: 0 ","px !important;\n        -webkit-animation: ","s grow ease-in-out infinite\n          0.15555s !important;\n        animation: ","s grow ease-in-out infinite 0.15555s !important;\n      "]);return b=function(){return n},n}function w(){var n=i(["\n  &&&&&&&&&&&& {\n    ",";\n  }\n"]);return w=function(){return n},n}function g(){var n=i(["\n        width: ","px !important;\n        height: ","px !important;\n        background-color: "," !important;\n        -webkit-animation: ","s grow ease-in-out infinite !important;\n        animation: ","s grow ease-in-out infinite !important;\n      "]);return g=function(){return n},n}function k(){var n=i(["\n  &&&&&&&&&&&& {\n    border-radius: 50% !important;\n    position: relative !important;\n\n    ",";\n  }\n"]);return k=function(){return n},n}var x=n(d)(k(),(function(n){var t=n.size,i=void 0===t?75:t,e=n.color,o=void 0===e?"#009688":e,a=n.duration,s=void 0===a?1200:a;return r(g(),i,i,o,s/1e3,s/1e3)})),h=n(x)(w(),(function(n){var t=n.duration,i=void 0===t?1200:t,e=n.size,o=void 0===e?75:e;return r(b(),o/3,i/1e3,i/1e3)})),E=n(x)(l(),(function(n){var t=n.duration,i=void 0===t?1200:t;return r(v(),i/1e3,i/1e3)})),y=function(n){return t.createElement(p,null,t.createElement(x,n),t.createElement(h,n),t.createElement(E,n))};function z(){var n=i(["\n        width: ","px !important;\n        height: ","px !important;\n        border: ","px solid "," !important;\n        border-top-color: "," !important;\n        -webkit-animation: ","s spin linear infinite !important;\n        animation: ","s spin linear infinite !important;\n      "]);return z=function(){return n},n}function j(){var n=i(["\n  &&& {\n    border-radius: 50%;\n    background-color: transparent;\n\n    ",";\n  }\n"]);return j=function(){return n},n}var N=n(o)(j(),(function(n){var t=n.size,i=void 0===t?75:t,e=n.color,o=void 0===e?"#009688":e,a=n.stroke,s=void 0===a?4:a,u=n.outlineColor,m=void 0===u?"#222":u,f=n.duration,d=void 0===f?1e3:f;return r(z(),i,i,s,m,o,d/1e3,d/1e3)}));function O(){var n=i(["\n        width: ","px !important;\n        height: ","px !important;\n        border: ","px solid "," !important;\n        border-top-color: "," !important;\n        border-bottom-color: "," !important;\n        -webkit-animation: ","s spin linear infinite !important;\n        animation: ","s spin linear infinite !important;\n      "]);return O=function(){return n},n}function C(){var n=i(["\n  &&& {\n    border-radius: 50%;\n    background-color: transparent;\n\n    ",";\n  }\n"]);return C=function(){return n},n}var P=n(o)(C(),(function(n){var t=n.size,i=void 0===t?75:t,e=n.color,o=void 0===e?"#009688":e,a=n.stroke,s=void 0===a?4:a,u=n.duration,m=void 0===u?1e3:u,f=n.outlineColor,d=void 0===f?"#222":f;return r(O(),i,i,s,d,o,o,m/1e3,m/1e3)}));export{N as BorderTopSpinner,y as DotLoader,P as DoubleBorderSpinner,m as NoBorderSpinner};