@weasel-js/core 1.10.1 → 1.11.1

package/dist/core/viewport/screenSlop.js

@@ -1,33 +1,56 @@
-import { multiply as e, scale as t } from "@weasel-js/geom";
+import { multiply, scale } from "@weasel-js/geom";
+
 //#region src/core/viewport/screenSlop.ts
-function n(n, r) {
-	if (n === void 0) return {
+/**
+* Pointer forgiveness measured on screen.
+*
+* A pick slop is a screen distance: "within 4px of the outline". Converting it
+* to a world distance — per axis or as one scalar — is exact only when the
+* frame the geometry lives in reaches the screen by a similarity. A rotated
+* node under non-uniform zoom does not: a screen circle pulled back into its
+* frame is a tilted ellipse, so the test is run against the geometry's screen
+* image instead (`strokeHitTest`'s `slop`).
+*/
+/**
+* How `strokeHitTest` should apply a slop to geometry in a frame that
+* reaches world by `frame` (`poseFrameOf`; only its linear part is read): a
+* world slop adds to the threshold, a screen slop is handed over with the
+* frame's map to the screen.
+*/
+function slopForStrokeHit(slop, frame) {
+	if (slop === void 0) return {
 		extra: 0,
 		opts: {}
 	};
-	if (typeof n == "number") return {
-		extra: n,
+	if (typeof slop === "number") return {
+		extra: slop,
 		opts: {}
 	};
-	let i = t(n.scale.x, n.scale.y);
+	const s = scale(slop.scale.x, slop.scale.y);
 	return {
 		extra: 0,
 		opts: { slop: {
-			px: n.px,
-			transform: r ? e(i, r) : i
+			px: slop.px,
+			transform: frame ? multiply(s, frame) : s
 		} }
 	};
 }
-function r(e, t, n = 1) {
-	return t > 0 ? typeof e == "object" ? {
-		...e,
-		px: e.px + t
-	} : (e ?? 0) + t / (n > 0 ? n : 1) : e;
+/** `slop` widened by `px` screen pixels — kept on screen when it is measured
+*  there, and read at `scale` when it is a world distance. */
+function widenSlop(slop, px, scale = 1) {
+	if (!(px > 0)) return slop;
+	if (typeof slop === "object") return {
+		...slop,
+		px: slop.px + px
+	};
+	return (slop ?? 0) + px / (scale > 0 ? scale : 1);
 }
-function i(e) {
-	return e === void 0 ? !1 : typeof e == "number" ? e > 0 : e.px > 0;
+/** Is any slop set at all? A zero reach plus a zero slop hits nothing. */
+function hasSlop(slop) {
+	if (slop === void 0) return false;
+	return typeof slop === "number" ? slop > 0 : slop.px > 0;
 }
-//#endregion
-export { i as hasSlop, n as slopForStrokeHit, r as widenSlop };
 
+//#endregion
+export { hasSlop, slopForStrokeHit, widenSlop };
 //# sourceMappingURL=screenSlop.js.map

package/dist/core/viewport/screenSlop.js.map

@@ -1 +1 @@
-{"version":3,"file":"screenSlop.js","names":["scaleMat","slopForStrokeHit","slop","s","scale","frame","multiply","widenSlop","px","hasSlop"],"sources":["../../../src/core/viewport/screenSlop.ts"],"sourcesContent":["/**\n * Pointer forgiveness measured on screen.\n *\n * A pick slop is a screen distance: \"within 4px of the outline\". Converting it\n * to a world distance — per axis or as one scalar — is exact only when the\n * frame the geometry lives in reaches the screen by a similarity. A rotated\n * node under non-uniform zoom does not: a screen circle pulled back into its\n * frame is a tilted ellipse, so the test is run against the geometry's screen\n * image instead (`strokeHitTest`'s `slop`).\n */\nimport { multiply, scale as scaleMat, type Affine } from '@weasel-js/geom';\nimport type { Scale2 } from '@weasel-js/geom';\n\n/** `px` screen pixels under a view whose per-axis scale is `scale`. */\nexport interface ScreenSlop {\n  px: number;\n  scale: Scale2;\n}\n\n/** A slop in world units (a number, the view-less form) or on screen. */\nexport type PickSlop = number | ScreenSlop;\n\n/**\n * How `strokeHitTest` should apply a slop to geometry in a frame that\n * reaches world by `frame` (`poseFrameOf`; only its linear part is read): a\n * world slop adds to the threshold, a screen slop is handed over with the\n * frame's map to the screen.\n */\nexport function slopForStrokeHit(\n  slop: PickSlop | undefined,\n  frame?: Affine | null,\n): { extra: number; opts: { slop?: { px: number; transform: Affine } } } {\n  if (slop === undefined) return { extra: 0, opts: {} };\n  if (typeof slop === 'number') return { extra: slop, opts: {} };\n  const s = scaleMat(slop.scale.x, slop.scale.y);\n  return {\n    extra: 0,\n    opts: { slop: { px: slop.px, transform: frame ? multiply(s, frame) : s } },\n  };\n}\n\n/** `slop` widened by `px` screen pixels — kept on screen when it is measured\n *  there, and read at `scale` when it is a world distance. */\nexport function widenSlop(slop: PickSlop | undefined, px: number, scale = 1): PickSlop | undefined {\n  if (!(px > 0)) return slop;\n  if (typeof slop === 'object') return { ...slop, px: slop.px + px };\n  return (slop ?? 0) + px / (scale > 0 ? scale : 1);\n}\n\n/** Is any slop set at all? A zero reach plus a zero slop hits nothing. */\nexport function hasSlop(slop: PickSlop | undefined): boolean {\n  if (slop === undefined) return false;\n  return typeof slop === 'number' ? slop > 0 : slop.px > 0;\n}\n"],"mappings":";;AA4BA,SAAgBC,EACd,GACA,GACuE;CACvE,IAAIC,MAAS,KAAA,GAAW,OAAO;EAAE,OAAO;EAAG,MAAM,CAAC;CAAE;CACpD,IAAI,OAAOA,KAAS,UAAU,OAAO;EAAE,OAAOA;EAAM,MAAM,CAAC;CAAE;CAC7D,IAAMC,IAAIH,EAASE,EAAK,MAAM,GAAGA,EAAK,MAAM,CAAC;CAC7C,OAAO;EACL,OAAO;EACP,MAAM,EAAE,MAAM;GAAE,IAAIA,EAAK;GAAI,WAAWG,IAAQC,EAASH,GAAGE,CAAK,IAAIF;EAAE,EAAE;CAC3E;AACF;AAIA,SAAgBI,EAAU,GAA4B,GAAY,IAAQ,GAAyB;CAGjG,OAFMC,IAAK,IACP,OAAON,KAAS,WAAiB;EAAE,GAAGA;EAAM,IAAIA,EAAK,KAAKM;CAAG,KACzDN,KAAQ,KAAKM,KAAMJ,IAAQ,IAAIA,IAAQ,KAFzBF;AAGxB;AAGA,SAAgBO,EAAQ,GAAqC;CAE3D,OADIP,MAAS,KAAA,IAAkB,KACxB,OAAOA,KAAS,WAAWA,IAAO,IAAIA,EAAK,KAAK;AACzD"}
+{"version":3,"file":"screenSlop.js","names":["scaleMat"],"sources":["../../../src/core/viewport/screenSlop.ts"],"sourcesContent":["/**\n * Pointer forgiveness measured on screen.\n *\n * A pick slop is a screen distance: \"within 4px of the outline\". Converting it\n * to a world distance — per axis or as one scalar — is exact only when the\n * frame the geometry lives in reaches the screen by a similarity. A rotated\n * node under non-uniform zoom does not: a screen circle pulled back into its\n * frame is a tilted ellipse, so the test is run against the geometry's screen\n * image instead (`strokeHitTest`'s `slop`).\n */\nimport { multiply, scale as scaleMat, type Affine } from '@weasel-js/geom';\nimport type { Scale2 } from '@weasel-js/geom';\n\n/** `px` screen pixels under a view whose per-axis scale is `scale`. */\nexport interface ScreenSlop {\n  px: number;\n  scale: Scale2;\n}\n\n/** A slop in world units (a number, the view-less form) or on screen. */\nexport type PickSlop = number | ScreenSlop;\n\n/**\n * How `strokeHitTest` should apply a slop to geometry in a frame that\n * reaches world by `frame` (`poseFrameOf`; only its linear part is read): a\n * world slop adds to the threshold, a screen slop is handed over with the\n * frame's map to the screen.\n */\nexport function slopForStrokeHit(\n  slop: PickSlop | undefined,\n  frame?: Affine | null,\n): { extra: number; opts: { slop?: { px: number; transform: Affine } } } {\n  if (slop === undefined) return { extra: 0, opts: {} };\n  if (typeof slop === 'number') return { extra: slop, opts: {} };\n  const s = scaleMat(slop.scale.x, slop.scale.y);\n  return {\n    extra: 0,\n    opts: { slop: { px: slop.px, transform: frame ? multiply(s, frame) : s } },\n  };\n}\n\n/** `slop` widened by `px` screen pixels — kept on screen when it is measured\n *  there, and read at `scale` when it is a world distance. */\nexport function widenSlop(slop: PickSlop | undefined, px: number, scale = 1): PickSlop | undefined {\n  if (!(px > 0)) return slop;\n  if (typeof slop === 'object') return { ...slop, px: slop.px + px };\n  return (slop ?? 0) + px / (scale > 0 ? scale : 1);\n}\n\n/** Is any slop set at all? A zero reach plus a zero slop hits nothing. */\nexport function hasSlop(slop: PickSlop | undefined): boolean {\n  if (slop === undefined) return false;\n  return typeof slop === 'number' ? slop > 0 : slop.px > 0;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;AA4BA,SAAgB,iBACd,MACA,OACuE;CACvE,IAAI,SAAS,QAAW,OAAO;EAAE,OAAO;EAAG,MAAM,CAAC;CAAE;CACpD,IAAI,OAAO,SAAS,UAAU,OAAO;EAAE,OAAO;EAAM,MAAM,CAAC;CAAE;CAC7D,MAAM,IAAIA,MAAS,KAAK,MAAM,GAAG,KAAK,MAAM,CAAC;CAC7C,OAAO;EACL,OAAO;EACP,MAAM,EAAE,MAAM;GAAE,IAAI,KAAK;GAAI,WAAW,QAAQ,SAAS,GAAG,KAAK,IAAI;EAAE,EAAE;CAC3E;AACF;;;AAIA,SAAgB,UAAU,MAA4B,IAAY,QAAQ,GAAyB;CACjG,IAAI,EAAE,KAAK,IAAI,OAAO;CACtB,IAAI,OAAO,SAAS,UAAU,OAAO;EAAE,GAAG;EAAM,IAAI,KAAK,KAAK;CAAG;CACjE,QAAQ,QAAQ,KAAK,MAAM,QAAQ,IAAI,QAAQ;AACjD;;AAGA,SAAgB,QAAQ,MAAqC;CAC3D,IAAI,SAAS,QAAW,OAAO;CAC/B,OAAO,OAAO,SAAS,WAAW,OAAO,IAAI,KAAK,KAAK;AACzD"}

package/dist/core/viewport/useAutoCenter.js

@@ -1,32 +1,46 @@
-import { fitZoom as e } from "./fitToBounds.js";
-import { useEffect as t, useRef as n } from "react";
+import { fitZoom } from "./fitToBounds.js";
+import { useEffect, useRef } from "react";
+
 //#region src/core/viewport/useAutoCenter.ts
-function r(t, n, r, i, a = .85) {
-	let o = e(t * a, n * a, r, i), s = r * o, c = i * o;
+/**
+* Compute zoom and pan that fit `contentW x contentH` (in content units)
+* inside `viewportW x viewportH` (in pixels). `padRatio` is the fraction of
+* each axis to fill (default 0.85 — leaves a uniform 15% margin).
+*/
+function computeFitViewport(viewportW, viewportH, contentW, contentH, padRatio = .85) {
+	const zoom = fitZoom(viewportW * padRatio, viewportH * padRatio, contentW, contentH);
+	const cw = contentW * zoom;
+	const ch = contentH * zoom;
 	return {
-		zoom: o,
-		panX: (t - s) / 2,
-		panY: (n - c) / 2
+		zoom,
+		panX: (viewportW - cw) / 2,
+		panY: (viewportH - ch) / 2
 	};
 }
-function i(e, i, a, o, s, c) {
-	let l = n(!1);
-	t(() => {
-		if (e > 0 && i > 0 && !l.current) {
-			l.current = !0;
-			let t = r(e, i, a, o);
-			s(t.zoom), c(t.panX, t.panY);
+/**
+* Run `computeFitViewport` once when the viewport first has non-zero size, and
+* apply the result via the supplied setters. Subsequent size changes are
+* ignored — this hook centers exactly once.
+*/
+function useAutoCenter(width, height, contentW, contentH, setZoom, setPan) {
+	const hasCentered = useRef(false);
+	useEffect(() => {
+		if (width > 0 && height > 0 && !hasCentered.current) {
+			hasCentered.current = true;
+			const fit = computeFitViewport(width, height, contentW, contentH);
+			setZoom(fit.zoom);
+			setPan(fit.panX, fit.panY);
 		}
 	}, [
-		e,
-		i,
-		a,
-		o,
-		s,
-		c
+		width,
+		height,
+		contentW,
+		contentH,
+		setZoom,
+		setPan
 	]);
 }
-//#endregion
-export { r as computeFitViewport, i as useAutoCenter };
 
+//#endregion
+export { computeFitViewport, useAutoCenter };
 //# sourceMappingURL=useAutoCenter.js.map

package/dist/core/viewport/useAutoCenter.js.map

@@ -1 +1 @@
-{"version":3,"file":"useAutoCenter.js","names":["computeFitViewport","zoom","fitZoom","viewportW","padRatio","viewportH","contentW","contentH","cw","ch","useAutoCenter","hasCentered","useRef","width","height","fit","setZoom","setPan"],"sources":["../../../src/core/viewport/useAutoCenter.ts"],"sourcesContent":["import { useEffect, useRef } from 'react';\nimport { fitZoom } from './fitToBounds';\n\n/**\n * Compute zoom and pan that fit `contentW x contentH` (in content units)\n * inside `viewportW x viewportH` (in pixels). `padRatio` is the fraction of\n * each axis to fill (default 0.85 — leaves a uniform 15% margin).\n */\nexport function computeFitViewport(\n  viewportW: number,\n  viewportH: number,\n  contentW: number,\n  contentH: number,\n  padRatio = 0.85,\n): { zoom: number; panX: number; panY: number } {\n  const zoom = fitZoom(viewportW * padRatio, viewportH * padRatio, contentW, contentH);\n  const cw = contentW * zoom;\n  const ch = contentH * zoom;\n  return { zoom, panX: (viewportW - cw) / 2, panY: (viewportH - ch) / 2 };\n}\n\n/**\n * Run `computeFitViewport` once when the viewport first has non-zero size, and\n * apply the result via the supplied setters. Subsequent size changes are\n * ignored — this hook centers exactly once.\n */\nexport function useAutoCenter(\n  width: number,\n  height: number,\n  contentW: number,\n  contentH: number,\n  setZoom: (z: number) => void,\n  setPan: (x: number, y: number) => void,\n) {\n  const hasCentered = useRef(false);\n\n  useEffect(() => {\n    if (width > 0 && height > 0 && !hasCentered.current) {\n      hasCentered.current = true;\n      const fit = computeFitViewport(width, height, contentW, contentH);\n      setZoom(fit.zoom);\n      setPan(fit.panX, fit.panY);\n    }\n  }, [width, height, contentW, contentH, setZoom, setPan]);\n}\n"],"mappings":";;;AAQA,SAAgBA,EACd,GACA,GACA,GACA,GACA,IAAW,KACmC;CAC9C,IAAMC,IAAOC,EAAQC,IAAYC,GAAUC,IAAYD,GAAUE,GAAUC,CAAQ,GAC7EC,IAAKF,IAAWL,GAChBQ,IAAKF,IAAWN;CACtB,OAAO;EAAE;EAAM,OAAOE,IAAYK,KAAM;EAAG,OAAOH,IAAYI,KAAM;CAAE;AACxE;AAOA,SAAgBC,EACd,GACA,GACA,GACA,GACA,GACA,GACA;CACA,IAAMC,IAAcC,EAAO,EAAK;CAEhC,QAAgB;EACd,IAAIC,IAAQ,KAAKC,IAAS,KAAK,CAACH,EAAY,SAAS;GACnD,EAAY,UAAU;GACtB,IAAMI,IAAMf,EAAmBa,GAAOC,GAAQR,GAAUC,CAAQ;GAEhE,AADAS,EAAQD,EAAI,IAAI,GAChBE,EAAOF,EAAI,MAAMA,EAAI,IAAI;EAC3B;CACF,GAAG;EAACF;EAAOC;EAAQR;EAAUC;EAAUS;EAASC;CAAM,CAAC;AACzD"}
+{"version":3,"file":"useAutoCenter.js","names":[],"sources":["../../../src/core/viewport/useAutoCenter.ts"],"sourcesContent":["import { useEffect, useRef } from 'react';\nimport { fitZoom } from './fitToBounds';\n\n/**\n * Compute zoom and pan that fit `contentW x contentH` (in content units)\n * inside `viewportW x viewportH` (in pixels). `padRatio` is the fraction of\n * each axis to fill (default 0.85 — leaves a uniform 15% margin).\n */\nexport function computeFitViewport(\n  viewportW: number,\n  viewportH: number,\n  contentW: number,\n  contentH: number,\n  padRatio = 0.85,\n): { zoom: number; panX: number; panY: number } {\n  const zoom = fitZoom(viewportW * padRatio, viewportH * padRatio, contentW, contentH);\n  const cw = contentW * zoom;\n  const ch = contentH * zoom;\n  return { zoom, panX: (viewportW - cw) / 2, panY: (viewportH - ch) / 2 };\n}\n\n/**\n * Run `computeFitViewport` once when the viewport first has non-zero size, and\n * apply the result via the supplied setters. Subsequent size changes are\n * ignored — this hook centers exactly once.\n */\nexport function useAutoCenter(\n  width: number,\n  height: number,\n  contentW: number,\n  contentH: number,\n  setZoom: (z: number) => void,\n  setPan: (x: number, y: number) => void,\n) {\n  const hasCentered = useRef(false);\n\n  useEffect(() => {\n    if (width > 0 && height > 0 && !hasCentered.current) {\n      hasCentered.current = true;\n      const fit = computeFitViewport(width, height, contentW, contentH);\n      setZoom(fit.zoom);\n      setPan(fit.panX, fit.panY);\n    }\n  }, [width, height, contentW, contentH, setZoom, setPan]);\n}\n"],"mappings":";;;;;;;;;AAQA,SAAgB,mBACd,WACA,WACA,UACA,UACA,WAAW,KACmC;CAC9C,MAAM,OAAO,QAAQ,YAAY,UAAU,YAAY,UAAU,UAAU,QAAQ;CACnF,MAAM,KAAK,WAAW;CACtB,MAAM,KAAK,WAAW;CACtB,OAAO;EAAE;EAAM,OAAO,YAAY,MAAM;EAAG,OAAO,YAAY,MAAM;CAAE;AACxE;;;;;;AAOA,SAAgB,cACd,OACA,QACA,UACA,UACA,SACA,QACA;CACA,MAAM,cAAc,OAAO,KAAK;CAEhC,gBAAgB;EACd,IAAI,QAAQ,KAAK,SAAS,KAAK,CAAC,YAAY,SAAS;GACnD,YAAY,UAAU;GACtB,MAAM,MAAM,mBAAmB,OAAO,QAAQ,UAAU,QAAQ;GAChE,QAAQ,IAAI,IAAI;GAChB,OAAO,IAAI,MAAM,IAAI,IAAI;EAC3B;CACF,GAAG;EAAC;EAAO;EAAQ;EAAU;EAAU;EAAS;CAAM,CAAC;AACzD"}

package/dist/core/viewport/useCanvasSize.js

@@ -1,29 +1,50 @@
-import { useDeviceProfile as e } from "../device/useDeviceProfile.js";
-import { useCallback as t, useEffect as n, useState as r } from "react";
+import { useDeviceProfile } from "../device/useDeviceProfile.js";
+import { useCallback, useEffect, useState } from "react";
+
 //#region src/core/viewport/useCanvasSize.ts
-function i(i) {
-	let { dpr: a } = e(), [o, s] = r({
+/** Track a container's content-rect size via `ResizeObserver`, and density via
+*  the ambient `DeviceProfile`.
+*
+*  Density deliberately does NOT come from a `window.devicePixelRatio` read
+*  inside the resize callback: that only refreshes when the element resizes,
+*  so dragging a window to a different-density display without resizing it
+*  leaves the snapshot stale. */
+function useCanvasSize(containerRef) {
+	const { dpr } = useDeviceProfile();
+	const { width, height } = useElementSize(containerRef);
+	return {
+		width,
+		height,
+		dpr
+	};
+}
+/** An element's CSS-pixel size, `0 × 0` until it is mounted and measured.
+*  Re-measured whenever a `ResizeObserver` reports it resized. */
+function useElementSize(containerRef) {
+	const [size, setSize] = useState({
 		width: 0,
 		height: 0
-	}), c = t(() => {
-		if (!i.current) return;
-		let e = i.current.getBoundingClientRect();
-		s((t) => t.width === e.width && t.height === e.height ? t : {
-			width: e.width,
-			height: e.height
+	});
+	const measure = useCallback(() => {
+		if (!containerRef.current) return;
+		const rect = containerRef.current.getBoundingClientRect();
+		setSize((prev) => prev.width === rect.width && prev.height === rect.height ? prev : {
+			width: rect.width,
+			height: rect.height
 		});
-	}, [i]);
-	return n(() => {
-		c();
-		let e = new ResizeObserver(c);
-		return i.current && e.observe(i.current), () => e.disconnect();
-	}, [c, i]), {
-		width: o.width,
-		height: o.height,
-		dpr: a
-	};
+	}, [containerRef]);
+	useEffect(() => {
+		const el = containerRef.current;
+		if (!el) return;
+		measure();
+		if (typeof ResizeObserver === "undefined") return;
+		const observer = new ResizeObserver(measure);
+		observer.observe(el);
+		return () => observer.disconnect();
+	}, [measure, containerRef]);
+	return size;
 }
-//#endregion
-export { i as useCanvasSize };
 
+//#endregion
+export { useCanvasSize, useElementSize };
 //# sourceMappingURL=useCanvasSize.js.map

package/dist/core/viewport/useCanvasSize.js.map

@@ -1 +1 @@
-{"version":3,"file":"useCanvasSize.js","names":["useCanvasSize","useDeviceProfile","size","setSize","useState","measure","useCallback","containerRef","rect","prev","useEffect","observer"],"sources":["../../../src/core/viewport/useCanvasSize.ts"],"sourcesContent":["import { type RefObject, useCallback, useEffect, useState } from 'react';\nimport type { CanvasSize } from './clampView';\nimport { useDeviceProfile } from '../device/useDeviceProfile';\n\n/** Size snapshot returned by `useCanvasSize` — the kit-wide `CanvasSize`\n *  (width × height in CSS pixels) plus the current devicePixelRatio. */\nexport interface CanvasSizeSnapshot extends CanvasSize {\n  dpr: number;\n}\n\n/** Track a container's content-rect size via `ResizeObserver`, and density via\n *  the ambient `DeviceProfile`.\n *\n *  Density deliberately does NOT come from a `window.devicePixelRatio` read\n *  inside the resize callback: that only refreshes when the element resizes,\n *  so dragging a window to a different-density display without resizing it\n *  leaves the snapshot stale. */\nexport function useCanvasSize(containerRef: RefObject<HTMLElement | null>): CanvasSizeSnapshot {\n  const { dpr } = useDeviceProfile();\n  const [size, setSize] = useState<CanvasSize>({ width: 0, height: 0 });\n\n  const measure = useCallback(() => {\n    if (!containerRef.current) return;\n    const rect = containerRef.current.getBoundingClientRect();\n    setSize((prev) =>\n      prev.width === rect.width && prev.height === rect.height\n        ? prev\n        : { width: rect.width, height: rect.height },\n    );\n  }, [containerRef]);\n\n  useEffect(() => {\n    measure();\n    const observer = new ResizeObserver(measure);\n    if (containerRef.current) {\n      observer.observe(containerRef.current);\n    }\n    return () => observer.disconnect();\n  }, [measure, containerRef]);\n\n  return { width: size.width, height: size.height, dpr };\n}\n"],"mappings":";;;AAiBA,SAAgBA,EAAc,GAAiE;CAC7F,IAAM,EAAE,WAAQC,EAAiB,GAC3B,CAACC,GAAMC,KAAWC,EAAqB;EAAE,OAAO;EAAG,QAAQ;CAAE,CAAC,GAE9DC,IAAUC,QAAkB;EAChC,IAAI,CAACC,EAAa,SAAS;EAC3B,IAAMC,IAAOD,EAAa,QAAQ,sBAAsB;EACxD,GAAS,MACPE,EAAK,UAAUD,EAAK,SAASC,EAAK,WAAWD,EAAK,SAC9CC,IACA;GAAE,OAAOD,EAAK;GAAO,QAAQA,EAAK;EAAO,CAC/C;CACF,GAAG,CAACD,CAAY,CAAC;CAWjB,OATAG,QAAgB;EACd,EAAQ;EACR,IAAMC,IAAW,IAAI,eAAeN,CAAO;EAI3C,OAHIE,EAAa,WACfI,EAAS,QAAQJ,EAAa,OAAO,SAE1BI,EAAS,WAAW;CACnC,GAAG,CAACN,GAASE,CAAY,CAAC,GAEnB;EAAE,OAAOL,EAAK;EAAO,QAAQA,EAAK;EAAQ;CAAI;AACvD"}
+{"version":3,"file":"useCanvasSize.js","names":[],"sources":["../../../src/core/viewport/useCanvasSize.ts"],"sourcesContent":["import { type RefObject, useCallback, useEffect, useState } from 'react';\nimport type { CanvasSize } from './clampView';\nimport { useDeviceProfile } from '../device/useDeviceProfile';\n\n/** Size snapshot returned by `useCanvasSize` — the kit-wide `CanvasSize`\n *  (width × height in CSS pixels) plus the current devicePixelRatio. */\nexport interface CanvasSizeSnapshot extends CanvasSize {\n  dpr: number;\n}\n\n/** Track a container's content-rect size via `ResizeObserver`, and density via\n *  the ambient `DeviceProfile`.\n *\n *  Density deliberately does NOT come from a `window.devicePixelRatio` read\n *  inside the resize callback: that only refreshes when the element resizes,\n *  so dragging a window to a different-density display without resizing it\n *  leaves the snapshot stale. */\nexport function useCanvasSize(containerRef: RefObject<HTMLElement | null>): CanvasSizeSnapshot {\n  const { dpr } = useDeviceProfile();\n  const { width, height } = useElementSize(containerRef);\n  return { width, height, dpr };\n}\n\n/** An element's CSS-pixel size, `0 × 0` until it is mounted and measured.\n *  Re-measured whenever a `ResizeObserver` reports it resized. */\nexport function useElementSize(containerRef: RefObject<HTMLElement | null>): CanvasSize {\n  const [size, setSize] = useState<CanvasSize>({ width: 0, height: 0 });\n\n  const measure = useCallback(() => {\n    if (!containerRef.current) return;\n    const rect = containerRef.current.getBoundingClientRect();\n    setSize((prev) =>\n      prev.width === rect.width && prev.height === rect.height\n        ? prev\n        : { width: rect.width, height: rect.height },\n    );\n  }, [containerRef]);\n\n  useEffect(() => {\n    const el = containerRef.current;\n    if (!el) return;\n    measure();\n    // Absent under jsdom and in older embedders: one measurement is all there is.\n    if (typeof ResizeObserver === 'undefined') return;\n    const observer = new ResizeObserver(measure);\n    observer.observe(el);\n    return () => observer.disconnect();\n  }, [measure, containerRef]);\n\n  return size;\n}\n"],"mappings":";;;;;;;;;;;AAiBA,SAAgB,cAAc,cAAiE;CAC7F,MAAM,EAAE,QAAQ,iBAAiB;CACjC,MAAM,EAAE,OAAO,WAAW,eAAe,YAAY;CACrD,OAAO;EAAE;EAAO;EAAQ;CAAI;AAC9B;;;AAIA,SAAgB,eAAe,cAAyD;CACtF,MAAM,CAAC,MAAM,WAAW,SAAqB;EAAE,OAAO;EAAG,QAAQ;CAAE,CAAC;CAEpE,MAAM,UAAU,kBAAkB;EAChC,IAAI,CAAC,aAAa,SAAS;EAC3B,MAAM,OAAO,aAAa,QAAQ,sBAAsB;EACxD,SAAS,SACP,KAAK,UAAU,KAAK,SAAS,KAAK,WAAW,KAAK,SAC9C,OACA;GAAE,OAAO,KAAK;GAAO,QAAQ,KAAK;EAAO,CAC/C;CACF,GAAG,CAAC,YAAY,CAAC;CAEjB,gBAAgB;EACd,MAAM,KAAK,aAAa;EACxB,IAAI,CAAC,IAAI;EACT,QAAQ;EAER,IAAI,OAAO,mBAAmB,aAAa;EAC3C,MAAM,WAAW,IAAI,eAAe,OAAO;EAC3C,SAAS,QAAQ,EAAE;EACnB,aAAa,SAAS,WAAW;CACnC,GAAG,CAAC,SAAS,YAAY,CAAC;CAE1B,OAAO;AACT"}

package/dist/core/viewport/useDecayLoop.js

@@ -1,61 +1,133 @@
-import { useCallback as e, useEffect as t, useRef as n } from "react";
-import { useVisibleRaf as r } from "@weasel-js/react";
+import { useCallback, useEffect, useRef } from "react";
+import { useVisibleRaf } from "@weasel-js/react";
+
 //#region src/core/viewport/useDecayLoop.ts
-var i = .5;
-function a() {
-	let a = n(null), o = e((e, t) => {
-		let n = a.current;
-		if (!n) return;
-		if (n.lastTime === null) {
-			n.lastTime = e, t.request();
+/**
+* Fraction of velocity preserved per `'spring'` bounce. 0.5 means each bounce
+* loses half its energy, giving a quick visible settle (typically 2–4 bounces
+* before `minSpeed` cuts the loop). Fixed for v1; a future `bounceDamping`
+* config option could expose this if a consumer needs control.
+*/
+var SPRING_DAMPING = .5;
+/** A rAF loop that coasts a value to a stop under friction, reporting the
+*  per-frame delta. What turns a released pan drag into momentum scrolling. */
+function useDecayLoop() {
+	const stateRef = useRef(null);
+	const tick = useCallback((now, frameLoop) => {
+		const s = stateRef.current;
+		if (!s) return;
+		if (s.lastTime === null) {
+			s.lastTime = now;
+			frameLoop.request();
 			return;
 		}
-		let r = Math.min(e - n.lastTime, 64);
-		n.lastTime = e;
-		let o = n.friction ** (r / 16.67);
-		if (n.vx *= o, n.vy *= o, Math.sqrt(n.vx * n.vx + n.vy * n.vy) < n.minSpeed) {
-			a.current = null, t.cancel(), n.onEnd?.();
+		const dt = Math.min(now - s.lastTime, 64);
+		s.lastTime = now;
+		const f = Math.pow(s.friction, dt / 16.67);
+		s.vx *= f;
+		s.vy *= f;
+		if (Math.sqrt(s.vx * s.vx + s.vy * s.vy) < s.minSpeed) {
+			stateRef.current = null;
+			frameLoop.cancel();
+			s.onEnd?.();
 			return;
 		}
-		let s = n.vx * r, c = n.vy * r;
-		if (n.viewBounds && n.boundary) {
-			let { minX: e, maxX: t, minY: r, maxY: a } = n.viewBounds, o = n.posX + s, l = n.posY + c;
-			n.boundary === "stop" ? (e !== void 0 && o < e ? (s = e - n.posX, n.vx = 0) : t !== void 0 && o > t && (s = t - n.posX, n.vx = 0), r !== void 0 && l < r ? (c = r - n.posY, n.vy = 0) : a !== void 0 && l > a && (c = a - n.posY, n.vy = 0)) : n.boundary === "spring" ? (e !== void 0 && o < e ? (s = e - n.posX, n.vx = Math.abs(n.vx) * i) : t !== void 0 && o > t && (s = t - n.posX, n.vx = -Math.abs(n.vx) * i), r !== void 0 && l < r ? (c = r - n.posY, n.vy = Math.abs(n.vy) * i) : a !== void 0 && l > a && (c = a - n.posY, n.vy = -Math.abs(n.vy) * i)) : (e !== void 0 && o < e ? (s = e - n.posX, n.vx = Math.abs(n.vx)) : t !== void 0 && o > t && (s = t - n.posX, n.vx = -Math.abs(n.vx)), r !== void 0 && l < r ? (c = r - n.posY, n.vy = Math.abs(n.vy)) : a !== void 0 && l > a && (c = a - n.posY, n.vy = -Math.abs(n.vy))), n.posX += s, n.posY += c;
+		let dx = s.vx * dt;
+		let dy = s.vy * dt;
+		if (s.viewBounds && s.boundary) {
+			const { minX, maxX, minY, maxY } = s.viewBounds;
+			const newX = s.posX + dx;
+			const newY = s.posY + dy;
+			if (s.boundary === "stop") {
+				if (minX !== void 0 && newX < minX) {
+					dx = minX - s.posX;
+					s.vx = 0;
+				} else if (maxX !== void 0 && newX > maxX) {
+					dx = maxX - s.posX;
+					s.vx = 0;
+				}
+				if (minY !== void 0 && newY < minY) {
+					dy = minY - s.posY;
+					s.vy = 0;
+				} else if (maxY !== void 0 && newY > maxY) {
+					dy = maxY - s.posY;
+					s.vy = 0;
+				}
+			} else if (s.boundary === "spring") {
+				if (minX !== void 0 && newX < minX) {
+					dx = minX - s.posX;
+					s.vx = Math.abs(s.vx) * SPRING_DAMPING;
+				} else if (maxX !== void 0 && newX > maxX) {
+					dx = maxX - s.posX;
+					s.vx = -Math.abs(s.vx) * SPRING_DAMPING;
+				}
+				if (minY !== void 0 && newY < minY) {
+					dy = minY - s.posY;
+					s.vy = Math.abs(s.vy) * SPRING_DAMPING;
+				} else if (maxY !== void 0 && newY > maxY) {
+					dy = maxY - s.posY;
+					s.vy = -Math.abs(s.vy) * SPRING_DAMPING;
+				}
+			} else {
+				if (minX !== void 0 && newX < minX) {
+					dx = minX - s.posX;
+					s.vx = Math.abs(s.vx);
+				} else if (maxX !== void 0 && newX > maxX) {
+					dx = maxX - s.posX;
+					s.vx = -Math.abs(s.vx);
+				}
+				if (minY !== void 0 && newY < minY) {
+					dy = minY - s.posY;
+					s.vy = Math.abs(s.vy);
+				} else if (maxY !== void 0 && newY > maxY) {
+					dy = maxY - s.posY;
+					s.vy = -Math.abs(s.vy);
+				}
+			}
+			s.posX += dx;
+			s.posY += dy;
 		}
-		n.onTick(s, c), t.request();
-	}, []), s = r(o, { onResume: e(() => {
-		a.current && (a.current.lastTime = null);
-	}, []) }), c = e(() => {
-		s.cancel(), a.current = null;
-	}, [s]), l = e((e) => {
-		c();
-		let { velocity: t, friction: n = .92, minSpeed: r = .01, viewBounds: i, boundary: o, initialPosition: l, onTick: u, onEnd: d } = e;
-		if (Math.sqrt(t.vx ** 2 + t.vy ** 2) < r) {
-			d?.();
+		s.onTick(dx, dy);
+		frameLoop.request();
+	}, []);
+	const frameLoop = useVisibleRaf(tick, { onResume: useCallback(() => {
+		if (stateRef.current) stateRef.current.lastTime = null;
+	}, []) });
+	const cancel = useCallback(() => {
+		frameLoop.cancel();
+		stateRef.current = null;
+	}, [frameLoop]);
+	const start = useCallback((config) => {
+		cancel();
+		const { velocity, friction = .92, minSpeed = .01, viewBounds, boundary, initialPosition, onTick, onEnd } = config;
+		if (Math.sqrt(velocity.vx ** 2 + velocity.vy ** 2) < minSpeed) {
+			onEnd?.();
 			return;
 		}
-		a.current = {
-			vx: t.vx,
-			vy: t.vy,
-			friction: n,
-			minSpeed: r,
+		stateRef.current = {
+			vx: velocity.vx,
+			vy: velocity.vy,
+			friction,
+			minSpeed,
 			lastTime: null,
-			posX: l?.x ?? 0,
-			posY: l?.y ?? 0,
-			viewBounds: i,
-			boundary: o,
-			onTick: u,
-			onEnd: d
-		}, s.request();
-	}, [c, s]);
-	return t(() => () => {
-		c();
-	}, [c]), {
-		start: l,
-		cancel: c
+			posX: initialPosition?.x ?? 0,
+			posY: initialPosition?.y ?? 0,
+			viewBounds,
+			boundary,
+			onTick,
+			onEnd
+		};
+		frameLoop.request();
+	}, [cancel, frameLoop]);
+	useEffect(() => () => {
+		cancel();
+	}, [cancel]);
+	return {
+		start,
+		cancel
 	};
 }
-//#endregion
-export { a as useDecayLoop };
 
+//#endregion
+export { useDecayLoop };
 //# sourceMappingURL=useDecayLoop.js.map

package/dist/core/viewport/useDecayLoop.js.map

@@ -1 +1 @@
-{"version":3,"file":"useDecayLoop.js","names":["SPRING_DAMPING","useDecayLoop","stateRef","useRef","tick","useCallback","s","now","frameLoop","dt","f","dx","dy","newX","newY","minX","maxX","minY","maxY","useVisibleRaf","cancel","start","config","velocity","minSpeed","initialPosition","useEffect"],"sources":["../../../src/core/viewport/useDecayLoop.ts"],"sourcesContent":["import { useCallback, useEffect, useRef } from 'react';\nimport { useVisibleRaf, type VisibleRaf } from '@weasel-js/react';\n\n/** Per-axis limits on a view's position. Any side may be left open. */\nexport interface PanBounds {\n  minX?: number;\n  maxX?: number;\n  minY?: number;\n  maxY?: number;\n}\n\n/** Momentum settings for a pan: how quickly a flung view slows, when it stops,\n *  and what happens at the pan limits. The `DecayLoopConfig` fields a caller\n *  chooses up front, without the per-gesture `velocity` / `onTick`. */\nexport interface InertiaConfig {\n  friction?: number;\n  minSpeed?: number;\n  /** What to do when inertial pan reaches `bounds`. Default: no clamping. */\n  boundary?: 'stop' | 'bounce' | 'spring';\n  /** View-coordinate limits for boundary clamping. Requires `boundary` to take effect. */\n  bounds?: PanBounds;\n}\n\n/** How a decay should run: its starting velocity, how fast it slows, and what\n *  happens if it reaches the pan limits. */\nexport interface DecayLoopConfig {\n  velocity: { vx: number; vy: number };\n  friction?: number;\n  minSpeed?: number;\n  /** Bounds for boundary clamping. Requires `boundary` to take effect. */\n  viewBounds?: PanBounds;\n  /**\n   * What to do when the accumulated position hits `viewBounds`. Default: no clamping.\n   * - `'stop'`: clamp at boundary, kill velocity component.\n   * - `'bounce'`: linear reflection — flip velocity sign, magnitude preserved.\n   * - `'spring'`: damped reflection — flip velocity sign and shrink magnitude\n   *   by `SPRING_DAMPING` per bounce so the motion settles naturally.\n   */\n  boundary?: 'stop' | 'bounce' | 'spring';\n  /** Starting position for internal boundary tracking. Required when `viewBounds` is set. */\n  initialPosition?: { x: number; y: number };\n  onTick: (dx: number, dy: number) => void;\n  onEnd?: () => void;\n}\n\n/**\n * Fraction of velocity preserved per `'spring'` bounce. 0.5 means each bounce\n * loses half its energy, giving a quick visible settle (typically 2–4 bounces\n * before `minSpeed` cuts the loop). Fixed for v1; a future `bounceDamping`\n * config option could expose this if a consumer needs control.\n */\nconst SPRING_DAMPING = 0.5;\n\n/** A rAF loop that coasts a value to a stop under friction, reporting the\n *  per-frame delta. What turns a released pan drag into momentum scrolling. */\nexport function useDecayLoop() {\n  const stateRef = useRef<{\n    vx: number; vy: number;\n    friction: number; minSpeed: number;\n    lastTime: number | null;\n    posX: number; posY: number;\n    viewBounds: PanBounds | undefined;\n    boundary: 'stop' | 'bounce' | 'spring' | undefined;\n    onTick: (dx: number, dy: number) => void;\n    onEnd?: () => void;\n  } | null>(null);\n\n  const tick = useCallback((now: number, frameLoop: VisibleRaf) => {\n    const s = stateRef.current;\n    if (!s) return;\n    if (s.lastTime === null) {\n      s.lastTime = now;\n      frameLoop.request();\n      return;\n    }\n    const dt = Math.min(now - s.lastTime, 64);  // cap at 64ms to avoid huge jumps\n    s.lastTime = now;\n    // Time-normalize friction to 60fps baseline\n    const f = Math.pow(s.friction, dt / 16.67);\n    s.vx *= f;\n    s.vy *= f;\n    const speed = Math.sqrt(s.vx * s.vx + s.vy * s.vy);\n    if (speed < s.minSpeed) {\n      stateRef.current = null;\n      frameLoop.cancel();\n      s.onEnd?.();\n      return;\n    }\n    let dx = s.vx * dt;\n    let dy = s.vy * dt;\n    if (s.viewBounds && s.boundary) {\n      const { minX, maxX, minY, maxY } = s.viewBounds;\n      const newX = s.posX + dx;\n      const newY = s.posY + dy;\n      if (s.boundary === 'stop') {\n        if (minX !== undefined && newX < minX) { dx = minX - s.posX; s.vx = 0; }\n        else if (maxX !== undefined && newX > maxX) { dx = maxX - s.posX; s.vx = 0; }\n        if (minY !== undefined && newY < minY) { dy = minY - s.posY; s.vy = 0; }\n        else if (maxY !== undefined && newY > maxY) { dy = maxY - s.posY; s.vy = 0; }\n      } else if (s.boundary === 'spring') {\n        // Damped reflection: flip sign AND scale magnitude by SPRING_DAMPING so\n        // each bounce loses energy. Once |v| < minSpeed the outer loop ends.\n        if (minX !== undefined && newX < minX) { dx = minX - s.posX; s.vx = Math.abs(s.vx) * SPRING_DAMPING; }\n        else if (maxX !== undefined && newX > maxX) { dx = maxX - s.posX; s.vx = -Math.abs(s.vx) * SPRING_DAMPING; }\n        if (minY !== undefined && newY < minY) { dy = minY - s.posY; s.vy = Math.abs(s.vy) * SPRING_DAMPING; }\n        else if (maxY !== undefined && newY > maxY) { dy = maxY - s.posY; s.vy = -Math.abs(s.vy) * SPRING_DAMPING; }\n      } else {\n        if (minX !== undefined && newX < minX) { dx = minX - s.posX; s.vx = Math.abs(s.vx); }\n        else if (maxX !== undefined && newX > maxX) { dx = maxX - s.posX; s.vx = -Math.abs(s.vx); }\n        if (minY !== undefined && newY < minY) { dy = minY - s.posY; s.vy = Math.abs(s.vy); }\n        else if (maxY !== undefined && newY > maxY) { dy = maxY - s.posY; s.vy = -Math.abs(s.vy); }\n      }\n      s.posX += dx;\n      s.posY += dy;\n    }\n    s.onTick(dx, dy);\n    frameLoop.request();\n  }, []);\n\n  const frameLoop = useVisibleRaf(\n    tick,\n    {\n      // Coasting does not continue while suspended: dropping `lastTime` makes\n      // the resuming frame seed a fresh interval instead of applying an hour of\n      // friction at once, which would end the decay before it was seen.\n      onResume: useCallback(() => {\n        if (stateRef.current) stateRef.current.lastTime = null;\n      }, []),\n    },\n  );\n\n  const cancel = useCallback(() => {\n    frameLoop.cancel();\n    stateRef.current = null;\n  }, [frameLoop]);\n\n  const start = useCallback((config: DecayLoopConfig) => {\n    cancel();\n    const { velocity, friction = 0.92, minSpeed = 0.01, viewBounds, boundary, initialPosition, onTick, onEnd } = config;\n    const speed = Math.sqrt(velocity.vx ** 2 + velocity.vy ** 2);\n    if (speed < minSpeed) { onEnd?.(); return; }\n    stateRef.current = {\n      vx: velocity.vx, vy: velocity.vy, friction, minSpeed, lastTime: null,\n      posX: initialPosition?.x ?? 0, posY: initialPosition?.y ?? 0,\n      viewBounds, boundary,\n      onTick, onEnd,\n    };\n    frameLoop.request();\n  }, [cancel, frameLoop]);\n\n  useEffect(() => () => { cancel(); }, [cancel]);\n\n  return { start, cancel };\n}\n"],"mappings":"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"}
+{"version":3,"file":"useDecayLoop.js","names":[],"sources":["../../../src/core/viewport/useDecayLoop.ts"],"sourcesContent":["import { useCallback, useEffect, useRef } from 'react';\nimport { useVisibleRaf, type VisibleRaf } from '@weasel-js/react';\n\n/** Per-axis limits on a view's position. Any side may be left open. */\nexport interface PanBounds {\n  minX?: number;\n  maxX?: number;\n  minY?: number;\n  maxY?: number;\n}\n\n/** Momentum settings for a pan: how quickly a flung view slows, when it stops,\n *  and what happens at the pan limits. The `DecayLoopConfig` fields a caller\n *  chooses up front, without the per-gesture `velocity` / `onTick`. */\nexport interface InertiaConfig {\n  friction?: number;\n  minSpeed?: number;\n  /** What to do when inertial pan reaches `bounds`. Default: no clamping. */\n  boundary?: 'stop' | 'bounce' | 'spring';\n  /** View-coordinate limits for boundary clamping. Requires `boundary` to take effect. */\n  bounds?: PanBounds;\n}\n\n/** How a decay should run: its starting velocity, how fast it slows, and what\n *  happens if it reaches the pan limits. */\nexport interface DecayLoopConfig {\n  velocity: { vx: number; vy: number };\n  friction?: number;\n  minSpeed?: number;\n  /** Bounds for boundary clamping. Requires `boundary` to take effect. */\n  viewBounds?: PanBounds;\n  /**\n   * What to do when the accumulated position hits `viewBounds`. Default: no clamping.\n   * - `'stop'`: clamp at boundary, kill velocity component.\n   * - `'bounce'`: linear reflection — flip velocity sign, magnitude preserved.\n   * - `'spring'`: damped reflection — flip velocity sign and shrink magnitude\n   *   by `SPRING_DAMPING` per bounce so the motion settles naturally.\n   */\n  boundary?: 'stop' | 'bounce' | 'spring';\n  /** Starting position for internal boundary tracking. Required when `viewBounds` is set. */\n  initialPosition?: { x: number; y: number };\n  onTick: (dx: number, dy: number) => void;\n  onEnd?: () => void;\n}\n\n/**\n * Fraction of velocity preserved per `'spring'` bounce. 0.5 means each bounce\n * loses half its energy, giving a quick visible settle (typically 2–4 bounces\n * before `minSpeed` cuts the loop). Fixed for v1; a future `bounceDamping`\n * config option could expose this if a consumer needs control.\n */\nconst SPRING_DAMPING = 0.5;\n\n/** A rAF loop that coasts a value to a stop under friction, reporting the\n *  per-frame delta. What turns a released pan drag into momentum scrolling. */\nexport function useDecayLoop() {\n  const stateRef = useRef<{\n    vx: number; vy: number;\n    friction: number; minSpeed: number;\n    lastTime: number | null;\n    posX: number; posY: number;\n    viewBounds: PanBounds | undefined;\n    boundary: 'stop' | 'bounce' | 'spring' | undefined;\n    onTick: (dx: number, dy: number) => void;\n    onEnd?: () => void;\n  } | null>(null);\n\n  const tick = useCallback((now: number, frameLoop: VisibleRaf) => {\n    const s = stateRef.current;\n    if (!s) return;\n    if (s.lastTime === null) {\n      s.lastTime = now;\n      frameLoop.request();\n      return;\n    }\n    const dt = Math.min(now - s.lastTime, 64);  // cap at 64ms to avoid huge jumps\n    s.lastTime = now;\n    // Time-normalize friction to 60fps baseline\n    const f = Math.pow(s.friction, dt / 16.67);\n    s.vx *= f;\n    s.vy *= f;\n    const speed = Math.sqrt(s.vx * s.vx + s.vy * s.vy);\n    if (speed < s.minSpeed) {\n      stateRef.current = null;\n      frameLoop.cancel();\n      s.onEnd?.();\n      return;\n    }\n    let dx = s.vx * dt;\n    let dy = s.vy * dt;\n    if (s.viewBounds && s.boundary) {\n      const { minX, maxX, minY, maxY } = s.viewBounds;\n      const newX = s.posX + dx;\n      const newY = s.posY + dy;\n      if (s.boundary === 'stop') {\n        if (minX !== undefined && newX < minX) { dx = minX - s.posX; s.vx = 0; }\n        else if (maxX !== undefined && newX > maxX) { dx = maxX - s.posX; s.vx = 0; }\n        if (minY !== undefined && newY < minY) { dy = minY - s.posY; s.vy = 0; }\n        else if (maxY !== undefined && newY > maxY) { dy = maxY - s.posY; s.vy = 0; }\n      } else if (s.boundary === 'spring') {\n        // Damped reflection: flip sign AND scale magnitude by SPRING_DAMPING so\n        // each bounce loses energy. Once |v| < minSpeed the outer loop ends.\n        if (minX !== undefined && newX < minX) { dx = minX - s.posX; s.vx = Math.abs(s.vx) * SPRING_DAMPING; }\n        else if (maxX !== undefined && newX > maxX) { dx = maxX - s.posX; s.vx = -Math.abs(s.vx) * SPRING_DAMPING; }\n        if (minY !== undefined && newY < minY) { dy = minY - s.posY; s.vy = Math.abs(s.vy) * SPRING_DAMPING; }\n        else if (maxY !== undefined && newY > maxY) { dy = maxY - s.posY; s.vy = -Math.abs(s.vy) * SPRING_DAMPING; }\n      } else {\n        if (minX !== undefined && newX < minX) { dx = minX - s.posX; s.vx = Math.abs(s.vx); }\n        else if (maxX !== undefined && newX > maxX) { dx = maxX - s.posX; s.vx = -Math.abs(s.vx); }\n        if (minY !== undefined && newY < minY) { dy = minY - s.posY; s.vy = Math.abs(s.vy); }\n        else if (maxY !== undefined && newY > maxY) { dy = maxY - s.posY; s.vy = -Math.abs(s.vy); }\n      }\n      s.posX += dx;\n      s.posY += dy;\n    }\n    s.onTick(dx, dy);\n    frameLoop.request();\n  }, []);\n\n  const frameLoop = useVisibleRaf(\n    tick,\n    {\n      // Coasting does not continue while suspended: dropping `lastTime` makes\n      // the resuming frame seed a fresh interval instead of applying an hour of\n      // friction at once, which would end the decay before it was seen.\n      onResume: useCallback(() => {\n        if (stateRef.current) stateRef.current.lastTime = null;\n      }, []),\n    },\n  );\n\n  const cancel = useCallback(() => {\n    frameLoop.cancel();\n    stateRef.current = null;\n  }, [frameLoop]);\n\n  const start = useCallback((config: DecayLoopConfig) => {\n    cancel();\n    const { velocity, friction = 0.92, minSpeed = 0.01, viewBounds, boundary, initialPosition, onTick, onEnd } = config;\n    const speed = Math.sqrt(velocity.vx ** 2 + velocity.vy ** 2);\n    if (speed < minSpeed) { onEnd?.(); return; }\n    stateRef.current = {\n      vx: velocity.vx, vy: velocity.vy, friction, minSpeed, lastTime: null,\n      posX: initialPosition?.x ?? 0, posY: initialPosition?.y ?? 0,\n      viewBounds, boundary,\n      onTick, onEnd,\n    };\n    frameLoop.request();\n  }, [cancel, frameLoop]);\n\n  useEffect(() => () => { cancel(); }, [cancel]);\n\n  return { start, cancel };\n}\n"],"mappings":"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"}