From b6c98e964302d2e0808720e8c9ff17ced80b9925 Mon Sep 17 00:00:00 2001
From: shrimbly <falloon.willie@gmail.com>
Date: Thu, 12 Mar 2026 07:59:33 +1300
Subject: [PATCH] style: add top padding and max-width to ArrayNode top fields

Add pt-1 to content area so fields don't hug the top edge, and
max-w-[75%] to the Split/By field rows so they don't extend behind
the auto-route button icon.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 src/components/nodes/ArrayNode.tsx | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/components/nodes/ArrayNode.tsx b/src/components/nodes/ArrayNode.tsx
index f1c4b78c..8c8f09ea 100644
--- a/src/components/nodes/ArrayNode.tsx
+++ b/src/components/nodes/ArrayNode.tsx
@@ -196,8 +196,8 @@ export function ArrayNode({ id, data, selected }: NodeProps<ArrayNodeType>) {
         </svg>
       </button>
 
-      <div className="flex flex-col gap-2 flex-1 min-h-0">
-        <div className="flex items-center gap-2">
+      <div className="flex flex-col gap-2 pt-1 flex-1 min-h-0">
+        <div className="flex items-center gap-2 max-w-[75%]">
           <label className="shrink-0 text-[11px] text-neutral-400">Split</label>
           <select
             value={nodeData.splitMode}
@@ -211,7 +211,7 @@ export function ArrayNode({ id, data, selected }: NodeProps<ArrayNodeType>) {
         </div>
 
         {nodeData.splitMode === "delimiter" && (
-          <div className="flex items-center gap-2">
+          <div className="flex items-center gap-2 max-w-[75%]">
             <label className="shrink-0 text-[11px] text-neutral-400">By</label>
             <input
               value={nodeData.delimiter}
@@ -223,7 +223,7 @@ export function ArrayNode({ id, data, selected }: NodeProps<ArrayNodeType>) {
         )}
 
         {nodeData.splitMode === "regex" && (
-          <div className="flex items-center gap-2">
+          <div className="flex items-center gap-2 max-w-[75%]">
             <label className="shrink-0 text-[11px] text-neutral-400">By</label>
             <input
               value={nodeData.regexPattern}