Example #1
0
                  <div className="myoo-cell--small">
                    <img
                      key={i}
                      className="myoo-cell__image--small"
                      src={content.imageUrl}
                      onClick={this.onVideoClicked.bind(this, content.embeddedId)} />
                  </div>
                );
              })
            }
          </div>
        </div>
        {this.props.children}
      </main>
    );
  }
};

Main.propTypes = {
  contents: React.PropTypes.arrayOf(
    React.PropTypes.shape({
      embeddedId: React.PropTypes.string,
      imageUrl: React.PropTypes.string
    })
  ).isRequired,
  dispatcher: React.PropTypes.object.isRequired,
  embeddedId: React.PropTypes.string
};

Main.defaultProps = { embeddedId: '' };
Example #2
0
      !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
Example #3
0
      '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,

      /**
       * Distance between the minimum and the maximum latitude/longitude
       * to be displayed.
       */
      latitudeDelta: React.PropTypes.number,
      longitudeDelta: React.PropTypes.number,
    }),

    /**
     * Map annotations with title and subtitle.
     */
    annotations: React.PropTypes.arrayOf(React.PropTypes.shape({
      /**
       * The location of the annotation.
       */
      latitude: React.PropTypes.number.isRequired,
Example #4
0
          onTodoClick={index =>
          dispatch(completeTodo(index))
        } />
        <Footer
          filter={visibilityFilter}
          onFilterChange={nextFilter =>
          dispatch(setVisibilityFilter(nextFilter))
        } />
      </div>
      )
    }
  }

  App.propTypes = {
    visibleTodos: PropTypes.arrayOf(PropTypes.shape({
      text: PropTypes.string.isRequired,
      completed: PropTypes.bool.isRequired
    }).isRequired).isRequired,
    visibilityFilter: PropTypes.oneOf([
      'SHOW_ALL',
      'SHOW_COMPLETED',
      'SHOW_ACTIVE'
    ]).isRequired
  }

  function selectTodos(todos, filter) {
    switch (filter) {
      case VisibilityFilters.SHOW_ALL:
        return todos
      case VisibilityFilters.SHOW_COMPLETED:
        return todos.filter(todo => todo.completed)
      case VisibilityFilters.SHOW_ACTIVE:
        //console.log(post);

        let updatePost;
        if (isLoggedIn, currentUser._id === post.userId) {
            updatePost = <Link className="ui small button" to={`/blog/update/${post._id}`}>update post</Link>;
        }

        return (
            <div className="ui main container">
                <h1 className="ui header text center">{post.title}</h1>
                {updatePost}
                <p>{post.content}</p>
            </div>
        )
    }
}

PostView.defaultProps = {
    post: {}
};

PostView.propTypes = {
    post: PropTypes.object,
    App: PropTypes.shape({
        isLoggedIn: PropTypes.bool.isRequired,
        currentUser: PropTypes.object.isRequired
    })
};

export default PostView;
  function onDeleteSubmit(event) {
    event.preventDefault()
    const result = window.confirm(`Do you want to delete the ${todoList.name} list?`)
    if (result) {
      onDeleteList(todoList)
    }
  }

  function onNameClick(event) {
    event.preventDefault()
    const result = window.prompt(`Rename ${todoList.name} to:`)
    if (result) {
      onRenameList(todoList, result)
    }
  }
}

TodoList.propTypes = {
  todoList: pt.shape({
    name: pt.string,
    list: pt.array,
  }).isRequired,
  onAddTodo: pt.func,
  onCompleteTodo: pt.func,
  onDeleteTodo: pt.func,
  onRenameList: pt.func,
  onDeleteList: pt.func,
}

Example #7
0
import React, { PropTypes } from 'react'
import Todo from './todo'

const TodoList = ({ todos, onTodoClick }) => (
  <ul>
    {todos.map(todo =>
      <Todo
        key={todo.id}
        {...todo}
        onClick={() => onTodoClick(todo.id)}
      />
    )}
  </ul>
)

TodoList.propTypes = {
  todos: PropTypes.arrayOf(PropTypes.shape({
    id: PropTypes.number.isRequired,
    completed: PropTypes.bool.isRequired,
    text: PropTypes.string.isRequired
  }).isRequired).isRequired,
  onTodoClick: PropTypes.func.isRequired
}

export default TodoList
Example #8
0
        
    },
    zoomer: {
        height: 50,
        width: 50,
        style: 'rgba(255,165,0,0.5)'
    },
    zoomedImage: {
        postion: 'right',
        width: '400px',
        height: '400px'
    }
}

const propTypes = {
    mainImage: PropTypes.shape({src: PropTypes.string.isRequired, id: PropTypes.string.isRequired, className: PropTypes.string,width:PropTypes.string,height:PropTypes.string}).isRequired,
    zoomer: PropTypes.shape({height: PropTypes.number, width: PropTypes.number, style: PropTypes.string}),
    zoomedImage: PropTypes.shape({id: PropTypes.string.isRequird, className: PropTypes.string, position: PropTypes.string,width:PropTypes.string,height:PropTypes.string})
}

class ImageZoomer extends React.Component {
    constructor(props) {
        super(props)
        this.state = {
            showZoomedCanvas: false
        }
        this.drawImage = this.drawImage.bind(this)
    }

    componentDidMount() {
        this.drawImage()
Example #9
0
export default {

  corners: PropTypes.oneOf([
    'bottom-left',
    'bottom-right',
    'top-left',
    'top-right',
  ]),

  horizontal: horizontal,

  vertical: vertical,

  origin: PropTypes.shape({
    horizontal: horizontal,
    vertical: vertical,
  }),

  cornersAndCenter: PropTypes.oneOf([
    'bottom-center',
    'bottom-left',
    'bottom-right',
    'top-center',
    'top-left',
    'top-right',
  ]),

  stringOrNumber: PropTypes.oneOfType([
    PropTypes.string,
    PropTypes.number,
  ]),
Example #10
0
    return (
      <div>
        <PageHeader title="import history" apiStatus={this.props.apiStatus} />
        <SearchCriteria filters={[{ name: ACCOUNT_FILTER }]} fetch={this.fetchHistory} />
        {this.renderBankTransactionTable()}
        <BankStatementDeleteModal bankStatement={this.props.bankStatementForDelete} />
      </div>
    );
  }
}

function mapStateToProps(state) {
  const bankStatementForDelete = state.bankStatementStore.get('bankStatementForDelete');

  return {
    loaded: state.bankStatementStore.get('loaded'),
    bankStatements: state.bankStatementStore.get('bankStatements').toJS(),
    apiStatus: state.apiStatusStore.toJS(),
    bankStatementForDelete: bankStatementForDelete ? bankStatementForDelete.toJS() : null,
  };
}

ImportHistoryPageComponent.propTypes = {
  loaded: PropTypes.bool.isRequired,
  bankStatements: PropTypes.arrayOf(PropTypes.shape({})).isRequired,
  apiStatus: PropTypes.shape({}),
  bankStatementForDelete: PropTypes.shape({}),
};

export default connect(mapStateToProps)(ImportHistoryPageComponent);
Example #11
0
	uploadFieldPath: `File-${props.path}-${++uploadInc}`,
	userSelectedFile: null,
});

module.exports = Field.create({
	propTypes: {
		autoCleanup: PropTypes.bool,
		collapse: PropTypes.bool,
		label: PropTypes.string,
		note: PropTypes.string,
		path: PropTypes.string.isRequired,
		value: PropTypes.shape({
			filename: PropTypes.string,
			// TODO: these are present but not used in the UI,
			//       should we start using them?
			// filetype: PropTypes.string,
			// originalname: PropTypes.string,
			// path: PropTypes.string,
			// size: PropTypes.number,
		}),
	},
	getInitialState () {
		return buildInitialState(this.props);
	},
	shouldCollapse () {
		return this.props.collapse && !this.hasExisting();
	},
	componentWillUpdate (nextProps) {
		// Show the new filename when it's finished uploading
		if (this.props.value.filename !== nextProps.value.filename) {
			this.setState(buildInitialState(nextProps));
Example #12
0
        }
        onChange(processValue(schema, newValue));
      }}>{
      enumOptions.map(({value, label}, i) => {
        return <option key={i} value={value}>{label}</option>;
      })
    }</select>
  );
}

SelectWidget.defaultProps = {
  autofocus: false,
};

if (process.env.NODE_ENV !== "production") {
  SelectWidget.propTypes = {
    schema: PropTypes.object.isRequired,
    id: PropTypes.string.isRequired,
    options: PropTypes.shape({
      enumOptions: PropTypes.array,
    }).isRequired,
    value: PropTypes.any,
    required: PropTypes.bool,
    multiple: PropTypes.bool,
    autofocus: PropTypes.bool,
    onChange: PropTypes.func,
  };
}

export default SelectWidget;
Example #13
0
var IntlMixin = require('../mixins/GrommetIntlMixin');

var CLASS_ROOT = "legend";

var Legend = React.createClass({

  mixins: [IntlMixin],

  propTypes: {
    activeIndex: React.PropTypes.number,
    onActive: React.PropTypes.func,
    series: React.PropTypes.arrayOf(React.PropTypes.shape({
      label: React.PropTypes.string,
      value: React.PropTypes.number,
      units: React.PropTypes.string,
      colorIndex: React.PropTypes.oneOfType([
        React.PropTypes.number, // 1-6
        React.PropTypes.string // status
      ]),
      onClick: React.PropTypes.func
    })).isRequired,
    total: React.PropTypes.bool,
    units: React.PropTypes.string,
    value: React.PropTypes.number
  },

  _onActive: function (index) {
    this.setState({activeIndex: index});
    if (this.props.onActive) {
      this.props.onActive(index);
    }
  },
Example #14
0
                      getSuggestionValue={getSuggestionValue}
                      renderSuggestion={renderSuggestion}
                      onSuggestionSelected={this.onSuggestionSelected}
                      inputProps={inputProps} 
                      theme={{
                        input: "react-autosuggest__input form-control input-lg",
                        container: 'react-autosuggest__container',
                        containerOpen:'react-autosuggest__container--open',
                        suggestionsContainer: 'react-autosuggest__suggestions-container',
                        suggestion: 'react-autosuggest__suggestion',
                        suggestionFocused: 'react-autosuggest__suggestion--focused',
                        sectionContainer: 'react-autosuggest__section-container',
                        sectionTitle: 'react-autosuggest__section-title',
                        sectionSuggestionsContainer: 'react-autosuggest__section-suggestions-container'

                      }}/>
                      
                  </div>
                  <p> welcome to educron</p>
                </div>
            </WrapContainer>
        )
    }
}

UniversitiesList.propTypes = {
  awaitStatuses: PropTypes.shape({
        allSuggestions: PropTypes.string
    })
}
import React from 'react';
import PureComponent from '../components/purecomponent.react';

import ProductTile from './product-tile.react';

export default
class ProductList extends PureComponent {
  render() {
    return (
      <div>
        {
          this.props.products
            .map((product) => {
              return <ProductTile key={product.get('productNumber')} product={product}/>;
            })
        }
      </div>
    );
  }
}

ProductList.propTypes = {
  products: React.PropTypes.shape({map: React.PropTypes.func.isRequired}).isRequired
};
  makeRequest(city) {
    openWeatherHelpers.getForecast(city)
      .then(data => {
        this.setState({
          isLoading: false,
          forecastData: data.body,
        });
      });
  }
  render() {
    return (
      <Forecast
        isLoading={this.state.isLoading}
        forecastData={this.state.forecastData}
        handleClick={this.handleClick} />
    );
  }
}

ForecastContainer.contextTypes = {
  router: PropTypes.object.isRequired,
};

ForecastContainer.propTypes = {
  routeParams: PropTypes.shape({
    city: PropTypes.string,
  }),
};

export default ForecastContainer;
Example #17
0
  responsive: true
};

Search.propTypes = {
  align: PropTypes.string,
  defaultValue: PropTypes.string,
  dropAlign: Drop.alignPropType,
  dropColorIndex: PropTypes.string,
  fill: PropTypes.bool,
  iconAlign: PropTypes.oneOf(['start', 'end']),
  id: PropTypes.string,
  initialFocus: PropTypes.bool,
  inline: PropTypes.bool,
  onDOMChange: PropTypes.func,
  onSelect: PropTypes.func,
  pad: PropTypes.oneOf(['small', 'medium']),
  placeHolder: PropTypes.string,
  responsive: PropTypes.bool,
  size: PropTypes.oneOf(['small', 'medium', 'large']),
  suggestions: PropTypes.arrayOf(
    PropTypes.oneOfType([
      PropTypes.shape({
        label: PropTypes.node,
        value: PropTypes.any
      }),
      PropTypes.string
    ])
  ),
  value: PropTypes.string
};
Example #18
0
			);
		}
	}]);

	return Lightbox;
})(_react.Component);

Lightbox.propTypes = {
	backdropClosesModal: _react.PropTypes.bool,
	currentImage: _react.PropTypes.number,
	customControls: _react.PropTypes.arrayOf(_react.PropTypes.node),
	enableKeyboardInput: _react.PropTypes.bool,
	imageCountSeparator: _react.PropTypes.string,
	images: _react.PropTypes.arrayOf(_react.PropTypes.shape({
		src: _react.PropTypes.string.isRequired,
		srcset: _react.PropTypes.array,
		caption: _react.PropTypes.oneOfType([_react.PropTypes.string, _react.PropTypes.element]),
		thumbnail: _react.PropTypes.string
	})).isRequired,
	isOpen: _react.PropTypes.bool,
	onClickImage: _react.PropTypes.func,
	onClickNext: _react.PropTypes.func,
	onClickPrev: _react.PropTypes.func,
	onClose: _react.PropTypes.func.isRequired,
	preloadNextImage: _react.PropTypes.bool,
	sheet: _react.PropTypes.object,
	showCloseButton: _react.PropTypes.bool,
	showImageCount: _react.PropTypes.bool,
	showThumbnails: _react.PropTypes.bool,
	theme: _react.PropTypes.object,
	thumbnailOffset: _react.PropTypes.number,
	width: _react.PropTypes.number
Example #19
0
 */

const React = require('react');

const KeyConfigs = require('../data/key-configs');
const CursorContexts = require('./input/cursor-contexts');
const {
    BorderDirections,
    EchoAnimationTypes,
    IconTypes,
    KeyTypes,
    KeypadTypes,
} = require('../consts');

const iconPropType = React.PropTypes.shape({
    type: React.PropTypes.oneOf(Object.keys(IconTypes)).isRequired,
    data: React.PropTypes.string.isRequired,
});

const keyIdPropType = React.PropTypes.oneOf(Object.keys(KeyConfigs));

const keyConfigPropType = React.PropTypes.shape({
    ariaLabel: React.PropTypes.string,
    id: keyIdPropType.isRequired,
    type: React.PropTypes.oneOf(Object.keys(KeyTypes)).isRequired,
    childKeyIds: React.PropTypes.arrayOf(keyIdPropType),
    icon: iconPropType.isRequired,
});

const keypadConfigurationPropType = React.PropTypes.shape({
    keypadType: React.PropTypes.oneOf(Object.keys(KeypadTypes)).isRequired,
    extraKeys: React.PropTypes.arrayOf(keyIdPropType),
Example #20
0
      </table>
    );
  }

  render() {
    return (
      <div>
        {this.renderTitle()}
        {this.renderTable()}
        <BudgetModal />
      </div>
    );
  }
}

BudgetTableComponent.propTypes = {
  loaded: PropTypes.bool.isRequired,
  budgets: PropTypes.arrayOf(PropTypes.shape({})).isRequired,
  account: PropTypes.shape({ id: PropTypes.number.isRequired }).isRequired,
};

function mapStateToProps(state) {
  return {
    loaded: state.budgetStore.get('loaded'),
    budgets: state.budgetStore.get('budgets').toJS(),
    account: state.accountStore.get('currentAccount').toJS(),
  };
}

export default connect(mapStateToProps)(BudgetTableComponent);
Example #21
0
var factory = function factory(Dialog, Calendar) {
  var CalendarDialog = function (_Component) {
    _inherits(CalendarDialog, _Component);

    function CalendarDialog() {
      var _Object$getPrototypeO;

      var _temp, _this, _ret;

      _classCallCheck(this, CalendarDialog);

      for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
        args[_key] = arguments[_key];
      }

      return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(CalendarDialog)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.state = {
        display: 'months',
        date: _this.props.value
      }, _this.handleCalendarChange = function (value, dayClick) {
        var state = { display: 'months', date: value };
        if (_time2.default.dateOutOfRange(value, _this.props.minDate, _this.props.maxDate)) {
          state.date = _this.props.maxDate || _this.props.minDate;
        }
        _this.setState(state);
        if (dayClick && _this.props.autoOk && _this.props.onSelect) {
          _this.props.onSelect(value);
        }
      }, _this.handleSelect = function (event) {
        if (_this.props.onSelect) _this.props.onSelect(_this.state.date, event);
      }, _this.handleSwitchDisplay = function (display) {
        _this.setState({ display: display });
      }, _this.updateStateDate = function (date) {
        if (Object.prototype.toString.call(date) === '[object Date]') {
          _this.setState({
            date: date
          });
        }
      }, _this.actions = [{ label: 'Cancel', className: _this.props.theme.button, onClick: _this.props.onDismiss }, { label: 'Ok', className: _this.props.theme.button, name: _this.props.name, onClick: _this.handleSelect }], _temp), _possibleConstructorReturn(_this, _ret);
    }

    _createClass(CalendarDialog, [{
      key: 'componentWillMount',
      value: function componentWillMount() {
        this.updateStateDate(this.props.value);
      }
    }, {
      key: 'componentWillReceiveProps',
      value: function componentWillReceiveProps(nextProps) {
        this.updateStateDate(nextProps.value);
      }
    }, {
      key: 'render',
      value: function render() {
        var theme = this.props.theme;

        var display = this.state.display + 'Display';
        var className = (0, _classnames2.default)(theme.dialog, this.props.className);
        var headerClassName = (0, _classnames2.default)(theme.header, theme[display]);

        return _react2.default.createElement(
          Dialog,
          {
            actions: this.actions,
            active: this.props.active,
            className: className,
            onEscKeyDown: this.props.onEscKeyDown,
            onOverlayClick: this.props.onOverlayClick,
            type: 'custom'
          },
          _react2.default.createElement(
            'header',
            { className: headerClassName },
            _react2.default.createElement(
              'span',
              { className: theme.year, onClick: this.handleSwitchDisplay.bind(this, 'years') },
              this.state.date.getFullYear()
            ),
            _react2.default.createElement(
              'h3',
              { className: theme.date, onClick: this.handleSwitchDisplay.bind(this, 'months') },
              _time2.default.getShortDayOfWeek(this.state.date.getDay(), this.props.locale),
              ', ',
              _time2.default.getShortMonth(this.state.date, this.props.locale),
              ' ',
              this.state.date.getDate()
            )
          ),
          _react2.default.createElement(
            'div',
            { className: theme.calendarWrapper },
            _react2.default.createElement(Calendar, {
              display: this.state.display,
              maxDate: this.props.maxDate,
              minDate: this.props.minDate,
              onChange: this.handleCalendarChange,
              selectedDate: this.state.date,
              theme: this.props.theme,
              locale: this.props.locale,
              sundayFirstDayOfWeek: this.props.sundayFirstDayOfWeek })
          )
        );
      }
    }]);

    return CalendarDialog;
  }(_react.Component);

  CalendarDialog.propTypes = {
    active: _react.PropTypes.bool,
    autoOk: _react.PropTypes.bool,
    className: _react.PropTypes.string,
    locale: _react2.default.PropTypes.oneOfType([_react2.default.PropTypes.string, _react2.default.PropTypes.object]),
    maxDate: _react.PropTypes.object,
    minDate: _react.PropTypes.object,
    name: _react.PropTypes.string,
    onDismiss: _react.PropTypes.func,
    onEscKeyDown: _react.PropTypes.func,
    onOverlayClick: _react.PropTypes.func,
    onSelect: _react.PropTypes.func,
    sundayFirstDayOfWeek: _react2.default.PropTypes.bool,
    theme: _react.PropTypes.shape({
      button: _react.PropTypes.string,
      calendarWrapper: _react.PropTypes.string,
      date: _react.PropTypes.string,
      dialog: _react.PropTypes.string,
      header: _react.PropTypes.string,
      monthsDisplay: _react.PropTypes.string,
      year: _react.PropTypes.string,
      yearsDisplay: _react.PropTypes.string
    }),
    value: _react.PropTypes.object
  };
  CalendarDialog.defaultProps = {
    active: false,
    className: '',
    value: new Date()
  };


  return CalendarDialog;
};
Example #22
0
  return (
    <div className={`tiles__flex-section-container tiles__flex-section-container--${ section }`}>
      <div className="tiles__section-item">
        <div className="tiles__flex-container">
          {tileElements}
        </div>
      </div>
    </div>
  );
}

if (process.env.NODE_ENV !== 'production') {
  Tiles.propTypes = {
    content: React.PropTypes.arrayOf(
      React.PropTypes.shape({
        id: React.PropTypes.number.isRequired,
        link: React.PropTypes.shape({
          href: React.PropTypes.string,
        }).isRequired,
        flytitle: React.PropTypes.string,
        rubric: React.PropTypes.string,
        slug: React.PropTypes.string,
        image: React.PropTypes.shape(
          Picture.propTypes,
        ),
      })
    ).isRequired,
    section: React.PropTypes.string.isRequired,
  };
}
Example #23
0
import React from 'react';

// Material UI
import Checkbox from 'material-ui/Checkbox';


// TODO: Rewrite as ES6 class
/* eslint-disable react/prefer-es6-class */
export default React.createClass({
    propTypes: {
        label: React.PropTypes.string.isRequired,
        onChange: React.PropTypes.func.isRequired,
        items: React.PropTypes.arrayOf(React.PropTypes.shape({
            name: React.PropTypes.string.isRequired,
            value: React.PropTypes.bool,
            text: React.PropTypes.string.isRequired,
        })),
        style: React.PropTypes.object,
    },

    contextTypes: {
        muiTheme: React.PropTypes.object,
    },

    getInitialState() {
        return {
            values: this.props.items.reduce((prev, curr) => {
                if (curr.value) {
                    prev.push(curr.name);
                }
                return prev;
Example #24
0
  /**
   * A Callback fired when the close button is clicked. If used directly inside
   * a Modal component, the onHide will automatically be propagated up to the
   * parent Modal `onHide`.
   */
  onHide: React.PropTypes.func
};

var defaultProps = {
  'aria-label': 'Close',
  closeButton: false
};

var contextTypes = {
  $bs_modal: React.PropTypes.shape({
    onHide: React.PropTypes.func
  })
};

var ModalHeader = function (_React$Component) {
  _inherits(ModalHeader, _React$Component);

  function ModalHeader() {
    _classCallCheck(this, ModalHeader);

    return _possibleConstructorReturn(this, _React$Component.apply(this, arguments));
  }

  ModalHeader.prototype.render = function render() {
    var _props = this.props;
    var label = _props['aria-label'];
Example #25
0
     */
    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,
Example #26
0
        if (this.props.latLng !== newProps.latLng) {
            this.state.marker.setPosition(newProps.latLng)
        }        
    }

  render() {
    return (
       <div></div>
    );
  }
}

PlaceMarker.propTypes = {
	latLng: React.PropTypes.shape({
		lat: React.PropTypes.number.isRequired,
		lng: React.PropTypes.number.isRequired,
    }),
	map: React.PropTypes.any.isRequired,
	options: React.PropTypes.shape({
		id: React.PropTypes.any.isRequired,
		text: React.PropTypes.string.isRequired,
		className: React.PropTypes.string.isRequired,
		animation: React.PropTypes.oneOf([null, ANIMATION_DROP, ANIMATION_SHOWITSELF]),
		onClick: React.PropTypes.func,
		draggable: React.PropTypes.bool,
		onDragEnd: React.PropTypes.func,
		width: React.PropTypes.number,
		height: React.PropTypes.number,
		markerEdgeOffsetLeft: React.PropTypes.number,
		markerEdgeOffsetTop: React.PropTypes.number
    })
Example #27
0
      } else if (typeof props[timeoutPropName] !== 'number') {
        return new Error(timeoutPropName + ' must be a number (in milliseconds)');
      }
    }
  };
}

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,
Example #28
0
                <ListItem key={chore.id}>
                    <Checkbox
      label={chore.name}
      checkedIcon={<ToggleStar />}
      uncheckedIcon={<ToggleStarBorder />}
      labelPosition="left"
       onClick={ () => onChoreClick( chore.id ) }
    /></ListItem>
        ) }
    </List>
);

ChoresList.propTypes = {
  chores: PropTypes.arrayOf( PropTypes.shape( {
    id: PropTypes.string.isRequired,
    completed: PropTypes.bool.isRequired,
    name: PropTypes.string.isRequired,
  } ).isRequired ).isRequired,
  onChoreClick: PropTypes.func.isRequired,
  onRemoveChoreClick: PropTypes.func.isRequired
};


const mapStateToProps = state => {
    return {
        chores: state.chores || []
    };
}

const mapDispatchToProps = dispatch => {
  return {
Example #29
0
      '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,

      /**
       * 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,
Example #30
0
  return ProgressBar;
}(_react.Component);

ProgressBar.propTypes = {
  buffer: _react.PropTypes.number,
  className: _react.PropTypes.string,
  max: _react.PropTypes.number,
  min: _react.PropTypes.number,
  mode: _react.PropTypes.oneOf(['determinate', 'indeterminate']),
  multicolor: _react.PropTypes.bool,
  theme: _react.PropTypes.shape({
    buffer: _react.PropTypes.string,
    circle: _react.PropTypes.string,
    circular: _react.PropTypes.string,
    indeterminate: _react.PropTypes.string,
    linear: _react.PropTypes.string,
    multicolor: _react.PropTypes.string,
    path: _react.PropTypes.string,
    value: _react.PropTypes.string
  }),
  type: _react.PropTypes.oneOf(['linear', 'circular']),
  value: _react.PropTypes.number
};
ProgressBar.defaultProps = {
  buffer: 0,
  className: '',
  max: 100,
  min: 0,
  mode: 'indeterminate',
  multicolor: false,
  type: 'linear',