@weasel-js/core 1.9.2 → 1.9.4

package/dist/canvas/Canvas.js

@@ -1,127 +1,44 @@
 import { getProgramSource as e, programSourceRegistry as t } from "../renderer/shaders/registerProgram.js";
-import { viewToMat3 as n } from "../renderer/math/viewToMat3.js";
-import { cullDrawCommands as r } from "../renderer/cullDrawCommands.js";
+import { commandFill as n } from "../features/patterns/commandPaint.js";
+import { viewToMat3 as r } from "../renderer/math/viewToMat3.js";
 import { drawLayers as i, isLayerPainted as a } from "../core/layers/render.js";
-import { normalizeView as o } from "../core/viewport/view.js";
-import { clientToWorld as s } from "../core/viewport/clientToWorld.js";
-import { clampView as c } from "../core/viewport/clampView.js";
-import { AUTO_POSE_DESCRIPTOR as l } from "../interactions/actions/resize/autoPoseDescriptor.js";
-import { dispatchApplyBatch as u } from "../core/applyOps.js";
-import { parseDebugFlags as d } from "../debug/parseDebugFlags.js";
-import { createDebugSink as f } from "../debug/createDebugSink.js";
-import { createDebugOverlayLayer as p } from "../debug/createDebugOverlayLayer.js";
-import { isCustomEntry as m } from "./layerSlots.js";
-import { composeOrderedLayers as h, placeToolOverlays as g } from "./layerOrder.js";
-import { sceneLayerKey as _ } from "./sceneLayerPaint.js";
-import { registerMountedCanvas as ee } from "./mountedCanvases.js";
-import { aggregatePreviewIds as te } from "./toolPreview.js";
-import { useViewHelpers as ne } from "./useViewHelpers.js";
-import { useOptionalViewRegistry as re } from "./viewRegistry.js";
-import { useFrameLoop as ie } from "./useFrameLoop.js";
-import { useRedrawOn as ae } from "./useRedrawOn.js";
-import { useCanvasRenderer as oe } from "./useCanvasRenderer.js";
-import { createSelectionOverlayLayer as se } from "../features/selection/overlay.js";
-import { frameStatsOf as ce } from "../debug/frameStats.js";
-import { buildSceneTree as v } from "./buildSceneTree.js";
-import { createPaintedCursorLayer as le } from "../features/cursor/paintedCursorLayer.js";
-import { wrapNodeOutput as y } from "./wrapNodeOutput.js";
-import { paintMissesView as ue } from "./paintCull.js";
-import { CursorCoordsHud as de } from "./CursorCoordsHud.js";
-import { PickHud as fe } from "./PickHud.js";
-import { ModalityHud as pe } from "./ModalityHud.js";
-import { forwardRef as me, useCallback as b, useEffect as x, useImperativeHandle as he, useInsertionEffect as ge, useLayoutEffect as _e, useMemo as S, useRef as C, useState as ve, useSyncExternalStore as ye } from "react";
-import { useLatest as w } from "@weasel-js/react";
-import { Fragment as be, jsx as xe, jsxs as Se } from "react/jsx-runtime";
-import { createPaintedCursorState as Ce, resolveCursorTier as T } from "@weasel-js/cursor";
+import { clientToWorld as o } from "../core/viewport/clientToWorld.js";
+import { AUTO_POSE_DESCRIPTOR as s } from "../interactions/actions/resize/autoPoseDescriptor.js";
+import { aggregatePreviewIds as c } from "./toolPreview.js";
+import { useViewHelpers as ee } from "./useViewHelpers.js";
+import { useOptionalViewRegistry as te } from "./viewRegistry.js";
+import { useFrameLoop as l } from "./useFrameLoop.js";
+import { useCanvasRenderer as ne, useRedrawOnDensityChange as re, useRedrawOnRestore as ie } from "./useCanvasRenderer.js";
+import { useRedrawOn as u } from "./useRedrawOn.js";
+import { createDebugOverlayLayer as ae } from "../debug/createDebugOverlayLayer.js";
+import { dispatchApplyBatch as d } from "../core/applyOps.js";
+import { parseDebugFlags as oe } from "../debug/parseDebugFlags.js";
+import { createDebugSink as se } from "../debug/createDebugSink.js";
+import { createSelectionOverlayLayer as ce } from "../features/selection/overlay.js";
+import { isCustomEntry as f } from "./layerSlots.js";
+import { composeOrderedLayers as le, placeToolOverlays as ue } from "./layerOrder.js";
+import { buildSceneLayers as de } from "./buildSceneLayer.js";
+import { registerMountedCanvas as fe } from "./mountedCanvases.js";
+import { useCanvasView as pe } from "./useCanvasView.js";
+import { useSceneLayerList as me } from "./useSceneLayerList.js";
+import { frameStatsOf as he } from "../debug/frameStats.js";
+import { createPaintedCursorLayer as ge } from "../features/cursor/paintedCursorLayer.js";
+import { CursorCoordsHud as _e } from "./CursorCoordsHud.js";
+import { PickHud as ve } from "./PickHud.js";
+import { ModalityHud as ye } from "./ModalityHud.js";
+import { forwardRef as be, useCallback as p, useEffect as m, useImperativeHandle as xe, useInsertionEffect as Se, useLayoutEffect as Ce, useMemo as h, useRef as g, useState as we, useSyncExternalStore as Te } from "react";
+import { useLatest as _ } from "@weasel-js/react";
+import { Fragment as Ee, jsx as v, jsxs as De } from "react/jsx-runtime";
+import { createPaintedCursorState as Oe, resolveCursorTier as y } from "@weasel-js/cursor";
 //#region src/canvas/Canvas.tsx
-var we = (e) => !0;
-function E(e, t, i, a, o, s) {
-	let c = e.toPose ?? ((e) => t ? t.getPose(e.id) : e), l = e.drawOne, u = e.postProcess, d = e.cull ? (e, t, i) => r(e, n(t), {
-		x: 0,
-		y: 0,
-		width: i.width,
-		height: i.height
-	}) : (e) => e, f = e.cull ? e.paintBounds : void 0, p = (e, t) => f ? ue(f, e, {
-		x: 0,
-		y: 0,
-		width: t.width,
-		height: t.height
-	}) : void 0;
-	return {
-		id: s?.id ?? "scene",
-		label: s ? `Scene: ${s.forLayer}` : "Scene",
-		draw: (n, r, f) => {
-			let m = o(), h = t;
-			if (h && e.objects === void 0 && typeof h.getLayers == "function" && typeof h.getNode == "function" && typeof h.getChildren == "function" && l) {
-				let t = (t, n, r) => {
-					if (m && m.has(t.id)) return [];
-					let o = l(t, n, r);
-					if (i) {
-						let e = a ? a(t.id) : null;
-						e && i.recordBounds(t.id, e);
-						let r = n.x ?? (e ? e.x : 0), o = n.y ?? (e ? e.y : 0);
-						i.recordOrigin(t.id, {
-							x: r,
-							y: o
-						});
-					}
-					return y(o, n, e.alphaFor ? e.alphaFor(t.id) : 1);
-				}, n = e.toPose ? {
-					...h,
-					getPose: (e) => {
-						let t = h.getNode(e);
-						return t ? c(t) : h.getPose(e);
-					}
-				} : h, o = v(n, t, r, s?.forLayer, e.derivedPathOf, p(r, f));
-				return d(u ? u(o, r, f) : o, r, f);
-			}
-			let g = e.objects ?? t?.getNodes() ?? [], _ = [], ee = p(r, f);
-			for (let t of g) {
-				if (m && m.has(t.id)) continue;
-				let n = c(t);
-				if (l && !ee?.(t, n)) {
-					let i = l(t, n, r), a = y(i, n, e.alphaFor ? e.alphaFor(t.id) : 1);
-					for (let e of a) _.push(e);
-				}
-				if (i) {
-					let e = a ? a(t.id) : null;
-					e && i.recordBounds(t.id, {
-						x: e.x,
-						y: e.y,
-						width: e.width,
-						height: e.height
-					});
-					let r = n.x ?? (e ? e.x : 0), o = n.y ?? (e ? e.y : 0);
-					i.recordOrigin(t.id, {
-						x: r,
-						y: o
-					});
-				}
-			}
-			return d(u ? u(_, r, f) : _, r, f);
-		}
-	};
-}
-function Te(e, t, n, r, i) {
-	let a = e.objects === void 0 && typeof t?.getLayers == "function" ? t.getLayers().map((e) => e.id) : null;
-	return !a || a.length === 0 ? [{
-		key: "scene",
-		layer: E(e, t, n, r, i)
-	}] : a.map((a) => ({
-		key: _(a),
-		layer: E(e, t, n, r, i, {
-			id: _(a),
-			forLayer: a
-		})
-	}));
-}
-function Ee(e, t) {
+var ke = (e) => !0;
+function Ae(e, t) {
 	let n = e.hotkeyEngaged ?? e.active, r = n === null ? void 0 : e.registry[n];
 	if (r?.cursor) {
-		if (typeof r.cursor != "function") return T(r.cursor);
+		if (typeof r.cursor != "function") return y(r.cursor);
 		if (t) try {
 			let e = t();
-			return T(r.cursor({
+			return y(r.cursor({
 				...e,
 				scratch: null
 			}));
@@ -130,131 +47,121 @@ function Ee(e, t) {
 		}
 	}
 }
-var De = {};
-function Oe(e, t, n, r, i) {
-	return i ? i(e, t, n) : s(t, n, e.getBoundingClientRect(), r);
+var je = {};
+function Me(e, t, n, r, i) {
+	return i ? i(e, t, n) : o(t, n, e.getBoundingClientRect(), r);
 }
-function ke(r, s) {
-	let { width: _, height: v, dpr: y, flattenTolerance: ue, contentVersion: me, syncPaint: T = !1, redrawOn: E, adapter: ke, layers: D, selection: Ae, boundsOf: je, boundsOfPose: Me, pickEvery: Ne, clientToWorld: Pe, paintInto: O, inputElement: k, poseDescriptor: Fe = l, className: Ie, style: Le, tabIndex: Re = 0, onFocus: ze, onBlur: Be, autoFocusOnPointerDown: Ve = !0, helpersRef: He, tools: A, view: j, defaultView: Ue, onViewChange: We, viewBounds: Ge, debug: Ke, debugSinkRef: qe, shaders: Je, previewIdsExtra: Ye, previewPoseExtra: Xe, gestureSource: Ze, backgroundFill: Qe, cursorCoordsHud: $e, pickHud: et, modalityHud: tt, pickBest: nt, decorationLayer: rt, getIsVisible: it, layerVisibility: at, layerOrder: ot, layerGroups: st } = r, ct = Ke === void 0 ? void 0 : JSON.stringify(Ke), M = S(() => ct === void 0 ? typeof window > "u" ? null : d(window.location.search) : JSON.parse(ct) || null, [ct]), N = S(() => M === null ? null : f(M), [M]), lt = w(N), ut = b(() => lt.current, [lt]), P = ke, F = C(null), I = C(null), dt = b((e) => {
-		I.current = e, F.current = e;
-	}, []), L = !!O;
-	ge(() => {
-		L && (F.current = k ?? null);
+function b(o, be) {
+	let { width: y, height: b, dpr: x, flattenTolerance: Ne, contentVersion: Pe, syncPaint: Fe = !1, redrawOn: Ie, adapter: Le, layers: S, selection: Re, boundsOf: ze, boundsOfPose: Be, pickEvery: Ve, clientToWorld: He, paintInto: C, inputElement: w, poseDescriptor: Ue = s, className: We, style: Ge, tabIndex: Ke = 0, onFocus: qe, onBlur: Je, autoFocusOnPointerDown: Ye = !0, helpersRef: Xe, tools: T, view: Ze, defaultView: Qe, onViewChange: $e, viewBounds: et, debug: tt, debugSinkRef: nt, shaders: rt, previewIdsExtra: it, previewPoseExtra: at, gestureSource: ot, backgroundFill: st, cursorCoordsHud: ct, pickHud: lt, modalityHud: ut, pickBest: dt, decorationLayer: ft, getIsVisible: pt, layerVisibility: mt, layerOrder: ht, layerGroups: gt } = o, _t = tt === void 0 ? void 0 : JSON.stringify(tt), E = h(() => _t === void 0 ? typeof window > "u" ? null : oe(window.location.search) : JSON.parse(_t) || null, [_t]), D = h(() => E === null ? null : se(E), [E]), vt = _(D), yt = p(() => vt.current, [vt]), O = Le, k = g(null), A = g(null), bt = p((e) => {
+		A.current = e, k.current = e;
+	}, []), j = !!C;
+	Se(() => {
+		j && (k.current = w ?? null);
 	});
-	let ft = L ? O.canvas ?? null : null, pt = w(ft), mt = L ? {
-		x: O.x,
-		y: O.y
-	} : null, R = w(mt), z = C(null), B = w({
-		width: _,
-		height: v
-	}), ht = w(it), gt = w(at), _t = w(ot), vt = C(() => !1), { requestRedraw: V, subscribeFrame: yt, subscribeBeforePaint: bt } = ie(b(() => vt.current(), []), {
-		syncPaint: T,
-		target: F
-	}), xt = w(me), St = C(0), Ct = b(() => St.current, []), [wt, Tt] = ve(0), H = C(/* @__PURE__ */ new Set()), Et = b((e) => (H.current.add(e), Tt((e) => e + 1), () => {
-		H.current.delete(e), Tt((e) => e + 1);
-	}), []), U = b((e, t, n, r, i, o) => {
-		let s = [...H.current].reverse(), c = ht.current?.() ?? we, l = gt.current ?? De, u = _t.current;
-		for (let d of s) {
-			if (!d.hitTest || o && !o.includes(d) || !a(d, l, u)) continue;
-			let s = d.hitTest(e, t, i, n, r, c);
+	let xt = j ? C.canvas ?? null : null, St = _(xt), Ct = j ? {
+		x: C.x,
+		y: C.y
+	} : null, M = _(Ct), N = g(null), P = _({
+		width: y,
+		height: b
+	}), wt = _(pt), F = _(mt), I = _(ht), Tt = g(() => !1), { requestRedraw: L, subscribeFrame: Et, subscribeBeforePaint: Dt, subscribeResume: Ot } = l(p(() => Tt.current(), []), {
+		syncPaint: Fe,
+		target: k
+	}), kt = _(Pe), At = g(0), jt = p(() => At.current, []), [Mt, Nt] = we(0), R = g(/* @__PURE__ */ new Set()), Pt = p((e) => (R.current.add(e), Nt((e) => e + 1), () => {
+		R.current.delete(e), Nt((e) => e + 1);
+	}), []), z = p((e, t, n, r, i, o) => {
+		let s = [...R.current].reverse(), c = wt.current?.() ?? ke, ee = F.current ?? je, te = I.current;
+		for (let l of s) {
+			if (!l.hitTest || o && !o.includes(l) || !a(l, ee, te)) continue;
+			let s = l.hitTest(e, t, i, n, r, c);
 			if (s) return {
-				layerId: d.id,
+				layerId: l.id,
 				hit: s
 			};
 		}
 		return null;
 	}, [
-		ht,
-		_t,
-		gt
-	]), Dt = b((e, t, n) => U(e, t, n?.view ?? W.current, n?.dims ?? B.current, z.current), [U, B]), W = C(o(j ?? Ue ?? {
-		x: 0,
-		y: 0,
-		scale: {
-			x: 1,
-			y: 1
-		}
-	})), Ot = j !== void 0, kt = Ot ? o(j) : void 0, G = C(/* @__PURE__ */ new Set()), At = w(We), jt = w(Ge), Mt = w(Ot), Nt = C(!1), Pt = b((e) => {
-		let t = o(typeof e == "function" ? e(W.current) : e), n = jt.current, r = n ? c(t, n, B.current) : t;
-		if (Mt.current) {
-			let e = At.current;
-			Nt.current || (Nt.current = !0, console.warn(e ? "[weasel] setView not applied locally: this canvas is controlled by its `view` prop. The value was forwarded to `onViewChange` — update the prop from there, or drop it to take the imperative path." : "[weasel] setView ignored: this canvas is controlled by its `view` prop and has no `onViewChange`, so the value has nowhere to go. Update the prop, or drop it to take the imperative path.")), e?.(r);
-			return;
-		}
-		W.current = r;
-		for (let e of G.current) e(r);
-		At.current?.(r), V();
-	}, [
-		V,
-		B,
-		Mt,
-		At,
-		jt
-	]), K = b(() => W.current, []), Ft = b((e) => (G.current.add(e), () => {
-		G.current.delete(e);
-	}), []);
-	_e(() => {
-		let e = F.current;
-		if (e) return ee({
+		wt,
+		I,
+		F
+	]), { viewRef: B, controlledView: Ft, setView: It, getView: V, subscribeView: Lt, adoptControlled: Rt, announceControlled: zt, clearSubscribers: Bt } = pe({
+		view: Ze,
+		defaultView: Qe,
+		onViewChange: $e,
+		viewBounds: et,
+		dimsRef: P,
+		requestRedraw: L
+	}), Vt = p((e, t, n) => z(e, t, n?.view ?? B.current, n?.dims ?? P.current, N.current), [
+		z,
+		P,
+		B
+	]);
+	Ce(() => {
+		let e = k.current;
+		if (e) return fe({
 			element: e,
-			getView: K
+			getView: V
 		});
 	}, [
-		L,
-		k,
-		K
+		j,
+		w,
+		V
 	]);
-	let q = S(() => Ce(), []), It = S(() => le(q), [q]);
-	x(() => q.subscribe(() => {
-		V();
-	}), [q, V]);
-	let Lt = b(() => {
-		let e = R.current, { width: t, height: n } = B.current;
+	let H = h(() => Oe(), []), Ht = h(() => ge(H), [H]);
+	m(() => H.subscribe(() => {
+		L();
+	}), [H, L]);
+	let Ut = p(() => {
+		let e = M.current, { width: t, height: n } = P.current;
 		return {
 			x: e?.x ?? 0,
 			y: e?.y ?? 0,
 			width: t,
 			height: n
 		};
-	}, [B, R]);
-	he(s, () => ({
-		element: L ? k ?? null : F.current,
-		surface: L ? O?.canvas ?? null : I.current,
-		getSurfaceRect: Lt,
-		requestRedraw: V,
-		subscribeFrame: yt,
-		subscribeBeforePaint: bt,
-		registerLayer: Et,
-		hitTestExtras: Dt,
-		getView: K,
-		setView: Pt,
-		subscribeView: Ft,
-		getPaintedVersion: Ct,
-		paintedCursor: q,
-		getDebug: ut
+	}, [P, M]);
+	xe(be, () => ({
+		element: j ? w ?? null : k.current,
+		surface: j ? C?.canvas ?? null : A.current,
+		getSurfaceRect: Ut,
+		requestRedraw: L,
+		subscribeFrame: Et,
+		subscribeBeforePaint: Dt,
+		subscribeResume: Ot,
+		registerLayer: Pt,
+		hitTestExtras: Vt,
+		getView: V,
+		setView: It,
+		subscribeView: Lt,
+		getPaintedVersion: jt,
+		paintedCursor: H,
+		getDebug: yt
 	}), [
-		F,
-		I,
-		L,
 		k,
-		O?.canvas,
-		Lt,
-		V,
-		yt,
-		bt,
+		A,
+		j,
+		w,
+		C?.canvas,
+		Ut,
+		L,
 		Et,
 		Dt,
-		K,
+		Ot,
 		Pt,
-		Ft,
-		Ct,
-		q,
-		ut
+		Vt,
+		V,
+		It,
+		Lt,
+		jt,
+		H,
+		yt
 	]);
-	let Rt = oe(), zt = C(/* @__PURE__ */ new Map()), J = re(), Bt = S(() => ({
+	let Wt = ne();
+	ie(Wt, L), re(L, x);
+	let Gt = g(/* @__PURE__ */ new Map()), U = te(), Kt = h(() => ({
 		getPose: () => ({}),
 		getNodes: () => []
-	}), []), Vt = P ?? Bt, Ht = S(() => ({
+	}), []), qt = O ?? Kt, Jt = h(() => ({
 		current: [],
 		get: () => [],
 		contains: () => !1,
@@ -268,8 +175,8 @@ function ke(r, s) {
 			getSelection: () => [],
 			setSelection: () => {}
 		}
-	}), []), Ut = Ae ?? Ht, Wt = w(Vt), Gt = w(Pe), Kt = () => {
-		let e = kt ?? W.current, t = L ? k ?? null : F.current, n = t ? t.getBoundingClientRect() : typeof DOMRect < "u" ? new DOMRect() : {
+	}), []), Yt = Re ?? Jt, Xt = _(qt), W = _(He), Zt = () => {
+		let e = Ft ?? B.current, t = j ? w ?? null : k.current, n = t ? t.getBoundingClientRect() : typeof DOMRect < "u" ? new DOMRect() : {
 			x: 0,
 			y: 0,
 			width: 0,
@@ -288,105 +195,100 @@ function ke(r, s) {
 				meta: !1,
 				ctrl: !1
 			},
-			selection: Ut,
-			adapter: Vt,
+			selection: Yt,
+			adapter: qt,
 			applyOps: (e, t) => {
-				u(Wt.current, e, t);
+				d(Xt.current, e, t);
 			},
 			view: e,
-			setView: Pt,
+			setView: It,
 			canvasRect: n,
-			debug: N ?? void 0
+			debug: D ?? void 0
 		};
-	}, qt = w(Ne), Jt = w(nt), Yt = b((e, t) => {
-		let n = qt.current;
+	}, Qt = _(Ve), $t = _(dt), en = p((e, t) => {
+		let n = Qt.current;
 		if (!n) return [];
 		let r = n(e, t);
 		return r ? Array.isArray(r) ? r : [r] : [];
-	}, [qt]), Xt = b((e, t) => Jt.current?.(e, t) ?? null, [Jt]), Zt = Ut.current, { helpers: Qt, chromeState: $t, effectiveBoundsOf: en, previewExtraRef: tn } = ne({
-		adapter: P,
-		geometry: Fe,
-		boundsOf: je,
-		boundsOfPose: Me,
-		selection: Zt,
-		tools: A,
-		gestureSource: Ze,
-		previewPoseExtra: Xe,
-		previewIdsExtra: Ye,
-		getIsVisible: () => ht.current?.() ?? we
-	}), nn = { getDebug: () => N }, rn = {
-		...Qt,
-		...nn,
+	}, [Qt]), tn = p((e, t) => $t.current?.(e, t) ?? null, [$t]), nn = p((e, t) => {
+		let n = k.current;
+		return n ? Me(n, e, t, B.current, W.current) : [e, t];
+	}, [W, B]), rn = Yt.current, { helpers: an, chromeState: on, effectiveBoundsOf: sn, previewExtraRef: cn } = ee({
+		adapter: O,
+		geometry: Ue,
+		boundsOf: ze,
+		boundsOfPose: Be,
+		selection: rn,
+		tools: T,
+		gestureSource: ot,
+		previewPoseExtra: at,
+		previewIdsExtra: it,
+		getIsVisible: () => wt.current?.() ?? ke
+	}), ln = { getDebug: () => D }, un = {
+		...an,
+		...ln,
 		viewId: null
-	}, Y = C(!1), an = (e) => {
-		Ve && e.currentTarget.focus(), Y.current = !0;
-	}, on = ((e) => {
-		if (Y.current) return;
-		let t = e.currentTarget, n = W.current, [r, i] = Oe(t, e.clientX, e.clientY, n, Gt.current);
-		for (let t of X) t.onUncapturedMove?.(r, i, e.nativeEvent, n, {
-			width: _,
-			height: v
-		});
-	}), sn = (e) => {
-		Y.current = !1;
-		for (let e of X) e.onUncapturedLeave?.();
-	}, cn = (e) => {
-		Y.current = !1;
-	}, ln = S(() => Qe ? {
+	}, G = g(!1), dn = h(() => st ? {
 		id: "scene-background-fill",
 		label: "Background fill",
 		space: "screen",
-		draw: (e, t, n) => [{
-			kind: "path",
-			path: {
-				kind: "rect",
+		draw: (e, t, r) => {
+			let i = {
 				x: 0,
 				y: 0,
-				width: n.width,
-				height: n.height
-			},
-			fill: Qe
-		}]
-	} : null, [Qe]), un = S(() => {
-		let e = {}, t = D.grid;
-		m(t) && (e.grid = t.layer);
-		let n = D.cellHighlight;
-		m(n) && (e.cellHighlight = n.layer);
-		let r = D.scene, i;
-		r && !m(r) && r.drawOne && (i = Te(r, P, N, en, () => {
-			let e = te(A), t = tn.current.previewIdsExtra?.();
+				width: r.width,
+				height: r.height
+			}, a = n(st, i);
+			return a ? [{
+				kind: "path",
+				path: {
+					kind: "rect",
+					...i
+				},
+				fill: a
+			}] : [];
+		}
+	} : null, [st]), { key: fn, sync: pn } = me(O), K = h(() => {
+		let e = {}, t = S.grid;
+		f(t) && (e.grid = t.layer);
+		let n = S.cellHighlight;
+		f(n) && (e.cellHighlight = n.layer);
+		let r = S.scene, i;
+		r && !f(r) && r.drawOne && (i = de(r, O, D, sn, () => {
+			let e = c(T), t = cn.current.previewIdsExtra?.();
 			if (t) for (let n of t) e.add(n);
 			return e.size > 0 ? e : null;
 		}));
-		let a = D.selectionOverlay;
-		if (m(a)) e.selectionOverlay = a.layer;
+		let a = S.selectionOverlay;
+		if (f(a)) e.selectionOverlay = a.layer;
 		else if (a !== null) {
 			let t = a ?? {};
-			e.selectionOverlay = se({
+			e.selectionOverlay = ce({
 				...t,
 				...t.poseById ? {
 					getPose: t.poseById,
-					poseDescriptor: t.poseDescriptor ?? Fe
+					poseDescriptor: t.poseDescriptor ?? Ue
 				} : {}
 			});
 		}
-		let o = h(D, e, i, ln ?? void 0);
-		return rt && o.push(rt), A && g(o, e.selectionOverlay, A.getActiveOverlays), o;
+		let o = le(S, e, i, dn ?? void 0);
+		return ft && o.push(ft), T && ue(o, e.selectionOverlay, T.getActiveOverlays), o;
 	}, [
+		S,
+		O,
+		sn,
 		D,
-		P,
-		en,
-		N,
-		A,
-		ln,
-		rt,
-		Fe,
-		tn
-	]), dn = ye(b((e) => J?.subscribe(e) ?? (() => {}), [J]), () => J?.getVersion() ?? 0, () => 0), fn = w(un);
-	x(() => {
-		J?.attachSurface({
+		T,
+		dn,
+		ft,
+		Ue,
+		cn,
+		fn
+	]), mn = Te(p((e) => U?.subscribe(e) ?? (() => {}), [U]), () => U?.getVersion() ?? 0, () => 0), hn = _(K);
+	m(() => {
+		U?.attachSurface({
 			origin: () => {
-				let e = F.current;
+				let e = k.current;
 				if (!e) return {
 					left: 0,
 					top: 0
@@ -397,212 +299,225 @@ function ke(r, s) {
 					top: t.top
 				};
 			},
-			view: () => W.current,
-			dims: () => B.current,
-			layers: () => fn.current,
-			requestRedraw: V,
-			chromeState: () => z.current.getChromeState(),
-			hitTestExtras: U,
+			view: () => B.current,
+			dims: () => P.current,
+			layers: () => hn.current,
+			requestRedraw: L,
+			chromeState: () => N.current.getChromeState(),
+			hitTestExtras: z,
 			claimsAbove: (e, t) => {
-				let n = W.current;
-				return U(n.x + e / n.scale.x, n.y + t / n.scale.y, n, B.current, z.current) !== null;
+				let n = B.current;
+				return z(n.x + e / n.scale.x, n.y + t / n.scale.y, n, P.current, N.current) !== null;
 			}
 		});
 	}, [
-		J,
-		F,
-		V,
 		U,
-		B,
-		fn
+		k,
+		L,
+		z,
+		P,
+		hn,
+		B
 	]);
-	let X = S(() => {
-		let e = J ? [...un, ...J.list().filter((e) => e.paint).map((e) => e.layer)] : un;
+	let q = h(() => {
+		let e = U ? [...K, ...U.list().filter((e) => e.paint).map((e) => e.layer)] : K;
 		return [
-			...N && M ? [...e, p({
-				sink: N,
-				config: M
+			...D && E ? [...e, ae({
+				sink: D,
+				config: E
 			})] : e,
-			...H.current,
-			It
+			...R.current,
+			Ht
 		];
 	}, [
-		un,
-		N,
-		M,
-		wt,
-		J,
-		dn,
-		It
+		K,
+		D,
+		E,
+		Mt,
+		U,
+		mn,
+		Ht
 	]);
-	x(() => {
+	m(() => {
 		let e = () => {
-			V();
+			L();
 		}, t = [];
-		for (let n of X) n.subscribe && t.push(n.subscribe(e));
+		for (let n of q) n.subscribe && t.push(n.subscribe(e));
 		return () => {
 			for (let e of t) e();
 		};
-	}, [X, V]), ae(E, V);
-	let pn = Je?.map((e) => e.id).join("|") ?? "", mn = {
-		layers: X,
-		width: _,
-		height: v,
-		debugSink: N,
-		frameStats: M?.fps === !0,
-		dpr: y,
-		layerVisibility: at,
-		layerOrder: ot,
-		layerGroups: st,
-		shaders: Je,
-		flattenTolerance: ue
-	}, hn = w(mn);
-	ge(() => {
-		kt && (W.current = kt), z.current = rn, He && (He.current = rn), qe && (qe.current = N);
+	}, [q, L]), u(Ie, L);
+	let J = rt?.map((e) => e.id).join("|") ?? "", gn = {
+		layers: q,
+		width: y,
+		height: b,
+		debugSink: D,
+		frameStats: E?.fps === !0,
+		dpr: x,
+		layerVisibility: mt,
+		layerOrder: ht,
+		layerGroups: gt,
+		shaders: rt,
+		flattenTolerance: Ne
+	}, _n = _(gn);
+	Se(() => {
+		Rt(), N.current = un, Xe && (Xe.current = un), nt && (nt.current = D);
+	}), Ce(() => {
+		zt();
 	});
-	let gn = b(() => {
-		let e = pt.current ?? I.current;
-		if (!e) return !1;
-		let t = R.current, { layers: r, width: a, height: o, debugSink: s, frameStats: c, dpr: l, layerVisibility: u, layerOrder: d, flattenTolerance: f, layerGroups: p, shaders: m } = hn.current;
-		if (s?.beginFrame(), s) for (let e = 0; e < r.length; e++) {
-			let t = r[e];
+	let vn = p(() => {
+		let e = St.current ?? A.current;
+		if (!e || pn()) return !1;
+		let t = M.current, { layers: n, width: a, height: o, debugSink: s, frameStats: c, dpr: ee, layerVisibility: te, layerOrder: l, flattenTolerance: ne, layerGroups: re, shaders: ie } = _n.current;
+		if (s?.beginFrame(), s) for (let e = 0; e < n.length; e++) {
+			let t = n[e];
 			t.id !== "debug-overlay" && s.recordLayer(t.id, t.label, t.space ?? "world", e);
 		}
-		let h = Rt.bind(e, {
+		let u = Wt.bind(e, {
 			width: a,
 			height: o,
-			dpr: l
+			dpr: ee
 		}, {
 			tile: t,
-			flattenTolerance: f,
-			shaders: m
+			flattenTolerance: ne,
+			shaders: ie
 		});
-		if (!h) return !1;
-		let g = W.current, _ = s && c ? [] : void 0, ee = _ ? performance.now() : 0, te = i(r, z.current, u ?? De, d, g, {
+		if (!u) return !1;
+		let ae = B.current, d = s && c ? [] : void 0, oe = d ? performance.now() : 0, se = i(n, N.current, te ?? je, l, ae, {
 			width: a,
 			height: o
-		}, zt.current, void 0, p, _);
-		return h.render(te, n(g), _ ? { spans: _ } : void 0), s && _ && s.recordFrame(ce(_, h.lastFrameStats(), performance.now() - ee)), St.current = xt.current?.() ?? 0, !0;
+		}, Gt.current, void 0, re, d);
+		return u.render(se, r(ae), d ? { spans: d } : void 0), s && d && s.recordFrame(he(d, u.lastFrameStats(), performance.now() - oe)), At.current = kt.current?.() ?? 0, !0;
 	}, [
-		xt,
-		Rt,
-		hn,
-		R,
-		pt
+		kt,
+		Wt,
+		_n,
+		M,
+		St,
+		pn,
+		B
 	]);
-	ge(() => {
-		vt.current = gn;
-	}), _e(() => {
-		V();
+	Se(() => {
+		Tt.current = vn;
+	}), Ce(() => {
+		L();
 	}, [
-		X,
-		_,
-		v,
-		j,
-		N,
+		q,
 		y,
-		ue,
-		at,
-		ot,
-		st,
-		pn,
-		T,
-		$t,
-		it,
-		ft,
-		mt?.x,
-		mt?.y,
-		V
-	]), x(() => {
-		let e = zt.current, t = G.current;
+		b,
+		Ze,
+		D,
+		x,
+		Ne,
+		mt,
+		ht,
+		gt,
+		J,
+		Fe,
+		on,
+		pt,
+		xt,
+		Ct?.x,
+		Ct?.y,
+		L
+	]), m(() => {
+		let e = Gt.current;
 		return () => {
-			e.clear(), t.clear();
+			e.clear(), Bt();
 		};
-	}, []), x(() => {
-		if (!pn) return;
-		let n = pn.split("|"), r = n.map(e);
+	}, [Bt]), m(() => {
+		if (!J) return;
+		let n = J.split("|"), r = n.map(e);
 		return t.subscribe(() => {
 			let t = n.map(e), i = t.some((e, t) => e !== r[t]);
-			r = t, i && V();
+			r = t, i && L();
 		});
-	}, [pn, V]);
-	let Z = A ? Ee(A, Kt) : void 0, Q = Z === void 0 ? void 0 : Z.kind === "css" ? Z.css : "none", _n = Q ? {
-		...Le,
-		cursor: Q
-	} : Le, $ = Z?.kind === "painted" ? Z : null, vn = $ ? `${$.glyph}|${$.angle}|${$.size}|${$.worldRadius}` : "";
-	x(() => {
-		q.setBase($);
-	}, [q, vn]);
-	let yn = w(X);
-	x(() => {
-		if (!L || !k) return;
-		let e = k, t = () => {
-			Ve && e.focus(), Y.current = !0;
-		}, n = (t) => {
-			if (Y.current) return;
-			let n = W.current, [r, i] = Oe(e, t.clientX, t.clientY, n, Gt.current), a = B.current;
-			for (let e of yn.current) e.onUncapturedMove?.(r, i, t, n, a);
-		}, r = () => {
-			Y.current = !1;
-		}, i = () => {
-			Y.current = !1;
-			for (let e of yn.current) e.onUncapturedLeave?.();
-		}, a = (e) => e.preventDefault();
+	}, [J, L]);
+	let Y = T ? Ae(T, Zt) : void 0, X = Y === void 0 ? void 0 : Y.kind === "css" ? Y.css : "none", yn = X ? {
+		...Ge,
+		cursor: X
+	} : Ge, Z = Y?.kind === "painted" ? Y : null, bn = Z ? `${Z.glyph}|${Z.angle}|${Z.size}|${Z.worldRadius}` : "";
+	m(() => {
+		H.setBase(Z);
+	}, [H, bn]);
+	let Q = _(q), xn = p((e) => {
+		Ye && e.focus(), G.current = !0;
+	}, [Ye]), Sn = p(() => {
+		G.current = !1;
+	}, []), Cn = p((e, t) => {
+		if (G.current) return;
+		let n = B.current, [r, i] = Me(e, t.clientX, t.clientY, n, W.current), o = F.current ?? je;
+		for (let e of Q.current) e.onUncapturedMove && a(e, o, I.current) && e.onUncapturedMove(r, i, t, n, P.current);
+	}, [
+		W,
+		P,
+		I,
+		F,
+		Q,
+		B
+	]), $ = p(() => {
+		G.current = !1;
+		for (let e of Q.current) e.onUncapturedLeave?.();
+	}, [Q]);
+	m(() => {
+		if (!j || !w) return;
+		let e = w, t = () => xn(e), n = (t) => Cn(e, t), r = Sn, i = $, a = (e) => e.preventDefault();
 		return e.addEventListener("pointerdown", t), e.addEventListener("pointermove", n), e.addEventListener("pointerup", r), e.addEventListener("pointerleave", i), e.addEventListener("contextmenu", a), () => {
 			e.removeEventListener("pointerdown", t), e.removeEventListener("pointermove", n), e.removeEventListener("pointerup", r), e.removeEventListener("pointerleave", i), e.removeEventListener("contextmenu", a);
 		};
 	}, [
-		L,
-		k,
-		Ve,
-		Gt,
-		B,
-		yn
-	]), x(() => {
-		L && k && (k.style.cursor = Q ?? "");
+		j,
+		w,
+		xn,
+		Cn,
+		Sn,
+		$
+	]), m(() => {
+		j && w && (w.style.cursor = X ?? "");
 	}, [
-		L,
-		k,
-		Q
+		j,
+		w,
+		X
 	]);
-	let bn = /* @__PURE__ */ Se(be, { children: [
-		$e && /* @__PURE__ */ xe(de, {
-			canvasRef: F,
-			...L ? { anchorRef: F } : {},
-			viewRef: W
+	let wn = /* @__PURE__ */ De(Ee, { children: [
+		ct && /* @__PURE__ */ v(_e, {
+			canvasRef: k,
+			...j ? { anchorRef: k } : {},
+			viewRef: B,
+			toWorld: nn
 		}),
-		et && /* @__PURE__ */ xe(fe, {
-			canvasRef: F,
-			...L ? { anchorRef: F } : {},
-			viewRef: W,
-			pickEvery: Yt,
-			pickBest: Xt
+		lt && /* @__PURE__ */ v(ve, {
+			canvasRef: k,
+			...j ? { anchorRef: k } : {},
+			viewRef: B,
+			toWorld: nn,
+			pickEvery: en,
+			pickBest: tn
 		}),
-		tt && /* @__PURE__ */ xe(pe, {
-			canvasRef: F,
-			...L ? { anchorRef: F } : {},
-			modeId: typeof tt == "object" ? tt.modeId : void 0
+		ut && /* @__PURE__ */ v(ye, {
+			canvasRef: k,
+			...j ? { anchorRef: k } : {},
+			modeId: typeof ut == "object" ? ut.modeId : void 0
 		})
 	] });
-	return L ? k ? bn : null : /* @__PURE__ */ Se(be, { children: [/* @__PURE__ */ xe("canvas", {
-		ref: dt,
-		width: _,
-		height: v,
-		tabIndex: Re,
-		className: Ie,
-		style: _n,
-		onFocus: ze,
-		onBlur: Be,
-		onPointerDown: an,
-		onPointerMove: on,
-		onPointerUp: cn,
-		onPointerCancel: void 0,
-		onPointerLeave: sn,
+	return j ? w ? wn : null : /* @__PURE__ */ De(Ee, { children: [/* @__PURE__ */ v("canvas", {
+		ref: bt,
+		width: y,
+		height: b,
+		tabIndex: Ke,
+		className: We,
+		style: yn,
+		onFocus: qe,
+		onBlur: Je,
+		onPointerDown: (e) => xn(e.currentTarget),
+		onPointerMove: (e) => Cn(e.currentTarget, e.nativeEvent),
+		onPointerUp: Sn,
+		onPointerLeave: $,
 		onContextMenu: (e) => e.preventDefault()
-	}), bn] });
+	}), wn] });
 }
-var D = me(ke);
+var x = be(b);
 //#endregion
-export { D as Canvas, E as buildSceneLayer, Te as buildSceneLayers };
+export { x as Canvas };
 
 //# sourceMappingURL=Canvas.js.map