InfoRow — React Native component

Installation

Install just this component (copies the source into your project, no npm dependency)

npx orn-ui add info-row

Or install the whole package and import it

pnpm add orn-ui
import { InfoRow } from 'orn-ui/info-row';

Depends on:core (theme + icons)avatar

Usage

when to use — Read-only detail rows with an icon: contact data, order metadata.
placeholder — Required, because a missing value is the common case — it makes the gap explicit instead of leaving a blank.

Demo clip not recorded yet — see MEDIA.md

Variants

With value

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

Missing value

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

Different icon

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

Full demo source

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>`	—	—