[RN] Fix jsdocs, formatting. Add flow

This commit is contained in:
Lyubo Marinov 2017-07-24 16:07:29 -05:00
parent 2094b15432
commit 24eb37ae1e
3 changed files with 38 additions and 30 deletions

View File

@ -1,13 +1,16 @@
/* @flow */
import React, { Component } from 'react';
/**
* Abstract (base) class for container of React Component children with a style.
* Abstract (base) class for container of React {@link Component} children with
* a style.
*
* @extends Component
*/
export default class AbstractContainer extends Component {
/**
* AbstractContainer component's property types.
* {@code AbstractContainer} component's property types.
*
* @static
*/
@ -15,38 +18,43 @@ export default class AbstractContainer extends Component {
children: React.PropTypes.node,
/**
* The event handler/listener to be invoked when this AbstractContainer
* is clicked on Web or pressed on React Native. If onClick is defined
* and touchFeedback is undefined, touchFeedback is considered defined
* as true.
* The event handler/listener to be invoked when this
* {@code AbstractContainer} is clicked on Web or pressed on React
* Native. If {@code onClick} is defined and {@link touchFeedback} is
* undefined, {@code touchFeedback} is considered defined as
* {@code true}.
*/
onClick: React.PropTypes.func,
/**
* The style (as in stylesheet) to be applied to this AbstractContainer.
* The style (as in stylesheet) to be applied to this
* {@code AbstractContainer}.
*/
style: React.PropTypes.object,
/**
* True if this instance is to provide visual feedback when touched;
* otherwise, false. If touchFeedback is undefined and onClick is
* defined, touchFeedback is considered defined as true.
* If this instance is to provide visual feedback when touched, then
* {@code true}; otherwise, {@code false}. If {@code touchFeedback} is
* undefined and {@link onClick} is defined, {@code touchFeedback} is
* considered defined as {@code true}.
*/
touchFeedback: React.PropTypes.bool,
/**
* True if this AbstractContainer is to be visible or false if this
* instance is to be hidden or not rendered at all.
* If this {@code AbstractContainer} is to be visible, then {@code true}
* or {@code false} if this instance is to be hidden or not rendered at
* all.
*/
visible: React.PropTypes.bool
};
/**
* Renders this AbstractContainer as a React Component of a specific type.
* Renders this {@code AbstractContainer} as a React {@code Component} of a
* specific type.
*
* @param {string|ReactClass} type - The type of the React Component which
* is to be rendered.
* @param {Object|undefined} props - The read-only React Component
* @param {string|ReactClass} type - The type of the React {@code Component}
* which is to be rendered.
* @param {Object|undefined} props - The read-only React {@code Component}
* properties, if any, to render. If undefined, the props of this instance
* will be rendered.
* @protected

View File

@ -1,3 +1,5 @@
/* @flow */
import React from 'react';
import {
Dimensions,
@ -31,6 +33,9 @@ export default class Container extends AbstractContainer {
// eslint-disable-next-line prefer-const
let { onClick, style, touchFeedback, visible, ...props } = this.props;
// onClick & touchFeedback
(typeof touchFeedback === 'undefined') && (touchFeedback = onClick);
// visible
// The following property is responsible to hide/show this Container by
@ -50,9 +55,6 @@ export default class Container extends AbstractContainer {
};
}
// onClick & touchFeedback
(typeof touchFeedback === 'undefined') && (touchFeedback = onClick);
const renderParent = touchFeedback || onClick;
if (!renderParent && visibilityStyle) {
@ -63,20 +65,17 @@ export default class Container extends AbstractContainer {
}
// eslint-disable-next-line object-property-newline
let component = this._render(View, { ...props, style });
let component = super._render(View, { ...props, style });
if (renderParent) {
const parentType
= touchFeedback
? TouchableHighlight
: TouchableWithoutFeedback;
= touchFeedback ? TouchableHighlight : TouchableWithoutFeedback;
const parentProps = {};
onClick && (parentProps.onPress = onClick);
visibilityStyle && (parentProps.style = visibilityStyle);
component
= React.createElement(parentType, parentProps, component);
component = React.createElement(parentType, parentProps, component);
}
return component;

View File

@ -1,3 +1,5 @@
/* @flow */
import AbstractContainer from '../AbstractContainer';
/**
@ -22,10 +24,9 @@ export default class Container extends AbstractContainer {
render() {
const { visible } = this.props;
if (typeof visible !== 'undefined' && !visible) {
return null;
}
return this._render('div');
return (
typeof visible === 'undefined' || visible
? super._render('div')
: null);
}
}