- DataForm: Add second argument to the `onChange` callback that contains an `isValid` boolean property and remove `isItemValid` utility. [#71345](https://github.com/WordPress/gutenberg/pull/71345)

Callback function that receives an object with the edits done by the user. It also receives a second parameter that indicates whether the current item is valid or not according to the current fields and form configuration.

const onChange = ( edits, { isValid } ) => {

import { isItemValid } from '../../validation';

const onChangeWithValidation = ( updatedData: Partial< Item > ) => {

if ( ! onChange ) {

return;

}

const isValid = isItemValid(

{

...data,

...updatedData,

},

fields,

form

);

onChange( updatedData, { isValid } );

};

<DataFormLayout

data={ data }

form={ form }

onChange={ onChangeWithValidation }

/>

const [ isPostValid, setIsValid ] = useState( true );

onChange={ ( edits, { isValid } ) => {

} ) );

setIsValid( isValid );

} }

disabled={ ! isPostValid }

expect( onChange ).toHaveBeenNthCalledWith(

i + 1,

{

title: newValue[ i ],

},

{ isValid: true }

);

expect( onChange ).toHaveBeenCalledWith(

{ title: 'New Title' },

{ isValid: true }

);

expect( onChange ).toHaveBeenNthCalledWith(

i + 1,

{

title: newValue[ i ],

},

{ isValid: true }

);

onChange: (

value: Record< string, any >,

validation: { isValid: boolean }

) => void;

import { DataForm } from '@wordpress/dataviews';

const [ isItemValid, setIsValid ] = useState( true );

if ( ! isItemValid ) {

onChange={ ( changes, { isValid } ) => {

} );

setIsValid( isValid );

} }

disabled={ ! isItemValid }