loading-dev 0.3.5 → 0.3.6

package/dist/chunk-2LMGBBRJ.js

@@ -1,77 +0,0 @@
-import {
-  SpinnerStyle,
-  spinnerRoot,
-  step
-} from "./chunk-UAO52LUL.js";
-import {
-  SIZE,
-  STEP_VAR,
-  animation,
-  stagger
-} from "./chunk-OMNMMKI7.js";
-
-// src/eclipse.tsx
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-var DOTS = [0, 1];
-var css = `
-.ld-eclipse {
-  position: relative;
-  width: ${SIZE};
-  height: ${SIZE};
-}
-
-.ld-eclipse-dot {
-  position: absolute;
-  top: 30%;
-  left: 30%;
-  width: 40%;
-  height: 40%;
-  background: currentColor;
-  border-radius: 50%;
-  ${animation("eclipse", ["ld-eclipse-slide", "ld-eclipse-depth"], "ease-in-out")}
-  animation-delay: ${stagger("eclipse", DOTS.length)};
-}
-
-@keyframes ld-eclipse-slide {
-  0%,
-  100% {
-    translate: 75% 0;
-  }
-  50% {
-    translate: -75% 0;
-  }
-}
-
-@keyframes ld-eclipse-depth {
-  0%,
-  50%,
-  100% {
-    opacity: 0.75;
-    scale: 1;
-  }
-  25% {
-    opacity: 1;
-    scale: 1.3;
-  }
-  75% {
-    opacity: 0.5;
-    scale: 0.7;
-  }
-}
-
-@media (prefers-reduced-motion: reduce) {
-  .ld-eclipse-dot {
-    translate: calc(var(${STEP_VAR}) * 150% - 75%) 0;
-  }
-}
-`;
-function Eclipse(props) {
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(SpinnerStyle, { name: "eclipse", children: css }),
-    /* @__PURE__ */ jsx("div", { ...spinnerRoot("eclipse", props), children: DOTS.map((index) => /* @__PURE__ */ jsx("div", { className: "ld-eclipse-dot", style: step(index) }, index)) })
-  ] });
-}
-
-export {
-  Eclipse
-};

package/dist/chunk-2OX27TAE.js

@@ -1,69 +0,0 @@
-import {
-  rotationCss,
-  spinClass
-} from "./chunk-A2PZBHTA.js";
-import {
-  SpinnerStyle,
-  spinnerRoot
-} from "./chunk-UAO52LUL.js";
-import {
-  SIZE
-} from "./chunk-OMNMMKI7.js";
-
-// src/radar.tsx
-import { useId } from "react";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-var css = `
-.ld-radar {
-  width: ${SIZE};
-  height: ${SIZE};
-}
-
-${rotationCss("radar")}
-`;
-function Radar({ easing, ...rest }) {
-  const beamGradient = useId();
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(SpinnerStyle, { name: "radar", children: css }),
-    /* @__PURE__ */ jsxs(
-      "svg",
-      {
-        ...spinnerRoot("radar", rest),
-        fill: "none",
-        role: "presentation",
-        viewBox: "0 0 16 16",
-        children: [
-          /* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsxs(
-            "radialGradient",
-            {
-              cx: "8",
-              cy: "8",
-              gradientUnits: "userSpaceOnUse",
-              id: beamGradient,
-              r: "8",
-              children: [
-                /* @__PURE__ */ jsx("stop", { offset: "0.3334", stopColor: "currentColor" }),
-                /* @__PURE__ */ jsx("stop", { offset: "1", stopColor: "currentColor", stopOpacity: "0" })
-              ]
-            }
-          ) }),
-          /* @__PURE__ */ jsx("circle", { cx: "8", cy: "8", fill: "currentColor", opacity: "0.2", r: "8" }),
-          /* @__PURE__ */ jsx("circle", { cx: "8", cy: "8", opacity: "0.2", r: "5.5", stroke: "currentColor" }),
-          /* @__PURE__ */ jsx(
-            "path",
-            {
-              className: spinClass("radar", easing),
-              d: "M8 0C9.50657 0 10.9824 0.425672 12.2578 1.22754C13.5333 2.02953 14.557 3.17533 15.21 4.5332C15.8629 5.89107 16.1193 7.40626 15.9492 8.90332C15.7791 10.4001 15.1896 11.8184 14.249 12.9951L10.4707 9.69922C10.8037 9.21598 11 8.63123 11 8C11 6.34315 9.65685 5 8 5V0Z",
-              fill: `url(#${beamGradient})`
-            }
-          ),
-          /* @__PURE__ */ jsx("circle", { cx: "8", cy: "8", fill: "currentColor", r: "2" })
-        ]
-      }
-    )
-  ] });
-}
-
-export {
-  Radar
-};

package/dist/chunk-2TYML5J2.js

@@ -1,51 +0,0 @@
-import {
-  rotationCss,
-  spinClass
-} from "./chunk-A2PZBHTA.js";
-import {
-  SpinnerStyle,
-  spinnerRoot
-} from "./chunk-UAO52LUL.js";
-import {
-  SIZE
-} from "./chunk-OMNMMKI7.js";
-
-// src/clock.tsx
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-var css = `
-.ld-clock {
-  width: ${SIZE};
-  height: ${SIZE};
-}
-
-${rotationCss("clock")}
-`;
-function Clock({ easing, ...rest }) {
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(SpinnerStyle, { name: "clock", children: css }),
-    /* @__PURE__ */ jsxs(
-      "svg",
-      {
-        ...spinnerRoot("clock", rest),
-        fill: "none",
-        role: "presentation",
-        viewBox: "0 0 16 16",
-        children: [
-          /* @__PURE__ */ jsx("circle", { cx: "8", cy: "8", fill: "currentColor", opacity: "0.1", r: "8" }),
-          /* @__PURE__ */ jsx(
-            "path",
-            {
-              className: spinClass("clock", easing),
-              d: "M11.1937 2.92061C10.5206 2.49739 9.77304 2.21397 8.9954 2.08314C8.45076 1.99151 8 2.44772 8 3V7.20324C8 7.49211 8.12492 7.76686 8.34259 7.95677L11.8999 11.0603C12.3287 11.4344 12.9913 11.378 13.2643 10.8787C13.6356 10.1998 13.8736 9.45248 13.9617 8.67713C14.0892 7.55433 13.8971 6.41834 13.4074 5.39993C12.9177 4.38152 12.1503 3.5221 11.1937 2.92061Z",
-              fill: "currentColor"
-            }
-          )
-        ]
-      }
-    )
-  ] });
-}
-
-export {
-  Clock
-};

package/dist/chunk-3WMZVDPS.js

@@ -1,61 +0,0 @@
-import {
-  fadeCss
-} from "./chunk-PVVWLDIS.js";
-import {
-  SpinnerStyle,
-  spinnerRoot,
-  step
-} from "./chunk-UAO52LUL.js";
-import {
-  SIZE
-} from "./chunk-OMNMMKI7.js";
-
-// src/circular-dots.tsx
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-var DOTS = [
-  [8, 1.5],
-  [12.5962, 3.4038],
-  [14.5, 8],
-  [12.5962, 12.5962],
-  [8, 14.5],
-  [3.4038, 12.5962],
-  [1.5, 8],
-  [3.4038, 3.4038]
-];
-var css = `
-.ld-circular-dots {
-  width: ${SIZE};
-  height: ${SIZE};
-}
-
-${fadeCss("circular-dots", "dot", DOTS.length, { dim: 0.2, rest: 0.6 })}
-`;
-function CircularDots(props) {
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(SpinnerStyle, { name: "circular-dots", children: css }),
-    /* @__PURE__ */ jsx(
-      "svg",
-      {
-        ...spinnerRoot("circular-dots", props),
-        fill: "currentColor",
-        role: "presentation",
-        viewBox: "0 0 16 16",
-        children: DOTS.map(([cx, cy], index) => /* @__PURE__ */ jsx(
-          "circle",
-          {
-            className: "ld-circular-dots-dot",
-            cx,
-            cy,
-            r: "1.5",
-            style: step(index)
-          },
-          `${cx}-${cy}`
-        ))
-      }
-    )
-  ] });
-}
-
-export {
-  CircularDots
-};

package/dist/chunk-4O4ADYWE.js

@@ -1,73 +0,0 @@
-import {
-  SpinnerStyle,
-  spinnerRoot,
-  step
-} from "./chunk-UAO52LUL.js";
-import {
-  SIZE,
-  STEP_VAR,
-  animation,
-  stagger
-} from "./chunk-OMNMMKI7.js";
-
-// src/leap.tsx
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-var DOTS = Array.from({ length: 3 }, (_, index) => index);
-var css = `
-.ld-leap {
-  --ld-leap-dot: round(calc(${SIZE} * 0.22), 1px);
-  --ld-leap-gap: round(down, calc((${SIZE} - var(--ld-leap-dot)) / 2), 1px);
-  position: relative;
-  width: ${SIZE};
-  height: ${SIZE};
-}
-
-.ld-leap-wrapper {
-  position: absolute;
-  top: round(calc((${SIZE} - var(--ld-leap-dot)) / 2), 1px);
-  left: calc(${SIZE} - var(--ld-leap-dot) - var(--ld-leap-gap) * 2);
-  width: calc(var(--ld-leap-gap) * 2 + var(--ld-leap-dot));
-  height: var(--ld-leap-dot);
-  ${animation("leap", "ld-leap-hop", "ease-in-out")}
-  animation-delay: ${stagger("leap", DOTS.length)};
-}
-
-.ld-leap-dot {
-  position: absolute;
-  inset: 0 auto 0 0;
-  width: var(--ld-leap-dot);
-  background: currentColor;
-  border-radius: 50%;
-}
-
-@keyframes ld-leap-hop {
-  0% {
-    transform: translateX(0) rotate(0);
-  }
-  33.33% {
-    transform: translateX(0) rotate(180deg);
-  }
-  66.66% {
-    transform: translateX(calc(var(--ld-leap-gap) * -1)) rotate(180deg);
-  }
-  100% {
-    transform: translateX(calc(var(--ld-leap-gap) * -2)) rotate(180deg);
-  }
-}
-
-@media (prefers-reduced-motion: reduce) {
-  .ld-leap-wrapper {
-    transform: translateX(calc(var(${STEP_VAR}) * var(--ld-leap-gap)));
-  }
-}
-`;
-function Leap(props) {
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(SpinnerStyle, { name: "leap", children: css }),
-    /* @__PURE__ */ jsx("div", { ...spinnerRoot("leap", props), children: DOTS.map((index) => /* @__PURE__ */ jsx("div", { className: "ld-leap-wrapper", style: step(index), children: /* @__PURE__ */ jsx("div", { className: "ld-leap-dot" }) }, index)) })
-  ] });
-}
-
-export {
-  Leap
-};

package/dist/chunk-5UAEBEER.js

@@ -1,78 +0,0 @@
-import {
-  rotationCss,
-  spinClass
-} from "./chunk-A2PZBHTA.js";
-import {
-  linecap
-} from "./chunk-JNR4T6LZ.js";
-import {
-  SpinnerStyle,
-  spinnerRoot
-} from "./chunk-UAO52LUL.js";
-import {
-  SIZE
-} from "./chunk-OMNMMKI7.js";
-
-// src/dual.tsx
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-var css = `
-.ld-dual {
-  width: ${SIZE};
-  height: ${SIZE};
-}
-
-${rotationCss("dual")}
-
-.ld-dual-inner {
-  animation-direction: reverse;
-}
-
-@media (prefers-reduced-motion: reduce) {
-  .ld-dual-inner {
-    transform: rotate(180deg);
-  }
-}
-`;
-function Dual({ cap, easing, ...rest }) {
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(SpinnerStyle, { name: "dual", children: css }),
-    /* @__PURE__ */ jsxs(
-      "svg",
-      {
-        ...spinnerRoot("dual", rest),
-        fill: "none",
-        role: "presentation",
-        stroke: "currentColor",
-        strokeLinecap: linecap(cap),
-        strokeWidth: "2.5",
-        viewBox: "0 0 24 24",
-        children: [
-          /* @__PURE__ */ jsx(
-            "circle",
-            {
-              className: spinClass("dual", easing),
-              cx: "12",
-              cy: "12",
-              r: "10",
-              strokeDasharray: "18 44.8"
-            }
-          ),
-          /* @__PURE__ */ jsx(
-            "circle",
-            {
-              className: `ld-dual-inner ${spinClass("dual", easing)}`,
-              cx: "12",
-              cy: "12",
-              r: "5.5",
-              strokeDasharray: "10 24.6"
-            }
-          )
-        ]
-      }
-    )
-  ] });
-}
-
-export {
-  Dual
-};

package/dist/chunk-A2PZBHTA.js

@@ -1,41 +0,0 @@
-import {
-  animation
-} from "./chunk-OMNMMKI7.js";
-
-// src/easing.ts
-var DEFAULT_EASING = "linear";
-function spinClass(name, easing = DEFAULT_EASING) {
-  const base = `ld-${name}-spin`;
-  return easing === "linear" ? base : `${base} ${base}-${easing}`;
-}
-var ROTATE = `to {
-    transform: rotate(360deg);
-  }`;
-function rotationCss(name, turn = ROTATE) {
-  return `
-.ld-${name}-spin {
-  transform-origin: center;
-  ${animation(name, `ld-${name}-rotate`, "linear")}
-}
-
-.ld-${name}-spin-ease-in-out {
-  animation-timing-function: ease-in-out;
-}
-
-.ld-${name}-spin-stacked {
-  animation-name: ld-${name}-rotate, ld-${name}-rotate;
-  animation-timing-function: linear, ease-in-out;
-  animation-composition: add;
-}
-
-@keyframes ld-${name}-rotate {
-  ${turn}
-}
-`;
-}
-
-export {
-  DEFAULT_EASING,
-  spinClass,
-  rotationCss
-};

package/dist/chunk-BAVSTTWG.js

@@ -1,88 +0,0 @@
-import {
-  rotationCss,
-  spinClass
-} from "./chunk-A2PZBHTA.js";
-import {
-  SpinnerStyle,
-  cssVars,
-  spinnerRoot,
-  step
-} from "./chunk-UAO52LUL.js";
-import {
-  SIZE,
-  stagger
-} from "./chunk-OMNMMKI7.js";
-
-// src/atom.tsx
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-var ORBITS = Array.from({ length: 3 }, (_, index) => index);
-var TILT = 180 / ORBITS.length;
-var STROKE = `calc(${SIZE} * 0.055)`;
-var INNER_STROKE = `calc(${SIZE} * 0.045)`;
-var css = `
-.ld-atom {
-  position: relative;
-  width: ${SIZE};
-  height: ${SIZE};
-}
-
-.ld-atom-shell {
-  position: absolute;
-  inset: 0;
-  box-sizing: border-box;
-  border: ${STROKE} solid currentColor;
-  border-radius: 9999px;
-}
-
-.ld-atom-orbit {
-  position: absolute;
-  inset: 0;
-  transform-style: preserve-3d;
-  transform: rotate(var(--ld-atom-tilt)) rotateX(90deg);
-}
-
-.ld-atom-ring {
-  position: absolute;
-  inset: 0;
-  box-sizing: border-box;
-  border: ${INNER_STROKE} solid currentColor;
-  border-radius: 9999px;
-  transform: rotateX(90deg);
-}
-
-${rotationCss("atom")}
-
-.ld-atom-spin {
-  position: absolute;
-  inset: 0;
-  transform-style: preserve-3d;
-  animation-delay: ${stagger("atom", ORBITS.length)};
-}
-
-@media (prefers-reduced-motion: reduce) {
-  .ld-atom-spin {
-    transform: rotate(${TILT}deg);
-  }
-}
-`;
-function Atom({ easing, ...rest }) {
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(SpinnerStyle, { name: "atom", children: css }),
-    /* @__PURE__ */ jsxs("div", { ...spinnerRoot("atom", rest), children: [
-      /* @__PURE__ */ jsx("div", { className: "ld-atom-shell" }),
-      ORBITS.map((index) => /* @__PURE__ */ jsx(
-        "div",
-        {
-          className: "ld-atom-orbit",
-          style: cssVars({ "--ld-atom-tilt": `${index * TILT}deg` }),
-          children: /* @__PURE__ */ jsx("div", { className: spinClass("atom", easing), style: step(index), children: /* @__PURE__ */ jsx("div", { className: "ld-atom-ring" }) })
-        },
-        index
-      ))
-    ] })
-  ] });
-}
-
-export {
-  Atom
-};

package/dist/chunk-BCIAMPLU.js

@@ -1,87 +0,0 @@
-import {
-  SpinnerStyle,
-  cssVars,
-  spinnerRoot,
-  step
-} from "./chunk-UAO52LUL.js";
-import {
-  SIZE,
-  animation,
-  stagger
-} from "./chunk-OMNMMKI7.js";
-
-// src/slide.tsx
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-var DOT = 34;
-var GAP = 20;
-var MARGIN = (100 - 2 * DOT - GAP) / 2;
-var FAR = `${((DOT + GAP) / DOT * 100).toFixed(1)}%`;
-var RESTS = [
-  `translate(${FAR}, 0)`,
-  "translate(0, 0)",
-  `translate(0, ${FAR})`
-];
-var css = `
-.ld-slide {
-  position: relative;
-  width: ${SIZE};
-  height: ${SIZE};
-}
-
-.ld-slide-dot {
-  position: absolute;
-  top: ${MARGIN}%;
-  left: ${MARGIN}%;
-  width: ${DOT}%;
-  height: ${DOT}%;
-  background: currentColor;
-  border-radius: 50%;
-  ${animation("slide", "ld-slide-walk", "ease-in-out")}
-  animation-delay: ${stagger("slide", RESTS.length)};
-}
-
-@keyframes ld-slide-walk {
-  0% {
-    transform: translate(${FAR}, 0);
-  }
-  8.33%,
-  25% {
-    transform: translate(${FAR}, ${FAR});
-  }
-  33.33%,
-  50% {
-    transform: translate(0, ${FAR});
-  }
-  58.33%,
-  75% {
-    transform: translate(0, 0);
-  }
-  83.33%,
-  100% {
-    transform: translate(${FAR}, 0);
-  }
-}
-
-@media (prefers-reduced-motion: reduce) {
-  .ld-slide-dot {
-    transform: var(--ld-slide-rest);
-  }
-}
-`;
-function Slide(props) {
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(SpinnerStyle, { name: "slide", children: css }),
-    /* @__PURE__ */ jsx("div", { ...spinnerRoot("slide", props), children: RESTS.map((rest, index) => /* @__PURE__ */ jsx(
-      "div",
-      {
-        className: "ld-slide-dot",
-        style: cssVars({ ...step(index), "--ld-slide-rest": rest })
-      },
-      rest
-    )) })
-  ] });
-}
-
-export {
-  Slide
-};

package/dist/chunk-DKYEZLIN.js

@@ -1,72 +0,0 @@
-import {
-  SpinnerStyle,
-  spinnerRoot,
-  step
-} from "./chunk-UAO52LUL.js";
-import {
-  SIZE,
-  STEP_VAR,
-  animation,
-  stagger
-} from "./chunk-OMNMMKI7.js";
-
-// src/wave.tsx
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-var DEFAULT_WAVE_ORIGIN = "center";
-var BARS = Array.from({ length: 5 }, (_, index) => index);
-var css = `
-.ld-wave {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  width: ${SIZE};
-  height: ${SIZE};
-}
-
-.ld-wave-bar {
-  width: calc(${SIZE} * 0.12);
-  height: 100%;
-  background: currentColor;
-  border-radius: 9999px;
-  ${animation("wave", "ld-wave-rise", "ease-in-out")}
-  animation-delay: ${stagger("wave", BARS.length)};
-}
-
-.ld-wave-bar-bottom {
-  align-self: flex-end;
-}
-
-@keyframes ld-wave-rise {
-  0%,
-  100% {
-    height: 30%;
-  }
-  50% {
-    height: 100%;
-  }
-}
-
-@media (prefers-reduced-motion: reduce) {
-  .ld-wave-bar {
-    height: calc((0.4 + var(${STEP_VAR}) * 0.15) * 100%);
-  }
-}
-`;
-function Wave({ origin = DEFAULT_WAVE_ORIGIN, ...rest }) {
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(SpinnerStyle, { name: "wave", children: css }),
-    /* @__PURE__ */ jsx("div", { ...spinnerRoot("wave", rest), children: BARS.map((index) => /* @__PURE__ */ jsx(
-      "div",
-      {
-        className: `ld-wave-bar ld-wave-bar-${origin}`,
-        style: step(index)
-      },
-      index
-    )) })
-  ] });
-}
-
-export {
-  DEFAULT_WAVE_ORIGIN,
-  Wave
-};