From 72f85a97e5ccd125d5bdc57bfd10a8e766a64672 Mon Sep 17 00:00:00 2001
From: Josh Knapp <jknapp85@gmail.com>
Date: Sun, 12 Jul 2026 20:22:11 -0700
Subject: [PATCH] fix(builder): phase-1 polish a11y follow-ups (dropzone
 keyboard, badge name, icon aria)

---
 craft/src/editor/RenderNode.tsx       | 2 +-
 craft/src/panels/left/AssetsPanel.tsx | 4 +---
 craft/src/panels/left/PagesPanel.tsx  | 2 +-
 3 files changed, 3 insertions(+), 5 deletions(-)

diff --git a/craft/src/editor/RenderNode.tsx b/craft/src/editor/RenderNode.tsx
index ca96216..df567cc 100644
--- a/craft/src/editor/RenderNode.tsx
+++ b/craft/src/editor/RenderNode.tsx
@@ -20,7 +20,7 @@ export const RenderNode: React.FC<RenderNodeProps> = ({ render }) => {
   const { id, isSelected, dom, name, parent } = useNode((node) => ({
     isSelected: node.events.selected,
     dom: node.dom,
-    name: node.data.custom?.displayName || node.data.displayName,
+    name: (node.data.props?.aiName as string) || node.data.displayName,
     parent: node.data.parent,
   }));
 
diff --git a/craft/src/panels/left/AssetsPanel.tsx b/craft/src/panels/left/AssetsPanel.tsx
index bc63160..034b2ac 100644
--- a/craft/src/panels/left/AssetsPanel.tsx
+++ b/craft/src/panels/left/AssetsPanel.tsx
@@ -118,9 +118,7 @@ export const AssetsPanel: React.FC = () => {
         onDrop={handleDrop}
         onDragOver={handleDragOver}
         onDragLeave={handleDragLeave}
-        onClick={assets.length === 0 ? () => fileInputRef.current?.click() : undefined}
-        role={assets.length === 0 ? 'button' : undefined}
-        tabIndex={assets.length === 0 ? 0 : undefined}
+        {...(assets.length === 0 ? clickableProps(() => fileInputRef.current?.click()) : {})}
         style={{
           display: 'flex',
           flexDirection: 'column',
diff --git a/craft/src/panels/left/PagesPanel.tsx b/craft/src/panels/left/PagesPanel.tsx
index 8b36fde..02f1abe 100644
--- a/craft/src/panels/left/PagesPanel.tsx
+++ b/craft/src/panels/left/PagesPanel.tsx
@@ -394,7 +394,7 @@ export const PagesPanel: React.FC = () => {
                       cursor: 'pointer',
                     }}
                   >
-                    <i className="fa fa-trash" />
+                    <i className="fa fa-trash" aria-hidden="true" />
                   </button>
                 )}
               </div>