Convert InputAccessoryView to function component (#42883)

Summary: Pull Request resolved: #42883 As per title. Changelog: [Internal] Reviewed By: cortinico Differential Revision: D53355697 fbshipit-source-id: cb145c31764ae8b57489b1a1183918924e6cb49b
facebook · Feb 6, 2024 · db066ac · db066ac
1 parent 608029a
commit db066ac
Show file tree

Hide file tree

Showing 2 changed files with 28 additions and 18 deletions.
diff --git a/packages/react-native/Libraries/Components/TextInput/InputAccessoryView.js b/packages/react-native/Libraries/Components/TextInput/InputAccessoryView.js
@@ -85,27 +85,25 @@ type Props = $ReadOnly<{|
   backgroundColor?: ?ColorValue,
 |}>;
 
-class InputAccessoryView extends React.Component<Props> {
-  render(): React.Node {
-    if (Platform.OS === 'ios') {
-      if (React.Children.count(this.props.children) === 0) {
-        return null;
-      }
-
-      return (
-        <RCTInputAccessoryViewNativeComponent
-          style={[this.props.style, styles.container]}
-          nativeID={this.props.nativeID}
-          backgroundColor={this.props.backgroundColor}>
-          {this.props.children}
-        </RCTInputAccessoryViewNativeComponent>
-      );
-    } else {
-      console.warn('<InputAccessoryView> is only supported on iOS.');
+const InputAccessoryView: React.AbstractComponent<Props> = (props: Props) => {
+  if (Platform.OS === 'ios') {
+    if (React.Children.count(props.children) === 0) {
       return null;
     }
+
+    return (
+      <RCTInputAccessoryViewNativeComponent
+        style={[props.style, styles.container]}
+        nativeID={props.nativeID}
+        backgroundColor={props.backgroundColor}>
+        {props.children}
+      </RCTInputAccessoryViewNativeComponent>
+    );
+  } else {
+    console.warn('<InputAccessoryView> is only supported on iOS.');
+    return null;
   }
-}
+};
 
 const styles = StyleSheet.create({
   container: {

diff --git a/packages/react-native/Libraries/__tests__/__snapshots__/public-api-test.js.snap b/packages/react-native/Libraries/__tests__/__snapshots__/public-api-test.js.snap
@@ -2405,6 +2405,18 @@ declare export default HostComponent<NativeProps>;
 "
 `;
 
+exports[`public API should not change unintentionally Libraries/Components/TextInput/InputAccessoryView.js 1`] = `
+"type Props = $ReadOnly<{|
+  +children: React.Node,
+  nativeID?: ?string,
+  style?: ?ViewStyleProp,
+  backgroundColor?: ?ColorValue,
+|}>;
+declare const InputAccessoryView: React.AbstractComponent<Props>;
+declare module.exports: InputAccessoryView;
+"
+`;
+
 exports[`public API should not change unintentionally Libraries/Components/TextInput/RCTInputAccessoryViewNativeComponent.js 1`] = `
 "export * from \\"../../../src/private/specs/components/RCTInputAccessoryViewNativeComponent\\";
 declare export default typeof RCTInputAccessoryViewNativeComponent;