Atoms
Calendar
A date picker calendar component.
shadcn/uiBased on shadcn/ui with Formance brand styling.
Installation#
npx shadcn@latest add @formance/calendarInstall the following dependencies:
npm install react-day-picker lucide-react class-variance-authority radix-uiCopy and paste the following code into your project.
Update the import paths to match your project setup.
Usage#
import { Calendar } from '@/components/ui/calendar'const [date, setDate] = React.useState<Date | undefined>(new Date())
return (
<Calendar
mode="single"
selected={date}
onSelect={setDate}
/>
)