@dowel-ui/react 0.5.0 → 0.8.0

package/dist/components/progress/progress.js

@@ -1,8 +1,9 @@
 "use client";
 import { cn } from "../../lib/utils.js";
 import { Progress } from "radix-ui";
-import { jsx } from "react/jsx-runtime";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { cva } from "class-variance-authority";
+import { useEffect, useState } from "react";
 //#region src/components/progress/progress.tsx
 const progressVariants = cva("relative w-full overflow-hidden rounded-full bg-muted", {
 	variants: {
@@ -23,6 +24,48 @@ const progressVariants = cva("relative w-full overflow-hidden rounded-full bg-mu
 		tone: "primary"
 	}
 });
+const PREFIX = "dowel-progress";
+const STYLES = `
+@keyframes ${PREFIX}-stripes { from { background-position: 1rem 0; } to { background-position: 0 0; } }
+@keyframes ${PREFIX}-shine { from { translate: -100% 0; } to { translate: 100% 0; } }
+[data-slot="progress-indicator"][data-effect="striped"] {
+  background-image: linear-gradient(45deg, color-mix(in oklab, var(--color-background) 22%, transparent) 25%, transparent 25%, transparent 50%, color-mix(in oklab, var(--color-background) 22%, transparent) 50%, color-mix(in oklab, var(--color-background) 22%, transparent) 75%, transparent 75%, transparent);
+  background-size: 1rem 1rem;
+  animation: ${PREFIX}-stripes calc(1s * var(--motion-scale, 1)) linear infinite;
+}
+[data-slot="progress-indicator"][data-effect="shine"] { position: relative; overflow: hidden; }
+[data-slot="progress-indicator"][data-effect="shine"]::after {
+  content: "";
+  position: absolute;
+  inset: 0;
+  translate: -100% 0;
+  background-image: linear-gradient(90deg, transparent, color-mix(in oklab, var(--color-background) 40%, transparent), transparent);
+  animation: ${PREFIX}-shine calc(1.6s * var(--motion-scale, 1)) var(--ease-in-out-quint) infinite;
+}
+`;
+/**
+* False for the first painted frame, then true.
+*
+* Two animation frames rather than one effect: an effect can run before the
+* browser has painted the empty bar, and a transition needs a painted start.
+*/
+function usePainted(enabled) {
+	const [painted, setPainted] = useState(!enabled);
+	useEffect(() => {
+		if (!enabled) return;
+		let second = 0;
+		const first = requestAnimationFrame(() => {
+			second = requestAnimationFrame(() => {
+				setPainted(true);
+			});
+		});
+		return () => {
+			cancelAnimationFrame(first);
+			cancelAnimationFrame(second);
+		};
+	}, [enabled]);
+	return painted;
+}
 /**
 * Shows how far along a task is.
 *
@@ -31,10 +74,16 @@ const progressVariants = cva("relative w-full overflow-hidden rounded-full bg-mu
 * "no progress". For a short wait with no measurable progress, a Spinner says
 * the same thing with less furniture.
 */
-function Progress$1({ className, size, tone, value, ...props }) {
+function Progress$1({ className, size, tone, value, easing = "smooth", fillOnMount = false, effect = "none", ...props }) {
 	const indeterminate = value === null || value === void 0;
-	const percent = indeterminate ? 0 : Math.min(100, Math.max(0, value));
-	return /* @__PURE__ */ jsx(Progress.Root, {
+	const painted = usePainted(fillOnMount);
+	const percent = indeterminate || !painted ? 0 : Math.min(100, Math.max(0, value));
+	const decorated = !indeterminate && effect !== "none";
+	return /* @__PURE__ */ jsxs(Fragment, { children: [decorated ? /* @__PURE__ */ jsx("style", {
+		href: PREFIX,
+		precedence: "dowel",
+		children: STYLES
+	}) : null, /* @__PURE__ */ jsx(Progress.Root, {
 		"data-slot": "progress",
 		value,
 		className: cn(progressVariants({
@@ -45,10 +94,11 @@ function Progress$1({ className, size, tone, value, ...props }) {
 		children: /* @__PURE__ */ jsx(Progress.Indicator, {
 			"data-slot": "progress-indicator",
 			"data-motion": indeterminate ? "indicator" : void 0,
-			className: cn("h-full w-full flex-1 rounded-full bg-[var(--progress-fill)]", "transition-transform duration-[var(--duration-slow)] ease-[var(--ease-out-quint)]", indeterminate && "animate-pulse-soft"),
+			"data-effect": decorated ? effect : void 0,
+			className: cn("h-full w-full flex-1 rounded-full bg-[var(--progress-fill)]", "transition-transform duration-[var(--duration-slow)] ease-[var(--ease-out-quint)]", indeterminate && "animate-pulse-soft", easing === "spring" && "ease-[var(--ease-overshoot)]"),
 			style: indeterminate ? void 0 : { transform: `translateX(-${String(100 - percent)}%)` }
 		})
-	});
+	})] });
 }
 //#endregion
 export { Progress$1 as Progress, progressVariants };

package/dist/components/progress/progress.js.map

@@ -1 +1 @@
-{"version":3,"file":"progress.js","names":["Progress","ProgressPrimitive"],"sources":["../../../src/components/progress/progress.tsx"],"sourcesContent":["\"use client\";\n\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport { Progress as ProgressPrimitive } from \"radix-ui\";\nimport type { ComponentPropsWithRef } from \"react\";\n\nimport { cn } from \"@/lib/utils\";\n\nconst progressVariants = cva(\"relative w-full overflow-hidden rounded-full bg-muted\", {\n  variants: {\n    size: {\n      sm: \"h-1\",\n      md: \"h-2\",\n      lg: \"h-3\",\n    },\n    tone: {\n      primary: \"[--progress-fill:var(--color-primary)]\",\n      success: \"[--progress-fill:var(--color-success)]\",\n      warning: \"[--progress-fill:var(--color-warning)]\",\n      destructive: \"[--progress-fill:var(--color-destructive)]\",\n    },\n  },\n  defaultVariants: {\n    size: \"md\",\n    tone: \"primary\",\n  },\n});\n\nexport interface ProgressProps\n  extends\n    ComponentPropsWithRef<typeof ProgressPrimitive.Root>,\n    VariantProps<typeof progressVariants> {}\n\n/**\n * Shows how far along a task is.\n *\n * Pass `value={null}` for work whose duration is unknown — that is a genuinely\n * different state from zero percent, and it is announced as such rather than as\n * \"no progress\". For a short wait with no measurable progress, a Spinner says\n * the same thing with less furniture.\n */\nexport function Progress({ className, size, tone, value, ...props }: ProgressProps) {\n  const indeterminate = value === null || value === undefined;\n  const percent = indeterminate ? 0 : Math.min(100, Math.max(0, value));\n\n  return (\n    <ProgressPrimitive.Root\n      data-slot=\"progress\"\n      value={value}\n      className={cn(progressVariants({ size, tone }), className)}\n      {...props}\n    >\n      <ProgressPrimitive.Indicator\n        data-slot=\"progress-indicator\"\n        // Only while indeterminate: the sweep is the signal that work is\n        // ongoing, and freezing it reads as a stalled zero percent.\n        data-motion={indeterminate ? \"indicator\" : undefined}\n        className={cn(\n          \"h-full w-full flex-1 rounded-full bg-[var(--progress-fill)]\",\n          \"transition-transform duration-[var(--duration-slow)] ease-[var(--ease-out-quint)]\",\n          // With no known value the bar sweeps instead of filling, so it reads\n          // as \"working\" rather than as a stalled 0%.\n          indeterminate && \"animate-pulse-soft\",\n        )}\n        style={\n          indeterminate ? undefined : { transform: `translateX(-${String(100 - percent)}%)` }\n        }\n      />\n    </ProgressPrimitive.Root>\n  );\n}\n\nexport { progressVariants };\n"],"mappings":";;;;;;AAQA,MAAM,mBAAmB,IAAI,yDAAyD;CACpF,UAAU;EACR,MAAM;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;EACN;EACA,MAAM;GACJ,SAAS;GACT,SAAS;GACT,SAAS;GACT,aAAa;EACf;CACF;CACA,iBAAiB;EACf,MAAM;EACN,MAAM;CACR;AACF,CAAC;;;;;;;;;AAeD,SAAgBA,WAAS,EAAE,WAAW,MAAM,MAAM,OAAO,GAAG,SAAwB;CAClF,MAAM,gBAAgB,UAAU,QAAQ,UAAU,KAAA;CAClD,MAAM,UAAU,gBAAgB,IAAI,KAAK,IAAI,KAAK,KAAK,IAAI,GAAG,KAAK,CAAC;CAEpE,OACE,oBAACC,SAAkB,MAAnB;EACE,aAAU;EACH;EACP,WAAW,GAAG,iBAAiB;GAAE;GAAM;EAAK,CAAC,GAAG,SAAS;EACzD,GAAI;EAEJ,UAAA,oBAACA,SAAkB,WAAnB;GACE,aAAU;GAGV,eAAa,gBAAgB,cAAc,KAAA;GAC3C,WAAW,GACT,+DACA,qFAGA,iBAAiB,oBACnB;GACA,OACE,gBAAgB,KAAA,IAAY,EAAE,WAAW,eAAe,OAAO,MAAM,OAAO,EAAE,IAAI;EAErF,CAAA;CACqB,CAAA;AAE5B"}
+{"version":3,"file":"progress.js","names":["Progress","ProgressPrimitive"],"sources":["../../../src/components/progress/progress.tsx"],"sourcesContent":["\"use client\";\n\n// Motion from SmoothUI AnimatedProgressBar (MIT, © 2024 Eduardo Calvo). See THIRD_PARTY_NOTICES.md.\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport { Progress as ProgressPrimitive } from \"radix-ui\";\nimport { useEffect, useState, type ComponentPropsWithRef } from \"react\";\n\nimport { cn } from \"@/lib/utils\";\n\nconst progressVariants = cva(\"relative w-full overflow-hidden rounded-full bg-muted\", {\n  variants: {\n    size: {\n      sm: \"h-1\",\n      md: \"h-2\",\n      lg: \"h-3\",\n    },\n    tone: {\n      primary: \"[--progress-fill:var(--color-primary)]\",\n      success: \"[--progress-fill:var(--color-success)]\",\n      warning: \"[--progress-fill:var(--color-warning)]\",\n      destructive: \"[--progress-fill:var(--color-destructive)]\",\n    },\n  },\n  defaultVariants: {\n    size: \"md\",\n    tone: \"primary\",\n  },\n});\n\nconst PREFIX = \"dowel-progress\";\n\n/*\n * Stripes and shine are decoration on a bar whose value already says how far\n * along it is, so they stop under reduced motion like any other decoration:\n * the global rule runs each once, in a hundredth of a millisecond, which\n * leaves the stripes still and the shine parked off the end of the bar. They\n * apply only while the value is known — an indeterminate bar is an indicator\n * with its own sweep, and a second motion on top of it would say nothing new.\n *\n * Unlayered, so it outranks utilities; it touches only its own data-effect\n * selectors, which nothing else sets.\n */\nconst STYLES = `\n@keyframes ${PREFIX}-stripes { from { background-position: 1rem 0; } to { background-position: 0 0; } }\n@keyframes ${PREFIX}-shine { from { translate: -100% 0; } to { translate: 100% 0; } }\n[data-slot=\"progress-indicator\"][data-effect=\"striped\"] {\n  background-image: linear-gradient(45deg, color-mix(in oklab, var(--color-background) 22%, transparent) 25%, transparent 25%, transparent 50%, color-mix(in oklab, var(--color-background) 22%, transparent) 50%, color-mix(in oklab, var(--color-background) 22%, transparent) 75%, transparent 75%, transparent);\n  background-size: 1rem 1rem;\n  animation: ${PREFIX}-stripes calc(1s * var(--motion-scale, 1)) linear infinite;\n}\n[data-slot=\"progress-indicator\"][data-effect=\"shine\"] { position: relative; overflow: hidden; }\n[data-slot=\"progress-indicator\"][data-effect=\"shine\"]::after {\n  content: \"\";\n  position: absolute;\n  inset: 0;\n  translate: -100% 0;\n  background-image: linear-gradient(90deg, transparent, color-mix(in oklab, var(--color-background) 40%, transparent), transparent);\n  animation: ${PREFIX}-shine calc(1.6s * var(--motion-scale, 1)) var(--ease-in-out-quint) infinite;\n}\n`;\n\nexport interface ProgressProps\n  extends\n    ComponentPropsWithRef<typeof ProgressPrimitive.Root>,\n    VariantProps<typeof progressVariants> {\n  /**\n   * How the fill travels to a new value. `smooth` eases in, as it always has;\n   * `spring` carries slightly past the value and settles, like SmoothUI's\n   * spring. Default `smooth`.\n   */\n  easing?: \"smooth\" | \"spring\";\n  /**\n   * Fills from empty on mount instead of appearing at its value. For a bar\n   * that is revealed once, like a result or a quota; not for one that is\n   * polled, which would replay on every remount. Default `false`.\n   */\n  fillOnMount?: boolean;\n  /**\n   * A moving texture on the fill while the value is known: `striped` runs\n   * diagonal stripes along it, `shine` sweeps a highlight across it.\n   * Decoration — both stop under reduced motion. Default `none`.\n   */\n  effect?: \"none\" | \"striped\" | \"shine\";\n}\n\n/**\n * False for the first painted frame, then true.\n *\n * Two animation frames rather than one effect: an effect can run before the\n * browser has painted the empty bar, and a transition needs a painted start.\n */\nfunction usePainted(enabled: boolean): boolean {\n  const [painted, setPainted] = useState(!enabled);\n  useEffect(() => {\n    if (!enabled) return;\n    let second = 0;\n    const first = requestAnimationFrame(() => {\n      second = requestAnimationFrame(() => {\n        setPainted(true);\n      });\n    });\n    return () => {\n      cancelAnimationFrame(first);\n      cancelAnimationFrame(second);\n    };\n  }, [enabled]);\n  return painted;\n}\n\n/**\n * Shows how far along a task is.\n *\n * Pass `value={null}` for work whose duration is unknown — that is a genuinely\n * different state from zero percent, and it is announced as such rather than as\n * \"no progress\". For a short wait with no measurable progress, a Spinner says\n * the same thing with less furniture.\n */\nexport function Progress({\n  className,\n  size,\n  tone,\n  value,\n  easing = \"smooth\",\n  fillOnMount = false,\n  effect = \"none\",\n  ...props\n}: ProgressProps) {\n  const indeterminate = value === null || value === undefined;\n  const painted = usePainted(fillOnMount);\n  const percent = indeterminate || !painted ? 0 : Math.min(100, Math.max(0, value));\n  const decorated = !indeterminate && effect !== \"none\";\n\n  return (\n    <>\n      {decorated ? (\n        <style href={PREFIX} precedence=\"dowel\">\n          {STYLES}\n        </style>\n      ) : null}\n      <ProgressPrimitive.Root\n        data-slot=\"progress\"\n        value={value}\n        className={cn(progressVariants({ size, tone }), className)}\n        {...props}\n      >\n        <ProgressPrimitive.Indicator\n          data-slot=\"progress-indicator\"\n          // Only while indeterminate: the sweep is the signal that work is\n          // ongoing, and freezing it reads as a stalled zero percent.\n          data-motion={indeterminate ? \"indicator\" : undefined}\n          data-effect={decorated ? effect : undefined}\n          className={cn(\n            \"h-full w-full flex-1 rounded-full bg-[var(--progress-fill)]\",\n            \"transition-transform duration-[var(--duration-slow)] ease-[var(--ease-out-quint)]\",\n            // With no known value the bar sweeps instead of filling, so it reads\n            // as \"working\" rather than as a stalled 0%.\n            indeterminate && \"animate-pulse-soft\",\n            easing === \"spring\" && \"ease-[var(--ease-overshoot)]\",\n          )}\n          style={\n            indeterminate ? undefined : { transform: `translateX(-${String(100 - percent)}%)` }\n          }\n        />\n      </ProgressPrimitive.Root>\n    </>\n  );\n}\n\nexport { progressVariants };\n"],"mappings":";;;;;;;AASA,MAAM,mBAAmB,IAAI,yDAAyD;CACpF,UAAU;EACR,MAAM;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;EACN;EACA,MAAM;GACJ,SAAS;GACT,SAAS;GACT,SAAS;GACT,aAAa;EACf;CACF;CACA,iBAAiB;EACf,MAAM;EACN,MAAM;CACR;AACF,CAAC;AAED,MAAM,SAAS;AAaf,MAAM,SAAS;aACF,OAAO;aACP,OAAO;;;;eAIL,OAAO;;;;;;;;;eASP,OAAO;;;;;;;;;AAkCtB,SAAS,WAAW,SAA2B;CAC7C,MAAM,CAAC,SAAS,cAAc,SAAS,CAAC,OAAO;CAC/C,gBAAgB;EACd,IAAI,CAAC,SAAS;EACd,IAAI,SAAS;EACb,MAAM,QAAQ,4BAA4B;GACxC,SAAS,4BAA4B;IACnC,WAAW,IAAI;GACjB,CAAC;EACH,CAAC;EACD,aAAa;GACX,qBAAqB,KAAK;GAC1B,qBAAqB,MAAM;EAC7B;CACF,GAAG,CAAC,OAAO,CAAC;CACZ,OAAO;AACT;;;;;;;;;AAUA,SAAgBA,WAAS,EACvB,WACA,MACA,MACA,OACA,SAAS,UACT,cAAc,OACd,SAAS,QACT,GAAG,SACa;CAChB,MAAM,gBAAgB,UAAU,QAAQ,UAAU,KAAA;CAClD,MAAM,UAAU,WAAW,WAAW;CACtC,MAAM,UAAU,iBAAiB,CAAC,UAAU,IAAI,KAAK,IAAI,KAAK,KAAK,IAAI,GAAG,KAAK,CAAC;CAChF,MAAM,YAAY,CAAC,iBAAiB,WAAW;CAE/C,OACE,qBAAA,UAAA,EAAA,UAAA,CACG,YACC,oBAAC,SAAD;EAAO,MAAM;EAAQ,YAAW;EAC7B,UAAA;CACI,CAAA,IACL,MACJ,oBAACC,SAAkB,MAAnB;EACE,aAAU;EACH;EACP,WAAW,GAAG,iBAAiB;GAAE;GAAM;EAAK,CAAC,GAAG,SAAS;EACzD,GAAI;EAEJ,UAAA,oBAACA,SAAkB,WAAnB;GACE,aAAU;GAGV,eAAa,gBAAgB,cAAc,KAAA;GAC3C,eAAa,YAAY,SAAS,KAAA;GAClC,WAAW,GACT,+DACA,qFAGA,iBAAiB,sBACjB,WAAW,YAAY,8BACzB;GACA,OACE,gBAAgB,KAAA,IAAY,EAAE,WAAW,eAAe,OAAO,MAAM,OAAO,EAAE,IAAI;EAErF,CAAA;CACqB,CAAA,CACxB,EAAA,CAAA;AAEN"}

package/dist/components/pull-to-refresh/index.d.ts

@@ -0,0 +1,2 @@
+import { PullToRefresh, PullToRefreshProps, pullToRefreshVariants, rubberBand, spinPeriod } from "./pull-to-refresh.js";
+export { PullToRefresh, type PullToRefreshProps, pullToRefreshVariants, rubberBand, spinPeriod };

package/dist/components/pull-to-refresh/index.js

@@ -0,0 +1,2 @@
+import { PullToRefresh, pullToRefreshVariants, rubberBand, spinPeriod } from "./pull-to-refresh.js";
+export { PullToRefresh, pullToRefreshVariants, rubberBand, spinPeriod };

package/dist/components/pull-to-refresh/meta.js

@@ -0,0 +1,17 @@
+import { defineMeta } from "../../registry/schema.js";
+//#region src/components/pull-to-refresh/meta.ts
+const meta = defineMeta({
+	name: "pull-to-refresh",
+	title: "Pull to Refresh",
+	description: "A sheet you pull down to refresh, with rubber-band resistance, a dot ring that fills as you pull and springs that carry the pull's velocity.",
+	category: "feedback",
+	status: "beta",
+	dependencies: ["class-variance-authority", "motion"],
+	registryDependencies: ["button"],
+	files: ["pull-to-refresh.tsx"],
+	a11y: "The sheet is a named, focusable group described by a hint; Enter on it refreshes, and a visible Refresh button (showRefreshButton, on by default) gives a pointer-free path for touch and screen reader users, so pulling is never the only way. While refreshing the sheet is aria-busy and a polite status region announces \"Refreshing…\" then \"Refreshed\". The dot ring is aria-hidden decoration and stops under reduced motion, where the springs are also instant; the refresh itself still works. A pull only starts when the sheet is scrolled to the top, and the click a pull leaves behind is swallowed."
+});
+//#endregion
+export { meta };
+
+//# sourceMappingURL=meta.js.map

package/dist/components/pull-to-refresh/meta.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"meta.js","names":[],"sources":["../../../src/components/pull-to-refresh/meta.ts"],"sourcesContent":["import { defineMeta } from \"@/registry/schema\";\n\nexport const meta = defineMeta({\n  name: \"pull-to-refresh\",\n  title: \"Pull to Refresh\",\n  description:\n    \"A sheet you pull down to refresh, with rubber-band resistance, a dot ring that fills as you pull and springs that carry the pull's velocity.\",\n  category: \"feedback\",\n  status: \"beta\",\n  dependencies: [\"class-variance-authority\", \"motion\"],\n  registryDependencies: [\"button\"],\n  files: [\"pull-to-refresh.tsx\"],\n  a11y:\n    \"The sheet is a named, focusable group described by a hint; Enter on it refreshes, and a visible Refresh \" +\n    \"button (showRefreshButton, on by default) gives a pointer-free path for touch and screen reader users, so \" +\n    \"pulling is never the only way. While refreshing the sheet is aria-busy and a polite status region \" +\n    'announces \"Refreshing…\" then \"Refreshed\". The dot ring is aria-hidden decoration and stops under reduced ' +\n    \"motion, where the springs are also instant; the refresh itself still works. A pull only starts when the \" +\n    \"sheet is scrolled to the top, and the click a pull leaves behind is swallowed.\",\n});\n"],"mappings":";;AAEA,MAAa,OAAO,WAAW;CAC7B,MAAM;CACN,OAAO;CACP,aACE;CACF,UAAU;CACV,QAAQ;CACR,cAAc,CAAC,4BAA4B,QAAQ;CACnD,sBAAsB,CAAC,QAAQ;CAC/B,OAAO,CAAC,qBAAqB;CAC7B,MACE;AAMJ,CAAC"}

package/dist/components/pull-to-refresh/pull-to-refresh.d.ts

@@ -0,0 +1,47 @@
+import { VariantProps } from "class-variance-authority";
+import { ComponentPropsWithRef, ReactNode } from "react";
+//#region src/components/pull-to-refresh/pull-to-refresh.d.ts
+/** Rubber-band resistance: near 1:1 for a short pull, 180px of travel gives about 156. */
+declare function rubberBand(distance: number): number;
+/** Spin (0–100) to the ring's period in ms: 2400 at 50, 4800 at 0, 1200 at 100. */
+declare function spinPeriod(spin: number): number;
+declare const pullToRefreshVariants: (props?: ({
+  fill?: "light" | "dark" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+interface PullToRefreshProps extends Omit<ComponentPropsWithRef<"div">, "onRefresh">, VariantProps<typeof pullToRefreshVariants> {
+  /** Runs the refresh. The sheet stays in the refreshing state until a returned promise settles. */
+  onRefresh?: () => Promise<unknown> | void;
+  /** Controlled refreshing state. Leave undefined to let the promise drive it. */
+  refreshing?: boolean;
+  /** Pull distance (px) that arms the refresh; also the resting offset while refreshing. Default 58. */
+  threshold?: number;
+  /** Dots in the ring, 3–10. Default 6. */
+  dots?: number;
+  /** Ring rotation speed, 0–100 (2400ms per turn at 50). Default 50. */
+  spin?: number;
+  /** Sheet radius in px, 0–40. Default 26. */
+  corner?: number;
+  /** A 1px inset hairline on the sheet. */
+  stroke?: boolean;
+  disabled?: boolean;
+  /** Shortest time the refreshing state shows, so a fast refresh still reads (ms). Default 600. */
+  minDuration?: number;
+  /** Names the sheet. Default "Refreshable content". */
+  label?: string;
+  /** Instructions linked to the sheet with aria-describedby. */
+  hint?: string;
+  /** Renders a visible Refresh button under the sheet. Default true. */
+  showRefreshButton?: boolean;
+  /** The refresh button's text. Default "Refresh". */
+  refreshButtonLabel?: string;
+  /** Announced when a refresh starts. Default "Refreshing…". */
+  refreshingLabel?: string;
+  /** Announced when a refresh ends. Default "Refreshed". */
+  refreshedLabel?: string;
+  children?: ReactNode;
+}
+/** Wraps content in a sheet that refreshes on a pull, Enter, or a button. */
+declare function PullToRefresh({ className, style, fill, children, onRefresh, refreshing, threshold, dots, spin, corner, stroke, disabled, minDuration, label, hint, showRefreshButton, refreshButtonLabel, refreshingLabel, refreshedLabel, ...props }: PullToRefreshProps): import("react").JSX.Element;
+//#endregion
+export { PullToRefresh, PullToRefreshProps, pullToRefreshVariants, rubberBand, spinPeriod };
+//# sourceMappingURL=pull-to-refresh.d.ts.map

package/dist/components/pull-to-refresh/pull-to-refresh.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"pull-to-refresh.d.ts","names":[],"sources":["../../../src/components/pull-to-refresh/pull-to-refresh.tsx"],"mappings":";;;;iBAiFgB,WAAW;;iBAKX,WAAW;cAIrB,wBAAqB;;6CASzB;UAIe,2BAEb,KAAK,4CACL,oBAAoB;;EAEtB,kBAAkB;;EAElB;;EAEA;;EAEA;;EAEA;;EAEA;;EAEA;EACA;;EAEA;;EAEA;;EAEA;;EAEA;;EAEA;;EAEA;;EAEA;EACA,WAAW;;;iBAIG,gBACd,WACA,OACA,MACA,UACA,WACA,YACA,WACA,MACA,MACA,QACA,QACA,UACA,aACA,OACA,MACA,mBACA,oBACA,iBACA,mBACG,SACF,qCAAkB,IAAA"}

package/dist/components/pull-to-refresh/pull-to-refresh.js

@@ -0,0 +1,302 @@
+"use client";
+import { focusRing } from "../../lib/styles.js";
+import { cn } from "../../lib/utils.js";
+import { Button } from "../button/button.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cva } from "class-variance-authority";
+import { useEffect, useId, useLayoutEffect, useRef, useState, useSyncExternalStore } from "react";
+import { MotionConfig, animate, motion, useMotionValue, useMotionValueEvent } from "motion/react";
+//#region src/components/pull-to-refresh/pull-to-refresh.tsx
+const PREFIX = "dowel-pull-to-refresh";
+const STYLES = `
+@keyframes ${PREFIX}-spin{to{rotate:360deg}}
+[data-slot=pull-to-refresh][data-phase=refreshing] [data-slot=pull-to-refresh-dots]{animation:${PREFIX}-spin calc(var(--ptr-period, 2400ms) * var(--motion-scale)) linear infinite}
+`;
+/** Pointer travel that decides whether a press is a pull. */
+const SLOP = 4;
+/** Ring radius for the dots (px). */
+const RING = 15;
+const REST_SPRING = {
+	type: "spring",
+	stiffness: 380,
+	damping: 16
+};
+const BACK_SPRING = {
+	type: "spring",
+	stiffness: 260,
+	damping: 22
+};
+const REDUCED_MOTION = "(prefers-reduced-motion: reduce)";
+function subscribeToMotionPreference(onChange) {
+	const query = window.matchMedia(REDUCED_MOTION);
+	query.addEventListener("change", onChange);
+	return () => query.removeEventListener("change", onChange);
+}
+function usePrefersReducedMotion() {
+	return useSyncExternalStore(subscribeToMotionPreference, () => window.matchMedia(REDUCED_MOTION).matches, () => false);
+}
+/** Rubber-band resistance: near 1:1 for a short pull, 180px of travel gives about 156. */
+function rubberBand(distance) {
+	return 600 * (1 - Math.exp(-Math.max(0, distance) / 600));
+}
+/** Spin (0–100) to the ring's period in ms: 2400 at 50, 4800 at 0, 1200 at 100. */
+function spinPeriod(spin) {
+	return Math.round(2400 * 2 ** ((50 - Math.min(100, Math.max(0, spin))) / 50));
+}
+const pullToRefreshVariants = cva("relative isolate flex flex-col text-card-foreground", {
+	variants: { 
+	/** `dark` renders the block with the dark token set whatever the page theme. */
+fill: {
+		light: "",
+		dark: "dark"
+	} },
+	defaultVariants: { fill: "light" }
+});
+/** Wraps content in a sheet that refreshes on a pull, Enter, or a button. */
+function PullToRefresh({ className, style, fill, children, onRefresh, refreshing, threshold = 58, dots = 6, spin = 50, corner = 26, stroke = false, disabled = false, minDuration = 600, label = "Refreshable content", hint = "Pull down, or press Enter, to refresh.", showRefreshButton = true, refreshButtonLabel = "Refresh", refreshingLabel = "Refreshing…", refreshedLabel = "Refreshed", ...props }) {
+	const controlled = refreshing !== void 0;
+	const [internal, setInternal] = useState(false);
+	const busy = controlled ? refreshing : internal;
+	const [pulling, setPulling] = useState(false);
+	const [armed, setArmed] = useState(false);
+	const [atTop, setAtTop] = useState(true);
+	const [announcement, setAnnouncement] = useState("");
+	const reduceMotion = usePrefersReducedMotion();
+	const hintId = `${PREFIX}-${useId().replace(/:/g, "")}`;
+	const sheet = useRef(null);
+	const at = useMotionValue(0);
+	const animation = useRef(null);
+	const press = useRef(null);
+	const swallowClick = useRef(false);
+	const running = useRef(false);
+	const velocity = useRef(0);
+	const mounted = useRef(false);
+	const latest = useRef({
+		onRefresh,
+		minDuration,
+		reduceMotion,
+		threshold,
+		busy,
+		controlled
+	});
+	useLayoutEffect(() => {
+		latest.current = {
+			onRefresh,
+			minDuration,
+			reduceMotion,
+			threshold,
+			busy,
+			controlled
+		};
+	});
+	const [announced, setAnnounced] = useState(busy);
+	if (announced !== busy) {
+		setAnnounced(busy);
+		setAnnouncement(busy ? refreshingLabel : refreshedLabel);
+	}
+	useMotionValueEvent(at, "change", (value) => {
+		const root = sheet.current?.parentElement;
+		if (!root) return;
+		const progress = Math.min(1, Math.max(0, value / latest.current.threshold));
+		root.style.setProperty("--ptr-at", `${String(value)}px`);
+		root.style.setProperty("--ptr-p", String(progress));
+	});
+	/** Springs (or, under reduced motion, jumps) the sheet to `target`. */
+	function settle(target, spring, from = 0) {
+		animation.current?.stop();
+		animation.current = null;
+		if (latest.current.reduceMotion) {
+			at.set(target);
+			return;
+		}
+		animation.current = animate(at, target, {
+			...spring,
+			velocity: from
+		});
+	}
+	useEffect(() => {
+		if (!mounted.current) {
+			mounted.current = true;
+			if (busy) at.set(latest.current.threshold);
+			return;
+		}
+		if (busy) settle(latest.current.threshold, REST_SPRING, velocity.current);
+		else settle(0, BACK_SPRING);
+		velocity.current = 0;
+	}, [busy]);
+	useEffect(() => () => {
+		mounted.current = false;
+		animation.current?.stop();
+	}, []);
+	async function refresh(from = 0) {
+		if (disabled || running.current || latest.current.busy) return;
+		running.current = true;
+		velocity.current = from;
+		const started = Date.now();
+		if (!latest.current.controlled) setInternal(true);
+		try {
+			await latest.current.onRefresh?.();
+		} catch {}
+		if (latest.current.controlled) {
+			if (!latest.current.busy) settle(0, BACK_SPRING);
+		} else {
+			const remaining = latest.current.minDuration - (Date.now() - started);
+			if (remaining > 0) await new Promise((resolve) => setTimeout(resolve, remaining));
+			if (mounted.current) setInternal(false);
+		}
+		running.current = false;
+	}
+	function handlePointerDown(event) {
+		swallowClick.current = false;
+		if (disabled || busy || event.button !== 0) return;
+		if (event.currentTarget.scrollTop > 0) return;
+		press.current = {
+			id: event.pointerId,
+			x: event.clientX,
+			y: event.clientY,
+			pulling: false
+		};
+	}
+	function handlePointerMove(event) {
+		const current = press.current;
+		if (!current || current.id !== event.pointerId) return;
+		const dy = event.clientY - current.y;
+		if (!current.pulling) {
+			const dx = Math.abs(event.clientX - current.x);
+			if (dy > SLOP && dy > dx) {
+				current.pulling = true;
+				current.y = event.clientY;
+				event.currentTarget.setPointerCapture(event.pointerId);
+				animation.current?.stop();
+				setPulling(true);
+			} else if (dy < -4 || dx > SLOP) press.current = null;
+			return;
+		}
+		const offset = rubberBand(dy);
+		at.set(offset);
+		setArmed(offset >= threshold);
+	}
+	function handlePointerEnd(event) {
+		const current = press.current;
+		if (!current || current.id !== event.pointerId) return;
+		press.current = null;
+		if (!current.pulling) return;
+		swallowClick.current = true;
+		setPulling(false);
+		setArmed(false);
+		const from = at.getVelocity();
+		if (event.type === "pointerup" && at.get() >= threshold) refresh(from);
+		else settle(0, BACK_SPRING, from);
+	}
+	function handleClickCapture(event) {
+		if (!swallowClick.current) return;
+		swallowClick.current = false;
+		event.preventDefault();
+		event.stopPropagation();
+	}
+	function handleKeyDown(event) {
+		if (event.key !== "Enter" || event.target !== event.currentTarget || event.repeat) return;
+		event.preventDefault();
+		refresh();
+	}
+	const phase = busy ? "refreshing" : pulling ? "pulling" : "idle";
+	const count = Math.min(10, Math.max(3, Math.round(dots)));
+	const rootStyle = {
+		"--ptr-period": `${String(spinPeriod(spin))}ms`,
+		...style
+	};
+	return /* @__PURE__ */ jsxs(MotionConfig, {
+		reducedMotion: "user",
+		children: [/* @__PURE__ */ jsx("style", {
+			href: PREFIX,
+			precedence: "dowel",
+			children: STYLES
+		}), /* @__PURE__ */ jsxs("div", {
+			"data-slot": "pull-to-refresh",
+			"data-phase": phase,
+			"data-armed": armed || void 0,
+			className: cn(pullToRefreshVariants({ fill }), className),
+			style: rootStyle,
+			...props,
+			children: [
+				/* @__PURE__ */ jsx("div", {
+					"aria-hidden": "true",
+					"data-slot": "pull-to-refresh-spinner",
+					className: "pointer-events-none absolute inset-x-0 mx-auto size-15",
+					style: {
+						top: `${String(threshold / 2 - 30)}px`,
+						opacity: "var(--ptr-p, 0)",
+						scale: "calc(0.82 + 0.18 * var(--ptr-p, 0))"
+					},
+					children: /* @__PURE__ */ jsx("span", {
+						"data-slot": "pull-to-refresh-dots",
+						className: "absolute inset-0",
+						children: Array.from({ length: count }, (_, index) => /* @__PURE__ */ jsx("span", {
+							"data-slot": "pull-to-refresh-dot",
+							className: "absolute inset-0 m-auto size-1 rounded-full bg-foreground/35",
+							style: { transform: `rotate(${String(index * 360 / count)}deg) translateY(-${String(RING)}px)` }
+						}, index))
+					})
+				}),
+				/* @__PURE__ */ jsx(motion.div, {
+					ref: sheet,
+					role: "group",
+					"aria-label": label,
+					"aria-describedby": disabled ? void 0 : hintId,
+					"aria-busy": busy || void 0,
+					"aria-disabled": disabled || void 0,
+					tabIndex: 0,
+					"data-slot": "pull-to-refresh-sheet",
+					className: cn("relative z-10 min-h-0 flex-1 overflow-auto overscroll-contain bg-card", stroke && "ring-1 ring-border ring-inset", focusRing),
+					style: {
+						y: at,
+						borderRadius: `${String(corner)}px`,
+						touchAction: atTop ? "pan-x pan-down" : "pan-x pan-y"
+					},
+					onScroll: (event) => setAtTop(event.currentTarget.scrollTop <= 0),
+					onPointerDown: handlePointerDown,
+					onPointerMove: handlePointerMove,
+					onPointerUp: handlePointerEnd,
+					onPointerCancel: handlePointerEnd,
+					onClickCapture: handleClickCapture,
+					onKeyDown: handleKeyDown,
+					children
+				}),
+				showRefreshButton ? /* @__PURE__ */ jsxs(Button, {
+					variant: "ghost",
+					size: "sm",
+					"data-slot": "pull-to-refresh-button",
+					className: "mt-3 self-center",
+					disabled,
+					loading: busy,
+					onClick: () => void refresh(),
+					children: [busy ? null : /* @__PURE__ */ jsxs("svg", {
+						viewBox: "0 0 24 24",
+						fill: "none",
+						stroke: "currentColor",
+						strokeWidth: 2,
+						strokeLinecap: "round",
+						strokeLinejoin: "round",
+						"aria-hidden": "true",
+						children: [/* @__PURE__ */ jsx("path", { d: "M21 12a9 9 0 1 1-9-9c2.52 0 4.93 1 6.74 2.74L21 8" }), /* @__PURE__ */ jsx("path", { d: "M21 3v5h-5" })]
+					}), refreshButtonLabel]
+				}) : null,
+				/* @__PURE__ */ jsx("span", {
+					id: hintId,
+					className: "sr-only",
+					children: hint
+				}),
+				/* @__PURE__ */ jsx("span", {
+					role: "status",
+					"aria-live": "polite",
+					className: "sr-only",
+					children: announcement
+				})
+			]
+		})]
+	});
+}
+//#endregion
+export { PullToRefresh, pullToRefreshVariants, rubberBand, spinPeriod };
+
+//# sourceMappingURL=pull-to-refresh.js.map

package/dist/components/pull-to-refresh/pull-to-refresh.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"pull-to-refresh.js","names":[],"sources":["../../../src/components/pull-to-refresh/pull-to-refresh.tsx"],"sourcesContent":["\"use client\";\n\n// Ported from bencho Pull to refresh (MIT, © 2026 Lorenzo Cabra). See THIRD_PARTY_NOTICES.md.\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport {\n  MotionConfig,\n  animate,\n  motion,\n  useMotionValue,\n  useMotionValueEvent,\n  type AnimationPlaybackControls,\n} from \"motion/react\";\nimport {\n  useEffect,\n  useId,\n  useLayoutEffect,\n  useRef,\n  useState,\n  useSyncExternalStore,\n  type ComponentPropsWithRef,\n  type CSSProperties,\n  type KeyboardEvent,\n  type MouseEvent,\n  type PointerEvent,\n  type ReactNode,\n} from \"react\";\n\nimport { Button } from \"@/components/button\";\nimport { focusRing } from \"@/lib/styles\";\nimport { cn } from \"@/lib/utils\";\n\n/*\n * A sheet you pull down to refresh.\n *\n * `motion` earns its place here (ADR 0014) because the sheet springs to its\n * resting offset — and back to zero — carrying the velocity of the pull. The\n * pull itself writes two custom properties on the root, `--ptr-at` (offset px)\n * and `--ptr-p` (progress 0–1), and the dot ring above the sheet fades and\n * grows from them in CSS.\n *\n * Pulling is never the only way: the sheet is a focusable group where Enter\n * refreshes, and an optional visible button does the same. While refreshing,\n * the sheet is aria-busy and a polite live region says \"Refreshing…\" then\n * \"Refreshed\". The spinning ring is decoration and stops under reduced motion\n * (only allow-listed loaders may be indicators); the busy state and the\n * announcements are what report progress.\n */\n\nconst PREFIX = \"dowel-pull-to-refresh\";\n\n/* Keyframes and [data-slot]/[data-phase] selectors only (the sheet is unlayered). */\nconst STYLES = `\n@keyframes ${PREFIX}-spin{to{rotate:360deg}}\n[data-slot=pull-to-refresh][data-phase=refreshing] [data-slot=pull-to-refresh-dots]{animation:${PREFIX}-spin calc(var(--ptr-period, 2400ms) * var(--motion-scale)) linear infinite}\n`;\n\n/** Pointer travel that decides whether a press is a pull. */\nconst SLOP = 4;\n/** Ring radius for the dots (px). */\nconst RING = 15;\n\nconst REST_SPRING = { type: \"spring\" as const, stiffness: 380, damping: 16 };\nconst BACK_SPRING = { type: \"spring\" as const, stiffness: 260, damping: 22 };\n\nconst REDUCED_MOTION = \"(prefers-reduced-motion: reduce)\";\n\nfunction subscribeToMotionPreference(onChange: () => void) {\n  const query = window.matchMedia(REDUCED_MOTION);\n  query.addEventListener(\"change\", onChange);\n  return () => query.removeEventListener(\"change\", onChange);\n}\n\nfunction usePrefersReducedMotion() {\n  return useSyncExternalStore(\n    subscribeToMotionPreference,\n    () => window.matchMedia(REDUCED_MOTION).matches,\n    () => false,\n  );\n}\n\n/** Rubber-band resistance: near 1:1 for a short pull, 180px of travel gives about 156. */\nexport function rubberBand(distance: number) {\n  return 600 * (1 - Math.exp(-Math.max(0, distance) / 600));\n}\n\n/** Spin (0–100) to the ring's period in ms: 2400 at 50, 4800 at 0, 1200 at 100. */\nexport function spinPeriod(spin: number) {\n  return Math.round(2400 * 2 ** ((50 - Math.min(100, Math.max(0, spin))) / 50));\n}\n\nconst pullToRefreshVariants = cva(\"relative isolate flex flex-col text-card-foreground\", {\n  variants: {\n    /** `dark` renders the block with the dark token set whatever the page theme. */\n    fill: {\n      light: \"\",\n      dark: \"dark\",\n    },\n  },\n  defaultVariants: { fill: \"light\" },\n});\n\ntype Phase = \"idle\" | \"pulling\" | \"refreshing\";\n\nexport interface PullToRefreshProps\n  extends\n    Omit<ComponentPropsWithRef<\"div\">, \"onRefresh\">,\n    VariantProps<typeof pullToRefreshVariants> {\n  /** Runs the refresh. The sheet stays in the refreshing state until a returned promise settles. */\n  onRefresh?: () => Promise<unknown> | void;\n  /** Controlled refreshing state. Leave undefined to let the promise drive it. */\n  refreshing?: boolean;\n  /** Pull distance (px) that arms the refresh; also the resting offset while refreshing. Default 58. */\n  threshold?: number;\n  /** Dots in the ring, 3–10. Default 6. */\n  dots?: number;\n  /** Ring rotation speed, 0–100 (2400ms per turn at 50). Default 50. */\n  spin?: number;\n  /** Sheet radius in px, 0–40. Default 26. */\n  corner?: number;\n  /** A 1px inset hairline on the sheet. */\n  stroke?: boolean;\n  disabled?: boolean;\n  /** Shortest time the refreshing state shows, so a fast refresh still reads (ms). Default 600. */\n  minDuration?: number;\n  /** Names the sheet. Default \"Refreshable content\". */\n  label?: string;\n  /** Instructions linked to the sheet with aria-describedby. */\n  hint?: string;\n  /** Renders a visible Refresh button under the sheet. Default true. */\n  showRefreshButton?: boolean;\n  /** The refresh button's text. Default \"Refresh\". */\n  refreshButtonLabel?: string;\n  /** Announced when a refresh starts. Default \"Refreshing…\". */\n  refreshingLabel?: string;\n  /** Announced when a refresh ends. Default \"Refreshed\". */\n  refreshedLabel?: string;\n  children?: ReactNode;\n}\n\n/** Wraps content in a sheet that refreshes on a pull, Enter, or a button. */\nexport function PullToRefresh({\n  className,\n  style,\n  fill,\n  children,\n  onRefresh,\n  refreshing,\n  threshold = 58,\n  dots = 6,\n  spin = 50,\n  corner = 26,\n  stroke = false,\n  disabled = false,\n  minDuration = 600,\n  label = \"Refreshable content\",\n  hint = \"Pull down, or press Enter, to refresh.\",\n  showRefreshButton = true,\n  refreshButtonLabel = \"Refresh\",\n  refreshingLabel = \"Refreshing…\",\n  refreshedLabel = \"Refreshed\",\n  ...props\n}: PullToRefreshProps) {\n  const controlled = refreshing !== undefined;\n  const [internal, setInternal] = useState(false);\n  const busy = controlled ? refreshing : internal;\n  const [pulling, setPulling] = useState(false);\n  const [armed, setArmed] = useState(false);\n  const [atTop, setAtTop] = useState(true);\n  const [announcement, setAnnouncement] = useState(\"\");\n  const reduceMotion = usePrefersReducedMotion();\n  const hintId = `${PREFIX}-${useId().replace(/:/g, \"\")}`;\n\n  const sheet = useRef<HTMLDivElement>(null);\n  const at = useMotionValue(0);\n  const animation = useRef<AnimationPlaybackControls | null>(null);\n  const press = useRef<{ id: number; x: number; y: number; pulling: boolean } | null>(null);\n  const swallowClick = useRef(false);\n  const running = useRef(false);\n  const velocity = useRef(0);\n  const mounted = useRef(false);\n  const latest = useRef({ onRefresh, minDuration, reduceMotion, threshold, busy, controlled });\n  useLayoutEffect(() => {\n    latest.current = { onRefresh, minDuration, reduceMotion, threshold, busy, controlled };\n  });\n\n  // Announce each change of state, adjusting during render rather than in an effect.\n  const [announced, setAnnounced] = useState(busy);\n  if (announced !== busy) {\n    setAnnounced(busy);\n    setAnnouncement(busy ? refreshingLabel : refreshedLabel);\n  }\n\n  useMotionValueEvent(at, \"change\", (value) => {\n    const root = sheet.current?.parentElement;\n    if (!root) return;\n    const progress = Math.min(1, Math.max(0, value / latest.current.threshold));\n    root.style.setProperty(\"--ptr-at\", `${String(value)}px`);\n    root.style.setProperty(\"--ptr-p\", String(progress));\n  });\n\n  /** Springs (or, under reduced motion, jumps) the sheet to `target`. */\n  function settle(target: number, spring: typeof REST_SPRING, from = 0) {\n    animation.current?.stop();\n    animation.current = null;\n    if (latest.current.reduceMotion) {\n      at.set(target);\n      return;\n    }\n    animation.current = animate(at, target, { ...spring, velocity: from });\n  }\n\n  useEffect(() => {\n    if (!mounted.current) {\n      mounted.current = true;\n      if (busy) at.set(latest.current.threshold);\n      return;\n    }\n    if (busy) settle(latest.current.threshold, REST_SPRING, velocity.current);\n    else settle(0, BACK_SPRING);\n    velocity.current = 0;\n    // Only a change of state moves the sheet.\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [busy]);\n\n  useEffect(\n    () => () => {\n      mounted.current = false;\n      animation.current?.stop();\n    },\n    [],\n  );\n\n  async function refresh(from = 0) {\n    if (disabled || running.current || latest.current.busy) return;\n    running.current = true;\n    velocity.current = from;\n    const started = Date.now();\n    if (!latest.current.controlled) setInternal(true);\n    try {\n      await latest.current.onRefresh?.();\n    } catch {\n      // A failed refresh still ends; reporting the error is the caller's job.\n    }\n    if (latest.current.controlled) {\n      // A controlled sheet waits for `refreshing`; if it never turned on, settle back.\n      if (!latest.current.busy) settle(0, BACK_SPRING);\n    } else {\n      const remaining = latest.current.minDuration - (Date.now() - started);\n      if (remaining > 0) await new Promise((resolve) => setTimeout(resolve, remaining));\n      if (mounted.current) setInternal(false);\n    }\n    running.current = false;\n  }\n\n  function handlePointerDown(event: PointerEvent<HTMLDivElement>) {\n    swallowClick.current = false;\n    if (disabled || busy || event.button !== 0) return;\n    if (event.currentTarget.scrollTop > 0) return;\n    press.current = { id: event.pointerId, x: event.clientX, y: event.clientY, pulling: false };\n  }\n\n  function handlePointerMove(event: PointerEvent<HTMLDivElement>) {\n    const current = press.current;\n    if (!current || current.id !== event.pointerId) return;\n    const dy = event.clientY - current.y;\n    if (!current.pulling) {\n      const dx = Math.abs(event.clientX - current.x);\n      if (dy > SLOP && dy > dx) {\n        current.pulling = true;\n        current.y = event.clientY;\n        event.currentTarget.setPointerCapture(event.pointerId);\n        animation.current?.stop();\n        setPulling(true);\n      } else if (dy < -SLOP || dx > SLOP) {\n        press.current = null;\n      }\n      return;\n    }\n    const offset = rubberBand(dy);\n    at.set(offset);\n    setArmed(offset >= threshold);\n  }\n\n  function handlePointerEnd(event: PointerEvent<HTMLDivElement>) {\n    const current = press.current;\n    if (!current || current.id !== event.pointerId) return;\n    press.current = null;\n    if (!current.pulling) return;\n    swallowClick.current = true;\n    setPulling(false);\n    setArmed(false);\n    const from = at.getVelocity();\n    if (event.type === \"pointerup\" && at.get() >= threshold) void refresh(from);\n    else settle(0, BACK_SPRING, from);\n  }\n\n  function handleClickCapture(event: MouseEvent<HTMLDivElement>) {\n    // The click a pull leaves behind must not activate what it landed on.\n    if (!swallowClick.current) return;\n    swallowClick.current = false;\n    event.preventDefault();\n    event.stopPropagation();\n  }\n\n  function handleKeyDown(event: KeyboardEvent<HTMLDivElement>) {\n    if (event.key !== \"Enter\" || event.target !== event.currentTarget || event.repeat) return;\n    event.preventDefault();\n    void refresh();\n  }\n\n  const phase: Phase = busy ? \"refreshing\" : pulling ? \"pulling\" : \"idle\";\n  const count = Math.min(10, Math.max(3, Math.round(dots)));\n  const rootStyle = {\n    \"--ptr-period\": `${String(spinPeriod(spin))}ms`,\n    ...style,\n  } as CSSProperties;\n\n  return (\n    <MotionConfig reducedMotion=\"user\">\n      <style href={PREFIX} precedence=\"dowel\">\n        {STYLES}\n      </style>\n      <div\n        data-slot=\"pull-to-refresh\"\n        data-phase={phase}\n        data-armed={armed || undefined}\n        className={cn(pullToRefreshVariants({ fill }), className)}\n        style={rootStyle}\n        {...props}\n      >\n        <div\n          aria-hidden=\"true\"\n          data-slot=\"pull-to-refresh-spinner\"\n          className=\"pointer-events-none absolute inset-x-0 mx-auto size-15\"\n          style={{\n            top: `${String(threshold / 2 - 30)}px`,\n            opacity: \"var(--ptr-p, 0)\",\n            scale: \"calc(0.82 + 0.18 * var(--ptr-p, 0))\",\n          }}\n        >\n          <span data-slot=\"pull-to-refresh-dots\" className=\"absolute inset-0\">\n            {Array.from({ length: count }, (_, index) => (\n              <span\n                key={index}\n                data-slot=\"pull-to-refresh-dot\"\n                className=\"absolute inset-0 m-auto size-1 rounded-full bg-foreground/35\"\n                style={{\n                  transform: `rotate(${String((index * 360) / count)}deg) translateY(-${String(RING)}px)`,\n                }}\n              />\n            ))}\n          </span>\n        </div>\n        <motion.div\n          ref={sheet}\n          role=\"group\"\n          aria-label={label}\n          aria-describedby={disabled ? undefined : hintId}\n          aria-busy={busy || undefined}\n          aria-disabled={disabled || undefined}\n          tabIndex={0}\n          data-slot=\"pull-to-refresh-sheet\"\n          className={cn(\n            \"relative z-10 min-h-0 flex-1 overflow-auto overscroll-contain bg-card\",\n            stroke && \"ring-1 ring-border ring-inset\",\n            focusRing,\n          )}\n          style={{\n            y: at,\n            borderRadius: `${String(corner)}px`,\n            touchAction: atTop ? \"pan-x pan-down\" : \"pan-x pan-y\",\n          }}\n          onScroll={(event) => setAtTop(event.currentTarget.scrollTop <= 0)}\n          onPointerDown={handlePointerDown}\n          onPointerMove={handlePointerMove}\n          onPointerUp={handlePointerEnd}\n          onPointerCancel={handlePointerEnd}\n          onClickCapture={handleClickCapture}\n          onKeyDown={handleKeyDown}\n        >\n          {children}\n        </motion.div>\n        {showRefreshButton ? (\n          <Button\n            variant=\"ghost\"\n            size=\"sm\"\n            data-slot=\"pull-to-refresh-button\"\n            className=\"mt-3 self-center\"\n            disabled={disabled}\n            loading={busy}\n            onClick={() => void refresh()}\n          >\n            {busy ? null : (\n              <svg\n                viewBox=\"0 0 24 24\"\n                fill=\"none\"\n                stroke=\"currentColor\"\n                strokeWidth={2}\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n                aria-hidden=\"true\"\n              >\n                <path d=\"M21 12a9 9 0 1 1-9-9c2.52 0 4.93 1 6.74 2.74L21 8\" />\n                <path d=\"M21 3v5h-5\" />\n              </svg>\n            )}\n            {refreshButtonLabel}\n          </Button>\n        ) : null}\n        <span id={hintId} className=\"sr-only\">\n          {hint}\n        </span>\n        <span role=\"status\" aria-live=\"polite\" className=\"sr-only\">\n          {announcement}\n        </span>\n      </div>\n    </MotionConfig>\n  );\n}\n\nexport { pullToRefreshVariants };\n"],"mappings":"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"}

package/dist/components/radial-menu/index.d.ts

@@ -0,0 +1,2 @@
+import { RadialMenu, RadialMenuItem, RadialMenuProps, radialMenuVariants, radialPosition } from "./radial-menu.js";
+export { RadialMenu, type RadialMenuItem, type RadialMenuProps, radialMenuVariants, radialPosition };

package/dist/components/radial-menu/index.js

@@ -0,0 +1,2 @@
+import { RadialMenu, radialMenuVariants, radialPosition } from "./radial-menu.js";
+export { RadialMenu, radialMenuVariants, radialPosition };

package/dist/components/radial-menu/meta.js

@@ -0,0 +1,17 @@
+import { defineMeta } from "../../registry/schema.js";
+//#region src/components/radial-menu/meta.ts
+const meta = defineMeta({
+	name: "radial-menu",
+	title: "Radial Menu",
+	description: "A round button whose options fan out along an arc: press and drag onto one, click, or walk the ring with the keyboard.",
+	category: "navigation",
+	status: "beta",
+	dependencies: ["class-variance-authority"],
+	registryDependencies: [],
+	files: ["radial-menu.tsx"],
+	a11y: "The core is a menu button (aria-haspopup=\"menu\", aria-expanded, aria-controls) named by `label`; the options are role=\"menuitem\" buttons named by their labels, in a role=\"menu\" that is inert and aria-hidden while closed. Enter/Space opens and focuses the first option (Down/Up open onto the first or last); Left/Right and Up/Down walk around the ring with wrap-around (Left/Right follow the visual order in RTL), Home/End jump, Enter/Space select and return focus to the core, Escape closes and refocuses the core, Tab and an outside press close. The press-and-drag marking gesture is a pointer shortcut only; clicking and the keyboard reach every option. Captions are aria-hidden duplicates of the names. The fly-out settles instantly under reduced motion."
+});
+//#endregion
+export { meta };
+
+//# sourceMappingURL=meta.js.map

package/dist/components/radial-menu/meta.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"meta.js","names":[],"sources":["../../../src/components/radial-menu/meta.ts"],"sourcesContent":["import { defineMeta } from \"@/registry/schema\";\n\nexport const meta = defineMeta({\n  name: \"radial-menu\",\n  title: \"Radial Menu\",\n  description:\n    \"A round button whose options fan out along an arc: press and drag onto one, click, or walk the ring with the keyboard.\",\n  category: \"navigation\",\n  status: \"beta\",\n  dependencies: [\"class-variance-authority\"],\n  registryDependencies: [],\n  files: [\"radial-menu.tsx\"],\n  a11y:\n    'The core is a menu button (aria-haspopup=\"menu\", aria-expanded, aria-controls) named by `label`; the ' +\n    'options are role=\"menuitem\" buttons named by their labels, in a role=\"menu\" that is inert and ' +\n    \"aria-hidden while closed. Enter/Space opens and focuses the first option (Down/Up open onto the first \" +\n    \"or last); Left/Right and Up/Down walk around the ring with wrap-around (Left/Right follow the visual \" +\n    \"order in RTL), Home/End jump, Enter/Space select and return focus to the core, Escape closes and \" +\n    \"refocuses the core, Tab and an outside press close. The press-and-drag marking gesture is a pointer \" +\n    \"shortcut only; clicking and the keyboard reach every option. Captions are aria-hidden duplicates of \" +\n    \"the names. The fly-out settles instantly under reduced motion.\",\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,iBAAiB;CACzB,MACE;AAQJ,CAAC"}

package/dist/components/radial-menu/radial-menu.d.ts

@@ -0,0 +1,44 @@
+import { VariantProps } from "class-variance-authority";
+import { ComponentPropsWithRef, ReactNode } from "react";
+//#region src/components/radial-menu/radial-menu.d.ts
+declare const radialMenuVariants: (props?: ({
+  part?: "core" | "item" | null | undefined;
+  tone?: "default" | "inverted" | null | undefined;
+  stroke?: boolean | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+interface RadialMenuItem {
+  value: string;
+  /** The option's accessible name, also shown as its caption. */
+  label: string;
+  /** Decorative icon. */
+  icon: ReactNode;
+  disabled?: boolean;
+}
+interface RadialMenuProps extends Omit<ComponentPropsWithRef<"div">, "onSelect">, Omit<VariantProps<typeof radialMenuVariants>, "part"> {
+  items: RadialMenuItem[];
+  /** Called with the chosen item's value. The menu then closes. */
+  onSelect?: (value: string) => void;
+  /** The core button's accessible name, and the menu's. */
+  label?: string;
+  /** The core's icon. It turns 135° while open, so a plus reads as a cross. */
+  icon?: ReactNode;
+  /** Distance of the options from the core's centre, in px. */
+  radius?: number;
+  /** Angular spread in degrees, centred on straight up. */
+  arc?: number;
+  /** Delay between options flying out, in ms. */
+  stagger?: number;
+  open?: boolean;
+  defaultOpen?: boolean;
+  onOpenChange?: (open: boolean) => void;
+}
+/** Offset of option `index` of `count` from the core's centre. */
+declare function radialPosition(index: number, count: number, arc: number, radius: number, rtl?: boolean): {
+  x: number;
+  y: number;
+};
+/** A round button that fans out a menu of options along an arc. */
+declare function RadialMenu({ items, onSelect, label, icon, radius, arc, stagger, open: openProp, defaultOpen, onOpenChange, tone, stroke, className, ref, onBlur, ...props }: RadialMenuProps): import("react").JSX.Element;
+//#endregion
+export { RadialMenu, RadialMenuItem, RadialMenuProps, radialMenuVariants, radialPosition };
+//# sourceMappingURL=radial-menu.d.ts.map

package/dist/components/radial-menu/radial-menu.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"radial-menu.d.ts","names":[],"sources":["../../../src/components/radial-menu/radial-menu.tsx"],"mappings":";;;cA6CM,qBAAkB;;;;6CAmBvB;UAiBgB;EACf;;EAEA;;EAEA,MAAM;EACN;;UAGe,wBAEb,KAAK,2CACL,KAAK,oBAAoB;EAC3B,OAAO;;EAEP,YAAY;;EAEZ;;EAEA,OAAO;;EAEP;;EAEA;;EAEA;EACA;EACA;EACA,gBAAgB;;;iBAIF,eACd,eACA,eACA,aACA,gBACA;EACG;EAAW;;;iBAaA,aACd,OACA,UACA,OACA,MACA,QACA,KACA,SACA,MAAM,UACN,aACA,cACA,MACA,QACA,WACA,KACA,WACG,SACF,kCAAe,IAAA"}