fix: text placement

src/components/input/SearchBox.tsx

@@ -1,29 +1,38 @@
-'use client';
+'use client'
 
-import React from 'react';
+import React from 'react'
-import SearchIcon from '../icons/SearchIcon';
+import SearchIcon from '../icons/SearchIcon'
-import clsx from 'clsx';
+import clsx from 'clsx'
 
-interface SearchboxProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'results'> {
+interface SearchboxProps
-  placeholder?: string;
+  extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'results'> {
-  onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
+  placeholder?: string
-};
+  onChange: (e: React.ChangeEvent<HTMLInputElement>) => void
+}
 
-export default function SearchBox({ className, value, placeholder = '', onChange, ...props }: SearchboxProps) {
+export default function SearchBox ({
+  className,
+  value,
+  placeholder = '',
+  onChange,
+  ...props
+}: SearchboxProps) {
   return (
-    <div className={clsx(
+    <div
-      "bg-container inline-flex rounded-xl px-4 h-10 w-full items-center content-center",
+      className={clsx(
-      className
+        'bg-container inline-flex rounded-xl px-4 h-10 w-full items-center content-center',
-    )}>
+        className
-      <SearchIcon stroke="#8C90A3" />
+      )}
+    >
+      <SearchIcon stroke='#8C90A3' />
       <input
         onChange={onChange}
         value={value}
         placeholder={placeholder}
-        className="text-[#8C90A3] block outline-none border-none focus:ring-0 focus:outline-none text-sm px-[7px] h-full items-center w-full"
+        className='text-[#8C90A3] pt-1 block outline-none border-none focus:ring-0 focus:outline-none text-sm px-[7px] h-full items-center w-full'
-        type="search"
+        type='search'
         {...props}
       />
     </div>
-  );
+  )
 }