Avarios / use-lilius

📅 A headless calendar hook for React.
https://use-lilius.vercel.app/
MIT License
275 stars 20 forks source link

Setting initial selected date does not ignore time, causing `isSelected(day)` to incorrectly return false #492

Closed veloware closed 2 years ago

veloware commented 2 years ago

Describe the bug Setting a default selected day, does not ignore the time portion of the date, meaning isSelected(day) returns false

To Reproduce

When setting the default selected date using -

const {...} = useLilius({ selected: new Date()})

then rendering out days as per the chakra example -

{calendar[0].map((week) => (
        <Box key={`week-${week[0]}`} sx={styles.calendarMatrixContainer}>
          {week.map((day) => (
              <Box
                data-in-range={inRange(day, startOfMonth(viewing), endOfMonth(viewing))}
                data-selected={isSelected(day)}
               ....

when it comes to the isSelected(day) for the box that represents 'today', it returns false, as day has its time set to 0, however the selected argument in the useLilius({ selected: [ new Date() ]}) keeps the timestamp.

console output for 'selected' from Returns -

image

console output for day from calendar map

image

However, manually stripping the time off before setting the initial selected date, seems to solve the issue -

const {...} = useLilius({ selected: [ new Date(new Date().toDateString()) ]})

Expected behavior Setting the default selected date using new Date() should ignore the time so it can accurately be compared with dates from the calendar

its-danny commented 2 years ago

thanks for the heads up, will get on this over the weekend. if you need this to work ASAP, in the meantime you can alternatively use clearTime:

import { useLilius, clearTime } from "use-lilius";

const {...} = useLilius({ selected: [ clearTime(new Date()) ]);
its-danny commented 2 years ago

@veloware fixed in 2.0.1