[RN] Fix jsdocs, formatting. Add flow
This commit is contained in:
parent
2094b15432
commit
24eb37ae1e
|
@ -1,13 +1,16 @@
|
||||||
|
/* @flow */
|
||||||
|
|
||||||
import React, { Component } from 'react';
|
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
|
* @extends Component
|
||||||
*/
|
*/
|
||||||
export default class AbstractContainer extends Component {
|
export default class AbstractContainer extends Component {
|
||||||
/**
|
/**
|
||||||
* AbstractContainer component's property types.
|
* {@code AbstractContainer} component's property types.
|
||||||
*
|
*
|
||||||
* @static
|
* @static
|
||||||
*/
|
*/
|
||||||
|
@ -15,38 +18,43 @@ export default class AbstractContainer extends Component {
|
||||||
children: React.PropTypes.node,
|
children: React.PropTypes.node,
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* The event handler/listener to be invoked when this AbstractContainer
|
* The event handler/listener to be invoked when this
|
||||||
* is clicked on Web or pressed on React Native. If onClick is defined
|
* {@code AbstractContainer} is clicked on Web or pressed on React
|
||||||
* and touchFeedback is undefined, touchFeedback is considered defined
|
* Native. If {@code onClick} is defined and {@link touchFeedback} is
|
||||||
* as true.
|
* undefined, {@code touchFeedback} is considered defined as
|
||||||
|
* {@code true}.
|
||||||
*/
|
*/
|
||||||
onClick: React.PropTypes.func,
|
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,
|
style: React.PropTypes.object,
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* True if this instance is to provide visual feedback when touched;
|
* If this instance is to provide visual feedback when touched, then
|
||||||
* otherwise, false. If touchFeedback is undefined and onClick is
|
* {@code true}; otherwise, {@code false}. If {@code touchFeedback} is
|
||||||
* defined, touchFeedback is considered defined as true.
|
* undefined and {@link onClick} is defined, {@code touchFeedback} is
|
||||||
|
* considered defined as {@code true}.
|
||||||
*/
|
*/
|
||||||
touchFeedback: React.PropTypes.bool,
|
touchFeedback: React.PropTypes.bool,
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* True if this AbstractContainer is to be visible or false if this
|
* If this {@code AbstractContainer} is to be visible, then {@code true}
|
||||||
* instance is to be hidden or not rendered at all.
|
* or {@code false} if this instance is to be hidden or not rendered at
|
||||||
|
* all.
|
||||||
*/
|
*/
|
||||||
visible: React.PropTypes.bool
|
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
|
* @param {string|ReactClass} type - The type of the React {@code Component}
|
||||||
* is to be rendered.
|
* which is to be rendered.
|
||||||
* @param {Object|undefined} props - The read-only React Component
|
* @param {Object|undefined} props - The read-only React {@code Component}
|
||||||
* properties, if any, to render. If undefined, the props of this instance
|
* properties, if any, to render. If undefined, the props of this instance
|
||||||
* will be rendered.
|
* will be rendered.
|
||||||
* @protected
|
* @protected
|
||||||
|
|
|
@ -1,3 +1,5 @@
|
||||||
|
/* @flow */
|
||||||
|
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import {
|
import {
|
||||||
Dimensions,
|
Dimensions,
|
||||||
|
@ -31,6 +33,9 @@ export default class Container extends AbstractContainer {
|
||||||
// eslint-disable-next-line prefer-const
|
// eslint-disable-next-line prefer-const
|
||||||
let { onClick, style, touchFeedback, visible, ...props } = this.props;
|
let { onClick, style, touchFeedback, visible, ...props } = this.props;
|
||||||
|
|
||||||
|
// onClick & touchFeedback
|
||||||
|
(typeof touchFeedback === 'undefined') && (touchFeedback = onClick);
|
||||||
|
|
||||||
// visible
|
// visible
|
||||||
|
|
||||||
// The following property is responsible to hide/show this Container by
|
// 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;
|
const renderParent = touchFeedback || onClick;
|
||||||
|
|
||||||
if (!renderParent && visibilityStyle) {
|
if (!renderParent && visibilityStyle) {
|
||||||
|
@ -63,20 +65,17 @@ export default class Container extends AbstractContainer {
|
||||||
}
|
}
|
||||||
|
|
||||||
// eslint-disable-next-line object-property-newline
|
// eslint-disable-next-line object-property-newline
|
||||||
let component = this._render(View, { ...props, style });
|
let component = super._render(View, { ...props, style });
|
||||||
|
|
||||||
if (renderParent) {
|
if (renderParent) {
|
||||||
const parentType
|
const parentType
|
||||||
= touchFeedback
|
= touchFeedback ? TouchableHighlight : TouchableWithoutFeedback;
|
||||||
? TouchableHighlight
|
|
||||||
: TouchableWithoutFeedback;
|
|
||||||
const parentProps = {};
|
const parentProps = {};
|
||||||
|
|
||||||
onClick && (parentProps.onPress = onClick);
|
onClick && (parentProps.onPress = onClick);
|
||||||
visibilityStyle && (parentProps.style = visibilityStyle);
|
visibilityStyle && (parentProps.style = visibilityStyle);
|
||||||
|
|
||||||
component
|
component = React.createElement(parentType, parentProps, component);
|
||||||
= React.createElement(parentType, parentProps, component);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
return component;
|
return component;
|
||||||
|
|
|
@ -1,3 +1,5 @@
|
||||||
|
/* @flow */
|
||||||
|
|
||||||
import AbstractContainer from '../AbstractContainer';
|
import AbstractContainer from '../AbstractContainer';
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
@ -22,10 +24,9 @@ export default class Container extends AbstractContainer {
|
||||||
render() {
|
render() {
|
||||||
const { visible } = this.props;
|
const { visible } = this.props;
|
||||||
|
|
||||||
if (typeof visible !== 'undefined' && !visible) {
|
return (
|
||||||
return null;
|
typeof visible === 'undefined' || visible
|
||||||
}
|
? super._render('div')
|
||||||
|
: null);
|
||||||
return this._render('div');
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue