# ObservationDetail.DateTime

Canonical page: https://docs.ovok.com/native-sdk/guide/components/observation-detail/date-time

A date and time display component with flexible formatting options and fallback content support. Designed for healthcare observation timestamps with localization and conditional rendering capabilities.

## Basic Example [#basic-example]

```typescript
import { ObservationDetail } from "@ovok/native";
import * as React from "react";

const BasicTimestamp = () => (
  <ObservationDetail.DateTime dateTime="2024-01-15T10:30:00Z" />
);

export default BasicTimestamp;
```

## Props [#props]

Every prop, with its type and description, is listed in the [`@ovok/native/observation-detail` API reference](/native-sdk/reference/observation-detail).

## Component Behavior [#component-behavior]

### Date Formatting [#date-formatting]

- Uses `date-fns` for reliable date formatting
- Supports all date-fns format patterns
- `date-fns/format` throws for an invalid date string; validate input before rendering
- Provides localized date display

### Conditional Rendering [#conditional-rendering]

- Shows formatted date when `dateTime` is provided
- Renders `children` content when `dateTime` is omitted. The fallback is returned as
  a bare fragment, so a plain string must be wrapped in a text component by the host;
  otherwise React Native can reject the raw string outside `<Text>`.