svgnest render fix

components/utilities/SVGNestPanel.tsx

@@ -3,21 +3,46 @@
 import { useEffect, useRef, useState } from "react";
 
 /**
- * SVGNest panel – same-origin iframe wrapper.
- * Renders /public/svgnest/index.html in an isolated doc so the legacy app can
- * own the DOM/CSS/JS without conflicting with Next.js styles or scripts.
+ * SVGNest panel – same-origin iframe wrapper (clean, frameless).
+ * Also hides the legacy page’s heading/tagline for a minimal look.
  */
 export default function SVGNestPanel() {
     const iframeRef = useRef<HTMLIFrameElement | null>(null);
     const [ready, setReady] = useState(false);
     const [err, setErr] = useState<string | null>(null);
 
-    // Basic load/error status for UX
     useEffect(() => {
         const el = iframeRef.current;
         if (!el) return;
 
-        const onLoad = () => setReady(true);
+        const onLoad = () => {
+            setReady(true);
+
+            // Hide the legacy heading/tagline inside svgnest without touching the vendor files.
+            try {
+                const doc = el.contentDocument;
+                if (!doc) return;
+
+                // 1) Hide the first H1 (their title)
+                const h1 = doc.querySelector("h1");
+                if (h1) (h1 as HTMLElement).style.display = "none";
+
+                // 2) Hide any node that literally contains that tagline text
+                const all = Array.from(doc.querySelectorAll<HTMLElement>("body *"));
+                for (const n of all) {
+                    const t = (n.textContent || "").trim().toLowerCase();
+                    if (t.includes("automatically nests parts") && t.includes("exports svg")) {
+                        n.style.display = "none";
+                    }
+                }
+
+                // 3) Optional: tighten top padding/margins so content sits snugly
+                (doc.body as HTMLElement).style.marginTop = "4px";
+            } catch {
+                // ignore; same-origin so this should succeed
+            }
+        };
+
         const onError = () => setErr("Failed to load /svgnest/index.html");
 
         el.addEventListener("load", onLoad);
@@ -39,31 +64,14 @@ export default function SVGNestPanel() {
             </div>
         )}
 
-        {/* Same-origin iframe, no sandbox to allow drag/drop, file dialogs, workers, etc. */}
+        {/* Frameless iframe (no border, no wrapper frame) */}
         <iframe
         ref={iframeRef}
         src="/svgnest/index.html"
         title="SVGNest"
-        className="w-full rounded-md border"
-        style={{
-            height: "72vh",
-            background: "transparent",
-        }}
+        className="w-full"
+        style={{ height: "72vh", background: "transparent", border: "none" }}
         />
-
-        {/* Fallback open-in-new-tab helper */}
-        <div className="mt-2 text-xs text-zinc-400">
-        If the app doesn’t respond,{" "}
-        <a
-        href="/svgnest/index.html"
-        target="_blank"
-        rel="noopener noreferrer"
-        className="underline"
-        >
-        open SVGnest in a new tab
-        </a>
-        .
-        </div>
         </div>
     );
 }