{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "date-picker",
  "title": "Date Picker",
  "description": "Outline button that opens a calendar and shows the picked date as dd.MM.yyyy.",
  "dependencies": [
    "date-fns",
    "lucide-react"
  ],
  "registryDependencies": [
    "@ikas/button",
    "@ikas/calendar",
    "@ikas/popover",
    "@ikas/utils"
  ],
  "files": [
    {
      "path": "registry/ikas/date-picker.tsx",
      "content": "\"use client\"\n\nimport * as React from \"react\"\nimport { format } from \"date-fns\"\nimport { CalendarIcon } from \"lucide-react\"\n\nimport { cn } from \"@/lib/utils\"\nimport { Button } from \"@/components/ui/button\"\nimport { Calendar } from \"@/components/ui/calendar\"\nimport { Popover, PopoverContent, PopoverTrigger } from \"@/components/ui/popover\"\n\ntype DatePickerProps = {\n  /** Selected date. Leave undefined with defaultValue for an uncontrolled picker. */\n  value?: Date\n  /** Initial date when uncontrolled. */\n  defaultValue?: Date\n  /** Called with the picked date, or undefined when the selection is cleared. */\n  onValueChange?: (value: Date | undefined) => void\n  /** Earliest selectable day; earlier days are disabled. */\n  minDate?: Date\n  /** Latest selectable day; later days are disabled. */\n  maxDate?: Date\n  /** Disables the trigger. */\n  disabled?: boolean\n  /** Trigger text while no date is selected. */\n  placeholder?: string\n  /** date-fns format string for the trigger. */\n  dateFormat?: string\n  /** Popover alignment against the trigger. */\n  align?: \"start\" | \"center\" | \"end\"\n  /** Classes for the trigger button. */\n  className?: string\n  /** Id of the trigger, for a FieldLabel htmlFor. */\n  id?: string\n  /** Marks the trigger invalid inside a Field. */\n  \"aria-invalid\"?: boolean\n}\n\n/** Outline button that opens a calendar in a popover and shows the picked date. */\nfunction DatePicker({\n  value: valueProp,\n  defaultValue,\n  onValueChange,\n  minDate,\n  maxDate,\n  disabled = false,\n  placeholder = \"Tarih seçin\",\n  dateFormat = \"dd.MM.yyyy\",\n  align = \"start\",\n  className,\n  id,\n  \"aria-invalid\": ariaInvalid,\n}: DatePickerProps) {\n  const [open, setOpen] = React.useState(false)\n  const [uncontrolled, setUncontrolled] = React.useState(defaultValue)\n  const value = valueProp !== undefined ? valueProp : uncontrolled\n\n  function select(date: Date | undefined) {\n    setUncontrolled(date)\n    onValueChange?.(date)\n    setOpen(false)\n  }\n\n  const bounds = [minDate && { before: minDate }, maxDate && { after: maxDate }].filter((m) => m !== undefined)\n  // Open on the selected month, else today's month kept inside the bounds.\n  const today = new Date()\n  const month = value ?? (maxDate && today > maxDate ? maxDate : minDate && today < minDate ? minDate : undefined)\n\n  return (\n    <Popover open={open} onOpenChange={setOpen}>\n      <PopoverTrigger asChild>\n        <Button\n          id={id}\n          variant=\"outline\"\n          disabled={disabled}\n          aria-invalid={ariaInvalid}\n          data-empty={!value || undefined}\n          className={cn(\"w-full justify-start font-normal data-empty:text-muted-foreground aria-invalid:ring-3 aria-invalid:ring-destructive/20 sm:w-48\", className)}\n        >\n          <CalendarIcon data-icon=\"inline-start\" className=\"text-icon\" />\n          <span className=\"truncate tabular-nums\">{value ? format(value, dateFormat) : placeholder}</span>\n        </Button>\n      </PopoverTrigger>\n      <PopoverContent align={align} collisionPadding={8} className=\"w-auto p-3\">\n        <Calendar\n          mode=\"single\"\n          selected={value}\n          onSelect={select}\n          defaultMonth={month}\n          startMonth={minDate}\n          endMonth={maxDate}\n          disabled={bounds}\n        />\n      </PopoverContent>\n    </Popover>\n  )\n}\n\nexport { DatePicker, type DatePickerProps }\n",
      "type": "registry:component",
      "target": "@components/ikas/date-picker.tsx"
    }
  ],
  "docs": "https://builders.ikas.com/tr/docs/app-development/ui-kit/components/date-picker",
  "categories": [
    "forms"
  ],
  "type": "registry:component"
}