@pie-element/drag-in-the-blank 4.8.1-next.36 → 4.8.1-next.51

package/configure/lib/choices.js

@@ -58,21 +58,26 @@ window.renMath = _mathRendering.renderMath;
 var styles = function styles(theme) {
   return {
     design: {
-      marginTop: theme.spacing.unit * 2
+      display: 'flex',
+      flexDirection: 'column',
+      marginBottom: theme.spacing.unit * 1.5
+    },
+    addButton: {
+      marginLeft: 'auto'
     },
     altChoices: {
       alignItems: 'flex-start',
       display: 'flex',
       flexWrap: 'wrap',
       justifyContent: 'space-evenly',
-      margin: "".concat(theme.spacing.unit, "px 0"),
+      marginTop: theme.spacing.unit,
       '& > *': {
         margin: theme.spacing.unit
       }
     },
     errorText: {
       fontSize: theme.typography.fontSize - 2,
-      color: 'red',
+      color: theme.palette.error.main,
       paddingBottom: theme.spacing.unit * 2
     }
   };

package/configure/lib/choices.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/choices.jsx"],"names":["window","renMath","renderMath","styles","theme","design","marginTop","spacing","unit","altChoices","alignItems","display","flexWrap","justifyContent","margin","errorText","fontSize","typography","color","paddingBottom","Choices","showWarning","domNode","ReactDOM","findDOMNode","prevValue","val","key","props","onChange","model","choices","correctResponse","alternateResponses","duplicatedValue","find","c","value","id","newChoices","filter","setState","map","choice","usedForResponse","Object","keys","forEach","responseKey","values","alternate","indexOf","alert","newChoicesWithoutTheEmptyOne","focusedEl","oldChoices","length","duplicates","v","rerenderMath","focusedNodeRef","focus","state","classes","error","maxChoices","toolbarOpts","uploadSoundSupport","visibleChoices","getVisibleChoices","addButton","onAddChoice","index","minWidth","zIndex","ref","prompt","video","disabled","audio","onChoiceChanged","undefined","onChoiceFocus","onChoiceRemove","React","Component","PropTypes","bool","string","object","isRequired","func","number","Styled"],"mappings":"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","sourcesContent":["import React from 'react';\nimport ReactDOM from 'react-dom';\nimport PropTypes from 'prop-types';\nimport EditableHtml from '@pie-lib/editable-html';\nimport { renderMath } from '@pie-lib/math-rendering';\nimport find from 'lodash/find';\nimport Button from '@material-ui/core/Button';\nimport Choice from './choice';\nimport { choiceIsEmpty } from './markupUtils';\nimport { withStyles } from '@material-ui/core/styles';\nimport { AlertDialog } from '@pie-lib/config-ui';\n\nwindow.renMath = renderMath;\n\nconst styles = (theme) => ({\n  design: {\n    marginTop: theme.spacing.unit * 2,\n  },\n  altChoices: {\n    alignItems: 'flex-start',\n    display: 'flex',\n    flexWrap: 'wrap',\n    justifyContent: 'space-evenly',\n    margin: `${theme.spacing.unit}px 0`,\n\n    '& > *': {\n      margin: theme.spacing.unit,\n    },\n  },\n  errorText: {\n    fontSize: theme.typography.fontSize - 2,\n    color: 'red',\n    paddingBottom: theme.spacing.unit * 2,\n  },\n});\n\nexport class Choices extends React.Component {\n  static propTypes = {\n    duplicates: PropTypes.bool,\n    error: PropTypes.string,\n    model: PropTypes.object.isRequired,\n    onChange: PropTypes.func.isRequired,\n    classes: PropTypes.object.isRequired,\n    toolbarOpts: PropTypes.object,\n    maxChoices: PropTypes.number,\n    uploadSoundSupport: PropTypes.object,\n  };\n\n  state = { showWarning: false };\n\n  componentDidMount() {\n    this.rerenderMath();\n  }\n\n  componentDidUpdate() {\n    this.rerenderMath();\n\n    if (this.focusedNodeRef) {\n      this.focusedNodeRef.focus('end');\n    }\n  }\n\n  rerenderMath = () => {\n    //eslint-disable-next-line\n    const domNode = ReactDOM.findDOMNode(this);\n\n    renderMath(domNode);\n  };\n\n  onChoiceChanged = (prevValue, val, key) => {\n    const { onChange, model } = this.props;\n    const { choices, correctResponse, alternateResponses } = model;\n    const duplicatedValue = (choices || []).find((c) => c.value === val && c.id !== key);\n\n    // discard the new added choice or the changes if the choice would be a duplicate to one that already exists\n    if (duplicatedValue) {\n      if (prevValue === '') {\n        // remove the new added choice from choices\n        const newChoices = (choices || []).filter((c) => c.id !== key);\n\n        onChange(newChoices);\n      }\n\n      this.setState({ showWarning: true });\n\n      return;\n    }\n\n    const newChoices = choices?.map((choice) => (choice.id === key ? { ...choice, value: val } : choice)) || [];\n\n    if (choiceIsEmpty({ value: val })) {\n      // if the edited content is empty, its usage has to be searched in the correct response definitions\n      let usedForResponse = false;\n\n      if (correctResponse) {\n        Object.keys(correctResponse).forEach((responseKey) => {\n          if (correctResponse[responseKey] === key) {\n            usedForResponse = true;\n          }\n        });\n      }\n\n      if (alternateResponses) {\n        Object.values(alternateResponses).forEach((alternate) => {\n          if (alternate.indexOf(key) >= 0) {\n            usedForResponse = true;\n          }\n        });\n      }\n\n      if (usedForResponse) {\n        alert('Answer choices cannot be blank.');\n      } else {\n        if (!choiceIsEmpty({ value: prevValue })) {\n          // if the previous value was not empty, it means that the choice can be deleted\n          const newChoicesWithoutTheEmptyOne = newChoices.filter((choice) => choice.id !== key);\n\n          onChange(newChoicesWithoutTheEmptyOne);\n        } else {\n          onChange(newChoices);\n        }\n      }\n    } else {\n      onChange(newChoices);\n    }\n  };\n\n  onChoiceFocus = (id) =>\n    this.setState({\n      focusedEl: id,\n    });\n\n  onAddChoice = () => {\n    const {\n      model: { choices: oldChoices },\n      onChange,\n    } = this.props;\n\n    this.setState(\n      {\n        focusedEl: `${oldChoices.length}`,\n      },\n      () => {\n        onChange([\n          ...oldChoices,\n          {\n            id: `${oldChoices.length}`,\n            value: '',\n          },\n        ]);\n      },\n    );\n  };\n\n  onChoiceRemove = (id) => {\n    const {\n      onChange,\n      model: { choices },\n    } = this.props;\n    const newChoices = (choices || []).filter((choice) => choice.id !== id);\n\n    onChange(newChoices);\n  };\n\n  getVisibleChoices = () => {\n    const {\n      duplicates,\n      model: { choices, correctResponse },\n    } = this.props;\n\n    if (!choices) {\n      return [];\n    }\n\n    if (duplicates) {\n      return choices;\n    }\n\n    // if duplicates not allowed, remove the choices that are used to define the correct response\n    return choices.filter((choice) => !find(correctResponse, (v) => v === choice.id));\n  };\n\n  render() {\n    const { focusedEl, showWarning } = this.state;\n    const {\n      classes,\n      duplicates,\n      error,\n      maxChoices,\n      model: { choices },\n      toolbarOpts,\n      uploadSoundSupport,\n    } = this.props;\n    const visibleChoices = this.getVisibleChoices() || [];\n\n    return (\n      <div className={classes.design}>\n        <Button\n          className={classes.addButton}\n          variant=\"contained\"\n          color=\"primary\"\n          onClick={this.onAddChoice}\n          disabled={maxChoices && choices && maxChoices === choices.length}\n        >\n          Add Choice\n        </Button>\n\n        <div className={classes.altChoices}>\n          {visibleChoices.map((choice, index) =>\n            focusedEl === choice.id ? (\n              <div\n                key={index}\n                style={{\n                  minWidth: '100%',\n                  zIndex: '100',\n                }}\n              >\n                <EditableHtml\n                  ref={(ref) => (this.focusedNodeRef = ref)}\n                  className={classes.prompt}\n                  markup={choice.value}\n                  pluginProps={{\n                    video: {\n                      disabled: true,\n                    },\n                    audio: {\n                      disabled: true,\n                    },\n                  }}\n                  onChange={(val) => this.onChoiceChanged(choice.value, val, choice.id)}\n                  onDone={() => {\n                    this.setState({\n                      focusedEl: undefined,\n                    });\n                  }}\n                  disableUnderline\n                  toolbarOpts={toolbarOpts}\n                  uploadSoundSupport={uploadSoundSupport}\n                />\n              </div>\n            ) : (\n              <Choice\n                key={index}\n                duplicates={duplicates}\n                targetId=\"0\"\n                choice={choice}\n                error={error}\n                onClick={() => this.onChoiceFocus(choice.id)}\n                onRemoveChoice={() => this.onChoiceRemove(choice.id)}\n              />\n            ),\n          )}\n        </div>\n        {error && <div className={classes.errorText}>{error}</div>}\n\n        <AlertDialog\n          open={showWarning}\n          title=\"Warning\"\n          text=\"Identical answer choices are not allowed and the changes will be discarded.\"\n          onConfirm={() => this.setState({ showWarning: false })}\n        />\n      </div>\n    );\n  }\n}\n\nconst Styled = withStyles(styles)(Choices);\n\nexport default Styled;\n"],"file":"choices.js"}
+{"version":3,"sources":["../src/choices.jsx"],"names":["window","renMath","renderMath","styles","theme","design","display","flexDirection","marginBottom","spacing","unit","addButton","marginLeft","altChoices","alignItems","flexWrap","justifyContent","marginTop","margin","errorText","fontSize","typography","color","palette","error","main","paddingBottom","Choices","showWarning","domNode","ReactDOM","findDOMNode","prevValue","val","key","props","onChange","model","choices","correctResponse","alternateResponses","duplicatedValue","find","c","value","id","newChoices","filter","setState","map","choice","usedForResponse","Object","keys","forEach","responseKey","values","alternate","indexOf","alert","newChoicesWithoutTheEmptyOne","focusedEl","oldChoices","length","duplicates","v","rerenderMath","focusedNodeRef","focus","state","classes","maxChoices","toolbarOpts","uploadSoundSupport","visibleChoices","getVisibleChoices","onAddChoice","index","minWidth","zIndex","ref","prompt","video","disabled","audio","onChoiceChanged","undefined","onChoiceFocus","onChoiceRemove","React","Component","PropTypes","bool","string","object","isRequired","func","number","Styled"],"mappings":"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","sourcesContent":["import React from 'react';\nimport ReactDOM from 'react-dom';\nimport PropTypes from 'prop-types';\nimport EditableHtml from '@pie-lib/editable-html';\nimport { renderMath } from '@pie-lib/math-rendering';\nimport find from 'lodash/find';\nimport Button from '@material-ui/core/Button';\nimport Choice from './choice';\nimport { choiceIsEmpty } from './markupUtils';\nimport { withStyles } from '@material-ui/core/styles';\nimport { AlertDialog } from '@pie-lib/config-ui';\n\nwindow.renMath = renderMath;\n\nconst styles = (theme) => ({\n  design: {\n    display: 'flex',\n    flexDirection: 'column',\n    marginBottom: theme.spacing.unit * 1.5,\n  },\n  addButton: {\n    marginLeft: 'auto',\n  },\n  altChoices: {\n    alignItems: 'flex-start',\n    display: 'flex',\n    flexWrap: 'wrap',\n    justifyContent: 'space-evenly',\n    marginTop: theme.spacing.unit,\n\n    '& > *': {\n      margin: theme.spacing.unit,\n    },\n  },\n  errorText: {\n    fontSize: theme.typography.fontSize - 2,\n    color: theme.palette.error.main,\n    paddingBottom: theme.spacing.unit * 2,\n  },\n});\n\nexport class Choices extends React.Component {\n  static propTypes = {\n    duplicates: PropTypes.bool,\n    error: PropTypes.string,\n    model: PropTypes.object.isRequired,\n    onChange: PropTypes.func.isRequired,\n    classes: PropTypes.object.isRequired,\n    toolbarOpts: PropTypes.object,\n    maxChoices: PropTypes.number,\n    uploadSoundSupport: PropTypes.object,\n  };\n\n  state = { showWarning: false };\n\n  componentDidMount() {\n    this.rerenderMath();\n  }\n\n  componentDidUpdate() {\n    this.rerenderMath();\n\n    if (this.focusedNodeRef) {\n      this.focusedNodeRef.focus('end');\n    }\n  }\n\n  rerenderMath = () => {\n    //eslint-disable-next-line\n    const domNode = ReactDOM.findDOMNode(this);\n\n    renderMath(domNode);\n  };\n\n  onChoiceChanged = (prevValue, val, key) => {\n    const { onChange, model } = this.props;\n    const { choices, correctResponse, alternateResponses } = model;\n    const duplicatedValue = (choices || []).find((c) => c.value === val && c.id !== key);\n\n    // discard the new added choice or the changes if the choice would be a duplicate to one that already exists\n    if (duplicatedValue) {\n      if (prevValue === '') {\n        // remove the new added choice from choices\n        const newChoices = (choices || []).filter((c) => c.id !== key);\n\n        onChange(newChoices);\n      }\n\n      this.setState({ showWarning: true });\n\n      return;\n    }\n\n    const newChoices = choices?.map((choice) => (choice.id === key ? { ...choice, value: val } : choice)) || [];\n\n    if (choiceIsEmpty({ value: val })) {\n      // if the edited content is empty, its usage has to be searched in the correct response definitions\n      let usedForResponse = false;\n\n      if (correctResponse) {\n        Object.keys(correctResponse).forEach((responseKey) => {\n          if (correctResponse[responseKey] === key) {\n            usedForResponse = true;\n          }\n        });\n      }\n\n      if (alternateResponses) {\n        Object.values(alternateResponses).forEach((alternate) => {\n          if (alternate.indexOf(key) >= 0) {\n            usedForResponse = true;\n          }\n        });\n      }\n\n      if (usedForResponse) {\n        alert('Answer choices cannot be blank.');\n      } else {\n        if (!choiceIsEmpty({ value: prevValue })) {\n          // if the previous value was not empty, it means that the choice can be deleted\n          const newChoicesWithoutTheEmptyOne = newChoices.filter((choice) => choice.id !== key);\n\n          onChange(newChoicesWithoutTheEmptyOne);\n        } else {\n          onChange(newChoices);\n        }\n      }\n    } else {\n      onChange(newChoices);\n    }\n  };\n\n  onChoiceFocus = (id) =>\n    this.setState({\n      focusedEl: id,\n    });\n\n  onAddChoice = () => {\n    const {\n      model: { choices: oldChoices },\n      onChange,\n    } = this.props;\n\n    this.setState(\n      {\n        focusedEl: `${oldChoices.length}`,\n      },\n      () => {\n        onChange([\n          ...oldChoices,\n          {\n            id: `${oldChoices.length}`,\n            value: '',\n          },\n        ]);\n      },\n    );\n  };\n\n  onChoiceRemove = (id) => {\n    const {\n      onChange,\n      model: { choices },\n    } = this.props;\n    const newChoices = (choices || []).filter((choice) => choice.id !== id);\n\n    onChange(newChoices);\n  };\n\n  getVisibleChoices = () => {\n    const {\n      duplicates,\n      model: { choices, correctResponse },\n    } = this.props;\n\n    if (!choices) {\n      return [];\n    }\n\n    if (duplicates) {\n      return choices;\n    }\n\n    // if duplicates not allowed, remove the choices that are used to define the correct response\n    return choices.filter((choice) => !find(correctResponse, (v) => v === choice.id));\n  };\n\n  render() {\n    const { focusedEl, showWarning } = this.state;\n    const {\n      classes,\n      duplicates,\n      error,\n      maxChoices,\n      model: { choices },\n      toolbarOpts,\n      uploadSoundSupport,\n    } = this.props;\n    const visibleChoices = this.getVisibleChoices() || [];\n\n    return (\n      <div className={classes.design}>\n        <Button\n          className={classes.addButton}\n          variant=\"contained\"\n          color=\"primary\"\n          onClick={this.onAddChoice}\n          disabled={maxChoices && choices && maxChoices === choices.length}\n        >\n          Add Choice\n        </Button>\n\n        <div className={classes.altChoices}>\n          {visibleChoices.map((choice, index) =>\n            focusedEl === choice.id ? (\n              <div\n                key={index}\n                style={{\n                  minWidth: '100%',\n                  zIndex: '100',\n                }}\n              >\n                <EditableHtml\n                  ref={(ref) => (this.focusedNodeRef = ref)}\n                  className={classes.prompt}\n                  markup={choice.value}\n                  pluginProps={{\n                    video: {\n                      disabled: true,\n                    },\n                    audio: {\n                      disabled: true,\n                    },\n                  }}\n                  onChange={(val) => this.onChoiceChanged(choice.value, val, choice.id)}\n                  onDone={() => {\n                    this.setState({\n                      focusedEl: undefined,\n                    });\n                  }}\n                  disableUnderline\n                  toolbarOpts={toolbarOpts}\n                  uploadSoundSupport={uploadSoundSupport}\n                />\n              </div>\n            ) : (\n              <Choice\n                key={index}\n                duplicates={duplicates}\n                targetId=\"0\"\n                choice={choice}\n                error={error}\n                onClick={() => this.onChoiceFocus(choice.id)}\n                onRemoveChoice={() => this.onChoiceRemove(choice.id)}\n              />\n            ),\n          )}\n        </div>\n        {error && <div className={classes.errorText}>{error}</div>}\n\n        <AlertDialog\n          open={showWarning}\n          title=\"Warning\"\n          text=\"Identical answer choices are not allowed and the changes will be discarded.\"\n          onConfirm={() => this.setState({ showWarning: false })}\n        />\n      </div>\n    );\n  }\n}\n\nconst Styled = withStyles(styles)(Choices);\n\nexport default Styled;\n"],"file":"choices.js"}

package/configure/lib/main.js

@@ -71,35 +71,22 @@ var styles = function styles(theme) {
   return {
     promptHolder: {
       width: '100%',
-      paddingBottom: theme.spacing.unit * 2,
-      marginBottom: theme.spacing.unit * 2
-    },
-    prompt: {
       paddingTop: theme.spacing.unit * 2,
-      width: '100%'
+      marginBottom: theme.spacing.unit * 2
     },
     markup: {
       minHeight: '235px',
-      paddingTop: theme.spacing.unit * 2,
+      paddingTop: theme.spacing.unit,
+      paddingBottom: theme.spacing.unit * 2,
       width: '100%',
       '& [data-slate-editor="true"]': {
         minHeight: '235px'
       }
     },
-    design: {
-      paddingTop: theme.spacing.unit * 3
-    },
     choiceConfiguration: {
       paddingTop: theme.spacing.unit * 2,
       paddingBottom: theme.spacing.unit * 2
     },
-    switchElement: {
-      justifyContent: 'space-between',
-      margin: 0
-    },
-    addButton: {
-      "float": 'right'
-    },
     text: {
       fontFamily: 'Cerebri Sans',
       fontSize: theme.typography.fontSize + 2,
@@ -113,7 +100,7 @@ var styles = function styles(theme) {
     },
     errorText: {
       fontSize: theme.typography.fontSize - 2,
-      color: 'red',
+      color: theme.palette.error.main,
       paddingTop: theme.spacing.unit
     },
     flexContainer: {
@@ -256,9 +243,7 @@ var Main = /*#__PURE__*/function (_React$Component) {
         promptEnabled: prompt.settings && toggle(prompt.label),
         rubricEnabled: (withRubric === null || withRubric === void 0 ? void 0 : withRubric.settings) && toggle(withRubric === null || withRubric === void 0 ? void 0 : withRubric.label)
       };
-      return /*#__PURE__*/_react["default"].createElement("div", {
-        className: classes.design
-      }, /*#__PURE__*/_react["default"].createElement(_configUi.layout.ConfigLayout, {
+      return /*#__PURE__*/_react["default"].createElement(_configUi.layout.ConfigLayout, {
         hideSettings: settingsPanelDisabled,
         settings: /*#__PURE__*/_react["default"].createElement(Panel, {
           model: model,
@@ -274,7 +259,7 @@ var Main = /*#__PURE__*/function (_React$Component) {
             Properties: panelProperties
           }
         })
-      }, /*#__PURE__*/_react["default"].createElement("div", null, teacherInstructionsEnabled && /*#__PURE__*/_react["default"].createElement(_configUi.InputContainer, {
+      }, teacherInstructionsEnabled && /*#__PURE__*/_react["default"].createElement(_configUi.InputContainer, {
         label: teacherInstructions.label,
         className: classes.promptHolder
       }, /*#__PURE__*/_react["default"].createElement(_editableHtml["default"], {
@@ -386,7 +371,7 @@ var Main = /*#__PURE__*/function (_React$Component) {
         }, {
           language: 'special'
         }]
-      })))));
+      })));
     }
   }]);
   return Main;

package/configure/lib/main.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/main.jsx"],"names":["dropdown","settings","toggle","Panel","styles","theme","promptHolder","width","paddingBottom","spacing","unit","marginBottom","prompt","paddingTop","markup","minHeight","design","choiceConfiguration","switchElement","justifyContent","margin","addButton","text","fontFamily","fontSize","typography","lineHeight","color","tooltip","whiteSpace","maxWidth","errorText","flexContainer","display","alignItems","Main","newVal","props","onModelChanged","model","rationale","teacherInstructions","slateMarkup","choices","correctResponse","domNode","ReactDOM","findDOMNode","classes","configuration","onConfigurationChanged","imageSupport","uploadSoundSupport","duplicates","partialScoring","lockChoiceOrder","choicesPosition","spellCheck","settingsPanelDisabled","maxChoices","maxResponseAreas","maxImageWidth","maxImageHeight","withRubric","rationaleEnabled","promptEnabled","teacherInstructionsEnabled","spellCheckEnabled","toolbarEditorPosition","errors","responseAreasError","choicesError","correctResponseError","validationMessage","defaultImageMaxWidth","defaultImageMaxHeight","toolbarOpts","position","panelSettings","label","panelProperties","rubricEnabled","onModelChange","Settings","Properties","onTeacherInstructionsChanged","language","onPromptChanged","marginLeft","ALL_PLUGINS","type","options","onMarkupChanged","onResponsesChanged","onRationaleChanged","React","Component","PropTypes","object","isRequired","disableSidePanel","bool","func","shape","add","Styled"],"mappings":"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","sourcesContent":["import React from 'react';\nimport ReactDOM from 'react-dom';\nimport PropTypes from 'prop-types';\nimport EditableHtml, { ALL_PLUGINS } from '@pie-lib/editable-html';\nimport { InputContainer, layout, settings } from '@pie-lib/config-ui';\nimport { withDragContext } from '@pie-lib/drag';\nimport { renderMath } from '@pie-lib/math-rendering';\nimport { withStyles } from '@material-ui/core/styles';\nimport Typography from '@material-ui/core/Typography';\nimport Info from '@material-ui/icons/Info';\nimport Tooltip from '@material-ui/core/Tooltip';\n\nimport Choices from './choices';\nimport { createSlateMarkup } from './markupUtils';\nimport { generateValidationMessage } from '../utils';\nconst { dropdown, toggle, Panel } = settings;\n\nconst styles = (theme) => ({\n  promptHolder: {\n    width: '100%',\n    paddingBottom: theme.spacing.unit * 2,\n    marginBottom: theme.spacing.unit * 2,\n  },\n  prompt: {\n    paddingTop: theme.spacing.unit * 2,\n    width: '100%',\n  },\n  markup: {\n    minHeight: '235px',\n    paddingTop: theme.spacing.unit * 2,\n    width: '100%',\n    '& [data-slate-editor=\"true\"]': {\n      minHeight: '235px',\n    },\n  },\n  design: {\n    paddingTop: theme.spacing.unit * 3,\n  },\n  choiceConfiguration: {\n    paddingTop: theme.spacing.unit * 2,\n    paddingBottom: theme.spacing.unit * 2,\n  },\n  switchElement: {\n    justifyContent: 'space-between',\n    margin: 0,\n  },\n  addButton: {\n    float: 'right',\n  },\n  text: {\n    fontFamily: 'Cerebri Sans',\n    fontSize: theme.typography.fontSize + 2,\n    lineHeight: '19px',\n    color: '#495B8F',\n  },\n  tooltip: {\n    fontSize: theme.typography.fontSize - 2,\n    whiteSpace: 'pre',\n    maxWidth: '500px',\n  },\n  errorText: {\n    fontSize: theme.typography.fontSize - 2,\n    color: 'red',\n    paddingTop: theme.spacing.unit,\n  },\n  flexContainer: {\n    display: 'flex',\n    alignItems: 'end',\n  },\n});\n\nexport class Main extends React.Component {\n  static propTypes = {\n    configuration: PropTypes.object.isRequired,\n    model: PropTypes.object.isRequired,\n    disableSidePanel: PropTypes.bool,\n    onModelChanged: PropTypes.func.isRequired,\n    onConfigurationChanged: PropTypes.func.isRequired,\n    classes: PropTypes.object.isRequired,\n    imageSupport: PropTypes.shape({\n      add: PropTypes.func.isRequired,\n      delete: PropTypes.func.isRequired,\n    }),\n  };\n\n  state = {};\n\n  componentDidUpdate() {\n    // eslint-disable-next-line\n    const domNode = ReactDOM.findDOMNode(this);\n\n    renderMath(domNode);\n  }\n\n  onModelChange = (newVal) => {\n    this.props.onModelChanged({\n      ...this.props.model,\n      ...newVal,\n    });\n  };\n\n  onPromptChanged = (prompt) => {\n    this.props.onModelChanged({\n      ...this.props.model,\n      prompt,\n    });\n  };\n\n  onRationaleChanged = (rationale) => {\n    this.props.onModelChanged({\n      ...this.props.model,\n      rationale,\n    });\n  };\n\n  onTeacherInstructionsChanged = (teacherInstructions) => {\n    this.props.onModelChanged({\n      ...this.props.model,\n      teacherInstructions,\n    });\n  };\n\n  onMarkupChanged = (slateMarkup) => {\n    this.props.onModelChanged({\n      ...this.props.model,\n      slateMarkup,\n    });\n  };\n\n  onResponsesChanged = (choices) => {\n    const {\n      model: { correctResponse, markup },\n    } = this.props;\n    const slateMarkup = createSlateMarkup(markup, choices, correctResponse);\n\n    this.props.onModelChanged({\n      ...this.props.model,\n      slateMarkup,\n      choices,\n    });\n  };\n\n  render() {\n    const { classes, model, configuration, onConfigurationChanged, imageSupport, uploadSoundSupport } = this.props;\n    const {\n      duplicates = {},\n      prompt = {},\n      partialScoring = {},\n      lockChoiceOrder = {},\n      rationale = {},\n      teacherInstructions = {},\n      choicesPosition = {},\n      spellCheck = {},\n      settingsPanelDisabled,\n      maxChoices,\n      maxResponseAreas,\n      maxImageWidth = {},\n      maxImageHeight = {},\n      withRubric = {},\n    } = configuration || {};\n    const {\n      rationaleEnabled,\n      promptEnabled,\n      teacherInstructionsEnabled,\n      spellCheckEnabled,\n      toolbarEditorPosition,\n      errors,\n    } = model || {};\n\n    const { responseAreasError, choicesError, correctResponseError } = errors || {};\n    const validationMessage = generateValidationMessage(configuration);\n\n    const defaultImageMaxWidth = maxImageWidth && maxImageWidth.prompt;\n    const defaultImageMaxHeight = maxImageHeight && maxImageHeight.prompt;\n\n    const toolbarOpts = {\n      position: toolbarEditorPosition === 'top' ? 'top' : 'bottom',\n    };\n\n    const panelSettings = {\n      partialScoring: partialScoring.settings && toggle(partialScoring.label),\n      duplicates: duplicates.settings && toggle(duplicates.label),\n      lockChoiceOrder: lockChoiceOrder.settings && toggle(lockChoiceOrder.label),\n      choicesPosition: choicesPosition.settings && dropdown(choicesPosition.label, ['above', 'below', 'left', 'right']),\n    };\n\n    const panelProperties = {\n      teacherInstructionsEnabled: teacherInstructions.settings && toggle(teacherInstructions.label),\n      rationaleEnabled: rationale.settings && toggle(rationale.label),\n      spellCheckEnabled: spellCheck.settings && toggle(spellCheck.label),\n      promptEnabled: prompt.settings && toggle(prompt.label),\n      rubricEnabled: withRubric?.settings && toggle(withRubric?.label),\n    };\n\n    return (\n      <div className={classes.design}>\n        <layout.ConfigLayout\n          hideSettings={settingsPanelDisabled}\n          settings={\n            <Panel\n              model={model}\n              configuration={configuration}\n              onChangeModel={(model) => this.onModelChange(model)}\n              onChangeConfiguration={(configuration) => onConfigurationChanged(configuration, true)}\n              groups={{\n                Settings: panelSettings,\n                Properties: panelProperties,\n              }}\n            />\n          }\n        >\n          <div>\n            {teacherInstructionsEnabled && (\n              <InputContainer label={teacherInstructions.label} className={classes.promptHolder}>\n                <EditableHtml\n                  className={classes.prompt}\n                  markup={model.teacherInstructions || ''}\n                  onChange={this.onTeacherInstructionsChanged}\n                  imageSupport={imageSupport}\n                  nonEmpty={false}\n                  toolbarOpts={toolbarOpts}\n                  spellCheck={spellCheckEnabled}\n                  maxImageWidth={(maxImageWidth && maxImageWidth.teacherInstructions) || defaultImageMaxWidth}\n                  maxImageHeight={(maxImageHeight && maxImageHeight.teacherInstructions) || defaultImageMaxHeight}\n                  uploadSoundSupport={uploadSoundSupport}\n                  languageCharactersProps={[{ language: 'spanish' }, { language: 'special' }]}\n                />\n              </InputContainer>\n            )}\n\n            {promptEnabled && (\n              <InputContainer label={prompt.label} className={classes.promptHolder}>\n                <EditableHtml\n                  className={classes.prompt}\n                  markup={model.prompt}\n                  onChange={this.onPromptChanged}\n                  imageSupport={imageSupport}\n                  nonEmpty={false}\n                  disableUnderline\n                  toolbarOpts={toolbarOpts}\n                  spellCheck={spellCheckEnabled}\n                  maxImageWidth={defaultImageMaxWidth}\n                  maxImageHeight={defaultImageMaxHeight}\n                  uploadSoundSupport={uploadSoundSupport}\n                  languageCharactersProps={[{ language: 'spanish' }, { language: 'special' }]}\n                />\n              </InputContainer>\n            )}\n\n            <div className={classes.flexContainer}>\n              <Typography className={classes.text}>Define Template, Choices, and Correct Responses</Typography>\n              <Tooltip\n                classes={{ tooltip: classes.tooltip }}\n                disableFocusListener\n                disableTouchListener\n                placement={'right'}\n                title={validationMessage}\n              >\n                <Info fontSize={'small'} color={'primary'} style={{ marginLeft: '5px' }} />\n              </Tooltip>\n            </div>\n\n            <EditableHtml\n              activePlugins={ALL_PLUGINS}\n              responseAreaProps={{\n                type: 'drag-in-the-blank',\n                options: {\n                  duplicates: model.duplicates,\n                },\n                maxResponseAreas: maxResponseAreas,\n              }}\n              className={classes.markup}\n              markup={model.slateMarkup}\n              onChange={this.onMarkupChanged}\n              imageSupport={imageSupport}\n              disableImageAlignmentButtons={true}\n              nonEmpty={false}\n              disableUnderline\n              error={responseAreasError || correctResponseError}\n              toolbarOpts={toolbarOpts}\n              spellCheck={spellCheckEnabled}\n              uploadSoundSupport={uploadSoundSupport}\n              languageCharactersProps={[{ language: 'spanish' }, { language: 'special' }]}\n            />\n            {responseAreasError && <div className={classes.errorText}>{responseAreasError}</div>}\n            {correctResponseError && <div className={classes.errorText}>{correctResponseError}</div>}\n\n            <Choices\n              model={model}\n              duplicates={model.duplicates}\n              error={choicesError}\n              onChange={this.onResponsesChanged}\n              toolbarOpts={toolbarOpts}\n              maxChoices={maxChoices}\n              uploadSoundSupport={uploadSoundSupport}\n            />\n\n            {rationaleEnabled && (\n              <InputContainer label={rationale.label} className={classes.promptHolder}>\n                <EditableHtml\n                  className={classes.prompt}\n                  markup={model.rationale || ''}\n                  onChange={this.onRationaleChanged}\n                  imageSupport={imageSupport}\n                  toolbarOpts={toolbarOpts}\n                  spellCheck={spellCheckEnabled}\n                  maxImageWidth={(maxImageWidth && maxImageWidth.rationale) || defaultImageMaxWidth}\n                  maxImageHeight={(maxImageHeight && maxImageHeight.rationale) || defaultImageMaxHeight}\n                  uploadSoundSupport={uploadSoundSupport}\n                  languageCharactersProps={[{ language: 'spanish' }, { language: 'special' }]}\n                />\n              </InputContainer>\n            )}\n          </div>\n        </layout.ConfigLayout>\n      </div>\n    );\n  }\n}\n\nconst Styled = withStyles(styles)(Main);\n\nexport default withDragContext(Styled);\n"],"file":"main.js"}
+{"version":3,"sources":["../src/main.jsx"],"names":["dropdown","settings","toggle","Panel","styles","theme","promptHolder","width","paddingTop","spacing","unit","marginBottom","markup","minHeight","paddingBottom","choiceConfiguration","text","fontFamily","fontSize","typography","lineHeight","color","tooltip","whiteSpace","maxWidth","errorText","palette","error","main","flexContainer","display","alignItems","Main","newVal","props","onModelChanged","model","prompt","rationale","teacherInstructions","slateMarkup","choices","correctResponse","domNode","ReactDOM","findDOMNode","classes","configuration","onConfigurationChanged","imageSupport","uploadSoundSupport","duplicates","partialScoring","lockChoiceOrder","choicesPosition","spellCheck","settingsPanelDisabled","maxChoices","maxResponseAreas","maxImageWidth","maxImageHeight","withRubric","rationaleEnabled","promptEnabled","teacherInstructionsEnabled","spellCheckEnabled","toolbarEditorPosition","errors","responseAreasError","choicesError","correctResponseError","validationMessage","defaultImageMaxWidth","defaultImageMaxHeight","toolbarOpts","position","panelSettings","label","panelProperties","rubricEnabled","onModelChange","Settings","Properties","onTeacherInstructionsChanged","language","onPromptChanged","marginLeft","ALL_PLUGINS","type","options","onMarkupChanged","onResponsesChanged","onRationaleChanged","React","Component","PropTypes","object","isRequired","disableSidePanel","bool","func","shape","add","Styled"],"mappings":"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","sourcesContent":["import React from 'react';\nimport ReactDOM from 'react-dom';\nimport PropTypes from 'prop-types';\nimport EditableHtml, { ALL_PLUGINS } from '@pie-lib/editable-html';\nimport { InputContainer, layout, settings } from '@pie-lib/config-ui';\nimport { withDragContext } from '@pie-lib/drag';\nimport { renderMath } from '@pie-lib/math-rendering';\nimport { withStyles } from '@material-ui/core/styles';\nimport Typography from '@material-ui/core/Typography';\nimport Info from '@material-ui/icons/Info';\nimport Tooltip from '@material-ui/core/Tooltip';\n\nimport Choices from './choices';\nimport { createSlateMarkup } from './markupUtils';\nimport { generateValidationMessage } from '../utils';\nconst { dropdown, toggle, Panel } = settings;\n\nconst styles = (theme) => ({\n  promptHolder: {\n    width: '100%',\n    paddingTop: theme.spacing.unit * 2,\n    marginBottom: theme.spacing.unit * 2,\n  },\n  markup: {\n    minHeight: '235px',\n    paddingTop: theme.spacing.unit,\n    paddingBottom: theme.spacing.unit * 2,\n    width: '100%',\n    '& [data-slate-editor=\"true\"]': {\n      minHeight: '235px',\n    },\n  },\n  choiceConfiguration: {\n    paddingTop: theme.spacing.unit * 2,\n    paddingBottom: theme.spacing.unit * 2,\n  },\n  text: {\n    fontFamily: 'Cerebri Sans',\n    fontSize: theme.typography.fontSize + 2,\n    lineHeight: '19px',\n    color: '#495B8F',\n  },\n  tooltip: {\n    fontSize: theme.typography.fontSize - 2,\n    whiteSpace: 'pre',\n    maxWidth: '500px',\n  },\n  errorText: {\n    fontSize: theme.typography.fontSize - 2,\n    color: theme.palette.error.main,\n    paddingTop: theme.spacing.unit,\n  },\n  flexContainer: {\n    display: 'flex',\n    alignItems: 'end',\n  },\n});\n\nexport class Main extends React.Component {\n  static propTypes = {\n    configuration: PropTypes.object.isRequired,\n    model: PropTypes.object.isRequired,\n    disableSidePanel: PropTypes.bool,\n    onModelChanged: PropTypes.func.isRequired,\n    onConfigurationChanged: PropTypes.func.isRequired,\n    classes: PropTypes.object.isRequired,\n    imageSupport: PropTypes.shape({\n      add: PropTypes.func.isRequired,\n      delete: PropTypes.func.isRequired,\n    }),\n  };\n\n  state = {};\n\n  componentDidUpdate() {\n    // eslint-disable-next-line\n    const domNode = ReactDOM.findDOMNode(this);\n\n    renderMath(domNode);\n  }\n\n  onModelChange = (newVal) => {\n    this.props.onModelChanged({\n      ...this.props.model,\n      ...newVal,\n    });\n  };\n\n  onPromptChanged = (prompt) => {\n    this.props.onModelChanged({\n      ...this.props.model,\n      prompt,\n    });\n  };\n\n  onRationaleChanged = (rationale) => {\n    this.props.onModelChanged({\n      ...this.props.model,\n      rationale,\n    });\n  };\n\n  onTeacherInstructionsChanged = (teacherInstructions) => {\n    this.props.onModelChanged({\n      ...this.props.model,\n      teacherInstructions,\n    });\n  };\n\n  onMarkupChanged = (slateMarkup) => {\n    this.props.onModelChanged({\n      ...this.props.model,\n      slateMarkup,\n    });\n  };\n\n  onResponsesChanged = (choices) => {\n    const {\n      model: { correctResponse, markup },\n    } = this.props;\n    const slateMarkup = createSlateMarkup(markup, choices, correctResponse);\n\n    this.props.onModelChanged({\n      ...this.props.model,\n      slateMarkup,\n      choices,\n    });\n  };\n\n  render() {\n    const { classes, model, configuration, onConfigurationChanged, imageSupport, uploadSoundSupport } = this.props;\n    const {\n      duplicates = {},\n      prompt = {},\n      partialScoring = {},\n      lockChoiceOrder = {},\n      rationale = {},\n      teacherInstructions = {},\n      choicesPosition = {},\n      spellCheck = {},\n      settingsPanelDisabled,\n      maxChoices,\n      maxResponseAreas,\n      maxImageWidth = {},\n      maxImageHeight = {},\n      withRubric = {},\n    } = configuration || {};\n    const {\n      rationaleEnabled,\n      promptEnabled,\n      teacherInstructionsEnabled,\n      spellCheckEnabled,\n      toolbarEditorPosition,\n      errors,\n    } = model || {};\n\n    const { responseAreasError, choicesError, correctResponseError } = errors || {};\n    const validationMessage = generateValidationMessage(configuration);\n\n    const defaultImageMaxWidth = maxImageWidth && maxImageWidth.prompt;\n    const defaultImageMaxHeight = maxImageHeight && maxImageHeight.prompt;\n\n    const toolbarOpts = {\n      position: toolbarEditorPosition === 'top' ? 'top' : 'bottom',\n    };\n\n    const panelSettings = {\n      partialScoring: partialScoring.settings && toggle(partialScoring.label),\n      duplicates: duplicates.settings && toggle(duplicates.label),\n      lockChoiceOrder: lockChoiceOrder.settings && toggle(lockChoiceOrder.label),\n      choicesPosition: choicesPosition.settings && dropdown(choicesPosition.label, ['above', 'below', 'left', 'right']),\n    };\n\n    const panelProperties = {\n      teacherInstructionsEnabled: teacherInstructions.settings && toggle(teacherInstructions.label),\n      rationaleEnabled: rationale.settings && toggle(rationale.label),\n      spellCheckEnabled: spellCheck.settings && toggle(spellCheck.label),\n      promptEnabled: prompt.settings && toggle(prompt.label),\n      rubricEnabled: withRubric?.settings && toggle(withRubric?.label),\n    };\n\n    return (\n      <layout.ConfigLayout\n        hideSettings={settingsPanelDisabled}\n        settings={\n          <Panel\n            model={model}\n            configuration={configuration}\n            onChangeModel={(model) => this.onModelChange(model)}\n            onChangeConfiguration={(configuration) => onConfigurationChanged(configuration, true)}\n            groups={{\n              Settings: panelSettings,\n              Properties: panelProperties,\n            }}\n          />\n        }\n      >\n        {teacherInstructionsEnabled && (\n          <InputContainer label={teacherInstructions.label} className={classes.promptHolder}>\n            <EditableHtml\n              className={classes.prompt}\n              markup={model.teacherInstructions || ''}\n              onChange={this.onTeacherInstructionsChanged}\n              imageSupport={imageSupport}\n              nonEmpty={false}\n              toolbarOpts={toolbarOpts}\n              spellCheck={spellCheckEnabled}\n              maxImageWidth={(maxImageWidth && maxImageWidth.teacherInstructions) || defaultImageMaxWidth}\n              maxImageHeight={(maxImageHeight && maxImageHeight.teacherInstructions) || defaultImageMaxHeight}\n              uploadSoundSupport={uploadSoundSupport}\n              languageCharactersProps={[{ language: 'spanish' }, { language: 'special' }]}\n            />\n          </InputContainer>\n        )}\n\n        {promptEnabled && (\n          <InputContainer label={prompt.label} className={classes.promptHolder}>\n            <EditableHtml\n              className={classes.prompt}\n              markup={model.prompt}\n              onChange={this.onPromptChanged}\n              imageSupport={imageSupport}\n              nonEmpty={false}\n              disableUnderline\n              toolbarOpts={toolbarOpts}\n              spellCheck={spellCheckEnabled}\n              maxImageWidth={defaultImageMaxWidth}\n              maxImageHeight={defaultImageMaxHeight}\n              uploadSoundSupport={uploadSoundSupport}\n              languageCharactersProps={[{ language: 'spanish' }, { language: 'special' }]}\n            />\n          </InputContainer>\n        )}\n\n        <div className={classes.flexContainer}>\n          <Typography className={classes.text}>Define Template, Choices, and Correct Responses</Typography>\n          <Tooltip\n            classes={{ tooltip: classes.tooltip }}\n            disableFocusListener\n            disableTouchListener\n            placement={'right'}\n            title={validationMessage}\n          >\n            <Info fontSize={'small'} color={'primary'} style={{ marginLeft: '5px' }} />\n          </Tooltip>\n        </div>\n\n        <EditableHtml\n          activePlugins={ALL_PLUGINS}\n          responseAreaProps={{\n            type: 'drag-in-the-blank',\n            options: {\n              duplicates: model.duplicates,\n            },\n            maxResponseAreas: maxResponseAreas,\n          }}\n          className={classes.markup}\n          markup={model.slateMarkup}\n          onChange={this.onMarkupChanged}\n          imageSupport={imageSupport}\n          disableImageAlignmentButtons={true}\n          nonEmpty={false}\n          disableUnderline\n          error={responseAreasError || correctResponseError}\n          toolbarOpts={toolbarOpts}\n          spellCheck={spellCheckEnabled}\n          uploadSoundSupport={uploadSoundSupport}\n          languageCharactersProps={[{ language: 'spanish' }, { language: 'special' }]}\n        />\n        {responseAreasError && <div className={classes.errorText}>{responseAreasError}</div>}\n        {correctResponseError && <div className={classes.errorText}>{correctResponseError}</div>}\n\n        <Choices\n          model={model}\n          duplicates={model.duplicates}\n          error={choicesError}\n          onChange={this.onResponsesChanged}\n          toolbarOpts={toolbarOpts}\n          maxChoices={maxChoices}\n          uploadSoundSupport={uploadSoundSupport}\n        />\n\n        {rationaleEnabled && (\n          <InputContainer label={rationale.label} className={classes.promptHolder}>\n            <EditableHtml\n              className={classes.prompt}\n              markup={model.rationale || ''}\n              onChange={this.onRationaleChanged}\n              imageSupport={imageSupport}\n              toolbarOpts={toolbarOpts}\n              spellCheck={spellCheckEnabled}\n              maxImageWidth={(maxImageWidth && maxImageWidth.rationale) || defaultImageMaxWidth}\n              maxImageHeight={(maxImageHeight && maxImageHeight.rationale) || defaultImageMaxHeight}\n              uploadSoundSupport={uploadSoundSupport}\n              languageCharactersProps={[{ language: 'spanish' }, { language: 'special' }]}\n            />\n          </InputContainer>\n        )}\n      </layout.ConfigLayout>\n    );\n  }\n}\n\nconst Styled = withStyles(styles)(Main);\n\nexport default withDragContext(Styled);\n"],"file":"main.js"}

package/lib/main.js

@@ -25,8 +25,6 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 
 var _react = _interopRequireDefault(require("react"));
 
-var _reactDom = _interopRequireDefault(require("react-dom"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
 
 var _correctAnswerToggle = _interopRequireDefault(require("@pie-lib/correct-answer-toggle"));
@@ -37,8 +35,6 @@ var _drag = require("@pie-lib/drag");
 
 var _renderUi = require("@pie-lib/render-ui");
 
-var _mathRendering = require("@pie-lib/math-rendering");
-
 var _styles = require("@material-ui/core/styles");
 
 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; }
@@ -96,30 +92,32 @@ var Main = /*#__PURE__*/function (_React$Component) {
       var showCorrectAnswerToggle = mode === 'evaluate';
       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, {
+      }, model.teacherInstructions && (0, _renderUi.hasText)(model.teacherInstructions) && /*#__PURE__*/_react["default"].createElement(_renderUi.Collapsible, {
+        className: classes.collapsible,
         labels: {
           hidden: 'Show Teacher Instructions',
           visible: 'Hide Teacher Instructions'
         }
       }, /*#__PURE__*/_react["default"].createElement(_renderUi.PreviewPrompt, {
         prompt: model.teacherInstructions
-      })), /*#__PURE__*/_react["default"].createElement("br", null)), /*#__PURE__*/_react["default"].createElement(_correctAnswerToggle["default"], {
+      })), prompt && /*#__PURE__*/_react["default"].createElement(_renderUi.PreviewPrompt, {
+        prompt: prompt
+      }), /*#__PURE__*/_react["default"].createElement(_correctAnswerToggle["default"], {
         show: showCorrectAnswerToggle,
         toggled: showCorrectAnswer,
         onToggle: this.toggleShowCorrect
-      }), showCorrectAnswerToggle && /*#__PURE__*/_react["default"].createElement("br", null), prompt && /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_renderUi.PreviewPrompt, {
-        prompt: prompt
-      }), /*#__PURE__*/_react["default"].createElement("br", null)), /*#__PURE__*/_react["default"].createElement(DraggableDragInTheBlank, (0, _extends2["default"])({}, modelWithValue, {
+      }), /*#__PURE__*/_react["default"].createElement(DraggableDragInTheBlank, (0, _extends2["default"])({}, modelWithValue, {
         onChange: onChange,
         showCorrectAnswer: showCorrectAnswer
-      })), model.rationale && (0, _renderUi.hasText)(model.rationale) && /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("br", null), /*#__PURE__*/_react["default"].createElement(_renderUi.Collapsible, {
+      })), model.rationale && (0, _renderUi.hasText)(model.rationale) && /*#__PURE__*/_react["default"].createElement(_renderUi.Collapsible, {
+        className: classes.rationale,
         labels: {
           hidden: 'Show Rationale',
           visible: 'Hide Rationale'
         }
       }, /*#__PURE__*/_react["default"].createElement(_renderUi.PreviewPrompt, {
         prompt: model.rationale
-      })), /*#__PURE__*/_react["default"].createElement("br", null)));
+      })));
     }
   }]);
   return Main;
@@ -140,12 +138,17 @@ exports.Main = Main;
 var styles = function styles(theme) {
   return {
     mainContainer: {
-      padding: theme.spacing.unit,
       color: _renderUi.color.text(),
       backgroundColor: _renderUi.color.background(),
       '& tr > td': {
         color: _renderUi.color.text()
       }
+    },
+    collapsible: {
+      marginBottom: theme.spacing.unit * 2
+    },
+    rationale: {
+      marginTop: theme.spacing.unit * 2
     }
   };
 };

package/lib/main.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/main.js"],"names":["DraggableDragInTheBlank","DragInTheBlank","Main","showCorrectAnswer","setState","state","props","model","onChange","value","classes","prompt","mode","modelWithValue","showCorrectAnswerToggle","mainContainer","teacherInstructions","hidden","visible","toggleShowCorrect","rationale","React","Component","PropTypes","object","feedback","func","styles","theme","padding","spacing","unit","color","text","backgroundColor","background"],"mappings":"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","sourcesContent":["import React from 'react';\nimport ReactDOM from 'react-dom';\nimport PropTypes from 'prop-types';\nimport CorrectAnswerToggle from '@pie-lib/correct-answer-toggle';\nimport { DragInTheBlank } from '@pie-lib/mask-markup';\nimport { withDragContext } from '@pie-lib/drag';\nimport { color, Collapsible, hasText, PreviewPrompt } from '@pie-lib/render-ui';\nimport { renderMath } from '@pie-lib/math-rendering';\nimport { withStyles } from '@material-ui/core/styles';\n\nconst DraggableDragInTheBlank = withDragContext(DragInTheBlank);\n\nexport class Main extends React.Component {\n  static propTypes = {\n    classes: PropTypes.object,\n    model: PropTypes.object,\n    value: PropTypes.object,\n    feedback: PropTypes.object,\n    onChange: PropTypes.func,\n  };\n\n  static defaultProps = {\n    value: {},\n  };\n\n  state = {\n    showCorrectAnswer: false,\n  };\n\n  toggleShowCorrect = () => {\n    this.setState({ showCorrectAnswer: !this.state.showCorrectAnswer });\n  };\n\n  render() {\n    const { showCorrectAnswer } = this.state;\n    const { model, onChange, value, classes } = this.props;\n    const { prompt, mode } = model;\n    const modelWithValue = {\n      ...model,\n      value,\n    };\n    const showCorrectAnswerToggle = mode === 'evaluate';\n\n    return (\n      <div className={classes.mainContainer}>\n        {model.teacherInstructions && hasText(model.teacherInstructions) && (\n          <React.Fragment>\n            <Collapsible labels={{ hidden: 'Show Teacher Instructions', visible: 'Hide Teacher Instructions' }}>\n              <PreviewPrompt prompt={model.teacherInstructions} />\n            </Collapsible>\n            <br />\n          </React.Fragment>\n        )}\n        <CorrectAnswerToggle\n          show={showCorrectAnswerToggle}\n          toggled={showCorrectAnswer}\n          onToggle={this.toggleShowCorrect}\n        />\n        {showCorrectAnswerToggle && <br />}\n        {prompt && (\n          <React.Fragment>\n            <PreviewPrompt prompt={prompt} />\n            <br />\n          </React.Fragment>\n        )}\n        <DraggableDragInTheBlank {...modelWithValue} onChange={onChange} showCorrectAnswer={showCorrectAnswer} />\n        {model.rationale && hasText(model.rationale) && (\n          <React.Fragment>\n            <br />\n            <Collapsible labels={{ hidden: 'Show Rationale', visible: 'Hide Rationale' }}>\n              <PreviewPrompt prompt={model.rationale} />\n            </Collapsible>\n            <br />\n          </React.Fragment>\n        )}\n      </div>\n    );\n  }\n}\n\nconst styles = (theme) => ({\n  mainContainer: {\n    padding: theme.spacing.unit,\n    color: color.text(),\n    backgroundColor: color.background(),\n    '& tr > td': {\n      color: color.text(),\n    },\n  },\n});\n\nexport default withStyles(styles)(Main);\n"],"file":"main.js"}
+{"version":3,"sources":["../src/main.js"],"names":["DraggableDragInTheBlank","DragInTheBlank","Main","showCorrectAnswer","setState","state","props","model","onChange","value","classes","prompt","mode","modelWithValue","showCorrectAnswerToggle","mainContainer","teacherInstructions","collapsible","hidden","visible","toggleShowCorrect","rationale","React","Component","PropTypes","object","feedback","func","styles","theme","color","text","backgroundColor","background","marginBottom","spacing","unit","marginTop"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport CorrectAnswerToggle from '@pie-lib/correct-answer-toggle';\nimport { DragInTheBlank } from '@pie-lib/mask-markup';\nimport { withDragContext } from '@pie-lib/drag';\nimport { color, Collapsible, hasText, PreviewPrompt } from '@pie-lib/render-ui';\nimport { withStyles } from '@material-ui/core/styles';\n\nconst DraggableDragInTheBlank = withDragContext(DragInTheBlank);\n\nexport class Main extends React.Component {\n  static propTypes = {\n    classes: PropTypes.object,\n    model: PropTypes.object,\n    value: PropTypes.object,\n    feedback: PropTypes.object,\n    onChange: PropTypes.func,\n  };\n\n  static defaultProps = {\n    value: {},\n  };\n\n  state = {\n    showCorrectAnswer: false,\n  };\n\n  toggleShowCorrect = () => {\n    this.setState({ showCorrectAnswer: !this.state.showCorrectAnswer });\n  };\n\n  render() {\n    const { showCorrectAnswer } = this.state;\n    const { model, onChange, value, classes } = this.props;\n    const { prompt, mode } = model;\n    const modelWithValue = { ...model, value };\n    const showCorrectAnswerToggle = mode === 'evaluate';\n\n    return (\n      <div className={classes.mainContainer}>\n        {model.teacherInstructions && hasText(model.teacherInstructions) && (\n          <Collapsible\n            className={classes.collapsible}\n            labels={{ hidden: 'Show Teacher Instructions', visible: 'Hide Teacher Instructions' }}\n          >\n            <PreviewPrompt prompt={model.teacherInstructions} />\n          </Collapsible>\n        )}\n\n        {prompt && <PreviewPrompt prompt={prompt} />}\n\n        <CorrectAnswerToggle\n          show={showCorrectAnswerToggle}\n          toggled={showCorrectAnswer}\n          onToggle={this.toggleShowCorrect}\n        />\n\n        <DraggableDragInTheBlank {...modelWithValue} onChange={onChange} showCorrectAnswer={showCorrectAnswer} />\n\n        {model.rationale && hasText(model.rationale) && (\n          <Collapsible className={classes.rationale} labels={{ hidden: 'Show Rationale', visible: 'Hide Rationale' }}>\n            <PreviewPrompt prompt={model.rationale} />\n          </Collapsible>\n        )}\n      </div>\n    );\n  }\n}\n\nconst styles = (theme) => ({\n  mainContainer: {\n    color: color.text(),\n    backgroundColor: color.background(),\n    '& tr > td': {\n      color: color.text(),\n    },\n  },\n  collapsible: {\n    marginBottom: theme.spacing.unit * 2,\n  },\n  rationale: {\n    marginTop: theme.spacing.unit * 2,\n  },\n});\n\nexport default withStyles(styles)(Main);\n"],"file":"main.js"}

package/package.json

@@ -4,7 +4,7 @@
     "access": "public"
   },
   "repository": "pie-framework/pie-elements",
-  "version": "4.8.1-next.36+9353f7376",
+  "version": "4.8.1-next.51+a42a408d1",
   "description": "",
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1",
@@ -25,7 +25,7 @@
   },
   "author": "",
   "license": "ISC",
-  "gitHead": "9353f73768c78233621ab11119b1961af018a7e4",
+  "gitHead": "a42a408d1d238e52cbcf907fbbaec2ee98550385",
   "main": "lib/index.js",
   "module": "src/index.js"
 }