@weasel-js/core 1.14.2 → 1.15.1

package/dist/core/selection/outermostSelection.js

@@ -0,0 +1,56 @@
+import { outermost } from "@weasel-js/select";
+
+// src/core/selection/outermostSelection.ts
+var views = /* @__PURE__ */ new WeakMap();
+/**
+* A view of `api` whose every write keeps only the outermost ids under `parentOf`, so a
+* selection kept off the scene holds a selected node's subtree the way the scene's own does.
+* `api` itself is untouched and still writes as it did.
+*
+* One view per `api` and `parentOf`, so it is as stable a memo or effect dependency as `api`.
+*/
+function outermostSelection(api, parentOf) {
+	const cached = views.get(api);
+	if (cached && cached.parentOf === parentOf) return cached.view;
+	const narrow = (ids) => outermost(ids, parentOf);
+	const set = (ids) => api.set(narrow(ids));
+	const settle = () => {
+		const ids = api.get();
+		const kept = narrow(ids);
+		if (kept !== ids) api.set(kept);
+	};
+	const view = {
+		get current() {
+			return api.current;
+		},
+		get: api.get,
+		contains: api.contains,
+		set,
+		add(id) {
+			api.add(id);
+			settle();
+		},
+		remove: api.remove,
+		toggle(id) {
+			api.toggle(id);
+			settle();
+		},
+		clear: api.clear,
+		applyClick(id, modifiers) {
+			api.applyClick(id, modifiers);
+			settle();
+		},
+		adapterMethods: {
+			getSelection: api.adapterMethods.getSelection,
+			setSelection: (ids) => api.adapterMethods.setSelection(narrow(ids))
+		}
+	};
+	views.set(api, {
+		parentOf,
+		view
+	});
+	return view;
+}
+
+export { outermostSelection };
+//# sourceMappingURL=outermostSelection.js.map

package/dist/core/selection/outermostSelection.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"outermostSelection.js","names":[],"sources":["../../../src/core/selection/outermostSelection.ts"],"sourcesContent":["import { outermost, type ParentOf } from '@weasel-js/select';\nimport type { NodeId } from 'core/scene/types';\nimport type { SelectionApi } from './useSelection';\n\nconst views = new WeakMap<SelectionApi, { parentOf: ParentOf<NodeId>; view: SelectionApi }>();\n\n/**\n * A view of `api` whose every write keeps only the outermost ids under `parentOf`, so a\n * selection kept off the scene holds a selected node's subtree the way the scene's own does.\n * `api` itself is untouched and still writes as it did.\n *\n * One view per `api` and `parentOf`, so it is as stable a memo or effect dependency as `api`.\n */\nexport function outermostSelection(api: SelectionApi, parentOf: ParentOf<NodeId>): SelectionApi {\n  const cached = views.get(api);\n  if (cached && cached.parentOf === parentOf) return cached.view;\n  const narrow = (ids: readonly NodeId[]) => outermost(ids, parentOf) as NodeId[];\n  const set = (ids: NodeId[]): void => api.set(narrow(ids));\n  const settle = (): void => {\n    const ids = api.get();\n    const kept = narrow(ids);\n    if (kept !== ids) api.set(kept);\n  };\n  const view: SelectionApi = {\n    get current() { return api.current; },\n    get: api.get,\n    contains: api.contains,\n    set,\n    add(id) { api.add(id); settle(); },\n    remove: api.remove,\n    toggle(id) { api.toggle(id); settle(); },\n    clear: api.clear,\n    applyClick(id, modifiers) { api.applyClick(id, modifiers); settle(); },\n    adapterMethods: {\n      getSelection: api.adapterMethods.getSelection,\n      setSelection: (ids) => api.adapterMethods.setSelection(narrow(ids)),\n    },\n  };\n  views.set(api, { parentOf, view });\n  return view;\n}\n"],"mappings":";;;AAIA,IAAM,wBAAQ,IAAI,QAA0E;;;;;;;;AAS5F,SAAgB,mBAAmB,KAAmB,UAA0C;CAC9F,MAAM,SAAS,MAAM,IAAI,GAAG;CAC5B,IAAI,UAAU,OAAO,aAAa,UAAU,OAAO,OAAO;CAC1D,MAAM,UAAU,QAA2B,UAAU,KAAK,QAAQ;CAClE,MAAM,OAAO,QAAwB,IAAI,IAAI,OAAO,GAAG,CAAC;CACxD,MAAM,eAAqB;EACzB,MAAM,MAAM,IAAI,IAAI;EACpB,MAAM,OAAO,OAAO,GAAG;EACvB,IAAI,SAAS,KAAK,IAAI,IAAI,IAAI;CAChC;CACA,MAAM,OAAqB;EACzB,IAAI,UAAU;GAAE,OAAO,IAAI;EAAS;EACpC,KAAK,IAAI;EACT,UAAU,IAAI;EACd;EACA,IAAI,IAAI;GAAE,IAAI,IAAI,EAAE;GAAG,OAAO;EAAG;EACjC,QAAQ,IAAI;EACZ,OAAO,IAAI;GAAE,IAAI,OAAO,EAAE;GAAG,OAAO;EAAG;EACvC,OAAO,IAAI;EACX,WAAW,IAAI,WAAW;GAAE,IAAI,WAAW,IAAI,SAAS;GAAG,OAAO;EAAG;EACrE,gBAAgB;GACd,cAAc,IAAI,eAAe;GACjC,eAAe,QAAQ,IAAI,eAAe,aAAa,OAAO,GAAG,CAAC;EACpE;CACF;CACA,MAAM,IAAI,KAAK;EAAE;EAAU;CAAK,CAAC;CACjC,OAAO;AACT"}

package/dist/core/selection/readOnlySelection.js

@@ -1,4 +1,4 @@
-//#region src/core/selection/readOnlySelection.ts
+// src/core/selection/readOnlySelection.ts
 var methodViews = /* @__PURE__ */ new WeakMap();
 var apiViews = /* @__PURE__ */ new WeakMap();
 var ignore = () => {};
@@ -42,6 +42,5 @@ function readOnlySelection(api) {
 	return view;
 }
 
-//#endregion
 export { readOnlySelection };
 //# sourceMappingURL=readOnlySelection.js.map

package/dist/core/selection/selectionTarget.js

@@ -1,4 +1,4 @@
-//#region src/core/selection/selectionTarget.ts
+// src/core/selection/selectionTarget.ts
 /** Synthetic id a canvas uses to address the
 *  union-AABB target when 2+ real ids are selected. The selection-overlay
 *  layer and the affordance hit-tester both resolve it to `ChromeState`'s
@@ -12,6 +12,5 @@
 *  `features`). */
 var MULTI_RESIZE_TARGET_ID = "__weasel:multi-selection";
 
-//#endregion
 export { MULTI_RESIZE_TARGET_ID };
 //# sourceMappingURL=selectionTarget.js.map

package/dist/core/selection/usePublishSceneSelection.js

@@ -1,7 +1,7 @@
 import { useMemo } from "react";
 import { usePublishSelection } from "@weasel-js/routing/react";
 
-//#region src/core/selection/usePublishSceneSelection.ts
+// src/core/selection/usePublishSceneSelection.ts
 /** The label published beside each selected id, parallel to `ids`; `undefined` when
 *  nothing is selected. Without `describe`, every entry is unlabeled. */
 function selectionKindLabels(scene, ids, describe) {
@@ -22,6 +22,5 @@ function usePublishSceneSelection(scene, ids, describe) {
 	usePublishSelection(ids, kinds);
 }
 
-//#endregion
 export { selectionKindLabels, usePublishSceneSelection };
 //# sourceMappingURL=usePublishSceneSelection.js.map

package/dist/core/selection/useSelection.js

@@ -3,7 +3,7 @@ import { useLayoutEffect, useMemo, useRef, useState, useSyncExternalStore } from
 import { useLatest } from "@weasel-js/react";
 import { createSelectionStore, intentOf, select } from "@weasel-js/select";
 
-//#region src/core/selection/useSelection.ts
+// src/core/selection/useSelection.ts
 /** The order a store paints its nodes in, when it is a scene and has one. */
 function paintOrderOf(store) {
 	const { renderOrder } = store;
@@ -102,6 +102,5 @@ function useSelection(opts = {}) {
 	}, [store, optsRef]);
 }
 
-//#endregion
 export { useSelection };
 //# sourceMappingURL=useSelection.js.map

package/dist/core/shapeKinds.js

@@ -1,4 +1,4 @@
-//#region src/core/shapeKinds.ts
+// src/core/shapeKinds.ts
 /**
 * Declaration order is the enumeration order of every derived list —
 * `KIT_SHAPE_KINDS`, and through it `defaultNodeRouting` /
@@ -78,6 +78,5 @@ function kitShapeKindsOf(family) {
 	return KIT_SHAPE_KINDS.filter((k) => SHAPE_KINDS[k].family === family);
 }
 
-//#endregion
 export { KIT_SHAPE_KINDS, SHAPE_KINDS, kitShapeKindsOf, shapeKindInfo, shapeKindsWhere };
 //# sourceMappingURL=shapeKinds.js.map

package/dist/core/stableStringify.js

@@ -1,9 +1,8 @@
-//#region src/core/stableStringify.ts
+// src/core/stableStringify.ts
 /** JSON with object keys sorted, so two equal values produce one string. */
 function stableStringify(value) {
 	return JSON.stringify(value, (_key, v) => v && typeof v === "object" && !Array.isArray(v) ? Object.fromEntries(Object.entries(v).sort(([a], [b]) => a < b ? -1 : 1)) : v);
 }
 
-//#endregion
 export { stableStringify };
 //# sourceMappingURL=stableStringify.js.map

package/dist/core/stylus/stylus.js

@@ -1,6 +1,6 @@
 import { clientToWorld } from "../viewport/clientToWorld.js";
 
-//#region src/core/stylus/stylus.ts
+// src/core/stylus/stylus.ts
 /**
 * Map a 0..1 pressure value to a stroke width.
 *
@@ -58,6 +58,5 @@ function forEachCoalesced(event, ctx, cb) {
 	}
 }
 
-//#endregion
 export { forEachCoalesced, getStylusData, pressureToWidth };
 //# sourceMappingURL=stylus.js.map

package/dist/core/stylus/usePointerStylus.js

@@ -2,7 +2,7 @@ import { getStylusData } from "./stylus.js";
 import { useEffect, useRef, useState } from "react";
 import { useLatest } from "@weasel-js/react";
 
-//#region src/core/stylus/usePointerStylus.ts
+// src/core/stylus/usePointerStylus.ts
 var IDLE = {
 	pressure: 0,
 	tiltX: 0,
@@ -73,6 +73,5 @@ function usePointerStylus(target, options = {}) {
 	return state;
 }
 
-//#endregion
 export { usePointerStylus };
 //# sourceMappingURL=usePointerStylus.js.map

package/dist/core/usePaintKinds.js

@@ -1,7 +1,7 @@
 import { getPaintKind, listGradientKinds, listPaintKinds, paintKindRegistry } from "./paint/paintKinds.js";
 import { useCallback, useSyncExternalStore } from "react";
 
-//#region src/core/usePaintKinds.ts
+// src/core/usePaintKinds.ts
 /** Every registered paint kind, as {@link listPaintKinds} returns it,
 *  re-rendering the caller whenever a kind is registered or removed. */
 function usePaintKinds() {
@@ -22,6 +22,5 @@ function usePaintKind(kind) {
 	return useSyncExternalStore(paintKindRegistry.subscribe, read, read);
 }
 
-//#endregion
 export { useGradientKinds, usePaintKind, usePaintKinds };
 //# sourceMappingURL=usePaintKinds.js.map

package/dist/core/viewport/clampView.js

@@ -1,4 +1,4 @@
-//#region src/core/viewport/clampView.ts
+// src/core/viewport/clampView.ts
 /**
 * Clamp a `View` so the visible world rect stays within `bounds`.
 *
@@ -35,6 +35,5 @@ function clampView(view, bounds, canvas) {
 	};
 }
 
-//#endregion
 export { clampView };
 //# sourceMappingURL=clampView.js.map

package/dist/core/viewport/clientToWorld.js

@@ -1,4 +1,4 @@
-//#region src/core/viewport/clientToWorld.ts
+// src/core/viewport/clientToWorld.ts
 /**
 * Map a browser client coord pair to world coords.
 *
@@ -14,6 +14,5 @@ function clientToWorld(clientX, clientY, origin, view) {
 	return [(clientX - origin.left) / view.scale.x + view.x, (clientY - origin.top) / view.scale.y + view.y];
 }
 
-//#endregion
 export { clientToWorld };
 //# sourceMappingURL=clientToWorld.js.map

package/dist/core/viewport/createVelocityTracker.js

@@ -1,4 +1,4 @@
-//#region src/core/viewport/createVelocityTracker.ts
+// src/core/viewport/createVelocityTracker.ts
 /** Hook-free velocity tracker. `useVelocityTracker` wraps one of these; the
 *  action layer builds its own, because an Action descriptor is a static
 *  object and cannot call hooks. */
@@ -38,6 +38,5 @@ function createVelocityTracker() {
 	};
 }
 
-//#endregion
 export { createVelocityTracker };
 //# sourceMappingURL=createVelocityTracker.js.map

package/dist/core/viewport/fitToBounds.js

@@ -1,6 +1,6 @@
 import { normalizeZoom } from "./zoomBounds.js";
 
-//#region src/core/viewport/fitToBounds.ts
+// src/core/viewport/fitToBounds.ts
 /**
 * Compute the largest uniform zoom (px per content-unit) that fits a content
 * rect of `contentW x contentH` (in content units) into a viewport rect of
@@ -30,6 +30,5 @@ function fitToBounds(viewportW, viewportH, contentW, contentH, paddingPx = 0, cl
 	};
 }
 
-//#endregion
 export { fitToBounds, fitZoom };
 //# sourceMappingURL=fitToBounds.js.map

package/dist/core/viewport/fitViewToBounds.js

@@ -1,6 +1,6 @@
 import { DEFAULT_MAX_ZOOM, DEFAULT_MIN_ZOOM, normalizeZoom } from "./zoomBounds.js";
 
-//#region src/core/viewport/fitViewToBounds.ts
+// src/core/viewport/fitViewToBounds.ts
 /**
 * Compute the target {@link View} that fits `bounds` (world space) inside
 * `viewportDims` (CSS px). The bounds are centered in the viewport with
@@ -57,6 +57,5 @@ function fitViewToBounds(bounds, viewportDims, currentView, opts = {}) {
 	};
 }
 
-//#endregion
 export { fitViewToBounds };
 //# sourceMappingURL=fitViewToBounds.js.map

package/dist/core/viewport/interpolateView.js

@@ -1,4 +1,4 @@
-//#region src/core/viewport/interpolateView.ts
+// src/core/viewport/interpolateView.ts
 /**
 * Per-axis camera curve. Two views that differ in scale agree at exactly one
 * screen point; holding the world point under it fixed is what makes a zoom
@@ -49,6 +49,5 @@ function interpolateView(from, to) {
 	};
 }
 
-//#endregion
 export { interpolateView };
 //# sourceMappingURL=interpolateView.js.map

package/dist/core/viewport/parallax.js

@@ -1,4 +1,4 @@
-//#region src/core/viewport/parallax.ts
+// src/core/viewport/parallax.ts
 function asXY(v) {
 	return typeof v === "number" ? {
 		x: v,
@@ -139,6 +139,5 @@ function planeMatrix(m) {
 	];
 }
 
-//#endregion
 export { deriveParallaxView, fromPlane, planeMap, planeMatrix, planeToPlane, rectFromPlane, rectToPlane, toPlane };
 //# sourceMappingURL=parallax.js.map

package/dist/core/viewport/sceneNodeClientRect.js

@@ -1,7 +1,7 @@
 import { viewToTransform } from "./view.js";
 import { worldToScreen } from "./viewTransform.js";
 
-//#region src/core/viewport/sceneNodeClientRect.ts
+// src/core/viewport/sceneNodeClientRect.ts
 /**
 * Project a scene node's world AABB to client (viewport) coordinates,
 * e.g. to anchor a `Callout` at a canvas-drawn object. Snapshot
@@ -22,6 +22,5 @@ function sceneNodeClientRect(opts) {
 	};
 }
 
-//#endregion
 export { sceneNodeClientRect };
 //# sourceMappingURL=sceneNodeClientRect.js.map

package/dist/core/viewport/screenSlop.js

@@ -1,6 +1,6 @@
 import { multiply, scale } from "@weasel-js/geom";
 
-//#region src/core/viewport/screenSlop.ts
+// src/core/viewport/screenSlop.ts
 /**
 * Pointer forgiveness measured on screen.
 *
@@ -51,6 +51,5 @@ function hasSlop(slop) {
 	return typeof slop === "number" ? slop > 0 : slop.px > 0;
 }
 
-//#endregion
 export { hasSlop, slopForStrokeHit, widenSlop };
 //# sourceMappingURL=screenSlop.js.map

package/dist/core/viewport/useAutoCenter.js

@@ -1,7 +1,7 @@
 import { fitZoom } from "./fitToBounds.js";
 import { useEffect, useRef } from "react";
 
-//#region src/core/viewport/useAutoCenter.ts
+// src/core/viewport/useAutoCenter.ts
 /**
 * Compute zoom and pan that fit `contentW x contentH` (in content units)
 * inside `viewportW x viewportH` (in pixels). `padRatio` is the fraction of
@@ -41,6 +41,5 @@ function useAutoCenter(width, height, contentW, contentH, setZoom, setPan) {
 	]);
 }
 
-//#endregion
 export { computeFitViewport, useAutoCenter };
 //# sourceMappingURL=useAutoCenter.js.map

package/dist/core/viewport/useCanvasSize.js

@@ -1,7 +1,7 @@
 import { useDeviceProfile } from "../device/useDeviceProfile.js";
-import { useCallback, useEffect, useState } from "react";
+import { useMemo, useSyncExternalStore } from "react";
 
-//#region src/core/viewport/useCanvasSize.ts
+// src/core/viewport/useCanvasSize.ts
 /** Track a container's content-rect size via `ResizeObserver`, and density via
 *  the ambient `DeviceProfile`.
 *
@@ -9,42 +9,62 @@ import { useCallback, useEffect, useState } from "react";
 *  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) {
+function useCanvasSize(containerRef, options) {
 	const { dpr } = useDeviceProfile();
-	const { width, height } = useElementSize(containerRef);
+	const { width, height } = useElementSize(containerRef, options);
 	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
-	});
-	const measure = useCallback(() => {
-		if (!containerRef.current) return;
-		const rect = containerRef.current.getBoundingClientRect();
-		setSize((prev) => prev.width === rect.width && prev.height === rect.height ? prev : {
+var UNMEASURED = {
+	width: 0,
+	height: 0
+};
+/** `useSyncExternalStore`'s view of an element's size: measured when subscribed and on each resize. */
+function elementSizeStore(containerRef, beforePaint) {
+	let size = UNMEASURED;
+	const measure = (el) => {
+		const rect = el.getBoundingClientRect();
+		if (rect.width === size.width && rect.height === size.height) return false;
+		size = {
 			width: rect.width,
 			height: rect.height
-		});
-	}, [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;
+		};
+		return true;
+	};
+	return {
+		subscribe(changed) {
+			const el = containerRef.current;
+			if (!el) return () => {};
+			measure(el);
+			if (typeof ResizeObserver === "undefined") return () => {};
+			let pending;
+			const observer = new ResizeObserver(() => {
+				if (beforePaint) {
+					if (measure(el)) changed();
+				} else pending ??= setTimeout(() => {
+					pending = void 0;
+					if (measure(el)) changed();
+				}, 0);
+			});
+			observer.observe(el);
+			return () => {
+				observer.disconnect();
+				clearTimeout(pending);
+			};
+		},
+		get: () => size
+	};
+}
+/** 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, options) {
+	const beforePaint = options?.beforePaint ?? false;
+	const store = useMemo(() => elementSizeStore(containerRef, beforePaint), [containerRef, beforePaint]);
+	return useSyncExternalStore(store.subscribe, store.get, store.get);
 }
 
-//#endregion
 export { useCanvasSize, useElementSize };
 //# sourceMappingURL=useCanvasSize.js.map

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

@@ -1 +1 @@
-{"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"}
+{"version":3,"file":"useCanvasSize.js","names":[],"sources":["../../../src/core/viewport/useCanvasSize.ts"],"sourcesContent":["import { type RefObject, useMemo, useSyncExternalStore } 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>, options?: ElementSizeOptions): CanvasSizeSnapshot {\n  const { dpr } = useDeviceProfile();\n  const { width, height } = useElementSize(containerRef, options);\n  return { width, height, dpr };\n}\n\n/** How {@link useElementSize} commits a resize. */\nexport interface ElementSizeOptions {\n  /** Render the caller with a new size inside the `ResizeObserver` callback, so the frame it resized in paints\n   *  it. Only for a caller whose render lays out nothing outside the observed element: the browser delivers a\n   *  resize it causes outside it only next frame, and reports the loop as an error. By default the size\n   *  arrives a frame later. */\n  beforePaint?: boolean;\n}\n\nconst UNMEASURED: CanvasSize = { width: 0, height: 0 };\n\n/** `useSyncExternalStore`'s view of an element's size: measured when subscribed and on each resize. */\nfunction elementSizeStore(containerRef: RefObject<HTMLElement | null>, beforePaint: boolean) {\n  let size = UNMEASURED;\n  const measure = (el: HTMLElement): boolean => {\n    const rect = el.getBoundingClientRect();\n    if (rect.width === size.width && rect.height === size.height) return false;\n    size = { width: rect.width, height: rect.height };\n    return true;\n  };\n  return {\n    subscribe(changed: () => void): () => void {\n      const el = containerRef.current;\n      if (!el) return () => {};\n      measure(el);\n      // Absent under jsdom and in older embedders: one measurement is all there is.\n      if (typeof ResizeObserver === 'undefined') return () => {};\n      let pending: ReturnType<typeof setTimeout> | undefined;\n      const observer = new ResizeObserver(() => {\n        // A store update renders on a microtask, still inside the browser's resize loop; a task waits for it.\n        if (beforePaint) { if (measure(el)) changed(); }\n        else pending ??= setTimeout(() => { pending = undefined; if (measure(el)) changed(); }, 0);\n      });\n      observer.observe(el);\n      return () => { observer.disconnect(); clearTimeout(pending); };\n    },\n    get: () => size,\n  };\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>, options?: ElementSizeOptions): CanvasSize {\n  const beforePaint = options?.beforePaint ?? false;\n  const store = useMemo(() => elementSizeStore(containerRef, beforePaint), [containerRef, beforePaint]);\n  return useSyncExternalStore(store.subscribe, store.get, store.get);\n}\n"],"mappings":";;;;;;;;;;;AAiBA,SAAgB,cAAc,cAA6C,SAAkD;CAC3H,MAAM,EAAE,QAAQ,iBAAiB;CACjC,MAAM,EAAE,OAAO,WAAW,eAAe,cAAc,OAAO;CAC9D,OAAO;EAAE;EAAO;EAAQ;CAAI;AAC9B;AAWA,IAAM,aAAyB;CAAE,OAAO;CAAG,QAAQ;AAAE;;AAGrD,SAAS,iBAAiB,cAA6C,aAAsB;CAC3F,IAAI,OAAO;CACX,MAAM,WAAW,OAA6B;EAC5C,MAAM,OAAO,GAAG,sBAAsB;EACtC,IAAI,KAAK,UAAU,KAAK,SAAS,KAAK,WAAW,KAAK,QAAQ,OAAO;EACrE,OAAO;GAAE,OAAO,KAAK;GAAO,QAAQ,KAAK;EAAO;EAChD,OAAO;CACT;CACA,OAAO;EACL,UAAU,SAAiC;GACzC,MAAM,KAAK,aAAa;GACxB,IAAI,CAAC,IAAI,aAAa,CAAC;GACvB,QAAQ,EAAE;GAEV,IAAI,OAAO,mBAAmB,aAAa,aAAa,CAAC;GACzD,IAAI;GACJ,MAAM,WAAW,IAAI,qBAAqB;IAExC,IAAI,aAAe;SAAI,QAAQ,EAAE,GAAG,QAAQ;IAAA,OACvC,YAAY,iBAAiB;KAAE,UAAU;KAAW,IAAI,QAAQ,EAAE,GAAG,QAAQ;IAAG,GAAG,CAAC;GAC3F,CAAC;GACD,SAAS,QAAQ,EAAE;GACnB,aAAa;IAAE,SAAS,WAAW;IAAG,aAAa,OAAO;GAAG;EAC/D;EACA,WAAW;CACb;AACF;;;AAIA,SAAgB,eAAe,cAA6C,SAA0C;CACpH,MAAM,cAAc,SAAS,eAAe;CAC5C,MAAM,QAAQ,cAAc,iBAAiB,cAAc,WAAW,GAAG,CAAC,cAAc,WAAW,CAAC;CACpG,OAAO,qBAAqB,MAAM,WAAW,MAAM,KAAK,MAAM,GAAG;AACnE"}

package/dist/core/viewport/useDecayLoop.js

@@ -1,7 +1,7 @@
 import { useCallback, useEffect, useRef } from "react";
 import { useVisibleRaf } from "@weasel-js/react";
 
-//#region src/core/viewport/useDecayLoop.ts
+// src/core/viewport/useDecayLoop.ts
 /**
 * 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
@@ -128,6 +128,5 @@ function useDecayLoop() {
 	};
 }
 
-//#endregion
 export { useDecayLoop };
 //# sourceMappingURL=useDecayLoop.js.map

package/dist/core/viewport/useNodeOverlayFrame.js

@@ -5,7 +5,7 @@ import { effectivePose } from "../scene/effectivePose.js";
 import { applyToPoint, invert, multiply, poseFrameOf } from "@weasel-js/geom";
 import { useCallback, useInsertionEffect, useRef } from "react";
 
-//#region src/core/viewport/useNodeOverlayFrame.ts
+// src/core/viewport/useNodeOverlayFrame.ts
 /**
 * `useNodeOverlayFrame` — the coordinate frame a DOM overlay pinned to one
 * scene node needs: the node's world box, the projection from that box's
@@ -114,6 +114,5 @@ function viewMatrix(view) {
 	];
 }
 
-//#endregion
 export { useNodeOverlayFrame };
 //# sourceMappingURL=useNodeOverlayFrame.js.map

package/dist/core/viewport/useVelocityTracker.js

@@ -1,13 +1,12 @@
 import { createVelocityTracker } from "./createVelocityTracker.js";
 import { useMemo } from "react";
 
-//#region src/core/viewport/useVelocityTracker.ts
+// src/core/viewport/useVelocityTracker.ts
 /** Records recent pointer deltas and reports the current velocity, averaged
 *  over the last 100ms — the throw speed a momentum decay starts from. */
 function useVelocityTracker() {
 	return useMemo(() => createVelocityTracker(), []);
 }
 
-//#endregion
 export { useVelocityTracker };
 //# sourceMappingURL=useVelocityTracker.js.map

package/dist/core/viewport/useViewAnimation.js

@@ -1,13 +1,13 @@
-import { normalizeView } from "./view.js";
-import { fitViewToBounds } from "./fitViewToBounds.js";
 import { interpolateView } from "./interpolateView.js";
+import { fitViewToBounds } from "./fitViewToBounds.js";
+import { normalizeView } from "./view.js";
 import { easeOutCubic } from "@weasel-js/geom";
 import { useId, useMemo, useRef } from "react";
 import { useKitSetting, useLatest, usePrefersReducedMotion } from "@weasel-js/react";
 import { useAnimator } from "@weasel-js/animator/react";
 import { createTarget } from "@weasel-js/animator";
 
-//#region src/core/viewport/useViewAnimation.ts
+// src/core/viewport/useViewAnimation.ts
 /** Cancel-key prefix. Each hook instance appends its own id, so two runners
 *  sharing an animator do not cancel each other. */
 var VIEW_ANIMATION_KEY = "view";
@@ -177,6 +177,5 @@ function createViewAnimation(key, viewRef, animatorRef, targetRef, writingRef, m
 	};
 }
 
-//#endregion
 export { DEFAULT_VIEW_ANIMATION_MS, VIEW_ANIMATION_KEY, useViewAnimation, useViewAnimationOn, viewAxes };
 //# sourceMappingURL=useViewAnimation.js.map

package/dist/core/viewport/view.js

@@ -1,7 +1,7 @@
 import { normalizeZoom as normalizeZoom$1, warnInvalidView } from "./zoomBounds.js";
 import { meanScale } from "@weasel-js/geom";
 
-//#region src/core/viewport/view.ts
+// src/core/viewport/view.ts
 /**
 * Bridge `View` into the legacy `ViewTransform` shape. The two use opposite
 * sign conventions for the translation half: `view.x` is camera position;
@@ -59,6 +59,5 @@ function finiteTranslation(v) {
 	return 0;
 }
 
-//#endregion
 export { normalizeView, sameView, viewToTransform, viewZoom };
 //# sourceMappingURL=view.js.map

package/dist/core/viewport/viewTransform.js

@@ -1,4 +1,4 @@
-//#region src/core/viewport/viewTransform.ts
+// src/core/viewport/viewTransform.ts
 /** Project a world-space point to screen-space pixels through a `ViewTransform`. */
 function worldToScreen(worldX, worldY, view) {
 	return [view.panX + worldX * view.zoom.x, view.panY + worldY * view.zoom.y];
@@ -8,6 +8,5 @@ function screenToWorld(screenX, screenY, view) {
 	return [(screenX - view.panX) / view.zoom.x, (screenY - view.panY) / view.zoom.y];
 }
 
-//#endregion
 export { screenToWorld, worldToScreen };
 //# sourceMappingURL=viewTransform.js.map

package/dist/core/viewport/viewportWorldRect.js

@@ -1,4 +1,4 @@
-//#region src/core/viewport/viewportWorldRect.ts
+// src/core/viewport/viewportWorldRect.ts
 /**
 * The world-space rectangle a camera shows in a host `size` CSS pixels across.
 *
@@ -16,6 +16,5 @@ function viewportWorldRect(view, size) {
 	};
 }
 
-//#endregion
 export { viewportWorldRect };
 //# sourceMappingURL=viewportWorldRect.js.map

package/dist/core/viewport/wheelHandler.js

@@ -1,6 +1,6 @@
 import { zoomAt } from "./zoomAt.js";
 
-//#region src/core/viewport/wheelHandler.ts
+// src/core/viewport/wheelHandler.ts
 /** Multiplicative zoom applied per 100 px of wheel `deltaY`. */
 var WHEEL_ZOOM_STEP = 1.1;
 /** Zoom multiplier for one wheel sample. Reciprocal in `deltaY`, so scrolling
@@ -36,6 +36,5 @@ function computeWheelAction(view, input, clamp, opts = {}) {
 	});
 }
 
-//#endregion
 export { WHEEL_ZOOM_STEP, computeWheelAction, wheelPan, wheelZoom, wheelZoomFactor };
 //# sourceMappingURL=wheelHandler.js.map

package/dist/core/viewport/zoomAt.js

@@ -1,7 +1,7 @@
-import { DEFAULT_MAX_ZOOM, DEFAULT_MIN_ZOOM, normalizeZoom } from "./zoomBounds.js";
 import { normalizeView } from "./view.js";
+import { DEFAULT_MAX_ZOOM, DEFAULT_MIN_ZOOM, normalizeZoom } from "./zoomBounds.js";
 
-//#region src/core/viewport/zoomAt.ts
+// src/core/viewport/zoomAt.ts
 /** Bound a scale's *magnitude*, keeping its direction. `scale.y < 0` is how a
 *  `View` spells a y-up camera, so clamping the signed value against positive
 *  bounds would flip the axis and collapse the zoom rather than limit it. */
@@ -54,6 +54,5 @@ function zoomAt(input, anchor, factor, opts) {
 	};
 }
 
-//#endregion
 export { axisZoomFactor, zoomAt };
 //# sourceMappingURL=zoomAt.js.map

package/dist/core/viewport/zoomBounds.js

@@ -1,7 +1,7 @@
 import { ZOOM_FLOOR, normalizeZoom } from "@weasel-js/geom";
 import { isDev } from "@weasel-js/registry";
 
-//#region src/core/viewport/zoomBounds.ts
+// src/core/viewport/zoomBounds.ts
 /**
 * The kit's system-wide zoom clamp, in `View.scale` units (pixels per world
 * unit): `1` is 100%, `0.1` is 10%, `8` is 800%.
@@ -33,6 +33,5 @@ function warnInvalidView(what) {
 	console.warn(`[weasel] a view was given ${what} and has been clamped. A view's zoom is always positive and finite, and its position finite; see ZOOM_FLOOR.`);
 }
 
-//#endregion
 export { DEFAULT_MAX_ZOOM, DEFAULT_MIN_ZOOM, ZOOM_FLOOR, normalizeZoom$1 as normalizeZoom, warnInvalidView };
 //# sourceMappingURL=zoomBounds.js.map