react-shadertoy 0.1.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Wrennly
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,85 @@
+# react-shadertoy
+
+Run [Shadertoy](https://www.shadertoy.com/) GLSL shaders in React. Copy-paste and it works.
+
+- Zero dependencies (just React)
+- All Shadertoy uniforms supported (`iTime`, `iResolution`, `iMouse`, `iDate`, etc.)
+- Mouse & touch interaction built-in
+- TypeScript-first
+- < 4KB gzipped
+
+## Install
+
+```bash
+npm install react-shadertoy
+```
+
+## Usage
+
+```tsx
+import { Shadertoy } from 'react-shadertoy'
+
+function App() {
+  return (
+    <Shadertoy
+      style={{ width: '100%', height: '400px' }}
+      fragmentShader={`
+        void mainImage(out vec4 fragColor, in vec2 fragCoord) {
+          vec2 uv = fragCoord / iResolution.xy;
+          fragColor = vec4(uv, 0.5 + 0.5 * sin(iTime), 1.0);
+        }
+      `}
+    />
+  )
+}
+```
+
+Find a shader on [Shadertoy](https://www.shadertoy.com/), copy the GLSL code, paste it into `fragmentShader`. Done.
+
+## Hooks API
+
+```tsx
+import { useShadertoy } from 'react-shadertoy'
+
+function MyShader() {
+  const { canvasRef, isReady, error, pause, resume } = useShadertoy({
+    fragmentShader: `
+      void mainImage(out vec4 fragColor, in vec2 fragCoord) {
+        vec2 uv = fragCoord / iResolution.xy;
+        fragColor = vec4(uv, 0.5 + 0.5 * sin(iTime), 1.0);
+      }
+    `,
+  })
+
+  return <canvas ref={canvasRef} style={{ width: '100%', height: '400px' }} />
+}
+```
+
+## Props
+
+| Prop | Type | Default | Description |
+|------|------|---------|-------------|
+| `fragmentShader` | `string` | required | Shadertoy GLSL code |
+| `style` | `CSSProperties` | — | Container style |
+| `className` | `string` | — | Container className |
+| `paused` | `boolean` | `false` | Pause rendering |
+| `speed` | `number` | `1.0` | `iTime` speed multiplier |
+| `pixelRatio` | `number` | `devicePixelRatio` | Canvas pixel ratio |
+| `mouse` | `boolean` | `true` | Enable mouse/touch tracking |
+| `onError` | `(error: string) => void` | — | GLSL compile error callback |
+| `onLoad` | `() => void` | — | WebGL ready callback |
+
+## Supported Uniforms
+
+| Uniform | Type | Description |
+|---------|------|-------------|
+| `iResolution` | `vec3` | Viewport size in pixels |
+| `iTime` | `float` | Elapsed time in seconds |
+| `iTimeDelta` | `float` | Time since last frame |
+| `iFrame` | `int` | Frame counter |
+| `iMouse` | `vec4` | Mouse position & click state |
+| `iDate` | `vec4` | Year, month, day, seconds |
+
+## License
+
+MIT

package/dist/index.d.mts

@@ -0,0 +1,45 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { CSSProperties, RefObject } from 'react';
+
+interface ShadertoyProps {
+    /** Shadertoy-compatible GLSL fragment shader (must contain mainImage) */
+    fragmentShader: string;
+    /** Container style */
+    style?: CSSProperties;
+    /** Container className */
+    className?: string;
+    /** Pause rendering (default: false) */
+    paused?: boolean;
+    /** iTime speed multiplier (default: 1.0) */
+    speed?: number;
+    /** Device pixel ratio (default: window.devicePixelRatio) */
+    pixelRatio?: number;
+    /** Enable mouse/touch tracking (default: true) */
+    mouse?: boolean;
+    /** Called when GLSL compilation fails */
+    onError?: (error: string) => void;
+    /** Called when WebGL is ready */
+    onLoad?: () => void;
+}
+interface UseShadertoyOptions {
+    fragmentShader: string;
+    paused?: boolean;
+    speed?: number;
+    pixelRatio?: number;
+    mouse?: boolean;
+    onError?: (error: string) => void;
+    onLoad?: () => void;
+}
+interface UseShadertoyReturn {
+    canvasRef: RefObject<HTMLCanvasElement | null>;
+    isReady: boolean;
+    error: string | null;
+    pause: () => void;
+    resume: () => void;
+}
+
+declare function Shadertoy({ fragmentShader, 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;
+
+export { Shadertoy, type ShadertoyProps, type UseShadertoyOptions, type UseShadertoyReturn, useShadertoy };

package/dist/index.d.ts

@@ -0,0 +1,45 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { CSSProperties, RefObject } from 'react';
+
+interface ShadertoyProps {
+    /** Shadertoy-compatible GLSL fragment shader (must contain mainImage) */
+    fragmentShader: string;
+    /** Container style */
+    style?: CSSProperties;
+    /** Container className */
+    className?: string;
+    /** Pause rendering (default: false) */
+    paused?: boolean;
+    /** iTime speed multiplier (default: 1.0) */
+    speed?: number;
+    /** Device pixel ratio (default: window.devicePixelRatio) */
+    pixelRatio?: number;
+    /** Enable mouse/touch tracking (default: true) */
+    mouse?: boolean;
+    /** Called when GLSL compilation fails */
+    onError?: (error: string) => void;
+    /** Called when WebGL is ready */
+    onLoad?: () => void;
+}
+interface UseShadertoyOptions {
+    fragmentShader: string;
+    paused?: boolean;
+    speed?: number;
+    pixelRatio?: number;
+    mouse?: boolean;
+    onError?: (error: string) => void;
+    onLoad?: () => void;
+}
+interface UseShadertoyReturn {
+    canvasRef: RefObject<HTMLCanvasElement | null>;
+    isReady: boolean;
+    error: string | null;
+    pause: () => void;
+    resume: () => void;
+}
+
+declare function Shadertoy({ fragmentShader, 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;
+
+export { Shadertoy, type ShadertoyProps, type UseShadertoyOptions, type UseShadertoyReturn, useShadertoy };

package/dist/index.js

@@ -0,0 +1,326 @@
+'use strict';
+
+var react = require('react');
+var jsxRuntime = require('react/jsx-runtime');
+
+// src/useShadertoy.ts
+
+// src/renderer.ts
+var QUAD_VERTICES = new Float32Array([
+  -1,
+  -1,
+  1,
+  -1,
+  -1,
+  1,
+  -1,
+  1,
+  1,
+  -1,
+  1,
+  1
+]);
+var VERTEX_SHADER = `
+attribute vec2 position;
+void main() {
+  gl_Position = vec4(position, 0.0, 1.0);
+}
+`;
+function wrapFragmentShader(shader) {
+  return `precision highp float;
+
+uniform vec3  iResolution;
+uniform float iTime;
+uniform float iTimeDelta;
+uniform int   iFrame;
+uniform vec4  iMouse;
+uniform vec4  iDate;
+
+${shader}
+
+void main() {
+  mainImage(gl_FragColor, gl_FragCoord.xy);
+}
+`;
+}
+function compileShader(gl, type, source) {
+  const shader = gl.createShader(type);
+  if (!shader) return "Failed to create shader";
+  gl.shaderSource(shader, source);
+  gl.compileShader(shader);
+  if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {
+    const log = gl.getShaderInfoLog(shader) || "Unknown compile error";
+    gl.deleteShader(shader);
+    return log;
+  }
+  return shader;
+}
+function createRenderer(canvas, fragmentShader) {
+  const gl = canvas.getContext("webgl", {
+    antialias: false,
+    alpha: true,
+    premultipliedAlpha: false
+  });
+  if (!gl) return "WebGL not supported";
+  const vert = compileShader(gl, gl.VERTEX_SHADER, VERTEX_SHADER);
+  if (typeof vert === "string") return vert;
+  const frag = compileShader(gl, gl.FRAGMENT_SHADER, wrapFragmentShader(fragmentShader));
+  if (typeof frag === "string") return frag;
+  const program = gl.createProgram();
+  if (!program) return "Failed to create program";
+  gl.attachShader(program, vert);
+  gl.attachShader(program, frag);
+  gl.linkProgram(program);
+  if (!gl.getProgramParameter(program, gl.LINK_STATUS)) {
+    const log = gl.getProgramInfoLog(program) || "Unknown link error";
+    gl.deleteProgram(program);
+    return log;
+  }
+  gl.deleteShader(vert);
+  gl.deleteShader(frag);
+  const buffer = gl.createBuffer();
+  gl.bindBuffer(gl.ARRAY_BUFFER, buffer);
+  gl.bufferData(gl.ARRAY_BUFFER, QUAD_VERTICES, gl.STATIC_DRAW);
+  const positionLoc = gl.getAttribLocation(program, "position");
+  gl.enableVertexAttribArray(positionLoc);
+  gl.vertexAttribPointer(positionLoc, 2, gl.FLOAT, false, 0, 0);
+  const locations = {
+    iResolution: gl.getUniformLocation(program, "iResolution"),
+    iTime: gl.getUniformLocation(program, "iTime"),
+    iTimeDelta: gl.getUniformLocation(program, "iTimeDelta"),
+    iFrame: gl.getUniformLocation(program, "iFrame"),
+    iMouse: gl.getUniformLocation(program, "iMouse"),
+    iDate: gl.getUniformLocation(program, "iDate")
+  };
+  gl.useProgram(program);
+  return {
+    gl,
+    program,
+    locations,
+    time: 0,
+    frame: 0,
+    lastTime: 0
+  };
+}
+function render(state) {
+  const { gl } = state;
+  gl.viewport(0, 0, gl.drawingBufferWidth, gl.drawingBufferHeight);
+  gl.drawArrays(gl.TRIANGLES, 0, 6);
+}
+function dispose(state) {
+  const { gl, program } = state;
+  gl.deleteProgram(program);
+  gl.getExtension("WEBGL_lose_context")?.loseContext();
+}
+
+// src/uniforms.ts
+function updateUniforms(state, delta, speed, mouse) {
+  const { gl, locations } = state;
+  state.time += delta * speed;
+  if (locations.iTime) {
+    gl.uniform1f(locations.iTime, state.time);
+  }
+  if (locations.iTimeDelta) {
+    gl.uniform1f(locations.iTimeDelta, delta);
+  }
+  state.frame++;
+  if (locations.iFrame) {
+    gl.uniform1i(locations.iFrame, state.frame);
+  }
+  if (locations.iResolution) {
+    gl.uniform3f(
+      locations.iResolution,
+      gl.drawingBufferWidth,
+      gl.drawingBufferHeight,
+      1
+    );
+  }
+  if (locations.iMouse) {
+    const mz = mouse.pressed ? mouse.clickX : -Math.abs(mouse.clickX);
+    const mw = mouse.pressed ? mouse.clickY : -Math.abs(mouse.clickY);
+    gl.uniform4f(locations.iMouse, mouse.x, mouse.y, mz, mw);
+  }
+  if (locations.iDate) {
+    const now = /* @__PURE__ */ new Date();
+    const seconds = now.getHours() * 3600 + now.getMinutes() * 60 + now.getSeconds() + now.getMilliseconds() / 1e3;
+    gl.uniform4f(
+      locations.iDate,
+      now.getFullYear(),
+      now.getMonth(),
+      // 0-based, matches Shadertoy
+      now.getDate(),
+      seconds
+    );
+  }
+}
+
+// src/useShadertoy.ts
+function useShadertoy({
+  fragmentShader,
+  paused = false,
+  speed = 1,
+  pixelRatio,
+  mouse: mouseEnabled = true,
+  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({
+    x: 0,
+    y: 0,
+    clickX: 0,
+    clickY: 0,
+    pressed: false
+  });
+  pausedRef.current = paused;
+  speedRef.current = speed;
+  react.useEffect(() => {
+    const canvas = canvasRef.current;
+    if (!canvas) return;
+    const result = createRenderer(canvas, fragmentShader);
+    if (typeof result === "string") {
+      setError(result);
+      onError?.(result);
+      return;
+    }
+    rendererRef.current = result;
+    setIsReady(true);
+    setError(null);
+    onLoad?.();
+    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);
+      }
+      rafRef.current = requestAnimationFrame(loop);
+    };
+    rafRef.current = requestAnimationFrame(loop);
+    return () => {
+      cancelAnimationFrame(rafRef.current);
+      if (rendererRef.current) {
+        dispose(rendererRef.current);
+        rendererRef.current = null;
+      }
+      setIsReady(false);
+    };
+  }, [fragmentShader, onError, onLoad]);
+  react.useEffect(() => {
+    const canvas = canvasRef.current;
+    if (!canvas) return;
+    const dpr = pixelRatio ?? (typeof window !== "undefined" ? window.devicePixelRatio : 1);
+    const observer = new ResizeObserver((entries) => {
+      for (const entry of entries) {
+        const { width, height } = entry.contentRect;
+        canvas.width = Math.round(width * dpr);
+        canvas.height = Math.round(height * dpr);
+      }
+    });
+    observer.observe(canvas);
+    return () => observer.disconnect();
+  }, [pixelRatio]);
+  react.useEffect(() => {
+    if (!mouseEnabled) return;
+    const canvas = canvasRef.current;
+    if (!canvas) return;
+    const toPixel = (cx, cy) => {
+      const r = canvas.getBoundingClientRect();
+      const dpr = pixelRatio ?? window.devicePixelRatio;
+      return {
+        x: (cx - r.left) * dpr,
+        y: (r.height - (cy - r.top)) * dpr
+        // flip Y
+      };
+    };
+    const onMove = (cx, cy) => {
+      if (!mouseState.current.pressed) return;
+      const { x, y } = toPixel(cx, cy);
+      mouseState.current.x = x;
+      mouseState.current.y = y;
+    };
+    const onDown = (cx, cy) => {
+      const { x, y } = toPixel(cx, cy);
+      mouseState.current.x = x;
+      mouseState.current.y = y;
+      mouseState.current.clickX = x;
+      mouseState.current.clickY = y;
+      mouseState.current.pressed = true;
+    };
+    const onUp = () => {
+      mouseState.current.pressed = false;
+    };
+    const mm = (e) => onMove(e.clientX, e.clientY);
+    const md = (e) => onDown(e.clientX, e.clientY);
+    const mu = () => onUp();
+    const tm = (e) => {
+      if (e.touches[0]) onMove(e.touches[0].clientX, e.touches[0].clientY);
+    };
+    const ts = (e) => {
+      if (e.touches[0]) onDown(e.touches[0].clientX, e.touches[0].clientY);
+    };
+    const te = () => onUp();
+    window.addEventListener("mousemove", mm);
+    canvas.addEventListener("mousedown", md);
+    window.addEventListener("mouseup", mu);
+    window.addEventListener("touchmove", tm, { passive: true });
+    canvas.addEventListener("touchstart", ts, { passive: true });
+    window.addEventListener("touchend", te);
+    return () => {
+      window.removeEventListener("mousemove", mm);
+      canvas.removeEventListener("mousedown", md);
+      window.removeEventListener("mouseup", mu);
+      window.removeEventListener("touchmove", tm);
+      canvas.removeEventListener("touchstart", ts);
+      window.removeEventListener("touchend", te);
+    };
+  }, [mouseEnabled, pixelRatio]);
+  const pause = react.useCallback(() => {
+    pausedRef.current = true;
+  }, []);
+  const resume = react.useCallback(() => {
+    pausedRef.current = false;
+  }, []);
+  return { canvasRef, isReady, error, pause, resume };
+}
+function Shadertoy({
+  fragmentShader,
+  style,
+  className,
+  paused,
+  speed,
+  pixelRatio,
+  mouse,
+  onError,
+  onLoad
+}) {
+  const { canvasRef } = useShadertoy({
+    fragmentShader,
+    paused,
+    speed,
+    pixelRatio,
+    mouse,
+    onError,
+    onLoad
+  });
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "canvas",
+    {
+      ref: canvasRef,
+      className,
+      style: { width: "100%", height: "100%", display: "block", ...style }
+    }
+  );
+}
+
+exports.Shadertoy = Shadertoy;
+exports.useShadertoy = useShadertoy;
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"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

@@ -0,0 +1,323 @@
+import { useRef, useState, useEffect, useCallback } from 'react';
+import { jsx } from 'react/jsx-runtime';
+
+// src/useShadertoy.ts
+
+// src/renderer.ts
+var QUAD_VERTICES = new Float32Array([
+  -1,
+  -1,
+  1,
+  -1,
+  -1,
+  1,
+  -1,
+  1,
+  1,
+  -1,
+  1,
+  1
+]);
+var VERTEX_SHADER = `
+attribute vec2 position;
+void main() {
+  gl_Position = vec4(position, 0.0, 1.0);
+}
+`;
+function wrapFragmentShader(shader) {
+  return `precision highp float;
+
+uniform vec3  iResolution;
+uniform float iTime;
+uniform float iTimeDelta;
+uniform int   iFrame;
+uniform vec4  iMouse;
+uniform vec4  iDate;
+
+${shader}
+
+void main() {
+  mainImage(gl_FragColor, gl_FragCoord.xy);
+}
+`;
+}
+function compileShader(gl, type, source) {
+  const shader = gl.createShader(type);
+  if (!shader) return "Failed to create shader";
+  gl.shaderSource(shader, source);
+  gl.compileShader(shader);
+  if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {
+    const log = gl.getShaderInfoLog(shader) || "Unknown compile error";
+    gl.deleteShader(shader);
+    return log;
+  }
+  return shader;
+}
+function createRenderer(canvas, fragmentShader) {
+  const gl = canvas.getContext("webgl", {
+    antialias: false,
+    alpha: true,
+    premultipliedAlpha: false
+  });
+  if (!gl) return "WebGL not supported";
+  const vert = compileShader(gl, gl.VERTEX_SHADER, VERTEX_SHADER);
+  if (typeof vert === "string") return vert;
+  const frag = compileShader(gl, gl.FRAGMENT_SHADER, wrapFragmentShader(fragmentShader));
+  if (typeof frag === "string") return frag;
+  const program = gl.createProgram();
+  if (!program) return "Failed to create program";
+  gl.attachShader(program, vert);
+  gl.attachShader(program, frag);
+  gl.linkProgram(program);
+  if (!gl.getProgramParameter(program, gl.LINK_STATUS)) {
+    const log = gl.getProgramInfoLog(program) || "Unknown link error";
+    gl.deleteProgram(program);
+    return log;
+  }
+  gl.deleteShader(vert);
+  gl.deleteShader(frag);
+  const buffer = gl.createBuffer();
+  gl.bindBuffer(gl.ARRAY_BUFFER, buffer);
+  gl.bufferData(gl.ARRAY_BUFFER, QUAD_VERTICES, gl.STATIC_DRAW);
+  const positionLoc = gl.getAttribLocation(program, "position");
+  gl.enableVertexAttribArray(positionLoc);
+  gl.vertexAttribPointer(positionLoc, 2, gl.FLOAT, false, 0, 0);
+  const locations = {
+    iResolution: gl.getUniformLocation(program, "iResolution"),
+    iTime: gl.getUniformLocation(program, "iTime"),
+    iTimeDelta: gl.getUniformLocation(program, "iTimeDelta"),
+    iFrame: gl.getUniformLocation(program, "iFrame"),
+    iMouse: gl.getUniformLocation(program, "iMouse"),
+    iDate: gl.getUniformLocation(program, "iDate")
+  };
+  gl.useProgram(program);
+  return {
+    gl,
+    program,
+    locations,
+    time: 0,
+    frame: 0,
+    lastTime: 0
+  };
+}
+function render(state) {
+  const { gl } = state;
+  gl.viewport(0, 0, gl.drawingBufferWidth, gl.drawingBufferHeight);
+  gl.drawArrays(gl.TRIANGLES, 0, 6);
+}
+function dispose(state) {
+  const { gl, program } = state;
+  gl.deleteProgram(program);
+  gl.getExtension("WEBGL_lose_context")?.loseContext();
+}
+
+// src/uniforms.ts
+function updateUniforms(state, delta, speed, mouse) {
+  const { gl, locations } = state;
+  state.time += delta * speed;
+  if (locations.iTime) {
+    gl.uniform1f(locations.iTime, state.time);
+  }
+  if (locations.iTimeDelta) {
+    gl.uniform1f(locations.iTimeDelta, delta);
+  }
+  state.frame++;
+  if (locations.iFrame) {
+    gl.uniform1i(locations.iFrame, state.frame);
+  }
+  if (locations.iResolution) {
+    gl.uniform3f(
+      locations.iResolution,
+      gl.drawingBufferWidth,
+      gl.drawingBufferHeight,
+      1
+    );
+  }
+  if (locations.iMouse) {
+    const mz = mouse.pressed ? mouse.clickX : -Math.abs(mouse.clickX);
+    const mw = mouse.pressed ? mouse.clickY : -Math.abs(mouse.clickY);
+    gl.uniform4f(locations.iMouse, mouse.x, mouse.y, mz, mw);
+  }
+  if (locations.iDate) {
+    const now = /* @__PURE__ */ new Date();
+    const seconds = now.getHours() * 3600 + now.getMinutes() * 60 + now.getSeconds() + now.getMilliseconds() / 1e3;
+    gl.uniform4f(
+      locations.iDate,
+      now.getFullYear(),
+      now.getMonth(),
+      // 0-based, matches Shadertoy
+      now.getDate(),
+      seconds
+    );
+  }
+}
+
+// src/useShadertoy.ts
+function useShadertoy({
+  fragmentShader,
+  paused = false,
+  speed = 1,
+  pixelRatio,
+  mouse: mouseEnabled = true,
+  onError,
+  onLoad
+}) {
+  const canvasRef = useRef(null);
+  const rendererRef = useRef(null);
+  const rafRef = useRef(0);
+  const pausedRef = useRef(paused);
+  const speedRef = useRef(speed);
+  const [isReady, setIsReady] = useState(false);
+  const [error, setError] = useState(null);
+  const mouseState = useRef({
+    x: 0,
+    y: 0,
+    clickX: 0,
+    clickY: 0,
+    pressed: false
+  });
+  pausedRef.current = paused;
+  speedRef.current = speed;
+  useEffect(() => {
+    const canvas = canvasRef.current;
+    if (!canvas) return;
+    const result = createRenderer(canvas, fragmentShader);
+    if (typeof result === "string") {
+      setError(result);
+      onError?.(result);
+      return;
+    }
+    rendererRef.current = result;
+    setIsReady(true);
+    setError(null);
+    onLoad?.();
+    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);
+      }
+      rafRef.current = requestAnimationFrame(loop);
+    };
+    rafRef.current = requestAnimationFrame(loop);
+    return () => {
+      cancelAnimationFrame(rafRef.current);
+      if (rendererRef.current) {
+        dispose(rendererRef.current);
+        rendererRef.current = null;
+      }
+      setIsReady(false);
+    };
+  }, [fragmentShader, onError, onLoad]);
+  useEffect(() => {
+    const canvas = canvasRef.current;
+    if (!canvas) return;
+    const dpr = pixelRatio ?? (typeof window !== "undefined" ? window.devicePixelRatio : 1);
+    const observer = new ResizeObserver((entries) => {
+      for (const entry of entries) {
+        const { width, height } = entry.contentRect;
+        canvas.width = Math.round(width * dpr);
+        canvas.height = Math.round(height * dpr);
+      }
+    });
+    observer.observe(canvas);
+    return () => observer.disconnect();
+  }, [pixelRatio]);
+  useEffect(() => {
+    if (!mouseEnabled) return;
+    const canvas = canvasRef.current;
+    if (!canvas) return;
+    const toPixel = (cx, cy) => {
+      const r = canvas.getBoundingClientRect();
+      const dpr = pixelRatio ?? window.devicePixelRatio;
+      return {
+        x: (cx - r.left) * dpr,
+        y: (r.height - (cy - r.top)) * dpr
+        // flip Y
+      };
+    };
+    const onMove = (cx, cy) => {
+      if (!mouseState.current.pressed) return;
+      const { x, y } = toPixel(cx, cy);
+      mouseState.current.x = x;
+      mouseState.current.y = y;
+    };
+    const onDown = (cx, cy) => {
+      const { x, y } = toPixel(cx, cy);
+      mouseState.current.x = x;
+      mouseState.current.y = y;
+      mouseState.current.clickX = x;
+      mouseState.current.clickY = y;
+      mouseState.current.pressed = true;
+    };
+    const onUp = () => {
+      mouseState.current.pressed = false;
+    };
+    const mm = (e) => onMove(e.clientX, e.clientY);
+    const md = (e) => onDown(e.clientX, e.clientY);
+    const mu = () => onUp();
+    const tm = (e) => {
+      if (e.touches[0]) onMove(e.touches[0].clientX, e.touches[0].clientY);
+    };
+    const ts = (e) => {
+      if (e.touches[0]) onDown(e.touches[0].clientX, e.touches[0].clientY);
+    };
+    const te = () => onUp();
+    window.addEventListener("mousemove", mm);
+    canvas.addEventListener("mousedown", md);
+    window.addEventListener("mouseup", mu);
+    window.addEventListener("touchmove", tm, { passive: true });
+    canvas.addEventListener("touchstart", ts, { passive: true });
+    window.addEventListener("touchend", te);
+    return () => {
+      window.removeEventListener("mousemove", mm);
+      canvas.removeEventListener("mousedown", md);
+      window.removeEventListener("mouseup", mu);
+      window.removeEventListener("touchmove", tm);
+      canvas.removeEventListener("touchstart", ts);
+      window.removeEventListener("touchend", te);
+    };
+  }, [mouseEnabled, pixelRatio]);
+  const pause = useCallback(() => {
+    pausedRef.current = true;
+  }, []);
+  const resume = useCallback(() => {
+    pausedRef.current = false;
+  }, []);
+  return { canvasRef, isReady, error, pause, resume };
+}
+function Shadertoy({
+  fragmentShader,
+  style,
+  className,
+  paused,
+  speed,
+  pixelRatio,
+  mouse,
+  onError,
+  onLoad
+}) {
+  const { canvasRef } = useShadertoy({
+    fragmentShader,
+    paused,
+    speed,
+    pixelRatio,
+    mouse,
+    onError,
+    onLoad
+  });
+  return /* @__PURE__ */ jsx(
+    "canvas",
+    {
+      ref: canvasRef,
+      className,
+      style: { width: "100%", height: "100%", display: "block", ...style }
+    }
+  );
+}
+
+export { Shadertoy, useShadertoy };
+//# sourceMappingURL=index.mjs.map
+//# sourceMappingURL=index.mjs.map

package/dist/index.mjs.map

@@ -0,0 +1 @@
+{"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"]}

package/package.json

@@ -0,0 +1,53 @@
+{
+  "name": "react-shadertoy",
+  "version": "0.1.0",
+  "description": "Run Shadertoy GLSL shaders in React. Copy-paste and it works.",
+  "author": "Wrennly (https://github.com/wrennly)",
+  "license": "MIT",
+  "homepage": "https://github.com/wrennly/react-shadertoy",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/wrennly/react-shadertoy"
+  },
+  "keywords": [
+    "react",
+    "shadertoy",
+    "glsl",
+    "webgl",
+    "shader",
+    "fragment-shader",
+    "creative-coding",
+    "generative-art",
+    "webgpu",
+    "three.js"
+  ],
+  "main": "./dist/index.js",
+  "module": "./dist/index.mjs",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.mjs",
+      "require": "./dist/index.js"
+    }
+  },
+  "files": [
+    "dist",
+    "README.md"
+  ],
+  "scripts": {
+    "build": "tsup",
+    "dev": "tsup --watch"
+  },
+  "peerDependencies": {
+    "react": ">=18.0.0",
+    "react-dom": ">=18.0.0"
+  },
+  "devDependencies": {
+    "@types/react": "^19.2.14",
+    "react": "^19.2.4",
+    "react-dom": "^19.2.4",
+    "tsup": "^8.5.1",
+    "typescript": "^5.9.3"
+  }
+}