interactive-bg 0.0.0-stage → 0.1.0

package/dist/styles/plus/canvas2d.js

@@ -0,0 +1,88 @@
+import { createFloatBuffer, reserve } from "../../shared/buffer.js";
+import { TAU, createPhaseCache, createWaveList, gridLayout, wanderClock } from "../../shared/grid.js";
+import { resolvePlusOptions, wavesEnabled } from "./options.js";
+import { createSignTurns } from "./turns.js";
+// src/styles/plus/canvas2d.ts
+/** Signs made heavier by waves are drawn in this many weight steps per unit of ring height. */
+var WEIGHT_STEPS = 8;
+/** Ring heights beyond this are clamped (two overlapping wave crests). */
+var MAX_WEIGHT_STEP = 16;
+/**
+* Every sign's position computed on the CPU, with angles and weights from
+* SignTurns. All signs of one weight are a single path of round-capped lines,
+* stroked once.
+*/
+function createPlusCanvas2D(ctx, initial) {
+	let options = resolvePlusOptions(initial);
+	const waves = createWaveList();
+	const phasesFor = createPhaseCache();
+	const turns = createSignTurns();
+	let clock = 0;
+	const weights = Array.from({ length: 17 }, () => createFloatBuffer(512));
+	function add(buffer, x, y, dx, dy) {
+		const data = reserve(buffer, 4);
+		data[buffer.length++] = x;
+		data[buffer.length++] = y;
+		data[buffer.length++] = dx;
+		data[buffer.length++] = dy;
+	}
+	function stroke(buffer, weight) {
+		const { data, length } = buffer;
+		ctx.lineWidth = weight;
+		ctx.beginPath();
+		for (let k = 0; k < length; k += 4) {
+			const x = data[k];
+			const y = data[k + 1];
+			const dx = data[k + 2];
+			const dy = data[k + 3];
+			ctx.moveTo(x - dx, y - dy);
+			ctx.lineTo(x + dx, y + dy);
+			ctx.moveTo(x + dy, y - dx);
+			ctx.lineTo(x - dy, y + dx);
+		}
+		ctx.stroke();
+	}
+	return {
+		update(next) {
+			options = resolvePlusOptions(next);
+		},
+		render(frame) {
+			if (!frame.reducedMotion) clock += frame.dt * options.jitterSpeed * TAU;
+			waves.advance(frame, options.waveDuration, wavesEnabled(options));
+			const { spacing, size, jitter } = options;
+			const grid = gridLayout(frame.width, frame.height, spacing);
+			const { cols, rows, originX, originY } = grid;
+			const wander = phasesFor(cols, rows);
+			const { sx, cx, sy, cy } = wanderClock(clock);
+			turns.update(frame, options, grid, waves.waves);
+			const turn = turns.data;
+			for (const buffer of weights) buffer.length = 0;
+			for (let j = 0; j < rows; j++) {
+				const restY = originY + j * spacing;
+				for (let i = 0; i < cols; i++) {
+					const k = j * cols + i;
+					const w = k * 4;
+					const x = originX + i * spacing + jitter * (sx * wander[w] + cx * wander[w + 1]);
+					const y = restY + jitter * (cy * wander[w + 2] - sy * wander[w + 3]);
+					const angle = turn[k * 2];
+					const step = Math.min(MAX_WEIGHT_STEP, Math.round(turn[k * 2 + 1] * WEIGHT_STEPS));
+					if (angle === 0) add(weights[step], x, y, size, 0);
+					else {
+						const a2 = angle * angle;
+						const cos = 1 - a2 * (.5 - a2 * (1 / 24 - a2 * (1 / 720 - a2 / 40320)));
+						const sin = angle * (1 - a2 * (1 / 6 - a2 * (1 / 120 - a2 / 5040)));
+						add(weights[step], x, y, size * cos, size * sin);
+					}
+				}
+			}
+			ctx.globalAlpha = options.opacity;
+			ctx.strokeStyle = options.color;
+			ctx.lineCap = "round";
+			for (let step = 0; step <= MAX_WEIGHT_STEP; step++) if (weights[step].length > 0) stroke(weights[step], options.weight * (1 + options.waveWeight * step / WEIGHT_STEPS));
+			return waves.waves.length > 0 || turns.settling;
+		}
+	};
+}
+export { createPlusCanvas2D };
+
+//# sourceMappingURL=canvas2d.js.map

package/dist/styles/plus/canvas2d.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"canvas2d.js","names":[],"sources":["../../../src/styles/plus/canvas2d.ts"],"sourcesContent":["import type { StyleRenderer } from '../../core/style';\nimport { createFloatBuffer, reserve, type FloatBuffer } from '../../shared/buffer';\nimport { createPhaseCache, createWaveList, gridLayout, TAU, wanderClock } from '../../shared/grid';\nimport { resolvePlusOptions, wavesEnabled, type PlusOptions } from './options';\nimport { createSignTurns } from './turns';\n\n/** Signs made heavier by waves are drawn in this many weight steps per unit of ring height. */\nconst WEIGHT_STEPS = 8;\n/** Ring heights beyond this are clamped (two overlapping wave crests). */\nconst MAX_WEIGHT_STEP = 2 * WEIGHT_STEPS;\n\n/**\n * Every sign's position computed on the CPU, with angles and weights from\n * SignTurns. All signs of one weight are a single path of round-capped lines,\n * stroked once.\n */\nexport function createPlusCanvas2D(ctx: CanvasRenderingContext2D, initial: PlusOptions): StyleRenderer<PlusOptions> {\n  let options = resolvePlusOptions(initial);\n  const waves = createWaveList();\n  const phasesFor = createPhaseCache();\n  const turns = createSignTurns();\n  let clock = 0;\n\n  // Signs as x, y, arm vector (dx, dy), one buffer per weight step; signs outside a wave all land in step 0.\n  const weights = Array.from({ length: MAX_WEIGHT_STEP + 1 }, () => createFloatBuffer(512));\n\n  function add(buffer: FloatBuffer, x: number, y: number, dx: number, dy: number): void {\n    const data = reserve(buffer, 4);\n    data[buffer.length++] = x;\n    data[buffer.length++] = y;\n    data[buffer.length++] = dx;\n    data[buffer.length++] = dy;\n  }\n\n  function stroke(buffer: FloatBuffer, weight: number): void {\n    const { data, length } = buffer;\n    ctx.lineWidth = weight;\n    ctx.beginPath();\n    for (let k = 0; k < length; k += 4) {\n      const x = data[k];\n      const y = data[k + 1];\n      const dx = data[k + 2];\n      const dy = data[k + 3];\n      // Two arms: along (dx, dy) and along its perpendicular (-dy, dx).\n      ctx.moveTo(x - dx, y - dy);\n      ctx.lineTo(x + dx, y + dy);\n      ctx.moveTo(x + dy, y - dx);\n      ctx.lineTo(x - dy, y + dx);\n    }\n    ctx.stroke();\n  }\n\n  return {\n    update(next) {\n      options = resolvePlusOptions(next);\n    },\n    render(frame) {\n      if (!frame.reducedMotion) clock += frame.dt * options.jitterSpeed * TAU;\n      waves.advance(frame, options.waveDuration, wavesEnabled(options));\n\n      const { spacing, size, jitter } = options;\n      const grid = gridLayout(frame.width, frame.height, spacing);\n      const { cols, rows, originX, originY } = grid;\n      const wander = phasesFor(cols, rows);\n      const { sx, cx, sy, cy } = wanderClock(clock);\n      turns.update(frame, options, grid, waves.waves);\n      const turn = turns.data;\n      for (const buffer of weights) buffer.length = 0;\n\n      for (let j = 0; j < rows; j++) {\n        const restY = originY + j * spacing;\n        for (let i = 0; i < cols; i++) {\n          const k = j * cols + i;\n          const w = k * 4;\n          const x = originX + i * spacing + jitter * (sx * wander[w] + cx * wander[w + 1]);\n          const y = restY + jitter * (cy * wander[w + 2] - sy * wander[w + 3]);\n          const angle = turn[k * 2];\n          const step = Math.min(MAX_WEIGHT_STEP, Math.round(turn[k * 2 + 1] * WEIGHT_STEPS));\n          if (angle === 0) {\n            add(weights[step], x, y, size, 0);\n          } else {\n            // Angles stay within ±45°, where these short series are exact to ~1e-6.\n            const a2 = angle * angle;\n            const cos = 1 - a2 * (0.5 - a2 * (1 / 24 - a2 * (1 / 720 - a2 / 40320)));\n            const sin = angle * (1 - a2 * (1 / 6 - a2 * (1 / 120 - a2 / 5040)));\n            add(weights[step], x, y, size * cos, size * sin);\n          }\n        }\n      }\n\n      ctx.globalAlpha = options.opacity;\n      ctx.strokeStyle = options.color;\n      ctx.lineCap = 'round';\n      for (let step = 0; step <= MAX_WEIGHT_STEP; step++) {\n        if (weights[step].length > 0) {\n          stroke(weights[step], options.weight * (1 + (options.waveWeight * step) / WEIGHT_STEPS));\n        }\n      }\n      return waves.waves.length > 0 || turns.settling;\n    },\n  };\n}\n"],"mappings":"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"}

package/dist/styles/plus/definition.cjs

@@ -0,0 +1,17 @@
+const require_grid = require("../../shared/grid.cjs");
+// src/styles/plus/definition.ts
+/**
+* A grid of "+" signs that wander gently around their places. While the
+* pointer is over the background, every sign turns smoothly so an arm points
+* at it. Clicks send out a wave that turns the signs on its crest to face the
+* click and makes them heavier as it passes.
+*/
+var plusStyle = {
+	name: "plus",
+	defaults: require("./options.cjs").plusDefaults,
+	animates: (options) => options.jitter > 0 && options.jitterSpeed > 0,
+	idleFps: require_grid.wanderIdleFps
+};
+exports.plusStyle = plusStyle;
+
+//# sourceMappingURL=definition.cjs.map

package/dist/styles/plus/definition.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"definition.cjs","names":["plusDefaults","wanderIdleFps"],"sources":["../../../src/styles/plus/definition.ts"],"sourcesContent":["import type { StyleBase } from '../../core/style';\nimport { wanderIdleFps } from '../../shared/grid';\nimport { plusDefaults, type PlusOptions } from './options';\n\n/**\n * A grid of \"+\" signs that wander gently around their places. While the\n * pointer is over the background, every sign turns smoothly so an arm points\n * at it. Clicks send out a wave that turns the signs on its crest to face the\n * click and makes them heavier as it passes.\n */\nexport const plusStyle: StyleBase<PlusOptions> = {\n  name: 'plus',\n  defaults: plusDefaults,\n  animates: (options) => options.jitter > 0 && options.jitterSpeed > 0,\n  // Same slow, sub-pixel wander as dots: it rarely needs the engine's full idle frame rate.\n  idleFps: wanderIdleFps,\n};\n"],"mappings":";;;;;;;;AAUA,IAAa,YAAoC;CAC/C,MAAM;CACN,U,uBAAUA,CAAAA,CAAAA;CACV,WAAW,YAAY,QAAQ,SAAS,KAAK,QAAQ,cAAc;CAEnE,SAASC,aAAAA;AACX"}

package/dist/styles/plus/definition.d.cts

@@ -0,0 +1,9 @@
+import type { StyleBase } from '../../core/style.cjs';
+import { type PlusOptions } from './options.cjs';
+/**
+ * A grid of "+" signs that wander gently around their places. While the
+ * pointer is over the background, every sign turns smoothly so an arm points
+ * at it. Clicks send out a wave that turns the signs on its crest to face the
+ * click and makes them heavier as it passes.
+ */
+export declare const plusStyle: StyleBase<PlusOptions>;

package/dist/styles/plus/definition.d.ts

@@ -0,0 +1,9 @@
+import type { StyleBase } from '../../core/style.js';
+import { type PlusOptions } from './options.js';
+/**
+ * A grid of "+" signs that wander gently around their places. While the
+ * pointer is over the background, every sign turns smoothly so an arm points
+ * at it. Clicks send out a wave that turns the signs on its crest to face the
+ * click and makes them heavier as it passes.
+ */
+export declare const plusStyle: StyleBase<PlusOptions>;

package/dist/styles/plus/definition.js

@@ -0,0 +1,18 @@
+import { wanderIdleFps } from "../../shared/grid.js";
+import { plusDefaults } from "./options.js";
+// src/styles/plus/definition.ts
+/**
+* A grid of "+" signs that wander gently around their places. While the
+* pointer is over the background, every sign turns smoothly so an arm points
+* at it. Clicks send out a wave that turns the signs on its crest to face the
+* click and makes them heavier as it passes.
+*/
+var plusStyle = {
+	name: "plus",
+	defaults: plusDefaults,
+	animates: (options) => options.jitter > 0 && options.jitterSpeed > 0,
+	idleFps: wanderIdleFps
+};
+export { plusStyle };
+
+//# sourceMappingURL=definition.js.map

package/dist/styles/plus/definition.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"definition.js","names":[],"sources":["../../../src/styles/plus/definition.ts"],"sourcesContent":["import type { StyleBase } from '../../core/style';\nimport { wanderIdleFps } from '../../shared/grid';\nimport { plusDefaults, type PlusOptions } from './options';\n\n/**\n * A grid of \"+\" signs that wander gently around their places. While the\n * pointer is over the background, every sign turns smoothly so an arm points\n * at it. Clicks send out a wave that turns the signs on its crest to face the\n * click and makes them heavier as it passes.\n */\nexport const plusStyle: StyleBase<PlusOptions> = {\n  name: 'plus',\n  defaults: plusDefaults,\n  animates: (options) => options.jitter > 0 && options.jitterSpeed > 0,\n  // Same slow, sub-pixel wander as dots: it rarely needs the engine's full idle frame rate.\n  idleFps: wanderIdleFps,\n};\n"],"mappings":";;;;;;;;;AAUA,IAAa,YAAoC;CAC/C,MAAM;CACN,UAAU;CACV,WAAW,YAAY,QAAQ,SAAS,KAAK,QAAQ,cAAc;CAEnE,SAAS;AACX"}

package/dist/styles/plus/motion.cjs

@@ -0,0 +1,18 @@
+// src/styles/plus/motion.ts
+/** atan(r) for r in [-1, 1], within 1e-5 rad: much cheaper than Math.atan2. */
+function atanUnit(r) {
+	const r2 = r * r;
+	return r * (.99997726 + r2 * (-.33262347 + r2 * (.19354346 + r2 * (-.11643287 + r2 * (.05265332 - .0117212 * r2)))));
+}
+/**
+* The smallest turn that points one of a sign's arms along (dx, dy). A "+"
+* looks the same every 90°, so this is always within ±45°.
+*/
+function facingAngle(dx, dy) {
+	const ax = Math.abs(dx);
+	if (ax >= Math.abs(dy)) return ax === 0 ? 0 : atanUnit(dy / dx);
+	return -atanUnit(dx / dy);
+}
+exports.facingAngle = facingAngle;
+
+//# sourceMappingURL=motion.cjs.map

package/dist/styles/plus/motion.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"motion.cjs","names":[],"sources":["../../../src/styles/plus/motion.ts"],"sourcesContent":["// The plus-specific part of the motion model; the rest is shared with other\n// grid styles in shared/grid.ts.\n\n/** atan(r) for r in [-1, 1], within 1e-5 rad: much cheaper than Math.atan2. */\nfunction atanUnit(r: number): number {\n  const r2 = r * r;\n  return r * (0.99997726 + r2 * (-0.33262347 + r2 * (0.19354346 + r2 * (-0.11643287 + r2 * (0.05265332 - 0.0117212 * r2)))));\n}\n\n/**\n * The smallest turn that points one of a sign's arms along (dx, dy). A \"+\"\n * looks the same every 90°, so this is always within ±45°.\n */\nexport function facingAngle(dx: number, dy: number): number {\n  const ax = Math.abs(dx);\n  const ay = Math.abs(dy);\n  if (ax >= ay) return ax === 0 ? 0 : atanUnit(dy / dx);\n  // Steeper than 45°: the vertical arm is closer, a quarter turn away from the horizontal one.\n  return -atanUnit(dx / dy);\n}\n"],"mappings":";;AAIA,SAAS,SAAS,GAAmB;CACnC,MAAM,KAAK,IAAI;CACf,OAAO,KAAK,YAAa,MAAM,aAAc,MAAM,YAAa,MAAM,aAAc,MAAM,YAAa,WAAY;AACrH;;;;;AAMA,SAAgB,YAAY,IAAY,IAAoB;CAC1D,MAAM,KAAK,KAAK,IAAI,EAAE;CAEtB,IAAI,MADO,KAAK,IAAI,EACV,GAAI,OAAO,OAAO,IAAI,IAAI,SAAS,KAAK,EAAE;CAEpD,OAAO,CAAC,SAAS,KAAK,EAAE;AAC1B"}

package/dist/styles/plus/motion.d.cts

@@ -0,0 +1,5 @@
+/**
+ * The smallest turn that points one of a sign's arms along (dx, dy). A "+"
+ * looks the same every 90°, so this is always within ±45°.
+ */
+export declare function facingAngle(dx: number, dy: number): number;

package/dist/styles/plus/motion.d.ts

@@ -0,0 +1,5 @@
+/**
+ * The smallest turn that points one of a sign's arms along (dx, dy). A "+"
+ * looks the same every 90°, so this is always within ±45°.
+ */
+export declare function facingAngle(dx: number, dy: number): number;

package/dist/styles/plus/motion.js

@@ -0,0 +1,18 @@
+// src/styles/plus/motion.ts
+/** atan(r) for r in [-1, 1], within 1e-5 rad: much cheaper than Math.atan2. */
+function atanUnit(r) {
+	const r2 = r * r;
+	return r * (.99997726 + r2 * (-.33262347 + r2 * (.19354346 + r2 * (-.11643287 + r2 * (.05265332 - .0117212 * r2)))));
+}
+/**
+* The smallest turn that points one of a sign's arms along (dx, dy). A "+"
+* looks the same every 90°, so this is always within ±45°.
+*/
+function facingAngle(dx, dy) {
+	const ax = Math.abs(dx);
+	if (ax >= Math.abs(dy)) return ax === 0 ? 0 : atanUnit(dy / dx);
+	return -atanUnit(dx / dy);
+}
+export { facingAngle };
+
+//# sourceMappingURL=motion.js.map

package/dist/styles/plus/motion.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"motion.js","names":[],"sources":["../../../src/styles/plus/motion.ts"],"sourcesContent":["// The plus-specific part of the motion model; the rest is shared with other\n// grid styles in shared/grid.ts.\n\n/** atan(r) for r in [-1, 1], within 1e-5 rad: much cheaper than Math.atan2. */\nfunction atanUnit(r: number): number {\n  const r2 = r * r;\n  return r * (0.99997726 + r2 * (-0.33262347 + r2 * (0.19354346 + r2 * (-0.11643287 + r2 * (0.05265332 - 0.0117212 * r2)))));\n}\n\n/**\n * The smallest turn that points one of a sign's arms along (dx, dy). A \"+\"\n * looks the same every 90°, so this is always within ±45°.\n */\nexport function facingAngle(dx: number, dy: number): number {\n  const ax = Math.abs(dx);\n  const ay = Math.abs(dy);\n  if (ax >= ay) return ax === 0 ? 0 : atanUnit(dy / dx);\n  // Steeper than 45°: the vertical arm is closer, a quarter turn away from the horizontal one.\n  return -atanUnit(dx / dy);\n}\n"],"mappings":";;AAIA,SAAS,SAAS,GAAmB;CACnC,MAAM,KAAK,IAAI;CACf,OAAO,KAAK,YAAa,MAAM,aAAc,MAAM,YAAa,MAAM,aAAc,MAAM,YAAa,WAAY;AACrH;;;;;AAMA,SAAgB,YAAY,IAAY,IAAoB;CAC1D,MAAM,KAAK,KAAK,IAAI,EAAE;CAEtB,IAAI,MADO,KAAK,IAAI,EACV,GAAI,OAAO,OAAO,IAAI,IAAI,SAAS,KAAK,EAAE;CAEpD,OAAO,CAAC,SAAS,KAAK,EAAE;AAC1B"}

package/dist/styles/plus/options.cjs

@@ -0,0 +1,45 @@
+// src/styles/plus/options.ts
+var plusDefaults = Object.freeze({
+	color: "#8b95a5",
+	opacity: .6,
+	size: 4,
+	weight: 1.2,
+	spacing: 28,
+	jitter: 1,
+	jitterSpeed: .35,
+	pointerAlign: 1,
+	turnTime: .25,
+	waveSpeed: 520,
+	waveAlign: 1,
+	waveWeight: 1.5,
+	waveWidth: 60,
+	waveDuration: 1.8
+});
+var unit = (value) => Math.min(1, Math.max(0, value));
+function resolvePlusOptions(options) {
+	return {
+		...options,
+		opacity: unit(options.opacity),
+		size: Math.max(.5, options.size),
+		weight: Math.max(.1, options.weight),
+		spacing: Math.max(4, options.spacing),
+		jitter: Math.max(0, options.jitter),
+		jitterSpeed: Math.max(0, options.jitterSpeed),
+		pointerAlign: unit(options.pointerAlign),
+		turnTime: Math.max(0, options.turnTime),
+		waveSpeed: Math.max(1, options.waveSpeed),
+		waveAlign: unit(options.waveAlign),
+		waveWeight: Math.max(0, options.waveWeight),
+		waveWidth: Math.max(1, options.waveWidth),
+		waveDuration: Math.max(.05, options.waveDuration)
+	};
+}
+/** Clicks start a wave only if it would change something. */
+function wavesEnabled(options) {
+	return options.waveAlign !== 0 || options.waveWeight !== 0;
+}
+exports.plusDefaults = plusDefaults;
+exports.resolvePlusOptions = resolvePlusOptions;
+exports.wavesEnabled = wavesEnabled;
+
+//# sourceMappingURL=options.cjs.map

package/dist/styles/plus/options.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"options.cjs","names":[],"sources":["../../../src/styles/plus/options.ts"],"sourcesContent":["export interface PlusOptions {\n  /** Colour of the signs. Any CSS colour. */\n  color: string;\n  /** Opacity of the signs, from `0` to `1`. Multiplies any alpha in the colour. */\n  opacity: number;\n  /** Length of each arm from the centre, in CSS pixels. */\n  size: number;\n  /** Stroke weight of the arms, in CSS pixels. */\n  weight: number;\n  /**\n   * Distance between neighbouring signs in CSS pixels. The grid also keeps at least half of\n   * this as empty space along every edge, so signs at the edges aren't clipped.\n   */\n  spacing: number;\n  /** How far each sign wanders around its place, in CSS pixels. `0` = still. */\n  jitter: number;\n  /** How fast the signs wander, in cycles per second. `0` = still. */\n  jitterSpeed: number;\n  /**\n   * How fully the signs turn to face the pointer while it's over the background, from `0` (not at all)\n   * to `1` (an arm of every sign points straight at the pointer).\n   */\n  pointerAlign: number;\n  /**\n   * How smoothly signs turn, in seconds: about how long a sign takes to cover two thirds of a turn.\n   * `0` = they snap to their new angle at once.\n   */\n  turnTime: number;\n  /** How fast a click wave travels outwards, in CSS pixels per second. */\n  waveSpeed: number;\n  /** How fully signs on a click wave's crest turn to face the click, from `0` to `1`. */\n  waveAlign: number;\n  /** How much heavier a click wave makes the signs it passes: `1` doubles the weight on the crest. */\n  waveWeight: number;\n  /** Width of a click wave's ring, in CSS pixels. */\n  waveWidth: number;\n  /** How long a click wave lasts before it has faded out, in seconds. */\n  waveDuration: number;\n}\n\nexport const plusDefaults: Readonly<PlusOptions> = Object.freeze({\n  color: '#8b95a5',\n  opacity: 0.6,\n  size: 4,\n  weight: 1.2,\n  spacing: 28,\n  jitter: 1,\n  jitterSpeed: 0.35,\n  pointerAlign: 1,\n  turnTime: 0.25,\n  waveSpeed: 520,\n  waveAlign: 1,\n  waveWeight: 1.5,\n  waveWidth: 60,\n  waveDuration: 1.8,\n});\n\n/** Options after clamping: what the renderers consume. */\nexport type ResolvedPlusOptions = PlusOptions;\n\nconst unit = (value: number) => Math.min(1, Math.max(0, value));\n\nexport function resolvePlusOptions(options: PlusOptions): ResolvedPlusOptions {\n  return {\n    ...options,\n    opacity: unit(options.opacity),\n    size: Math.max(0.5, options.size),\n    weight: Math.max(0.1, options.weight),\n    spacing: Math.max(4, options.spacing),\n    jitter: Math.max(0, options.jitter),\n    jitterSpeed: Math.max(0, options.jitterSpeed),\n    pointerAlign: unit(options.pointerAlign),\n    turnTime: Math.max(0, options.turnTime),\n    waveSpeed: Math.max(1, options.waveSpeed),\n    waveAlign: unit(options.waveAlign),\n    waveWeight: Math.max(0, options.waveWeight),\n    waveWidth: Math.max(1, options.waveWidth),\n    waveDuration: Math.max(0.05, options.waveDuration),\n  };\n}\n\n/** Clicks start a wave only if it would change something. */\nexport function wavesEnabled(options: ResolvedPlusOptions): boolean {\n  return options.waveAlign !== 0 || options.waveWeight !== 0;\n}\n"],"mappings":";AAwCA,IAAa,eAAsC,OAAO,OAAO;CAC/D,OAAO;CACP,SAAS;CACT,MAAM;CACN,QAAQ;CACR,SAAS;CACT,QAAQ;CACR,aAAa;CACb,cAAc;CACd,UAAU;CACV,WAAW;CACX,WAAW;CACX,YAAY;CACZ,WAAW;CACX,cAAc;AAChB,CAAC;AAKD,IAAM,QAAQ,UAAkB,KAAK,IAAI,GAAG,KAAK,IAAI,GAAG,KAAK,CAAC;AAE9D,SAAgB,mBAAmB,SAA2C;CAC5E,OAAO;EACL,GAAG;EACH,SAAS,KAAK,QAAQ,OAAO;EAC7B,MAAM,KAAK,IAAI,IAAK,QAAQ,IAAI;EAChC,QAAQ,KAAK,IAAI,IAAK,QAAQ,MAAM;EACpC,SAAS,KAAK,IAAI,GAAG,QAAQ,OAAO;EACpC,QAAQ,KAAK,IAAI,GAAG,QAAQ,MAAM;EAClC,aAAa,KAAK,IAAI,GAAG,QAAQ,WAAW;EAC5C,cAAc,KAAK,QAAQ,YAAY;EACvC,UAAU,KAAK,IAAI,GAAG,QAAQ,QAAQ;EACtC,WAAW,KAAK,IAAI,GAAG,QAAQ,SAAS;EACxC,WAAW,KAAK,QAAQ,SAAS;EACjC,YAAY,KAAK,IAAI,GAAG,QAAQ,UAAU;EAC1C,WAAW,KAAK,IAAI,GAAG,QAAQ,SAAS;EACxC,cAAc,KAAK,IAAI,KAAM,QAAQ,YAAY;CACnD;AACF;;AAGA,SAAgB,aAAa,SAAuC;CAClE,OAAO,QAAQ,cAAc,KAAK,QAAQ,eAAe;AAC3D"}

package/dist/styles/plus/options.d.cts

@@ -0,0 +1,45 @@
+export interface PlusOptions {
+    /** Colour of the signs. Any CSS colour. */
+    color: string;
+    /** Opacity of the signs, from `0` to `1`. Multiplies any alpha in the colour. */
+    opacity: number;
+    /** Length of each arm from the centre, in CSS pixels. */
+    size: number;
+    /** Stroke weight of the arms, in CSS pixels. */
+    weight: number;
+    /**
+     * Distance between neighbouring signs in CSS pixels. The grid also keeps at least half of
+     * this as empty space along every edge, so signs at the edges aren't clipped.
+     */
+    spacing: number;
+    /** How far each sign wanders around its place, in CSS pixels. `0` = still. */
+    jitter: number;
+    /** How fast the signs wander, in cycles per second. `0` = still. */
+    jitterSpeed: number;
+    /**
+     * How fully the signs turn to face the pointer while it's over the background, from `0` (not at all)
+     * to `1` (an arm of every sign points straight at the pointer).
+     */
+    pointerAlign: number;
+    /**
+     * How smoothly signs turn, in seconds: about how long a sign takes to cover two thirds of a turn.
+     * `0` = they snap to their new angle at once.
+     */
+    turnTime: number;
+    /** How fast a click wave travels outwards, in CSS pixels per second. */
+    waveSpeed: number;
+    /** How fully signs on a click wave's crest turn to face the click, from `0` to `1`. */
+    waveAlign: number;
+    /** How much heavier a click wave makes the signs it passes: `1` doubles the weight on the crest. */
+    waveWeight: number;
+    /** Width of a click wave's ring, in CSS pixels. */
+    waveWidth: number;
+    /** How long a click wave lasts before it has faded out, in seconds. */
+    waveDuration: number;
+}
+export declare const plusDefaults: Readonly<PlusOptions>;
+/** Options after clamping: what the renderers consume. */
+export type ResolvedPlusOptions = PlusOptions;
+export declare function resolvePlusOptions(options: PlusOptions): ResolvedPlusOptions;
+/** Clicks start a wave only if it would change something. */
+export declare function wavesEnabled(options: ResolvedPlusOptions): boolean;

package/dist/styles/plus/options.d.ts

@@ -0,0 +1,45 @@
+export interface PlusOptions {
+    /** Colour of the signs. Any CSS colour. */
+    color: string;
+    /** Opacity of the signs, from `0` to `1`. Multiplies any alpha in the colour. */
+    opacity: number;
+    /** Length of each arm from the centre, in CSS pixels. */
+    size: number;
+    /** Stroke weight of the arms, in CSS pixels. */
+    weight: number;
+    /**
+     * Distance between neighbouring signs in CSS pixels. The grid also keeps at least half of
+     * this as empty space along every edge, so signs at the edges aren't clipped.
+     */
+    spacing: number;
+    /** How far each sign wanders around its place, in CSS pixels. `0` = still. */
+    jitter: number;
+    /** How fast the signs wander, in cycles per second. `0` = still. */
+    jitterSpeed: number;
+    /**
+     * How fully the signs turn to face the pointer while it's over the background, from `0` (not at all)
+     * to `1` (an arm of every sign points straight at the pointer).
+     */
+    pointerAlign: number;
+    /**
+     * How smoothly signs turn, in seconds: about how long a sign takes to cover two thirds of a turn.
+     * `0` = they snap to their new angle at once.
+     */
+    turnTime: number;
+    /** How fast a click wave travels outwards, in CSS pixels per second. */
+    waveSpeed: number;
+    /** How fully signs on a click wave's crest turn to face the click, from `0` to `1`. */
+    waveAlign: number;
+    /** How much heavier a click wave makes the signs it passes: `1` doubles the weight on the crest. */
+    waveWeight: number;
+    /** Width of a click wave's ring, in CSS pixels. */
+    waveWidth: number;
+    /** How long a click wave lasts before it has faded out, in seconds. */
+    waveDuration: number;
+}
+export declare const plusDefaults: Readonly<PlusOptions>;
+/** Options after clamping: what the renderers consume. */
+export type ResolvedPlusOptions = PlusOptions;
+export declare function resolvePlusOptions(options: PlusOptions): ResolvedPlusOptions;
+/** Clicks start a wave only if it would change something. */
+export declare function wavesEnabled(options: ResolvedPlusOptions): boolean;

package/dist/styles/plus/options.js

@@ -0,0 +1,43 @@
+// src/styles/plus/options.ts
+var plusDefaults = Object.freeze({
+	color: "#8b95a5",
+	opacity: .6,
+	size: 4,
+	weight: 1.2,
+	spacing: 28,
+	jitter: 1,
+	jitterSpeed: .35,
+	pointerAlign: 1,
+	turnTime: .25,
+	waveSpeed: 520,
+	waveAlign: 1,
+	waveWeight: 1.5,
+	waveWidth: 60,
+	waveDuration: 1.8
+});
+var unit = (value) => Math.min(1, Math.max(0, value));
+function resolvePlusOptions(options) {
+	return {
+		...options,
+		opacity: unit(options.opacity),
+		size: Math.max(.5, options.size),
+		weight: Math.max(.1, options.weight),
+		spacing: Math.max(4, options.spacing),
+		jitter: Math.max(0, options.jitter),
+		jitterSpeed: Math.max(0, options.jitterSpeed),
+		pointerAlign: unit(options.pointerAlign),
+		turnTime: Math.max(0, options.turnTime),
+		waveSpeed: Math.max(1, options.waveSpeed),
+		waveAlign: unit(options.waveAlign),
+		waveWeight: Math.max(0, options.waveWeight),
+		waveWidth: Math.max(1, options.waveWidth),
+		waveDuration: Math.max(.05, options.waveDuration)
+	};
+}
+/** Clicks start a wave only if it would change something. */
+function wavesEnabled(options) {
+	return options.waveAlign !== 0 || options.waveWeight !== 0;
+}
+export { plusDefaults, resolvePlusOptions, wavesEnabled };
+
+//# sourceMappingURL=options.js.map

package/dist/styles/plus/options.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"options.js","names":[],"sources":["../../../src/styles/plus/options.ts"],"sourcesContent":["export interface PlusOptions {\n  /** Colour of the signs. Any CSS colour. */\n  color: string;\n  /** Opacity of the signs, from `0` to `1`. Multiplies any alpha in the colour. */\n  opacity: number;\n  /** Length of each arm from the centre, in CSS pixels. */\n  size: number;\n  /** Stroke weight of the arms, in CSS pixels. */\n  weight: number;\n  /**\n   * Distance between neighbouring signs in CSS pixels. The grid also keeps at least half of\n   * this as empty space along every edge, so signs at the edges aren't clipped.\n   */\n  spacing: number;\n  /** How far each sign wanders around its place, in CSS pixels. `0` = still. */\n  jitter: number;\n  /** How fast the signs wander, in cycles per second. `0` = still. */\n  jitterSpeed: number;\n  /**\n   * How fully the signs turn to face the pointer while it's over the background, from `0` (not at all)\n   * to `1` (an arm of every sign points straight at the pointer).\n   */\n  pointerAlign: number;\n  /**\n   * How smoothly signs turn, in seconds: about how long a sign takes to cover two thirds of a turn.\n   * `0` = they snap to their new angle at once.\n   */\n  turnTime: number;\n  /** How fast a click wave travels outwards, in CSS pixels per second. */\n  waveSpeed: number;\n  /** How fully signs on a click wave's crest turn to face the click, from `0` to `1`. */\n  waveAlign: number;\n  /** How much heavier a click wave makes the signs it passes: `1` doubles the weight on the crest. */\n  waveWeight: number;\n  /** Width of a click wave's ring, in CSS pixels. */\n  waveWidth: number;\n  /** How long a click wave lasts before it has faded out, in seconds. */\n  waveDuration: number;\n}\n\nexport const plusDefaults: Readonly<PlusOptions> = Object.freeze({\n  color: '#8b95a5',\n  opacity: 0.6,\n  size: 4,\n  weight: 1.2,\n  spacing: 28,\n  jitter: 1,\n  jitterSpeed: 0.35,\n  pointerAlign: 1,\n  turnTime: 0.25,\n  waveSpeed: 520,\n  waveAlign: 1,\n  waveWeight: 1.5,\n  waveWidth: 60,\n  waveDuration: 1.8,\n});\n\n/** Options after clamping: what the renderers consume. */\nexport type ResolvedPlusOptions = PlusOptions;\n\nconst unit = (value: number) => Math.min(1, Math.max(0, value));\n\nexport function resolvePlusOptions(options: PlusOptions): ResolvedPlusOptions {\n  return {\n    ...options,\n    opacity: unit(options.opacity),\n    size: Math.max(0.5, options.size),\n    weight: Math.max(0.1, options.weight),\n    spacing: Math.max(4, options.spacing),\n    jitter: Math.max(0, options.jitter),\n    jitterSpeed: Math.max(0, options.jitterSpeed),\n    pointerAlign: unit(options.pointerAlign),\n    turnTime: Math.max(0, options.turnTime),\n    waveSpeed: Math.max(1, options.waveSpeed),\n    waveAlign: unit(options.waveAlign),\n    waveWeight: Math.max(0, options.waveWeight),\n    waveWidth: Math.max(1, options.waveWidth),\n    waveDuration: Math.max(0.05, options.waveDuration),\n  };\n}\n\n/** Clicks start a wave only if it would change something. */\nexport function wavesEnabled(options: ResolvedPlusOptions): boolean {\n  return options.waveAlign !== 0 || options.waveWeight !== 0;\n}\n"],"mappings":";AAwCA,IAAa,eAAsC,OAAO,OAAO;CAC/D,OAAO;CACP,SAAS;CACT,MAAM;CACN,QAAQ;CACR,SAAS;CACT,QAAQ;CACR,aAAa;CACb,cAAc;CACd,UAAU;CACV,WAAW;CACX,WAAW;CACX,YAAY;CACZ,WAAW;CACX,cAAc;AAChB,CAAC;AAKD,IAAM,QAAQ,UAAkB,KAAK,IAAI,GAAG,KAAK,IAAI,GAAG,KAAK,CAAC;AAE9D,SAAgB,mBAAmB,SAA2C;CAC5E,OAAO;EACL,GAAG;EACH,SAAS,KAAK,QAAQ,OAAO;EAC7B,MAAM,KAAK,IAAI,IAAK,QAAQ,IAAI;EAChC,QAAQ,KAAK,IAAI,IAAK,QAAQ,MAAM;EACpC,SAAS,KAAK,IAAI,GAAG,QAAQ,OAAO;EACpC,QAAQ,KAAK,IAAI,GAAG,QAAQ,MAAM;EAClC,aAAa,KAAK,IAAI,GAAG,QAAQ,WAAW;EAC5C,cAAc,KAAK,QAAQ,YAAY;EACvC,UAAU,KAAK,IAAI,GAAG,QAAQ,QAAQ;EACtC,WAAW,KAAK,IAAI,GAAG,QAAQ,SAAS;EACxC,WAAW,KAAK,QAAQ,SAAS;EACjC,YAAY,KAAK,IAAI,GAAG,QAAQ,UAAU;EAC1C,WAAW,KAAK,IAAI,GAAG,QAAQ,SAAS;EACxC,cAAc,KAAK,IAAI,KAAM,QAAQ,YAAY;CACnD;AACF;;AAGA,SAAgB,aAAa,SAAuC;CAClE,OAAO,QAAQ,cAAc,KAAK,QAAQ,eAAe;AAC3D"}

package/dist/styles/plus/turns.cjs

@@ -0,0 +1,102 @@
+const require_grid = require("../../shared/grid.cjs");
+const require_motion = require("./motion.cjs");
+// src/styles/plus/turns.ts
+var QUARTER = Math.PI / 2;
+/** A sign has finished turning once its arm tips are this close to where they're heading, in CSS pixels. */
+var SETTLED_PX = .05;
+/** The same turn, expressed within ±45° (a "+" looks the same every 90°). */
+function wrap(angle) {
+	return angle - QUARTER * Math.round(angle / QUARTER);
+}
+function createSignTurns() {
+	let data = /* @__PURE__ */ new Float32Array(0);
+	const waveData = /* @__PURE__ */ new Float32Array(32);
+	/** Work out each wave's ring radius and envelope once per frame instead of once per sign. */
+	function packWaves(waves, speed, duration) {
+		for (let k = 0; k < waves.length; k++) {
+			const wave = waves[k];
+			waveData[k * 4] = wave.x;
+			waveData[k * 4 + 1] = wave.y;
+			waveData[k * 4 + 2] = speed * wave.age;
+			waveData[k * 4 + 3] = require_grid.waveEnvelope(wave.age, duration);
+		}
+	}
+	let changed = false;
+	let settling = false;
+	let lastX = NaN;
+	let lastY = NaN;
+	let lastAlign = NaN;
+	let lastOriginX = NaN;
+	let lastOriginY = NaN;
+	let lastOptions = null;
+	let hadWaves = false;
+	return {
+		get data() {
+			return data;
+		},
+		get changed() {
+			return changed;
+		},
+		get settling() {
+			return settling;
+		},
+		update(frame, options, grid, waves) {
+			const { cols, rows, originX, originY } = grid;
+			const { spacing, waveSpeed, waveWidth, waveDuration, waveAlign } = options;
+			const resized = data.length !== cols * rows * 2;
+			if (resized) data = new Float32Array(cols * rows * 2);
+			const align = options.pointerAlign * frame.pointer.influence;
+			const { x: px, y: py } = frame.pointer;
+			const unchanged = !resized && !settling && !hadWaves && waves.length === 0 && align === lastAlign && (align === 0 || px === lastX && py === lastY && originX === lastOriginX && originY === lastOriginY && options === lastOptions);
+			hadWaves = waves.length > 0;
+			if (unchanged) {
+				changed = false;
+				return;
+			}
+			lastX = px;
+			lastY = py;
+			lastAlign = align;
+			lastOriginX = originX;
+			lastOriginY = originY;
+			lastOptions = options;
+			const waveCount = waves.length;
+			packWaves(waves, waveSpeed, waveDuration);
+			const waveReach = 3 * waveWidth;
+			const settled = SETTLED_PX / options.size;
+			const ease = options.turnTime > 0 ? 1 - Math.exp(-frame.dt / options.turnTime) : 1;
+			settling = false;
+			for (let j = 0; j < rows; j++) {
+				const restY = originY + j * spacing;
+				for (let i = 0; i < cols; i++) {
+					const restX = originX + i * spacing;
+					let target = 0;
+					if (align !== 0) target = align * require_motion.facingAngle(restX - px, restY - py);
+					let ring = 0;
+					for (let w = 0; w < waveCount * 4; w += 4) {
+						const dx = restX - waveData[w];
+						const dy = restY - waveData[w + 1];
+						const outer = waveData[w + 2] + waveReach;
+						if (Math.abs(dx) > outer || Math.abs(dy) > outer) continue;
+						const distance = Math.sqrt(dx * dx + dy * dy);
+						if (Math.abs(distance - waveData[w + 2]) > waveReach) continue;
+						const height = require_grid.waveRing(distance, waveData[w + 2], waveWidth) * waveData[w + 3];
+						ring += height;
+						target += waveAlign * Math.min(1, height) * require_motion.facingAngle(dx, dy);
+					}
+					const k = (j * cols + i) * 2;
+					const remaining = wrap(target - data[k]);
+					if (Math.abs(remaining) < settled) data[k] = wrap(target);
+					else {
+						data[k] = wrap(data[k] + remaining * ease);
+						settling = true;
+					}
+					data[k + 1] = ring;
+				}
+			}
+			changed = true;
+		}
+	};
+}
+exports.createSignTurns = createSignTurns;
+
+//# sourceMappingURL=turns.cjs.map

package/dist/styles/plus/turns.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"turns.cjs","names":["waveEnvelope","facingAngle","waveRing"],"sources":["../../../src/styles/plus/turns.ts"],"sourcesContent":["import type { Frame } from '../../core/style';\nimport { MAX_WAVES, waveEnvelope, waveRing, type Grid, type Wave } from '../../shared/grid';\nimport { facingAngle } from './motion';\nimport type { ResolvedPlusOptions } from './options';\n\nconst QUARTER = Math.PI / 2;\n/** A sign has finished turning once its arm tips are this close to where they're heading, in CSS pixels. */\nconst SETTLED_PX = 0.05;\n\n/** The same turn, expressed within ±45° (a \"+\" looks the same every 90°). */\nfunction wrap(angle: number): number {\n  return angle - QUARTER * Math.round(angle / QUARTER);\n}\n\n/**\n * Each sign's angle and wave-crest height, kept between frames so signs ease\n * towards the angle they want instead of jumping to it. Both renderers use it.\n */\nexport interface SignTurns {\n  /** Angle (radians) and wave-crest height of every sign, row-major, as pairs. */\n  readonly data: Float32Array<ArrayBuffer>;\n  /** Whether `data` changed in the last update. */\n  readonly changed: boolean;\n  /** Whether any sign is still turning towards its target. */\n  readonly settling: boolean;\n  update(frame: Frame, options: ResolvedPlusOptions, grid: Grid, waves: readonly Wave[]): void;\n}\n\nexport function createSignTurns(): SignTurns {\n  let data = new Float32Array(0);\n  const waveData = new Float32Array(MAX_WAVES * 4);\n\n  /** Work out each wave's ring radius and envelope once per frame instead of once per sign. */\n  function packWaves(waves: readonly Wave[], speed: number, duration: number): void {\n    for (let k = 0; k < waves.length; k++) {\n      const wave = waves[k];\n      waveData[k * 4] = wave.x;\n      waveData[k * 4 + 1] = wave.y;\n      waveData[k * 4 + 2] = speed * wave.age;\n      waveData[k * 4 + 3] = waveEnvelope(wave.age, duration);\n    }\n  }\n  let changed = false;\n  let settling = false;\n  // What the last update computed from: if none of it changes, neither do the angles.\n  let lastX = NaN;\n  let lastY = NaN;\n  let lastAlign = NaN;\n  let lastOriginX = NaN;\n  let lastOriginY = NaN;\n  let lastOptions: ResolvedPlusOptions | null = null;\n  let hadWaves = false;\n\n  return {\n    get data() {\n      return data;\n    },\n    get changed() {\n      return changed;\n    },\n    get settling() {\n      return settling;\n    },\n    update(frame, options, grid, waves) {\n      const { cols, rows, originX, originY } = grid;\n      const { spacing, waveSpeed, waveWidth, waveDuration, waveAlign } = options;\n      const resized = data.length !== cols * rows * 2;\n      if (resized) data = new Float32Array(cols * rows * 2);\n\n      const align = options.pointerAlign * frame.pointer.influence;\n      const { x: px, y: py } = frame.pointer;\n      // Nothing is turning and nothing it depends on has moved: the angles are already right.\n      // With no pointer, every sign is upright whatever the grid or options.\n      const unchanged =\n        !resized &&\n        !settling &&\n        !hadWaves &&\n        waves.length === 0 &&\n        align === lastAlign &&\n        (align === 0 ||\n          (px === lastX && py === lastY && originX === lastOriginX && originY === lastOriginY && options === lastOptions));\n      hadWaves = waves.length > 0;\n      if (unchanged) {\n        changed = false;\n        return;\n      }\n      lastX = px;\n      lastY = py;\n      lastAlign = align;\n      lastOriginX = originX;\n      lastOriginY = originY;\n      lastOptions = options;\n\n      // Each wave as x, y, ring radius, envelope. Further than 3 widths from its ring a wave is below e⁻⁹: skipped.\n      const waveCount = waves.length;\n      packWaves(waves, waveSpeed, waveDuration);\n      const waveReach = 3 * waveWidth;\n      const settled = SETTLED_PX / options.size;\n      const ease = options.turnTime > 0 ? 1 - Math.exp(-frame.dt / options.turnTime) : 1;\n      settling = false;\n\n      for (let j = 0; j < rows; j++) {\n        const restY = originY + j * spacing;\n        for (let i = 0; i < cols; i++) {\n          const restX = originX + i * spacing;\n\n          let target = 0;\n          // While the pointer is over the background, every sign turns to face it.\n          if (align !== 0) target = align * facingAngle(restX - px, restY - py);\n\n          let ring = 0;\n          for (let w = 0; w < waveCount * 4; w += 4) {\n            const dx = restX - waveData[w];\n            const dy = restY - waveData[w + 1];\n            const outer = waveData[w + 2] + waveReach;\n            if (Math.abs(dx) > outer || Math.abs(dy) > outer) continue;\n            const distance = Math.sqrt(dx * dx + dy * dy);\n            if (Math.abs(distance - waveData[w + 2]) > waveReach) continue;\n            const height = waveRing(distance, waveData[w + 2], waveWidth) * waveData[w + 3];\n            ring += height;\n            // On the crest, signs turn to face the click.\n            target += waveAlign * Math.min(1, height) * facingAngle(dx, dy);\n          }\n\n          // Ease towards the target the short way round, so a sign never spins more than 45°.\n          const k = (j * cols + i) * 2;\n          const remaining = wrap(target - data[k]);\n          if (Math.abs(remaining) < settled) {\n            data[k] = wrap(target);\n          } else {\n            data[k] = wrap(data[k] + remaining * ease);\n            settling = true;\n          }\n          data[k + 1] = ring;\n        }\n      }\n      changed = true;\n    },\n  };\n}\n"],"mappings":"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"}

package/dist/styles/plus/turns.d.cts

@@ -0,0 +1,17 @@
+import type { Frame } from '../../core/style.cjs';
+import { type Grid, type Wave } from '../../shared/grid.cjs';
+import type { ResolvedPlusOptions } from './options.cjs';
+/**
+ * Each sign's angle and wave-crest height, kept between frames so signs ease
+ * towards the angle they want instead of jumping to it. Both renderers use it.
+ */
+export interface SignTurns {
+    /** Angle (radians) and wave-crest height of every sign, row-major, as pairs. */
+    readonly data: Float32Array<ArrayBuffer>;
+    /** Whether `data` changed in the last update. */
+    readonly changed: boolean;
+    /** Whether any sign is still turning towards its target. */
+    readonly settling: boolean;
+    update(frame: Frame, options: ResolvedPlusOptions, grid: Grid, waves: readonly Wave[]): void;
+}
+export declare function createSignTurns(): SignTurns;

package/dist/styles/plus/turns.d.ts

@@ -0,0 +1,17 @@
+import type { Frame } from '../../core/style.js';
+import { type Grid, type Wave } from '../../shared/grid.js';
+import type { ResolvedPlusOptions } from './options.js';
+/**
+ * Each sign's angle and wave-crest height, kept between frames so signs ease
+ * towards the angle they want instead of jumping to it. Both renderers use it.
+ */
+export interface SignTurns {
+    /** Angle (radians) and wave-crest height of every sign, row-major, as pairs. */
+    readonly data: Float32Array<ArrayBuffer>;
+    /** Whether `data` changed in the last update. */
+    readonly changed: boolean;
+    /** Whether any sign is still turning towards its target. */
+    readonly settling: boolean;
+    update(frame: Frame, options: ResolvedPlusOptions, grid: Grid, waves: readonly Wave[]): void;
+}
+export declare function createSignTurns(): SignTurns;