Merge branch 'master' into next

Author: taion

.eslintrc

@@ -1,11 +1,10 @@
 {
-  "extends": "rackt",
+  "extends": ["rackt", "plugin:react/recommended"],
   "globals": {
     "__DEV__": true
   },
   "rules": {
-    "react/jsx-uses-react": 1,
-    "react/jsx-no-undef": 2,
+    "react/display-name": 0,
     "react/wrap-multilines": 2
   },
   "plugins": [

CHANGES.md

@@ -14,6 +14,39 @@
 [#3446]: https://github.com/reactjs/react-router/pull/3446
 
 
+## [v2.5.2]
+> Jul 1, 2016
+
+- **Bugfix:** Remove extraneous `propTypes` check when creating a route object from a React element ([#3591])
+
+[v2.5.2]: https://github.com/reactjs/react-router/compare/v2.5.1...v2.5.2
+[#3591]: https://github.com/reactjs/react-router/pull/3591
+
+
+## [v2.5.1]
+> Jun 23, 2016
+
+- **Bugfix:** Throw error instead of silently failing with history v3 ([#3571])
+- **Bugfix:** Explicitly throw error in `onClick` handler of `<Link>` rendered outside of router context ([#3572])
+
+[v2.5.1]: https://github.com/reactjs/react-router/compare/v2.5.0...v2.5.1
+[#3571]: https://github.com/reactjs/react-router/pull/3571
+[#3572]: https://github.com/reactjs/react-router/pull/3572
+
+
+## [v2.5.0]
+> Jun 22, 2016
+
+- **Feature/Deprecation:** Call `getChildRoutes` and `getIndexRoute` with `partialNextState`; deprecate accessing `location` directly in favor of `partialNextState.location` there ([#3556], [#3561], [#3569], [Upgrade Guide](/upgrade-guides/v2.5.0.md#getchildroutes-getindexroute-signature))
+- **Refactor:** Refactor creating `routeParams` objects ([#3544])
+
+[v2.5.0]: https://github.com/reactjs/react-router/compare/v2.4.1...v2.5.0
+[#3544]: https://github.com/reactjs/react-router/pull/3544
+[#3556]: https://github.com/reactjs/react-router/pull/3556
+[#3561]: https://github.com/reactjs/react-router/pull/3561
+[#3569]: https://github.com/reactjs/react-router/pull/3569
+
+
 ## [v2.4.1]
 > May 19, 2016
 

LICENSE.md

@@ -1,6 +1,6 @@
 The MIT License (MIT)
 
-Copyright (c) 2015 Ryan Florence, Michael Jackson
+Copyright (c) 2015-present, Ryan Florence, Michael Jackson
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

README.md

@@ -120,7 +120,7 @@ render((
       <Route path="*" component={NoMatch}/>
     </Route>
   </Router>
-), document.body)
+), document.getElementById('root'))
 ```
 
 See more in the [Introduction](/docs/Introduction.md), [Guides](/docs/guides/README.md), and [Examples](/examples).

docs/API.md

@@ -70,15 +70,8 @@ function createElement(Component, props) {
 }
 ```
 
-##### `stringifyQuery(queryObject)`
-A function used to convert an object from [`<Link>`](#link)s or calls to
-[`transitionTo`](#transitiontopathname-query-state) to a URL query string.
-
-##### `parseQueryString(queryString)`
-A function used to convert a query string into an object that gets passed to route component props.
-
 ##### `onError(error)`
-While the router is matching, errors may bubble up, here is your opportunity to catch and deal with them. Typically these will come from async features like [`route.getComponents`](#getcomponentsnextstate-callback), [`route.getIndexRoute`](#getindexroutelocation-callback), and [`route.getChildRoutes`](#getchildrouteslocation-callback).
+While the router is matching, errors may bubble up, here is your opportunity to catch and deal with them. Typically these will come from async features like [`route.getComponents`](#getcomponentsnextstate-callback), [`route.getIndexRoute`](#getindexroutepartialnextstate-callback), and [`route.getChildRoutes`](#getchildroutespartialnextstate-callback).
 
 ##### `onUpdate()`
 Called whenever the router updates its state in response to URL changes.
@@ -88,6 +81,10 @@ This is primarily for integrating with other libraries that need to participate
 
 Ensure that you render a `<RouterContext>` at the end of the line, passing all the props passed to `render`.
 
+##### `stringifyQuery(queryObject)` (deprecated)
+
+##### `parseQueryString(queryString)` (deprecated)
+
 
 #### Examples
 Please see the [`examples/`](/examples) directory of the repository for extensive examples of using `<Router>`.
@@ -101,7 +98,7 @@ A `<Link>` can know when the route it links to is active and automatically apply
 
 #### Props
 ##### `to`
-A [location descriptor](https://github.com/mjackson/history/blob/master/docs/Glossary.md#locationdescriptor). Usually this is a string or an object, with the following semantics:
+A [location descriptor](https://github.com/ReactJSTraining/history/blob/master/docs/Glossary.md#locationdescriptor). Usually this is a string or an object, with the following semantics:
 
 * If it's a string it represents the absolute path to link to, e.g. `/users/123` (relative paths are not supported).
 * If it's an object it can have four keys:
@@ -110,7 +107,7 @@ A [location descriptor](https://github.com/mjackson/history/blob/master/docs/Glo
   * `hash`: A hash to put in the URL, e.g. `#a-hash`.
   * `state`: State to persist to the `location`.
 
-_Note: React Router currently does not manage scroll position, and will not scroll to the element corresponding to the hash.
+_Note: React Router currently does not manage scroll position, and will not scroll to the element corresponding to `hash`._
 
 ##### `activeClassName`
 The className a `<Link>` receives when its route is active. No active class by default.
@@ -127,6 +124,12 @@ If `true`, the `<Link>` will only be active when the current route exactly match
 ##### *others*
 You can also pass props you'd like to be on the `<a>` such as a `title`, `id`, `className`, etc.
 
+##### `query` **([deprecated](/upgrade-guides/v2.0.0.md#link-to-onenter-and-isactive-use-location-descriptors) see `to`)**
+
+##### `hash` **([deprecated](/upgrade-guides/v2.0.0.md#link-to-onenter-and-isactive-use-location-descriptors) see `to`)**
+
+##### `state` **([deprecated](/upgrade-guides/v2.0.0.md#link-to-onenter-and-isactive-use-location-descriptors) see `to`)**
+
 #### Example
 Given a route like `<Route path="/users/:userId" />`:
 
@@ -185,6 +188,18 @@ Go back one entry in the history.
 ##### `goForward()`
 Go forward one entry in the history.
 
+##### `setRouteLeaveHook(route, hook)`
+Registers the given hook function to run before leaving the given route.
+
+During a normal transition, the hook function receives the next location as its only argument and can return either a prompt message (string) to show the user, to make sure they want to leave the page; or `false`, to prevent the transition. Any other return value will have no effect.
+
+During the beforeunload event (in browsers) the hook receives no arguments.
+In this case it must return a prompt message to prevent the transition.
+
+Returns a function that may be used to unbind the listener.
+
+You don't need to manually tear down the route leave hook in most cases. We automatically remove all attached route leave hooks after leaving the associated route.
+
 ##### `createPath(pathOrLoc, query)`
 Stringifies the query into the pathname, using the router's config.
 
@@ -289,8 +304,7 @@ class Users extends React.Component {
 ```
 
 ##### `getComponent(nextState, callback)`
-Same as `component` but asynchronous, useful for
-code-splitting.
+Same as `component` but asynchronous, useful for code-splitting.
 
 ###### `callback` signature
 `cb(err, component)`
@@ -340,8 +354,8 @@ A plain JavaScript object route definition. `<Router>` turns JSX `<Route>`s into
 ##### `childRoutes`
 An array of child routes, same as `children` in JSX route configs.
 
-##### `getChildRoutes(location, callback)`
-Same as `childRoutes` but asynchronous and receives the `location`. Useful for code-splitting and dynamic route matching (given some state or session data to return a different set of child routes).
+##### `getChildRoutes(partialNextState, callback)`
+Same as `childRoutes` but asynchronous and receives `partialNextState`. Useful for code-splitting and dynamic route matching (given some state or session data to return a different set of child routes).
 
 ###### `callback` signature
 `cb(err, routesArray)`
@@ -371,8 +385,8 @@ let myRoute = {
 
 let myRoute = {
   path: 'picture/:id',
-  getChildRoutes(location, cb) {
-    let { state } = location
+  getChildRoutes(partialNextState, cb) {
+    let { state } = partialNextState
 
     if (state && state.fromDashboard) {
       cb(null, [dashboardPictureRoute])
@@ -386,9 +400,9 @@ let myRoute = {
 ##### `indexRoute`
 The [index route](/docs/guides/IndexRoutes.md). This is the same as specifying an `<IndexRoute>` child when using JSX route configs.
 
-##### `getIndexRoute(location, callback)`
+##### `getIndexRoute(partialNextState, callback)`
 
-Same as `indexRoute`, but asynchronous and receives the `location`. As with `getChildRoutes`, this can be useful for code-splitting and dynamic route matching.
+Same as `indexRoute`, but asynchronous and receives `partialNextState`. As with `getChildRoutes`, this can be useful for code-splitting and dynamic route matching.
 
 ###### `callback` signature
 `cb(err, route)`
@@ -407,7 +421,7 @@ let myRoute = {
 // async index route
 let myRoute = {
   path: 'courses',
-  getIndexRoute(location, cb) {
+  getIndexRoute(partialNextState, cb) {
     // do something async here
     cb(null, myIndexRoute)
   }
@@ -587,9 +601,9 @@ For more details, please see the [histories guide](/docs/guides/Histories.md).
 `useRouterHistory` is a `history` enhancer that configures a given `createHistory` factory to work with React Router. This allows using custom histories in addition to the bundled singleton histories.
 
 It also pre-enhances the history with the
-[useQueries](https://github.com/mjackson/history/blob/master/docs/QuerySupport.md)
+[useQueries](https://github.com/ReactJSTraining/history/blob/master/docs/QuerySupport.md)
 and
-[useBasename](https://github.com/mjackson/history/blob/master/docs/BasenameSupport.md)
+[useBasename](https://github.com/ReactJSTraining/history/blob/master/docs/BasenameSupport.md)
 enhancers from `history`
 
 #### Example

docs/Glossary.md

@@ -244,7 +244,7 @@ type Router = {
   go(n: number) => void;
   goBack() => void;
   goForward() => void;
-  setRouteLeaveHook(hook: RouteHook) => Function;
+  setRouteLeaveHook(route: Route, hook: RouteHook) => Function;
   isActive(location: LocationDescriptor, indexOnly: boolean) => void;
 };
 ```

docs/guides/DynamicRouting.md

@@ -10,15 +10,15 @@ A router is the perfect place to handle code splitting: it's responsible for set
 
 React Router does all of its [path matching](/docs/guides/RouteMatching.md) and component fetching asynchronously, which allows you to not only load up the components lazily, *but also lazily load the route configuration*. You really only need one route definition in your initial bundle, the router can resolve the rest on demand.
 
-Routes may define [`getChildRoutes`](/docs/API.md#getchildrouteslocation-callback), [`getIndexRoute`](/docs/API.md#getindexroutelocation-callback), and [`getComponents`](/docs/API.md#getcomponentsnextstate-callback) methods. These are asynchronous and only called when needed. We call it "gradual matching". React Router will gradually match the URL and fetch only the amount of route configuration and components it needs to match the URL and render.
+Routes may define [`getChildRoutes`](/docs/API.md#getchildroutespartialnextstate-callback), [`getIndexRoute`](/docs/API.md#getindexroutepartialnextstate-callback), and [`getComponents`](/docs/API.md#getcomponentsnextstate-callback) methods. These are asynchronous and only called when needed. We call it "gradual matching". React Router will gradually match the URL and fetch only the amount of route configuration and components it needs to match the URL and render.
 
 Coupled with a smart code splitting tool like [webpack](http://webpack.github.io/), a once tiresome architecture is now simple and declarative.
 
 ```js
 const CourseRoute = {
   path: 'course/:courseId',
 
-  getChildRoutes(location, callback) {
+  getChildRoutes(partialNextState, callback) {
     require.ensure([], function (require) {
       callback(null, [
         require('./routes/Announcements'),
@@ -28,7 +28,7 @@ const CourseRoute = {
     })
   },
 
-  getIndexRoute(location, callback) {
+  getIndexRoute(partialNextState, callback) {
     require.ensure([], function (require) {
       callback(null, {
         component: require('./components/Index'),

docs/guides/Histories.md

@@ -139,11 +139,11 @@ render(
 
 If you'd like to further customize the history options or use other
 enhancers from
-[history](https://github.com/mjackson/history/) you can use
+[history](https://github.com/ReactJSTraining/history/) you can use
 `useRouterHistory`.
 
 Be aware that `useRouterHistory` already pre-enhances your history
-factory with the [useQueries](https://github.com/mjackson/history/blob/master/docs/QuerySupport.md) and [useBasename](https://github.com/mjackson/history/blob/master/docs/BasenameSupport.md) enhancers from `history`.
+factory with the [useQueries](https://github.com/ReactJSTraining/history/blob/master/docs/QuerySupport.md) and [useBasename](https://github.com/ReactJSTraining/history/blob/master/docs/BasenameSupport.md) enhancers from `history`.
 
 ### Examples:
 

examples/.eslintrc

@@ -0,0 +1,5 @@
+{
+  "rules": {
+    "react/prop-types": 0
+  }
+}

examples/active-links/app.js

@@ -1,84 +1,60 @@
-import React, { Component } from 'react'
+import React from 'react'
 import { render } from 'react-dom'
 import { Router, Route, IndexRoute, Link, IndexLink, browserHistory } from 'react-router'
 
 const ACTIVE = { color: 'red' }
 
-class App extends Component {
-  render() {
-    return (
-      <div>
-        <h1>APP!</h1>
-        <ul>
-          <li><Link      to="/"           activeStyle={ACTIVE}>/</Link></li>
-          <li><IndexLink to="/"           activeStyle={ACTIVE}>/ IndexLink</IndexLink></li>
+const App = ({ children }) => (
+  <div>
+    <h1>APP!</h1>
+    <ul>
+      <li><Link      to="/"           activeStyle={ACTIVE}>/</Link></li>
+      <li><IndexLink to="/"           activeStyle={ACTIVE}>/ IndexLink</IndexLink></li>
 
-          <li><Link      to="/users"      activeStyle={ACTIVE}>/users</Link></li>
-          <li><IndexLink to="/users"      activeStyle={ACTIVE}>/users IndexLink</IndexLink></li>
+      <li><Link      to="/users"      activeStyle={ACTIVE}>/users</Link></li>
+      <li><IndexLink to="/users"      activeStyle={ACTIVE}>/users IndexLink</IndexLink></li>
 
-          <li><Link      to="/users/ryan" activeStyle={ACTIVE}>/users/ryan</Link></li>
-          <li><Link      to={{ pathname: '/users/ryan', query: { foo: 'bar' } }}
-                                          activeStyle={ACTIVE}>/users/ryan?foo=bar</Link></li>
+      <li><Link      to="/users/ryan" activeStyle={ACTIVE}>/users/ryan</Link></li>
+      <li><Link      to={{ pathname: '/users/ryan', query: { foo: 'bar' } }}
+                                      activeStyle={ACTIVE}>/users/ryan?foo=bar</Link></li>
 
-          <li><Link      to="/about"      activeStyle={ACTIVE}>/about</Link></li>
-        </ul>
+      <li><Link      to="/about"      activeStyle={ACTIVE}>/about</Link></li>
+    </ul>
 
-        {this.props.children}
-      </div>
-    )
-  }
-}
+    {children}
+  </div>
+)
 
-class Index extends React.Component {
-  render() {
-    return (
-      <div>
-        <h2>Index!</h2>
-      </div>
-    )
-  }
-}
+const Index = () => (
+  <div>
+    <h2>Index!</h2>
+  </div>
+)
 
-class Users extends React.Component {
-  render() {
-    return (
-      <div>
-        <h2>Users</h2>
-        {this.props.children}
-      </div>
-    )
-  }
-}
+const Users = ({ children }) => (
+  <div>
+    <h2>Users</h2>
+    {children}
+  </div>
+)
 
-class UsersIndex extends React.Component {
-  render() {
-    return (
-      <div>
-        <h3>UsersIndex</h3>
-      </div>
-    )
-  }
-}
+const UsersIndex = () => (
+  <div>
+    <h3>UsersIndex</h3>
+  </div>
+)
 
-class User extends React.Component {
-  render() {
-    return (
-      <div>
-        <h3>User {this.props.params.id}</h3>
-      </div>
-    )
-  }
-}
+const User = ({ params: { id } }) => (
+  <div>
+    <h3>User {id}</h3>
+  </div>
+)
 
-class About extends React.Component {
-  render() {
-    return (
-      <div>
-        <h2>About</h2>
-      </div>
-    )
-  }
-}
+const About = () => (
+  <div>
+    <h2>About</h2>
+  </div>
+)
 
 render((
   <Router history={browserHistory}>