@pie-element/categorize 6.6.0 → 6.6.1-beta.587

package/configure/lib/design/choices/index.js

@@ -45,7 +45,7 @@ var _categorize = require("@pie-lib/categorize");
 
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
 
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
 
 var Choices = /*#__PURE__*/function (_React$Component) {
   (0, _inherits2["default"])(Choices, _React$Component);
@@ -62,6 +62,9 @@ var Choices = /*#__PURE__*/function (_React$Component) {
     }
 
     _this = _super.call.apply(_super, [this].concat(args));
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "state", {
+      focusedEl: null
+    });
     (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "changeChoice", function (choice) {
       var _this$props = _this.props,
           choices = _this$props.choices,
@@ -86,7 +89,8 @@ var Choices = /*#__PURE__*/function (_React$Component) {
     (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "addChoice", function () {
       var _this$props2 = _this.props,
           onModelChanged = _this$props2.onModelChanged,
-          model = _this$props2.model;
+          model = _this$props2.model,
+          oldChoices = _this$props2.choices;
 
       var id = _configUi.choiceUtils.firstAvailableIndex(model.choices.map(function (a) {
         return a.id;
@@ -96,8 +100,18 @@ var Choices = /*#__PURE__*/function (_React$Component) {
         id: id,
         content: 'Choice ' + id
       };
-      onModelChanged({
-        choices: model.choices.concat([data])
+
+      _this.setState({
+        focusedEl: oldChoices.length
+      }, function () {
+        onModelChanged({
+          choices: model.choices.concat([data])
+        });
+      });
+    });
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "deleteFocusedEl", function () {
+      _this.setState({
+        focusedEl: null
       });
     });
     (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "deleteChoice", function (choice) {
@@ -114,6 +128,19 @@ var Choices = /*#__PURE__*/function (_React$Component) {
         onModelChanged(model);
       }
     });
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "rearrangeChoices", function (indexFrom, indexTo) {
+      var _ref = _this.props || {},
+          model = _ref.model,
+          onModelChanged = _ref.onModelChanged;
+
+      var _ref2 = model || [],
+          choices = _ref2.choices;
+
+      choices = (0, _categorize.rearrangeChoices)(choices, indexFrom, indexTo);
+      onModelChanged({
+        choices: choices
+      });
+    });
     return _this;
   }
 
@@ -122,41 +149,79 @@ var Choices = /*#__PURE__*/function (_React$Component) {
     value: function render() {
       var _this2 = this;
 
+      var focusedEl = this.state.focusedEl;
       var _this$props4 = this.props,
           classes = _this$props4.classes,
           className = _this$props4.className,
           choices = _this$props4.choices,
           model = _this$props4.model,
           imageSupport = _this$props4.imageSupport,
-          onModelChanged = _this$props4.onModelChanged;
+          uploadSoundSupport = _this$props4.uploadSoundSupport,
+          onModelChanged = _this$props4.onModelChanged,
+          spellCheck = _this$props4.spellCheck,
+          toolbarOpts = _this$props4.toolbarOpts,
+          configuration = _this$props4.configuration,
+          defaultImageMaxWidth = _this$props4.defaultImageMaxWidth,
+          defaultImageMaxHeight = _this$props4.defaultImageMaxHeight;
+      var errors = model.errors,
+          allowMultiplePlacementsEnabled = model.allowMultiplePlacementsEnabled,
+          lockChoiceOrder = model.lockChoiceOrder;
+
+      var _ref3 = errors || {},
+          choicesError = _ref3.choicesError,
+          choicesErrors = _ref3.choicesErrors;
+
+      var _ref4 = configuration || {},
+          maxChoices = _ref4.maxChoices,
+          _ref4$maxImageWidth = _ref4.maxImageWidth,
+          maxImageWidth = _ref4$maxImageWidth === void 0 ? {} : _ref4$maxImageWidth,
+          _ref4$maxImageHeight = _ref4.maxImageHeight,
+          maxImageHeight = _ref4$maxImageHeight === void 0 ? {} : _ref4$maxImageHeight;
+
       var categoryCountIsOne = this.allChoicesHaveCount(1);
       var choiceHolderStyle = {
-        gridTemplateColumns: "repeat(".concat(model.choicesPerRow, ", 1fr)")
+        gridTemplateColumns: "repeat(".concat(model.categoriesPerRow, ", 1fr)")
       };
       return /*#__PURE__*/_react["default"].createElement("div", {
         className: (0, _classnames["default"])(classes.choices, className)
       }, /*#__PURE__*/_react["default"].createElement(_header["default"], {
         label: "Choices",
         buttonLabel: "ADD A CHOICE",
-        onAdd: this.addChoice
-      }), /*#__PURE__*/_react["default"].createElement(_config["default"], {
+        onAdd: this.addChoice,
+        buttonDisabled: maxChoices && choices && maxChoices === choices.length
+      }), choicesError && /*#__PURE__*/_react["default"].createElement("div", {
+        className: classes.errorText
+      }, choicesError), /*#__PURE__*/_react["default"].createElement(_config["default"], {
         config: model,
-        categoryCountIsOne: categoryCountIsOne,
         onModelChanged: onModelChanged,
-        allChoicesHaveCount: this.allChoicesHaveCount
+        spellCheck: spellCheck
       }), /*#__PURE__*/_react["default"].createElement("div", {
         className: classes.choiceHolder,
         style: choiceHolderStyle
       }, choices.map(function (h, index) {
         return /*#__PURE__*/_react["default"].createElement(_choice["default"], {
           choice: h,
+          focusedEl: focusedEl,
+          deleteFocusedEl: _this2.deleteFocusedEl,
           correctResponseCount: h.correctResponseCount,
+          allowMultiplePlacements: allowMultiplePlacementsEnabled,
+          lockChoiceOrder: lockChoiceOrder,
+          index: index,
           key: index,
           imageSupport: imageSupport,
           onChange: _this2.changeChoice,
           onDelete: function onDelete() {
             return _this2.deleteChoice(h);
-          }
+          },
+          rearrangeChoices: function rearrangeChoices(indexFrom, indexTo) {
+            return _this2.rearrangeChoices(indexFrom, indexTo);
+          },
+          toolbarOpts: toolbarOpts,
+          spellCheck: spellCheck,
+          error: choicesErrors && choicesErrors[h.id],
+          maxImageWidth: maxImageWidth && maxImageWidth.choice || defaultImageMaxWidth,
+          maxImageHeight: maxImageHeight && maxImageHeight.choice || defaultImageMaxHeight,
+          uploadSoundSupport: uploadSoundSupport
         });
       })), /*#__PURE__*/_react["default"].createElement(_buttons.Divider, null));
     }
@@ -167,6 +232,7 @@ var Choices = /*#__PURE__*/function (_React$Component) {
 exports.Choices = Choices;
 (0, _defineProperty2["default"])(Choices, "propTypes", {
   model: _propTypes["default"].object.isRequired,
+  configuration: _propTypes["default"].object.isRequired,
   classes: _propTypes["default"].object.isRequired,
   className: _propTypes["default"].string,
   choices: _propTypes["default"].array.isRequired,
@@ -174,7 +240,12 @@ exports.Choices = Choices;
   imageSupport: _propTypes["default"].shape({
     add: _propTypes["default"].func.isRequired,
     "delete": _propTypes["default"].func.isRequired
-  })
+  }),
+  uploadSoundSupport: _propTypes["default"].shape({
+    add: _propTypes["default"].func.isRequired,
+    "delete": _propTypes["default"].func.isRequired
+  }),
+  toolbarOpts: _propTypes["default"].object
 });
 (0, _defineProperty2["default"])(Choices, "defaultProps", {});
 
@@ -191,7 +262,12 @@ var styles = function styles(theme) {
       paddingTop: theme.spacing.unit * 2,
       paddingBottom: theme.spacing.unit * 2
     },
-    label: {}
+    label: {},
+    errorText: {
+      fontSize: '12px',
+      color: 'red',
+      padding: '5px 0'
+    }
   };
 };
 

package/configure/lib/design/choices/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/design/choices/index.jsx"],"names":["Choices","choice","props","choices","onModelChanged","index","findIndex","h","id","splice","count","c","categoryCount","model","utils","firstAvailableIndex","map","a","data","content","concat","correctResponse","classes","className","imageSupport","categoryCountIsOne","allChoicesHaveCount","choiceHolderStyle","gridTemplateColumns","choicesPerRow","addChoice","choiceHolder","correctResponseCount","changeChoice","deleteChoice","React","Component","PropTypes","object","isRequired","string","array","func","shape","add","styles","theme","paddingTop","spacing","unit","paddingBottom","display","gridRowGap","gridColumnGap","label"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { withStyles } from '@material-ui/core/styles';\nimport { Divider } from '../buttons';\nimport classNames from 'classnames';\nimport Choice from './choice';\nimport Header from '../header';\nimport every from 'lodash/every';\nimport Config from './config';\nimport { choiceUtils as utils } from '@pie-lib/config-ui';\nimport { removeAllChoices } from '@pie-lib/categorize';\n\nexport class Choices extends React.Component {\n  static propTypes = {\n    model: PropTypes.object.isRequired,\n    classes: PropTypes.object.isRequired,\n    className: PropTypes.string,\n    choices: PropTypes.array.isRequired,\n    onModelChanged: PropTypes.func.isRequired,\n    imageSupport: PropTypes.shape({\n      add: PropTypes.func.isRequired,\n      delete: PropTypes.func.isRequired\n    })\n  };\n\n  static defaultProps = {};\n\n  changeChoice = choice => {\n    const { choices, onModelChanged } = this.props;\n    const index = choices.findIndex(h => h.id === choice.id);\n    if (index !== -1) {\n      choices.splice(index, 1, choice);\n      onModelChanged({ choices });\n    }\n  };\n\n  allChoicesHaveCount = count => {\n    const { choices } = this.props;\n    return every(choices, c => c.categoryCount === count);\n  };\n\n  addChoice = () => {\n    const { onModelChanged, model } = this.props;\n\n    const id = utils.firstAvailableIndex(model.choices.map(a => a.id), 0);\n    const data = { id, content: 'Choice ' + id };\n\n    onModelChanged({ choices: model.choices.concat([data]) });\n  };\n\n  deleteChoice = choice => {\n    const { model, onModelChanged } = this.props;\n    const index = model.choices.findIndex(a => a.id === choice.id);\n    if (index !== -1) {\n      model.choices.splice(index, 1);\n      model.correctResponse = removeAllChoices(\n        choice.id,\n        model.correctResponse\n      );\n      onModelChanged(model);\n    }\n  };\n\n  render() {\n    const {\n      classes,\n      className,\n      choices,\n      model,\n      imageSupport,\n      onModelChanged\n    } = this.props;\n\n    const categoryCountIsOne = this.allChoicesHaveCount(1);\n    const choiceHolderStyle = {\n      gridTemplateColumns: `repeat(${model.choicesPerRow}, 1fr)`\n    };\n\n    return (\n      <div className={classNames(classes.choices, className)}>\n        <Header label=\"Choices\" buttonLabel=\"ADD A CHOICE\" onAdd={this.addChoice} />\n        <Config\n          config={model}\n          categoryCountIsOne={categoryCountIsOne}\n          onModelChanged={onModelChanged}\n          allChoicesHaveCount={this.allChoicesHaveCount}\n        />\n        <div className={classes.choiceHolder} style={choiceHolderStyle}>\n          {choices.map((h, index) => (\n            <Choice\n              choice={h}\n              correctResponseCount={h.correctResponseCount}\n              key={index}\n              imageSupport={imageSupport}\n              onChange={this.changeChoice}\n              onDelete={() => this.deleteChoice(h)}\n            />\n          ))}\n        </div>\n        <Divider />\n      </div>\n    );\n  }\n}\nconst styles = theme => ({\n  choiceHolder: {\n    paddingTop: theme.spacing.unit,\n    paddingBottom: theme.spacing.unit,\n    display: 'grid',\n    gridRowGap: `${theme.spacing.unit}px`,\n    gridColumnGap: `${theme.spacing.unit}px`\n  },\n  choices: {\n    paddingTop: theme.spacing.unit * 2,\n    paddingBottom: theme.spacing.unit * 2\n  },\n  label: {}\n});\nexport default withStyles(styles)(Choices);\n"],"file":"index.js"}
+{"version":3,"sources":["../../../src/design/choices/index.jsx"],"names":["Choices","focusedEl","choice","props","choices","onModelChanged","index","findIndex","h","id","splice","count","c","categoryCount","model","oldChoices","utils","firstAvailableIndex","map","a","data","content","setState","length","concat","correctResponse","indexFrom","indexTo","state","classes","className","imageSupport","uploadSoundSupport","spellCheck","toolbarOpts","configuration","defaultImageMaxWidth","defaultImageMaxHeight","errors","allowMultiplePlacementsEnabled","lockChoiceOrder","choicesError","choicesErrors","maxChoices","maxImageWidth","maxImageHeight","categoryCountIsOne","allChoicesHaveCount","choiceHolderStyle","gridTemplateColumns","categoriesPerRow","addChoice","errorText","choiceHolder","deleteFocusedEl","correctResponseCount","changeChoice","deleteChoice","rearrangeChoices","React","Component","PropTypes","object","isRequired","string","array","func","shape","add","styles","theme","paddingTop","spacing","unit","paddingBottom","display","gridRowGap","gridColumnGap","label","fontSize","color","padding"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { withStyles } from '@material-ui/core/styles';\nimport { Divider } from '../buttons';\nimport classNames from 'classnames';\nimport Choice from './choice';\nimport Header from '../header';\nimport every from 'lodash/every';\nimport Config from './config';\nimport { choiceUtils as utils } from '@pie-lib/config-ui';\nimport { removeAllChoices } from '@pie-lib/categorize';\nimport { rearrangeChoices } from '@pie-lib/categorize';\n\nexport class Choices extends React.Component {\n  static propTypes = {\n    model: PropTypes.object.isRequired,\n    configuration: PropTypes.object.isRequired,\n    classes: PropTypes.object.isRequired,\n    className: PropTypes.string,\n    choices: PropTypes.array.isRequired,\n    onModelChanged: PropTypes.func.isRequired,\n    imageSupport: PropTypes.shape({\n      add: PropTypes.func.isRequired,\n      delete: PropTypes.func.isRequired,\n    }),\n    uploadSoundSupport: PropTypes.shape({\n      add: PropTypes.func.isRequired,\n      delete: PropTypes.func.isRequired,\n    }),\n    toolbarOpts: PropTypes.object,\n  };\n\n  static defaultProps = {};\n\n  state = {\n    focusedEl: null,\n  };\n\n  changeChoice = (choice) => {\n    const { choices, onModelChanged } = this.props;\n    const index = choices.findIndex((h) => h.id === choice.id);\n    if (index !== -1) {\n      choices.splice(index, 1, choice);\n      onModelChanged({ choices });\n    }\n  };\n\n  allChoicesHaveCount = (count) => {\n    const { choices } = this.props;\n    return every(choices, (c) => c.categoryCount === count);\n  };\n\n  addChoice = () => {\n    const { onModelChanged, model, choices: oldChoices } = this.props;\n\n    const id = utils.firstAvailableIndex(\n      model.choices.map((a) => a.id),\n      0,\n    );\n    const data = { id, content: 'Choice ' + id };\n\n    this.setState(\n      {\n        focusedEl: oldChoices.length,\n      },\n      () => {\n        onModelChanged({ choices: model.choices.concat([data]) });\n      },\n    );\n  };\n\n  deleteFocusedEl = () => {\n    this.setState({\n      focusedEl: null,\n    });\n  };\n\n  deleteChoice = (choice) => {\n    const { model, onModelChanged } = this.props;\n    const index = model.choices.findIndex((a) => a.id === choice.id);\n    if (index !== -1) {\n      model.choices.splice(index, 1);\n      model.correctResponse = removeAllChoices(choice.id, model.correctResponse);\n      onModelChanged(model);\n    }\n  };\n\n  rearrangeChoices = (indexFrom, indexTo) => {\n    const { model, onModelChanged } = this.props || {};\n    let { choices } = model || [];\n    choices = rearrangeChoices(choices, indexFrom, indexTo);\n    onModelChanged({ choices });\n  };\n\n  render() {\n    const { focusedEl } = this.state;\n    const {\n      classes,\n      className,\n      choices,\n      model,\n      imageSupport,\n      uploadSoundSupport,\n      onModelChanged,\n      spellCheck,\n      toolbarOpts,\n      configuration,\n      defaultImageMaxWidth,\n      defaultImageMaxHeight,\n    } = this.props;\n    const { errors, allowMultiplePlacementsEnabled, lockChoiceOrder } = model;\n    const { choicesError, choicesErrors } = errors || {};\n    const { maxChoices, maxImageWidth = {}, maxImageHeight = {} } = configuration || {};\n\n    const categoryCountIsOne = this.allChoicesHaveCount(1);\n    const choiceHolderStyle = {\n      gridTemplateColumns: `repeat(${model.categoriesPerRow}, 1fr)`,\n    };\n\n    return (\n      <div className={classNames(classes.choices, className)}>\n        <Header\n          label=\"Choices\"\n          buttonLabel=\"ADD A CHOICE\"\n          onAdd={this.addChoice}\n          buttonDisabled={maxChoices && choices && maxChoices === choices.length}\n        />\n        {choicesError && <div className={classes.errorText}>{choicesError}</div>}\n        <Config config={model} onModelChanged={onModelChanged} spellCheck={spellCheck} />\n        <div className={classes.choiceHolder} style={choiceHolderStyle}>\n          {choices.map((h, index) => {\n            return (\n              <Choice\n                choice={h}\n                focusedEl={focusedEl}\n                deleteFocusedEl={this.deleteFocusedEl}\n                correctResponseCount={h.correctResponseCount}\n                allowMultiplePlacements={allowMultiplePlacementsEnabled}\n                lockChoiceOrder={lockChoiceOrder}\n                index={index}\n                key={index}\n                imageSupport={imageSupport}\n                onChange={this.changeChoice}\n                onDelete={() => this.deleteChoice(h)}\n                rearrangeChoices={(indexFrom, indexTo) => this.rearrangeChoices(indexFrom, indexTo)}\n                toolbarOpts={toolbarOpts}\n                spellCheck={spellCheck}\n                error={choicesErrors && choicesErrors[h.id]}\n                maxImageWidth={(maxImageWidth && maxImageWidth.choice) || defaultImageMaxWidth}\n                maxImageHeight={(maxImageHeight && maxImageHeight.choice) || defaultImageMaxHeight}\n                uploadSoundSupport={uploadSoundSupport}\n              />\n            );\n          })}\n        </div>\n        <Divider />\n      </div>\n    );\n  }\n}\nconst styles = (theme) => ({\n  choiceHolder: {\n    paddingTop: theme.spacing.unit,\n    paddingBottom: theme.spacing.unit,\n    display: 'grid',\n    gridRowGap: `${theme.spacing.unit}px`,\n    gridColumnGap: `${theme.spacing.unit}px`,\n  },\n  choices: {\n    paddingTop: theme.spacing.unit * 2,\n    paddingBottom: theme.spacing.unit * 2,\n  },\n  label: {},\n  errorText: {\n    fontSize: '12px',\n    color: 'red',\n    padding: '5px 0',\n  },\n});\nexport default withStyles(styles)(Choices);\n"],"file":"index.js"}

package/configure/lib/design/header.js

@@ -33,7 +33,7 @@ var _buttons = require("./buttons");
 
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
 
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
 
 var Header = /*#__PURE__*/function (_React$Component) {
   (0, _inherits2["default"])(Header, _React$Component);
@@ -53,15 +53,21 @@ var Header = /*#__PURE__*/function (_React$Component) {
           className = _this$props.className,
           onAdd = _this$props.onAdd,
           label = _this$props.label,
-          buttonLabel = _this$props.buttonLabel;
+          buttonLabel = _this$props.buttonLabel,
+          info = _this$props.info,
+          buttonDisabled = _this$props.buttonDisabled,
+          variant = _this$props.variant;
       return /*#__PURE__*/_react["default"].createElement("div", {
         className: (0, _classnames["default"])(classes.header, className)
+      }, /*#__PURE__*/_react["default"].createElement("div", {
+        className: classes.titleContainer
       }, /*#__PURE__*/_react["default"].createElement(_Typography["default"], {
-        variant: "title",
+        variant: variant || "title",
         className: classes.title
-      }, label), /*#__PURE__*/_react["default"].createElement(_buttons.AddButton, {
+      }, label), info), /*#__PURE__*/_react["default"].createElement(_buttons.AddButton, {
         onClick: onAdd,
-        label: buttonLabel
+        label: buttonLabel,
+        disabled: buttonDisabled
       }));
     }
   }]);
@@ -74,7 +80,10 @@ exports.Header = Header;
   className: _propTypes["default"].string,
   buttonLabel: _propTypes["default"].string,
   onAdd: _propTypes["default"].func.isRequired,
-  label: _propTypes["default"].string.isRequired
+  label: _propTypes["default"].string.isRequired,
+  info: _propTypes["default"].any,
+  buttonDisabled: _propTypes["default"].bool,
+  variant: _propTypes["default"].string
 });
 (0, _defineProperty2["default"])(Header, "defaultProps", {});
 
@@ -84,6 +93,9 @@ var styles = function styles(theme) {
       display: 'flex',
       justifyContent: 'space-between',
       marginBottom: 2 * theme.spacing.unit
+    },
+    titleContainer: {
+      display: 'flex'
     }
   };
 };

package/configure/lib/design/header.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/design/header.jsx"],"names":["Header","props","classes","className","onAdd","label","buttonLabel","header","title","React","Component","PropTypes","object","isRequired","string","func","styles","theme","display","justifyContent","marginBottom","spacing","unit"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;IAEaA,M;;;;;;;;;;;;WAUX,kBAAS;AAAA,wBACmD,KAAKC,KADxD;AAAA,UACCC,OADD,eACCA,OADD;AAAA,UACUC,SADV,eACUA,SADV;AAAA,UACqBC,KADrB,eACqBA,KADrB;AAAA,UAC4BC,KAD5B,eAC4BA,KAD5B;AAAA,UACmCC,WADnC,eACmCA,WADnC;AAEP,0BACE;AAAK,QAAA,SAAS,EAAE,4BAAWJ,OAAO,CAACK,MAAnB,EAA2BJ,SAA3B;AAAhB,sBACE,gCAAC,sBAAD;AAAY,QAAA,OAAO,EAAC,OAApB;AAA4B,QAAA,SAAS,EAAED,OAAO,CAACM;AAA/C,SACGH,KADH,CADF,eAIE,gCAAC,kBAAD;AAAW,QAAA,OAAO,EAAED,KAApB;AAA2B,QAAA,KAAK,EAAEE;AAAlC,QAJF,CADF;AAQD;;;EApByBG,kBAAMC,S;;;iCAArBV,M,eACQ;AACjBE,EAAAA,OAAO,EAAES,sBAAUC,MAAV,CAAiBC,UADT;AAEjBV,EAAAA,SAAS,EAAEQ,sBAAUG,MAFJ;AAGjBR,EAAAA,WAAW,EAAEK,sBAAUG,MAHN;AAIjBV,EAAAA,KAAK,EAAEO,sBAAUI,IAAV,CAAeF,UAJL;AAKjBR,EAAAA,KAAK,EAAEM,sBAAUG,MAAV,CAAiBD;AALP,C;iCADRb,M,kBASW,E;;AAaxB,IAAMgB,MAAM,GAAG,SAATA,MAAS,CAAAC,KAAK;AAAA,SAAK;AACvBV,IAAAA,MAAM,EAAE;AACNW,MAAAA,OAAO,EAAE,MADH;AAENC,MAAAA,cAAc,EAAE,eAFV;AAGNC,MAAAA,YAAY,EAAE,IAAIH,KAAK,CAACI,OAAN,CAAcC;AAH1B;AADe,GAAL;AAAA,CAApB;;eAOe,wBAAWN,MAAX,EAAmBhB,MAAnB,C","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport Typography from '@material-ui/core/Typography';\nimport { withStyles } from '@material-ui/core/styles';\nimport classNames from 'classnames';\nimport { AddButton } from './buttons';\n\nexport class Header extends React.Component {\n  static propTypes = {\n    classes: PropTypes.object.isRequired,\n    className: PropTypes.string,\n    buttonLabel: PropTypes.string,\n    onAdd: PropTypes.func.isRequired,\n    label: PropTypes.string.isRequired\n  };\n\n  static defaultProps = {};\n  render() {\n    const { classes, className, onAdd, label, buttonLabel } = this.props;\n    return (\n      <div className={classNames(classes.header, className)}>\n        <Typography variant=\"title\" className={classes.title}>\n          {label}\n        </Typography>\n        <AddButton onClick={onAdd} label={buttonLabel} />\n      </div>\n    );\n  }\n}\nconst styles = theme => ({\n  header: {\n    display: 'flex',\n    justifyContent: 'space-between',\n    marginBottom: 2 * theme.spacing.unit\n  }\n});\nexport default withStyles(styles)(Header);\n"],"file":"header.js"}
+{"version":3,"sources":["../../src/design/header.jsx"],"names":["Header","props","classes","className","onAdd","label","buttonLabel","info","buttonDisabled","variant","header","titleContainer","title","React","Component","PropTypes","object","isRequired","string","func","any","bool","styles","theme","display","justifyContent","marginBottom","spacing","unit"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;IAEaA,M;;;;;;;;;;;;WAaX,kBAAS;AACP,wBAAyF,KAAKC,KAA9F;AAAA,UAAQC,OAAR,eAAQA,OAAR;AAAA,UAAiBC,SAAjB,eAAiBA,SAAjB;AAAA,UAA4BC,KAA5B,eAA4BA,KAA5B;AAAA,UAAmCC,KAAnC,eAAmCA,KAAnC;AAAA,UAA0CC,WAA1C,eAA0CA,WAA1C;AAAA,UAAuDC,IAAvD,eAAuDA,IAAvD;AAAA,UAA6DC,cAA7D,eAA6DA,cAA7D;AAAA,UAA6EC,OAA7E,eAA6EA,OAA7E;AACA,0BACE;AAAK,QAAA,SAAS,EAAE,4BAAWP,OAAO,CAACQ,MAAnB,EAA2BP,SAA3B;AAAhB,sBACE;AAAK,QAAA,SAAS,EAAED,OAAO,CAACS;AAAxB,sBACE,gCAAC,sBAAD;AAAY,QAAA,OAAO,EAAEF,OAAO,IAAI,OAAhC;AAAyC,QAAA,SAAS,EAAEP,OAAO,CAACU;AAA5D,SACGP,KADH,CADF,EAIGE,IAJH,CADF,eAOE,gCAAC,kBAAD;AAAW,QAAA,OAAO,EAAEH,KAApB;AAA2B,QAAA,KAAK,EAAEE,WAAlC;AAA+C,QAAA,QAAQ,EAAEE;AAAzD,QAPF,CADF;AAWD;;;EA1ByBK,kBAAMC,S;;;iCAArBd,M,eACQ;AACjBE,EAAAA,OAAO,EAAEa,sBAAUC,MAAV,CAAiBC,UADT;AAEjBd,EAAAA,SAAS,EAAEY,sBAAUG,MAFJ;AAGjBZ,EAAAA,WAAW,EAAES,sBAAUG,MAHN;AAIjBd,EAAAA,KAAK,EAAEW,sBAAUI,IAAV,CAAeF,UAJL;AAKjBZ,EAAAA,KAAK,EAAEU,sBAAUG,MAAV,CAAiBD,UALP;AAMjBV,EAAAA,IAAI,EAAEQ,sBAAUK,GANC;AAOjBZ,EAAAA,cAAc,EAAEO,sBAAUM,IAPT;AAQjBZ,EAAAA,OAAO,EAAEM,sBAAUG;AARF,C;iCADRlB,M,kBAYW,E;;AAgBxB,IAAMsB,MAAM,GAAG,SAATA,MAAS,CAACC,KAAD;AAAA,SAAY;AACzBb,IAAAA,MAAM,EAAE;AACNc,MAAAA,OAAO,EAAE,MADH;AAENC,MAAAA,cAAc,EAAE,eAFV;AAGNC,MAAAA,YAAY,EAAE,IAAIH,KAAK,CAACI,OAAN,CAAcC;AAH1B,KADiB;AAMzBjB,IAAAA,cAAc,EAAE;AACda,MAAAA,OAAO,EAAE;AADK;AANS,GAAZ;AAAA,CAAf;;eAUe,wBAAWF,MAAX,EAAmBtB,MAAnB,C","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport Typography from '@material-ui/core/Typography';\nimport { withStyles } from '@material-ui/core/styles';\nimport classNames from 'classnames';\nimport { AddButton } from './buttons';\n\nexport class Header extends React.Component {\n  static propTypes = {\n    classes: PropTypes.object.isRequired,\n    className: PropTypes.string,\n    buttonLabel: PropTypes.string,\n    onAdd: PropTypes.func.isRequired,\n    label: PropTypes.string.isRequired,\n    info: PropTypes.any,\n    buttonDisabled: PropTypes.bool,\n    variant: PropTypes.string,\n  };\n\n  static defaultProps = {};\n  render() {\n    const { classes, className, onAdd, label, buttonLabel, info, buttonDisabled, variant } = this.props;\n    return (\n      <div className={classNames(classes.header, className)}>\n        <div className={classes.titleContainer}>\n          <Typography variant={variant || \"title\"} className={classes.title}>\n            {label}\n          </Typography>\n          {info}\n        </div>\n        <AddButton onClick={onAdd} label={buttonLabel} disabled={buttonDisabled} />\n      </div>\n    );\n  }\n}\nconst styles = (theme) => ({\n  header: {\n    display: 'flex',\n    justifyContent: 'space-between',\n    marginBottom: 2 * theme.spacing.unit,\n  },\n  titleContainer: {\n    display: 'flex',\n  },\n});\nexport default withStyles(styles)(Header);\n"],"file":"header.js"}