@pie-element/explicit-constructed-response 10.0.0-beta.0 → 10.0.0-next.42

package/CHANGELOG.md

@@ -3,17 +3,6 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
-## [9.3.3](https://github.com/pie-framework/pie-elements/compare/@pie-element/explicit-constructed-response@9.3.2...@pie-element/explicit-constructed-response@9.3.3) (2025-11-27)
-
-
-### Bug Fixes
-
-* bump libs PD-5274, PD-5211, PD-5248 ([7610b25](https://github.com/pie-framework/pie-elements/commit/7610b25423956b6492f33322513b3430051fca77))
-
-
-
-
-
 ## [9.3.2](https://github.com/pie-framework/pie-elements/compare/@pie-element/explicit-constructed-response@9.3.1...@pie-element/explicit-constructed-response@9.3.2) (2025-10-22)
 
 

package/configure/CHANGELOG.md

@@ -3,17 +3,6 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
-## [8.3.3](https://github.com/pie-framework/pie-elements/compare/@pie-element/explicit-constructed-response-configure@8.3.2...@pie-element/explicit-constructed-response-configure@8.3.3) (2025-11-27)
-
-
-### Bug Fixes
-
-* bump libs PD-5274, PD-5211, PD-5248 ([7610b25](https://github.com/pie-framework/pie-elements/commit/7610b25423956b6492f33322513b3430051fca77))
-
-
-
-
-
 ## [8.3.2](https://github.com/pie-framework/pie-elements/compare/@pie-element/explicit-constructed-response-configure@8.3.1...@pie-element/explicit-constructed-response-configure@8.3.2) (2025-10-22)
 
 

package/configure/lib/alternateSection.js

@@ -19,7 +19,7 @@ var _Select = _interopRequireDefault(require("@mui/material/Select"));
 var _TextField = _interopRequireDefault(require("@mui/material/TextField"));
 var _styles = require("@mui/material/styles");
 var _max = _interopRequireDefault(require("lodash/max"));
-var _editableHtml = _interopRequireDefault(require("@pie-lib/editable-html"));
+var _editableHtmlTipTap = _interopRequireDefault(require("@pie-lib/editable-html-tip-tap"));
 var _markupUtils = require("./markupUtils");
 const DesignContainer = (0, _styles.styled)('div')(({
   theme
@@ -38,7 +38,7 @@ const AltChoices = (0, _styles.styled)('div')(({
     width: '100%'
   }
 }));
-const StyledEditableHtml = (0, _styles.styled)(_editableHtml.default)(({
+const StyledEditableHtml = (0, _styles.styled)(_editableHtmlTipTap.default)(({
   theme,
   hasError
 }) => ({
@@ -107,6 +107,11 @@ class Choice extends _react.default.Component {
       });
       this.updateText(strippedValue);
     });
+    (0, _defineProperty2.default)(this, "onKeyDown", event => {
+      if (event.key === 'Enter') {
+        return true;
+      }
+    });
   }
   UNSAFE_componentWillReceiveProps(nextProps) {
     if (nextProps.markup) {
@@ -133,6 +138,7 @@ class Choice extends _react.default.Component {
       hasError: !!error,
       disableUnderline: true,
       onChange: this.onChange,
+      onKeyDown: this.onKeyDown,
       markup: value || '',
       activePlugins: ['languageCharacters'],
       pluginProps: pluginProps,

package/configure/lib/alternateSection.js.map

@@ -1 +1 @@
-{"version":3,"file":"alternateSection.js","names":["_react","_interopRequireDefault","require","_propTypes","_debounce","_isEqual","_Button","_Delete","_IconButton","_MenuItem","_Select","_TextField","_styles","_max","_editableHtml","_markupUtils","DesignContainer","styled","theme","marginBottom","spacing","AltChoices","alignItems","flexDirection","display","paddingTop","width","StyledEditableHtml","EditableHtml","hasError","flex","marginRight","border","palette","error","main","borderRadius","StyledDeleteButton","IconButton","fill","grey","SelectContainer","justifyContent","RightContainer","LengthField","TextField","borderBottomColor","divider","text","primary","ErrorText","fontSize","typography","color","ChoiceWrapper","Choice","React","Component","constructor","args","_defineProperty2","default","value","props","markup","debounce","onChange","e","strippedValue","stripHtmlTags","setState","updateText","UNSAFE_componentWillReceiveProps","nextProps","render","state","onDelete","spellCheck","showMaxLength","pluginProps","inputProps","maxLength","createElement","Fragment","_extends2","disableUnderline","activePlugins","languageCharactersProps","language","autoWidthToolbar","toolbarOpts","minWidth","isHidden","characters","disabled","onClick","size","exports","PropTypes","string","func","isRequired","bool","object","AlternateSection","choices","isEqual","onSelect","selectChoices","target","find","c","length","label","max","map","parseInt","filter","id","isNaN","choice","index","choiceChanged","lengthChanged","labelLengthsArr","decodeHTML","newLength","Math","getAdjustedLength","choiceRemoved","event","numberValue","minLength","getChoicesMaxLength","updateChoicesIfNeeded","componentDidMount","errors","variant","displayEmpty","handleSelect","readOnly","MenuProps","transitionDuration","enter","exit","key","type","min","changeLength","onAddChoice","val","onChoiceChanged","onRemoveChoice","array","number","_default"],"sources":["../src/alternateSection.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport debounce from 'lodash/debounce';\nimport isEqual from 'lodash/isEqual';\nimport Button from '@mui/material/Button';\nimport Delete from '@mui/icons-material/Delete';\nimport IconButton from '@mui/material/IconButton';\nimport MenuItem from '@mui/material/MenuItem';\nimport Select from '@mui/material/Select';\nimport TextField from '@mui/material/TextField';\nimport { styled } from '@mui/material/styles';\nimport max from 'lodash/max';\nimport EditableHtml from '@pie-lib/editable-html';\nimport { stripHtmlTags, getAdjustedLength, decodeHTML } from './markupUtils';\n\nconst DesignContainer = styled('div')(({ theme }) => ({\n  marginBottom: theme.spacing(0.5),\n}));\n\nconst AltChoices = styled('div')(({ theme }) => ({\n  alignItems: 'flex-start',\n  flexDirection: 'column',\n  display: 'flex',\n  paddingTop: theme.spacing(2.5),\n  '& > *': {\n    marginBottom: theme.spacing(2.5),\n    width: '100%',\n  },\n}));\n\nconst StyledEditableHtml = styled(EditableHtml)(({ theme, hasError }) => ({\n  flex: '1',\n  marginRight: theme.spacing(2.5),\n  ...(hasError && {\n    border: `2px solid ${theme.palette.error.main}`,\n    borderRadius: '6px',\n  }),\n}));\n\nconst StyledDeleteButton = styled(IconButton)(({ theme }) => ({\n  '& svg': {\n    fill: theme.palette.grey[600],\n  },\n}));\n\nconst SelectContainer = styled('div')({\n  alignItems: 'flex-end',\n  display: 'flex',\n  justifyContent: 'space-between',\n  width: '100%',\n});\n\nconst RightContainer = styled('div')({\n  alignItems: 'center',\n  display: 'flex',\n});\n\nconst LengthField = styled(TextField)(({ theme }) => ({\n  width: '230px',\n  marginRight: theme.spacing(2.5),\n  '& .MuiInput-underline:before': {\n    borderBottomColor: theme.palette.divider,\n  },\n  '& .MuiInput-underline:hover:not(.Mui-disabled):before': {\n    borderBottomColor: theme.palette.text.primary,\n  },\n  '& .MuiInput-underline:after': {\n    borderBottomColor: theme.palette.primary.main,\n  },\n}));\n\nconst ErrorText = styled('div')(({ theme }) => ({\n  fontSize: theme.typography.fontSize - 2,\n  color: theme.palette.error.main,\n  paddingTop: theme.spacing(0.5),\n}));\n\nconst ChoiceWrapper = styled('div')({\n  alignItems: 'center',\n  display: 'flex',\n  justifyContent: 'space-between',\n});\n\nexport class Choice extends React.Component {\n  static propTypes = {\n    error: PropTypes.string,\n    markup: PropTypes.string,\n    onChange: PropTypes.func.isRequired,\n    onDelete: PropTypes.func.isRequired,\n    value: PropTypes.string,\n    spellCheck: PropTypes.bool,\n    showMaxLength: PropTypes.bool,\n    pluginProps: PropTypes.object,\n  };\n\n  state = {\n    value: this.props.markup,\n  };\n\n  updateText = debounce(this.props.onChange, 300);\n\n  UNSAFE_componentWillReceiveProps(nextProps) {\n    if (nextProps.markup) {\n      this.setState({ value: nextProps.markup });\n    }\n  }\n\n  onChange = (e) => {\n    const strippedValue = stripHtmlTags(e);\n    this.setState({ value: strippedValue });\n    this.updateText(strippedValue);\n  };\n\n  render() {\n    const { value } = this.state;\n    const { onDelete, spellCheck, error, showMaxLength, pluginProps } = this.props;\n    const inputProps = showMaxLength ? {} : { maxLength: 25 };\n\n    return (\n      <React.Fragment>\n        <ChoiceWrapper>\n          <StyledEditableHtml\n            hasError={!!error}\n            disableUnderline\n            onChange={this.onChange}\n            markup={value || ''}\n            activePlugins={['languageCharacters']}\n            pluginProps={pluginProps}\n            languageCharactersProps={[{ language: 'spanish' }]}\n            spellCheck={spellCheck}\n            autoWidthToolbar\n            toolbarOpts={{\n              minWidth: 'auto',\n              isHidden: !!pluginProps?.characters?.disabled,\n            }}\n            {...inputProps}\n          />\n          <StyledDeleteButton\n            aria-label=\"delete\"\n            onClick={onDelete}\n            size=\"large\">\n            <Delete />\n          </StyledDeleteButton>\n        </ChoiceWrapper>\n        {error && <ErrorText>{error}</ErrorText>}\n      </React.Fragment>\n    );\n  }\n}\n\nexport class AlternateSection extends React.Component {\n  static propTypes = {\n    choices: PropTypes.array,\n    selectChoices: PropTypes.array.isRequired,\n    errors: PropTypes.object,\n    onSelect: PropTypes.func.isRequired,\n    choiceChanged: PropTypes.func.isRequired,\n    lengthChanged: PropTypes.func,\n    choiceRemoved: PropTypes.func.isRequired,\n    value: PropTypes.string,\n    maxLength: PropTypes.number,\n    showMaxLength: PropTypes.bool,\n    spellCheck: PropTypes.bool,\n    pluginProps: PropTypes.object,\n  };\n\n  state = {};\n\n  UNSAFE_componentWillReceiveProps(nextProps) {\n    this.updateChoicesIfNeeded(nextProps);\n  }\n\n  componentDidMount() {\n    this.updateChoicesIfNeeded(this.props);\n  }\n\n  updateChoicesIfNeeded = (props) => {\n    if (\n      !this.state.choices ||\n      !isEqual(props.choices, this.state.choices) ||\n      !isEqual(props.choices, this.props.choices)\n    ) {\n      this.setState({\n        choices: props.choices,\n      });\n    }\n  };\n\n  handleSelect = (e) => {\n    const { onSelect, selectChoices } = this.props;\n    const { value } = e.target;\n\n    onSelect(selectChoices.find((c) => c.value === value));\n  };\n\n  onAddChoice = () => {\n    const { choices } = this.state;\n\n    if (choices.length && choices[choices.length - 1].label !== '') {\n      const value = max(choices.map((c) => parseInt(c.value)).filter((id) => !isNaN(id))) || 0;\n\n      this.setState({\n        choices: [\n          ...choices,\n          {\n            value: `${value + 1}`,\n            label: '',\n          },\n        ],\n      });\n    }\n  };\n\n  onChoiceChanged = (choice, value, index) => {\n    const { choiceChanged, lengthChanged, maxLength, choices } = this.props;\n\n    const labelLengthsArr = choices.map((choice) => decodeHTML(choice.label || '').length);\n    labelLengthsArr[index] =  decodeHTML(value).length;\n\n    const newLength = Math.max(...labelLengthsArr);\n\n    choiceChanged({\n      ...choice,\n      label: value,\n    });\n\n    if (newLength > maxLength || newLength + 10 <= maxLength) {\n      lengthChanged(getAdjustedLength(newLength));\n    }\n  };\n\n  onRemoveChoice = (choice) => {\n    const { choiceRemoved } = this.props;\n\n    choiceRemoved(choice.value);\n  };\n\n  getChoicesMaxLength = () => {\n    const { choices } = this.state;\n\n    if (!choices) {\n      return 1;\n    }\n\n    const labelLengthsArr = choices.map((choice) => decodeHTML(choice.label || '').length);\n\n    return Math.max(...labelLengthsArr);\n  };\n\n  changeLength = (event) => {\n    const { lengthChanged } = this.props;\n    const numberValue = parseInt(event.target.value, 10);\n    const minLength = this.getChoicesMaxLength();\n\n    if (numberValue && numberValue >= minLength && numberValue <= minLength + 10) {\n      lengthChanged(numberValue);\n    }\n  };\n\n  render() {\n    const { selectChoices, maxLength, showMaxLength, value, spellCheck, errors, pluginProps } = this.props;\n    const { choices } = this.state;\n    const minLength = this.getChoicesMaxLength();\n\n    return (\n      <DesignContainer>\n        <SelectContainer>\n          <Select\n            variant=\"standard\"\n            displayEmpty\n            onChange={this.handleSelect}\n            value={value || ''}\n            readOnly={showMaxLength}\n            MenuProps={{\n              transitionDuration: { enter: 225, exit: 195 }\n            }}\n          >\n            <MenuItem value=\"\">\n              <em>{value ? 'Remove selection' : 'Select a response'}</em>\n            </MenuItem>\n            {selectChoices.map((c, index) => (\n              <MenuItem key={index} value={c?.value}>\n                {decodeHTML(c?.label)}\n              </MenuItem>\n            ))}\n          </Select>\n\n          {choices && choices.length > 0 && (\n            <RightContainer>\n              {maxLength && showMaxLength && (\n                <LengthField\n                  variant=\"standard\"\n                  label=\"Maximum length (characters)\"\n                  type=\"number\"\n                  inputProps={{\n                    min: minLength,\n                    max: minLength + 10,\n                  }}\n                  value={maxLength}\n                  onChange={this.changeLength}\n                />\n              )}\n              <Button variant=\"contained\" color=\"primary\" onClick={this.onAddChoice}>\n                Add\n              </Button>\n            </RightContainer>\n          )}\n        </SelectContainer>\n        {errors && errors[0] && <ErrorText>{errors[0]}</ErrorText>}\n\n        <AltChoices>\n          {choices &&\n            choices.map(\n              (c, index) =>\n                index > 0 && (\n                  <Choice\n                    key={index}\n                    markup={c.label}\n                    onChange={(val) => this.onChoiceChanged(c, val, index)}\n                    onDelete={() => this.onRemoveChoice(c)}\n                    spellCheck={spellCheck}\n                    error={errors && errors[index]}\n                    showMaxLength={showMaxLength}\n                    pluginProps={pluginProps}\n                  />\n                ),\n            )}\n        </AltChoices>\n      </DesignContainer>\n    );\n  }\n}\n\nexport default AlternateSection;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"alternateSection.js","names":["_react","_interopRequireDefault","require","_propTypes","_debounce","_isEqual","_Button","_Delete","_IconButton","_MenuItem","_Select","_TextField","_styles","_max","_editableHtmlTipTap","_markupUtils","DesignContainer","styled","theme","marginBottom","spacing","AltChoices","alignItems","flexDirection","display","paddingTop","width","StyledEditableHtml","EditableHtml","hasError","flex","marginRight","border","palette","error","main","borderRadius","StyledDeleteButton","IconButton","fill","grey","SelectContainer","justifyContent","RightContainer","LengthField","TextField","borderBottomColor","divider","text","primary","ErrorText","fontSize","typography","color","ChoiceWrapper","Choice","React","Component","constructor","args","_defineProperty2","default","value","props","markup","debounce","onChange","e","strippedValue","stripHtmlTags","setState","updateText","event","key","UNSAFE_componentWillReceiveProps","nextProps","render","state","onDelete","spellCheck","showMaxLength","pluginProps","inputProps","maxLength","createElement","Fragment","_extends2","disableUnderline","onKeyDown","activePlugins","languageCharactersProps","language","autoWidthToolbar","toolbarOpts","minWidth","isHidden","characters","disabled","onClick","size","exports","PropTypes","string","func","isRequired","bool","object","AlternateSection","choices","isEqual","onSelect","selectChoices","target","find","c","length","label","max","map","parseInt","filter","id","isNaN","choice","index","choiceChanged","lengthChanged","labelLengthsArr","decodeHTML","newLength","Math","getAdjustedLength","choiceRemoved","numberValue","minLength","getChoicesMaxLength","updateChoicesIfNeeded","componentDidMount","errors","variant","displayEmpty","handleSelect","readOnly","MenuProps","transitionDuration","enter","exit","type","min","changeLength","onAddChoice","val","onChoiceChanged","onRemoveChoice","array","number","_default"],"sources":["../src/alternateSection.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport debounce from 'lodash/debounce';\nimport isEqual from 'lodash/isEqual';\nimport Button from '@mui/material/Button';\nimport Delete from '@mui/icons-material/Delete';\nimport IconButton from '@mui/material/IconButton';\nimport MenuItem from '@mui/material/MenuItem';\nimport Select from '@mui/material/Select';\nimport TextField from '@mui/material/TextField';\nimport { styled } from '@mui/material/styles';\nimport max from 'lodash/max';\nimport EditableHtml from '@pie-lib/editable-html-tip-tap';\nimport { stripHtmlTags, getAdjustedLength, decodeHTML } from './markupUtils';\n\nconst DesignContainer = styled('div')(({ theme }) => ({\n  marginBottom: theme.spacing(0.5),\n}));\n\nconst AltChoices = styled('div')(({ theme }) => ({\n  alignItems: 'flex-start',\n  flexDirection: 'column',\n  display: 'flex',\n  paddingTop: theme.spacing(2.5),\n  '& > *': {\n    marginBottom: theme.spacing(2.5),\n    width: '100%',\n  },\n}));\n\nconst StyledEditableHtml = styled(EditableHtml)(({ theme, hasError }) => ({\n  flex: '1',\n  marginRight: theme.spacing(2.5),\n  ...(hasError && {\n    border: `2px solid ${theme.palette.error.main}`,\n    borderRadius: '6px',\n  }),\n}));\n\nconst StyledDeleteButton = styled(IconButton)(({ theme }) => ({\n  '& svg': {\n    fill: theme.palette.grey[600],\n  },\n}));\n\nconst SelectContainer = styled('div')({\n  alignItems: 'flex-end',\n  display: 'flex',\n  justifyContent: 'space-between',\n  width: '100%',\n});\n\nconst RightContainer = styled('div')({\n  alignItems: 'center',\n  display: 'flex',\n});\n\nconst LengthField = styled(TextField)(({ theme }) => ({\n  width: '230px',\n  marginRight: theme.spacing(2.5),\n  '& .MuiInput-underline:before': {\n    borderBottomColor: theme.palette.divider,\n  },\n  '& .MuiInput-underline:hover:not(.Mui-disabled):before': {\n    borderBottomColor: theme.palette.text.primary,\n  },\n  '& .MuiInput-underline:after': {\n    borderBottomColor: theme.palette.primary.main,\n  },\n}));\n\nconst ErrorText = styled('div')(({ theme }) => ({\n  fontSize: theme.typography.fontSize - 2,\n  color: theme.palette.error.main,\n  paddingTop: theme.spacing(0.5),\n}));\n\nconst ChoiceWrapper = styled('div')({\n  alignItems: 'center',\n  display: 'flex',\n  justifyContent: 'space-between',\n});\n\nexport class Choice extends React.Component {\n  static propTypes = {\n    error: PropTypes.string,\n    markup: PropTypes.string,\n    onChange: PropTypes.func.isRequired,\n    onDelete: PropTypes.func.isRequired,\n    value: PropTypes.string,\n    spellCheck: PropTypes.bool,\n    showMaxLength: PropTypes.bool,\n    pluginProps: PropTypes.object,\n  };\n\n  state = {\n    value: this.props.markup,\n  };\n\n  updateText = debounce(this.props.onChange, 300);\n\n  UNSAFE_componentWillReceiveProps(nextProps) {\n    if (nextProps.markup) {\n      this.setState({ value: nextProps.markup });\n    }\n  }\n\n  onChange = (e) => {\n    const strippedValue = stripHtmlTags(e);\n    this.setState({ value: strippedValue });\n    this.updateText(strippedValue);\n  };\n\n  onKeyDown = (event) => {\n    if (event.key === 'Enter') {\n      return true;\n    }\n  };\n\n  render() {\n    const { value } = this.state;\n    const { onDelete, spellCheck, error, showMaxLength, pluginProps } = this.props;\n    const inputProps = showMaxLength ? {} : { maxLength: 25 };\n\n    return (\n      <React.Fragment>\n        <ChoiceWrapper>\n          <StyledEditableHtml\n            hasError={!!error}\n            disableUnderline\n            onChange={this.onChange}\n            onKeyDown={this.onKeyDown}\n            markup={value || ''}\n            activePlugins={['languageCharacters']}\n            pluginProps={pluginProps}\n            languageCharactersProps={[{ language: 'spanish' }]}\n            spellCheck={spellCheck}\n            autoWidthToolbar\n            toolbarOpts={{\n              minWidth: 'auto',\n              isHidden: !!pluginProps?.characters?.disabled,\n            }}\n            {...inputProps}\n          />\n          <StyledDeleteButton\n            aria-label=\"delete\"\n            onClick={onDelete}\n            size=\"large\">\n            <Delete />\n          </StyledDeleteButton>\n        </ChoiceWrapper>\n        {error && <ErrorText>{error}</ErrorText>}\n      </React.Fragment>\n    );\n  }\n}\n\nexport class AlternateSection extends React.Component {\n  static propTypes = {\n    choices: PropTypes.array,\n    selectChoices: PropTypes.array.isRequired,\n    errors: PropTypes.object,\n    onSelect: PropTypes.func.isRequired,\n    choiceChanged: PropTypes.func.isRequired,\n    lengthChanged: PropTypes.func,\n    choiceRemoved: PropTypes.func.isRequired,\n    value: PropTypes.string,\n    maxLength: PropTypes.number,\n    showMaxLength: PropTypes.bool,\n    spellCheck: PropTypes.bool,\n    pluginProps: PropTypes.object,\n  };\n\n  state = {};\n\n  UNSAFE_componentWillReceiveProps(nextProps) {\n    this.updateChoicesIfNeeded(nextProps);\n  }\n\n  componentDidMount() {\n    this.updateChoicesIfNeeded(this.props);\n  }\n\n  updateChoicesIfNeeded = (props) => {\n    if (\n      !this.state.choices ||\n      !isEqual(props.choices, this.state.choices) ||\n      !isEqual(props.choices, this.props.choices)\n    ) {\n      this.setState({\n        choices: props.choices,\n      });\n    }\n  };\n\n  handleSelect = (e) => {\n    const { onSelect, selectChoices } = this.props;\n    const { value } = e.target;\n\n    onSelect(selectChoices.find((c) => c.value === value));\n  };\n\n  onAddChoice = () => {\n    const { choices } = this.state;\n\n    if (choices.length && choices[choices.length - 1].label !== '') {\n      const value = max(choices.map((c) => parseInt(c.value)).filter((id) => !isNaN(id))) || 0;\n\n      this.setState({\n        choices: [\n          ...choices,\n          {\n            value: `${value + 1}`,\n            label: '',\n          },\n        ],\n      });\n    }\n  };\n\n  onChoiceChanged = (choice, value, index) => {\n    const { choiceChanged, lengthChanged, maxLength, choices } = this.props;\n\n    const labelLengthsArr = choices.map((choice) => decodeHTML(choice.label || '').length);\n    labelLengthsArr[index] =  decodeHTML(value).length;\n\n    const newLength = Math.max(...labelLengthsArr);\n\n    choiceChanged({\n      ...choice,\n      label: value,\n    });\n\n    if (newLength > maxLength || newLength + 10 <= maxLength) {\n      lengthChanged(getAdjustedLength(newLength));\n    }\n  };\n\n  onRemoveChoice = (choice) => {\n    const { choiceRemoved } = this.props;\n\n    choiceRemoved(choice.value);\n  };\n\n  getChoicesMaxLength = () => {\n    const { choices } = this.state;\n\n    if (!choices) {\n      return 1;\n    }\n\n    const labelLengthsArr = choices.map((choice) => decodeHTML(choice.label || '').length);\n\n    return Math.max(...labelLengthsArr);\n  };\n\n  changeLength = (event) => {\n    const { lengthChanged } = this.props;\n    const numberValue = parseInt(event.target.value, 10);\n    const minLength = this.getChoicesMaxLength();\n\n    if (numberValue && numberValue >= minLength && numberValue <= minLength + 10) {\n      lengthChanged(numberValue);\n    }\n  };\n\n  render() {\n    const { selectChoices, maxLength, showMaxLength, value, spellCheck, errors, pluginProps } = this.props;\n    const { choices } = this.state;\n    const minLength = this.getChoicesMaxLength();\n\n    return (\n      <DesignContainer>\n        <SelectContainer>\n          <Select\n            variant=\"standard\"\n            displayEmpty\n            onChange={this.handleSelect}\n            value={value || ''}\n            readOnly={showMaxLength}\n            MenuProps={{\n              transitionDuration: { enter: 225, exit: 195 }\n            }}\n          >\n            <MenuItem value=\"\">\n              <em>{value ? 'Remove selection' : 'Select a response'}</em>\n            </MenuItem>\n            {selectChoices.map((c, index) => (\n              <MenuItem key={index} value={c?.value}>\n                {decodeHTML(c?.label)}\n              </MenuItem>\n            ))}\n          </Select>\n\n          {choices && choices.length > 0 && (\n            <RightContainer>\n              {maxLength && showMaxLength && (\n                <LengthField\n                  variant=\"standard\"\n                  label=\"Maximum length (characters)\"\n                  type=\"number\"\n                  inputProps={{\n                    min: minLength,\n                    max: minLength + 10,\n                  }}\n                  value={maxLength}\n                  onChange={this.changeLength}\n                />\n              )}\n              <Button variant=\"contained\" color=\"primary\" onClick={this.onAddChoice}>\n                Add\n              </Button>\n            </RightContainer>\n          )}\n        </SelectContainer>\n        {errors && errors[0] && <ErrorText>{errors[0]}</ErrorText>}\n\n        <AltChoices>\n          {choices &&\n            choices.map(\n              (c, index) =>\n                index > 0 && (\n                  <Choice\n                    key={index}\n                    markup={c.label}\n                    onChange={(val) => this.onChoiceChanged(c, val, index)}\n                    onDelete={() => this.onRemoveChoice(c)}\n                    spellCheck={spellCheck}\n                    error={errors && errors[index]}\n                    showMaxLength={showMaxLength}\n                    pluginProps={pluginProps}\n                  />\n                ),\n            )}\n        </AltChoices>\n      </DesignContainer>\n    );\n  }\n}\n\nexport default AlternateSection;\n"],"mappings":"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","ignoreList":[]}

package/configure/lib/ecr-toolbar.js

@@ -10,12 +10,12 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 var _react = _interopRequireDefault(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _styles = require("@mui/material/styles");
-var _editableHtml = _interopRequireDefault(require("@pie-lib/editable-html"));
+var _editableHtmlTipTap = _interopRequireDefault(require("@pie-lib/editable-html-tip-tap"));
 var _markupUtils = require("./markupUtils");
 const findSlateNode = key => {
   return window.document.querySelector('[data-key="' + key + '"]');
 };
-const StyledEditableHtml = (0, _styles.styled)(_editableHtml.default)(({
+const StyledEditableHtml = (0, _styles.styled)(_editableHtmlTipTap.default)(({
   theme
 }) => ({
   backgroundColor: theme.palette.common.white,
@@ -32,7 +32,7 @@ class ECRToolbar extends _react.default.Component {
     (0, _defineProperty2.default)(this, "onDone", markup => {
       const {
         node,
-        value,
+        editor,
         onToolbarDone,
         onChangeResponse
       } = this.props;
@@ -40,16 +40,10 @@ class ECRToolbar extends _react.default.Component {
       this.setState({
         markup: sanitizedMarkup
       });
-      const updatedData = {
-        ...node.data.toJSON(),
+      editor.commands.updateAttributes('explicit_constructed_response', {
         value: sanitizedMarkup
-      };
-      const change = value.change().setNodeByKey(node.key, {
-        data: updatedData
       });
-      const nextText = value.document.getNextText(node.key);
-      change.moveFocusTo(nextText.key, 0).moveAnchorTo(nextText.key, 0);
-      onToolbarDone(change, true);
+      onToolbarDone(true);
       onChangeResponse(sanitizedMarkup);
     });
     (0, _defineProperty2.default)(this, "onRespAreaChange", respAreaMarkup => {
@@ -59,7 +53,7 @@ class ECRToolbar extends _react.default.Component {
     });
     (0, _defineProperty2.default)(this, "onKeyDown", event => {
       if (event.key === 'Enter') {
-        return false;
+        return true;
       }
     });
     (0, _defineProperty2.default)(this, "onBlur", () => {
@@ -71,14 +65,15 @@ class ECRToolbar extends _react.default.Component {
   componentDidMount() {
     const {
       correctChoice,
-      node
+      node,
+      editor
     } = this.props;
     const choice = correctChoice || {};
-    const domNode = findSlateNode(node.key);
-    if (domNode) {
+    const domNode = editor.view.nodeDOM(editor.state.selection.from);
+    if (domNode?.nodeType === 1) {
       //eslint-disable-next-line
       const domNodeRect = domNode.getBoundingClientRect();
-      const editor = domNode.closest('[data-slate-editor]');
+      const editor = domNode.closest('.tiptap');
       const editorRect = editor.getBoundingClientRect();
       const top = domNodeRect.top - editorRect.top;
       const left = domNodeRect.left - editorRect.left;
@@ -86,8 +81,10 @@ class ECRToolbar extends _react.default.Component {
         markup: choice.label,
         toolbarStyle: {
           position: 'absolute',
-          top: `${top + domNodeRect.height + 17}px`,
-          left: `${left + 20}px`,
+          // top: `${top + domNodeRect.height + 17}px`,
+          top: 0,
+          // left: `${left + 20}px`,
+          left: 0,
           width: `${domNodeRect.width - 4}px`
         }
       });
@@ -158,6 +155,7 @@ exports.ECRToolbar = ECRToolbar;
       getNextText: _propTypes.default.func.isRequired
     })
   }),
+  editor: _propTypes.default.object,
   maxLengthPerChoiceEnabled: _propTypes.default.bool,
   pluginProps: _propTypes.default.object,
   spellCheck: _propTypes.default.bool

package/configure/lib/ecr-toolbar.js.map

@@ -1 +1 @@
-{"version":3,"file":"ecr-toolbar.js","names":["_react","_interopRequireDefault","require","_propTypes","_styles","_editableHtml","_markupUtils","findSlateNode","key","window","document","querySelector","StyledEditableHtml","styled","EditableHtml","theme","backgroundColor","palette","common","white","outline","lineHeight","ECRToolbar","React","Component","constructor","args","_defineProperty2","default","markup","toolbarStyle","node","value","onToolbarDone","onChangeResponse","props","sanitizedMarkup","stripHtmlTags","setState","updatedData","data","toJSON","change","setNodeByKey","nextText","getNextText","moveFocusTo","moveAnchorTo","respAreaMarkup","event","clickedInside","componentDidMount","correctChoice","choice","domNode","domNodeRect","getBoundingClientRect","editor","closest","editorRect","top","left","label","position","height","width","render","maxLengthPerChoiceEnabled","pluginProps","spellCheck","state","inputProps","maxLength","createElement","style","_extends2","autoFocus","disableUnderline","onChange","preventDone","onRespAreaChange","onDone","val","onBlur","e","relatedTarget","onKeyDown","activePlugins","languageCharactersProps","language","minHeight","maxHeight","autoWidthToolbar","toolbarOpts","minWidth","isHidden","characters","disabled","exports","PropTypes","object","func","isRequired","shape","bool","_default"],"sources":["../src/ecr-toolbar.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { styled } from '@mui/material/styles';\nimport EditableHtml from '@pie-lib/editable-html';\nimport { stripHtmlTags } from './markupUtils';\n\nconst findSlateNode = (key) => {\n  return window.document.querySelector('[data-key=\"' + key + '\"]');\n};\n\nconst StyledEditableHtml = styled(EditableHtml)(({ theme }) => ({\n  backgroundColor: theme.palette.common.white,\n  outline: 'none',\n  lineHeight: '15px',\n}));\n\nexport class ECRToolbar extends React.Component {\n  static propTypes = {\n    correctChoice: PropTypes.object,\n    node: PropTypes.object,\n    onDone: PropTypes.func,\n    onChangeResponse: PropTypes.func.isRequired,\n    onToolbarDone: PropTypes.func.isRequired,\n    value: PropTypes.shape({\n      change: PropTypes.func.isRequired,\n      document: PropTypes.shape({\n        getNextText: PropTypes.func.isRequired,\n      }),\n    }),\n    maxLengthPerChoiceEnabled: PropTypes.bool,\n    pluginProps: PropTypes.object,\n    spellCheck: PropTypes.bool,\n  };\n\n  state = {\n    markup: '',\n    toolbarStyle: {},\n  };\n\n  componentDidMount() {\n    const { correctChoice, node } = this.props;\n    const choice = correctChoice || {};\n\n    const domNode = findSlateNode(node.key);\n\n    if (domNode) {\n      //eslint-disable-next-line\n      const domNodeRect = domNode.getBoundingClientRect();\n      const editor = domNode.closest('[data-slate-editor]');\n      const editorRect = editor.getBoundingClientRect();\n      const top = domNodeRect.top - editorRect.top;\n      const left = domNodeRect.left - editorRect.left;\n\n      this.setState({\n        markup: choice.label,\n        toolbarStyle: {\n          position: 'absolute',\n          top: `${top + domNodeRect.height + 17}px`,\n          left: `${left + 20}px`,\n          width: `${domNodeRect.width - 4}px`,\n        },\n      });\n    }\n  }\n\n  onDone = (markup) => {\n    const { node, value, onToolbarDone, onChangeResponse } = this.props;\n    const sanitizedMarkup = stripHtmlTags(markup);\n    this.setState({ markup: sanitizedMarkup });\n\n    const updatedData = { ...node.data.toJSON(), value: sanitizedMarkup };\n    const change = value.change().setNodeByKey(node.key, { data: updatedData });\n    const nextText = value.document.getNextText(node.key);\n\n    change.moveFocusTo(nextText.key, 0).moveAnchorTo(nextText.key, 0);\n    onToolbarDone(change, true);\n    onChangeResponse(sanitizedMarkup);\n  };\n\n  onRespAreaChange = (respAreaMarkup) => {\n    this.setState({ respAreaMarkup });\n  };\n\n  onKeyDown = (event) => {\n    if (event.key === 'Enter') {\n      return false;\n    }\n  };\n\n  onBlur = () => {\n    if (this.clickedInside) {\n      this.clickedInside = false;\n    }\n  };\n\n  render() {\n    const { maxLengthPerChoiceEnabled, pluginProps, spellCheck } = this.props;\n    const { markup, toolbarStyle } = this.state;\n    const inputProps = maxLengthPerChoiceEnabled ? {} : { maxLength: 25 };\n\n    return (\n      <div style={toolbarStyle}>\n        <StyledEditableHtml\n          autoFocus={true}\n          disableUnderline\n          onChange={(respAreaMarkup) => {\n            if (this.preventDone) {\n              return;\n            }\n            this.onRespAreaChange(respAreaMarkup);\n          }}\n          onDone={(val) => {\n            if (this.preventDone) {\n              return;\n            }\n            this.onDone(val);\n          }}\n          onBlur={(e) => {\n            this.preventDone = e.relatedTarget && e.relatedTarget.closest('.insert-character-dialog');\n            this.onBlur(e);\n          }}\n          onKeyDown={this.onKeyDown}\n          markup={markup || ''}\n          activePlugins={['languageCharacters']}\n          pluginProps={pluginProps}\n          languageCharactersProps={[{ language: 'spanish' }]}\n          minHeight={'15px'}\n          maxHeight={'15px'}\n          spellCheck={spellCheck}\n          autoWidthToolbar\n          toolbarOpts={{\n            minWidth: 'auto',\n            isHidden: !!pluginProps?.characters?.disabled,\n          }}\n          {...inputProps}\n        />\n      </div>\n    );\n  }\n}\n\nexport default ECRToolbar;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"ecr-toolbar.js","names":["_react","_interopRequireDefault","require","_propTypes","_styles","_editableHtmlTipTap","_markupUtils","findSlateNode","key","window","document","querySelector","StyledEditableHtml","styled","EditableHtml","theme","backgroundColor","palette","common","white","outline","lineHeight","ECRToolbar","React","Component","constructor","args","_defineProperty2","default","markup","toolbarStyle","node","editor","onToolbarDone","onChangeResponse","props","sanitizedMarkup","stripHtmlTags","setState","commands","updateAttributes","value","respAreaMarkup","event","clickedInside","componentDidMount","correctChoice","choice","domNode","view","nodeDOM","state","selection","from","nodeType","domNodeRect","getBoundingClientRect","closest","editorRect","top","left","label","position","width","render","maxLengthPerChoiceEnabled","pluginProps","spellCheck","inputProps","maxLength","createElement","style","_extends2","autoFocus","disableUnderline","onChange","preventDone","onRespAreaChange","onDone","val","onBlur","e","relatedTarget","onKeyDown","activePlugins","languageCharactersProps","language","minHeight","maxHeight","autoWidthToolbar","toolbarOpts","minWidth","isHidden","characters","disabled","exports","PropTypes","object","func","isRequired","shape","change","getNextText","bool","_default"],"sources":["../src/ecr-toolbar.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { styled } from '@mui/material/styles';\nimport EditableHtml from '@pie-lib/editable-html-tip-tap';\nimport { stripHtmlTags } from './markupUtils';\n\nconst findSlateNode = (key) => {\n  return window.document.querySelector('[data-key=\"' + key + '\"]');\n};\n\nconst StyledEditableHtml = styled(EditableHtml)(({ theme }) => ({\n  backgroundColor: theme.palette.common.white,\n  outline: 'none',\n  lineHeight: '15px',\n}));\n\nexport class ECRToolbar extends React.Component {\n  static propTypes = {\n    correctChoice: PropTypes.object,\n    node: PropTypes.object,\n    onDone: PropTypes.func,\n    onChangeResponse: PropTypes.func.isRequired,\n    onToolbarDone: PropTypes.func.isRequired,\n    value: PropTypes.shape({\n      change: PropTypes.func.isRequired,\n      document: PropTypes.shape({\n        getNextText: PropTypes.func.isRequired,\n      }),\n    }),\n    editor: PropTypes.object,\n    maxLengthPerChoiceEnabled: PropTypes.bool,\n    pluginProps: PropTypes.object,\n    spellCheck: PropTypes.bool,\n  };\n\n  state = {\n    markup: '',\n    toolbarStyle: {},\n  };\n\n  componentDidMount() {\n    const { correctChoice, node, editor } = this.props;\n    const choice = correctChoice || {};\n\n    const domNode = editor.view.nodeDOM(editor.state.selection.from);\n\n    if (domNode?.nodeType === 1) {\n      //eslint-disable-next-line\n      const domNodeRect = domNode.getBoundingClientRect();\n      const editor = domNode.closest('.tiptap');\n      const editorRect = editor.getBoundingClientRect();\n      const top = domNodeRect.top - editorRect.top;\n      const left = domNodeRect.left - editorRect.left;\n\n      this.setState({\n        markup: choice.label,\n        toolbarStyle: {\n          position: 'absolute',\n          // top: `${top + domNodeRect.height + 17}px`,\n          top: 0,\n          // left: `${left + 20}px`,\n          left: 0,\n          width: `${domNodeRect.width - 4}px`,\n        },\n      });\n    }\n  }\n\n  onDone = (markup) => {\n    const { node, editor, onToolbarDone, onChangeResponse } = this.props;\n    const sanitizedMarkup = stripHtmlTags(markup);\n    this.setState({ markup: sanitizedMarkup });\n\n    editor.commands.updateAttributes('explicit_constructed_response', { value: sanitizedMarkup });\n\n    onToolbarDone(true);\n    onChangeResponse(sanitizedMarkup);\n  };\n\n  onRespAreaChange = (respAreaMarkup) => {\n    this.setState({ respAreaMarkup });\n  };\n\n  onKeyDown = (event) => {\n    if (event.key === 'Enter') {\n      return true;\n    }\n  };\n\n  onBlur = () => {\n    if (this.clickedInside) {\n      this.clickedInside = false;\n    }\n  };\n\n  render() {\n    const { maxLengthPerChoiceEnabled, pluginProps, spellCheck } = this.props;\n    const { markup, toolbarStyle } = this.state;\n    const inputProps = maxLengthPerChoiceEnabled ? {} : { maxLength: 25 };\n\n    return (\n      <div style={toolbarStyle}>\n        <StyledEditableHtml\n          autoFocus={true}\n          disableUnderline\n          onChange={(respAreaMarkup) => {\n            if (this.preventDone) {\n              return;\n            }\n            this.onRespAreaChange(respAreaMarkup);\n          }}\n          onDone={(val) => {\n            if (this.preventDone) {\n              return;\n            }\n            this.onDone(val);\n          }}\n          onBlur={(e) => {\n            this.preventDone = e.relatedTarget && e.relatedTarget.closest('.insert-character-dialog');\n            this.onBlur(e);\n          }}\n          onKeyDown={this.onKeyDown}\n          markup={markup || ''}\n          activePlugins={['languageCharacters']}\n          pluginProps={pluginProps}\n          languageCharactersProps={[{ language: 'spanish' }]}\n          minHeight={'15px'}\n          maxHeight={'15px'}\n          spellCheck={spellCheck}\n          autoWidthToolbar\n          toolbarOpts={{\n            minWidth: 'auto',\n            isHidden: !!pluginProps?.characters?.disabled,\n          }}\n          {...inputProps}\n        />\n      </div>\n    );\n  }\n}\n\nexport default ECRToolbar;\n"],"mappings":"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","ignoreList":[]}

package/configure/lib/main.js

@@ -12,7 +12,7 @@ var _cloneDeep = _interopRequireDefault(require("lodash/cloneDeep"));
 var _isEmpty = _interopRequireDefault(require("lodash/isEmpty"));
 var _pick = _interopRequireDefault(require("lodash/pick"));
 var _throttle = _interopRequireDefault(require("lodash/throttle"));
-var _editableHtml = _interopRequireWildcard(require("@pie-lib/editable-html"));
+var _editableHtmlTipTap = _interopRequireWildcard(require("@pie-lib/editable-html-tip-tap"));
 var _configUi = require("@pie-lib/config-ui");
 var _styles = require("@mui/material/styles");
 var _Typography = _interopRequireDefault(require("@mui/material/Typography"));
@@ -36,7 +36,7 @@ const PromptHolder = (0, _styles.styled)(_configUi.InputContainer)(({
   marginTop: theme.spacing(2),
   marginBottom: theme.spacing(2)
 }));
-const MarkupContainer = (0, _styles.styled)(_editableHtml.default)(({
+const MarkupContainer = (0, _styles.styled)(_editableHtmlTipTap.default)(({
   theme
 }) => ({
   minHeight: '100px',
@@ -149,7 +149,7 @@ class Main extends _react.default.Component {
         maxLengthPerChoice
       } = model;
       const newValLength = (0, _markupUtils.decodeHTML)(newVal || '').length;
-      if (!choices[index]) {
+      if (!choices[index] || !choices[index].length) {
         choices[index] = [{
           label: newVal || '',
           value: '0'
@@ -221,7 +221,7 @@ class Main extends _react.default.Component {
       const newChoices = choices ? (0, _cloneDeep.default)(choices) : {};
       const newCachedChoices = cachedChoices ? (0, _cloneDeep.default)(cachedChoices) : {};
       nodes.forEach(node => {
-        const keyForNode = node.data.get('index');
+        const keyForNode = node.index;
         if (!newChoices[keyForNode] && newCachedChoices[keyForNode]) {
           Object.assign(newChoices, (0, _pick.default)(newCachedChoices, keyForNode));
           if (Object.prototype.hasOwnProperty.call(newCachedChoices, keyForNode)) {
@@ -363,7 +363,7 @@ class Main extends _react.default.Component {
       })
     }, teacherInstructionsEnabled && /*#__PURE__*/_react.default.createElement(PromptHolder, {
       label: teacherInstructions.label
-    }, /*#__PURE__*/_react.default.createElement(_editableHtml.default, {
+    }, /*#__PURE__*/_react.default.createElement(_editableHtmlTipTap.default, {
       className: "prompt",
       markup: model.teacherInstructions || '',
       onChange: this.onTeacherInstructionsChanged,
@@ -385,7 +385,7 @@ class Main extends _react.default.Component {
       autoWidthToolbar: true
     }), teacherInstructionsError && /*#__PURE__*/_react.default.createElement(ErrorText, null, teacherInstructionsError)), promptEnabled && /*#__PURE__*/_react.default.createElement(PromptHolder, {
       label: prompt.label
-    }, /*#__PURE__*/_react.default.createElement(_editableHtml.default, {
+    }, /*#__PURE__*/_react.default.createElement(_editableHtmlTipTap.default, {
       className: "prompt",
       markup: model.prompt,
       onChange: this.onPromptChanged,
@@ -420,7 +420,7 @@ class Main extends _react.default.Component {
         marginLeft: '8px'
       }
     }))), /*#__PURE__*/_react.default.createElement(MarkupContainer, {
-      activePlugins: _editableHtml.ALL_PLUGINS,
+      activePlugins: _editableHtmlTipTap.ALL_PLUGINS,
       toolbarOpts: {
         position: 'top'
       },
@@ -432,15 +432,15 @@ class Main extends _react.default.Component {
           duplicates: true
         },
         maxResponseAreas: maxResponseAreas,
-        respAreaToolbar: (node, value, onToolbarDone) => {
+        respAreaToolbar: (node, editor, onToolbarDone) => {
           const {
             model
           } = this.props;
-          const correctChoice = (model.choices[node.data.get('index')] || [])[0];
+          const correctChoice = (model.choices[node.attrs.index] || [])[0];
           return () => /*#__PURE__*/_react.default.createElement(_ecrToolbar.default, {
-            onChangeResponse: newVal => this.onChangeResponse(node.data.get('index'), newVal),
+            onChangeResponse: newVal => this.onChangeResponse(node.attrs.index, newVal),
             node: node,
-            value: value,
+            editor: editor,
             onToolbarDone: onToolbarDone,
             correctChoice: correctChoice,
             maxLengthPerChoiceEnabled: maxLengthPerChoiceEnabled,
@@ -476,7 +476,7 @@ class Main extends _react.default.Component {
       pluginProps: getPluginProps(responseAreaInputConfiguration?.inputConfiguration)
     }), rationaleEnabled && /*#__PURE__*/_react.default.createElement(PromptHolder, {
       label: rationale.label
-    }, /*#__PURE__*/_react.default.createElement(_editableHtml.default, {
+    }, /*#__PURE__*/_react.default.createElement(_editableHtmlTipTap.default, {
       className: "prompt",
       markup: model.rationale || '',
       onChange: this.onRationaleChanged,