{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "success-screen",
  "title": "Success screen",
  "description": "the one success template",
  "dependencies": [
    "lucide-react-native@^1.21.0"
  ],
  "registryDependencies": [
    "@kit-native/lib-utils",
    "@kit-native/spinner",
    "@kit-native/spot",
    "@kit-native/text"
  ],
  "files": [
    {
      "path": "components/kit/success-screen.tsx",
      "content": "import { Spinner } from '@/components/kit/spinner';\nimport { Spot } from '@/components/kit/spot';\nimport { Text } from '@/components/ui/text';\nimport { cn } from '@/lib/utils';\nimport { CheckIcon } from 'lucide-react-native';\nimport * as React from 'react';\nimport { View } from 'react-native';\n\ntype Props = {\n  title: string;\n  body?: string;\n  /** Big primary-coloured amount between title and body. */\n  amount?: string;\n  amountSubtitle?: string;\n  /** Spinner instead of the check; hides text — for in-flight operations. */\n  loading?: boolean;\n  /** Extra content under the body (SummaryCard, buttons…). */\n  children?: React.ReactNode;\n  className?: string;\n};\n\n/** The one success template. Centred check, title, optional amount, body. Actions go in a StickyBottomBar. */\nexport function SuccessScreen({ title, body, amount, amountSubtitle, loading, children, className }: Props) {\n  return (\n    <View className={cn('flex-1 items-center justify-center px-6', className)}>\n      {loading ? (\n        <View className=\"bg-muted mb-7 size-24 items-center justify-center rounded-full\">\n          <Spinner size=\"large\" />\n        </View>\n      ) : (\n        <Spot icon={CheckIcon} size=\"xl\" tone=\"success\" className=\"mb-7\" />\n      )}\n      {!loading ? (\n        <View className=\"w-full max-w-xs items-center gap-2\">\n          <Text variant=\"h3\" className=\"text-center\">\n            {title}\n          </Text>\n          {amount ? <Text className=\"text-primary text-center text-4xl font-bold\">{amount}</Text> : null}\n          {amountSubtitle ? <Text className=\"text-muted-foreground text-center\">{amountSubtitle}</Text> : null}\n          {body ? <Text className=\"text-muted-foreground text-center\">{body}</Text> : null}\n          {children ? <View className=\"mt-4 w-full\">{children}</View> : null}\n        </View>\n      ) : null}\n    </View>\n  );\n}\n",
      "type": "registry:component",
      "target": "components/kit/success-screen.tsx"
    }
  ],
  "meta": {
    "exports": [
      "SuccessScreen"
    ],
    "api": "<SuccessScreen title body? amount? amountSubtitle? loading?>{extra}</SuccessScreen>"
  },
  "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": [
    "feedback"
  ],
  "type": "registry:component"
}