Merge pull request #203 from storybooks/refactor/decorators

refactor(decorators): move Container to new component

src/components/Decorators/Container.js

@@ -0,0 +1,54 @@
+import React, {PureComponent} from 'react';
+import PropTypes from 'prop-types';
+import {VelocityComponent} from 'velocity-react';
+
+class Container extends PureComponent {
+    renderToggle() {
+        const {animations} = this.props;
+
+        if (!animations) {
+            return this.renderToggleDecorator();
+        }
+
+        return (
+            <VelocityComponent
+                animation={animations.toggle.animation}
+                duration={animations.toggle.duration}
+            >
+                {this.renderToggleDecorator()}
+            </VelocityComponent>
+        );
+    }
+
+    renderToggleDecorator() {
+        const {style, decorators} = this.props;
+        return <decorators.Toggle style={style.toggle}/>;
+    }
+
+    render() {
+        const {style, decorators, terminal, onClick, node} = this.props;
+        return (
+            <div
+                onClick={onClick}
+                style={node.active ? {...style.container} : {...style.link}}
+            >
+                {!terminal ? this.renderToggle() : null}
+                <decorators.Header node={node} style={style.header}/>
+            </div>
+        );
+    }
+}
+
+Container.propTypes = {
+    style: PropTypes.object.isRequired,
+    decorators: PropTypes.object.isRequired,
+    terminal: PropTypes.bool.isRequired,
+    onClick: PropTypes.func.isRequired,
+    animations: PropTypes.oneOfType([
+        PropTypes.object,
+        PropTypes.bool
+    ]).isRequired,
+    node: PropTypes.object.isRequired
+};
+
+export default Container;

src/components/Decorators/index.js

@@ -1,63 +1,11 @@
-import React, {PureComponent} from 'react';
-import PropTypes from 'prop-types';
-import {VelocityComponent} from 'velocity-react';
-
+import Container from './Container';
 import Header from './Header';
 import Loading from './Loading';
 import Toggle from './Toggle';
 
-class Container extends PureComponent {
-    renderToggle() {
-        const {animations} = this.props;
-
-        if (!animations) {
-            return this.renderToggleDecorator();
-        }
-
-        return (
-            <VelocityComponent
-                animation={animations.toggle.animation}
-                duration={animations.toggle.duration}
-            >
-                {this.renderToggleDecorator()}
-            </VelocityComponent>
-        );
-    }
-
-    renderToggleDecorator() {
-        const {style, decorators} = this.props;
-        return <decorators.Toggle style={style.toggle}/>;
-    }
-
-    render() {
-        const {style, decorators, terminal, onClick, node} = this.props;
-        return (
-            <div
-                onClick={onClick}
-                style={node.active ? {...style.container} : {...style.link}}
-            >
-                {!terminal ? this.renderToggle() : null}
-                <decorators.Header node={node} style={style.header}/>
-            </div>
-        );
-    }
-}
-
-Container.propTypes = {
-    style: PropTypes.object.isRequired,
-    decorators: PropTypes.object.isRequired,
-    terminal: PropTypes.bool.isRequired,
-    onClick: PropTypes.func.isRequired,
-    animations: PropTypes.oneOfType([
-        PropTypes.object,
-        PropTypes.bool
-    ]).isRequired,
-    node: PropTypes.object.isRequired
-};
-
 export default {
-    Loading,
-    Toggle,
+    Container,
     Header,
-    Container
+    Loading,
+    Toggle
 };