{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "list-row",
  "title": "List row",
  "description": "ONE row · the canonical row · `last` on the final row · `select={{mode,selected}}` makes it a radio/checkbox row",
  "dependencies": [
    "lucide-react-native@^1.21.0"
  ],
  "registryDependencies": [
    "@kit-native/icon",
    "@kit-native/lib-utils",
    "@kit-native/text"
  ],
  "files": [
    {
      "path": "components/kit/list-row.tsx",
      "content": "import { Icon } from '@/components/ui/icon';\nimport { Text } from '@/components/ui/text';\nimport { cn } from '@/lib/utils';\nimport { CheckIcon, ChevronRightIcon } from 'lucide-react-native';\nimport type { ReactNode } from 'react';\nimport { Pressable, View } from 'react-native';\n\ntype Props = {\n  /** Leading visual — usually an IconCircle or Avatar. */\n  leading?: ReactNode;\n  /** Turns the row into a choice. The whole row is the control, so pass `onPress` too. */\n  select?: { mode: 'radio' | 'checkbox'; selected: boolean };\n  title: string;\n  subtitle?: string;\n  /** Right-aligned value. */\n  value?: string;\n  valueClassName?: string;\n  /** Small line under the value. */\n  sublabel?: string;\n  sublabelClassName?: string;\n  /** Custom trailing content; replaces value/sublabel. */\n  trailing?: ReactNode;\n  /** Show a chevron (navigation rows). */\n  chevron?: boolean;\n  onPress?: () => void;\n  disabled?: boolean;\n  /** Suppress the bottom divider (last row in a card). */\n  last?: boolean;\n  className?: string;\n};\n\n/**\n * The canonical list row: leading · title/subtitle · value/sublabel or trailing.\n * 12px vertical padding, hairline divider. Never rebuild this inline.\n */\nexport function ListRow({\n  leading,\n  select,\n  title,\n  subtitle,\n  value,\n  valueClassName,\n  sublabel,\n  sublabelClassName,\n  trailing,\n  chevron,\n  onPress,\n  disabled,\n  last,\n  className,\n}: Props) {\n  const body = (\n    <>\n      {leading}\n      <View className=\"flex-1\">\n        <Text className=\"font-medium\" numberOfLines={1}>\n          {title}\n        </Text>\n        {subtitle ? (\n          <Text className=\"text-muted-foreground text-sm\" numberOfLines={1}>\n            {subtitle}\n          </Text>\n        ) : null}\n      </View>\n      {trailing ??\n        (value || sublabel ? (\n          <View className=\"items-end\">\n            {value ? <Text className={cn('font-semibold', valueClassName)}>{value}</Text> : null}\n            {sublabel ? <Text className={cn('text-muted-foreground text-sm', sublabelClassName)}>{sublabel}</Text> : null}\n          </View>\n        ) : null)}\n      {select ? (\n        <View\n          className={cn(\n            'size-6 items-center justify-center border-2',\n            select.mode === 'radio' ? 'rounded-full' : 'rounded-md',\n            select.selected ? 'border-foreground bg-foreground' : 'border-border'\n          )}>\n          {select.selected ? (\n            select.mode === 'radio' ? (\n              <View className=\"bg-background size-2 rounded-full\" />\n            ) : (\n              <Icon as={CheckIcon} size={14} className=\"text-background\" />\n            )\n          ) : null}\n        </View>\n      ) : null}\n      {chevron ? <Icon as={ChevronRightIcon} className=\"text-muted-foreground\" size={18} /> : null}\n    </>\n  );\n  const base = cn('min-h-14 flex-row items-center gap-3 py-3', !last && 'border-border border-b', disabled && 'opacity-50', className);\n  if (onPress) {\n    return (\n      <Pressable\n        accessibilityRole={select ? (select.mode === 'radio' ? 'radio' : 'checkbox') : 'button'}\n        aria-checked={select ? select.selected : undefined}\n        aria-disabled={!!disabled}\n        onPress={onPress}\n        disabled={disabled}\n        className={cn(base, 'active:opacity-70')}>\n        {body}\n      </Pressable>\n    );\n  }\n  return <View className={base}>{body}</View>;\n}\n",
      "type": "registry:component",
      "target": "components/kit/list-row.tsx"
    }
  ],
  "meta": {
    "exports": [
      "ListRow"
    ],
    "api": "<ListRow leading title subtitle? value? sublabel? trailing? chevron? onPress? last? />"
  },
  "docs": "Run `npx expo install --fix` afterwards so Expo SDK packages match your SDK. Needs the kit theme (`@kit-native/theme`) and `KitThemeProvider` from `@kit-native/lib-theme-context` at the root.",
  "categories": [
    "data"
  ],
  "type": "registry:component"
}