{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "permission-primer",
  "title": "Permission primer",
  "description": "shown BEFORE the OS dialog · the skip is not optional",
  "dependencies": [
    "lucide-react-native@^1.21.0"
  ],
  "registryDependencies": [
    "@kit-native/button",
    "@kit-native/lib-native",
    "@kit-native/lib-utils",
    "@kit-native/sheet",
    "@kit-native/spot",
    "@kit-native/text"
  ],
  "files": [
    {
      "path": "components/kit/permission-primer.tsx",
      "content": "import { Sheet } from '@/components/kit/sheet';\nimport { Spot } from '@/components/kit/spot';\nimport { Button } from '@/components/ui/button';\nimport { Text } from '@/components/ui/text';\nimport type { CapabilityId } from '@/lib/native';\nimport { cn } from '@/lib/utils';\nimport { BellIcon, CameraIcon, ImageIcon, ScanFaceIcon, Share2Icon, type LucideIcon } from 'lucide-react-native';\nimport { Pressable, View } from 'react-native';\n\ntype PrimerCopy = { icon: LucideIcon; title: string; body: string; allow: string; skip: string };\n\n/**\n * Keep these bodies in step with the permission strings in app.json. The primer and the\n * OS dialog saying the same thing is what earns the grant.\n */\nexport const PRIMER_COPY: Record<CapabilityId, PrimerCopy> = {\n  camera: {\n    icon: CameraIcon,\n    title: 'Use the camera?',\n    body: 'We use the camera to scan codes and take photos in this prototype. Nothing is uploaded anywhere.',\n    allow: 'Allow camera',\n    skip: 'Use a sample photo',\n  },\n  photos: {\n    icon: ImageIcon,\n    title: 'Access your photos?',\n    body: 'Pick a photo from your library to see it in place. It stays on this device.',\n    allow: 'Choose a photo',\n    skip: 'Use a sample photo',\n  },\n  biometrics: {\n    icon: ScanFaceIcon,\n    title: 'Unlock with Face ID?',\n    body: 'Face ID keeps this section private without a password. Your face never leaves the device.',\n    allow: 'Use Face ID',\n    skip: 'Use a passcode instead',\n  },\n  notify: {\n    icon: BellIcon,\n    title: 'Send you alerts?',\n    body: 'Alerts let this prototype tell you when something changes. You can turn them off at any time.',\n    allow: 'Allow alerts',\n    skip: 'Show them in the app instead',\n  },\n  share: {\n    icon: Share2Icon,\n    title: 'Share this?',\n    body: 'Opens your device share sheet so you can send this wherever you like.',\n    allow: 'Share',\n    skip: 'Copy the link instead',\n  },\n};\n\ntype Props = {\n  capability: CapabilityId;\n  /** `inline` fills the space the feature would occupy; `sheet` slides up over the screen. */\n  variant?: 'inline' | 'sheet';\n  /** Sheet variant only. */\n  open?: boolean;\n  onClose?: () => void;\n  title?: string;\n  body?: string;\n  /** The primary CTA — this is what triggers the OS dialog. */\n  onAllow: () => void;\n  /** Always rendered. Runs the simulated path so the prototype keeps moving. */\n  onSkip: () => void;\n  skipLabel?: string;\n  className?: string;\n};\n\n/**\n * Explains why a permission is needed before the OS asks, and always offers a way past it.\n *\n * Show this instead of triggering the system dialog cold. The skip is not optional: a\n * prototype must never dead-end on a permission the viewer declined.\n */\nexport function PermissionPrimer({\n  capability,\n  variant = 'inline',\n  open = false,\n  onClose,\n  title,\n  body,\n  onAllow,\n  onSkip,\n  skipLabel,\n  className,\n}: Props) {\n  const copy = PRIMER_COPY[capability];\n  const content = (\n    <View className={cn('items-center gap-2 px-6 py-8', className)}>\n      <Spot icon={copy.icon} size=\"lg\" className=\"mb-4\" />\n      <Text variant=\"h4\" className=\"text-center\">\n        {title ?? copy.title}\n      </Text>\n      <Text className=\"text-muted-foreground max-w-xs text-center\">{body ?? copy.body}</Text>\n      <Button onPress={onAllow} className=\"mt-4 w-full max-w-xs\">\n        <Text>{copy.allow}</Text>\n      </Button>\n      <Pressable onPress={onSkip} accessibilityRole=\"button\" className=\"mt-1 min-h-11 justify-center\">\n        <Text className=\"text-muted-foreground text-sm font-semibold\">{skipLabel ?? copy.skip}</Text>\n      </Pressable>\n    </View>\n  );\n\n  if (variant === 'sheet') {\n    return (\n      <Sheet open={open} onClose={onClose ?? onSkip}>\n        {content}\n      </Sheet>\n    );\n  }\n  return content;\n}\n",
      "type": "registry:component",
      "target": "components/kit/permission-primer.tsx"
    }
  ],
  "meta": {
    "exports": [
      "PermissionPrimer"
    ],
    "api": "<PermissionPrimer capability variant=\"inline|sheet\" onAllow onSkip skipLabel? />"
  },
  "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": [
    "native"
  ],
  "type": "registry:component"
}