Skip to content
Permalink
Browse files

Fix flow typing of Text

Summary:
Make Text prop types exact to catch tons of errors, including typos like in https://fb.workplace.com/groups/rn.support/permalink/2306953619353240/.

I tried to fix things when it was totally obvious what the intent was, but otherwise tried to keep the existing behavior the same, even if it meant that usage of some props was getting ignored, like `hitSlop`.

Reviewed By: TheSavior

Differential Revision: D13892999

fbshipit-source-id: 5003508a648287e4eca8055fb59da5f03bd066cc
  • Loading branch information...
sahrens authored and facebook-github-bot committed Feb 5, 2019
1 parent cae6bef commit 10c835214160cc5a5726c8dd9f0d42a0275d198b
Showing with 12 additions and 10 deletions.
  1. +5 −6 Libraries/Text/Text.js
  2. +5 −2 Libraries/Text/TextProps.js
  3. +2 −2 RNTester/js/TextInputExample.ios.js
@@ -34,10 +34,10 @@ type ResponseHandlers = $ReadOnly<{|
onResponderTerminationRequest: () => boolean,
|}>;

type Props = $ReadOnly<{
type Props = $ReadOnly<{|
...TextProps,
forwardedRef: ?React.Ref<'RCTText' | 'RCTVirtualText'>,
}>;
|}>;

type State = {|
touchable: {|
@@ -286,7 +286,6 @@ TextToExport.displayName = 'Text';
* and run Flow. */
TextToExport.propTypes = DeprecatedTextPropTypes;

/* $FlowFixMe(>=0.89.0 site=react_native_fb) This comment suppresses an error
* found when Flow v0.89 was deployed. To see the error, delete this comment
* and run Flow. */
module.exports = (TextToExport: Class<NativeComponent<TextProps>>);
module.exports = ((TextToExport: $FlowFixMe): Class<
NativeComponent<TextProps>,
>);
@@ -29,13 +29,15 @@ export type PressRetentionOffset = $ReadOnly<{|
/**
* @see https://facebook.github.io/react-native/docs/text.html#reference
*/
export type TextProps = $ReadOnly<{
export type TextProps = $ReadOnly<{|
/**
* Indicates whether the view is an accessibility element.
*
* See https://facebook.github.io/react-native/docs/text.html#accessible
*/
accessible?: ?boolean,
accessibilityHint?: ?Stringish,
accessibilityLabel?: ?Stringish,
accessibilityRole?: ?AccessibilityRole,
accessibilityStates?: ?AccessibilityStates,
accessibilityTraits?: ?(AccessibilityTrait | Array<AccessibilityTrait>),
@@ -112,6 +114,7 @@ export type TextProps = $ReadOnly<{
onResponderTerminate?: ?(event: PressEvent) => void,
onResponderTerminationRequest?: ?() => boolean,
onStartShouldSetResponder?: ?() => boolean,
onMoveShouldSetResponder?: ?() => boolean,
onTextLayout?: ?(event: TextLayoutEvent) => mixed,

/**
@@ -180,4 +183,4 @@ export type TextProps = $ReadOnly<{
* See https://facebook.github.io/react-native/docs/text.html#supperhighlighting
*/
suppressHighlighting?: ?boolean,
}>;
|}>;
@@ -630,7 +630,7 @@ exports.examples = [
<WithLabel label="singleline">
<TextInput style={styles.default} value="(value property)">
(first raw text node)
<Text color="red">(internal raw text node)</Text>
<Text style={{color: 'red'}}>(internal raw text node)</Text>
(last raw text node)
</TextInput>
</WithLabel>
@@ -640,7 +640,7 @@ exports.examples = [
multiline={true}
value="(value property)">
(first raw text node)
<Text color="red">(internal raw text node)</Text>
<Text style={{color: 'red'}}>(internal raw text node)</Text>
(last raw text node)
</TextInput>
</WithLabel>

0 comments on commit 10c8352

Please sign in to comment.
You can’t perform that action at this time.