update error handler of useDomSyncer

packages/use-shader-fx/package.json

@@ -1,6 +1,6 @@
 {
    "name": "@hmng8/use-shader-fx",
-   "version": "1.0.38",
+   "version": "1.0.39",
    "description": "The only difficult part is coding the shaders",
    "main": "./build/use-shader-fx.umd.cjs",
    "module": "./build/use-shader-fx.js",

packages/use-shader-fx/src/hooks/useDomSyncer/index.ts

@@ -91,32 +91,32 @@ export const useDomSyncer = (
 
          updateParams && setParams(updateParams);
 
-         errorHandler(params);
-
-         if (refreshTrigger) {
-            createMesh({
+         if (errorHandler(params)) {
+            if (refreshTrigger) {
+               createMesh({
+                  params,
+                  size,
+                  scene,
+               });
+
+               intersectionHandler({
+                  isIntersectingRef,
+                  isIntersectingOnceRef,
+                  params,
+               });
+
+               setRefreshTrigger(false);
+            }
+
+            updateDomRects({
                params,
                size,
+               resolutionRef,
                scene,
-            });
-
-            intersectionHandler({
                isIntersectingRef,
-               isIntersectingOnceRef,
-               params,
             });
-
-            setRefreshTrigger(false);
          }
 
-         updateDomRects({
-            params,
-            size,
-            resolutionRef,
-            scene,
-            isIntersectingRef,
-         });
-
          return updateRenderTarget(gl);
       },
       [

packages/use-shader-fx/src/hooks/useDomSyncer/utils/errorHandler.ts

@@ -1,15 +1,20 @@
 import { DomSyncerParams } from "..";
+import { ISDEV } from "../../../libs/constants";
 
 export const errorHandler = (params: DomSyncerParams) => {
    const domLength = params.dom?.length;
    const textureLength = params.texture?.length;
    const resolutionLength = params.resolution?.length;
 
    if (!domLength || !textureLength || !resolutionLength) {
-      throw new Error("No dom or texture or resolution is set");
+      ISDEV && console.warn("No dom or texture or resolution is set");
+      return false;
    }
 
    if (domLength !== textureLength || domLength !== resolutionLength) {
-      throw new Error("Match dom, texture and resolution length");
+      ISDEV && console.warn("not Match dom , texture and resolution length");
+      return false;
    }
+
+   return true;
 };

packages/use-shader-fx/src/hooks/useDomSyncer/utils/useUpdateDomRect.ts

@@ -4,6 +4,7 @@ import { Size } from "@react-three/fiber";
 import { setUniform } from "../../../utils/setUniforms";
 import { DomSyncerMaterial } from "./createMesh";
 import { useCallback, useRef } from "react";
+import { ISDEV } from "../../../libs/constants";
 
 type UpdateDomRect = ({
    params,
@@ -34,7 +35,8 @@ export const useUpdateDomRect = (): UseUpdateDomRectReturn => {
          scene.children.forEach((mesh, i) => {
             const domElement = params.dom![i];
             if (!domElement) {
-               throw new Error("DOM is null.");
+               ISDEV && console.warn("DOM is null.");
+               return;
             }
 
             // DOMRect is updated even outside the intersection

packages/use-shader-fx/src/libs/constants.ts

@@ -0,0 +1 @@
+export const ISDEV = process.env.NODE_ENV === "development";

packages/use-shader-fx/types/hooks/useDomSyncer/utils/errorHandler.d.ts

@@ -1,2 +1,2 @@
 import { DomSyncerParams } from "..";
-export declare const errorHandler: (params: DomSyncerParams) => void;
+export declare const errorHandler: (params: DomSyncerParams) => boolean;

packages/use-shader-fx/types/libs/constants.d.ts

@@ -0,0 +1 @@
+export declare const ISDEV: boolean;