Time Field

The Time Field component provides a time-only input for collecting hour and minute information without a date component.

Basic Usage

With Default Value

Required Field

Read-Only

Field Schema

A time field is authored as TimeFieldMetadata (@object-ui/types), which is the source of truth for the key set: it extends BaseFieldMetadata with a display format.

import type { TimeFieldMetadata } from '@object-ui/types';

const startTime: TimeFieldMetadata = {
  type: 'time',
  name: 'start_time',
  label: 'Start Time',
  placeholder: 'HH:mm',
  required: true,
  format: 'HH:mm',
};

The value being edited, and the className / disabled a host supplies, are not metadata keys — they are runtime widget props. See Field Widget Props.

Time Format

The time field uses 24-hour format: HH:mm

Examples:

• 09:00 - 9:00 AM
• 14:30 - 2:30 PM
• 23:45 - 11:45 PM

Use Cases

• Operating Hours: Business hours, shift times
• Scheduling: Daily task times, recurring events
• Alarms: Reminder times, notification schedules
• Time Tracking: Work start/end times