diff --git a/packages/block-editor/src/components/grid/grid-item-movers.js b/packages/block-editor/src/components/grid/grid-item-movers.js index 4f1d3853568fd..ed8e35c201f7e 100644 --- a/packages/block-editor/src/components/grid/grid-item-movers.js +++ b/packages/block-editor/src/components/grid/grid-item-movers.js @@ -46,7 +46,7 @@ export function GridItemMovers( { { onChange( { rowStart: rowStart - 1, @@ -66,7 +66,7 @@ export function GridItemMovers( { = rowCount } + disabled={ rowCount && rowEnd >= rowCount } onClick={ () => { onChange( { rowStart: rowStart + 1, @@ -86,7 +86,7 @@ export function GridItemMovers( { { onChange( { columnStart: columnStartNumber - 1, @@ -106,7 +106,7 @@ export function GridItemMovers( { = columnCount } + disabled={ columnCount && columnEnd >= columnCount } onClick={ () => { onChange( { columnStart: columnStartNumber + 1, diff --git a/packages/block-library/src/list-item/edit.js b/packages/block-library/src/list-item/edit.js index 42a8bb5551319..71be31c03c0f8 100644 --- a/packages/block-library/src/list-item/edit.js +++ b/packages/block-library/src/list-item/edit.js @@ -61,7 +61,7 @@ export function IndentUI( { clientId } ) { icon={ isRTL() ? formatIndentRTL : formatIndent } title={ __( 'Indent' ) } describedBy={ __( 'Indent list item' ) } - isDisabled={ ! canIndent } + disabled={ ! canIndent } onClick={ () => indentListItem() } /> diff --git a/packages/block-library/src/navigation-submenu/edit.js b/packages/block-library/src/navigation-submenu/edit.js index bbba77707e815..4decc2e68ffbb 100644 --- a/packages/block-library/src/navigation-submenu/edit.js +++ b/packages/block-library/src/navigation-submenu/edit.js @@ -387,7 +387,7 @@ export default function NavigationSubmenuEdit( { title={ __( 'Convert to Link' ) } onClick={ transformToLink } className="wp-block-navigation__submenu__revert" - isDisabled={ ! canConvertToLink } + disabled={ ! canConvertToLink } /> diff --git a/packages/components/CHANGELOG.md b/packages/components/CHANGELOG.md index 2f8da9ba0ec0d..a0d4bef929311 100644 --- a/packages/components/CHANGELOG.md +++ b/packages/components/CHANGELOG.md @@ -9,6 +9,10 @@ - `UnitControl`: Fix an issue where keyboard shortcuts unintentionally shift focus on Windows OS. ([#62988](https://github.com/WordPress/gutenberg/pull/62988)) - Fix inaccessibly disabled `Button`s ([#62306](https://github.com/WordPress/gutenberg/pull/62306)). +### Enhancements + +- `ToolbarButton`: Deprecate `isDisabled` prop and merge with `disabled` ([#63101](https://github.com/WordPress/gutenberg/pull/63101)). + ### Internal - `CustomSelectControlV2`: prevent keyboard event propagation in legacy wrapper. ([#62907](https://github.com/WordPress/gutenberg/pull/62907)) diff --git a/packages/components/src/toolbar/toolbar-button/index.tsx b/packages/components/src/toolbar/toolbar-button/index.tsx index 05278bb37ba97..48f385fa1abaf 100644 --- a/packages/components/src/toolbar/toolbar-button/index.tsx +++ b/packages/components/src/toolbar/toolbar-button/index.tsx @@ -19,19 +19,29 @@ import ToolbarButtonContainer from './toolbar-button-container'; import type { ToolbarButtonProps } from './types'; import type { WordPressComponentProps } from '../../context'; +function useDeprecatedProps( { + isDisabled, + ...otherProps +}: React.ComponentProps< typeof ToolbarButton > ) { + return { + disabled: isDisabled, + ...otherProps, + }; +} + function UnforwardedToolbarButton( - { + props: WordPressComponentProps< ToolbarButtonProps, typeof Button, false >, + ref: ForwardedRef< any > +) { + const { children, className, containerClassName, extraProps, isActive, - isDisabled, title, - ...props - }: WordPressComponentProps< ToolbarButtonProps, typeof Button, false >, - ref: ForwardedRef< any > -) { + ...restProps + } = useDeprecatedProps( props ); const accessibleToolbarState = useContext( ToolbarContext ); if ( ! accessibleToolbarState ) { @@ -39,10 +49,10 @@ function UnforwardedToolbarButton( @@ -79,18 +88,13 @@ function UnforwardedToolbarButton( { ( toolbarItemProps ) => (