@nsaa/core 0.1.0-alpha.1 → 0.1.0-alpha.2

package/dist/loaders.js

@@ -1,1097 +1,36 @@
 "use client";
-import { _ as DEFAULT_CAP, a as Wave, c as Orbit, d as fadeCss, f as BouncingDots, g as spinClass, h as rotationCss, i as DEFAULT_WAVE_ORIGIN, l as Classic, m as DEFAULT_EASING, n as registerLoader, o as Ring, p as Arc, r as registerLoaders, s as Pulse, u as CircularDots, v as linecap } from "./registry-2PyPW9Xw.js";
-import { a as spinnerRoot, c as PLAY_STATE_VAR, d as STEP_VAR, f as animation, i as reducedMotion, l as SIZE, n as SpinnerStyle, o as step, p as stagger, r as cssVars, s as DURATION_VAR, u as SPINNER_MOTION } from "./frame-CK9IBOZB.js";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { createElement, useId } from "react";
-// src/loaders/atom.tsx
-const ORBITS = Array.from({ length: 3 }, (_, index) => index);
-const TILT = 180 / ORBITS.length;
-const css$20 = `
-.nsaa-loader-atom {
-  position: relative;
-}
-
-.nsaa-loader-atom-shell {
-  position: absolute;
-  inset: 0;
-  box-sizing: border-box;
-  border: ${`calc(${SIZE} * 0.055)`} solid currentColor;
-  border-radius: 9999px;
-}
-
-.nsaa-loader-atom-orbit {
-  position: absolute;
-  inset: 0;
-  transform-style: preserve-3d;
-  transform: rotate(var(--nsaa-loader-atom-tilt)) rotateX(90deg);
-}
-
-.nsaa-loader-atom-ring {
-  position: absolute;
-  inset: 0;
-  box-sizing: border-box;
-  border: ${`calc(${SIZE} * 0.045)`} solid currentColor;
-  border-radius: 9999px;
-  transform: rotateX(90deg);
-}
-
-${rotationCss("atom")}
-
-.nsaa-loader-atom-spin {
-  position: absolute;
-  inset: 0;
-  transform-style: preserve-3d;
-  animation-delay: ${stagger("atom", ORBITS.length)};
-}
-
-${reducedMotion(`
-  .nsaa-loader-atom-spin {
-    transform: rotate(${TILT}deg);
-  }
-`)}
-`;
-function Atom({ easing, ...rest }) {
-	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(SpinnerStyle, {
-		name: "atom",
-		children: css$20
-	}), /* @__PURE__ */ jsxs("div", {
-		...spinnerRoot("atom", rest),
-		children: [/* @__PURE__ */ jsx("div", { className: "nsaa-loader-atom-shell" }), ORBITS.map((index) => /* @__PURE__ */ jsx("div", {
-			className: "nsaa-loader-atom-orbit",
-			style: cssVars({ "--nsaa-loader-atom-tilt": `${index * TILT}deg` }),
-			children: /* @__PURE__ */ jsx("div", {
-				className: spinClass("atom", easing),
-				style: step(index),
-				children: /* @__PURE__ */ jsx("div", { className: "nsaa-loader-atom-ring" })
-			})
-		}, index))]
-	})] });
-}
-// src/loaders/blocks.tsx
-const DEFAULT_BLOCKS_SWEEP = "diagonal";
-const SIDE$1 = 3;
-const CELLS = Array.from({ length: 9 }, (_, index) => ({
-	col: index % SIDE$1,
-	row: Math.floor(index / SIDE$1)
-}));
-const SWEEPS = {
-	columns: {
-		count: SIDE$1,
-		place: ({ col }) => col
-	},
-	diagonal: {
-		count: 5,
-		place: ({ col, row }) => row + col
-	},
-	rows: {
-		count: SIDE$1,
-		place: ({ row }) => row
-	}
-};
-const css$19 = `
-.nsaa-loader-blocks {
-  display: grid;
-  grid-template-columns: repeat(${SIDE$1}, 1fr);
-  grid-template-rows: repeat(${SIDE$1}, 1fr);
-  gap: calc(${SIZE} * 0.1);
-}
-
-.nsaa-loader-blocks-cell {
-  background: currentColor;
-  border-radius: calc(${SIZE} * 0.0625);
-  ${animation("blocks", "nsaa-loader-blocks-sweep", "ease-in-out")}
-}
-${Object.entries(SWEEPS).map(([sweep, { count }]) => `
-.nsaa-loader-blocks-cell-${sweep} {
-  animation-delay: ${stagger("blocks", count)};
-}
-`).join("")}
-@keyframes nsaa-loader-blocks-sweep {
-  0%,
-  70%,
-  100% {
-    transform: scale(1);
-  }
-  35% {
-    transform: scale(0);
-  }
-}
-
-${reducedMotion(`
-  .nsaa-loader-blocks-cell {
-    transform: scale(0.8);
-  }
-`)}
-`;
-function Blocks({ sweep = DEFAULT_BLOCKS_SWEEP, ...rest }) {
-	const { place } = SWEEPS[sweep];
-	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(SpinnerStyle, {
-		name: "blocks",
-		children: css$19
-	}), /* @__PURE__ */ jsx("div", {
-		...spinnerRoot("blocks", rest),
-		children: CELLS.map((cell) => /* @__PURE__ */ jsx("div", {
-			className: `nsaa-loader-blocks-cell nsaa-loader-blocks-cell-${sweep}`,
-			style: step(place(cell))
-		}, `${cell.col}-${cell.row}`))
-	})] });
-}
-// src/loaders/cascade.tsx
-const RADII = [
-	10.5,
-	7,
-	3.5
-];
-const css$18 = `
-.nsaa-loader-cascade-arc {
-  transform-origin: center;
-  ${animation("cascade", "nsaa-loader-cascade-turn", "cubic-bezier(0.68, -0.75, 0.265, 1.75)")}
-  animation-delay: ${stagger("cascade", 24)};
-}
-
-@keyframes nsaa-loader-cascade-turn {
-  to {
-    transform: rotate(360deg);
-  }
-}
-`;
-function Cascade({ cap, ...rest }) {
-	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(SpinnerStyle, {
-		name: "cascade",
-		children: css$18
-	}), /* @__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: "nsaa-loader-cascade-arc",
-				cx: "12",
-				cy: "12",
-				r,
-				strokeDasharray: `${circumference / 4} ${circumference * 3 / 4}`,
-				style: step(index)
-			}, r);
-		})
-	})] });
-}
-// src/loaders/classic-v2.tsx
-const TICKS = [
-	"M7.33334 0.666667C7.33334 0.298477 7.63181 0 8 0C8.36819 0 8.66667 0.298477 8.66667 0.666667V3.33333C8.66667 3.70152 8.36819 4 8 4C7.63181 4 7.33334 3.70152 7.33334 3.33333V0.666667Z",
-	"M11.7712 5.17154C11.5109 5.43189 11.0888 5.43189 10.8284 5.17154C10.5681 4.91119 10.5681 4.48908 10.8284 4.22873L12.714 2.34311C12.9744 2.08276 13.3965 2.08276 13.6568 2.34311C13.9172 2.60346 13.9172 3.02557 13.6568 3.28592L11.7712 5.17154Z",
-	"M12.6667 8.66667C12.2985 8.66667 12 8.36819 12 8.00001C12 7.63182 12.2985 7.33334 12.6667 7.33334H15.3333C15.7015 7.33334 16 7.63182 16 8.00001C16 8.36819 15.7015 8.66667 15.3333 8.66667H12.6667Z",
-	"M10.8284 11.7713C10.5681 11.5109 10.5681 11.0888 10.8284 10.8284C11.0888 10.5681 11.5109 10.5681 11.7712 10.8284L13.6568 12.7141C13.9172 12.9744 13.9172 13.3965 13.6568 13.6569C13.3965 13.9172 12.9744 13.9172 12.714 13.6569L10.8284 11.7713Z",
-	"M7.33333 12.6667C7.33333 12.2985 7.63181 12 8 12C8.36819 12 8.66667 12.2985 8.66667 12.6667V15.3333C8.66667 15.7015 8.36819 16 8 16C7.63181 16 7.33333 15.7015 7.33333 15.3333V12.6667Z",
-	"M3.28594 13.6569C3.02559 13.9172 2.60348 13.9172 2.34313 13.6569C2.08278 13.3965 2.08278 12.9744 2.34313 12.714L4.22875 10.8284C4.4891 10.5681 4.91121 10.5681 5.17156 10.8284C5.43191 11.0888 5.43191 11.5109 5.17156 11.7712L3.28594 13.6569Z",
-	"M0.666667 8.66667C0.298477 8.66667 1.60941e-08 8.36819 0 8.00001C-1.60941e-08 7.63182 0.298477 7.33334 0.666667 7.33334H3.33333C3.70152 7.33334 4 7.63182 4 8.00001C4 8.36819 3.70152 8.66667 3.33333 8.66667H0.666667Z",
-	"M2.34315 3.28594C2.0828 3.02559 2.0828 2.60348 2.34315 2.34314C2.6035 2.08279 3.02561 2.08279 3.28596 2.34313L5.17158 4.22875C5.43193 4.4891 5.43193 4.91121 5.17158 5.17156C4.91123 5.43191 4.48912 5.43191 4.22877 5.17156L2.34315 3.28594Z"
-];
-const css$17 = `
-${fadeCss("classic-v2", "tick", TICKS.length, {
-	dim: .4,
-	rest: .5
-})}
-`;
-function ClassicV2(props) {
-	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(SpinnerStyle, {
-		name: "classic-v2",
-		children: css$17
-	}), /* @__PURE__ */ jsx("svg", {
-		...spinnerRoot("classic-v2", props),
-		fill: "none",
-		role: "presentation",
-		viewBox: "0 0 16 16",
-		children: /* @__PURE__ */ jsx("g", {
-			fill: "currentColor",
-			children: TICKS.map((d, tick) => /* @__PURE__ */ jsx("path", {
-				className: "nsaa-loader-classic-v2-tick",
-				d,
-				style: step(tick)
-			}, d))
-		})
-	})] });
-}
-// src/loaders/clock.tsx
-const css$16 = `
-${rotationCss("clock")}
-`;
-function Clock({ easing, ...rest }) {
-	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(SpinnerStyle, {
-		name: "clock",
-		children: css$16
-	}), /* @__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"
-		})]
-	})] });
-}
-// src/loaders/comet.tsx
-const css$15 = `
-.nsaa-loader-comet {
-  --nsaa-loader-comet-stroke: calc(${SIZE} * 0.12);
-  position: relative;
-}
-
-.nsaa-loader-comet-spin {
-  position: absolute;
-  inset: 0;
-}
-
-.nsaa-loader-comet-tail {
-  position: absolute;
-  inset: 0;
-  border-radius: 9999px;
-  background: conic-gradient(from 0deg, transparent, currentColor);
-  -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - var(--nsaa-loader-comet-stroke)), #000 0);
-  mask: radial-gradient(farthest-side, transparent calc(100% - var(--nsaa-loader-comet-stroke)), #000 0);
-}
-
-.nsaa-loader-comet-head {
-  position: absolute;
-  top: 0;
-  left: 50%;
-  width: var(--nsaa-loader-comet-stroke);
-  height: var(--nsaa-loader-comet-stroke);
-  background: currentColor;
-  border-radius: 9999px;
-  transform: translateX(-50%);
-}
-
-${rotationCss("comet")}
-`;
-function Comet({ easing, ...rest }) {
-	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(SpinnerStyle, {
-		name: "comet",
-		children: css$15
-	}), /* @__PURE__ */ jsx("div", {
-		...spinnerRoot("comet", rest),
-		children: /* @__PURE__ */ jsxs("div", {
-			className: spinClass("comet", easing),
-			children: [/* @__PURE__ */ jsx("div", { className: "nsaa-loader-comet-tail" }), /* @__PURE__ */ jsx("div", { className: "nsaa-loader-comet-head" })]
-		})
-	})] });
-}
-// src/loaders/compass.tsx
-const css$14 = `
-.nsaa-loader-compass-ticks {
-  transform-origin: center;
-  ${animation("compass", "nsaa-loader-compass-turn", "ease-in-out")}
-}
-
-@keyframes nsaa-loader-compass-turn {
-  to {
-    transform: rotate(90deg);
-  }
-}
-`;
-function Compass(props) {
-	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(SpinnerStyle, {
-		name: "compass",
-		children: css$14
-	}), /* @__PURE__ */ jsx("svg", {
-		...spinnerRoot("compass", props),
-		fill: "none",
-		role: "presentation",
-		viewBox: "0 0 16 16",
-		children: /* @__PURE__ */ jsxs("g", {
-			className: "nsaa-loader-compass-ticks",
-			fill: "currentColor",
-			children: [
-				/* @__PURE__ */ jsx("path", { d: "M7.33334 0.666667C7.33334 0.298477 7.63181 0 8 0C8.36819 0 8.66667 0.298477 8.66667 0.666667V3.33333C8.66667 3.70152 8.36819 4 8 4C7.63181 4 7.33334 3.70152 7.33334 3.33333V0.666667Z" }),
-				/* @__PURE__ */ jsx("path", { d: "M12.6667 8.66667C12.2985 8.66667 12 8.3682 12 8.00001C12 7.63182 12.2985 7.33334 12.6667 7.33334H15.3333C15.7015 7.33334 16 7.63182 16 8.00001C16 8.3682 15.7015 8.66667 15.3333 8.66667H12.6667Z" }),
-				/* @__PURE__ */ jsx("path", { d: "M7.33333 12.6667C7.33333 12.2985 7.63181 12 8 12C8.36819 12 8.66667 12.2985 8.66667 12.6667V15.3333C8.66667 15.7015 8.36819 16 8 16C7.63181 16 7.33333 15.7015 7.33333 15.3333V12.6667Z" }),
-				/* @__PURE__ */ jsx("path", { d: "M0.666667 8.66667C0.298477 8.66667 1.60941e-08 8.3682 0 8.00001C-1.60941e-08 7.63182 0.298477 7.33334 0.666667 7.33334H3.33333C3.70152 7.33334 4 7.63182 4 8.00001C4 8.3682 3.70152 8.66667 3.33333 8.66667H0.666667Z" })
-			]
-		})
-	})] });
-}
-// src/loaders/dual.tsx
-const css$13 = `
-${rotationCss("dual")}
-
-.nsaa-loader-dual-inner {
-  animation-direction: reverse;
-}
-
-${reducedMotion(`
-  .nsaa-loader-dual-inner {
-    transform: rotate(180deg);
-  }
-`)}
-`;
-function Dual({ cap, easing, ...rest }) {
-	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(SpinnerStyle, {
-		name: "dual",
-		children: css$13
-	}), /* @__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: `nsaa-loader-dual-inner ${spinClass("dual", easing)}`,
-			cx: "12",
-			cy: "12",
-			r: "5.5",
-			strokeDasharray: "10 24.6"
-		})]
-	})] });
-}
-// src/loaders/eclipse.tsx
-const DOTS$2 = [0, 1];
-const css$12 = `
-.nsaa-loader-eclipse {
-  position: relative;
-}
-
-.nsaa-loader-eclipse-dot {
-  position: absolute;
-  top: 30%;
-  left: 30%;
-  width: 40%;
-  height: 40%;
-  background: currentColor;
-  border-radius: 50%;
-  ${animation("eclipse", ["nsaa-loader-eclipse-slide", "nsaa-loader-eclipse-depth"], "ease-in-out")}
-  animation-delay: ${stagger("eclipse", DOTS$2.length)};
-}
-
-@keyframes nsaa-loader-eclipse-slide {
-  0%,
-  100% {
-    translate: 75% 0;
-  }
-  50% {
-    translate: -75% 0;
-  }
-}
-
-@keyframes nsaa-loader-eclipse-depth {
-  0%,
-  50%,
-  100% {
-    opacity: 0.75;
-    scale: 1;
-  }
-  25% {
-    opacity: 1;
-    scale: 1.3;
-  }
-  75% {
-    opacity: 0.5;
-    scale: 0.7;
-  }
-}
-
-${reducedMotion(`
-  .nsaa-loader-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$12
-	}), /* @__PURE__ */ jsx("div", {
-		...spinnerRoot("eclipse", props),
-		children: DOTS$2.map((index) => /* @__PURE__ */ jsx("div", {
-			className: "nsaa-loader-eclipse-dot",
-			style: step(index)
-		}, index))
-	})] });
-}
-// src/loaders/flip.tsx
-const css$11 = `
-.nsaa-loader-flip {
-  perspective: calc(${SIZE} * 3);
-}
-
-.nsaa-loader-flip-face {
-  width: 64%;
-  height: 64%;
-  margin: 18%;
-  background: currentColor;
-  border-radius: calc(${SIZE} * 0.06);
-  ${animation("flip", "nsaa-loader-flip-turn", "ease-in-out")}
-}
-
-@keyframes nsaa-loader-flip-turn {
-  0% {
-    transform: rotateX(0) rotateY(0);
-  }
-  50% {
-    transform: rotateX(-180deg) rotateY(0);
-  }
-  100% {
-    transform: rotateX(-180deg) rotateY(-180deg);
-  }
-}
-`;
-function Flip(props) {
-	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(SpinnerStyle, {
-		name: "flip",
-		children: css$11
-	}), /* @__PURE__ */ jsx("div", {
-		...spinnerRoot("flip", props),
-		children: /* @__PURE__ */ jsx("div", { className: "nsaa-loader-flip-face" })
-	})] });
-}
-// src/loaders/gather.tsx
-const BLOCKS = [
-	{
-		x: 1,
-		y: 1
-	},
-	{
-		x: -1,
-		y: 1
-	},
-	{
-		x: 1,
-		y: -1
-	},
-	{
-		x: -1,
-		y: -1
-	}
-];
-const GAP = 24;
-const PULL = `${(8 / 38 * 100).toFixed(1)}%`;
-const css$10 = `
-.nsaa-loader-gather-group {
-  display: grid;
-  grid-template-columns: 1fr 1fr;
-  gap: ${GAP}%;
-  width: 100%;
-  height: 100%;
-  ${animation("gather", "nsaa-loader-gather-turn", "ease-in-out")}
-}
-
-.nsaa-loader-gather-block {
-  background: currentColor;
-  border-radius: calc(${SIZE} * 0.14);
-  ${animation("gather", "nsaa-loader-gather-pull", "ease-in-out")}
-}
-
-@keyframes nsaa-loader-gather-pull {
-  0%,
-  100% {
-    transform: translate(0, 0);
-  }
-  30%,
-  60% {
-    transform: translate(
-      calc(var(--nsaa-loader-gather-x) * ${PULL}),
-      calc(var(--nsaa-loader-gather-y) * ${PULL})
-    );
-  }
-}
-
-@keyframes nsaa-loader-gather-turn {
-  0%,
-  30% {
-    transform: rotate(0);
-  }
-  60%,
-  100% {
-    transform: rotate(90deg);
-  }
-}
-`;
-function Gather(props) {
-	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(SpinnerStyle, {
-		name: "gather",
-		children: css$10
-	}), /* @__PURE__ */ jsx("div", {
-		...spinnerRoot("gather", props),
-		children: /* @__PURE__ */ jsx("div", {
-			className: "nsaa-loader-gather-group",
-			children: BLOCKS.map(({ x, y }) => /* @__PURE__ */ jsx("div", {
-				className: "nsaa-loader-gather-block",
-				style: cssVars({
-					"--nsaa-loader-gather-x": x,
-					"--nsaa-loader-gather-y": y
-				})
-			}, `${x}${y}`))
-		})
-	})] });
-}
-// src/loaders/leap.tsx
-const DOTS$1 = Array.from({ length: 3 }, (_, index) => index);
-const css$9 = `
-.nsaa-loader-leap {
-  --nsaa-loader-leap-dot: round(calc(${SIZE} * 0.22), 1px);
-  --nsaa-loader-leap-gap: round(down, calc((${SIZE} - var(--nsaa-loader-leap-dot)) / 2), 1px);
-  position: relative;
-}
-
-.nsaa-loader-leap-wrapper {
-  position: absolute;
-  top: round(calc((${SIZE} - var(--nsaa-loader-leap-dot)) / 2), 1px);
-  left: calc(${SIZE} - var(--nsaa-loader-leap-dot) - var(--nsaa-loader-leap-gap) * 2);
-  width: calc(var(--nsaa-loader-leap-gap) * 2 + var(--nsaa-loader-leap-dot));
-  height: var(--nsaa-loader-leap-dot);
-  ${animation("leap", "nsaa-loader-leap-hop", "ease-in-out")}
-  animation-delay: ${stagger("leap", DOTS$1.length)};
-}
-
-.nsaa-loader-leap-dot {
-  position: absolute;
-  inset: 0 auto 0 0;
-  width: var(--nsaa-loader-leap-dot);
-  background: currentColor;
-  border-radius: 50%;
-}
-
-@keyframes nsaa-loader-leap-hop {
-  0% {
-    transform: translateX(0) rotate(0);
-  }
-  33.33% {
-    transform: translateX(0) rotate(180deg);
-  }
-  66.66% {
-    transform: translateX(calc(var(--nsaa-loader-leap-gap) * -1)) rotate(180deg);
-  }
-  100% {
-    transform: translateX(calc(var(--nsaa-loader-leap-gap) * -2)) rotate(180deg);
-  }
-}
-
-${reducedMotion(`
-  .nsaa-loader-leap-wrapper {
-    transform: translateX(calc(var(${STEP_VAR}) * var(--nsaa-loader-leap-gap)));
-  }
-`)}
-`;
-function Leap(props) {
-	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(SpinnerStyle, {
-		name: "leap",
-		children: css$9
-	}), /* @__PURE__ */ createElement("div", {
-		...spinnerRoot("leap", props),
-		key: props.size
-	}, DOTS$1.map((index) => /* @__PURE__ */ jsx("div", {
-		className: "nsaa-loader-leap-wrapper",
-		style: step(index),
-		children: /* @__PURE__ */ jsx("div", { className: "nsaa-loader-leap-dot" })
-	}, index)))] });
-}
-// src/loaders/linear-dots.tsx
-const DOTS = Array.from({ length: 3 }, (_, index) => index);
-const css$8 = `
-.nsaa-loader-linear-dots {
-  display: flex;
-  align-items: center;
-  gap: calc(${SIZE} * 0.1875);
-  width: auto;
-}
-
-.nsaa-loader-linear-dots-dot {
-  width: calc(${SIZE} * 0.1875);
-  height: calc(${SIZE} * 0.1875);
-  background: currentColor;
-  border-radius: 9999px;
-  ${animation("linear-dots", "nsaa-loader-linear-dots-fade", "linear")}
-  animation-delay: ${stagger("linear-dots", DOTS.length)};
-}
-
-@keyframes nsaa-loader-linear-dots-fade {
-  0% {
-    opacity: 1;
-  }
-  66.67% {
-    opacity: 0.5;
-  }
-  100% {
-    opacity: 1;
-  }
-}
-
-${reducedMotion(`
-  .nsaa-loader-linear-dots-dot {
-    opacity: 0.75;
-  }
-`)}
-`;
-function LinearDots(props) {
-	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(SpinnerStyle, {
-		name: "linear-dots",
-		children: css$8
-	}), /* @__PURE__ */ jsx("div", {
-		...spinnerRoot("linear-dots", props),
-		children: DOTS.map((dot) => /* @__PURE__ */ jsx("div", {
-			className: "nsaa-loader-linear-dots-dot",
-			style: step(dot)
-		}, dot))
-	})] });
-}
-// src/loaders/loading.tsx
-const BLOCK = "M0 0h1v1H0zM2 0h1v1H2zM0 2h1v1H0zM2 2h1v1H2z";
-const SEGMENTS = [
-	{
-		x: 12,
-		y: 6
-	},
-	{
-		x: 10,
-		y: 10
-	},
-	{
-		x: 6,
-		y: 12
-	},
-	{
-		x: 2,
-		y: 10
-	},
-	{
-		x: 0,
-		y: 6
-	},
-	{
-		x: 2,
-		y: 2
-	},
-	{
-		x: 6,
-		y: 0
-	},
-	{
-		x: 10,
-		y: 2
-	}
-];
-const css$7 = `
-${fadeCss("loading", "segment", SEGMENTS.length, {
-	dim: .2,
-	rest: .6
-})}
-`;
-function Loading(props) {
-	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(SpinnerStyle, {
-		name: "loading",
-		children: css$7
-	}), /* @__PURE__ */ jsx("svg", {
-		...spinnerRoot("loading", props),
-		fill: "currentColor",
-		role: "presentation",
-		viewBox: "0 0 15 15",
-		children: SEGMENTS.map(({ x, y }, segment) => /* @__PURE__ */ jsx("path", {
-			className: "nsaa-loader-loading-segment",
-			d: BLOCK,
-			style: step(segment),
-			transform: `translate(${x} ${y})`
-		}, `${x}-${y}`))
-	})] });
-}
-// src/loaders/morph.tsx
-const css$6 = `
-.nsaa-loader-morph-shape {
-  width: 64%;
-  height: 64%;
-  margin: 18%;
-  background: currentColor;
-  border-radius: calc(${SIZE} * 0.08);
-  ${animation("morph", "nsaa-loader-morph-round", "ease-in-out")}
-}
-
-@keyframes nsaa-loader-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);
-  }
-}
-`;
-function Morph(props) {
-	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(SpinnerStyle, {
-		name: "morph",
-		children: css$6
-	}), /* @__PURE__ */ jsx("div", {
-		...spinnerRoot("morph", props),
-		children: /* @__PURE__ */ jsx("div", { className: "nsaa-loader-morph-shape" })
-	})] });
-}
-// src/loaders/radar.tsx
-const css$5 = `
-${rotationCss("radar")}
-`;
-function Radar({ easing, ...rest }) {
-	const beamGradient = useId();
-	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(SpinnerStyle, {
-		name: "radar",
-		children: css$5
-	}), /* @__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"
-			})
-		]
-	})] });
-}
-// src/loaders/ripple.tsx
-const DEFAULT_RIPPLE_DIRECTION = "out";
-const RINGS = Array.from({ length: 3 }, (_, index) => index);
-const css$4 = `
-.nsaa-loader-ripple {
-  position: relative;
-}
-
-.nsaa-loader-ripple-ring {
-  position: absolute;
-  inset: 0;
-  box-sizing: border-box;
-  border: calc(${SIZE} * 0.08) solid currentColor;
-  border-radius: 9999px;
-  ${animation("ripple", "nsaa-loader-ripple-spread", "ease-out")}
-  animation-delay: ${stagger("ripple", RINGS.length)};
-}
-
-.nsaa-loader-ripple-ring-in {
-  animation-direction: reverse;
-}
-
-@keyframes nsaa-loader-ripple-spread {
-  from {
-    opacity: 1;
-    transform: scale(0);
-  }
-  to {
-    opacity: 0;
-    transform: scale(1);
-  }
-}
-
-${reducedMotion(`
-  .nsaa-loader-ripple-ring {
-    opacity: 0.4;
-    transform: scale(calc((var(${STEP_VAR}) + 1) / ${RINGS.length}));
-  }
-`)}
-`;
-function Ripple({ direction = "out", ...rest }) {
-	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(SpinnerStyle, {
-		name: "ripple",
-		children: css$4
-	}), /* @__PURE__ */ jsx("div", {
-		...spinnerRoot("ripple", rest),
-		children: RINGS.map((index) => /* @__PURE__ */ jsx("div", {
-			className: `nsaa-loader-ripple-ring nsaa-loader-ripple-ring-${direction}`,
-			style: step(index)
-		}, index))
-	})] });
-}
-// src/loaders/slide.tsx
-const DOT = 34;
-const MARGIN = 6;
-const FAR = `${(54 / DOT * 100).toFixed(1)}%`;
-const RESTS = [
-	`translate(${FAR}, 0)`,
-	"translate(0, 0)",
-	`translate(0, ${FAR})`
-];
-const css$3 = `
-.nsaa-loader-slide {
-  position: relative;
-}
-
-.nsaa-loader-slide-dot {
-  position: absolute;
-  top: ${MARGIN}%;
-  left: ${MARGIN}%;
-  width: ${DOT}%;
-  height: ${DOT}%;
-  background: currentColor;
-  border-radius: 50%;
-  ${animation("slide", "nsaa-loader-slide-walk", "ease-in-out")}
-  animation-delay: ${stagger("slide", RESTS.length)};
-}
-
-@keyframes nsaa-loader-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);
-  }
-}
-
-${reducedMotion(`
-  .nsaa-loader-slide-dot {
-    transform: var(--nsaa-loader-slide-rest);
-  }
-`)}
-`;
-function Slide(props) {
-	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(SpinnerStyle, {
-		name: "slide",
-		children: css$3
-	}), /* @__PURE__ */ jsx("div", {
-		...spinnerRoot("slide", props),
-		children: RESTS.map((rest, index) => /* @__PURE__ */ jsx("div", {
-			className: "nsaa-loader-slide-dot",
-			style: cssVars({
-				...step(index),
-				"--nsaa-loader-slide-rest": rest
-			})
-		}, rest))
-	})] });
-}
-// src/loaders/snake.tsx
-const css$2 = `
-${rotationCss("snake")}
-
-.nsaa-loader-snake-dash {
-  ${animation("snake", "nsaa-loader-snake-stretch", "ease-in-out")}
-}
-
-@keyframes nsaa-loader-snake-stretch {
-  0% {
-    stroke-dasharray: 1 100;
-    stroke-dashoffset: 0;
-  }
-  50% {
-    stroke-dasharray: 45 100;
-    stroke-dashoffset: -17;
-  }
-  100% {
-    stroke-dasharray: 45 100;
-    stroke-dashoffset: -62;
-  }
-}
-
-${reducedMotion(`
-  .nsaa-loader-snake-dash {
-    stroke-dasharray: 18 100;
-  }
-`)}
-`;
-function Snake({ cap, easing, ...rest }) {
-	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(SpinnerStyle, {
-		name: "snake",
-		children: css$2
-	}), /* @__PURE__ */ jsx("svg", {
-		...spinnerRoot("snake", rest),
-		fill: "none",
-		role: "presentation",
-		viewBox: "0 0 24 24",
-		children: /* @__PURE__ */ jsx("g", {
-			className: spinClass("snake", easing),
-			children: /* @__PURE__ */ jsx("circle", {
-				className: "nsaa-loader-snake-dash",
-				cx: "12",
-				cy: "12",
-				r: "10",
-				stroke: "currentColor",
-				strokeLinecap: linecap(cap),
-				strokeWidth: "2.5"
-			})
-		})
-	})] });
-}
-// src/loaders/swirl.tsx
-const RING = [
-	0,
-	1,
-	2,
-	7,
-	null,
-	3,
-	6,
-	5,
-	4
-];
-const PLACES = RING.filter((place) => place !== null).length;
-const css$1 = `
-.nsaa-loader-swirl {
-  display: grid;
-  grid-template-columns: repeat(3, 1fr);
-  grid-template-rows: repeat(3, 1fr);
-  gap: calc(${SIZE} * 0.15625);
-  box-sizing: border-box;
-  padding: calc(${SIZE} * 0.0625);
-}
-
-.nsaa-loader-swirl-cell {
-  background: currentColor;
-  border-radius: calc(${SIZE} * 0.0625);
-}
-${fadeCss("swirl", "cell", PLACES, {
-	dim: .2,
-	rest: .6
-})}
-`;
-function Swirl(props) {
-	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(SpinnerStyle, {
-		name: "swirl",
-		children: css$1
-	}), /* @__PURE__ */ jsx("div", {
-		...spinnerRoot("swirl", props),
-		children: RING.map((place, index) => place === null ? /* @__PURE__ */ jsx("div", {}, index) : /* @__PURE__ */ jsx("div", {
-			className: "nsaa-loader-swirl-cell",
-			style: step(place)
-		}, index))
-	})] });
-}
-// src/loaders/trace.tsx
-const VIEW = 20;
-const SIDE = 17.5;
-const RADIUS = 4;
-const PERIMETER = 38 + 2 * Math.PI * RADIUS;
-const DASH = 16;
-const RECT = {
-	height: SIDE,
-	rx: RADIUS,
-	width: SIDE,
-	x: 2.5 / 2,
-	y: 2.5 / 2
-};
-const css = `
-${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)
-		})]
-	})] });
-}
-// src/loaders/spinners.ts
-const SPINNERS = {
-	arc: Arc,
-	atom: Atom,
-	blocks: Blocks,
-	"bouncing-dots": BouncingDots,
-	cascade: Cascade,
-	"circular-dots": CircularDots,
-	classic: Classic,
-	"classic-v2": ClassicV2,
-	clock: Clock,
-	comet: Comet,
-	compass: Compass,
-	dual: Dual,
-	eclipse: Eclipse,
-	flip: Flip,
-	gather: Gather,
-	leap: Leap,
-	"linear-dots": LinearDots,
-	loading: Loading,
-	morph: Morph,
-	orbit: Orbit,
-	pulse: Pulse,
-	radar: Radar,
-	ring: Ring,
-	ripple: Ripple,
-	slide: Slide,
-	snake: Snake,
-	swirl: Swirl,
-	trace: Trace,
-	wave: Wave
-};
-export { Arc, Atom, Blocks, BouncingDots, Cascade, CircularDots, Classic, ClassicV2, Clock, Comet, Compass, DEFAULT_BLOCKS_SWEEP, DEFAULT_CAP, DEFAULT_EASING, DEFAULT_RIPPLE_DIRECTION, DEFAULT_WAVE_ORIGIN, DURATION_VAR, Dual, Eclipse, Flip, Gather, SPINNERS as LOADERS, SPINNERS, Leap, LinearDots, Loading, Morph, Orbit, PLAY_STATE_VAR, Pulse, Radar, Ring, Ripple, SPINNER_MOTION, Slide, Snake, Swirl, Trace, Wave, registerLoader, registerLoaders };
+import { DEFAULT_CAP } from "./loaders/cap.js";
+import { DURATION_VAR, PLAY_STATE_VAR, SPINNER_MOTION } from "./loaders/motion.js";
+import { DEFAULT_EASING } from "./loaders/easing.js";
+import { Arc } from "./loaders/arc.js";
+import { BouncingDots } from "./loaders/bouncing-dots.js";
+import { CircularDots } from "./loaders/circular-dots.js";
+import { Classic } from "./loaders/classic.js";
+import { Orbit } from "./loaders/orbit.js";
+import { Pulse } from "./loaders/pulse.js";
+import { Ring } from "./loaders/ring.js";
+import { DEFAULT_WAVE_ORIGIN, Wave } from "./loaders/wave.js";
+import { registerLoader, registerLoaders } from "./spinner/registry.js";
+import { Atom } from "./loaders/atom.js";
+import { Blocks, DEFAULT_BLOCKS_SWEEP } from "./loaders/blocks.js";
+import { Cascade } from "./loaders/cascade.js";
+import { ClassicV2 } from "./loaders/classic-v2.js";
+import { Clock } from "./loaders/clock.js";
+import { Comet } from "./loaders/comet.js";
+import { Compass } from "./loaders/compass.js";
+import { Dual } from "./loaders/dual.js";
+import { Eclipse } from "./loaders/eclipse.js";
+import { Flip } from "./loaders/flip.js";
+import { Gather } from "./loaders/gather.js";
+import { Leap } from "./loaders/leap.js";
+import { LinearDots } from "./loaders/linear-dots.js";
+import { Loading } from "./loaders/loading.js";
+import { Morph } from "./loaders/morph.js";
+import { Radar } from "./loaders/radar.js";
+import { DEFAULT_RIPPLE_DIRECTION, Ripple } from "./loaders/ripple.js";
+import { Slide } from "./loaders/slide.js";
+import { Snake } from "./loaders/snake.js";
+import { Swirl } from "./loaders/swirl.js";
+import { Trace } from "./loaders/trace.js";
+import { SPINNERS } from "./loaders/spinners.js";
+export { Arc, Atom, Blocks, BouncingDots, Cascade, CircularDots, Classic, ClassicV2, Clock, Comet, Compass, DEFAULT_BLOCKS_SWEEP, DEFAULT_CAP, DEFAULT_EASING, DEFAULT_RIPPLE_DIRECTION, DEFAULT_WAVE_ORIGIN, DURATION_VAR, Dual, Eclipse, Flip, Gather, SPINNERS as LOADERS, Leap, LinearDots, Loading, Morph, Orbit, PLAY_STATE_VAR, Pulse, Radar, Ring, Ripple, SPINNERS, SPINNER_MOTION, Slide, Snake, Swirl, Trace, Wave, registerLoader, registerLoaders };