@pie-lib/mask-markup 1.12.1 → 1.12.4

package/CHANGELOG.md

@@ -3,6 +3,30 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [1.12.4](https://github.com/pie-framework/pie-lib/compare/@pie-lib/mask-markup@1.12.3...@pie-lib/mask-markup@1.12.4) (2022-04-28)
+
+**Note:** Version bump only for package @pie-lib/mask-markup
+
+
+
+
+
+## [1.12.3](https://github.com/pie-framework/pie-lib/compare/@pie-lib/mask-markup@1.12.2...@pie-lib/mask-markup@1.12.3) (2022-03-28)
+
+**Note:** Version bump only for package @pie-lib/mask-markup
+
+
+
+
+
+## [1.12.2](https://github.com/pie-framework/pie-lib/compare/@pie-lib/mask-markup@1.12.1...@pie-lib/mask-markup@1.12.2) (2022-03-21)
+
+**Note:** Version bump only for package @pie-lib/mask-markup
+
+
+
+
+
 ## [1.12.1](https://github.com/pie-framework/pie-lib/compare/@pie-lib/mask-markup@1.12.0...@pie-lib/mask-markup@1.12.1) (2022-03-21)
 
 

package/lib/components/blank.js

@@ -74,6 +74,7 @@ var useStyles = (0, _styles.withStyles)(function () {
       minWidth: '90px',
       fontSize: 'inherit',
       minHeight: '32px',
+      height: 'auto',
       maxWidth: '374px',
       position: 'relative'
     },

package/lib/components/blank.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/blank.jsx"],"names":["log","DRAG_TYPE","useStyles","content","border","color","primary","minWidth","chip","fontSize","minHeight","maxWidth","position","chipLabel","whiteSpace","display","padding","hidden","opacity","dragged","left","correct","incorrect","over","overflow","BlankContent","state","height","prevProps","rootRef","currentChoice","props","choice","prevChoice","JSON","stringify","setState","setTimeout","spanRef","offsetHeight","parent","childNodes","forEach","elem","Element","HTMLDocument","setAttribute","disabled","classes","isOver","dragItem","draggedLabel","value","label","ref","ReactDOM","findDOMNode","innerHTML","addDraggableFalseAttributes","undefined","React","Component","id","PropTypes","oneOfType","string","number","bool","duplicates","object","onChange","func","StyledBlankContent","connectedBlankContent","connectDragSource","connectDropTarget","tileTarget","drop","monitor","draggedItem","getItem","instanceId","dropped","canDrop","DropTile","connect","dropTarget","tileSource","canDrag","beginDrag","fromChoice","endDrag","dropResult","getDropResult","DragDropTile","dragSource","isDragging"],"mappings":"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","sourcesContent":["import React from 'react';\nimport ReactDOM from 'react-dom';\nimport PropTypes from 'prop-types';\nimport { renderMath } from '@pie-lib/math-rendering';\nimport debug from 'debug';\nimport { DragSource, DropTarget } from '@pie-lib/drag';\nimport { withStyles } from '@material-ui/core/styles';\nimport Chip from '@material-ui/core/Chip';\nimport classnames from 'classnames';\nimport { color } from '@pie-lib/render-ui';\nconst log = debug('pie-lib:mask-markup:blank');\nexport const DRAG_TYPE = 'MaskBlank';\n\nconst useStyles = withStyles(() => ({\n  content: {\n    border: `solid 0px ${color.primary()}`,\n    minWidth: '200px'\n  },\n  chip: {\n    minWidth: '90px',\n    fontSize: 'inherit',\n    minHeight: '32px',\n    maxWidth: '374px',\n    position: 'relative'\n  },\n  chipLabel: {\n    whiteSpace: 'pre-wrap',\n    '& img': {\n      display: 'block',\n      padding: '2px 0'\n    }\n  },\n  hidden: {\n    color: 'transparent',\n    opacity: 0\n  },\n  dragged: {\n    position: 'absolute',\n    left: 14,\n    maxWidth: '60px'\n  },\n  correct: {\n    border: `solid 1px ${color.correct()}`\n  },\n  incorrect: {\n    border: `solid 1px ${color.incorrect()}`\n  },\n  over: {\n    whiteSpace: 'nowrap',\n    overflow: 'hidden'\n  }\n}));\n\nexport class BlankContent extends React.Component {\n  static propTypes = {\n    id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n    disabled: PropTypes.bool,\n    duplicates: PropTypes.bool,\n    choice: PropTypes.object,\n    classes: PropTypes.object,\n    isOver: PropTypes.bool,\n    dragItem: PropTypes.object,\n    correct: PropTypes.bool,\n    onChange: PropTypes.func\n  };\n\n  constructor() {\n    super();\n    this.state = {\n      height: 0\n    };\n  }\n\n  componentDidUpdate(prevProps) {\n    renderMath(this.rootRef);\n    const { choice: currentChoice } = this.props;\n    const { choice: prevChoice } = prevProps;\n\n    if (JSON.stringify(currentChoice) !== JSON.stringify(prevChoice)) {\n      if (!currentChoice) {\n        this.setState({\n          height: 0\n        });\n        return;\n      }\n      setTimeout(() => {\n        this.setState({\n          height: this.spanRef.offsetHeight\n        });\n      }, 300);\n    }\n  }\n\n  addDraggableFalseAttributes(parent) {\n    parent.childNodes.forEach(elem => {\n      if (elem instanceof Element || elem instanceof HTMLDocument) {\n        elem.setAttribute('draggable', false);\n      }\n    });\n  }\n\n  render() {\n    const { disabled, choice, classes, isOver, dragItem, correct } = this.props;\n    const draggedLabel = dragItem && isOver && dragItem.choice.value;\n    const label = choice && choice.value;\n\n    return (\n      <Chip\n        ref={ref => {\n          //eslint-disable-next-line\n          this.rootRef = ReactDOM.findDOMNode(ref);\n        }}\n        component=\"span\"\n        label={\n          <React.Fragment>\n            <span\n              className={classnames(classes.chipLabel, isOver && classes.over, {\n                [classes.hidden]: draggedLabel\n              })}\n              ref={ref => {\n                if (ref) {\n                  //eslint-disable-next-line\n                  this.spanRef = ReactDOM.findDOMNode(ref);\n                  ref.innerHTML = label || '';\n                  this.addDraggableFalseAttributes(ref);\n                }\n              }}\n            >\n              {' '}\n            </span>\n            {draggedLabel && (\n              <span\n                className={classnames(classes.chipLabel, isOver && classes.over, classes.dragged)}\n                ref={ref => {\n                  if (ref) {\n                    //eslint-disable-next-line\n                    this.spanRef = ReactDOM.findDOMNode(ref);\n                    ref.innerHTML = draggedLabel || '';\n                    this.addDraggableFalseAttributes(ref);\n                  }\n                }}\n              >\n                {' '}\n              </span>\n            )}\n          </React.Fragment>\n        }\n        className={classnames(classes.chip, isOver && classes.over, {\n          [classes.correct]: correct !== undefined && correct,\n          [classes.incorrect]: correct !== undefined && !correct\n        })}\n        variant={disabled ? 'outlined' : undefined}\n        style={{\n          ...(this.state.height ? { height: this.state.height } : {})\n        }}\n        classes={{\n          label: isOver && classes.over\n        }}\n      />\n    );\n  }\n}\n\nconst StyledBlankContent = useStyles(BlankContent);\n\nconst connectedBlankContent = useStyles(({ connectDragSource, connectDropTarget, ...props }) => {\n  const { classes, isOver } = props;\n\n  return connectDropTarget(\n    connectDragSource(\n      <span className={classnames(classes.content, isOver && classes.over)}>\n        <StyledBlankContent {...props} />\n      </span>\n    )\n  );\n});\n\nconst tileTarget = {\n  drop(props, monitor) {\n    const draggedItem = monitor.getItem();\n\n    log('props.instanceId', props.instanceId, 'draggedItem.instanceId:', draggedItem.instanceId);\n\n    if (draggedItem.id !== props.id) {\n      props.onChange(props.id, draggedItem.choice.id);\n    }\n\n    return {\n      dropped: draggedItem.id !== props.id\n    };\n  },\n  canDrop(props, monitor) {\n    const draggedItem = monitor.getItem();\n\n    return draggedItem.instanceId === props.instanceId;\n  }\n};\n\nconst DropTile = DropTarget(DRAG_TYPE, tileTarget, (connect, monitor) => ({\n  connectDropTarget: connect.dropTarget(),\n  isOver: monitor.isOver(),\n  dragItem: monitor.getItem()\n}))(connectedBlankContent);\n\nconst tileSource = {\n  canDrag(props) {\n    return !props.disabled && !!props.choice;\n  },\n  beginDrag(props) {\n    return {\n      id: props.id,\n      choice: props.choice,\n      instanceId: props.instanceId,\n      fromChoice: true\n    };\n  },\n  endDrag(props, monitor) {\n    // this will be null if it did not drop\n    const dropResult = monitor.getDropResult();\n\n    if (!dropResult || (dropResult.dropped && !props.duplicates)) {\n      const draggedItem = monitor.getItem();\n\n      if (draggedItem.fromChoice) {\n        props.onChange(props.id, undefined);\n      }\n    }\n  }\n};\n\nconst DragDropTile = DragSource(DRAG_TYPE, tileSource, (connect, monitor) => ({\n  connectDragSource: connect.dragSource(),\n  isDragging: monitor.isDragging()\n}))(DropTile);\n\nexport default DragDropTile;\n"],"file":"blank.js"}
+{"version":3,"sources":["../../src/components/blank.jsx"],"names":["log","DRAG_TYPE","useStyles","content","border","color","primary","minWidth","chip","fontSize","minHeight","height","maxWidth","position","chipLabel","whiteSpace","display","padding","hidden","opacity","dragged","left","correct","incorrect","over","overflow","BlankContent","state","prevProps","rootRef","currentChoice","props","choice","prevChoice","JSON","stringify","setState","setTimeout","spanRef","offsetHeight","parent","childNodes","forEach","elem","Element","HTMLDocument","setAttribute","disabled","classes","isOver","dragItem","draggedLabel","value","label","ref","ReactDOM","findDOMNode","innerHTML","addDraggableFalseAttributes","undefined","React","Component","id","PropTypes","oneOfType","string","number","bool","duplicates","object","onChange","func","StyledBlankContent","connectedBlankContent","connectDragSource","connectDropTarget","tileTarget","drop","monitor","draggedItem","getItem","instanceId","dropped","canDrop","DropTile","connect","dropTarget","tileSource","canDrag","beginDrag","fromChoice","endDrag","dropResult","getDropResult","DragDropTile","dragSource","isDragging"],"mappings":"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","sourcesContent":["import React from 'react';\nimport ReactDOM from 'react-dom';\nimport PropTypes from 'prop-types';\nimport { renderMath } from '@pie-lib/math-rendering';\nimport debug from 'debug';\nimport { DragSource, DropTarget } from '@pie-lib/drag';\nimport { withStyles } from '@material-ui/core/styles';\nimport Chip from '@material-ui/core/Chip';\nimport classnames from 'classnames';\nimport { color } from '@pie-lib/render-ui';\nconst log = debug('pie-lib:mask-markup:blank');\nexport const DRAG_TYPE = 'MaskBlank';\n\nconst useStyles = withStyles(() => ({\n  content: {\n    border: `solid 0px ${color.primary()}`,\n    minWidth: '200px'\n  },\n  chip: {\n    minWidth: '90px',\n    fontSize: 'inherit',\n    minHeight: '32px',\n    height: 'auto',\n    maxWidth: '374px',\n    position: 'relative'\n  },\n  chipLabel: {\n    whiteSpace: 'pre-wrap',\n    '& img': {\n      display: 'block',\n      padding: '2px 0'\n    }\n  },\n  hidden: {\n    color: 'transparent',\n    opacity: 0\n  },\n  dragged: {\n    position: 'absolute',\n    left: 14,\n    maxWidth: '60px'\n  },\n  correct: {\n    border: `solid 1px ${color.correct()}`\n  },\n  incorrect: {\n    border: `solid 1px ${color.incorrect()}`\n  },\n  over: {\n    whiteSpace: 'nowrap',\n    overflow: 'hidden'\n  }\n}));\n\nexport class BlankContent extends React.Component {\n  static propTypes = {\n    id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n    disabled: PropTypes.bool,\n    duplicates: PropTypes.bool,\n    choice: PropTypes.object,\n    classes: PropTypes.object,\n    isOver: PropTypes.bool,\n    dragItem: PropTypes.object,\n    correct: PropTypes.bool,\n    onChange: PropTypes.func\n  };\n\n  constructor() {\n    super();\n    this.state = {\n      height: 0\n    };\n  }\n\n  componentDidUpdate(prevProps) {\n    renderMath(this.rootRef);\n    const { choice: currentChoice } = this.props;\n    const { choice: prevChoice } = prevProps;\n\n    if (JSON.stringify(currentChoice) !== JSON.stringify(prevChoice)) {\n      if (!currentChoice) {\n        this.setState({\n          height: 0\n        });\n        return;\n      }\n      setTimeout(() => {\n        this.setState({\n          height: this.spanRef.offsetHeight\n        });\n      }, 300);\n    }\n  }\n\n  addDraggableFalseAttributes(parent) {\n    parent.childNodes.forEach(elem => {\n      if (elem instanceof Element || elem instanceof HTMLDocument) {\n        elem.setAttribute('draggable', false);\n      }\n    });\n  }\n\n  render() {\n    const { disabled, choice, classes, isOver, dragItem, correct } = this.props;\n    const draggedLabel = dragItem && isOver && dragItem.choice.value;\n    const label = choice && choice.value;\n\n    return (\n      <Chip\n        ref={ref => {\n          //eslint-disable-next-line\n          this.rootRef = ReactDOM.findDOMNode(ref);\n        }}\n        component=\"span\"\n        label={\n          <React.Fragment>\n            <span\n              className={classnames(classes.chipLabel, isOver && classes.over, {\n                [classes.hidden]: draggedLabel\n              })}\n              ref={ref => {\n                if (ref) {\n                  //eslint-disable-next-line\n                  this.spanRef = ReactDOM.findDOMNode(ref);\n                  ref.innerHTML = label || '';\n                  this.addDraggableFalseAttributes(ref);\n                }\n              }}\n            >\n              {' '}\n            </span>\n            {draggedLabel && (\n              <span\n                className={classnames(classes.chipLabel, isOver && classes.over, classes.dragged)}\n                ref={ref => {\n                  if (ref) {\n                    //eslint-disable-next-line\n                    this.spanRef = ReactDOM.findDOMNode(ref);\n                    ref.innerHTML = draggedLabel || '';\n                    this.addDraggableFalseAttributes(ref);\n                  }\n                }}\n              >\n                {' '}\n              </span>\n            )}\n          </React.Fragment>\n        }\n        className={classnames(classes.chip, isOver && classes.over, {\n          [classes.correct]: correct !== undefined && correct,\n          [classes.incorrect]: correct !== undefined && !correct\n        })}\n        variant={disabled ? 'outlined' : undefined}\n        style={{\n          ...(this.state.height ? { height: this.state.height } : {})\n        }}\n        classes={{\n          label: isOver && classes.over\n        }}\n      />\n    );\n  }\n}\n\nconst StyledBlankContent = useStyles(BlankContent);\n\nconst connectedBlankContent = useStyles(({ connectDragSource, connectDropTarget, ...props }) => {\n  const { classes, isOver } = props;\n\n  return connectDropTarget(\n    connectDragSource(\n      <span className={classnames(classes.content, isOver && classes.over)}>\n        <StyledBlankContent {...props} />\n      </span>\n    )\n  );\n});\n\nconst tileTarget = {\n  drop(props, monitor) {\n    const draggedItem = monitor.getItem();\n\n    log('props.instanceId', props.instanceId, 'draggedItem.instanceId:', draggedItem.instanceId);\n\n    if (draggedItem.id !== props.id) {\n      props.onChange(props.id, draggedItem.choice.id);\n    }\n\n    return {\n      dropped: draggedItem.id !== props.id\n    };\n  },\n  canDrop(props, monitor) {\n    const draggedItem = monitor.getItem();\n\n    return draggedItem.instanceId === props.instanceId;\n  }\n};\n\nconst DropTile = DropTarget(DRAG_TYPE, tileTarget, (connect, monitor) => ({\n  connectDropTarget: connect.dropTarget(),\n  isOver: monitor.isOver(),\n  dragItem: monitor.getItem()\n}))(connectedBlankContent);\n\nconst tileSource = {\n  canDrag(props) {\n    return !props.disabled && !!props.choice;\n  },\n  beginDrag(props) {\n    return {\n      id: props.id,\n      choice: props.choice,\n      instanceId: props.instanceId,\n      fromChoice: true\n    };\n  },\n  endDrag(props, monitor) {\n    // this will be null if it did not drop\n    const dropResult = monitor.getDropResult();\n\n    if (!dropResult || (dropResult.dropped && !props.duplicates)) {\n      const draggedItem = monitor.getItem();\n\n      if (draggedItem.fromChoice) {\n        props.onChange(props.id, undefined);\n      }\n    }\n  }\n};\n\nconst DragDropTile = DragSource(DRAG_TYPE, tileSource, (connect, monitor) => ({\n  connectDragSource: connect.dragSource(),\n  isDragging: monitor.isDragging()\n}))(DropTile);\n\nexport default DragDropTile;\n"],"file":"blank.js"}

package/lib/components/correct-input.js

@@ -15,7 +15,7 @@ var _styles = require("@material-ui/core/styles");
 
 var _renderUi = require("@pie-lib/render-ui");
 
-var _excluded = ["correct", "charactersLimit", "classes", "disabled", "isBox", "isConstructedResponse", "width"];
+var _excluded = ["correct", "charactersLimit", "classes", "disabled", "isBox", "isConstructedResponse", "width", "spellCheck"];
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
@@ -85,6 +85,7 @@ var _default = (0, _styles.withStyles)(function () {
       isBox = props.isBox,
       isConstructedResponse = props.isConstructedResponse,
       width = props.width,
+      spellCheck = props.spellCheck,
       rest = _objectWithoutProperties(props, _excluded);
 
   var label = typeof correct === 'boolean' ? correct ? 'correct' : 'incorrect' : undefined;
@@ -106,7 +107,8 @@ var _default = (0, _styles.withStyles)(function () {
     },
     inputProps: inputProps,
     labelWidth: 0,
-    disabled: disabled
+    disabled: disabled,
+    spellCheck: spellCheck
   }, rest));
 });
 

package/lib/components/correct-input.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/correct-input.jsx"],"names":["correctStyle","color","borderColor","input","text","backgroundColor","background","borderRadius","borderWidth","borderStyle","padding","opacity","cursor","primary","primaryDark","crInput","correct","incorrect","box","fontSize","outlinedInput","border","notchedOutline","props","charactersLimit","classes","disabled","isBox","isConstructedResponse","width","rest","label","undefined","inputProps","maxLength","style","Math","round","disabledInput"],"mappings":"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","sourcesContent":["import React from 'react';\nimport OutlinedInput from '@material-ui/core/OutlinedInput';\nimport classnames from 'classnames';\nimport { withStyles } from '@material-ui/core/styles';\nimport { color } from '@pie-lib/render-ui';\n\nconst correctStyle = color => ({\n  borderColor: `${color} !important`\n});\n\nexport default withStyles(() => ({\n  input: {\n    color: color.text(),\n    backgroundColor: color.background(),\n    borderRadius: '4px !important',\n    borderWidth: '1px',\n    borderStyle: 'solid',\n    padding: '10px 20px 10px 10px',\n    '&:disabled': {\n      opacity: 0.8,\n      cursor: 'not-allowed !important'\n    },\n    '&:hover': {\n      borderColor: color.primary(),\n      '&:disabled': {\n        borderColor: 'initial'\n      }\n    },\n    '&:focus': {\n      borderColor: color.primaryDark()\n    }\n  },\n  crInput: {\n    padding: '8px !important'\n  },\n  correct: correctStyle(color.correct()),\n  incorrect: correctStyle(color.incorrect()),\n  box: {\n    fontSize: 'inherit'\n  },\n  outlinedInput: {\n    padding: '2px',\n    borderRadius: '4px',\n    '& fieldset': {\n      border: 0\n    }\n  },\n  notchedOutline: {\n    borderColor: color.correct()\n  }\n}))(props => {\n  const {\n    correct,\n    charactersLimit,\n    classes,\n    disabled,\n    isBox,\n    isConstructedResponse,\n    width,\n    ...rest\n  } = props;\n  const label = typeof correct === 'boolean' ? (correct ? 'correct' : 'incorrect') : undefined;\n  const inputProps = charactersLimit ? { maxLength: charactersLimit } : {};\n\n  if (width) {\n    inputProps.style = {\n      width: `${width + Math.round(width / 10) + 1}ch` // added some extra space for capital letters\n    };\n  }\n\n  return (\n    <OutlinedInput\n      className={classnames({\n        [classes.disabledInput]: disabled,\n        [classes.box]: isBox,\n        [classes.outlinedInput]: true\n      })}\n      classes={{\n        input: classnames({\n          [classes.input]: true,\n          [classes[label]]: label,\n          [classes.crInput]: isConstructedResponse\n        })\n      }}\n      inputProps={inputProps}\n      labelWidth={0}\n      disabled={disabled}\n      {...rest}\n    />\n  );\n});\n"],"file":"correct-input.js"}
+{"version":3,"sources":["../../src/components/correct-input.jsx"],"names":["correctStyle","color","borderColor","input","text","backgroundColor","background","borderRadius","borderWidth","borderStyle","padding","opacity","cursor","primary","primaryDark","crInput","correct","incorrect","box","fontSize","outlinedInput","border","notchedOutline","props","charactersLimit","classes","disabled","isBox","isConstructedResponse","width","spellCheck","rest","label","undefined","inputProps","maxLength","style","Math","round","disabledInput"],"mappings":"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","sourcesContent":["import React from 'react';\nimport OutlinedInput from '@material-ui/core/OutlinedInput';\nimport classnames from 'classnames';\nimport { withStyles } from '@material-ui/core/styles';\nimport { color } from '@pie-lib/render-ui';\n\nconst correctStyle = color => ({\n  borderColor: `${color} !important`\n});\n\nexport default withStyles(() => ({\n  input: {\n    color: color.text(),\n    backgroundColor: color.background(),\n    borderRadius: '4px !important',\n    borderWidth: '1px',\n    borderStyle: 'solid',\n    padding: '10px 20px 10px 10px',\n    '&:disabled': {\n      opacity: 0.8,\n      cursor: 'not-allowed !important'\n    },\n    '&:hover': {\n      borderColor: color.primary(),\n      '&:disabled': {\n        borderColor: 'initial'\n      }\n    },\n    '&:focus': {\n      borderColor: color.primaryDark()\n    }\n  },\n  crInput: {\n    padding: '8px !important'\n  },\n  correct: correctStyle(color.correct()),\n  incorrect: correctStyle(color.incorrect()),\n  box: {\n    fontSize: 'inherit'\n  },\n  outlinedInput: {\n    padding: '2px',\n    borderRadius: '4px',\n    '& fieldset': {\n      border: 0\n    }\n  },\n  notchedOutline: {\n    borderColor: color.correct()\n  }\n}))(props => {\n  const {\n    correct,\n    charactersLimit,\n    classes,\n    disabled,\n    isBox,\n    isConstructedResponse,\n    width,\n    spellCheck,\n    ...rest\n  } = props;\n  const label = typeof correct === 'boolean' ? (correct ? 'correct' : 'incorrect') : undefined;\n  const inputProps = charactersLimit ? { maxLength: charactersLimit } : {};\n\n  if (width) {\n    inputProps.style = {\n      width: `${width + Math.round(width / 10) + 1}ch` // added some extra space for capital letters\n    };\n  }\n\n  return (\n    <OutlinedInput\n      className={classnames({\n        [classes.disabledInput]: disabled,\n        [classes.box]: isBox,\n        [classes.outlinedInput]: true\n      })}\n      classes={{\n        input: classnames({\n          [classes.input]: true,\n          [classes[label]]: label,\n          [classes.crInput]: isConstructedResponse\n        })\n      }}\n      inputProps={inputProps}\n      labelWidth={0}\n      disabled={disabled}\n      spellCheck={spellCheck}\n      {...rest}\n    />\n  );\n});\n"],"file":"correct-input.js"}

package/lib/components/input.js

@@ -22,6 +22,7 @@ var Input = function Input(_ref) {
       value = _ref.value,
       _onChange = _ref.onChange,
       showCorrectAnswer = _ref.showCorrectAnswer,
+      spellCheck = _ref.spellCheck,
       width = _ref.width;
   return /*#__PURE__*/_react["default"].createElement(_correctInput["default"], {
     disabled: disabled,
@@ -30,6 +31,7 @@ var Input = function Input(_ref) {
     variant: "outlined",
     value: value,
     isConstructedResponse: isConstructedResponse,
+    spellCheck: spellCheck,
     isBox: true,
     width: width,
     onChange: function onChange(e) {
@@ -43,6 +45,7 @@ Input.propTypes = {
   value: _propTypes["default"].string,
   onChange: _propTypes["default"].func,
   disabled: _propTypes["default"].bool,
+  spellCheck: _propTypes["default"].bool,
   correct: _propTypes["default"].bool,
   showCorrectAnswer: _propTypes["default"].bool
 };

package/lib/components/input.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/input.jsx"],"names":["Input","disabled","correct","charactersLimit","id","isConstructedResponse","value","onChange","showCorrectAnswer","width","e","target","propTypes","PropTypes","string","func","bool"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;;;AAEA,IAAMA,KAAK,GAAG,SAARA,KAAQ,OAUR;AAAA,MATJC,QASI,QATJA,QASI;AAAA,MARJC,OAQI,QARJA,OAQI;AAAA,MAPJC,eAOI,QAPJA,eAOI;AAAA,MANJC,EAMI,QANJA,EAMI;AAAA,MALJC,qBAKI,QALJA,qBAKI;AAAA,MAJJC,KAII,QAJJA,KAII;AAAA,MAHJC,SAGI,QAHJA,QAGI;AAAA,MAFJC,iBAEI,QAFJA,iBAEI;AAAA,MADJC,KACI,QADJA,KACI;AACJ,sBACE,gCAAC,wBAAD;AACE,IAAA,QAAQ,EAAER,QADZ;AAEE,IAAA,OAAO,EAAEO,iBAAiB,IAAIN,OAFhC;AAGE,IAAA,eAAe,EAAEC,eAHnB;AAIE,IAAA,OAAO,EAAC,UAJV;AAKE,IAAA,KAAK,EAAEG,KALT;AAME,IAAA,qBAAqB,EAAED,qBANzB;AAOE,IAAA,KAAK,EAAE,IAPT;AAQE,IAAA,KAAK,EAAEI,KART;AASE,IAAA,QAAQ,EAAE,kBAAAC,CAAC,EAAI;AACbH,MAAAA,SAAQ,CAACH,EAAD,EAAKM,CAAC,CAACC,MAAF,CAASL,KAAd,CAAR;AACD;AAXH,IADF;AAeD,CA1BD;;AA4BAN,KAAK,CAACY,SAAN,GAAkB;AAChBR,EAAAA,EAAE,EAAES,sBAAUC,MADE;AAEhBR,EAAAA,KAAK,EAAEO,sBAAUC,MAFD;AAGhBP,EAAAA,QAAQ,EAAEM,sBAAUE,IAHJ;AAIhBd,EAAAA,QAAQ,EAAEY,sBAAUG,IAJJ;AAKhBd,EAAAA,OAAO,EAAEW,sBAAUG,IALH;AAMhBR,EAAAA,iBAAiB,EAAEK,sBAAUG;AANb,CAAlB;eASehB,K","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport CorrectInput from './correct-input';\n\nconst Input = ({\n  disabled,\n  correct,\n  charactersLimit,\n  id,\n  isConstructedResponse,\n  value,\n  onChange,\n  showCorrectAnswer,\n  width\n}) => {\n  return (\n    <CorrectInput\n      disabled={disabled}\n      correct={showCorrectAnswer || correct}\n      charactersLimit={charactersLimit}\n      variant=\"outlined\"\n      value={value}\n      isConstructedResponse={isConstructedResponse}\n      isBox={true}\n      width={width}\n      onChange={e => {\n        onChange(id, e.target.value);\n      }}\n    />\n  );\n};\n\nInput.propTypes = {\n  id: PropTypes.string,\n  value: PropTypes.string,\n  onChange: PropTypes.func,\n  disabled: PropTypes.bool,\n  correct: PropTypes.bool,\n  showCorrectAnswer: PropTypes.bool\n};\n\nexport default Input;\n"],"file":"input.js"}
+{"version":3,"sources":["../../src/components/input.jsx"],"names":["Input","disabled","correct","charactersLimit","id","isConstructedResponse","value","onChange","showCorrectAnswer","spellCheck","width","e","target","propTypes","PropTypes","string","func","bool"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;;;AAEA,IAAMA,KAAK,GAAG,SAARA,KAAQ,OAWR;AAAA,MAVJC,QAUI,QAVJA,QAUI;AAAA,MATJC,OASI,QATJA,OASI;AAAA,MARJC,eAQI,QARJA,eAQI;AAAA,MAPJC,EAOI,QAPJA,EAOI;AAAA,MANJC,qBAMI,QANJA,qBAMI;AAAA,MALJC,KAKI,QALJA,KAKI;AAAA,MAJJC,SAII,QAJJA,QAII;AAAA,MAHJC,iBAGI,QAHJA,iBAGI;AAAA,MAFJC,UAEI,QAFJA,UAEI;AAAA,MADJC,KACI,QADJA,KACI;AACJ,sBACE,gCAAC,wBAAD;AACE,IAAA,QAAQ,EAAET,QADZ;AAEE,IAAA,OAAO,EAAEO,iBAAiB,IAAIN,OAFhC;AAGE,IAAA,eAAe,EAAEC,eAHnB;AAIE,IAAA,OAAO,EAAC,UAJV;AAKE,IAAA,KAAK,EAAEG,KALT;AAME,IAAA,qBAAqB,EAAED,qBANzB;AAOE,IAAA,UAAU,EAAEI,UAPd;AAQE,IAAA,KAAK,EAAE,IART;AASE,IAAA,KAAK,EAAEC,KATT;AAUE,IAAA,QAAQ,EAAE,kBAAAC,CAAC,EAAI;AACbJ,MAAAA,SAAQ,CAACH,EAAD,EAAKO,CAAC,CAACC,MAAF,CAASN,KAAd,CAAR;AACD;AAZH,IADF;AAgBD,CA5BD;;AA8BAN,KAAK,CAACa,SAAN,GAAkB;AAChBT,EAAAA,EAAE,EAAEU,sBAAUC,MADE;AAEhBT,EAAAA,KAAK,EAAEQ,sBAAUC,MAFD;AAGhBR,EAAAA,QAAQ,EAAEO,sBAAUE,IAHJ;AAIhBf,EAAAA,QAAQ,EAAEa,sBAAUG,IAJJ;AAKhBR,EAAAA,UAAU,EAAEK,sBAAUG,IALN;AAMhBf,EAAAA,OAAO,EAAEY,sBAAUG,IANH;AAOhBT,EAAAA,iBAAiB,EAAEM,sBAAUG;AAPb,CAAlB;eAUejB,K","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport CorrectInput from './correct-input';\n\nconst Input = ({\n  disabled,\n  correct,\n  charactersLimit,\n  id,\n  isConstructedResponse,\n  value,\n  onChange,\n  showCorrectAnswer,\n  spellCheck,\n  width\n}) => {\n  return (\n    <CorrectInput\n      disabled={disabled}\n      correct={showCorrectAnswer || correct}\n      charactersLimit={charactersLimit}\n      variant=\"outlined\"\n      value={value}\n      isConstructedResponse={isConstructedResponse}\n      spellCheck={spellCheck}\n      isBox={true}\n      width={width}\n      onChange={e => {\n        onChange(id, e.target.value);\n      }}\n    />\n  );\n};\n\nInput.propTypes = {\n  id: PropTypes.string,\n  value: PropTypes.string,\n  onChange: PropTypes.func,\n  disabled: PropTypes.bool,\n  spellCheck: PropTypes.bool,\n  correct: PropTypes.bool,\n  showCorrectAnswer: PropTypes.bool\n};\n\nexport default Input;\n"],"file":"input.js"}

package/lib/constructed-response.js

@@ -22,7 +22,8 @@ var _default = (0, _withMask.withMask)('input', function (props) {
           disabled = props.disabled,
           feedback = props.feedback,
           showCorrectAnswer = props.showCorrectAnswer,
-          maxLength = props.maxLength; // the first answer is the correct one
+          maxLength = props.maxLength,
+          spellCheck = props.spellCheck; // the first answer is the correct one
 
       var correctAnswer = (props.choices && dataset && props.choices[dataset.id] || [])[0];
       var finalValue = showCorrectAnswer ? correctAnswer && correctAnswer.label : data[dataset.id] || '';
@@ -37,7 +38,8 @@ var _default = (0, _withMask.withMask)('input', function (props) {
         showCorrectAnswer: showCorrectAnswer,
         width: width,
         charactersLimit: adjustedLimit ? width : 25,
-        isConstructedResponse: true
+        isConstructedResponse: true,
+        spellCheck: spellCheck
       });
     }
   };

package/lib/constructed-response.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/constructed-response.jsx"],"names":["props","node","data","onChange","dataset","component","adjustedLimit","disabled","feedback","showCorrectAnswer","maxLength","correctAnswer","choices","id","finalValue","label","width","type"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;;;eAEe,wBAAS,OAAT,EAAkB,UAAAA,KAAK;AAAA,SAAI,UAACC,IAAD,EAAOC,IAAP,EAAaC,QAAb,EAA0B;AAClE,QAAMC,OAAO,GAAGH,IAAI,CAACC,IAAL,GAAYD,IAAI,CAACC,IAAL,CAAUE,OAAV,IAAqB,EAAjC,GAAsC,EAAtD;;AACA,QAAIA,OAAO,CAACC,SAAR,KAAsB,OAA1B,EAAmC;AACjC,UAAQC,aAAR,GAA4EN,KAA5E,CAAQM,aAAR;AAAA,UAAuBC,QAAvB,GAA4EP,KAA5E,CAAuBO,QAAvB;AAAA,UAAiCC,QAAjC,GAA4ER,KAA5E,CAAiCQ,QAAjC;AAAA,UAA2CC,iBAA3C,GAA4ET,KAA5E,CAA2CS,iBAA3C;AAAA,UAA8DC,SAA9D,GAA4EV,KAA5E,CAA8DU,SAA9D,CADiC,CAEjC;;AACA,UAAMC,aAAa,GAAG,CAAEX,KAAK,CAACY,OAAN,IAAiBR,OAAjB,IAA4BJ,KAAK,CAACY,OAAN,CAAcR,OAAO,CAACS,EAAtB,CAA7B,IAA2D,EAA5D,EAAgE,CAAhE,CAAtB;AACA,UAAMC,UAAU,GAAGL,iBAAiB,GAChCE,aAAa,IAAIA,aAAa,CAACI,KADC,GAEhCb,IAAI,CAACE,OAAO,CAACS,EAAT,CAAJ,IAAoB,EAFxB;AAGA,UAAMG,KAAK,GAAGN,SAAS,IAAIA,SAAS,CAACN,OAAO,CAACS,EAAT,CAApC;AAEA,0BACE,gCAAC,iBAAD;AACE,QAAA,GAAG,YAAKZ,IAAI,CAACgB,IAAV,oBAAwBb,OAAO,CAACS,EAAhC,CADL;AAEE,QAAA,OAAO,EAAEL,QAAQ,IAAIA,QAAQ,CAACJ,OAAO,CAACS,EAAT,CAApB,IAAoCL,QAAQ,CAACJ,OAAO,CAACS,EAAT,CAAR,KAAyB,SAFxE;AAGE,QAAA,QAAQ,EAAEJ,iBAAiB,IAAIF,QAHjC;AAIE,QAAA,KAAK,EAAEO,UAJT;AAKE,QAAA,EAAE,EAAEV,OAAO,CAACS,EALd;AAME,QAAA,QAAQ,EAAEV,QANZ;AAOE,QAAA,iBAAiB,EAAEM,iBAPrB;AAQE,QAAA,KAAK,EAAEO,KART;AASE,QAAA,eAAe,EAAEV,aAAa,GAAGU,KAAH,GAAW,EAT3C;AAUE,QAAA,qBAAqB,EAAE;AAVzB,QADF;AAcD;AACF,GA1BqC;AAAA,CAAvB,C","sourcesContent":["import React from 'react';\nimport Input from './components/input';\nimport { withMask } from './with-mask';\n\nexport default withMask('input', props => (node, data, onChange) => {\n  const dataset = node.data ? node.data.dataset || {} : {};\n  if (dataset.component === 'input') {\n    const { adjustedLimit, disabled, feedback, showCorrectAnswer, maxLength } = props;\n    // the first answer is the correct one\n    const correctAnswer = ((props.choices && dataset && props.choices[dataset.id]) || [])[0];\n    const finalValue = showCorrectAnswer\n      ? correctAnswer && correctAnswer.label\n      : data[dataset.id] || '';\n    const width = maxLength && maxLength[dataset.id];\n\n    return (\n      <Input\n        key={`${node.type}-input-${dataset.id}`}\n        correct={feedback && feedback[dataset.id] && feedback[dataset.id] === 'correct'}\n        disabled={showCorrectAnswer || disabled}\n        value={finalValue}\n        id={dataset.id}\n        onChange={onChange}\n        showCorrectAnswer={showCorrectAnswer}\n        width={width}\n        charactersLimit={adjustedLimit ? width : 25}\n        isConstructedResponse={true}\n      />\n    );\n  }\n});\n"],"file":"constructed-response.js"}
+{"version":3,"sources":["../src/constructed-response.jsx"],"names":["props","node","data","onChange","dataset","component","adjustedLimit","disabled","feedback","showCorrectAnswer","maxLength","spellCheck","correctAnswer","choices","id","finalValue","label","width","type"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;;;eAEe,wBAAS,OAAT,EAAkB,UAAAA,KAAK;AAAA,SAAI,UAACC,IAAD,EAAOC,IAAP,EAAaC,QAAb,EAA0B;AAClE,QAAMC,OAAO,GAAGH,IAAI,CAACC,IAAL,GAAYD,IAAI,CAACC,IAAL,CAAUE,OAAV,IAAqB,EAAjC,GAAsC,EAAtD;;AACA,QAAIA,OAAO,CAACC,SAAR,KAAsB,OAA1B,EAAmC;AACjC,UAAQC,aAAR,GAAwFN,KAAxF,CAAQM,aAAR;AAAA,UAAuBC,QAAvB,GAAwFP,KAAxF,CAAuBO,QAAvB;AAAA,UAAiCC,QAAjC,GAAwFR,KAAxF,CAAiCQ,QAAjC;AAAA,UAA2CC,iBAA3C,GAAwFT,KAAxF,CAA2CS,iBAA3C;AAAA,UAA8DC,SAA9D,GAAwFV,KAAxF,CAA8DU,SAA9D;AAAA,UAAyEC,UAAzE,GAAwFX,KAAxF,CAAyEW,UAAzE,CADiC,CAGjC;;AACA,UAAMC,aAAa,GAAG,CAAEZ,KAAK,CAACa,OAAN,IAAiBT,OAAjB,IAA4BJ,KAAK,CAACa,OAAN,CAAcT,OAAO,CAACU,EAAtB,CAA7B,IAA2D,EAA5D,EAAgE,CAAhE,CAAtB;AACA,UAAMC,UAAU,GAAGN,iBAAiB,GAChCG,aAAa,IAAIA,aAAa,CAACI,KADC,GAEhCd,IAAI,CAACE,OAAO,CAACU,EAAT,CAAJ,IAAoB,EAFxB;AAGA,UAAMG,KAAK,GAAGP,SAAS,IAAIA,SAAS,CAACN,OAAO,CAACU,EAAT,CAApC;AAEA,0BACE,gCAAC,iBAAD;AACE,QAAA,GAAG,YAAKb,IAAI,CAACiB,IAAV,oBAAwBd,OAAO,CAACU,EAAhC,CADL;AAEE,QAAA,OAAO,EAAEN,QAAQ,IAAIA,QAAQ,CAACJ,OAAO,CAACU,EAAT,CAApB,IAAoCN,QAAQ,CAACJ,OAAO,CAACU,EAAT,CAAR,KAAyB,SAFxE;AAGE,QAAA,QAAQ,EAAEL,iBAAiB,IAAIF,QAHjC;AAIE,QAAA,KAAK,EAAEQ,UAJT;AAKE,QAAA,EAAE,EAAEX,OAAO,CAACU,EALd;AAME,QAAA,QAAQ,EAAEX,QANZ;AAOE,QAAA,iBAAiB,EAAEM,iBAPrB;AAQE,QAAA,KAAK,EAAEQ,KART;AASE,QAAA,eAAe,EAAEX,aAAa,GAAGW,KAAH,GAAW,EAT3C;AAUE,QAAA,qBAAqB,EAAE,IAVzB;AAWE,QAAA,UAAU,EAAEN;AAXd,QADF;AAeD;AACF,GA5BqC;AAAA,CAAvB,C","sourcesContent":["import React from 'react';\nimport Input from './components/input';\nimport { withMask } from './with-mask';\n\nexport default withMask('input', props => (node, data, onChange) => {\n  const dataset = node.data ? node.data.dataset || {} : {};\n  if (dataset.component === 'input') {\n    const { adjustedLimit, disabled, feedback, showCorrectAnswer, maxLength, spellCheck } = props;\n\n    // the first answer is the correct one\n    const correctAnswer = ((props.choices && dataset && props.choices[dataset.id]) || [])[0];\n    const finalValue = showCorrectAnswer\n      ? correctAnswer && correctAnswer.label\n      : data[dataset.id] || '';\n    const width = maxLength && maxLength[dataset.id];\n\n    return (\n      <Input\n        key={`${node.type}-input-${dataset.id}`}\n        correct={feedback && feedback[dataset.id] && feedback[dataset.id] === 'correct'}\n        disabled={showCorrectAnswer || disabled}\n        value={finalValue}\n        id={dataset.id}\n        onChange={onChange}\n        showCorrectAnswer={showCorrectAnswer}\n        width={width}\n        charactersLimit={adjustedLimit ? width : 25}\n        isConstructedResponse={true}\n        spellCheck={spellCheck}\n      />\n    );\n  }\n});\n"],"file":"constructed-response.js"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pie-lib/mask-markup",
-  "version": "1.12.1",
+  "version": "1.12.4",
   "description": "",
   "main": "lib/index.js",
   "module": "src/index.js",
@@ -10,8 +10,8 @@
   "dependencies": {
     "@material-ui/core": "^3.9.3",
     "@pie-lib/drag": "^1.1.52",
-    "@pie-lib/math-rendering": "^2.3.13",
-    "@pie-lib/render-ui": "^4.12.5",
+    "@pie-lib/math-rendering": "^2.4.0",
+    "@pie-lib/render-ui": "^4.12.6",
     "classnames": "^2.2.6",
     "debug": "^4.1.1",
     "immutable": ">=3.8.1",
@@ -27,5 +27,5 @@
   "keywords": [],
   "author": "",
   "license": "ISC",
-  "gitHead": "aece71eebc3d81299789f41be579058ca796d106"
+  "gitHead": "15c7a1364de782a095f8387f6be54af23e45fa10"
 }

package/src/components/blank.jsx

@@ -20,6 +20,7 @@ const useStyles = withStyles(() => ({
     minWidth: '90px',
     fontSize: 'inherit',
     minHeight: '32px',
+    height: 'auto',
     maxWidth: '374px',
     position: 'relative'
   },

package/src/components/correct-input.jsx

@@ -57,6 +57,7 @@ export default withStyles(() => ({
     isBox,
     isConstructedResponse,
     width,
+    spellCheck,
     ...rest
   } = props;
   const label = typeof correct === 'boolean' ? (correct ? 'correct' : 'incorrect') : undefined;
@@ -85,6 +86,7 @@ export default withStyles(() => ({
       inputProps={inputProps}
       labelWidth={0}
       disabled={disabled}
+      spellCheck={spellCheck}
       {...rest}
     />
   );

package/src/components/input.jsx

@@ -11,6 +11,7 @@ const Input = ({
   value,
   onChange,
   showCorrectAnswer,
+  spellCheck,
   width
 }) => {
   return (
@@ -21,6 +22,7 @@ const Input = ({
       variant="outlined"
       value={value}
       isConstructedResponse={isConstructedResponse}
+      spellCheck={spellCheck}
       isBox={true}
       width={width}
       onChange={e => {
@@ -35,6 +37,7 @@ Input.propTypes = {
   value: PropTypes.string,
   onChange: PropTypes.func,
   disabled: PropTypes.bool,
+  spellCheck: PropTypes.bool,
   correct: PropTypes.bool,
   showCorrectAnswer: PropTypes.bool
 };

package/src/constructed-response.jsx

@@ -5,7 +5,8 @@ import { withMask } from './with-mask';
 export default withMask('input', props => (node, data, onChange) => {
   const dataset = node.data ? node.data.dataset || {} : {};
   if (dataset.component === 'input') {
-    const { adjustedLimit, disabled, feedback, showCorrectAnswer, maxLength } = props;
+    const { adjustedLimit, disabled, feedback, showCorrectAnswer, maxLength, spellCheck } = props;
+
     // the first answer is the correct one
     const correctAnswer = ((props.choices && dataset && props.choices[dataset.id]) || [])[0];
     const finalValue = showCorrectAnswer
@@ -25,6 +26,7 @@ export default withMask('input', props => (node, data, onChange) => {
         width={width}
         charactersLimit={adjustedLimit ? width : 25}
         isConstructedResponse={true}
+        spellCheck={spellCheck}
       />
     );
   }