# InfoRow

> Molecule — orn-ui

> ⚠️ Requires <UIProvider>: This component (like every orn-ui component) must render inside a <UIProvider> ancestor, or it throws at runtime. See https://orn-ui-docs.vercel.app/getting-started.md

> Runs on Expo SDK 54, 55, 56 and 57, and on bare React Native >=0.81 with react >=19.1. No native modules — works in Expo Go, no prebuild.

## Installation

Install just this component (copies the source into your project, no npm dependency)
```bash
npx orn-ui add info-row
```

Or install the whole package and import it
```tsx
pnpm add orn-ui
import { InfoRow } from 'orn-ui/info-row';
```

Depends on: core (theme + icons), avatar

## Variants

### With value

```tsx
<InfoRow icon="info" label="Email" value="jane@example.com" placeholder="No email" />
```

### Missing value

```tsx
<InfoRow icon="info" label="Phone" value={undefined} placeholder="No phone number" />
```

### Different icon

```tsx
<InfoRow icon="check" label="Status" value="Verified" placeholder="Unverified" />
```

## Full demo source

```tsx
const variants: VariantDef[] = [
  { label: 'With value', content: <InfoRow icon="info" label="Email" value="jane@example.com" placeholder="No email" /> },
  { label: 'Missing value', content: <InfoRow icon="info" label="Phone" value={undefined} placeholder="No phone number" /> },
  { label: 'Different icon', content: <InfoRow icon="check" label="Status" value="Verified" placeholder="Unverified" /> },
];
return <VariantList variants={variants} />;
```

## Props

| Name | Type | Default | Description |
|---|---|---|---|
| `icon` | `IconName` | — | — |
| `label` | `string` | — | — |
| `value` | `string` | — | — |
| `placeholder` | `string` | — | — |
| `style?` | `StyleProp<ViewStyle>` | — | — |
