Files
graff-mate-client/src/components/SearchInput.tsx
T
2025-03-20 14:26:57 +05:00

26 lines
668 B
TypeScript

import React, { useState } from "react";
import SearchIcon from "./icons/SearchIcon";
function SearchInput(props: React.InputHTMLAttributes<HTMLInputElement>) {
const [value, setValue] = useState("");
return (
<div className="relative">
<input
type="text"
className="outline-none pl-2.5 pr-8 pt-[7px] pb-2 bg-[#F6F6F6] rounded-lg leading-none text-sm"
value={value}
onChange={(e) => setValue(e.target.value)}
{...props}
/>
{!value && (
<div className="text-[#858585] absolute top-0 right-0 p-2">
<SearchIcon />
</div>
)}
</div>
);
}
export default SearchInput;