fix(site): fix chat input button icon sizing and centering (#22882)

The Button icon variant applies [&>svg]:size-icon-sm (18px) and
the base applies [&>svg]:p-0.5, both of which silently override
h-*/w-* set directly on child SVGs. This caused the stop icon to
render at 18px instead of 12px and the send arrow to shift
off-center due to uncleared padding.

Pin each icon size via !important on the parent className so the
values are deterministic regardless of Tailwind class order:

- Attach: !size-icon-sm (18px, unchanged visual)
- Stop: !size-3 (12px, matches original intent)
- Send: !size-5 (20px, matches prior visual after padding)

Add Streaming and StreamingInterruptPending stories for the stop
button.

site/src/pages/AgentsPage/AgentChatInput.stories.tsx

@@ -137,6 +137,28 @@ export const LoadingDisablesSend: Story = {
 	},
 };
 
+export const Streaming: Story = {
+	args: {
+		isStreaming: true,
+		onInterrupt: fn(),
+		isInterruptPending: false,
+		initialValue: "",
+		onAttach: fn(),
+		onRemoveAttachment: fn(),
+	},
+};
+
+export const StreamingInterruptPending: Story = {
+	args: {
+		isStreaming: true,
+		onInterrupt: fn(),
+		isInterruptPending: true,
+		initialValue: "",
+		onAttach: fn(),
+		onRemoveAttachment: fn(),
+	},
+};
+
 const longContent = Array.from(
 	{ length: 60 },
 	(_, i) =>

site/src/pages/AgentsPage/AgentChatInput.tsx

@@ -640,12 +640,12 @@ export const AgentChatInput = memo<AgentChatInputProps>(
 										type="button"
 										variant="outline"
 										size="icon"
-										className="size-7 shrink-0 rounded-full [&>svg]:p-0"
+										className="size-7 shrink-0 rounded-full [&>svg]:!size-icon-sm [&>svg]:p-0"
 										onClick={() => fileInputRef.current?.click()}
 										disabled={isDisabled}
 										aria-label="Attach files"
 									>
-										<ImageIcon className="h-4 w-4" />
+										<ImageIcon />
 									</Button>
 								</>
 							)}
@@ -653,11 +653,11 @@ export const AgentChatInput = memo<AgentChatInputProps>(
 								<Button
 									size="icon"
 									variant="default"
-									className="size-7 rounded-full transition-colors [&>svg]:p-0"
+									className="size-7 rounded-full transition-colors [&>svg]:!size-3 [&>svg]:p-0"
 									onClick={onInterrupt}
 									disabled={isInterruptPending}
 								>
-									<Square className="h-3 w-3 fill-current" />
+									<Square className="fill-current" />
 									<span className="sr-only">Stop</span>
 								</Button>
 							)}
@@ -665,7 +665,7 @@ export const AgentChatInput = memo<AgentChatInputProps>(
 								<Button
 									size="icon"
 									variant="default"
-									className="size-7 rounded-full transition-colors [&>svg]:!size-6 flex items-center justify-center"
+									className="size-7 rounded-full transition-colors [&>svg]:!size-5 [&>svg]:p-0"
 									onClick={handleSubmit}
 									disabled={!canSend}
 								>