From d4a6819093f689f73f8d16998b83ebd5da84930c Mon Sep 17 00:00:00 2001
From: kbot <kbot@local>
Date: Mon, 6 Jul 2026 20:34:19 -0500
Subject: [PATCH] feat(portfolio): add hero command deck with canvas signal
 grid

---
 components/portfolio/Hero.tsx       | 16 ++++++++--------
 components/portfolio/HeroCanvas.tsx |  6 ++++--
 2 files changed, 12 insertions(+), 10 deletions(-)

diff --git a/components/portfolio/Hero.tsx b/components/portfolio/Hero.tsx
index 55b5d98..ade6219 100644
--- a/components/portfolio/Hero.tsx
+++ b/components/portfolio/Hero.tsx
@@ -6,17 +6,17 @@ import { HeroCanvas } from "./HeroCanvas";
 
 const paletteEventName = "blacksite:palette";
 
+function openCommandPalette() {
+  if (typeof window === "undefined") {
+    return;
+  }
+
+  window.dispatchEvent(new CustomEvent(paletteEventName));
+}
+
 export function Hero() {
   const shouldReduceMotion = useReducedMotion();
 
-  const openCommandPalette = () => {
-    if (typeof window === "undefined") {
-      return;
-    }
-
-    window.dispatchEvent(new CustomEvent(paletteEventName));
-  };
-
   return (
     <section
       aria-labelledby="hero-heading"
diff --git a/components/portfolio/HeroCanvas.tsx b/components/portfolio/HeroCanvas.tsx
index 8f6c486..f2a4ffd 100644
--- a/components/portfolio/HeroCanvas.tsx
+++ b/components/portfolio/HeroCanvas.tsx
@@ -176,8 +176,10 @@ export function HeroCanvas() {
     };
 
     resize();
-    resizeObserver = new ResizeObserver(resize);
-    resizeObserver.observe(canvas);
+    if ("ResizeObserver" in window) {
+      resizeObserver = new ResizeObserver(resize);
+      resizeObserver.observe(canvas);
+    }
     window.addEventListener("resize", resize, { passive: true });
 
     if (!shouldReduceMotion) {