add pretty to prettify markup

package.json

@@ -35,7 +35,8 @@
     "@storybook/react": "3.1.3"
   },
   "dependencies": {
-    "pretty": "^2.0.0"
+    "pretty": "^2.0.0",
+    "react-syntax-highlighter": "^10.0.1"
   },
   "peerDependencies": {
     "react": "^0.14.7 || ^15.0.0",

register.js

@@ -28,6 +28,12 @@ var _addons = require('@storybook/addons');
 
 var _addons2 = _interopRequireDefault(_addons);
 
+var _pretty = require('pretty');
+
+var pretty = _interopRequireWildcard(_pretty);
+
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } }
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 var styles = {
@@ -99,7 +105,7 @@ var StaticMarkup = function (_React$Component) {
       return active ? _react2.default.createElement(
         'div',
         { style: styles.markupPanel },
-        markup
+        pretty(markup)
       ) : null;
     }
 

src/register.js

@@ -1,5 +1,6 @@
 import React from 'react';
 import addons from '@storybook/addons';
+import * as pretty from 'pretty';
 
 const styles = {
   markupPanel: {
@@ -46,7 +47,7 @@ class StaticMarkup extends React.Component {
     const { active = true } = this.props
     return active ? (
       <div style={styles.markupPanel}>
-        { markup }
+        { pretty(markup) }
       </div>
     ) : null;
   }