{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "date-picker",
  "title": "Date picker",
  "description": "field trigger → Calendar in a Sheet",
  "dependencies": [
    "lucide-react-native@^1.21.0"
  ],
  "registryDependencies": [
    "@kit-native/calendar",
    "@kit-native/icon",
    "@kit-native/lib-utils",
    "@kit-native/sheet",
    "@kit-native/text"
  ],
  "files": [
    {
      "path": "components/kit/date-picker.tsx",
      "content": "import { Calendar } from '@/components/kit/calendar';\nimport { Sheet } from '@/components/kit/sheet';\nimport { Icon } from '@/components/ui/icon';\nimport { Text } from '@/components/ui/text';\nimport { cn } from '@/lib/utils';\nimport { CalendarIcon } from 'lucide-react-native';\nimport * as React from 'react';\nimport { Pressable, View } from 'react-native';\n\ntype Props = {\n  value?: Date;\n  onChange: (date: Date) => void;\n  placeholder?: string;\n  title?: string;\n  format?: (date: Date) => string;\n  className?: string;\n};\n\nconst defaultFormat = (d: Date) => d.toLocaleDateString(undefined, { day: 'numeric', month: 'short', year: 'numeric' });\n\n/** Input-shaped trigger that opens a Calendar in a Sheet. Matches the Input container. */\nexport function DatePicker({ value, onChange, placeholder = 'Select a date', title = 'Pick a date', format = defaultFormat, className }: Props) {\n  const [open, setOpen] = React.useState(false);\n  return (\n    <>\n      <Pressable\n        accessibilityRole=\"button\"\n        onPress={() => setOpen(true)}\n        className={cn('border-input bg-background h-control-sm flex-row items-center gap-2 rounded-md border px-3 active:bg-accent', className)}>\n        <Icon as={CalendarIcon} size={16} className=\"text-muted-foreground\" />\n        <Text className={cn('flex-1', !value && 'text-muted-foreground')}>{value ? format(value) : placeholder}</Text>\n      </Pressable>\n      <Sheet open={open} onClose={() => setOpen(false)} title={title}>\n        <View className=\"px-5 pb-2\">\n          <Calendar\n            value={value}\n            onChange={(d) => {\n              onChange(d);\n              setOpen(false);\n            }}\n          />\n        </View>\n      </Sheet>\n    </>\n  );\n}\n",
      "type": "registry:component",
      "target": "components/kit/date-picker.tsx"
    }
  ],
  "meta": {
    "exports": [
      "DatePicker"
    ],
    "api": "<DatePicker value onChange placeholder? />"
  },
  "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": [
    "inputs"
  ],
  "type": "registry:component"
}