@pie-element/multi-trait-rubric 8.1.1-next.0 → 8.1.1-next.29

package/configure/lib/index.js

@@ -0,0 +1,157 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _pieConfigureEvents = require("@pie-framework/pie-configure-events");
+var _react = _interopRequireDefault(require("react"));
+var _client = require("react-dom/client");
+var _main = _interopRequireDefault(require("./main"));
+var _defaults = _interopRequireDefault(require("./defaults"));
+var _utils = require("./utils");
+var _modals = require("./modals");
+const modelWithDefaults = m => ({
+  ..._defaults.default.model,
+  ...m
+});
+const configurationWithDefaults = c => ({
+  ..._defaults.default.configuration,
+  ...c
+});
+class MultiTraitRubricElement extends HTMLElement {
+  constructor() {
+    super();
+    (0, _defineProperty2.default)(this, "updateModelAccordingToReceivedProps", m => {
+      const currentModel = {
+        ...this._model
+      };
+      if (!m) {
+        return currentModel;
+      }
+      const validatedModel = {
+        ...m
+      };
+      const {
+        scales,
+        excludeZero
+      } = validatedModel || {};
+      (scales || []).forEach(scale => {
+        if (!scale) {
+          scale = {
+            scorePointsLabels: [],
+            traits: []
+          };
+        }
+        const {
+          maxPoints
+        } = scale || {};
+        scale.scorePointsLabels = [...(scale.scorePointsLabels || [])];
+        scale.traits = [...(scale.traits || [])];
+        const howManyScorePointLabelsShouldHave = excludeZero ? maxPoints : maxPoints + 1;
+        const howManyScorePointLabelsItHas = scale.scorePointsLabels.length;
+        if (howManyScorePointLabelsItHas !== howManyScorePointLabelsShouldHave) {
+          if (howManyScorePointLabelsItHas < howManyScorePointLabelsShouldHave) {
+            for (let i = 0; i < howManyScorePointLabelsShouldHave - howManyScorePointLabelsItHas; i++) {
+              scale.scorePointsLabels.push('');
+            }
+          } else {
+            scale.scorePointsLabels = scale.scorePointsLabels.slice(0, howManyScorePointLabelsShouldHave);
+          }
+        }
+        (scale.traits || []).forEach(trait => {
+          if (!trait) {
+            trait = {
+              scorePointsDescriptors: []
+            };
+          }
+          trait.scorePointsDescriptors = [...(trait.scorePointsDescriptors || [])];
+          const howManyScorePointDescriptorsItHas = trait.scorePointsDescriptors.length;
+          if (howManyScorePointDescriptorsItHas !== howManyScorePointLabelsShouldHave) {
+            if (howManyScorePointDescriptorsItHas < howManyScorePointLabelsShouldHave) {
+              for (let i = 0; i < howManyScorePointLabelsShouldHave - howManyScorePointDescriptorsItHas; i++) {
+                trait.scorePointsDescriptors.push('');
+              }
+            } else {
+              trait.scorePointsDescriptors = trait.scorePointsDescriptors.slice(0, howManyScorePointLabelsShouldHave);
+            }
+          }
+        });
+      });
+      if (validatedModel.excludeZero) {
+        // check if any scale has maxPoints set to 1
+        const shouldAddColumn0 = validatedModel.scales.some(scale => scale.maxPoints === 1);
+        if (shouldAddColumn0) {
+          // excludeZero should be false and disabled when maxPoints is 1
+          validatedModel.excludeZero = false;
+          // add column 0 for all scales
+          validatedModel.scales = (0, _utils.addOrRemoveScaleColumn)(scales, _modals.excludeZeroTypes.add0);
+        }
+      }
+      return validatedModel;
+    });
+    (0, _defineProperty2.default)(this, "onModelChanged", m => {
+      this._model = this.updateModelAccordingToReceivedProps(modelWithDefaults(m));
+      this._render();
+      this.dispatchEvent(new _pieConfigureEvents.ModelUpdatedEvent(this._model, false));
+    });
+    (0, _defineProperty2.default)(this, "onConfigurationChanged", c => {
+      this._configuration = configurationWithDefaults(c);
+      this._render();
+    });
+    this._root = null;
+    this._model = modelWithDefaults();
+    this._configuration = configurationWithDefaults();
+  }
+  set model(m) {
+    this._model = this.updateModelAccordingToReceivedProps(modelWithDefaults(m));
+    this._render();
+  }
+  set configuration(c) {
+    this._configuration = configurationWithDefaults(c);
+    this._render();
+  }
+  insertSound(handler) {
+    this.dispatchEvent(new _pieConfigureEvents.InsertSoundEvent(handler));
+  }
+  onDeleteSound(src, done) {
+    this.dispatchEvent(new _pieConfigureEvents.DeleteSoundEvent(src, done));
+  }
+  insertImage(handler) {
+    this.dispatchEvent(new _pieConfigureEvents.InsertImageEvent(handler));
+  }
+  onDeleteImage(src, done) {
+    this.dispatchEvent(new _pieConfigureEvents.DeleteImageEvent(src, done));
+  }
+  _render() {
+    if (this._model) {
+      let element = /*#__PURE__*/_react.default.createElement(_main.default, {
+        model: this._model,
+        configuration: this._configuration,
+        onModelChanged: this.onModelChanged,
+        onConfigurationChanged: this.onConfigurationChanged,
+        uploadSoundSupport: {
+          add: this.insertSound.bind(this),
+          delete: this.onDeleteSound.bind(this)
+        },
+        imageSupport: {
+          add: this.insertImage.bind(this),
+          delete: this.onDeleteImage.bind(this)
+        }
+      });
+      if (!this._root) {
+        this._root = (0, _client.createRoot)(this);
+      }
+      this._root.render(element);
+    }
+  }
+  disconnectedCallback() {
+    if (this._root) {
+      this._root.unmount();
+    }
+  }
+}
+exports.default = MultiTraitRubricElement;
+//# sourceMappingURL=index.js.map

package/configure/lib/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["_pieConfigureEvents","require","_react","_interopRequireDefault","_client","_main","_defaults","_utils","_modals","modelWithDefaults","m","defaults","model","configurationWithDefaults","c","configuration","MultiTraitRubricElement","HTMLElement","constructor","_defineProperty2","default","currentModel","_model","validatedModel","scales","excludeZero","forEach","scale","scorePointsLabels","traits","maxPoints","howManyScorePointLabelsShouldHave","howManyScorePointLabelsItHas","length","i","push","slice","trait","scorePointsDescriptors","howManyScorePointDescriptorsItHas","shouldAddColumn0","some","addOrRemoveScaleColumn","excludeZeroTypes","add0","updateModelAccordingToReceivedProps","_render","dispatchEvent","ModelUpdatedEvent","_configuration","_root","insertSound","handler","InsertSoundEvent","onDeleteSound","src","done","DeleteSoundEvent","insertImage","InsertImageEvent","onDeleteImage","DeleteImageEvent","element","React","createElement","Main","onModelChanged","onConfigurationChanged","uploadSoundSupport","add","bind","delete","imageSupport","createRoot","render","disconnectedCallback","unmount","exports"],"sources":["../src/index.js"],"sourcesContent":["import {\n  ModelUpdatedEvent,\n  InsertSoundEvent,\n  DeleteSoundEvent,\n  InsertImageEvent,\n  DeleteImageEvent,\n} from '@pie-framework/pie-configure-events';\n\nimport React from 'react';\nimport { createRoot } from 'react-dom/client';\n\nimport Main from './main';\nimport defaults from './defaults';\nimport { addOrRemoveScaleColumn } from './utils';\nimport { excludeZeroTypes } from './modals';\n\nconst modelWithDefaults = (m) => ({ ...defaults.model, ...m });\nconst configurationWithDefaults = (c) => ({ ...defaults.configuration, ...c });\n\nexport default class MultiTraitRubricElement extends HTMLElement {\n  constructor() {\n    super();\n    this._root = null;\n    this._model = modelWithDefaults();\n    this._configuration = configurationWithDefaults();\n  }\n\n  updateModelAccordingToReceivedProps = (m) => {\n    const currentModel = { ...this._model };\n\n    if (!m) {\n      return currentModel;\n    }\n\n    const validatedModel = { ...m };\n    const { scales, excludeZero } = validatedModel || {};\n\n    (scales || []).forEach((scale) => {\n      if (!scale) {\n        scale = { scorePointsLabels: [], traits: [] };\n      }\n\n      const { maxPoints } = scale || {};\n\n      scale.scorePointsLabels = [...(scale.scorePointsLabels || [])];\n      scale.traits = [...(scale.traits || [])];\n\n      const howManyScorePointLabelsShouldHave = excludeZero ? maxPoints : maxPoints + 1;\n      const howManyScorePointLabelsItHas = scale.scorePointsLabels.length;\n\n      if (howManyScorePointLabelsItHas !== howManyScorePointLabelsShouldHave) {\n        if (howManyScorePointLabelsItHas < howManyScorePointLabelsShouldHave) {\n          for (let i = 0; i < howManyScorePointLabelsShouldHave - howManyScorePointLabelsItHas; i++) {\n            scale.scorePointsLabels.push('');\n          }\n        } else {\n          scale.scorePointsLabels = scale.scorePointsLabels.slice(0, howManyScorePointLabelsShouldHave);\n        }\n      }\n\n      (scale.traits || []).forEach((trait) => {\n        if (!trait) {\n          trait = { scorePointsDescriptors: [] };\n        }\n\n        trait.scorePointsDescriptors = [...(trait.scorePointsDescriptors || [])];\n\n        const howManyScorePointDescriptorsItHas = trait.scorePointsDescriptors.length;\n\n        if (howManyScorePointDescriptorsItHas !== howManyScorePointLabelsShouldHave) {\n          if (howManyScorePointDescriptorsItHas < howManyScorePointLabelsShouldHave) {\n            for (let i = 0; i < howManyScorePointLabelsShouldHave - howManyScorePointDescriptorsItHas; i++) {\n              trait.scorePointsDescriptors.push('');\n            }\n          } else {\n            trait.scorePointsDescriptors = trait.scorePointsDescriptors.slice(0, howManyScorePointLabelsShouldHave);\n          }\n        }\n      });\n    });\n\n    if (validatedModel.excludeZero) {\n      // check if any scale has maxPoints set to 1\n      const shouldAddColumn0 = validatedModel.scales.some((scale) => scale.maxPoints === 1);\n\n      if (shouldAddColumn0) {\n        // excludeZero should be false and disabled when maxPoints is 1\n        validatedModel.excludeZero = false;\n        // add column 0 for all scales\n        validatedModel.scales = addOrRemoveScaleColumn(scales, excludeZeroTypes.add0);\n      }\n    }\n\n    return validatedModel;\n  };\n\n  set model(m) {\n    this._model = this.updateModelAccordingToReceivedProps(modelWithDefaults(m));\n    this._render();\n  }\n\n  set configuration(c) {\n    this._configuration = configurationWithDefaults(c);\n    this._render();\n  }\n\n  onModelChanged = (m) => {\n    this._model = this.updateModelAccordingToReceivedProps(modelWithDefaults(m));\n    this._render();\n    this.dispatchEvent(new ModelUpdatedEvent(this._model, false));\n  };\n\n  onConfigurationChanged = (c) => {\n    this._configuration = configurationWithDefaults(c);\n\n    this._render();\n  };\n\n  insertSound(handler) {\n    this.dispatchEvent(new InsertSoundEvent(handler));\n  }\n\n  onDeleteSound(src, done) {\n    this.dispatchEvent(new DeleteSoundEvent(src, done));\n  }\n\n  insertImage(handler) {\n    this.dispatchEvent(new InsertImageEvent(handler));\n  }\n\n  onDeleteImage(src, done) {\n    this.dispatchEvent(new DeleteImageEvent(src, done));\n  }\n\n  _render() {\n    if (this._model) {\n      let element = React.createElement(Main, {\n        model: this._model,\n        configuration: this._configuration,\n        onModelChanged: this.onModelChanged,\n        onConfigurationChanged: this.onConfigurationChanged,\n        uploadSoundSupport: {\n          add: this.insertSound.bind(this),\n          delete: this.onDeleteSound.bind(this),\n        },\n        imageSupport: {\n          add: this.insertImage.bind(this),\n          delete: this.onDeleteImage.bind(this),\n        },\n      });\n\n      if (!this._root) {\n        this._root = createRoot(this);\n      }\n      this._root.render(element);\n    }\n  }\n\n  disconnectedCallback() {\n    if (this._root) {\n      this._root.unmount();\n    }\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/configure/lib/main.js

@@ -0,0 +1,454 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.Main = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _react = _interopRequireDefault(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _lodashEs = require("lodash-es");
+var _styles = require("@mui/material/styles");
+var _configUi = require("@pie-lib/config-ui");
+var _scale = _interopRequireDefault(require("./scale"));
+var _common = require("./common");
+var _modals = require("./modals");
+var _utils = require("./utils");
+const {
+  Panel,
+  toggle
+} = _configUi.settings;
+const MIN_WIDTH = '650px';
+const StyledDiv = (0, _styles.styled)('div')(({
+  theme
+}) => ({
+  fontFamily: 'Cerebri Sans',
+  fontSize: theme.typography.fontSize + 2,
+  // current font size is 14px, so this will make it 16px
+  padding: '16px 0'
+}));
+const ShowModal = ({
+  showExcludeZeroDialog,
+  excludeZero,
+  changeExcludeZero,
+  cancel
+}) => {
+  if (showExcludeZeroDialog && !excludeZero) {
+    return /*#__PURE__*/_react.default.createElement(_modals.ExcludeZeroDialog, {
+      open: showExcludeZeroDialog && !excludeZero,
+      changeExcludeZero: changeExcludeZero,
+      cancel: cancel
+    });
+  } else if (showExcludeZeroDialog && excludeZero) {
+    return /*#__PURE__*/_react.default.createElement(_modals.IncludeZeroDialog, {
+      open: showExcludeZeroDialog && excludeZero,
+      changeExcludeZero: changeExcludeZero,
+      cancel: cancel
+    });
+  } else {
+    return null;
+  }
+};
+ShowModal.propTypes = {
+  showExcludeZeroDialog: _propTypes.default.bool,
+  excludeZero: _propTypes.default.bool,
+  changeExcludeZero: _propTypes.default.func,
+  cancel: _propTypes.default.func
+};
+class Main extends _react.default.Component {
+  constructor(props) {
+    super(props);
+    (0, _defineProperty2.default)(this, "state", {
+      showDecreaseMaxPointsDialog: false,
+      showDeleteScaleDialog: false,
+      showDeleteTraitDialog: false,
+      showExcludeZeroDialog: false,
+      showInfoDialog: false,
+      infoDialogText: '',
+      adjustedWidth: MIN_WIDTH,
+      initialUpdateCompleted: false // flag to track the initial update of the div width
+    });
+    (0, _defineProperty2.default)(this, "updateDivWidthDebounced", (0, _lodashEs.debounce)(() => this.updateDivWidth(), 50));
+    (0, _defineProperty2.default)(this, "onScaleAdded", () => {
+      const {
+        model,
+        onModelChanged,
+        configuration
+      } = this.props;
+      let {
+        scales,
+        excludeZero
+      } = model || {};
+      const {
+        maxNoOfScales
+      } = configuration || {};
+      let {
+        defaultTraitLabel
+      } = configuration || '';
+      if (!scales.length) {
+        scales = [];
+      }
+
+      // if no default trait label is defined, take the trait label of the first scale
+      defaultTraitLabel = typeof defaultTraitLabel === 'string' ? defaultTraitLabel : scales[0]?.traitLabel || '';
+      if (scales.length === maxNoOfScales) {
+        this.set({
+          infoDialogText: `There can't be more than ${maxNoOfScales} scales.`,
+          showInfoDialog: true
+        });
+        return false;
+      }
+      scales.push({
+        maxPoints: 1,
+        scorePointsLabels: excludeZero ? [''] : ['', ''],
+        traitLabel: defaultTraitLabel,
+        traits: []
+      });
+      onModelChanged({
+        ...model,
+        scales
+      });
+    });
+    (0, _defineProperty2.default)(this, "onScaleChanged", (scaleIndex, params) => {
+      const {
+        model,
+        onModelChanged
+      } = this.props;
+      let scales = (0, _lodashEs.cloneDeep)((model || {}).scales);
+      if (scaleIndex < 0 || scaleIndex >= scales.length || (0, _lodashEs.isEmpty)(params)) return false;
+      Object.keys(params).forEach(key => {
+        scales[scaleIndex][key] = params[key];
+      });
+      if (model.excludeZero && params.maxPoints === 1) {
+        // excludeZero should be false and disabled when maxPoints is 1 for any scale
+        model.excludeZero = false;
+        scales = (0, _utils.addOrRemoveScaleColumn)(scales, _modals.excludeZeroTypes.add0);
+      }
+      onModelChanged({
+        ...model,
+        scales
+      });
+    });
+    (0, _defineProperty2.default)(this, "onScaleRemoved", scaleIndex => {
+      const {
+        model,
+        onModelChanged,
+        configuration
+      } = this.props;
+      let {
+        scales
+      } = model || {};
+      const {
+        minNoOfScales
+      } = configuration || {};
+      if (scaleIndex < 0 || scaleIndex >= scales.length) return false;
+      if (scales.length === minNoOfScales) {
+        this.set({
+          infoDialogText: `There can't be less than ${minNoOfScales} scales.`,
+          showInfoDialog: true
+        });
+        return false;
+      }
+      scales = [...scales.slice(0, scaleIndex), ...scales.slice(scaleIndex + 1)];
+      onModelChanged({
+        ...model,
+        scales
+      });
+    });
+    (0, _defineProperty2.default)(this, "onHalfScoringChanged", () => {
+      const {
+        model,
+        onModelChanged
+      } = this.props;
+      let {
+        halfScoring
+      } = model || {};
+      onModelChanged({
+        ...model,
+        halfScoring: !halfScoring
+      });
+    });
+    (0, _defineProperty2.default)(this, "onVisibleToStudentChanged", () => {
+      const {
+        model,
+        onModelChanged
+      } = this.props;
+      let {
+        visibleToStudent
+      } = model || {};
+      onModelChanged({
+        ...model,
+        visibleToStudent: !visibleToStudent
+      });
+    });
+    (0, _defineProperty2.default)(this, "set", newState => this.setState(newState));
+    (0, _defineProperty2.default)(this, "changeShowScorePointLabels", () => {
+      const {
+        model,
+        onModelChanged
+      } = this.props || {};
+      let {
+        pointLabels
+      } = model || {};
+      pointLabels = !pointLabels;
+      onModelChanged({
+        ...model,
+        pointLabels
+      });
+    });
+    (0, _defineProperty2.default)(this, "changeShowDescription", () => {
+      const {
+        model,
+        onModelChanged
+      } = this.props || {};
+      let {
+        description
+      } = model || {};
+      description = !description;
+      onModelChanged({
+        ...model,
+        description
+      });
+    });
+    (0, _defineProperty2.default)(this, "changeShowStandards", () => {
+      const {
+        model,
+        onModelChanged
+      } = this.props || {};
+      let {
+        standards
+      } = model || {};
+      standards = !standards;
+      onModelChanged({
+        ...model,
+        standards
+      });
+    });
+    // Exclude Zero
+    (0, _defineProperty2.default)(this, "showToggleExcludeZeroModal", () => this.set({
+      showExcludeZeroDialog: true
+    }));
+    (0, _defineProperty2.default)(this, "hideToggleExcludeZeroModal", () => {
+      this.set({
+        showExcludeZeroDialog: false
+      });
+    });
+    (0, _defineProperty2.default)(this, "onCloseInfoDialog", () => this.set({
+      showInfoDialog: false
+    }));
+    (0, _defineProperty2.default)(this, "changeExcludeZero", excludeZeroType => {
+      const {
+        model,
+        onModelChanged
+      } = this.props || {};
+      const {
+        scales
+      } = model || {};
+      let {
+        excludeZero
+      } = model || {};
+      if (!scales || !scales.length) return;
+      excludeZero = !excludeZero;
+      const newScales = (0, _utils.addOrRemoveScaleColumn)(scales, excludeZeroType);
+      onModelChanged({
+        ...model,
+        scales: newScales,
+        excludeZero
+      });
+      this.hideToggleExcludeZeroModal();
+    });
+    (0, _defineProperty2.default)(this, "onModelChanged", (updatedModel, updatedProperty) => {
+      const {
+        onModelChanged
+      } = this.props || {};
+      if (updatedProperty === 'excludeZero') {
+        this.showToggleExcludeZeroModal();
+      } else {
+        onModelChanged(updatedModel);
+      }
+    });
+    this.divRef = /*#__PURE__*/_react.default.createRef();
+    this.updateDivWidth = this.updateDivWidth.bind(this);
+  }
+  componentDidMount() {
+    window.addEventListener('resize', this.updateDivWidthDebounced);
+    window.addEventListener('load', this.updateDivWidth);
+
+    // delay updateDivWidth to avoid having this.divRef.current = null at first load
+    setTimeout(this.updateDivWidth, 0);
+  }
+  componentWillUnmount() {
+    window.removeEventListener('resize', this.updateDivWidthDebounced);
+    window.removeEventListener('load', this.updateDivWidth);
+  }
+  componentDidUpdate() {
+    if (!this.state.initialUpdateCompleted) {
+      this.updateDivWidth();
+      this.setState({
+        initialUpdateCompleted: true
+      });
+    }
+  }
+  updateDivWidth() {
+    if (this.divRef && this.divRef.current) {
+      const divWidth = this.divRef.current.offsetWidth;
+      if (divWidth !== this.state.adjustedWidth) {
+        this.set({
+          adjustedWidth: divWidth
+        });
+      }
+    }
+  }
+  render() {
+    const {
+      model,
+      configuration,
+      onConfigurationChanged,
+      uploadSoundSupport,
+      imageSupport
+    } = this.props || {};
+    const {
+      addScale,
+      baseInputConfiguration = {},
+      dragAndDrop,
+      contentDimensions = {},
+      showDescription,
+      showExcludeZero,
+      showLevelTagInput,
+      showStandards,
+      showHalfScoring,
+      showMaxPoint,
+      showScorePointLabels,
+      showVisibleToStudent,
+      spellCheck = {},
+      settingsPanelDisabled,
+      maxNoOfTraits,
+      minNoOfTraits,
+      width,
+      mathMlOptions = {},
+      maxMaxPoints,
+      expandedInput = {},
+      labelInput = {}
+    } = configuration || {};
+    const {
+      errors,
+      extraCSSRules,
+      scales,
+      excludeZero,
+      description,
+      pointLabels,
+      standards,
+      spellCheckEnabled,
+      maxPointsEnabled,
+      addScaleEnabled
+    } = model || {};
+    const {
+      showExcludeZeroDialog,
+      showInfoDialog,
+      infoDialogText,
+      adjustedWidth
+    } = this.state || {};
+
+    // excludeZero should be false and disabled when maxPoints is 1 for any scale
+    const disabledExcludeZero = scales?.some(scale => scale.maxPoints === 1);
+    const panelSettings = {
+      standards: showStandards.settings && toggle(showStandards.label),
+      'showLevelTagInput.enabled': showLevelTagInput.settings && toggle(showLevelTagInput.label, true),
+      visibleToStudent: showVisibleToStudent.settings && toggle(showVisibleToStudent.label),
+      excludeZero: showExcludeZero.settings && toggle(showExcludeZero.label, false, disabledExcludeZero),
+      halfScoring: showHalfScoring.settings && toggle(showHalfScoring.label),
+      'dragAndDrop.enabled': dragAndDrop.settings && toggle(dragAndDrop.label, true)
+    };
+    const panelProperties = {
+      description: showDescription.settings && toggle(showDescription.label),
+      pointLabels: showScorePointLabels.settings && toggle(showScorePointLabels.label),
+      spellCheckEnabled: spellCheck.settings && toggle(spellCheck.label),
+      maxPointsEnabled: showMaxPoint.settings && toggle(showMaxPoint.label),
+      addScaleEnabled: addScale.settings && toggle(addScale.label)
+    };
+    const getPluginProps = props => {
+      return Object.assign({
+        ...baseInputConfiguration
+      }, props || {});
+    };
+    return /*#__PURE__*/_react.default.createElement(_configUi.layout.ConfigLayout, {
+      extraCSSRules: extraCSSRules,
+      dimensions: contentDimensions,
+      hideSettings: settingsPanelDisabled,
+      settings: /*#__PURE__*/_react.default.createElement(Panel, {
+        model: model,
+        onChangeModel: this.onModelChanged,
+        configuration: configuration,
+        onChangeConfiguration: onConfigurationChanged,
+        groups: {
+          Settings: panelSettings,
+          Properties: panelProperties
+        },
+        modal: /*#__PURE__*/_react.default.createElement(ShowModal, {
+          showExcludeZeroDialog: showExcludeZeroDialog,
+          excludeZero: excludeZero,
+          changeExcludeZero: this.changeExcludeZero,
+          cancel: this.hideToggleExcludeZeroModal
+        })
+      })
+    }, /*#__PURE__*/_react.default.createElement("div", {
+      style: {
+        width: '100%'
+      },
+      ref: this.divRef
+    }), /*#__PURE__*/_react.default.createElement(StyledDiv, {
+      style: {
+        width: width || adjustedWidth
+      }
+    }, (scales || []).map((scale, scaleIndex) => /*#__PURE__*/_react.default.createElement(_scale.default, (0, _extends2.default)({
+      key: `scale-${scaleIndex}`,
+      scale: scale,
+      scaleIndex: scaleIndex,
+      errors: errors,
+      onScaleRemoved: this.onScaleRemoved,
+      onScaleChanged: this.onScaleChanged,
+      showStandards: standards,
+      showScorePointLabels: pointLabels,
+      showDescription: description,
+      showLevelTagInput: showLevelTagInput.enabled,
+      excludeZero: excludeZero,
+      enableDragAndDrop: dragAndDrop.enabled,
+      spellCheck: spellCheckEnabled,
+      width: adjustedWidth,
+      uploadSoundSupport: uploadSoundSupport,
+      maxPointsEnabled: maxPointsEnabled,
+      maxNoOfTraits: maxNoOfTraits,
+      minNoOfTraits: minNoOfTraits,
+      imageSupport: imageSupport
+    }, this.props, {
+      mathMlOptions: mathMlOptions,
+      maxMaxPoints: maxMaxPoints,
+      expandedPluginProps: getPluginProps(expandedInput?.inputConfiguration),
+      labelPluginProps: getPluginProps(labelInput?.inputConfiguration)
+    }))), addScaleEnabled && /*#__PURE__*/_react.default.createElement(_common.MultiTraitButton, {
+      onClick: this.onScaleAdded
+    }, "Add Scale")), /*#__PURE__*/_react.default.createElement(_modals.InfoDialog, {
+      open: showInfoDialog,
+      text: infoDialogText,
+      onClose: () => this.set({
+        showInfoDialog: false
+      })
+    }));
+  }
+}
+exports.Main = Main;
+Main.propTypes = {
+  model: _propTypes.default.object,
+  uploadSoundSupport: _propTypes.default.object,
+  configuration: _propTypes.default.object,
+  onModelChanged: _propTypes.default.func,
+  onConfigurationChanged: _propTypes.default.func,
+  imageSupport: _propTypes.default.shape({
+    add: _propTypes.default.func.isRequired,
+    delete: _propTypes.default.func.isRequired
+  })
+};
+var _default = exports.default = Main;
+//# sourceMappingURL=main.js.map