Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

LSD v0.1.0-beta - Date range picker #63

Merged
merged 12 commits into from
Oct 19, 2023
Merged

Conversation

jongomez
Copy link
Contributor

@jongomez jongomez commented Oct 2, 2023

Implements a date range picker component.

Figma link

Based on Jinho's work from this PR.

@jongomez jongomez marked this pull request as draft October 2, 2023 10:31
@jongomez jongomez changed the title WIP: implement date range picker LSD v0.1.0-beta - Date range picker Oct 2, 2023
@jongomez jongomez force-pushed the topic-implement-date-range-picker branch from 5a92c63 to ce2392a Compare October 9, 2023 10:52
@jongomez jongomez marked this pull request as ready for review October 9, 2023 10:55
@jongomez jongomez requested a review from jeangovil October 9, 2023 11:02
@amirhouieh
Copy link

amirhouieh commented Oct 9, 2023

@jongomez

  • Day numbers should not be selectable
  • This is probably a design issue but we need to somehow highlight the focused date (from or to) when clicking on calendar icon
  • Is there a specific logic/routine implemented upon hover? the cursor seems shaking and unstable when hovering over the day numbers ?

@jongomez
Copy link
Contributor Author

jongomez commented Oct 9, 2023

Is there a specific logic/routine implemented upon hover? the cursor seems shaking and unstable when hovering over the day numbers ?

This comes from an external hook we're using, I don't think we're doing anything on our side. I'll try to fix this though

@jongomez jongomez force-pushed the topic-implement-date-range-picker branch from f875ba8 to 1200b33 Compare October 17, 2023 23:07
Comment on lines -28 to -40
const { onClick, onKeyDown, onMouseEnter, tabIndex } = useDay({
date,
focusedDate,
isDateFocused,
isDateSelected,
isDateHovered,
isDateBlocked,
isFirstOrLastSelectedDate,
onDateFocus,
onDateSelect,
onDateHover,
dayRef,
})
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

One of the requests from @amirhouieh was:

Is there a specific logic/routine implemented upon hover? the cursor seems shaking and unstable when hovering over the day numbers ?

I believe the culprit was this useDay hook - it adds some hovering logic as we can see from its source code. I removed this hook because as far as I can tell the hovering logic is not needed. If we do need it sometime in the future, it should be easy to implement it ourselves.

jeangovil
jeangovil previously approved these changes Oct 18, 2023
@jongomez jongomez force-pushed the topic-implement-date-range-picker branch from bf479a1 to 32d95a4 Compare October 18, 2023 16:12
@jongomez jongomez merged commit 07fb14a into main Oct 19, 2023
3 checks passed
@jongomez jongomez deleted the topic-implement-date-range-picker branch October 19, 2023 09:26
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants