From c7d714bc190cf3f0f0e47b43584ce87a0c97f464 Mon Sep 17 00:00:00 2001
From: Ran Clavano <ran@beforeyoubuy.com.au>
Date: Tue, 20 Jan 2026 10:24:11 +0800
Subject: [PATCH 1/2] feat: Add optional calendar icon to DateField for SRWS

- Add showCalendarIcon prop to DateField (defaults to false)
- Update DateField styles for proper calendar icon spacing
- Calendar icon only appears when explicitly enabled via prop
- Zero impact on existing consumers (backward compatible)

Co-Authored-By: Claude <noreply@anthropic.com>
---
 src/components/DatePicker/DateField.tsx | 7 +++++++
 src/components/DatePicker/styles.tsx    | 5 ++++-
 2 files changed, 11 insertions(+), 1 deletion(-)

diff --git a/src/components/DatePicker/DateField.tsx b/src/components/DatePicker/DateField.tsx
index 7f63035..2e1ffee 100644
--- a/src/components/DatePicker/DateField.tsx
+++ b/src/components/DatePicker/DateField.tsx
@@ -4,6 +4,7 @@ import { forwardRef, useMemo } from 'react';
 import { type TextFieldProps } from '@mui/material';
 import { type DateFieldProps as MuiDateFieldProps } from '@mui/x-date-pickers';
 import moment, { type Moment } from 'moment';
+import { CalendarEvent } from 'tabler-icons-react';
 
 import { automation } from '../../utils';
 import { Adornment } from '../Adornment';
@@ -38,6 +39,8 @@ export type DateFieldProps = {
   startAdornment?: string | React.ReactNode;
   /** whether to add a border around the start adornment */
   showStartAdornmentBorder?: boolean;
+  /** whether to show default calendar icon on the right */
+  showCalendarIcon?: boolean;
   /** A react component that will show beneath the text field, good for checkboxes */
   componentBelowTextField?: React.ReactNode;
 } & Pick<MuiDateFieldProps<moment.Moment>, 'inputRef' | 'disabled'>;
@@ -57,6 +60,7 @@ const DateFieldNoRef: React.ForwardRefRenderFunction<HTMLInputElement, DateField
     errorText,
     startAdornment,
     showStartAdornmentBorder = true,
+    showCalendarIcon = false,
     automationKey,
     leadingIcon,
     componentBelowTextField,
@@ -99,6 +103,9 @@ const DateFieldNoRef: React.ForwardRefRenderFunction<HTMLInputElement, DateField
                   showBorder={showStartAdornmentBorder}
                 />
               ),
+              endAdornment: showCalendarIcon ? (
+                <Adornment position="end" icon={CalendarEvent} showBorder={false} />
+              ) : null,
             },
           },
         }}
diff --git a/src/components/DatePicker/styles.tsx b/src/components/DatePicker/styles.tsx
index 05da4a9..d91eade 100644
--- a/src/components/DatePicker/styles.tsx
+++ b/src/components/DatePicker/styles.tsx
@@ -76,7 +76,7 @@ export const StyledDateField = styled(DateField<Moment>)(({ theme }) => ({
   position: 'relative',
   width: '100%',
   ' .MuiInputBase-input': {
-    padding: theme.spacing(1.5, 1.75, 1.5, 1.25),
+    padding: theme.spacing(1.5, 0.5, 1.5, 1.25),
   },
   '&.MuiFormControl-root *': {
     border: 'none',
@@ -96,6 +96,9 @@ export const StyledDateField = styled(DateField<Moment>)(({ theme }) => ({
     fontSize: theme.typography.size.base.fontSize,
     color: theme.palette.colors.dark90,
   },
+  '&.MuiFormControl-root .MuiInputBase-root .MuiInputAdornment-root': {
+    marginRight: theme.spacing(1.5),
+  },
 }));
 
 export const StyledPaper = styled(Paper)(({ theme }) => ({

From 3a99507fcd1f3cbc1562efc53441159c5878d3ad Mon Sep 17 00:00:00 2001
From: Ran Clavano <ran@beforeyoubuy.com.au>
Date: Thu, 22 Jan 2026 07:03:18 +0800
Subject: [PATCH 2/2] Bump ui lib version

---
 package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package.json b/package.json
index f3f2b3f..610bc38 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@beforeyoubid/ui-lib",
-  "version": "2.3.4",
+  "version": "2.3.5",
   "engines": {
     "node": ">=18.0.0"
   },