From c4c99c4dbe8b5ccf92c51dc1606218052ed540c6 Mon Sep 17 00:00:00 2001 From: Armaan Gupta Date: Mon, 15 Dec 2025 23:16:18 +0530 Subject: [PATCH 1/2] fixed Date field component issue with min-max range --- .../src/components/DateInput.tsx | 18 +++++++++++++++++- 1 file changed, 17 insertions(+), 1 deletion(-) diff --git a/packages/react-vanilla-components/src/components/DateInput.tsx b/packages/react-vanilla-components/src/components/DateInput.tsx index 4c9f3dd3..ff41d70a 100644 --- a/packages/react-vanilla-components/src/components/DateInput.tsx +++ b/packages/react-vanilla-components/src/components/DateInput.tsx @@ -23,9 +23,23 @@ import { PROPS } from '../utils/type'; import FieldWrapper from './common/FieldWrapper'; import { syncAriaDescribedBy } from '../utils/utils'; +// Helper function to convert date to ISO format (YYYY-MM-DD) +const toISODateString = (dateValue: string | number | undefined): string | undefined => { + if (dateValue === undefined || dateValue === null) {return undefined;} + try { + const date = new Date(dateValue); + if (isNaN(date.getTime())) {return undefined;} + return date.toISOString().split('T')[0]; + } catch { + return undefined; + } +}; + const DateInput = (props: PROPS) => { - const { id, label, value, required, name, readOnly, placeholder, visible, enabled, appliedCssClassNames, valid } = props; + const { id, label, value, required, name, readOnly, placeholder, visible, enabled, appliedCssClassNames, valid, minimum, maximum } = props; const finalValue = value === undefined ? '' : value; + const minDate = toISODateString(minimum); + const maxDate = toISODateString(maximum); const changeHandler = useCallback((e: React.ChangeEvent) => { const val = e.target.value; @@ -64,6 +78,8 @@ const DateInput = (props: PROPS) => { value={finalValue} name={name} required={required} + min={minDate} + max={maxDate} onChange={changeHandler} className={'cmp-adaptiveform-datepicker__widget'} title={props.tooltipText || ''} From bb16541753a71d60fc8ff2257b220f6512633712 Mon Sep 17 00:00:00 2001 From: Armaan Gupta Date: Mon, 5 Jan 2026 15:21:00 +0530 Subject: [PATCH 2/2] code refactoring --- .../src/components/DateInput.tsx | 18 ++---------------- 1 file changed, 2 insertions(+), 16 deletions(-) diff --git a/packages/react-vanilla-components/src/components/DateInput.tsx b/packages/react-vanilla-components/src/components/DateInput.tsx index ff41d70a..70626a7c 100644 --- a/packages/react-vanilla-components/src/components/DateInput.tsx +++ b/packages/react-vanilla-components/src/components/DateInput.tsx @@ -23,23 +23,9 @@ import { PROPS } from '../utils/type'; import FieldWrapper from './common/FieldWrapper'; import { syncAriaDescribedBy } from '../utils/utils'; -// Helper function to convert date to ISO format (YYYY-MM-DD) -const toISODateString = (dateValue: string | number | undefined): string | undefined => { - if (dateValue === undefined || dateValue === null) {return undefined;} - try { - const date = new Date(dateValue); - if (isNaN(date.getTime())) {return undefined;} - return date.toISOString().split('T')[0]; - } catch { - return undefined; - } -}; - const DateInput = (props: PROPS) => { const { id, label, value, required, name, readOnly, placeholder, visible, enabled, appliedCssClassNames, valid, minimum, maximum } = props; const finalValue = value === undefined ? '' : value; - const minDate = toISODateString(minimum); - const maxDate = toISODateString(maximum); const changeHandler = useCallback((e: React.ChangeEvent) => { const val = e.target.value; @@ -78,8 +64,8 @@ const DateInput = (props: PROPS) => { value={finalValue} name={name} required={required} - min={minDate} - max={maxDate} + min={minimum} + max={maximum} onChange={changeHandler} className={'cmp-adaptiveform-datepicker__widget'} title={props.tooltipText || ''}