DateTimeInput

DateTimeInput

Date and time input for scheduling workflows that need one combined datetime value. It reuses the RNUI calendar sheet and time wheels.

Live preview

Date, range, and datetime field shapes.

Scheduling

Due dateJul 18, 2026Optional fields can show a clear affordance in native.Reporting periodJul 1, 2026 - Jul 31, 2026Starts atJul 18, 2026, 09:30

Import

import { DateTimeInput } from '@truongdq01/ui';

Usage

import { DateTimeInput } from '@truongdq01/ui';
import { useState } from 'react';

export function StartsAtField() {
  const [startsAt, setStartsAt] = useState<Date | null>(null);

  return (
    <DateTimeInput
      label="Starts at"
      value={startsAt}
      onChange={setStartsAt}
      placeholder="Pick date and time"
      minuteInterval={15}
      is24Hour
    />
  );
}

Native demos: apps/example → DateTimeInput screen.