v2.0.0 alpha

README.md

@@ -110,7 +110,8 @@ const store = createStoreWithFirebase(rootReducer, initialState)
 
 In components:
 ```javascript
-import React, { Component, PropTypes } from 'react'
+import React, { Component } from 'react'
+import PropTypes from 'prop-types'
 import { connect } from 'react-redux'
 import {
   firebaseConnect,

docs/api/helpers.md

@@ -9,7 +9,8 @@ Detect whether items are loaded yet or not
 **Examples**
 
 ```javascript
-import React, { Component, PropTypes } from 'react'
+import React, { Component } from 'react'
+import PropTypes from 'prop-types'
 import { connect } from 'react-redux'
 import { firebaseConnect, isLoaded, dataToJS } from 'react-redux-firebase'
 ```
@@ -28,7 +29,8 @@ Detect whether items are empty or not
 **Examples**
 
 ```javascript
-import React, { Component, PropTypes } from 'react'
+import React, { Component } from 'react'
+import PropTypes from 'prop-types'
 import { connect } from 'react-redux'
 import { firebaseConnect, isEmpty, dataToJS } from 'react-redux-firebase'
 ```

docs/recipes/auth.md

@@ -5,7 +5,8 @@
 Here is an example of a component that shows a Google login button if the user is not logged in, and a welcome message if they are. The initial loading state is handled with a simple "loading" message
 
 ```js
-import React, { Component, PropTypes } from 'react'
+import React, { Component } from 'react'
+import PropTypes from 'prop-types'
 import GoogleButton from 'react-google-button'
 import { connect } from 'react-redux'
 import {

examples/complete/material/package.json

@@ -62,6 +62,7 @@
     "lodash": "^4.17.2",
     "material-ui": "0.16.0",
     "normalize.css": "^4.1.1",
+    "prop-types": "^15.5.8",
     "react": "15.3.2",
     "react-dom": "15.3.2",
     "react-google-button": "^0.1.0",

examples/complete/material/src/components/LoadingSpinner/LoadingSpinner.js

@@ -1,4 +1,5 @@
-import React, { PropTypes } from 'react'
+import React from 'react'
+import PropTypes from 'prop-types'
 import CircularProgress from 'material-ui/CircularProgress'
 import classes from './LoadingSpinner.scss'
 

examples/complete/material/src/components/TextField/TextField.js

@@ -1,4 +1,5 @@
-import React, { PropTypes } from 'react'
+import React from 'react'
+import PropTypes from 'prop-types'
 import MaterialTextField from 'material-ui/TextField'
 
 export const TextField = ({ input, label, meta: { touched, error }, ...custom }) => (

examples/complete/material/src/containers/App/App.js

@@ -1,4 +1,5 @@
-import React, { Component, PropTypes } from 'react'
+import React, { Component } from 'react'
+import PropTypes from 'prop-types'
 import { browserHistory, Router } from 'react-router'
 import { Provider } from 'react-redux'
 

examples/complete/material/src/containers/Navbar/Navbar.js

@@ -1,4 +1,5 @@
-import React, { Component, PropTypes } from 'react'
+import React, { Component } from 'react'
+import PropTypes from 'prop-types'
 import classes from './Navbar.scss'
 import { Link } from 'react-router'
 import { connect } from 'react-redux'

examples/complete/material/src/routes/Account/components/AccountForm/AccountForm.js

@@ -1,4 +1,5 @@
-import React, { PropTypes } from 'react'
+import React from 'react'
+import PropTypes from 'prop-types'
 import { Field, reduxForm } from 'redux-form'
 import RaisedButton from 'material-ui/RaisedButton'
 import TextField from 'components/TextField'

examples/complete/material/src/routes/Account/components/ProviderDataForm/ProviderDataForm.js

@@ -1,4 +1,5 @@
-import React, { PropTypes } from 'react'
+import React from 'react'
+import PropTypes from 'prop-types'
 import { List, ListItem } from 'material-ui/List'
 import classes from './ProviderDataForm.scss'
 import AccountCircle from 'material-ui/svg-icons/action/account-circle'

examples/complete/material/src/routes/Account/containers/AccountContainer.js

@@ -1,4 +1,5 @@
-import React, { Component, PropTypes } from 'react'
+import React, { Component } from 'react'
+import PropTypes from 'prop-types'
 import Paper from 'material-ui/Paper'
 import { connect } from 'react-redux'
 import { firebaseConnect, pathToJS, isLoaded } from 'react-redux-firebase'

examples/complete/material/src/routes/Home/components/NewTodoPanel/NewTodoPanel.js

@@ -1,4 +1,5 @@
-import React, { Component, PropTypes } from 'react'
+import React, { Component } from 'react'
+import PropTypes from 'prop-types'
 import IconButton from 'material-ui/IconButton'
 import Paper from 'material-ui/Paper'
 import TextField from 'material-ui/TextField'

examples/complete/material/src/routes/Home/components/TodoItem/TodoItem.js

@@ -1,4 +1,5 @@
-import React, { Component, PropTypes } from 'react'
+import React, { Component } from 'react'
+import PropTypes from 'prop-types'
 import classes from './TodoItem.scss'
 import { ListItem } from 'material-ui/List'
 import Checkbox from 'material-ui/Checkbox'

examples/complete/material/src/routes/Home/containers/HomeContainer.js

@@ -1,4 +1,5 @@
-import React, { Component, PropTypes } from 'react'
+import React, { Component } from 'react'
+import PropTypes from 'prop-types'
 import { connect } from 'react-redux'
 import { map } from 'lodash'
 import Theme from 'theme'

examples/complete/material/src/routes/Login/components/LoginForm/LoginForm.js

@@ -1,4 +1,5 @@
-import React, { PropTypes } from 'react'
+import React from 'react'
+import PropTypes from 'prop-types'
 import { Link } from 'react-router'
 import { Field, reduxForm } from 'redux-form'
 import RaisedButton from 'material-ui/RaisedButton'

examples/complete/material/src/routes/Login/containers/LoginContainer.js

@@ -1,4 +1,5 @@
-import React, { Component, PropTypes } from 'react'
+import React, { Component } from 'react'
+import PropTypes from 'prop-types'
 import { Link } from 'react-router'
 import GoogleButton from 'react-google-button'
 import { connect } from 'react-redux'

examples/complete/material/src/routes/Projects/components/NewProjectDialog/NewProjectDialog.js

@@ -1,5 +1,5 @@
-import React, { Component, PropTypes } from 'react'
-import { Field, reduxForm } from 'redux-form'
+import React, { Component } from 'react'
+import PropTypes from 'prop-types'
 import Dialog from 'material-ui/Dialog'
 import FlatButton from 'material-ui/FlatButton'
 import TextField from 'components/TextField'

examples/complete/material/src/routes/Projects/components/NewProjectTile/NewProjectTile.js

@@ -1,4 +1,5 @@
-import React, { PropTypes } from 'react'
+import React from 'react'
+import PropTypes from 'prop-types'
 import Paper from 'material-ui/Paper'
 import ContentAddCircle from 'material-ui/svg-icons/content/add-circle'
 

examples/complete/material/src/routes/Projects/components/ProjectTile/ProjectTile.js

@@ -1,4 +1,5 @@
-import React, { PropTypes } from 'react'
+import React from 'react'
+import PropTypes from 'prop-types'
 import Paper from 'material-ui/Paper'
 import { isObject } from 'lodash'
 import IconButton from 'material-ui/IconButton'

examples/complete/material/src/routes/Projects/containers/ProjectsContainer.js

@@ -1,4 +1,5 @@
-import React, { Component, cloneElement, PropTypes } from 'react'
+import React, { Component, cloneElement } from 'react'
+import PropTypes from 'prop-types'
 import { map } from 'lodash'
 import { connect } from 'react-redux'
 import {

examples/complete/material/src/routes/Projects/routes/Project/components/Project/Project.js

@@ -1,4 +1,5 @@
-import React, { PropTypes } from 'react'
+import React from 'react'
+import PropTypes from 'prop-types'
 import classes from './Project.scss'
 
 export const Project = ({ projects, params: { projectname } }) => (

examples/complete/material/src/routes/Recover/components/RecoverForm/RecoverForm.js

@@ -1,4 +1,5 @@
-import React, { PropTypes } from 'react'
+import React from 'react'
+import PropTypes from 'prop-types'
 import { Field, reduxForm } from 'redux-form'
 import RaisedButton from 'material-ui/RaisedButton'
 import Subheader from 'material-ui/Subheader'

examples/complete/material/src/routes/Recover/containers/RecoverContainer.js

@@ -1,4 +1,5 @@
-import React, { Component, PropTypes } from 'react'
+import React, { Component } from 'react'
+import PropTypes from 'prop-types'
 import { firebaseConnect } from 'react-redux-firebase'
 import Snackbar from 'material-ui/Snackbar'
 import Paper from 'material-ui/Paper'

examples/complete/material/src/routes/Signup/components/SignupForm/SignupForm.js

@@ -1,4 +1,5 @@
-import React, { PropTypes } from 'react'
+import React from 'react'
+import PropTypes from 'prop-types'
 import RaisedButton from 'material-ui/RaisedButton'
 import { Field, reduxForm } from 'redux-form'
 import TextField from 'components/TextField'

examples/complete/material/src/routes/Signup/containers/SignupContainer.js

@@ -1,4 +1,5 @@
-import React, { Component, PropTypes } from 'react'
+import React, { Component } from 'react'
+import PropTypes from 'prop-types'
 import { Link } from 'react-router'
 import GoogleButton from 'react-google-button'
 import { connect } from 'react-redux'

examples/complete/simple/package.json

@@ -6,6 +6,7 @@
     "react-scripts": "0.4.1"
   },
   "dependencies": {
+    "prop-types": "^15.5.8",
     "react": "^15.3.1",
     "react-dom": "^15.3.1",
     "react-redux": "^4.4.5",

examples/complete/simple/src/Home.js

@@ -1,4 +1,5 @@
-import react, { Component, PropTypes } from 'react'
+import react, { Component } from 'react'
+import PropTypes from 'prop-types'
 import { connect } from 'react-redux'
 import {
   firebaseConnect,

examples/complete/simple/src/TodoItem.js

@@ -1,4 +1,5 @@
-import React, { Component, PropTypes } from 'react'
+import React, { Component } from 'react'
+import PropTypes from 'prop-types'
 import { firebase } from 'react-redux-firebase'
 
 import './Todo.css'

examples/snippets/decorators/App.js

@@ -1,4 +1,5 @@
-import React, { Component, PropTypes } from 'react'
+import React, { Component } from 'react'
+import PropTypes from 'prop-types'
 import { map } from 'lodash'
 import { connect } from 'react-redux'
 import {

examples/snippets/decorators/TodoItem.js

@@ -1,4 +1,5 @@
-import React, { Component, PropTypes } from 'react'
+import React, { Component } from 'react'
+import PropTypes from 'prop-types'
 import { firebaseConnect } from 'react-redux-firebase'
 
 import './Todo.css'

examples/snippets/multipleQueries/App.js

@@ -1,4 +1,5 @@
-import React, { Component, PropTypes } from 'react'
+import React, { Component } from 'react'
+import PropTypes from 'prop-types'
 import { map } from 'lodash'
 import { connect } from 'react-redux'
 import {

examples/snippets/multipleQueries/TodoItem.js

@@ -1,4 +1,5 @@
-import React, { Component, PropTypes } from 'react'
+import React, { Component } from 'react'
+import PropTypes from 'prop-types'
 import { firebaseConnect } from 'react-redux-firebase'
 
 import './Todo.css'

examples/snippets/populates/App.js

@@ -1,4 +1,5 @@
-import React, { Component, PropTypes } from 'react'
+import React, { Component } from 'react'
+import PropTypes from 'prop-types'
 import { map } from 'lodash'
 import { connect } from 'react-redux'
 import {

examples/snippets/stateBasedQuery/App.js

@@ -1,4 +1,5 @@
-import react, { Component, PropTypes } from 'react'
+import react, { Component } from 'react'
+import PropTypes from 'prop-types'
 import { connect } from 'react-redux'
 import {
   firebaseConnect,

package.json

@@ -55,7 +55,8 @@
     "hoist-non-react-statics": "^1.2.0",
     "immutable": "^3.8.1",
     "jwt-decode": "^2.2.0",
-    "lodash": "^4.17.4"
+    "lodash": "^4.17.4",
+    "prop-types": "^15.5.8"
   },
   "peerDependencies": {
     "react": "^0.14.6 || ^15.0.0"

src/compose.js

@@ -156,7 +156,8 @@ export default (fbConfig, otherConfig) => next =>
      * @param {Function} onComplete - Function to run on complete (`not required`)
      * @return {Promise} Containing reference snapshot
      * @example <caption>Basic</caption>
-     * import React, { Component, PropTypes } from 'react'
+     * import React, { Component } from 'react'
+     * import PropTypes from 'prop-types'
      * import { firebaseConnect } from 'react-redux-firebase'
      * const Example = ({ firebase: { set } }) => (
      *   <button onClick={() => set('some/path', { here: 'is a value' })}>
@@ -188,7 +189,8 @@ export default (fbConfig, otherConfig) => next =>
      * @param {Function} onComplete - Function to run on complete (`not required`)
      * @return {Promise} Containing reference snapshot
      * @example <caption>Basic</caption>
-     * import React, { Component, PropTypes } from 'react'
+     * import React, { Component } from 'react'
+     * import PropTypes from 'prop-types'
      * import { firebaseConnect } from 'react-redux-firebase'
      * const Example = ({ firebase: { push } }) => (
      *   <button onClick={() => push('some/path', true)}>
@@ -218,7 +220,8 @@ export default (fbConfig, otherConfig) => next =>
      * @param {Function} onComplete - Function to run on complete (`not required`)
      * @return {Promise} Containing reference snapshot
      * @example <caption>Basic</caption>
-     * import React, { Component, PropTypes } from 'react'
+     * import React, { Component } from 'react'
+     * import PropTypes from 'prop-types'
      * import { firebaseConnect } from 'react-redux-firebase'
      * const Example = ({ firebase: { update } }) => (
      *   <button onClick={() => update('some/path', { here: 'is a value' })}>
@@ -248,7 +251,8 @@ export default (fbConfig, otherConfig) => next =>
      * @param {Function} onComplete - Function to run on complete (`not required`)
      * @return {Promise} Containing reference snapshot
      * @example <caption>Basic</caption>
-     * import React, { Component, PropTypes } from 'react'
+     * import React, { Component } from 'react'
+     * import PropTypes from 'prop-types'
      * import { firebaseConnect } from 'react-redux-firebase'
      * const Example = ({ firebase: { remove } }) => (
      *   <button onClick={() => remove('some/path')}>
@@ -268,7 +272,8 @@ export default (fbConfig, otherConfig) => next =>
      * @param {Function} onComplete - Function to run on complete (`not required`)
      * @return {Promise} Containing reference snapshot
      * @example <caption>Basic</caption>
-     * import React, { Component, PropTypes } from 'react'
+     * import React, { Component } from 'react'
+     * import PropTypes from 'prop-types'
      * import { firebaseConnect } from 'react-redux-firebase'
      * const Example = ({ firebase: { uniqueSet } }) => (
      *   <button onClick={() => uniqueSet('some/unique/path', true)}>

src/connect.js

@@ -1,4 +1,5 @@
-import React, { Component, PropTypes } from 'react'
+import React, { Component } from 'react'
+import PropTypes from 'prop-types'
 import { isEqual } from 'lodash'
 import hoistStatics from 'hoist-non-react-statics'
 import { watchEvents, unWatchEvents } from './actions/query'

src/helpers.js

@@ -17,7 +17,8 @@ import { metaParams, paramSplitChar } from './constants'
  * @param {Object} item - Item to check loaded status of. A comma seperated list is also acceptable.
  * @return {Boolean} Whether or not item is loaded
  * @example
- * import React, { Component, PropTypes } from 'react'
+ * import React, { Component } from 'react'
+ * import PropTypes from 'prop-types'
  * import { connect } from 'react-redux'
  * import { firebaseConnect, isLoaded, dataToJS } from 'react-redux-firebase'
  *
@@ -57,7 +58,8 @@ export const isLoaded = function () {
  * @param {Object} item - Item to check loaded status of. A comma seperated list is also acceptable.
  * @return {Boolean} Whether or not item is empty
  * @example
- * import React, { Component, PropTypes } from 'react'
+ * import React, { Component } from 'react'
+ * import PropTypes from 'prop-types'
  * import { connect } from 'react-redux'
  * import { firebaseConnect, isEmpty, dataToJS } from 'react-redux-firebase'
  *

tests/unit/connect.spec.js

@@ -1,4 +1,5 @@
-import React, { createClass, Children, Component, PropTypes } from 'react'
+import React, { createClass, Children, Component } from 'react'
+import PropTypes from 'prop-types'
 import ReactDOM from 'react-dom'
 import connect from '../../src/connect'
 import reactReduxFirebase from '../../src/compose'