{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "date-picker",
  "title": "Date Picker",
  "description": "Single-date picker built with the shared calendar and popover primitives.",
  "dependencies": [
    "@vllnt/ui@^0.3.0"
  ],
  "registryDependencies": [],
  "files": [
    {
      "path": "registry/default/date-picker/date-picker.tsx",
      "content": "\"use client\";\n\nimport * as React from \"react\";\n\nimport { CalendarIcon } from \"lucide-react\";\n\nimport { cn } from \"@vllnt/ui\";\nimport { Button } from \"@vllnt/ui\";\nimport { Calendar, type CalendarProps } from \"@vllnt/ui\";\nimport { Popover, PopoverContent, PopoverTrigger } from \"@vllnt/ui\";\n\nconst defaultDateFormatter = new Intl.DateTimeFormat(\"en-US\", {\n  day: \"numeric\",\n  month: \"long\",\n  year: \"numeric\",\n});\n\nexport type DatePickerProps = {\n  buttonClassName?: string;\n  calendarProps?: Omit<CalendarProps, \"mode\" | \"onSelect\" | \"selected\">;\n  className?: string;\n  onValueChange?: (date?: Date) => void;\n  placeholder?: string;\n  value?: Date;\n};\n\nconst DatePicker = ({\n  buttonClassName,\n  calendarProps,\n  className,\n  onValueChange,\n  placeholder = \"Pick a date\",\n  ref: reference,\n  value,\n}: DatePickerProps & { ref?: React.Ref<HTMLButtonElement> }) => {\n  const [open, setOpen] = React.useState(false);\n  const [internalValue, setInternalValue] = React.useState<Date | undefined>(\n    () => value,\n  );\n  const selectedDate = value ?? internalValue;\n\n  const handleSelect = (nextDate: Date | undefined) => {\n    if (value === undefined) {\n      setInternalValue(nextDate);\n    }\n\n    onValueChange?.(nextDate);\n\n    if (nextDate) {\n      setOpen(false);\n    }\n  };\n\n  return (\n    <Popover onOpenChange={setOpen} open={open}>\n      <PopoverTrigger asChild>\n        <Button\n          className={cn(\n            \"w-full justify-start text-left font-normal\",\n            !selectedDate && \"text-muted-foreground\",\n            buttonClassName,\n          )}\n          ref={reference}\n          variant=\"outline\"\n        >\n          <CalendarIcon className=\"mr-2 size-4\" />\n          {selectedDate\n            ? defaultDateFormatter.format(selectedDate)\n            : placeholder}\n        </Button>\n      </PopoverTrigger>\n      <PopoverContent align=\"start\" className={cn(\"w-auto p-0\", className)}>\n        <Calendar\n          mode=\"single\"\n          onSelect={handleSelect}\n          selected={selectedDate}\n          {...calendarProps}\n        />\n      </PopoverContent>\n    </Popover>\n  );\n};\nDatePicker.displayName = \"DatePicker\";\n\nexport { DatePicker };\n",
      "type": "registry:component"
    }
  ],
  "type": "registry:component",
  "version": "0.3.0",
  "stability": "stable"
}
