Skip to content
This repository was archived by the owner on May 19, 2025. It is now read-only.

fix(styles): add RTL support for date range edge & select styles #669

Open
wants to merge 1 commit into
base: master
Choose a base branch
from

Conversation

Subash-Chand-Thakuri
Copy link

Types of changes

-> This PR is UI Styles Changes

What types of changes does your code introduce?
-> This PR adds RTL (Right-To-Left) support for date selection ranges and also corrects the direction of the Next and Previous buttons in the calendar UI.

Put an x in the boxes that apply

  • [x ] Bugfix (non-breaking change which fixes an issue)
  • New feature (non-breaking change which adds functionality)
  • Breaking change (fix or feature that would cause existing functionality to not work as expected)

Description

Improves compatibility for RTL languages by adjusting border-radius and positioning styles using :dir(rtl) and :dir(ltr) selectors for the date range selection visibility and preview hovering effect. Here are some of the evidences:

Before fixing:
image

After fixing:
image

Video:
https://www.loom.com/share/bafd166e3a9b45b58675b96f72668b0a?sid=3d85d4a3-c5a1-423c-9d30-1f140830c63e

Related Issue: #xxx
Fixes #668

@drmax24
Copy link

drmax24 commented May 19, 2025

component was not released since 2021.
Why do you send a PR?..
Do you think the will be a new release?

I'm curious because the component is quite ld now and has compatibility problems with new versions of react.

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

The selected react-date-range and hover are not working for "rtl".
3 participants