Fix Switcher bug that required more than one Switch

- Now a Switcher can have just one Switch in it

dist/switcheroo.min.js

@@ -1 +1,305 @@
-!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("react")):"function"==typeof define&&define.amd?define(["react"],t):"object"==typeof exports?exports.switcheroo=t(require("react")):e.switcheroo=t(e.React)}(this,function(e){return function(e){function t(o){if(n[o])return n[o].exports;var r=n[o]={exports:{},id:o,loaded:!1};return e[o].call(r.exports,r,r.exports,t),r.loaded=!0,r.exports}var n={};return t.m=e,t.c=n,t.p="",t(0)}([function(e,t,n){"use strict";t.Switcher=n(4),t.Switch=n(3)},function(t,n,o){t.exports=e},function(e,t,n){"use strict";var o=function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")},r=function(){function e(e,t){for(var n=0;n<t.length;n++){var o=t[n];o.enumerable=o.enumerable||!1,o.configurable=!0,o.value&&(o.writable=!0),Object.defineProperty(e,o.key,o)}}return function(t,n,o){return n&&e(t.prototype,n),o&&e(t,o),t}}(),i=function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(e.__proto__=t)},a=n(1),u=function(e){function t(){o(this,t),null!=e&&e.apply(this,arguments)}return i(t,e),r(t,[{key:"render",value:function(){return!1}}]),t}(a.Component);e.exports=u},function(e,t,n){"use strict";var o=function(e){return e&&e.__esModule?e["default"]:e},r=function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")},i=function(){function e(e,t){for(var n=0;n<t.length;n++){var o=t[n];o.enumerable=o.enumerable||!1,o.configurable=!0,o.value&&(o.writable=!0),Object.defineProperty(e,o.key,o)}}return function(t,n,o){return n&&e(t.prototype,n),o&&e(t,o),t}}(),a=function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(e.__proto__=t)},u=n(1),s=o(u),p=function(e){function t(){r(this,t),null!=e&&e.apply(this,arguments)}return a(t,e),i(t,[{key:"componentDidMount",value:function(){"function"==typeof this.props.onShow&&this.props.onShow()}},{key:"componentWillUnmount",value:function(){"function"==typeof this.props.onHide&&this.props.onHide()}},{key:"render",value:function(){return s.createElement(this.props.handler,this.props.handlerProps)}}]),t}(u.Component);e.exports=p,p.displayName="Switch",p.propTypes={path:s.PropTypes.string.isRequired,handler:s.PropTypes.func.isRequired,handlerProps:s.PropTypes.object,onShow:s.PropTypes.func,onHide:s.PropTypes.func}},function(e,t,n){"use strict";var o=function(e){return e&&e.__esModule?e["default"]:e},r=function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")},i=function(){function e(e,t){for(var n=0;n<t.length;n++){var o=t[n];o.enumerable=o.enumerable||!1,o.configurable=!0,o.value&&(o.writable=!0),Object.defineProperty(e,o.key,o)}}return function(t,n,o){return n&&e(t.prototype,n),o&&e(t,o),t}}(),a=function f(e,t,n){var o=Object.getOwnPropertyDescriptor(e,t);if(void 0===o){var r=Object.getPrototypeOf(e);return null===r?void 0:f(r,t,n)}if("value"in o)return o.value;var i=o.get;return void 0===i?void 0:i.call(n)},u=function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(e.__proto__=t)},s=n(1),p=o(s),c=n(2),l=o(c),h=function(e){function t(e){r(this,t),a(Object.getPrototypeOf(t.prototype),"constructor",this).call(this,e),this.getLocation=this.getLocation.bind(this),this.getHashLocation=this.getHashLocation.bind(this),this.getHistoryLocation=this.getHistoryLocation.bind(this),this.handleRouteChange=this.handleRouteChange.bind(this),this.getSwitch=this.getSwitch.bind(this),this.defaultComponent=p.createElement(this.props.defaultHandler||l,this.props.defaultHandlerProps),this.state={visibleComponent:null}}return u(t,e),i(t,[{key:"componentDidMount",value:function(){window.addEventListener("load",this.handleRouteChange),this.props.pushState?window.addEventListener("popstate",this.handleRouteChange):window.addEventListener("hashchange",this.handleRouteChange)}},{key:"componentWillUnmount",value:function(){window.removeEventListener("load",this.handleRouteChange),this.props.pushState?window.removeEventListener("popstate",this.handleRouteChange):window.removeEventListener("hashchange",this.handleRouteChange)}},{key:"getLocation",value:function(){var e=this.props.pushState?this.getHistoryLocation():this.getHashLocation();return"/"!==e.charAt(0)?"/"+e:e}},{key:"getHashLocation",value:function(){return decodeURI(window.location.href.split("#")[1]||"")}},{key:"getHistoryLocation",value:function(){return decodeURI(window.location.pathname+window.location.search)}},{key:"getSwitch",value:function(e){return this.props.children.filter(function(t){return t.props.path===e})[0]}},{key:"handleRouteChange",value:function(e){var t=this.getLocation(),n=this.getSwitch(t);this.setState({visibleComponent:n}),"function"==typeof this.props.onChange&&this.props.onChange(!!n,t)}},{key:"render",value:function(){return this.state.visibleComponent||this.defaultComponent}}]),t}(s.Component);e.exports=h,h.displayName="Switcher",h.propTypes={children:p.PropTypes.arrayOf(p.PropTypes.element).isRequired,pushState:p.PropTypes.bool,defaultHandler:p.PropTypes.func,defaultHandlerProps:p.PropTypes.object,onChange:p.PropTypes.func},h.defaultProps={pushState:!1}}])});
+(function webpackUniversalModuleDefinition(root, factory) {
+	if(typeof exports === 'object' && typeof module === 'object')
+		module.exports = factory(require("react"));
+	else if(typeof define === 'function' && define.amd)
+		define(["react"], factory);
+	else if(typeof exports === 'object')
+		exports["switcheroo"] = factory(require("react"));
+	else
+		root["switcheroo"] = factory(root["React"]);
+})(this, function(__WEBPACK_EXTERNAL_MODULE_3__) {
+return /******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId])
+/******/ 			return installedModules[moduleId].exports;
+
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			exports: {},
+/******/ 			id: moduleId,
+/******/ 			loaded: false
+/******/ 		};
+
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+
+/******/ 		// Flag the module as loaded
+/******/ 		module.loaded = true;
+
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+
+
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "";
+
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(0);
+/******/ })
+/************************************************************************/
+/******/ ([
+/* 0 */
+/***/ function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	exports.Switcher = __webpack_require__(1);
+	exports.Switch = __webpack_require__(2);
+
+/***/ },
+/* 1 */
+/***/ function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	var _interopRequire = function (obj) { return obj && obj.__esModule ? obj['default'] : obj; };
+
+	var _classCallCheck = function (instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError('Cannot call a class as a function'); } };
+
+	var _createClass = (function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (descriptor.value) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; })();
+
+	var _get = function get(object, property, receiver) { var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { return get(parent, property, receiver); } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } };
+
+	var _inherits = function (subClass, superClass) { if (typeof superClass !== 'function' && superClass !== null) { throw new TypeError('Super expression must either be null or a function, not ' + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) subClass.__proto__ = superClass; };
+
+	var _React$Component = __webpack_require__(3);
+
+	var React = _interopRequire(_React$Component);
+
+	var _NullComponent = __webpack_require__(4);
+
+	var NullComponent = _interopRequire(_NullComponent);
+
+	var Switcher = (function (_Component) {
+	  function Switcher(props) {
+	    _classCallCheck(this, Switcher);
+
+	    _get(Object.getPrototypeOf(Switcher.prototype), 'constructor', this).call(this, props);
+	    // bind methods
+	    this.getLocation = this.getLocation.bind(this);
+	    this.getHashLocation = this.getHashLocation.bind(this);
+	    this.getHistoryLocation = this.getHistoryLocation.bind(this);
+	    this.handleRouteChange = this.handleRouteChange.bind(this);
+	    this.getSwitch = this.getSwitch.bind(this);
+
+	    this.defaultComponent = React.createElement(this.props.defaultHandler || NullComponent, this.props.defaultHandlerProps);
+	    // set initial state
+	    this.state = {
+	      visibleComponent: null
+	    };
+	  }
+
+	  _inherits(Switcher, _Component);
+
+	  _createClass(Switcher, [{
+	    key: 'componentDidMount',
+	    value: function componentDidMount() {
+	      window.addEventListener('load', this.handleRouteChange);
+	      if (this.props.pushState) {
+	        window.addEventListener('popstate', this.handleRouteChange);
+	      } else {
+	        window.addEventListener('hashchange', this.handleRouteChange);
+	      }
+	    }
+	  }, {
+	    key: 'componentWillUnmount',
+	    value: function componentWillUnmount() {
+	      window.removeEventListener('load', this.handleRouteChange);
+	      if (this.props.pushState) {
+	        window.removeEventListener('popstate', this.handleRouteChange);
+	      } else {
+	        window.removeEventListener('hashchange', this.handleRouteChange);
+	      }
+	    }
+	  }, {
+	    key: 'getLocation',
+	    value: function getLocation() {
+	      var location = this.props.pushState ? this.getHistoryLocation() : this.getHashLocation();
+	      if (location.charAt(0) !== '/') {
+	        return '/' + location;
+	      } else {
+	        return location;
+	      }
+	    }
+	  }, {
+	    key: 'getHashLocation',
+	    value: function getHashLocation() {
+	      return decodeURI(window.location.href.split('#')[1] || '');
+	    }
+	  }, {
+	    key: 'getHistoryLocation',
+	    value: function getHistoryLocation() {
+	      return decodeURI(window.location.pathname + window.location.search);
+	    }
+	  }, {
+	    key: 'getSwitch',
+	    value: function getSwitch(path) {
+	      var children = [].concat(this.props.children);
+	      return children.filter(function (child) {
+	        return child.props.path === path;
+	      })[0];
+	    }
+	  }, {
+	    key: 'handleRouteChange',
+	    value: function handleRouteChange(e) {
+	      var newRoute = this.getLocation(),
+	          switchElement = this.getSwitch(newRoute);
+	      this.setState({
+	        visibleComponent: switchElement
+	      });
+
+	      if (typeof this.props.onChange === 'function') {
+	        this.props.onChange(!!switchElement, newRoute);
+	      }
+	    }
+	  }, {
+	    key: 'render',
+	    value: function render() {
+	      return this.state.visibleComponent || this.defaultComponent;
+	    }
+	  }]);
+
+	  return Switcher;
+	})(_React$Component.Component);
+
+	module.exports = Switcher;
+
+	Switcher.displayName = 'Switcher';
+
+	Switcher.propTypes = {
+	  children: React.PropTypes.oneOfType([React.PropTypes.arrayOf(React.PropTypes.element), React.PropTypes.element]).isRequired,
+	  pushState: React.PropTypes.bool,
+	  defaultHandler: React.PropTypes.func,
+	  defaultHandlerProps: React.PropTypes.object,
+	  onChange: React.PropTypes.func
+	};
+
+	Switcher.defaultProps = {
+	  pushState: false
+	};
+
+/***/ },
+/* 2 */
+/***/ function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	var _interopRequire = function (obj) { return obj && obj.__esModule ? obj['default'] : obj; };
+
+	var _classCallCheck = function (instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError('Cannot call a class as a function'); } };
+
+	var _createClass = (function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (descriptor.value) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; })();
+
+	var _inherits = function (subClass, superClass) { if (typeof superClass !== 'function' && superClass !== null) { throw new TypeError('Super expression must either be null or a function, not ' + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) subClass.__proto__ = superClass; };
+
+	var _React$Component = __webpack_require__(3);
+
+	var React = _interopRequire(_React$Component);
+
+	var Switch = (function (_Component) {
+	  function Switch() {
+	    _classCallCheck(this, Switch);
+
+	    if (_Component != null) {
+	      _Component.apply(this, arguments);
+	    }
+	  }
+
+	  _inherits(Switch, _Component);
+
+	  _createClass(Switch, [{
+	    key: 'componentDidMount',
+	    value: function componentDidMount() {
+	      if (typeof this.props.onShow === 'function') {
+	        this.props.onShow();
+	      }
+	    }
+	  }, {
+	    key: 'componentWillUnmount',
+	    value: function componentWillUnmount() {
+	      if (typeof this.props.onHide === 'function') {
+	        this.props.onHide();
+	      }
+	    }
+	  }, {
+	    key: 'render',
+	    value: function render() {
+	      return React.createElement(this.props.handler, this.props.handlerProps);
+	    }
+	  }]);
+
+	  return Switch;
+	})(_React$Component.Component);
+
+	module.exports = Switch;
+
+	Switch.displayName = 'Switch';
+
+	Switch.propTypes = {
+	  path: React.PropTypes.string.isRequired,
+	  handler: React.PropTypes.func.isRequired,
+	  handlerProps: React.PropTypes.object,
+	  onShow: React.PropTypes.func,
+	  onHide: React.PropTypes.func
+	};
+
+/***/ },
+/* 3 */
+/***/ function(module, exports, __webpack_require__) {
+
+	module.exports = __WEBPACK_EXTERNAL_MODULE_3__;
+
+/***/ },
+/* 4 */
+/***/ function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	var _classCallCheck = function (instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError('Cannot call a class as a function'); } };
+
+	var _createClass = (function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (descriptor.value) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; })();
+
+	var _inherits = function (subClass, superClass) { if (typeof superClass !== 'function' && superClass !== null) { throw new TypeError('Super expression must either be null or a function, not ' + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) subClass.__proto__ = superClass; };
+
+	var _Component2 = __webpack_require__(3);
+
+	var NullComponent = (function (_Component) {
+	  function NullComponent() {
+	    _classCallCheck(this, NullComponent);
+
+	    if (_Component != null) {
+	      _Component.apply(this, arguments);
+	    }
+	  }
+
+	  _inherits(NullComponent, _Component);
+
+	  _createClass(NullComponent, [{
+	    key: 'render',
+	    value: function render() {
+	      return false;
+	    }
+	  }]);
+
+	  return NullComponent;
+	})(_Component2.Component);
+
+	module.exports = NullComponent;
+
+/***/ }
+/******/ ])
+});
+;

modules/components/Switcher.js

@@ -57,7 +57,8 @@ export default class Switcher extends Component {
   }
 
   getSwitch(path) {
-    return this.props.children.filter((child) => {
+    var children = [].concat(this.props.children);
+    return children.filter((child) => {
       return child.props.path === path;
     })[0];
   }
@@ -82,7 +83,10 @@ export default class Switcher extends Component {
 Switcher.displayName = 'Switcher';
 
 Switcher.propTypes = {
-  children: React.PropTypes.arrayOf(React.PropTypes.element).isRequired,
+  children: React.PropTypes.oneOfType([
+    React.PropTypes.arrayOf(React.PropTypes.element),
+    React.PropTypes.element
+  ]).isRequired,
   pushState: React.PropTypes.bool,
   defaultHandler: React.PropTypes.func,
   defaultHandlerProps: React.PropTypes.object,