@pie-element/drawing-response 11.1.0-next.0 → 11.1.2-next.2

package/configure/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@pie-element/drawing-response-configure",
   "private": true,
-  "version": "10.1.0-next.0",
+  "version": "10.1.1-next.2",
   "description": "",
   "main": "lib/index.js",
   "module": "src/index.js",
@@ -12,8 +12,8 @@
     "@mui/icons-material": "^7.3.4",
     "@mui/material": "^7.3.4",
     "@pie-framework/pie-configure-events": "^1.3.0",
-    "@pie-lib/config-ui": "12.1.1-next.3",
-    "@pie-lib/editable-html-tip-tap": "1.1.1-next.3",
+    "@pie-lib/config-ui": "12.2.0-next.12",
+    "@pie-lib/editable-html-tip-tap": "1.2.0-next.12",
     "debug": "^4.1.1",
     "lodash-es": "^4.17.23",
     "prop-types": "^15.7.2",

package/controller/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@pie-element/drawing-response-controller",
   "private": true,
-  "version": "5.1.0-next.0",
+  "version": "5.1.0-next.1",
   "description": "",
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1"

package/lib/drawing-response/drawable-text.js

@@ -227,11 +227,34 @@ class TextDrawable {
           onDblTap: e => this.handleDblClick(e, text),
           onTransform: e => this.handleTransform(e, textNode),
           onTransformEnd: this.props.handleSessionChange,
-          onMouseDown: this.handleMouseDown,
-          onTouchStart: this.handleMouseDown,
-          onMouseUp: this.handleMouseUp,
-          onTouchEnd: this.handleMouseUp,
-          onDragEnd: this.props.handleSessionChange,
+          onMouseDown: e => {
+            e.cancelBubble = true;
+            this.props.toggleTextSelected(true);
+          },
+          onTouchStart: e => {
+            e.cancelBubble = true;
+            this.props.toggleTextSelected(true);
+          },
+          onDragStart: e => {
+            e.cancelBubble = true;
+            this.props.toggleTextSelected(true);
+          },
+          onDragMove: e => {
+            e.cancelBubble = true;
+          },
+          onDragEnd: e => {
+            e.cancelBubble = true;
+            this.props.toggleTextSelected(false);
+            this.props.handleSessionChange();
+          },
+          onMouseUp: e => {
+            e.cancelBubble = true;
+            this.props.toggleTextSelected(false);
+          },
+          onTouchEnd: e => {
+            e.cancelBubble = true;
+            this.props.toggleTextSelected(false);
+          },
           onMouseEnter: this.props.onMouseOverElement,
           onMouseLeave: this.props.onMouseOutElement
         };

package/lib/drawing-response/drawable-text.js.map

@@ -1 +1 @@
-{"version":3,"file":"drawable-text.js","names":["_react","_interopRequireDefault","require","_reactKonva","_translator","_drawableTransformer","translator","Translator","generateId","Math","random","toString","substring","Date","getTime","exports","TextDrawable","getTextareaNode","id","getTextNode","getTransformerNode","constructor","props","_defineProperty2","default","eventListenersDetachArray","forEach","fn","all","forceUpdate","language","push","text","isDefault","label","t","lng","width","x","length","y","textVisible","transformerVisible","textareaVisible","createdAt","type","handleSessionChange","toggleTextSelected","e","current","filter","item","toggleTextarea","textNode","textareaNode","areaPosition","getAbsolutePosition","value","style","position","top","left","padding","height","fontSize","border","margin","overflow","background","outline","resize","lineHeight","fontFamily","transformOrigin","textAlign","align","color","fill","display","rotation","transform","focus","keyDownHandler","key","shiftKey","saveValue","blurHandler","showOnlyTextNodes","addEventListener","removeEventListener","initializeDefault","setAttrs","scaleX","scale","map","renderTextareas","createElement","ref","textarea","setInitialProps","render","stage","newStage","stageClickHandler","target","on","off","transformerNode","extraProps","disabled","onClick","handleClick","onTap","onDblClick","handleDblClick","onDblTap","onTransform","handleTransform","onTransformEnd","onMouseDown","handleMouseDown","onTouchStart","onMouseUp","handleMouseUp","onTouchEnd","onDragEnd","onMouseEnter","onMouseOverElement","onMouseLeave","onMouseOutElement","Text","_extends2","bubbles","name","draggable","visible","selectedShapeName"],"sources":["../../src/drawing-response/drawable-text.jsx"],"sourcesContent":["import React from 'react';\nimport { Text } from 'react-konva';\nimport Translator from '@pie-lib/translator';\n\nconst { translator } = Translator;\nimport Transformer from './drawable-transformer';\n\nexport const generateId = () => Math.random().toString(36).substring(2) + new Date().getTime().toString(36);\n\nexport default class TextDrawable {\n  static getTextareaNode(id) {\n    return `textarea_${id}`;\n  }\n\n  static getTextNode(id) {\n    return `text_${id}`;\n  }\n\n  static getTransformerNode(id) {\n    return `transformer_${id}`;\n  }\n\n  constructor(props) {\n    this.all = (props && props.all) || [];\n    this.eventListenersDetachArray = [];\n  }\n\n  removeEventListeners = () => this.eventListenersDetachArray.forEach((fn) => fn());\n\n  setAll = (all) => {\n    this.all = all;\n    this.props.forceUpdate();\n  };\n\n  addNewTextEntry = (language) => {\n    const all = this.all;\n    const id = generateId();\n\n    all.push({\n      id: id,\n      text: '',\n      isDefault: true,\n      label: translator.t('drawingResponse.onDoubleClick', { lng: language }),\n      width: 200,\n      x: (all.length + 1) * 5 + 50,\n      y: (all.length + 1) * 5 + 50,\n      textVisible: true,\n      transformerVisible: true,\n      textareaVisible: false,\n      createdAt: new Date(),\n      type: 'text-entry',\n    });\n\n    this.props.handleSessionChange();\n  };\n\n  showOnlyTextNodes() {\n    this.all.map((item) => {\n      item.textVisible = true;\n      item.transformerVisible = false;\n      item.textareaVisible = false;\n    });\n  }\n\n  toggleTextarea(id, value) {\n    this.all = this.all.map((item) => {\n      if (item.id === id) {\n        return {\n          ...item,\n          textVisible: !value,\n          transformerVisible: !value,\n          textareaVisible: value,\n        };\n      }\n      return item;\n    });\n    this.props.forceUpdate();\n  }\n\n  initializeDefault(id, isDefault) {\n    if (isDefault) {\n      const current = this.all.filter((item) => item.id === id)[0];\n      current.isDefault = false;\n    }\n  }\n\n  saveValue(id, textareaNode) {\n    const value = textareaNode.value;\n    this.all = this.all.map((t) =>\n      t.id === id ? { ...t, text: value } : t\n    );\n\n    if (!value) {\n      this.all = this.all.filter((t) => t.id !== id);\n    }\n\n    this.toggleTextarea(id, false);\n    this.props.handleSessionChange();\n    this.props.forceUpdate();\n  }\n\n  handleMouseDown = () => this.props.toggleTextSelected(true);\n  handleMouseUp = () => this.props.toggleTextSelected(false);\n\n  handleClick = (e, id) => {\n    const current = this.all.filter((item) => item.id === id)[0];\n    current.transformerVisible = true;\n    this.props.forceUpdate();\n  };\n\n  handleDblClick = (e, text) => {\n    const { id, isDefault } = text;\n    this.toggleTextarea(id, true);\n\n    const textNode = this[TextDrawable.getTextNode(id)];\n    const textareaNode = this[TextDrawable.getTextareaNode(id)];\n\n    if (!textNode || !textareaNode) return;\n\n    const areaPosition = textNode.getAbsolutePosition();\n\n    textareaNode.value = text.text || '';\n    textareaNode.style.position = 'absolute';\n    textareaNode.style.top = areaPosition.y + 'px';\n    textareaNode.style.left = areaPosition.x + 'px';\n    textareaNode.style.width = textNode.width() - textNode.padding() * 2 + 'px';\n    textareaNode.style.height = textNode.height() - textNode.padding() * 2 + 5 + 'px';\n    textareaNode.style.fontSize = textNode.fontSize() + 'px';\n    textareaNode.style.border = 'none';\n    textareaNode.style.padding = '0px';\n    textareaNode.style.margin = '0px';\n    textareaNode.style.overflow = 'hidden';\n    textareaNode.style.background = 'none';\n    textareaNode.style.outline = 'none';\n    textareaNode.style.resize = 'none';\n    textareaNode.style.lineHeight = textNode.lineHeight();\n    textareaNode.style.fontFamily = textNode.fontFamily();\n    textareaNode.style.transformOrigin = 'left top';\n    textareaNode.style.textAlign = textNode.align();\n    textareaNode.style.color = textNode.fill();\n    textareaNode.style.display = 'block';\n\n    let rotation = textNode.rotation();\n    textareaNode.style.transform = rotation ? `rotateZ(${rotation}deg)` : '';\n\n    textareaNode.focus();\n\n    const keyDownHandler = (e) => {\n      if (e.key === 'Enter' && !e.shiftKey) {\n        this.saveValue(id, textareaNode);\n      }\n      if (e.key === 'Escape') {\n        this.toggleTextarea(id, false);\n      }\n    };\n\n    const blurHandler = () => {\n      this.showOnlyTextNodes();\n      this.saveValue(id, textareaNode);\n    };\n\n    textareaNode.addEventListener('keydown', keyDownHandler);\n    textareaNode.addEventListener('blur', blurHandler);\n\n    this.eventListenersDetachArray.push(() => {\n      textareaNode.removeEventListener('keydown', keyDownHandler);\n      textareaNode.removeEventListener('blur', blurHandler);\n    });\n\n    this.initializeDefault(id, isDefault);\n    this.props.forceUpdate();\n  };\n\n  handleTransform = (e, textNode) => {\n    this[textNode].setAttrs({\n      width: this[textNode].width() * this[textNode].scaleX(),\n      scaleX: this.props.scale,\n    });\n  };\n\n  renderTextareas() {\n    return this.all.map((text) => {\n      const { id, textareaVisible } = text;\n      const textareaNode = `textarea_${id}`;\n\n      return (\n        <textarea\n          key={textareaNode}\n          ref={(textarea) => {\n            this[textareaNode] = textarea;\n          }}\n          style={{ display: `${textareaVisible ? 'block' : 'none'}` }}\n        />\n      );\n    });\n  }\n\n  setInitialProps(props) {\n    if (!this.props) {\n      this.props = props;\n    }\n  }\n\n  render(props) {\n    this.setInitialProps(props);\n\n    if (props.stage) {\n      const newStage = props.stage;\n\n      // setting the handler only once\n      if (newStage !== this.stage) {\n        const stageClickHandler = (e) => {\n          if (e.target !== this.stage) {\n            return;\n          }\n\n          this.showOnlyTextNodes();\n          this.props.forceUpdate();\n        };\n\n        newStage.on('click', stageClickHandler);\n\n        this.eventListenersDetachArray.push(() => newStage.off('click', stageClickHandler));\n      }\n\n      this.stage = newStage;\n    }\n\n    return this.all.map((text) => {\n      const { id, label, x, y, width, textVisible, rotation, transformerVisible } = text;\n\n      const textNode = `text_${id}`;\n      const transformerNode = `transformer_${id}`;\n      let extraProps = {};\n\n      if (!props.disabled) {\n        extraProps = {\n          onClick: (e) => this.handleClick(e, id),\n          onTap: (e) => this.handleClick(e, id),\n          onDblClick: (e) => this.handleDblClick(e, text),\n          onDblTap: (e) => this.handleDblClick(e, text),\n          onTransform: (e) => this.handleTransform(e, textNode),\n          onTransformEnd: this.props.handleSessionChange,\n          onMouseDown: this.handleMouseDown,\n          onTouchStart: this.handleMouseDown,\n          onMouseUp: this.handleMouseUp,\n          onTouchEnd: this.handleMouseUp,\n          onDragEnd: this.props.handleSessionChange,\n          onMouseEnter: this.props.onMouseOverElement,\n          onMouseLeave: this.props.onMouseOutElement,\n        };\n      }\n\n      if (rotation) {\n        extraProps.rotation = rotation;\n      }\n\n      return [\n        <Text\n          key={id}\n          bubbles={true}\n          id={id}\n          ref={(text) => {\n            this[textNode] = text;\n          }}\n          text={text.text || label}\n          name={textNode}\n          x={x}\n          y={y}\n          width={width}\n          draggable={!props.disabled}\n          visible={textVisible}\n          fontSize={16}\n          {...extraProps}\n        />,\n        transformerVisible && (\n          <Transformer\n            key={`transformer_${id}`}\n            ref={(text) => {\n              this[transformerNode] = text;\n            }}\n            selectedShapeName={textNode}\n            onMouseDown={this.handleMouseDown}\n            onTouchStart={this.handleMouseDown}\n            onMouseUp={this.handleMouseUp}\n            onTouchEnd={this.handleMouseUp}\n          />\n        ),\n      ];\n    });\n  }\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"drawable-text.js","names":["_react","_interopRequireDefault","require","_reactKonva","_translator","_drawableTransformer","translator","Translator","generateId","Math","random","toString","substring","Date","getTime","exports","TextDrawable","getTextareaNode","id","getTextNode","getTransformerNode","constructor","props","_defineProperty2","default","eventListenersDetachArray","forEach","fn","all","forceUpdate","language","push","text","isDefault","label","t","lng","width","x","length","y","textVisible","transformerVisible","textareaVisible","createdAt","type","handleSessionChange","toggleTextSelected","e","current","filter","item","toggleTextarea","textNode","textareaNode","areaPosition","getAbsolutePosition","value","style","position","top","left","padding","height","fontSize","border","margin","overflow","background","outline","resize","lineHeight","fontFamily","transformOrigin","textAlign","align","color","fill","display","rotation","transform","focus","keyDownHandler","key","shiftKey","saveValue","blurHandler","showOnlyTextNodes","addEventListener","removeEventListener","initializeDefault","setAttrs","scaleX","scale","map","renderTextareas","createElement","ref","textarea","setInitialProps","render","stage","newStage","stageClickHandler","target","on","off","transformerNode","extraProps","disabled","onClick","handleClick","onTap","onDblClick","handleDblClick","onDblTap","onTransform","handleTransform","onTransformEnd","onMouseDown","cancelBubble","onTouchStart","onDragStart","onDragMove","onDragEnd","onMouseUp","onTouchEnd","onMouseEnter","onMouseOverElement","onMouseLeave","onMouseOutElement","Text","_extends2","bubbles","name","draggable","visible","selectedShapeName","handleMouseDown","handleMouseUp"],"sources":["../../src/drawing-response/drawable-text.jsx"],"sourcesContent":["import React from 'react';\nimport { Text } from 'react-konva';\nimport Translator from '@pie-lib/translator';\n\nconst { translator } = Translator;\nimport Transformer from './drawable-transformer';\n\nexport const generateId = () => Math.random().toString(36).substring(2) + new Date().getTime().toString(36);\n\nexport default class TextDrawable {\n  static getTextareaNode(id) {\n    return `textarea_${id}`;\n  }\n\n  static getTextNode(id) {\n    return `text_${id}`;\n  }\n\n  static getTransformerNode(id) {\n    return `transformer_${id}`;\n  }\n\n  constructor(props) {\n    this.all = (props && props.all) || [];\n    this.eventListenersDetachArray = [];\n  }\n\n  removeEventListeners = () => this.eventListenersDetachArray.forEach((fn) => fn());\n\n  setAll = (all) => {\n    this.all = all;\n    this.props.forceUpdate();\n  };\n\n  addNewTextEntry = (language) => {\n    const all = this.all;\n    const id = generateId();\n\n    all.push({\n      id: id,\n      text: '',\n      isDefault: true,\n      label: translator.t('drawingResponse.onDoubleClick', { lng: language }),\n      width: 200,\n      x: (all.length + 1) * 5 + 50,\n      y: (all.length + 1) * 5 + 50,\n      textVisible: true,\n      transformerVisible: true,\n      textareaVisible: false,\n      createdAt: new Date(),\n      type: 'text-entry',\n    });\n\n    this.props.handleSessionChange();\n  };\n\n  showOnlyTextNodes() {\n    this.all.map((item) => {\n      item.textVisible = true;\n      item.transformerVisible = false;\n      item.textareaVisible = false;\n    });\n  }\n\n  toggleTextarea(id, value) {\n    this.all = this.all.map((item) => {\n      if (item.id === id) {\n        return {\n          ...item,\n          textVisible: !value,\n          transformerVisible: !value,\n          textareaVisible: value,\n        };\n      }\n      return item;\n    });\n    this.props.forceUpdate();\n  }\n\n  initializeDefault(id, isDefault) {\n    if (isDefault) {\n      const current = this.all.filter((item) => item.id === id)[0];\n      current.isDefault = false;\n    }\n  }\n\n  saveValue(id, textareaNode) {\n    const value = textareaNode.value;\n    this.all = this.all.map((t) =>\n      t.id === id ? { ...t, text: value } : t\n    );\n\n    if (!value) {\n      this.all = this.all.filter((t) => t.id !== id);\n    }\n\n    this.toggleTextarea(id, false);\n    this.props.handleSessionChange();\n    this.props.forceUpdate();\n  }\n\n  handleMouseDown = () => this.props.toggleTextSelected(true);\n  handleMouseUp = () => this.props.toggleTextSelected(false);\n\n  handleClick = (e, id) => {\n    const current = this.all.filter((item) => item.id === id)[0];\n    current.transformerVisible = true;\n    this.props.forceUpdate();\n  };\n\n  handleDblClick = (e, text) => {\n    const { id, isDefault } = text;\n    this.toggleTextarea(id, true);\n\n    const textNode = this[TextDrawable.getTextNode(id)];\n    const textareaNode = this[TextDrawable.getTextareaNode(id)];\n\n    if (!textNode || !textareaNode) return;\n\n    const areaPosition = textNode.getAbsolutePosition();\n\n    textareaNode.value = text.text || '';\n    textareaNode.style.position = 'absolute';\n    textareaNode.style.top = areaPosition.y + 'px';\n    textareaNode.style.left = areaPosition.x + 'px';\n    textareaNode.style.width = textNode.width() - textNode.padding() * 2 + 'px';\n    textareaNode.style.height = textNode.height() - textNode.padding() * 2 + 5 + 'px';\n    textareaNode.style.fontSize = textNode.fontSize() + 'px';\n    textareaNode.style.border = 'none';\n    textareaNode.style.padding = '0px';\n    textareaNode.style.margin = '0px';\n    textareaNode.style.overflow = 'hidden';\n    textareaNode.style.background = 'none';\n    textareaNode.style.outline = 'none';\n    textareaNode.style.resize = 'none';\n    textareaNode.style.lineHeight = textNode.lineHeight();\n    textareaNode.style.fontFamily = textNode.fontFamily();\n    textareaNode.style.transformOrigin = 'left top';\n    textareaNode.style.textAlign = textNode.align();\n    textareaNode.style.color = textNode.fill();\n    textareaNode.style.display = 'block';\n\n    let rotation = textNode.rotation();\n    textareaNode.style.transform = rotation ? `rotateZ(${rotation}deg)` : '';\n\n    textareaNode.focus();\n\n    const keyDownHandler = (e) => {\n      if (e.key === 'Enter' && !e.shiftKey) {\n        this.saveValue(id, textareaNode);\n      }\n      if (e.key === 'Escape') {\n        this.toggleTextarea(id, false);\n      }\n    };\n\n    const blurHandler = () => {\n      this.showOnlyTextNodes();\n      this.saveValue(id, textareaNode);\n    };\n\n    textareaNode.addEventListener('keydown', keyDownHandler);\n    textareaNode.addEventListener('blur', blurHandler);\n\n    this.eventListenersDetachArray.push(() => {\n      textareaNode.removeEventListener('keydown', keyDownHandler);\n      textareaNode.removeEventListener('blur', blurHandler);\n    });\n\n    this.initializeDefault(id, isDefault);\n    this.props.forceUpdate();\n  };\n\n  handleTransform = (e, textNode) => {\n    this[textNode].setAttrs({\n      width: this[textNode].width() * this[textNode].scaleX(),\n      scaleX: this.props.scale,\n    });\n  };\n\n  renderTextareas() {\n    return this.all.map((text) => {\n      const { id, textareaVisible } = text;\n      const textareaNode = `textarea_${id}`;\n\n      return (\n        <textarea\n          key={textareaNode}\n          ref={(textarea) => {\n            this[textareaNode] = textarea;\n          }}\n          style={{ display: `${textareaVisible ? 'block' : 'none'}` }}\n        />\n      );\n    });\n  }\n\n  setInitialProps(props) {\n    if (!this.props) {\n      this.props = props;\n    }\n  }\n\n  render(props) {\n    this.setInitialProps(props);\n\n    if (props.stage) {\n      const newStage = props.stage;\n\n      // setting the handler only once\n      if (newStage !== this.stage) {\n        const stageClickHandler = (e) => {\n          if (e.target !== this.stage) {\n            return;\n          }\n\n          this.showOnlyTextNodes();\n          this.props.forceUpdate();\n        };\n\n        newStage.on('click', stageClickHandler);\n        this.eventListenersDetachArray.push(() => newStage.off('click', stageClickHandler));\n      }\n\n      this.stage = newStage;\n    }\n\n    return this.all.map((text) => {\n      const { id, label, x, y, width, textVisible, rotation, transformerVisible } = text;\n\n      const textNode = `text_${id}`;\n      const transformerNode = `transformer_${id}`;\n      let extraProps = {};\n\n      if (!props.disabled) {\n        extraProps = {\n          onClick: (e) => this.handleClick(e, id),\n          onTap: (e) => this.handleClick(e, id),\n          onDblClick: (e) => this.handleDblClick(e, text),\n          onDblTap: (e) => this.handleDblClick(e, text),\n          onTransform: (e) => this.handleTransform(e, textNode),\n          onTransformEnd: this.props.handleSessionChange,\n\n          onMouseDown: (e) => {\n            e.cancelBubble = true;\n            this.props.toggleTextSelected(true);\n          },\n          onTouchStart: (e) => {\n            e.cancelBubble = true;\n            this.props.toggleTextSelected(true);\n          },\n\n          onDragStart: (e) => {\n            e.cancelBubble = true;\n            this.props.toggleTextSelected(true);\n          },\n          onDragMove: (e) => {\n            e.cancelBubble = true;\n          },\n          onDragEnd: (e) => {\n            e.cancelBubble = true;\n            this.props.toggleTextSelected(false);\n            this.props.handleSessionChange();\n          },\n\n          onMouseUp: (e) => {\n            e.cancelBubble = true;\n            this.props.toggleTextSelected(false);\n          },\n          onTouchEnd: (e) => {\n            e.cancelBubble = true;\n            this.props.toggleTextSelected(false);\n          },\n\n          onMouseEnter: this.props.onMouseOverElement,\n          onMouseLeave: this.props.onMouseOutElement,\n        };\n      }\n\n      if (rotation) {\n        extraProps.rotation = rotation;\n      }\n\n      return [\n        <Text\n          key={id}\n          bubbles={true}\n          id={id}\n          ref={(text) => {\n            this[textNode] = text;\n          }}\n          text={text.text || label}\n          name={textNode}\n          x={x}\n          y={y}\n          width={width}\n          draggable={!props.disabled}\n          visible={textVisible}\n          fontSize={16}\n          {...extraProps}\n        />,\n        transformerVisible && (\n          <Transformer\n            key={`transformer_${id}`}\n            ref={(text) => {\n              this[transformerNode] = text;\n            }}\n            selectedShapeName={textNode}\n            onMouseDown={this.handleMouseDown}\n            onTouchStart={this.handleMouseDown}\n            onMouseUp={this.handleMouseUp}\n            onTouchEnd={this.handleMouseUp}\n          />\n        ),\n      ];\n    });\n  }\n}"],"mappings":"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","ignoreList":[]}

package/package.json

@@ -1,10 +1,7 @@
 {
   "name": "@pie-element/drawing-response",
-  "repository": {
-    "type": "git",
-    "url": "https://github.com/pie-framework/pie-elements"
-  },
-  "version": "11.1.0-next.0+20d879b",
+  "repository": "pie-framework/pie-elements",
+  "version": "11.1.2-next.2",
   "description": "",
   "publishConfig": {
     "access": "public"
@@ -17,9 +14,9 @@
     "@mui/icons-material": "^7.3.4",
     "@mui/material": "^7.3.4",
     "@pie-framework/pie-player-events": "^0.1.0",
-    "@pie-lib/math-rendering": "4.1.1-next.1",
-    "@pie-lib/render-ui": "5.1.1-next.1",
-    "@pie-lib/translator": "3.1.1-next.1",
+    "@pie-lib/math-rendering": "4.2.0-next.3",
+    "@pie-lib/render-ui": "5.2.0-next.4",
+    "@pie-lib/translator": "3.2.0-next.3",
     "konva": "8.3.0",
     "lodash-es": "^4.17.23",
     "prop-types": "^15.6.1",
@@ -29,7 +26,7 @@
   },
   "author": "pie framework developers",
   "license": "ISC",
-  "gitHead": "20d879b8b8fa74decf5028d860d54cd09cbdf051",
+  "gitHead": "a29aff6c2f994c4e4b4847f67a5e9f2928e703af",
   "scripts": {
     "postpublish": "../../scripts/postpublish"
   },

package/src/drawing-response/drawable-text.jsx

@@ -219,7 +219,6 @@ export default class TextDrawable {
         };
 
         newStage.on('click', stageClickHandler);
-
         this.eventListenersDetachArray.push(() => newStage.off('click', stageClickHandler));
       }
 
@@ -241,11 +240,38 @@ export default class TextDrawable {
           onDblTap: (e) => this.handleDblClick(e, text),
           onTransform: (e) => this.handleTransform(e, textNode),
           onTransformEnd: this.props.handleSessionChange,
-          onMouseDown: this.handleMouseDown,
-          onTouchStart: this.handleMouseDown,
-          onMouseUp: this.handleMouseUp,
-          onTouchEnd: this.handleMouseUp,
-          onDragEnd: this.props.handleSessionChange,
+
+          onMouseDown: (e) => {
+            e.cancelBubble = true;
+            this.props.toggleTextSelected(true);
+          },
+          onTouchStart: (e) => {
+            e.cancelBubble = true;
+            this.props.toggleTextSelected(true);
+          },
+
+          onDragStart: (e) => {
+            e.cancelBubble = true;
+            this.props.toggleTextSelected(true);
+          },
+          onDragMove: (e) => {
+            e.cancelBubble = true;
+          },
+          onDragEnd: (e) => {
+            e.cancelBubble = true;
+            this.props.toggleTextSelected(false);
+            this.props.handleSessionChange();
+          },
+
+          onMouseUp: (e) => {
+            e.cancelBubble = true;
+            this.props.toggleTextSelected(false);
+          },
+          onTouchEnd: (e) => {
+            e.cancelBubble = true;
+            this.props.toggleTextSelected(false);
+          },
+
           onMouseEnter: this.props.onMouseOverElement,
           onMouseLeave: this.props.onMouseOutElement,
         };
@@ -289,4 +315,4 @@ export default class TextDrawable {
       ];
     });
   }
-}
+}