useDisabled: isDisabled to be deprecated.

packages/block-editor/src/components/block-list/use-block-props/index.js

@@ -140,7 +140,7 @@ export function useBlockProps( props = {}, { __unstableIsHtml } = {} ) {
 			enableAnimation,
 			triggerAnimationOnChange: index,
 		} ),
-		useDisabled( { isDisabled: ! hasOverlay } ),
+		useDisabled( { inert: !! hasOverlay } ),
 	] );
 
 	const blockEditContext = useBlockEditContext();

packages/block-editor/src/components/iframe/index.js

@@ -212,7 +212,7 @@ function Iframe( {
 				forceRender();
 			} );
 	}, [] );
-	const disabledRef = useDisabled( { isDisabled: ! readonly } );
+	const disabledRef = useDisabled( { inert: !! readonly } );
 	const bodyRef = useMergeRefs( [
 		contentRef,
 		clearerRef,

packages/compose/README.md

@@ -279,7 +279,7 @@ const DisabledExample = () => {
 _Parameters_
 
 -   _config_ `Object`: Configuration object.
--   _config.isDisabled_ `boolean=`: Whether the element should be disabled.
+-   _config.inert_ `boolean|undefined`: Whether to disable the element or not. If this is false, the element is not disabled.
 
 _Returns_
 

packages/compose/src/hooks/use-disabled/index.ts

@@ -3,6 +3,27 @@
  */
 import { debounce } from '../../utils/debounce';
 import useRefEffect from '../use-ref-effect';
+/**
+ * WordPress dependencies
+ */
+import deprecated from '@wordpress/deprecated';
+
+type UseDisabledProps = {
+	/**
+	 * Whether the element should be disabled. @deprecated
+	 *
+	 * @default false
+	 * @deprecated
+	 */
+	isDisabled?: boolean;
+
+	/**
+	 * Whether to disable the element or not. If this is false, the element is not disabled.
+	 *
+	 * @default true
+	 */
+	inert?: boolean;
+};
 
 /**
  * In some circumstances, such as block previews, all focusable DOM elements
@@ -11,8 +32,8 @@ import useRefEffect from '../use-ref-effect';
  *
  * If you can, prefer the use of the inert HTML attribute.
  *
- * @param {Object}   config            Configuration object.
- * @param {boolean=} config.isDisabled Whether the element should be disabled.
+ * @param {Object}            config       Configuration object.
+ * @param {boolean|undefined} config.inert Whether to disable the element or not. If this is false, the element is not disabled.
  * @return {import('react').RefCallback<HTMLElement>} Element Ref.
  *
  * @example
@@ -31,11 +52,24 @@ import useRefEffect from '../use-ref-effect';
  * ```
  */
 export default function useDisabled( {
-	isDisabled: isDisabledProp = false,
-} = {} ) {
+	inert: inertProp = true,
+	...props
+}: UseDisabledProps = {} ) {
+	let isInert = inertProp;
+	const { isDisabled } = props;
+
+	if ( isDisabled !== undefined ) {
+		deprecated( '`isDisabled` parameter in `useDisabled`', {
+			since: '6.3',
+			alternative: '`inert` parameter',
+		} );
+
+		isInert = ! isDisabled;
+	}
+
 	return useRefEffect(
 		( node ) => {
-			if ( isDisabledProp ) {
+			if ( ! isInert ) {
 				return;
 			}
 
@@ -81,6 +115,6 @@ export default function useDisabled( {
 				updates.forEach( ( update ) => update() );
 			};
 		},
-		[ isDisabledProp ]
+		[ isInert ]
 	);
 }

packages/compose/src/hooks/use-disabled/test/index.js

@@ -26,7 +26,7 @@ describe( 'useDisabled', () => {
 	} );
 
 	function DisabledComponent( props ) {
-		const disabledRef = useDisabled();
+		const disabledRef = useDisabled( { inert: props.inert } );
 		return <Form ref={ disabledRef } { ...props } />;
 	}
 
@@ -42,6 +42,18 @@ describe( 'useDisabled', () => {
 		expect( p ).toHaveAttribute( 'inert', 'true' );
 	} );
 
+	it( 'will not disable all fields', () => {
+		render( <DisabledComponent inert={ false } /> );
+
+		const input = screen.getByRole( 'textbox' );
+		const link = screen.getByRole( 'link' );
+		const p = screen.getByRole( 'document' );
+
+		expect( input ).not.toHaveAttribute( 'inert' );
+		expect( link ).not.toHaveAttribute( 'inert' );
+		expect( p ).not.toHaveAttribute( 'inert' );
+	} );
+
 	it( 'will disable an element rendered in an update to the component', async () => {
 		const { rerender } = render(
 			<DisabledComponent showButton={ false } />