@windmorph/react 0.0.0-stage → 0.1.1

package/dist/tokens/motion.js

@@ -0,0 +1,126 @@
+//#region src/tokens/motion.ts
+/**
+* M3 Expressive motion: spring tokens for the `expressive` and `standard` motion
+* schemes (Compose `ExpressiveMotionTokens` / `StandardMotionTokens`), plus the
+* legacy duration + easing tokens for consumers migrating from baseline M3.
+*
+* Compose springs are expressed as a damping ratio and stiffness with mass 1.
+* Motion (`motion/react`) takes a damping coefficient, so
+* `damping = 2 * dampingRatio * sqrt(stiffness * mass)`.
+*/
+const MOTION_SCHEMES = ["expressive", "standard"];
+const DEFAULT_MOTION_SCHEME = "expressive";
+const SPRING_FAMILIES = ["spatial", "effects"];
+const SPRING_SPEEDS = [
+	"fast",
+	"default",
+	"slow"
+];
+const spring = (dampingRatio, stiffness) => ({
+	dampingRatio,
+	stiffness
+});
+const EFFECTS = {
+	fast: spring(1, 3800),
+	default: spring(1, 1600),
+	slow: spring(1, 800)
+};
+const SPRINGS = {
+	expressive: {
+		spatial: {
+			fast: spring(.6, 800),
+			default: spring(.8, 380),
+			slow: spring(.8, 200)
+		},
+		effects: EFFECTS
+	},
+	standard: {
+		spatial: {
+			fast: spring(.9, 1400),
+			default: spring(.9, 700),
+			slow: spring(.9, 300)
+		},
+		effects: EFFECTS
+	}
+};
+function toMotionSpring({ dampingRatio, stiffness }) {
+	const mass = 1;
+	return {
+		type: "spring",
+		stiffness,
+		damping: Math.round(2 * dampingRatio * Math.sqrt(stiffness * mass) * 100) / 100,
+		mass
+	};
+}
+/** Normalised displacement threshold at which a spring is treated as settled. */
+const SETTLE_THRESHOLD = .001;
+/**
+* Position of a unit step spring (0 → 1, mass 1) at time `t` seconds,
+* using the closed-form solution for under- and critically-damped springs.
+*/
+function springPosition({ dampingRatio: z, stiffness: k }, t) {
+	const w0 = Math.sqrt(k);
+	if (z < 1) {
+		const wd = w0 * Math.sqrt(1 - z * z);
+		return 1 - Math.exp(-z * w0 * t) * (Math.cos(wd * t) + z * w0 / wd * Math.sin(wd * t));
+	}
+	return 1 - Math.exp(-w0 * t) * (1 + w0 * t);
+}
+/** Time in ms after which the spring stays within the settle threshold of its target. */
+function springSettleDuration(token) {
+	const step = .001;
+	let lastUnsettled = 0;
+	for (let t = 0; t < 5; t += step) if (Math.abs(1 - springPosition(token, t)) > SETTLE_THRESHOLD) lastUnsettled = t;
+	return Math.ceil(lastUnsettled * 1e3 / 10) * 10;
+}
+/**
+* CSS `linear()` approximation of a spring, sampled at evenly spaced points
+* over its settle duration. Pair it with {@link springSettleDuration}.
+*/
+function springToLinearEasing(token, samples = 40) {
+	const duration = springSettleDuration(token) / 1e3;
+	const points = [];
+	for (let i = 0; i <= samples; i++) {
+		const value = i === samples ? 1 : springPosition(token, duration * i / samples);
+		points.push(String(Math.round(value * 1e4) / 1e4));
+	}
+	return `linear(${points.join(", ")})`;
+}
+/** Legacy M3 durations (Compose `MotionTokens`), in ms. */
+const LEGACY_DURATIONS = {
+	"short-1": 50,
+	"short-2": 100,
+	"short-3": 150,
+	"short-4": 200,
+	"medium-1": 250,
+	"medium-2": 300,
+	"medium-3": 350,
+	"medium-4": 400,
+	"long-1": 450,
+	"long-2": 500,
+	"long-3": 550,
+	"long-4": 600,
+	"extra-long-1": 700,
+	"extra-long-2": 800,
+	"extra-long-3": 900,
+	"extra-long-4": 1e3
+};
+/** Legacy M3 easing curves (Compose `MotionTokens`). */
+const LEGACY_EASINGS = {
+	emphasized: "cubic-bezier(0.2, 0, 0, 1)",
+	"emphasized-accelerate": "cubic-bezier(0.3, 0, 0.8, 0.15)",
+	"emphasized-decelerate": "cubic-bezier(0.05, 0.7, 0.1, 1)",
+	standard: "cubic-bezier(0.2, 0, 0, 1)",
+	"standard-accelerate": "cubic-bezier(0.3, 0, 1, 1)",
+	"standard-decelerate": "cubic-bezier(0, 0, 0, 1)",
+	legacy: "cubic-bezier(0.4, 0, 0.2, 1)",
+	"legacy-accelerate": "cubic-bezier(0.4, 0, 1, 1)",
+	"legacy-decelerate": "cubic-bezier(0, 0, 0.2, 1)",
+	linear: "cubic-bezier(0, 0, 1, 1)"
+};
+/** `<family>-<speed>` names used by the `ease-m3-*` / `duration-m3-*` utilities. */
+const SPRING_TOKEN_NAMES = SPRING_FAMILIES.flatMap((family) => SPRING_SPEEDS.map((speed) => `${family}-${speed}`));
+//#endregion
+export { DEFAULT_MOTION_SCHEME, LEGACY_DURATIONS, LEGACY_EASINGS, MOTION_SCHEMES, SPRINGS, SPRING_FAMILIES, SPRING_SPEEDS, SPRING_TOKEN_NAMES, springPosition, springSettleDuration, springToLinearEasing, toMotionSpring };
+
+//# sourceMappingURL=motion.js.map

package/dist/tokens/motion.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"motion.js","names":[],"sources":["../../src/tokens/motion.ts"],"sourcesContent":["/**\n * M3 Expressive motion: spring tokens for the `expressive` and `standard` motion\n * schemes (Compose `ExpressiveMotionTokens` / `StandardMotionTokens`), plus the\n * legacy duration + easing tokens for consumers migrating from baseline M3.\n *\n * Compose springs are expressed as a damping ratio and stiffness with mass 1.\n * Motion (`motion/react`) takes a damping coefficient, so\n * `damping = 2 * dampingRatio * sqrt(stiffness * mass)`.\n */\n\nexport const MOTION_SCHEMES = ['expressive', 'standard'] as const;\nexport type MotionScheme = (typeof MOTION_SCHEMES)[number];\nexport const DEFAULT_MOTION_SCHEME: MotionScheme = 'expressive';\n\nexport const SPRING_FAMILIES = ['spatial', 'effects'] as const;\nexport type SpringFamily = (typeof SPRING_FAMILIES)[number];\n\nexport const SPRING_SPEEDS = ['fast', 'default', 'slow'] as const;\nexport type SpringSpeed = (typeof SPRING_SPEEDS)[number];\n\nexport interface SpringToken {\n  dampingRatio: number;\n  stiffness: number;\n}\n\ntype SpringScheme = Record<SpringFamily, Record<SpringSpeed, SpringToken>>;\n\nconst spring = (dampingRatio: number, stiffness: number): SpringToken => ({\n  dampingRatio,\n  stiffness,\n});\n\nconst EFFECTS = {\n  fast: spring(1, 3800),\n  default: spring(1, 1600),\n  slow: spring(1, 800),\n};\n\nexport const SPRINGS: Record<MotionScheme, SpringScheme> = {\n  expressive: {\n    spatial: { fast: spring(0.6, 800), default: spring(0.8, 380), slow: spring(0.8, 200) },\n    effects: EFFECTS,\n  },\n  standard: {\n    spatial: { fast: spring(0.9, 1400), default: spring(0.9, 700), slow: spring(0.9, 300) },\n    effects: EFFECTS,\n  },\n};\n\n/** A spring transition in the shape Motion's `transition` prop expects. */\nexport interface MotionSpring {\n  type: 'spring';\n  stiffness: number;\n  damping: number;\n  mass: number;\n}\n\nexport function toMotionSpring({ dampingRatio, stiffness }: SpringToken): MotionSpring {\n  const mass = 1;\n  return {\n    type: 'spring',\n    stiffness,\n    damping: Math.round(2 * dampingRatio * Math.sqrt(stiffness * mass) * 100) / 100,\n    mass,\n  };\n}\n\n/** Normalised displacement threshold at which a spring is treated as settled. */\nconst SETTLE_THRESHOLD = 0.001;\n\n/**\n * Position of a unit step spring (0 → 1, mass 1) at time `t` seconds,\n * using the closed-form solution for under- and critically-damped springs.\n */\nexport function springPosition({ dampingRatio: z, stiffness: k }: SpringToken, t: number): number {\n  const w0 = Math.sqrt(k);\n  if (z < 1) {\n    const wd = w0 * Math.sqrt(1 - z * z);\n    return 1 - Math.exp(-z * w0 * t) * (Math.cos(wd * t) + ((z * w0) / wd) * Math.sin(wd * t));\n  }\n  return 1 - Math.exp(-w0 * t) * (1 + w0 * t);\n}\n\n/** Time in ms after which the spring stays within the settle threshold of its target. */\nexport function springSettleDuration(token: SpringToken): number {\n  const step = 0.001;\n  let lastUnsettled = 0;\n  for (let t = 0; t < 5; t += step) {\n    if (Math.abs(1 - springPosition(token, t)) > SETTLE_THRESHOLD) lastUnsettled = t;\n  }\n  return Math.ceil((lastUnsettled * 1000) / 10) * 10;\n}\n\n/**\n * CSS `linear()` approximation of a spring, sampled at evenly spaced points\n * over its settle duration. Pair it with {@link springSettleDuration}.\n */\nexport function springToLinearEasing(token: SpringToken, samples = 40): string {\n  const duration = springSettleDuration(token) / 1000;\n  const points: string[] = [];\n  for (let i = 0; i <= samples; i++) {\n    const value = i === samples ? 1 : springPosition(token, (duration * i) / samples);\n    points.push(String(Math.round(value * 10000) / 10000));\n  }\n  return `linear(${points.join(', ')})`;\n}\n\n/** Legacy M3 durations (Compose `MotionTokens`), in ms. */\nexport const LEGACY_DURATIONS = {\n  'short-1': 50,\n  'short-2': 100,\n  'short-3': 150,\n  'short-4': 200,\n  'medium-1': 250,\n  'medium-2': 300,\n  'medium-3': 350,\n  'medium-4': 400,\n  'long-1': 450,\n  'long-2': 500,\n  'long-3': 550,\n  'long-4': 600,\n  'extra-long-1': 700,\n  'extra-long-2': 800,\n  'extra-long-3': 900,\n  'extra-long-4': 1000,\n} as const;\n\n/** Legacy M3 easing curves (Compose `MotionTokens`). */\nexport const LEGACY_EASINGS = {\n  emphasized: 'cubic-bezier(0.2, 0, 0, 1)',\n  'emphasized-accelerate': 'cubic-bezier(0.3, 0, 0.8, 0.15)',\n  'emphasized-decelerate': 'cubic-bezier(0.05, 0.7, 0.1, 1)',\n  standard: 'cubic-bezier(0.2, 0, 0, 1)',\n  'standard-accelerate': 'cubic-bezier(0.3, 0, 1, 1)',\n  'standard-decelerate': 'cubic-bezier(0, 0, 0, 1)',\n  legacy: 'cubic-bezier(0.4, 0, 0.2, 1)',\n  'legacy-accelerate': 'cubic-bezier(0.4, 0, 1, 1)',\n  'legacy-decelerate': 'cubic-bezier(0, 0, 0.2, 1)',\n  linear: 'cubic-bezier(0, 0, 1, 1)',\n} as const;\n\n/** `<family>-<speed>` names used by the `ease-m3-*` / `duration-m3-*` utilities. */\nexport const SPRING_TOKEN_NAMES = SPRING_FAMILIES.flatMap((family) =>\n  SPRING_SPEEDS.map((speed) => `${family}-${speed}` as const),\n);\n"],"mappings":";;;;;;;;;;AAUA,MAAa,iBAAiB,CAAC,cAAc,UAAU;AAEvD,MAAa,wBAAsC;AAEnD,MAAa,kBAAkB,CAAC,WAAW,SAAS;AAGpD,MAAa,gBAAgB;CAAC;CAAQ;CAAW;AAAM;AAUvD,MAAM,UAAU,cAAsB,eAAoC;CACxE;CACA;AACF;AAEA,MAAM,UAAU;CACd,MAAM,OAAO,GAAG,IAAI;CACpB,SAAS,OAAO,GAAG,IAAI;CACvB,MAAM,OAAO,GAAG,GAAG;AACrB;AAEA,MAAa,UAA8C;CACzD,YAAY;EACV,SAAS;GAAE,MAAM,OAAO,IAAK,GAAG;GAAG,SAAS,OAAO,IAAK,GAAG;GAAG,MAAM,OAAO,IAAK,GAAG;EAAE;EACrF,SAAS;CACX;CACA,UAAU;EACR,SAAS;GAAE,MAAM,OAAO,IAAK,IAAI;GAAG,SAAS,OAAO,IAAK,GAAG;GAAG,MAAM,OAAO,IAAK,GAAG;EAAE;EACtF,SAAS;CACX;AACF;AAUA,SAAgB,eAAe,EAAE,cAAc,aAAwC;CACrF,MAAM,OAAO;CACb,OAAO;EACL,MAAM;EACN;EACA,SAAS,KAAK,MAAM,IAAI,eAAe,KAAK,KAAK,YAAY,IAAI,IAAI,GAAG,IAAI;EAC5E;CACF;AACF;;AAGA,MAAM,mBAAmB;;;;;AAMzB,SAAgB,eAAe,EAAE,cAAc,GAAG,WAAW,KAAkB,GAAmB;CAChG,MAAM,KAAK,KAAK,KAAK,CAAC;CACtB,IAAI,IAAI,GAAG;EACT,MAAM,KAAK,KAAK,KAAK,KAAK,IAAI,IAAI,CAAC;EACnC,OAAO,IAAI,KAAK,IAAI,CAAC,IAAI,KAAK,CAAC,KAAK,KAAK,IAAI,KAAK,CAAC,IAAM,IAAI,KAAM,KAAM,KAAK,IAAI,KAAK,CAAC;CAC1F;CACA,OAAO,IAAI,KAAK,IAAI,CAAC,KAAK,CAAC,KAAK,IAAI,KAAK;AAC3C;;AAGA,SAAgB,qBAAqB,OAA4B;CAC/D,MAAM,OAAO;CACb,IAAI,gBAAgB;CACpB,KAAK,IAAI,IAAI,GAAG,IAAI,GAAG,KAAK,MAC1B,IAAI,KAAK,IAAI,IAAI,eAAe,OAAO,CAAC,CAAC,IAAI,kBAAkB,gBAAgB;CAEjF,OAAO,KAAK,KAAM,gBAAgB,MAAQ,EAAE,IAAI;AAClD;;;;;AAMA,SAAgB,qBAAqB,OAAoB,UAAU,IAAY;CAC7E,MAAM,WAAW,qBAAqB,KAAK,IAAI;CAC/C,MAAM,SAAmB,CAAC;CAC1B,KAAK,IAAI,IAAI,GAAG,KAAK,SAAS,KAAK;EACjC,MAAM,QAAQ,MAAM,UAAU,IAAI,eAAe,OAAQ,WAAW,IAAK,OAAO;EAChF,OAAO,KAAK,OAAO,KAAK,MAAM,QAAQ,GAAK,IAAI,GAAK,CAAC;CACvD;CACA,OAAO,UAAU,OAAO,KAAK,IAAI,EAAE;AACrC;;AAGA,MAAa,mBAAmB;CAC9B,WAAW;CACX,WAAW;CACX,WAAW;CACX,WAAW;CACX,YAAY;CACZ,YAAY;CACZ,YAAY;CACZ,YAAY;CACZ,UAAU;CACV,UAAU;CACV,UAAU;CACV,UAAU;CACV,gBAAgB;CAChB,gBAAgB;CAChB,gBAAgB;CAChB,gBAAgB;AAClB;;AAGA,MAAa,iBAAiB;CAC5B,YAAY;CACZ,yBAAyB;CACzB,yBAAyB;CACzB,UAAU;CACV,uBAAuB;CACvB,uBAAuB;CACvB,QAAQ;CACR,qBAAqB;CACrB,qBAAqB;CACrB,QAAQ;AACV;;AAGA,MAAa,qBAAqB,gBAAgB,SAAS,WACzD,cAAc,KAAK,UAAU,GAAG,OAAO,GAAG,OAAgB,CAC5D"}

package/dist/tokens/shape.d.ts

@@ -0,0 +1,22 @@
+//#region src/tokens/shape.d.ts
+/**
+ * M3 corner-radius scale (Compose `ShapeTokens`, dp → px 1:1).
+ * Emitted as `--md-sys-shape-corner-<name>` and the `rounded-corner-<name>` utilities.
+ */
+export declare const CORNERS: {
+  readonly none: "0px";
+  readonly 'extra-small': "4px";
+  readonly small: "8px";
+  readonly medium: "12px";
+  readonly large: "16px";
+  readonly 'large-increased': "20px";
+  readonly 'extra-large': "28px";
+  readonly 'extra-large-increased': "32px";
+  readonly 'extra-extra-large': "48px";
+  readonly full: "9999px";
+};
+/** A step of the M3 corner scale, from `none` to `full`. */
+export type CornerName = keyof typeof CORNERS;
+export declare const CORNER_NAMES: CornerName[];
+//#endregion
+//# sourceMappingURL=shape.d.ts.map

package/dist/tokens/shape.js

@@ -0,0 +1,22 @@
+//#region src/tokens/shape.ts
+/**
+* M3 corner-radius scale (Compose `ShapeTokens`, dp → px 1:1).
+* Emitted as `--md-sys-shape-corner-<name>` and the `rounded-corner-<name>` utilities.
+*/
+const CORNERS = {
+	none: "0px",
+	"extra-small": "4px",
+	small: "8px",
+	medium: "12px",
+	large: "16px",
+	"large-increased": "20px",
+	"extra-large": "28px",
+	"extra-large-increased": "32px",
+	"extra-extra-large": "48px",
+	full: "9999px"
+};
+const CORNER_NAMES = Object.keys(CORNERS);
+//#endregion
+export { CORNERS, CORNER_NAMES };
+
+//# sourceMappingURL=shape.js.map

package/dist/tokens/shape.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"shape.js","names":[],"sources":["../../src/tokens/shape.ts"],"sourcesContent":["/**\n * M3 corner-radius scale (Compose `ShapeTokens`, dp → px 1:1).\n * Emitted as `--md-sys-shape-corner-<name>` and the `rounded-corner-<name>` utilities.\n */\nexport const CORNERS = {\n  none: '0px',\n  'extra-small': '4px',\n  small: '8px',\n  medium: '12px',\n  large: '16px',\n  'large-increased': '20px',\n  'extra-large': '28px',\n  'extra-large-increased': '32px',\n  'extra-extra-large': '48px',\n  full: '9999px',\n} as const;\n\n/** A step of the M3 corner scale, from `none` to `full`. */\nexport type CornerName = keyof typeof CORNERS;\nexport const CORNER_NAMES = Object.keys(CORNERS) as CornerName[];\n"],"mappings":";;;;;AAIA,MAAa,UAAU;CACrB,MAAM;CACN,eAAe;CACf,OAAO;CACP,QAAQ;CACR,OAAO;CACP,mBAAmB;CACnB,eAAe;CACf,yBAAyB;CACzB,qBAAqB;CACrB,MAAM;AACR;AAIA,MAAa,eAAe,OAAO,KAAK,OAAO"}

package/dist/tokens/spring-velocity.d.ts

@@ -0,0 +1,19 @@
+import { SpringToken } from "./motion.js";
+//#region src/tokens/spring-velocity.d.ts
+/**
+ * Progress (0 → 1) at time `t` seconds of a spring that starts with a velocity, as Compose's
+ * `animateTo(target, initialVelocity)` runs one: `velocity` is in distances per second, where
+ * the distance is the whole way to the target (positive towards it).
+ */
+export declare function springProgressWithVelocity({ dampingRatio: z, stiffness: k }: SpringToken, velocity: number, t: number): number;
+/**
+ * A spring that starts with a velocity (see {@link springProgressWithVelocity}) as a CSS
+ * `linear()` easing and its settle duration in ms, for a transition that continues a gesture
+ * (a released sheet keeps its speed rather than starting from rest).
+ */
+export declare function springWithVelocityToLinearEasing(token: SpringToken, velocity: number, samples?: number): {
+  easing: string;
+  duration: number;
+};
+//#endregion
+//# sourceMappingURL=spring-velocity.d.ts.map

package/dist/tokens/spring-velocity.js

@@ -0,0 +1,44 @@
+//#region src/tokens/spring-velocity.ts
+/**
+* `springSettleDuration`'s threshold (`motion.ts`), repeated here so this module doesn't widen
+* the public tokens; the tokens test checks a resting spring settles at the same time.
+*/
+const SETTLE_THRESHOLD = .001;
+/**
+* Progress (0 → 1) at time `t` seconds of a spring that starts with a velocity, as Compose's
+* `animateTo(target, initialVelocity)` runs one: `velocity` is in distances per second, where
+* the distance is the whole way to the target (positive towards it).
+*/
+function springProgressWithVelocity({ dampingRatio: z, stiffness: k }, velocity, t) {
+	const w0 = Math.sqrt(k);
+	if (z < 1) {
+		const wd = w0 * Math.sqrt(1 - z * z);
+		const b = (z * w0 - velocity) / wd;
+		return 1 - Math.exp(-z * w0 * t) * (Math.cos(wd * t) + b * Math.sin(wd * t));
+	}
+	return 1 - Math.exp(-w0 * t) * (1 + (w0 - velocity) * t);
+}
+/**
+* A spring that starts with a velocity (see {@link springProgressWithVelocity}) as a CSS
+* `linear()` easing and its settle duration in ms, for a transition that continues a gesture
+* (a released sheet keeps its speed rather than starting from rest).
+*/
+function springWithVelocityToLinearEasing(token, velocity, samples = 60) {
+	const progress = (t) => springProgressWithVelocity(token, velocity, t);
+	let lastUnsettled = 0;
+	for (let t = 0; t < 5; t += .001) if (Math.abs(1 - progress(t)) > SETTLE_THRESHOLD) lastUnsettled = t;
+	const duration = Math.max(10, Math.ceil(lastUnsettled * 1e3 / 10) * 10);
+	const points = [];
+	for (let i = 0; i <= samples; i++) {
+		const value = i === samples ? 1 : progress(duration / 1e3 * (i / samples));
+		points.push(String(Math.round(value * 1e4) / 1e4));
+	}
+	return {
+		easing: `linear(${points.join(", ")})`,
+		duration
+	};
+}
+//#endregion
+export { springProgressWithVelocity, springWithVelocityToLinearEasing };
+
+//# sourceMappingURL=spring-velocity.js.map

package/dist/tokens/spring-velocity.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"spring-velocity.js","names":[],"sources":["../../src/tokens/spring-velocity.ts"],"sourcesContent":["/**\n * Springs that start with a velocity, for a transition that continues a gesture. Kept out of\n * `motion.ts`, which nearly every component imports, since only the bottom sheet's drag\n * release needs them (2026-10-17), and public from `@windmorph/react/primitives` only, for a\n * component of your own that settles after a drag (2026-10-24).\n */\nimport type { SpringToken } from './motion';\n\n/**\n * `springSettleDuration`'s threshold (`motion.ts`), repeated here so this module doesn't widen\n * the public tokens; the tokens test checks a resting spring settles at the same time.\n */\nconst SETTLE_THRESHOLD = 0.001;\n\n/**\n * Progress (0 → 1) at time `t` seconds of a spring that starts with a velocity, as Compose's\n * `animateTo(target, initialVelocity)` runs one: `velocity` is in distances per second, where\n * the distance is the whole way to the target (positive towards it).\n */\nexport function springProgressWithVelocity(\n  { dampingRatio: z, stiffness: k }: SpringToken,\n  velocity: number,\n  t: number,\n): number {\n  const w0 = Math.sqrt(k);\n  if (z < 1) {\n    const wd = w0 * Math.sqrt(1 - z * z);\n    const b = (z * w0 - velocity) / wd;\n    return 1 - Math.exp(-z * w0 * t) * (Math.cos(wd * t) + b * Math.sin(wd * t));\n  }\n  return 1 - Math.exp(-w0 * t) * (1 + (w0 - velocity) * t);\n}\n\n/**\n * A spring that starts with a velocity (see {@link springProgressWithVelocity}) as a CSS\n * `linear()` easing and its settle duration in ms, for a transition that continues a gesture\n * (a released sheet keeps its speed rather than starting from rest).\n */\nexport function springWithVelocityToLinearEasing(\n  token: SpringToken,\n  velocity: number,\n  samples = 60,\n): { easing: string; duration: number } {\n  const progress = (t: number) => springProgressWithVelocity(token, velocity, t);\n  let lastUnsettled = 0;\n  for (let t = 0; t < 5; t += 0.001) {\n    if (Math.abs(1 - progress(t)) > SETTLE_THRESHOLD) lastUnsettled = t;\n  }\n  const duration = Math.max(10, Math.ceil((lastUnsettled * 1000) / 10) * 10);\n  const points: string[] = [];\n  for (let i = 0; i <= samples; i++) {\n    const value = i === samples ? 1 : progress((duration / 1000) * (i / samples));\n    points.push(String(Math.round(value * 10000) / 10000));\n  }\n  return { easing: `linear(${points.join(', ')})`, duration };\n}\n"],"mappings":";;;;;AAYA,MAAM,mBAAmB;;;;;;AAOzB,SAAgB,2BACd,EAAE,cAAc,GAAG,WAAW,KAC9B,UACA,GACQ;CACR,MAAM,KAAK,KAAK,KAAK,CAAC;CACtB,IAAI,IAAI,GAAG;EACT,MAAM,KAAK,KAAK,KAAK,KAAK,IAAI,IAAI,CAAC;EACnC,MAAM,KAAK,IAAI,KAAK,YAAY;EAChC,OAAO,IAAI,KAAK,IAAI,CAAC,IAAI,KAAK,CAAC,KAAK,KAAK,IAAI,KAAK,CAAC,IAAI,IAAI,KAAK,IAAI,KAAK,CAAC;CAC5E;CACA,OAAO,IAAI,KAAK,IAAI,CAAC,KAAK,CAAC,KAAK,KAAK,KAAK,YAAY;AACxD;;;;;;AAOA,SAAgB,iCACd,OACA,UACA,UAAU,IAC4B;CACtC,MAAM,YAAY,MAAc,2BAA2B,OAAO,UAAU,CAAC;CAC7E,IAAI,gBAAgB;CACpB,KAAK,IAAI,IAAI,GAAG,IAAI,GAAG,KAAK,MAC1B,IAAI,KAAK,IAAI,IAAI,SAAS,CAAC,CAAC,IAAI,kBAAkB,gBAAgB;CAEpE,MAAM,WAAW,KAAK,IAAI,IAAI,KAAK,KAAM,gBAAgB,MAAQ,EAAE,IAAI,EAAE;CACzE,MAAM,SAAmB,CAAC;CAC1B,KAAK,IAAI,IAAI,GAAG,KAAK,SAAS,KAAK;EACjC,MAAM,QAAQ,MAAM,UAAU,IAAI,SAAU,WAAW,OAAS,IAAI,QAAQ;EAC5E,OAAO,KAAK,OAAO,KAAK,MAAM,QAAQ,GAAK,IAAI,GAAK,CAAC;CACvD;CACA,OAAO;EAAE,QAAQ,UAAU,OAAO,KAAK,IAAI,EAAE;EAAI;CAAS;AAC5D"}

package/dist/tokens/state.d.ts

@@ -0,0 +1,18 @@
+//#region src/tokens/state.d.ts
+/** M3 state-layer opacities (Compose `StateTokens`) and disabled-state opacities. */
+export declare const STATE_OPACITIES: {
+  readonly hover: 0.08;
+  readonly focus: 0.1;
+  readonly pressed: 0.1;
+  readonly dragged: 0.16;
+  readonly 'disabled-content': 0.38;
+  readonly 'disabled-container': 0.12;
+};
+export type StateName = keyof typeof STATE_OPACITIES;
+/** M3 focus indicator: 3px outline in `secondary`, offset 2px. */
+export declare const FOCUS_INDICATOR: {
+  readonly thickness: "3px";
+  readonly offset: "2px";
+};
+//#endregion
+//# sourceMappingURL=state.d.ts.map

package/dist/tokens/state.js

@@ -0,0 +1,19 @@
+//#region src/tokens/state.ts
+/** M3 state-layer opacities (Compose `StateTokens`) and disabled-state opacities. */
+const STATE_OPACITIES = {
+	hover: .08,
+	focus: .1,
+	pressed: .1,
+	dragged: .16,
+	"disabled-content": .38,
+	"disabled-container": .12
+};
+/** M3 focus indicator: 3px outline in `secondary`, offset 2px. */
+const FOCUS_INDICATOR = {
+	thickness: "3px",
+	offset: "2px"
+};
+//#endregion
+export { FOCUS_INDICATOR, STATE_OPACITIES };
+
+//# sourceMappingURL=state.js.map

package/dist/tokens/state.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"state.js","names":[],"sources":["../../src/tokens/state.ts"],"sourcesContent":["/** M3 state-layer opacities (Compose `StateTokens`) and disabled-state opacities. */\nexport const STATE_OPACITIES = {\n  hover: 0.08,\n  focus: 0.1,\n  pressed: 0.1,\n  dragged: 0.16,\n  'disabled-content': 0.38,\n  'disabled-container': 0.12,\n} as const;\n\nexport type StateName = keyof typeof STATE_OPACITIES;\n\n/** M3 focus indicator: 3px outline in `secondary`, offset 2px. */\nexport const FOCUS_INDICATOR = {\n  thickness: '3px',\n  offset: '2px',\n} as const;\n"],"mappings":";;AACA,MAAa,kBAAkB;CAC7B,OAAO;CACP,OAAO;CACP,SAAS;CACT,SAAS;CACT,oBAAoB;CACpB,sBAAsB;AACxB;;AAKA,MAAa,kBAAkB;CAC7B,WAAW;CACX,QAAQ;AACV"}

package/dist/tokens/typography.d.ts

@@ -0,0 +1,64 @@
+//#region src/tokens/typography.d.ts
+/**
+ * M3 type scale, including the Expressive emphasized variants
+ * (Compose `TypeScaleTokens`; sp → px 1:1 at a 16px root).
+ *
+ * Values are written in px, as in the spec, and emitted as rem (px / 16), so text
+ * follows the reader's browser font size the way sp follows Android's font scale.
+ * Each role becomes `--md-sys-typescale-<role>-{font,size,line-height,tracking,weight}`
+ * and a Tailwind `text-<role>` utility that sets size, line height, tracking and weight.
+ */
+export declare const TYPEFACES: {
+  readonly brand: "\"Roboto Flex\", Roboto, system-ui, -apple-system, \"Segoe UI\", sans-serif";
+  readonly plain: "\"Roboto Flex\", Roboto, system-ui, -apple-system, \"Segoe UI\", sans-serif";
+  /** Code: `font-mono`, the rich text's `code` and code blocks. The font is the app's to load. */
+  readonly mono: "\"Roboto Mono\", ui-monospace, SFMono-Regular, Menlo, Consolas, \"Liberation Mono\", monospace";
+};
+export type Typeface = keyof typeof TYPEFACES;
+export interface TypeStyle {
+  font: Typeface;
+  /** px at a 16px root (emitted as rem) */
+  size: number;
+  /** px at a 16px root (emitted as rem) */
+  lineHeight: number;
+  /** px at a 16px root (emitted as rem) */
+  tracking: number;
+  weight: 400 | 500 | 700;
+}
+export declare const TYPE_SCALE: {
+  readonly 'display-large': TypeStyle;
+  readonly 'display-medium': TypeStyle;
+  readonly 'display-small': TypeStyle;
+  readonly 'headline-large': TypeStyle;
+  readonly 'headline-medium': TypeStyle;
+  readonly 'headline-small': TypeStyle;
+  readonly 'title-large': TypeStyle;
+  readonly 'title-medium': TypeStyle;
+  readonly 'title-small': TypeStyle;
+  readonly 'body-large': TypeStyle;
+  readonly 'body-medium': TypeStyle;
+  readonly 'body-small': TypeStyle;
+  readonly 'label-large': TypeStyle;
+  readonly 'label-medium': TypeStyle;
+  readonly 'label-small': TypeStyle;
+  readonly 'display-large-emphasized': TypeStyle;
+  readonly 'display-medium-emphasized': TypeStyle;
+  readonly 'display-small-emphasized': TypeStyle;
+  readonly 'headline-large-emphasized': TypeStyle;
+  readonly 'headline-medium-emphasized': TypeStyle;
+  readonly 'headline-small-emphasized': TypeStyle;
+  readonly 'title-large-emphasized': TypeStyle;
+  readonly 'title-medium-emphasized': TypeStyle;
+  readonly 'title-small-emphasized': TypeStyle;
+  readonly 'body-large-emphasized': TypeStyle;
+  readonly 'body-medium-emphasized': TypeStyle;
+  readonly 'body-small-emphasized': TypeStyle;
+  readonly 'label-large-emphasized': TypeStyle;
+  readonly 'label-medium-emphasized': TypeStyle;
+  readonly 'label-small-emphasized': TypeStyle;
+};
+/** An M3 type-scale role, such as `body-large` or `title-medium-emphasized`. */
+export type TypeRole = keyof typeof TYPE_SCALE;
+export declare const TYPE_ROLES: TypeRole[];
+//#endregion
+//# sourceMappingURL=typography.d.ts.map

package/dist/tokens/typography.js

@@ -0,0 +1,60 @@
+//#region src/tokens/typography.ts
+/**
+* M3 type scale, including the Expressive emphasized variants
+* (Compose `TypeScaleTokens`; sp → px 1:1 at a 16px root).
+*
+* Values are written in px, as in the spec, and emitted as rem (px / 16), so text
+* follows the reader's browser font size the way sp follows Android's font scale.
+* Each role becomes `--md-sys-typescale-<role>-{font,size,line-height,tracking,weight}`
+* and a Tailwind `text-<role>` utility that sets size, line height, tracking and weight.
+*/
+const TYPEFACES = {
+	brand: "\"Roboto Flex\", Roboto, system-ui, -apple-system, \"Segoe UI\", sans-serif",
+	plain: "\"Roboto Flex\", Roboto, system-ui, -apple-system, \"Segoe UI\", sans-serif",
+	/** Code: `font-mono`, the rich text's `code` and code blocks. The font is the app's to load. */
+	mono: "\"Roboto Mono\", ui-monospace, SFMono-Regular, Menlo, Consolas, \"Liberation Mono\", monospace"
+};
+const style = (font, size, lineHeight, tracking, weight) => ({
+	font,
+	size,
+	lineHeight,
+	tracking,
+	weight
+});
+const TYPE_SCALE = {
+	"display-large": style("brand", 57, 64, -.2, 400),
+	"display-medium": style("brand", 45, 52, 0, 400),
+	"display-small": style("brand", 36, 44, 0, 400),
+	"headline-large": style("brand", 32, 40, 0, 400),
+	"headline-medium": style("brand", 28, 36, 0, 400),
+	"headline-small": style("brand", 24, 32, 0, 400),
+	"title-large": style("brand", 22, 28, 0, 400),
+	"title-medium": style("plain", 16, 24, .2, 500),
+	"title-small": style("plain", 14, 20, .1, 500),
+	"body-large": style("plain", 16, 24, .5, 400),
+	"body-medium": style("plain", 14, 20, .2, 400),
+	"body-small": style("plain", 12, 16, .4, 400),
+	"label-large": style("plain", 14, 20, .1, 500),
+	"label-medium": style("plain", 12, 16, .5, 500),
+	"label-small": style("plain", 11, 16, .5, 500),
+	"display-large-emphasized": style("brand", 57, 64, 0, 500),
+	"display-medium-emphasized": style("brand", 45, 52, 0, 500),
+	"display-small-emphasized": style("brand", 36, 44, 0, 500),
+	"headline-large-emphasized": style("brand", 32, 40, 0, 500),
+	"headline-medium-emphasized": style("brand", 28, 36, 0, 500),
+	"headline-small-emphasized": style("brand", 24, 32, 0, 500),
+	"title-large-emphasized": style("brand", 22, 28, 0, 500),
+	"title-medium-emphasized": style("plain", 16, 24, .15, 700),
+	"title-small-emphasized": style("plain", 14, 20, .1, 700),
+	"body-large-emphasized": style("plain", 16, 24, .15, 500),
+	"body-medium-emphasized": style("plain", 14, 20, .25, 500),
+	"body-small-emphasized": style("plain", 12, 16, .4, 500),
+	"label-large-emphasized": style("plain", 14, 20, .1, 700),
+	"label-medium-emphasized": style("plain", 12, 16, .5, 700),
+	"label-small-emphasized": style("plain", 11, 16, .5, 700)
+};
+const TYPE_ROLES = Object.keys(TYPE_SCALE);
+//#endregion
+export { TYPEFACES, TYPE_ROLES, TYPE_SCALE };
+
+//# sourceMappingURL=typography.js.map

package/dist/tokens/typography.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"typography.js","names":[],"sources":["../../src/tokens/typography.ts"],"sourcesContent":["/**\n * M3 type scale, including the Expressive emphasized variants\n * (Compose `TypeScaleTokens`; sp → px 1:1 at a 16px root).\n *\n * Values are written in px, as in the spec, and emitted as rem (px / 16), so text\n * follows the reader's browser font size the way sp follows Android's font scale.\n * Each role becomes `--md-sys-typescale-<role>-{font,size,line-height,tracking,weight}`\n * and a Tailwind `text-<role>` utility that sets size, line height, tracking and weight.\n */\n\nexport const TYPEFACES = {\n  brand: '\"Roboto Flex\", Roboto, system-ui, -apple-system, \"Segoe UI\", sans-serif',\n  plain: '\"Roboto Flex\", Roboto, system-ui, -apple-system, \"Segoe UI\", sans-serif',\n  /** Code: `font-mono`, the rich text's `code` and code blocks. The font is the app's to load. */\n  mono: '\"Roboto Mono\", ui-monospace, SFMono-Regular, Menlo, Consolas, \"Liberation Mono\", monospace',\n} as const;\n\nexport type Typeface = keyof typeof TYPEFACES;\n\nexport interface TypeStyle {\n  font: Typeface;\n  /** px at a 16px root (emitted as rem) */\n  size: number;\n  /** px at a 16px root (emitted as rem) */\n  lineHeight: number;\n  /** px at a 16px root (emitted as rem) */\n  tracking: number;\n  weight: 400 | 500 | 700;\n}\n\nconst style = (\n  font: Typeface,\n  size: number,\n  lineHeight: number,\n  tracking: number,\n  weight: TypeStyle['weight'],\n): TypeStyle => ({ font, size, lineHeight, tracking, weight });\n\nexport const TYPE_SCALE = {\n  'display-large': style('brand', 57, 64, -0.2, 400),\n  'display-medium': style('brand', 45, 52, 0, 400),\n  'display-small': style('brand', 36, 44, 0, 400),\n  'headline-large': style('brand', 32, 40, 0, 400),\n  'headline-medium': style('brand', 28, 36, 0, 400),\n  'headline-small': style('brand', 24, 32, 0, 400),\n  'title-large': style('brand', 22, 28, 0, 400),\n  'title-medium': style('plain', 16, 24, 0.2, 500),\n  'title-small': style('plain', 14, 20, 0.1, 500),\n  'body-large': style('plain', 16, 24, 0.5, 400),\n  'body-medium': style('plain', 14, 20, 0.2, 400),\n  'body-small': style('plain', 12, 16, 0.4, 400),\n  'label-large': style('plain', 14, 20, 0.1, 500),\n  'label-medium': style('plain', 12, 16, 0.5, 500),\n  'label-small': style('plain', 11, 16, 0.5, 500),\n\n  'display-large-emphasized': style('brand', 57, 64, 0, 500),\n  'display-medium-emphasized': style('brand', 45, 52, 0, 500),\n  'display-small-emphasized': style('brand', 36, 44, 0, 500),\n  'headline-large-emphasized': style('brand', 32, 40, 0, 500),\n  'headline-medium-emphasized': style('brand', 28, 36, 0, 500),\n  'headline-small-emphasized': style('brand', 24, 32, 0, 500),\n  'title-large-emphasized': style('brand', 22, 28, 0, 500),\n  'title-medium-emphasized': style('plain', 16, 24, 0.15, 700),\n  'title-small-emphasized': style('plain', 14, 20, 0.1, 700),\n  'body-large-emphasized': style('plain', 16, 24, 0.15, 500),\n  'body-medium-emphasized': style('plain', 14, 20, 0.25, 500),\n  'body-small-emphasized': style('plain', 12, 16, 0.4, 500),\n  'label-large-emphasized': style('plain', 14, 20, 0.1, 700),\n  'label-medium-emphasized': style('plain', 12, 16, 0.5, 700),\n  'label-small-emphasized': style('plain', 11, 16, 0.5, 700),\n} as const satisfies Record<string, TypeStyle>;\n\n/** An M3 type-scale role, such as `body-large` or `title-medium-emphasized`. */\nexport type TypeRole = keyof typeof TYPE_SCALE;\nexport const TYPE_ROLES = Object.keys(TYPE_SCALE) as TypeRole[];\n"],"mappings":";;;;;;;;;;AAUA,MAAa,YAAY;CACvB,OAAO;CACP,OAAO;;CAEP,MAAM;AACR;AAeA,MAAM,SACJ,MACA,MACA,YACA,UACA,YACe;CAAE;CAAM;CAAM;CAAY;CAAU;AAAO;AAE5D,MAAa,aAAa;CACxB,iBAAiB,MAAM,SAAS,IAAI,IAAI,KAAM,GAAG;CACjD,kBAAkB,MAAM,SAAS,IAAI,IAAI,GAAG,GAAG;CAC/C,iBAAiB,MAAM,SAAS,IAAI,IAAI,GAAG,GAAG;CAC9C,kBAAkB,MAAM,SAAS,IAAI,IAAI,GAAG,GAAG;CAC/C,mBAAmB,MAAM,SAAS,IAAI,IAAI,GAAG,GAAG;CAChD,kBAAkB,MAAM,SAAS,IAAI,IAAI,GAAG,GAAG;CAC/C,eAAe,MAAM,SAAS,IAAI,IAAI,GAAG,GAAG;CAC5C,gBAAgB,MAAM,SAAS,IAAI,IAAI,IAAK,GAAG;CAC/C,eAAe,MAAM,SAAS,IAAI,IAAI,IAAK,GAAG;CAC9C,cAAc,MAAM,SAAS,IAAI,IAAI,IAAK,GAAG;CAC7C,eAAe,MAAM,SAAS,IAAI,IAAI,IAAK,GAAG;CAC9C,cAAc,MAAM,SAAS,IAAI,IAAI,IAAK,GAAG;CAC7C,eAAe,MAAM,SAAS,IAAI,IAAI,IAAK,GAAG;CAC9C,gBAAgB,MAAM,SAAS,IAAI,IAAI,IAAK,GAAG;CAC/C,eAAe,MAAM,SAAS,IAAI,IAAI,IAAK,GAAG;CAE9C,4BAA4B,MAAM,SAAS,IAAI,IAAI,GAAG,GAAG;CACzD,6BAA6B,MAAM,SAAS,IAAI,IAAI,GAAG,GAAG;CAC1D,4BAA4B,MAAM,SAAS,IAAI,IAAI,GAAG,GAAG;CACzD,6BAA6B,MAAM,SAAS,IAAI,IAAI,GAAG,GAAG;CAC1D,8BAA8B,MAAM,SAAS,IAAI,IAAI,GAAG,GAAG;CAC3D,6BAA6B,MAAM,SAAS,IAAI,IAAI,GAAG,GAAG;CAC1D,0BAA0B,MAAM,SAAS,IAAI,IAAI,GAAG,GAAG;CACvD,2BAA2B,MAAM,SAAS,IAAI,IAAI,KAAM,GAAG;CAC3D,0BAA0B,MAAM,SAAS,IAAI,IAAI,IAAK,GAAG;CACzD,yBAAyB,MAAM,SAAS,IAAI,IAAI,KAAM,GAAG;CACzD,0BAA0B,MAAM,SAAS,IAAI,IAAI,KAAM,GAAG;CAC1D,yBAAyB,MAAM,SAAS,IAAI,IAAI,IAAK,GAAG;CACxD,0BAA0B,MAAM,SAAS,IAAI,IAAI,IAAK,GAAG;CACzD,2BAA2B,MAAM,SAAS,IAAI,IAAI,IAAK,GAAG;CAC1D,0BAA0B,MAAM,SAAS,IAAI,IAAI,IAAK,GAAG;AAC3D;AAIA,MAAa,aAAa,OAAO,KAAK,UAAU"}

package/dist/tokens/z-index.d.ts

@@ -0,0 +1,17 @@
+//#region src/tokens/z-index.d.ts
+/**
+ * Stacking order for portalled layers, emitted as `--md-sys-z-<name>`.
+ * Components never set their own z-index on a root; only overlays use these.
+ */
+export declare const Z_INDEX: {
+  readonly sticky: 100;
+  readonly scrim: 1000;
+  readonly dialog: 1100;
+  readonly sheet: 1100;
+  readonly menu: 1200;
+  readonly snackbar: 1300;
+  readonly tooltip: 1400;
+};
+export type ZIndexName = keyof typeof Z_INDEX;
+//#endregion
+//# sourceMappingURL=z-index.d.ts.map

package/dist/tokens/z-index.js

@@ -0,0 +1,18 @@
+//#region src/tokens/z-index.ts
+/**
+* Stacking order for portalled layers, emitted as `--md-sys-z-<name>`.
+* Components never set their own z-index on a root; only overlays use these.
+*/
+const Z_INDEX = {
+	sticky: 100,
+	scrim: 1e3,
+	dialog: 1100,
+	sheet: 1100,
+	menu: 1200,
+	snackbar: 1300,
+	tooltip: 1400
+};
+//#endregion
+export { Z_INDEX };
+
+//# sourceMappingURL=z-index.js.map

package/dist/tokens/z-index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"z-index.js","names":[],"sources":["../../src/tokens/z-index.ts"],"sourcesContent":["/**\n * Stacking order for portalled layers, emitted as `--md-sys-z-<name>`.\n * Components never set their own z-index on a root; only overlays use these.\n */\nexport const Z_INDEX = {\n  sticky: 100,\n  scrim: 1000,\n  dialog: 1100,\n  sheet: 1100,\n  menu: 1200,\n  snackbar: 1300,\n  tooltip: 1400,\n} as const;\n\nexport type ZIndexName = keyof typeof Z_INDEX;\n"],"mappings":";;;;;AAIA,MAAa,UAAU;CACrB,QAAQ;CACR,OAAO;CACP,QAAQ;CACR,OAAO;CACP,MAAM;CACN,UAAU;CACV,SAAS;AACX"}

package/dist/utils/announce.js

@@ -0,0 +1,51 @@
+/** How long an announcement stays in the region; long enough to be read, then removed. */
+const CLEAR_AFTER = 7e3;
+let region = null;
+function liveRegion() {
+	if (region?.element.isConnected) return region;
+	const element = document.createElement("div");
+	element.setAttribute("aria-live", "polite");
+	element.setAttribute("aria-relevant", "additions");
+	element.dataset.windmorphAnnouncer = "";
+	Object.assign(element.style, {
+		position: "absolute",
+		width: "1px",
+		height: "1px",
+		padding: "0",
+		margin: "-1px",
+		overflow: "hidden",
+		clip: "rect(0, 0, 0, 0)",
+		whiteSpace: "nowrap",
+		border: "0"
+	});
+	document.body.append(element);
+	region = {
+		element,
+		readyAt: Date.now() + 100
+	};
+	return region;
+}
+/**
+* Creates the region ahead of a first announcement that may come later (a button that can
+* turn pending), so that announcement isn't held back by `LIVE_REGION_DELAY`. Browser only.
+*/
+function prepareAnnouncer() {
+	liveRegion();
+}
+/** Announces `message` politely (queued after what the screen reader is saying). */
+function announcePolite(message) {
+	const { element, readyAt } = liveRegion();
+	const add = () => {
+		const node = document.createElement("div");
+		node.textContent = message;
+		element.append(node);
+		setTimeout(() => node.remove(), CLEAR_AFTER);
+	};
+	const wait = readyAt - Date.now();
+	if (wait > 0) setTimeout(add, wait);
+	else add();
+}
+//#endregion
+export { announcePolite, prepareAnnouncer };
+
+//# sourceMappingURL=announce.js.map

package/dist/utils/announce.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"announce.js","names":[],"sources":["../../src/utils/announce.ts"],"sourcesContent":["/*\n * A polite announcement for content that isn't in a live region of its own (a snackbar\n * rendered without its host, a focused button turning pending). Screen readers announce changes to a live region only once\n * they've registered it, and often skip content that arrives together with the region, so\n * one region is created on first use, kept for the page's life, and written to after\n * `LIVE_REGION_DELAY`.\n */\n\n/** How long a new live region is given to be registered before content goes in. */\nexport const LIVE_REGION_DELAY = 100;\n\n/** How long an announcement stays in the region; long enough to be read, then removed. */\nconst CLEAR_AFTER = 7000;\n\nlet region: { element: HTMLElement; readyAt: number } | null = null;\n\nfunction liveRegion() {\n  if (region?.element.isConnected) return region;\n  const element = document.createElement('div');\n  element.setAttribute('aria-live', 'polite');\n  element.setAttribute('aria-relevant', 'additions');\n  element.dataset.windmorphAnnouncer = '';\n  // Visually hidden, as Tailwind's `sr-only` (this element lives outside the React tree).\n  Object.assign(element.style, {\n    position: 'absolute',\n    width: '1px',\n    height: '1px',\n    padding: '0',\n    margin: '-1px',\n    overflow: 'hidden',\n    clip: 'rect(0, 0, 0, 0)',\n    whiteSpace: 'nowrap',\n    border: '0',\n  });\n  document.body.append(element);\n  region = { element, readyAt: Date.now() + LIVE_REGION_DELAY };\n  return region;\n}\n\n/**\n * Creates the region ahead of a first announcement that may come later (a button that can\n * turn pending), so that announcement isn't held back by `LIVE_REGION_DELAY`. Browser only.\n */\nexport function prepareAnnouncer(): void {\n  liveRegion();\n}\n\n/** Announces `message` politely (queued after what the screen reader is saying). */\nexport function announcePolite(message: string): void {\n  const { element, readyAt } = liveRegion();\n  const add = () => {\n    const node = document.createElement('div');\n    node.textContent = message;\n    element.append(node);\n    setTimeout(() => node.remove(), CLEAR_AFTER);\n  };\n  const wait = readyAt - Date.now();\n  if (wait > 0) setTimeout(add, wait);\n  else add();\n}\n"],"mappings":";AAYA,MAAM,cAAc;AAEpB,IAAI,SAA2D;AAE/D,SAAS,aAAa;CACpB,IAAI,QAAQ,QAAQ,aAAa,OAAO;CACxC,MAAM,UAAU,SAAS,cAAc,KAAK;CAC5C,QAAQ,aAAa,aAAa,QAAQ;CAC1C,QAAQ,aAAa,iBAAiB,WAAW;CACjD,QAAQ,QAAQ,qBAAqB;CAErC,OAAO,OAAO,QAAQ,OAAO;EAC3B,UAAU;EACV,OAAO;EACP,QAAQ;EACR,SAAS;EACT,QAAQ;EACR,UAAU;EACV,MAAM;EACN,YAAY;EACZ,QAAQ;CACV,CAAC;CACD,SAAS,KAAK,OAAO,OAAO;CAC5B,SAAS;EAAE;EAAS,SAAS,KAAK,IAAI,IAAA;CAAsB;CAC5D,OAAO;AACT;;;;;AAMA,SAAgB,mBAAyB;CACvC,WAAW;AACb;;AAGA,SAAgB,eAAe,SAAuB;CACpD,MAAM,EAAE,SAAS,YAAY,WAAW;CACxC,MAAM,YAAY;EAChB,MAAM,OAAO,SAAS,cAAc,KAAK;EACzC,KAAK,cAAc;EACnB,QAAQ,OAAO,IAAI;EACnB,iBAAiB,KAAK,OAAO,GAAG,WAAW;CAC7C;CACA,MAAM,OAAO,UAAU,KAAK,IAAI;CAChC,IAAI,OAAO,GAAG,WAAW,KAAK,IAAI;MAC7B,IAAI;AACX"}

package/dist/utils/assert-collection-children.js

@@ -0,0 +1,26 @@
+import { Children, isValidElement } from "react";
+//#region src/utils/assert-collection-children.ts
+/**
+* React Aria collections (menus, tabs, interactive lists) read their items' element types
+* directly. Items created in a React Server Component reach the client as client
+* references, not as the item component, and React Stately fails with "Unknown element
+* <[object Object]> in collection". This throws a message that names the cause instead.
+*
+* Development only; nested `MenuGroup`-style children are checked one level down unless
+* `nested` is false (a `Tab`'s children are its panel, which may come from the server).
+*/
+function assertCollectionChildren(children, component, items, { nested = true } = {}) {
+	if (process.env.NODE_ENV === "production") return;
+	const check = (nodes, depth) => {
+		Children.forEach(nodes, (child) => {
+			if (!isValidElement(child)) return;
+			if (typeof child.type === "object" && child.type !== null) throw new Error(`[@windmorph/react] ${component}: its ${items} must be created in a client component ("use client"). Items created in a React Server Component arrive as client references, which React Aria collections can't read. Move the ${component} and its items into a client component, or render them from one.`);
+			if (nested && depth === 0) check(child.props.children, 1);
+		});
+	};
+	check(children, 0);
+}
+//#endregion
+export { assertCollectionChildren };
+
+//# sourceMappingURL=assert-collection-children.js.map

package/dist/utils/assert-collection-children.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"assert-collection-children.js","names":[],"sources":["../../src/utils/assert-collection-children.ts"],"sourcesContent":["import { Children, isValidElement, type ReactNode } from 'react';\n\n/**\n * React Aria collections (menus, tabs, interactive lists) read their items' element types\n * directly. Items created in a React Server Component reach the client as client\n * references, not as the item component, and React Stately fails with \"Unknown element\n * <[object Object]> in collection\". This throws a message that names the cause instead.\n *\n * Development only; nested `MenuGroup`-style children are checked one level down unless\n * `nested` is false (a `Tab`'s children are its panel, which may come from the server).\n */\nexport function assertCollectionChildren(\n  children: ReactNode,\n  component: string,\n  items: string,\n  { nested = true }: { nested?: boolean } = {},\n) {\n  if (process.env.NODE_ENV === 'production') return;\n  const check = (nodes: ReactNode, depth: number) => {\n    Children.forEach(nodes, (child) => {\n      if (!isValidElement(child)) return;\n      if (typeof child.type === 'object' && child.type !== null) {\n        throw new Error(\n          `[@windmorph/react] ${component}: its ${items} must be created in a client component ` +\n            `(\"use client\"). Items created in a React Server Component arrive as client ` +\n            `references, which React Aria collections can't read. Move the ${component} and ` +\n            `its items into a client component, or render them from one.`,\n        );\n      }\n      if (nested && depth === 0) check((child.props as { children?: ReactNode }).children, 1);\n    });\n  };\n  check(children, 0);\n}\n"],"mappings":";;;;;;;;;;;AAWA,SAAgB,yBACd,UACA,WACA,OACA,EAAE,SAAS,SAA+B,CAAC,GAC3C;CACA,IAAI,QAAQ,IAAI,aAAa,cAAc;CAC3C,MAAM,SAAS,OAAkB,UAAkB;EACjD,SAAS,QAAQ,QAAQ,UAAU;GACjC,IAAI,CAAC,eAAe,KAAK,GAAG;GAC5B,IAAI,OAAO,MAAM,SAAS,YAAY,MAAM,SAAS,MACnD,MAAM,IAAI,MACR,sBAAsB,UAAU,QAAQ,MAAM,kLAEqB,UAAU,iEAE/E;GAEF,IAAI,UAAU,UAAU,GAAG,MAAO,MAAM,MAAmC,UAAU,CAAC;EACxF,CAAC;CACH;CACA,MAAM,UAAU,CAAC;AACnB"}

package/dist/utils/closed-by.d.ts

@@ -0,0 +1,9 @@
+//#region src/utils/closed-by.d.ts
+/**
+ * How a modal surface may be closed by the user, as HTML's `<dialog closedby>` names it:
+ * `any` (Escape or a press outside), `closerequest` (Escape, the platform's close request,
+ * only) or `none` (only by the app or the surface's own buttons).
+ */
+export type ClosedBy = 'any' | 'closerequest' | 'none';
+//#endregion
+//# sourceMappingURL=closed-by.d.ts.map

package/dist/utils/closed-by.js

@@ -0,0 +1,12 @@
+//#region src/utils/closed-by.ts
+/** React Aria's `useModalOverlay` options for a `closedBy` value. */
+function closedByOverlayOptions(closedBy, isExiting) {
+	return {
+		isDismissable: closedBy === "any" && !isExiting,
+		isKeyboardDismissDisabled: closedBy === "none"
+	};
+}
+//#endregion
+export { closedByOverlayOptions };
+
+//# sourceMappingURL=closed-by.js.map

package/dist/utils/closed-by.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"closed-by.js","names":[],"sources":["../../src/utils/closed-by.ts"],"sourcesContent":["/**\n * How a modal surface may be closed by the user, as HTML's `<dialog closedby>` names it:\n * `any` (Escape or a press outside), `closerequest` (Escape, the platform's close request,\n * only) or `none` (only by the app or the surface's own buttons).\n */\nexport type ClosedBy = 'any' | 'closerequest' | 'none';\n\n/** React Aria's `useModalOverlay` options for a `closedBy` value. */\nexport function closedByOverlayOptions(closedBy: ClosedBy, isExiting: boolean) {\n  return {\n    isDismissable: closedBy === 'any' && !isExiting,\n    isKeyboardDismissDisabled: closedBy === 'none',\n  };\n}\n"],"mappings":";;AAQA,SAAgB,uBAAuB,UAAoB,WAAoB;CAC7E,OAAO;EACL,eAAe,aAAa,SAAS,CAAC;EACtC,2BAA2B,aAAa;CAC1C;AACF"}