Merge pull request #3 from kadirahq/default-props

Show default values for props
storybookjs · Jun 15, 2016 · d21c4c1 · d21c4c1
2 parents 2cd3850 + 15dd9b1
commit d21c4c1
Show file tree

Hide file tree

Showing 2 changed files with 66 additions and 24 deletions.
diff --git a/dist/components/PropTable.js b/dist/components/PropTable.js
@@ -4,6 +4,10 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 
+var _values = require('babel-runtime/core-js/object/values');
+
+var _values2 = _interopRequireDefault(_values);
+
 var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of');
 
 var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf);
@@ -60,16 +64,35 @@ var PropTable = function (_React$Component) {
         return null;
       }
 
-      var props = [];
-      for (var property in comp.propTypes) {
-        if (!comp.propTypes.hasOwnProperty(property)) {
-          continue;
+      var props = {};
+
+      if (comp.propTypes) {
+        for (var property in comp.propTypes) {
+          if (!comp.propTypes.hasOwnProperty(property)) {
+            continue;
+          }
+          var _type = comp.propTypes[property];
+          var propType = PropTypesMap.get(_type) || 'other';
+          var required = _type.isRequired === undefined ? 'yes' : 'no';
+          var defaultValue = '-';
+          props[property] = { property: property, propType: propType, required: required, defaultValue: defaultValue };
+        }
+      }
+
+      if (comp.defaultProps) {
+        for (var _property in comp.defaultProps) {
+          if (!comp.defaultProps.hasOwnProperty(_property)) {
+            continue;
+          }
+          var value = comp.defaultProps[_property];
+          if (value === undefined) {
+            continue;
+          }
+          if (!props[_property]) {
+            props[_property] = { property: _property };
+          }
+          props[_property].defaultValue = value;
         }
-        var _type = comp.propTypes[property];
-        var propType = PropTypesMap.get(_type) || 'other';
-        var required = _type.isRequired === undefined ? 'yes' : 'no';
-        var defaults = '-';
-        props.push({ property: property, propType: propType, required: required, defaults: defaults });
       }
 
       return _react2.default.createElement(
@@ -99,14 +122,14 @@ var PropTable = function (_React$Component) {
             _react2.default.createElement(
               'th',
               null,
-              'defaults'
+              'default'
             )
           )
         ),
         _react2.default.createElement(
           'tbody',
           null,
-          props.map(function (row) {
+          (0, _values2.default)(props).map(function (row) {
             return _react2.default.createElement(
               'tr',
               null,
@@ -128,7 +151,7 @@ var PropTable = function (_React$Component) {
               _react2.default.createElement(
                 'td',
                 null,
-                row.defaults
+                row.defaultValue.toString()
               )
             );
           })

diff --git a/src/components/PropTable.js b/src/components/PropTable.js
@@ -22,16 +22,35 @@ export default class PropTable extends React.Component {
       return null;
     }
 
-    const props = [];
-    for (let property in comp.propTypes) {
-      if (!comp.propTypes.hasOwnProperty(property)) {
-        continue
+    const props = {};
+
+    if (comp.propTypes) {
+      for (let property in comp.propTypes) {
+        if (!comp.propTypes.hasOwnProperty(property)) {
+          continue
+        }
+        const type = comp.propTypes[property];
+        const propType = PropTypesMap.get(type) || 'other';
+        const required = type.isRequired === undefined ? 'yes' : 'no';
+        const defaultValue = '-';
+        props[property] = {property, propType, required, defaultValue};
+      }
+    }
+
+    if (comp.defaultProps) {
+      for (let property in comp.defaultProps) {
+        if (!comp.defaultProps.hasOwnProperty(property)) {
+          continue
+        }
+        const value = comp.defaultProps[property];
+        if (value === undefined) {
+          continue;
+        }
+        if (!props[property]) {
+          props[property] = {property};
+        }
+        props[property].defaultValue = value;
       }
-      const type = comp.propTypes[property];
-      const propType = PropTypesMap.get(type) || 'other';
-      const required = type.isRequired === undefined ? 'yes' : 'no';
-      const defaults = '-';
-      props.push({property, propType, required, defaults});
     }
 
     return (
@@ -41,16 +60,16 @@ export default class PropTable extends React.Component {
             <th>property</th>
             <th>propType</th>
             <th>required</th>
-            <th>defaults</th>
+            <th>default</th>
           </tr>
         </thead>
         <tbody>
-          {props.map(row => (
+          {Object.values(props).map(row => (
             <tr>
               <td>{row.property}</td>
               <td>{row.propType}</td>
               <td>{row.required}</td>
-              <td>{row.defaults}</td>
+              <td>{row.defaultValue.toString()}</td>
             </tr>
           ))}
         </tbody>