@pie-element/multiple-choice 6.1.7 → 6.1.8

package/configure/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pie-element/multiple-choice-configure",
-  "version": "4.0.7",
+  "version": "4.0.8",
   "private": true,
   "main": "lib/index.js",
   "module": "src/index.js",

package/controller/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@pie-element/multiple-choice-controller",
   "private": true,
-  "version": "3.5.3",
+  "version": "3.5.4",
   "description": "",
   "main": "lib/index.js",
   "module": "src/index.js",

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@pie-element/multiple-choice",
   "repository": "pie-framework/pie-elements",
-  "version": "6.1.7",
+  "version": "6.1.8",
   "publishConfig": {
     "access": "public"
   },
@@ -21,7 +21,7 @@
     "react-test-renderer": "^16.3.2",
     "react-transition-group": "^2.3.1"
   },
-  "gitHead": "a1c13d49a8db2188145733261dd177cfb6b617fb",
+  "gitHead": "ff7c86a6e386b71b47fdd28890d5a977fff15e17",
   "scripts": {
     "postpublish": "../../scripts/postpublish"
   },

package/module/configure.js

@@ -1,660 +0,0 @@
-import {_dll_react, _dll_prop_types, _dll_material_ui__core_styles, _dll_material_ui__core, _dll_lodash, _dll_pie_lib__render_ui, _dll_debug, _dll_react_dom} from "../../../@pie-lib/shared-module@^1.2.14/module/index.js";
-import {_dll_pie_lib__config_ui} from "../../../@pie-lib/config-module@^1.0.15/module/index.js";
-import {_dll_pie_lib__editable_html} from "../../../@pie-lib/editable-html-module@^1.0.15/module/index.js";
-var lib = {};
-Object.defineProperty(lib, "__esModule", {
-  value: true
-});
-class ModelUpdatedEvent extends CustomEvent {
-  constructor(update, reset = false) {
-    super(ModelUpdatedEvent.TYPE, {
-      bubbles: true,
-      detail: {
-        update,
-        reset
-      }
-    });
-    this.update = update;
-    this.reset = reset;
-  }
-}
-ModelUpdatedEvent.TYPE = 'model.updated';
-var ModelUpdatedEvent_1 = lib.ModelUpdatedEvent = ModelUpdatedEvent;
-class DeleteImageEvent extends CustomEvent {
-  constructor(src, done) {
-    super(DeleteImageEvent.TYPE, {
-      bubbles: true,
-      detail: {
-        src,
-        done
-      }
-    });
-    this.src = src;
-    this.done = done;
-  }
-}
-DeleteImageEvent.TYPE = 'delete.image';
-var DeleteImageEvent_1 = lib.DeleteImageEvent = DeleteImageEvent;
-class InsertImageEvent extends CustomEvent {
-  constructor(handler) {
-    super(InsertImageEvent.TYPE, {
-      bubbles: true,
-      detail: handler
-    });
-    this.handler = handler;
-  }
-}
-InsertImageEvent.TYPE = 'insert.image';
-var InsertImageEvent_1 = lib.InsertImageEvent = InsertImageEvent;
-const React$1 = _dll_react;
-const PropTypes = _dll_prop_types;
-const {color: color} = _dll_pie_lib__render_ui;
-const {withStyles: withStyles} = _dll_material_ui__core_styles;
-const {Button: Button} = _dll_material_ui__core;
-const {Tooltip: Tooltip} = _dll_material_ui__core;
-const {merge: merge} = _dll_lodash;
-const EditableHtml = _dll_pie_lib__editable_html;
-const {InputContainer: InputContainer} = _dll_pie_lib__config_ui;
-const {ChoiceConfiguration: ChoiceConfiguration} = _dll_pie_lib__config_ui;
-const {settings: settings} = _dll_pie_lib__config_ui;
-const {layout: layout} = _dll_pie_lib__config_ui;
-const {choiceUtils: utils$1} = _dll_pie_lib__config_ui;
-const _jsxFileName = "/home/circleci/repo/packages/multiple-choice/configure/src/main.jsx";
-const {Panel, toggle, radio, dropdown} = settings;
-const MAX_CHOICES = 9;
-const styles = theme => ({
-  promptHolder: {
-    width: '100%',
-    paddingBottom: theme.spacing.unit * 2,
-    marginBottom: theme.spacing.unit * 2
-  },
-  prompt: {
-    paddingTop: theme.spacing.unit * 2,
-    width: '100%'
-  },
-  rationaleHolder: {
-    width: '70%'
-  },
-  accessibilityHolder: {
-    width: '70%'
-  },
-  rationale: {
-    paddingTop: theme.spacing.unit * 2
-  },
-  accessibility: {
-    paddingTop: theme.spacing.unit * 2
-  },
-  design: {
-    paddingTop: theme.spacing.unit * 3
-  },
-  choiceConfigurationHolder: {
-    display: 'flex',
-    flexDirection: 'column',
-    alignItems: 'center'
-  },
-  choiceConfiguration: {
-    width: '100%',
-    paddingTop: theme.spacing.unit * 2,
-    paddingBottom: theme.spacing.unit * 2
-  },
-  switchElement: {
-    justifyContent: 'space-between',
-    margin: 0
-  },
-  addButton: {
-    float: 'right'
-  },
-  disableButton: {
-    cursor: 'not-allowed',
-    pointerEvents: 'all',
-    backgroundColor: color.disabled(),
-    '&:hover': {
-      backgroundColor: color.disabled()
-    },
-    '&:focus': {
-      backgroundColor: color.disabled()
-    }
-  }
-});
-const Design = withStyles(styles)(props => {
-  const {classes, model, configuration, onPromptChanged, onChoiceChanged, onRemoveChoice, onAddChoice, imageSupport, onChangeModel, onConfigurationChanged, onTeacherInstructionsChanged} = props;
-  const {prompt = {}, addChoiceButton = {}, limitChoicesNumber = {}, feedback = {}, deleteChoice = {}, choiceMode = {}, choicePrefix = {}, partialScoring = {}, lockChoiceOrder = {}, teacherInstructions = {}, studentInstructions = {}, rationale = {}, accessibility = {}, scoringType = {}, sequentialChoiceLabels = {}, settingsPanelDisabled, choicesLayout, gridColumns} = configuration || ({});
-  const {limitChoicesNumber: limitChoicesNumberModel, teacherInstructionsEnabled, rationaleEnabled, accessibilityLabelsEnabled, feedbackEnabled, promptEnabled, choices} = model || ({});
-  const nrOfColumnsAvailable = choices && choices.length ? Array.from({
-    length: choices.length
-  }, (_, i) => `${i + 1}`) : [];
-  const labelPlugins = {
-    audio: {
-      disabled: true
-    },
-    video: {
-      disabled: true
-    }
-  };
-  const toolbarOpts = {};
-  switch (model.toolbarEditorPosition) {
-    case 'top':
-      toolbarOpts.position = 'top';
-      break;
-    default:
-      toolbarOpts.position = 'bottom';
-      break;
-  }
-  const Content = React$1.createElement('div', {
-    __self: undefined,
-    __source: {
-      fileName: _jsxFileName,
-      lineNumber: 141
-    }
-  }, teacherInstructionsEnabled && React$1.createElement(InputContainer, {
-    label: teacherInstructions.label,
-    className: classes.promptHolder,
-    __self: undefined,
-    __source: {
-      fileName: _jsxFileName,
-      lineNumber: 143
-    }
-  }, React$1.createElement(EditableHtml, {
-    className: classes.prompt,
-    markup: model.teacherInstructions || '',
-    onChange: onTeacherInstructionsChanged,
-    imageSupport: imageSupport,
-    nonEmpty: false,
-    toolbarOpts: toolbarOpts,
-    __self: undefined,
-    __source: {
-      fileName: _jsxFileName,
-      lineNumber: 147
-    }
-  })), promptEnabled && React$1.createElement(InputContainer, {
-    label: prompt.label,
-    className: classes.promptHolder,
-    __self: undefined,
-    __source: {
-      fileName: _jsxFileName,
-      lineNumber: 159
-    }
-  }, React$1.createElement(EditableHtml, {
-    className: classes.prompt,
-    markup: model.prompt,
-    onChange: onPromptChanged,
-    imageSupport: imageSupport,
-    nonEmpty: false,
-    disableUnderline: true,
-    toolbarOpts: toolbarOpts,
-    __self: undefined,
-    __source: {
-      fileName: _jsxFileName,
-      lineNumber: 160
-    }
-  })), model.choices.map((choice, index) => React$1.createElement('div', {
-    key: `choice-${index}`,
-    className: classes.choiceConfigurationHolder,
-    __self: undefined,
-    __source: {
-      fileName: _jsxFileName,
-      lineNumber: 172
-    }
-  }, React$1.createElement(ChoiceConfiguration, {
-    key: index,
-    index: index + 1,
-    useLetterOrdering: model.choicePrefix === 'letters',
-    className: classes.choiceConfiguration,
-    mode: model.choiceMode,
-    data: choice,
-    defaultFeedback: {},
-    imageSupport: imageSupport,
-    onDelete: () => onRemoveChoice(index),
-    onChange: c => onChoiceChanged(index, c),
-    allowFeedBack: feedbackEnabled,
-    allowDelete: deleteChoice.settings,
-    noLabels: true,
-    toolbarOpts: toolbarOpts,
-    __self: undefined,
-    __source: {
-      fileName: _jsxFileName,
-      lineNumber: 176
-    }
-  }), rationaleEnabled && React$1.createElement(InputContainer, {
-    key: `rationale-${index}`,
-    label: rationale.label,
-    className: classes.rationaleHolder,
-    __self: undefined,
-    __source: {
-      fileName: _jsxFileName,
-      lineNumber: 193
-    }
-  }, React$1.createElement(EditableHtml, {
-    className: classes.rationale,
-    markup: choice.rationale || '',
-    onChange: c => onChoiceChanged(index, {
-      ...choice,
-      rationale: c
-    }),
-    imageSupport: imageSupport,
-    toolbarOpts: toolbarOpts,
-    pluginProps: labelPlugins,
-    __self: undefined,
-    __source: {
-      fileName: _jsxFileName,
-      lineNumber: 198
-    }
-  })), accessibilityLabelsEnabled && React$1.createElement(InputContainer, {
-    key: `accessibility-${index}`,
-    label: accessibility.label,
-    className: classes.accessibilityHolder,
-    __self: undefined,
-    __source: {
-      fileName: _jsxFileName,
-      lineNumber: 214
-    }
-  }, React$1.createElement(EditableHtml, {
-    className: classes.accessibility,
-    markup: choice.accessibility || '',
-    onChange: c => onChoiceChanged(index, {
-      ...choice,
-      accessibility: c
-    }),
-    imageSupport: imageSupport,
-    pluginProps: labelPlugins,
-    __self: undefined,
-    __source: {
-      fileName: _jsxFileName,
-      lineNumber: 219
-    }
-  })))), React$1.createElement('br', {
-    __self: undefined,
-    __source: {
-      fileName: _jsxFileName,
-      lineNumber: 235
-    }
-  }), addChoiceButton.settings && React$1.createElement(Tooltip, {
-    title: limitChoicesNumberModel && model.choices.length >= MAX_CHOICES ? `Only ${MAX_CHOICES} allowed maximum` : '',
-    classes: {
-      tooltip: classes.tooltip
-    },
-    __self: undefined,
-    __source: {
-      fileName: _jsxFileName,
-      lineNumber: 237
-    }
-  }, React$1.createElement(Button, {
-    classes: {
-      root: limitChoicesNumberModel && model.choices.length >= MAX_CHOICES ? classes.disableButton : undefined
-    },
-    className: classes.addButton,
-    variant: "contained",
-    color: "primary",
-    onClick: onAddChoice,
-    __self: undefined,
-    __source: {
-      fileName: _jsxFileName,
-      lineNumber: 238
-    }
-  }, addChoiceButton.label)));
-  const settingsInPanel = {
-    choiceMode: choiceMode.settings && radio(choiceMode.label, ['checkbox', 'radio']),
-    'sequentialChoiceLabels.enabled': sequentialChoiceLabels.settings && toggle(sequentialChoiceLabels.label, true),
-    choicePrefix: choicePrefix.settings && radio(choicePrefix.label, ['numbers', 'letters']),
-    partialScoring: partialScoring.settings && toggle(partialScoring.label),
-    limitChoicesNumber: limitChoicesNumber.settings && toggle(limitChoicesNumber.label),
-    lockChoiceOrder: lockChoiceOrder.settings && toggle(lockChoiceOrder.label),
-    feedbackEnabled: feedback.settings && toggle(feedback.label),
-    choicesLayout: choicesLayout.settings && dropdown(choicesLayout.label, ['vertical', 'grid', 'horizontal']),
-    gridColumns: choicesLayout.settings && model.choicesLayout === 'grid' && nrOfColumnsAvailable.length > 0 && dropdown(gridColumns.label, nrOfColumnsAvailable)
-  };
-  return React$1.createElement('div', {
-    className: classes.design,
-    __self: undefined,
-    __source: {
-      fileName: _jsxFileName,
-      lineNumber: 278
-    }
-  }, settingsPanelDisabled ? Content : React$1.createElement(layout.ConfigLayout, {
-    settings: React$1.createElement(Panel, {
-      model: model,
-      onChangeModel: onChangeModel,
-      configuration: configuration,
-      onChangeConfiguration: onConfigurationChanged,
-      groups: {
-        Settings: settingsInPanel,
-        Properties: {
-          teacherInstructionsEnabled: teacherInstructions.settings && toggle(teacherInstructions.label),
-          studentInstructionsEnabled: studentInstructions.settings && toggle(studentInstructions.label),
-          promptEnabled: prompt.settings && toggle(prompt.label),
-          rationaleEnabled: rationale.settings && toggle(rationale.label),
-          accessibilityLabelsEnabled: accessibility.settings && toggle(accessibility.label),
-          scoringType: scoringType.settings && radio(scoringType.label, ['auto', 'rubric'])
-        }
-      },
-      __self: undefined,
-      __source: {
-        fileName: _jsxFileName,
-        lineNumber: 284
-      }
-    }),
-    __self: undefined,
-    __source: {
-      fileName: _jsxFileName,
-      lineNumber: 282
-    }
-  }, Content));
-});
-class Main extends React$1.Component {
-  constructor(...args) {
-    super(...args);
-    Main.prototype.__init.call(this);
-    Main.prototype.__init2.call(this);
-    Main.prototype.__init3.call(this);
-    Main.prototype.__init4.call(this);
-    Main.prototype.__init5.call(this);
-    Main.prototype.__init6.call(this);
-  }
-  static __initStatic() {
-    this.propTypes = {
-      model: PropTypes.object.isRequired,
-      disableSidePanel: PropTypes.bool,
-      onModelChanged: PropTypes.func.isRequired,
-      onConfigurationChanged: PropTypes.func.isRequired,
-      classes: PropTypes.object.isRequired,
-      imageSupport: PropTypes.shape({
-        add: PropTypes.func.isRequired,
-        delete: PropTypes.func.isRequired
-      })
-    };
-  }
-  __init() {
-    this.onRemoveChoice = index => {
-      const {model} = this.props;
-      model.choices.splice(index, 1);
-      this.props.onModelChanged(model);
-    };
-  }
-  __init2() {
-    this.onAddChoice = () => {
-      const {model} = this.props;
-      if (!model.limitChoicesNumber || model.limitChoicesNumber && model.choices.length < MAX_CHOICES) {
-        model.choices.push({
-          label: '',
-          value: utils$1.firstAvailableIndex(model.choices.map(c => c.value), 0),
-          feedback: {
-            type: 'none'
-          }
-        });
-        this.props.onModelChanged(model);
-      }
-    };
-  }
-  __init3() {
-    this.onChoiceChanged = (index, choice) => {
-      const {model} = this.props;
-      if (choice.correct && model.choiceMode === 'radio') {
-        model.choices = model.choices.map(c => {
-          return merge({}, c, {
-            correct: false
-          });
-        });
-      }
-      model.choices.splice(index, 1, choice);
-      this.props.onModelChanged(model);
-    };
-  }
-  __init4() {
-    this.onPromptChanged = prompt => {
-      this.props.onModelChanged({
-        ...this.props.model,
-        prompt
-      });
-    };
-  }
-  __init5() {
-    this.onTeacherInstructionsChanged = teacherInstructions => {
-      this.props.onModelChanged({
-        ...this.props.model,
-        teacherInstructions
-      });
-    };
-  }
-  __init6() {
-    this.onModelChanged = (model, key) => {
-      const {onModelChanged} = this.props;
-      switch (key) {
-        case 'choiceMode':
-          {
-            let value = model.choiceMode;
-            if (value === 'radio') {
-              let correctFound = false;
-              model.choices = model.choices.map(c => {
-                if (correctFound) {
-                  c.correct = false;
-                  return c;
-                }
-                if (c.correct) {
-                  correctFound = true;
-                }
-                return c;
-              });
-            }
-            onModelChanged(model, true);
-            break;
-          }
-        default:
-          onModelChanged(model);
-          break;
-      }
-    };
-  }
-  render() {
-    return React$1.createElement(Design, {
-      ...this.props,
-      onChangeModel: this.onModelChanged,
-      onRemoveChoice: this.onRemoveChoice,
-      onChoiceChanged: this.onChoiceChanged,
-      onAddChoice: this.onAddChoice,
-      onPromptChanged: this.onPromptChanged,
-      onTeacherInstructionsChanged: this.onTeacherInstructionsChanged,
-      __self: this,
-      __source: {
-        fileName: _jsxFileName,
-        lineNumber: 414
-      }
-    });
-  }
-}
-Main.__initStatic();
-const Styled = withStyles(styles)(Main);
-var sensibleDefaults = {
-  model: {
-    choiceMode: 'checkbox',
-    choicePrefix: 'letters',
-    choices: [],
-    prompt: 'Question Prompt goes here',
-    lockChoiceOrder: true,
-    partialScoring: true,
-    scoringType: 'auto',
-    feedbackEnabled: true,
-    promptEnabled: true,
-    rationaleEnabled: true,
-    limitChoicesNumber: true,
-    teacherInstructionsEnabled: true,
-    studentInstructionsEnabled: true,
-    toolbarEditorPosition: 'bottom',
-    choicesLayout: 'vertical',
-    gridColumns: '2'
-  },
-  configuration: {
-    choicesLayout: {
-      settings: false,
-      label: 'Choices Layout'
-    },
-    gridColumns: {
-      label: 'Grid columns'
-    },
-    answerChoiceCount: 0,
-    addChoiceButton: {
-      settings: true,
-      label: 'Add a Choice'
-    },
-    limitChoicesNumber: {
-      settings: true,
-      label: 'Limit choices to 9'
-    },
-    choiceMode: {
-      settings: true,
-      label: 'Response Type'
-    },
-    choicePrefix: {
-      settings: true,
-      label: 'Choice Labels'
-    },
-    deleteChoice: {
-      settings: true
-    },
-    feedback: {
-      settings: true,
-      label: 'Feedback'
-    },
-    prompt: {
-      settings: true,
-      label: 'Prompt'
-    },
-    lockChoiceOrder: {
-      settings: true,
-      label: 'Lock Choice Order'
-    },
-    partialScoring: {
-      settings: false,
-      label: 'Allow Partial Scoring'
-    },
-    rationale: {
-      settings: true,
-      label: 'Rationale'
-    },
-    accessibility: {
-      settings: false,
-      label: 'Accessibility Label'
-    },
-    scoringType: {
-      settings: false,
-      label: 'Scoring Type'
-    },
-    studentInstructions: {
-      settings: false,
-      label: 'Student Instructions'
-    },
-    teacherInstructions: {
-      settings: true,
-      label: 'Teacher Instructions'
-    },
-    toolbarEditorPosition: {
-      settings: false,
-      label: 'Toolbar Editor Position'
-    }
-  }
-};
-const React = _dll_react;
-const ReactDOM = _dll_react_dom;
-const debug = _dll_debug;
-const {defaults: defaults} = _dll_lodash;
-const {choiceUtils: utils} = _dll_pie_lib__config_ui;
-const log = debug('multiple-choice:configure');
-const generateFormattedChoices = (choices, choiceCount = 0) => {
-  if (!choices || choices.length === 0) {
-    let formattedChoices = [];
-    for (let i = 0; i < choiceCount; i++) {
-      formattedChoices.push({
-        value: `${i}`,
-        label: '',
-        feedback: {
-          type: 'none',
-          value: ''
-        }
-      });
-    }
-    return formattedChoices;
-  }
-  return choices;
-};
-const prepareCustomizationObject = (config, model) => {
-  const configuration = defaults(config, sensibleDefaults.configuration);
-  return {
-    configuration,
-    model: {
-      ...model,
-      choices: generateFormattedChoices(model && model.choices || [], configuration && configuration.answerChoiceCount)
-    }
-  };
-};
-class MultipleChoice extends HTMLElement {
-  static __initStatic() {
-    this.createDefaultModel = (model = {}) => {
-      const normalizedModel = utils.normalizeChoices({
-        ...sensibleDefaults.model,
-        ...model,
-        choices: generateFormattedChoices(model && model.choices || [])
-      });
-      normalizedModel.choicesLayout = model.choicesLayout || model.verticalMode === false && 'horizontal' || sensibleDefaults.model.choicesLayout;
-      return normalizedModel;
-    };
-  }
-  constructor() {
-    super();
-    this._model = MultipleChoice.createDefaultModel();
-    this._configuration = sensibleDefaults.configuration;
-    this.onModelChanged = this.onModelChanged.bind(this);
-    this.onConfigurationChanged = this.onConfigurationChanged.bind(this);
-  }
-  set model(s) {
-    this._model = MultipleChoice.createDefaultModel(s);
-    this._render();
-  }
-  set configuration(c) {
-    const info = prepareCustomizationObject(c, this._model);
-    this.onModelChanged(info.model);
-    this._configuration = info.configuration;
-    this._render();
-  }
-  set disableSidePanel(s) {
-    this._disableSidePanel = s;
-    this._render();
-  }
-  dispatchModelUpdated(reset) {
-    const resetValue = !!reset;
-    this.dispatchEvent(new ModelUpdatedEvent_1(this._model, resetValue));
-  }
-  onModelChanged(m, reset) {
-    this._model = m;
-    this._render();
-    this.dispatchModelUpdated(reset);
-  }
-  onConfigurationChanged(c) {
-    this._configuration = prepareCustomizationObject(c, this._model).configuration;
-    if (this._model) {
-      this.onModelChanged(this._model);
-    }
-    this._render();
-  }
-  insertImage(handler) {
-    this.dispatchEvent(new InsertImageEvent_1(handler));
-  }
-  onDeleteImage(src, done) {
-    this.dispatchEvent(new DeleteImageEvent_1(src, done));
-  }
-  _render() {
-    log('_render');
-    let element = React.createElement(Styled, {
-      model: this._model,
-      configuration: this._configuration,
-      onModelChanged: this.onModelChanged,
-      onConfigurationChanged: this.onConfigurationChanged,
-      disableSidePanel: this._disableSidePanel,
-      imageSupport: {
-        add: this.insertImage.bind(this),
-        delete: this.onDeleteImage.bind(this)
-      }
-    });
-    ReactDOM.render(element, this);
-  }
-}
-MultipleChoice.__initStatic();
-export {MultipleChoice as default};