Skip to content

Commit f58f71b

Browse files
authored
fix(DateField): prevent day value from being incorrectly constrained during input (#2291)
When entering dates like "3/31/" and starting to type the year, the day was incorrectly changed from 31 to 30. This occurred because date fields were being set sequentially (day before month), causing the @internationalized/date library to constrain the day based on the placeholder's month instead of the user-entered month. Changes: - Set all date fields simultaneously in handleSegmentKeydown to avoid order-dependent constraints - Include month from segmentValues in daySegmentAttrs for correct aria-valuemax calculation Fixes issue where months with 31 days would be constrained to 30 or fewer days during initial input.
1 parent 40d82dc commit f58f71b

File tree

1 file changed

+12
-7
lines changed

1 file changed

+12
-7
lines changed

packages/core/src/shared/date/useDateField.ts

Lines changed: 12 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -46,7 +46,15 @@ function commonSegmentAttrs(props: SegmentAttrProps) {
4646
function daySegmentAttrs(props: SegmentAttrProps) {
4747
const { segmentValues, placeholder } = props
4848
const isEmpty = segmentValues.day === null
49-
const date = segmentValues.day ? placeholder.set({ day: segmentValues.day }) : placeholder
49+
50+
// Include month from segmentValues to ensure correct max days calculation
51+
const dateFields: { day?: number, month?: number } = {}
52+
if (segmentValues.day)
53+
dateFields.day = segmentValues.day
54+
if (segmentValues.month)
55+
dateFields.month = segmentValues.month
56+
57+
const date = Object.keys(dateFields).length > 0 ? placeholder.set(dateFields) : placeholder
5058

5159
const valueNow = date.day
5260
const valueMin = 1
@@ -864,12 +872,9 @@ export function useDateField(props: UseDateFieldProps) {
864872
if (Object.values(props.segmentValues.value).every(item => item !== null)) {
865873
const updateObject = { ...props.segmentValues.value as Record<AnyExceptLiteral, number> }
866874

867-
let dateRef = props.placeholder.value.copy()
868-
869-
Object.keys(updateObject).forEach((part) => {
870-
const value = updateObject[part as AnyExceptLiteral]
871-
dateRef = dateRef.set({ [part]: value })
872-
})
875+
// Set all date fields at once to avoid order-dependent constraints
876+
// (e.g., setting day: 31 before month: 3 would incorrectly constrain the day)
877+
const dateRef = props.placeholder.value.set(updateObject)
873878

874879
props.modelValue.value = dateRef.copy()
875880
}

0 commit comments

Comments
 (0)