Skip to content

feat: expose isRequired in render props for DateField, TimeField, DatePicker, and DateRangePicker#9659

Open
solssak wants to merge 1 commit intoadobe:mainfrom
solssak:fix/expose-isRequired-render-props
Open

feat: expose isRequired in render props for DateField, TimeField, DatePicker, and DateRangePicker#9659
solssak wants to merge 1 commit intoadobe:mainfrom
solssak:fix/expose-isRequired-render-props

Conversation

@solssak
Copy link

@solssak solssak commented Feb 14, 2026

Summary

Closes #9643

Adds isRequired as a direct render prop and data-required data attribute to DateField, TimeField, DatePicker, and DateRangePicker, matching the existing pattern used by TextField, NumberField, and other field components.

Changes

Source (packages/react-aria-components/src/)

  • DateField.tsx

    • Added isRequired: boolean to DateFieldRenderProps interface (shared by both DateField and TimeField)
    • Added isRequired: props.isRequired || false to useRenderProps values in DateField
    • Added data-required data attribute to DateField outer element
    • Added isRequired: props.isRequired || false to useRenderProps values in TimeField
    • Added data-required data attribute to TimeField outer element
  • DatePicker.tsx

    • Added isRequired: boolean to DatePickerRenderProps interface (inherited by DateRangePickerRenderProps via Omit<DatePickerRenderProps, 'state'>)
    • Added isRequired: props.isRequired || false to useRenderProps values in DatePicker
    • Added data-required data attribute to DatePicker outer element
    • Added isRequired: props.isRequired || false to useRenderProps values in DateRangePicker
    • Added data-required data attribute to DateRangePicker outer element

Tests (packages/react-aria-components/test/)

  • DateField.test.js: Added should support required render prop and should support required state tests
  • TimeField.test.js: Added should support required render prop and should support required state tests
  • DatePicker.test.js: Added should support required render prop and should support required state tests
  • DateRangePicker.test.js: Added should support required render prop and should support required state tests

Before / After

Before:

<DateField isRequired>
  {({ isInvalid, state }) => (
    // isRequired not directly available
    <Label isRequired={state.isRequired}>Date</Label>
  )}
</DateField>

After:

<DateField isRequired>
  {({ isRequired, isInvalid }) => (
    <Label isRequired={isRequired}>Date</Label>
  )}
</DateField>

Now consistent with TextField, NumberField, and other field components.

@github-actions github-actions bot added the RAC label Feb 14, 2026
@solssak solssak force-pushed the fix/expose-isRequired-render-props branch from b06dca9 to 40f8df8 Compare February 14, 2026 02:10
@solssak solssak closed this Feb 14, 2026
@solssak solssak reopened this Feb 14, 2026
@solssak solssak force-pushed the fix/expose-isRequired-render-props branch from 40f8df8 to 65075f2 Compare February 14, 2026 02:15
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

DateField render props missing direct isRequired unlike other field components

1 participant