From 3f70f6e85e7342932ad95db3671a55fd0db02da6 Mon Sep 17 00:00:00 2001
From: Saravana Achu Mac <saravanakumardb1@gmail.com>
Date: Thu, 7 May 2026 11:37:49 -0700
Subject: [PATCH] refactor(ui): use product primitives in header search

---
 web/src/components/layout/Header.tsx | 11 ++---------
 1 file changed, 2 insertions(+), 9 deletions(-)

diff --git a/web/src/components/layout/Header.tsx b/web/src/components/layout/Header.tsx
index 8e10f16..ea6bd8c 100644
--- a/web/src/components/layout/Header.tsx
+++ b/web/src/components/layout/Header.tsx
@@ -4,7 +4,7 @@ import { useAppContext } from '../../context/AppContext';
 import { useNavigate } from 'react-router-dom';
 import { fetchMarketIndices, type IndexSnapshot } from '../../lib/marketApi';
 import { useTheme } from '../theme/ThemeProvider';
-import { Button } from '../ui/button';
+import { Button, Input } from '../ui/Primitives';
 
 
 export function Header() {
@@ -86,7 +86,7 @@ export function Header() {
             pointerEvents: 'none',
           }}
         />
-        <input
+        <Input
           ref={inputRef}
           aria-label="Search ticker"
           type="text"
@@ -101,14 +101,7 @@ export function Header() {
             width: '100%',
             paddingLeft: 34,
             paddingRight: 12,
-            paddingTop: 8,
-            paddingBottom: 8,
-            border: '1px solid var(--border)',
-            borderRadius: 8,
             fontSize: 13,
-            outline: 'none',
-            color: 'var(--foreground)',
-            background: 'var(--input)',
             boxSizing: 'border-box',
             fontFamily: 'inherit',
           }}