diff --git a/Libraries/Components/StatusBar/StatusBar.js b/Libraries/Components/StatusBar/StatusBar.js index 6448283651..52e6a764d2 100644 --- a/Libraries/Components/StatusBar/StatusBar.js +++ b/Libraries/Components/StatusBar/StatusBar.js @@ -11,8 +11,6 @@ 'use strict'; const React = require('React'); -const PropTypes = require('prop-types'); -const ColorPropType = require('ColorPropType'); const Platform = require('Platform'); const processColor = require('processColor'); @@ -55,9 +53,55 @@ export type StatusBarAnimation = $Enum<{ slide: string, }>; -type DefaultProps = { - animated: boolean, -}; +type AndroidProps = $ReadOnly<{| + /** + * The background color of the status bar. + * @platform android + */ + backgroundColor?: ?string, + /** + * If the status bar is translucent. + * When translucent is set to true, the app will draw under the status bar. + * This is useful when using a semi transparent status bar color. + * + * @platform android + */ + translucent?: ?boolean, +|}>; + +type IOSProps = $ReadOnly<{| + /** + * If the network activity indicator should be visible. + * + * @platform ios + */ + networkActivityIndicatorVisible?: ?boolean, + /** + * The transition effect when showing and hiding the status bar using the `hidden` + * prop. Defaults to 'fade'. + * + * @platform ios + */ + showHideTransition?: ?('fade' | 'slide'), +|}>; + +type Props = $ReadOnly<{| + ...AndroidProps, + ...IOSProps, + /** + * If the status bar is hidden. + */ + hidden?: ?boolean, + /** + * If the transition between status bar property changes should be animated. + * Supported for backgroundColor, barStyle and hidden. + */ + animated?: ?boolean, + /** + * Sets the color of the status bar text. + */ + barStyle?: ?('default' | 'light-content' | 'dark-content'), +|}>; /** * Merges the prop stack with the default values. @@ -148,15 +192,7 @@ function createStackEntry(props: any): any { * * `currentHeight` (Android only) The height of the status bar. */ -class StatusBar extends React.Component<{ - hidden?: boolean, - animated?: boolean, - backgroundColor?: string, - translucent?: boolean, - barStyle?: 'default' | 'light-content' | 'dark-content', - networkActivityIndicatorVisible?: boolean, - showHideTransition?: 'fade' | 'slide', -}> { +class StatusBar extends React.Component { static _propsStack = []; static _defaultProps = createStackEntry({ @@ -261,48 +297,6 @@ class StatusBar extends React.Component<{ StatusBarManager.setTranslucent(translucent); } - static propTypes = { - /** - * If the status bar is hidden. - */ - hidden: PropTypes.bool, - /** - * If the transition between status bar property changes should be animated. - * Supported for backgroundColor, barStyle and hidden. - */ - animated: PropTypes.bool, - /** - * The background color of the status bar. - * @platform android - */ - backgroundColor: ColorPropType, - /** - * If the status bar is translucent. - * When translucent is set to true, the app will draw under the status bar. - * This is useful when using a semi transparent status bar color. - * - * @platform android - */ - translucent: PropTypes.bool, - /** - * Sets the color of the status bar text. - */ - barStyle: PropTypes.oneOf(['default', 'light-content', 'dark-content']), - /** - * If the network activity indicator should be visible. - * - * @platform ios - */ - networkActivityIndicatorVisible: PropTypes.bool, - /** - * The transition effect when showing and hiding the status bar using the `hidden` - * prop. Defaults to 'fade'. - * - * @platform ios - */ - showHideTransition: PropTypes.oneOf(['fade', 'slide']), - }; - static defaultProps = { animated: false, showHideTransition: 'fade',