@smitch/fluid
Version:
A Next/React ui-component libray.
7 lines (6 loc) • 2.6 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
var Bars = function (_a) {
var width = _a.width;
return (_jsx("div", { className: "spinner", children: _jsxs("svg", { viewBox: '0 0 24 24', xmlns: 'http://www.w3.org/2000/svg', width: width, height: width, children: [_jsxs("rect", { x: '1', y: '6', width: '2.8', height: '12', fill: 'currentColor', children: [_jsx("animate", { id: 'spinner_CcmT', begin: '0;spinner_IzZB.end-0.1s', attributeName: 'y', calcMode: 'spline', dur: '0.6s', values: '6;1;6', keySplines: '.36,.61,.3,.98;.36,.61,.3,.98' }), _jsx("animate", { begin: '0;spinner_IzZB.end-0.1s', attributeName: 'height', calcMode: 'spline', dur: '0.6s', values: '12;22;12', keySplines: '.36,.61,.3,.98;.36,.61,.3,.98' })] }), _jsxs("rect", { x: '5.8', y: '6', width: '2.8', height: '12', fill: 'currentColor', children: [_jsx("animate", { begin: 'spinner_CcmT.begin+0.1s', attributeName: 'y', calcMode: 'spline', dur: '0.6s', values: '6;1;6', keySplines: '.36,.61,.3,.98;.36,.61,.3,.98' }), _jsx("animate", { begin: 'spinner_CcmT.begin+0.1s', attributeName: 'height', calcMode: 'spline', dur: '0.6s', values: '12;22;12', keySplines: '.36,.61,.3,.98;.36,.61,.3,.98' })] }), _jsxs("rect", { x: '10.6', y: '6', width: '2.8', height: '12', fill: 'currentColor', children: [_jsx("animate", { begin: 'spinner_CcmT.begin+0.2s', attributeName: 'y', calcMode: 'spline', dur: '0.6s', values: '6;1;6', keySplines: '.36,.61,.3,.98;.36,.61,.3,.98' }), _jsx("animate", { begin: 'spinner_CcmT.begin+0.2s', attributeName: 'height', calcMode: 'spline', dur: '0.6s', values: '12;22;12', keySplines: '.36,.61,.3,.98;.36,.61,.3,.98' })] }), _jsxs("rect", { x: '15.4', y: '6', width: '2.8', height: '12', fill: 'currentColor', children: [_jsx("animate", { begin: 'spinner_CcmT.begin+0.3s', attributeName: 'y', calcMode: 'spline', dur: '0.6s', values: '6;1;6', keySplines: '.36,.61,.3,.98;.36,.61,.3,.98' }), _jsx("animate", { begin: 'spinner_CcmT.begin+0.3s', attributeName: 'height', calcMode: 'spline', dur: '0.6s', values: '12;22;12', keySplines: '.36,.61,.3,.98;.36,.61,.3,.98' })] }), _jsxs("rect", { x: '20.2', y: '6', width: '2.8', height: '12', fill: 'currentColor', children: [_jsx("animate", { id: 'spinner_IzZB', begin: 'spinner_CcmT.begin+0.4s', attributeName: 'y', calcMode: 'spline', dur: '0.6s', values: '6;1;6', keySplines: '.36,.61,.3,.98;.36,.61,.3,.98' }), _jsx("animate", { begin: 'spinner_CcmT.begin+0.4s', attributeName: 'height', calcMode: 'spline', dur: '0.6s', values: '12;22;12', keySplines: '.36,.61,.3,.98;.36,.61,.3,.98' })] })] }) }));
};
export default Bars;