v0.15.0

.babelrc

@@ -22,7 +22,7 @@
           "@babel/preset-env",
           {
             "targets": {
-              "electron": "9.0"
+              "electron": "11.0"
             },
             "modules": "commonjs",
             "loose": true
@@ -36,7 +36,7 @@
           "@babel/preset-env",
           {
             "targets": {
-              "electron": "9.0"
+              "electron": "11.0"
             },
             "modules": false,
             "loose": true

.eslintrc.json

@@ -27,12 +27,13 @@
         "singleQuote": true,
         "trailingComma": "all"
       }
-    ]
+    ],
+    "react/prop-types": "off"
   },
   "settings": {
     "react": {
-      "version": "16.13",
-      "flowVersion": "0.122"
+      "version": "17.0",
+      "flowVersion": "0.144"
     }
   }
 }

.flowconfig

@@ -4,7 +4,6 @@
 
 [lints]
 all=warn
-dynamic-export=off
 unclear-type=off
 
 [options]

.travis.yml

@@ -1,7 +1,6 @@
 sudo: false
 language: node_js
 node_js:
-  - 12
   - 14
 cache:
   yarn: true

CHANGELOG.md

@@ -1,3 +1,10 @@
+## v0.15.0 (2021-02-17)
+
+- Updated React Native for Web dependency to v0.15, that now has a peer dependency on React v17.0.
+- Updated Electron dependency to v11.0.
+- Removed custom `Appearance` and `Clipboard` APIs and `useColorScheme` hook, instead exporting the React Native Web implementation.
+- Updated logic to no longer require `webPreferences.nodeIntegration` to be set to `true` in Electron's `BrowserWindow` options.
+
 ## v0.14.0 (2020-07-11)
 
 - Updated React Native for Web dependency to v0.13.

README.md

@@ -4,9 +4,7 @@
 
 ## Introduction
 
-This project aims to provide extensions to [React Native for Web](https://github.com/necolas/react-native-web) targeted to the [Electron](https://www.electronjs.org) environment to support additional modules exposed by React Native (ex Clipboard, WebView) using Electron APIs.
-
-This is very early stage, not fully tested, and APIs will likely change between releases, so don't use this library if you need something stable.
+This project aims to provide extensions to [React Native for Web](https://github.com/necolas/react-native-web) targeted to the [Electron](https://www.electronjs.org) environment to support additional modules exposed by React Native (`Alert`) or alternative implementations (`Linking`) using Electron APIs.
 
 ## Installation
 
@@ -22,15 +20,35 @@ npm install electron react react-native-web
 
 `react-art` is also needed if you use `ART`.
 
+## Electron setup
+
+In order for the APIs exposed by `react-native-electron` to be accessible in Electron's render process, the following setup must be applied:
+
+- The `react-native-electron/main` module must be imported in the main process
+- `BrowserWindow` instances must be created with the following `webPreferences` options:
+
+```js
+webPreferences: {
+  contextIsolation: false,
+  preload: require('path').resolve(
+    require.resolve('react-native-electron/preload'),
+  ),
+},
+```
+
 ## Example
 
 See the `example` directory for the source code and Webpack config.
 
-To run the demo app, fork this repository and run:
+To run the demo app, fork this repository and run the following commands in the root folder:
 
 - `npm install`
-- `npm run example:server`
-- In another terminal instance, `npm run example:electron`
+- `npm run build`
+
+Then in the `example` folder:
+
+- `npm install`
+- `npm start`
 
 ## Usage with Expo application
 
@@ -40,17 +58,14 @@ This module can be used with Expo application (created by `expo-cli`) using the
 - Run `yarn expo-electron customize` in order to eject expo-electron's webpack configuration
 - Edit `./electron/webpack.config.js` as follows:
 
-```
-const { withExpoWebpack } = require('@expo/electron-adapter');
-
-module.exports = config => {
-	let expoConfig = withExpoWebpack(config);
-	
-	expoConfig.resolve.alias['react-native$'] = 'react-native-electron';
-	
-	return expoConfig;
-};
+```js
+const { withExpoWebpack } = require('@expo/electron-adapter')
 
+module.exports = (config) => {
+  const expoConfig = withExpoWebpack(config)
+  expoConfig.resolve.alias['react-native$'] = 'react-native-electron'
+  return expoConfig
+}
 ```
 
 Note this is a partial solution, as Expo's default webpack configuration includes more aliases to `react-native`, but it should cover all of `react-native-electron`'s APIs.
@@ -61,7 +76,7 @@ Note this is a partial solution, as Expo's default webpack configuration include
 
 [React Native's Alert](https://reactnative.dev/docs/alert.html) implementation using [Electron's dialog](https://www.electronjs.org/docs/api/dialog/)
 
-```
+```js
 Alert.alert(
   title: string,
   message: ?string,
@@ -70,22 +85,6 @@ Alert.alert(
 ): void
 ```
 
-### Appearance
-
-[React Native's Appearance](https://reactnative.dev/docs/appearance.html) implementation using [Electron's nativeTheme](https://www.electronjs.org/docs/api/native-theme/)
-
-```
-Appearance.getColorScheme(): 'light' | 'dark' | null
-```
-
-### Clipboard
-
-[React Native's Clipboard](https://reactnative.dev/docs/clipboard.html) implementation using [Electron's clipboard](https://www.electronjs.org/docs/api/clipboard/).
-
-`Clipboard.getString(type: ?string): Promise<?string>`
-
-`Clipboard.setString(text: string, type: ?string): void`
-
 ### Linking
 
 [React Native's Linking](https://reactnative.dev/docs/linking.html) implementation using Electron's [app](https://www.electronjs.org/docs/api/app/) and [shell](https://www.electronjs.org/docs/api/shell/) APIs.
@@ -100,10 +99,6 @@ Appearance.getColorScheme(): 'light' | 'dark' | null
 
 `Linking.getInitialURL(): Promise<?string>`: resolves with the `process.argv[1]` value, expecting the app to be opened by a command such as `myapp myapp://test`
 
-## Hooks
-
-`useColorScheme(): 'light' | 'dark' | null`
-
 ## License
 
 MIT  

example/.gitignore

@@ -0,0 +1,89 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+lerna-debug.log*
+
+# Diagnostic reports (https://nodejs.org/api/report.html)
+report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
+
+# Runtime data
+pids
+*.pid
+*.seed
+*.pid.lock
+.DS_Store
+
+# Directory for instrumented libs generated by jscoverage/JSCover
+lib-cov
+
+# Coverage directory used by tools like istanbul
+coverage
+*.lcov
+
+# nyc test coverage
+.nyc_output
+
+# node-waf configuration
+.lock-wscript
+
+# Compiled binary addons (https://nodejs.org/api/addons.html)
+build/Release
+
+# Dependency directories
+node_modules/
+jspm_packages/
+
+# TypeScript v1 declaration files
+typings/
+
+# TypeScript cache
+*.tsbuildinfo
+
+# Optional npm cache directory
+.npm
+
+# Optional eslint cache
+.eslintcache
+
+# Optional REPL history
+.node_repl_history
+
+# Output of 'npm pack'
+*.tgz
+
+# Yarn Integrity file
+.yarn-integrity
+
+# dotenv environment variables file
+.env
+.env.test
+
+# parcel-bundler cache (https://parceljs.org/)
+.cache
+
+# next.js build output
+.next
+
+# nuxt.js build output
+.nuxt
+
+# vuepress build output
+.vuepress/dist
+
+# Serverless directories
+.serverless/
+
+# FuseBox cache
+.fusebox/
+
+# DynamoDB Local files
+.dynamodb/
+
+# Webpack
+.webpack/
+
+# Electron-Forge
+out/