React propTypes as static class properties

This commit is contained in:
Lyubomir Marinov 2016-11-30 19:52:39 -06:00
parent 9f26270a98
commit 0db33bb45c
24 changed files with 352 additions and 357 deletions

View File

@ -52,6 +52,7 @@
},
"devDependencies": {
"babel-core": "*",
"babel-eslint": "^7.1.1",
"babel-loader": "^6.2.8",
"babel-polyfill": "*",
"babel-preset-es2015": "^6.18.0",

View File

@ -4,6 +4,7 @@ module.exports = {
'commonjs': true,
'es6': true
},
'parser': 'babel-eslint',
'parserOptions': {
'ecmaFeatures': {
'experimentalObjectRestSpread': true,

View File

@ -29,6 +29,21 @@ const DEFAULT_CONFIG = {
* @abstract
*/
export class AbstractApp extends Component {
/**
* AbstractApp component's property types.
*
* @static
*/
static propTypes = {
config: React.PropTypes.object,
store: React.PropTypes.object,
/**
* The URL, if any, with which the app was launched.
*/
url: React.PropTypes.string
}
/**
* Init lib-jitsi-meet and create local participant when component is going
* to be mounted.
@ -113,18 +128,3 @@ export class AbstractApp extends Component {
this.props.store.dispatch(appNavigate(url));
}
}
/**
* AbstractApp component's property types.
*
* @static
*/
AbstractApp.propTypes = {
config: React.PropTypes.object,
store: React.PropTypes.object,
/**
* The URL, if any, with which the app was launched.
*/
url: React.PropTypes.string
};

View File

@ -11,6 +11,13 @@ import { AbstractApp } from './AbstractApp';
* @extends AbstractApp
*/
export class App extends AbstractApp {
/**
* App component's property types.
*
* @static
*/
static propTypes = AbstractApp.propTypes
/**
* Initializes a new App instance.
*
@ -126,10 +133,3 @@ export class App extends AbstractApp {
this._openURL(event.url);
}
}
/**
* App component's property types.
*
* @static
*/
App.propTypes = AbstractApp.propTypes;

View File

@ -18,6 +18,13 @@ import { AbstractApp } from './AbstractApp';
* @extends AbstractApp
*/
export class App extends AbstractApp {
/**
* App component's property types.
*
* @static
*/
static propTypes = AbstractApp.propTypes
/**
* Initializes a new App instance.
*
@ -148,10 +155,3 @@ export class App extends AbstractApp {
return this._createElement(component, props);
}
}
/**
* App component's property types.
*
* @static
*/
App.propTypes = AbstractApp.propTypes;

View File

@ -11,6 +11,24 @@ import { Video } from './_';
* @abstract
*/
export class AbstractVideoTrack extends Component {
/**
* AbstractVideoTrack component's property types.
*
* @static
*/
static propTypes = {
dispatch: React.PropTypes.func,
videoTrack: React.PropTypes.object,
waitForVideoStarted: React.PropTypes.bool,
/**
* The z-order of the Video of AbstractVideoTrack in the stacking space
* of all Videos. For more details, refer to the zOrder property of the
* Video class for React Native.
*/
zOrder: React.PropTypes.number
}
/**
* Initializes a new AbstractVideoTrack instance.
*
@ -116,24 +134,6 @@ export class AbstractVideoTrack extends Component {
}
}
/**
* AbstractVideoTrack component's property types.
*
* @static
*/
AbstractVideoTrack.propTypes = {
dispatch: React.PropTypes.func,
videoTrack: React.PropTypes.object,
waitForVideoStarted: React.PropTypes.bool,
/**
* The z-order of the Video of AbstractVideoTrack in the stacking space of
* all Videos. For more details, refer to the zOrder property of the Video
* class for React Native.
*/
zOrder: React.PropTypes.number
};
/**
* Returns null if a specific value is falsy; otherwise, returns the specified
* value.

View File

@ -5,6 +5,16 @@ import React, { Component } from 'react';
* around react-native-webrtc's RTCView.
*/
export class Audio extends Component {
/**
* Audio component's property types.
*
* @static
*/
static propTypes = {
muted: React.PropTypes.bool,
stream: React.PropTypes.object
}
/**
* Implements React's {@link Component#render()}.
*
@ -18,13 +28,3 @@ export class Audio extends Component {
return null;
}
}
/**
* Audio component's property types.
*
* @static
*/
Audio.propTypes = {
muted: React.PropTypes.bool,
stream: React.PropTypes.object
};

View File

@ -18,6 +18,43 @@ const RTCVIEW_SUPPORTS_MIRROR = Platform.OS === 'android';
* around react-native-webrtc's RTCView.
*/
export class Video extends Component {
/**
* Video component's property types.
*
* @static
*/
static propTypes = {
mirror: React.PropTypes.bool,
muted: React.PropTypes.bool,
onPlaying: React.PropTypes.func,
stream: React.PropTypes.object,
/**
* Similarly to the CSS property z-index, specifies the z-order of this
* Video in the stacking space of all Videos. When Videos overlap,
* zOrder determines which one covers the other. A Video with a larger
* zOrder generally covers a Video with a lower one.
*
* Non-overlapping Videos may safely share a z-order (because one does
* not have to cover the other).
*
* The support for zOrder is platform-dependent and/or
* implementation-specific. Thus, specifying a value for zOrder is to be
* thought of as giving a hint rather than as imposing a requirement.
* For example, video renderers such as Video are commonly implemented
* using OpenGL and OpenGL views may have different numbers of layers in
* their stacking space. Android has three: a layer bellow the window
* (aka default), a layer bellow the window again but above the previous
* layer (aka media overlay), and above the window. Consequently, it is
* advisable to limit the number of utilized layers in the stacking
* space to the minimum sufficient for the desired display. For example,
* a video call application usually needs a maximum of two zOrder
* values: 0 for the remote video(s) which appear in the background, and
* 1 for the local video(s) which appear above the remote video(s).
*/
zOrder: React.PropTypes.number
}
/**
* React Component method that executes once component is mounted.
*
@ -86,40 +123,3 @@ export class Video extends Component {
return null;
}
}
/**
* Video component's property types.
*
* @static
*/
Video.propTypes = {
mirror: React.PropTypes.bool,
muted: React.PropTypes.bool,
onPlaying: React.PropTypes.func,
stream: React.PropTypes.object,
/**
* Similarly to the CSS property z-index, specifies the z-order of this
* Video in the stacking space of all Videos. When Videos overlap, zOrder
* determines which one covers the other. A Video with a larger zOrder
* generally covers a Video with a lower one.
*
* Non-overlapping Videos may safely share a z-order (because one does not
* have to cover the other).
*
* The support for zOrder is platform-dependent and/or
* implementation-specific. Thus, specifying a value for zOrder is to be
* thought of as giving a hint rather than as imposing a requirement. For
* example, video renderers such as Video are commonly implemented using
* OpenGL and OpenGL views may have different numbers of layers in their
* stacking space. Android has three: a layer bellow the window (aka
* default), a layer bellow the window again but above the previous layer
* (aka media overlay), and above the window. Consequently, it is advisable
* to limit the number of utilized layers in the stacking space to the
* minimum sufficient for the desired display. For example, a video call
* application usually needs a maximum of two zOrder values: 0 for the
* remote video(s) which appear in the background, and 1 for the local
* video(s) which appear above the remote video(s).
*/
zOrder: React.PropTypes.number
};

View File

@ -11,6 +11,13 @@ import { styles } from './styles';
* @extends AbstractVideoTrack
*/
class VideoTrack extends AbstractVideoTrack {
/**
* VideoTrack component's property types.
*
* @static
*/
static propTypes = AbstractVideoTrack.propTypes
/**
* Initializes a new VideoTrack instance.
*
@ -153,11 +160,4 @@ class VideoTrack extends AbstractVideoTrack {
}
}
/**
* VideoTrack component's property types.
*
* @static
*/
VideoTrack.propTypes = AbstractVideoTrack.propTypes;
export default connect()(VideoTrack);

View File

@ -6,6 +6,40 @@ import React, { Component } from 'react';
* @extends Component
*/
export default class AbstractContainer extends Component {
/**
* AbstractContainer component's property types.
*
* @static
*/
static propTypes = {
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.
*/
onClick: React.PropTypes.func,
/**
* The style (as in stylesheet) to be applied to this 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.
*/
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.
*/
visible: React.PropTypes.bool
}
/**
* Renders this AbstractContainer as a React Component of a specific type.
@ -38,37 +72,3 @@ export default class AbstractContainer extends Component {
return React.createElement(type, filteredProps, children);
}
}
/**
* AbstractContainer component's property types.
*
* @static
*/
AbstractContainer.propTypes = {
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.
*/
onClick: React.PropTypes.func,
/**
* The style (as in stylesheet) to be applied to this 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.
*/
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.
*/
visible: React.PropTypes.bool
};

View File

@ -14,6 +14,12 @@ import AbstractContainer from './AbstractContainer';
* @extends AbstractContainer
*/
export class Container extends AbstractContainer {
/**
* Container component's property types.
*
* @static
*/
static propTypes = AbstractContainer.propTypes
/**
* Implements React's {@link Component#render()}.
@ -74,10 +80,3 @@ export class Container extends AbstractContainer {
return component;
}
}
/**
* Container component's property types.
*
* @static
*/
Container.propTypes = AbstractContainer.propTypes;

View File

@ -6,6 +6,33 @@ import { Linking, Text } from 'react-native';
* and its href attribute.
*/
export class Link extends Component {
/**
* Link component's property types.
*
* @static
*/
static propTypes = {
/**
* The children to be displayed within this Link.
*/
children: React.PropTypes.node,
/**
* Notifies that this Link failed to open the URL associated with it.
*/
onLinkingOpenURLRejected: React.PropTypes.func,
/**
* The CSS style to be applied to this Link for the purposes of display.
*/
style: React.PropTypes.object,
/**
* The URL to be opened when this Link is clicked/pressed.
*/
url: React.PropTypes.string
}
/**
* Initializes a new Link instance.
*
@ -60,28 +87,3 @@ export class Link extends Component {
.catch(reason => this._onLinkingOpenURLRejected(reason));
}
}
/**
* Link component's property types.
*/
Link.propTypes = {
/**
* The children to be displayed within this Link.
*/
children: React.PropTypes.node,
/**
* Notifies that this Link failed to open the URL associated with it.
*/
onLinkingOpenURLRejected: React.PropTypes.func,
/**
* The CSS style to be applied to this Link for the purposes of display.
*/
style: React.PropTypes.object,
/**
* The URL to be opened when this Link is clicked/pressed.
*/
url: React.PropTypes.string
};

View File

@ -7,6 +7,20 @@ import { styles } from './styles';
* Display a participant avatar.
*/
export default class Avatar extends Component {
/**
* Avatar component's property types.
*
* @static
*/
static propTypes = {
/**
* The optional style to add to an Avatar in order to customize its base
* look (and feel).
*/
style: React.PropTypes.object,
uri: React.PropTypes.string
}
/**
* Implements React's {@link Component#render()}.
*
@ -23,18 +37,3 @@ export default class Avatar extends Component {
);
}
}
/**
* Avatar component's property types.
*
* @static
*/
Avatar.propTypes = {
/**
* The optional style to add to an Avatar in order to customize its base
* look (and feel).
*/
style: React.PropTypes.object,
uri: React.PropTypes.string
};

View File

@ -21,6 +21,14 @@ const TOOLBAR_TIMEOUT_MS = 5000;
* The conference page of the application.
*/
class Conference extends Component {
/**
* Conference component's property types.
*
* @static
*/
static propTypes = {
dispatch: React.PropTypes.func
}
/**
* Initializes a new Conference instance.
@ -125,13 +133,4 @@ class Conference extends Component {
}
}
/**
* Conference component's property types.
*
* @static
*/
Conference.propTypes = {
dispatch: React.PropTypes.func
};
export default reactReduxConnect()(Conference);

View File

@ -20,6 +20,63 @@ import { styles } from './styles';
* @extends Component
*/
class ParticipantView extends Component {
/**
* ParticipantView component's property types.
*
* @static
*/
static propTypes = {
/**
* The source (e.g. URI, URL) of the avatar image of the participant
* with {@link #participantId}.
*
* @private
*/
_avatar: React.PropTypes.string,
/**
* The video Track of the participant with {@link #participantId}.
*/
_videoTrack: React.PropTypes.object,
/**
* The style, if any, of the avatar in addition to the default style.
*/
avatarStyle: React.PropTypes.object,
/**
* The ID of the participant (to be) depicted by ParticipantView.
*
* @public
*/
participantId: React.PropTypes.string,
/**
* True if the avatar of the depicted participant is to be shown should
* the avatar be available and the video of the participant is not to be
* shown; otherwise, false. If undefined, defaults to true.
*/
showAvatar: React.PropTypes.bool,
/**
* True if the video of the depicted participant is to be shown should
* the video be available. If undefined, defaults to true.
*/
showVideo: React.PropTypes.bool,
/**
* The style, if any, to apply to ParticipantView in addition to its
* default style.
*/
style: React.PropTypes.object,
/**
* The z-order of the Video of ParticipantView in the stacking space of
* all Videos. For more details, refer to the zOrder property of the
* Video class for React Native.
*/
zOrder: React.PropTypes.number
}
/**
* Implements React's {@link Component#render()}.
@ -77,65 +134,6 @@ class ParticipantView extends Component {
}
}
/**
* ParticipantView component's property types.
*
* @static
*/
ParticipantView.propTypes = {
/**
* The source (e.g. URI, URL) of the avatar image of the participant with
* {@link #participantId}.
*
* @private
*/
_avatar: React.PropTypes.string,
/**
* The video Track of the participant with {@link #participantId}.
*/
_videoTrack: React.PropTypes.object,
/**
* The style, if any, of the avatar in addition to the default style.
*/
avatarStyle: React.PropTypes.object,
/**
* The ID of the participant (to be) depicted by ParticipantView.
*
* @public
*/
participantId: React.PropTypes.string,
/**
* True if the avatar of the depicted participant is to be shown should the
* avatar be available and the video of the participant is not to be shown;
* otherwise, false. If undefined, defaults to true.
*/
showAvatar: React.PropTypes.bool,
/**
* True if the video of the depicted participant is to be shown should the
* video be available. If undefined, defaults to true.
*/
showVideo: React.PropTypes.bool,
/**
* The style, if any, to apply to ParticipantView in addition to its default
* style.
*/
style: React.PropTypes.object,
/**
* The z-order of the Video of ParticipantView in the stacking space of all
* Videos. For more details, refer to the zOrder property of the Video class
* for React Native.
*/
zOrder: React.PropTypes.number
};
/**
* Converts the specified value to a boolean value. If the specified value is
* undefined, returns the boolean value of undefinedValue.

View File

@ -13,6 +13,16 @@ import { styles } from './_';
* @extends Component
*/
class FilmStrip extends Component {
/**
* FilmStrip component's property types.
*
* @static
*/
static propTypes = {
participants: React.PropTypes.array,
visible: React.PropTypes.bool.isRequired
}
/**
* Implements React's {@link Component#render()}.
*
@ -79,16 +89,6 @@ class FilmStrip extends Component {
}
}
/**
* FilmStrip component's property types.
*
* @static
*/
FilmStrip.propTypes = {
participants: React.PropTypes.array,
visible: React.PropTypes.bool.isRequired
};
/**
* Function that maps parts of Redux state tree into component props.
*

View File

@ -26,6 +26,19 @@ import {
* @extends Component
*/
class Thumbnail extends Component {
/**
* Thumbnail component's property types.
*
* @static
*/
static propTypes = {
audioTrack: React.PropTypes.object,
dispatch: React.PropTypes.func,
largeVideo: React.PropTypes.object,
participant: React.PropTypes.object,
videoTrack: React.PropTypes.object
}
/**
* Initializes new Video Thumbnail component.
*
@ -119,19 +132,6 @@ class Thumbnail extends Component {
}
}
/**
* Thumbnail component's property types.
*
* @static
*/
Thumbnail.propTypes = {
audioTrack: React.PropTypes.object,
dispatch: React.PropTypes.func,
largeVideo: React.PropTypes.object,
participant: React.PropTypes.object,
videoTrack: React.PropTypes.object
};
/**
* Function that maps parts of Redux state tree into component props.
*

View File

@ -11,6 +11,20 @@ import { styles } from './styles';
* @extends Component
*/
class LargeVideo extends Component {
/**
* LargeVideo component's property types.
*
* @static
*/
static propTypes = {
/**
* The ID of the participant (to be) depicted by LargeVideo.
*
* @private
*/
_participantId: React.PropTypes.string
}
/**
* Implements React's {@link Component#render()}.
*
@ -28,21 +42,6 @@ class LargeVideo extends Component {
}
}
/**
* LargeVideo component's property types.
*
* @static
*/
LargeVideo.propTypes = {
/**
* The ID of the participant (to be) depicted by LargeVideo.
*
* @private
*/
_participantId: React.PropTypes.string
};
/**
* Maps (parts of) the Redux state to the associated LargeVideo's props.
*

View File

@ -15,6 +15,18 @@ import { styles } from './styles';
* @abstract
*/
export class AbstractToolbar extends Component {
/**
* AbstractToolbar component's property types.
*
* @static
*/
static propTypes = {
audioMuted: React.PropTypes.bool,
dispatch: React.PropTypes.func,
videoMuted: React.PropTypes.bool,
visible: React.PropTypes.bool.isRequired
}
/**
* Initializes a new AbstractToolbar instance.
*
@ -104,18 +116,6 @@ export class AbstractToolbar extends Component {
}
}
/**
* AbstractToolbar component's property types.
*
* @static
*/
AbstractToolbar.propTypes = {
audioMuted: React.PropTypes.bool,
dispatch: React.PropTypes.func,
videoMuted: React.PropTypes.bool,
visible: React.PropTypes.bool.isRequired
};
/**
* Maps parts of media state to component props.
*

View File

@ -6,6 +6,29 @@ import React, { Component } from 'react';
* @abstract
*/
export default class AbstractToolbarButton extends Component {
/**
* AbstractToolbarButton component's property types.
*
* @static
*/
static propTypes = {
/**
* The name of the Icon of this AbstractToolbarButton.
*/
iconName: React.PropTypes.string,
/**
* The style of the Icon of this AbstractToolbarButton.
*/
iconStyle: React.PropTypes.object,
onClick: React.PropTypes.func,
style:
React.PropTypes.oneOfType([
React.PropTypes.array,
React.PropTypes.object
]),
underlayColor: React.PropTypes.any
}
/**
* Implements React's {@link Component#render()}.
@ -34,28 +57,3 @@ export default class AbstractToolbarButton extends Component {
return React.createElement(type, props);
}
}
/**
* AbstractToolbarButton component's property types.
*
* @static
*/
AbstractToolbarButton.propTypes = {
/**
* The name of the Icon of this AbstractToolbarButton.
*/
iconName: React.PropTypes.string,
/**
* The style of the Icon of this AbstractToolbarButton.
*/
iconStyle: React.PropTypes.object,
onClick: React.PropTypes.func,
style:
React.PropTypes.oneOfType([
React.PropTypes.array,
React.PropTypes.object
]),
underlayColor: React.PropTypes.any
};

View File

@ -22,6 +22,13 @@ import ToolbarButton from './ToolbarButton';
* @extends AbstractToolbar
*/
class Toolbar extends AbstractToolbar {
/**
* Toolbar component's property types.
*
* @static
*/
static propTypes = AbstractToolbar.propTypes
/**
* Initializes a new Toolbar instance.
*
@ -116,11 +123,4 @@ Object.assign(Toolbar.prototype, {
videoMutedIcon: 'camera-disabled'
});
/**
* Toolbar component's property types.
*
* @static
*/
Toolbar.propTypes = AbstractToolbar.propTypes;
export default connect(mapStateToProps)(Toolbar);

View File

@ -11,6 +11,12 @@ import AbstractToolbarButton from './AbstractToolbarButton';
* @extends AbstractToolbarButton
*/
export default class ToolbarButton extends AbstractToolbarButton {
/**
* ToolbarButton component's property types.
*
* @static
*/
static propTypes = AbstractToolbarButton.propTypes
/**
* Renders the button of this Toolbar button.
@ -39,10 +45,3 @@ export default class ToolbarButton extends AbstractToolbarButton {
return super._renderIcon(Icon);
}
}
/**
* ToolbarButton component's property types.
*
* @static
*/
ToolbarButton.propTypes = AbstractToolbarButton.propTypes;

View File

@ -11,6 +11,17 @@ import { getLocalVideoTrack } from '../../base/tracks';
* @abstract
*/
export class AbstractWelcomePage extends Component {
/**
* AbstractWelcomePage component's property types.
*
* @static
*/
static propTypes = {
dispatch: React.PropTypes.func,
localVideoTrack: React.PropTypes.object,
room: React.PropTypes.string
}
/**
* Initializes a new AbstractWelcomePage instance, including the initial
* state of the room name input.
@ -91,17 +102,6 @@ export class AbstractWelcomePage extends Component {
}
}
/**
* AbstractWelcomePage component's property types.
*
* @static
*/
AbstractWelcomePage.propTypes = {
dispatch: React.PropTypes.func,
localVideoTrack: React.PropTypes.object,
room: React.PropTypes.string
};
/**
* Selects local video track from tracks in state, local participant and room
* and maps them to component props. It seems it's not possible to 'connect'

View File

@ -25,6 +25,13 @@ const TERMS_OF_SERVICE_URL
* @extends AbstractWelcomePage
*/
class WelcomePage extends AbstractWelcomePage {
/**
* WelcomePage component's property types.
*
* @static
*/
static propTypes = AbstractWelcomePage.propTypes
/**
* Renders a prompt for entering a room name.
*
@ -90,11 +97,4 @@ class WelcomePage extends AbstractWelcomePage {
}
}
/**
* WelcomePage component's property types.
*
* @static
*/
WelcomePage.propTypes = AbstractWelcomePage.propTypes;
export default connect(mapStateToProps)(WelcomePage);