Merge pull request #4298 from frankops11/main

Fix: Display Issue of Calendar Icon in React Date Picker (#4291)
Hacker0x01 · Oct 9, 2023 · 2122df4 · 2122df4
2 parents 088e590 + bcc1dc3
commit 2122df4
Show file tree

Hide file tree

Showing 3 changed files with 3 additions and 2 deletions.
diff --git a/src/calendar_icon.jsx b/src/calendar_icon.jsx
@@ -22,7 +22,7 @@ const CalendarIcon = ({ icon, className }) => {
   // Default SVG Icon
   return (
     <svg
-      className="react-datepicker__calendar-icon"
+      className={`${defaultClass} ${className}`}
       xmlns="http://www.w3.org/2000/svg"
       viewBox="0 0 448 512"
     >

diff --git a/src/stylesheets/datepicker.scss b/src/stylesheets/datepicker.scss
@@ -513,6 +513,7 @@
   .react-datepicker__calendar-icon {
     position: absolute;
     padding: 0.5rem;
+    box-sizing: content-box;
   }
 }
 

diff --git a/test/datepicker_test.test.js b/test/datepicker_test.test.js
@@ -2234,7 +2234,7 @@ describe("DatePicker", () => {
       datePicker,
       "react-datepicker__calendar-icon",
     ).getAttribute("class");
-    expect(showIconClass).toBe("react-datepicker__calendar-icon");
+    expect(showIconClass).toMatch(/^react-datepicker__calendar-icon\s?$/);
   });
 
   describe("Year picker", () => {