diff --git a/README.md b/README.md index b840e09..da57014 100644 --- a/README.md +++ b/README.md @@ -94,6 +94,9 @@ Property | Description `preferredBarTintColor` (String) | The color to tint the background of the navigation bar and the toolbar. [`white`/`#FFFFFF`] `preferredControlTintColor` (String) | The color to tint the control buttons on the navigation bar and the toolbar. [`gray`/`#808080`] `readerMode` (Boolean) | A value that specifies whether Safari should enter Reader mode, if it is available. [`true`/`false`] +`animated` (Boolean) | Animate the presentation. [`true`/`false`] +`modalPresentationStyle` (String) | The presentation style for modally presented view controllers. [`none`/`fullScreen`/`pageSheet`/`formSheet`/`currentContext`/`custom`/`overFullScreen`/`overCurrentContext`/`popover`] +`modalTransitionStyle` (String) | The transition style to use when presenting the view controller. [`coverVertical`/`flipHorizontal`/`crossDissolve`/`partialCurl`] ### Android Options Property | Description diff --git a/example/.eslintrc.js b/example/.eslintrc.js index 40c6dcd..8333598 100644 --- a/example/.eslintrc.js +++ b/example/.eslintrc.js @@ -1,4 +1,17 @@ module.exports = { root: true, extends: '@react-native-community', + rules: { + "comma-dangle": ["error", { + "arrays": "never", + "objects": "never", + "imports": "never", + "exports": "never", + "functions": "never" + }], + "prettier/prettier": ["error", { + "endOfLine": "auto", + "singleQuote": true + }] + } }; diff --git a/example/App.js b/example/App.js index c9481b8..1a7fc5c 100644 --- a/example/App.js +++ b/example/App.js @@ -6,7 +6,7 @@ * @flow */ -import React, { Component } from 'react' +import React, { Component } from 'react'; import { Platform, StyleSheet, @@ -17,40 +17,43 @@ import { TextInput, StatusBar, Linking -} from 'react-native' -import InAppBrowser from 'react-native-inappbrowser-reborn' +} from 'react-native'; +import InAppBrowser from 'react-native-inappbrowser-reborn'; const instructions = Platform.select({ ios: 'Press Cmd+R to reload,\n' + 'Cmd+D or shake for dev menu', android: 'Double tap R on your keyboard to reload,\n' + 'Shake or press menu button for dev menu' -}) +}); export default class App extends Component { - constructor (props) { - super(props) + constructor(props) { + super(props); this.state = { url: 'https://www.google.com' - } + }; } - sleep (timeout) { - return new Promise(resolve => setTimeout(resolve, timeout)) + sleep(timeout) { + return new Promise(resolve => setTimeout(resolve, timeout)); } - async openLink () { - const { url } = this.state + async openLink() { + const { url } = this.state; try { if (await InAppBrowser.isAvailable()) { - StatusBar.setBarStyle('light-content') + StatusBar.setBarStyle('light-content'); const result = await InAppBrowser.open(url, { // iOS Properties dismissButtonStyle: 'cancel', preferredBarTintColor: '#453AA4', preferredControlTintColor: 'white', readerMode: false, + animated: true, + modalPresentationStyle: 'fullScreen', + modalTransitionStyle: 'partialCurl', // Android Properties showTitle: true, toolbarColor: '#6200EE', @@ -69,58 +72,67 @@ export default class App extends Component { headers: { 'my-custom-header': 'my custom header value' } - }) - await this.sleep(800) - Alert.alert('Response', JSON.stringify(result)) - } else Linking.openURL(url) + }); + await this.sleep(800); + Alert.alert('Response', JSON.stringify(result)); + } else { + Linking.openURL(url); + } } catch (error) { - Alert.alert(error.message) + Alert.alert(error.message); } } - getDeepLink (path = '') { - const scheme = 'my-demo' - const prefix = Platform.OS === 'android' ? `${scheme}://demo/` : `${scheme}://` - return prefix + path + getDeepLink(path = '') { + const scheme = 'my-demo'; + const prefix = + Platform.OS === 'android' ? `${scheme}://demo/` : `${scheme}://`; + return prefix + path; } - async tryDeepLinking () { - const redirectToURL = `https://proyecto26.github.io/react-native-inappbrowser/` - const redirectUrl = this.getDeepLink('home') - const url = `${redirectToURL}?redirect_url=${encodeURIComponent(redirectUrl)}` + async tryDeepLinking() { + const redirectToURL = + 'https://proyecto26.github.io/react-native-inappbrowser/'; + const redirectUrl = encodeURIComponent(this.getDeepLink('home')); + const url = `${redirectToURL}?redirect_url=${redirectUrl}`; try { if (await InAppBrowser.isAvailable()) { - const result = await InAppBrowser.openAuth(url, redirectUrl) - await this.sleep(800) - Alert.alert('Response', JSON.stringify(result)) + const result = await InAppBrowser.openAuth(url, redirectUrl); + await this.sleep(800); + Alert.alert('Response', JSON.stringify(result)); } else { - Alert.alert('InAppBrowser is not supported :/') + Alert.alert('InAppBrowser is not supported :/'); } } catch (error) { - Alert.alert('Something’s wrong with the app :(') + Alert.alert('Something’s wrong with the app :('); } } - render () { + render() { return ( - - {'Welcome InAppBrowser\nfor React Native!'} + + + {'Welcome InAppBrowser\nfor React Native!'} + Type the url this.setState({ url: text })} + onChangeText={text => this.setState({ url: text })} value={this.state.url} /> -