Fix keyboard focus loss during same-month navigation in inline mode

When using selectsRange, inline, and showPreviousMonths with a
mismatched openToDate vs startDate, keyboard navigation within the
same month would fail to properly transfer focus to the new day
element.

The root cause was that shouldFocusDayInline was set to false when
navigating within the same month, which prevented the Day component
from receiving focus. Since keyboard navigation is always user-
initiated from a focused day, the destination day should always
receive focus.

This change simplifies the inline mode focus logic to always set
shouldFocusDayInline to true during keyboard navigation, ensuring
focus is properly transferred regardless of whether the month changed.

Fixes #5750

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <[email protected]>

Author: martijnrusschen

src/index.tsx

@@ -1392,20 +1392,12 @@ export class DatePicker extends Component<DatePickerProps, DatePickerState> {
       this.setSelected(newSelection);
     }
     this.setPreSelection(newSelection);
-    // need to figure out whether month has changed to focus day in inline version
+    // In inline mode, always set shouldFocusDayInline to true when navigating via keyboard.
+    // This ensures focus is properly transferred to the new day element regardless of
+    // whether the month changed. The user initiated this navigation from a focused day,
+    // so we should always focus the destination day.
     if (inline) {
-      const prevMonth = getMonth(copy);
-      const newMonth = getMonth(newSelection);
-      const prevYear = getYear(copy);
-      const newYear = getYear(newSelection);
-
-      if (prevMonth !== newMonth || prevYear !== newYear) {
-        // month has changed
-        this.setState({ shouldFocusDayInline: true });
-      } else {
-        // month hasn't changed
-        this.setState({ shouldFocusDayInline: false });
-      }
+      this.setState({ shouldFocusDayInline: true });
     }
   };
 

src/test/datepicker_test.test.tsx

@@ -3851,7 +3851,7 @@ describe("DatePicker", () => {
   describe("shouldFocusDayInline state", () => {
     const dateFormat = "yyyy-MM-dd";
 
-    it("should not be updated when navigating with ArrowRight key without changing displayed month", () => {
+    it("should be set to true when navigating with ArrowRight key without changing displayed month", () => {
       let instance: DatePicker | null = null;
       const { container } = render(
         <DatePicker
@@ -3867,7 +3867,8 @@ describe("DatePicker", () => {
       expect(selectedDayNode).toBeTruthy();
       fireEvent.keyDown(selectedDayNode!, getKey(KeyType.ArrowRight));
       expect(instance).toBeTruthy();
-      expect(instance!.state.shouldFocusDayInline).toBe(false);
+      // Always set to true for keyboard navigation to ensure focus transfers correctly
+      expect(instance!.state.shouldFocusDayInline).toBe(true);
     });
 
     it("should be set to true when changing displayed month with ArrowRight key", () => {
@@ -3907,6 +3908,54 @@ describe("DatePicker", () => {
       expect(instance).toBeTruthy();
       expect(instance!.state.shouldFocusDayInline).toBe(true);
     });
+
+    it("should maintain keyboard focus when navigating within same month in inline selectsRange mode with showPreviousMonths", () => {
+      // This test verifies the fix for GitHub issue #5750
+      // Focus was being lost when navigating within the same month in inline mode
+      // with selectsRange and showPreviousMonths enabled
+      const startDate = newDate("2025-06-01");
+      const endDate = newDate("2025-07-01");
+      const div = document.createElement("div");
+      document.body.appendChild(div);
+
+      const { container } = render(
+        <DatePicker
+          selectsRange
+          inline
+          showPreviousMonths
+          monthsShown={2}
+          startDate={startDate}
+          endDate={endDate}
+          openToDate={endDate}
+        />,
+        { container: div },
+      );
+
+      // Find the start date (June 1) and focus it
+      const startDateNode = container.querySelector(
+        '.react-datepicker__day--range-start[tabindex="0"]',
+      );
+      expect(startDateNode).toBeTruthy();
+      act(() => {
+        (startDateNode as HTMLElement)?.focus();
+      });
+      expect(document.activeElement).toBe(startDateNode);
+
+      // Navigate right (to June 2, same month)
+      fireEvent.keyDown(startDateNode!, getKey(KeyType.ArrowRight));
+
+      // After navigation, focus should be on June 2, not lost to body
+      const newFocusedDay = container.querySelector(
+        '.react-datepicker__day[tabindex="0"]',
+      );
+      expect(newFocusedDay).toBeTruthy();
+      expect(document.activeElement).not.toBe(document.body);
+      expect(
+        document.activeElement?.classList.contains("react-datepicker__day"),
+      ).toBe(true);
+
+      document.body.removeChild(div);
+    });
   });
 
   describe("Calendar Header Accessibility", () => {