loading-dev 0.3.4 → 0.3.6

package/dist/chunk-AHW6IXXT.js

@@ -1,78 +0,0 @@
-import {
-  SpinnerStyle,
-  spinnerRoot,
-  step
-} from "./chunk-VRX5ZYC6.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;
-    animation: none;
-  }
-}
-`;
-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-AY4VLQBZ.js

@@ -1,57 +0,0 @@
-import {
-  SpinnerStyle,
-  spinnerRoot
-} from "./chunk-VRX5ZYC6.js";
-import {
-  SIZE,
-  animation
-} from "./chunk-OMNMMKI7.js";
-
-// src/morph.tsx
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-var css = `
-.ld-morph {
-  width: ${SIZE};
-  height: ${SIZE};
-}
-
-.ld-morph-shape {
-  width: 64%;
-  height: 64%;
-  margin: 18%;
-  background: currentColor;
-  border-radius: calc(${SIZE} * 0.08);
-  ${animation("morph", "ld-morph-round", "ease-in-out")}
-}
-
-@keyframes ld-morph-round {
-  0% {
-    border-radius: calc(${SIZE} * 0.08);
-    transform: rotate(0);
-  }
-  50% {
-    border-radius: 50%;
-    transform: rotate(45deg);
-  }
-  100% {
-    border-radius: calc(${SIZE} * 0.08);
-    transform: rotate(90deg);
-  }
-}
-
-@media (prefers-reduced-motion: reduce) {
-  .ld-morph-shape {
-    animation: none;
-  }
-}
-`;
-function Morph(props) {
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(SpinnerStyle, { name: "morph", children: css }),
-    /* @__PURE__ */ jsx("div", { ...spinnerRoot("morph", props), children: /* @__PURE__ */ jsx("div", { className: "ld-morph-shape" }) })
-  ] });
-}
-
-export {
-  Morph
-};

package/dist/chunk-BMJ3AGRK.js

@@ -1,62 +0,0 @@
-import {
-  SpinnerStyle,
-  spinnerRoot,
-  step
-} from "./chunk-VRX5ZYC6.js";
-import {
-  SIZE,
-  animation,
-  stagger
-} from "./chunk-OMNMMKI7.js";
-
-// src/swirl.tsx
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-var RING = [0, 1, 2, 7, null, 3, 6, 5, 4];
-var PLACES = RING.filter((place) => place !== null).length;
-var css = `
-.ld-swirl {
-  display: grid;
-  grid-template-columns: repeat(3, 1fr);
-  grid-template-rows: repeat(3, 1fr);
-  gap: calc(${SIZE} * 0.15625);
-  box-sizing: border-box;
-  width: ${SIZE};
-  height: ${SIZE};
-  padding: calc(${SIZE} * 0.0625);
-}
-
-.ld-swirl-cell {
-  background: currentColor;
-  border-radius: calc(${SIZE} * 0.0625);
-  ${animation("swirl", "ld-swirl-fade", "linear")}
-  animation-delay: ${stagger("swirl", PLACES)};
-}
-
-@keyframes ld-swirl-fade {
-  from {
-    opacity: 1;
-  }
-  to {
-    opacity: 0.2;
-  }
-}
-
-@media (prefers-reduced-motion: reduce) {
-  .ld-swirl-cell {
-    opacity: 0.6;
-    animation: none;
-  }
-}
-`;
-function Swirl(props) {
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(SpinnerStyle, { name: "swirl", children: css }),
-    /* @__PURE__ */ jsx("div", { ...spinnerRoot("swirl", props), children: RING.map(
-      (place, index) => place === null ? /* @__PURE__ */ jsx("div", {}, index) : /* @__PURE__ */ jsx("div", { className: "ld-swirl-cell", style: step(place) }, index)
-    ) })
-  ] });
-}
-
-export {
-  Swirl
-};

package/dist/chunk-FKUMWHUL.js

@@ -1,71 +0,0 @@
-import {
-  SpinnerStyle,
-  spinnerRoot
-} from "./chunk-VRX5ZYC6.js";
-import {
-  SIZE,
-  animation
-} from "./chunk-OMNMMKI7.js";
-
-// src/pulse.tsx
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-var css = `
-.ld-pulse {
-  width: ${SIZE};
-  height: ${SIZE};
-}
-
-.ld-pulse-ring {
-  transform-origin: center;
-  ${animation("pulse", "ld-pulse-ripple", "ease-out")}
-}
-
-@keyframes ld-pulse-ripple {
-  from {
-    opacity: 0.4;
-    transform: scale(0.25);
-  }
-  to {
-    opacity: 0;
-    transform: scale(1);
-  }
-}
-
-@media (prefers-reduced-motion: reduce) {
-  .ld-pulse-ring {
-    opacity: 0.2;
-    animation: none;
-  }
-}
-`;
-function Pulse(props) {
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(SpinnerStyle, { name: "pulse", children: css }),
-    /* @__PURE__ */ jsxs(
-      "svg",
-      {
-        ...spinnerRoot("pulse", props),
-        fill: "none",
-        role: "presentation",
-        viewBox: "0 0 16 16",
-        children: [
-          /* @__PURE__ */ jsx(
-            "circle",
-            {
-              className: "ld-pulse-ring",
-              cx: "8",
-              cy: "8",
-              fill: "currentColor",
-              r: "8"
-            }
-          ),
-          /* @__PURE__ */ jsx("circle", { cx: "8", cy: "8", fill: "currentColor", r: "2" })
-        ]
-      }
-    )
-  ] });
-}
-
-export {
-  Pulse
-};

package/dist/chunk-HDBQBCTN.js

@@ -1,74 +0,0 @@
-import {
-  rotationCss,
-  spinClass
-} from "./chunk-7C6Q6WUN.js";
-import {
-  linecap
-} from "./chunk-JNR4T6LZ.js";
-import {
-  SpinnerStyle,
-  spinnerRoot
-} from "./chunk-VRX5ZYC6.js";
-import {
-  SIZE
-} from "./chunk-OMNMMKI7.js";
-
-// src/trace.tsx
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-var VIEW = 20;
-var SIDE = 17.5;
-var RADIUS = 4;
-var PERIMETER = 4 * (SIDE - 2 * RADIUS) + 2 * Math.PI * RADIUS;
-var DASH = 16;
-var RECT = {
-  height: SIDE,
-  rx: RADIUS,
-  width: SIDE,
-  x: (VIEW - SIDE) / 2,
-  y: (VIEW - SIDE) / 2
-};
-var css = `
-.ld-trace {
-  width: ${SIZE};
-  height: ${SIZE};
-}
-
-${rotationCss(
-  "trace",
-  `to {
-    stroke-dashoffset: ${-PERIMETER};
-  }`
-)}
-`;
-function Trace({ cap, easing, ...rest }) {
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(SpinnerStyle, { name: "trace", children: css }),
-    /* @__PURE__ */ jsxs(
-      "svg",
-      {
-        ...spinnerRoot("trace", rest),
-        fill: "none",
-        role: "presentation",
-        stroke: "currentColor",
-        strokeWidth: "2.5",
-        viewBox: `0 0 ${VIEW} ${VIEW}`,
-        children: [
-          /* @__PURE__ */ jsx("rect", { ...RECT, opacity: "0.2" }),
-          /* @__PURE__ */ jsx(
-            "rect",
-            {
-              ...RECT,
-              className: spinClass("trace", easing),
-              strokeDasharray: `${DASH} ${PERIMETER - DASH}`,
-              strokeLinecap: linecap(cap)
-            }
-          )
-        ]
-      }
-    )
-  ] });
-}
-
-export {
-  Trace
-};

package/dist/chunk-I5CFO2M5.js

@@ -1,78 +0,0 @@
-import {
-  linecap
-} from "./chunk-JNR4T6LZ.js";
-import {
-  SpinnerStyle,
-  spinnerRoot,
-  step
-} from "./chunk-VRX5ZYC6.js";
-import {
-  SIZE,
-  animation,
-  stagger
-} from "./chunk-OMNMMKI7.js";
-
-// src/cascade.tsx
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-var RADII = [10.5, 7, 3.5];
-var SLOTS = 24;
-var css = `
-.ld-cascade {
-  width: ${SIZE};
-  height: ${SIZE};
-}
-
-.ld-cascade-arc {
-  transform-origin: center;
-  ${animation("cascade", "ld-cascade-turn", "cubic-bezier(0.68, -0.75, 0.265, 1.75)")}
-  animation-delay: ${stagger("cascade", SLOTS)};
-}
-
-@keyframes ld-cascade-turn {
-  to {
-    transform: rotate(360deg);
-  }
-}
-
-@media (prefers-reduced-motion: reduce) {
-  .ld-cascade-arc {
-    animation: none;
-  }
-}
-`;
-function Cascade({ cap, ...rest }) {
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(SpinnerStyle, { name: "cascade", children: css }),
-    /* @__PURE__ */ jsx(
-      "svg",
-      {
-        ...spinnerRoot("cascade", rest),
-        fill: "none",
-        role: "presentation",
-        stroke: "currentColor",
-        strokeLinecap: linecap(cap),
-        strokeWidth: "2",
-        viewBox: "0 0 24 24",
-        children: RADII.map((r, index) => {
-          const circumference = 2 * Math.PI * r;
-          return /* @__PURE__ */ jsx(
-            "circle",
-            {
-              className: "ld-cascade-arc",
-              cx: "12",
-              cy: "12",
-              r,
-              strokeDasharray: `${circumference / 4} ${circumference * 3 / 4}`,
-              style: step(index)
-            },
-            r
-          );
-        })
-      }
-    )
-  ] });
-}
-
-export {
-  Cascade
-};

package/dist/chunk-IQ2WQZFY.js

@@ -1,51 +0,0 @@
-import {
-  rotationCss,
-  spinClass
-} from "./chunk-7C6Q6WUN.js";
-import {
-  SpinnerStyle,
-  spinnerRoot
-} from "./chunk-VRX5ZYC6.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-IRMB7CHZ.js

@@ -1,88 +0,0 @@
-import {
-  SpinnerStyle,
-  cssVars,
-  spinnerRoot,
-  step
-} from "./chunk-VRX5ZYC6.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);
-    animation: none;
-  }
-}
-`;
-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-IWVH2GKE.js

@@ -1,77 +0,0 @@
-import {
-  SpinnerStyle,
-  spinnerRoot,
-  step
-} from "./chunk-VRX5ZYC6.js";
-import {
-  SIZE,
-  STEP_VAR,
-  animation,
-  stagger
-} from "./chunk-OMNMMKI7.js";
-
-// src/ripple.tsx
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-var DEFAULT_RIPPLE_DIRECTION = "out";
-var RINGS = Array.from({ length: 3 }, (_, index) => index);
-var css = `
-.ld-ripple {
-  position: relative;
-  width: ${SIZE};
-  height: ${SIZE};
-}
-
-.ld-ripple-ring {
-  position: absolute;
-  inset: 0;
-  box-sizing: border-box;
-  border: calc(${SIZE} * 0.08) solid currentColor;
-  border-radius: 9999px;
-  ${animation("ripple", "ld-ripple-spread", "ease-out")}
-  animation-delay: ${stagger("ripple", RINGS.length)};
-}
-
-.ld-ripple-ring-in {
-  animation-direction: reverse;
-}
-
-@keyframes ld-ripple-spread {
-  from {
-    opacity: 1;
-    transform: scale(0);
-  }
-  to {
-    opacity: 0;
-    transform: scale(1);
-  }
-}
-
-@media (prefers-reduced-motion: reduce) {
-  .ld-ripple-ring {
-    opacity: 0.4;
-    transform: scale(calc((var(${STEP_VAR}) + 1) / ${RINGS.length}));
-    animation: none;
-  }
-}
-`;
-function Ripple({
-  direction = DEFAULT_RIPPLE_DIRECTION,
-  ...rest
-}) {
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(SpinnerStyle, { name: "ripple", children: css }),
-    /* @__PURE__ */ jsx("div", { ...spinnerRoot("ripple", rest), children: RINGS.map((index) => /* @__PURE__ */ jsx(
-      "div",
-      {
-        className: `ld-ripple-ring ld-ripple-ring-${direction}`,
-        style: step(index)
-      },
-      index
-    )) })
-  ] });
-}
-
-export {
-  DEFAULT_RIPPLE_DIRECTION,
-  Ripple
-};

package/dist/chunk-IZ4TRHOC.js

@@ -1,68 +0,0 @@
-import {
-  SpinnerStyle,
-  spinnerRoot,
-  step
-} from "./chunk-VRX5ZYC6.js";
-import {
-  SIZE,
-  STEP_VAR,
-  animation,
-  stagger
-} from "./chunk-OMNMMKI7.js";
-
-// src/classic.tsx
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-var BARS = Array.from({ length: 12 }, (_, index) => index);
-var css = `
-.ld-classic {
-  width: ${SIZE};
-  height: ${SIZE};
-}
-
-.ld-classic-inner {
-  position: relative;
-  top: 50%;
-  left: 50%;
-  width: ${SIZE};
-  height: ${SIZE};
-}
-
-.ld-classic-bar {
-  position: absolute;
-  top: -3.9%;
-  left: -10%;
-  width: 24%;
-  height: 8%;
-  background: currentColor;
-  border-radius: 6px;
-  transform: rotate(calc(var(${STEP_VAR}) * 30deg)) translate(146%);
-  ${animation("classic", "ld-classic-spin", "linear")}
-  animation-delay: ${stagger("classic", BARS.length)};
-}
-
-@keyframes ld-classic-spin {
-  0% {
-    opacity: 1;
-  }
-  100% {
-    opacity: 0.15;
-  }
-}
-
-@media (prefers-reduced-motion: reduce) {
-  .ld-classic-bar {
-    opacity: 0.5;
-    animation: none;
-  }
-}
-`;
-function Classic(props) {
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(SpinnerStyle, { name: "classic", children: css }),
-    /* @__PURE__ */ jsx("div", { ...spinnerRoot("classic", props), children: /* @__PURE__ */ jsx("div", { className: "ld-classic-inner", children: BARS.map((bar) => /* @__PURE__ */ jsx("div", { className: "ld-classic-bar", style: step(bar) }, bar)) }) })
-  ] });
-}
-
-export {
-  Classic
-};