fix: keep sr-only weekday header text visually hidden with inline styles

[franmc01]

Description

Linked issue: #6302

Problem
Since v8.5.0 the calendar weekday header renders a screen-reader-only span with the full day name (Sunday, Monday, ...) next to the visible short name. The span is hidden by the .react-datepicker__sr-only rule (named .sr-only in v8.5.0–v8.6.0) shipped in the package stylesheet.

When the stylesheet loaded by the consumer app does not match the installed JS version — a vendored copy of the v7 CSS, a CDN link pinned to an older version, or a stale build cache — that rule is missing, and the full day names render visibly, overlapping the short names exactly as shown in the issue screenshots. Every published version of the package ships matching JS + CSS (verified 7.7.0 through 9.1.0 across react-datepicker.css, react-datepicker.min.css, and the CSS-modules variants), which is why the issue is not reproducible with a correct setup.

Changes
This makes the component degrade gracefully instead of producing a broken header when the loaded stylesheet is out of sync: the visually-hidden styles are now also applied inline on the two sr-only spans, mirroring the .react-datepicker__sr-only rule. The class name and the SCSS rule are unchanged.

File	Change
src/calendar.tsx	Added a visuallyHiddenStyle constant (mirror of the .react-datepicker__sr-only ruleset) and applied it inline to the week-number and day-name sr-only spans
src/test/calendar_test.test.tsx	Regression test asserting the sr-only spans stay visually hidden via inline styles, independent of the stylesheet

Screenshots

See the issue for before/after screenshots of the broken header (v7 stylesheet + v8/v9 JS).

To reviewers

Two intentional tradeoffs worth a conscious decision:

• The visually-hidden ruleset now exists in two places (datepicker.scss and calendar.tsx); they must be kept in sync if the clipping technique ever changes.
• Inline styles win over class-selector overrides, so a consumer who deliberately restyles .react-datepicker__sr-only would now need !important. Given the class exists purely to hide accessible text, this seems like the right default.

The added test pins that the inline styles stay applied at the JSX level; jsdom cannot reproduce the visual overlap itself.

Contribution checklist

• I have followed the contributing guidelines.
• I have added sufficient test coverage for my changes.
• I have formatted my code with Prettier and checked for linting issues with ESLint for code readability.

[Copilot]

Pull request overview

This PR hardens the calendar weekday header’s accessibility markup so the full weekday names and week-number label remain visually hidden even if a consumer loads an out-of-sync (older) stylesheet that lacks the .react-datepicker__sr-only rule.

Changes:

• Added a visuallyHiddenStyle inline style object in Calendar that mirrors the .react-datepicker__sr-only SCSS rules.
• Applied that inline style to the weekday full-name sr-only span and the week-number label sr-only span.
• Added a regression test asserting the sr-only spans include the visually-hidden inline styles.

Reviewed changes

Copilot reviewed 2 out of 2 changed files in this pull request and generated no comments.

File	Description
src/calendar.tsx	Adds and applies visuallyHiddenStyle inline to the sr-only spans in the weekday header/week-number header to prevent visible overlap when CSS is missing/outdated.
src/test/calendar_test.test.tsx	Adds a regression test verifying the sr-only spans remain visually hidden via inline styles (independent of stylesheet presence).

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

[codecov]

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 99.31%. Comparing base (548a1f3) to head (d681c38).

Additional details and impacted files

@@            Coverage Diff             @@
##             main    #6305      +/-   ##
==========================================
+ Coverage   99.29%   99.31%   +0.02%     
==========================================
  Files          30       30              
  Lines        3822     3823       +1     
  Branches     1648     1665      +17     
==========================================
+ Hits         3795     3797       +2     
+ Misses         26       25       -1     
  Partials        1        1              

☔ View full report in Codecov by Harness.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.