Skip to main content
161

Search Lumen

Find components, APIs, guides, and recipes.

GitHub
React Native docs
FormsReact Native

Date field

Select a native date with bounds and validation context.

Public APILumenDateFieldReact Native

Native example

Use Date field

Use for native date input that needs Lumen supporting and validation context. SwiftUI also supports time and combined date-time input.

View verified React Native runtime capture
Date field rendered in the Expo web renderer Lumen playground
Verified runtime captureExpo web renderer
tsx
<LumenDateField
  label="Release date"
  value={releaseDate}
  onValueChange={setReleaseDate}
  minimumDate={new Date()}
  description="Choose when this version becomes available."
/>

Reference

Public API

The primary shared and platform-specific options exposed by LumenDateField.

APIValues or typeDefaultDescription
labelstringRequiredLabels the native date picker.
value / onValueChangeDate | null / callbackRequiredStores the selected native date value.
Chooses the visible date and time parts.
minimumDate / maximumDateDate?undefinedConstrains selection using native picker bounds.
description / errorMessagestring?undefinedShows supporting text or a semantic danger validation message.

Native behavior

Design and accessibility

When to use it

Use for native date input that needs Lumen supporting and validation context. SwiftUI also supports time and combined date-time input.

Accessibility

The native picker retains its label and adjustable behavior. Supporting or validation text remains visible in the same contained group.

Shared component

Available on other platforms

Apple / SwiftUIAndroid / Compose
React Native docsNative primitives