Skip to content

Commit

Permalink
[Mobile]Add accessibility label for unselected state (#15126)
Browse files Browse the repository at this point in the history
* Add accessibility label for unselected state

* Improve accessibility handling
  • Loading branch information
pinarol authored and hypest committed May 2, 2019
1 parent e1e6b60 commit 1d0ba05
Showing 1 changed file with 15 additions and 1 deletion.
16 changes: 15 additions & 1 deletion packages/block-library/src/paragraph/edit.native.js
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@
* External dependencies
*/
import { View } from 'react-native';
import { isEmpty } from 'lodash';

/**
* WordPress dependencies
Expand All @@ -10,6 +11,7 @@ import { __ } from '@wordpress/i18n';
import { Component } from '@wordpress/element';
import { createBlock } from '@wordpress/blocks';
import { RichText } from '@wordpress/block-editor';
import { create } from '@wordpress/rich-text';

/**
* Internal dependencies
Expand Down Expand Up @@ -81,6 +83,14 @@ class ParagraphEdit extends Component {
) ) );
}

plainTextContent( html ) {
const result = create( { html } );
if ( result ) {
return result.text;
}
return '';
}

render() {
const {
attributes,
Expand All @@ -95,7 +105,11 @@ class ParagraphEdit extends Component {
} = attributes;

return (
<View>
<View
accessible={ ! this.props.isSelected }
accessibilityLabel={ __( 'Paragraph block' ) + __( '.' ) + ' ' + ( isEmpty( content ) ? __( 'Empty' ) : this.plainTextContent( content ) ) }
onAccessibilityTap={ this.props.onFocus }
>
<RichText
tagName="p"
value={ content }
Expand Down

0 comments on commit 1d0ba05

Please sign in to comment.