@pie-element/categorize 7.7.2-beta.1 → 7.7.2-beta.4

package/lib/categorize/grid-content.js

@@ -0,0 +1,78 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.GridContent = void 0;
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+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 _react = _interopRequireDefault(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _styles = require("@material-ui/core/styles");
+var _classnames = _interopRequireDefault(require("classnames"));
+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 GridContent = /*#__PURE__*/function (_React$Component) {
+  (0, _inherits2["default"])(GridContent, _React$Component);
+  var _super = _createSuper(GridContent);
+  function GridContent() {
+    (0, _classCallCheck2["default"])(this, GridContent);
+    return _super.apply(this, arguments);
+  }
+  (0, _createClass2["default"])(GridContent, [{
+    key: "render",
+    value: function render() {
+      var _this$props = this.props,
+        classes = _this$props.classes,
+        className = _this$props.className,
+        children = _this$props.children,
+        columns = _this$props.columns,
+        extraStyle = _this$props.extraStyle,
+        rows = _this$props.rows;
+      var style = _objectSpread({
+        gridTemplateColumns: "repeat(".concat(columns, ", 1fr)"),
+        gridTemplateRows: "repeat(".concat(rows, ", auto)")
+      }, extraStyle);
+      return /*#__PURE__*/_react["default"].createElement("div", {
+        style: style,
+        className: (0, _classnames["default"])(classes.gridContent, className)
+      }, children);
+    }
+  }]);
+  return GridContent;
+}(_react["default"].Component);
+exports.GridContent = GridContent;
+(0, _defineProperty2["default"])(GridContent, "propTypes", {
+  classes: _propTypes["default"].object.isRequired,
+  className: _propTypes["default"].string,
+  children: _propTypes["default"].oneOfType([_propTypes["default"].arrayOf(_propTypes["default"].node), _propTypes["default"].node]).isRequired,
+  columns: _propTypes["default"].number,
+  rows: _propTypes["default"].number,
+  extraStyle: _propTypes["default"].object
+});
+(0, _defineProperty2["default"])(GridContent, "defaultProps", {
+  columns: 2,
+  rows: 2
+});
+var styles = function styles(theme) {
+  return {
+    gridContent: {
+      display: 'grid',
+      columnGap: "".concat(theme.spacing.unit, "px"),
+      gridColumnGap: "".concat(theme.spacing.unit, "px"),
+      rowGap: "".concat(theme.spacing.unit, "px"),
+      gridRowGap: "".concat(theme.spacing.unit, "px"),
+      gridAutoRows: '1fr'
+    }
+  };
+};
+var _default = (0, _styles.withStyles)(styles)(GridContent);
+exports["default"] = _default;
+//# sourceMappingURL=grid-content.js.map

package/lib/categorize/grid-content.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"grid-content.js","names":["_react","_interopRequireDefault","require","_propTypes","_styles","_classnames","ownKeys","object","enumerableOnly","keys","Object","getOwnPropertySymbols","symbols","filter","sym","getOwnPropertyDescriptor","enumerable","push","apply","_objectSpread","target","i","arguments","length","source","forEach","key","_defineProperty2","getOwnPropertyDescriptors","defineProperties","defineProperty","_createSuper","Derived","hasNativeReflectConstruct","_isNativeReflectConstruct","_createSuperInternal","Super","_getPrototypeOf2","result","NewTarget","constructor","Reflect","construct","_possibleConstructorReturn2","sham","Proxy","Boolean","prototype","valueOf","call","e","GridContent","_React$Component","_inherits2","_super","_classCallCheck2","_createClass2","value","render","_this$props","props","classes","className","children","columns","extraStyle","rows","style","gridTemplateColumns","concat","gridTemplateRows","createElement","classNames","gridContent","React","Component","exports","PropTypes","isRequired","string","oneOfType","arrayOf","node","number","styles","theme","display","columnGap","spacing","unit","gridColumnGap","rowGap","gridRowGap","gridAutoRows","_default","withStyles"],"sources":["../../src/categorize/grid-content.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { withStyles } from '@material-ui/core/styles';\nimport classNames from 'classnames';\n\nexport class GridContent extends React.Component {\n  static propTypes = {\n    classes: PropTypes.object.isRequired,\n    className: PropTypes.string,\n    children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]).isRequired,\n    columns: PropTypes.number,\n    rows: PropTypes.number,\n    extraStyle: PropTypes.object,\n  };\n  static defaultProps = {\n    columns: 2,\n    rows: 2,\n  };\n\n  render() {\n    const { classes, className, children, columns, extraStyle, rows } = this.props;\n    const style = {\n      gridTemplateColumns: `repeat(${columns}, 1fr)`,\n      gridTemplateRows: `repeat(${rows}, auto)`,\n      ...extraStyle,\n    };\n\n    return (\n      <div style={style} className={classNames(classes.gridContent, className)}>\n        {children}\n      </div>\n    );\n  }\n}\n\nconst styles = (theme) => ({\n  gridContent: {\n    display: 'grid',\n    columnGap: `${theme.spacing.unit}px`,\n    gridColumnGap: `${theme.spacing.unit}px`,\n    rowGap: `${theme.spacing.unit}px`,\n    gridRowGap: `${theme.spacing.unit}px`,\n    gridAutoRows: '1fr',\n  },\n});\n\nexport default withStyles(styles)(GridContent);\n"],"mappings":";;;;;;;;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,UAAA,GAAAF,sBAAA,CAAAC,OAAA;AACA,IAAAE,OAAA,GAAAF,OAAA;AACA,IAAAG,WAAA,GAAAJ,sBAAA,CAAAC,OAAA;AAAoC,SAAAI,QAAAC,MAAA,EAAAC,cAAA,QAAAC,IAAA,GAAAC,MAAA,CAAAD,IAAA,CAAAF,MAAA,OAAAG,MAAA,CAAAC,qBAAA,QAAAC,OAAA,GAAAF,MAAA,CAAAC,qBAAA,CAAAJ,MAAA,GAAAC,cAAA,KAAAI,OAAA,GAAAA,OAAA,CAAAC,MAAA,WAAAC,GAAA,WAAAJ,MAAA,CAAAK,wBAAA,CAAAR,MAAA,EAAAO,GAAA,EAAAE,UAAA,OAAAP,IAAA,CAAAQ,IAAA,CAAAC,KAAA,CAAAT,IAAA,EAAAG,OAAA,YAAAH,IAAA;AAAA,SAAAU,cAAAC,MAAA,aAAAC,CAAA,MAAAA,CAAA,GAAAC,SAAA,CAAAC,MAAA,EAAAF,CAAA,UAAAG,MAAA,WAAAF,SAAA,CAAAD,CAAA,IAAAC,SAAA,CAAAD,CAAA,QAAAA,CAAA,OAAAf,OAAA,CAAAI,MAAA,CAAAc,MAAA,OAAAC,OAAA,WAAAC,GAAA,QAAAC,gBAAA,aAAAP,MAAA,EAAAM,GAAA,EAAAF,MAAA,CAAAE,GAAA,SAAAhB,MAAA,CAAAkB,yBAAA,GAAAlB,MAAA,CAAAmB,gBAAA,CAAAT,MAAA,EAAAV,MAAA,CAAAkB,yBAAA,CAAAJ,MAAA,KAAAlB,OAAA,CAAAI,MAAA,CAAAc,MAAA,GAAAC,OAAA,WAAAC,GAAA,IAAAhB,MAAA,CAAAoB,cAAA,CAAAV,MAAA,EAAAM,GAAA,EAAAhB,MAAA,CAAAK,wBAAA,CAAAS,MAAA,EAAAE,GAAA,iBAAAN,MAAA;AAAA,SAAAW,aAAAC,OAAA,QAAAC,yBAAA,GAAAC,yBAAA,oBAAAC,qBAAA,QAAAC,KAAA,OAAAC,gBAAA,aAAAL,OAAA,GAAAM,MAAA,MAAAL,yBAAA,QAAAM,SAAA,OAAAF,gBAAA,mBAAAG,WAAA,EAAAF,MAAA,GAAAG,OAAA,CAAAC,SAAA,CAAAN,KAAA,EAAAd,SAAA,EAAAiB,SAAA,YAAAD,MAAA,GAAAF,KAAA,CAAAlB,KAAA,OAAAI,SAAA,gBAAAqB,2BAAA,mBAAAL,MAAA;AAAA,SAAAJ,0BAAA,eAAAO,OAAA,qBAAAA,OAAA,CAAAC,SAAA,oBAAAD,OAAA,CAAAC,SAAA,CAAAE,IAAA,2BAAAC,KAAA,oCAAAC,OAAA,CAAAC,SAAA,CAAAC,OAAA,CAAAC,IAAA,CAAAR,OAAA,CAAAC,SAAA,CAAAI,OAAA,8CAAAI,CAAA;AAAA,IAEvBC,WAAW,0BAAAC,gBAAA;EAAA,IAAAC,UAAA,aAAAF,WAAA,EAAAC,gBAAA;EAAA,IAAAE,MAAA,GAAAvB,YAAA,CAAAoB,WAAA;EAAA,SAAAA,YAAA;IAAA,IAAAI,gBAAA,mBAAAJ,WAAA;IAAA,OAAAG,MAAA,CAAApC,KAAA,OAAAI,SAAA;EAAA;EAAA,IAAAkC,aAAA,aAAAL,WAAA;IAAAzB,GAAA;IAAA+B,KAAA,EActB,SAAAC,OAAA,EAAS;MACP,IAAAC,WAAA,GAAoE,IAAI,CAACC,KAAK;QAAtEC,OAAO,GAAAF,WAAA,CAAPE,OAAO;QAAEC,SAAS,GAAAH,WAAA,CAATG,SAAS;QAAEC,QAAQ,GAAAJ,WAAA,CAARI,QAAQ;QAAEC,OAAO,GAAAL,WAAA,CAAPK,OAAO;QAAEC,UAAU,GAAAN,WAAA,CAAVM,UAAU;QAAEC,IAAI,GAAAP,WAAA,CAAJO,IAAI;MAC/D,IAAMC,KAAK,GAAAhD,aAAA;QACTiD,mBAAmB,YAAAC,MAAA,CAAYL,OAAO,WAAQ;QAC9CM,gBAAgB,YAAAD,MAAA,CAAYH,IAAI;MAAS,GACtCD,UAAU,CACd;MAED,oBACEjE,MAAA,YAAAuE,aAAA;QAAKJ,KAAK,EAAEA,KAAM;QAACL,SAAS,EAAE,IAAAU,sBAAU,EAACX,OAAO,CAACY,WAAW,EAAEX,SAAS;MAAE,GACtEC,QACE,CAAC;IAEV;EAAC;EAAA,OAAAZ,WAAA;AAAA,EA3B8BuB,iBAAK,CAACC,SAAS;AAAAC,OAAA,CAAAzB,WAAA,GAAAA,WAAA;AAAA,IAAAxB,gBAAA,aAAnCwB,WAAW,eACH;EACjBU,OAAO,EAAEgB,qBAAS,CAACtE,MAAM,CAACuE,UAAU;EACpChB,SAAS,EAAEe,qBAAS,CAACE,MAAM;EAC3BhB,QAAQ,EAAEc,qBAAS,CAACG,SAAS,CAAC,CAACH,qBAAS,CAACI,OAAO,CAACJ,qBAAS,CAACK,IAAI,CAAC,EAAEL,qBAAS,CAACK,IAAI,CAAC,CAAC,CAACJ,UAAU;EAC7Fd,OAAO,EAAEa,qBAAS,CAACM,MAAM;EACzBjB,IAAI,EAAEW,qBAAS,CAACM,MAAM;EACtBlB,UAAU,EAAEY,qBAAS,CAACtE;AACxB,CAAC;AAAA,IAAAoB,gBAAA,aARUwB,WAAW,kBASA;EACpBa,OAAO,EAAE,CAAC;EACVE,IAAI,EAAE;AACR,CAAC;AAkBH,IAAMkB,MAAM,GAAG,SAATA,MAAMA,CAAIC,KAAK;EAAA,OAAM;IACzBZ,WAAW,EAAE;MACXa,OAAO,EAAE,MAAM;MACfC,SAAS,KAAAlB,MAAA,CAAKgB,KAAK,CAACG,OAAO,CAACC,IAAI,OAAI;MACpCC,aAAa,KAAArB,MAAA,CAAKgB,KAAK,CAACG,OAAO,CAACC,IAAI,OAAI;MACxCE,MAAM,KAAAtB,MAAA,CAAKgB,KAAK,CAACG,OAAO,CAACC,IAAI,OAAI;MACjCG,UAAU,KAAAvB,MAAA,CAAKgB,KAAK,CAACG,OAAO,CAACC,IAAI,OAAI;MACrCI,YAAY,EAAE;IAChB;EACF,CAAC;AAAA,CAAC;AAAC,IAAAC,QAAA,GAEY,IAAAC,kBAAU,EAACX,MAAM,CAAC,CAACjC,WAAW,CAAC;AAAAyB,OAAA,cAAAkB,QAAA"}

package/lib/categorize/index.js

@@ -0,0 +1,275 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.Categorize = 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 _react = _interopRequireDefault(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _choices = _interopRequireDefault(require("./choices"));
+var _categories = _interopRequireDefault(require("./categories"));
+var _correctAnswerToggle = _interopRequireDefault(require("@pie-lib/correct-answer-toggle"));
+var _styles = require("@material-ui/core/styles");
+var _categorize = require("@pie-lib/categorize");
+var _drag = require("@pie-lib/drag");
+var _renderUi = require("@pie-lib/render-ui");
+var _debug = _interopRequireDefault(require("debug"));
+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 log = (0, _debug["default"])('@pie-ui:categorize');
+var removeHTMLTags = function removeHTMLTags(html) {
+  var tmp = document.createElement('DIV');
+  tmp.innerHTML = html;
+  var value = tmp.textContent || tmp.innerText || '';
+  return value.trim();
+};
+var Categorize = /*#__PURE__*/function (_React$Component) {
+  (0, _inherits2["default"])(Categorize, _React$Component);
+  var _super = _createSuper(Categorize);
+  function Categorize(props) {
+    var _this;
+    (0, _classCallCheck2["default"])(this, Categorize);
+    _this = _super.call(this, props);
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "removeChoice", function (c) {
+      log('[removeChoice]: ', c);
+      var _this$props = _this.props,
+        onAnswersChange = _this$props.onAnswersChange,
+        session = _this$props.session;
+      var answers = (0, _categorize.removeChoiceFromCategory)(c.id, c.categoryId, c.choiceIndex, session.answers);
+      onAnswersChange(answers);
+    });
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "dropChoice", function (categoryId, draggedChoice) {
+      var _this$props2 = _this.props,
+        session = _this$props2.session,
+        onAnswersChange = _this$props2.onAnswersChange;
+      if (draggedChoice) {
+        log('[dropChoice] category: ', draggedChoice.categoryId, 'choice: ', draggedChoice);
+      } else {
+        log('[dropChoice] category: ', undefined, 'choice: ', undefined);
+      }
+      var answers = draggedChoice ? (0, _categorize.moveChoiceToCategory)(draggedChoice.id, draggedChoice.categoryId, categoryId, draggedChoice.choiceIndex, session.answers) : _this.removeChoice(categoryId);
+      if (draggedChoice) {
+        onAnswersChange(answers);
+      }
+    });
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "toggleShowCorrect", function () {
+      return _this.setState({
+        showCorrect: !_this.state.showCorrect
+      }, function () {
+        _this.props.onShowCorrectToggle();
+      });
+    });
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "getPositionDirection", function (choicePosition) {
+      var flexDirection;
+      switch (choicePosition) {
+        case 'left':
+          flexDirection = 'row-reverse';
+          break;
+        case 'right':
+          flexDirection = 'row';
+          break;
+        case 'below':
+          flexDirection = 'column';
+          break;
+        default:
+          // above
+          flexDirection = 'column-reverse';
+          break;
+      }
+      return flexDirection;
+    });
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "existAlternateResponse", function (correctResponse) {
+      return correctResponse === null || correctResponse === void 0 ? void 0 : correctResponse.some(function (correctRes) {
+        var _correctRes$alternate;
+        return ((_correctRes$alternate = correctRes.alternateResponses) === null || _correctRes$alternate === void 0 ? void 0 : _correctRes$alternate.length) > 0;
+      });
+    });
+    _this.state = {
+      showCorrect: false
+    };
+    return _this;
+  }
+  (0, _createClass2["default"])(Categorize, [{
+    key: "UNSAFE_componentWillReceiveProps",
+    value: function UNSAFE_componentWillReceiveProps() {
+      this.setState({
+        showCorrect: false
+      });
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var _this$props3 = this.props,
+        classes = _this$props3.classes,
+        model = _this$props3.model,
+        session = _this$props3.session;
+      var showCorrect = this.state.showCorrect;
+      var choicesPosition = model.choicesPosition,
+        note = model.note,
+        showNote = model.showNote,
+        env = model.env;
+      var _ref = env || {},
+        mode = _ref.mode,
+        role = _ref.role;
+      var choicePosition = choicesPosition || 'above';
+      var style = {
+        flexDirection: this.getPositionDirection(choicePosition)
+      };
+      var _buildState = (0, _categorize.buildState)(model.categories, model.choices, showCorrect ? model.correctResponse : session.answers, model.correctResponse),
+        categories = _buildState.categories,
+        choices = _buildState.choices,
+        correct = _buildState.correct;
+      log('[render] disabled: ', model.disabled);
+      var rowLabels = model.rowLabels,
+        categoriesPerRow = model.categoriesPerRow,
+        correctResponse = model.correctResponse;
+      var nbOfRows = categories && Math.ceil(categories.length / categoriesPerRow) || 0;
+      var existAlternate = this.existAlternateResponse(correctResponse) || false;
+      var displayNote = (showCorrect || mode === 'view' && role === 'instructor') && showNote && note && existAlternate;
+      return /*#__PURE__*/_react["default"].createElement("div", {
+        className: classes.mainContainer
+      }, model.teacherInstructions && (0, _renderUi.hasText)(model.teacherInstructions) && /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_renderUi.Collapsible, {
+        labels: {
+          hidden: 'Show Teacher Instructions',
+          visible: 'Hide Teacher Instructions'
+        },
+        className: classes.collapsible
+      }, /*#__PURE__*/_react["default"].createElement(_renderUi.PreviewPrompt, {
+        prompt: model.teacherInstructions
+      })), /*#__PURE__*/_react["default"].createElement("br", null)), /*#__PURE__*/_react["default"].createElement(_correctAnswerToggle["default"], {
+        show: showCorrect || correct === false,
+        toggled: showCorrect,
+        onToggle: this.toggleShowCorrect
+      }), model.prompt && removeHTMLTags(model.prompt) && /*#__PURE__*/_react["default"].createElement("div", {
+        className: classes.prompt
+      }, /*#__PURE__*/_react["default"].createElement(_renderUi.PreviewPrompt, {
+        prompt: model.prompt
+      })), /*#__PURE__*/_react["default"].createElement("div", {
+        className: classes.categorize,
+        style: style
+      }, /*#__PURE__*/_react["default"].createElement("div", {
+        style: {
+          display: 'flex',
+          flex: 1
+        }
+      }, !!(rowLabels && nbOfRows) && /*#__PURE__*/_react["default"].createElement("div", {
+        style: {
+          display: 'grid'
+        }
+      }, rowLabels.slice(0, nbOfRows).map(function (label, index) {
+        return /*#__PURE__*/_react["default"].createElement("div", {
+          key: index,
+          style: {
+            alignItems: 'center',
+            display: 'flex',
+            justifyContent: 'center'
+          },
+          dangerouslySetInnerHTML: {
+            __html: label
+          }
+        });
+      })), /*#__PURE__*/_react["default"].createElement(_categories["default"], {
+        model: model,
+        disabled: model.disabled,
+        categories: categories,
+        onDropChoice: this.dropChoice,
+        onRemoveChoice: this.removeChoice
+      })), /*#__PURE__*/_react["default"].createElement(_choices["default"], {
+        disabled: model.disabled,
+        model: model,
+        choices: choices,
+        choicePosition: choicePosition,
+        onDropChoice: this.dropChoice,
+        onRemoveChoice: this.removeChoice
+      })), displayNote && /*#__PURE__*/_react["default"].createElement("div", {
+        className: classes.note,
+        dangerouslySetInnerHTML: {
+          __html: "<strong>Note:</strong> ".concat(note)
+        }
+      }), model.rationale && (0, _renderUi.hasText)(model.rationale) && /*#__PURE__*/_react["default"].createElement(_renderUi.Collapsible, {
+        labels: {
+          hidden: 'Show Rationale',
+          visible: 'Hide Rationale'
+        },
+        className: classes.collapsible
+      }, /*#__PURE__*/_react["default"].createElement(_renderUi.PreviewPrompt, {
+        prompt: model.rationale
+      })), model.correctness && model.feedback && !showCorrect && /*#__PURE__*/_react["default"].createElement(_renderUi.Feedback, {
+        correctness: model.correctness,
+        feedback: model.feedback
+      }));
+    }
+  }]);
+  return Categorize;
+}(_react["default"].Component);
+exports.Categorize = Categorize;
+(0, _defineProperty2["default"])(Categorize, "propTypes", {
+  classes: _propTypes["default"].object.isRequired,
+  model: _propTypes["default"].object,
+  session: _propTypes["default"].shape({
+    answers: _propTypes["default"].arrayOf(_propTypes["default"].shape({
+      choice: _propTypes["default"].string,
+      category: _propTypes["default"].string
+    }))
+  }),
+  onAnswersChange: _propTypes["default"].func.isRequired,
+  onShowCorrectToggle: _propTypes["default"].func.isRequired
+});
+(0, _defineProperty2["default"])(Categorize, "defaultProps", {
+  disabled: false
+});
+var CategorizeProvider = /*#__PURE__*/function (_React$Component2) {
+  (0, _inherits2["default"])(CategorizeProvider, _React$Component2);
+  var _super2 = _createSuper(CategorizeProvider);
+  function CategorizeProvider(props) {
+    var _this2;
+    (0, _classCallCheck2["default"])(this, CategorizeProvider);
+    _this2 = _super2.call(this, props);
+    _this2.uid = _drag.uid.generateId();
+    return _this2;
+  }
+  (0, _createClass2["default"])(CategorizeProvider, [{
+    key: "render",
+    value: function render() {
+      return /*#__PURE__*/_react["default"].createElement(_drag.uid.Provider, {
+        value: this.uid
+      }, /*#__PURE__*/_react["default"].createElement(Categorize, this.props));
+    }
+  }]);
+  return CategorizeProvider;
+}(_react["default"].Component);
+var styles = function styles(theme) {
+  return {
+    mainContainer: {
+      padding: theme.spacing.unit,
+      color: _renderUi.color.text(),
+      backgroundColor: _renderUi.color.background()
+    },
+    prompt: {
+      marginBottom: '35px',
+      verticalAlign: 'middle'
+    },
+    note: {
+      padding: '5px 0'
+    },
+    categorize: {
+      marginBottom: theme.spacing.unit,
+      display: 'flex',
+      flexDirection: 'column'
+    },
+    collapsible: {
+      paddingBottom: theme.spacing.unit * 2
+    }
+  };
+};
+var _default = (0, _drag.withDragContext)((0, _styles.withStyles)(styles)(CategorizeProvider));
+exports["default"] = _default;
+//# sourceMappingURL=index.js.map

package/lib/categorize/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["_react","_interopRequireDefault","require","_propTypes","_choices","_categories","_correctAnswerToggle","_styles","_categorize","_drag","_renderUi","_debug","_createSuper","Derived","hasNativeReflectConstruct","_isNativeReflectConstruct","_createSuperInternal","Super","_getPrototypeOf2","result","NewTarget","constructor","Reflect","construct","arguments","apply","_possibleConstructorReturn2","sham","Proxy","Boolean","prototype","valueOf","call","e","log","debug","removeHTMLTags","html","tmp","document","createElement","innerHTML","value","textContent","innerText","trim","Categorize","_React$Component","_inherits2","_super","props","_this","_classCallCheck2","_defineProperty2","_assertThisInitialized2","c","_this$props","onAnswersChange","session","answers","removeChoiceFromCategory","id","categoryId","choiceIndex","draggedChoice","_this$props2","undefined","moveChoiceToCategory","removeChoice","setState","showCorrect","state","onShowCorrectToggle","choicePosition","flexDirection","correctResponse","some","correctRes","_correctRes$alternate","alternateResponses","length","_createClass2","key","UNSAFE_componentWillReceiveProps","render","_this$props3","classes","model","choicesPosition","note","showNote","env","_ref","mode","role","style","getPositionDirection","_buildState","buildState","categories","choices","correct","disabled","rowLabels","categoriesPerRow","nbOfRows","Math","ceil","existAlternate","existAlternateResponse","displayNote","className","mainContainer","teacherInstructions","hasText","Fragment","Collapsible","labels","hidden","visible","collapsible","PreviewPrompt","prompt","show","toggled","onToggle","toggleShowCorrect","categorize","display","flex","slice","map","label","index","alignItems","justifyContent","dangerouslySetInnerHTML","__html","onDropChoice","dropChoice","onRemoveChoice","concat","rationale","correctness","feedback","Feedback","React","Component","exports","PropTypes","object","isRequired","shape","arrayOf","choice","string","category","func","CategorizeProvider","_React$Component2","_super2","_this2","uid","generateId","Provider","styles","theme","padding","spacing","unit","color","text","backgroundColor","background","marginBottom","verticalAlign","paddingBottom","_default","withDragContext","withStyles"],"sources":["../../src/categorize/index.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport Choices from './choices';\nimport Categories from './categories';\nimport CorrectAnswerToggle from '@pie-lib/correct-answer-toggle';\nimport { withStyles } from '@material-ui/core/styles';\nimport {\n  buildState,\n  removeChoiceFromCategory,\n  moveChoiceToCategory,\n} from '@pie-lib/categorize';\nimport { withDragContext, uid } from '@pie-lib/drag';\nimport {\n  color,\n  Feedback,\n  Collapsible,\n  hasText,\n  PreviewPrompt,\n} from '@pie-lib/render-ui';\nimport debug from 'debug';\n\nconst log = debug('@pie-ui:categorize');\n\nconst removeHTMLTags = (html) => {\n  const tmp = document.createElement('DIV');\n\n  tmp.innerHTML = html;\n\n  const value = tmp.textContent || tmp.innerText || '';\n\n  return value.trim();\n};\n\nexport class Categorize extends React.Component {\n  static propTypes = {\n    classes: PropTypes.object.isRequired,\n    model: PropTypes.object,\n    session: PropTypes.shape({\n      answers: PropTypes.arrayOf(\n        PropTypes.shape({\n          choice: PropTypes.string,\n          category: PropTypes.string,\n        })\n      ),\n    }),\n    onAnswersChange: PropTypes.func.isRequired,\n    onShowCorrectToggle: PropTypes.func.isRequired,\n  };\n\n  static defaultProps = {\n    disabled: false,\n  };\n\n  constructor(props) {\n    super(props);\n\n    this.state = {\n      showCorrect: false,\n    };\n  }\n\n  removeChoice = (c) => {\n    log('[removeChoice]: ', c);\n    const { onAnswersChange, session } = this.props;\n    const answers = removeChoiceFromCategory(\n      c.id,\n      c.categoryId,\n      c.choiceIndex,\n      session.answers\n    );\n    onAnswersChange(answers);\n  };\n\n  dropChoice = (categoryId, draggedChoice) => {\n    const { session, onAnswersChange } = this.props;\n    if (draggedChoice) {\n      log(\n        '[dropChoice] category: ',\n        draggedChoice.categoryId,\n        'choice: ',\n        draggedChoice\n      );\n    } else {\n      log('[dropChoice] category: ', undefined, 'choice: ', undefined);\n    }\n\n    const answers = draggedChoice ? moveChoiceToCategory(\n      draggedChoice.id,\n      draggedChoice.categoryId,\n      categoryId,\n      draggedChoice.choiceIndex,\n      session.answers\n    ) : this.removeChoice(categoryId)\n\n    if (draggedChoice) {\n      onAnswersChange(answers);\n    } \n  };\n\n  UNSAFE_componentWillReceiveProps() {\n    this.setState({ showCorrect: false });\n  }\n\n  toggleShowCorrect = () =>\n    this.setState({ showCorrect: !this.state.showCorrect }, () => {\n      this.props.onShowCorrectToggle();\n    });\n\n  getPositionDirection = (choicePosition) => {\n    let flexDirection;\n\n    switch (choicePosition) {\n      case 'left':\n        flexDirection = 'row-reverse';\n        break;\n      case 'right':\n        flexDirection = 'row';\n        break;\n      case 'below':\n        flexDirection = 'column';\n        break;\n      default:\n        // above\n        flexDirection = 'column-reverse';\n        break;\n    }\n\n    return flexDirection;\n  };\n\n  existAlternateResponse = (correctResponse) => correctResponse?.some(correctRes => correctRes.alternateResponses?.length > 0);\n\n  render() {\n    const { classes, model, session } = this.props;\n    const { showCorrect } = this.state;\n    const { choicesPosition, note, showNote, env } = model;\n    const { mode, role } = env || {};\n    const choicePosition = choicesPosition || 'above';\n\n    const style = {\n      flexDirection: this.getPositionDirection(choicePosition),\n    };\n\n    const { categories, choices, correct } = buildState(\n      model.categories,\n      model.choices,\n      showCorrect ? model.correctResponse : session.answers,\n      model.correctResponse\n    );\n\n    log('[render] disabled: ', model.disabled);\n    \n    const { rowLabels, categoriesPerRow, correctResponse } = model;\n    const nbOfRows = categories && Math.ceil(categories.length / categoriesPerRow) || 0;\n    const existAlternate = this.existAlternateResponse(correctResponse) || false;\n    const displayNote = (showCorrect || mode === 'view' && role === 'instructor') && showNote && note && existAlternate;\n\n    return (\n      <div className={classes.mainContainer}>\n        {model.teacherInstructions && hasText(model.teacherInstructions) && (\n          <React.Fragment>\n            <Collapsible\n              labels={{\n                hidden: 'Show Teacher Instructions',\n                visible: 'Hide Teacher Instructions',\n              }}\n              className={classes.collapsible}\n            >\n              <PreviewPrompt prompt={model.teacherInstructions} />\n            </Collapsible>\n            <br />\n          </React.Fragment>\n        )}\n        <CorrectAnswerToggle\n          show={showCorrect || correct === false}\n          toggled={showCorrect}\n          onToggle={this.toggleShowCorrect}\n        />\n        {model.prompt && removeHTMLTags(model.prompt) && (\n          <div className={classes.prompt}>\n            <PreviewPrompt prompt={model.prompt} />\n          </div>\n        )}\n        <div className={classes.categorize} style={style}>\n          <div style={{ display: 'flex', flex: 1 }}>\n\n            {\n              !!(rowLabels && nbOfRows) && (\n                <div style={{ display: 'grid'}}>\n                  {rowLabels.slice(0, nbOfRows).map((label, index) => (\n                    <div\n                      key={index}\n                      style={{\n                        alignItems: 'center',\n                        display: 'flex',\n                        justifyContent: 'center'\n                      }}\n                      dangerouslySetInnerHTML={{\n                        __html: label\n                      }}\n                    />\n                  ))}\n                </div>\n              )\n            }\n            <Categories\n              model={model}\n              disabled={model.disabled}\n              categories={categories}\n              onDropChoice={this.dropChoice}\n              onRemoveChoice={this.removeChoice}\n            />\n          </div>\n          <Choices\n            disabled={model.disabled}\n            model={model}\n            choices={choices}\n            choicePosition={choicePosition}\n            onDropChoice={this.dropChoice}\n            onRemoveChoice={this.removeChoice}\n          />\n        </div>\n        {displayNote && (\n          <div\n            className={classes.note}\n            dangerouslySetInnerHTML={{\n              __html: `<strong>Note:</strong> ${note}`,\n            }}\n          />\n        )}\n        {model.rationale && hasText(model.rationale) && (\n          <Collapsible\n            labels={{ hidden: 'Show Rationale', visible: 'Hide Rationale' }}\n            className={classes.collapsible}\n          >\n            <PreviewPrompt prompt={model.rationale} />\n          </Collapsible>\n        )}\n        {model.correctness && model.feedback && !showCorrect && (\n          <Feedback correctness={model.correctness} feedback={model.feedback} />\n        )}\n      </div>\n    );\n  }\n}\n\nclass CategorizeProvider extends React.Component {\n  constructor(props) {\n    super(props);\n    this.uid = uid.generateId();\n  }\n\n  render() {\n    return (\n      <uid.Provider value={this.uid}>\n        <Categorize {...this.props} />\n      </uid.Provider>\n    );\n  }\n}\n\nconst styles = (theme) => ({\n  mainContainer: {\n    padding: theme.spacing.unit,\n    color: color.text(),\n    backgroundColor: color.background(),\n  },\n  prompt: {\n    marginBottom: '35px',\n    verticalAlign: 'middle',\n  },\n  note: {\n    padding: '5px 0',\n  },\n  categorize: {\n    marginBottom: theme.spacing.unit,\n    display: 'flex',\n    flexDirection: 'column',\n  },\n  collapsible: {\n    paddingBottom: theme.spacing.unit * 2,\n  },\n});\n\nexport default withDragContext(withStyles(styles)(CategorizeProvider));\n"],"mappings":"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"}

package/lib/index.js

@@ -0,0 +1,87 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+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 _wrapNativeSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/wrapNativeSuper"));
+var _react = _interopRequireDefault(require("react"));
+var _reactDom = _interopRequireDefault(require("react-dom"));
+var _mathRendering = require("@pie-lib/math-rendering");
+var _piePlayerEvents = require("@pie-framework/pie-player-events");
+var _categorize = _interopRequireDefault(require("./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 { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+var Categorize = /*#__PURE__*/function (_HTMLElement) {
+  (0, _inherits2["default"])(Categorize, _HTMLElement);
+  var _super = _createSuper(Categorize);
+  function Categorize() {
+    (0, _classCallCheck2["default"])(this, Categorize);
+    return _super.apply(this, arguments);
+  }
+  (0, _createClass2["default"])(Categorize, [{
+    key: "model",
+    set: function set(m) {
+      this._model = m;
+      this.dispatchEvent(new _piePlayerEvents.ModelSetEvent(this.tagName.toLowerCase(), this.isComplete(), !!this._model));
+      this.render();
+    }
+  }, {
+    key: "isComplete",
+    value: function isComplete() {
+      if (!this._session) {
+        return false;
+      }
+      return Array.isArray(this._session.answers) && this._session.answers.length > 0;
+    }
+  }, {
+    key: "session",
+    get: function get() {
+      return this._session;
+    },
+    set: function set(s) {
+      if (s && !s.answers) {
+        s.answers = [];
+      }
+      this._session = s;
+      this.render();
+    }
+  }, {
+    key: "changeAnswers",
+    value: function changeAnswers(answers) {
+      this._session.answers = answers;
+      this.dispatchEvent(new _piePlayerEvents.SessionChangedEvent(this.tagName.toLowerCase(), this.isComplete()));
+      this.render();
+    }
+  }, {
+    key: "onShowCorrectToggle",
+    value: function onShowCorrectToggle() {
+      (0, _mathRendering.renderMath)(this);
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var _this = this;
+      if (this._model && this._session) {
+        var el = /*#__PURE__*/_react["default"].createElement(_categorize["default"], {
+          model: this._model,
+          session: this._session,
+          onAnswersChange: this.changeAnswers.bind(this),
+          onShowCorrectToggle: this.onShowCorrectToggle.bind(this)
+        });
+        _reactDom["default"].render(el, this, function () {
+          (0, _mathRendering.renderMath)(_this);
+        });
+      }
+    }
+  }]);
+  return Categorize;
+}( /*#__PURE__*/(0, _wrapNativeSuper2["default"])(HTMLElement));
+exports["default"] = Categorize;
+//# sourceMappingURL=index.js.map

package/lib/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["_react","_interopRequireDefault","require","_reactDom","_mathRendering","_piePlayerEvents","_categorize","_createSuper","Derived","hasNativeReflectConstruct","_isNativeReflectConstruct","_createSuperInternal","Super","_getPrototypeOf2","result","NewTarget","constructor","Reflect","construct","arguments","apply","_possibleConstructorReturn2","sham","Proxy","Boolean","prototype","valueOf","call","e","Categorize","_HTMLElement","_inherits2","_super","_classCallCheck2","_createClass2","key","set","m","_model","dispatchEvent","ModelSetEvent","tagName","toLowerCase","isComplete","render","value","_session","Array","isArray","answers","length","get","s","changeAnswers","SessionChangedEvent","onShowCorrectToggle","renderMath","_this","el","React","createElement","CategorizeComponent","model","session","onAnswersChange","bind","ReactDOM","_wrapNativeSuper2","HTMLElement","exports"],"sources":["../src/index.js"],"sourcesContent":["import React from 'react';\nimport ReactDOM from 'react-dom';\nimport { renderMath } from '@pie-lib/math-rendering';\nimport { SessionChangedEvent, ModelSetEvent } from '@pie-framework/pie-player-events';\nimport CategorizeComponent from './categorize';\n\nexport default class Categorize extends HTMLElement {\n  set model(m) {\n    this._model = m;\n\n    this.dispatchEvent(new ModelSetEvent(this.tagName.toLowerCase(), this.isComplete(), !!this._model));\n    this.render();\n  }\n\n  isComplete() {\n    if (!this._session) {\n      return false;\n    }\n\n    return Array.isArray(this._session.answers) && this._session.answers.length > 0;\n  }\n\n  set session(s) {\n    if (s && !s.answers) {\n      s.answers = [];\n    }\n\n    this._session = s;\n    this.render();\n  }\n\n  get session() {\n    return this._session;\n  }\n\n  changeAnswers(answers) {\n    this._session.answers = answers;\n\n    this.dispatchEvent(new SessionChangedEvent(this.tagName.toLowerCase(), this.isComplete()));\n\n    this.render();\n  }\n\n  onShowCorrectToggle() {\n    renderMath(this);\n  }\n\n  render() {\n    if (this._model && this._session) {\n      const el = React.createElement(CategorizeComponent, {\n        model: this._model,\n        session: this._session,\n        onAnswersChange: this.changeAnswers.bind(this),\n        onShowCorrectToggle: this.onShowCorrectToggle.bind(this),\n      });\n\n      ReactDOM.render(el, this, () => {\n        renderMath(this);\n      });\n    }\n  }\n}\n"],"mappings":"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"}

package/package.json

@@ -4,7 +4,7 @@
   "publishConfig": {
     "access": "public"
   },
-  "version": "7.7.2-beta.1+73223f303",
+  "version": "7.7.2-beta.4+4157b2b34",
   "description": "",
   "author": "pie framework developers",
   "license": "ISC",
@@ -25,7 +25,7 @@
     "react-dnd": "^14.0.5",
     "react-dom": "^16.8.1"
   },
-  "gitHead": "73223f303ea31ca510b096d77e6fb06382b0f0c6",
+  "gitHead": "4157b2b34711d36e3fea05d833ab5ed9d4b05b48",
   "scripts": {
     "postpublish": "../../scripts/postpublish"
   },