@motion-core/motion-gpu 0.7.0 → 0.8.0

package/dist/vue/use-pointer.js

@@ -0,0 +1,298 @@
+import { createCurrentWritable } from "../core/current-value.js";
+import { createInitialPointerState, getPointerCoordinates, getPointerNowSeconds, normalizePointerKind, resolvePointerFrameRequestMode } from "../core/pointer.js";
+import { useMotionGPU } from "./motiongpu-context.js";
+import { onBeforeUnmount, onMounted } from "vue";
+//#region src/lib/vue/use-pointer.ts
+/**
+* Normalizes click button configuration with a primary-button fallback.
+*/
+function normalizeClickButtons(buttons) {
+	const source = buttons && buttons.length > 0 ? buttons : [0];
+	return new Set(source);
+}
+/**
+* Resolves a valid click duration threshold in milliseconds.
+*/
+function resolveClickMaxDurationMs(value) {
+	if (typeof value !== "number" || Number.isNaN(value) || value <= 0) return 350;
+	return value;
+}
+/**
+* Resolves a valid click travel threshold in pixels.
+*/
+function resolveClickMaxMovePx(value) {
+	if (typeof value !== "number" || Number.isNaN(value) || value < 0) return 8;
+	return value;
+}
+/**
+* Tracks normalized pointer coordinates and click/tap snapshots for the active `FragCanvas`.
+*/
+function usePointer(options = {}) {
+	const motiongpu = useMotionGPU();
+	const pointerState = createCurrentWritable(createInitialPointerState());
+	const lastClick = createCurrentWritable(null);
+	const enabled = options.enabled ?? true;
+	const requestFrameMode = options.requestFrame ?? "auto";
+	const capturePointer = options.capturePointer ?? true;
+	const trackOutside = options.trackWhilePressedOutsideCanvas ?? true;
+	const clickEnabled = options.clickEnabled ?? true;
+	const clickMaxDurationMs = resolveClickMaxDurationMs(options.clickMaxDurationMs);
+	const clickMaxMovePx = resolveClickMaxMovePx(options.clickMaxMovePx);
+	const clickButtons = normalizeClickButtons(options.clickButtons);
+	let activePointerId = null;
+	let downSnapshot = null;
+	let clickCounter = 0;
+	let previousPx = null;
+	let previousUv = null;
+	let previousTimeSeconds = 0;
+	let cleanup = null;
+	const requestFrame = () => {
+		const mode = resolvePointerFrameRequestMode(requestFrameMode, motiongpu.renderMode.current);
+		if (mode === "invalidate") {
+			motiongpu.invalidate();
+			return;
+		}
+		if (mode === "advance") motiongpu.advance();
+	};
+	/**
+	* Commits a full pointer state snapshot with computed delta and velocity vectors.
+	*/
+	const updatePointerState = (input) => {
+		const nowSeconds = getPointerNowSeconds();
+		const dt = previousTimeSeconds > 0 ? Math.max(nowSeconds - previousTimeSeconds, 1e-6) : 0;
+		const deltaPx = input.resetDelta || !previousPx ? [0, 0] : [input.point.px[0] - previousPx[0], input.point.px[1] - previousPx[1]];
+		const deltaUv = input.resetDelta || !previousUv ? [0, 0] : [input.point.uv[0] - previousUv[0], input.point.uv[1] - previousUv[1]];
+		const velocityPx = dt > 0 ? [deltaPx[0] / dt, deltaPx[1] / dt] : [0, 0];
+		const velocityUv = dt > 0 ? [deltaUv[0] / dt, deltaUv[1] / dt] : [0, 0];
+		const nextState = {
+			px: input.point.px,
+			uv: input.point.uv,
+			ndc: input.point.ndc,
+			inside: input.inside,
+			pressed: input.pressed,
+			dragging: input.dragging,
+			pointerType: input.pointerType,
+			pointerId: input.pointerId,
+			button: input.button,
+			buttons: input.buttons,
+			time: nowSeconds,
+			downPx: input.downPx,
+			downUv: input.downUv,
+			deltaPx,
+			deltaUv,
+			velocityPx,
+			velocityUv
+		};
+		pointerState.set(nextState);
+		previousPx = input.point.px;
+		previousUv = input.point.uv;
+		previousTimeSeconds = nowSeconds;
+		requestFrame();
+		return nextState;
+	};
+	/**
+	* Updates only the `inside` flag while keeping the latest pointer coordinates.
+	*/
+	const updateInsideState = (inside) => {
+		const nextState = {
+			...pointerState.current,
+			inside,
+			time: getPointerNowSeconds(),
+			deltaPx: [0, 0],
+			deltaUv: [0, 0],
+			velocityPx: [0, 0],
+			velocityUv: [0, 0]
+		};
+		pointerState.set(nextState);
+		requestFrame();
+		return nextState;
+	};
+	/**
+	* Checks whether an event belongs to the active tracked pointer.
+	*/
+	const isTrackedPointer = (event) => activePointerId === null || event.pointerId === activePointerId;
+	const attachListeners = () => {
+		if (!enabled) return;
+		const canvas = motiongpu.canvas;
+		if (!canvas) return;
+		const handlePointerDown = (event) => {
+			const point = getPointerCoordinates(event.clientX, event.clientY, canvas.getBoundingClientRect());
+			const pointerType = normalizePointerKind(event.pointerType);
+			activePointerId = event.pointerId;
+			downSnapshot = {
+				pointerId: event.pointerId,
+				pointerType,
+				button: event.button,
+				timeMs: getPointerNowSeconds() * 1e3,
+				px: point.px,
+				uv: point.uv,
+				inside: point.inside
+			};
+			if (capturePointer) try {
+				canvas.setPointerCapture(event.pointerId);
+			} catch {}
+			const nextState = updatePointerState({
+				point,
+				inside: point.inside,
+				pressed: true,
+				dragging: false,
+				pointerType,
+				pointerId: event.pointerId,
+				button: event.button,
+				buttons: event.buttons,
+				downPx: point.px,
+				downUv: point.uv,
+				resetDelta: true
+			});
+			options.onDown?.(nextState, event);
+		};
+		const handleMove = (event) => {
+			if (!isTrackedPointer(event)) return;
+			const point = getPointerCoordinates(event.clientX, event.clientY, canvas.getBoundingClientRect());
+			const pressed = activePointerId !== null && event.pointerId === activePointerId;
+			const downPx = pressed ? downSnapshot?.px ?? point.px : null;
+			const downUv = pressed ? downSnapshot?.uv ?? point.uv : null;
+			let dragging = false;
+			if (pressed && downPx) {
+				const dx = point.px[0] - downPx[0];
+				const dy = point.px[1] - downPx[1];
+				dragging = Math.hypot(dx, dy) > 0;
+			}
+			const nextState = updatePointerState({
+				point,
+				inside: point.inside,
+				pressed,
+				dragging,
+				pointerType: normalizePointerKind(event.pointerType),
+				pointerId: event.pointerId,
+				button: pressed ? downSnapshot?.button ?? event.button : null,
+				buttons: event.buttons,
+				downPx,
+				downUv
+			});
+			options.onMove?.(nextState, event);
+		};
+		const handleWindowMove = (event) => {
+			if (!trackOutside || activePointerId === null || event.pointerId !== activePointerId) return;
+			const point = getPointerCoordinates(event.clientX, event.clientY, canvas.getBoundingClientRect());
+			if (point.inside) return;
+			const downPx = downSnapshot?.px ?? point.px;
+			const downUv = downSnapshot?.uv ?? point.uv;
+			const dx = point.px[0] - downPx[0];
+			const dy = point.px[1] - downPx[1];
+			const nextState = updatePointerState({
+				point,
+				inside: false,
+				pressed: true,
+				dragging: Math.hypot(dx, dy) > 0,
+				pointerType: downSnapshot?.pointerType ?? normalizePointerKind(event.pointerType),
+				pointerId: event.pointerId,
+				button: downSnapshot?.button ?? event.button,
+				buttons: event.buttons,
+				downPx,
+				downUv
+			});
+			options.onMove?.(nextState, event);
+		};
+		const releasePointer = (event, emitClick) => {
+			if (activePointerId === null || event.pointerId !== activePointerId) return;
+			const point = getPointerCoordinates(event.clientX, event.clientY, canvas.getBoundingClientRect());
+			const pointerType = downSnapshot?.pointerType ?? normalizePointerKind(event.pointerType);
+			const previous = downSnapshot;
+			const nextState = updatePointerState({
+				point,
+				inside: point.inside,
+				pressed: false,
+				dragging: false,
+				pointerType,
+				pointerId: null,
+				button: null,
+				buttons: event.buttons,
+				downPx: null,
+				downUv: null
+			});
+			options.onUp?.(nextState, event);
+			if (capturePointer && canvas.hasPointerCapture(event.pointerId)) try {
+				canvas.releasePointerCapture(event.pointerId);
+			} catch {}
+			if (emitClick && clickEnabled && previous && clickButtons.has(previous.button)) {
+				const durationMs = getPointerNowSeconds() * 1e3 - previous.timeMs;
+				const dx = point.px[0] - previous.px[0];
+				const dy = point.px[1] - previous.px[1];
+				const moveDistance = Math.hypot(dx, dy);
+				if (previous.inside && point.inside && durationMs <= clickMaxDurationMs && moveDistance <= clickMaxMovePx) {
+					clickCounter += 1;
+					const click = {
+						id: clickCounter,
+						time: getPointerNowSeconds(),
+						pointerType,
+						pointerId: event.pointerId,
+						button: previous.button,
+						modifiers: {
+							alt: event.altKey,
+							ctrl: event.ctrlKey,
+							shift: event.shiftKey,
+							meta: event.metaKey
+						},
+						px: point.px,
+						uv: point.uv,
+						ndc: point.ndc
+					};
+					lastClick.set(click);
+					options.onClick?.(click, nextState, event);
+					requestFrame();
+				}
+			}
+			activePointerId = null;
+			downSnapshot = null;
+		};
+		const handlePointerUp = (event) => {
+			releasePointer(event, true);
+		};
+		const handlePointerCancel = (event) => {
+			releasePointer(event, false);
+		};
+		const handlePointerLeave = () => {
+			if (activePointerId !== null) return;
+			updateInsideState(false);
+		};
+		canvas.addEventListener("pointerdown", handlePointerDown);
+		canvas.addEventListener("pointermove", handleMove);
+		canvas.addEventListener("pointerup", handlePointerUp);
+		canvas.addEventListener("pointercancel", handlePointerCancel);
+		canvas.addEventListener("pointerleave", handlePointerLeave);
+		if (trackOutside) {
+			window.addEventListener("pointermove", handleWindowMove);
+			window.addEventListener("pointerup", handlePointerUp);
+			window.addEventListener("pointercancel", handlePointerCancel);
+		}
+		cleanup = () => {
+			canvas.removeEventListener("pointerdown", handlePointerDown);
+			canvas.removeEventListener("pointermove", handleMove);
+			canvas.removeEventListener("pointerup", handlePointerUp);
+			canvas.removeEventListener("pointercancel", handlePointerCancel);
+			canvas.removeEventListener("pointerleave", handlePointerLeave);
+			if (trackOutside) {
+				window.removeEventListener("pointermove", handleWindowMove);
+				window.removeEventListener("pointerup", handlePointerUp);
+				window.removeEventListener("pointercancel", handlePointerCancel);
+			}
+		};
+	};
+	onMounted(attachListeners);
+	onBeforeUnmount(() => {
+		cleanup?.();
+		cleanup = null;
+	});
+	return {
+		state: pointerState,
+		lastClick,
+		resetClick: () => {
+			lastClick.set(null);
+		}
+	};
+}
+//#endregion
+export { usePointer };
+
+//# sourceMappingURL=use-pointer.js.map

package/dist/vue/use-pointer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-pointer.js","names":[],"sources":["../../src/lib/vue/use-pointer.ts"],"sourcesContent":["import { onBeforeUnmount, onMounted } from 'vue';\nimport {\n\tcreateCurrentWritable as currentWritable,\n\ttype CurrentReadable\n} from '../core/current-value.js';\nimport {\n\tcreateInitialPointerState,\n\tgetPointerCoordinates,\n\tgetPointerNowSeconds,\n\tnormalizePointerKind,\n\tresolvePointerFrameRequestMode,\n\ttype PointerClick,\n\ttype PointerFrameRequestMode,\n\ttype PointerState,\n\ttype PointerVec2\n} from '../core/pointer.js';\nimport { useMotionGPU } from './motiongpu-context.js';\n\nexport type {\n\tPointerClick,\n\tPointerFrameRequestMode,\n\tPointerKind,\n\tPointerPoint,\n\tPointerState\n} from '../core/pointer.js';\n\n/**\n * Configuration for pointer input handling in `usePointer`.\n */\nexport interface UsePointerOptions {\n\t/**\n\t * Enables pointer listeners.\n\t *\n\t * @default true\n\t */\n\tenabled?: boolean;\n\t/**\n\t * Frame wake-up strategy for pointer-driven state changes.\n\t *\n\t * @default 'auto'\n\t */\n\trequestFrame?: PointerFrameRequestMode;\n\t/**\n\t * Requests pointer capture on pointer down.\n\t *\n\t * @default true\n\t */\n\tcapturePointer?: boolean;\n\t/**\n\t * Tracks pointer move/up outside canvas while pointer is pressed.\n\t *\n\t * @default true\n\t */\n\ttrackWhilePressedOutsideCanvas?: boolean;\n\t/**\n\t * Enables click/tap synthesis on pointer up.\n\t *\n\t * @default true\n\t */\n\tclickEnabled?: boolean;\n\t/**\n\t * Maximum press duration to consider pointer up a click (milliseconds).\n\t *\n\t * @default 350\n\t */\n\tclickMaxDurationMs?: number;\n\t/**\n\t * Maximum pointer travel from down to up to consider pointer up a click (pixels).\n\t *\n\t * @default 8\n\t */\n\tclickMaxMovePx?: number;\n\t/**\n\t * Allowed pointer buttons for click synthesis.\n\t *\n\t * @default [0]\n\t */\n\tclickButtons?: number[];\n\t/**\n\t * Called after pointer move state update.\n\t */\n\tonMove?: (state: PointerState, event: PointerEvent) => void;\n\t/**\n\t * Called after pointer down state update.\n\t */\n\tonDown?: (state: PointerState, event: PointerEvent) => void;\n\t/**\n\t * Called after pointer up/cancel state update.\n\t */\n\tonUp?: (state: PointerState, event: PointerEvent) => void;\n\t/**\n\t * Called when click/tap is synthesized.\n\t */\n\tonClick?: (click: PointerClick, state: PointerState, event: PointerEvent) => void;\n}\n\n/**\n * Reactive state returned by `usePointer`.\n */\nexport interface UsePointerResult {\n\t/**\n\t * Current pointer state.\n\t */\n\tstate: CurrentReadable<PointerState>;\n\t/**\n\t * Last synthesized click/tap event.\n\t */\n\tlastClick: CurrentReadable<PointerClick | null>;\n\t/**\n\t * Clears last click snapshot.\n\t */\n\tresetClick: () => void;\n}\n\ninterface PointerDownSnapshot {\n\tbutton: number;\n\tinside: boolean;\n\tpointerId: number;\n\tpointerType: 'mouse' | 'pen' | 'touch';\n\tpx: PointerVec2;\n\ttimeMs: number;\n\tuv: PointerVec2;\n}\n\n/**\n * Normalizes click button configuration with a primary-button fallback.\n */\nfunction normalizeClickButtons(buttons: number[] | undefined): Set<number> {\n\tconst source = buttons && buttons.length > 0 ? buttons : [0];\n\treturn new Set(source);\n}\n\n/**\n * Resolves a valid click duration threshold in milliseconds.\n */\nfunction resolveClickMaxDurationMs(value: number | undefined): number {\n\tif (typeof value !== 'number' || Number.isNaN(value) || value <= 0) {\n\t\treturn 350;\n\t}\n\n\treturn value;\n}\n\n/**\n * Resolves a valid click travel threshold in pixels.\n */\nfunction resolveClickMaxMovePx(value: number | undefined): number {\n\tif (typeof value !== 'number' || Number.isNaN(value) || value < 0) {\n\t\treturn 8;\n\t}\n\n\treturn value;\n}\n\n/**\n * Tracks normalized pointer coordinates and click/tap snapshots for the active `FragCanvas`.\n */\nexport function usePointer(options: UsePointerOptions = {}): UsePointerResult {\n\tconst motiongpu = useMotionGPU();\n\tconst pointerState = currentWritable<PointerState>(createInitialPointerState());\n\tconst lastClick = currentWritable<PointerClick | null>(null);\n\tconst enabled = options.enabled ?? true;\n\tconst requestFrameMode = options.requestFrame ?? 'auto';\n\tconst capturePointer = options.capturePointer ?? true;\n\tconst trackOutside = options.trackWhilePressedOutsideCanvas ?? true;\n\tconst clickEnabled = options.clickEnabled ?? true;\n\tconst clickMaxDurationMs = resolveClickMaxDurationMs(options.clickMaxDurationMs);\n\tconst clickMaxMovePx = resolveClickMaxMovePx(options.clickMaxMovePx);\n\tconst clickButtons = normalizeClickButtons(options.clickButtons);\n\tlet activePointerId: number | null = null;\n\tlet downSnapshot: PointerDownSnapshot | null = null;\n\tlet clickCounter = 0;\n\tlet previousPx: PointerVec2 | null = null;\n\tlet previousUv: PointerVec2 | null = null;\n\tlet previousTimeSeconds = 0;\n\tlet cleanup: (() => void) | null = null;\n\n\tconst requestFrame = (): void => {\n\t\tconst mode = resolvePointerFrameRequestMode(requestFrameMode, motiongpu.renderMode.current);\n\t\tif (mode === 'invalidate') {\n\t\t\tmotiongpu.invalidate();\n\t\t\treturn;\n\t\t}\n\t\tif (mode === 'advance') {\n\t\t\tmotiongpu.advance();\n\t\t}\n\t};\n\n\t/**\n\t * Commits a full pointer state snapshot with computed delta and velocity vectors.\n\t */\n\tconst updatePointerState = (input: {\n\t\tbutton: number | null;\n\t\tbuttons: number;\n\t\tdownPx: PointerVec2 | null;\n\t\tdownUv: PointerVec2 | null;\n\t\tdragging: boolean;\n\t\tinside: boolean;\n\t\tpointerId: number | null;\n\t\tpointerType: 'mouse' | 'pen' | 'touch' | null;\n\t\tpressed: boolean;\n\t\tpoint: {\n\t\t\tndc: PointerVec2;\n\t\t\tpx: PointerVec2;\n\t\t\tuv: PointerVec2;\n\t\t};\n\t\tresetDelta?: boolean;\n\t}): PointerState => {\n\t\tconst nowSeconds = getPointerNowSeconds();\n\t\tconst dt = previousTimeSeconds > 0 ? Math.max(nowSeconds - previousTimeSeconds, 1e-6) : 0;\n\t\tconst deltaPx: PointerVec2 =\n\t\t\tinput.resetDelta || !previousPx\n\t\t\t\t? [0, 0]\n\t\t\t\t: [input.point.px[0] - previousPx[0], input.point.px[1] - previousPx[1]];\n\t\tconst deltaUv: PointerVec2 =\n\t\t\tinput.resetDelta || !previousUv\n\t\t\t\t? [0, 0]\n\t\t\t\t: [input.point.uv[0] - previousUv[0], input.point.uv[1] - previousUv[1]];\n\t\tconst velocityPx: PointerVec2 = dt > 0 ? [deltaPx[0] / dt, deltaPx[1] / dt] : [0, 0];\n\t\tconst velocityUv: PointerVec2 = dt > 0 ? [deltaUv[0] / dt, deltaUv[1] / dt] : [0, 0];\n\t\tconst nextState: PointerState = {\n\t\t\tpx: input.point.px,\n\t\t\tuv: input.point.uv,\n\t\t\tndc: input.point.ndc,\n\t\t\tinside: input.inside,\n\t\t\tpressed: input.pressed,\n\t\t\tdragging: input.dragging,\n\t\t\tpointerType: input.pointerType,\n\t\t\tpointerId: input.pointerId,\n\t\t\tbutton: input.button,\n\t\t\tbuttons: input.buttons,\n\t\t\ttime: nowSeconds,\n\t\t\tdownPx: input.downPx,\n\t\t\tdownUv: input.downUv,\n\t\t\tdeltaPx,\n\t\t\tdeltaUv,\n\t\t\tvelocityPx,\n\t\t\tvelocityUv\n\t\t};\n\t\tpointerState.set(nextState);\n\t\tpreviousPx = input.point.px;\n\t\tpreviousUv = input.point.uv;\n\t\tpreviousTimeSeconds = nowSeconds;\n\t\trequestFrame();\n\t\treturn nextState;\n\t};\n\n\t/**\n\t * Updates only the `inside` flag while keeping the latest pointer coordinates.\n\t */\n\tconst updateInsideState = (inside: boolean): PointerState => {\n\t\tconst current = pointerState.current;\n\t\tconst nextState: PointerState = {\n\t\t\t...current,\n\t\t\tinside,\n\t\t\ttime: getPointerNowSeconds(),\n\t\t\tdeltaPx: [0, 0],\n\t\t\tdeltaUv: [0, 0],\n\t\t\tvelocityPx: [0, 0],\n\t\t\tvelocityUv: [0, 0]\n\t\t};\n\t\tpointerState.set(nextState);\n\t\trequestFrame();\n\t\treturn nextState;\n\t};\n\n\t/**\n\t * Checks whether an event belongs to the active tracked pointer.\n\t */\n\tconst isTrackedPointer = (event: PointerEvent): boolean =>\n\t\tactivePointerId === null || event.pointerId === activePointerId;\n\n\tconst attachListeners = (): void => {\n\t\tif (!enabled) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst canvas = motiongpu.canvas;\n\t\tif (!canvas) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst handlePointerDown = (event: PointerEvent): void => {\n\t\t\tconst point = getPointerCoordinates(\n\t\t\t\tevent.clientX,\n\t\t\t\tevent.clientY,\n\t\t\t\tcanvas.getBoundingClientRect()\n\t\t\t);\n\t\t\tconst pointerType = normalizePointerKind(event.pointerType);\n\t\t\tactivePointerId = event.pointerId;\n\t\t\tdownSnapshot = {\n\t\t\t\tpointerId: event.pointerId,\n\t\t\t\tpointerType,\n\t\t\t\tbutton: event.button,\n\t\t\t\ttimeMs: getPointerNowSeconds() * 1000,\n\t\t\t\tpx: point.px,\n\t\t\t\tuv: point.uv,\n\t\t\t\tinside: point.inside\n\t\t\t};\n\t\t\tif (capturePointer) {\n\t\t\t\ttry {\n\t\t\t\t\tcanvas.setPointerCapture(event.pointerId);\n\t\t\t\t} catch {\n\t\t\t\t\t// Browser rejected capture (e.g. unsupported pointer state).\n\t\t\t\t}\n\t\t\t}\n\t\t\tconst nextState = updatePointerState({\n\t\t\t\tpoint,\n\t\t\t\tinside: point.inside,\n\t\t\t\tpressed: true,\n\t\t\t\tdragging: false,\n\t\t\t\tpointerType,\n\t\t\t\tpointerId: event.pointerId,\n\t\t\t\tbutton: event.button,\n\t\t\t\tbuttons: event.buttons,\n\t\t\t\tdownPx: point.px,\n\t\t\t\tdownUv: point.uv,\n\t\t\t\tresetDelta: true\n\t\t\t});\n\t\t\toptions.onDown?.(nextState, event);\n\t\t};\n\n\t\tconst handleMove = (event: PointerEvent): void => {\n\t\t\tif (!isTrackedPointer(event)) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst point = getPointerCoordinates(\n\t\t\t\tevent.clientX,\n\t\t\t\tevent.clientY,\n\t\t\t\tcanvas.getBoundingClientRect()\n\t\t\t);\n\t\t\tconst pressed = activePointerId !== null && event.pointerId === activePointerId;\n\t\t\tconst downPx = pressed ? (downSnapshot?.px ?? point.px) : null;\n\t\t\tconst downUv = pressed ? (downSnapshot?.uv ?? point.uv) : null;\n\t\t\tlet dragging = false;\n\t\t\tif (pressed && downPx) {\n\t\t\t\tconst dx = point.px[0] - downPx[0];\n\t\t\t\tconst dy = point.px[1] - downPx[1];\n\t\t\t\tdragging = Math.hypot(dx, dy) > 0;\n\t\t\t}\n\t\t\tconst nextState = updatePointerState({\n\t\t\t\tpoint,\n\t\t\t\tinside: point.inside,\n\t\t\t\tpressed,\n\t\t\t\tdragging,\n\t\t\t\tpointerType: normalizePointerKind(event.pointerType),\n\t\t\t\tpointerId: event.pointerId,\n\t\t\t\tbutton: pressed ? (downSnapshot?.button ?? event.button) : null,\n\t\t\t\tbuttons: event.buttons,\n\t\t\t\tdownPx,\n\t\t\t\tdownUv\n\t\t\t});\n\t\t\toptions.onMove?.(nextState, event);\n\t\t};\n\n\t\tconst handleWindowMove = (event: PointerEvent): void => {\n\t\t\tif (!trackOutside || activePointerId === null || event.pointerId !== activePointerId) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst point = getPointerCoordinates(\n\t\t\t\tevent.clientX,\n\t\t\t\tevent.clientY,\n\t\t\t\tcanvas.getBoundingClientRect()\n\t\t\t);\n\t\t\tif (point.inside) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tconst downPx = downSnapshot?.px ?? point.px;\n\t\t\tconst downUv = downSnapshot?.uv ?? point.uv;\n\t\t\tconst dx = point.px[0] - downPx[0];\n\t\t\tconst dy = point.px[1] - downPx[1];\n\t\t\tconst nextState = updatePointerState({\n\t\t\t\tpoint,\n\t\t\t\tinside: false,\n\t\t\t\tpressed: true,\n\t\t\t\tdragging: Math.hypot(dx, dy) > 0,\n\t\t\t\tpointerType: downSnapshot?.pointerType ?? normalizePointerKind(event.pointerType),\n\t\t\t\tpointerId: event.pointerId,\n\t\t\t\tbutton: downSnapshot?.button ?? event.button,\n\t\t\t\tbuttons: event.buttons,\n\t\t\t\tdownPx,\n\t\t\t\tdownUv\n\t\t\t});\n\t\t\toptions.onMove?.(nextState, event);\n\t\t};\n\n\t\tconst releasePointer = (event: PointerEvent, emitClick: boolean): void => {\n\t\t\tif (activePointerId === null || event.pointerId !== activePointerId) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst point = getPointerCoordinates(\n\t\t\t\tevent.clientX,\n\t\t\t\tevent.clientY,\n\t\t\t\tcanvas.getBoundingClientRect()\n\t\t\t);\n\t\t\tconst pointerType = downSnapshot?.pointerType ?? normalizePointerKind(event.pointerType);\n\t\t\tconst previous = downSnapshot;\n\t\t\tconst nextState = updatePointerState({\n\t\t\t\tpoint,\n\t\t\t\tinside: point.inside,\n\t\t\t\tpressed: false,\n\t\t\t\tdragging: false,\n\t\t\t\tpointerType,\n\t\t\t\tpointerId: null,\n\t\t\t\tbutton: null,\n\t\t\t\tbuttons: event.buttons,\n\t\t\t\tdownPx: null,\n\t\t\t\tdownUv: null\n\t\t\t});\n\t\t\toptions.onUp?.(nextState, event);\n\n\t\t\tif (capturePointer && canvas.hasPointerCapture(event.pointerId)) {\n\t\t\t\ttry {\n\t\t\t\t\tcanvas.releasePointerCapture(event.pointerId);\n\t\t\t\t} catch {\n\t\t\t\t\t// Browser rejected release for this pointer id.\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tif (emitClick && clickEnabled && previous && clickButtons.has(previous.button)) {\n\t\t\t\tconst durationMs = getPointerNowSeconds() * 1000 - previous.timeMs;\n\t\t\t\tconst dx = point.px[0] - previous.px[0];\n\t\t\t\tconst dy = point.px[1] - previous.px[1];\n\t\t\t\tconst moveDistance = Math.hypot(dx, dy);\n\t\t\t\tif (\n\t\t\t\t\tprevious.inside &&\n\t\t\t\t\tpoint.inside &&\n\t\t\t\t\tdurationMs <= clickMaxDurationMs &&\n\t\t\t\t\tmoveDistance <= clickMaxMovePx\n\t\t\t\t) {\n\t\t\t\t\tclickCounter += 1;\n\t\t\t\t\tconst click: PointerClick = {\n\t\t\t\t\t\tid: clickCounter,\n\t\t\t\t\t\ttime: getPointerNowSeconds(),\n\t\t\t\t\t\tpointerType,\n\t\t\t\t\t\tpointerId: event.pointerId,\n\t\t\t\t\t\tbutton: previous.button,\n\t\t\t\t\t\tmodifiers: {\n\t\t\t\t\t\t\talt: event.altKey,\n\t\t\t\t\t\t\tctrl: event.ctrlKey,\n\t\t\t\t\t\t\tshift: event.shiftKey,\n\t\t\t\t\t\t\tmeta: event.metaKey\n\t\t\t\t\t\t},\n\t\t\t\t\t\tpx: point.px,\n\t\t\t\t\t\tuv: point.uv,\n\t\t\t\t\t\tndc: point.ndc\n\t\t\t\t\t};\n\t\t\t\t\tlastClick.set(click);\n\t\t\t\t\toptions.onClick?.(click, nextState, event);\n\t\t\t\t\trequestFrame();\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tactivePointerId = null;\n\t\t\tdownSnapshot = null;\n\t\t};\n\n\t\tconst handlePointerUp = (event: PointerEvent): void => {\n\t\t\treleasePointer(event, true);\n\t\t};\n\n\t\tconst handlePointerCancel = (event: PointerEvent): void => {\n\t\t\treleasePointer(event, false);\n\t\t};\n\n\t\tconst handlePointerLeave = (): void => {\n\t\t\tif (activePointerId !== null) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tupdateInsideState(false);\n\t\t};\n\n\t\tcanvas.addEventListener('pointerdown', handlePointerDown);\n\t\tcanvas.addEventListener('pointermove', handleMove);\n\t\tcanvas.addEventListener('pointerup', handlePointerUp);\n\t\tcanvas.addEventListener('pointercancel', handlePointerCancel);\n\t\tcanvas.addEventListener('pointerleave', handlePointerLeave);\n\t\tif (trackOutside) {\n\t\t\twindow.addEventListener('pointermove', handleWindowMove);\n\t\t\twindow.addEventListener('pointerup', handlePointerUp);\n\t\t\twindow.addEventListener('pointercancel', handlePointerCancel);\n\t\t}\n\n\t\tcleanup = (): void => {\n\t\t\tcanvas.removeEventListener('pointerdown', handlePointerDown);\n\t\t\tcanvas.removeEventListener('pointermove', handleMove);\n\t\t\tcanvas.removeEventListener('pointerup', handlePointerUp);\n\t\t\tcanvas.removeEventListener('pointercancel', handlePointerCancel);\n\t\t\tcanvas.removeEventListener('pointerleave', handlePointerLeave);\n\t\t\tif (trackOutside) {\n\t\t\t\twindow.removeEventListener('pointermove', handleWindowMove);\n\t\t\t\twindow.removeEventListener('pointerup', handlePointerUp);\n\t\t\t\twindow.removeEventListener('pointercancel', handlePointerCancel);\n\t\t\t}\n\t\t};\n\t};\n\n\tonMounted(attachListeners);\n\tonBeforeUnmount(() => {\n\t\tcleanup?.();\n\t\tcleanup = null;\n\t});\n\n\treturn {\n\t\tstate: pointerState,\n\t\tlastClick,\n\t\tresetClick: () => {\n\t\t\tlastClick.set(null);\n\t\t}\n\t};\n}\n"],"mappings":"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"}

package/dist/vue/use-texture.d.ts

@@ -0,0 +1,45 @@
+import { type CurrentReadable } from '../core/current-value.js';
+import { type LoadedTexture, type TextureLoadOptions } from '../core/texture-loader.js';
+import { type MotionGPUErrorReport } from '../core/error-report.js';
+/**
+ * Reactive state returned by {@link useTexture}.
+ */
+export interface UseTextureResult {
+    /**
+     * Loaded textures or `null` when unavailable/failed.
+     */
+    textures: CurrentReadable<LoadedTexture[] | null>;
+    /**
+     * `true` while an active load request is running.
+     */
+    loading: CurrentReadable<boolean>;
+    /**
+     * Last loading error.
+     */
+    error: CurrentReadable<Error | null>;
+    /**
+     * Last loading error normalized to MotionGPU diagnostics report shape.
+     */
+    errorReport: CurrentReadable<MotionGPUErrorReport | null>;
+    /**
+     * Reloads all textures using current URL input.
+     */
+    reload: () => Promise<void>;
+}
+/**
+ * Supported URL input variants for `useTexture`.
+ */
+export type TextureUrlInput = string[] | (() => string[]);
+/**
+ * Supported options input variants for `useTexture`.
+ */
+export type TextureOptionsInput = TextureLoadOptions | (() => TextureLoadOptions);
+/**
+ * Loads textures from URLs and exposes reactive loading/error state.
+ *
+ * @param urlInput - URLs array or lazy URL provider.
+ * @param optionsInput - Loader options object or lazy options provider.
+ * @returns Reactive texture loading state with reload support.
+ */
+export declare function useTexture(urlInput: TextureUrlInput, optionsInput?: TextureOptionsInput): UseTextureResult;
+//# sourceMappingURL=use-texture.d.ts.map

package/dist/vue/use-texture.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-texture.d.ts","sourceRoot":"","sources":["../../src/lib/vue/use-texture.ts"],"names":[],"mappings":"AACA,OAAO,EAEN,KAAK,eAAe,EACpB,MAAM,0BAA0B,CAAC;AAClC,OAAO,EAGN,KAAK,aAAa,EAClB,KAAK,kBAAkB,EACvB,MAAM,2BAA2B,CAAC;AACnC,OAAO,EAA0B,KAAK,oBAAoB,EAAE,MAAM,yBAAyB,CAAC;AAE5F;;GAEG;AACH,MAAM,WAAW,gBAAgB;IAChC;;OAEG;IACH,QAAQ,EAAE,eAAe,CAAC,aAAa,EAAE,GAAG,IAAI,CAAC,CAAC;IAClD;;OAEG;IACH,OAAO,EAAE,eAAe,CAAC,OAAO,CAAC,CAAC;IAClC;;OAEG;IACH,KAAK,EAAE,eAAe,CAAC,KAAK,GAAG,IAAI,CAAC,CAAC;IACrC;;OAEG;IACH,WAAW,EAAE,eAAe,CAAC,oBAAoB,GAAG,IAAI,CAAC,CAAC;IAC1D;;OAEG;IACH,MAAM,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;CAC5B;AAED;;GAEG;AACH,MAAM,MAAM,eAAe,GAAG,MAAM,EAAE,GAAG,CAAC,MAAM,MAAM,EAAE,CAAC,CAAC;AAE1D;;GAEG;AACH,MAAM,MAAM,mBAAmB,GAAG,kBAAkB,GAAG,CAAC,MAAM,kBAAkB,CAAC,CAAC;AAkElF;;;;;;GAMG;AACH,wBAAgB,UAAU,CACzB,QAAQ,EAAE,eAAe,EACzB,YAAY,GAAE,mBAAwB,GACpC,gBAAgB,CA4GlB"}

package/dist/vue/use-texture.js

@@ -0,0 +1,135 @@
+import { toMotionGPUErrorReport } from "../core/error-report.js";
+import { createCurrentWritable } from "../core/current-value.js";
+import { isAbortError, loadTexturesFromUrls } from "../core/texture-loader.js";
+import { onBeforeUnmount } from "vue";
+//#region src/lib/vue/use-texture.ts
+/**
+* Normalizes unknown thrown values to an `Error` instance.
+*/
+function toError(error) {
+	if (error instanceof Error) return error;
+	return /* @__PURE__ */ new Error("Unknown texture loading error");
+}
+/**
+* Releases GPU-side resources for a list of loaded textures.
+*/
+function disposeTextures(list) {
+	for (const texture of list ?? []) texture.dispose();
+}
+function mergeAbortSignals(primary, secondary) {
+	if (!secondary) return {
+		signal: primary,
+		dispose: () => {}
+	};
+	if (typeof AbortSignal.any === "function") return {
+		signal: AbortSignal.any([primary, secondary]),
+		dispose: () => {}
+	};
+	const fallback = new AbortController();
+	let disposed = false;
+	const cleanup = () => {
+		if (disposed) return;
+		disposed = true;
+		primary.removeEventListener("abort", abort);
+		secondary.removeEventListener("abort", abort);
+	};
+	const abort = () => fallback.abort();
+	primary.addEventListener("abort", abort, { once: true });
+	secondary.addEventListener("abort", abort, { once: true });
+	return {
+		signal: fallback.signal,
+		dispose: cleanup
+	};
+}
+/**
+* Loads textures from URLs and exposes reactive loading/error state.
+*
+* @param urlInput - URLs array or lazy URL provider.
+* @param optionsInput - Loader options object or lazy options provider.
+* @returns Reactive texture loading state with reload support.
+*/
+function useTexture(urlInput, optionsInput = {}) {
+	const textures = createCurrentWritable(null);
+	const loading = createCurrentWritable(true);
+	const error = createCurrentWritable(null);
+	const errorReport = createCurrentWritable(null);
+	let disposed = false;
+	let requestVersion = 0;
+	let activeController = null;
+	let runningLoad = null;
+	let reloadQueued = false;
+	const getUrls = typeof urlInput === "function" ? urlInput : () => urlInput;
+	const getOptions = typeof optionsInput === "function" ? optionsInput : () => optionsInput;
+	const executeLoad = async () => {
+		if (disposed) return;
+		const version = ++requestVersion;
+		const controller = new AbortController();
+		activeController = controller;
+		loading.set(true);
+		error.set(null);
+		errorReport.set(null);
+		const previous = textures.current;
+		const options = getOptions() ?? {};
+		const mergedSignal = mergeAbortSignals(controller.signal, options.signal);
+		try {
+			const loaded = await loadTexturesFromUrls(getUrls(), {
+				...options,
+				signal: mergedSignal.signal
+			});
+			if (disposed || version !== requestVersion) {
+				disposeTextures(loaded);
+				return;
+			}
+			textures.set(loaded);
+			disposeTextures(previous);
+		} catch (nextError) {
+			if (disposed || version !== requestVersion) return;
+			if (isAbortError(nextError)) return;
+			disposeTextures(previous);
+			textures.set(null);
+			const normalizedError = toError(nextError);
+			error.set(normalizedError);
+			errorReport.set(toMotionGPUErrorReport(normalizedError, "initialization"));
+		} finally {
+			if (!disposed && version === requestVersion) loading.set(false);
+			if (activeController === controller) activeController = null;
+			mergedSignal.dispose();
+		}
+	};
+	const runLoadLoop = async () => {
+		do {
+			reloadQueued = false;
+			await executeLoad();
+		} while (reloadQueued && !disposed);
+	};
+	const load = () => {
+		activeController?.abort();
+		if (runningLoad) {
+			reloadQueued = true;
+			return runningLoad;
+		}
+		const trackedPending = runLoadLoop().finally(() => {
+			if (runningLoad === trackedPending) runningLoad = null;
+		});
+		runningLoad = trackedPending;
+		return trackedPending;
+	};
+	load();
+	onBeforeUnmount(() => {
+		disposed = true;
+		requestVersion += 1;
+		activeController?.abort();
+		disposeTextures(textures.current);
+	});
+	return {
+		textures,
+		loading,
+		error,
+		errorReport,
+		reload: load
+	};
+}
+//#endregion
+export { useTexture };
+
+//# sourceMappingURL=use-texture.js.map

package/dist/vue/use-texture.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-texture.js","names":[],"sources":["../../src/lib/vue/use-texture.ts"],"sourcesContent":["import { onBeforeUnmount } from 'vue';\nimport {\n\tcreateCurrentWritable as currentWritable,\n\ttype CurrentReadable\n} from '../core/current-value.js';\nimport {\n\tisAbortError,\n\tloadTexturesFromUrls,\n\ttype LoadedTexture,\n\ttype TextureLoadOptions\n} from '../core/texture-loader.js';\nimport { toMotionGPUErrorReport, type MotionGPUErrorReport } from '../core/error-report.js';\n\n/**\n * Reactive state returned by {@link useTexture}.\n */\nexport interface UseTextureResult {\n\t/**\n\t * Loaded textures or `null` when unavailable/failed.\n\t */\n\ttextures: CurrentReadable<LoadedTexture[] | null>;\n\t/**\n\t * `true` while an active load request is running.\n\t */\n\tloading: CurrentReadable<boolean>;\n\t/**\n\t * Last loading error.\n\t */\n\terror: CurrentReadable<Error | null>;\n\t/**\n\t * Last loading error normalized to MotionGPU diagnostics report shape.\n\t */\n\terrorReport: CurrentReadable<MotionGPUErrorReport | null>;\n\t/**\n\t * Reloads all textures using current URL input.\n\t */\n\treload: () => Promise<void>;\n}\n\n/**\n * Supported URL input variants for `useTexture`.\n */\nexport type TextureUrlInput = string[] | (() => string[]);\n\n/**\n * Supported options input variants for `useTexture`.\n */\nexport type TextureOptionsInput = TextureLoadOptions | (() => TextureLoadOptions);\n\n/**\n * Normalizes unknown thrown values to an `Error` instance.\n */\nfunction toError(error: unknown): Error {\n\tif (error instanceof Error) {\n\t\treturn error;\n\t}\n\n\treturn new Error('Unknown texture loading error');\n}\n\n/**\n * Releases GPU-side resources for a list of loaded textures.\n */\nfunction disposeTextures(list: LoadedTexture[] | null): void {\n\tfor (const texture of list ?? []) {\n\t\ttexture.dispose();\n\t}\n}\n\ninterface MergedAbortSignal {\n\tsignal: AbortSignal;\n\tdispose: () => void;\n}\n\nfunction mergeAbortSignals(\n\tprimary: AbortSignal,\n\tsecondary: AbortSignal | undefined\n): MergedAbortSignal {\n\tif (!secondary) {\n\t\treturn {\n\t\t\tsignal: primary,\n\t\t\tdispose: () => {}\n\t\t};\n\t}\n\n\tif (typeof AbortSignal.any === 'function') {\n\t\treturn {\n\t\t\tsignal: AbortSignal.any([primary, secondary]),\n\t\t\tdispose: () => {}\n\t\t};\n\t}\n\n\tconst fallback = new AbortController();\n\tlet disposed = false;\n\tconst cleanup = (): void => {\n\t\tif (disposed) {\n\t\t\treturn;\n\t\t}\n\t\tdisposed = true;\n\t\tprimary.removeEventListener('abort', abort);\n\t\tsecondary.removeEventListener('abort', abort);\n\t};\n\tconst abort = (): void => fallback.abort();\n\n\tprimary.addEventListener('abort', abort, { once: true });\n\tsecondary.addEventListener('abort', abort, { once: true });\n\n\treturn {\n\t\tsignal: fallback.signal,\n\t\tdispose: cleanup\n\t};\n}\n\n/**\n * Loads textures from URLs and exposes reactive loading/error state.\n *\n * @param urlInput - URLs array or lazy URL provider.\n * @param optionsInput - Loader options object or lazy options provider.\n * @returns Reactive texture loading state with reload support.\n */\nexport function useTexture(\n\turlInput: TextureUrlInput,\n\toptionsInput: TextureOptionsInput = {}\n): UseTextureResult {\n\tconst textures = currentWritable<LoadedTexture[] | null>(null);\n\tconst loading = currentWritable(true);\n\tconst error = currentWritable<Error | null>(null);\n\tconst errorReport = currentWritable<MotionGPUErrorReport | null>(null);\n\tlet disposed = false;\n\tlet requestVersion = 0;\n\tlet activeController: AbortController | null = null;\n\tlet runningLoad: Promise<void> | null = null;\n\tlet reloadQueued = false;\n\tconst getUrls = typeof urlInput === 'function' ? urlInput : () => urlInput;\n\tconst getOptions =\n\t\ttypeof optionsInput === 'function'\n\t\t\t? (optionsInput as () => TextureLoadOptions)\n\t\t\t: () => optionsInput;\n\n\tconst executeLoad = async (): Promise<void> => {\n\t\tif (disposed) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst version = ++requestVersion;\n\t\tconst controller = new AbortController();\n\t\tactiveController = controller;\n\t\tloading.set(true);\n\t\terror.set(null);\n\t\terrorReport.set(null);\n\n\t\tconst previous = textures.current;\n\t\tconst options = getOptions() ?? {};\n\t\tconst mergedSignal = mergeAbortSignals(controller.signal, options.signal);\n\t\ttry {\n\t\t\tconst loaded = await loadTexturesFromUrls(getUrls(), {\n\t\t\t\t...options,\n\t\t\t\tsignal: mergedSignal.signal\n\t\t\t});\n\t\t\tif (disposed || version !== requestVersion) {\n\t\t\t\tdisposeTextures(loaded);\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\ttextures.set(loaded);\n\t\t\tdisposeTextures(previous);\n\t\t} catch (nextError) {\n\t\t\tif (disposed || version !== requestVersion) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tif (isAbortError(nextError)) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tdisposeTextures(previous);\n\t\t\ttextures.set(null);\n\t\t\tconst normalizedError = toError(nextError);\n\t\t\terror.set(normalizedError);\n\t\t\terrorReport.set(toMotionGPUErrorReport(normalizedError, 'initialization'));\n\t\t} finally {\n\t\t\tif (!disposed && version === requestVersion) {\n\t\t\t\tloading.set(false);\n\t\t\t}\n\t\t\tif (activeController === controller) {\n\t\t\t\tactiveController = null;\n\t\t\t}\n\t\t\tmergedSignal.dispose();\n\t\t}\n\t};\n\n\tconst runLoadLoop = async (): Promise<void> => {\n\t\tdo {\n\t\t\treloadQueued = false;\n\t\t\tawait executeLoad();\n\t\t} while (reloadQueued && !disposed);\n\t};\n\n\tconst load = (): Promise<void> => {\n\t\tactiveController?.abort();\n\t\tif (runningLoad) {\n\t\t\treloadQueued = true;\n\t\t\treturn runningLoad;\n\t\t}\n\n\t\tconst pending = runLoadLoop();\n\t\tconst trackedPending = pending.finally(() => {\n\t\t\tif (runningLoad === trackedPending) {\n\t\t\t\trunningLoad = null;\n\t\t\t}\n\t\t});\n\t\trunningLoad = trackedPending;\n\t\treturn trackedPending;\n\t};\n\n\tvoid load();\n\n\tonBeforeUnmount(() => {\n\t\tdisposed = true;\n\t\trequestVersion += 1;\n\t\tactiveController?.abort();\n\t\tdisposeTextures(textures.current);\n\t});\n\n\treturn {\n\t\ttextures,\n\t\tloading,\n\t\terror,\n\t\terrorReport,\n\t\treload: load\n\t};\n}\n"],"mappings":"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"}

package/package.json

@@ -1,7 +1,7 @@
 {
 	"name": "@motion-core/motion-gpu",
-	"version": "0.7.0",
-	"description": "Framework-agnostic WebGPU runtime for fullscreen WGSL shaders with explicit Svelte and React adapter entrypoints.",
+	"version": "0.8.0",
+	"description": "Framework-agnostic WebGPU runtime for fullscreen WGSL shaders with explicit Svelte, React, and Vue adapter entrypoints.",
 	"keywords": [
 		"svelte",
 		"svelte5",
@@ -56,6 +56,14 @@
 			"types": "./dist/react/advanced.d.ts",
 			"default": "./dist/react/advanced.js"
 		},
+		"./vue": {
+			"types": "./dist/vue/index.d.ts",
+			"default": "./dist/vue/index.js"
+		},
+		"./vue/advanced": {
+			"types": "./dist/vue/advanced.d.ts",
+			"default": "./dist/vue/advanced.js"
+		},
 		"./core": {
 			"types": "./dist/core/index.d.ts",
 			"default": "./dist/core/index.js"
@@ -77,7 +85,7 @@
 		"build": "vite build --config ./vite.package.config.ts",
 		"build:watch": "vite build --watch --config ./vite.package.config.ts",
 		"prepack": "bun run build",
-		"check": "svelte-check --tsconfig ./tsconfig.json && publint",
+		"check": "svelte-check --tsconfig ./tsconfig.json && vue-tsc --project ./tsconfig.vue.json --noEmit && publint",
 		"test": "vitest run",
 		"test:coverage": "vitest run --coverage",
 		"test:watch": "vitest",
@@ -86,6 +94,7 @@
 		"e2e:serve": "vite --config e2e/vite.config.ts",
 		"e2e:serve:svelte": "MOTION_GPU_E2E_FRAMEWORK=svelte vite --config e2e/vite.config.ts",
 		"e2e:serve:react": "MOTION_GPU_E2E_FRAMEWORK=react vite --config e2e/vite.config.ts",
+		"e2e:serve:vue": "MOTION_GPU_E2E_FRAMEWORK=vue vite --config e2e/vite.config.ts",
 		"perf:core": "bun run ./scripts/perf/core-benchmark.ts",
 		"perf:core:check": "bun run ./scripts/perf/core-benchmark.ts --strict",
 		"perf:core:baseline": "bun run ./scripts/perf/core-benchmark.ts --update-baseline",
@@ -98,7 +107,8 @@
 	"peerDependencies": {
 		"react": "^18.0.0 || ^19.0.0",
 		"react-dom": "^18.0.0 || ^19.0.0",
-		"svelte": "^5.0.0"
+		"svelte": "^5.0.0",
+		"vue": "^3.5.0"
 	},
 	"peerDependenciesMeta": {
 		"react": {
@@ -109,6 +119,9 @@
 		},
 		"svelte": {
 			"optional": true
+		},
+		"vue": {
+			"optional": true
 		}
 	},
 	"dependencies": {
@@ -121,10 +134,13 @@
 		"@sveltejs/vite-plugin-svelte": "^7.0.0",
 		"@testing-library/react": "^16.3.0",
 		"@testing-library/svelte": "^5.2.8",
+		"@testing-library/vue": "^8.1.0",
+		"@types/node": "^25.3.3",
 		"@types/react": "^19.2.2",
 		"@types/react-dom": "^19.2.2",
+		"@vitejs/plugin-vue": "^6.0.1",
 		"@vitest/coverage-v8": "^4.0.18",
-		"@types/node": "^25.3.3",
+		"@vue/tsconfig": "^0.8.1",
 		"eslint": "^10.0.2",
 		"eslint-config-prettier": "^10.1.8",
 		"eslint-plugin-svelte": "^3.14.0",
@@ -137,11 +153,13 @@
 		"react": "^19.2.0",
 		"react-dom": "^19.2.0",
 		"svelte": "^5.51.0",
-		"svelte2tsx": "^0.7.51",
 		"svelte-check": "^4.3.6",
+		"svelte2tsx": "^0.7.51",
 		"typescript": "^5.9.3",
 		"typescript-eslint": "^8.54.0",
 		"vite": "^8.0.1",
-		"vitest": "^4.0.18"
+		"vitest": "^4.0.18",
+		"vue": "^3.5.13",
+		"vue-tsc": "^3.1.0"
 	}
 }