diff --git a/docs/components/Text.md b/docs/components/Text.md
index cdeea937..13ae37a8 100644
--- a/docs/components/Text.md
+++ b/docs/components/Text.md
@@ -32,7 +32,7 @@ Note: Avoid changing `accessibilityRole` values over time or after user
actions. Generally, accessibility APIs do not provide a means of notifying
assistive technologies of a `role` value change.
-(web) **accessible**: bool = true
+**accessible**: bool = true
When `false`, the text is hidden from assistive technologies. (This is
implemented using `aria-hidden`.)
@@ -54,6 +54,10 @@ height } } }`, where `x` and `y` are the offsets from the parent node.
This function is called on press.
+**selectable**: bool = true
+
+Lets the user select the text.
+
**style**: style
+ ...[View#style](View.md)
diff --git a/src/components/Text/__tests__/index-test.js b/src/components/Text/__tests__/index-test.js
index 0eb1170d..271c21e8 100644
--- a/src/components/Text/__tests__/index-test.js
+++ b/src/components/Text/__tests__/index-test.js
@@ -31,4 +31,11 @@ suite('components/Text', () => {
done()
}
})
+
+ test('prop "selectable"', () => {
+ let text = shallow()
+ assert.equal(text.prop('style').userSelect, undefined)
+ text = shallow()
+ assert.equal(text.prop('style').userSelect, 'none')
+ })
})
diff --git a/src/components/Text/index.js b/src/components/Text/index.js
index 8359edb1..9f9c2ac4 100644
--- a/src/components/Text/index.js
+++ b/src/components/Text/index.js
@@ -11,18 +11,20 @@ class Text extends Component {
static propTypes = {
accessibilityLabel: createReactDOMComponent.propTypes.accessibilityLabel,
- accessibilityRole: createReactDOMComponent.propTypes.accessibilityRole,
+ accessibilityRole: PropTypes.oneOf([ 'heading', 'link' ]),
accessible: createReactDOMComponent.propTypes.accessible,
children: PropTypes.any,
numberOfLines: PropTypes.number,
onLayout: PropTypes.func,
onPress: PropTypes.func,
+ selectable: PropTypes.bool,
style: StyleSheetPropType(TextStylePropTypes),
testID: createReactDOMComponent.propTypes.testID
};
static defaultProps = {
- accessible: true
+ accessible: true,
+ selectable: true
};
render() {
@@ -30,6 +32,7 @@ class Text extends Component {
numberOfLines,
onLayout, // eslint-disable-line
onPress, // eslint-disable-line
+ selectable,
style,
...other
} = this.props
@@ -41,6 +44,7 @@ class Text extends Component {
style: [
styles.initial,
style,
+ !selectable && styles.notSelectable,
numberOfLines === 1 && styles.singleLineStyle
]
})
@@ -63,6 +67,9 @@ const styles = StyleSheet.create({
textDecorationLine: 'none',
wordWrap: 'break-word'
},
+ notSelectable: {
+ userSelect: 'none'
+ },
singleLineStyle: {
maxWidth: '100%',
overflow: 'hidden',