diff --git a/dist/switcheroo.min.js b/dist/switcheroo.min.js index 63a645d..0e0e831 100644 --- a/dist/switcheroo.min.js +++ b/dist/switcheroo.min.js @@ -1 +1 @@ -!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";function o(e){return e&&e.__esModule?e:{"default":e}}function r(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function a(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function i(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&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var s=Object.assign||function(e){for(var t=1;t{selectedElement}) //the rendered output of the Switcher +} +``` + + ### wrapper If the `wrapper` prop is defined, the rendered child component will be wrapped in the specified React component. Any additional props passed to the `Switcher` will also be properties of this wrapper component. diff --git a/src/index.js b/src/index.js index 1921a70..86cbba7 100644 --- a/src/index.js +++ b/src/index.js @@ -21,7 +21,8 @@ export default class Switcher extends Component { location: PropTypes.string, basePath: PropTypes.string, preventUpdate: PropTypes.func, - mapDynamicSegments: PropTypes.func + mapDynamicSegments: PropTypes.func, + renderSwitch: PropTypes.func }; static defaultProps = { @@ -101,6 +102,10 @@ export default class Switcher extends Component { {...props, ...this.props.mapDynamicSegments(this.state.dynamicValues)} ); + if(this.props.renderSwitch) { + return this.props.renderSwitch(visibleSwitch, this.state.dynamicValues); + } + if (this.props.wrapper) { return React.createElement( this.props.wrapper, diff --git a/test/Switcher_test.js b/test/Switcher_test.js index 3461700..76b5381 100644 --- a/test/Switcher_test.js +++ b/test/Switcher_test.js @@ -282,6 +282,45 @@ describe('Switcher', function() { }); }); + describe('with custom render', function() { + it('calls the custom render function with the component and values', function() { + sinon.stub(helpers, 'currentPath').returns('/user/234-cde/information/421'); + function mapper({id, page}) { + var matches = id.match(/(.+)-(.+)/); + return { + userNum: matches[1], + userLetters: matches[2], + page: parseInt(page, 10) * 2 + }; + } + function MyComp(props) { + return ( + {props.userNum + props.userLetters + props.page} + ); + } + MyComp.displayName = 'MyComp'; + MyComp.propTypes = { + userNum: PropTypes.string, + userLetters: PropTypes.string, + page: PropTypes.number + }; + const render = sinon.stub().returnsArg(0); + ReactDOM.render( + + +
Static Path
+
, + document.getElementById('app') + ); + sinon.assert.calledOnce(render); + assert.deepEqual(render.args[0][1], {id: '234-cde', page: '421'}); + }); + afterEach(function() { + ReactDOM.unmountComponentAtNode(document.getElementById('app')); + helpers.currentPath.restore(); + }); + }); + describe('with a wrapper', function() { beforeEach(function() { function mapper({id, page}) {