Popover with a header label, filter bar, and a selectable person list that checks chosen rows.
Assign to
Filter people…
New here? Read the installation guide.
Import & use
import { Form20 } from "@/components/beste/piece/form20";
<Form20
label="Assign to"
query=""
people={[
{
"name": "Beste Sözen",
"initials": "BS",
"imageSrc": "https://oud.pics/sm/l/gmail.jpeg",
"alt": "Beste Sözen",
"selected": true
},
{
"name": "Andrea Kim",
"initials": "AK",
"imageSrc": "https://oud.pics/sm/l/stripe.jpeg",
"alt": "Andrea Kim",
"selected": true
},
{
"name": "Noor Ahmed",
"initials": "NA",
"imageSrc": "https://oud.pics/sm/l/notion.png",
"alt": "Noor Ahmed"
},
{
"name": "Jules Park",
"initials": "JP",
"imageSrc": "https://oud.pics/sm/l/slack.svg",
"alt": "Jules Park"
}
]}
/>