@pie-element/drawing-response 12.1.2-next.1 → 12.1.2

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

@@ -0,0 +1 @@
+{"version":3,"file":"drawable-palette.js","names":["_react","_interopRequireDefault","require","_propTypes","_renderUi","_Select","_MenuItem","_styles","_translator","translator","Translator","BaseContainer","styled","theme","marginTop","spacing","display","StyledInputContainer","InputContainer","flex","fontSize","width","StyledMenuItem","MenuItem","isBlackColor","borderRadius","height","marginLeft","marginRight","color","palette","background","paper","StyledSelect","Select","transform","Palette","React","Component","constructor","args","_defineProperty2","default","name","event","value","target","onFillColorChange","onOutlineColorChange","onPaintColorChange","props","render","fillColor","outlineColor","fillList","outlineList","language","createElement","label","t","lng","onChange","variant","MenuProps","transitionDuration","enter","exit","map","key","style","backgroundColor","border","propTypes","PropTypes","string","isRequired","array","func","_default","exports"],"sources":["../../src/drawing-response/drawable-palette.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { InputContainer } from '@pie-lib/render-ui';\nimport Select from '@mui/material/Select';\nimport MenuItem from '@mui/material/MenuItem';\nimport { styled } from '@mui/material/styles';\nimport Translator from '@pie-lib/translator';\n\nconst { translator } = Translator;\n\nconst BaseContainer = styled('div')(({ theme }) => ({\n  marginTop: theme.spacing(2),\n  display: 'flex',\n}));\n\nconst StyledInputContainer = styled(InputContainer)({\n  flex: 1,\n  fontSize: 'inherit',\n  width: '90%',\n});\n\nconst StyledMenuItem = styled(MenuItem)(({ theme, isBlackColor }) => ({\n  borderRadius: '2px',\n  fontSize: 'inherit',\n  height: '22px',\n  marginLeft: theme.spacing(2),\n  marginRight: theme.spacing(2),\n  marginTop: theme.spacing(2),\n  ...(isBlackColor && {\n    color: theme.palette.background.paper,\n  }),\n}));\n\nconst StyledSelect = styled(Select)({\n  fontSize: 'inherit',\n  transform: 'translate(0%, 40%)',\n});\n\n// TODO: Change Palette so will render inputs and colors dynamically\nclass Palette extends React.Component {\n  onChange = (name) => (event) => {\n    const { value } = event.target;\n    const { onFillColorChange, onOutlineColorChange, onPaintColorChange } = this.props;\n\n    if (name === 'fill') {\n      onFillColorChange(value);\n    } else if (name === 'outline') {\n      onOutlineColorChange(value);\n    } else {\n      onPaintColorChange(value);\n    }\n  };\n\n  render() {\n    const { fillColor, outlineColor, fillList, outlineList, language } = this.props;\n\n    return (\n      <BaseContainer>\n        <StyledInputContainer label={translator.t('drawingResponse.fillColor', { lng: language })}>\n          <StyledSelect onChange={this.onChange('fill')} value={fillColor} variant='standard' MenuProps={{ transitionDuration: { enter: 225, exit: 195 } }}>\n            {fillList.map(({ value, label }) => (\n              <StyledMenuItem\n                key={value}\n                value={value}\n                isBlackColor={value === 'black'}\n                style={{ backgroundColor: value }}\n              >\n                {label}\n              </StyledMenuItem>\n            ))}\n          </StyledSelect>\n        </StyledInputContainer>\n\n        <StyledInputContainer label={translator.t('drawingResponse.outlineColor', { lng: language })}>\n          <StyledSelect onChange={this.onChange('outline')} value={outlineColor} variant='standard' MenuProps={{ transitionDuration: { enter: 225, exit: 195 } }}>\n            {outlineList.map(({ value, label }) => (\n              <StyledMenuItem key={value} value={value} style={{ border: `2px solid ${value}` }}>\n                {label}\n              </StyledMenuItem>\n            ))}\n          </StyledSelect>\n        </StyledInputContainer>\n      </BaseContainer>\n    );\n  }\n}\n\nPalette.propTypes = {\n  fillColor: PropTypes.string.isRequired,\n  fillList: PropTypes.array.isRequired,\n  onFillColorChange: PropTypes.func.isRequired,\n  onOutlineColorChange: PropTypes.func.isRequired,\n  onPaintColorChange: PropTypes.func.isRequired,\n  outlineColor: PropTypes.string.isRequired,\n  outlineList: PropTypes.array.isRequired,\n  language: PropTypes.string,\n};\n\nexport default Palette;\n"],"mappings":"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","ignoreList":[]}

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

@@ -0,0 +1,80 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _react = _interopRequireDefault(require("react"));
+var _reactKonva = require("react-konva");
+var _drawableHelper = _interopRequireDefault(require("./drawable-helper"));
+class RectangleDrawable extends _drawableHelper.default {
+  constructor(_props) {
+    super(_props, RectangleDrawable.TYPE);
+    (0, _defineProperty2.default)(this, "handleDragEnd", (props, event) => {
+      const deltaX = this.startx - event.target.getX();
+      const deltaY = this.starty - event.target.getY();
+      this.startx = event.target.getX();
+      this.starty = event.target.getY();
+      this.x = this.x - deltaX;
+      this.y = this.y - deltaY;
+      props.handleSessionChange();
+    });
+    const {
+      startx,
+      starty,
+      x,
+      y
+    } = _props;
+    this.startx = startx;
+    this.starty = starty;
+    this.x = x || startx;
+    this.y = y || starty;
+    this.width = x - startx || 0;
+    this.height = y - starty || 0;
+  }
+  registerMovement(x, y) {
+    this.x = x;
+    this.y = y;
+    this.width = this.x - this.startx;
+    this.height = this.y - this.starty;
+  }
+  handleOnClick(props) {
+    const {
+      paint,
+      paintColor,
+      forceUpdate
+    } = props;
+    if (paint) {
+      this.paintColor = paintColor;
+      forceUpdate();
+    }
+  }
+  render(props) {
+    const {
+      draggable,
+      key,
+      onMouseOverElement,
+      onMouseOutElement
+    } = props;
+    return /*#__PURE__*/_react.default.createElement(_reactKonva.Rect, {
+      key: key,
+      height: this.height,
+      width: this.width,
+      fill: this.paintColor || this.fillColor,
+      onClick: () => this.handleOnClick(props),
+      onDragEnd: this.handleDragEnd.bind(this, props),
+      onMouseEnter: onMouseOverElement,
+      onMouseLeave: onMouseOutElement,
+      stroke: this.outlineColor,
+      draggable: draggable,
+      strokeWidth: 2,
+      x: this.startx,
+      y: this.starty
+    });
+  }
+}
+exports.default = RectangleDrawable;
+(0, _defineProperty2.default)(RectangleDrawable, "TYPE", 'RectangleDrawable');
+//# sourceMappingURL=drawable-rectangle.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"drawable-rectangle.js","names":["_react","_interopRequireDefault","require","_reactKonva","_drawableHelper","RectangleDrawable","DrawableHelper","constructor","props","TYPE","_defineProperty2","default","event","deltaX","startx","target","getX","deltaY","starty","getY","x","y","handleSessionChange","width","height","registerMovement","handleOnClick","paint","paintColor","forceUpdate","render","draggable","key","onMouseOverElement","onMouseOutElement","createElement","Rect","fill","fillColor","onClick","onDragEnd","handleDragEnd","bind","onMouseEnter","onMouseLeave","stroke","outlineColor","strokeWidth","exports"],"sources":["../../src/drawing-response/drawable-rectangle.jsx"],"sourcesContent":["import React from 'react';\nimport { Rect } from 'react-konva';\n\nimport DrawableHelper from './drawable-helper';\n\nexport default class RectangleDrawable extends DrawableHelper {\n  static TYPE = 'RectangleDrawable';\n  constructor(props) {\n    super(props, RectangleDrawable.TYPE);\n    const { startx, starty, x, y } = props;\n    this.startx = startx;\n    this.starty = starty;\n    this.x = x || startx;\n    this.y = y || starty;\n    this.width = x - startx || 0;\n    this.height = y - starty || 0;\n  }\n\n  registerMovement(x, y) {\n    this.x = x;\n    this.y = y;\n    this.width = this.x - this.startx;\n    this.height = this.y - this.starty;\n  }\n\n  handleOnClick(props) {\n    const { paint, paintColor, forceUpdate } = props;\n\n    if (paint) {\n      this.paintColor = paintColor;\n      forceUpdate();\n    }\n  }\n\n  handleDragEnd = (props, event) => {\n    const deltaX = this.startx - event.target.getX();\n    const deltaY = this.starty - event.target.getY();\n\n    this.startx = event.target.getX();\n    this.starty = event.target.getY();\n\n    this.x = this.x - deltaX;\n    this.y = this.y - deltaY;\n\n    props.handleSessionChange();\n  };\n\n  render(props) {\n    const { draggable, key, onMouseOverElement, onMouseOutElement } = props;\n\n    return (\n      <Rect\n        key={key}\n        height={this.height}\n        width={this.width}\n        fill={this.paintColor || this.fillColor}\n        onClick={() => this.handleOnClick(props)}\n        onDragEnd={this.handleDragEnd.bind(this, props)}\n        onMouseEnter={onMouseOverElement}\n        onMouseLeave={onMouseOutElement}\n        stroke={this.outlineColor}\n        draggable={draggable}\n        strokeWidth={2}\n        x={this.startx}\n        y={this.starty}\n      />\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

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

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

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

@@ -0,0 +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","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/lib/drawing-response/drawable-transformer.js

@@ -0,0 +1,52 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _react = _interopRequireDefault(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _reactKonva = require("react-konva");
+class TransformerComponent extends _react.default.Component {
+  componentDidMount() {
+    this.checkNode();
+  }
+  componentDidUpdate() {
+    this.checkNode();
+  }
+  checkNode() {
+    // here we need to manually attach or detach Transformer node
+    const stage = this.transformer.getStage();
+    const {
+      selectedShapeName
+    } = this.props;
+    const selectedNode = stage.findOne(`.${selectedShapeName}`);
+    // do nothing if selected node is already attached
+    if (selectedNode === this.transformer.node()) {
+      return;
+    }
+    if (selectedNode) {
+      // attach to another node
+      this.transformer.attachTo(selectedNode);
+    } else {
+      // remove transformer
+      this.transformer.detach();
+    }
+    this.transformer.getLayer().batchDraw();
+  }
+  render() {
+    return /*#__PURE__*/_react.default.createElement(_reactKonva.Transformer, (0, _extends2.default)({
+      ref: node => {
+        this.transformer = node;
+      },
+      enabledAnchors: ['middle-left', 'middle-right']
+    }, this.props));
+  }
+}
+TransformerComponent.propTypes = {
+  selectedShapeName: _propTypes.default.string.isRequired
+};
+var _default = exports.default = TransformerComponent;
+//# sourceMappingURL=drawable-transformer.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"drawable-transformer.js","names":["_react","_interopRequireDefault","require","_propTypes","_reactKonva","TransformerComponent","React","Component","componentDidMount","checkNode","componentDidUpdate","stage","transformer","getStage","selectedShapeName","props","selectedNode","findOne","node","attachTo","detach","getLayer","batchDraw","render","default","createElement","Transformer","_extends2","ref","enabledAnchors","propTypes","PropTypes","string","isRequired","_default","exports"],"sources":["../../src/drawing-response/drawable-transformer.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { Transformer } from 'react-konva';\n\nclass TransformerComponent extends React.Component {\n  componentDidMount() {\n    this.checkNode();\n  }\n\n  componentDidUpdate() {\n    this.checkNode();\n  }\n\n  checkNode() {\n    // here we need to manually attach or detach Transformer node\n    const stage = this.transformer.getStage();\n    const { selectedShapeName } = this.props;\n\n    const selectedNode = stage.findOne(`.${selectedShapeName}`);\n    // do nothing if selected node is already attached\n    if (selectedNode === this.transformer.node()) {\n      return;\n    }\n\n    if (selectedNode) {\n      // attach to another node\n      this.transformer.attachTo(selectedNode);\n    } else {\n      // remove transformer\n      this.transformer.detach();\n    }\n    this.transformer.getLayer().batchDraw();\n  }\n\n  render() {\n    return (\n      <Transformer\n        ref={(node) => {\n          this.transformer = node;\n        }}\n        enabledAnchors={['middle-left', 'middle-right']}\n        {...this.props}\n      />\n    );\n  }\n}\n\nTransformerComponent.propTypes = {\n  selectedShapeName: PropTypes.string.isRequired,\n};\n\nexport default TransformerComponent;\n"],"mappings":";;;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,UAAA,GAAAF,sBAAA,CAAAC,OAAA;AACA,IAAAE,WAAA,GAAAF,OAAA;AAEA,MAAMG,oBAAoB,SAASC,cAAK,CAACC,SAAS,CAAC;EACjDC,iBAAiBA,CAAA,EAAG;IAClB,IAAI,CAACC,SAAS,CAAC,CAAC;EAClB;EAEAC,kBAAkBA,CAAA,EAAG;IACnB,IAAI,CAACD,SAAS,CAAC,CAAC;EAClB;EAEAA,SAASA,CAAA,EAAG;IACV;IACA,MAAME,KAAK,GAAG,IAAI,CAACC,WAAW,CAACC,QAAQ,CAAC,CAAC;IACzC,MAAM;MAAEC;IAAkB,CAAC,GAAG,IAAI,CAACC,KAAK;IAExC,MAAMC,YAAY,GAAGL,KAAK,CAACM,OAAO,CAAC,IAAIH,iBAAiB,EAAE,CAAC;IAC3D;IACA,IAAIE,YAAY,KAAK,IAAI,CAACJ,WAAW,CAACM,IAAI,CAAC,CAAC,EAAE;MAC5C;IACF;IAEA,IAAIF,YAAY,EAAE;MAChB;MACA,IAAI,CAACJ,WAAW,CAACO,QAAQ,CAACH,YAAY,CAAC;IACzC,CAAC,MAAM;MACL;MACA,IAAI,CAACJ,WAAW,CAACQ,MAAM,CAAC,CAAC;IAC3B;IACA,IAAI,CAACR,WAAW,CAACS,QAAQ,CAAC,CAAC,CAACC,SAAS,CAAC,CAAC;EACzC;EAEAC,MAAMA,CAAA,EAAG;IACP,oBACEvB,MAAA,CAAAwB,OAAA,CAAAC,aAAA,CAACrB,WAAA,CAAAsB,WAAW,MAAAC,SAAA,CAAAH,OAAA;MACVI,GAAG,EAAGV,IAAI,IAAK;QACb,IAAI,CAACN,WAAW,GAAGM,IAAI;MACzB,CAAE;MACFW,cAAc,EAAE,CAAC,aAAa,EAAE,cAAc;IAAE,GAC5C,IAAI,CAACd,KAAK,CACf,CAAC;EAEN;AACF;AAEAV,oBAAoB,CAACyB,SAAS,GAAG;EAC/BhB,iBAAiB,EAAEiB,kBAAS,CAACC,MAAM,CAACC;AACtC,CAAC;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAX,OAAA,GAEanB,oBAAoB","ignoreList":[]}

package/lib/drawing-response/factory.js

@@ -0,0 +1,22 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _drawableFreePath = _interopRequireDefault(require("./drawable-free-path"));
+var _drawableLine = _interopRequireDefault(require("./drawable-line"));
+var _drawableRectangle = _interopRequireDefault(require("./drawable-rectangle"));
+var _drawableCircle = _interopRequireDefault(require("./drawable-circle"));
+var _drawableEraser = _interopRequireDefault(require("./drawable-eraser"));
+const DRAWABLES = [_drawableFreePath.default, _drawableLine.default, _drawableRectangle.default, _drawableCircle.default, _drawableEraser.default];
+var _default = (type, props) => {
+  const T = DRAWABLES.find(D => D.TYPE === type);
+  if (T) {
+    return new T(props);
+  }
+  throw new Error(`Can't find drawable for type: ${type} and props: ${JSON.stringify(props)}`);
+};
+exports.default = _default;
+//# sourceMappingURL=factory.js.map

package/lib/drawing-response/factory.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"factory.js","names":["_drawableFreePath","_interopRequireDefault","require","_drawableLine","_drawableRectangle","_drawableCircle","_drawableEraser","DRAWABLES","FreePathDrawable","LineDrawable","RectangleDrawable","CircleDrawable","EraserDrawable","_default","type","props","T","find","D","TYPE","Error","JSON","stringify","exports","default"],"sources":["../../src/drawing-response/factory.js"],"sourcesContent":["import FreePathDrawable from './drawable-free-path';\nimport LineDrawable from './drawable-line';\nimport RectangleDrawable from './drawable-rectangle';\nimport CircleDrawable from './drawable-circle';\nimport EraserDrawable from './drawable-eraser';\n\nconst DRAWABLES = [FreePathDrawable, LineDrawable, RectangleDrawable, CircleDrawable, EraserDrawable];\n\nexport default (type, props) => {\n  const T = DRAWABLES.find((D) => D.TYPE === type);\n\n  if (T) {\n    return new T(props);\n  }\n\n  throw new Error(`Can't find drawable for type: ${type} and props: ${JSON.stringify(props)}`);\n};\n"],"mappings":";;;;;;;AAAA,IAAAA,iBAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,aAAA,GAAAF,sBAAA,CAAAC,OAAA;AACA,IAAAE,kBAAA,GAAAH,sBAAA,CAAAC,OAAA;AACA,IAAAG,eAAA,GAAAJ,sBAAA,CAAAC,OAAA;AACA,IAAAI,eAAA,GAAAL,sBAAA,CAAAC,OAAA;AAEA,MAAMK,SAAS,GAAG,CAACC,yBAAgB,EAAEC,qBAAY,EAAEC,0BAAiB,EAAEC,uBAAc,EAAEC,uBAAc,CAAC;AAAC,IAAAC,QAAA,GAEvFA,CAACC,IAAI,EAAEC,KAAK,KAAK;EAC9B,MAAMC,CAAC,GAAGT,SAAS,CAACU,IAAI,CAAEC,CAAC,IAAKA,CAAC,CAACC,IAAI,KAAKL,IAAI,CAAC;EAEhD,IAAIE,CAAC,EAAE;IACL,OAAO,IAAIA,CAAC,CAACD,KAAK,CAAC;EACrB;EAEA,MAAM,IAAIK,KAAK,CAAC,iCAAiCN,IAAI,eAAeO,IAAI,CAACC,SAAS,CAACP,KAAK,CAAC,EAAE,CAAC;AAC9F,CAAC;AAAAQ,OAAA,CAAAC,OAAA,GAAAX,QAAA","ignoreList":[]}

package/lib/drawing-response/icon.js

@@ -0,0 +1,55 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _react2 = _interopRequireDefault(require("@mdi/react"));
+var _js = require("@mdi/js");
+const IconWrapper = ({
+  path
+}) => {
+  let iconPath;
+  switch (path) {
+    case 'mdiPencil':
+      iconPath = _js.mdiPencil;
+      break;
+    case 'mdiMinus':
+      iconPath = _js.mdiMinus;
+      break;
+    case 'mdiCircle':
+      iconPath = _js.mdiCircle;
+      break;
+    case 'mdiRectangle':
+      iconPath = _js.mdiRectangle;
+      break;
+    case 'mdiFormatColorText':
+      iconPath = _js.mdiFormatColorText;
+      break;
+    case 'mdiFormatColorFill':
+      iconPath = _js.mdiFormatColorFill;
+      break;
+    case 'mdiEraser':
+      iconPath = _js.mdiEraser;
+      break;
+    default:
+      iconPath = _js.mdiCursorDefault;
+      break;
+  }
+  return /*#__PURE__*/_react.default.createElement(_react2.default, {
+    path: iconPath,
+    size: 0.8,
+    rotate: 180,
+    horizontal: true,
+    vertical: true,
+    color: "#2B3963"
+  });
+};
+IconWrapper.propTypes = {
+  path: _propTypes.default.string.isRequired
+};
+var _default = exports.default = IconWrapper;
+//# sourceMappingURL=icon.js.map

package/lib/drawing-response/icon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"icon.js","names":["_react","_interopRequireDefault","require","_propTypes","_react2","_js","IconWrapper","path","iconPath","mdiPencil","mdiMinus","mdiCircle","mdiRectangle","mdiFormatColorText","mdiFormatColorFill","mdiEraser","mdiCursorDefault","default","createElement","size","rotate","horizontal","vertical","color","propTypes","PropTypes","string","isRequired","_default","exports"],"sources":["../../src/drawing-response/icon.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport Icon from '@mdi/react';\nimport {\n  mdiCursorDefault,\n  mdiPencil,\n  mdiMinus,\n  mdiRectangle,\n  mdiCircle,\n  mdiFormatColorText,\n  mdiFormatColorFill,\n  mdiEraser,\n} from '@mdi/js';\n\nconst IconWrapper = ({ path }) => {\n  let iconPath;\n\n  switch (path) {\n    case 'mdiPencil':\n      iconPath = mdiPencil;\n      break;\n    case 'mdiMinus':\n      iconPath = mdiMinus;\n      break;\n    case 'mdiCircle':\n      iconPath = mdiCircle;\n      break;\n    case 'mdiRectangle':\n      iconPath = mdiRectangle;\n      break;\n    case 'mdiFormatColorText':\n      iconPath = mdiFormatColorText;\n      break;\n    case 'mdiFormatColorFill':\n      iconPath = mdiFormatColorFill;\n      break;\n    case 'mdiEraser':\n      iconPath = mdiEraser;\n      break;\n    default:\n      iconPath = mdiCursorDefault;\n      break;\n  }\n\n  return <Icon path={iconPath} size={0.8} rotate={180} horizontal vertical color=\"#2B3963\" />;\n};\n\nIconWrapper.propTypes = {\n  path: PropTypes.string.isRequired,\n};\n\nexport default IconWrapper;\n"],"mappings":";;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,UAAA,GAAAF,sBAAA,CAAAC,OAAA;AACA,IAAAE,OAAA,GAAAH,sBAAA,CAAAC,OAAA;AACA,IAAAG,GAAA,GAAAH,OAAA;AAWA,MAAMI,WAAW,GAAGA,CAAC;EAAEC;AAAK,CAAC,KAAK;EAChC,IAAIC,QAAQ;EAEZ,QAAQD,IAAI;IACV,KAAK,WAAW;MACdC,QAAQ,GAAGC,aAAS;MACpB;IACF,KAAK,UAAU;MACbD,QAAQ,GAAGE,YAAQ;MACnB;IACF,KAAK,WAAW;MACdF,QAAQ,GAAGG,aAAS;MACpB;IACF,KAAK,cAAc;MACjBH,QAAQ,GAAGI,gBAAY;MACvB;IACF,KAAK,oBAAoB;MACvBJ,QAAQ,GAAGK,sBAAkB;MAC7B;IACF,KAAK,oBAAoB;MACvBL,QAAQ,GAAGM,sBAAkB;MAC7B;IACF,KAAK,WAAW;MACdN,QAAQ,GAAGO,aAAS;MACpB;IACF;MACEP,QAAQ,GAAGQ,oBAAgB;MAC3B;EACJ;EAEA,oBAAOhB,MAAA,CAAAiB,OAAA,CAAAC,aAAA,CAACd,OAAA,CAAAa,OAAI;IAACV,IAAI,EAAEC,QAAS;IAACW,IAAI,EAAE,GAAI;IAACC,MAAM,EAAE,GAAI;IAACC,UAAU;IAACC,QAAQ;IAACC,KAAK,EAAC;EAAS,CAAE,CAAC;AAC7F,CAAC;AAEDjB,WAAW,CAACkB,SAAS,GAAG;EACtBjB,IAAI,EAAEkB,kBAAS,CAACC,MAAM,CAACC;AACzB,CAAC;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAZ,OAAA,GAEaX,WAAW","ignoreList":[]}