UNPKG

spinners-react

Version:

Lightweight SVG/CSS spinners for React

34 lines (29 loc) 1.6 kB
'use strict'; var withSharedProps = require('./withSharedProps-EQOgeSQG.js'); var React = require('react'); var styleInject_es = require('./style-inject.es-GkBwmmgD.js'); var css_248z = "@keyframes spinners-react-round-outlined{35%,65%{r:2px;stroke-width:4}}"; styleInject_es.styleInject(css_248z); var animations = [ { r: 2, }, { name: 'spinners-react-round-outlined', r: 14, }, { name: 'spinners-react-round-outlined', r: 28, }, ]; function Component(_a) { var _b = _a.speed, speed = _b === void 0 ? styleInject_es.defaultProps.speed : _b, _c = _a.still, still = _c === void 0 ? styleInject_es.defaultProps.still : _c, _d = _a.thickness, thickness = _d === void 0 ? styleInject_es.defaultProps.thickness : _d, svgProps = withSharedProps.__rest(_a, ["speed", "still", "thickness"]); var strokeWidth = 3 * (thickness / 100); return (React.createElement("svg", withSharedProps.__assign({ fill: "none" }, svgProps, { viewBox: "0 0 66 66" }), animations.map(function (animation, i) { return (React.createElement("circle", { key: "spinner-round-outlined-r".concat(animation.r), cx: "33", cy: "33", fill: "none", r: animation.r, stroke: "currentColor", strokeWidth: i ? strokeWidth : 4, style: animation.name && !still ? { animation: "".concat(animation.name, " ").concat(140 / speed, "s ease-in-out infinite") } : {} })); }))); } var SpinnerRoundOutlined = withSharedProps.withSharedProps(Component); exports.SpinnerRoundOutlined = SpinnerRoundOutlined; //# sourceMappingURL=SpinnerRoundOutlined.js.map