diff --git a/packages/react-aria-components/src/SearchField.tsx b/packages/react-aria-components/src/SearchField.tsx index 7bfdc703008..4a86b4f4ace 100644 --- a/packages/react-aria-components/src/SearchField.tsx +++ b/packages/react-aria-components/src/SearchField.tsx @@ -54,6 +54,16 @@ export interface SearchFieldRenderProps { * @selector [data-invalid] */ isInvalid: boolean, + /** + * Whether the search field is read only. + * @selector [data-readonly] + */ + isReadOnly: boolean, + /** + * Whether the search field is required. + * @selector [data-required] + */ + isRequired: boolean, /** * State of the search field. */ @@ -99,6 +109,8 @@ export const SearchField = /*#__PURE__*/ createHideableComponent(function Search isEmpty: state.value === '', isDisabled: props.isDisabled || false, isInvalid: validation.isInvalid || false, + isReadOnly: props.isReadOnly || false, + isRequired: props.isRequired || false, state }, defaultClassName: 'react-aria-SearchField' @@ -115,7 +127,9 @@ export const SearchField = /*#__PURE__*/ createHideableComponent(function Search slot={props.slot || undefined} data-empty={state.value === '' || undefined} data-disabled={props.isDisabled || undefined} - data-invalid={validation.isInvalid || undefined}> + data-invalid={validation.isInvalid || undefined} + data-readonly={props.isReadOnly || undefined} + data-required={props.isRequired || undefined}>