@pie-element/image-cloze-association 9.1.2-next.3 → 9.1.2-next.4

package/CHANGELOG.md

@@ -3,6 +3,12 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [9.1.2-next.4](https://github.com/pie-framework/pie-elements/compare/@pie-element/image-cloze-association@9.1.2-next.3...@pie-element/image-cloze-association@9.1.2-next.4) (2026-03-09)
+
+### Bug Fixes
+
+- **image-cloze:** clear touchmove issues PD-5416 ([3ebaf9b](https://github.com/pie-framework/pie-elements/commit/3ebaf9b44500240ce604e13a77a90d91266753dd))
+
 ## [9.1.2-next.3](https://github.com/pie-framework/pie-elements/compare/@pie-element/image-cloze-association@9.1.2-next.2...@pie-element/image-cloze-association@9.1.2-next.3) (2026-03-06)
 
 **Note:** Version bump only for package @pie-element/image-cloze-association

package/lib/possible-response.js

@@ -100,7 +100,9 @@ const PossibleResponse = ({
       passive: false
     });
     node.addEventListener('touchend', handleTouchEnd);
-    node.addEventListener('touchmove', handleTouchMove);
+    node.addEventListener('touchmove', handleTouchMove, {
+      passive: false
+    });
     return () => {
       node.removeEventListener('touchstart', handleTouchStart);
       node.removeEventListener('touchend', handleTouchEnd);

package/lib/possible-response.js.map

@@ -1 +1 @@
-{"version":3,"file":"possible-response.js","names":["_react","_interopRequireWildcard","require","_propTypes","_interopRequireDefault","_classnames","_styles","_core","_renderUi","_evaluationIcon","_staticHtmlSpan","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","BaseContainer","styled","position","backgroundColor","color","white","border","borderDark","display","alignItems","justifyContent","minHeight","width","pointerEvents","padding","margin","transparent","correct","incorrect","StyledSpan","StaticHTMLSpan","cursor","background","visibility","PossibleResponse","canDrag","containerStyle","data","onDragBegin","answerChoiceTransparency","isOverlay","rootRef","useRef","longPressTimer","setNodeRef","attributes","listeners","isDragging","useDraggable","id","value","containerIndex","disabled","handleTouchEnd","clearTimeout","current","handleTouchMove","handleTouchStart","preventDefault","setTimeout","useEffect","node","addEventListener","passive","removeEventListener","isCorrect","evaluationStyle","fontSize","bottom","right","correctnessClass","undefined","imgRegex","containsImage","test","containerClassNames","classNames","textAnswerChoiceStyle","promptClassNames","hiddenSpan","hidden","createElement","_extends2","className","style","ref","html","propTypes","PropTypes","bool","isRequired","object","func","defaultProps","_default","exports"],"sources":["../src/possible-response.jsx"],"sourcesContent":["import React, { useEffect, useRef } from 'react';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\nimport { styled } from '@mui/material/styles';\nimport { useDraggable } from '@dnd-kit/core';\nimport { color } from '@pie-lib/render-ui';\n\nimport EvaluationIcon from './evaluation-icon';\nimport StaticHTMLSpan from './static-html-span';\n\nconst BaseContainer = styled('div')(() => ({\n  position: 'relative',\n  backgroundColor: color.white(),\n  border: `1px solid ${color.borderDark()}`,\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  minHeight: '28px',\n  width: 'fit-content',\n  '& span img': {\n    // Added for touch devices, for image content.\n    // This will prevent the context menu from appearing and not allowing other interactions with the image.\n    // If interactions with the image in the token will be requested we should handle only the context Menu.\n    pointerEvents: 'none',\n  },\n  '&.textAnswerChoiceStyle': {\n    padding: '0 10px',\n    margin: '4px 6px !important',\n  },\n  '&.answerChoiceTransparency': {\n    border: 'none',\n    backgroundColor: `${color.transparent()}`,\n    '&:hover': {\n      border: `1px solid ${color.borderDark()}`,\n    },\n  },\n  '&.baseCorrect': {\n    border: `2px solid ${color.correct()} !important`,\n  },\n  '&.baseIncorrect': {\n    border: `2px solid ${color.incorrect()} !important`,\n  },\n}));\n\nconst StyledSpan = styled(StaticHTMLSpan)(() => ({\n  cursor: 'grab',\n  backgroundColor: color.background(),\n  '&.hiddenSpan': {\n    visibility: 'hidden',\n  },\n}));\n\nconst PossibleResponse = ({ canDrag, containerStyle, data, onDragBegin, answerChoiceTransparency, isOverlay }) => {\n  const rootRef = useRef(null);\n  const longPressTimer = useRef(null);\n\n  const { setNodeRef, attributes, listeners, isDragging } = useDraggable({\n    id: `possible-response-${data.id}`,\n    data: {\n      id: data.id,\n      value: data.value,\n      containerIndex: data.containerIndex,\n    },\n    disabled: !canDrag,\n  });\n\n  const handleTouchEnd = () => {\n    clearTimeout(longPressTimer.current);\n  };\n\n  const handleTouchMove = () => {\n    clearTimeout(longPressTimer.current);\n  };\n\n  const handleTouchStart = (e) => {\n    e.preventDefault();\n    longPressTimer.current = setTimeout(() => {\n      if (canDrag && rootRef.current) {\n        onDragBegin(data);\n      }\n    }, 500); // start drag after 500ms (touch and hold duration) for chromebooks and other touch devices\n  };\n\n  useEffect(() => {\n    const node = rootRef.current;\n\n    if (!node) return;\n\n    node.addEventListener('touchstart', handleTouchStart, { passive: false });\n    node.addEventListener('touchend', handleTouchEnd);\n    node.addEventListener('touchmove', handleTouchMove);\n\n    return () => {\n      node.removeEventListener('touchstart', handleTouchStart);\n      node.removeEventListener('touchend', handleTouchEnd);\n      node.removeEventListener('touchmove', handleTouchMove);\n    };\n  }, [canDrag, data]);\n\n  const { isCorrect } = data || {};\n  const evaluationStyle = {\n    fontSize: 14,\n    position: 'absolute',\n    bottom: '3px',\n    right: '3px',\n  };\n  const correctnessClass = isCorrect === true ? 'baseCorrect' : isCorrect === false ? 'baseIncorrect' : undefined;\n\n  const imgRegex = /<img[^>]+src=\"([^\">]+)\"/;\n  const containsImage = imgRegex.test(data.value);\n\n  const containerClassNames = classNames({\n    answerChoiceTransparency: answerChoiceTransparency && !isDragging,\n    [correctnessClass]: !!correctnessClass,\n    textAnswerChoiceStyle: !containsImage && !isOverlay,\n  });\n\n  const promptClassNames = classNames({ hiddenSpan: data.hidden });\n\n  return (\n    <BaseContainer\n      className={containerClassNames}\n      style={containerStyle}\n      ref={(ref) => {\n        rootRef.current = ref;\n        setNodeRef(ref);\n      }}\n      {...listeners}\n      {...attributes}\n    >\n      <StyledSpan html={data.value} className={promptClassNames} />\n      <EvaluationIcon isCorrect={data.isCorrect} containerStyle={evaluationStyle} />\n    </BaseContainer>\n  );\n};\n\nPossibleResponse.propTypes = {\n  canDrag: PropTypes.bool.isRequired,\n  containerStyle: PropTypes.object,\n  data: PropTypes.object.isRequired,\n  onDragBegin: PropTypes.func.isRequired,\n  answerChoiceTransparency: PropTypes.bool,\n  isOverlay: PropTypes.bool,\n};\n\nPossibleResponse.defaultProps = {\n  containerStyle: {},\n  answerChoiceTransparency: false,\n  isOverlay: false,\n};\n\nexport default PossibleResponse;\n"],"mappings":";;;;;;;;AAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AACA,IAAAC,UAAA,GAAAC,sBAAA,CAAAF,OAAA;AACA,IAAAG,WAAA,GAAAD,sBAAA,CAAAF,OAAA;AACA,IAAAI,OAAA,GAAAJ,OAAA;AACA,IAAAK,KAAA,GAAAL,OAAA;AACA,IAAAM,SAAA,GAAAN,OAAA;AAEA,IAAAO,eAAA,GAAAL,sBAAA,CAAAF,OAAA;AACA,IAAAQ,eAAA,GAAAN,sBAAA,CAAAF,OAAA;AAAgD,SAAAD,wBAAAU,CAAA,EAAAC,CAAA,6BAAAC,OAAA,MAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAZ,uBAAA,YAAAA,CAAAU,CAAA,EAAAC,CAAA,SAAAA,CAAA,IAAAD,CAAA,IAAAA,CAAA,CAAAK,UAAA,SAAAL,CAAA,MAAAM,CAAA,EAAAC,CAAA,EAAAC,CAAA,KAAAC,SAAA,QAAAC,OAAA,EAAAV,CAAA,iBAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,SAAAQ,CAAA,MAAAF,CAAA,GAAAL,CAAA,GAAAG,CAAA,GAAAD,CAAA,QAAAG,CAAA,CAAAK,GAAA,CAAAX,CAAA,UAAAM,CAAA,CAAAM,GAAA,CAAAZ,CAAA,GAAAM,CAAA,CAAAO,GAAA,CAAAb,CAAA,EAAAQ,CAAA,gBAAAP,CAAA,IAAAD,CAAA,gBAAAC,CAAA,OAAAa,cAAA,CAAAC,IAAA,CAAAf,CAAA,EAAAC,CAAA,OAAAM,CAAA,IAAAD,CAAA,GAAAU,MAAA,CAAAC,cAAA,KAAAD,MAAA,CAAAE,wBAAA,CAAAlB,CAAA,EAAAC,CAAA,OAAAM,CAAA,CAAAK,GAAA,IAAAL,CAAA,CAAAM,GAAA,IAAAP,CAAA,CAAAE,CAAA,EAAAP,CAAA,EAAAM,CAAA,IAAAC,CAAA,CAAAP,CAAA,IAAAD,CAAA,CAAAC,CAAA,WAAAO,CAAA,KAAAR,CAAA,EAAAC,CAAA;AAEhD,MAAMkB,aAAa,GAAG,IAAAC,cAAM,EAAC,KAAK,CAAC,CAAC,OAAO;EACzCC,QAAQ,EAAE,UAAU;EACpBC,eAAe,EAAEC,eAAK,CAACC,KAAK,CAAC,CAAC;EAC9BC,MAAM,EAAE,aAAaF,eAAK,CAACG,UAAU,CAAC,CAAC,EAAE;EACzCC,OAAO,EAAE,MAAM;EACfC,UAAU,EAAE,QAAQ;EACpBC,cAAc,EAAE,QAAQ;EACxBC,SAAS,EAAE,MAAM;EACjBC,KAAK,EAAE,aAAa;EACpB,YAAY,EAAE;IACZ;IACA;IACA;IACAC,aAAa,EAAE;EACjB,CAAC;EACD,yBAAyB,EAAE;IACzBC,OAAO,EAAE,QAAQ;IACjBC,MAAM,EAAE;EACV,CAAC;EACD,4BAA4B,EAAE;IAC5BT,MAAM,EAAE,MAAM;IACdH,eAAe,EAAE,GAAGC,eAAK,CAACY,WAAW,CAAC,CAAC,EAAE;IACzC,SAAS,EAAE;MACTV,MAAM,EAAE,aAAaF,eAAK,CAACG,UAAU,CAAC,CAAC;IACzC;EACF,CAAC;EACD,eAAe,EAAE;IACfD,MAAM,EAAE,aAAaF,eAAK,CAACa,OAAO,CAAC,CAAC;EACtC,CAAC;EACD,iBAAiB,EAAE;IACjBX,MAAM,EAAE,aAAaF,eAAK,CAACc,SAAS,CAAC,CAAC;EACxC;AACF,CAAC,CAAC,CAAC;AAEH,MAAMC,UAAU,GAAG,IAAAlB,cAAM,EAACmB,uBAAc,CAAC,CAAC,OAAO;EAC/CC,MAAM,EAAE,MAAM;EACdlB,eAAe,EAAEC,eAAK,CAACkB,UAAU,CAAC,CAAC;EACnC,cAAc,EAAE;IACdC,UAAU,EAAE;EACd;AACF,CAAC,CAAC,CAAC;AAEH,MAAMC,gBAAgB,GAAGA,CAAC;EAAEC,OAAO;EAAEC,cAAc;EAAEC,IAAI;EAAEC,WAAW;EAAEC,wBAAwB;EAAEC;AAAU,CAAC,KAAK;EAChH,MAAMC,OAAO,GAAG,IAAAC,aAAM,EAAC,IAAI,CAAC;EAC5B,MAAMC,cAAc,GAAG,IAAAD,aAAM,EAAC,IAAI,CAAC;EAEnC,MAAM;IAAEE,UAAU;IAAEC,UAAU;IAAEC,SAAS;IAAEC;EAAW,CAAC,GAAG,IAAAC,kBAAY,EAAC;IACrEC,EAAE,EAAE,qBAAqBZ,IAAI,CAACY,EAAE,EAAE;IAClCZ,IAAI,EAAE;MACJY,EAAE,EAAEZ,IAAI,CAACY,EAAE;MACXC,KAAK,EAAEb,IAAI,CAACa,KAAK;MACjBC,cAAc,EAAEd,IAAI,CAACc;IACvB,CAAC;IACDC,QAAQ,EAAE,CAACjB;EACb,CAAC,CAAC;EAEF,MAAMkB,cAAc,GAAGA,CAAA,KAAM;IAC3BC,YAAY,CAACX,cAAc,CAACY,OAAO,CAAC;EACtC,CAAC;EAED,MAAMC,eAAe,GAAGA,CAAA,KAAM;IAC5BF,YAAY,CAACX,cAAc,CAACY,OAAO,CAAC;EACtC,CAAC;EAED,MAAME,gBAAgB,GAAIlE,CAAC,IAAK;IAC9BA,CAAC,CAACmE,cAAc,CAAC,CAAC;IAClBf,cAAc,CAACY,OAAO,GAAGI,UAAU,CAAC,MAAM;MACxC,IAAIxB,OAAO,IAAIM,OAAO,CAACc,OAAO,EAAE;QAC9BjB,WAAW,CAACD,IAAI,CAAC;MACnB;IACF,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC;EACX,CAAC;EAED,IAAAuB,gBAAS,EAAC,MAAM;IACd,MAAMC,IAAI,GAAGpB,OAAO,CAACc,OAAO;IAE5B,IAAI,CAACM,IAAI,EAAE;IAEXA,IAAI,CAACC,gBAAgB,CAAC,YAAY,EAAEL,gBAAgB,EAAE;MAAEM,OAAO,EAAE;IAAM,CAAC,CAAC;IACzEF,IAAI,CAACC,gBAAgB,CAAC,UAAU,EAAET,cAAc,CAAC;IACjDQ,IAAI,CAACC,gBAAgB,CAAC,WAAW,EAAEN,eAAe,CAAC;IAEnD,OAAO,MAAM;MACXK,IAAI,CAACG,mBAAmB,CAAC,YAAY,EAAEP,gBAAgB,CAAC;MACxDI,IAAI,CAACG,mBAAmB,CAAC,UAAU,EAAEX,cAAc,CAAC;MACpDQ,IAAI,CAACG,mBAAmB,CAAC,WAAW,EAAER,eAAe,CAAC;IACxD,CAAC;EACH,CAAC,EAAE,CAACrB,OAAO,EAAEE,IAAI,CAAC,CAAC;EAEnB,MAAM;IAAE4B;EAAU,CAAC,GAAG5B,IAAI,IAAI,CAAC,CAAC;EAChC,MAAM6B,eAAe,GAAG;IACtBC,QAAQ,EAAE,EAAE;IACZvD,QAAQ,EAAE,UAAU;IACpBwD,MAAM,EAAE,KAAK;IACbC,KAAK,EAAE;EACT,CAAC;EACD,MAAMC,gBAAgB,GAAGL,SAAS,KAAK,IAAI,GAAG,aAAa,GAAGA,SAAS,KAAK,KAAK,GAAG,eAAe,GAAGM,SAAS;EAE/G,MAAMC,QAAQ,GAAG,yBAAyB;EAC1C,MAAMC,aAAa,GAAGD,QAAQ,CAACE,IAAI,CAACrC,IAAI,CAACa,KAAK,CAAC;EAE/C,MAAMyB,mBAAmB,GAAG,IAAAC,mBAAU,EAAC;IACrCrC,wBAAwB,EAAEA,wBAAwB,IAAI,CAACQ,UAAU;IACjE,CAACuB,gBAAgB,GAAG,CAAC,CAACA,gBAAgB;IACtCO,qBAAqB,EAAE,CAACJ,aAAa,IAAI,CAACjC;EAC5C,CAAC,CAAC;EAEF,MAAMsC,gBAAgB,GAAG,IAAAF,mBAAU,EAAC;IAAEG,UAAU,EAAE1C,IAAI,CAAC2C;EAAO,CAAC,CAAC;EAEhE,oBACEpG,MAAA,CAAAqB,OAAA,CAAAgF,aAAA,CAACvE,aAAa,MAAAwE,SAAA,CAAAjF,OAAA;IACZkF,SAAS,EAAER,mBAAoB;IAC/BS,KAAK,EAAEhD,cAAe;IACtBiD,GAAG,EAAGA,GAAG,IAAK;MACZ5C,OAAO,CAACc,OAAO,GAAG8B,GAAG;MACrBzC,UAAU,CAACyC,GAAG,CAAC;IACjB;EAAE,GACEvC,SAAS,EACTD,UAAU,gBAEdjE,MAAA,CAAAqB,OAAA,CAAAgF,aAAA,CAACpD,UAAU;IAACyD,IAAI,EAAEjD,IAAI,CAACa,KAAM;IAACiC,SAAS,EAAEL;EAAiB,CAAE,CAAC,eAC7DlG,MAAA,CAAAqB,OAAA,CAAAgF,aAAA,CAAC5F,eAAA,CAAAY,OAAc;IAACgE,SAAS,EAAE5B,IAAI,CAAC4B,SAAU;IAAC7B,cAAc,EAAE8B;EAAgB,CAAE,CAChE,CAAC;AAEpB,CAAC;AAEDhC,gBAAgB,CAACqD,SAAS,GAAG;EAC3BpD,OAAO,EAAEqD,kBAAS,CAACC,IAAI,CAACC,UAAU;EAClCtD,cAAc,EAAEoD,kBAAS,CAACG,MAAM;EAChCtD,IAAI,EAAEmD,kBAAS,CAACG,MAAM,CAACD,UAAU;EACjCpD,WAAW,EAAEkD,kBAAS,CAACI,IAAI,CAACF,UAAU;EACtCnD,wBAAwB,EAAEiD,kBAAS,CAACC,IAAI;EACxCjD,SAAS,EAAEgD,kBAAS,CAACC;AACvB,CAAC;AAEDvD,gBAAgB,CAAC2D,YAAY,GAAG;EAC9BzD,cAAc,EAAE,CAAC,CAAC;EAClBG,wBAAwB,EAAE,KAAK;EAC/BC,SAAS,EAAE;AACb,CAAC;AAAC,IAAAsD,QAAA,GAAAC,OAAA,CAAA9F,OAAA,GAEaiC,gBAAgB","ignoreList":[]}
+{"version":3,"file":"possible-response.js","names":["_react","_interopRequireWildcard","require","_propTypes","_interopRequireDefault","_classnames","_styles","_core","_renderUi","_evaluationIcon","_staticHtmlSpan","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","BaseContainer","styled","position","backgroundColor","color","white","border","borderDark","display","alignItems","justifyContent","minHeight","width","pointerEvents","padding","margin","transparent","correct","incorrect","StyledSpan","StaticHTMLSpan","cursor","background","visibility","PossibleResponse","canDrag","containerStyle","data","onDragBegin","answerChoiceTransparency","isOverlay","rootRef","useRef","longPressTimer","setNodeRef","attributes","listeners","isDragging","useDraggable","id","value","containerIndex","disabled","handleTouchEnd","clearTimeout","current","handleTouchMove","handleTouchStart","preventDefault","setTimeout","useEffect","node","addEventListener","passive","removeEventListener","isCorrect","evaluationStyle","fontSize","bottom","right","correctnessClass","undefined","imgRegex","containsImage","test","containerClassNames","classNames","textAnswerChoiceStyle","promptClassNames","hiddenSpan","hidden","createElement","_extends2","className","style","ref","html","propTypes","PropTypes","bool","isRequired","object","func","defaultProps","_default","exports"],"sources":["../src/possible-response.jsx"],"sourcesContent":["import React, { useEffect, useRef } from 'react';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\nimport { styled } from '@mui/material/styles';\nimport { useDraggable } from '@dnd-kit/core';\nimport { color } from '@pie-lib/render-ui';\n\nimport EvaluationIcon from './evaluation-icon';\nimport StaticHTMLSpan from './static-html-span';\n\nconst BaseContainer = styled('div')(() => ({\n  position: 'relative',\n  backgroundColor: color.white(),\n  border: `1px solid ${color.borderDark()}`,\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  minHeight: '28px',\n  width: 'fit-content',\n  '& span img': {\n    // Added for touch devices, for image content.\n    // This will prevent the context menu from appearing and not allowing other interactions with the image.\n    // If interactions with the image in the token will be requested we should handle only the context Menu.\n    pointerEvents: 'none',\n  },\n  '&.textAnswerChoiceStyle': {\n    padding: '0 10px',\n    margin: '4px 6px !important',\n  },\n  '&.answerChoiceTransparency': {\n    border: 'none',\n    backgroundColor: `${color.transparent()}`,\n    '&:hover': {\n      border: `1px solid ${color.borderDark()}`,\n    },\n  },\n  '&.baseCorrect': {\n    border: `2px solid ${color.correct()} !important`,\n  },\n  '&.baseIncorrect': {\n    border: `2px solid ${color.incorrect()} !important`,\n  },\n}));\n\nconst StyledSpan = styled(StaticHTMLSpan)(() => ({\n  cursor: 'grab',\n  backgroundColor: color.background(),\n  '&.hiddenSpan': {\n    visibility: 'hidden',\n  },\n}));\n\nconst PossibleResponse = ({ canDrag, containerStyle, data, onDragBegin, answerChoiceTransparency, isOverlay }) => {\n  const rootRef = useRef(null);\n  const longPressTimer = useRef(null);\n\n  const { setNodeRef, attributes, listeners, isDragging } = useDraggable({\n    id: `possible-response-${data.id}`,\n    data: {\n      id: data.id,\n      value: data.value,\n      containerIndex: data.containerIndex,\n    },\n    disabled: !canDrag,\n  });\n\n  const handleTouchEnd = () => {\n    clearTimeout(longPressTimer.current);\n  };\n\n  const handleTouchMove = () => {\n    clearTimeout(longPressTimer.current);\n  };\n\n  const handleTouchStart = (e) => {\n    e.preventDefault();\n    longPressTimer.current = setTimeout(() => {\n      if (canDrag && rootRef.current) {\n        onDragBegin(data);\n      }\n    }, 500); // start drag after 500ms (touch and hold duration) for chromebooks and other touch devices\n  };\n\n  useEffect(() => {\n    const node = rootRef.current;\n\n    if (!node) return;\n\n    node.addEventListener('touchstart', handleTouchStart, { passive: false });\n    node.addEventListener('touchend', handleTouchEnd);\n    node.addEventListener('touchmove', handleTouchMove, { passive: false });\n\n    return () => {\n      node.removeEventListener('touchstart', handleTouchStart);\n      node.removeEventListener('touchend', handleTouchEnd);\n      node.removeEventListener('touchmove', handleTouchMove);\n    };\n  }, [canDrag, data]);\n\n  const { isCorrect } = data || {};\n  const evaluationStyle = {\n    fontSize: 14,\n    position: 'absolute',\n    bottom: '3px',\n    right: '3px',\n  };\n  const correctnessClass = isCorrect === true ? 'baseCorrect' : isCorrect === false ? 'baseIncorrect' : undefined;\n\n  const imgRegex = /<img[^>]+src=\"([^\">]+)\"/;\n  const containsImage = imgRegex.test(data.value);\n\n  const containerClassNames = classNames({\n    answerChoiceTransparency: answerChoiceTransparency && !isDragging,\n    [correctnessClass]: !!correctnessClass,\n    textAnswerChoiceStyle: !containsImage && !isOverlay,\n  });\n\n  const promptClassNames = classNames({ hiddenSpan: data.hidden });\n\n  return (\n    <BaseContainer\n      className={containerClassNames}\n      style={containerStyle}\n      ref={(ref) => {\n        rootRef.current = ref;\n        setNodeRef(ref);\n      }}\n      {...listeners}\n      {...attributes}\n    >\n      <StyledSpan html={data.value} className={promptClassNames} />\n      <EvaluationIcon isCorrect={data.isCorrect} containerStyle={evaluationStyle} />\n    </BaseContainer>\n  );\n};\n\nPossibleResponse.propTypes = {\n  canDrag: PropTypes.bool.isRequired,\n  containerStyle: PropTypes.object,\n  data: PropTypes.object.isRequired,\n  onDragBegin: PropTypes.func.isRequired,\n  answerChoiceTransparency: PropTypes.bool,\n  isOverlay: PropTypes.bool,\n};\n\nPossibleResponse.defaultProps = {\n  containerStyle: {},\n  answerChoiceTransparency: false,\n  isOverlay: false,\n};\n\nexport default PossibleResponse;\n"],"mappings":"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","ignoreList":[]}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@pie-element/image-cloze-association",
   "repository": "pie-framework/pie-elements",
-  "version": "9.1.2-next.3",
+  "version": "9.1.2-next.4",
   "description": "",
   "publishConfig": {
     "access": "public"
@@ -26,7 +26,7 @@
   },
   "author": "pie framework developers",
   "license": "ISC",
-  "gitHead": "15d380e035464a06537eea3aae5cd741f5319659",
+  "gitHead": "a8b257ceb051bf973d80b1ae19138ae99117346b",
   "scripts": {
     "postpublish": "../../scripts/postpublish"
   },

package/src/possible-response.jsx

@@ -88,7 +88,7 @@ const PossibleResponse = ({ canDrag, containerStyle, data, onDragBegin, answerCh
 
     node.addEventListener('touchstart', handleTouchStart, { passive: false });
     node.addEventListener('touchend', handleTouchEnd);
-    node.addEventListener('touchmove', handleTouchMove);
+    node.addEventListener('touchmove', handleTouchMove, { passive: false });
 
     return () => {
       node.removeEventListener('touchstart', handleTouchStart);