Skip to content
nexubDesign System
v2.4.0

Components · Mobile only · Inputs

Date Time Field

AlphaiOS & Android

Opens the platform date or time picker.

Usage

@nexub/react-nativeWeb: DatePicker
import { DateTimeField } from '@nexub/react-native';

<DateTimeField label="Date" mode="date" value={d} onValueChange={setD} />

Interactive preview of @nexub/react-native rendered for the web. Native chrome (switches, pickers, Liquid Glass) looks like the platform on a device.

On device

Date Time Field on iPhone (iOS simulator)

iPhone (iOS simulator)

Date Time Field on Pixel (Android emulator)

Pixel (Android emulator)

Screenshots from the latest CI run of the showcase app; the live frame renders the same code for the web.

DateTimeField props

DateTimeField props (React Native)
PropTypeDefaultDescription
labelrequiredstring——
valuerequiredDate | null——
onValueChangerequired(value: Date) => void——
mode'date' | 'time''date'—
minimumDateDate——
maximumDateDate——
placeholderstring——
styleStyleProp<ViewStyle>——