We are going to discuss what we have achieved on the project.
12 Jan 2022 18:00 to 19:00
Alert 10 minutes before start
12345678910111213141516171819202122232425262728293031323334353637import { Button } from "ariakit/button"; import { Popover, PopoverArrow, PopoverDescription, PopoverDisclosure, PopoverHeading, usePopoverState, } from "ariakit/popover"; import "./style.css"; export default function Example() { const popover = usePopoverState({ placement: "right", flip: "top bottom", }); return ( <> <PopoverDisclosure state={popover} className="button"> Accept invite </PopoverDisclosure> <Popover state={popover} className="popover"> <PopoverArrow className="arrow" /> <PopoverHeading className="heading">Team meeting</PopoverHeading> <PopoverDescription> We are going to discuss what we have achieved on the project. </PopoverDescription> <div> <p>12 Jan 2022 18:00 to 19:00</p> <p>Alert 10 minutes before start</p> </div> <Button className="button">Accept</Button> </Popover> </> ); }