@onekeyfe/react-native-text-input 0.2.4 → 0.2.7

package/lib/commonjs/Input.js

@@ -1,7 +1,12 @@
 "use strict";
 
-var _usePressability = _interopRequireDefault(require("react-native/Libraries/Pressability/usePressability"));
-var _flattenStyle = _interopRequireDefault(require("react-native/Libraries/StyleSheet/flattenStyle"));
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var ReactNativeFeatureFlags = _interopRequireWildcard(require("react-native/src/private/featureflags/ReactNativeFeatureFlags.js"));
+var _usePressability = _interopRequireDefault(require("react-native/Libraries/Pressability/usePressability.js"));
+var _flattenStyle = _interopRequireDefault(require("react-native/Libraries/StyleSheet/flattenStyle.js"));
 var _StyleSheet = _interopRequireDefault(require("react-native/Libraries/StyleSheet/StyleSheet"));
 var _Text = _interopRequireDefault(require("react-native/Libraries/Text/Text"));
 var _TextAncestor = _interopRequireDefault(require("react-native/Libraries/Text/TextAncestor"));
@@ -13,21 +18,9 @@ var _nullthrows = _interopRequireDefault(require("nullthrows"));
 var _react = _interopRequireWildcard(require("react"));
 var React = _react;
 var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-/* eslint-disable prettier/prettier */
-
-/**
- * Copyright (c) Meta Platforms, Inc. and affiliates.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- *
- * 
- * @format
- */
-
 let AndroidTextInput;
 let AndroidTextInputCommands;
 let RCTSinglelineTextInputView;
@@ -35,8 +28,8 @@ let RCTSinglelineTextInputNativeCommands;
 let RCTMultilineTextInputView;
 let RCTMultilineTextInputNativeCommands;
 if (_Platform.default.OS === 'android') {
-  AndroidTextInput = require('./TextInputViewNativeComponent').default;
-  AndroidTextInputCommands = require('react-native/Libraries/Components/TextInput/AndroidTextInputNativeComponent').Commands;
+  AndroidTextInput = require('./AndroidTextInputNativeComponent').default;
+  AndroidTextInputCommands = require('./AndroidTextInputNativeComponent').Commands;
 } else if (_Platform.default.OS === 'ios') {
   RCTSinglelineTextInputView = require('react-native/Libraries/Components/TextInput/RCTSingelineTextInputNativeComponent').default;
   RCTSinglelineTextInputNativeCommands = require('react-native/Libraries/Components/TextInput/RCTSingelineTextInputNativeComponent').Commands;
@@ -44,142 +37,14 @@ if (_Platform.default.OS === 'android') {
   RCTMultilineTextInputNativeCommands = require('react-native/Libraries/Components/TextInput/RCTMultilineTextInputNativeComponent').Commands;
 }
 const emptyFunctionThatReturnsTrue = () => true;
-
-/**
- * A foundational component for inputting text into the app via a
- * keyboard. Props provide configurability for several features, such as
- * auto-correction, auto-capitalization, placeholder text, and different keyboard
- * types, such as a numeric keypad.
- *
- * The simplest use case is to plop down a `TextInput` and subscribe to the
- * `onChangeText` events to read the user input. There are also other events,
- * such as `onSubmitEditing` and `onFocus` that can be subscribed to. A simple
- * example:
- *
- * ```ReactNativeWebPlayer
- * import React, { Component } from 'react';
- * import { AppRegistry, TextInput } from 'react-native';
- *
- * export default class UselessTextInput extends Component {
- *   constructor(props) {
- *     super(props);
- *     this.state = { text: 'Useless Placeholder' };
- *   }
- *
- *   render() {
- *     return (
- *       <TextInput
- *         style={{height: 40, borderColor: 'gray', borderWidth: 1}}
- *         onChangeText={(text) => this.setState({text})}
- *         value={this.state.text}
- *       />
- *     );
- *   }
- * }
- *
- * // skip this line if using Create React Native App
- * AppRegistry.registerComponent('AwesomeProject', () => UselessTextInput);
- * ```
- *
- * Two methods exposed via the native element are .focus() and .blur() that
- * will focus or blur the TextInput programmatically.
- *
- * Note that some props are only available with `multiline={true/false}`.
- * Additionally, border styles that apply to only one side of the element
- * (e.g., `borderBottomColor`, `borderLeftWidth`, etc.) will not be applied if
- * `multiline=false`. To achieve the same effect, you can wrap your `TextInput`
- * in a `View`:
- *
- * ```ReactNativeWebPlayer
- * import React, { Component } from 'react';
- * import { AppRegistry, View, TextInput } from 'react-native';
- *
- * class UselessTextInput extends Component {
- *   render() {
- *     return (
- *       <TextInput
- *         {...this.props} // Inherit any props passed to it; e.g., multiline, numberOfLines below
- *         editable={true}
- *         maxLength={40}
- *       />
- *     );
- *   }
- * }
- *
- * export default class UselessTextInputMultiline extends Component {
- *   constructor(props) {
- *     super(props);
- *     this.state = {
- *       text: 'Useless Multiline Placeholder',
- *     };
- *   }
- *
- *   // If you type something in the text box that is a color, the background will change to that
- *   // color.
- *   render() {
- *     return (
- *      <View style={{
- *        backgroundColor: this.state.text,
- *        borderBottomColor: '#000000',
- *        borderBottomWidth: 1 }}
- *      >
- *        <UselessTextInput
- *          multiline={true}
- *          numberOfLines={4}
- *          onChangeText={(text) => this.setState({text})}
- *          value={this.state.text}
- *        />
- *      </View>
- *     );
- *   }
- * }
- *
- * // skip these lines if using Create React Native App
- * AppRegistry.registerComponent(
- *  'AwesomeProject',
- *  () => UselessTextInputMultiline
- * );
- * ```
- *
- * `TextInput` has by default a border at the bottom of its view. This border
- * has its padding set by the background image provided by the system, and it
- * cannot be changed. Solutions to avoid this is to either not set height
- * explicitly, case in which the system will take care of displaying the border
- * in the correct position, or to not display the border by setting
- * `underlineColorAndroid` to transparent.
- *
- * Note that on Android performing text selection in input can change
- * app's activity `windowSoftInputMode` param to `adjustResize`.
- * This may cause issues with components that have position: 'absolute'
- * while keyboard is active. To avoid this behavior either specify `windowSoftInputMode`
- * in AndroidManifest.xml ( https://developer.android.com/guide/topics/manifest/activity-element.html )
- * or control this param programmatically with native code.
- *
- */
-function InternalTextInput(props) {
-  const {
-    'aria-busy': ariaBusy,
-    'aria-checked': ariaChecked,
-    'aria-disabled': ariaDisabled,
-    'aria-expanded': ariaExpanded,
-    'aria-selected': ariaSelected,
-    accessibilityState,
-    id,
-    tabIndex,
-    selection: propsSelection,
-    selectionColor,
-    selectionHandleColor,
-    cursorColor,
-    ...otherProps
-  } = props;
-  const inputRef = (0, _react.useRef)(null);
-
-  // eslint-disable-next-line react-hooks/exhaustive-deps
-  const selection = propsSelection == null ? null : {
-    start: propsSelection.start,
-    end: propsSelection.end ?? propsSelection.start
-  };
-  const [mostRecentEventCount, setMostRecentEventCount] = (0, _react.useState)(0);
+function useTextInputStateSynchronization_STATE({
+  props,
+  mostRecentEventCount,
+  selection,
+  inputRef,
+  text,
+  viewCommands
+}) {
   const [lastNativeText, setLastNativeText] = (0, _react.useState)(props.value);
   const [lastNativeSelectionState, setLastNativeSelection] = (0, _react.useState)({
     selection: {
@@ -189,17 +54,6 @@ function InternalTextInput(props) {
     mostRecentEventCount: mostRecentEventCount
   });
   const lastNativeSelection = lastNativeSelectionState.selection;
-  let viewCommands;
-  if (AndroidTextInputCommands) {
-    viewCommands = AndroidTextInputCommands;
-  } else {
-    viewCommands = props.multiline === true ? RCTMultilineTextInputNativeCommands : RCTSinglelineTextInputNativeCommands;
-  }
-  const text = typeof props.value === 'string' ? props.value : typeof props.defaultValue === 'string' ? props.defaultValue : '';
-
-  // This is necessary in case native updates the text and JS decides
-  // that the update should be ignored and we should stick with the value
-  // that we have in JS.
   (0, _react.useLayoutEffect)(() => {
     const nativeUpdate = {};
     if (lastNativeText !== props.value && typeof props.value === 'string') {
@@ -220,6 +74,93 @@ function InternalTextInput(props) {
       viewCommands.setTextAndSelection(inputRef.current, mostRecentEventCount, text, selection?.start ?? -1, selection?.end ?? -1);
     }
   }, [mostRecentEventCount, inputRef, props.value, props.defaultValue, lastNativeText, selection, lastNativeSelection, text, viewCommands]);
+  return {
+    setLastNativeText,
+    setLastNativeSelection
+  };
+}
+function useTextInputStateSynchronization_REFS({
+  props,
+  mostRecentEventCount,
+  selection,
+  inputRef,
+  text,
+  viewCommands
+}) {
+  const lastNativeTextRef = (0, _react.useRef)(props.value);
+  const lastNativeSelectionRef = (0, _react.useRef)({
+    selection: {
+      start: -1,
+      end: -1
+    },
+    mostRecentEventCount: mostRecentEventCount
+  });
+  (0, _react.useLayoutEffect)(() => {
+    const nativeUpdate = {};
+    const lastNativeSelection = lastNativeSelectionRef.current.selection;
+    if (lastNativeTextRef.current !== props.value && typeof props.value === 'string') {
+      nativeUpdate.text = props.value;
+      lastNativeTextRef.current = props.value;
+    }
+    if (selection && lastNativeSelection && (lastNativeSelection.start !== selection.start || lastNativeSelection.end !== selection.end)) {
+      nativeUpdate.selection = selection;
+      lastNativeSelectionRef.current = {
+        selection,
+        mostRecentEventCount
+      };
+    }
+    if (Object.keys(nativeUpdate).length === 0) {
+      return;
+    }
+    if (inputRef.current != null) {
+      viewCommands.setTextAndSelection(inputRef.current, mostRecentEventCount, text, selection?.start ?? -1, selection?.end ?? -1);
+    }
+  }, [mostRecentEventCount, inputRef, props.value, props.defaultValue, selection, text, viewCommands]);
+  return {
+    setLastNativeText: lastNativeText => {
+      lastNativeTextRef.current = lastNativeText;
+    },
+    setLastNativeSelection: lastNativeSelection => {
+      lastNativeSelectionRef.current = lastNativeSelection;
+    }
+  };
+}
+function InternalTextInput(props) {
+  const {
+    'aria-busy': ariaBusy,
+    'aria-checked': ariaChecked,
+    'aria-disabled': ariaDisabled,
+    'aria-expanded': ariaExpanded,
+    'aria-selected': ariaSelected,
+    accessibilityState,
+    id,
+    tabIndex,
+    selection: propsSelection,
+    selectionColor,
+    selectionHandleColor,
+    cursorColor,
+    ...otherProps
+  } = props;
+  const inputRef = (0, _react.useRef)(null);
+  const selection = propsSelection == null ? null : {
+    start: propsSelection.start,
+    end: propsSelection.end ?? propsSelection.start
+  };
+  const text = typeof props.value === 'string' ? props.value : typeof props.defaultValue === 'string' ? props.defaultValue : undefined;
+  const viewCommands = AndroidTextInputCommands || (props.multiline === true ? RCTMultilineTextInputNativeCommands : RCTSinglelineTextInputNativeCommands);
+  const [mostRecentEventCount, setMostRecentEventCount] = (0, _react.useState)(0);
+  const useTextInputStateSynchronization = ReactNativeFeatureFlags.useRefsForTextInputState() ? useTextInputStateSynchronization_REFS : useTextInputStateSynchronization_STATE;
+  const {
+    setLastNativeText,
+    setLastNativeSelection
+  } = useTextInputStateSynchronization({
+    props,
+    inputRef,
+    mostRecentEventCount,
+    selection,
+    text,
+    viewCommands
+  });
   (0, _react.useLayoutEffect)(() => {
     const inputRefValue = inputRef.current;
     if (inputRefValue != null) {
@@ -231,39 +172,16 @@ function InternalTextInput(props) {
         }
       };
     }
-  }, [inputRef]);
+  }, []);
   const setLocalRef = (0, _react.useCallback)(instance => {
     inputRef.current = instance;
-
-    /*
-    Hi reader from the future. I'm sorry for this.
-     This is a hack. Ideally we would forwardRef to the underlying
-    host component. However, since TextInput has it's own methods that can be
-    called as well, if we used the standard forwardRef then these
-    methods wouldn't be accessible and thus be a breaking change.
-     We have a couple of options of how to handle this:
-    - Return a new ref with everything we methods from both. This is problematic
-      because we need React to also know it is a host component which requires
-      internals of the class implementation of the ref.
-    - Break the API and have some other way to call one set of the methods or
-      the other. This is our long term approach as we want to eventually
-      get the methods on host components off the ref. So instead of calling
-      ref.measure() you might call ReactNative.measure(ref). This would hopefully
-      let the ref for TextInput then have the methods like `.clear`. Or we do it
-      the other way and make it TextInput.clear(textInputRef) which would be fine
-      too. Either way though is a breaking change that is longer term.
-    - Mutate this ref. :( Gross, but accomplishes what we need in the meantime
-      before we can get to the long term breaking change.
-    */
     if (instance != null) {
-      // $FlowFixMe[incompatible-use] - See the explanation above.
       Object.assign(instance, {
         clear() {
           if (inputRef.current != null) {
             viewCommands.setTextAndSelection(inputRef.current, mostRecentEventCount, '', 0, 0);
           }
         },
-        // TODO: Fix this returning true on null === null, when no input is focused
         isFocused() {
           return _TextInputState.default.currentlyFocusedInput() === inputRef.current;
         },
@@ -284,22 +202,14 @@ function InternalTextInput(props) {
     props.onChange && props.onChange(event);
     props.onChangeText && props.onChangeText(currentText);
     if (inputRef.current == null) {
-      // calling `props.onChange` or `props.onChangeText`
-      // may clean up the input itself. Exits here.
       return;
     }
     setLastNativeText(currentText);
-    // This must happen last, after we call setLastNativeText.
-    // Different ordering can cause bugs when editing AndroidTextInputs
-    // with multiple Fragments.
-    // We must update this so that controlled input updates work.
     setMostRecentEventCount(event.nativeEvent.eventCount);
   };
   const _onSelectionChange = event => {
     props.onSelectionChange && props.onSelectionChange(event);
     if (inputRef.current == null) {
-      // calling `props.onSelectionChange`
-      // may clean up the input itself. Exits here.
       return;
     }
     setLastNativeSelection({
@@ -326,9 +236,7 @@ function InternalTextInput(props) {
   const multiline = props.multiline ?? false;
   let submitBehavior;
   if (props.submitBehavior != null) {
-    // `submitBehavior` is set explicitly
     if (!multiline && props.submitBehavior === 'newline') {
-      // For single line text inputs, `'newline'` is not a valid option
       submitBehavior = 'blurAndSubmit';
     } else {
       submitBehavior = props.submitBehavior;
@@ -340,7 +248,6 @@ function InternalTextInput(props) {
       submitBehavior = 'newline';
     }
   } else {
-    // Single line
     if (props.blurOnSubmit !== false) {
       submitBehavior = 'blurAndSubmit';
     } else {
@@ -371,21 +278,15 @@ function InternalTextInput(props) {
     onPressOut: onPressOut,
     cancelable: _Platform.default.OS === 'ios' ? !rejectResponderTermination : null
   }), [editable, hitSlop, onPress, onPressIn, onPressOut, rejectResponderTermination]);
-
-  // Hide caret during test runs due to a flashing caret
-  // makes screenshot tests flakey
   let caretHidden = props.caretHidden;
   if (_Platform.default.isTesting) {
     caretHidden = true;
   }
-
-  // TextInput handles onBlur and onFocus events
-  // so omitting onBlur and onFocus pressability handlers here.
   const {
     onBlur,
     onFocus,
     ...eventHandlers
-  } = (0, _usePressability.default)(config) || {};
+  } = (0, _usePressability.default)(config);
   let _accessibilityState;
   if (accessibilityState != null || ariaBusy != null || ariaChecked != null || ariaDisabled != null || ariaExpanded != null || ariaSelected != null) {
     _accessibilityState = {
@@ -396,18 +297,27 @@ function InternalTextInput(props) {
       selected: ariaSelected ?? accessibilityState?.selected
     };
   }
-  const style = (0, _flattenStyle.default)(props.style);
-  if (typeof style?.fontWeight === 'number') {
-    // $FlowFixMe[prop-missing]
-    // $FlowFixMe[cannot-write]
-    style.fontWeight = style?.fontWeight.toString();
+  let _style = props.style;
+  const flattenedStyle = (0, _flattenStyle.default)(props.style);
+  if (flattenedStyle != null) {
+    let overrides = null;
+    if (typeof flattenedStyle?.fontWeight === 'number') {
+      overrides = overrides || {};
+      overrides.fontWeight = flattenedStyle.fontWeight.toString();
+    }
+    if (flattenedStyle.verticalAlign != null) {
+      overrides = overrides || {};
+      overrides.textAlignVertical = verticalAlignToTextAlignVerticalMap[flattenedStyle.verticalAlign];
+      overrides.verticalAlign = undefined;
+    }
+    if (overrides != null) {
+      _style = [_style, overrides];
+    }
   }
   if (_Platform.default.OS === 'ios') {
     const RCTTextInputView = props.multiline === true ? RCTMultilineTextInputView : RCTSinglelineTextInputView;
-    const useMultilineDefaultStyle = props.multiline === true && (style == null || style.padding == null && style.paddingVertical == null && style.paddingTop == null);
-    textInput = /*#__PURE__*/(0, _jsxRuntime.jsx)(RCTTextInputView
-    // $FlowFixMe[incompatible-type] - Figure out imperative + forward refs.
-    , {
+    const useMultilineDefaultStyle = props.multiline === true && (flattenedStyle == null || flattenedStyle.padding == null && flattenedStyle.paddingVertical == null && flattenedStyle.paddingTop == null);
+    textInput = /*#__PURE__*/(0, _jsxRuntime.jsx)(RCTTextInputView, {
       ref: ref,
       ...otherProps,
       ...eventHandlers,
@@ -419,6 +329,7 @@ function InternalTextInput(props) {
       focusable: tabIndex !== undefined ? !tabIndex : focusable,
       mostRecentEventCount: mostRecentEventCount,
       nativeID: id ?? props.nativeID,
+      numberOfLines: props.rows ?? props.numberOfLines,
       onBlur: _onBlur,
       onChange: _onChange,
       onContentSizeChange: props.onContentSizeChange,
@@ -428,7 +339,7 @@ function InternalTextInput(props) {
       onSelectionChangeShouldSetResponder: emptyFunctionThatReturnsTrue,
       selection: selection,
       selectionColor: selectionColor,
-      style: _StyleSheet.default.compose(useMultilineDefaultStyle ? styles.multilineDefault : null, style),
+      style: _StyleSheet.default.compose(useMultilineDefaultStyle ? styles.multilineDefault : null, _style),
       text: text
     });
   } else if (_Platform.default.OS === 'android') {
@@ -443,29 +354,21 @@ function InternalTextInput(props) {
         children: children
       });
     }
-    // For consistency with iOS set cursor/selectionHandle color as selectionColor
     const colorProps = {
       selectionColor,
       selectionHandleColor: selectionHandleColor === undefined ? selectionColor : selectionHandleColor,
       cursorColor: cursorColor === undefined ? selectionColor : cursorColor
     };
-    textInput =
-    /*#__PURE__*/
-    /* $FlowFixMe[prop-missing] the types for AndroidTextInput don't match up
-     * exactly with the props for TextInput. This will need to get fixed */
-    /* $FlowFixMe[incompatible-type] the types for AndroidTextInput don't
-     * match up exactly with the props for TextInput. This will need to get
-     * fixed */
-    /* $FlowFixMe[incompatible-type-arg] the types for AndroidTextInput don't
-     * match up exactly with the props for TextInput. This will need to get
-     * fixed */
-    (0, _jsxRuntime.jsx)(AndroidTextInput
-    // $FlowFixMe[incompatible-type] - Figure out imperative + forward refs.
-    , {
+    const {
+      onPaste,
+      ...rest
+    } = otherProps;
+    textInput = /*#__PURE__*/(0, _jsxRuntime.jsx)(AndroidTextInput, {
       ref: ref,
-      ...otherProps,
+      ...rest,
       ...colorProps,
       ...eventHandlers,
+      onPaste: onPaste,
       accessibilityState: _accessibilityState,
       accessibilityLabelledBy: _accessibilityLabelledBy,
       accessible: accessible,
@@ -480,17 +383,11 @@ function InternalTextInput(props) {
       numberOfLines: props.rows ?? props.numberOfLines,
       onBlur: _onBlur,
       onChange: _onChange,
-      onFocus: _onFocus
-      /* $FlowFixMe[prop-missing] the types for AndroidTextInput don't match
-       * up exactly with the props for TextInput. This will need to get fixed
-       */
-      /* $FlowFixMe[incompatible-type-arg] the types for AndroidTextInput
-       * don't match up exactly with the props for TextInput. This will need
-       * to get fixed */,
+      onFocus: _onFocus,
       onScroll: _onScroll,
       onSelectionChange: _onSelectionChange,
       placeholder: placeholder,
-      style: style,
+      style: _style,
       text: text,
       textBreakStrategy: props.textBreakStrategy
     });
@@ -519,8 +416,6 @@ const inputModeToKeyboardTypeMap = {
   email: 'email-address',
   url: 'url'
 };
-
-// Map HTML autocomplete values to Android autoComplete values
 const autoCompleteWebToAutoCompleteAndroidMap = {
   'address-line1': 'postal-address-region',
   'address-line2': 'postal-address-locality',
@@ -553,8 +448,6 @@ const autoCompleteWebToAutoCompleteAndroidMap = {
   'tel-national': 'tel-national',
   username: 'username'
 };
-
-// Map HTML autocomplete values to iOS textContentType values
 const autoCompleteWebToTextContentTypeMap = {
   'address-line1': 'streetAddressLine1',
   'address-line2': 'streetAddressLine2',
@@ -608,18 +501,6 @@ const ExportedForwardRef = /*#__PURE__*/React.forwardRef(function TextInput({
   keyboardType,
   ...restProps
 }, forwardedRef) {
-  // $FlowFixMe[underconstrained-implicit-instantiation]
-  let style = (0, _flattenStyle.default)(restProps.style);
-  if (style?.verticalAlign != null) {
-    // $FlowFixMe[prop-missing]
-    // $FlowFixMe[cannot-write]
-    style.textAlignVertical =
-    // $FlowFixMe[invalid-computed-prop]
-    verticalAlignToTextAlignVerticalMap[style.verticalAlign];
-    // $FlowFixMe[prop-missing]
-    // $FlowFixMe[cannot-write]
-    delete style.verticalAlign;
-  }
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(InternalTextInput, {
     allowFontScaling: allowFontScaling,
     rejectResponderTermination: rejectResponderTermination,
@@ -628,22 +509,13 @@ const ExportedForwardRef = /*#__PURE__*/React.forwardRef(function TextInput({
     returnKeyType: enterKeyHint ? enterKeyHintToReturnTypeMap[enterKeyHint] : returnKeyType,
     keyboardType: inputMode ? inputModeToKeyboardTypeMap[inputMode] : keyboardType,
     showSoftInputOnFocus: inputMode == null ? showSoftInputOnFocus : inputMode !== 'none',
-    autoComplete: _Platform.default.OS === 'android' ?
-    // $FlowFixMe[invalid-computed-prop]
-    // $FlowFixMe[prop-missing]
-    autoCompleteWebToAutoCompleteAndroidMap[autoComplete] ?? autoComplete : undefined,
-    textContentType: textContentType != null ? textContentType : _Platform.default.OS === 'ios' && autoComplete && autoComplete in autoCompleteWebToTextContentTypeMap ?
-    // $FlowFixMe[invalid-computed-prop]
-    // $FlowFixMe[prop-missing]
-    autoCompleteWebToTextContentTypeMap[autoComplete] : textContentType,
+    autoComplete: _Platform.default.OS === 'android' ? autoCompleteWebToAutoCompleteAndroidMap[autoComplete] ?? autoComplete : undefined,
+    textContentType: textContentType != null ? textContentType : _Platform.default.OS === 'ios' && autoComplete && autoComplete in autoCompleteWebToTextContentTypeMap ? autoCompleteWebToTextContentTypeMap[autoComplete] : textContentType,
     ...restProps,
-    forwardedRef: forwardedRef,
-    style: style
+    forwardedRef: forwardedRef
   });
 });
 ExportedForwardRef.displayName = 'TextInput';
-
-// $FlowFixMe[prop-missing]
 ExportedForwardRef.State = {
   currentlyFocusedInput: _TextInputState.default.currentlyFocusedInput,
   currentlyFocusedField: _TextInputState.default.currentlyFocusedField,
@@ -652,9 +524,6 @@ ExportedForwardRef.State = {
 };
 const styles = _StyleSheet.default.create({
   multilineDefault: {
-    // This default top inset makes RCTMultilineTextInputView seem as close as possible
-    // to single-line RCTSinglelineTextInputView defaults, using the system defaults
-    // of font size 17 and a height of 31 points.
     paddingTop: 5
   }
 });
@@ -664,7 +533,5 @@ const verticalAlignToTextAlignVerticalMap = {
   bottom: 'bottom',
   middle: 'center'
 };
-
-// $FlowFixMe[unclear-type] Unclear type. Using `any` type is not safe.
-module.exports = ExportedForwardRef;
+var _default = exports.default = ExportedForwardRef;
 //# sourceMappingURL=Input.js.map