Correct a11y properties

WordPress · May 6, 2020 · f41161c · f41161c
1 parent 0b9c30d
commit f41161c
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 4 deletions.
diff --git a/packages/block-editor/src/components/block-mobile-toolbar/index.native.js b/packages/block-editor/src/components/block-mobile-toolbar/index.native.js
@@ -17,7 +17,7 @@ import { trash } from '@wordpress/icons';
  */
 import styles from './style.scss';
 import BlockMover from '../block-mover';
-import ShrinkedBlockMobileToolbar from './shrinked-block-mobile-toolbar';
+import ShrinkBlockMobileToolbar from './shrink-block-mobile-toolbar';
 import { BlockSettingsButton } from '../block-settings';
 
 const BlockMobileToolbar = ( {
@@ -29,7 +29,7 @@ const BlockMobileToolbar = ( {
 } ) => (
 	<View style={ styles.toolbar }>
 		{ allowShrinkToolbar ? (
-			<ShrinkedBlockMobileToolbar
+			<ShrinkBlockMobileToolbar
 				clientIds={ [ clientId ] }
 				isStackedHorizontally={ isStackedHorizontally }
 				onDelete={ onDelete }

diff --git a/...r/shrinked-block-mobile-toolbar.native.js → ...bar/shrink-block-mobile-toolbar.native.js b/...r/shrinked-block-mobile-toolbar.native.js → ...bar/shrink-block-mobile-toolbar.native.js
@@ -20,7 +20,7 @@ import {
 	getArrowIcon,
 } from '../block-mover/mover-description';
 
-const ShrinkedBlockMobileToolbar = ( {
+const ShrinkBlockMobileToolbar = ( {
 	onDelete,
 	isStackedHorizontally,
 	openGeneralSidebar,
@@ -82,11 +82,25 @@ const ShrinkedBlockMobileToolbar = ( {
 		.map( ( option, index ) => option.disabled && index + 1 )
 		.filter( Boolean );
 
+	const accessibilityHintIOS = __(
+		'Double tap to open Action Sheet with available options'
+	);
+	const accessibilityHintAndroid = __(
+		'Double tap to open Bottom Sheet with available options'
+	);
+
 	return (
 		<>
 			<ToolbarButton
+				title={ __( 'Open Settings' ) }
 				onClick={ () => this.picker.presentPicker() }
 				icon={ moreVertical }
+				extraProps={ {
+					hint:
+						Platform.OS === 'ios'
+							? accessibilityHintIOS
+							: accessibilityHintAndroid,
+				} }
 			/>
 			<Picker
 				ref={ ( instance ) => ( this.picker = instance ) }
@@ -134,4 +148,4 @@ export default compose(
 		};
 	} ),
 	withInstanceId
-)( ShrinkedBlockMobileToolbar );
+)( ShrinkBlockMobileToolbar );