web-platform support (#85)

* web-platform support

* fix linting

* platform-specific wrapper around WebView

* react-native-web-webview peerDep

* WebView is NOT default export

Author: oxyii

.gitignore

@@ -1,2 +1,4 @@
 node_modules
-.vscode
+.vscode
+.idea
+dist

babel.config.js

@@ -0,0 +1,6 @@
+module.exports = function (api) {
+  api.cache(true);
+  return {
+    presets: ['module:metro-react-native-babel-preset'],
+  };
+};

package.json

@@ -2,10 +2,13 @@
   "name": "react-native-youtube-iframe",
   "version": "1.4.0",
   "description": "A simple wrapper around the youtube iframe js API for react native",
-  "main": "index.js",
+  "main": "dist/index.js",
+  "types": "index.d.ts",
   "scripts": {
-    "lint": "eslint index.js src",
-    "test": "echo \"Error: no test specified\" && exit 1"
+    "lint": "eslint src",
+    "test": "echo \"Error: no test specified\" && exit 1",
+    "build": "rm -rf dist && babel src --out-dir dist",
+    "prepare": "yarn build"
   },
   "repository": {
     "type": "git",
@@ -34,11 +37,15 @@
   "peerDependencies": {
     "react": ">=16.8.6",
     "react-native": ">=0.60",
-    "react-native-webview": ">=7.0.0"
+    "react-native-webview": ">=7.0.0",
+    "react-native-web-webview": ">=1.0.2"
   },
   "devDependencies": {
+    "@babel/cli": "^7.2.3",
+    "@babel/core": "^7.2.2",
     "@react-native-community/eslint-config": "^2.0.0",
-    "eslint": "^7.7.0"
+    "eslint": "^7.7.0",
+    "metro-react-native-babel-preset": "^0.64.0"
   },
   "dependencies": {
     "events": "^3.2.0"

src/WebView.native.js

@@ -0,0 +1 @@
+export {WebView} from 'react-native-webview';

src/WebView.web.js

@@ -0,0 +1 @@
+export {WebView} from 'react-native-web-webview';

src/YoutubeIframe.js

@@ -7,7 +7,7 @@ import React, {
   useImperativeHandle,
 } from 'react';
 import {View, StyleSheet, Platform} from 'react-native';
-import WebView from 'react-native-webview';
+import {WebView} from './WebView';
 import {PLAYER_STATES, PLAYER_ERROR, CUSTOM_USER_AGENT} from './constants';
 import {EventEmitter} from 'events';
 import {

index.js src/index.jsindex.js renamed to src/index.js

@@ -1,9 +1,9 @@
-import YoutubeIframe from './src/YoutubeIframe';
-import {getYoutubeMeta} from './src/oEmbed';
+import YoutubeIframe from './YoutubeIframe';
+import {getYoutubeMeta} from './oEmbed';
 import {
   PLAYER_STATES_NAMES as PLAYER_STATES,
   PLAYER_ERROR_NAMES as PLAYER_ERRORS,
-} from './src/constants';
+} from './constants';
 
 export default YoutubeIframe;
 export {getYoutubeMeta, PLAYER_STATES, PLAYER_ERRORS};