Team List 4 - Search and role filterPro
A searchable team list with a name/email search box, a role select filter, a clear-filters chip and a result count, with matching text highlighted in each row. Use it for larger teams where people need to find a specific colleague fast.
About Team List 4
A searchable team list with a name/email search box, a role select filter, a clear-filters chip and a result count, with matching text highlighted in each row. Use it for larger teams where people need to find a specific colleague fast.
Team List 4 is a team list block for React and Tailwind CSS, included in Chocolate UI Pro. It ships as 104 lines of TypeScript you own: every piece of copy is a prop with a sensible default, so you can drop it in and replace the content without touching the layout.
- team
- search
- filter
- roles
- list
- app
Installation
- Set up your project with
npx chocolateui initandnpx chocolateui login(see the installation guide). - Run the Chocolate UI CLI:
npx chocolateui add team-list-04Dependencies installed automatically: lucide-react.
Uses: avatar, input, reveal, select, utils.
Usage
import TeamList04 from "@/components/blocks/team-list-04"
export default function Page() {
return <TeamList04 />
}