├── .babelrc ├── .gitignore ├── LICENSE ├── README.md ├── __tests__ └── index.js ├── index.js └── package.json /.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["env", "react-native"] 3 | } 4 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # Logs 2 | logs 3 | *.log 4 | npm-debug.log* 5 | yarn-debug.log* 6 | yarn-error.log* 7 | 8 | # Runtime data 9 | pids 10 | *.pid 11 | *.seed 12 | *.pid.lock 13 | 14 | # Directory for instrumented libs generated by jscoverage/JSCover 15 | lib-cov 16 | 17 | # Coverage directory used by tools like istanbul 18 | coverage 19 | 20 | # nyc test coverage 21 | .nyc_output 22 | 23 | # Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files) 24 | .grunt 25 | 26 | # Bower dependency directory (https://bower.io/) 27 | bower_components 28 | 29 | # node-waf configuration 30 | .lock-wscript 31 | 32 | # Compiled binary addons (http://nodejs.org/api/addons.html) 33 | build/Release 34 | 35 | # Dependency directories 36 | node_modules/ 37 | jspm_packages/ 38 | 39 | # Typescript v1 declaration files 40 | typings/ 41 | 42 | # Optional npm cache directory 43 | .npm 44 | 45 | # Optional eslint cache 46 | .eslintcache 47 | 48 | # Optional REPL history 49 | .node_repl_history 50 | 51 | # Output of 'npm pack' 52 | *.tgz 53 | 54 | # Yarn Integrity file 55 | .yarn-integrity 56 | 57 | # dotenv environment variables file 58 | .env 59 | 60 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | BSD 3-Clause License 2 | 3 | Copyright (c) 2018, Quantum Business Analytics 4 | All rights reserved. 5 | 6 | Redistribution and use in source and binary forms, with or without 7 | modification, are permitted provided that the following conditions are met: 8 | 9 | * Redistributions of source code must retain the above copyright notice, this 10 | list of conditions and the following disclaimer. 11 | 12 | * Redistributions in binary form must reproduce the above copyright notice, 13 | this list of conditions and the following disclaimer in the documentation 14 | and/or other materials provided with the distribution. 15 | 16 | * Neither the name of the copyright holder nor the names of its 17 | contributors may be used to endorse or promote products derived from 18 | this software without specific prior written permission. 19 | 20 | THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" 21 | AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE 22 | IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE 23 | DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE 24 | FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL 25 | DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR 26 | SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER 27 | CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, 28 | OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE 29 | OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. 30 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # react-native-web_improved 2 | batteries-included version of `react-native-web` 3 | 4 | This module piggy-back on top of 5 | [react-native-web](https://github.com/necolas/react-native-web) adding support 6 | for the missing Components and APIs availables in vanilla React Native. 7 | 8 | Currently it add support for `Alert`, `AlertIOS`, `DrawerLayoutAndroid`, 9 | `Modal`, `RefreshControl`, `StatusBar`, `TabBarIOS` and `WebView`, being the 10 | main missing ones `TouchableNativeFeedback` and `NavigatorIOS`. If there's some 11 | API you are missing and know of a module that "polyfill" its functionality or 12 | you can implement it yourself, don't exhitate to create an issue asking to 13 | include it. Pull-requests are welcome :-) 14 | 15 | ## How to use 16 | 17 | Just include `react-native-web_improved` as dependency of your project instead 18 | of `react-native-web`, and do the alias pointing to it. After that, everything 19 | should work as usual. If you are using the `react-native-web` Babel plugin you 20 | would need to change it's references to use `react-native-web_improved` instead, 21 | no more. 22 | -------------------------------------------------------------------------------- /__tests__/index.js: -------------------------------------------------------------------------------- 1 | import { 2 | Alert, 3 | AlertIOS, 4 | DrawerLayoutAndroid, 5 | Modal, 6 | RefreshControl, 7 | StatusBar, 8 | TabBarIOS, 9 | WebView 10 | } from '..' 11 | 12 | 13 | test('exports', function() 14 | { 15 | expect(Alert.alert.name).toBe('alert') 16 | expect(AlertIOS.alert.name).toBe('alert') 17 | expect(AlertIOS.prompt.name).toBe('prompt') 18 | expect(DrawerLayoutAndroid.name).toBe('DrawerLayout') 19 | expect(Modal.name).toBe('Modal') 20 | expect(RefreshControl.name).toBe('RefreshControl') 21 | expect(StatusBar.name).toBe('StatusBar') 22 | expect(TabBarIOS.name).toBe('TabBarIOS') 23 | expect(WebView.name).toBe('_class') 24 | }) 25 | -------------------------------------------------------------------------------- /index.js: -------------------------------------------------------------------------------- 1 | import DrawerLayoutAndroid from 'react-native-drawer-layout' 2 | import { 3 | // top-level API 4 | createElement, 5 | findNodeHandle, 6 | render, 7 | unmountComponentAtNode, 8 | // modules 9 | processColor, 10 | NativeModules, 11 | TextPropTypes, 12 | ViewPropTypes, 13 | // APIs 14 | Animated, 15 | AppRegistry, 16 | AppState, 17 | AsyncStorage, 18 | BackHandler, 19 | Clipboard, 20 | Dimensions, 21 | Easing, 22 | I18nManager, 23 | InteractionManager, 24 | Keyboard, 25 | Linking, 26 | NetInfo, 27 | PanResponder, 28 | PixelRatio, 29 | Platform, 30 | StyleSheet, 31 | UIManager, 32 | Vibration, 33 | // components 34 | ActivityIndicator, 35 | ART, 36 | Button, 37 | CheckBox, 38 | FlatList, 39 | Image, 40 | ImageBackground, 41 | KeyboardAvoidingView, 42 | ListView, 43 | Picker, 44 | ProgressBar, 45 | SafeAreaView, 46 | ScrollView, 47 | SectionList, 48 | Switch, 49 | Text, 50 | TextInput, 51 | Touchable, 52 | TouchableHighlight, 53 | TouchableNativeFeedback, 54 | TouchableOpacity, 55 | TouchableWithoutFeedback, 56 | View, 57 | VirtualizedList, 58 | // propTypes 59 | ColorPropType, 60 | EdgeInsetsPropType, 61 | PointPropType 62 | } from 'react-native-web' 63 | 64 | import Alert from 'react-native-web-extended/dist/apis/Alert' 65 | import RefreshControl from 'react-native-web-extended/dist/components/RefreshControl' 66 | import TabBarIOS from 'react-native-web-extended/dist/components/TabBarIOS' 67 | 68 | import Modal from 'react-native-web-modal' 69 | import StatusBar from 'react-native-web-statusbar' 70 | import WebView from 'react-native-web-webview' 71 | 72 | const AlertIOS = Alert 73 | 74 | 75 | export { 76 | // top-level API 77 | createElement, 78 | findNodeHandle, 79 | render, 80 | unmountComponentAtNode, 81 | // modules 82 | processColor, 83 | NativeModules, 84 | TextPropTypes, 85 | ViewPropTypes, 86 | // APIs 87 | Alert, 88 | AlertIOS, 89 | Animated, 90 | AppRegistry, 91 | AppState, 92 | AsyncStorage, 93 | BackHandler, 94 | Clipboard, 95 | Dimensions, 96 | Easing, 97 | I18nManager, 98 | InteractionManager, 99 | Keyboard, 100 | Linking, 101 | NetInfo, 102 | PanResponder, 103 | PixelRatio, 104 | Platform, 105 | StyleSheet, 106 | UIManager, 107 | Vibration, 108 | // components 109 | ActivityIndicator, 110 | ART, 111 | Button, 112 | CheckBox, 113 | DrawerLayoutAndroid, 114 | FlatList, 115 | Image, 116 | ImageBackground, 117 | KeyboardAvoidingView, 118 | ListView, 119 | Modal, 120 | Picker, 121 | ProgressBar, 122 | RefreshControl, 123 | SafeAreaView, 124 | ScrollView, 125 | SectionList, 126 | StatusBar, 127 | Switch, 128 | TabBarIOS, 129 | Text, 130 | TextInput, 131 | Touchable, 132 | TouchableHighlight, 133 | TouchableNativeFeedback, 134 | TouchableOpacity, 135 | TouchableWithoutFeedback, 136 | View, 137 | VirtualizedList, 138 | WebView, 139 | // propTypes 140 | ColorPropType, 141 | EdgeInsetsPropType, 142 | PointPropType 143 | } 144 | 145 | export default { 146 | // top-level API 147 | createElement, 148 | findNodeHandle, 149 | render, 150 | unmountComponentAtNode, 151 | // modules 152 | processColor, 153 | NativeModules, 154 | TextPropTypes, 155 | ViewPropTypes, 156 | // APIs 157 | Alert, 158 | AlertIOS, 159 | Animated, 160 | AppRegistry, 161 | AppState, 162 | AsyncStorage, 163 | BackHandler, 164 | Clipboard, 165 | Dimensions, 166 | Easing, 167 | I18nManager, 168 | InteractionManager, 169 | Keyboard, 170 | Linking, 171 | NetInfo, 172 | PanResponder, 173 | PixelRatio, 174 | Platform, 175 | StyleSheet, 176 | UIManager, 177 | Vibration, 178 | // components 179 | ActivityIndicator, 180 | ART, 181 | Button, 182 | CheckBox, 183 | DrawerLayoutAndroid, 184 | FlatList, 185 | Image, 186 | ImageBackground, 187 | KeyboardAvoidingView, 188 | ListView, 189 | Modal, 190 | Picker, 191 | ProgressBar, 192 | RefreshControl, 193 | SafeAreaView, 194 | ScrollView, 195 | SectionList, 196 | StatusBar, 197 | Switch, 198 | TabBarIOS, 199 | Text, 200 | TextInput, 201 | Touchable, 202 | TouchableHighlight, 203 | TouchableNativeFeedback, 204 | TouchableOpacity, 205 | TouchableWithoutFeedback, 206 | View, 207 | VirtualizedList, 208 | WebView, 209 | // propTypes 210 | ColorPropType, 211 | EdgeInsetsPropType, 212 | PointPropType 213 | } 214 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "react-native-web_improved", 3 | "version": "0.10.0", 4 | "description": "batteries-included version of `react-native-web`", 5 | "scripts": { 6 | "test": "jest --coverage --notify" 7 | }, 8 | "repository": { 9 | "type": "git", 10 | "url": "git+https://github.com/piranna/react-native-web_improved.git" 11 | }, 12 | "keywords": [ 13 | "react-native-web", 14 | "batteries", 15 | "bateries", 16 | "included", 17 | "Alert", 18 | "AlertIOS", 19 | "Modal", 20 | "RefreshControl", 21 | "StatusBar", 22 | "TabBarIOS", 23 | "WebView" 24 | ], 25 | "author": "Jesús Leganés-Combarro 'piranna' ", 26 | "license": "ISC", 27 | "bugs": { 28 | "url": "https://github.com/piranna/react-native-web_improved/issues" 29 | }, 30 | "homepage": "https://github.com/piranna/react-native-web_improved#readme", 31 | "dependencies": { 32 | "react-native-drawer-layout": "^2.0.0", 33 | "react-native-web": "^0.10.0", 34 | "react-native-web-extended": "piranna/react-native-web-extended", 35 | "react-native-web-modal": "^1.0.1", 36 | "react-native-web-statusbar": "^0.0.0", 37 | "react-native-web-webview": "^0.2.8" 38 | }, 39 | "devDependencies": { 40 | "babel-preset-env": "^1.7.0", 41 | "babel-preset-react-native": "^4.0.1", 42 | "buho": "^0.3.4", 43 | "canvas": "^2.3.1", 44 | "jest-cli": "^24.1.0", 45 | "react": "^16.8.4", 46 | "react-art": "^16.8.4", 47 | "react-dom": "^16.8.4" 48 | }, 49 | "jest": { 50 | "moduleNameMapper": { 51 | "^react-native$": "/node_modules/react-native-web" 52 | }, 53 | "transformIgnorePatterns": [ 54 | "node_modules/?!(react-router-native)" 55 | ] 56 | } 57 | } 58 | --------------------------------------------------------------------------------