it('should be compatible with React.PropTypes.oneOfType', function() {
typeCheckPass(
React.PropTypes.oneOfType([LinkPropTypes.link(React.PropTypes.number)]),
{value: 123, requestChange: emptyFunction}
);
typeCheckFail(
React.PropTypes.oneOfType([LinkPropTypes.link(React.PropTypes.number)]),
123,
invalidMessage
);
typeCheckPass(
LinkPropTypes.link(React.PropTypes.oneOfType([React.PropTypes.number])),
{value: 123, requestChange: emptyFunction}
);
typeCheckFail(
LinkPropTypes.link(React.PropTypes.oneOfType([React.PropTypes.number])),
{value: 'imastring', requestChange: emptyFunction},
'Invalid prop `testProp.value` supplied to `testComponent`.'
);
});
* positioning is always just relative to the parent.
*
* If you want to position a child using specific numbers of logical
* pixels relative to its parent, set the child to have `absolute`
* position.
*
* If you want to position a child relative to something
* that is not its parent, just don't use styles for that. Use the
* component tree.
*
* See https://github.com/facebook/css-layout
* for more details on how `position` differs between React Native
* and CSS.
*/
position: ReactPropTypes.oneOf([
'absolute',
'relative'
]),
/** `flexDirection` controls which directions children of a container go.
* `row` goes left to right, `column` goes top to bottom, and you may
* be able to guess what the other two do. It works like `flex-direction`
* in CSS, except the default is `column`.
* See https://developer.mozilla.org/en-US/docs/Web/CSS/flex-direction
* for more details.
*/
flexDirection: ReactPropTypes.oneOf([
'row',
'row-reverse',
'column',
'column-reverse'
]),
<div className="col col-4">
<h3>Todos</h3>
<TaskList tasks={todo}
onCompleteTask={(task) => this.handleCompleteTask(task)}
/>
</div>
</div>
) : 'Please log in' }
</div>
);
}
}
HabiticaApp.propTypes = {
habit: PropTypes.arrayOf(PropTypes.shape({
type: PropTypes.string.isRequired,
text: PropTypes.string.isRequired
}).isRequired).isRequired,
daily: PropTypes.arrayOf(PropTypes.shape({
type: PropTypes.string.isRequired,
text: PropTypes.string.isRequired
}).isRequired).isRequired,
todo: PropTypes.arrayOf(PropTypes.shape({
type: PropTypes.string.isRequired,
text: PropTypes.string.isRequired
}).isRequired).isRequired
};
function select(state) {
return {
auth: state.auth,
var LayoutPropTypes = {
/** `display` sets the display type of this component.
*
* It works similarly to `display` in CSS, but only support 'flex' and 'none'.
* 'flex' is the default.
*/
display: ReactPropTypes.string,
/** `width` sets the width of this component.
*
* It works similarly to `width` in CSS, but in React Native you
* must use points or percentages. Ems and other units are not supported.
* See https://developer.mozilla.org/en-US/docs/Web/CSS/width for more details.
*/
width: ReactPropTypes.oneOfType([
ReactPropTypes.number,
ReactPropTypes.string,
]),
/** `height` sets the height of this component.
*
* It works similarly to `height` in CSS, but in React Native you
* must use points or percentages. Ems and other units are not supported.
* See https://developer.mozilla.org/en-US/docs/Web/CSS/height for more details.
*/
height: ReactPropTypes.oneOfType([
ReactPropTypes.number,
ReactPropTypes.string,
]),
/** `top` is the number of logical pixels to offset the top edge of
* this component.
/**
* If `false` the user won't be able to change the map region being displayed.
* Default value is `true`.
*/
scrollEnabled: React.PropTypes.bool,
/**
* The map type to be displayed.
*
* - standard: standard road map (default)
* - satellite: satellite view
* - hybrid: satellite view with roads and points of interest overlayed
*/
mapType: React.PropTypes.oneOf([
'standard',
'satellite',
'hybrid',
]),
/**
* The region to be displayed by the map.
*
* The region is defined by the center coordinates and the span of
* coordinates to display.
*/
region: React.PropTypes.shape({
/**
* Coordinates for the center of the map.
*/
latitude: React.PropTypes.number.isRequired,
longitude: React.PropTypes.number.isRequired,
!isRelayEnvironment(context)
) {
return new Error(sprintf(
'Invalid prop/context `%s` supplied to `%s`, expected `%s` to be ' +
'an object conforming to the `RelayEnvironment` interface.',
propName,
componentName,
context
));
}
return null;
},
QueryConfig: PropTypes.shape({
name: PropTypes.string.isRequired,
params: PropTypes.object.isRequired,
queries: PropTypes.object.isRequired,
}),
LegacyRelay(props: Object, propName: string, componentName: string): ?Error {
const relay = props[propName];
if (
!isRelayContext(relay) ||
!isLegacyRelayEnvironment(relay.environment)
) {
return new Error(sprintf(
'Invalid prop/context `%s` supplied to `%s`, expected `%s` to be ' +
'an object with a legacy `environment` implementation and `variables`.',
propName,
componentName,
relay
/**
* If `false` the user won't be able to change the map region being displayed.
* Default value is `true`.
*/
scrollEnabled: React.PropTypes.bool,
/**
* The map type to be displayed.
*
* - `standard`: Standard road map (default).
* - `satellite`: Satellite view.
* - `hybrid`: Satellite view with roads and points of interest overlaid.
*/
mapType: React.PropTypes.oneOf([
'standard',
'satellite',
'hybrid',
]),
/**
* The region to be displayed by the map.
*
* The region is defined by the center coordinates and the span of
* coordinates to display.
*/
region: React.PropTypes.shape({
/**
* Coordinates for the center of the map.
*/
latitude: React.PropTypes.number.isRequired,
longitude: React.PropTypes.number.isRequired,
taskCallbacks={this.props.taskCallbacks}
cardFormCallbacks={this.props.cardFormCallbacks}
onDelete={this.handleListDelete}
/>
);
});
return(
<div>
<div>
<TagsBlock tags={this.props.tags}
tagCallbacks={this.props.tagCallbacks}
/>
</div>
<div className="clearfix"></div>
<div className="list-block">
{lists}
<span className={new_list_style}><ListForm listFormCallbacks={this.props.listFormCallbacks}/></span>
</div>
</div>
);
};
};
Board.propTypes = {
lists: PropTypes.arrayOf(PropTypes.object),
cards: PropTypes.arrayOf(PropTypes.object),
cardCallbacks: PropTypes.object
};
export default DragDropContext(HTML5Backend)(Board);
maximumTrackTintColor: PropTypes.string,
/**
* The color used for the thumb.
*/
thumbTintColor: PropTypes.string,
/**
* The size of the touch area that allows moving the thumb.
* The touch area has the same center has the visible thumb.
* This allows to have a visually small thumb while still allowing the user
* to move it easily.
* The default is {width: 40, height: 40}.
*/
thumbTouchSize: PropTypes.shape(
{width: PropTypes.number, height: PropTypes.number}
),
/**
* Callback continuously called while the user is dragging the slider.
*/
onValueChange: PropTypes.func,
/**
* Callback called when the user starts changing the value (e.g. when
* the slider is pressed).
*/
onSlidingStart: PropTypes.func,
/**
* Callback called when the user finishes changing the value (e.g. when
value={value}
defaultValue={defaultValue}
placeholder={placeholder}
required={required}
onChange={(event) => onChange(event.target.value)}
{...rangeSpec(schema)} />
<span className="range-view">{value}</span>
</div>
);
}
if (process.env.NODE_ENV !== "production") {
RangeWidget.propTypes = {
schema: PropTypes.object.isRequired,
id: PropTypes.string.isRequired,
placeholder: PropTypes.string,
value: PropTypes.oneOfType([
React.PropTypes.string,
React.PropTypes.number,
]),
defaultValue: PropTypes.oneOfType([
React.PropTypes.string,
React.PropTypes.number,
]),
required: PropTypes.bool,
onChange: PropTypes.func,
};
}
export default RangeWidget;
c0-30.8,12-59.8,33.8-81.6c9.3-9.3,19.8-16.7,31.3-22.3c-15.3-32.1-47.7-54.5-85.8-54.5c-52.7,0-95.4,42.7-95.4,95.4
c0,29.8,14,56.1,35.4,73.6C48.7,238.3,0,346.6,0,418.2h125.2C131.5,395.4,140.8,372.1,152.7,350.1z'
/>
</g>
),
'warning': (
<path d='M501.3,440.8L281.8,31.1c-14.3-14-37.4-14-51.7,0L10.7,440.8c-14.3,14-14.3,36.6,0,50.6h490.6
C515.6,477.4,515.6,454.7,501.3,440.8z M277.3,429.5h-42.6v-44.2h42.6V429.5z M278.3,262l-11.6,105.1h-21.3L233.7,262v-57.1h44.6
V262z'
/>
)
};
const Icon = React.createClass({
propTypes: {
type: React.PropTypes.oneOf(Object.keys(icons))
},
render () {
const styles = this.styles();
return (
<svg
{...this.props}
fit={true}
preserveAspectRatio='xMidYMid meet'
style={styles.component}
viewBox='0 0 512 512'
>
{icons[this.props.type]}
</svg>
import React, { PropTypes } from 'react';
import Todo from '../Todo';
const propTypes = {
todos: PropTypes.arrayOf(PropTypes.shape({
_id: PropTypes.string.isRequired,
todo: PropTypes.string.isRequired,
})),
};
const TodoList = ({
todos,
}) => (
<div>
<If condition={todos}>
<If condition={todos.length === 0}>
<h1>Uh oh, no todos</h1>
<Else />
<ul>
{
todos.map((todo) => (
<Todo
key={todo._id}
todo={todo}
/>
))
}
</ul>
</If>
<Else />
<p>Something is wrong</p>
import _extends from 'babel-runtime/helpers/extends';
import _objectWithoutProperties from 'babel-runtime/helpers/objectWithoutProperties';
import _classCallCheck from 'babel-runtime/helpers/classCallCheck';
import _possibleConstructorReturn from 'babel-runtime/helpers/possibleConstructorReturn';
import _inherits from 'babel-runtime/helpers/inherits';
import classNames from 'classnames';
import React from 'react';
import Media from './Media';
import { bsClass, getClassSet, prefix, splitBsProps } from './utils/bootstrapUtils';
var propTypes = {
/**
* Align the media to the top, middle, or bottom of the media object.
*/
align: React.PropTypes.oneOf(['top', 'middle', 'bottom'])
};
var MediaRight = function (_React$Component) {
_inherits(MediaRight, _React$Component);
function MediaRight() {
_classCallCheck(this, MediaRight);
return _possibleConstructorReturn(this, _React$Component.apply(this, arguments));
}
MediaRight.prototype.render = function render() {
var _props = this.props;
var align = _props.align;
var className = _props.className;
fetchParams: {},
currentPage:1,
queryKeys:[],
emptyText: "暂无数据",
searchBarPlaceholder: "搜索表格内容",
processData: (data) => {return data},
beforeFetch: (obj) => {return obj},
onFetchError: () => {},
addRowClassName: () => {},
onChange: () => {},
}
// http://facebook.github.io/react/docs/reusable-components.html
Table.propTypes = {
locale: React.PropTypes.string,
jsxcolumns: React.PropTypes.arrayOf(React.PropTypes.object),
width: React.PropTypes.oneOfType([
React.PropTypes.string,
React.PropTypes.number
]),
height: React.PropTypes.oneOfType([
React.PropTypes.string,
React.PropTypes.number
]),
headerHeight: React.PropTypes.number,
pageSize: React.PropTypes.number,
queryKeys: React.PropTypes.array,
fetchDataOnMount: React.PropTypes.bool,
doubleClickToEdit: React.PropTypes.bool,
showColumnPicker: React.PropTypes.bool,
showPager: React.PropTypes.bool,
*/
scrollEnabled: React.PropTypes.bool,
/**
* The region to be displayed by the map.
*
* The region is defined by the center coordinates and the span of
* coordinates to display.
*/
region: React.PropTypes.shape({
/**
* Coordinates for the center of the map.
*/
latitude: React.PropTypes.number.isRequired,
longitude: React.PropTypes.number.isRequired,
/**
* Distance between the minimun and the maximum latitude/longitude
* to be displayed.
*/
latitudeDelta: React.PropTypes.number.isRequired,
longitudeDelta: React.PropTypes.number.isRequired,
}),
/**
* Map annotations with title/subtitle.
*/
annotations: React.PropTypes.arrayOf(React.PropTypes.shape({
/**
* The location of the annotation.
*/
latitude: React.PropTypes.number.isRequired,
const React = require('react');
const joinClasses = require('classnames');
const DEFINE_SORT = {
ASC: 'ASC',
DESC: 'DESC',
NONE: 'NONE'
};
const SortableHeaderCell = React.createClass({
propTypes: {
columnKey: React.PropTypes.string.isRequired,
column: React.PropTypes.shape({ name: React.PropTypes.node }),
onSort: React.PropTypes.func.isRequired,
sortDirection: React.PropTypes.oneOf(['ASC', 'DESC','NONE'])
},
onClick: function() {
let direction;
switch (this.props.sortDirection) {
default:
case null:
case undefined:
case DEFINE_SORT.NONE:
case DEFINE_SORT.DESC:
direction = DEFINE_SORT.ASC;
break;
case DEFINE_SORT.ASC:
direction = DEFINE_SORT.DESC;
break;
//case DEFINE_SORT.DESC:
// direction = DEFINE_SORT.NONE;
titleColor: ColorPropType, /** * The title displayed under the refresh indicator. * @platform ios */ title: React.PropTypes.string, /** * Whether the pull to refresh functionality is enabled. * @platform android */ enabled: React.PropTypes.bool, /** * The colors (at least one) that will be used to draw the refresh indicator. * @platform android */ colors: React.PropTypes.arrayOf(ColorPropType), /** * The background color of the refresh indicator. * @platform android */ progressBackgroundColor: ColorPropType, /** * Size of the refresh indicator, see RefreshControl.SIZE. * @platform android */ size: React.PropTypes.oneOf([RefreshLayoutConsts.SIZE.DEFAULT, RefreshLayoutConsts.SIZE.LARGE]), /** * Progress view top offset * @platform android */ progressViewOffset: React.PropTypes.number,
propTypes: {
navigator: PropTypes.shape({
push: PropTypes.func,
pop: PropTypes.func,
replace: PropTypes.func,
popToRoute: PropTypes.func,
popToTop: PropTypes.func,
}),
navigationBarRouteMapper: PropTypes.shape({
rightContentForRoute: PropTypes.func,
titleContentForRoute: PropTypes.func,
iconForRoute: PropTypes.func,
}),
navState: React.PropTypes.shape({
routeStack: React.PropTypes.arrayOf(React.PropTypes.object),
idStack: React.PropTypes.arrayOf(React.PropTypes.number),
presentedIndex: React.PropTypes.number,
}),
navigationBarStyles: View.propTypes.style,
},
statics: {
Styles: NavigatorBreadcrumbNavigationBarStyles,
},
_updateIndexProgress: function(progress, index, fromIndex, toIndex) {
var amount = toIndex > fromIndex ? progress : (1 - progress);
var oldDistToCenter = index - fromIndex;
var newDistToCenter = index - toIndex;
var interpolate;
if (oldDistToCenter > 0 && newDistToCenter === 0 ||
}
};
}
var ReactCSSTransitionGroup = React.createClass({
displayName: 'ReactCSSTransitionGroup',
propTypes: {
transitionName: React.PropTypes.oneOfType([
React.PropTypes.string,
React.PropTypes.shape({
enter: React.PropTypes.string,
leave: React.PropTypes.string,
active: React.PropTypes.string,
}),
React.PropTypes.shape({
enter: React.PropTypes.string,
enterActive: React.PropTypes.string,
leave: React.PropTypes.string,
leaveActive: React.PropTypes.string,
appear: React.PropTypes.string,
appearActive: React.PropTypes.string,
}),
]).isRequired,
transitionAppear: React.PropTypes.bool,
transitionEnter: React.PropTypes.bool,
transitionLeave: React.PropTypes.bool,
transitionAppearTimeout: createTransitionTimeoutPropValidator('Appear'),
transitionEnterTimeout: createTransitionTimeoutPropValidator('Enter'),
transitionLeaveTimeout: createTransitionTimeoutPropValidator('Leave'),
},
var navStatePresentedIndex = function(navState) {
if (navState.presentedIndex !== undefined) {
return navState.presentedIndex;
}
// TODO: rename `observedTopOfStack` to `presentedIndex` in `NavigatorIOS`
return navState.observedTopOfStack;
};
var NavigatorNavigationBar = React.createClass({
propTypes: {
navigator: React.PropTypes.object,
routeMapper: React.PropTypes.shape({
Title: React.PropTypes.func.isRequired,
LeftButton: React.PropTypes.func.isRequired,
RightButton: React.PropTypes.func.isRequired,
}),
navState: React.PropTypes.shape({
routeStack: React.PropTypes.arrayOf(React.PropTypes.object),
idStack: React.PropTypes.arrayOf(React.PropTypes.number),
presentedIndex: React.PropTypes.number,
}),
style: View.propTypes.style,
},
statics: {
Styles: NavigatorNavigationBarStyles,
},
_getReusableProps: function(
getDefaultProps: function(): DefaultProps {
return {
bufferDelay: 100,
};
},
getInitialState: function() {
return {
mostRecentEventCounter: 0,
bufferedValue: this.props.value,
};
},
contextTypes: {
onFocusRequested: React.PropTypes.func,
focusEmitter: React.PropTypes.instanceOf(EventEmitter),
},
_focusSubscription: (undefined: ?Function),
componentDidMount: function() {
if (!this.context.focusEmitter) {
if (this.props.autoFocus) {
this.requestAnimationFrame(this.focus);
}
return;
}
this._focusSubscription = this.context.focusEmitter.addListener(
'focus',
(el) => {
if (this === el) {
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: React.PropTypes.bool, /** * Sets the color of the status bar text. * * @platform ios */ barStyle: React.PropTypes.oneOf([ 'default', 'light-content', ]), /** * If the network activity indicator should be visible. * * @platform ios */ networkActivityIndicatorVisible: React.PropTypes.bool, /** * The transition effect when showing and hiding the status bar using the `hidden` * prop. Defaults to 'fade'. * * @platform ios */ showHideTransition: React.PropTypes.oneOf([ 'fade',
var Touchable = require('Touchable');
var View = require('View');
var ensurePositiveDelayProps = require('ensurePositiveDelayProps');
var warning = require('fbjs/lib/warning');
var PRESS_RETENTION_OFFSET = { top: 20, left: 20, right: 20, bottom: 30 };
var TouchableWithoutFeedback = React.createClass({
displayName: 'TouchableWithoutFeedback',
mixins: [TimerMixin, Touchable.Mixin],
propTypes: {
accessible: React.PropTypes.bool,
accessibilityComponentType: React.PropTypes.oneOf(View.AccessibilityComponentType),
accessibilityTraits: React.PropTypes.oneOfType([React.PropTypes.oneOf(View.AccessibilityTraits), React.PropTypes.arrayOf(React.PropTypes.oneOf(View.AccessibilityTraits))]),
disabled: React.PropTypes.bool,
onPress: React.PropTypes.func,
onPressIn: React.PropTypes.func,
onPressOut: React.PropTypes.func,
onLayout: React.PropTypes.func,
onLongPress: React.PropTypes.func,
delayPressIn: React.PropTypes.number,
delayPressOut: React.PropTypes.number,
* },
* titleText: {
* fontSize: 20,
* fontWeight: 'bold',
* },
* };
* ```
*/
const Text = React.createClass({
propTypes: {
/**
* Line Break mode. Works only with numberOfLines.
* clip is working only for iOS
*/
lineBreakMode: React.PropTypes.oneOf(['head', 'middle', 'tail', 'clip']),
/**
* Used to truncate the text with an ellipsis after computing the text
* layout, including line wrapping, such that the total number of lines
* does not exceed this number.
*/
numberOfLines: React.PropTypes.number,
/**
* Invoked on mount and layout changes with
*
* `{nativeEvent: {layout: {x, y, width, height}}}`
*/
onLayout: React.PropTypes.func,
/**
* This function is called on press.
*/
onValueChange: React.PropTypes.func,
/**
* If set to false, the picker will be disabled, i.e. the user will not be able to make a
* selection.
* @platform android
*/
enabled: React.PropTypes.bool,
/**
* On Android, specifies how to display the selection items when the user taps on the picker:
*
* - 'dialog': Show a modal dialog. This is the default.
* - 'dropdown': Shows a dropdown anchored to the picker view
*
* @platform android
*/
mode: React.PropTypes.oneOf(['dialog', 'dropdown']),
/**
* Style to apply to each of the item labels.
* @platform ios
*/
itemStyle: itemStylePropType,
/**
* Prompt string for this picker, used on Android in dialog mode as the title of the dialog.
* @platform android
*/
prompt: React.PropTypes.string,
/**
* Used to locate this view in end-to-end tests.
*/
testID: React.PropTypes.string,
},
if (stats.length === 0) { return null }
return (
<View style={styles.wrap}>
<User user={user} />
<View style={styles.inner}>
<Text style={styles.text}>Total kills: {stats.total_kills}</Text>
<Text style={styles.text}>Total deaths: {stats.total_deaths}</Text>
<Text style={styles.text}>KDR: {kdr(stats.total_deaths, stats.total_kills)}</Text>
<Text style={styles.text}>Total time played: {timeplayed(stats.total_time_played)}</Text>
<Text style={styles.text}>HS kills: {hsKills(stats.total_kills_headshot, stats.total_kills)}</Text>
<Text style={styles.text}>Accuracy: {accuracy(stats.total_shots_fired, stats.total_shots_hit)}</Text>
<Text style={styles.text}>Planted bombs: {stats.total_planted_bombs}</Text>
<Text style={styles.text}>Defused bombs: {stats.total_defused_bombs}</Text>
<Text style={styles.text}>MVP: {stats.total_mvps}</Text>
<Text style={styles.text}>Win (comp): {winRatio(stats.total_matches_played, stats.total_matches_won)}</Text>
</View>
</View>
)
}
Start.propTypes = {
stats: PropTypes.shape({
total_kills: PropTypes.number,
total_deaths: PropTypes.number
}),
user: PropTypes.shape({})
}
export default Start