From d903c7f905eae617123356fdfdf09c3075e9cae1 Mon Sep 17 00:00:00 2001
From: Mohamed Bassem <me@mbassem.com>
Date: Sun, 25 May 2025 12:31:51 +0000
Subject: fix: Fix end icon in smart list input overlapping with text. Fixes
 #1379

---
 apps/web/components/ui/input.tsx | 16 ++++++----------
 1 file changed, 6 insertions(+), 10 deletions(-)

(limited to 'apps/web/components/ui/input.tsx')

diff --git a/apps/web/components/ui/input.tsx b/apps/web/components/ui/input.tsx
index 09f9def9..66cd1108 100644
--- a/apps/web/components/ui/input.tsx
+++ b/apps/web/components/ui/input.tsx
@@ -1,23 +1,19 @@
 import * as React from "react";
 import { cn } from "@/lib/utils";
-import { LucideIcon } from "lucide-react";
 
 export interface InputProps
   extends React.InputHTMLAttributes<HTMLInputElement> {
-  startIcon?: LucideIcon;
-  endIcon?: LucideIcon;
+  startIcon?: React.ReactNode;
+  endIcon?: React.ReactNode;
 }
 
 const Input = React.forwardRef<HTMLInputElement, InputProps>(
   ({ className, type, startIcon, endIcon, ...props }, ref) => {
-    const StartIcon = startIcon;
-    const EndIcon = endIcon;
-
     return (
       <div className="relative w-full">
-        {StartIcon && (
+        {startIcon && (
           <div className="absolute left-2 top-1/2 -translate-y-1/2 transform">
-            <StartIcon size={18} className="text-muted-foreground" />
+            {startIcon}
           </div>
         )}
         <input
@@ -31,9 +27,9 @@ const Input = React.forwardRef<HTMLInputElement, InputProps>(
           ref={ref}
           {...props}
         />
-        {EndIcon && (
+        {endIcon && (
           <div className="absolute right-3 top-1/2 -translate-y-1/2 transform">
-            <EndIcon className="text-muted-foreground" size={18} />
+            {endIcon}
           </div>
         )}
       </div>
-- 
cgit v1.2.3-70-g09d2

