From dfabd3b12283eee57b27060aca9561ec4ab22a98 Mon Sep 17 00:00:00 2001 From: Marco Ciampini Date: Tue, 23 Jul 2024 13:08:27 +0200 Subject: [PATCH] List view: add "position" information to the block accessible description text --- .../src/components/list-view/block.js | 13 ++++++++++--- .../src/components/list-view/utils.js | 15 +++++++++++++-- 2 files changed, 23 insertions(+), 5 deletions(-) diff --git a/packages/block-editor/src/components/list-view/block.js b/packages/block-editor/src/components/list-view/block.js index 0f6541f9f5b3b..f4dcf8caef449 100644 --- a/packages/block-editor/src/components/list-view/block.js +++ b/packages/block-editor/src/components/list-view/block.js @@ -465,8 +465,10 @@ function ListViewBlock( { level ); - const blockPropertiesDescription = - getBlockPropertiesDescription( isLocked ); + const blockPropertiesDescription = getBlockPropertiesDescription( + blockInformation, + isLocked + ); const hasSiblings = siblingBlockCount > 0; const hasRenderedMovers = showBlockMovers && hasSiblings; @@ -562,7 +564,12 @@ function ListViewBlock( { ariaDescribedBy={ descriptionId } /> - { `${ blockPositionDescription } ${ blockPropertiesDescription }` } + { [ + blockPositionDescription, + blockPropertiesDescription, + ] + .filter( Boolean ) + .join( ' ' ) } ) } diff --git a/packages/block-editor/src/components/list-view/utils.js b/packages/block-editor/src/components/list-view/utils.js index d6ca4a1f2e005..dfec5beccec45 100644 --- a/packages/block-editor/src/components/list-view/utils.js +++ b/packages/block-editor/src/components/list-view/utils.js @@ -13,8 +13,19 @@ export const getBlockPositionDescription = ( position, siblingCount, level ) => level ); -export const getBlockPropertiesDescription = ( isLocked ) => - isLocked ? __( 'This block is locked.' ) : ''; +export const getBlockPropertiesDescription = ( blockInformation, isLocked ) => + [ + blockInformation?.positionLabel + ? `${ sprintf( + // translators: 1: Position of selected block, e.g. "Sticky" or "Fixed". + __( 'Position: %1$s' ), + blockInformation.positionLabel + ) }.` + : undefined, + isLocked ? __( 'This block is locked.' ) : undefined, + ] + .filter( Boolean ) + .join( ' ' ); /** * Returns true if the client ID occurs within the block selection or multi-selection,