@motion-core/motion-gpu 0.3.0 → 0.4.0

package/dist/svelte/use-motiongpu-user-context.d.ts

@@ -17,6 +17,14 @@ export interface SetMotionGPUUserContextOptions {
      * @default 'skip'
      */
     existing?: 'merge' | 'replace' | 'skip';
+    /**
+     * How function inputs should be interpreted:
+     * - `factory`: call function and store its return value
+     * - `value`: store function itself
+     *
+     * @default 'factory'
+     */
+    functionValue?: 'factory' | 'value';
 }
 /**
  * Returns a read-only view of the entire motiongpu user context store.
@@ -25,7 +33,7 @@ export declare function useMotionGPUUserContext<UC extends UserContextStore = Us
 /**
  * Reads a namespaced user context value as a reactive readable store.
  */
-export declare function useMotionGPUUserContext<UCT = unknown>(namespace: MotionGPUUserNamespace): CurrentReadable<UCT | undefined>;
+export declare function useMotionGPUUserContext<UC extends UserContextStore = UserContextStore, K extends keyof UC & MotionGPUUserNamespace = keyof UC & MotionGPUUserNamespace>(namespace: K): CurrentReadable<UC[K] | undefined>;
 /**
  * Sets a namespaced user context value with explicit write semantics.
  *

package/dist/svelte/use-motiongpu-user-context.js

@@ -43,6 +43,7 @@ export function useMotionGPUUserContext(namespace) {
 export function setMotionGPUUserContext(namespace, value, options) {
     const userStore = useMotionGPU().user;
     const mode = options?.existing ?? 'skip';
+    const functionValueMode = options?.functionValue ?? 'factory';
     let resolvedValue;
     userStore.update((context) => {
         const hasExisting = namespace in context;
@@ -50,7 +51,9 @@ export function setMotionGPUUserContext(namespace, value, options) {
             resolvedValue = context[namespace];
             return context;
         }
-        const nextValue = typeof value === 'function' ? value() : value;
+        const nextValue = typeof value === 'function' && functionValueMode === 'factory'
+            ? value()
+            : value;
         if (hasExisting && mode === 'merge') {
             const currentValue = context[namespace];
             if (isObjectEntry(currentValue) && isObjectEntry(nextValue)) {

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

@@ -30,11 +30,15 @@ export interface UseTextureResult {
  * 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 options - Loader options passed to URL fetch/decode pipeline.
+ * @param optionsInput - Loader options object or lazy options provider.
  * @returns Reactive texture loading state with reload support.
  */
-export declare function useTexture(urlInput: TextureUrlInput, options?: TextureLoadOptions): UseTextureResult;
+export declare function useTexture(urlInput: TextureUrlInput, optionsInput?: TextureOptionsInput): UseTextureResult;

package/dist/svelte/use-texture.js

@@ -54,10 +54,10 @@ function mergeAbortSignals(primary, secondary) {
  * Loads textures from URLs and exposes reactive loading/error state.
  *
  * @param urlInput - URLs array or lazy URL provider.
- * @param options - Loader options passed to URL fetch/decode pipeline.
+ * @param optionsInput - Loader options object or lazy options provider.
  * @returns Reactive texture loading state with reload support.
  */
-export function useTexture(urlInput, options = {}) {
+export function useTexture(urlInput, optionsInput = {}) {
     const textures = currentWritable(null);
     const loading = currentWritable(true);
     const error = currentWritable(null);
@@ -68,6 +68,9 @@ export function useTexture(urlInput, options = {}) {
     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;
@@ -79,6 +82,7 @@ export function useTexture(urlInput, options = {}) {
         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(), {

package/package.json

@@ -1,10 +1,12 @@
 {
 	"name": "@motion-core/motion-gpu",
-	"version": "0.3.0",
-	"description": "Framework-agnostic WebGPU runtime for fullscreen WGSL shaders with explicit Svelte adapter entrypoints.",
+	"version": "0.4.0",
+	"description": "Framework-agnostic WebGPU runtime for fullscreen WGSL shaders with explicit Svelte and React adapter entrypoints.",
 	"keywords": [
 		"svelte",
 		"svelte5",
+		"react",
+		"react18",
 		"webgpu",
 		"wgsl",
 		"shader",
@@ -46,6 +48,14 @@
 			"svelte": "./dist/svelte/advanced.js",
 			"default": "./dist/svelte/advanced.js"
 		},
+		"./react": {
+			"types": "./dist/react/index.d.ts",
+			"default": "./dist/react/index.js"
+		},
+		"./react/advanced": {
+			"types": "./dist/react/advanced.d.ts",
+			"default": "./dist/react/advanced.js"
+		},
 		"./core": {
 			"types": "./dist/core/index.d.ts",
 			"default": "./dist/core/index.js"
@@ -59,7 +69,7 @@
 		"dist"
 	],
 	"scripts": {
-		"build": "svelte-package -i src/lib -o dist",
+		"build": "svelte-package -i src/lib -o dist && node ./scripts/build/transpile-react-tsx.mjs",
 		"prepack": "bun run build",
 		"check": "svelte-check --tsconfig ./tsconfig.json && publint",
 		"test": "vitest run",
@@ -68,6 +78,8 @@
 		"test:e2e": "playwright test",
 		"test:e2e:headed": "playwright test --headed",
 		"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",
 		"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",
@@ -78,9 +90,17 @@
 		"format": "prettier --write ."
 	},
 	"peerDependencies": {
+		"react": "^18.0.0 || ^19.0.0",
+		"react-dom": "^18.0.0 || ^19.0.0",
 		"svelte": "^5.0.0"
 	},
 	"peerDependenciesMeta": {
+		"react": {
+			"optional": true
+		},
+		"react-dom": {
+			"optional": true
+		},
 		"svelte": {
 			"optional": true
 		}
@@ -91,7 +111,10 @@
 		"@playwright/test": "^1.58.2",
 		"@sveltejs/package": "^2.5.0",
 		"@sveltejs/vite-plugin-svelte": "^6.2.4",
+		"@testing-library/react": "^16.3.0",
 		"@testing-library/svelte": "^5.2.8",
+		"@types/react": "^19.2.2",
+		"@types/react-dom": "^19.2.2",
 		"@vitest/coverage-v8": "^4.0.18",
 		"@types/node": "^25.3.3",
 		"@webgpu/types": "^0.1.66",
@@ -104,6 +127,8 @@
 		"prettier-plugin-svelte": "^3.4.1",
 		"prettier-plugin-tailwindcss": "^0.7.2",
 		"publint": "^0.3.15",
+		"react": "^19.2.0",
+		"react-dom": "^19.2.0",
 		"svelte": "^5.51.0",
 		"svelte-check": "^4.3.6",
 		"typescript": "^5.9.3",