Item

At a glance

• A generic horizontal row for settings lists, menus, and data rows.
• Four horizontal zones: leading | title + description | trailing | chevron.
• All zones except title are optional.
• Becomes a tappable Pressable when onPress is provided.

Preview

Usage

import { Item } from '@nori-ui/core';
 
// Navigation row with chevron
<Item
  title="Profile"
  description="Manage your account settings"
  chevron
  onPress={() => navigate('/profile')}
/>
 
// With leading icon and trailing badge
<Item
  leading={<UserIcon size={24} />}
  title="Manuel Bieh"
  description="manuel@example.com"
  trailing={<Badge tone="primary">Admin</Badge>}
  chevron
  onPress={() => navigate('/users/1')}
/>
 
// Non-tappable informational row
<Item
  title="Version"
  trailing={<Text>1.0.0</Text>}
/>

chevron

Set chevron={true} (or just chevron as a boolean shorthand) to render a right-pointing arrow at the trailing edge — the standard affordance for navigation rows that drill deeper.

disabled

Set disabled={true} to prevent interaction. The row renders at reduced opacity and onPress is suppressed. Useful for locked entries in a settings list.

Props