react-shadertoy 0.1.0 → 0.2.0

package/dist/index.d.mts

@@ -1,9 +1,20 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { CSSProperties, RefObject } from 'react';
 
+/** Texture source: URL string for image loading */
+type TextureSource = string;
+/** Texture inputs mapped to Shadertoy channels */
+type TextureInputs = {
+    iChannel0?: TextureSource;
+    iChannel1?: TextureSource;
+    iChannel2?: TextureSource;
+    iChannel3?: TextureSource;
+};
 interface ShadertoyProps {
     /** Shadertoy-compatible GLSL fragment shader (must contain mainImage) */
     fragmentShader: string;
+    /** Texture inputs for iChannel0-3 */
+    textures?: TextureInputs;
     /** Container style */
     style?: CSSProperties;
     /** Container className */
@@ -23,6 +34,7 @@ interface ShadertoyProps {
 }
 interface UseShadertoyOptions {
     fragmentShader: string;
+    textures?: TextureInputs;
     paused?: boolean;
     speed?: number;
     pixelRatio?: number;
@@ -38,8 +50,8 @@ interface UseShadertoyReturn {
     resume: () => void;
 }
 
-declare function Shadertoy({ fragmentShader, style, className, paused, speed, pixelRatio, mouse, onError, onLoad, }: ShadertoyProps): react_jsx_runtime.JSX.Element;
+declare function Shadertoy({ fragmentShader, textures, style, className, paused, speed, pixelRatio, mouse, onError, onLoad, }: ShadertoyProps): react_jsx_runtime.JSX.Element;
 
-declare function useShadertoy({ fragmentShader, paused, speed, pixelRatio, mouse: mouseEnabled, onError, onLoad, }: UseShadertoyOptions): UseShadertoyReturn;
+declare function useShadertoy({ fragmentShader, textures: texturesProp, paused, speed, pixelRatio, mouse: mouseEnabled, onError, onLoad, }: UseShadertoyOptions): UseShadertoyReturn;
 
-export { Shadertoy, type ShadertoyProps, type UseShadertoyOptions, type UseShadertoyReturn, useShadertoy };
+export { Shadertoy, type ShadertoyProps, type TextureInputs, type UseShadertoyOptions, type UseShadertoyReturn, useShadertoy };

package/dist/index.d.ts

@@ -1,9 +1,20 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { CSSProperties, RefObject } from 'react';
 
+/** Texture source: URL string for image loading */
+type TextureSource = string;
+/** Texture inputs mapped to Shadertoy channels */
+type TextureInputs = {
+    iChannel0?: TextureSource;
+    iChannel1?: TextureSource;
+    iChannel2?: TextureSource;
+    iChannel3?: TextureSource;
+};
 interface ShadertoyProps {
     /** Shadertoy-compatible GLSL fragment shader (must contain mainImage) */
     fragmentShader: string;
+    /** Texture inputs for iChannel0-3 */
+    textures?: TextureInputs;
     /** Container style */
     style?: CSSProperties;
     /** Container className */
@@ -23,6 +34,7 @@ interface ShadertoyProps {
 }
 interface UseShadertoyOptions {
     fragmentShader: string;
+    textures?: TextureInputs;
     paused?: boolean;
     speed?: number;
     pixelRatio?: number;
@@ -38,8 +50,8 @@ interface UseShadertoyReturn {
     resume: () => void;
 }
 
-declare function Shadertoy({ fragmentShader, style, className, paused, speed, pixelRatio, mouse, onError, onLoad, }: ShadertoyProps): react_jsx_runtime.JSX.Element;
+declare function Shadertoy({ fragmentShader, textures, style, className, paused, speed, pixelRatio, mouse, onError, onLoad, }: ShadertoyProps): react_jsx_runtime.JSX.Element;
 
-declare function useShadertoy({ fragmentShader, paused, speed, pixelRatio, mouse: mouseEnabled, onError, onLoad, }: UseShadertoyOptions): UseShadertoyReturn;
+declare function useShadertoy({ fragmentShader, textures: texturesProp, paused, speed, pixelRatio, mouse: mouseEnabled, onError, onLoad, }: UseShadertoyOptions): UseShadertoyReturn;
 
-export { Shadertoy, type ShadertoyProps, type UseShadertoyOptions, type UseShadertoyReturn, useShadertoy };
+export { Shadertoy, type ShadertoyProps, type TextureInputs, type UseShadertoyOptions, type UseShadertoyReturn, useShadertoy };

package/dist/index.js

@@ -1,9 +1,32 @@
-'use strict';
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 
-var react = require('react');
-var jsxRuntime = require('react/jsx-runtime');
+// src/index.ts
+var index_exports = {};
+__export(index_exports, {
+  Shadertoy: () => Shadertoy,
+  useShadertoy: () => useShadertoy
+});
+module.exports = __toCommonJS(index_exports);
 
 // src/useShadertoy.ts
+var import_react = require("react");
 
 // src/renderer.ts
 var QUAD_VERTICES = new Float32Array([
@@ -35,6 +58,14 @@ uniform float iTimeDelta;
 uniform int   iFrame;
 uniform vec4  iMouse;
 uniform vec4  iDate;
+uniform sampler2D iChannel0;
+uniform sampler2D iChannel1;
+uniform sampler2D iChannel2;
+uniform sampler2D iChannel3;
+uniform vec3  iChannelResolution[4];
+
+// Shadertoy compatibility: texture() is GLSL 300 es, WebGL1 uses texture2D()
+#define texture texture2D
 
 ${shader}
 
@@ -90,13 +121,21 @@ function createRenderer(canvas, fragmentShader) {
     iTimeDelta: gl.getUniformLocation(program, "iTimeDelta"),
     iFrame: gl.getUniformLocation(program, "iFrame"),
     iMouse: gl.getUniformLocation(program, "iMouse"),
-    iDate: gl.getUniformLocation(program, "iDate")
+    iDate: gl.getUniformLocation(program, "iDate"),
+    iChannel: [
+      gl.getUniformLocation(program, "iChannel0"),
+      gl.getUniformLocation(program, "iChannel1"),
+      gl.getUniformLocation(program, "iChannel2"),
+      gl.getUniformLocation(program, "iChannel3")
+    ],
+    iChannelResolution: gl.getUniformLocation(program, "iChannelResolution")
   };
   gl.useProgram(program);
   return {
     gl,
     program,
     locations,
+    textures: [null, null, null, null],
     time: 0,
     frame: 0,
     lastTime: 0
@@ -113,6 +152,72 @@ function dispose(state) {
   gl.getExtension("WEBGL_lose_context")?.loseContext();
 }
 
+// src/textures.ts
+function loadImageTexture(gl, url, unit) {
+  const texture = gl.createTexture();
+  gl.activeTexture(gl.TEXTURE0 + unit);
+  gl.bindTexture(gl.TEXTURE_2D, texture);
+  gl.texImage2D(
+    gl.TEXTURE_2D,
+    0,
+    gl.RGBA,
+    1,
+    1,
+    0,
+    gl.RGBA,
+    gl.UNSIGNED_BYTE,
+    new Uint8Array([255, 0, 255, 255])
+  );
+  gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
+  gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
+  gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
+  gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
+  const state = { texture, width: 1, height: 1, unit, loaded: false };
+  const promise = new Promise((resolve, reject) => {
+    const img = new Image();
+    img.crossOrigin = "anonymous";
+    img.onload = () => {
+      if (gl.isContextLost()) {
+        resolve();
+        return;
+      }
+      gl.activeTexture(gl.TEXTURE0 + unit);
+      gl.bindTexture(gl.TEXTURE_2D, texture);
+      gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, img);
+      if (isPOT(img.width) && isPOT(img.height)) {
+        gl.generateMipmap(gl.TEXTURE_2D);
+        gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR_MIPMAP_LINEAR);
+      }
+      state.width = img.width;
+      state.height = img.height;
+      state.loaded = true;
+      resolve();
+    };
+    img.onerror = () => reject(new Error(`Failed to load texture: ${url}`));
+    img.src = url;
+  });
+  return { state, promise };
+}
+function bindTextures(gl, locations, textures) {
+  for (let i = 0; i < 4; i++) {
+    const tex = textures[i];
+    if (!tex) continue;
+    gl.activeTexture(gl.TEXTURE0 + tex.unit);
+    gl.bindTexture(gl.TEXTURE_2D, tex.texture);
+    if (locations[i]) {
+      gl.uniform1i(locations[i], tex.unit);
+    }
+  }
+}
+function disposeTextures(gl, textures) {
+  for (const tex of textures) {
+    if (tex) gl.deleteTexture(tex.texture);
+  }
+}
+function isPOT(v) {
+  return (v & v - 1) === 0 && v > 0;
+}
+
 // src/uniforms.ts
 function updateUniforms(state, delta, speed, mouse) {
   const { gl, locations } = state;
@@ -140,6 +245,18 @@ function updateUniforms(state, delta, speed, mouse) {
     const mw = mouse.pressed ? mouse.clickY : -Math.abs(mouse.clickY);
     gl.uniform4f(locations.iMouse, mouse.x, mouse.y, mz, mw);
   }
+  if (locations.iChannelResolution) {
+    const res = new Float32Array(12);
+    for (let i = 0; i < 4; i++) {
+      const tex = state.textures[i];
+      if (tex) {
+        res[i * 3] = tex.width;
+        res[i * 3 + 1] = tex.height;
+        res[i * 3 + 2] = 1;
+      }
+    }
+    gl.uniform3fv(locations.iChannelResolution, res);
+  }
   if (locations.iDate) {
     const now = /* @__PURE__ */ new Date();
     const seconds = now.getHours() * 3600 + now.getMinutes() * 60 + now.getSeconds() + now.getMilliseconds() / 1e3;
@@ -155,8 +272,10 @@ function updateUniforms(state, delta, speed, mouse) {
 }
 
 // src/useShadertoy.ts
+var CHANNEL_KEYS = ["iChannel0", "iChannel1", "iChannel2", "iChannel3"];
 function useShadertoy({
   fragmentShader,
+  textures: texturesProp,
   paused = false,
   speed = 1,
   pixelRatio,
@@ -164,14 +283,14 @@ function useShadertoy({
   onError,
   onLoad
 }) {
-  const canvasRef = react.useRef(null);
-  const rendererRef = react.useRef(null);
-  const rafRef = react.useRef(0);
-  const pausedRef = react.useRef(paused);
-  const speedRef = react.useRef(speed);
-  const [isReady, setIsReady] = react.useState(false);
-  const [error, setError] = react.useState(null);
-  const mouseState = react.useRef({
+  const canvasRef = (0, import_react.useRef)(null);
+  const rendererRef = (0, import_react.useRef)(null);
+  const rafRef = (0, import_react.useRef)(0);
+  const pausedRef = (0, import_react.useRef)(paused);
+  const speedRef = (0, import_react.useRef)(speed);
+  const [isReady, setIsReady] = (0, import_react.useState)(false);
+  const [error, setError] = (0, import_react.useState)(null);
+  const mouseState = (0, import_react.useRef)({
     x: 0,
     y: 0,
     clickX: 0,
@@ -180,7 +299,7 @@ function useShadertoy({
   });
   pausedRef.current = paused;
   speedRef.current = speed;
-  react.useEffect(() => {
+  (0, import_react.useEffect)(() => {
     const canvas = canvasRef.current;
     if (!canvas) return;
     const result = createRenderer(canvas, fragmentShader);
@@ -190,16 +309,42 @@ function useShadertoy({
       return;
     }
     rendererRef.current = result;
-    setIsReady(true);
-    setError(null);
-    onLoad?.();
+    const texturePromises = [];
+    if (texturesProp) {
+      for (let i = 0; i < 4; i++) {
+        const src = texturesProp[CHANNEL_KEYS[i]];
+        if (typeof src === "string") {
+          const { state, promise } = loadImageTexture(result.gl, src, i);
+          result.textures[i] = state;
+          texturePromises.push(promise);
+        }
+      }
+    }
+    const markReady = () => {
+      setIsReady(true);
+      setError(null);
+      onLoad?.();
+    };
+    if (texturePromises.length > 0) {
+      Promise.all(texturePromises).then(() => {
+        if (rendererRef.current) markReady();
+      }).catch((err) => {
+        const msg = err instanceof Error ? err.message : "Texture load failed";
+        setError(msg);
+        onError?.(msg);
+      });
+    } else {
+      markReady();
+    }
     let lastTimestamp = 0;
     const loop = (timestamp) => {
       const delta = lastTimestamp ? (timestamp - lastTimestamp) / 1e3 : 0;
       lastTimestamp = timestamp;
       if (!pausedRef.current && rendererRef.current) {
-        updateUniforms(rendererRef.current, delta, speedRef.current, mouseState.current);
-        render(rendererRef.current);
+        const r = rendererRef.current;
+        bindTextures(r.gl, r.locations.iChannel, r.textures);
+        updateUniforms(r, delta, speedRef.current, mouseState.current);
+        render(r);
       }
       rafRef.current = requestAnimationFrame(loop);
     };
@@ -207,13 +352,14 @@ function useShadertoy({
     return () => {
       cancelAnimationFrame(rafRef.current);
       if (rendererRef.current) {
+        disposeTextures(rendererRef.current.gl, rendererRef.current.textures);
         dispose(rendererRef.current);
         rendererRef.current = null;
       }
       setIsReady(false);
     };
-  }, [fragmentShader, onError, onLoad]);
-  react.useEffect(() => {
+  }, [fragmentShader, texturesProp, onError, onLoad]);
+  (0, import_react.useEffect)(() => {
     const canvas = canvasRef.current;
     if (!canvas) return;
     const dpr = pixelRatio ?? (typeof window !== "undefined" ? window.devicePixelRatio : 1);
@@ -227,7 +373,7 @@ function useShadertoy({
     observer.observe(canvas);
     return () => observer.disconnect();
   }, [pixelRatio]);
-  react.useEffect(() => {
+  (0, import_react.useEffect)(() => {
     if (!mouseEnabled) return;
     const canvas = canvasRef.current;
     if (!canvas) return;
@@ -282,16 +428,20 @@ function useShadertoy({
       window.removeEventListener("touchend", te);
     };
   }, [mouseEnabled, pixelRatio]);
-  const pause = react.useCallback(() => {
+  const pause = (0, import_react.useCallback)(() => {
     pausedRef.current = true;
   }, []);
-  const resume = react.useCallback(() => {
+  const resume = (0, import_react.useCallback)(() => {
     pausedRef.current = false;
   }, []);
   return { canvasRef, isReady, error, pause, resume };
 }
+
+// src/Shadertoy.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
 function Shadertoy({
   fragmentShader,
+  textures,
   style,
   className,
   paused,
@@ -303,6 +453,7 @@ function Shadertoy({
 }) {
   const { canvasRef } = useShadertoy({
     fragmentShader,
+    textures,
     paused,
     speed,
     pixelRatio,
@@ -310,7 +461,7 @@ function Shadertoy({
     onError,
     onLoad
   });
-  return /* @__PURE__ */ jsxRuntime.jsx(
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
     "canvas",
     {
       ref: canvasRef,
@@ -319,8 +470,8 @@ function Shadertoy({
     }
   );
 }
-
-exports.Shadertoy = Shadertoy;
-exports.useShadertoy = useShadertoy;
-//# sourceMappingURL=index.js.map
-//# sourceMappingURL=index.js.map
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Shadertoy,
+  useShadertoy
+});

package/dist/index.mjs

@@ -1,7 +1,5 @@
-import { useRef, useState, useEffect, useCallback } from 'react';
-import { jsx } from 'react/jsx-runtime';
-
 // src/useShadertoy.ts
+import { useCallback, useEffect, useRef, useState } from "react";
 
 // src/renderer.ts
 var QUAD_VERTICES = new Float32Array([
@@ -33,6 +31,14 @@ uniform float iTimeDelta;
 uniform int   iFrame;
 uniform vec4  iMouse;
 uniform vec4  iDate;
+uniform sampler2D iChannel0;
+uniform sampler2D iChannel1;
+uniform sampler2D iChannel2;
+uniform sampler2D iChannel3;
+uniform vec3  iChannelResolution[4];
+
+// Shadertoy compatibility: texture() is GLSL 300 es, WebGL1 uses texture2D()
+#define texture texture2D
 
 ${shader}
 
@@ -88,13 +94,21 @@ function createRenderer(canvas, fragmentShader) {
     iTimeDelta: gl.getUniformLocation(program, "iTimeDelta"),
     iFrame: gl.getUniformLocation(program, "iFrame"),
     iMouse: gl.getUniformLocation(program, "iMouse"),
-    iDate: gl.getUniformLocation(program, "iDate")
+    iDate: gl.getUniformLocation(program, "iDate"),
+    iChannel: [
+      gl.getUniformLocation(program, "iChannel0"),
+      gl.getUniformLocation(program, "iChannel1"),
+      gl.getUniformLocation(program, "iChannel2"),
+      gl.getUniformLocation(program, "iChannel3")
+    ],
+    iChannelResolution: gl.getUniformLocation(program, "iChannelResolution")
   };
   gl.useProgram(program);
   return {
     gl,
     program,
     locations,
+    textures: [null, null, null, null],
     time: 0,
     frame: 0,
     lastTime: 0
@@ -111,6 +125,72 @@ function dispose(state) {
   gl.getExtension("WEBGL_lose_context")?.loseContext();
 }
 
+// src/textures.ts
+function loadImageTexture(gl, url, unit) {
+  const texture = gl.createTexture();
+  gl.activeTexture(gl.TEXTURE0 + unit);
+  gl.bindTexture(gl.TEXTURE_2D, texture);
+  gl.texImage2D(
+    gl.TEXTURE_2D,
+    0,
+    gl.RGBA,
+    1,
+    1,
+    0,
+    gl.RGBA,
+    gl.UNSIGNED_BYTE,
+    new Uint8Array([255, 0, 255, 255])
+  );
+  gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
+  gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
+  gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
+  gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
+  const state = { texture, width: 1, height: 1, unit, loaded: false };
+  const promise = new Promise((resolve, reject) => {
+    const img = new Image();
+    img.crossOrigin = "anonymous";
+    img.onload = () => {
+      if (gl.isContextLost()) {
+        resolve();
+        return;
+      }
+      gl.activeTexture(gl.TEXTURE0 + unit);
+      gl.bindTexture(gl.TEXTURE_2D, texture);
+      gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, img);
+      if (isPOT(img.width) && isPOT(img.height)) {
+        gl.generateMipmap(gl.TEXTURE_2D);
+        gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR_MIPMAP_LINEAR);
+      }
+      state.width = img.width;
+      state.height = img.height;
+      state.loaded = true;
+      resolve();
+    };
+    img.onerror = () => reject(new Error(`Failed to load texture: ${url}`));
+    img.src = url;
+  });
+  return { state, promise };
+}
+function bindTextures(gl, locations, textures) {
+  for (let i = 0; i < 4; i++) {
+    const tex = textures[i];
+    if (!tex) continue;
+    gl.activeTexture(gl.TEXTURE0 + tex.unit);
+    gl.bindTexture(gl.TEXTURE_2D, tex.texture);
+    if (locations[i]) {
+      gl.uniform1i(locations[i], tex.unit);
+    }
+  }
+}
+function disposeTextures(gl, textures) {
+  for (const tex of textures) {
+    if (tex) gl.deleteTexture(tex.texture);
+  }
+}
+function isPOT(v) {
+  return (v & v - 1) === 0 && v > 0;
+}
+
 // src/uniforms.ts
 function updateUniforms(state, delta, speed, mouse) {
   const { gl, locations } = state;
@@ -138,6 +218,18 @@ function updateUniforms(state, delta, speed, mouse) {
     const mw = mouse.pressed ? mouse.clickY : -Math.abs(mouse.clickY);
     gl.uniform4f(locations.iMouse, mouse.x, mouse.y, mz, mw);
   }
+  if (locations.iChannelResolution) {
+    const res = new Float32Array(12);
+    for (let i = 0; i < 4; i++) {
+      const tex = state.textures[i];
+      if (tex) {
+        res[i * 3] = tex.width;
+        res[i * 3 + 1] = tex.height;
+        res[i * 3 + 2] = 1;
+      }
+    }
+    gl.uniform3fv(locations.iChannelResolution, res);
+  }
   if (locations.iDate) {
     const now = /* @__PURE__ */ new Date();
     const seconds = now.getHours() * 3600 + now.getMinutes() * 60 + now.getSeconds() + now.getMilliseconds() / 1e3;
@@ -153,8 +245,10 @@ function updateUniforms(state, delta, speed, mouse) {
 }
 
 // src/useShadertoy.ts
+var CHANNEL_KEYS = ["iChannel0", "iChannel1", "iChannel2", "iChannel3"];
 function useShadertoy({
   fragmentShader,
+  textures: texturesProp,
   paused = false,
   speed = 1,
   pixelRatio,
@@ -188,16 +282,42 @@ function useShadertoy({
       return;
     }
     rendererRef.current = result;
-    setIsReady(true);
-    setError(null);
-    onLoad?.();
+    const texturePromises = [];
+    if (texturesProp) {
+      for (let i = 0; i < 4; i++) {
+        const src = texturesProp[CHANNEL_KEYS[i]];
+        if (typeof src === "string") {
+          const { state, promise } = loadImageTexture(result.gl, src, i);
+          result.textures[i] = state;
+          texturePromises.push(promise);
+        }
+      }
+    }
+    const markReady = () => {
+      setIsReady(true);
+      setError(null);
+      onLoad?.();
+    };
+    if (texturePromises.length > 0) {
+      Promise.all(texturePromises).then(() => {
+        if (rendererRef.current) markReady();
+      }).catch((err) => {
+        const msg = err instanceof Error ? err.message : "Texture load failed";
+        setError(msg);
+        onError?.(msg);
+      });
+    } else {
+      markReady();
+    }
     let lastTimestamp = 0;
     const loop = (timestamp) => {
       const delta = lastTimestamp ? (timestamp - lastTimestamp) / 1e3 : 0;
       lastTimestamp = timestamp;
       if (!pausedRef.current && rendererRef.current) {
-        updateUniforms(rendererRef.current, delta, speedRef.current, mouseState.current);
-        render(rendererRef.current);
+        const r = rendererRef.current;
+        bindTextures(r.gl, r.locations.iChannel, r.textures);
+        updateUniforms(r, delta, speedRef.current, mouseState.current);
+        render(r);
       }
       rafRef.current = requestAnimationFrame(loop);
     };
@@ -205,12 +325,13 @@ function useShadertoy({
     return () => {
       cancelAnimationFrame(rafRef.current);
       if (rendererRef.current) {
+        disposeTextures(rendererRef.current.gl, rendererRef.current.textures);
         dispose(rendererRef.current);
         rendererRef.current = null;
       }
       setIsReady(false);
     };
-  }, [fragmentShader, onError, onLoad]);
+  }, [fragmentShader, texturesProp, onError, onLoad]);
   useEffect(() => {
     const canvas = canvasRef.current;
     if (!canvas) return;
@@ -288,8 +409,12 @@ function useShadertoy({
   }, []);
   return { canvasRef, isReady, error, pause, resume };
 }
+
+// src/Shadertoy.tsx
+import { jsx } from "react/jsx-runtime";
 function Shadertoy({
   fragmentShader,
+  textures,
   style,
   className,
   paused,
@@ -301,6 +426,7 @@ function Shadertoy({
 }) {
   const { canvasRef } = useShadertoy({
     fragmentShader,
+    textures,
     paused,
     speed,
     pixelRatio,
@@ -317,7 +443,7 @@ function Shadertoy({
     }
   );
 }
-
-export { Shadertoy, useShadertoy };
-//# sourceMappingURL=index.mjs.map
-//# sourceMappingURL=index.mjs.map
+export {
+  Shadertoy,
+  useShadertoy
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-shadertoy",
-  "version": "0.1.0",
+  "version": "0.2.0",
   "description": "Run Shadertoy GLSL shaders in React. Copy-paste and it works.",
   "author": "Wrennly (https://github.com/wrennly)",
   "license": "MIT",

package/dist/index.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/renderer.ts","../src/uniforms.ts","../src/useShadertoy.ts","../src/Shadertoy.tsx"],"names":["useRef","useState","useEffect","useCallback","jsx"],"mappings":"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","file":"index.js","sourcesContent":["import type { RendererState, UniformLocations } from './types'\n\n// Full-screen quad: two triangles covering clip space\nconst QUAD_VERTICES = new Float32Array([\n  -1, -1,\n   1, -1,\n  -1,  1,\n  -1,  1,\n   1, -1,\n   1,  1,\n])\n\nconst VERTEX_SHADER = `\nattribute vec2 position;\nvoid main() {\n  gl_Position = vec4(position, 0.0, 1.0);\n}\n`\n\n/**\n * Wrap Shadertoy GLSL: prepend uniform declarations + main() bridge.\n */\nfunction wrapFragmentShader(shader: string): string {\n  return `precision highp float;\n\nuniform vec3  iResolution;\nuniform float iTime;\nuniform float iTimeDelta;\nuniform int   iFrame;\nuniform vec4  iMouse;\nuniform vec4  iDate;\n\n${shader}\n\nvoid main() {\n  mainImage(gl_FragColor, gl_FragCoord.xy);\n}\n`\n}\n\nfunction compileShader(\n  gl: WebGLRenderingContext,\n  type: number,\n  source: string,\n): WebGLShader | string {\n  const shader = gl.createShader(type)\n  if (!shader) return 'Failed to create shader'\n\n  gl.shaderSource(shader, source)\n  gl.compileShader(shader)\n\n  if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {\n    const log = gl.getShaderInfoLog(shader) || 'Unknown compile error'\n    gl.deleteShader(shader)\n    return log\n  }\n\n  return shader\n}\n\n/**\n * Initialize WebGL: compile shaders, link program, setup quad.\n * Returns RendererState on success or error string on failure.\n */\nexport function createRenderer(\n  canvas: HTMLCanvasElement,\n  fragmentShader: string,\n): RendererState | string {\n  const gl = canvas.getContext('webgl', {\n    antialias: false,\n    alpha: true,\n    premultipliedAlpha: false,\n  })\n  if (!gl) return 'WebGL not supported'\n\n  // Compile vertex shader\n  const vert = compileShader(gl, gl.VERTEX_SHADER, VERTEX_SHADER)\n  if (typeof vert === 'string') return vert\n\n  // Compile fragment shader (wrapped)\n  const frag = compileShader(gl, gl.FRAGMENT_SHADER, wrapFragmentShader(fragmentShader))\n  if (typeof frag === 'string') return frag\n\n  // Link program\n  const program = gl.createProgram()\n  if (!program) return 'Failed to create program'\n\n  gl.attachShader(program, vert)\n  gl.attachShader(program, frag)\n  gl.linkProgram(program)\n\n  if (!gl.getProgramParameter(program, gl.LINK_STATUS)) {\n    const log = gl.getProgramInfoLog(program) || 'Unknown link error'\n    gl.deleteProgram(program)\n    return log\n  }\n\n  // Clean up individual shaders (attached to program)\n  gl.deleteShader(vert)\n  gl.deleteShader(frag)\n\n  // Setup quad geometry\n  const buffer = gl.createBuffer()\n  gl.bindBuffer(gl.ARRAY_BUFFER, buffer)\n  gl.bufferData(gl.ARRAY_BUFFER, QUAD_VERTICES, gl.STATIC_DRAW)\n\n  const positionLoc = gl.getAttribLocation(program, 'position')\n  gl.enableVertexAttribArray(positionLoc)\n  gl.vertexAttribPointer(positionLoc, 2, gl.FLOAT, false, 0, 0)\n\n  // Get uniform locations\n  const locations: UniformLocations = {\n    iResolution: gl.getUniformLocation(program, 'iResolution'),\n    iTime: gl.getUniformLocation(program, 'iTime'),\n    iTimeDelta: gl.getUniformLocation(program, 'iTimeDelta'),\n    iFrame: gl.getUniformLocation(program, 'iFrame'),\n    iMouse: gl.getUniformLocation(program, 'iMouse'),\n    iDate: gl.getUniformLocation(program, 'iDate'),\n  }\n\n  gl.useProgram(program)\n\n  return {\n    gl,\n    program,\n    locations,\n    time: 0,\n    frame: 0,\n    lastTime: 0,\n  }\n}\n\n/**\n * Render one frame.\n */\nexport function render(state: RendererState): void {\n  const { gl } = state\n  gl.viewport(0, 0, gl.drawingBufferWidth, gl.drawingBufferHeight)\n  gl.drawArrays(gl.TRIANGLES, 0, 6)\n}\n\n/**\n * Clean up WebGL resources.\n */\nexport function dispose(state: RendererState): void {\n  const { gl, program } = state\n  gl.deleteProgram(program)\n  gl.getExtension('WEBGL_lose_context')?.loseContext()\n}\n","import type { MouseState, RendererState } from './types'\n\n/**\n * Update all Shadertoy standard uniforms for one frame.\n */\nexport function updateUniforms(\n  state: RendererState,\n  delta: number,\n  speed: number,\n  mouse: MouseState,\n): void {\n  const { gl, locations } = state\n\n  // iTime\n  state.time += delta * speed\n  if (locations.iTime) {\n    gl.uniform1f(locations.iTime, state.time)\n  }\n\n  // iTimeDelta\n  if (locations.iTimeDelta) {\n    gl.uniform1f(locations.iTimeDelta, delta)\n  }\n\n  // iFrame\n  state.frame++\n  if (locations.iFrame) {\n    gl.uniform1i(locations.iFrame, state.frame)\n  }\n\n  // iResolution\n  if (locations.iResolution) {\n    gl.uniform3f(\n      locations.iResolution,\n      gl.drawingBufferWidth,\n      gl.drawingBufferHeight,\n      1.0,\n    )\n  }\n\n  // iMouse — Shadertoy convention:\n  //   xy: current position (if pressed)\n  //   zw: click position (positive when pressed, negative when released)\n  if (locations.iMouse) {\n    const mz = mouse.pressed ? mouse.clickX : -Math.abs(mouse.clickX)\n    const mw = mouse.pressed ? mouse.clickY : -Math.abs(mouse.clickY)\n    gl.uniform4f(locations.iMouse, mouse.x, mouse.y, mz, mw)\n  }\n\n  // iDate — vec4(year, month, day, seconds_since_midnight)\n  if (locations.iDate) {\n    const now = new Date()\n    const seconds =\n      now.getHours() * 3600 + now.getMinutes() * 60 + now.getSeconds() + now.getMilliseconds() / 1000\n    gl.uniform4f(\n      locations.iDate,\n      now.getFullYear(),\n      now.getMonth(), // 0-based, matches Shadertoy\n      now.getDate(),\n      seconds,\n    )\n  }\n}\n","import { useCallback, useEffect, useRef, useState } from 'react'\nimport { createRenderer, dispose, render } from './renderer'\nimport type { MouseState, RendererState, UseShadertoyOptions, UseShadertoyReturn } from './types'\nimport { updateUniforms } from './uniforms'\n\nexport function useShadertoy({\n  fragmentShader,\n  paused = false,\n  speed = 1.0,\n  pixelRatio,\n  mouse: mouseEnabled = true,\n  onError,\n  onLoad,\n}: UseShadertoyOptions): UseShadertoyReturn {\n  const canvasRef = useRef<HTMLCanvasElement | null>(null)\n  const rendererRef = useRef<RendererState | null>(null)\n  const rafRef = useRef<number>(0)\n  const pausedRef = useRef(paused)\n  const speedRef = useRef(speed)\n\n  const [isReady, setIsReady] = useState(false)\n  const [error, setError] = useState<string | null>(null)\n\n  const mouseState = useRef<MouseState>({\n    x: 0, y: 0,\n    clickX: 0, clickY: 0,\n    pressed: false,\n  })\n\n  // Keep refs in sync\n  pausedRef.current = paused\n  speedRef.current = speed\n\n  // Initialize WebGL\n  useEffect(() => {\n    const canvas = canvasRef.current\n    if (!canvas) return\n\n    const result = createRenderer(canvas, fragmentShader)\n    if (typeof result === 'string') {\n      setError(result)\n      onError?.(result)\n      return\n    }\n\n    rendererRef.current = result\n    setIsReady(true)\n    setError(null)\n    onLoad?.()\n\n    // Render loop\n    let lastTimestamp = 0\n\n    const loop = (timestamp: number) => {\n      const delta = lastTimestamp ? (timestamp - lastTimestamp) / 1000 : 0\n      lastTimestamp = timestamp\n\n      if (!pausedRef.current && rendererRef.current) {\n        updateUniforms(rendererRef.current, delta, speedRef.current, mouseState.current)\n        render(rendererRef.current)\n      }\n\n      rafRef.current = requestAnimationFrame(loop)\n    }\n\n    rafRef.current = requestAnimationFrame(loop)\n\n    return () => {\n      cancelAnimationFrame(rafRef.current)\n      if (rendererRef.current) {\n        dispose(rendererRef.current)\n        rendererRef.current = null\n      }\n      setIsReady(false)\n    }\n  }, [fragmentShader, onError, onLoad])\n\n  // Canvas resize\n  useEffect(() => {\n    const canvas = canvasRef.current\n    if (!canvas) return\n\n    const dpr = pixelRatio ?? (typeof window !== 'undefined' ? window.devicePixelRatio : 1)\n\n    const observer = new ResizeObserver((entries) => {\n      for (const entry of entries) {\n        const { width, height } = entry.contentRect\n        canvas.width = Math.round(width * dpr)\n        canvas.height = Math.round(height * dpr)\n      }\n    })\n\n    observer.observe(canvas)\n    return () => observer.disconnect()\n  }, [pixelRatio])\n\n  // Mouse / touch events\n  useEffect(() => {\n    if (!mouseEnabled) return\n    const canvas = canvasRef.current\n    if (!canvas) return\n\n    const toPixel = (cx: number, cy: number) => {\n      const r = canvas.getBoundingClientRect()\n      const dpr = pixelRatio ?? window.devicePixelRatio\n      return {\n        x: (cx - r.left) * dpr,\n        y: (r.height - (cy - r.top)) * dpr, // flip Y\n      }\n    }\n\n    const onMove = (cx: number, cy: number) => {\n      if (!mouseState.current.pressed) return\n      const { x, y } = toPixel(cx, cy)\n      mouseState.current.x = x\n      mouseState.current.y = y\n    }\n\n    const onDown = (cx: number, cy: number) => {\n      const { x, y } = toPixel(cx, cy)\n      mouseState.current.x = x\n      mouseState.current.y = y\n      mouseState.current.clickX = x\n      mouseState.current.clickY = y\n      mouseState.current.pressed = true\n    }\n\n    const onUp = () => {\n      mouseState.current.pressed = false\n    }\n\n    const mm = (e: MouseEvent) => onMove(e.clientX, e.clientY)\n    const md = (e: MouseEvent) => onDown(e.clientX, e.clientY)\n    const mu = () => onUp()\n    const tm = (e: TouchEvent) => {\n      if (e.touches[0]) onMove(e.touches[0].clientX, e.touches[0].clientY)\n    }\n    const ts = (e: TouchEvent) => {\n      if (e.touches[0]) onDown(e.touches[0].clientX, e.touches[0].clientY)\n    }\n    const te = () => onUp()\n\n    window.addEventListener('mousemove', mm)\n    canvas.addEventListener('mousedown', md)\n    window.addEventListener('mouseup', mu)\n    window.addEventListener('touchmove', tm, { passive: true })\n    canvas.addEventListener('touchstart', ts, { passive: true })\n    window.addEventListener('touchend', te)\n\n    return () => {\n      window.removeEventListener('mousemove', mm)\n      canvas.removeEventListener('mousedown', md)\n      window.removeEventListener('mouseup', mu)\n      window.removeEventListener('touchmove', tm)\n      canvas.removeEventListener('touchstart', ts)\n      window.removeEventListener('touchend', te)\n    }\n  }, [mouseEnabled, pixelRatio])\n\n  const pause = useCallback(() => { pausedRef.current = true }, [])\n  const resume = useCallback(() => { pausedRef.current = false }, [])\n\n  return { canvasRef, isReady, error, pause, resume }\n}\n","import type { ShadertoyProps } from './types'\nimport { useShadertoy } from './useShadertoy'\n\nexport function Shadertoy({\n  fragmentShader,\n  style,\n  className,\n  paused,\n  speed,\n  pixelRatio,\n  mouse,\n  onError,\n  onLoad,\n}: ShadertoyProps) {\n  const { canvasRef } = useShadertoy({\n    fragmentShader,\n    paused,\n    speed,\n    pixelRatio,\n    mouse,\n    onError,\n    onLoad,\n  })\n\n  return (\n    <canvas\n      ref={canvasRef}\n      className={className}\n      style={{ width: '100%', height: '100%', display: 'block', ...style }}\n    />\n  )\n}\n"]}

package/dist/index.mjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/renderer.ts","../src/uniforms.ts","../src/useShadertoy.ts","../src/Shadertoy.tsx"],"names":[],"mappings":"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","file":"index.mjs","sourcesContent":["import type { RendererState, UniformLocations } from './types'\n\n// Full-screen quad: two triangles covering clip space\nconst QUAD_VERTICES = new Float32Array([\n  -1, -1,\n   1, -1,\n  -1,  1,\n  -1,  1,\n   1, -1,\n   1,  1,\n])\n\nconst VERTEX_SHADER = `\nattribute vec2 position;\nvoid main() {\n  gl_Position = vec4(position, 0.0, 1.0);\n}\n`\n\n/**\n * Wrap Shadertoy GLSL: prepend uniform declarations + main() bridge.\n */\nfunction wrapFragmentShader(shader: string): string {\n  return `precision highp float;\n\nuniform vec3  iResolution;\nuniform float iTime;\nuniform float iTimeDelta;\nuniform int   iFrame;\nuniform vec4  iMouse;\nuniform vec4  iDate;\n\n${shader}\n\nvoid main() {\n  mainImage(gl_FragColor, gl_FragCoord.xy);\n}\n`\n}\n\nfunction compileShader(\n  gl: WebGLRenderingContext,\n  type: number,\n  source: string,\n): WebGLShader | string {\n  const shader = gl.createShader(type)\n  if (!shader) return 'Failed to create shader'\n\n  gl.shaderSource(shader, source)\n  gl.compileShader(shader)\n\n  if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {\n    const log = gl.getShaderInfoLog(shader) || 'Unknown compile error'\n    gl.deleteShader(shader)\n    return log\n  }\n\n  return shader\n}\n\n/**\n * Initialize WebGL: compile shaders, link program, setup quad.\n * Returns RendererState on success or error string on failure.\n */\nexport function createRenderer(\n  canvas: HTMLCanvasElement,\n  fragmentShader: string,\n): RendererState | string {\n  const gl = canvas.getContext('webgl', {\n    antialias: false,\n    alpha: true,\n    premultipliedAlpha: false,\n  })\n  if (!gl) return 'WebGL not supported'\n\n  // Compile vertex shader\n  const vert = compileShader(gl, gl.VERTEX_SHADER, VERTEX_SHADER)\n  if (typeof vert === 'string') return vert\n\n  // Compile fragment shader (wrapped)\n  const frag = compileShader(gl, gl.FRAGMENT_SHADER, wrapFragmentShader(fragmentShader))\n  if (typeof frag === 'string') return frag\n\n  // Link program\n  const program = gl.createProgram()\n  if (!program) return 'Failed to create program'\n\n  gl.attachShader(program, vert)\n  gl.attachShader(program, frag)\n  gl.linkProgram(program)\n\n  if (!gl.getProgramParameter(program, gl.LINK_STATUS)) {\n    const log = gl.getProgramInfoLog(program) || 'Unknown link error'\n    gl.deleteProgram(program)\n    return log\n  }\n\n  // Clean up individual shaders (attached to program)\n  gl.deleteShader(vert)\n  gl.deleteShader(frag)\n\n  // Setup quad geometry\n  const buffer = gl.createBuffer()\n  gl.bindBuffer(gl.ARRAY_BUFFER, buffer)\n  gl.bufferData(gl.ARRAY_BUFFER, QUAD_VERTICES, gl.STATIC_DRAW)\n\n  const positionLoc = gl.getAttribLocation(program, 'position')\n  gl.enableVertexAttribArray(positionLoc)\n  gl.vertexAttribPointer(positionLoc, 2, gl.FLOAT, false, 0, 0)\n\n  // Get uniform locations\n  const locations: UniformLocations = {\n    iResolution: gl.getUniformLocation(program, 'iResolution'),\n    iTime: gl.getUniformLocation(program, 'iTime'),\n    iTimeDelta: gl.getUniformLocation(program, 'iTimeDelta'),\n    iFrame: gl.getUniformLocation(program, 'iFrame'),\n    iMouse: gl.getUniformLocation(program, 'iMouse'),\n    iDate: gl.getUniformLocation(program, 'iDate'),\n  }\n\n  gl.useProgram(program)\n\n  return {\n    gl,\n    program,\n    locations,\n    time: 0,\n    frame: 0,\n    lastTime: 0,\n  }\n}\n\n/**\n * Render one frame.\n */\nexport function render(state: RendererState): void {\n  const { gl } = state\n  gl.viewport(0, 0, gl.drawingBufferWidth, gl.drawingBufferHeight)\n  gl.drawArrays(gl.TRIANGLES, 0, 6)\n}\n\n/**\n * Clean up WebGL resources.\n */\nexport function dispose(state: RendererState): void {\n  const { gl, program } = state\n  gl.deleteProgram(program)\n  gl.getExtension('WEBGL_lose_context')?.loseContext()\n}\n","import type { MouseState, RendererState } from './types'\n\n/**\n * Update all Shadertoy standard uniforms for one frame.\n */\nexport function updateUniforms(\n  state: RendererState,\n  delta: number,\n  speed: number,\n  mouse: MouseState,\n): void {\n  const { gl, locations } = state\n\n  // iTime\n  state.time += delta * speed\n  if (locations.iTime) {\n    gl.uniform1f(locations.iTime, state.time)\n  }\n\n  // iTimeDelta\n  if (locations.iTimeDelta) {\n    gl.uniform1f(locations.iTimeDelta, delta)\n  }\n\n  // iFrame\n  state.frame++\n  if (locations.iFrame) {\n    gl.uniform1i(locations.iFrame, state.frame)\n  }\n\n  // iResolution\n  if (locations.iResolution) {\n    gl.uniform3f(\n      locations.iResolution,\n      gl.drawingBufferWidth,\n      gl.drawingBufferHeight,\n      1.0,\n    )\n  }\n\n  // iMouse — Shadertoy convention:\n  //   xy: current position (if pressed)\n  //   zw: click position (positive when pressed, negative when released)\n  if (locations.iMouse) {\n    const mz = mouse.pressed ? mouse.clickX : -Math.abs(mouse.clickX)\n    const mw = mouse.pressed ? mouse.clickY : -Math.abs(mouse.clickY)\n    gl.uniform4f(locations.iMouse, mouse.x, mouse.y, mz, mw)\n  }\n\n  // iDate — vec4(year, month, day, seconds_since_midnight)\n  if (locations.iDate) {\n    const now = new Date()\n    const seconds =\n      now.getHours() * 3600 + now.getMinutes() * 60 + now.getSeconds() + now.getMilliseconds() / 1000\n    gl.uniform4f(\n      locations.iDate,\n      now.getFullYear(),\n      now.getMonth(), // 0-based, matches Shadertoy\n      now.getDate(),\n      seconds,\n    )\n  }\n}\n","import { useCallback, useEffect, useRef, useState } from 'react'\nimport { createRenderer, dispose, render } from './renderer'\nimport type { MouseState, RendererState, UseShadertoyOptions, UseShadertoyReturn } from './types'\nimport { updateUniforms } from './uniforms'\n\nexport function useShadertoy({\n  fragmentShader,\n  paused = false,\n  speed = 1.0,\n  pixelRatio,\n  mouse: mouseEnabled = true,\n  onError,\n  onLoad,\n}: UseShadertoyOptions): UseShadertoyReturn {\n  const canvasRef = useRef<HTMLCanvasElement | null>(null)\n  const rendererRef = useRef<RendererState | null>(null)\n  const rafRef = useRef<number>(0)\n  const pausedRef = useRef(paused)\n  const speedRef = useRef(speed)\n\n  const [isReady, setIsReady] = useState(false)\n  const [error, setError] = useState<string | null>(null)\n\n  const mouseState = useRef<MouseState>({\n    x: 0, y: 0,\n    clickX: 0, clickY: 0,\n    pressed: false,\n  })\n\n  // Keep refs in sync\n  pausedRef.current = paused\n  speedRef.current = speed\n\n  // Initialize WebGL\n  useEffect(() => {\n    const canvas = canvasRef.current\n    if (!canvas) return\n\n    const result = createRenderer(canvas, fragmentShader)\n    if (typeof result === 'string') {\n      setError(result)\n      onError?.(result)\n      return\n    }\n\n    rendererRef.current = result\n    setIsReady(true)\n    setError(null)\n    onLoad?.()\n\n    // Render loop\n    let lastTimestamp = 0\n\n    const loop = (timestamp: number) => {\n      const delta = lastTimestamp ? (timestamp - lastTimestamp) / 1000 : 0\n      lastTimestamp = timestamp\n\n      if (!pausedRef.current && rendererRef.current) {\n        updateUniforms(rendererRef.current, delta, speedRef.current, mouseState.current)\n        render(rendererRef.current)\n      }\n\n      rafRef.current = requestAnimationFrame(loop)\n    }\n\n    rafRef.current = requestAnimationFrame(loop)\n\n    return () => {\n      cancelAnimationFrame(rafRef.current)\n      if (rendererRef.current) {\n        dispose(rendererRef.current)\n        rendererRef.current = null\n      }\n      setIsReady(false)\n    }\n  }, [fragmentShader, onError, onLoad])\n\n  // Canvas resize\n  useEffect(() => {\n    const canvas = canvasRef.current\n    if (!canvas) return\n\n    const dpr = pixelRatio ?? (typeof window !== 'undefined' ? window.devicePixelRatio : 1)\n\n    const observer = new ResizeObserver((entries) => {\n      for (const entry of entries) {\n        const { width, height } = entry.contentRect\n        canvas.width = Math.round(width * dpr)\n        canvas.height = Math.round(height * dpr)\n      }\n    })\n\n    observer.observe(canvas)\n    return () => observer.disconnect()\n  }, [pixelRatio])\n\n  // Mouse / touch events\n  useEffect(() => {\n    if (!mouseEnabled) return\n    const canvas = canvasRef.current\n    if (!canvas) return\n\n    const toPixel = (cx: number, cy: number) => {\n      const r = canvas.getBoundingClientRect()\n      const dpr = pixelRatio ?? window.devicePixelRatio\n      return {\n        x: (cx - r.left) * dpr,\n        y: (r.height - (cy - r.top)) * dpr, // flip Y\n      }\n    }\n\n    const onMove = (cx: number, cy: number) => {\n      if (!mouseState.current.pressed) return\n      const { x, y } = toPixel(cx, cy)\n      mouseState.current.x = x\n      mouseState.current.y = y\n    }\n\n    const onDown = (cx: number, cy: number) => {\n      const { x, y } = toPixel(cx, cy)\n      mouseState.current.x = x\n      mouseState.current.y = y\n      mouseState.current.clickX = x\n      mouseState.current.clickY = y\n      mouseState.current.pressed = true\n    }\n\n    const onUp = () => {\n      mouseState.current.pressed = false\n    }\n\n    const mm = (e: MouseEvent) => onMove(e.clientX, e.clientY)\n    const md = (e: MouseEvent) => onDown(e.clientX, e.clientY)\n    const mu = () => onUp()\n    const tm = (e: TouchEvent) => {\n      if (e.touches[0]) onMove(e.touches[0].clientX, e.touches[0].clientY)\n    }\n    const ts = (e: TouchEvent) => {\n      if (e.touches[0]) onDown(e.touches[0].clientX, e.touches[0].clientY)\n    }\n    const te = () => onUp()\n\n    window.addEventListener('mousemove', mm)\n    canvas.addEventListener('mousedown', md)\n    window.addEventListener('mouseup', mu)\n    window.addEventListener('touchmove', tm, { passive: true })\n    canvas.addEventListener('touchstart', ts, { passive: true })\n    window.addEventListener('touchend', te)\n\n    return () => {\n      window.removeEventListener('mousemove', mm)\n      canvas.removeEventListener('mousedown', md)\n      window.removeEventListener('mouseup', mu)\n      window.removeEventListener('touchmove', tm)\n      canvas.removeEventListener('touchstart', ts)\n      window.removeEventListener('touchend', te)\n    }\n  }, [mouseEnabled, pixelRatio])\n\n  const pause = useCallback(() => { pausedRef.current = true }, [])\n  const resume = useCallback(() => { pausedRef.current = false }, [])\n\n  return { canvasRef, isReady, error, pause, resume }\n}\n","import type { ShadertoyProps } from './types'\nimport { useShadertoy } from './useShadertoy'\n\nexport function Shadertoy({\n  fragmentShader,\n  style,\n  className,\n  paused,\n  speed,\n  pixelRatio,\n  mouse,\n  onError,\n  onLoad,\n}: ShadertoyProps) {\n  const { canvasRef } = useShadertoy({\n    fragmentShader,\n    paused,\n    speed,\n    pixelRatio,\n    mouse,\n    onError,\n    onLoad,\n  })\n\n  return (\n    <canvas\n      ref={canvasRef}\n      className={className}\n      style={{ width: '100%', height: '100%', display: 'block', ...style }}\n    />\n  )\n}\n"]}