Add <Modal /> component

Summary:
Create Modal component that can be used to present content modally.
This commit is contained in:
Alex Akers
2015-07-28 07:31:26 -07:00
parent f53c95c743
commit 7d19ff3dcb
14 changed files with 359 additions and 8 deletions

48
Libraries/Modal/Modal.js Normal file
View File

@@ -0,0 +1,48 @@
/**
* Copyright (c) 2015-present, Facebook, Inc.
* All rights reserved.
*
* This source code is licensed under the BSD-style license found in the
* LICENSE file in the root directory of this source tree. An additional grant
* of patent rights can be found in the PATENTS file in the same directory.
*
* @providesModule Modal
* @flow
*/
'use strict';
var React = require('React');
var StyleSheet = require('StyleSheet');
var View = require('View');
var requireNativeComponent = require('requireNativeComponent');
var RCTModalHostView = requireNativeComponent('RCTModalHostView', null);
class Modal extends React.Component {
render(): ?ReactElement {
if (this.props.visible === false) {
return null;
}
return (
<RCTModalHostView animated={this.props.animated} style={styles.modal}>
<View style={styles.container}>
{this.props.children}
</View>
</RCTModalHostView>
);
}
}
var styles = StyleSheet.create({
modal: {
position: 'absolute',
},
container: {
left: 0,
position: 'absolute',
top: 0,
}
});
module.exports = Modal;

View File

@@ -24,6 +24,7 @@ var ReactNative = Object.assign(Object.create(require('React')), {
Image: require('Image'),
ListView: require('ListView'),
MapView: require('MapView'),
Modal: require('Modal'),
Navigator: require('Navigator'),
NavigatorIOS: require('NavigatorIOS'),
PickerIOS: require('PickerIOS'),