@pie-element/complex-rubric 3.8.1-next.10 → 3.8.1-next.9

package/configure/node_modules/@pie-element/rubric/configure/lib/pie-toolbox-rubric/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/pie-toolbox-rubric/index.js"],"names":["RUBRIC_TYPES","SIMPLE_RUBRIC","MULTI_TRAIT_RUBRIC","RUBRICLESS"],"mappings":";;;;;;;;;;;;;;;AAAA;;AAEA,IAAMA,YAAY,GAAG;AACnBC,EAAAA,aAAa,EAAE,cADI;AAEnBC,EAAAA,kBAAkB,EAAE,kBAFD;AAGnBC,EAAAA,UAAU,EAAE;AAHO,CAArB","sourcesContent":["import Authoring from './authoring';\n\nconst RUBRIC_TYPES = {\n  SIMPLE_RUBRIC: 'simpleRubric',\n  MULTI_TRAIT_RUBRIC: 'multiTraitRubric',\n  RUBRICLESS: 'rubricless',\n};\n\nexport { Authoring, RUBRIC_TYPES };\n"],"file":"index.js"}

package/configure/node_modules/@pie-element/rubric/configure/lib/pie-toolbox-rubric/point-menu.js

@@ -0,0 +1,172 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.IconMenu = 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 _Menu = _interopRequireDefault(require("@material-ui/core/Menu"));
+
+var _MenuItem = _interopRequireDefault(require("@material-ui/core/MenuItem"));
+
+var _MoreVert = _interopRequireDefault(require("@material-ui/icons/MoreVert"));
+
+var _MoreHoriz = _interopRequireDefault(require("@material-ui/icons/MoreHoriz"));
+
+var _IconButton = _interopRequireDefault(require("@material-ui/core/IconButton"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _react = _interopRequireDefault(require("react"));
+
+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 IconMenu = /*#__PURE__*/function (_React$Component) {
+  (0, _inherits2["default"])(IconMenu, _React$Component);
+
+  var _super = _createSuper(IconMenu);
+
+  function IconMenu(props) {
+    var _this;
+
+    (0, _classCallCheck2["default"])(this, IconMenu);
+    _this = _super.call(this, props);
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleClick", function (event) {
+      return _this.setState({
+        open: true,
+        anchorEl: event.currentTarget
+      });
+    });
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleRequestClose", function () {
+      return _this.setState({
+        open: false
+      });
+    });
+    _this.state = {
+      anchorEl: undefined,
+      open: false
+    };
+    return _this;
+  }
+
+  (0, _createClass2["default"])(IconMenu, [{
+    key: "render",
+    value: function render() {
+      var _this2 = this;
+
+      var _this$props = this.props,
+          opts = _this$props.opts,
+          onClick = _this$props.onClick,
+          classes = _this$props.classes;
+      var _this$state = this.state,
+          open = _this$state.open,
+          anchorEl = _this$state.anchorEl;
+      var keys = Object.keys(opts) || [];
+
+      var handleMenuClick = function handleMenuClick(key) {
+        return function () {
+          onClick(key);
+
+          _this2.handleRequestClose();
+        };
+      };
+
+      var iconColor = open ? 'inherit' : 'disabled';
+      return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement("div", {
+        onClick: this.handleClick
+      }, /*#__PURE__*/_react["default"].createElement(_IconButton["default"], {
+        className: classes.icon
+      }, open ? /*#__PURE__*/_react["default"].createElement(_MoreVert["default"], {
+        color: iconColor
+      }) : /*#__PURE__*/_react["default"].createElement(_MoreHoriz["default"], {
+        color: iconColor
+      }))), /*#__PURE__*/_react["default"].createElement(_Menu["default"], {
+        id: "point-menu",
+        anchorEl: anchorEl,
+        open: open,
+        onClose: this.handleRequestClose,
+        style: {
+          transform: 'translate(-15px, -15px)'
+        },
+        transformOrigin: {
+          vertical: 'center',
+          horizontal: 'right'
+        }
+      }, keys.map(function (k, index) {
+        return /*#__PURE__*/_react["default"].createElement(_MenuItem["default"], {
+          key: index,
+          onClick: handleMenuClick(k)
+        }, opts[k]);
+      })));
+    }
+  }]);
+  return IconMenu;
+}(_react["default"].Component);
+
+exports.IconMenu = IconMenu;
+(0, _defineProperty2["default"])(IconMenu, "propTypes", {
+  opts: _propTypes["default"].object,
+  onClick: _propTypes["default"].func.isRequired,
+  classes: _propTypes["default"].object.isRequired
+});
+
+var PointMenu = /*#__PURE__*/function (_React$Component2) {
+  (0, _inherits2["default"])(PointMenu, _React$Component2);
+
+  var _super2 = _createSuper(PointMenu);
+
+  function PointMenu() {
+    (0, _classCallCheck2["default"])(this, PointMenu);
+    return _super2.apply(this, arguments);
+  }
+
+  (0, _createClass2["default"])(PointMenu, [{
+    key: "render",
+    value: function render() {
+      var _this$props2 = this.props,
+          onChange = _this$props2.onChange,
+          classes = _this$props2.classes,
+          showSampleAnswer = _this$props2.showSampleAnswer;
+      var sampleText = showSampleAnswer ? 'Provide Sample Response' : 'Remove Sample Response';
+      return /*#__PURE__*/_react["default"].createElement(IconMenu, {
+        onClick: function onClick(key) {
+          return onChange(key);
+        },
+        opts: {
+          sample: sampleText
+        },
+        classes: classes
+      });
+    }
+  }]);
+  return PointMenu;
+}(_react["default"].Component);
+
+exports["default"] = PointMenu;
+(0, _defineProperty2["default"])(PointMenu, "propTypes", {
+  onChange: _propTypes["default"].func.isRequired,
+  classes: _propTypes["default"].object.isRequired,
+  showSampleAnswer: _propTypes["default"].bool.isRequired
+});
+(0, _defineProperty2["default"])(PointMenu, "defaultProps", {
+  classes: {}
+});
+//# sourceMappingURL=point-menu.js.map

package/configure/node_modules/@pie-element/rubric/configure/lib/pie-toolbox-rubric/point-menu.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/pie-toolbox-rubric/point-menu.jsx"],"names":["IconMenu","props","event","setState","open","anchorEl","currentTarget","state","undefined","opts","onClick","classes","keys","Object","handleMenuClick","key","handleRequestClose","iconColor","handleClick","icon","transform","vertical","horizontal","map","k","index","React","Component","PropTypes","object","func","isRequired","PointMenu","onChange","showSampleAnswer","sampleText","sample","bool"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;IAEaA,Q;;;;;AAOX,oBAAYC,KAAZ,EAAmB;AAAA;;AAAA;AACjB,8BAAMA,KAAN;AADiB,oGAQL,UAACC,KAAD;AAAA,aAAW,MAAKC,QAAL,CAAc;AAAEC,QAAAA,IAAI,EAAE,IAAR;AAAcC,QAAAA,QAAQ,EAAEH,KAAK,CAACI;AAA9B,OAAd,CAAX;AAAA,KARK;AAAA,2GAUE;AAAA,aAAM,MAAKH,QAAL,CAAc;AAAEC,QAAAA,IAAI,EAAE;AAAR,OAAd,CAAN;AAAA,KAVF;AAEjB,UAAKG,KAAL,GAAa;AACXF,MAAAA,QAAQ,EAAEG,SADC;AAEXJ,MAAAA,IAAI,EAAE;AAFK,KAAb;AAFiB;AAMlB;;;;WAMD,kBAAS;AAAA;;AACP,wBAAmC,KAAKH,KAAxC;AAAA,UAAQQ,IAAR,eAAQA,IAAR;AAAA,UAAcC,OAAd,eAAcA,OAAd;AAAA,UAAuBC,OAAvB,eAAuBA,OAAvB;AACA,wBAA2B,KAAKJ,KAAhC;AAAA,UAAQH,IAAR,eAAQA,IAAR;AAAA,UAAcC,QAAd,eAAcA,QAAd;AACA,UAAMO,IAAI,GAAGC,MAAM,CAACD,IAAP,CAAYH,IAAZ,KAAqB,EAAlC;;AAEA,UAAMK,eAAe,GAAG,SAAlBA,eAAkB,CAACC,GAAD;AAAA,eAAS,YAAM;AACrCL,UAAAA,OAAO,CAACK,GAAD,CAAP;;AACA,UAAA,MAAI,CAACC,kBAAL;AACD,SAHuB;AAAA,OAAxB;;AAKA,UAAMC,SAAS,GAAGb,IAAI,GAAG,SAAH,GAAe,UAArC;AAEA,0BACE,0DACE;AAAK,QAAA,OAAO,EAAE,KAAKc;AAAnB,sBACE,gCAAC,sBAAD;AAAY,QAAA,SAAS,EAAEP,OAAO,CAACQ;AAA/B,SACGf,IAAI,gBAAG,gCAAC,oBAAD;AAAc,QAAA,KAAK,EAAEa;AAArB,QAAH,gBAAwC,gCAAC,qBAAD;AAAe,QAAA,KAAK,EAAEA;AAAtB,QAD/C,CADF,CADF,eAME,gCAAC,gBAAD;AACE,QAAA,EAAE,EAAC,YADL;AAEE,QAAA,QAAQ,EAAEZ,QAFZ;AAGE,QAAA,IAAI,EAAED,IAHR;AAIE,QAAA,OAAO,EAAE,KAAKY,kBAJhB;AAKE,QAAA,KAAK,EAAE;AAAEI,UAAAA,SAAS,EAAE;AAAb,SALT;AAME,QAAA,eAAe,EAAE;AACfC,UAAAA,QAAQ,EAAE,QADK;AAEfC,UAAAA,UAAU,EAAE;AAFG;AANnB,SAWGV,IAAI,CAACW,GAAL,CAAS,UAACC,CAAD,EAAIC,KAAJ;AAAA,4BACR,gCAAC,oBAAD;AAAU,UAAA,GAAG,EAAEA,KAAf;AAAsB,UAAA,OAAO,EAAEX,eAAe,CAACU,CAAD;AAA9C,WACGf,IAAI,CAACe,CAAD,CADP,CADQ;AAAA,OAAT,CAXH,CANF,CADF;AA0BD;;;EAzD2BE,kBAAMC,S;;;iCAAvB3B,Q,eACQ;AACjBS,EAAAA,IAAI,EAAEmB,sBAAUC,MADC;AAEjBnB,EAAAA,OAAO,EAAEkB,sBAAUE,IAAV,CAAeC,UAFP;AAGjBpB,EAAAA,OAAO,EAAEiB,sBAAUC,MAAV,CAAiBE;AAHT,C;;IA2DAC,S;;;;;;;;;;;;WAWnB,kBAAS;AACP,yBAAgD,KAAK/B,KAArD;AAAA,UAAQgC,QAAR,gBAAQA,QAAR;AAAA,UAAkBtB,OAAlB,gBAAkBA,OAAlB;AAAA,UAA2BuB,gBAA3B,gBAA2BA,gBAA3B;AACA,UAAMC,UAAU,GAAGD,gBAAgB,GAAG,yBAAH,GAA+B,wBAAlE;AAEA,0BACE,gCAAC,QAAD;AACE,QAAA,OAAO,EAAE,iBAACnB,GAAD;AAAA,iBAASkB,QAAQ,CAAClB,GAAD,CAAjB;AAAA,SADX;AAEE,QAAA,IAAI,EAAE;AACJqB,UAAAA,MAAM,EAAED;AADJ,SAFR;AAKE,QAAA,OAAO,EAAExB;AALX,QADF;AASD;;;EAxBoCe,kBAAMC,S;;;iCAAxBK,S,eACA;AACjBC,EAAAA,QAAQ,EAAEL,sBAAUE,IAAV,CAAeC,UADR;AAEjBpB,EAAAA,OAAO,EAAEiB,sBAAUC,MAAV,CAAiBE,UAFT;AAGjBG,EAAAA,gBAAgB,EAAEN,sBAAUS,IAAV,CAAeN;AAHhB,C;iCADAC,S,kBAOG;AACpBrB,EAAAA,OAAO,EAAE;AADW,C","sourcesContent":["import Menu from '@material-ui/core/Menu';\nimport MenuItem from '@material-ui/core/MenuItem';\nimport MoreVertIcon from '@material-ui/icons/MoreVert';\nimport MoreHorizIcon from '@material-ui/icons/MoreHoriz';\nimport IconButton from '@material-ui/core/IconButton';\nimport PropTypes from 'prop-types';\nimport React from 'react';\n\nexport class IconMenu extends React.Component {\n  static propTypes = {\n    opts: PropTypes.object,\n    onClick: PropTypes.func.isRequired,\n    classes: PropTypes.object.isRequired,\n  };\n\n  constructor(props) {\n    super(props);\n    this.state = {\n      anchorEl: undefined,\n      open: false,\n    };\n  }\n\n  handleClick = (event) => this.setState({ open: true, anchorEl: event.currentTarget });\n\n  handleRequestClose = () => this.setState({ open: false });\n\n  render() {\n    const { opts, onClick, classes } = this.props;\n    const { open, anchorEl } = this.state;\n    const keys = Object.keys(opts) || [];\n\n    const handleMenuClick = (key) => () => {\n      onClick(key);\n      this.handleRequestClose();\n    };\n\n    const iconColor = open ? 'inherit' : 'disabled';\n\n    return (\n      <div>\n        <div onClick={this.handleClick}>\n          <IconButton className={classes.icon}>\n            {open ? <MoreVertIcon color={iconColor} /> : <MoreHorizIcon color={iconColor} />}\n          </IconButton>\n        </div>\n        <Menu\n          id=\"point-menu\"\n          anchorEl={anchorEl}\n          open={open}\n          onClose={this.handleRequestClose}\n          style={{ transform: 'translate(-15px, -15px)' }}\n          transformOrigin={{\n            vertical: 'center',\n            horizontal: 'right',\n          }}\n        >\n          {keys.map((k, index) => (\n            <MenuItem key={index} onClick={handleMenuClick(k)}>\n              {opts[k]}\n            </MenuItem>\n          ))}\n        </Menu>\n      </div>\n    );\n  }\n}\n\nexport default class PointMenu extends React.Component {\n  static propTypes = {\n    onChange: PropTypes.func.isRequired,\n    classes: PropTypes.object.isRequired,\n    showSampleAnswer: PropTypes.bool.isRequired,\n  };\n\n  static defaultProps = {\n    classes: {},\n  };\n\n  render() {\n    const { onChange, classes, showSampleAnswer } = this.props;\n    const sampleText = showSampleAnswer ? 'Provide Sample Response' : 'Remove Sample Response';\n\n    return (\n      <IconMenu\n        onClick={(key) => onChange(key)}\n        opts={{\n          sample: sampleText,\n        }}\n        classes={classes}\n      />\n    );\n  }\n}\n"],"file":"point-menu.js"}

package/configure/node_modules/@pie-element/rubric/configure/package.json

@@ -0,0 +1,20 @@
+{
+  "name": "@pie-element/rubric-configure",
+  "private": true,
+  "version": "4.8.0",
+  "description": "Rubric authoring view",
+  "main": "lib/index.js",
+  "author": "Pie Framework Authors",
+  "dependencies": {
+    "@material-ui/core": "^3.9.2",
+    "@pie-framework/pie-configure-events": "^1.3.0",
+    "@pie-lib/config-ui": "^11.25.0",
+    "@pie-lib/editable-html": "^11.17.0",
+    "@pie-lib/render-ui": "^4.31.0",
+    "debug": "^4.1.1",
+    "react": "^16.8.6",
+    "react-beautiful-dnd": "^11.0.2",
+    "react-dom": "^16.8.6"
+  },
+  "license": "ISC"
+}

package/configure/node_modules/@pie-element/rubric/configure/src/__tests__/index.test.jsx

@@ -0,0 +1,178 @@
+import RubricElement from '../index';
+import defaults from '../defaults';
+import { ModelUpdatedEvent, InsertSoundEvent, DeleteSoundEvent } from '@pie-framework/pie-configure-events';
+import React from 'react';
+
+jest.mock('react-dom', () => ({
+  render: jest.fn(),
+}));
+
+jest.mock('@pie-lib/config-ui', () => ({
+  layout: {
+    ConfigLayout: (props) => <div {...props} />,
+  },
+  settings: {
+    Panel: (props) => <div {...props} />,
+    toggle: jest.fn(),
+    radio: jest.fn(),
+  },
+}));
+
+const model = (extras) => ({
+  id: '1',
+  element: 'pie-rubric',
+  points: ['A', 'B', 'C', 'D'],
+  sampleAnswers: [true, true, false, false],
+  maxPoints: 3,
+  excludeZero: false,
+  excludeZeroEnabled: true,
+  maxPointsEnabled: true,
+  ...extras,
+});
+
+const invalidModel = (extras) => ({
+  id: '2',
+  element: 'pie-rubric',
+  points: ['A', 'B', 'C', 'D'],
+  sampleAnswers: [true, true, false, false],
+  maxPoints: 5,
+  excludeZero: false,
+  excludeZeroEnabled: true,
+  maxPointsEnabled: true,
+  ...extras,
+});
+const configuration = (c) => ({ ...defaults.configuration, ...c });
+
+describe('RubricElement', () => {
+  let element;
+
+  beforeEach(() => {
+    element = new RubricElement();
+  });
+
+  afterEach(() => {
+    jest.clearAllMocks();
+  });
+
+  describe('set model', () => {
+    it('should set the model correctly', () => {
+      const newModel = model();
+      element.model = newModel;
+      expect(element._model).toEqual(newModel);
+    });
+  });
+
+  describe('onModelChanged', () => {
+    it('should dispatch ModelUpdatedEvent on model change', () => {
+      const newModel = model();
+      const dispatchEventSpy = jest.spyOn(element, 'dispatchEvent');
+      element.onModelChanged(newModel);
+      expect(element._model).toEqual(newModel);
+      expect(dispatchEventSpy).toHaveBeenCalledWith(new ModelUpdatedEvent(newModel, false));
+    });
+  });
+
+  describe('set configuration', () => {
+    it('should set the configuration correctly', () => {
+      const newConfiguration = configuration();
+      element.configuration = newConfiguration;
+      expect(element._configuration).toEqual(newConfiguration);
+    });
+  });
+
+  describe('onConfigurationChanged', () => {
+    it('should call _render method on configuration change and overwrite the defaults with the new values', () => {
+      const newConfiguration = configuration({ maxMaxPoints: 10 });
+      const renderSpy = jest.spyOn(element, '_render');
+      element.onConfigurationChanged(newConfiguration);
+      expect(element._configuration.maxMaxPoints).toEqual(10);
+      expect(renderSpy).toHaveBeenCalled();
+    });
+  });
+
+  describe('updateModelAccordingToReceivedProps', () => {
+    it('should return the same model if it is already valid', () => {
+      const validModel = model();
+      const validatedModel = element.updateModelAccordingToReceivedProps(validModel);
+      expect(validatedModel).toEqual(validModel);
+    });
+
+    it('should return an empty model if the input model is undefined', () => {
+      const validatedModel = element.updateModelAccordingToReceivedProps(undefined);
+      expect(validatedModel).toEqual(defaults.model);
+    });
+
+    it('should return an empty model if the input model is null', () => {
+      const validatedModel = element.updateModelAccordingToReceivedProps(null);
+      expect(validatedModel).toEqual(defaults.model);
+    });
+
+    it('should handle undefined properties in the input model', () => {
+      const validatedModel = element.updateModelAccordingToReceivedProps({});
+      expect(validatedModel).toEqual({ points: [], sampleAnswers: [] });
+    });
+
+    it('should handle null properties in the input model', () => {
+      const validatedModel = element.updateModelAccordingToReceivedProps({ maxPoints: null, excludeZero: null });
+      expect(validatedModel).toEqual({
+        excludeZero: null,
+        maxPoints: null,
+        points: ['', ''],
+        sampleAnswers: [null, null],
+      });
+    });
+
+    it('should handle undefined points and sampleAnswers arrays', () => {
+      const validatedModel = element.updateModelAccordingToReceivedProps({ maxPoints: 5, excludeZero: false });
+      expect(validatedModel.points).toEqual(['', '', '', '', '', '']);
+      expect(validatedModel.sampleAnswers).toEqual([null, null, null, null, null, null]);
+    });
+
+    it('should handle case when howManyPointsDoesItHave is less than howManyPointsShouldHave with maxPoints & excludeZero changed', () => {
+      const nextModel = model({
+        maxPoints: 7,
+        excludeZero: true,
+      });
+      const result = element.updateModelAccordingToReceivedProps(nextModel);
+      expect(result.points).toEqual(['A', 'B', 'C', 'D', '', '', '']);
+      expect(result.sampleAnswers).toEqual([true, true, false, false, null, null, null]);
+    });
+
+    it('should handle case when howManyPointsDoesItHave is less than howManyPointsShouldHave and maxPointsChanged', () => {
+      const nextModel = model({
+        maxPoints: 4,
+        excludeZero: false,
+      });
+      const result = element.updateModelAccordingToReceivedProps(nextModel);
+      expect(result.points).toEqual(['A', 'B', 'C', 'D', '']);
+      expect(result.sampleAnswers).toEqual([true, true, false, false, null]);
+    });
+
+    it('should handle case when howManyPointsDoesItHave is greater than howManyPointsShouldHave and excludeZeroChanged', () => {
+      const nextModel = model({
+        maxPoints: 3,
+        excludeZero: true,
+      });
+      const result = element.updateModelAccordingToReceivedProps(nextModel);
+      expect(result.points).toEqual(['B', 'C', 'D']);
+      expect(result.sampleAnswers).toEqual([true, false, false]);
+    });
+
+    it('should handle case when howManyPointsDoesItHave is greater than howManyPointsShouldHave and maxPointsChanged', () => {
+      const nextModel = model({
+        maxPoints: 1,
+        excludeZero: false,
+      });
+      const result = element.updateModelAccordingToReceivedProps(nextModel);
+      expect(result.points).toEqual(['A', 'B']);
+      expect(result.sampleAnswers).toEqual([true, true]);
+    });
+
+    it('should handle case if invalid model is set, after updateModelAccordingToReceivedProps the returned model is valid', () => {
+      const newModel = invalidModel();
+      element.onModelChanged(newModel);
+      expect(element._model.points).toEqual(['A', 'B', 'C', 'D', '', '']);
+      expect(element._model.sampleAnswers).toEqual([true, true, false, false, null, null]);
+    });
+  });
+});

package/configure/node_modules/@pie-element/rubric/configure/src/defaults.js

@@ -0,0 +1,42 @@
+export default {
+  model: {
+    points: ['', '', '', ''],
+    sampleAnswers: [null, null, null, null],
+    maxPoints: 3,
+    excludeZero: false,
+    excludeZeroEnabled: true,
+    maxPointsEnabled: true,
+  },
+  configuration: {
+    baseInputConfiguration: {
+      audio: { disabled: false },
+      video: { disabled: false },
+      image: { disabled: false },
+      textAlign: { disabled: true },
+      showParagraphs: { disabled: false },
+      separateParagraphs: { disabled: true },
+    },
+    rubriclessInstruction: {
+      inputConfiguration: {
+        audio: { disabled: false },
+        video: { disabled: false },
+        image: { disabled: false },
+      },
+    },
+    showExcludeZero: {
+      settings: true,
+      label: 'Ability to exclude zero',
+    },
+    showMaxPoint: {
+      settings: true,
+      label: 'Show max points dropdown',
+    },
+    settingsPanelDisabled: false,
+    // width: '500px'
+    mathMlOptions: {
+      mmlOutput: false,
+      mmlEditing: false,
+    },
+    maxMaxPoints: 9,
+  },
+};

package/configure/node_modules/@pie-element/rubric/configure/src/index.js

@@ -0,0 +1,129 @@
+import { ModelUpdatedEvent, InsertImageEvent, DeleteImageEvent } from '@pie-framework/pie-configure-events';
+import React from 'react';
+import ReactDOM from 'react-dom';
+import debug from 'debug';
+
+import Main from './main';
+import defaults from './defaults';
+
+const modelWithDefaults = (m) => ({ ...defaults.model, ...m });
+
+const configurationWithDefaults = (c) => ({ ...defaults.configuration, ...c });
+
+export default class RubricElement extends HTMLElement {
+  constructor() {
+    super();
+    debug.log('constructor called');
+    this._model = modelWithDefaults();
+    this._configuration = configurationWithDefaults();
+    this.onModelChanged = this.onModelChanged.bind(this);
+    this.onConfigurationChanged = this.onConfigurationChanged.bind(this);
+  }
+
+  updateModelAccordingToReceivedProps = (nextModel) => {
+    const currentModel = { ...this._model };
+
+    if (!nextModel) {
+      return currentModel;
+    }
+
+    const validatedModel = { ...nextModel };
+
+    // excludeZero should be false and disabled when maxPoints is 1
+    if (validatedModel.maxPoints === 1) {
+      validatedModel.excludeZero = false;
+    }
+
+    const { maxPoints, excludeZero } = validatedModel || {};
+
+    validatedModel.points = validatedModel.points ? [...validatedModel.points] : [];
+    validatedModel.sampleAnswers = validatedModel.sampleAnswers ? [...validatedModel.sampleAnswers] : [];
+
+    const howManyPointsShouldHave = excludeZero ? maxPoints : maxPoints + 1;
+    const howManyPointsDoesItHave = validatedModel.points.length;
+
+    const excludeZeroChanged = currentModel?.excludeZero !== nextModel?.excludeZero;
+    const maxPointsChanged = currentModel?.maxPoints !== nextModel?.maxPoints;
+
+    if (howManyPointsDoesItHave < howManyPointsShouldHave) {
+      if (excludeZeroChanged && !excludeZero) {
+        validatedModel.points = ['', ...validatedModel.points];
+        validatedModel.sampleAnswers = [null, ...validatedModel.sampleAnswers];
+      }
+
+      if (maxPointsChanged) {
+        for (let i = 0; i < howManyPointsShouldHave - howManyPointsDoesItHave; i++) {
+          validatedModel.points.push('');
+          validatedModel.sampleAnswers.push(null);
+        }
+      }
+    } else if (howManyPointsDoesItHave > howManyPointsShouldHave) {
+      if (excludeZeroChanged && excludeZero) {
+        validatedModel.points = validatedModel.points.slice(1);
+        validatedModel.sampleAnswers = validatedModel.sampleAnswers.slice(1);
+      }
+
+      if (maxPointsChanged) {
+        validatedModel.points = validatedModel.points.slice(0, howManyPointsShouldHave);
+        validatedModel.sampleAnswers = validatedModel.sampleAnswers.slice(0, howManyPointsShouldHave);
+      }
+    }
+
+    return validatedModel;
+  };
+
+  set model(m) {
+    this._model = this.updateModelAccordingToReceivedProps(modelWithDefaults(m));
+    this._render();
+  }
+
+  set configuration(c) {
+    this._configuration = configurationWithDefaults(c);
+    this._render();
+  }
+
+  onModelChanged(m) {
+    this._model = this.updateModelAccordingToReceivedProps(m);
+    this._render();
+    this.dispatchEvent(new ModelUpdatedEvent(this._model, false));
+  }
+
+  onConfigurationChanged = (c) => {
+    this._configuration = configurationWithDefaults(c);
+
+    if (this._model) {
+      this.onModelChanged(this._model);
+    }
+
+    this._render();
+  };
+
+  insertImage(handler) {
+    this.dispatchEvent(new InsertImageEvent(handler));
+  }
+
+  onDeleteImage(src, done) {
+    this.dispatchEvent(new DeleteImageEvent(src, done));
+  }
+
+  connectedCallback() {
+    this._render();
+  }
+
+  _render() {
+    if (this._model) {
+      let element = React.createElement(Main, {
+        model: this._model,
+        configuration: this._configuration,
+        onModelChanged: this.onModelChanged,
+        onConfigurationChanged: this.onConfigurationChanged,
+        imageSupport: {
+          add: this.insertImage.bind(this),
+          delete: this.onDeleteImage.bind(this),
+        },
+      });
+
+      ReactDOM.render(element, this);
+    }
+  }
+}

package/configure/node_modules/@pie-element/rubric/configure/src/main.jsx

@@ -0,0 +1,89 @@
+import React from 'react';
+import { Authoring } from './pie-toolbox-rubric/index';
+import { withStyles } from '@material-ui/core/styles';
+import { layout, settings } from '@pie-lib/config-ui';
+
+const { Panel, toggle } = settings;
+
+const styles = (theme) => ({
+  design: {
+    fontFamily: 'Cerebri Sans',
+    fontSize: theme.typography.fontSize,
+  },
+});
+
+class Main extends React.Component {
+  verifyRubriclessModel = (m, config) => {
+    const { rubricless = false } = config || {};
+    return rubricless ? (({ points, sampleAnswers, ...rest }) => rest)(m) : m;
+  };
+
+  render() {
+    const { model, configuration, onConfigurationChanged, onModelChanged, imageSupport } = this.props || {};
+    const {
+      baseInputConfiguration = {},
+      contentDimensions = {},
+      settingsPanelDisabled,
+      showExcludeZero = {},
+      showMaxPoint = {},
+      mathMlOptions = {},
+      rubricless = false,
+      rubriclessInstruction,
+      width,
+    } = configuration || {};
+
+    // ensure to eliminate points and sampleAnswers in case of rubricless
+    const value = this.verifyRubriclessModel(model, configuration);
+    const { extraCSSRules } = model;
+
+    const panelProperties = {
+      excludeZeroEnabled: showExcludeZero.settings && toggle(showExcludeZero.label),
+      maxPointsEnabled: showMaxPoint.settings && toggle(showMaxPoint.label),
+      rubriclessInstructionEnabled: rubricless && rubriclessInstruction.settings && toggle(rubriclessInstruction.label),
+    };
+
+    const getPluginProps = (props) => {
+      return Object.assign(
+        {
+          ...baseInputConfiguration,
+        },
+        props || {},
+      );
+    };
+
+    return (
+      <layout.ConfigLayout
+        extraCSSRules={extraCSSRules}
+        dimensions={contentDimensions}
+        hideSettings={settingsPanelDisabled}
+        settings={
+          <Panel
+            model={model}
+            onChangeModel={onModelChanged}
+            configuration={configuration}
+            onChangeConfiguration={onConfigurationChanged}
+            pluginOpts={getPluginProps(rubriclessInstruction?.inputConfiguration)}
+            groups={{
+              Properties: panelProperties,
+            }}
+            imageSupport={imageSupport}
+          />
+        }
+      >
+        <div style={{ maxWidth: width }}>
+          <Authoring
+            value={value}
+            config={configuration}
+            onChange={onModelChanged}
+            mathMlOptions={mathMlOptions}
+            rubricless={rubricless}
+            pluginOpts={baseInputConfiguration}
+            imageSupport={imageSupport}
+          />
+        </div>
+      </layout.ConfigLayout>
+    );
+  }
+}
+
+export default withStyles(styles)(Main);