I'm trying to highlight specific dates in ion-datetime. But for some reason, it is not getting reflected in calendar

Question

I have used ion-datetime for my Ionic-react project. I have added all the property that they have asked in documentation. Instead of coloured dates, I'm getting simple calendar.

          <IonDatetime
              color="custom"
              preferWheel="false"
              className="some-class"
              presentation="date-time"
              highlightedDates={[
                {
                  date: "2023-01-05",
                  textColor: "#800080",
                  backgroundColor: "#ffc0cb",
                },
                {
                  date: "2023-01-10",
                  textColor: "#09721b",
                  backgroundColor: "#c8e5d0",
                },
                {
                  date: "2023-03-20",
                  textColor: "var(--ion-color-secondary-contrast)",
                  backgroundColor: "var(--ion-color-secondary)",
                },
                {
                  date: "2023-03-23",
                  textColor: "rgb(68, 10, 184)",
                  backgroundColor: "rgb(211, 200, 229)",
                },
              ]}
              onClick={(e) => filterDate(e.target.value)}
            ></IonDatetime>

I have also tried removing my css making sure that it is not affecting it but got no result. Any help would be appreciated.

Answer 1

After trying so many ways to resolve this problem, Changing Ionic version from 6.0.0 to 7.0.0 really helped me.

In recent(29/03/2023) release of Ionic 7.0.0 They have resolved this issue.