Календарь ShadCN внутри Popover не интерактивный ⇐ Javascript

[Anonymous]

Я использую компонент Calendar из пользовательского интерфейса ShadCN внутри Popover в проекте React + Vite. Когда я нажимаю кнопку-триггер, открывается всплывающее окно, но календарь не является интерактивным — я не могу выбрать дату.

• Vite
• React v18
• ShadCN UI v3
• Tailwind CSS v3

Минимальный воспроизводимый пример:

Код: Выделить всё

import { useState } from "react";
import { Calendar } from "@/components/ui/calendar";
import { Popover, PopoverTrigger, PopoverContent } from "@/components/ui/popover";
import { Button } from "@/components/ui/button";
import { ChevronDownIcon } from "lucide-react";

export default function CalendarExample() {
const [date, setDate] = useState(new Date());

return (



{date ? date.toLocaleDateString() : "Select date"}




 setDate(date)}
/>


);
}

Что я пробовал до сих пор:

• Добавление type="button" к кнопке триггера
• Управление открытым состоянием всплывающего окна вручную
• Добавление pointer-events-auto в оболочку календаря (сработало только частично)
  />

Как сделать календарь полностью интерактивным внутри всплывающего окна с помощью пользовательского интерфейса ShadCN в React + Vite?

Подробнее здесь: https://stackoverflow.com/questions/797 ... nteractive