@fjandin/react-shader 0.0.3 → 0.0.4

package/dist/ReactShader.d.ts

@@ -1,3 +1,3 @@
 import type { ReactShaderProps } from "./types";
-export declare function ReactShader({ className, fragment, vertex, uniforms, debug, fullscreen, timeScale, onFrame, }: ReactShaderProps): import("react/jsx-runtime").JSX.Element;
+export declare function ReactShader({ className, fragment, vertex, uniforms, fullscreen, timeScale, onFrame, }: ReactShaderProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=ReactShader.d.ts.map

package/dist/ReactShader.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ReactShader.d.ts","sourceRoot":"","sources":["../src/ReactShader.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,gBAAgB,EAAQ,MAAM,SAAS,CAAA;AAerD,wBAAgB,WAAW,CAAC,EAC1B,SAAS,EACT,QAAQ,EACR,MAAuB,EACvB,QAAQ,EACR,KAAa,EACb,UAAkB,EAClB,SAAa,EACb,OAAO,GACR,EAAE,gBAAgB,2CAiHlB"}
+{"version":3,"file":"ReactShader.d.ts","sourceRoot":"","sources":["../src/ReactShader.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAA;AAU/C,wBAAgB,WAAW,CAAC,EAC1B,SAAS,EACT,QAAQ,EACR,MAAuB,EACvB,QAAQ,EACR,UAAkB,EAClB,SAAa,EACb,OAAO,GACR,EAAE,gBAAgB,2CAwElB"}

package/dist/example/frontend.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"frontend.d.ts","sourceRoot":"","sources":["../../src/example/frontend.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAIH,OAAO,aAAa,CAAA;AAsBpB,wBAAgB,GAAG,4CAyBlB"}
+{"version":3,"file":"frontend.d.ts","sourceRoot":"","sources":["../../src/example/frontend.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAIH,OAAO,aAAa,CAAA;AAsBpB,wBAAgB,GAAG,4CA6BlB"}

package/dist/index.cjs

@@ -329,17 +329,11 @@ function ReactShader({
   fragment,
   vertex = DEFAULT_VERTEX,
   uniforms,
-  debug = false,
   fullscreen = false,
   timeScale = 1,
   onFrame
 }) {
   const [error, setError] = import_react2.useState(null);
-  const [debugInfo, setDebugInfo] = import_react2.useState({
-    iResolution: [0, 0],
-    iMouse: [0, 0]
-  });
-  const lastDebugUpdateRef = import_react2.useRef(0);
   const handleError = import_react2.useCallback((err) => {
     setError(err.message);
     console.error("ReactShader error:", err);
@@ -348,17 +342,7 @@ function ReactShader({
     if (onFrame) {
       onFrame(info);
     }
-    if (!debug)
-      return;
-    const now = performance.now();
-    if (now - lastDebugUpdateRef.current < 100)
-      return;
-    lastDebugUpdateRef.current = now;
-    setDebugInfo({
-      iResolution: info.resolution,
-      iMouse: info.mouse
-    });
-  }, [debug, onFrame]);
+  }, [onFrame]);
   import_react2.useEffect(() => {
     setError(null);
   }, [fragment, vertex]);
@@ -396,7 +380,9 @@ function ReactShader({
         fontSize: "12px",
         padding: "16px",
         overflow: "auto",
-        boxSizing: "border-box"
+        boxSizing: "border-box",
+        width: "100%",
+        height: "100%"
       },
       children: /* @__PURE__ */ jsx_dev_runtime.jsxDEV("pre", {
         style: { margin: 0, whiteSpace: "pre-wrap" },
@@ -404,48 +390,9 @@ function ReactShader({
       }, undefined, false, undefined, this)
     }, undefined, false, undefined, this);
   }
-  return /* @__PURE__ */ jsx_dev_runtime.jsxDEV("div", {
-    style: containerStyle,
-    children: [
-      /* @__PURE__ */ jsx_dev_runtime.jsxDEV("canvas", {
-        ref: canvasRef,
-        className,
-        style: { display: "block", width: "100%", height: "100%" }
-      }, undefined, false, undefined, this),
-      debug && /* @__PURE__ */ jsx_dev_runtime.jsxDEV("div", {
-        style: {
-          position: "absolute",
-          top: 8,
-          left: 8,
-          backgroundColor: "rgba(0, 0, 0, 0.7)",
-          color: "#fff",
-          fontFamily: "monospace",
-          fontSize: "12px",
-          padding: "8px",
-          borderRadius: "4px",
-          pointerEvents: "none"
-        },
-        children: [
-          /* @__PURE__ */ jsx_dev_runtime.jsxDEV("div", {
-            children: [
-              "iResolution: [",
-              debugInfo.iResolution[0],
-              ", ",
-              debugInfo.iResolution[1],
-              "]"
-            ]
-          }, undefined, true, undefined, this),
-          /* @__PURE__ */ jsx_dev_runtime.jsxDEV("div", {
-            children: [
-              "iMouse: [",
-              Math.round(debugInfo.iMouse[0]),
-              ", ",
-              Math.round(debugInfo.iMouse[1]),
-              "]"
-            ]
-          }, undefined, true, undefined, this)
-        ]
-      }, undefined, true, undefined, this)
-    ]
-  }, undefined, true, undefined, this);
+  return /* @__PURE__ */ jsx_dev_runtime.jsxDEV("canvas", {
+    ref: canvasRef,
+    className,
+    style: { display: "block", width: "100%", height: "100%" }
+  }, undefined, false, undefined, this);
 }

package/dist/index.js

@@ -1,5 +1,5 @@
 // src/ReactShader.tsx
-import { useCallback as useCallback2, useEffect as useEffect2, useRef as useRef2, useState } from "react";
+import { useCallback as useCallback2, useEffect as useEffect2, useState } from "react";
 
 // src/hooks/useWebGL.ts
 import { useCallback, useEffect, useRef } from "react";
@@ -294,17 +294,11 @@ function ReactShader({
   fragment,
   vertex = DEFAULT_VERTEX,
   uniforms,
-  debug = false,
   fullscreen = false,
   timeScale = 1,
   onFrame
 }) {
   const [error, setError] = useState(null);
-  const [debugInfo, setDebugInfo] = useState({
-    iResolution: [0, 0],
-    iMouse: [0, 0]
-  });
-  const lastDebugUpdateRef = useRef2(0);
   const handleError = useCallback2((err) => {
     setError(err.message);
     console.error("ReactShader error:", err);
@@ -313,17 +307,7 @@ function ReactShader({
     if (onFrame) {
       onFrame(info);
     }
-    if (!debug)
-      return;
-    const now = performance.now();
-    if (now - lastDebugUpdateRef.current < 100)
-      return;
-    lastDebugUpdateRef.current = now;
-    setDebugInfo({
-      iResolution: info.resolution,
-      iMouse: info.mouse
-    });
-  }, [debug, onFrame]);
+  }, [onFrame]);
   useEffect2(() => {
     setError(null);
   }, [fragment, vertex]);
@@ -361,7 +345,9 @@ function ReactShader({
         fontSize: "12px",
         padding: "16px",
         overflow: "auto",
-        boxSizing: "border-box"
+        boxSizing: "border-box",
+        width: "100%",
+        height: "100%"
       },
       children: /* @__PURE__ */ jsxDEV("pre", {
         style: { margin: 0, whiteSpace: "pre-wrap" },
@@ -369,50 +355,11 @@ function ReactShader({
       }, undefined, false, undefined, this)
     }, undefined, false, undefined, this);
   }
-  return /* @__PURE__ */ jsxDEV("div", {
-    style: containerStyle,
-    children: [
-      /* @__PURE__ */ jsxDEV("canvas", {
-        ref: canvasRef,
-        className,
-        style: { display: "block", width: "100%", height: "100%" }
-      }, undefined, false, undefined, this),
-      debug && /* @__PURE__ */ jsxDEV("div", {
-        style: {
-          position: "absolute",
-          top: 8,
-          left: 8,
-          backgroundColor: "rgba(0, 0, 0, 0.7)",
-          color: "#fff",
-          fontFamily: "monospace",
-          fontSize: "12px",
-          padding: "8px",
-          borderRadius: "4px",
-          pointerEvents: "none"
-        },
-        children: [
-          /* @__PURE__ */ jsxDEV("div", {
-            children: [
-              "iResolution: [",
-              debugInfo.iResolution[0],
-              ", ",
-              debugInfo.iResolution[1],
-              "]"
-            ]
-          }, undefined, true, undefined, this),
-          /* @__PURE__ */ jsxDEV("div", {
-            children: [
-              "iMouse: [",
-              Math.round(debugInfo.iMouse[0]),
-              ", ",
-              Math.round(debugInfo.iMouse[1]),
-              "]"
-            ]
-          }, undefined, true, undefined, this)
-        ]
-      }, undefined, true, undefined, this)
-    ]
-  }, undefined, true, undefined, this);
+  return /* @__PURE__ */ jsxDEV("canvas", {
+    ref: canvasRef,
+    className,
+    style: { display: "block", width: "100%", height: "100%" }
+  }, undefined, false, undefined, this);
 }
 export {
   ReactShader

package/dist/types.d.ts

@@ -8,7 +8,6 @@ export interface ReactShaderProps {
     fragment: string;
     vertex?: string;
     uniforms?: Record<string, UniformValue>;
-    debug?: boolean;
     fullscreen?: boolean;
     timeScale?: number;
     onFrame?: (info: FrameInfo) => void;

package/dist/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAA;AAEjD,MAAM,MAAM,IAAI,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;AACnC,MAAM,MAAM,IAAI,GAAG,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,CAAA;AAC3C,MAAM,MAAM,IAAI,GAAG,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,CAAA;AAEnD,MAAM,MAAM,YAAY,GAAG,MAAM,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;AAEtD,MAAM,WAAW,gBAAgB;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,EAAE,MAAM,CAAA;IAChB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,YAAY,CAAC,CAAA;IACvC,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,OAAO,CAAC,EAAE,CAAC,IAAI,EAAE,SAAS,KAAK,IAAI,CAAA;CACpC;AAED,MAAM,WAAW,eAAe;IAC9B,KAAK,EAAE,MAAM,CAAA;IACb,MAAM,EAAE,IAAI,CAAA;IACZ,cAAc,EAAE,MAAM,CAAA;IACtB,WAAW,EAAE,IAAI,CAAA;CAClB"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAA;AAEjD,MAAM,MAAM,IAAI,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;AACnC,MAAM,MAAM,IAAI,GAAG,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,CAAA;AAC3C,MAAM,MAAM,IAAI,GAAG,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,CAAA;AAEnD,MAAM,MAAM,YAAY,GAAG,MAAM,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;AAEtD,MAAM,WAAW,gBAAgB;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,EAAE,MAAM,CAAA;IAChB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,YAAY,CAAC,CAAA;IACvC,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,OAAO,CAAC,EAAE,CAAC,IAAI,EAAE,SAAS,KAAK,IAAI,CAAA;CACpC;AAED,MAAM,WAAW,eAAe;IAC9B,KAAK,EAAE,MAAM,CAAA;IACb,MAAM,EAAE,IAAI,CAAA;IACZ,cAAc,EAAE,MAAM,CAAA;IACtB,WAAW,EAAE,IAAI,CAAA;CAClB"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fjandin/react-shader",
-  "version": "0.0.3",
+  "version": "0.0.4",
   "description": "React component for rendering WebGL shaders",
   "type": "module",
   "main": "./dist/index.cjs",