From d72a7ea06c8dc365ccbb8b4197c972ed962d52a7 Mon Sep 17 00:00:00 2001
From: Kuldeep Parihar <96866951+k-parihar@users.noreply.github.com>
Date: Tue, 2 Jul 2024 15:27:20 +0000
Subject: [PATCH 1/4] Fix issue #2256

---
 .../components/DatePicker/DateInput.web.tsx   | 25 +++++++++++++------
 1 file changed, 18 insertions(+), 7 deletions(-)

diff --git a/packages/blade/src/components/DatePicker/DateInput.web.tsx b/packages/blade/src/components/DatePicker/DateInput.web.tsx
index ccde4e5d870..87df4ade124 100644
--- a/packages/blade/src/components/DatePicker/DateInput.web.tsx
+++ b/packages/blade/src/components/DatePicker/DateInput.web.tsx
@@ -52,6 +52,9 @@ const HiddenInput = ({ value, name }: { value: string; name?: string }): React.R
 const iconVerticalMargin = {
   medium: sizeTokens[14],
   large: sizeTokens[24],
+  noLabel: sizeTokens[0],
+  noLabelM: sizeTokens[20],
+  noLabelL: sizeTokens[28],
 } as const;
 const LEFT_LABEL_WIDTH = 132;
 
@@ -179,16 +182,24 @@ const _DatePickerInput = (
             {...referenceProps}
           />
         </BaseBox>
-        <BaseBox flexShrink={0} alignSelf="start">
+        <BaseBox flexShrink={0} alignSelf="center">
           <ArrowRightIcon
             size="medium"
+            // marginTop={
+            //   // Hacky layouting because the we cannot put this inside the internal layout of BaseInput.
+            //   hasLabel && (!isLabelPositionLeft || isMobile)
+            //     ? `calc(${makeSize(iconVerticalMargin[size])} + ${makeSize(
+            //         isLarge ? sizeTokens[20] : sizeTokens[15],
+            //       )})`
+            //     : makeSize(iconVerticalMargin[size])
+            // }
             marginTop={
-              // Hacky layouting because the we cannot put this inside the internal layout of BaseInput.
-              hasLabel && (!isLabelPositionLeft || isMobile)
-                ? `calc(${makeSize(iconVerticalMargin[size])} + ${makeSize(
-                    isLarge ? sizeTokens[20] : sizeTokens[15],
-                  )})`
-                : makeSize(iconVerticalMargin[size])
+              // Label present ? add label height : remove label height; align basebox to center
+              hasLabel
+                ? isLarge
+                  ? makeSize(iconVerticalMargin['noLabelL'])
+                  : makeSize(iconVerticalMargin['noLabelM'])
+                : makeSize(iconVerticalMargin['noLabel'])
             }
           />
         </BaseBox>

From bf1a92e6d2a481b75b8f608e5503e8ff0075819a Mon Sep 17 00:00:00 2001
From: Kuldeep Parihar <96866951+k-parihar@users.noreply.github.com>
Date: Tue, 2 Jul 2024 16:33:55 +0000
Subject: [PATCH 2/4] Changeset added

---
 .changeset/neat-spies-add.md | 5 +++++
 1 file changed, 5 insertions(+)
 create mode 100644 .changeset/neat-spies-add.md

diff --git a/.changeset/neat-spies-add.md b/.changeset/neat-spies-add.md
new file mode 100644
index 00000000000..f3792124ed4
--- /dev/null
+++ b/.changeset/neat-spies-add.md
@@ -0,0 +1,5 @@
+---
+'@razorpay/blade': major
+---
+
+"DatePicker range icon's margin top fixed"

From 5b203d1f65e4dbc973628f515d02733015e25c12 Mon Sep 17 00:00:00 2001
From: Kuldeep Parihar <96866951+k-parihar@users.noreply.github.com>
Date: Wed, 3 Jul 2024 04:18:48 +0000
Subject: [PATCH 3/4] fix: added dot notation

---
 .../blade/src/components/DatePicker/DateInput.web.tsx     | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/packages/blade/src/components/DatePicker/DateInput.web.tsx b/packages/blade/src/components/DatePicker/DateInput.web.tsx
index 87df4ade124..45122f185f0 100644
--- a/packages/blade/src/components/DatePicker/DateInput.web.tsx
+++ b/packages/blade/src/components/DatePicker/DateInput.web.tsx
@@ -195,11 +195,11 @@ const _DatePickerInput = (
             // }
             marginTop={
               // Label present ? add label height : remove label height; align basebox to center
-              hasLabel
+              hasLabel && (!isLabelPositionLeft || isMobile)
                 ? isLarge
-                  ? makeSize(iconVerticalMargin['noLabelL'])
-                  : makeSize(iconVerticalMargin['noLabelM'])
-                : makeSize(iconVerticalMargin['noLabel'])
+                  ? makeSize(iconVerticalMargin.noLabelL)
+                  : makeSize(iconVerticalMargin.noLabelM)
+                : makeSize(iconVerticalMargin.noLabel)
             }
           />
         </BaseBox>

From 7ef5a22c3322d51dda64af0482995781cc57d962 Mon Sep 17 00:00:00 2001
From: Kuldeep Parihar <96866951+k-parihar@users.noreply.github.com>
Date: Sun, 22 Dec 2024 13:23:38 +0000
Subject: [PATCH 4/4] Update suggestion, .changeset

---
 .changeset/neat-spies-add.md                              | 4 ++--
 .../blade/src/components/DatePicker/DateInput.web.tsx     | 8 --------
 2 files changed, 2 insertions(+), 10 deletions(-)

diff --git a/.changeset/neat-spies-add.md b/.changeset/neat-spies-add.md
index f3792124ed4..1a23d4df54a 100644
--- a/.changeset/neat-spies-add.md
+++ b/.changeset/neat-spies-add.md
@@ -1,5 +1,5 @@
 ---
-'@razorpay/blade': major
+'@razorpay/blade': patch
 ---
 
-"DatePicker range icon's margin top fixed"
+fix(blade): DatePicker range icon's alignment
\ No newline at end of file
diff --git a/packages/blade/src/components/DatePicker/DateInput.web.tsx b/packages/blade/src/components/DatePicker/DateInput.web.tsx
index 516469effc6..3f519db4bc5 100644
--- a/packages/blade/src/components/DatePicker/DateInput.web.tsx
+++ b/packages/blade/src/components/DatePicker/DateInput.web.tsx
@@ -218,14 +218,6 @@ const _DatePickerInput = (
         <BaseBox flexShrink={0} alignSelf="center">
           <ArrowRightIcon
             size="medium"
-            // marginTop={
-            //   // Hacky layouting because the we cannot put this inside the internal layout of BaseInput.
-            //   hasLabel && (!isLabelPositionLeft || isMobile)
-            //     ? `calc(${makeSize(iconVerticalMargin[size])} + ${makeSize(
-            //         isLarge ? sizeTokens[20] : sizeTokens[15],
-            //       )})`
-            //     : makeSize(iconVerticalMargin[size])
-            // }
             marginTop={
               // Label present ? add label height : remove label height; align basebox to center
               hasLabel && (!isLabelPositionLeft || isMobile)