UNPKG

@cerberus-design/react

Version:

The Cerberus Design React component library.

100 lines (99 loc) 3.03 kB
// src/components/AnimatingUploadIcon.tsx import { jsx, jsxs } from "react/jsx-runtime"; function AnimatingUploadIcon(props) { return /* @__PURE__ */ jsx( "svg", { "aria-hidden": "true", xmlns: "http://www.w3.org/2000/svg", width: props.size ?? "1em", height: props.size ?? "1em", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsxs( "g", { fill: "none", stroke: "currentColor", strokeLinecap: "square", strokeLinejoin: "round", strokeWidth: 1.5, children: [ /* @__PURE__ */ jsx( "path", { "data-name": "animating-trail", strokeDasharray: "2 4", strokeDashoffset: 6, d: "M12 21c-4.97 0 -9 -4.03 -9 -9c0 -4.97 4.03 -9 9 -9", children: /* @__PURE__ */ jsx( "animate", { attributeName: "stroke-dashoffset", dur: "0.45s", repeatCount: "indefinite", values: "6;0" } ) } ), /* @__PURE__ */ jsx( "path", { "data-name": "half-circle", strokeDasharray: 32, strokeDashoffset: 32, d: "M12 3c4.97 0 9 4.03 9 9c0 4.97 -4.03 9 -9 9", children: /* @__PURE__ */ jsx( "animate", { fill: "freeze", attributeName: "stroke-dashoffset", begin: "0.075s", dur: "0.3s", values: "32;0" } ) } ), /* @__PURE__ */ jsx( "svg", { "aria-hidden": "true", xmlns: "http://www.w3.org/2000/svg", width: "1.1em", height: "1.1em", x: "27%", y: "27%", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx( "polygon", { fill: "currentColor", stroke: "currentColor", strokeWidth: 0.8, opacity: "1", points: "3.7,6.7 7.5,2.9 7.5,15 8.5,15 8.5,2.9 12.3,6.7 13,6 8,1 3,6 ", children: /* @__PURE__ */ jsx( "animate", { fill: "freeze", attributeName: "opacity", values: "1;0;1", dur: "2s", repeatCount: "indefinite" } ) } ) } ) ] } ) } ); } export { AnimatingUploadIcon }; //# sourceMappingURL=chunk-VV2G62UD.js.map