From d88cee81ce3b8ff35063a58d399501e25afa9f6c Mon Sep 17 00:00:00 2001
From: ilchenkoArtem <artem.ilchenko@711media.de>
Date: Mon, 10 Nov 2025 19:21:34 +0200
Subject: [PATCH 1/3] fix: Add inline mode support to CalendarComponent
 component with appropriate accessibility props

---
 src/calendar.tsx                |  1 +
 src/calendar_container.tsx      |  6 ++++--
 src/test/calendar_test.test.tsx | 19 ++++++++++++++++++-
 3 files changed, 23 insertions(+), 3 deletions(-)

diff --git a/src/calendar.tsx b/src/calendar.tsx
index 9b00b22ef..ae3e6f0b6 100644
--- a/src/calendar.tsx
+++ b/src/calendar.tsx
@@ -1154,6 +1154,7 @@ export default class Calendar extends Component<CalendarProps, CalendarState> {
             })}
             showTime={this.props.showTimeSelect || this.props.showTimeInput}
             showTimeSelectOnly={this.props.showTimeSelectOnly}
+            inline={this.props.inline}
           >
             {this.renderAriaLiveRegion()}
             {this.renderPreviousButton()}
diff --git a/src/calendar_container.tsx b/src/calendar_container.tsx
index 8ab32f2d7..73c133ba5 100644
--- a/src/calendar_container.tsx
+++ b/src/calendar_container.tsx
@@ -4,6 +4,7 @@ export interface CalendarContainerProps
   extends React.PropsWithChildren<HTMLAttributes<HTMLDivElement>> {
   showTimeSelectOnly?: boolean;
   showTime?: boolean;
+  inline: boolean | undefined;
 }
 
 const CalendarContainer: React.FC<CalendarContainerProps> = function ({
@@ -11,6 +12,7 @@ const CalendarContainer: React.FC<CalendarContainerProps> = function ({
   showTime = false,
   className,
   children,
+  inline,
 }: CalendarContainerProps) {
   const ariaLabel = showTimeSelectOnly
     ? "Choose Time"
@@ -19,9 +21,9 @@ const CalendarContainer: React.FC<CalendarContainerProps> = function ({
   return (
     <div
       className={className}
-      role="dialog"
       aria-label={ariaLabel}
-      aria-modal="true"
+      role={inline ? undefined : "dialog"}
+      aria-modal={inline ? undefined : "true"}
     >
       {children}
     </div>
diff --git a/src/test/calendar_test.test.tsx b/src/test/calendar_test.test.tsx
index 7cd3f9db1..6286ac79e 100644
--- a/src/test/calendar_test.test.tsx
+++ b/src/test/calendar_test.test.tsx
@@ -2679,7 +2679,7 @@ describe("Calendar", () => {
   });
 
   describe("calendar container", () => {
-    it("should render Calendar with accessibility props", () => {
+    it("should render Calendar in popover mode with dialog accessibility props", () => {
       const { container } = render(
         <Calendar
           dateFormat={dateFormat}
@@ -2696,6 +2696,23 @@ describe("Calendar", () => {
       expect(dialog?.getAttribute("aria-label")).toBe("Choose Date");
     });
 
+    it("should render Calendar in inline mode without dialog accessibility props", () => {
+      const { container } = render(
+        <Calendar
+          dateFormat={dateFormat}
+          onClickOutside={() => {}}
+          onSelect={() => {}}
+          dropdownMode="scroll"
+        />,
+      );
+
+      const dialog = container.querySelector(".react-datepicker");
+      expect(dialog).not.toBeNull();
+      expect(dialog).not.toHaveProperty("role");
+      expect(dialog).not.toHaveProperty("aria-modal");
+      expect(dialog?.getAttribute("aria-label")).toBe("Choose Date");
+    });
+
     it("should display corresponding aria-label for Calendar with showTimeSelect", () => {
       const { container } = render(
         <Calendar

From 2f30d4b079a83cc2a69e850a51a1d448bc0db7fb Mon Sep 17 00:00:00 2001
From: ilchenkoArtem <artem.ilchenko@711media.de>
Date: Mon, 10 Nov 2025 19:27:45 +0200
Subject: [PATCH 2/3] test: Update CalendarComponent tests to include inline
 mode and adjust accessibility attributes

---
 src/test/calendar_test.test.tsx | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/src/test/calendar_test.test.tsx b/src/test/calendar_test.test.tsx
index 6286ac79e..30541d70a 100644
--- a/src/test/calendar_test.test.tsx
+++ b/src/test/calendar_test.test.tsx
@@ -2703,13 +2703,14 @@ describe("Calendar", () => {
           onClickOutside={() => {}}
           onSelect={() => {}}
           dropdownMode="scroll"
+          inline
         />,
       );
 
       const dialog = container.querySelector(".react-datepicker");
       expect(dialog).not.toBeNull();
-      expect(dialog).not.toHaveProperty("role");
-      expect(dialog).not.toHaveProperty("aria-modal");
+      expect(dialog?.getAttribute("role")).toBeNull();
+      expect(dialog?.getAttribute("aria-modal")).toBeNull();
       expect(dialog?.getAttribute("aria-label")).toBe("Choose Date");
     });
 

From d72385602c99a3fb93b8691540825f3a6d736df6 Mon Sep 17 00:00:00 2001
From: ilchenkoArtem <artem.ilchenko@711media.de>
Date: Mon, 10 Nov 2025 19:50:12 +0200
Subject: [PATCH 3/3] fix: Change inline prop in CalendarContainer to be
 optional

---
 src/calendar_container.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/calendar_container.tsx b/src/calendar_container.tsx
index 73c133ba5..d05c11293 100644
--- a/src/calendar_container.tsx
+++ b/src/calendar_container.tsx
@@ -4,7 +4,7 @@ export interface CalendarContainerProps
   extends React.PropsWithChildren<HTMLAttributes<HTMLDivElement>> {
   showTimeSelectOnly?: boolean;
   showTime?: boolean;
-  inline: boolean | undefined;
+  inline?: boolean;
 }
 
 const CalendarContainer: React.FC<CalendarContainerProps> = function ({