@weasel-js/core 1.9.4 → 1.10.1

package/dist/canvas/Canvas.js

@@ -1,523 +1,318 @@
-import { getProgramSource as e, programSourceRegistry as t } from "../renderer/shaders/registerProgram.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 { 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";
+import { drawLayers as e, isLayerPainted as t } from "../core/layers/render.js";
+import { createBackgroundFillLayer as n } from "../core/layers/backgroundFill.js";
+import { clientToWorld as r } from "../core/viewport/clientToWorld.js";
+import { AUTO_POSE_DESCRIPTOR as i } from "../core/geometry/autoPoseDescriptor.js";
+import { useViewHelpers as a } from "./useViewHelpers.js";
+import { useOptionalViewRegistry as o } from "./viewRegistry.js";
+import { shaderKeyOf as s } from "./canvasRenderer.js";
+import { useCanvasSurface as c } from "./useCanvasSurface.js";
+import { SurfaceCanvas as ee } from "./SurfaceCanvas.js";
+import { isCustomEntry as l } from "./layerSlots.js";
+import { composeOrderedLayers as u, placeToolOverlays as d } from "./layerOrder.js";
+import { registerMountedCanvas as f } from "./mountedCanvases.js";
+import { useSurfaceInput as te } from "./useSurfaceInput.js";
+import { beginDebugFrame as ne, useDebugSink as re } from "../debug/useDebugSink.js";
+import { useToolCursor as ie } from "./useToolCursor.js";
+import { createPaintedCursorLayer as p } from "./paintedCursorLayer.js";
+import { viewToMat3 as ae } from "@weasel-js/renderer";
+import { forwardRef as m, useCallback as h, useEffect as g, useImperativeHandle as oe, useInsertionEffect as _, useLayoutEffect as v, useMemo as y, useRef as b, useState as se, useSyncExternalStore as ce } from "react";
+import { useLatest as x } from "@weasel-js/react";
+import { jsx as le } from "react/jsx-runtime";
+import { createCursorSink as ue, createPaintedCursorState as de } from "@weasel-js/cursor";
 //#region src/canvas/Canvas.tsx
-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 y(r.cursor);
-		if (t) try {
-			let e = t();
-			return y(r.cursor({
-				...e,
-				scratch: null
-			}));
-		} catch {
-			return;
-		}
-	}
-}
-var je = {};
-function Me(e, t, n, r, i) {
-	return i ? i(e, t, n) : o(t, n, e.getBoundingClientRect(), r);
-}
-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);
+var fe = (e) => !0, pe = [], me = {};
+function he(m, he) {
+	let { width: S, height: C, dpr: w, flattenTolerance: ge, contentVersion: _e, syncPaint: ve = !1, redrawOn: ye, adapter: be, layers: T, selection: xe, boundsOf: Se, boundsOfPose: Ce, clientToWorld: we, paintInto: E, inputElement: D, poseDescriptor: Te = i, className: Ee, style: De, tabIndex: Oe = 0, onFocus: ke, onBlur: Ae, autoFocusOnPointerDown: je = !0, helpersRef: Me, tools: O, viewState: Ne, debug: Pe, debugSinkRef: Fe, shaders: k, previewPoseExtra: Ie, gestureSource: Le, backgroundFill: A, decorationLayer: j, getIsVisible: Re, layerVisibility: M, layerOrder: N, layerGroups: ze } = m, { sink: P, overlay: F, frameStats: Be, getDebug: Ve } = re(Pe), I = b(null), L = b(null), He = h((e) => {
+		L.current = e, I.current = e;
+	}, []), R = !!E;
+	_(() => {
+		R && (I.current = D ?? null);
 	});
-	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);
+	let Ue = R ? E.canvas ?? null : null, We = x(Ue), Ge = R ? {
+		x: E.x,
+		y: E.y
+	} : null, z = x(Ge), B = b(null), V = x({
+		width: S,
+		height: C
+	}), H = x({
+		getIsVisible: Re,
+		layerVisibility: M,
+		layerOrder: N
+	}), Ke = b(() => !1), { lease: qe, requestRedraw: U, subscribeFrame: Je, subscribeBeforePaint: Ye, subscribeResume: Xe } = c(h(() => Ke.current(), []), {
+		syncPaint: ve,
+		target: I,
+		dpr: w,
+		redrawOn: ye,
+		shaders: k
+	}), Ze = x(_e), Qe = b(0), $e = h(() => Qe.current, []), [et, tt] = se(0), W = b(/* @__PURE__ */ new Set()), nt = h((e) => (W.current.add(e), tt((e) => e + 1), () => {
+		W.current.delete(e), tt((e) => e + 1);
+	}), []), G = h((e, n, r, i, a, o) => {
+		let s = [...W.current].reverse(), c = H.current, ee = c.getIsVisible?.() ?? fe, l = c.layerVisibility ?? me, u = c.layerOrder;
+		for (let c of s) {
+			if (!c.hitTest || o && !o.includes(c) || !t(c, l, u)) continue;
+			let s = c.hitTest(e, n, a, r, i, ee);
 			if (s) return {
-				layerId: l.id,
+				layerId: c.id,
 				hit: s
 			};
 		}
 		return null;
-	}, [
-		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({
+	}, [H]), { viewRef: K, controlled: q, setView: rt, getView: J, subscribeView: it, adoptControlled: at, announceControlled: ot, clearSubscribers: st } = Ne, ct = h((e, t, n) => G(e, t, n?.view ?? K.current, n?.dims ?? V.current, B.current), [
+		G,
+		V,
+		K
+	]), lt = x(we), Y = h((e, t) => {
+		let n = I.current;
+		if (!n) return [e, t];
+		let i = lt.current;
+		return i ? i(n, e, t) : r(e, t, n.getBoundingClientRect(), K.current);
+	}, [lt, K]);
+	v(() => {
+		let e = I.current;
+		if (e) return f({
 			element: e,
-			getView: V
+			getView: J
 		});
 	}, [
-		j,
-		w,
-		V
+		R,
+		D,
+		J
 	]);
-	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;
+	let X = y(() => de(), []), ut = y(() => p(X), [X]);
+	g(() => X.subscribe(() => {
+		U();
+	}), [X, U]);
+	let dt = y(() => ue({
+		element: () => I.current,
+		painted: () => X
+	}), [X]), ft = h(() => {
+		let e = z.current, { width: t, height: n } = V.current;
 		return {
 			x: e?.x ?? 0,
 			y: e?.y ?? 0,
 			width: t,
 			height: n
 		};
-	}, [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
+	}, [V, z]);
+	oe(he, () => ({
+		element: R ? D ?? null : I.current,
+		surface: R ? E?.canvas ?? null : L.current,
+		getSurfaceRect: ft,
+		clientToWorld: Y,
+		requestRedraw: U,
+		subscribeFrame: Je,
+		subscribeBeforePaint: Ye,
+		subscribeResume: Xe,
+		registerLayer: nt,
+		hitTestExtras: ct,
+		getView: J,
+		setView: rt,
+		subscribeView: it,
+		getPaintedVersion: $e,
+		paintedCursor: X,
+		cursorSink: dt,
+		getDebug: Ve
 	}), [
-		k,
-		A,
-		j,
-		w,
-		C?.canvas,
-		Ut,
+		I,
 		L,
-		Et,
-		Dt,
-		Ot,
-		Pt,
-		Vt,
-		V,
-		It,
-		Lt,
-		jt,
-		H,
-		yt
+		R,
+		D,
+		E?.canvas,
+		ft,
+		Y,
+		U,
+		Je,
+		Ye,
+		Xe,
+		nt,
+		ct,
+		J,
+		rt,
+		it,
+		$e,
+		X,
+		dt,
+		Ve
 	]);
-	let Wt = ne();
-	ie(Wt, L), re(L, x);
-	let Gt = g(/* @__PURE__ */ new Map()), U = te(), Kt = h(() => ({
-		getPose: () => ({}),
-		getNodes: () => []
-	}), []), qt = O ?? Kt, Jt = h(() => ({
-		current: [],
-		get: () => [],
-		contains: () => !1,
-		set: () => {},
-		add: () => {},
-		remove: () => {},
-		toggle: () => {},
-		clear: () => {},
-		applyClick: () => {},
-		adapterMethods: {
-			getSelection: () => [],
-			setSelection: () => {}
-		}
-	}), []), 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,
-			height: 0,
-			top: 0,
-			left: 0,
-			right: 0,
-			bottom: 0
-		};
-		return {
-			worldX: 0,
-			worldY: 0,
-			modifiers: {
-				alt: !1,
-				shift: !1,
-				meta: !1,
-				ctrl: !1
-			},
-			selection: Yt,
-			adapter: qt,
-			applyOps: (e, t) => {
-				d(Xt.current, e, t);
-			},
-			view: e,
-			setView: It,
-			canvasRect: n,
-			debug: D ?? void 0
-		};
-	}, 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]), 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,
+	let pt = b(/* @__PURE__ */ new Map()), Z = o(), mt = xe?.current ?? pe, { helpers: ht, chromeState: gt } = a({
+		adapter: be,
+		geometry: Te,
+		boundsOf: Se,
+		boundsOfPose: Ce,
+		selection: mt,
+		gestureSource: Le,
+		previewPoseExtra: Ie,
+		getIsVisible: () => H.current.getIsVisible?.() ?? fe
+	}), _t = { getDebug: () => P }, vt = {
+		...ht,
+		..._t,
 		viewId: null
-	}, G = g(!1), dn = h(() => st ? {
-		id: "scene-background-fill",
-		label: "Background fill",
-		space: "screen",
-		draw: (e, t, r) => {
-			let i = {
-				x: 0,
-				y: 0,
-				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 = S.selectionOverlay;
-		if (f(a)) e.selectionOverlay = a.layer;
-		else if (a !== null) {
-			let t = a ?? {};
-			e.selectionOverlay = ce({
-				...t,
-				...t.poseById ? {
-					getPose: t.poseById,
-					poseDescriptor: t.poseDescriptor ?? Ue
-				} : {}
-			});
+	}, yt = y(() => A ? n(A) : void 0, [A]), Q = y(() => {
+		let e = {};
+		for (let t of [
+			"grid",
+			"cellHighlight",
+			"selectionOverlay"
+		]) {
+			let n = T[t];
+			l(n) && (e[t] = n.layer);
 		}
-		let o = le(S, e, i, dn ?? void 0);
-		return ft && o.push(ft), T && ue(o, e.selectionOverlay, T.getActiveOverlays), o;
+		let t = u(j ? {
+			...T,
+			decorationLayer: { layer: j }
+		} : T, e, T.scene?.layers, yt);
+		return O && d(t, e.selectionOverlay, O.getActiveOverlays), t;
 	}, [
-		S,
-		O,
-		sn,
-		D,
 		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 = k.current;
-				if (!e) return {
-					left: 0,
-					top: 0
-				};
-				let t = e.getBoundingClientRect();
-				return {
-					left: t.left,
-					top: t.top
-				};
-			},
-			view: () => B.current,
-			dims: () => P.current,
-			layers: () => hn.current,
-			requestRedraw: L,
-			chromeState: () => N.current.getChromeState(),
-			hitTestExtras: z,
-			claimsAbove: (e, t) => {
-				let n = B.current;
-				return z(n.x + e / n.scale.x, n.y + t / n.scale.y, n, P.current, N.current) !== null;
-			}
-		});
-	}, [
+		O,
+		yt,
+		j
+	]), bt = ce(h((e) => Z?.subscribe(e) ?? (() => {}), [Z]), () => Z?.getVersion() ?? 0, () => 0), xt = x(Q);
+	g(() => Z?.attachSurface({
+		view: () => K.current,
+		dims: () => V.current,
+		layers: () => xt.current,
+		requestRedraw: U,
+		chromeState: () => B.current.getChromeState(),
+		hitTestExtras: G,
+		clientToWorld: Y,
+		claimsAbove: (e, t) => {
+			let n = K.current, r = e / n.scale.x + n.x, i = t / n.scale.y + n.y;
+			return G(r, i, n, V.current, B.current) !== null;
+		}
+	}), [
+		Z,
+		I,
 		U,
-		k,
-		L,
-		z,
-		P,
-		hn,
-		B
+		G,
+		V,
+		xt,
+		K,
+		Y
 	]);
-	let q = h(() => {
-		let e = U ? [...K, ...U.list().filter((e) => e.paint).map((e) => e.layer)] : K;
+	let $ = y(() => {
+		let e = Z ? [...Q, ...Z.list().filter((e) => e.paint).map((e) => e.layer)] : Q;
 		return [
-			...D && E ? [...e, ae({
-				sink: D,
-				config: E
-			})] : e,
-			...R.current,
-			Ht
+			...F ? [...e, F] : e,
+			...W.current,
+			ut
 		];
 	}, [
-		K,
-		D,
-		E,
-		Mt,
-		U,
-		mn,
-		Ht
+		Q,
+		F,
+		et,
+		Z,
+		bt,
+		ut
 	]);
-	m(() => {
+	g(() => {
 		let e = () => {
-			L();
+			U();
 		}, t = [];
-		for (let n of q) n.subscribe && t.push(n.subscribe(e));
+		for (let n of $) n.subscribe && t.push(n.subscribe(e));
 		return () => {
 			for (let e of t) e();
 		};
-	}, [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();
+	}, [$, U]);
+	let St = s(k), Ct = x({
+		layers: $,
+		width: S,
+		height: C,
+		debugSink: P,
+		frameStats: Be,
+		dpr: w,
+		layerGroups: ze,
+		shaders: k,
+		flattenTolerance: ge
 	});
-	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 u = Wt.bind(e, {
-			width: a,
-			height: o,
-			dpr: ee
+	_(() => {
+		at(), B.current = vt, Me && (Me.current = vt), Fe && (Fe.current = P);
+	}), v(() => {
+		ot();
+	});
+	let wt = h(() => {
+		let t = We.current ?? L.current;
+		if (!t) return !1;
+		let n = z.current, { layers: r, width: i, height: a, debugSink: o, frameStats: s, dpr: c, flattenTolerance: ee, layerGroups: l, shaders: u } = Ct.current, d = ne(o, s, r), f = qe.bind(t, {
+			width: i,
+			height: a,
+			dpr: c
 		}, {
-			tile: t,
-			flattenTolerance: ne,
-			shaders: ie
+			tile: n,
+			flattenTolerance: ee,
+			shaders: u
 		});
-		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
-		}, 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;
+		if (!f) return !1;
+		let te = K.current, { layerVisibility: re, layerOrder: ie } = H.current, p = d?.time(), m = e(r, B.current, re ?? me, ie, te, {
+			width: i,
+			height: a
+		}, pt.current, void 0, l, p);
+		return f.render(m, ae(te), p ? { spans: p } : void 0), d?.end(f.lastFrameStats()), Qe.current = Ze.current?.() ?? 0, !0;
 	}, [
-		kt,
-		Wt,
-		_n,
-		M,
-		St,
-		pn,
-		B
+		Ze,
+		H,
+		qe,
+		Ct,
+		z,
+		We,
+		K
 	]);
-	Se(() => {
-		Tt.current = vn;
-	}), Ce(() => {
-		L();
+	return _(() => {
+		Ke.current = wt;
+	}), v(() => {
+		U();
 	}, [
-		q,
-		y,
-		b,
-		Ze,
-		D,
-		x,
-		Ne,
-		mt,
-		ht,
+		$,
+		S,
+		C,
+		P,
+		w,
+		ge,
+		q?.x,
+		q?.y,
+		q?.scale.x,
+		q?.scale.y,
+		M,
+		N,
+		ze,
+		St,
+		ve,
 		gt,
-		J,
-		Fe,
-		on,
-		pt,
-		xt,
-		Ct?.x,
-		Ct?.y,
-		L
-	]), m(() => {
-		let e = Gt.current;
+		Re,
+		Ue,
+		Ge?.x,
+		Ge?.y,
+		U
+	]), g(() => {
+		let e = pt.current;
 		return () => {
-			e.clear(), Bt();
+			e.clear(), st();
 		};
-	}, [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 && L();
-		});
-	}, [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);
-		};
-	}, [
-		j,
-		w,
-		xn,
-		Cn,
-		Sn,
-		$
-	]), m(() => {
-		j && w && (w.style.cursor = X ?? "");
-	}, [
-		j,
-		w,
-		X
-	]);
-	let wn = /* @__PURE__ */ De(Ee, { children: [
-		ct && /* @__PURE__ */ v(_e, {
-			canvasRef: k,
-			...j ? { anchorRef: k } : {},
-			viewRef: B,
-			toWorld: nn
-		}),
-		lt && /* @__PURE__ */ v(ve, {
-			canvasRef: k,
-			...j ? { anchorRef: k } : {},
-			viewRef: B,
-			toWorld: nn,
-			pickEvery: en,
-			pickBest: tn
-		}),
-		ut && /* @__PURE__ */ v(ye, {
-			canvasRef: k,
-			...j ? { anchorRef: k } : {},
-			modeId: typeof ut == "object" ? ut.modeId : void 0
-		})
-	] });
-	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()
-	}), wn] });
+	}, [st]), ie(dt, O, R ? D : null, De?.cursor), te(I, {
+		focusOnPress: je,
+		onFocus: ke,
+		onBlur: Ae,
+		onHover: (e, n) => {
+			let r = K.current, [i, a] = Y(n.clientX, n.clientY), o = M ?? me;
+			for (let e of $) e.onUncapturedMove && t(e, o, N) && e.onUncapturedMove(i, a, n, r, {
+				width: S,
+				height: C
+			});
+		},
+		onLeave: () => {
+			for (let e of $) e.onUncapturedLeave?.();
+		}
+	}), R ? null : /* @__PURE__ */ le(ee, {
+		ref: He,
+		width: S,
+		height: C,
+		tabIndex: Oe,
+		className: Ee,
+		style: De
+	});
 }
-var x = be(b);
+var S = m(he);
 //#endregion
-export { x as Canvas };
+export { S as Canvas };
 
 //# sourceMappingURL=Canvas.js.map