diff --git a/package.json b/package.json index 9411d9e..5ad762c 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "react-component-playground", - "version": "0.2.2", + "version": "0.2.3", "description": "Isolated loader for React components", "main": "build/bundle.js", "repository": { @@ -11,7 +11,7 @@ "classnames": "^1.2.0", "lodash": "^3.6.0", "react-component-tree": "^0.2.2", - "react-minimal-router": "^0.1.3" + "react-querystring-router": "^0.2.0" }, "devDependencies": { "babel-core": "^5.0.12", diff --git a/src/components/component-playground.jsx b/src/components/component-playground.jsx index 87c37eb..8f80b62 100644 --- a/src/components/component-playground.jsx +++ b/src/components/component-playground.jsx @@ -4,7 +4,7 @@ var _ = require('lodash'), React = require('react'), classNames = require('classnames'), ComponentTree = require('react-component-tree'), - stringifyParams = require('react-minimal-router').uri.stringifyParams; + stringifyParams = require('react-querystring-router').uri.stringifyParams; module.exports = React.createClass({ /** @@ -18,34 +18,33 @@ module.exports = React.createClass({ propTypes: { components: React.PropTypes.object.isRequired, - selectedComponent: React.PropTypes.string, - selectedFixture: React.PropTypes.string, - fixtureEditor: React.PropTypes.bool, + component: React.PropTypes.string, + fixture: React.PropTypes.string, + editor: React.PropTypes.bool, fullScreen: React.PropTypes.bool, containerClassName: React.PropTypes.string }, statics: { getExpandedComponents: function(props, alreadyExpanded) { - if (!props.selectedComponent || - _.contains(alreadyExpanded, props.selectedComponent)) { + if (!props.component || _.contains(alreadyExpanded, props.component)) { return alreadyExpanded; } - return alreadyExpanded.concat(props.selectedComponent); + return alreadyExpanded.concat(props.component); }, isFixtureSelected: function(props) { - return props.selectedComponent && props.selectedFixture; + return props.component && props.fixture; }, getSelectedComponentClass: function(props) { - return props.components[props.selectedComponent].class; + return props.components[props.component].class; }, getSelectedFixtureContents: function(props) { - return props.components[props.selectedComponent] - .fixtures[props.selectedFixture]; + return props.components[props.component] + .fixtures[props.fixture]; }, getSelectedFixtureUserInput: function(props) { @@ -74,7 +73,7 @@ module.exports = React.createClass({ getDefaultProps: function() { return { - fixtureEditor: false, + editor: false, fullScreen: false }; }, @@ -162,9 +161,9 @@ module.exports = React.createClass({ {_.map(fixtures, function(props, fixtureName) { var fixtureProps = { - selectedComponent: componentName, - selectedFixture: fixtureName, - fixtureEditor: this.props.fixtureEditor + component: componentName, + fixture: fixtureName, + editor: this.props.editor }; return
  • {this.loadChild('preview')} - {this.props.fixtureEditor ? this._renderFixtureEditor() : null} + {this.props.editor ? this._renderFixtureEditor() : null} }, @@ -198,7 +197,7 @@ module.exports = React.createClass({ }); return
    -