@dowel-ui/react 0.5.0 → 0.8.0

package/dist/components/bar-loader/bar-loader.js

@@ -0,0 +1,469 @@
+import { cn } from "../../lib/utils.js";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { cva } from "class-variance-authority";
+//#region src/components/bar-loader/bar-loader.tsx
+const PREFIX = "dowel-bar-loader";
+/** A delay or duration in seconds, scaled for reduced motion. */
+function scaled(seconds) {
+	return `calc(${String(seconds)}s * var(--motion-scale-indicator, 1))`;
+}
+const STYLES = `
+.${PREFIX}{direction:ltr;position:relative;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;color:inherit}
+.${PREFIX} [data-part]{display:block;flex-shrink:0;border-radius:9999px;background:currentColor;animation-iteration-count:infinite;animation-timing-function:ease-in-out;animation-fill-mode:backwards;animation-duration:var(--dur);animation-delay:var(--delay,0s)}
+.${PREFIX} [data-part=static]{animation:none}
+.${PREFIX} [data-part=group]{background:transparent;border-radius:0}
+.${PREFIX} [data-part=track]{position:relative;overflow:hidden;background:color-mix(in oklab,currentColor 15%,transparent);animation:none}
+.${PREFIX} [data-part=frame]{position:relative;overflow:hidden;box-sizing:border-box;background:transparent;border:.25em solid currentColor;animation:none}
+@keyframes ${PREFIX}-grow{0%,100%{height:var(--from)}50%{height:var(--to)}}
+@keyframes ${PREFIX}-scale-y{0%,100%{transform:scaleY(var(--from))}50%{transform:scaleY(var(--to))}}
+@keyframes ${PREFIX}-scale-x{0%,100%{transform:scaleX(var(--from))}50%{transform:scaleX(var(--to))}}
+@keyframes ${PREFIX}-turn{0%,100%{transform:scaleY(.5) rotate(var(--r))}50%{transform:scaleY(1.5) rotate(var(--r))}}
+@keyframes ${PREFIX}-sway{0%,100%{transform:scaleY(.8) rotate(-15deg)}50%{transform:scaleY(1) rotate(15deg)}}
+@keyframes ${PREFIX}-slide{0%,100%{transform:translate(0,0)}50%{transform:translate(var(--x,0),var(--y,0))}}
+@keyframes ${PREFIX}-stack{0%,100%{opacity:.2;width:50%}50%{opacity:1;width:100%}}
+@keyframes ${PREFIX}-gap{0%,100%{gap:1em}50%{gap:.5em}}
+@keyframes ${PREFIX}-conveyor{from{transform:translateX(0)}to{transform:translateX(-4em)}}
+@keyframes ${PREFIX}-indeterminate{from{transform:translateX(-100%)}to{transform:translateX(200%)}}
+`;
+const PHYSICS_BARS = 15;
+const PHYSICS_FRAMES = 81;
+const PHYSICS_BOUNCES = 4;
+/** Ball height (px above the floor) and squash for a bounce phase 0..1. */
+function bounce(phase) {
+	const hop = 4 * phase * (1 - phase);
+	const squash = Math.max(0, 1 - hop * 2);
+	return {
+		hop,
+		squash,
+		lift: 64 - squash * 20 + hop * 60
+	};
+}
+function round(value) {
+	return String(Math.round(value * 1e3) / 1e3);
+}
+function physicsStyles() {
+	const bars = Array.from({ length: PHYSICS_BARS }, () => []);
+	for (let frame = 0; frame < PHYSICS_FRAMES; frame++) {
+		const t = frame / 80;
+		const across = t < .5 ? t / .5 : (1 - t) / .5;
+		const ball = across * 14;
+		const { squash } = bounce(across === 0 || across === 1 ? 0 : across * PHYSICS_BOUNCES % 1);
+		for (let index = 0; index < PHYSICS_BARS; index++) {
+			const distance = Math.abs(index - ball);
+			const swell = distance < 3 ? Math.cos(distance / 3 * (Math.PI / 2)) : 0;
+			const dent = distance < 1.5 ? Math.cos(distance / 1.5 * (Math.PI / 2)) * squash * 20 : 0;
+			const height = Math.max(4, 16 + swell * 48 - dent) / 8;
+			bars[index]?.push({
+				pct: `${round(t * 100)}%`,
+				rule: `{height:${round(height)}em;opacity:${round(.15 + swell * .85)}}`
+			});
+		}
+	}
+	const barFrames = bars.map((stops, index) => {
+		const kept = stops.filter((stop, at) => at === 0 || at === stops.length - 1 || stop.rule !== stops[at - 1]?.rule || stop.rule !== stops[at + 1]?.rule);
+		return `@keyframes ${PREFIX}-physics-${String(index)}{${kept.map((stop) => stop.pct + stop.rule).join("")}}`;
+	});
+	const hop = Array.from({ length: 21 }, (_, step) => {
+		const { lift, squash } = bounce(step / 20);
+		return `${String(step * 5)}%{transform:translateY(-${round(lift / 8)}em) scale(${round(1 + squash * .25)},${round(1 - squash * .3)})}`;
+	});
+	return [
+		...barFrames,
+		`@keyframes ${PREFIX}-physics-x{0%,100%{transform:translateX(0)}50%{transform:translateX(${String(35)}em)}}`,
+		`@keyframes ${PREFIX}-physics-hop{${hop.join("")}}`
+	].join("\n");
+}
+const PHYSICS_STYLES = physicsStyles();
+/** A moving part, with its keyframe, duration and delay. */
+function part(key, animation, duration, delay, style, name = "bar") {
+	return /* @__PURE__ */ jsx("span", {
+		"data-part": name,
+		style: {
+			...style,
+			animationName: `${PREFIX}-${animation}`,
+			["--dur"]: scaled(duration),
+			["--delay"]: scaled(delay)
+		}
+	}, key);
+}
+/** Bars whose height breathes between `from` and `to`. */
+function grow(delays, width, from, to, duration, extra = {}) {
+	return delays.map((delay, index) => part(index, "grow", duration, delay, {
+		width,
+		["--from"]: from,
+		["--to"]: to,
+		...extra
+	}));
+}
+/** Full-width lines that stretch from their start edge. */
+function lines(count, height, from, duration, stagger) {
+	return Array.from({ length: count }, (_, index) => part(index, "scale-x", duration, index * stagger, {
+		width: "100%",
+		height,
+		transformOrigin: "left",
+		["--from"]: String(from),
+		["--to"]: "1"
+	}));
+}
+const stagger = (count, step) => Array.from({ length: count }, (_, index) => Math.round(index * step * 1e3) / 1e3);
+const VARIANTS = {
+	cascade: {
+		root: {
+			height: "4em",
+			gap: "0.5em"
+		},
+		render: () => grow(stagger(5, .1), "0.75em", "1em", "3em", 1)
+	},
+	bouncing: {
+		root: {
+			height: "4em",
+			gap: "0.75em"
+		},
+		render: () => stagger(3, .2).map((delay, index) => part(index, "scale-y", 1, delay, {
+			width: "0.75em",
+			height: "4em",
+			["--from"]: "0.3",
+			["--to"]: "1"
+		}))
+	},
+	symmetric: {
+		root: {
+			height: "5em",
+			gap: "0.75em"
+		},
+		render: () => grow([
+			0,
+			1,
+			2,
+			3,
+			4,
+			3,
+			2,
+			1,
+			0
+		].map((step) => step * .1), "0.75em", "1em", "3em", 1.2)
+	},
+	sweep: {
+		root: {},
+		render: () => /* @__PURE__ */ jsx("span", {
+			"data-part": "frame",
+			style: {
+				width: "6em",
+				height: "3em",
+				padding: "0.5em",
+				borderRadius: "9999px"
+			},
+			children: part("thumb", "slide", 1.5, 0, {
+				position: "absolute",
+				top: 0,
+				bottom: 0,
+				left: "0.5em",
+				margin: "auto 0",
+				width: "2em",
+				height: "2em",
+				["--x"]: "3em"
+			})
+		})
+	},
+	circular: {
+		root: {
+			width: "5em",
+			height: "5em"
+		},
+		render: () => stagger(8, .15).map((delay, index) => part(index, "turn", 1.2, delay, {
+			position: "absolute",
+			top: 0,
+			left: "2.25em",
+			width: "0.5em",
+			height: "1.5em",
+			transformOrigin: "0.25em 2.5em",
+			["--r"]: `${String(index * 45)}deg`
+		}))
+	},
+	accordion: {
+		root: {
+			flexDirection: "column",
+			width: "5em",
+			height: "5em",
+			gap: "0.75em"
+		},
+		render: () => stagger(4, .15).map((delay, index) => part(index, "scale-x", 1.5, delay, {
+			width: "100%",
+			height: "0.5em",
+			transformOrigin: "left",
+			["--from"]: "1",
+			["--to"]: "0.2"
+		}))
+	},
+	"square-accordion": {
+		root: {
+			width: "6em",
+			height: "6em",
+			gap: "0.5em"
+		},
+		render: () => grow(stagger(3, .2), "1.5em", "1.5em", "4em", 1.5, { borderRadius: "0.25em" })
+	},
+	conveyor: {
+		root: {},
+		render: () => /* @__PURE__ */ jsx("span", {
+			"data-part": "track",
+			style: {
+				width: "8em",
+				height: "1.5em",
+				borderRadius: "9999px"
+			},
+			children: /* @__PURE__ */ jsx("span", {
+				"data-part": "group",
+				style: {
+					position: "absolute",
+					top: 0,
+					left: 0,
+					height: "100%",
+					display: "flex",
+					alignItems: "center",
+					gap: "1em",
+					animationName: `${PREFIX}-conveyor`,
+					animationTimingFunction: "linear",
+					["--dur"]: scaled(1)
+				},
+				children: Array.from({ length: 8 }, (_, index) => /* @__PURE__ */ jsx("span", {
+					"data-part": "static",
+					style: {
+						width: "0.75em",
+						height: "0.75em"
+					}
+				}, index))
+			})
+		})
+	},
+	lines: {
+		root: {
+			flexDirection: "column",
+			width: "4em",
+			gap: "0.75em"
+		},
+		render: () => lines(3, "0.75em", .3, 1, .2)
+	},
+	"voice-wave": {
+		root: {
+			height: "4em",
+			gap: "0.5em"
+		},
+		render: () => grow(stagger(5, .1), "0.5em", "0.5em", "3em", 1.2)
+	},
+	equalizer: {
+		root: {
+			height: "4em",
+			alignItems: "flex-end",
+			gap: "0.5em"
+		},
+		render: () => grow([
+			.31,
+			.07,
+			.42,
+			.18
+		], "0.75em", "20%", "100%", .8, {
+			borderRadius: "0.25em 0.25em 0 0",
+			animationTimingFunction: "cubic-bezier(0.85, 0, 0.15, 1)"
+		})
+	},
+	spring: {
+		root: {
+			flexDirection: "column",
+			width: "5em",
+			gap: "1em"
+		},
+		render: () => lines(3, "0.75em", .2, 1.4, .15)
+	},
+	fluid: {
+		root: { gap: "0.5em" },
+		render: () => stagger(4, .1).map((delay, index) => part(index, "sway", 1.5, delay, {
+			width: "0.75em",
+			height: "4em",
+			transformOrigin: "bottom"
+		}))
+	},
+	morphing: {
+		root: { height: "4em" },
+		render: () => /* @__PURE__ */ jsx("span", {
+			"data-part": "group",
+			style: {
+				display: "flex",
+				alignItems: "center",
+				animationName: `${PREFIX}-gap`,
+				["--dur"]: scaled(2)
+			},
+			children: grow([
+				0,
+				0,
+				0
+			], "1em", "4em", "2em", 2, { borderRadius: "0.25em" })
+		})
+	},
+	stacked: {
+		root: {
+			flexDirection: "column",
+			width: "4em",
+			gap: "0.5em"
+		},
+		render: () => stagger(3, .2).map((delay, index) => part(index, "stack", 1.5, delay, { height: "0.5em" }))
+	},
+	waveform: {
+		root: {
+			height: "4em",
+			gap: "0.25em"
+		},
+		render: () => grow(stagger(8, 1).map((index) => Math.round(Math.sin(index) * 500) / 1e3), "0.5em", "0.5em", "3em", 1)
+	},
+	elastic: {
+		root: {
+			height: "5em",
+			gap: "1em"
+		},
+		render: () => grow(stagger(3, .15), "1em", "1em", "4.5em", 1.1)
+	},
+	sliding: {
+		root: {
+			width: "4em",
+			height: "4em"
+		},
+		render: () => [part("top", "slide", 1.5, 0, {
+			position: "absolute",
+			top: 0,
+			left: 0,
+			width: "4em",
+			height: "0.75em",
+			["--y"]: "3em"
+		}), part("bottom", "slide", 1.5, 0, {
+			position: "absolute",
+			bottom: 0,
+			left: 0,
+			width: "4em",
+			height: "0.75em",
+			opacity: .5,
+			["--y"]: "-3em"
+		})]
+	},
+	"sound-wave": {
+		root: {
+			height: "4em",
+			gap: "0.5em"
+		},
+		render: () => [
+			1,
+			2,
+			3,
+			2,
+			1
+		].map((peak, index) => part(index, "grow", 1, index * .1, {
+			width: "0.5em",
+			["--from"]: "0.5em",
+			["--to"]: `${String(peak)}em`
+		}))
+	},
+	"wave-physics": {
+		root: {
+			height: "6.8em",
+			alignItems: "flex-end"
+		},
+		render: () => /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("style", {
+			href: `${PREFIX}-physics`,
+			precedence: "dowel",
+			children: PHYSICS_STYLES
+		}), /* @__PURE__ */ jsxs("span", {
+			"data-part": "group",
+			style: {
+				position: "relative",
+				display: "flex",
+				alignItems: "flex-end",
+				gap: "1em",
+				width: "36.5em",
+				fontSize: "0.4em"
+			},
+			children: [Array.from({ length: PHYSICS_BARS }, (_, index) => part(index, `physics-${String(index)}`, 4, 0, {
+				width: "1.5em",
+				animationTimingFunction: "linear"
+			})), /* @__PURE__ */ jsx("span", {
+				"data-part": "group",
+				style: {
+					position: "absolute",
+					bottom: 0,
+					left: 0,
+					zIndex: 1,
+					animationName: `${PREFIX}-physics-x`,
+					animationTimingFunction: "linear",
+					["--dur"]: scaled(4)
+				},
+				children: part("ball", "physics-hop", 4 / 8, 0, {
+					width: "1.5em",
+					height: "1.5em",
+					transformOrigin: "bottom center",
+					animationTimingFunction: "linear"
+				}, "ball")
+			})]
+		})] })
+	},
+	indeterminate: {
+		root: {},
+		render: () => /* @__PURE__ */ jsx("span", {
+			"data-part": "track",
+			style: {
+				width: "12em",
+				height: "0.5em",
+				borderRadius: "9999px"
+			},
+			children: part("sweep", "indeterminate", 1.68, 0, {
+				position: "absolute",
+				top: 0,
+				bottom: 0,
+				left: 0,
+				width: "33.333%",
+				animationTimingFunction: "cubic-bezier(0.645, 0.045, 0.355, 1)"
+			})
+		})
+	}
+};
+/** Every variant, in catalogue order. Stories and tests iterate this. */
+const barLoaderVariantNames = Object.keys(VARIANTS);
+const barLoaderVariants = cva("", {
+	variants: { size: {
+		sm: "text-[0.25rem]",
+		md: "text-[0.375rem]",
+		lg: "text-[0.5rem]",
+		xl: "text-[0.625rem]"
+	} },
+	defaultVariants: { size: "md" }
+});
+/** An indeterminate loading indicator made of bars, in 21 motions. */
+function BarLoader({ className, size, variant = "cascade", label, style, ...props }) {
+	const spec = VARIANTS[variant];
+	return /* @__PURE__ */ jsxs(Fragment, { children: [
+		/* @__PURE__ */ jsx("style", {
+			href: PREFIX,
+			precedence: "dowel",
+			children: STYLES
+		}),
+		/* @__PURE__ */ jsx("span", {
+			"aria-hidden": "true",
+			"data-slot": "bar-loader",
+			"data-variant": variant,
+			"data-motion": "indicator",
+			className: cn(PREFIX, barLoaderVariants({ size }), className),
+			style: {
+				...spec.root,
+				...style
+			},
+			...props,
+			children: spec.render()
+		}),
+		label ? /* @__PURE__ */ jsx("span", {
+			role: "status",
+			className: "sr-only",
+			children: label
+		}) : null
+	] });
+}
+//#endregion
+export { BarLoader, barLoaderVariantNames, barLoaderVariants };
+
+//# sourceMappingURL=bar-loader.js.map

package/dist/components/bar-loader/bar-loader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"bar-loader.js","names":[],"sources":["../../../src/components/bar-loader/bar-loader.tsx"],"sourcesContent":["// Ported from amicro \"Bars & Waves\" and \"Wave Physics\" (MIT, © 2026 Syed Subhan Uddin) and\n// the SmoothUI AI Loader \"bar\" variant (MIT, © 2024 Eduardo Calvo). See THIRD_PARTY_NOTICES.md.\n//\n// Renamed from the source: \"Siri Wave\" → voice-wave, \"Apple EQ\" → equalizer,\n// \"Sound Wave\" (apple-sound-wave) → sound-wave, SmoothUI \"bar\" → indeterminate.\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport type { ComponentPropsWithRef, CSSProperties, ReactNode } from \"react\";\n\nimport { cn } from \"@/lib/utils\";\n\n/*\n * Same shape as the dots loader (ADR 0014): geometry in `em` so `size` scales\n * the whole loader, colour from `currentColor`, keyframes hoisted through\n * React's <style>, every duration and delay scaled by --motion-scale-indicator,\n * and `direction: ltr` so a sweep never mirrors into running backwards.\n */\n\nconst PREFIX = \"dowel-bar-loader\";\n\n/** A delay or duration in seconds, scaled for reduced motion. */\nfunction scaled(seconds: number): string {\n  return `calc(${String(seconds)}s * var(--motion-scale-indicator, 1))`;\n}\n\nconst STYLES = `\n.${PREFIX}{direction:ltr;position:relative;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;color:inherit}\n.${PREFIX} [data-part]{display:block;flex-shrink:0;border-radius:9999px;background:currentColor;animation-iteration-count:infinite;animation-timing-function:ease-in-out;animation-fill-mode:backwards;animation-duration:var(--dur);animation-delay:var(--delay,0s)}\n.${PREFIX} [data-part=static]{animation:none}\n.${PREFIX} [data-part=group]{background:transparent;border-radius:0}\n.${PREFIX} [data-part=track]{position:relative;overflow:hidden;background:color-mix(in oklab,currentColor 15%,transparent);animation:none}\n.${PREFIX} [data-part=frame]{position:relative;overflow:hidden;box-sizing:border-box;background:transparent;border:.25em solid currentColor;animation:none}\n@keyframes ${PREFIX}-grow{0%,100%{height:var(--from)}50%{height:var(--to)}}\n@keyframes ${PREFIX}-scale-y{0%,100%{transform:scaleY(var(--from))}50%{transform:scaleY(var(--to))}}\n@keyframes ${PREFIX}-scale-x{0%,100%{transform:scaleX(var(--from))}50%{transform:scaleX(var(--to))}}\n@keyframes ${PREFIX}-turn{0%,100%{transform:scaleY(.5) rotate(var(--r))}50%{transform:scaleY(1.5) rotate(var(--r))}}\n@keyframes ${PREFIX}-sway{0%,100%{transform:scaleY(.8) rotate(-15deg)}50%{transform:scaleY(1) rotate(15deg)}}\n@keyframes ${PREFIX}-slide{0%,100%{transform:translate(0,0)}50%{transform:translate(var(--x,0),var(--y,0))}}\n@keyframes ${PREFIX}-stack{0%,100%{opacity:.2;width:50%}50%{opacity:1;width:100%}}\n@keyframes ${PREFIX}-gap{0%,100%{gap:1em}50%{gap:.5em}}\n@keyframes ${PREFIX}-conveyor{from{transform:translateX(0)}to{transform:translateX(-4em)}}\n@keyframes ${PREFIX}-indeterminate{from{transform:translateX(-100%)}to{transform:translateX(200%)}}\n`;\n\n/*\n * Wave Physics. The source precomputes 201 framer-motion keyframes from a\n * closed-form formula (no simulation): a ball rides back and forth over 15 bars\n * in 4s, bouncing four times each way, and the bars swell under it and dent\n * where it lands. The same formula generates CSS keyframes here — one per bar,\n * plus the ball's travel and its 0.5s bounce — and they ship in their own\n * stylesheet so the other variants don't carry them.\n */\nconst PHYSICS_BARS = 15;\nconst PHYSICS_FRAMES = 81;\nconst PHYSICS_BOUNCES = 4;\n\n/** Ball height (px above the floor) and squash for a bounce phase 0..1. */\nfunction bounce(phase: number) {\n  const hop = 4 * phase * (1 - phase);\n  const squash = Math.max(0, 1 - hop * 2);\n  return { hop, squash, lift: 16 + 48 - squash * 20 + hop * 60 };\n}\n\nfunction round(value: number): string {\n  return String(Math.round(value * 1000) / 1000);\n}\n\nfunction physicsStyles(): string {\n  const bars: { pct: string; rule: string }[][] = Array.from(\n    { length: PHYSICS_BARS },\n    () => [],\n  );\n  for (let frame = 0; frame < PHYSICS_FRAMES; frame++) {\n    const t = frame / (PHYSICS_FRAMES - 1);\n    const across = t < 0.5 ? t / 0.5 : (1 - t) / 0.5;\n    const ball = across * (PHYSICS_BARS - 1);\n    const phase = across === 0 || across === 1 ? 0 : (across * PHYSICS_BOUNCES) % 1;\n    const { squash } = bounce(phase);\n    for (let index = 0; index < PHYSICS_BARS; index++) {\n      const distance = Math.abs(index - ball);\n      const swell = distance < 3 ? Math.cos((distance / 3) * (Math.PI / 2)) : 0;\n      const dent =\n        distance < 1.5 ? Math.cos((distance / 1.5) * (Math.PI / 2)) * squash * 20 : 0;\n      const height = Math.max(4, 16 + swell * 48 - dent) / 8;\n      bars[index]?.push({\n        pct: `${round(t * 100)}%`,\n        rule: `{height:${round(height)}em;opacity:${round(0.15 + swell * 0.85)}}`,\n      });\n    }\n  }\n  const barFrames = bars.map((stops, index) => {\n    // Keep only the stops where something changes; the rest interpolate flat.\n    const kept = stops.filter(\n      (stop, at) =>\n        at === 0 ||\n        at === stops.length - 1 ||\n        stop.rule !== stops[at - 1]?.rule ||\n        stop.rule !== stops[at + 1]?.rule,\n    );\n    return `@keyframes ${PREFIX}-physics-${String(index)}{${kept.map((stop) => stop.pct + stop.rule).join(\"\")}}`;\n  });\n  const hop = Array.from({ length: 21 }, (_, step) => {\n    const { lift, squash } = bounce(step / 20);\n    return `${String(step * 5)}%{transform:translateY(-${round(lift / 8)}em) scale(${round(1 + squash * 0.25)},${round(1 - squash * 0.3)})}`;\n  });\n  return [\n    ...barFrames,\n    `@keyframes ${PREFIX}-physics-x{0%,100%{transform:translateX(0)}50%{transform:translateX(${String((PHYSICS_BARS - 1) * 2.5)}em)}}`,\n    `@keyframes ${PREFIX}-physics-hop{${hop.join(\"\")}}`,\n  ].join(\"\\n\");\n}\n\nconst PHYSICS_STYLES = physicsStyles();\n\ntype Vars = CSSProperties & Record<`--${string}`, string>;\n\ntype Variant = {\n  /**\n   * Layout of the root, inline rather than as utilities. The hoisted stylesheet\n   * is unlayered, so it outranks Tailwind's layered utilities whatever their\n   * specificity; inline styles are the one thing that reliably outranks it.\n   */\n  root: CSSProperties;\n  render: () => ReactNode;\n};\n\n/** A moving part, with its keyframe, duration and delay. */\nfunction part(\n  key: number | string,\n  animation: string,\n  duration: number,\n  delay: number,\n  style: Vars,\n  name = \"bar\",\n): ReactNode {\n  return (\n    <span\n      key={key}\n      data-part={name}\n      style={{\n        ...style,\n        animationName: `${PREFIX}-${animation}`,\n        [\"--dur\" as string]: scaled(duration),\n        [\"--delay\" as string]: scaled(delay),\n      }}\n    />\n  );\n}\n\n/** Bars whose height breathes between `from` and `to`. */\nfunction grow(\n  delays: readonly number[],\n  width: string,\n  from: string,\n  to: string,\n  duration: number,\n  extra: Vars = {},\n): ReactNode {\n  return delays.map((delay, index) =>\n    part(index, \"grow\", duration, delay, { width, [\"--from\"]: from, [\"--to\"]: to, ...extra }),\n  );\n}\n\n/** Full-width lines that stretch from their start edge. */\nfunction lines(\n  count: number,\n  height: string,\n  from: number,\n  duration: number,\n  stagger: number,\n): ReactNode {\n  return Array.from({ length: count }, (_, index) =>\n    part(index, \"scale-x\", duration, index * stagger, {\n      width: \"100%\",\n      height,\n      transformOrigin: \"left\",\n      [\"--from\"]: String(from),\n      [\"--to\"]: \"1\",\n    }),\n  );\n}\n\nconst stagger = (count: number, step: number) =>\n  Array.from({ length: count }, (_, index) => Math.round(index * step * 1000) / 1000);\n\nconst VARIANTS = {\n  cascade: {\n    root: { height: \"4em\", gap: \"0.5em\" },\n    render: () => grow(stagger(5, 0.1), \"0.75em\", \"1em\", \"3em\", 1),\n  },\n  bouncing: {\n    root: { height: \"4em\", gap: \"0.75em\" },\n    render: () =>\n      stagger(3, 0.2).map((delay, index) =>\n        part(index, \"scale-y\", 1, delay, {\n          width: \"0.75em\",\n          height: \"4em\",\n          [\"--from\"]: \"0.3\",\n          [\"--to\"]: \"1\",\n        }),\n      ),\n  },\n  symmetric: {\n    root: { height: \"5em\", gap: \"0.75em\" },\n    render: () =>\n      grow(\n        [0, 1, 2, 3, 4, 3, 2, 1, 0].map((step) => step * 0.1),\n        \"0.75em\",\n        \"1em\",\n        \"3em\",\n        1.2,\n      ),\n  },\n  sweep: {\n    root: {},\n    render: () => (\n      <span\n        data-part=\"frame\"\n        style={{ width: \"6em\", height: \"3em\", padding: \"0.5em\", borderRadius: \"9999px\" }}\n      >\n        {part(\"thumb\", \"slide\", 1.5, 0, {\n          position: \"absolute\",\n          top: 0,\n          bottom: 0,\n          left: \"0.5em\",\n          margin: \"auto 0\",\n          width: \"2em\",\n          height: \"2em\",\n          [\"--x\"]: \"3em\",\n        })}\n      </span>\n    ),\n  },\n  circular: {\n    root: { width: \"5em\", height: \"5em\" },\n    render: () =>\n      stagger(8, 0.15).map((delay, index) =>\n        part(index, \"turn\", 1.2, delay, {\n          position: \"absolute\",\n          top: 0,\n          left: \"2.25em\",\n          width: \"0.5em\",\n          height: \"1.5em\",\n          transformOrigin: \"0.25em 2.5em\",\n          [\"--r\"]: `${String(index * 45)}deg`,\n        }),\n      ),\n  },\n  accordion: {\n    root: { flexDirection: \"column\", width: \"5em\", height: \"5em\", gap: \"0.75em\" },\n    render: () =>\n      stagger(4, 0.15).map((delay, index) =>\n        part(index, \"scale-x\", 1.5, delay, {\n          width: \"100%\",\n          height: \"0.5em\",\n          transformOrigin: \"left\",\n          [\"--from\"]: \"1\",\n          [\"--to\"]: \"0.2\",\n        }),\n      ),\n  },\n  \"square-accordion\": {\n    root: { width: \"6em\", height: \"6em\", gap: \"0.5em\" },\n    render: () =>\n      grow(stagger(3, 0.2), \"1.5em\", \"1.5em\", \"4em\", 1.5, { borderRadius: \"0.25em\" }),\n  },\n  conveyor: {\n    root: {},\n    render: () => (\n      <span data-part=\"track\" style={{ width: \"8em\", height: \"1.5em\", borderRadius: \"9999px\" }}>\n        <span\n          data-part=\"group\"\n          style={{\n            position: \"absolute\",\n            top: 0,\n            left: 0,\n            height: \"100%\",\n            display: \"flex\",\n            alignItems: \"center\",\n            gap: \"1em\",\n            animationName: `${PREFIX}-conveyor`,\n            animationTimingFunction: \"linear\",\n            [\"--dur\" as string]: scaled(1),\n          }}\n        >\n          {Array.from({ length: 8 }, (_, index) => (\n            <span\n              key={index}\n              data-part=\"static\"\n              style={{ width: \"0.75em\", height: \"0.75em\" }}\n            />\n          ))}\n        </span>\n      </span>\n    ),\n  },\n  lines: {\n    root: { flexDirection: \"column\", width: \"4em\", gap: \"0.75em\" },\n    render: () => lines(3, \"0.75em\", 0.3, 1, 0.2),\n  },\n  \"voice-wave\": {\n    root: { height: \"4em\", gap: \"0.5em\" },\n    render: () => grow(stagger(5, 0.1), \"0.5em\", \"0.5em\", \"3em\", 1.2),\n  },\n  equalizer: {\n    root: { height: \"4em\", alignItems: \"flex-end\", gap: \"0.5em\" },\n    // The source draws each delay from Math.random() * 0.5 on every render,\n    // which cannot hydrate; these are four fixed draws from the same range.\n    render: () =>\n      grow([0.31, 0.07, 0.42, 0.18], \"0.75em\", \"20%\", \"100%\", 0.8, {\n        borderRadius: \"0.25em 0.25em 0 0\",\n        animationTimingFunction: \"cubic-bezier(0.85, 0, 0.15, 1)\",\n      }),\n  },\n  spring: {\n    root: { flexDirection: \"column\", width: \"5em\", gap: \"1em\" },\n    render: () => lines(3, \"0.75em\", 0.2, 1.4, 0.15),\n  },\n  fluid: {\n    root: { gap: \"0.5em\" },\n    render: () =>\n      stagger(4, 0.1).map((delay, index) =>\n        part(index, \"sway\", 1.5, delay, {\n          width: \"0.75em\",\n          height: \"4em\",\n          transformOrigin: \"bottom\",\n        }),\n      ),\n  },\n  morphing: {\n    root: { height: \"4em\" },\n    render: () => (\n      <span\n        data-part=\"group\"\n        style={{\n          display: \"flex\",\n          alignItems: \"center\",\n          animationName: `${PREFIX}-gap`,\n          [\"--dur\" as string]: scaled(2),\n        }}\n      >\n        {grow([0, 0, 0], \"1em\", \"4em\", \"2em\", 2, { borderRadius: \"0.25em\" })}\n      </span>\n    ),\n  },\n  stacked: {\n    root: { flexDirection: \"column\", width: \"4em\", gap: \"0.5em\" },\n    render: () =>\n      stagger(3, 0.2).map((delay, index) =>\n        part(index, \"stack\", 1.5, delay, { height: \"0.5em\" }),\n      ),\n  },\n  waveform: {\n    root: { height: \"4em\", gap: \"0.25em\" },\n    render: () =>\n      grow(\n        stagger(8, 1).map((index) => Math.round(Math.sin(index) * 500) / 1000),\n        \"0.5em\",\n        \"0.5em\",\n        \"3em\",\n        1,\n      ),\n  },\n  elastic: {\n    root: { height: \"5em\", gap: \"1em\" },\n    render: () => grow(stagger(3, 0.15), \"1em\", \"1em\", \"4.5em\", 1.1),\n  },\n  sliding: {\n    root: { width: \"4em\", height: \"4em\" },\n    render: () => [\n      part(\"top\", \"slide\", 1.5, 0, {\n        position: \"absolute\",\n        top: 0,\n        left: 0,\n        width: \"4em\",\n        height: \"0.75em\",\n        [\"--y\"]: \"3em\",\n      }),\n      part(\"bottom\", \"slide\", 1.5, 0, {\n        position: \"absolute\",\n        bottom: 0,\n        left: 0,\n        width: \"4em\",\n        height: \"0.75em\",\n        opacity: 0.5,\n        [\"--y\"]: \"-3em\",\n      }),\n    ],\n  },\n  \"sound-wave\": {\n    root: { height: \"4em\", gap: \"0.5em\" },\n    render: () =>\n      [1, 2, 3, 2, 1].map((peak, index) =>\n        part(index, \"grow\", 1, index * 0.1, {\n          width: \"0.5em\",\n          [\"--from\"]: \"0.5em\",\n          [\"--to\"]: `${String(peak)}em`,\n        }),\n      ),\n  },\n  \"wave-physics\": {\n    // The source is a 36.5em stage — five times its siblings. Drawn at 0.4 of\n    // the family's scale so it sits in the same space and still follows `size`.\n    root: { height: \"6.8em\", alignItems: \"flex-end\" },\n    render: () => (\n      <>\n        <style href={`${PREFIX}-physics`} precedence=\"dowel\">\n          {PHYSICS_STYLES}\n        </style>\n        <span\n          data-part=\"group\"\n          style={{\n            position: \"relative\",\n            display: \"flex\",\n            alignItems: \"flex-end\",\n            gap: \"1em\",\n            width: \"36.5em\",\n            fontSize: \"0.4em\",\n          }}\n        >\n          {Array.from({ length: PHYSICS_BARS }, (_, index) =>\n            part(index, `physics-${String(index)}`, 4, 0, {\n              width: \"1.5em\",\n              animationTimingFunction: \"linear\",\n            }),\n          )}\n          <span\n            data-part=\"group\"\n            style={{\n              position: \"absolute\",\n              bottom: 0,\n              left: 0,\n              zIndex: 1,\n              animationName: `${PREFIX}-physics-x`,\n              animationTimingFunction: \"linear\",\n              [\"--dur\" as string]: scaled(4),\n            }}\n          >\n            {part(\n              \"ball\",\n              \"physics-hop\",\n              4 / (PHYSICS_BOUNCES * 2),\n              0,\n              {\n                width: \"1.5em\",\n                height: \"1.5em\",\n                transformOrigin: \"bottom center\",\n                animationTimingFunction: \"linear\",\n              },\n              \"ball\",\n            )}\n          </span>\n        </span>\n      </>\n    ),\n  },\n  indeterminate: {\n    root: {},\n    // A sweep, not a percentage: it must never fake determinate progress.\n    render: () => (\n      <span\n        data-part=\"track\"\n        style={{ width: \"12em\", height: \"0.5em\", borderRadius: \"9999px\" }}\n      >\n        {part(\"sweep\", \"indeterminate\", 1.68, 0, {\n          position: \"absolute\",\n          top: 0,\n          bottom: 0,\n          left: 0,\n          width: \"33.333%\",\n          animationTimingFunction: \"cubic-bezier(0.645, 0.045, 0.355, 1)\",\n        })}\n      </span>\n    ),\n  },\n} satisfies Record<string, Variant>;\n\nexport type BarLoaderVariant = keyof typeof VARIANTS;\n\n/** Every variant, in catalogue order. Stories and tests iterate this. */\nexport const barLoaderVariantNames = Object.keys(VARIANTS) as BarLoaderVariant[];\n\nconst barLoaderVariants = cva(\"\", {\n  variants: {\n    size: {\n      sm: \"text-[0.25rem]\",\n      md: \"text-[0.375rem]\",\n      lg: \"text-[0.5rem]\",\n      xl: \"text-[0.625rem]\",\n    },\n  },\n  defaultVariants: {\n    size: \"md\",\n  },\n});\n\nexport interface BarLoaderProps\n  extends\n    Omit<ComponentPropsWithRef<\"span\">, \"children\">,\n    VariantProps<typeof barLoaderVariants> {\n  /** Which animation to play. */\n  variant?: BarLoaderVariant;\n  /**\n   * Announced to assistive technology while the loader is visible.\n   *\n   * Omit it when the loader sits inside something that already reports its\n   * busy state — announcing twice is worse than not announcing at all.\n   */\n  label?: string;\n}\n\n/** An indeterminate loading indicator made of bars, in 21 motions. */\nexport function BarLoader({\n  className,\n  size,\n  variant = \"cascade\",\n  label,\n  style,\n  ...props\n}: BarLoaderProps) {\n  const spec: Variant = VARIANTS[variant];\n\n  return (\n    <>\n      <style href={PREFIX} precedence=\"dowel\">\n        {STYLES}\n      </style>\n      <span\n        aria-hidden=\"true\"\n        data-slot=\"bar-loader\"\n        data-variant={variant}\n        // Exempt from the reduced-motion blanket: a loader that stops says the\n        // application has hung. It is slowed instead — see ADR 0014.\n        data-motion=\"indicator\"\n        className={cn(PREFIX, barLoaderVariants({ size }), className)}\n        style={{ ...spec.root, ...style }}\n        {...props}\n      >\n        {spec.render()}\n      </span>\n      {label ? (\n        <span role=\"status\" className=\"sr-only\">\n          {label}\n        </span>\n      ) : null}\n    </>\n  );\n}\n\nexport { barLoaderVariants };\n"],"mappings":"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"}

package/dist/components/bar-loader/index.d.ts

@@ -0,0 +1,2 @@
+import { BarLoader, BarLoaderProps, BarLoaderVariant, barLoaderVariantNames, barLoaderVariants } from "./bar-loader.js";
+export { BarLoader, type BarLoaderProps, type BarLoaderVariant, barLoaderVariantNames, barLoaderVariants };

package/dist/components/bar-loader/index.js

@@ -0,0 +1,2 @@
+import { BarLoader, barLoaderVariantNames, barLoaderVariants } from "./bar-loader.js";
+export { BarLoader, barLoaderVariantNames, barLoaderVariants };

package/dist/components/bar-loader/meta.js

@@ -0,0 +1,17 @@
+import { defineMeta } from "../../registry/schema.js";
+//#region src/components/bar-loader/meta.ts
+const meta = defineMeta({
+	name: "bar-loader",
+	title: "Bar Loader",
+	description: "Indeterminate loading indicators made of bars — cascade, equalizer, wave physics, an indeterminate sweep and 17 more motions.",
+	category: "feedback",
+	status: "beta",
+	dependencies: ["class-variance-authority"],
+	registryDependencies: [],
+	files: ["bar-loader.tsx"],
+	a11y: "Renders aria-hidden by default so it does not announce inside controls that already expose a busy state. Pass `label` to announce it standalone via role=\"status\". Under reduced motion it slows rather than stopping, because a frozen loader reads as a hang. The indeterminate sweep never reports a value, so it cannot be mistaken for real progress."
+});
+//#endregion
+export { meta };
+
+//# sourceMappingURL=meta.js.map

package/dist/components/bar-loader/meta.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"meta.js","names":[],"sources":["../../../src/components/bar-loader/meta.ts"],"sourcesContent":["import { defineMeta } from \"@/registry/schema\";\n\nexport const meta = defineMeta({\n  name: \"bar-loader\",\n  title: \"Bar Loader\",\n  description:\n    \"Indeterminate loading indicators made of bars — cascade, equalizer, wave physics, an indeterminate sweep and 17 more motions.\",\n  category: \"feedback\",\n  status: \"beta\",\n  dependencies: [\"class-variance-authority\"],\n  registryDependencies: [],\n  files: [\"bar-loader.tsx\"],\n  a11y:\n    \"Renders aria-hidden by default so it does not announce inside controls that already \" +\n    'expose a busy state. Pass `label` to announce it standalone via role=\"status\". ' +\n    \"Under reduced motion it slows rather than stopping, because a frozen loader reads as a hang. \" +\n    \"The indeterminate sweep never reports a value, so it cannot be mistaken for real progress.\",\n});\n"],"mappings":";;AAEA,MAAa,OAAO,WAAW;CAC7B,MAAM;CACN,OAAO;CACP,aACE;CACF,UAAU;CACV,QAAQ;CACR,cAAc,CAAC,0BAA0B;CACzC,sBAAsB,CAAC;CACvB,OAAO,CAAC,gBAAgB;CACxB,MACE;AAIJ,CAAC"}

package/dist/components/book/book.d.ts

@@ -0,0 +1,35 @@
+import { VariantProps } from "class-variance-authority";
+import { ComponentPropsWithRef, ReactNode } from "react";
+//#region src/components/book/book.d.ts
+declare const bookVariants: (props?: ({
+  effect?: "none" | "tilt" | "open" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+declare const bookCoverVariants: (props?: ({
+  variant?: "stripe" | "simple" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+interface BookProps extends Omit<ComponentPropsWithRef<"div">, "title">, VariantProps<typeof bookVariants>, VariantProps<typeof bookCoverVariants> {
+  /** The title on the cover. */
+  title: ReactNode;
+  /** Cover colour. Any CSS colour; defaults to the primary token. */
+  color?: string;
+  /** Title colour. Defaults to the foreground token (stripe) or primary-foreground (simple). */
+  textColor?: string;
+  /** Width in pixels; the height follows at 60:49. */
+  width?: number;
+  /** Artwork for the colour band of the `stripe` variant. */
+  illustration?: ReactNode;
+  /** A mark at the foot of the cover. */
+  logo?: ReactNode;
+  /** What the open cover reveals, for `effect="open"`. */
+  inside?: ReactNode;
+  /**
+   * Renders the child element as the book — typically a link. The book then
+   * takes keyboard focus itself, and focus opens or tilts it like hover does.
+   */
+  asChild?: boolean;
+}
+/** A 3D book cover that tilts, or opens, on hover and keyboard focus. */
+declare function Book({ className, title, variant, effect, color, textColor, width, illustration, logo, inside, asChild, style, children, ...props }: BookProps): import("react").JSX.Element;
+//#endregion
+export { Book, BookProps, bookCoverVariants, bookVariants };
+//# sourceMappingURL=book.d.ts.map

package/dist/components/book/book.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"book.d.ts","names":[],"sources":["../../../src/components/book/book.tsx"],"mappings":";;;cAuCM,eAAY;;6CAyBjB;cAOK,oBAAiB;;6CAetB;UAEgB,kBAEb,KAAK,wCACL,oBAAoB,eACpB,oBAAoB;;EAEtB,OAAO;;EAEP;;EAEA;;EAEA;;EAEA,eAAe;;EAEf,OAAO;;EAEP,SAAS;;;;;EAKT;;;iBAIc,OACd,WACA,OACA,SACA,QACA,OACA,WACA,OACA,cACA,MACA,QACA,SACA,OACA,aACG,SACF,4BAAS,IAAA"}