{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "z-date-time-picker",
  "title": "Z Date Time Picker",
  "dependencies": [
    "date-fns@4.1.0"
  ],
  "devDependencies": [],
  "registryDependencies": [
    "https://ui.orchid.ai/r/orchid-foundation.json",
    "https://ui.orchid.ai/r/orchid-theme.json",
    "https://ui.orchid.ai/r/z-calendar.json",
    "https://ui.orchid.ai/r/z-popover.json"
  ],
  "files": [
    {
      "path": "registry/ui/orchid/spectrum/molecules/z-date-time-picker/z-date-time-picker.tsx",
      "content": "\"use client\";\nimport { format, setHours, setMinutes } from 'date-fns';\nimport { useState } from 'react';\nimport ZCalendar from \"../../atoms/z-calendar/z-calendar\";\nimport ZPopover from \"../../atoms/z-popover/z-popover\";\nimport { cn } from \"../../../lib/ui-utils\";\ntype ZDateTimePickerProps = {\n    value: Date;\n    onChange: (date: Date) => void;\n    minDate?: Date;\n    className?: string;\n};\nexport default function ZDateTimePicker({ value, onChange, minDate, className, }: ZDateTimePickerProps) {\n    const [open, setOpen] = useState(false);\n    function handleDaySelect(day: Date | undefined) {\n        if (!day)\n            return;\n        const updated = new Date(day);\n        updated.setHours(value.getHours());\n        updated.setMinutes(value.getMinutes());\n        onChange(updated);\n        setOpen(false);\n    }\n    function handleTimeChange(e: React.ChangeEvent<HTMLInputElement>) {\n        const [hours, minutes] = e.target.value.split(':').map(Number);\n        if (isNaN(hours) || isNaN(minutes))\n            return;\n        const updated = setMinutes(setHours(value, hours), minutes);\n        onChange(updated);\n    }\n    const timeValue = format(value, 'HH:mm');\n    return (<div className={cn('flex items-center gap-2', className)}>\n      <ZPopover open={open} onOpenChange={setOpen} align=\"start\" collisionAvoidance={{ side: 'flip' }}>\n        <ZPopover.Trigger>\n          <button type=\"button\" className=\"text-copy border-neutral bg-surface inline-flex h-8 items-center rounded-lg border px-3 text-sm\">\n            {format(value, 'MMM d, yyyy')}\n          </button>\n        </ZPopover.Trigger>\n        <ZPopover.Content>\n          <ZCalendar mode=\"single\" selected={value} onSelect={handleDaySelect} disabled={minDate ? { before: minDate } : undefined}/>\n        </ZPopover.Content>\n      </ZPopover>\n      <input type=\"time\" value={timeValue} onChange={handleTimeChange} className=\"text-copy border-neutral bg-surface h-8 rounded-lg border px-3 text-sm outline-none\"/>\n    </div>);\n}\n",
      "type": "registry:ui",
      "target": "@ui/orchid/spectrum/molecules/z-date-time-picker/z-date-time-picker.tsx"
    }
  ],
  "type": "registry:ui"
}