From 184e047950d1de0445cae03373009b5ffd18196f Mon Sep 17 00:00:00 2001
From: balajis-qb <balaji.s@qburst.com>
Date: Mon, 21 Jul 2025 11:57:27 +0530
Subject: [PATCH 1/2] =?UTF-8?q?=E2=99=BB=EF=B8=8F=20Refactor=20the=20input?=
 =?UTF-8?q?=20value=20get=20logic=20to=20a=20seperate=20function?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Move the input value get logic to a seperate function
- Refactor the nested conditional statements to if else conditions for readability
---
 src/index.tsx | 58 ++++++++++++++++++++++++++++++++-------------------
 1 file changed, 36 insertions(+), 22 deletions(-)

diff --git a/src/index.tsx b/src/index.tsx
index f07367d27..62e4f3166 100644
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -423,6 +423,41 @@ export default class DatePicker extends Component<
     };
   };
 
+  getInputValue = (): string => {
+    const {
+      dateFormat = DatePicker.defaultProps.dateFormat,
+      locale,
+      startDate,
+      endDate,
+      selected,
+      selectedDates,
+      selectsMultiple,
+      selectsRange,
+      value,
+    } = this.props;
+    const { inputValue } = this.state;
+
+    if (typeof value === "string") {
+      return value;
+    } else if (typeof inputValue === "string") {
+      return inputValue;
+    } else if (selectsRange) {
+      return safeDateRangeFormat(startDate, endDate, {
+        dateFormat,
+        locale,
+      });
+    } else if (selectsMultiple) {
+      return safeMultipleDatesFormat(selectedDates ?? [], {
+        dateFormat,
+        locale,
+      });
+    }
+    return safeDateFormat(selected, {
+      dateFormat,
+      locale,
+    });
+  };
+
   resetHiddenStatus = (): void => {
     this.setState({
       ...this.state,
@@ -1338,33 +1373,12 @@ export default class DatePicker extends Component<
 
     const customInput = this.props.customInput || <input type="text" />;
     const customInputRef = this.props.customInputRef || "ref";
-    const { dateFormat = DatePicker.defaultProps.dateFormat, locale } =
-      this.props;
-    const inputValue =
-      typeof this.props.value === "string"
-        ? this.props.value
-        : typeof this.state.inputValue === "string"
-          ? this.state.inputValue
-          : this.props.selectsRange
-            ? safeDateRangeFormat(this.props.startDate, this.props.endDate, {
-                dateFormat,
-                locale,
-              })
-            : this.props.selectsMultiple
-              ? safeMultipleDatesFormat(this.props.selectedDates ?? [], {
-                  dateFormat,
-                  locale,
-                })
-              : safeDateFormat(this.props.selected, {
-                  dateFormat,
-                  locale,
-                });
 
     return cloneElement(customInput, {
       [customInputRef]: (input: HTMLElement | null) => {
         this.input = input;
       },
-      value: inputValue,
+      value: this.getInputValue(),
       onBlur: this.handleBlur,
       onChange: this.handleChange,
       onClick: this.onInputClick,

From 66df4dc989ed34b4d133a1521e3c58320404e068 Mon Sep 17 00:00:00 2001
From: balajis-qb <balaji.s@qburst.com>
Date: Mon, 21 Jul 2025 16:30:54 +0530
Subject: [PATCH 2/2] =?UTF-8?q?=F0=9F=94=A8=20Properly=20set=20the=20dateF?=
 =?UTF-8?q?ormat=20prop=20in=20the=20DatePicker=20component=20to=20handle?=
 =?UTF-8?q?=20both=20null=20and=20undefined=20case?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/index.tsx                     |  9 ++++++---
 src/test/datepicker_test.test.tsx | 10 ++++++++++
 2 files changed, 16 insertions(+), 3 deletions(-)

diff --git a/src/index.tsx b/src/index.tsx
index 62e4f3166..f543bd048 100644
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -425,7 +425,6 @@ export default class DatePicker extends Component<
 
   getInputValue = (): string => {
     const {
-      dateFormat = DatePicker.defaultProps.dateFormat,
       locale,
       startDate,
       endDate,
@@ -435,6 +434,9 @@ export default class DatePicker extends Component<
       selectsRange,
       value,
     } = this.props;
+    const dateFormat =
+      this.props.dateFormat ?? DatePicker.defaultProps.dateFormat;
+
     const { inputValue } = this.state;
 
     if (typeof value === "string") {
@@ -1296,8 +1298,9 @@ export default class DatePicker extends Component<
   };
 
   renderAriaLiveRegion = () => {
-    const { dateFormat = DatePicker.defaultProps.dateFormat, locale } =
-      this.props;
+    const { locale } = this.props;
+    const dateFormat =
+      this.props.dateFormat ?? DatePicker.defaultProps.dateFormat;
     const isContainsTime =
       this.props.showTimeInput || this.props.showTimeSelect;
     const longDateFormat = isContainsTime ? "PPPPp" : "PPPP";
diff --git a/src/test/datepicker_test.test.tsx b/src/test/datepicker_test.test.tsx
index e9a76330c..5287f372b 100644
--- a/src/test/datepicker_test.test.tsx
+++ b/src/test/datepicker_test.test.tsx
@@ -4504,4 +4504,14 @@ describe("DatePicker", () => {
       expect(calendarAfterEsc).toBeFalsy();
     });
   });
+
+  describe("dateFormat", () => {
+    it("should use the default dateFormat if dateFormat prop is not provided", () => {
+      const { container } = render(
+        <DatePicker selected={new Date("2025-07-17")} showDateSelect />,
+      );
+      const input = safeQuerySelector(container, "input") as HTMLInputElement;
+      expect(input?.value).toBe("07/17/2025");
+    });
+  });
 });