[bug]: datepicker get a wrong css

[jizhi0v0]

Describe the bug

Not displayed as expected

Affected component/components

Date Picker

How to reproduce

1.Click on datepicker component

Codesandbox/StackBlitz link

No response

Logs

No response

System Info

Browsers

Before submitting

• [X] I've made research efforts and searched the documentation
• [X] I've searched for existing issues

[plutack]

I have been battling this for the past 12hrs no cap. Since I am not very familiar with shadcn and react components, I was under the assumption I am doing something wrong. I am also getting some errors after installing calendar. Caption does not seem to exist in type partial < classnames > . I can't also seem to find it any where after navigating through the UI types where something like caption _label can be found. Same thing for iconLeft which is suppose to exist in partial < customComponents >

[activemonkeys]

Did you install the new react-day-picker v9.0.0? That one seems to come with several breaking changes. When using react-day-picker 8.10.1 you will probably be fine for the moment.

[plutack]

@activemonkeys I will try that now. I have v9 installed

Edit : works for me too.. big thanks

[jizhi0v0]

Did you install the new react-day-picker v9.0.0? That one seems to come with several breaking changes. When using react-day-picker 8.10.1 you will probably be fine for the moment.

It works,Thank you so much!

[jizhi0v0]

I have been battling this for the past 12hrs no cap. Since I am not very familiar with shadcn and react components, I was under the assumption I am doing something wrong. I am also getting some errors after installing calendar. Caption does not seem to exist in type partial < classnames > . I can't also seem to find it any where after navigating through the UI types where something like caption _label can be found. Same thing for iconLeft which is suppose to exist in partial < customComponents >

You should run the below command

npm i react-day-picker@8.10.1

[firdoesdev]

Did you install the new react-day-picker v9.0.0? That one seems to come with several breaking changes. When using react-day-picker 8.10.1 you will probably be fine for the moment.

Thank You! it's work 👍

[masewo]

Tried to migrate the shadcn Calendar to react-date-picker 9.x.x but I gave up since I cannot find out how to attach the hover styles to the day button and not to the day cell...

Click me

```tsx import * as React from "react"; import { ChevronLeft, ChevronRight } from "lucide-react"; import { DayPicker } from "react-day-picker"; import { cn } from "@/lib/utils"; import { buttonVariants } from "@/components/ui/button"; export type CalendarProps = React.ComponentProps; function Calendar({ className, classNames, showOutsideDays = true, ...props }: CalendarProps) { return ( props.orientation === "left" ? ( ) : ( ), }} {...props} /> ); } Calendar.displayName = "Calendar"; export { Calendar }; ```

Another thing I noticed is that the range is not updating after choosing an entry from the preset list.

[efgomes]

I'm using 9.0, and my calendar is like this

[Geeraldv]

Did you install the new react-day-picker v9.0.0? That one seems to come with several breaking changes. When using react-day-picker 8.10.1 you will probably be fine for the moment.

Thank You! it's work for me 👍

[kachkaev]

PRs with fixes: https://github.com/shadcn-ui/ui/pull/4371 & https://github.com/shadcn-ui/ui/pull/4421

[tresorama]

In meantime, if someone want to use both v8 and v9 at the same time, it's possible to have both. shadcn can use v8 and you can use v9 when you want.

https://medium.com/weekly-webtips/how-to-install-multiple-versions-of-the-same-package-in-npm-71c29b12e253