{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "date-picker",
  "title": "Date Picker",
  "description": "A controlled date-only picker with local form serialization, clearing and constrained dates.",
  "dependencies": [
    "@daypicker/react@^10.0.0"
  ],
  "registryDependencies": [
    "@neumorphism-ui/utils",
    "@neumorphism-ui/button",
    "@neumorphism-ui/calendar",
    "@neumorphism-ui/popover"
  ],
  "files": [
    {
      "path": "src/components/ui/date-picker.tsx",
      "content": "\"use client\";\n\nimport * as React from \"react\";\nimport type { Locale, Matcher } from \"@daypicker/react\";\nimport { cn } from \"@/lib/utils\";\nimport { Button } from \"@/components/ui/button\";\nimport { Calendar } from \"@/components/ui/calendar\";\nimport { Popover, PopoverContent, PopoverTitle, PopoverTrigger } from \"@/components/ui/popover\";\n\ntype DatePickerProps = {\n  label: string;\n  value?: Date;\n  onValueChange: (value: Date | undefined) => void;\n  id?: string;\n  name?: string;\n  className?: string;\n  placeholder?: string;\n  clearLabel?: string;\n  disabled?: boolean;\n  invalid?: boolean;\n  describedBy?: string;\n  locale?: Partial<Locale>;\n  disabledDates?: Matcher | Matcher[];\n  startMonth?: Date;\n  endMonth?: Date;\n};\n\n// Date-only form values must not cross a UTC boundary through toISOString().\nfunction dateOnly(value: Date) {\n  return `${value.getFullYear()}-${String(value.getMonth() + 1).padStart(2, \"0\")}-${String(value.getDate()).padStart(2, \"0\")}`;\n}\n\nfunction DatePicker({ label, value, onValueChange, id, name, className, placeholder = \"Select date\", clearLabel = \"Clear date\", disabled = false, invalid, describedBy, locale, disabledDates, startMonth, endMonth }: DatePickerProps) {\n  const [open, setOpen] = React.useState(false);\n  const trigger = React.useRef<HTMLButtonElement>(null);\n  const display = value?.toLocaleDateString(locale?.code ?? \"en-US\", { year: \"numeric\", month: \"short\", day: \"numeric\" });\n  return <div data-slot=\"date-picker\" className={cn(\"flex min-w-0 items-center gap-2\", className)}>\n    {name && <input type=\"hidden\" name={name} value={value ? dateOnly(value) : \"\"} disabled={disabled} />}\n    <Popover open={open && !disabled} onOpenChange={setOpen}>\n      <PopoverTrigger render={<Button ref={trigger} id={id} disabled={disabled} aria-invalid={invalid || undefined} aria-describedby={describedBy} aria-label={`${label}: ${display ?? placeholder}`} className=\"min-w-0 flex-1 justify-between px-3 whitespace-nowrap text-start font-normal shadow-[var(--neu-shadow-inset)] [background-image:var(--neu-fill-inset)] hover:shadow-[var(--neu-shadow-inset)] aria-invalid:border-[var(--destructive)]\" />}>\n        <span className=\"min-w-0 flex-1 truncate\">{display ?? placeholder}</span>\n        <svg aria-hidden=\"true\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"1.6\"><rect x=\"3\" y=\"5\" width=\"18\" height=\"16\" rx=\"3\" /><path d=\"M7 3v4m10-4v4M3 11h18\" /></svg>\n      </PopoverTrigger>\n      <PopoverContent align=\"start\" className=\"w-auto gap-0 p-1\">\n        <PopoverTitle className=\"sr-only\">{label}</PopoverTitle>\n        <Calendar mode=\"single\" required autoFocus selected={value} defaultMonth={value ?? startMonth} onSelect={date => { onValueChange(date); setOpen(false); }} locale={locale} disabled={disabledDates} startMonth={startMonth} endMonth={endMonth} className=\"border-0 [box-shadow:none]\" />\n      </PopoverContent>\n    </Popover>\n    {value && <Button variant=\"ghost\" size=\"icon\" disabled={disabled} aria-label={clearLabel} onClick={() => { onValueChange(undefined); trigger.current?.focus(); }}><svg aria-hidden=\"true\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"1.8\" strokeLinecap=\"round\"><path d=\"m6 6 12 12M18 6 6 18\" /></svg></Button>}\n  </div>;\n}\n\nexport { DatePicker };\nexport type { DatePickerProps };\n",
      "type": "registry:ui"
    }
  ],
  "type": "registry:ui"
}