react-native-tvos 0.64.2-5 → 0.66.3-2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-tvos",
-  "version": "0.64.2-5",
+  "version": "0.66.3-2",
   "bin": "./cli.js",
   "description": "A framework for building native apps using React",
   "license": "MIT",
@@ -40,6 +40,7 @@
     "README.md",
     "rn-get-polyfills.js",
     "scripts/compose-source-maps.js",
+    "scripts/find-node.sh",
     "scripts/generate-specs.sh",
     "scripts/generate-specs-cli.js",
     "scripts/ios-configure-glog.sh",
@@ -49,7 +50,6 @@
     "scripts/packager.sh",
     "scripts/react_native_pods.rb",
     "scripts/react-native-xcode.sh",
-    "scripts/find-node.sh",
     "template.config.js",
     "template",
     "third-party-podspecs",
@@ -64,17 +64,18 @@
     "flow-check-android": "flow check --flowconfig-name .flowconfig.android",
     "lint": "eslint .",
     "lint-ci": "./scripts/circleci/analyze_code.sh && yarn shellcheck",
+    "lint-java": "node ./scripts/lint-java.js",
     "shellcheck": "./scripts/circleci/analyze_scripts.sh",
     "clang-format": "clang-format -i --glob=*/**/*.{h,cpp,m,mm}",
     "format": "npm run prettier && npm run clang-format",
     "prettier": "prettier --write \"./**/*.{js,md,yml}\"",
     "format-check": "prettier --list-different \"./**/*.{js,md,yml}\"",
     "update-lock": "npx yarn-deduplicate",
+    "docker-setup-android": "docker pull reactnativecommunity/react-native-android:4.0",
     "bundle_ios_dev": "react-native bundle --entry-file packages/rn-tester/js/RNTesterApp.ios.js --platform ios --dev true --bundle-output RNTester.ios.jsbundle",
     "bundle_ios": "react-native bundle --entry-file packages/rn-tester/js/RNTesterApp.ios.js --platform ios --dev false --bundle-output RNTester.ios.jsbundle",
     "bundle_android_dev": "react-native bundle --entry-file packages/rn-tester/js/RNTesterApp.android.js --platform android --dev true --bundle-output RNTester.android.jsbundle",
     "bundle_android": "react-native bundle --entry-file packages/rn-tester/js/RNTesterApp.android.js --platform android --dev false --bundle-output RNTester.android.jsbundle",
-    "docker-setup-android": "docker pull reactnativecommunity/react-native-android:2.1",
     "docker-build-android": "docker build -t reactnativeci/android -f .circleci/Dockerfiles/Dockerfile.android .",
     "test-android-run-instrumentation": "docker run --cap-add=SYS_ADMIN -it reactnativeci/android bash .circleci/Dockerfiles/scripts/run-android-docker-instrumentation-tests.sh",
     "test-android-run-unit": "docker run --cap-add=SYS_ADMIN -it reactnativeci/android bash .circleci/Dockerfiles/scripts/run-android-docker-unit-tests.sh",
@@ -88,46 +89,85 @@
     "test-ios": "./scripts/objc-test.sh test"
   },
   "peerDependencies": {
-    "react": "17.0.1",
-    "@types/react-native": "^0.63.17"
+    "@types/react-native": "^0.63.17",
+    "react": "17.0.2"
   },
   "dependencies": {
-    "@jest/create-cache-key-function": "^26.5.0",
-    "@react-native-community/cli": "^5.0.1-alpha.1",
-    "@react-native-community/cli-platform-android": "^5.0.1-alpha.1",
-    "@react-native-community/cli-platform-ios": "^5.0.1-alpha.1",
+    "@jest/create-cache-key-function": "^27.0.1",
+    "@react-native-community/cli": "^6.0.0",
+    "@react-native-community/cli-platform-android": "^6.0.0",
+    "@react-native-community/cli-platform-ios": "^6.0.0",
     "@react-native/assets": "1.0.0",
     "@react-native/normalize-color": "1.0.0",
-    "@react-native/polyfills": "1.0.0",
+    "@react-native/polyfills": "2.0.0",
     "abort-controller": "^3.0.0",
     "anser": "^1.4.9",
     "base64-js": "^1.1.2",
     "event-target-shim": "^5.0.1",
-    "hermes-engine": "~0.7.0",
+    "hermes-engine": "~0.9.0",
     "invariant": "^2.2.4",
-    "jsc-android": "^245459.0.0",
-    "metro-babel-register": "0.64.0",
-    "metro-react-native-babel-transformer": "0.64.0",
-    "metro-runtime": "0.64.0",
-    "metro-source-map": "0.64.0",
+    "jsc-android": "^250230.2.1",
+    "metro-babel-register": "0.66.2",
+    "metro-react-native-babel-transformer": "0.66.2",
+    "metro-runtime": "0.66.2",
+    "metro-source-map": "0.66.2",
     "nullthrows": "^1.1.1",
     "pretty-format": "^26.5.2",
     "promise": "^8.0.3",
     "prop-types": "^15.7.2",
-    "react-devtools-core": "^4.6.0",
-    "react-native-codegen": "^0.0.6",
+    "react-devtools-core": "^4.13.0",
+    "react-native-codegen": "^0.0.12",
     "react-refresh": "^0.4.0",
     "regenerator-runtime": "^0.13.2",
-    "scheduler": "^0.20.1",
-    "shelljs": "^0.8.4",
+    "scheduler": "^0.20.2",
     "stacktrace-parser": "^0.1.3",
     "use-subscription": "^1.0.0",
     "whatwg-fetch": "^3.0.0",
     "ws": "^6.1.4"
   },
   "devDependencies": {
-    "flow-bin": "^0.137.0",
-    "react": "17.0.1"
+    "@babel/core": "^7.14.0",
+    "@babel/generator": "^7.14.0",
+    "@babel/template": "^7.0.0",
+    "@babel/types": "^7.0.0",
+    "@react-native-community/eslint-plugin": "*",
+    "@reactions/component": "^2.0.2",
+    "async": "^2.4.0",
+    "babel-eslint": "^10.1.0",
+    "babel-preset-fbjs": "^3.4.0",
+    "clang-format": "^1.2.4",
+    "connect": "^3.6.5",
+    "coveralls": "^3.0.2",
+    "detox": "16.7.2",
+    "eslint": "7.12.0",
+    "eslint-config-fb-strict": "^24.9.0",
+    "eslint-config-fbjs": "2.1.0",
+    "eslint-config-prettier": "^6.0.0",
+    "eslint-plugin-babel": "^5.3.0",
+    "eslint-plugin-eslint-comments": "^3.1.1",
+    "eslint-plugin-flowtype": "2.50.3",
+    "eslint-plugin-jest": "22.4.1",
+    "eslint-plugin-jsx-a11y": "6.2.1",
+    "eslint-plugin-prettier": "2.6.2",
+    "eslint-plugin-react": "7.21.5",
+    "eslint-plugin-react-hooks": "^4.2.0",
+    "eslint-plugin-react-native": "3.10.0",
+    "eslint-plugin-relay": "1.8.1",
+    "flow-bin": "^0.158.0",
+    "jest": "^26.6.3",
+    "jest-junit": "^10.0.0",
+    "jscodeshift": "^0.11.0",
+    "metro-babel-register": "0.66.2",
+    "metro-transform-plugins": "^0.66.0",
+    "mkdirp": "^0.5.1",
+    "prettier": "1.19.1",
+    "react": "17.0.2",
+    "react-shallow-renderer": "16.14.1",
+    "react-test-renderer": "17.0.2",
+    "shelljs": "^0.8.5",
+    "signedsource": "^1.0.0",
+    "ws": "^6.1.4",
+    "yargs": "^15.3.1"
   },
   "detox": {
     "test-runner": "jest",

package/react.gradle

@@ -153,12 +153,21 @@ afterEvaluate {
             def devEnabled = !(config."devDisabledIn${targetName}"
                 || targetName.toLowerCase().contains("release"))
 
-            def extraArgs = config.extraPackagerArgs ?: [];
+            def extraArgs = []
 
             if (bundleConfig) {
-                extraArgs = extraArgs.clone()
-                extraArgs.add("--config");
-                extraArgs.add(bundleConfig);
+                extraArgs.add("--config")
+                extraArgs.add(bundleConfig)
+            }
+
+            // Hermes doesn't require JS minification.
+            if (enableHermes && !devEnabled) {
+                extraArgs.add("--minify")
+                extraArgs.add("false")
+            }
+
+            if (config.extraPackagerArgs) {
+                extraArgs.addAll(config.extraPackagerArgs)
             }
 
             commandLine(*execCommand, bundleCommand, "--platform", "android", "--dev", "${devEnabled}",
@@ -275,18 +284,24 @@ afterEvaluate {
                 into(file(config."jsBundleDir${targetName}"))
             } else {
                 into ("$buildDir/intermediates")
-                into ("assets/${targetPath}") {
-                    from(jsBundleDir)
-                }
+                if (isAndroidLibrary) {
+                    into ("library_assets/${variant.name}/out") {
+                        from(jsBundleDir)
+                    }
+                } else {
+                    into ("assets/${targetPath}") {
+                        from(jsBundleDir)
+                    }
 
-                // Workaround for Android Gradle Plugin 3.2+ new asset directory
-                into ("merged_assets/${variant.name}/merge${targetName}Assets/out") {
-                    from(jsBundleDir)
-                }
+                    // Workaround for Android Gradle Plugin 3.2+ new asset directory
+                    into ("merged_assets/${variant.name}/merge${targetName}Assets/out") {
+                        from(jsBundleDir)
+                    }
 
-                // Workaround for Android Gradle Plugin 3.4+ new asset directory
-                into ("merged_assets/${variant.name}/out") {
-                    from(jsBundleDir)
+                    // Workaround for Android Gradle Plugin 3.4+ new asset directory
+                    into ("merged_assets/${variant.name}/out") {
+                        from(jsBundleDir)
+                    }
                 }
             }
 
@@ -294,6 +309,7 @@ afterEvaluate {
             dependsOn(variant.mergeAssetsProvider.get())
 
             enabled(currentBundleTask.enabled)
+            dependsOn(currentBundleTask)
         }
 
         // mergeResources task runs before the bundle file is copied to the intermediate asset directory from Android plugin 4.1+.
@@ -309,7 +325,7 @@ afterEvaluate {
         // Delete the VM related libraries that this build doesn't need.
         // The application can manage this manually by setting 'enableVmCleanup: false'
         //
-        // This should really be done by packaging all Hermes releated libs into
+        // This should really be done by packaging all Hermes related libs into
         // two separate HermesDebug and HermesRelease AARs, but until then we'll
         // kludge it by deleting the .so files out of the /transforms/ directory.
         def isRelease = targetName.toLowerCase().contains("release")
@@ -343,8 +359,7 @@ afterEvaluate {
         }
 
         if (enableVmCleanup) {
-            def task = tasks.findByName("package${targetName}")
-            task.doFirst(vmSelectionAction)
+            packageTask.doFirst(vmSelectionAction)
         }
     }
 }

package/readme.diff

@@ -0,0 +1,305 @@
+diff --git a/README.md b/README.md
+index 0474621381..01fafa6e36 100644
+--- a/README.md
++++ b/README.md
+@@ -1,199 +1,147 @@
+-## react-native-tvos
++<h1 align="center">
++  <a href="https://reactnative.dev/">
++    React Native
++  </a>
++</h1>
+ 
+-Going forward, Apple TV support for React Native will be maintained here and in the corresponding `react-native-tvos` NPM package, and not in the [core repo](https://github.com/facebook/react-native/).  This is a full fork of the main repository, with only the changes needed to support Apple TV.
++<p align="center">
++  <strong>Learn once, write anywhere:</strong><br>
++  Build mobile apps with React.
++</p>
+ 
+-Releases of `react-native-tvos` will be based on a public release of `react-native`; e.g. the 0.64.2-5 release of this package will be derived from the 0.64.2 release of `react-native`. All releases of this repo will follow the 0.xx.x-y format, where x digits are from a specific RN core release, and y represents the additional versioning from this repo.
++<p align="center">
++  <a href="https://github.com/facebook/react-native/blob/HEAD/LICENSE">
++    <img src="https://img.shields.io/badge/license-MIT-blue.svg" alt="React Native is released under the MIT license." />
++  </a>
++  <a href="https://circleci.com/gh/facebook/react-native">
++    <img src="https://circleci.com/gh/facebook/react-native.svg?style=shield" alt="Current CircleCI build status." />
++  </a>
++  <a href="https://www.npmjs.org/package/react-native">
++    <img src="https://img.shields.io/npm/v/react-native?color=brightgreen&label=npm%20package" alt="Current npm package version." />
++  </a>
++  <a href="https://reactnative.dev/docs/contributing">
++    <img src="https://img.shields.io/badge/PRs-welcome-brightgreen.svg" alt="PRs welcome!" />
++  </a>
++  <a href="https://twitter.com/intent/follow?screen_name=reactnative">
++    <img src="https://img.shields.io/twitter/follow/reactnative.svg?label=Follow%20@reactnative" alt="Follow @reactnative" />
++  </a>
++</p>
+ 
+-Releases will be published on npmjs.org and you may find the latest release version here: https://www.npmjs.com/package/react-native-tvos?activeTab=versions or use the tag `@latest`
++<h3 align="center">
++  <a href="https://reactnative.dev/docs/getting-started">Getting Started</a>
++  <span> · </span>
++  <a href="https://reactnative.dev/docs/tutorial">Learn the Basics</a>
++  <span> · </span>
++  <a href="https://reactnative.dev/showcase.html">Showcase</a>
++  <span> · </span>
++  <a href="https://reactnative.dev/docs/contributing">Contribute</a>
++  <span> · </span>
++  <a href="https://reactnative.dev/help">Community</a>
++  <span> · </span>
++  <a href="https://github.com/facebook/react-native/blob/HEAD/.github/SUPPORT.md">Support</a>
++</h3>
+ 
+-You will find the relevant tvOS support and maintenance within the branches marked `tvos-v0.xx.x`;   
++React Native brings [**React**'s][r] declarative UI framework to iOS and Android. With React Native, you use native UI controls and have full access to the native platform.
+ 
+-To build your project for Apple TV, you should change your `package.json` imports to import `react-native` as follows, so that this package is used instead of the core react-native package.
++- **Declarative.** React makes it painless to create interactive UIs. Declarative views make your code more predictable and easier to debug.
++- **Component-Based.** Build encapsulated components that manage their state, then compose them to make complex UIs.
++- **Developer Velocity.** See local changes in seconds. Changes to JavaScript code can be live reloaded without rebuilding the native app.
++- **Portability.** Reuse code across iOS, Android, and [other platforms][p].
+ 
+-```js
+-"react-native": "npm:react-native-tvos@latest",
+-```
++React Native is developed and supported by many companies and individual core contributors. Find out more in our [ecosystem overview][e].
+ 
+-You cannot use this package and the core react-native package simultaneously in a project.
++[r]: https://reactjs.org/
++[p]: https://reactnative.dev/docs/out-of-tree-platforms
++[e]: https://github.com/facebook/react-native/blob/HEAD/ECOSYSTEM.md
+ 
+-### Typescript
++## Contents
+ 
+-Due to the nature of the typing resolution, the current solution to include types is to:
++- [Requirements](#-requirements)
++- [Building your first React Native app](#-building-your-first-react-native-app)
++- [Documentation](#-documentation)
++- [Upgrading](#-upgrading)
++- [How to Contribute](#-how-to-contribute)
++- [Code of Conduct](#code-of-conduct)
++- [License](#-license)
+ 
+-- install `@types/react-native` as a dev dependency
+-- put `import 'react-native/tvos-types.d'` in any of your `.ts` files (root suggested)
+ 
+-See the "Build Changes" section below for how to start a new project that will automatically use Typescript.
++## 📋 Requirements
+ 
+-## General support for Apple TV
++React Native apps may target iOS 11.0 and Android 5.0 (API 21) or newer. You may use Windows, macOS, or Linux as your development operating system, though building and running iOS apps is limited to macOS. Tools like [Expo](https://expo.io) can be used to work around this.
+ 
+-TV devices support has been implemented with the intention of making existing React Native applications "just work" on Apple TV, with few or no changes needed in the JavaScript code for the applications.
++## 🎉 Building your first React Native app
+ 
+-The RNTester app supports Apple TV.  In this repo, `RNTester/Podfile` and `RNTester/RNTesterPods.xcodeproj` have been modified to work for tvOS.  Run `pod install`, then open `RNTesterPods.xcworkspace` and build.
++Follow the [Getting Started guide](https://reactnative.dev/docs/getting-started). The recommended way to install React Native depends on your project. Here you can find short guides for the most common scenarios:
+ 
+-## Pitfall
++- [Trying out React Native][hello-world]
++- [Creating a New Application][new-app]
++- [Adding React Native to an Existing Application][existing]
+ 
+-Make sure you do not globally install `react-native` or `react-native-tvos`. You should only install `react-native-cli` to use the commands below. If you have done this the wrong way, you may get error messages like:
++[hello-world]: https://snack.expo.io/@hramos/hello,-world!
++[new-app]: https://reactnative.dev/docs/getting-started
++[existing]: https://reactnative.dev/docs/integration-with-existing-apps
+ 
+-```
+-ld: library not found for -lPods-TestApp-tvOS
+-```
++## 📖 Documentation
+ 
+-You should also install `yarn` globally, as it should be used instead of npm for working in React Native projects.
++The full documentation for React Native can be found on our [website][docs].
+ 
+-## Build changes
++The React Native documentation discusses components, APIs, and topics that are specific to React Native. For further documentation on the React API that is shared between React Native and React DOM, refer to the [React documentation][r-docs].
+ 
+-- _Native layer_: React Native Xcode projects all now have Apple TV build targets, with names ending in the string '-tvOS'.
++The source for the React Native documentation and website is hosted on a separate repo, [**@facebook/react-native-website**][repo-website].
+ 
+-- _react-native init_: Creating a new project that uses this package is done using the react-native CLI.  New projects created this way will automatically have properly configured Apple TV targets created in their XCode projects.
++[docs]: https://reactnative.dev/docs/getting-started
++[r-docs]: https://reactjs.org/docs/getting-started.html
++[repo-website]: https://github.com/facebook/react-native-website
+ 
+-To use this NPM package in a new project, you can reference it as in the following example using the older `react-native-cli` package:
++## 🚀 Upgrading
+ 
+-```sh
+-# Make sure you have the CLI installed globally (this only needs to be done once on your system)
+-npm install -g react-native-cli
+-# Init an app called 'TestApp', note that you must not be in a node module (directory with node_modules sub-directory) for this to work
+-react-native init TestApp --version=react-native@npm:react-native-tvos@latest
+-# Now start the app in the tvOS Simulator - this will only work on a macOS machine
+-cd TestApp && react-native run-ios  --simulator "Apple TV" --scheme "TestApp-tvOS"
+-```
++Upgrading to new versions of React Native may give you access to more APIs, views, developer tools, and other goodies. See the [Upgrading Guide][u] for instructions.
+ 
+-If you are using the newer `@react-native-community/cli` package, the syntax is slightly different:
++React Native releases are discussed in the React Native Community, [**@react-native-community/react-native-releases**][repo-releases].
+ 
+-```sh
+-# Make sure you have the CLI installed globally (this only needs to be done once on your system)
+-npm install -g @react-native-community/cli
+-# Init an app called 'TestApp', note that you must not be in a node module (directory with node_modules sub-directory) for this to work
+-react-native init TestApp --template=react-native-tvos@latest
+-# Now start the app in the tvOS Simulator - this will only work on a macOS machine
+-cd TestApp && react-native run-ios  --simulator "Apple TV" --scheme "TestApp-tvOS"
+-```
++[u]: https://reactnative.dev/docs/upgrading
++[repo-releases]: https://github.com/react-native-community/react-native-releases
+ 
+-A minimal Typescript starter template can be used to start a new project using the community react-native CLI.  The process is the same as above except for the template:
++## 👏 How to Contribute
+ 
+-```sh
+-react-native init TestApp --template=react-native-template-typescript-tv
+-```
++The main purpose of this repository is to continue evolving React Native core. We want to make contributing to this project as easy and transparent as possible, and we are grateful to the community for contributing bug fixes and improvements. Read below to learn how you can take part in improving React Native.
+ 
+-- _JavaScript layer_: Support for Apple TV has been added to `Platform.ios.js`. You can check whether code is running on AppleTV by doing
++### [Code of Conduct][code]
+ 
+-```javascript
+-var Platform = require('Platform');
+-var running_on_tv = Platform.isTV;
++Facebook has adopted a Code of Conduct that we expect project participants to adhere to.
++Please read the [full text][code] so that you can understand what actions will and will not be tolerated.
+ 
+-// If you want to be more specific and only detect devices running tvOS
+-// (but no Android TV devices) you can use:
+-var running_on_apple_tv = Platform.isTVOS;
+-```
++[code]: https://code.fb.com/codeofconduct/
+ 
+-## Code changes
++### [Contributing Guide][contribute]
+ 
+-- _General support for tvOS_: Apple TV specific changes in native code are all wrapped by the TARGET_OS_TV define. These include changes to suppress APIs that are not supported on tvOS (e.g. web views, sliders, switches, status bar, etc.), and changes to support user input from the TV remote or keyboard.
++Read our [**Contributing Guide**][contribute] to learn about our development process, how to propose bugfixes and improvements, and how to build and test your changes to React Native.
+ 
+-- _Common codebase_: Since tvOS and iOS share most Objective-C and JavaScript code in common, most documentation for iOS applies equally to tvOS.
++[contribute]: https://reactnative.dev/docs/contributing
+ 
+-- _Access to touchable controls_: When running on Apple TV, the native view class is `RCTTVView`, which has additional methods to make use of the tvOS focus engine. The `Touchable` mixin has code added to detect focus changes and use existing methods to style the components properly and initiate the proper actions when the view is selected using the TV remote, so `TouchableWithoutFeedback`, `TouchableHighlight` and `TouchableOpacity` will "just work". In particular:
++### [Open Source Roadmap][roadmap]
+ 
+-  - `onFocus` will be executed when the touchable view goes into focus
+-  - `onBlur` will be executed when the touchable view goes out of focus
+-  - `onPress` will be executed when the touchable view is actually selected by pressing the "select" button on the TV remote.
++You can learn more about our vision for React Native in the [**Roadmap**][roadmap].
+ 
+-- _TV remote/keyboard input_: A native class, `RCTTVRemoteHandler`, sets up gesture recognizers for TV remote events. When TV remote events occur, this class fires notifications that are picked up by `RCTTVNavigationEventEmitter` (a subclass of `RCTEventEmitter`), that fires a JS event. This event will be picked up by instances of the `TVEventHandler` JavaScript object. Application code that needs to implement custom handling of TV remote events can create an instance of `TVEventHandler` and listen for these events.  In 0.63.1-1, we have added `useTVEventHandler`, which wraps `useEffect` to make this more convenient and simpler for use with functional components. In 0.64.2-2, we added a TV event display to the new app template using `useTVEventHandler`.
++[roadmap]: https://github.com/facebook/react-native/wiki/Roadmap
+ 
+-```javascript
++### Good First Issues
+ 
+-import { TVEventHandler, useTVEventHandler } from 'react-native';
++We have a list of [good first issues][gfi] that contain bugs which have a relatively limited scope. This is a great place to get started, gain experience, and get familiar with our contribution process.
+ 
+-// Functional component
++[gfi]: https://github.com/facebook/react-native/labels/good%20first%20issue
+ 
+-const TVEventHandlerView: () => React.Node = () => {
+-  const [lastEventType, setLastEventType] = React.useState('');
++### Discussions
+ 
+-  const myTVEventHandler = evt => {
+-    setLastEventType(evt.eventType);
+-  };
++Larger discussions and proposals are discussed in [**@react-native-community/discussions-and-proposals**][repo-meta].
+ 
+-  useTVEventHandler(myTVEventHandler);
++[repo-meta]: https://github.com/react-native-community/discussions-and-proposals
+ 
+-  return (
+-    <View>
+-      <TouchableOpacity onPress={() => {}}>
+-        <Text>
+-          This example enables an instance of TVEventHandler to show the last
+-          event detected from the Apple TV Siri remote or from a keyboard.
+-        </Text>
+-      </TouchableOpacity>
+-      <Text style={{color: 'blue'}}>{lastEventType}</Text>
+-    </View>
+-  );
++## 📄 License
+ 
+-};
+-
+-// Class based component
+-
+-class Game2048 extends React.Component {
+-  _tvEventHandler: any;
+-
+-  _enableTVEventHandler() {
+-    this._tvEventHandler = new TVEventHandler();
+-    this._tvEventHandler.enable(this, function(cmp, evt) {
+-      if (evt && evt.eventType === 'right') {
+-        cmp.setState({board: cmp.state.board.move(2)});
+-      } else if(evt && evt.eventType === 'up') {
+-        cmp.setState({board: cmp.state.board.move(1)});
+-      } else if(evt && evt.eventType === 'left') {
+-        cmp.setState({board: cmp.state.board.move(0)});
+-      } else if(evt && evt.eventType === 'down') {
+-        cmp.setState({board: cmp.state.board.move(3)});
+-      } else if(evt && evt.eventType === 'playPause') {
+-        cmp.restartGame();
+-      }
+-    });
+-  }
+-
+-  _disableTVEventHandler() {
+-    if (this._tvEventHandler) {
+-      this._tvEventHandler.disable();
+-      delete this._tvEventHandler;
+-    }
+-  }
+-
+-  componentDidMount() {
+-    this._enableTVEventHandler();
+-  }
+-
+-  componentWillUnmount() {
+-    this._disableTVEventHandler();
+-  }
+-```
+-
+-- _Turbomodules_: Working as of the 0.61.2-0 release.
+-
+-- _Flipper_: Working in the 0.62.2-x releases.  Working in the 0.63.x releases; however, tvOS requires the Flipper pods from 0.62.2-x.  `scripts/react_native_pods.rb` contains macros for both versions.  The new project template Podfile is correctly set up to provide the older Flipper for both iOS and tvOS targets. In 0.64.x, Flipper support has been temporarily removed until issues can be resolved with newer Xcode versions.
+-
+-- _Hermes for tvOS_: RN core added support for the Hermes JS engine on iOS in 0.64. tvOS does not yet have this, as it will require significant additions to the Hermes build structure.
+-
+-- _LogBox_: The new LogBox error/warning display (which replaced YellowBox in 0.63) is working as expected in tvOS, after a few adjustments to make the controls accessible to the focus engine.
+-
+-- _Pressable_: The new `Pressable` API for React Native 0.63 works with TV.  Additional `onFocus` and `onBlur` props are provided to allow you to customize behavior when a Pressable enters or leaves focus. Similar to the `pressed` state that is true while a user is pressing the component on a touchscreen, the `focused` state will be true when it is focused on TV.  `PressableExample` in RNTester has been modified appropriately.
+-
+-- _Dev Menu support_: On the simulator, cmd-D will bring up the developer menu, just like on iOS. To bring it up on a real Apple TV device, make a long press on the play/pause button on the remote. (Please do not shake the Apple TV device, that will not work :) )
+-
+-- _TV remote animations_: `RCTTVView` native code implements Apple-recommended parallax animations to help guide the eye as the user navigates through views. The animations can be disabled or adjusted with new optional view properties.
+-
+-- _Back navigation with the TV remote menu button_: The `BackHandler` component, originally written to support the Android back button, now also supports back navigation on the Apple TV using the menu button on the TV remote.
+-
+-- _TVMenuControl_: This module provides methods to enable and disable navigation using the menu key on the TV remote.  This is required in order to fix an issue with Apple's guidelines for menu key navigation (see https://github.com/facebook/react-native/issues/18930).  The `RNTester` app uses this new module to implement correct menu key behavior.
+-
+-- _TVFocusGuideView_: This component provides support for Apple's `UIFocusGuide` API, to help ensure that focusable controls can be navigated to, even if they are not directly in line with other controls.  An example is provided in `RNTester` that shows two different ways of using this component.
+-
+-- _Next Focus Direction_: the props `nextFocus*` on `View` should work as expected on iOS too (previously android only). One caveat is that if there is no focusable in the `nextFocusable*` direction next to the starting view, iOS doesn't check if we want to override the destination. 
+-
+-- _TVTextScrollView_: On Apple TV, a ScrollView will not scroll unless there are focusable items inside it or above/below it.  This component wraps ScrollView and uses tvOS-specific native code to allow scrolling using swipe gestures from the remote control.
+-
+-- _Known issues_:
+-
+-  - As of the 0.61.2-0 release, Fabric code does not compile or run.  Issue is under investigation.
+-  - There are known issues with the TabBarIOS component, due to changes that Apple made in UITabBar for tvOS 13.
++React Native is MIT licensed, as found in the [LICENSE][l] file.
+ 
++React Native documentation is Creative Commons licensed, as found in the [LICENSE-docs][ld] file.
+ 
++[l]: https://github.com/facebook/react-native/blob/HEAD/LICENSE
++[ld]: https://github.com/facebook/react-native/blob/HEAD/LICENSE-docs

package/scripts/find-node.sh

@@ -6,12 +6,20 @@
 
 set -e
 
+# Support Homebrew on M1
+HOMEBREW_M1_BIN=/opt/homebrew/bin
+if [[ -d $HOMEBREW_M1_BIN && ! $PATH =~ $HOMEBREW_M1_BIN ]]; then
+  export PATH="$HOMEBREW_M1_BIN:$PATH"
+fi
+
 # Define NVM_DIR and source the nvm.sh setup script
 [ -z "$NVM_DIR" ] && export NVM_DIR="$HOME/.nvm"
 
 if [[ -s "$HOME/.nvm/nvm.sh" ]]; then
+  # shellcheck source=/dev/null
   . "$HOME/.nvm/nvm.sh"
 elif [[ -x "$(command -v brew)" && -s "$(brew --prefix nvm)/nvm.sh" ]]; then
+  # shellcheck source=/dev/null
   . "$(brew --prefix nvm)/nvm.sh"
 fi
 
@@ -29,9 +37,3 @@ if [[ ! -x node && -d ${HOME}/.anyenv/bin ]]; then
     eval "$(anyenv init -)"
   fi
 fi
-
-# Support Homebrew on M1
-HOMEBREW_M1_BIN=/opt/homebrew/bin
-if [[ -d $HOMEBREW_M1_BIN && ! $PATH =~ $HOMEBREW_M1_BIN ]]; then
-  export PATH="$HOMEBREW_M1_BIN:$PATH"
-fi

package/scripts/generate-specs-cli.js

@@ -11,9 +11,9 @@
 
 let RNCodegen;
 try {
-  RNCodegen = require('react-native-codegen/lib/generators/RNCodegen.js');
-} catch (e) {
   RNCodegen = require('../packages/react-native-codegen/lib/generators/RNCodegen.js');
+} catch (e) {
+  RNCodegen = require('react-native-codegen/lib/generators/RNCodegen.js');
   if (!RNCodegen) {
     throw 'RNCodegen not found.';
   }
@@ -24,8 +24,8 @@ const mkdirp = require('mkdirp');
 const path = require('path');
 
 const GENERATORS = {
-  android: ['modulesAndroid'],
-  ios: ['modulesIOS'],
+  android: ['componentsAndroid', 'modulesAndroid'],
+  ios: ['componentsIOS', 'modulesIOS'],
 };
 
 function generateSpec(
@@ -35,7 +35,6 @@ function generateSpec(
   libraryName,
   packageName,
 ) {
-  const moduleSpecName = libraryName;
   const schemaText = fs.readFileSync(schemaPath, 'utf-8');
 
   if (schemaText == null) {
@@ -43,13 +42,7 @@ function generateSpec(
   }
 
   if (!outputDirectory) {
-    outputDirectory = path.resolve(
-      __dirname,
-      '..',
-      'Libraries',
-      libraryName,
-      moduleSpecName,
-    );
+    outputDirectory = path.resolve(__dirname, '..', 'Libraries', libraryName);
   }
   mkdirp.sync(outputDirectory);
 
@@ -65,13 +58,27 @@ function generateSpec(
       libraryName,
       schema,
       outputDirectory,
-      moduleSpecName,
       packageName,
     },
     {
       generators: GENERATORS[platform],
     },
   );
+
+  if (platform === 'android') {
+    // Move all components C++ files to a structured jni folder for now.
+    // Note: this should've been done by RNCodegen's generators, but:
+    // * the generators don't support platform option yet
+    // * this subdir structure is Android-only, not applicable to iOS
+    const files = fs.readdirSync(outputDirectory);
+    const jniOutputDirectory = `${outputDirectory}/jni/react/renderer/components/${libraryName}`;
+    mkdirp.sync(jniOutputDirectory);
+    files
+      .filter(f => f.endsWith('.h') || f.endsWith('.cpp'))
+      .forEach(f => {
+        fs.renameSync(`${outputDirectory}/${f}`, `${jniOutputDirectory}/${f}`);
+      });
+  }
 }
 
 function main() {