@wener/console
Version:
Base console UI toolkit
39 lines (38 loc) • 1.56 kB
JavaScript
function _tagged_template_literal(strings, raw) {
if (!raw) {
raw = strings.slice(0);
}
return Object.freeze(Object.defineProperties(strings, {
raw: {
value: Object.freeze(raw)
}
}));
}
function _templateObject() {
var data = _tagged_template_literal([
"\n position: relative;\n width: 35px;\n height: 35px;\n\n & > div {\n position: absolute;\n width: 2px;\n height: 8px;\n background-color: #25363f;\n opacity: 0.05;\n animation: fadeit 0.8s linear infinite;\n }\n\n ",
" @keyframes fadeit {\n 0% {\n opacity: 1;\n }\n 100% {\n opacity: 0;\n }\n }\n"
]);
_templateObject = function _templateObject() {
return data;
};
return data;
}
import React from 'react';
import styled from '@emotion/styled';
var BarsSpinnerBox = styled.div(_templateObject(), function(param) {
var bars = param.bars;
return Array(bars).fill(null).map(function(_, i) {
return "\n & > div:nth-child(".concat(i + 1, ") {\n transform: rotate(").concat((360 / bars * i).toFixed(2), "deg) translate(0, -12px);\n animation-delay:").concat((0.8 / bars * (i + 1)).toFixed(2), "s;\n }\n ");
});
});
export var BarsSpinner = function(param) {
var _param_bars = param.bars, bars = _param_bars === void 0 ? 16 : _param_bars;
return /*#__PURE__*/ React.createElement(BarsSpinnerBox, {
bars: bars
}, Array(bars).fill(null).map(function(_, i) {
return /*#__PURE__*/ React.createElement("div", {
key: i
});
}));
};