Input Group

[Judge-Paul]

I am thinking you can create an Input group component so we can build things like

By just adding the icon and input type

[NjengaFelix]

The shadcn-ui landing page has an example of this search input.

I have highlighted the search input below

I have shared the code snippet of the search input field from the mail component example in shadcn-ui github examples

import {
  Search,
} from "lucide-react"

<div className="relative">
     <Search className="absolute left-2 top-2.5 h-4 w-4 text-muted-foreground" />
      <Input placeholder="Search" className="pl-8" />
</div>

They have simply used a lucide icon and passed the relevant styles using tailwind.

I am therefore assuming, this input can't be supported because:

1. The search input icon varies
2. They wouldn't want to support icons that require importation.

My response is based on assumptions but not facts

[Judge-Paul]

Thanks for this, this is exactly what I was looking for

[arnilrashid]

https://github.com/arnilrashid/SearchGroup-react-js