@yamada-ui/loading
Version:
Yamada UI loading components
118 lines (116 loc) • 3.55 kB
JavaScript
"use client"
// src/grid.tsx
import { forwardRef } from "@yamada-ui/core";
import { Icon } from "@yamada-ui/icon";
import { jsx, jsxs } from "react/jsx-runtime";
var Grid = forwardRef(
({ color, duration = "1s", ...rest }, ref) => {
return /* @__PURE__ */ jsxs(Icon, { ref, fill: color, viewBox: "0 0 105 105", ...rest, children: [
/* @__PURE__ */ jsx("circle", { cx: "12.5", cy: "12.5", r: "12.5", children: /* @__PURE__ */ jsx(
"animate",
{
attributeName: "fill-opacity",
begin: "0s",
calcMode: "linear",
dur: duration,
repeatCount: "indefinite",
values: "1;.2;1"
}
) }),
/* @__PURE__ */ jsx("circle", { cx: "12.5", cy: "52.5", fillOpacity: ".5", r: "12.5", children: /* @__PURE__ */ jsx(
"animate",
{
attributeName: "fill-opacity",
begin: "100ms",
calcMode: "linear",
dur: duration,
repeatCount: "indefinite",
values: "1;.2;1"
}
) }),
/* @__PURE__ */ jsx("circle", { cx: "52.5", cy: "12.5", r: "12.5", children: /* @__PURE__ */ jsx(
"animate",
{
attributeName: "fill-opacity",
begin: "300ms",
calcMode: "linear",
dur: duration,
repeatCount: "indefinite",
values: "1;.2;1"
}
) }),
/* @__PURE__ */ jsx("circle", { cx: "52.5", cy: "52.5", r: "12.5", children: /* @__PURE__ */ jsx(
"animate",
{
attributeName: "fill-opacity",
begin: "600ms",
calcMode: "linear",
dur: duration,
repeatCount: "indefinite",
values: "1;.2;1"
}
) }),
/* @__PURE__ */ jsx("circle", { cx: "92.5", cy: "12.5", r: "12.5", children: /* @__PURE__ */ jsx(
"animate",
{
attributeName: "fill-opacity",
begin: "800ms",
calcMode: "linear",
dur: duration,
repeatCount: "indefinite",
values: "1;.2;1"
}
) }),
/* @__PURE__ */ jsx("circle", { cx: "92.5", cy: "52.5", r: "12.5", children: /* @__PURE__ */ jsx(
"animate",
{
attributeName: "fill-opacity",
begin: "400ms",
calcMode: "linear",
dur: duration,
repeatCount: "indefinite",
values: "1;.2;1"
}
) }),
/* @__PURE__ */ jsx("circle", { cx: "12.5", cy: "92.5", r: "12.5", children: /* @__PURE__ */ jsx(
"animate",
{
attributeName: "fill-opacity",
begin: "700ms",
calcMode: "linear",
dur: duration,
repeatCount: "indefinite",
values: "1;.2;1"
}
) }),
/* @__PURE__ */ jsx("circle", { cx: "52.5", cy: "92.5", r: "12.5", children: /* @__PURE__ */ jsx(
"animate",
{
attributeName: "fill-opacity",
begin: "500ms",
calcMode: "linear",
dur: duration,
repeatCount: "indefinite",
values: "1;.2;1"
}
) }),
/* @__PURE__ */ jsx("circle", { cx: "92.5", cy: "92.5", r: "12.5", children: /* @__PURE__ */ jsx(
"animate",
{
attributeName: "fill-opacity",
begin: "200ms",
calcMode: "linear",
dur: duration,
repeatCount: "indefinite",
values: "1;.2;1"
}
) })
] });
}
);
Grid.displayName = "Grid";
Grid.__ui__ = "Grid";
export {
Grid
};
//# sourceMappingURL=chunk-FUGHYPVJ.mjs.map