@pie-element/math-inline 5.9.10 → 6.0.0

package/module/element.js

@@ -1,1258 +0,0 @@
-import {_dll_react, _dll_classnames, _dll_material_ui__core_styles, _dll_prop_types, _dll_pie_lib__render_ui, _dll_pie_lib__correct_answer_toggle, _dll_material_ui__core, _dll_lodash, _dll_react_dom, _dll_debug} from "../../../@pie-lib/shared-module@^1.4.17/module/index.js";
-import {_dll_pie_lib__math_toolbar, _dll_pie_lib__math_input, _dll_pie_framework__mathquill} from "../../../@pie-lib/math-edit-module@^1.2.4/module/index.js";
-import {_dll_pie_lib__math_rendering} from "../../../@pie-lib/math-rendering-module@^1.1.5/module/index.js";
-const ResponseTypes$1 = {
-  advanced: 'Advanced Multi',
-  simple: 'Simple'
-};
-const React$2 = _dll_react;
-const cx$1 = _dll_classnames;
-const {withStyles: withStyles$1} = _dll_material_ui__core_styles;
-const PropTypes$1 = _dll_prop_types;
-const {color: color$1} = _dll_pie_lib__render_ui;
-const {MathToolbar: MathToolbar} = _dll_pie_lib__math_toolbar;
-const {mq: mq$1} = _dll_pie_lib__math_input;
-const _jsxFileName$1 = "/home/circleci/repo/packages/math-inline/src/simple-question-block.jsx";
-class SimpleQuestionBlockRaw extends React$2.Component {
-  constructor(...args) {
-    super(...args);
-    SimpleQuestionBlockRaw.prototype.__init.call(this);
-    SimpleQuestionBlockRaw.prototype.__init2.call(this);
-    SimpleQuestionBlockRaw.prototype.__init3.call(this);
-  }
-  static __initStatic() {
-    this.propTypes = {
-      classes: PropTypes$1.object,
-      onSimpleResponseChange: PropTypes$1.func,
-      model: PropTypes$1.object.isRequired,
-      emptyResponse: PropTypes$1.bool,
-      session: PropTypes$1.object.isRequired,
-      showCorrect: PropTypes$1.bool
-    };
-  }
-  __init() {
-    this.state = {
-      showKeypad: true
-    };
-  }
-  __init2() {
-    this.onFocus = () => this.setState({
-      showKeypad: true
-    });
-  }
-  __init3() {
-    this.onBlur = e => {
-      const {relatedTarget, currentTarget} = e || ({});
-      if (!relatedTarget || !currentTarget || relatedTarget.offsetParent !== currentTarget.offsetParent) {
-        this.setState({
-          showKeypad: false
-        });
-      }
-    };
-  }
-  render() {
-    const {classes, model, showCorrect, session, emptyResponse, onSimpleResponseChange} = this.props;
-    const {config, disabled, correctness, view} = model || ({});
-    if (!config) {
-      return;
-    }
-    const correct = correctness && correctness.correct;
-    const {responses, equationEditor} = config;
-    return React$2.createElement('div', {
-      className: classes.expression,
-      __self: this,
-      __source: {
-        fileName: _jsxFileName$1,
-        lineNumber: 54
-      }
-    }, showCorrect || disabled ? React$2.createElement('div', {
-      className: cx$1(classes.static, {
-        [classes.incorrect]: !emptyResponse && !correct && !showCorrect,
-        [classes.correct]: !emptyResponse && (correct || showCorrect)
-      }),
-      __self: this,
-      __source: {
-        fileName: _jsxFileName$1,
-        lineNumber: 56
-      }
-    }, React$2.createElement(mq$1.Static, {
-      latex: showCorrect ? responses && responses.length && responses[0].answer : session.response || '',
-      __self: this,
-      __source: {
-        fileName: _jsxFileName$1,
-        lineNumber: 62
-      }
-    })) : React$2.createElement(MathToolbar, {
-      classNames: {
-        editor: classes.responseEditor
-      },
-      latex: session.response || '',
-      keypadMode: equationEditor,
-      onChange: onSimpleResponseChange,
-      onDone: () => {},
-      onFocus: this.onFocus,
-      onBlur: this.onBlur,
-      controlledKeypad: true,
-      showKeypad: this.state.showKeypad,
-      hideDoneButton: true,
-      __self: this,
-      __source: {
-        fileName: _jsxFileName$1,
-        lineNumber: 69
-      }
-    }));
-  }
-}
-SimpleQuestionBlockRaw.__initStatic();
-const SimpleQuestionBlock = withStyles$1(theme => ({
-  responseEditor: {
-    display: 'flex',
-    justifyContent: 'center',
-    width: 'auto',
-    maxWidth: 'fit-content',
-    height: 'auto',
-    textAlign: 'left',
-    padding: theme.spacing.unit,
-    '&.mq-math-mode': {
-      border: `1px solid ${color$1.primaryLight()}`
-    }
-  },
-  expression: {
-    marginTop: theme.spacing.unit * 2,
-    marginBottom: theme.spacing.unit * 2,
-    padding: theme.spacing.unit
-  },
-  static: {
-    color: color$1.text(),
-    background: color$1.background(),
-    border: `1px solid ${color$1.primaryLight()}`,
-    width: 'fit-content',
-    fontSize: '1rem',
-    padding: theme.spacing.unit / 2,
-    '& > .mq-math-mode': {
-      '& > .mq-hasCursor': {
-        '& > .mq-cursor': {
-          display: 'none'
-        }
-      }
-    }
-  },
-  correct: {
-    border: `2px solid ${color$1.correct()} !important`,
-    padding: theme.spacing.unit,
-    letterSpacing: '0.5px'
-  },
-  incorrect: {
-    border: `2px solid ${color$1.incorrect()} !important`,
-    padding: theme.spacing.unit,
-    letterSpacing: '0.5px'
-  }
-}))(SimpleQuestionBlockRaw);
-const React$1 = _dll_react;
-const PropTypes = _dll_prop_types;
-const CorrectAnswerToggle = _dll_pie_lib__correct_answer_toggle;
-const {Feedback: Feedback} = _dll_pie_lib__render_ui;
-const {Collapsible: Collapsible} = _dll_pie_lib__render_ui;
-const {Readable: Readable} = _dll_pie_lib__render_ui;
-const {hasText: hasText} = _dll_pie_lib__render_ui;
-const {PreviewPrompt: PreviewPrompt} = _dll_pie_lib__render_ui;
-const {color: color} = _dll_pie_lib__render_ui;
-const {withStyles: withStyles} = _dll_material_ui__core_styles;
-const {Tooltip: Tooltip} = _dll_material_ui__core;
-const {isEqual: isEqual} = _dll_lodash;
-const {isEmpty: isEmpty} = _dll_lodash;
-const cx = _dll_classnames;
-const {mq: mq} = _dll_pie_lib__math_input;
-const {HorizontalKeypad: HorizontalKeypad} = _dll_pie_lib__math_input;
-const {updateSpans: updateSpans} = _dll_pie_lib__math_input;
-const MathQuill = _dll_pie_framework__mathquill;
-const {renderMath: renderMath} = _dll_pie_lib__math_rendering;
-const _jsxFileName = "/home/circleci/repo/packages/math-inline/src/main.jsx";
-function _optionalChain(ops) {
-  let lastAccessLHS = undefined;
-  let value = ops[0];
-  let i = 1;
-  while (i < ops.length) {
-    const op = ops[i];
-    const fn = ops[i + 1];
-    i += 2;
-    if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) {
-      return undefined;
-    }
-    if (op === 'access' || op === 'optionalAccess') {
-      lastAccessLHS = value;
-      value = fn(value);
-    } else if (op === 'call' || op === 'optionalCall') {
-      value = fn((...args) => value.call(lastAccessLHS, ...args));
-      lastAccessLHS = undefined;
-    }
-  }
-  return value;
-}
-let registered = false;
-const NEWLINE_LATEX = /\\newline/g;
-const REGEX = /{{response}}/gm;
-const DEFAULT_KEYPAD_VARIANT = 6;
-const IS_SAFARI = (/^((?!chrome|android).)*safari/i).test(navigator.userAgent);
-function generateAdditionalKeys(keyData = []) {
-  return keyData.map(key => ({
-    name: key,
-    latex: key,
-    write: key,
-    label: key
-  }));
-}
-function getKeyPadWidth(additionalKeys = [], equationEditor) {
-  return Math.floor(additionalKeys.length / 5) * 30 + (equationEditor === 'miscellaneous' ? 600 : 500);
-}
-function prepareForStatic(model, state) {
-  const {config, disabled} = model || ({});
-  const {expression, responses, printMode, alwaysShowCorrect} = config || ({});
-  if (config && expression) {
-    const modelExpression = expression;
-    if (state.showCorrect) {
-      return responses && responses.length && responses[0].answer;
-    }
-    let answerBlocks = 1;
-    return (modelExpression || '').replace(REGEX, function () {
-      const answer = state.session.answers[`r${answerBlocks}`];
-      if (printMode && !alwaysShowCorrect) {
-        const blankSpace = ('\\ \\ ').repeat(30) + '\\newline ';
-        return `\\MathQuillMathField[r${answerBlocks++}]{${blankSpace.repeat(3)}}`;
-      }
-      if (disabled) {
-        return `\\embed{answerBlock}[r${answerBlocks++}]`;
-      }
-      return `\\MathQuillMathField[r${answerBlocks++}]{${answer && answer.value || ''}}`;
-    }).replace(NEWLINE_LATEX, '\\embed{newLine}[]');
-  }
-}
-class Main extends React$1.Component {
-  static __initStatic() {
-    this.propTypes = {
-      classes: PropTypes.object,
-      session: PropTypes.object.isRequired,
-      onSessionChange: PropTypes.func,
-      model: PropTypes.object.isRequired
-    };
-  }
-  constructor(props) {
-    super(props);
-    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);
-    Main.prototype.__init7.call(this);
-    Main.prototype.__init8.call(this);
-    Main.prototype.__init9.call(this);
-    Main.prototype.__init10.call(this);
-    Main.prototype.__init11.call(this);
-    Main.prototype.__init12.call(this);
-    const answers = {};
-    if (props.model.config && props.model.config.expression) {
-      let answerBlocks = 1;
-      (props.model.config.expression || '').replace(REGEX, () => {
-        answers[`r${answerBlocks}`] = {
-          value: props.session && props.session.answers && props.session.answers[`r${answerBlocks}`] && props.session.answers[`r${answerBlocks}`].value || ''
-        };
-        answerBlocks += 1;
-      });
-    }
-    this.state = {
-      session: {
-        ...props.session,
-        answers
-      },
-      activeAnswerBlock: '',
-      showCorrect: this.props.model.config.alwaysShowCorrect || false
-    };
-  }
-  UNSAFE_componentWillMount() {
-    const {classes} = this.props;
-    if (typeof window !== 'undefined') {
-      let MQ = MathQuill.getInterface(2);
-      if (!registered) {
-        MQ.registerEmbed('answerBlock', data => {
-          return {
-            htmlString: `<div class="${classes.blockContainer}">
-                <div class="${classes.blockResponse}" id="${data}Index">R</div>
-                <div class="${classes.blockMath}">
-                  <span id="${data}"></span>
-                </div>
-              </div>`,
-            text: () => 'text',
-            latex: () => `\\embed{answerBlock}[${data}]`
-          };
-        });
-        registered = true;
-      }
-    }
-  }
-  __init() {
-    this.handleAnswerBlockDomUpdate = () => {
-      const {model, classes} = this.props;
-      const {session, showCorrect} = this.state;
-      const answers = session.answers;
-      if (this.root && model.disabled && !showCorrect) {
-        Object.keys(answers).forEach(answerId => {
-          const el = this.root.querySelector(`#${answerId}`);
-          const indexEl = this.root.querySelector(`#${answerId}Index`);
-          if (el) {
-            let MQ = MathQuill.getInterface(2);
-            const answer = answers[answerId];
-            el.textContent = answer && answer.value || '';
-            if (!model.view) ; else {
-              el.parentElement.parentElement.classList.remove(classes.correct);
-              el.parentElement.parentElement.classList.remove(classes.incorrect);
-            }
-            MQ.StaticMath(el);
-            indexEl.textContent = 'R';
-          }
-        });
-      }
-      renderMath(this.root);
-    };
-  }
-  componentDidUpdate() {
-    this.handleAnswerBlockDomUpdate();
-  }
-  UNSAFE_componentWillReceiveProps(nextProps) {
-    const {config} = this.props.model;
-    const {config: nextConfig = {}} = nextProps.model || ({});
-    if (config.env && config.env.mode !== 'evaluate' || nextConfig.env && nextConfig.env.mode !== 'evaluate') {
-      this.setState({
-        ...this.state.session,
-        showCorrect: false
-      });
-    }
-    if (nextConfig.alwaysShowCorrect) {
-      this.setState({
-        showCorrect: true
-      });
-    }
-    if (config && config.responses && config.responses.length !== nextConfig.responses.length || !config && nextConfig && nextConfig.responses || config && nextConfig && config.expression !== nextConfig.expression) {
-      const newAnswers = {};
-      const answers = this.state.session.answers;
-      let answerBlocks = 1;
-      (nextConfig.expression || '').replace(REGEX, () => {
-        newAnswers[`r${answerBlocks}`] = {
-          value: answers && answers[`r${answerBlocks}`] && answers[`r${answerBlocks}`].value || ''
-        };
-        answerBlocks++;
-      });
-      this.setState(state => ({
-        session: {
-          ...state.session,
-          completeAnswer: this.mqStatic && this.mqStatic.mathField.latex(),
-          answers: newAnswers
-        }
-      }), this.handleAnswerBlockDomUpdate);
-    }
-  }
-  shouldComponentUpdate(nextProps, nextState) {
-    const sameModel = isEqual(this.props.model, nextProps.model);
-    const sameState = isEqual(this.state, nextState);
-    return !sameModel || !sameState;
-  }
-  componentDidMount() {
-    this.handleAnswerBlockDomUpdate();
-    setTimeout(() => renderMath(this.root), 100);
-  }
-  __init2() {
-    this.onDone = () => {};
-  }
-  __init3() {
-    this.onSimpleResponseChange = response => {
-      this.setState(state => ({
-        session: {
-          ...state.session,
-          response
-        }
-      }), this.callOnSessionChange);
-    };
-  }
-  __init4() {
-    this.onSubFieldFocus = id => {
-      this.setState({
-        activeAnswerBlock: id
-      });
-    };
-  }
-  __init5() {
-    this.toNodeData = data => {
-      if (!data) {
-        return;
-      }
-      const {type, value} = data;
-      if (type === 'command' || type === 'cursor') {
-        return data;
-      } else if (type === 'answer') {
-        return {
-          type: 'answer',
-          ...data
-        };
-      } else if (value === 'clear') {
-        return {
-          type: 'clear'
-        };
-      } else {
-        return {
-          type: 'write',
-          value
-        };
-      }
-    };
-  }
-  __init6() {
-    this.setInput = input => {
-      this.input = input;
-    };
-  }
-  __init7() {
-    this.onClick = data => {
-      const c = this.toNodeData(data);
-      if (c.type === 'clear') {
-        this.input.clear();
-      } else if (c.type === 'command') {
-        if (Array.isArray(c.value)) {
-          c.value.forEach(vv => {
-            this.input.cmd(vv);
-          });
-        } else {
-          this.input.cmd(c.value);
-        }
-      } else if (c.type === 'cursor') {
-        this.input.keystroke(c.value);
-      } else {
-        this.input.write(c.value);
-      }
-      this.input.focus();
-    };
-  }
-  __init8() {
-    this.callOnSessionChange = () => {
-      const {onSessionChange} = this.props;
-      if (onSessionChange) {
-        onSessionChange(this.state.session);
-      }
-    };
-  }
-  __init9() {
-    this.toggleShowCorrect = show => {
-      this.setState({
-        showCorrect: show
-      }, this.handleAnswerBlockDomUpdate);
-    };
-  }
-  __init10() {
-    this.subFieldChanged = (name, subfieldValue) => {
-      updateSpans();
-      if (name) {
-        this.setState(state => ({
-          session: {
-            ...state.session,
-            completeAnswer: this.mqStatic && this.mqStatic.mathField.latex(),
-            answers: {
-              ...state.session.answers,
-              [name]: {
-                value: subfieldValue
-              }
-            }
-          }
-        }), this.callOnSessionChange);
-      }
-    };
-  }
-  __init11() {
-    this.getFieldName = (changeField, fields) => {
-      const {answers} = this.state.session;
-      if (Object.keys(answers || ({})).length) {
-        const keys = Object.keys(answers);
-        return keys.find(k => {
-          const tf = fields[k];
-          return tf && tf.id == changeField.id;
-        });
-      }
-    };
-  }
-  __init12() {
-    this.onBlur = e => {
-      const {relatedTarget, currentTarget} = e || ({});
-      if (!relatedTarget || !currentTarget || !IS_SAFARI && !_optionalChain([relatedTarget, 'optionalAccess', _13 => _13.offsetParent, 'optionalAccess', _14 => _14.children, 'access', _15 => _15[0], 'optionalAccess', _16 => _16.attributes, 'optionalAccess', _17 => _17['data-keypad']]) || IS_SAFARI && !_optionalChain([relatedTarget, 'optionalAccess', _18 => _18.offsetParent, 'optionalAccess', _19 => _19.children, 'access', _20 => _20[0], 'optionalAccess', _21 => _21.children, 'access', _22 => _22[0], 'optionalAccess', _23 => _23.attributes, 'optionalAccess', _24 => _24['data-keypad']])) {
-        this.setState({
-          activeAnswerBlock: ''
-        });
-      }
-    };
-  }
-  setTooltipRef(ref) {
-    setTimeout(() => {
-      if (ref && IS_SAFARI) {
-        const div = document.querySelector('[role=\'tooltip\']');
-        if (div) {
-          const el = div.firstChild;
-          el.setAttribute('tabindex', '-1');
-        }
-      }
-    }, 1);
-  }
-  render() {
-    const {model, classes} = this.props;
-    const {activeAnswerBlock, showCorrect, session} = this.state;
-    const {config, correctness, disabled, view, teacherInstructions, rationale, feedback, animationsDisabled, printMode, alwaysShowCorrect} = model || ({});
-    if (!config) {
-      return null;
-    }
-    const {showNote, note, prompt, responses, responseType, equationEditor, customKeys, env: {mode, role} = {}} = config || ({});
-    const displayNote = (showCorrect || mode === 'view' && role === 'instructor') && showNote && note;
-    const emptyResponse = isEmpty(responses);
-    const showCorrectAnswerToggle = !emptyResponse && correctness && correctness.correctness !== 'correct';
-    const tooltipModeEnabled = disabled && correctness;
-    const additionalKeys = generateAdditionalKeys(customKeys);
-    const correct = correctness && correctness.correct;
-    const staticLatex = prepareForStatic(model, this.state) || '';
-    const viewMode = disabled && !correctness;
-    const studentPrintMode = printMode && !alwaysShowCorrect;
-    const printView = React$1.createElement('div', {
-      className: classes.printContainer,
-      __self: this,
-      __source: {
-        fileName: _jsxFileName,
-        lineNumber: 411
-      }
-    }, React$1.createElement(mq.Static, {
-      ref: mqStatic => this.mqStatic = mqStatic || this.mqStatic,
-      latex: staticLatex,
-      onSubFieldChange: this.subFieldChanged,
-      getFieldName: this.getFieldName,
-      setInput: this.setInput,
-      onSubFieldFocus: this.onSubFieldFocus,
-      onBlur: this.onBlur,
-      __self: this,
-      __source: {
-        fileName: _jsxFileName,
-        lineNumber: 412
-      }
-    }));
-    const midContent = React$1.createElement('div', {
-      className: classes.main,
-      __self: this,
-      __source: {
-        fileName: _jsxFileName,
-        lineNumber: 424
-      }
-    }, prompt && React$1.createElement('div', {
-      className: classes.content,
-      __self: this,
-      __source: {
-        fileName: _jsxFileName,
-        lineNumber: 426
-      }
-    }, React$1.createElement(PreviewPrompt, {
-      prompt: prompt,
-      __self: this,
-      __source: {
-        fileName: _jsxFileName,
-        lineNumber: 427
-      }
-    })), studentPrintMode ? printView : React$1.createElement(Readable, {
-      false: true,
-      __self: this,
-      __source: {
-        fileName: _jsxFileName,
-        lineNumber: 430
-      }
-    }, React$1.createElement('div', {
-      className: classes.inputAndKeypadContainer,
-      __self: this,
-      __source: {
-        fileName: _jsxFileName,
-        lineNumber: 431
-      }
-    }, responseType === ResponseTypes$1.simple && React$1.createElement(SimpleQuestionBlock, {
-      onSimpleResponseChange: this.onSimpleResponseChange,
-      showCorrect: showCorrect,
-      emptyResponse: emptyResponse,
-      model: model,
-      session: session,
-      __self: this,
-      __source: {
-        fileName: _jsxFileName,
-        lineNumber: 433
-      }
-    }), responseType === ResponseTypes$1.advanced && React$1.createElement('div', {
-      className: cx(classes.expression, {
-        [classes.incorrect]: !emptyResponse && !correct && !showCorrect,
-        [classes.correct]: !emptyResponse && (correct || showCorrect),
-        [classes.showCorrectness]: !emptyResponse && disabled && correctness && !view,
-        [classes.correctAnswerShown]: showCorrect,
-        [classes.printCorrect]: printMode && alwaysShowCorrect
-      }),
-      __self: this,
-      __source: {
-        fileName: _jsxFileName,
-        lineNumber: 442
-      }
-    }, React$1.createElement(Tooltip, {
-      ref: ref => this.setTooltipRef(ref),
-      interactive: true,
-      open: !!activeAnswerBlock,
-      classes: {
-        tooltip: classes.keypadTooltip,
-        popper: classes.keypadTooltipPopper
-      },
-      title: Object.keys(session.answers).map(answerId => answerId === activeAnswerBlock && !(showCorrect || disabled) && React$1.createElement('div', {
-        'data-keypad': true,
-        key: answerId,
-        className: classes.responseContainer,
-        style: {
-          width: getKeyPadWidth(additionalKeys, equationEditor)
-        },
-        __self: this,
-        __source: {
-          fileName: _jsxFileName,
-          lineNumber: 463
-        }
-      }, React$1.createElement(HorizontalKeypad, {
-        additionalKeys: additionalKeys,
-        mode: equationEditor || DEFAULT_KEYPAD_VARIANT,
-        onClick: this.onClick,
-        __self: this,
-        __source: {
-          fileName: _jsxFileName,
-          lineNumber: 472
-        }
-      })) || null),
-      __self: this,
-      __source: {
-        fileName: _jsxFileName,
-        lineNumber: 451
-      }
-    }, React$1.createElement(mq.Static, {
-      ref: mqStatic => this.mqStatic = mqStatic || this.mqStatic,
-      latex: staticLatex,
-      onSubFieldChange: this.subFieldChanged,
-      getFieldName: this.getFieldName,
-      setInput: this.setInput,
-      onSubFieldFocus: this.onSubFieldFocus,
-      onBlur: this.onBlur,
-      __self: this,
-      __source: {
-        fileName: _jsxFileName,
-        lineNumber: 482
-      }
-    }))))), viewMode && teacherInstructions && hasText(teacherInstructions) && React$1.createElement(React$1.Fragment, {
-      __self: this,
-      __source: {
-        fileName: _jsxFileName,
-        lineNumber: 498
-      }
-    }, !animationsDisabled ? React$1.createElement(Collapsible, {
-      labels: {
-        hidden: 'Show Teacher Instructions',
-        visible: 'Hide Teacher Instructions'
-      },
-      __self: this,
-      __source: {
-        fileName: _jsxFileName,
-        lineNumber: 499
-      }
-    }, React$1.createElement('div', {
-      dangerouslySetInnerHTML: {
-        __html: teacherInstructions
-      },
-      __self: this,
-      __source: {
-        fileName: _jsxFileName,
-        lineNumber: 502
-      }
-    })) : React$1.createElement('div', {
-      dangerouslySetInnerHTML: {
-        __html: teacherInstructions
-      },
-      __self: this,
-      __source: {
-        fileName: _jsxFileName,
-        lineNumber: 503
-      }
-    }), React$1.createElement('br', {
-      __self: this,
-      __source: {
-        fileName: _jsxFileName,
-        lineNumber: 504
-      }
-    })), viewMode && rationale && hasText(rationale) && React$1.createElement(React$1.Fragment, {
-      __self: this,
-      __source: {
-        fileName: _jsxFileName,
-        lineNumber: 510
-      }
-    }, !animationsDisabled ? React$1.createElement(Collapsible, {
-      labels: {
-        hidden: 'Show Rationale',
-        visible: 'Hide Rationale'
-      },
-      __self: this,
-      __source: {
-        fileName: _jsxFileName,
-        lineNumber: 511
-      }
-    }, React$1.createElement('div', {
-      dangerouslySetInnerHTML: {
-        __html: rationale
-      },
-      __self: this,
-      __source: {
-        fileName: _jsxFileName,
-        lineNumber: 514
-      }
-    })) : React$1.createElement('div', {
-      dangerouslySetInnerHTML: {
-        __html: rationale
-      },
-      __self: this,
-      __source: {
-        fileName: _jsxFileName,
-        lineNumber: 515
-      }
-    })), viewMode && displayNote && React$1.createElement('div', {
-      className: classes.note,
-      dangerouslySetInnerHTML: {
-        __html: `<strong>Note:</strong> ${note}`
-      },
-      __self: this,
-      __source: {
-        fileName: _jsxFileName,
-        lineNumber: 521
-      }
-    }));
-    if (tooltipModeEnabled && (showCorrectAnswerToggle || teacherInstructions || rationale || feedback)) {
-      return React$1.createElement(Tooltip, {
-        interactive: true,
-        classes: {
-          tooltip: classes.tooltip,
-          popper: classes.tooltipPopper
-        },
-        title: React$1.createElement('div', {
-          __self: this,
-          __source: {
-            fileName: _jsxFileName,
-            lineNumber: 539
-          }
-        }, React$1.createElement('div', {
-          className: classes.main,
-          __self: this,
-          __source: {
-            fileName: _jsxFileName,
-            lineNumber: 540
-          }
-        }, showCorrectAnswerToggle && React$1.createElement(CorrectAnswerToggle, {
-          className: classes.toggle,
-          show: true,
-          toggled: showCorrect,
-          onToggle: this.toggleShowCorrect,
-          __self: this,
-          __source: {
-            fileName: _jsxFileName,
-            lineNumber: 542
-          }
-        })), teacherInstructions && hasText(teacherInstructions) && [React$1.createElement(Collapsible, {
-          key: "collapsible",
-          labels: {
-            hidden: 'Show Teacher Instructions',
-            visible: 'Hide Teacher Instructions'
-          },
-          className: classes.collapsible,
-          __self: this,
-          __source: {
-            fileName: _jsxFileName,
-            lineNumber: 551
-          }
-        }, React$1.createElement(PreviewPrompt, {
-          prompt: teacherInstructions,
-          __self: this,
-          __source: {
-            fileName: _jsxFileName,
-            lineNumber: 559
-          }
-        })), React$1.createElement('br', {
-          key: "br",
-          __self: this,
-          __source: {
-            fileName: _jsxFileName,
-            lineNumber: 561
-          }
-        })], rationale && hasText(rationale) && [React$1.createElement(Collapsible, {
-          key: "collapsible",
-          labels: {
-            hidden: 'Show Rationale',
-            visible: 'Hide Rationale'
-          },
-          __self: this,
-          __source: {
-            fileName: _jsxFileName,
-            lineNumber: 564
-          }
-        }, React$1.createElement(PreviewPrompt, {
-          prompt: rationale,
-          __self: this,
-          __source: {
-            fileName: _jsxFileName,
-            lineNumber: 571
-          }
-        })), React$1.createElement('br', {
-          key: "br",
-          __self: this,
-          __source: {
-            fileName: _jsxFileName,
-            lineNumber: 573
-          }
-        })], displayNote && hasText(note) && [React$1.createElement(Collapsible, {
-          key: "collapsible",
-          labels: {
-            hidden: 'Show Note',
-            visible: 'Hide Note'
-          },
-          __self: this,
-          __source: {
-            fileName: _jsxFileName,
-            lineNumber: 576
-          }
-        }, React$1.createElement(PreviewPrompt, {
-          prompt: note,
-          __self: this,
-          __source: {
-            fileName: _jsxFileName,
-            lineNumber: 583
-          }
-        })), React$1.createElement('br', {
-          key: "br",
-          __self: this,
-          __source: {
-            fileName: _jsxFileName,
-            lineNumber: 585
-          }
-        })], feedback && React$1.createElement(Feedback, {
-          correctness: correctness.correctness,
-          feedback: feedback,
-          __self: this,
-          __source: {
-            fileName: _jsxFileName,
-            lineNumber: 588
-          }
-        })),
-        __self: this,
-        __source: {
-          fileName: _jsxFileName,
-          lineNumber: 532
-        }
-      }, React$1.createElement('div', {
-        className: classes.mainContainer,
-        ref: r => this.root = r || this.root,
-        __self: this,
-        __source: {
-          fileName: _jsxFileName,
-          lineNumber: 596
-        }
-      }, midContent));
-    }
-    return React$1.createElement('div', {
-      className: classes.mainContainer,
-      ref: r => this.root = r || this.root,
-      __self: this,
-      __source: {
-        fileName: _jsxFileName,
-        lineNumber: 606
-      }
-    }, midContent);
-  }
-}
-Main.__initStatic();
-const styles = theme => ({
-  mainContainer: {
-    display: 'inline-block'
-  },
-  tooltip: {
-    background: `${color.primaryLight()} !important`,
-    color: color.text(),
-    padding: theme.spacing.unit * 2,
-    border: `1px solid ${color.secondary()}`,
-    fontSize: '16px',
-    '& :not(.MathJax) > table tr': {
-      '&:nth-child(2n)': {
-        backgroundColor: 'unset !important'
-      }
-    }
-  },
-  tooltipPopper: {
-    opacity: 1
-  },
-  keypadTooltip: {
-    fontSize: 'initial',
-    background: 'transparent',
-    width: '600px',
-    marginTop: 0,
-    paddingTop: 0
-  },
-  keypadTooltipPopper: {
-    background: 'transparent',
-    width: '650px',
-    opacity: 1
-  },
-  main: {
-    width: '100%',
-    position: 'relative',
-    padding: theme.spacing.unit / 2,
-    backgroundColor: color.background(),
-    color: color.text()
-  },
-  title: {
-    fontSize: '1.1rem',
-    display: 'block',
-    marginTop: theme.spacing.unit * 2,
-    marginBottom: theme.spacing.unit
-  },
-  content: {
-    marginTop: theme.spacing.unit * 2
-  },
-  note: {
-    paddingTop: '15px'
-  },
-  collapsible: {
-    marginTop: theme.spacing.unit * 2
-  },
-  responseContainer: {
-    zIndex: 10,
-    minWidth: '400px',
-    marginTop: theme.spacing.unit * 2
-  },
-  expression: {
-    maxWidth: 'fit-content',
-    '& > .mq-math-mode': {
-      '& > .mq-root-block': {
-        '& > .mq-editable-field': {
-          minWidth: '10px',
-          margin: theme.spacing.unit * 2 / 3,
-          padding: theme.spacing.unit / 4
-        }
-      },
-      '& sup': {
-        top: 0
-      }
-    }
-  },
-  inputAndKeypadContainer: {
-    position: 'relative',
-    '& .mq-overarrow-inner': {
-      border: 'none !important',
-      padding: '0 !important'
-    },
-    '& .mq-overarrow-inner-right': {
-      display: 'none !important'
-    },
-    '& .mq-overarrow-inner-left': {
-      display: 'none !important'
-    },
-    '& .mq-overarrow.mq-arrow-both': {
-      minWidth: '1.23em',
-      '& *': {
-        lineHeight: '1 !important'
-      },
-      '&:before': {
-        top: '-0.4em',
-        left: '-1px'
-      },
-      '&:after': {
-        top: '-2.4em',
-        right: '-1px'
-      },
-      '&.mq-empty:after': {
-        top: '-0.45em'
-      }
-    },
-    '& .mq-overarrow.mq-arrow-right': {
-      '&:before': {
-        top: '-0.4em',
-        right: '-1px'
-      }
-    },
-    '& .mq-longdiv-inner': {
-      borderTop: '1px solid !important',
-      paddingTop: '1.5px !important'
-    },
-    '& .mq-parallelogram': {
-      lineHeight: 0.85
-    }
-  },
-  showCorrectness: {
-    border: '2px solid'
-  },
-  correctAnswerShown: {
-    padding: theme.spacing.unit,
-    letterSpacing: '0.5px'
-  },
-  printCorrect: {
-    border: `2px solid ${color.correct()} !important`
-  },
-  correct: {
-    borderColor: `${color.correct()} !important`
-  },
-  incorrect: {
-    borderColor: `${color.incorrect()} !important`
-  },
-  blockContainer: {
-    margin: `${theme.spacing.unit}px !important`,
-    display: 'inline-flex',
-    border: '2px solid grey !important'
-  },
-  blockResponse: {
-    flex: 2,
-    color: 'grey',
-    background: 'lightgrey',
-    fontSize: '0.8rem !important',
-    padding: `${theme.spacing.unit / 2}px !important`,
-    display: 'flex',
-    alignItems: 'center',
-    justifyContent: 'center',
-    borderRight: `2px solid ${color.disabled()} !important`
-  },
-  toggle: {
-    color: color.text()
-  },
-  blockMath: {
-    color: color.text(),
-    backgroundColor: color.background(),
-    padding: `${theme.spacing.unit / 2}px !important`,
-    display: 'flex',
-    alignItems: 'center',
-    justifyContent: 'center',
-    flex: 8,
-    '& > .mq-math-mode': {
-      '& > .mq-hasCursor': {
-        '& > .mq-cursor': {
-          display: 'none'
-        }
-      }
-    }
-  },
-  printContainer: {
-    marginBottom: '10px',
-    pointerEvents: 'none'
-  }
-});
-var Main$1 = withStyles(styles)(Main);
-function getDefaultExportFromCjs(x) {
-  return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
-}
-var lib = {};
-Object.defineProperty(lib, "__esModule", {
-  value: true
-});
-class ModelSetEvent extends CustomEvent {
-  constructor(component, complete, hasModel) {
-    super(ModelSetEvent.TYPE, {
-      bubbles: true,
-      composed: true,
-      detail: {
-        complete,
-        component,
-        hasModel
-      }
-    });
-    this.component = component;
-    this.complete = complete;
-  }
-}
-ModelSetEvent.TYPE = 'model-set';
-var ModelSetEvent_1 = lib.ModelSetEvent = ModelSetEvent;
-class SessionChangedEvent extends CustomEvent {
-  constructor(component, complete) {
-    super(SessionChangedEvent.TYPE, {
-      bubbles: true,
-      composed: true,
-      detail: {
-        complete,
-        component
-      }
-    });
-    this.component = component;
-    this.complete = complete;
-  }
-}
-SessionChangedEvent.TYPE = 'session-changed';
-var SessionChangedEvent_1 = lib.SessionChangedEvent = SessionChangedEvent;
-var defaults$1 = {};
-var utils = {};
-Object.defineProperty(utils, "__esModule", {
-  value: true
-});
-utils.generateValidationMessage = utils.ResponseTypes = void 0;
-var ResponseTypes = {
-  advanced: 'Advanced Multi',
-  simple: 'Simple'
-};
-utils.ResponseTypes = ResponseTypes;
-var generateValidationMessage = function generateValidationMessage() {
-  var model = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-  var config = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-  var maxResponseAreas = config.maxResponseAreas;
-  var responseType = model.responseType;
-  var responseAreasMessage = '';
-  var answersMessage = '\nAll correct answers (the primary and any alternates) should not be empty and should be unique.';
-  if (responseType === 'Advanced Multi') {
-    responseAreasMessage = '\nThere should be at least 1 ' + (maxResponseAreas ? ("and at most ").concat(maxResponseAreas, " ") : '') + 'response area' + (maxResponseAreas ? 's' : '') + ' defined.';
-  }
-  return 'Validation requirements:' + answersMessage + responseAreasMessage;
-};
-utils.generateValidationMessage = generateValidationMessage;
-(function (exports) {
-  Object.defineProperty(exports, "__esModule", {
-    value: true
-  });
-  exports["default"] = void 0;
-  var _utils = utils;
-  var _default = {
-    model: {
-      partialScoring: true,
-      responseType: _utils.ResponseTypes.advanced,
-      element: 'math-inline',
-      feedback: {
-        correct: {
-          "default": 'Correct',
-          type: 'none'
-        },
-        incorrect: {
-          "default": 'Incorrect',
-          type: 'none'
-        },
-        partial: {
-          "default": 'Nearly',
-          type: 'none'
-        }
-      },
-      equationEditor: '8',
-      expression: '',
-      rationale: 'Rationale goes here.',
-      note: 'The answer shown above is the primary correct answer specified by the author for this item, but other answers may also be recognized as correct.',
-      prompt: '',
-      responses: [],
-      customKeys: [],
-      scoringType: 'auto',
-      feedbackEnabled: true,
-      promptEnabled: true,
-      rationaleEnabled: true,
-      teacherInstructionsEnabled: true,
-      studentInstructionsEnabled: true,
-      toolbarEditorPosition: 'bottom',
-      validationDefault: 'literal',
-      ignoreOrderDefault: false,
-      allowTrailingZerosDefault: false
-    },
-    configuration: {
-      prompt: {
-        settings: true,
-        label: 'Prompt'
-      },
-      feedback: {
-        settings: true,
-        label: 'Feedback'
-      },
-      responseType: {
-        settings: true,
-        label: 'Response type'
-      },
-      rationale: {
-        settings: true,
-        label: 'Rationale'
-      },
-      spellCheck: {
-        label: 'Spellcheck',
-        settings: false,
-        enabled: true
-      },
-      scoringType: {
-        settings: false,
-        label: 'Scoring Type'
-      },
-      studentInstructions: {
-        settings: false,
-        label: 'Student Instructions'
-      },
-      teacherInstructions: {
-        settings: true,
-        label: 'Teacher Instructions'
-      },
-      partialScoring: {
-        settings: false,
-        label: 'Allow Partial Scoring'
-      },
-      ignoreOrder: {
-        settings: false,
-        label: 'Ignore Order',
-        enabled: true
-      },
-      allowTrailingZeros: {
-        settings: false,
-        label: 'Allow Trailing Zeros',
-        enabled: true
-      }
-    }
-  };
-  exports["default"] = _default;
-})(defaults$1);
-var defaults = getDefaultExportFromCjs(defaults$1);
-const React = _dll_react;
-const ReactDOM = _dll_react_dom;
-const debug = _dll_debug;
-const _ = _dll_lodash;
-const log = debug('pie-ui:math-inline');
-class MathInline extends HTMLElement {
-  constructor() {
-    super();
-    this._configuration = defaults.configuration;
-    this.sessionChangedEventCaller = _.debounce(() => {
-      this.dispatchEvent(new SessionChangedEvent_1(this.tagName.toLowerCase(), true));
-    }, 1000);
-  }
-  set model(m) {
-    this._model = m;
-    this.dispatchEvent(new ModelSetEvent_1(this._model, true, !!this._model));
-    this._render();
-  }
-  set session(s) {
-    this._session = s;
-    this._render();
-  }
-  get session() {
-    return this._session;
-  }
-  set configuration(c) {
-    this._configuration = c;
-    this._render();
-  }
-  sessionChanged(s) {
-    Object.keys(s).map(key => {
-      this._session[key] = s[key];
-    });
-    this.sessionChangedEventCaller();
-    log('session: ', this._session);
-  }
-  connectedCallback() {
-    this._render();
-  }
-  _render() {
-    if (!this._model || !this._session) {
-      return;
-    }
-    const el = React.createElement(Main$1, {
-      model: this._model,
-      session: this._session,
-      configuration: this._configuration,
-      onSessionChange: this.sessionChanged.bind(this)
-    });
-    ReactDOM.render(el, this);
-  }
-}
-export {Main$1 as Component, MathInline as default};