@wirunrom/hqr-generate 0.4.4 → 0.5.0

package/react/useGenerate.js

@@ -1,17 +1,17 @@
 "use client";
 import { useEffect, useState } from "react";
 import { generate } from "../index.web.js";
-function toArrayBuffer(bytes) {
-    if (bytes.buffer instanceof ArrayBuffer) {
-        return bytes.buffer.slice(bytes.byteOffset, bytes.byteOffset + bytes.byteLength);
-    }
-    return Uint8Array.from(bytes).buffer;
-}
 export function useGenerate(text, opts) {
     const [bytes, setBytes] = useState(null);
     const [src, setSrc] = useState(null);
     const [error, setError] = useState(null);
     const [loading, setLoading] = useState(false);
+    // Destructure so the effect only re-runs when actual values change.
+    // Passing the opts object directly caused a WASM re-run every render when
+    // callers inlined opts (e.g. `useGenerate(t, { size: 320 })`).
+    const size = opts?.size;
+    const margin = opts?.margin;
+    const ecc = opts?.ecc;
     useEffect(() => {
         if (!text)
             return;
@@ -20,12 +20,13 @@ export function useGenerate(text, opts) {
         (async () => {
             try {
                 setLoading(true);
-                const result = await generate(text, opts);
+                const result = await generate(text, { size, margin, ecc });
                 if (cancelled)
                     return;
                 setBytes(result);
-                const buffer = toArrayBuffer(result);
-                const blob = new Blob([buffer], { type: "image/png" });
+                // Cast: Uint8Array is a valid BlobPart at runtime; TS's stricter
+                // dom lib flags SharedArrayBuffer variance here.
+                const blob = new Blob([result], { type: "image/png" });
                 objectUrl = URL.createObjectURL(blob);
                 setSrc(objectUrl);
             }
@@ -44,7 +45,7 @@ export function useGenerate(text, opts) {
                 URL.revokeObjectURL(objectUrl);
             }
         };
-    }, [text, opts]);
+    }, [text, size, margin, ecc]);
     return {
         src,
         bytes,

package/react/useGenerateSvg.js

@@ -6,6 +6,10 @@ export function useGenerateSvg(text, opts) {
     const [src, setSrc] = useState(null);
     const [loading, setLoading] = useState(false);
     const [error, setError] = useState(null);
+    // Primitive deps so inline `opts` objects don't re-trigger WASM every render.
+    const size = opts?.size;
+    const margin = opts?.margin;
+    const ecc = opts?.ecc;
     useEffect(() => {
         if (!text)
             return;
@@ -14,7 +18,7 @@ export function useGenerateSvg(text, opts) {
         (async () => {
             try {
                 setLoading(true);
-                const markup = await generate_svg(text, opts);
+                const markup = await generate_svg(text, { size, margin, ecc });
                 if (cancelled)
                     return;
                 setSvg(markup);
@@ -38,7 +42,7 @@ export function useGenerateSvg(text, opts) {
             if (objectUrl)
                 URL.revokeObjectURL(objectUrl);
         };
-    }, [text, opts]);
+    }, [text, size, margin, ecc]);
     return {
         svg,
         src,