Merge 8ca60d18c7 into 118663287a

.all-contributorsrc

@@ -1,5 +1,5 @@
 {
-  "projectName": "react-native-webview",
+  "projectName": "@react-native-community/webview",
   "projectOwner": "react-native-community",
   "repoType": "github",
   "repoHost": "https://github.com",

.github/ISSUE_TEMPLATE/bug-report.md

@@ -39,4 +39,4 @@ If applicable, add screenshots to help explain your problem.
  - OS:
  - OS version:
  - react-native version:
- - react-native-webview version:
+ - @react-native-community/webview version:

docs/Contributing.md

@@ -9,10 +9,10 @@ Secondly, we'd like the contribution experience to be as good as possible. While
 After you fork the repo, clone it to your machine, and make your changes, you'll want to test them in an app.
 
 There are two methods of testing:
-1) Testing within a clone of react-native-webview
+1) Testing within a clone of webview
 2) Testing in a new `react-native init` project
 
-### Testing within react-native-webview
+### Testing within webview
 
 #### For all platforms:
 ```
@@ -49,8 +49,8 @@ The Metro Bundler will now be running in the Terminal for react-native-macos.  I
 In a new `react-native init` project, do this:
 
 ```
-$ yarn add ../react-native-webview
-$ react-native link react-native-webview
+$ yarn add ../webview
+$ react-native link webview
 ```
 
 You may run into a problem where the `jest-haste-map` module map says react-native was added twice:
@@ -58,13 +58,13 @@ You may run into a problem where the `jest-haste-map` module map says react-nati
 ```
 Loading dependency graph...(node:32651) UnhandledPromiseRejectionWarning: Error: jest-haste-map: Haste module naming collision:
   Duplicate module name: react-native
-  Paths: /Users/myuser/TestApp/node_modules/react-native/package.json collides with /Users/myuser/TestApp/node_modules/react-native-webview/node_modules/react-native/package.json
+  Paths: /Users/myuser/TestApp/node_modules/react-native/package.json collides with /Users/myuser/TestApp/node_modules/webview/node_modules/react-native/package.json
 ```
 
 Just remove the second path like this:
 
 ```
-$ rm -rf ./node_modules/react-native-webview/node_modules/react-native
+$ rm -rf ./node_modules/webview/node_modules/react-native
 ```
 
 And then re-run the packager:
@@ -73,11 +73,11 @@ And then re-run the packager:
 $ react-native start --reset-cache
 ```
 
-When you make a change, you'll probably need to unlink, remove, re-add, and re-link `react-native-webview`:
+When you make a change, you'll probably need to unlink, remove, re-add, and re-link `webview`:
 
 ```
-$ react-native unlink react-native-webview && yarn remove react-native-webview
-$ yarn add ../react-native-webview && react-native link react-native-webview
+$ react-native unlink webview && yarn remove webview
+$ yarn add ../webview && react-native link webview
 ```
 
 ## Notes

docs/Custom-Android.md

@@ -105,7 +105,7 @@ public class NavigationCompletedEvent extends Event<NavigationCompletedEvent> {
 
 You can trigger the event in your web view client. You can hook existing handlers if your events are based on them.
 
-You should refer to [RNCWebViewManager.java](https://github.com/react-native-community/react-native-webview/blob/master/android/src/main/java/com/reactnativecommunity/webview/RNCWebViewManager.java) in the react-native-webview codebase to see what handlers are available and how they are implemented. You can extend any methods here to provide extra functionality.
+You should refer to [RNCWebViewManager.java](https://github.com/react-native-community/webview/blob/master/android/src/main/java/com/reactnativecommunity/webview/RNCWebViewManager.java) in the webview codebase to see what handlers are available and how they are implemented. You can extend any methods here to provide extra functionality.
 
 ```java
 public class NavigationCompletedEvent extends Event<NavigationCompletedEvent> {
@@ -176,7 +176,7 @@ To get your native component, you must use `requireNativeComponent`: the same as
 ```javascript
 import React, {Component, PropTypes} from 'react';
 import {requireNativeComponent} from 'react-native';
-import {WebView} from 'react-native-webview';
+import {WebView} from '@react-native-community/webview';
 
 export default class CustomWebView extends Component {
   static propTypes = WebView.propTypes;
@@ -199,7 +199,7 @@ If you want to add custom props to your native component, you can use `nativeCon
 
 For events, the event handler must always be set to a function. This means it isn't safe to use the event handler directly from `this.props`, as the user might not have provided one. The standard approach is to create a event handler in your class, and then invoking the event handler given in `this.props` if it exists.
 
-If you are unsure how something should be implemented from the JS side, look at [WebView.android.js](https://github.com/react-native-community/react-native-webview/blob/master/js/WebView.android.js) in the React Native source.
+If you are unsure how something should be implemented from the JS side, look at [WebView.android.js](https://github.com/react-native-community/webview/blob/master/js/WebView.android.js) in the React Native source.
 
 ```javascript
 export default class CustomWebView extends Component {

docs/Getting-Started.md

@@ -2,16 +2,16 @@
 
 Here's how to get started quickly with the React Native WebView.
 
-## 1. Add react-native-webview to your dependencies
+## 1. Add @react-native-community/webview to your dependencies
 
 ```
-$ yarn add react-native-webview
+$ yarn add @react-native-community/webview
 ```
  (or)
  
  For npm use
 ```
-$ npm install --save react-native-webview
+$ npm install --save @react-native-community/webview
 ```
 
 ## 2. Link native dependencies
@@ -21,10 +21,10 @@ From react-native 0.60 autolinking will take care of the link step but don't for
 React Native modules that include native Objective-C, Swift, Java, or Kotlin code have to be "linked" so that the compiler knows to include them in the app.
 
 ```
-$ react-native link react-native-webview
+$ react-native link @react-native-community/webview
 ```
 
-_NOTE: If you ever need to uninstall React Native WebView, run `react-native unlink react-native-webview` to unlink it._
+_NOTE: If you ever need to uninstall React Native WebView, run `react-native unlink @react-native-community/webview` to unlink it._
 
 ### iOS:
 
@@ -38,10 +38,10 @@ If you wish to use cocoapods and haven't set it up yet, please instead refer to
 
 ### Android:
 
-Android - react-native-webview version <6:
+Android - @react-native-community/webview version <6:
 This module does not require any extra step after running the link command 🎉
 
-Android - react-native-webview version >=6.X.X:
+Android - @react-native-community/webview version >=6.X.X:
 Please make sure AndroidX is enabled in your project by editting `android/gradle.properties` and adding 2 lines:
 
 ```
@@ -55,13 +55,13 @@ For Android manual installation, please refer to [this article](https://engineer
 
 Cocoapod and autolinking is not yet support for react-native macOS but is coming soon.  In the meantime you must manually link.
 
-The method is nearly identical to the [manual linking method for iOS](https://facebook.github.io/react-native/docs/linking-libraries-ios#manual-linking) except that you will include the `node_modules/react-native-webview/macos/RNCWebView.xcodeproj` project in your main project and link the `RNCWebView-macOS.a` library. 
+The method is nearly identical to the [manual linking method for iOS](https://facebook.github.io/react-native/docs/linking-libraries-ios#manual-linking) except that you will include the `node_modules/@react-native-community/webview/macos/RNCWebView.xcodeproj` project in your main project and link the `RNCWebView-macOS.a` library. 
 
 ## 3. Import the webview into your component
 
 ```js
 import React, { Component } from 'react';
-import { WebView } from 'react-native-webview';
+import { WebView } from '@react-native-community/webview';
 
 class MyWeb extends Component {
   render() {
@@ -79,7 +79,7 @@ Minimal example with inline HTML:
 
 ```js
 import React, { Component } from 'react';
-import { WebView } from 'react-native-webview';
+import { WebView } from '@react-native-community/webview';
 
 class MyInlineWeb extends Component {
   render() {

docs/Guide.md

@@ -22,7 +22,7 @@ The simplest way to use the WebView is to simply pipe in the HTML you want to di
 
 ```js
 import React, { Component } from 'react';
-import { WebView } from 'react-native-webview';
+import { WebView } from '@react-native-community/webview';
 
 class MyInlineWeb extends Component {
   render() {
@@ -44,7 +44,7 @@ This is the most common use-case for WebView.
 
 ```js
 import React, { Component } from 'react';
-import { WebView } from 'react-native-webview';
+import { WebView } from '@react-native-community/webview';
 
 class MyWeb extends Component {
   render() {
@@ -61,7 +61,7 @@ Sometimes you would have bundled an HTML file along with the app and would like
 
 ```js
 import React, { Component } from 'react';
-import { WebView } from 'react-native-webview';
+import { WebView } from '@react-native-community/webview';
 
 const myHtmlFile = require("./my-asset-folder/local-site.html");
 
@@ -78,7 +78,7 @@ However on Android, you need to place the HTML file inside your android project'
 
 ```js
 import React, { Component } from 'react';
-import { WebView } from 'react-native-webview';
+import { WebView } from '@react-native-community/webview';
 
 class MyWeb extends Component {
   render() {
@@ -95,7 +95,7 @@ Sometimes you want to intercept a user tapping on a link in your webview and do
 
 ```js
 import React, { Component } from 'react';
-import { WebView } from 'react-native-webview';
+import { WebView } from '@react-native-community/webview';
 
 class MyWeb extends Component {
   webview = null;
@@ -202,7 +202,7 @@ Normally, apps that do not have permission to use the camera can prompt the user
 File Upload using `<input type="file" />` is not supported for Android 4.4 KitKat (see [details](https://github.com/delight-im/Android-AdvancedWebView/issues/4#issuecomment-70372146)):
 
 ```
-import { WebView } from "react-native-webview";
+import { WebView } from "@react-native-community/webview";
 
 WebView.isFileUploadSupported().then(res => {
   if (res === true) {
@@ -271,7 +271,7 @@ This is a script that runs immediately after the web page loads for the first ti
 ```jsx
 import React, { Component } from 'react';
 import { View } from 'react-native';
-import { WebView } from 'react-native-webview';
+import { WebView } from '@react-native-community/webview';
 
 export default class App extends Component {
   render() {
@@ -285,7 +285,7 @@ export default class App extends Component {
         <WebView
           source={{
             uri:
-              'https://github.com/react-native-community/react-native-webview',
+              'https://github.com/react-native-community/webview',
           }}
           injectedJavaScript={runFirst}
         />
@@ -312,7 +312,7 @@ This is a script that runs **before** the web page loads for the first time. It
 ```jsx
 import React, { Component } from 'react';
 import { View } from 'react-native';
-import { WebView } from 'react-native-webview';
+import { WebView } from '@react-native-community/webview';
 
 export default class App extends Component {
   render() {
@@ -325,7 +325,7 @@ export default class App extends Component {
         <WebView
           source={{
             uri:
-              'https://github.com/react-native-community/react-native-webview',
+              'https://github.com/react-native-community/webview',
           }}
           injectedJavaScriptBeforeContentLoaded={runFirst}
         />
@@ -344,7 +344,7 @@ While convenient, the downside to the previously mentioned `injectedJavaScript`
 ```jsx
 import React, { Component } from 'react';
 import { View } from 'react-native';
-import { WebView } from 'react-native-webview';
+import { WebView } from '@react-native-community/webview';
 
 export default class App extends Component {
   render() {
@@ -363,7 +363,7 @@ export default class App extends Component {
           ref={r => (this.webref = r)}
           source={{
             uri:
-              'https://github.com/react-native-community/react-native-webview',
+              'https://github.com/react-native-community/webview',
           }}
         />
       </View>
@@ -392,7 +392,7 @@ You _must_ set `onMessage` or the `window.ReactNativeWebView.postMessage` method
 ```jsx
 import React, { Component } from 'react';
 import { View } from 'react-native';
-import { WebView } from 'react-native-webview';
+import { WebView } from '@react-native-community/webview';
 
 export default class App extends Component {
   render() {

example/examples/Alerts.tsx

@@ -1,7 +1,7 @@
 import React, {Component} from 'react';
 import {Text, View} from 'react-native';
 
-import WebView from 'react-native-webview';
+import WebView from '@react-native-community/webview';
 
 const HTML = `
 <!DOCTYPE html>\n

example/examples/Background.tsx

@@ -1,7 +1,7 @@
 import React, {Component} from 'react';
 import {Text, View} from 'react-native';
 
-import WebView from 'react-native-webview';
+import WebView from '@react-native-community/webview';
 
 const HTML = `
 <!DOCTYPE html>\n

example/examples/Scrolling.tsx

@@ -1,7 +1,7 @@
 import React, {Component} from 'react';
 import {Button, Text, View} from 'react-native';
 
-import WebView from 'react-native-webview';
+import WebView from '@react-native-community/webview';
 
 const HTML = `
 <!DOCTYPE html>\n

example/ios/Podfile.lock

@@ -182,7 +182,7 @@ PODS:
     - React-cxxreact (= 0.61.5)
     - React-jsi (= 0.61.5)
   - React-jsinspector (0.61.5)
-  - react-native-webview (8.0.6):
+  - react-native-webview (8.1.0):
     - React
   - React-RCTActionSheet (0.61.5):
     - React-Core/RCTActionSheetHeaders (= 0.61.5)
@@ -326,7 +326,7 @@ SPEC CHECKSUMS:
   React-jsi: cb2cd74d7ccf4cffb071a46833613edc79cdf8f7
   React-jsiexecutor: d5525f9ed5f782fdbacb64b9b01a43a9323d2386
   React-jsinspector: fa0ecc501688c3c4c34f28834a76302233e29dc0
-  react-native-webview: 222d83c9c489e09b5d3541519110a637490ad4fa
+  react-native-webview: 6a787655a50a59c309ea032561ea8a8d8b8d1c45
   React-RCTActionSheet: 600b4d10e3aea0913b5a92256d2719c0cdd26d76
   React-RCTAnimation: 791a87558389c80908ed06cc5dfc5e7920dfa360
   React-RCTBlob: d89293cc0236d9cb0933d85e430b0bbe81ad1d72

ios/RNCWebView.m

@@ -94,7 +94,7 @@ static NSDictionary* customCertificatesForHost;
   BOOL _savedKeyboardDisplayRequiresUserAction;
 
   // Workaround for StatusBar appearance bug for iOS 12
-  // https://github.com/react-native-community/react-native-webview/issues/62
+  // https://github.com/react-native-community/webview/issues/62
   BOOL _isFullScreenVideoOpen;
 #if !TARGET_OS_OSX
   UIStatusBarStyle _savedStatusBarStyle;
@@ -146,7 +146,7 @@ static NSDictionary* customCertificatesForHost;
       name:UIKeyboardWillShowNotification object:nil];
 
     // Workaround for StatusBar appearance bug for iOS 12
-    // https://github.com/react-native-community/react-native-webview/issues/62
+    // https://github.com/react-native-community/webview/issues/62
       [[NSNotificationCenter defaultCenter] addObserver:self
                                                selector:@selector(showFullScreenVideoStatusBars)
                                                    name:UIWindowDidBecomeVisibleNotification

package.json

@@ -1,5 +1,5 @@
 {
-  "name": "react-native-webview",
+  "name": "@react-native-community/webview",
   "description": "React Native WebView component for iOS, Android, and macOS",
   "main": "index.js",
   "typings": "index.d.ts",
@@ -9,7 +9,7 @@
   ],
   "license": "MIT",
   "version": "8.1.1",
-  "homepage": "https://github.com/react-native-community/react-native-webview#readme",
+  "homepage": "https://github.com/react-native-community/webview#readme",
   "scripts": {
     "start": "node node_modules/react-native/local-cli/cli.js start",
     "start:android": "react-native run-android --root example/",
@@ -66,7 +66,7 @@
   },
   "repository": {
     "type": "git",
-    "url": "https://github.com/react-native-community/react-native-webview.git"
+    "url": "https://github.com/react-native-community/webview.git"
   },
   "files": [
     "android",

react-native-webview.podspec

@@ -3,7 +3,7 @@ require 'json'
 package = JSON.parse(File.read(File.join(__dir__, 'package.json')))
 
 Pod::Spec.new do |s|
-  s.name         = package['name']
+  s.name         = "react-native-webview"
   s.version      = package['version']
   s.summary      = package['description']
   s.license      = package['license']
@@ -12,7 +12,7 @@ Pod::Spec.new do |s|
   s.homepage     = package['homepage']
   s.platform     = :ios, "9.0"
 
-  s.source       = { :git => "https://github.com/react-native-community/react-native-webview.git", :tag => "v#{s.version}" }
+  s.source       = { :git => "https://github.com/react-native-community/webview.git", :tag => "v#{s.version}" }
   s.source_files  = "ios/**/*.{h,m}"
 
   s.dependency 'React'