Component

Date picker sheet

A bottom sheet calendar for choosing a date, time, or both, with month navigation, selection, and disabled ranges styled with the same sheet patterns as the rest of the kit.

Standalone

date picker sheet.tsx

<NativeDatePickerSheet
  open={open}
  onClose={() => setOpen(false)}
  value={date}
  onValueChange={setDate}
  title="Date of birth"
/>

Example

A form opens this sheet for its date field, with a max-date constraint disabling anything in the future.

Start date

date-picker-sheet-example.tsx

<NativeDatePickerSheet
  open={open}
  onClose={() => setOpen(false)}
  value={date}
  onValueChange={setDate}
  title="Start date"
  maxDate={new Date()}
/>

Capabilities

Prop	Type	Description
openrequired	boolean	-
onCloserequired	() => void	-
valuerequired	Date	-
onValueChangerequired	(date: Date) => void	-
mode	DatePickerMode	-
title	string	-
minDate	Date	-
maxDate	Date	-
doneLabel	string	-