@pie-lib/config-ui 11.10.1-beta.0 → 11.12.0

package/lib/feedback-config/feedback-selector.js

@@ -0,0 +1,195 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.FeedbackType = exports.FeedbackSelector = void 0;
+
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+
+var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
+
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _editableHtml = _interopRequireDefault(require("@pie-lib/editable-html"));
+
+var _renderUi = require("@pie-lib/render-ui");
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _styles = require("@material-ui/core/styles");
+
+var _group = _interopRequireDefault(require("./group"));
+
+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 { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+var feedbackLabels = {
+  "default": 'Simple Feedback',
+  none: 'No Feedback',
+  custom: 'Customized Feedback'
+};
+
+var holder = function holder(theme, extras) {
+  return _objectSpread({
+    marginTop: '0px',
+    background: theme.palette.grey[300],
+    padding: theme.spacing.unit,
+    marginBottom: theme.spacing.unit * 2,
+    borderRadius: '4px'
+  }, extras);
+};
+
+var style = function style(theme) {
+  return {
+    feedbackSelector: {
+      marginBottom: theme.spacing.unit
+    },
+    label: {
+      cursor: 'pointer'
+    },
+    inputContainerLabel: {
+      transform: 'translateY(-20%)'
+    },
+    feedbackInputContainer: {
+      paddingBottom: 0
+    },
+    customHolder: holder(theme, {
+      background: theme.palette.grey[300],
+      padding: 0
+    }),
+    defaultHolder: holder(theme, {
+      fontFamily: theme.typography.fontFamily,
+      padding: theme.spacing.unit * 2,
+      cursor: 'default'
+    }),
+    editor: {
+      fontFamily: theme.typography.fontFamily
+    },
+    group: {
+      paddingTop: theme.spacing.unit
+    }
+  };
+};
+
+var FeedbackType = {
+  type: _propTypes["default"].oneOf(['default', 'custom', 'none']),
+  "default": _propTypes["default"].string,
+  custom: _propTypes["default"].string
+};
+exports.FeedbackType = FeedbackType;
+
+var FeedbackSelector = /*#__PURE__*/function (_React$Component) {
+  (0, _inherits2["default"])(FeedbackSelector, _React$Component);
+
+  var _super = _createSuper(FeedbackSelector);
+
+  function FeedbackSelector() {
+    var _this;
+
+    (0, _classCallCheck2["default"])(this, FeedbackSelector);
+
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    _this = _super.call.apply(_super, [this].concat(args));
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "changeType", function (type) {
+      var _this$props = _this.props,
+          onChange = _this$props.onChange,
+          feedback = _this$props.feedback;
+      onChange(_objectSpread(_objectSpread({}, feedback), {}, {
+        type: type
+      }));
+    });
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "changeCustom", function (custom) {
+      var _this$props2 = _this.props,
+          onChange = _this$props2.onChange,
+          feedback = _this$props2.feedback;
+      onChange(_objectSpread(_objectSpread({}, feedback), {}, {
+        type: 'custom',
+        custom: custom
+      }));
+    });
+    return _this;
+  }
+
+  (0, _createClass2["default"])(FeedbackSelector, [{
+    key: "render",
+    value: function render() {
+      var _this$props3 = this.props,
+          keys = _this$props3.keys,
+          classes = _this$props3.classes,
+          label = _this$props3.label,
+          feedback = _this$props3.feedback,
+          toolbarOpts = _this$props3.toolbarOpts,
+          _this$props3$mathMlOp = _this$props3.mathMlOptions,
+          mathMlOptions = _this$props3$mathMlOp === void 0 ? {} : _this$props3$mathMlOp;
+      var feedbackKeys = keys || Object.keys(feedbackLabels);
+      return /*#__PURE__*/_react["default"].createElement("div", {
+        className: classes.feedbackSelector
+      }, /*#__PURE__*/_react["default"].createElement(_renderUi.InputContainer, {
+        label: label,
+        className: classes.feedbackInputContainer,
+        extraClasses: {
+          label: classes.inputContainerLabel
+        }
+      }, /*#__PURE__*/_react["default"].createElement(_group["default"], {
+        className: classes.group,
+        keys: feedbackKeys,
+        label: label,
+        value: feedback.type,
+        onChange: this.changeType,
+        feedbackLabels: feedbackLabels
+      })), feedback.type === 'custom' && /*#__PURE__*/_react["default"].createElement("div", {
+        className: classes.customHolder
+      }, /*#__PURE__*/_react["default"].createElement(_editableHtml["default"], {
+        className: classes.editor,
+        onChange: this.changeCustom,
+        markup: feedback.custom || '',
+        toolbarOpts: toolbarOpts,
+        languageCharactersProps: [{
+          language: 'spanish'
+        }, {
+          language: 'special'
+        }],
+        mathMlOptions: mathMlOptions
+      })), feedback.type === 'default' && /*#__PURE__*/_react["default"].createElement("div", {
+        className: classes.defaultHolder
+      }, " ", feedback["default"]));
+    }
+  }]);
+  return FeedbackSelector;
+}(_react["default"].Component);
+
+exports.FeedbackSelector = FeedbackSelector;
+(0, _defineProperty2["default"])(FeedbackSelector, "propTypes", {
+  keys: _propTypes["default"].arrayOf(_propTypes["default"].string),
+  classes: _propTypes["default"].object.isRequired,
+  label: _propTypes["default"].string.isRequired,
+  feedback: _propTypes["default"].shape(FeedbackType).isRequired,
+  onChange: _propTypes["default"].func.isRequired,
+  toolbarOpts: _propTypes["default"].object
+});
+
+var _default = (0, _styles.withStyles)(style)(FeedbackSelector);
+
+exports["default"] = _default;
+//# sourceMappingURL=feedback-selector.js.map

package/lib/feedback-config/feedback-selector.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/feedback-config/feedback-selector.jsx"],"names":["feedbackLabels","none","custom","holder","theme","extras","marginTop","background","palette","grey","padding","spacing","unit","marginBottom","borderRadius","style","feedbackSelector","label","cursor","inputContainerLabel","transform","feedbackInputContainer","paddingBottom","customHolder","defaultHolder","fontFamily","typography","editor","group","paddingTop","FeedbackType","type","PropTypes","oneOf","string","FeedbackSelector","props","onChange","feedback","keys","classes","toolbarOpts","mathMlOptions","feedbackKeys","Object","changeType","changeCustom","language","React","Component","arrayOf","object","isRequired","shape","func"],"mappings":"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","sourcesContent":["import EditableHTML from '@pie-lib/editable-html';\nimport { InputContainer } from '@pie-lib/render-ui';\nimport PropTypes from 'prop-types';\nimport React from 'react';\nimport { withStyles } from '@material-ui/core/styles';\nimport Group from './group';\n\nconst feedbackLabels = {\n  default: 'Simple Feedback',\n  none: 'No Feedback',\n  custom: 'Customized Feedback',\n};\n\nconst holder = (theme, extras) => ({\n  marginTop: '0px',\n  background: theme.palette.grey[300],\n  padding: theme.spacing.unit,\n  marginBottom: theme.spacing.unit * 2,\n  borderRadius: '4px',\n  ...extras,\n});\n\nconst style = (theme) => ({\n  feedbackSelector: {\n    marginBottom: theme.spacing.unit,\n  },\n  label: {\n    cursor: 'pointer',\n  },\n  inputContainerLabel: {\n    transform: 'translateY(-20%)',\n  },\n  feedbackInputContainer: {\n    paddingBottom: 0,\n  },\n  customHolder: holder(theme, {\n    background: theme.palette.grey[300],\n    padding: 0,\n  }),\n  defaultHolder: holder(theme, {\n    fontFamily: theme.typography.fontFamily,\n    padding: theme.spacing.unit * 2,\n    cursor: 'default',\n  }),\n  editor: {\n    fontFamily: theme.typography.fontFamily,\n  },\n  group: {\n    paddingTop: theme.spacing.unit,\n  },\n});\n\nexport const FeedbackType = {\n  type: PropTypes.oneOf(['default', 'custom', 'none']),\n  default: PropTypes.string,\n  custom: PropTypes.string,\n};\n\nexport class FeedbackSelector extends React.Component {\n  static propTypes = {\n    keys: PropTypes.arrayOf(PropTypes.string),\n    classes: PropTypes.object.isRequired,\n    label: PropTypes.string.isRequired,\n    feedback: PropTypes.shape(FeedbackType).isRequired,\n    onChange: PropTypes.func.isRequired,\n    toolbarOpts: PropTypes.object,\n  };\n\n  changeType = (type) => {\n    const { onChange, feedback } = this.props;\n\n    onChange({ ...feedback, type });\n  };\n\n  changeCustom = (custom) => {\n    const { onChange, feedback } = this.props;\n\n    onChange({ ...feedback, type: 'custom', custom });\n  };\n\n  render() {\n    const { keys, classes, label, feedback, toolbarOpts, mathMlOptions = {} } = this.props;\n\n    const feedbackKeys = keys || Object.keys(feedbackLabels);\n\n    return (\n      <div className={classes.feedbackSelector}>\n        <InputContainer\n          label={label}\n          className={classes.feedbackInputContainer}\n          extraClasses={{ label: classes.inputContainerLabel }}\n        >\n          <Group\n            className={classes.group}\n            keys={feedbackKeys}\n            label={label}\n            value={feedback.type}\n            onChange={this.changeType}\n            feedbackLabels={feedbackLabels}\n          />\n        </InputContainer>\n\n        {feedback.type === 'custom' && (\n          <div className={classes.customHolder}>\n            <EditableHTML\n              className={classes.editor}\n              onChange={this.changeCustom}\n              markup={feedback.custom || ''}\n              toolbarOpts={toolbarOpts}\n              languageCharactersProps={[{ language: 'spanish' }, { language: 'special' }]}\n              mathMlOptions={mathMlOptions}\n            />\n          </div>\n        )}\n\n        {feedback.type === 'default' && <div className={classes.defaultHolder}> {feedback.default}</div>}\n      </div>\n    );\n  }\n}\n\nexport default withStyles(style)(FeedbackSelector);\n"],"file":"feedback-selector.js"}

package/lib/feedback-config/group.js

@@ -0,0 +1,75 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _radioWithLabel = _interopRequireDefault(require("../radio-with-label"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _styles = require("@material-ui/core/styles");
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var styles = function styles(theme) {
+  return {
+    radioLabel: {
+      fontSize: theme.typography.fontSize - 2
+    },
+    choice: {
+      display: 'flex',
+      alignItems: 'center'
+    },
+    choiceHolder: {
+      display: 'flex',
+      alignItems: 'center'
+    }
+  };
+};
+
+var Group = function Group(props) {
+  var feedbackLabels = props.feedbackLabels,
+      value = props.value,
+      classes = props.classes,
+      className = props.className,
+      _onChange = props.onChange,
+      keys = props.keys;
+  return /*#__PURE__*/_react["default"].createElement("div", {
+    className: (0, _classnames["default"])(classes.choiceHolder, className)
+  }, keys.map(function (key) {
+    return /*#__PURE__*/_react["default"].createElement("div", {
+      className: classes.choice,
+      key: key
+    }, /*#__PURE__*/_react["default"].createElement(_radioWithLabel["default"], {
+      value: key,
+      checked: value === key,
+      classes: {
+        label: classes.radioLabel
+      },
+      onChange: function onChange(e) {
+        return _onChange(e.currentTarget.value);
+      },
+      label: feedbackLabels[key]
+    }));
+  }));
+};
+
+Group.propTypes = {
+  className: _propTypes["default"].string,
+  feedbackLabels: _propTypes["default"].object.isRequired,
+  value: _propTypes["default"].string.isRequired,
+  classes: _propTypes["default"].object.isRequired,
+  keys: _propTypes["default"].arrayOf(_propTypes["default"].string),
+  onChange: _propTypes["default"].func
+};
+
+var _default = (0, _styles.withStyles)(styles)(Group);
+
+exports["default"] = _default;
+//# sourceMappingURL=group.js.map

package/lib/feedback-config/group.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/feedback-config/group.jsx"],"names":["styles","theme","radioLabel","fontSize","typography","choice","display","alignItems","choiceHolder","Group","props","feedbackLabels","value","classes","className","onChange","keys","map","key","label","e","currentTarget","propTypes","PropTypes","string","object","isRequired","arrayOf","func"],"mappings":";;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AAEA,IAAMA,MAAM,GAAG,SAATA,MAAS,CAACC,KAAD;AAAA,SAAY;AACzBC,IAAAA,UAAU,EAAE;AACVC,MAAAA,QAAQ,EAAEF,KAAK,CAACG,UAAN,CAAiBD,QAAjB,GAA4B;AAD5B,KADa;AAIzBE,IAAAA,MAAM,EAAE;AACNC,MAAAA,OAAO,EAAE,MADH;AAENC,MAAAA,UAAU,EAAE;AAFN,KAJiB;AAQzBC,IAAAA,YAAY,EAAE;AACZF,MAAAA,OAAO,EAAE,MADG;AAEZC,MAAAA,UAAU,EAAE;AAFA;AARW,GAAZ;AAAA,CAAf;;AAcA,IAAME,KAAK,GAAG,SAARA,KAAQ,CAACC,KAAD,EAAW;AACvB,MAAQC,cAAR,GAAsED,KAAtE,CAAQC,cAAR;AAAA,MAAwBC,KAAxB,GAAsEF,KAAtE,CAAwBE,KAAxB;AAAA,MAA+BC,OAA/B,GAAsEH,KAAtE,CAA+BG,OAA/B;AAAA,MAAwCC,SAAxC,GAAsEJ,KAAtE,CAAwCI,SAAxC;AAAA,MAAmDC,SAAnD,GAAsEL,KAAtE,CAAmDK,QAAnD;AAAA,MAA6DC,IAA7D,GAAsEN,KAAtE,CAA6DM,IAA7D;AAEA,sBACE;AAAK,IAAA,SAAS,EAAE,4BAAWH,OAAO,CAACL,YAAnB,EAAiCM,SAAjC;AAAhB,KACGE,IAAI,CAACC,GAAL,CAAS,UAACC,GAAD,EAAS;AACjB,wBACE;AAAK,MAAA,SAAS,EAAEL,OAAO,CAACR,MAAxB;AAAgC,MAAA,GAAG,EAAEa;AAArC,oBACE,gCAAC,0BAAD;AACE,MAAA,KAAK,EAAEA,GADT;AAEE,MAAA,OAAO,EAAEN,KAAK,KAAKM,GAFrB;AAGE,MAAA,OAAO,EAAE;AAAEC,QAAAA,KAAK,EAAEN,OAAO,CAACX;AAAjB,OAHX;AAIE,MAAA,QAAQ,EAAE,kBAACkB,CAAD;AAAA,eAAOL,SAAQ,CAACK,CAAC,CAACC,aAAF,CAAgBT,KAAjB,CAAf;AAAA,OAJZ;AAKE,MAAA,KAAK,EAAED,cAAc,CAACO,GAAD;AALvB,MADF,CADF;AAWD,GAZA,CADH,CADF;AAiBD,CApBD;;AAsBAT,KAAK,CAACa,SAAN,GAAkB;AAChBR,EAAAA,SAAS,EAAES,sBAAUC,MADL;AAEhBb,EAAAA,cAAc,EAAEY,sBAAUE,MAAV,CAAiBC,UAFjB;AAGhBd,EAAAA,KAAK,EAAEW,sBAAUC,MAAV,CAAiBE,UAHR;AAIhBb,EAAAA,OAAO,EAAEU,sBAAUE,MAAV,CAAiBC,UAJV;AAKhBV,EAAAA,IAAI,EAAEO,sBAAUI,OAAV,CAAkBJ,sBAAUC,MAA5B,CALU;AAMhBT,EAAAA,QAAQ,EAAEQ,sBAAUK;AANJ,CAAlB;;eASe,wBAAW5B,MAAX,EAAmBS,KAAnB,C","sourcesContent":["import PropTypes from 'prop-types';\nimport RadioWithLabel from '../radio-with-label';\nimport React from 'react';\nimport { withStyles } from '@material-ui/core/styles';\nimport classNames from 'classnames';\n\nconst styles = (theme) => ({\n  radioLabel: {\n    fontSize: theme.typography.fontSize - 2,\n  },\n  choice: {\n    display: 'flex',\n    alignItems: 'center',\n  },\n  choiceHolder: {\n    display: 'flex',\n    alignItems: 'center',\n  },\n});\n\nconst Group = (props) => {\n  const { feedbackLabels, value, classes, className, onChange, keys } = props;\n\n  return (\n    <div className={classNames(classes.choiceHolder, className)}>\n      {keys.map((key) => {\n        return (\n          <div className={classes.choice} key={key}>\n            <RadioWithLabel\n              value={key}\n              checked={value === key}\n              classes={{ label: classes.radioLabel }}\n              onChange={(e) => onChange(e.currentTarget.value)}\n              label={feedbackLabels[key]}\n            />\n          </div>\n        );\n      })}\n    </div>\n  );\n};\n\nGroup.propTypes = {\n  className: PropTypes.string,\n  feedbackLabels: PropTypes.object.isRequired,\n  value: PropTypes.string.isRequired,\n  classes: PropTypes.object.isRequired,\n  keys: PropTypes.arrayOf(PropTypes.string),\n  onChange: PropTypes.func,\n};\n\nexport default withStyles(styles)(Group);\n"],"file":"group.js"}

package/lib/feedback-config/index.js

@@ -0,0 +1,189 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.FeedbackConfig = void 0;
+Object.defineProperty(exports, "FeedbackSelector", {
+  enumerable: true,
+  get: function get() {
+    return _feedbackSelector["default"];
+  }
+});
+exports["default"] = exports.buildDefaults = void 0;
+
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+
+var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
+
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _feedbackSelector = _interopRequireWildcard(require("./feedback-selector"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _styles = require("@material-ui/core/styles");
+
+var _ExpansionPanel = _interopRequireDefault(require("@material-ui/core/ExpansionPanel"));
+
+var _ExpansionPanelSummary = _interopRequireDefault(require("@material-ui/core/ExpansionPanelSummary"));
+
+var _ExpansionPanelDetails = _interopRequireDefault(require("@material-ui/core/ExpansionPanelDetails"));
+
+var _Typography = _interopRequireDefault(require("@material-ui/core/Typography"));
+
+var _ExpandMore = _interopRequireDefault(require("@material-ui/icons/ExpandMore"));
+
+var _merge = _interopRequireDefault(require("lodash/merge"));
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+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 { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+
+var style = {
+  feedbackContainer: {
+    display: 'flex',
+    flex: 1,
+    flexDirection: 'column'
+  },
+  panelDetails: {
+    paddingTop: 0,
+    paddingBottom: 0
+  }
+};
+
+var buildDefaults = function buildDefaults(input) {
+  return (0, _merge["default"])({}, {
+    correct: {
+      type: 'default',
+      "default": 'Correct'
+    },
+    incorrect: {
+      type: 'default',
+      "default": 'Incorrect'
+    },
+    partial: {
+      type: 'default',
+      "default": 'Nearly'
+    }
+  }, input);
+};
+
+exports.buildDefaults = buildDefaults;
+
+var FeedbackConfig = /*#__PURE__*/function (_React$Component) {
+  (0, _inherits2["default"])(FeedbackConfig, _React$Component);
+
+  var _super = _createSuper(FeedbackConfig);
+
+  function FeedbackConfig() {
+    var _this;
+
+    (0, _classCallCheck2["default"])(this, FeedbackConfig);
+
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    _this = _super.call.apply(_super, [this].concat(args));
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "onCorrectChange", _this.onChange.bind((0, _assertThisInitialized2["default"])(_this), 'correct'));
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "onIncorrectChange", _this.onChange.bind((0, _assertThisInitialized2["default"])(_this), 'incorrect'));
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "onPartialChange", _this.onChange.bind((0, _assertThisInitialized2["default"])(_this), 'partial'));
+    return _this;
+  }
+
+  (0, _createClass2["default"])(FeedbackConfig, [{
+    key: "onChange",
+    value: function onChange(key, config) {
+      var _this$props = this.props,
+          feedback = _this$props.feedback,
+          onChange = _this$props.onChange;
+
+      var update = _objectSpread(_objectSpread({}, feedback), {}, (0, _defineProperty2["default"])({}, key, config));
+
+      onChange(update);
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var _this$props2 = this.props,
+          classes = _this$props2.classes,
+          className = _this$props2.className,
+          allowPartial = _this$props2.allowPartial,
+          feedback = _this$props2.feedback,
+          toolbarOpts = _this$props2.toolbarOpts;
+      return /*#__PURE__*/_react["default"].createElement("div", {
+        className: className
+      }, /*#__PURE__*/_react["default"].createElement(_ExpansionPanel["default"], null, /*#__PURE__*/_react["default"].createElement(_ExpansionPanelSummary["default"], {
+        expandIcon: /*#__PURE__*/_react["default"].createElement(_ExpandMore["default"], null)
+      }, /*#__PURE__*/_react["default"].createElement(_Typography["default"], {
+        className: classes.heading
+      }, "Feedback")), /*#__PURE__*/_react["default"].createElement(_ExpansionPanelDetails["default"], {
+        className: classes.panelDetails
+      }, /*#__PURE__*/_react["default"].createElement("div", {
+        className: classes.feedbackContainer
+      }, /*#__PURE__*/_react["default"].createElement(_feedbackSelector["default"], {
+        label: "If correct, show",
+        feedback: feedback.correct,
+        onChange: this.onCorrectChange,
+        toolbarOpts: toolbarOpts
+      }), allowPartial && /*#__PURE__*/_react["default"].createElement(_feedbackSelector["default"], {
+        label: "If partially correct, show",
+        feedback: feedback.partial,
+        onChange: this.onPartialChange,
+        toolbarOpts: toolbarOpts
+      }), /*#__PURE__*/_react["default"].createElement(_feedbackSelector["default"], {
+        label: "If incorrect, show",
+        feedback: feedback.incorrect,
+        onChange: this.onIncorrectChange,
+        toolbarOpts: toolbarOpts
+      })))));
+    }
+  }]);
+  return FeedbackConfig;
+}(_react["default"].Component);
+
+exports.FeedbackConfig = FeedbackConfig;
+(0, _defineProperty2["default"])(FeedbackConfig, "propTypes", {
+  allowPartial: _propTypes["default"].bool,
+  className: _propTypes["default"].string,
+  feedback: _propTypes["default"].shape({
+    correct: _propTypes["default"].shape(_feedbackSelector.FeedbackType),
+    incorrect: _propTypes["default"].shape(_feedbackSelector.FeedbackType),
+    partial: _propTypes["default"].shape(_feedbackSelector.FeedbackType)
+  }),
+  onChange: _propTypes["default"].func.isRequired,
+  classes: _propTypes["default"].object.isRequired,
+  toolbarOpts: _propTypes["default"].object
+});
+(0, _defineProperty2["default"])(FeedbackConfig, "defaultProps", {
+  allowPartial: true,
+  feedback: buildDefaults()
+});
+
+var _default = (0, _styles.withStyles)(style)(FeedbackConfig);
+
+exports["default"] = _default;
+//# sourceMappingURL=index.js.map

package/lib/feedback-config/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/feedback-config/index.jsx"],"names":["style","feedbackContainer","display","flex","flexDirection","panelDetails","paddingTop","paddingBottom","buildDefaults","input","correct","type","incorrect","partial","FeedbackConfig","onChange","bind","key","config","props","feedback","update","classes","className","allowPartial","toolbarOpts","heading","onCorrectChange","onPartialChange","onIncorrectChange","React","Component","PropTypes","bool","string","shape","FeedbackType","func","isRequired","object"],"mappings":"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","sourcesContent":["import FeedbackSelector, { FeedbackType } from './feedback-selector';\nimport PropTypes from 'prop-types';\nimport React from 'react';\nimport { withStyles } from '@material-ui/core/styles';\nimport ExpansionPanel from '@material-ui/core/ExpansionPanel';\nimport ExpansionPanelSummary from '@material-ui/core/ExpansionPanelSummary';\nimport ExpansionPanelDetails from '@material-ui/core/ExpansionPanelDetails';\nimport Typography from '@material-ui/core/Typography';\nimport ExpandMoreIcon from '@material-ui/icons/ExpandMore';\nimport merge from 'lodash/merge';\n\nexport { FeedbackSelector };\n\nconst style = {\n  feedbackContainer: {\n    display: 'flex',\n    flex: 1,\n    flexDirection: 'column',\n  },\n  panelDetails: {\n    paddingTop: 0,\n    paddingBottom: 0,\n  },\n};\n\nexport const buildDefaults = (input) => {\n  return merge(\n    {},\n    {\n      correct: { type: 'default', default: 'Correct' },\n      incorrect: { type: 'default', default: 'Incorrect' },\n      partial: { type: 'default', default: 'Nearly' },\n    },\n    input,\n  );\n};\n\nexport class FeedbackConfig extends React.Component {\n  static propTypes = {\n    allowPartial: PropTypes.bool,\n    className: PropTypes.string,\n    feedback: PropTypes.shape({\n      correct: PropTypes.shape(FeedbackType),\n      incorrect: PropTypes.shape(FeedbackType),\n      partial: PropTypes.shape(FeedbackType),\n    }),\n    onChange: PropTypes.func.isRequired,\n    classes: PropTypes.object.isRequired,\n    toolbarOpts: PropTypes.object,\n  };\n\n  static defaultProps = {\n    allowPartial: true,\n    feedback: buildDefaults(),\n  };\n\n  onChange(key, config) {\n    const { feedback, onChange } = this.props;\n    const update = { ...feedback, [key]: config };\n\n    onChange(update);\n  }\n\n  onCorrectChange = this.onChange.bind(this, 'correct');\n\n  onIncorrectChange = this.onChange.bind(this, 'incorrect');\n\n  onPartialChange = this.onChange.bind(this, 'partial');\n\n  render() {\n    const { classes, className, allowPartial, feedback, toolbarOpts } = this.props;\n\n    return (\n      <div className={className}>\n        <ExpansionPanel>\n          <ExpansionPanelSummary expandIcon={<ExpandMoreIcon />}>\n            <Typography className={classes.heading}>Feedback</Typography>\n          </ExpansionPanelSummary>\n\n          <ExpansionPanelDetails className={classes.panelDetails}>\n            <div className={classes.feedbackContainer}>\n              <FeedbackSelector\n                label=\"If correct, show\"\n                feedback={feedback.correct}\n                onChange={this.onCorrectChange}\n                toolbarOpts={toolbarOpts}\n              />\n\n              {allowPartial && (\n                <FeedbackSelector\n                  label=\"If partially correct, show\"\n                  feedback={feedback.partial}\n                  onChange={this.onPartialChange}\n                  toolbarOpts={toolbarOpts}\n                />\n              )}\n\n              <FeedbackSelector\n                label=\"If incorrect, show\"\n                feedback={feedback.incorrect}\n                onChange={this.onIncorrectChange}\n                toolbarOpts={toolbarOpts}\n              />\n            </div>\n          </ExpansionPanelDetails>\n        </ExpansionPanel>\n      </div>\n    );\n  }\n}\n\nexport default withStyles(style)(FeedbackConfig);\n"],"file":"index.js"}

package/lib/form-section.js

@@ -0,0 +1,46 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _Typography = _interopRequireDefault(require("@material-ui/core/Typography"));
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _styles = require("@material-ui/core/styles");
+
+var styles = function styles(theme) {
+  return {
+    formSection: {
+      marginTop: theme.spacing.unit * 2,
+      marginBottom: theme.spacing.unit * 2
+    },
+    label: {
+      marginBottom: theme.spacing.unit
+    }
+  };
+};
+
+var _default = (0, _styles.withStyles)(styles)(function (_ref) {
+  var className = _ref.className,
+      classes = _ref.classes,
+      label = _ref.label,
+      children = _ref.children,
+      labelExtraStyle = _ref.labelExtraStyle;
+  return /*#__PURE__*/_react["default"].createElement("div", {
+    className: (0, _classnames["default"])(classes.formSection, className)
+  }, /*#__PURE__*/_react["default"].createElement(_Typography["default"], {
+    className: classes.label,
+    type: "subheading",
+    style: labelExtraStyle
+  }, label), children);
+});
+
+exports["default"] = _default;
+//# sourceMappingURL=form-section.js.map

package/lib/form-section.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/form-section.jsx"],"names":["styles","theme","formSection","marginTop","spacing","unit","marginBottom","label","className","classes","children","labelExtraStyle"],"mappings":";;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AAEA,IAAMA,MAAM,GAAG,SAATA,MAAS,CAACC,KAAD;AAAA,SAAY;AACzBC,IAAAA,WAAW,EAAE;AACXC,MAAAA,SAAS,EAAEF,KAAK,CAACG,OAAN,CAAcC,IAAd,GAAqB,CADrB;AAEXC,MAAAA,YAAY,EAAEL,KAAK,CAACG,OAAN,CAAcC,IAAd,GAAqB;AAFxB,KADY;AAKzBE,IAAAA,KAAK,EAAE;AACLD,MAAAA,YAAY,EAAEL,KAAK,CAACG,OAAN,CAAcC;AADvB;AALkB,GAAZ;AAAA,CAAf;;eAUe,wBAAWL,MAAX,EAAmB;AAAA,MAAGQ,SAAH,QAAGA,SAAH;AAAA,MAAcC,OAAd,QAAcA,OAAd;AAAA,MAAuBF,KAAvB,QAAuBA,KAAvB;AAAA,MAA8BG,QAA9B,QAA8BA,QAA9B;AAAA,MAAwCC,eAAxC,QAAwCA,eAAxC;AAAA,sBAChC;AAAK,IAAA,SAAS,EAAE,4BAAWF,OAAO,CAACP,WAAnB,EAAgCM,SAAhC;AAAhB,kBACE,gCAAC,sBAAD;AAAY,IAAA,SAAS,EAAEC,OAAO,CAACF,KAA/B;AAAsC,IAAA,IAAI,EAAC,YAA3C;AAAwD,IAAA,KAAK,EAAEI;AAA/D,KACGJ,KADH,CADF,EAIGG,QAJH,CADgC;AAAA,CAAnB,C","sourcesContent":["import React from 'react';\nimport Typography from '@material-ui/core/Typography';\nimport classNames from 'classnames';\nimport { withStyles } from '@material-ui/core/styles';\n\nconst styles = (theme) => ({\n  formSection: {\n    marginTop: theme.spacing.unit * 2,\n    marginBottom: theme.spacing.unit * 2,\n  },\n  label: {\n    marginBottom: theme.spacing.unit,\n  },\n});\n\nexport default withStyles(styles)(({ className, classes, label, children, labelExtraStyle }) => (\n  <div className={classNames(classes.formSection, className)}>\n    <Typography className={classes.label} type=\"subheading\" style={labelExtraStyle}>\n      {label}\n    </Typography>\n    {children}\n  </div>\n));\n"],"file":"form-section.js"}