{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "p-calendar-14",
  "description": "Calendar without arrow navigation (dropdown only)",
  "registryDependencies": [
    "@coss/calendar",
    "@coss/select"
  ],
  "files": [
    {
      "path": "registry/default/particles/p-calendar-14.tsx",
      "content": "\"use client\";\n\nimport { useState } from \"react\";\nimport type { DropdownNavProps, DropdownProps } from \"react-day-picker\";\nimport { Calendar } from \"@/registry/default/ui/calendar\";\nimport {\n  Select,\n  SelectItem,\n  SelectPopup,\n  SelectTrigger,\n  SelectValue,\n} from \"@/registry/default/ui/select\";\n\nexport default function Particle() {\n  const [date, setDate] = useState<Date | undefined>(new Date());\n\n  const handleCalendarChange = (\n    _value: string | number,\n    _e: React.ChangeEventHandler<HTMLSelectElement>,\n  ) => {\n    const _event = {\n      target: {\n        value: String(_value),\n      },\n    } as React.ChangeEvent<HTMLSelectElement>;\n    _e(_event);\n  };\n\n  return (\n    <Calendar\n      captionLayout=\"dropdown\"\n      classNames={{\n        month_caption: \"mx-0\",\n      }}\n      components={{\n        Dropdown: (props: DropdownProps) => {\n          const items =\n            props.options?.map((option) => ({\n              label: option.label,\n              value: String(option.value),\n            })) ?? [];\n\n          return (\n            <Select\n              items={items}\n              onValueChange={(value) => {\n                if (props.onChange && value !== null) {\n                  handleCalendarChange(value, props.onChange);\n                }\n              }}\n              value={String(props.value)}\n            >\n              <SelectTrigger className=\"min-w-none\">\n                <SelectValue />\n              </SelectTrigger>\n              <SelectPopup>\n                {items.map((item) => (\n                  <SelectItem key={item.value} value={item.value}>\n                    {item.label}\n                  </SelectItem>\n                ))}\n              </SelectPopup>\n            </Select>\n          );\n        },\n        DropdownNav: (props: DropdownNavProps) => {\n          return (\n            <div className=\"flex w-full items-center gap-2\">\n              {props.children}\n            </div>\n          );\n        },\n      }}\n      defaultMonth={new Date()}\n      hideNavigation\n      mode=\"single\"\n      onSelect={setDate}\n      selected={date}\n      startMonth={new Date(1980, 6)}\n    />\n  );\n}\n",
      "type": "registry:block"
    }
  ],
  "categories": [
    "calendar",
    "select"
  ],
  "type": "registry:block"
}