@pie-element/drawing-response 4.6.1-beta.1 → 4.6.1-beta.4

package/lib/drawing-response/container.js

@@ -0,0 +1,298 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.Container = void 0;
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _react = _interopRequireWildcard(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _styles = require("@material-ui/core/styles");
+var _constants = _interopRequireDefault(require("./constants"));
+var _button = _interopRequireDefault(require("./button"));
+var _drawablePalette = _interopRequireDefault(require("./drawable-palette"));
+var _drawableMain = _interopRequireDefault(require("./drawable-main"));
+var _drawableText = _interopRequireDefault(require("./drawable-text"));
+var _icon = _interopRequireDefault(require("./icon"));
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+var TOOLS = _constants["default"].tools;
+var ROGVAIV = ['red', 'orange', 'yellow', 'violet', 'blue', 'green', 'white', 'black'].map(function (c) {
+  return {
+    value: c,
+    label: c
+  };
+});
+var Container = /*#__PURE__*/function (_Component) {
+  (0, _inherits2["default"])(Container, _Component);
+  var _super = _createSuper(Container);
+  function Container(props) {
+    var _this;
+    (0, _classCallCheck2["default"])(this, Container);
+    _this = _super.call(this, props);
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "checkIfToolIsDisabled", function (type) {
+      if (_this.props.disabled) return true;
+      var toolActive = _this.state.toolActive;
+      // Text will never be disabled since on each "Text Entry" click a new text is added
+      if (type === 'Text') {
+        return false;
+      }
+      return type === toolActive.type;
+    });
+    var TextEntry = new _drawableText["default"]();
+    _this.state = {
+      scale: 1,
+      drawableDimensions: {
+        height: 0,
+        width: 0
+      },
+      toolActive: TOOLS[0],
+      fillColor: 'white',
+      fillColorList: [{
+        value: 'transparent',
+        label: 'no fill'
+      }, {
+        value: 'lightblue',
+        label: 'light blue'
+      }, {
+        value: 'lightyellow',
+        label: 'light yellow'
+      }].concat((0, _toConsumableArray2["default"])(ROGVAIV)),
+      outlineColor: 'black',
+      outlineColorList: ROGVAIV,
+      paintColor: 'red',
+      paintColorList: ROGVAIV,
+      TextEntry: TextEntry
+    };
+    return _this;
+  }
+  (0, _createClass2["default"])(Container, [{
+    key: "setDimensions",
+    value: function setDimensions() {
+      var _this2 = this;
+      var checkExist = setInterval(function () {
+        try {
+          var _this2$drawable$getBo = _this2.drawable.getBoundingClientRect(),
+            height = _this2$drawable$getBo.height,
+            width = _this2$drawable$getBo.width;
+          if (height !== 0 && width !== 0) {
+            _this2.setState({
+              drawableDimensions: {
+                height: height,
+                width: width
+              }
+            });
+          }
+        } catch (e) {
+          // eslint-disable-next-line no-console
+          console.warn('setDimensions Error: ', e);
+        } finally {
+          clearInterval(checkExist);
+        }
+      }, 100);
+    }
+  }, {
+    key: "componentDidMount",
+    value: function componentDidMount() {
+      var _this3 = this;
+      this.setDimensions();
+      this.observer = new MutationObserver(function (mutations) {
+        mutations.forEach(function () {
+          var _document$getElementB;
+          var target = (_document$getElementB = document.getElementById('question-container')) === null || _document$getElementB === void 0 || (_document$getElementB = _document$getElementB.style) === null || _document$getElementB === void 0 ? void 0 : _document$getElementB.cssText;
+          var zoom = target === null || target === void 0 ? void 0 : target.substring(target.indexOf('--pie-zoom') + 11, target.lastIndexOf('%'));
+          var zoomParsed = zoom === null || zoom === void 0 ? void 0 : zoom.replace(/\s/g, '');
+          if (zoomParsed) {
+            var newScale = parseFloat(zoomParsed) / 100;
+            if (newScale !== _this3.state.scale) {
+              _this3.setState({
+                scale: parseFloat(zoomParsed) / 100
+              });
+            }
+          } else if (!zoomParsed && _this3.state.scale !== 1) {
+            _this3.setState({
+              scale: 1
+            });
+          }
+        });
+      });
+      var target = document.getElementById('question-container');
+      if (target) {
+        this.observer.observe(target, {
+          attributes: true,
+          attributeFilter: ['style']
+        });
+      }
+    }
+  }, {
+    key: "componentWillUnmount",
+    value: function componentWillUnmount() {
+      var _this$observer;
+      var TextEntry = this.state.TextEntry;
+      TextEntry.removeEventListeners();
+      (_this$observer = this.observer) === null || _this$observer === void 0 ? void 0 : _this$observer.disconnect();
+    }
+  }, {
+    key: "handleMakeToolActive",
+    value: function handleMakeToolActive(tool) {
+      var TextEntry = this.state.TextEntry;
+      var type = tool.type;
+      if (type !== 'Text') {
+        this.setState({
+          toolActive: tool
+        });
+      } else {
+        TextEntry.addNewTextEntry();
+        // Force update
+        this.setState({
+          updatedAt: new Date()
+        });
+      }
+    }
+  }, {
+    key: "handleColorChange",
+    value: function handleColorChange(type, color) {
+      var cType = "".concat(type, "Color");
+      this.setState((0, _defineProperty2["default"])({}, cType, color));
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var _this4 = this;
+      var _this$props = this.props,
+        classes = _this$props.classes,
+        disabled = _this$props.disabled,
+        imageUrl = _this$props.imageUrl,
+        imageDimensions = _this$props.imageDimensions,
+        onSessionChange = _this$props.onSessionChange,
+        session = _this$props.session,
+        backgroundImageEnabled = _this$props.backgroundImageEnabled;
+      var _this$state = this.state,
+        drawableDimensions = _this$state.drawableDimensions,
+        toolActive = _this$state.toolActive,
+        fillColor = _this$state.fillColor,
+        fillColorList = _this$state.fillColorList,
+        outlineColor = _this$state.outlineColor,
+        outlineColorList = _this$state.outlineColorList,
+        paintColor = _this$state.paintColor,
+        paintColorList = _this$state.paintColorList,
+        TextEntry = _this$state.TextEntry;
+      var heightToUse = drawableDimensions.height * this.state.scale;
+      return /*#__PURE__*/_react["default"].createElement("div", {
+        className: classes.base
+      }, !disabled && /*#__PURE__*/_react["default"].createElement(_drawablePalette["default"], {
+        fillColor: fillColor,
+        fillList: fillColorList,
+        outlineColor: outlineColor,
+        outlineList: outlineColorList,
+        paintColor: paintColor,
+        paintList: paintColorList,
+        onFillColorChange: function onFillColorChange(color) {
+          return _this4.handleColorChange('fill', color);
+        },
+        onOutlineColorChange: function onOutlineColorChange(color) {
+          return _this4.handleColorChange('outline', color);
+        },
+        onPaintColorChange: function onPaintColorChange(color) {
+          return _this4.handleColorChange('paint', color);
+        }
+      }), /*#__PURE__*/_react["default"].createElement("div", {
+        className: classes.box
+      }, /*#__PURE__*/_react["default"].createElement("div", {
+        className: classes.toolbar
+      }, TOOLS.map(function (tool) {
+        var type = tool.type,
+          label = tool.label,
+          icon = tool.icon;
+        return /*#__PURE__*/_react["default"].createElement(_button["default"], {
+          title: label,
+          key: type,
+          disabled: _this4.checkIfToolIsDisabled(type),
+          onClick: function onClick() {
+            return _this4.handleMakeToolActive(tool);
+          },
+          label: /*#__PURE__*/_react["default"].createElement(_icon["default"], {
+            path: icon
+          })
+        });
+      })), /*#__PURE__*/_react["default"].createElement("div", {
+        ref: function ref(drawable) {
+          _this4.drawable = drawable;
+        },
+        className: classes.drawableHeight,
+        style: {
+          height: heightToUse,
+          maxHeight: heightToUse
+        }
+      }, /*#__PURE__*/_react["default"].createElement(_drawableMain["default"], {
+        scale: this.state.scale,
+        session: session,
+        disabled: disabled,
+        onSessionChange: onSessionChange,
+        fillColor: fillColor,
+        outlineColor: outlineColor,
+        paintColor: paintColor,
+        imageUrl: imageUrl,
+        drawableDimensions: drawableDimensions,
+        imageDimensions: imageDimensions,
+        toolActive: toolActive,
+        TextEntry: TextEntry,
+        backgroundImageEnabled: backgroundImageEnabled
+      }))));
+    }
+  }]);
+  return Container;
+}(_react.Component);
+exports.Container = Container;
+(0, _defineProperty2["default"])(Container, "propTypes", {
+  classes: _propTypes["default"].object.isRequired,
+  disabled: _propTypes["default"].bool,
+  session: _propTypes["default"].object.isRequired,
+  onSessionChange: _propTypes["default"].func.isRequired,
+  imageDimensions: _propTypes["default"].object.isRequired,
+  imageUrl: _propTypes["default"].string.isRequired,
+  backgroundImageEnabled: _propTypes["default"].bool.isRequired
+});
+var styles = function styles(theme) {
+  return {
+    base: {
+      marginTop: theme.spacing.unit * 2
+    },
+    box: {
+      border: '1px solid #E0E1E6',
+      borderRadius: '5px',
+      marginTop: theme.spacing.unit * 2,
+      backgroundColor: '#ECEDF1'
+    },
+    drawableHeight: {
+      minHeight: 350,
+      backgroundColor: '#fff'
+    },
+    toolbar: {
+      borderBottom: '1px solid #E0E1E6',
+      borderTopLeftRadius: '5px',
+      borderTopRightRadius: '5px',
+      padding: '12px 8px 4px',
+      boxSizing: 'border-box',
+      maxWidth: 'calc(100% - 163px)',
+      // 163px is the width set on undoControls
+      '& button': {
+        marginBottom: '8px'
+      }
+    }
+  };
+};
+var _default = (0, _styles.withStyles)(styles)(Container);
+exports["default"] = _default;
+//# sourceMappingURL=container.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"container.js","names":["_react","_interopRequireWildcard","require","_propTypes","_interopRequireDefault","_styles","_constants","_button","_drawablePalette","_drawableMain","_drawableText","_icon","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","_typeof","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","_createSuper","Derived","hasNativeReflectConstruct","_isNativeReflectConstruct","_createSuperInternal","Super","_getPrototypeOf2","result","NewTarget","constructor","Reflect","construct","arguments","apply","_possibleConstructorReturn2","sham","Proxy","Boolean","valueOf","e","TOOLS","constants","tools","ROGVAIV","map","c","value","label","Container","_Component","_inherits2","_super","props","_this","_classCallCheck2","_defineProperty2","_assertThisInitialized2","type","disabled","toolActive","state","TextEntry","DrawableText","scale","drawableDimensions","height","width","fillColor","fillColorList","concat","_toConsumableArray2","outlineColor","outlineColorList","paintColor","paintColorList","_createClass2","setDimensions","_this2","checkExist","setInterval","_this2$drawable$getBo","drawable","getBoundingClientRect","setState","console","warn","clearInterval","componentDidMount","_this3","observer","MutationObserver","mutations","forEach","_document$getElementB","target","document","getElementById","style","cssText","zoom","substring","indexOf","lastIndexOf","zoomParsed","replace","newScale","parseFloat","observe","attributes","attributeFilter","componentWillUnmount","_this$observer","removeEventListeners","disconnect","handleMakeToolActive","tool","addNewTextEntry","updatedAt","Date","handleColorChange","color","cType","render","_this4","_this$props","classes","imageUrl","imageDimensions","onSessionChange","session","backgroundImageEnabled","_this$state","heightToUse","createElement","className","base","fillList","outlineList","paintList","onFillColorChange","onOutlineColorChange","onPaintColorChange","box","toolbar","icon","title","checkIfToolIsDisabled","onClick","path","ref","drawableHeight","maxHeight","Component","exports","PropTypes","object","isRequired","bool","func","string","styles","theme","marginTop","spacing","unit","border","borderRadius","backgroundColor","minHeight","borderBottom","borderTopLeftRadius","borderTopRightRadius","padding","boxSizing","maxWidth","marginBottom","_default","withStyles"],"sources":["../../src/drawing-response/container.jsx"],"sourcesContent":["import React, { Component } from 'react';\nimport PropTypes from 'prop-types';\nimport { withStyles } from '@material-ui/core/styles';\n\nimport constants from './constants';\nimport Button from './button';\nimport DrawablePalette from './drawable-palette';\nimport DrawableMain from './drawable-main';\nimport DrawableText from './drawable-text';\nimport Icon from './icon';\n\nconst { tools: TOOLS } = constants;\n\nconst ROGVAIV = ['red', 'orange', 'yellow', 'violet', 'blue', 'green', 'white', 'black'].map((c) => ({\n  value: c,\n  label: c,\n}));\n\nexport class Container extends Component {\n  static propTypes = {\n    classes: PropTypes.object.isRequired,\n    disabled: PropTypes.bool,\n    session: PropTypes.object.isRequired,\n    onSessionChange: PropTypes.func.isRequired,\n    imageDimensions: PropTypes.object.isRequired,\n    imageUrl: PropTypes.string.isRequired,\n    backgroundImageEnabled: PropTypes.bool.isRequired,\n  };\n\n  constructor(props) {\n    super(props);\n    const TextEntry = new DrawableText();\n\n    this.state = {\n      scale: 1,\n      drawableDimensions: {\n        height: 0,\n        width: 0,\n      },\n      toolActive: TOOLS[0],\n      fillColor: 'white',\n      fillColorList: [\n        { value: 'transparent', label: 'no fill' },\n        { value: 'lightblue', label: 'light blue' },\n        { value: 'lightyellow', label: 'light yellow' },\n        ...ROGVAIV,\n      ],\n      outlineColor: 'black',\n      outlineColorList: ROGVAIV,\n      paintColor: 'red',\n      paintColorList: ROGVAIV,\n      TextEntry,\n    };\n  }\n\n  setDimensions() {\n    const checkExist = setInterval(() => {\n      try {\n        const { height, width } = this.drawable.getBoundingClientRect();\n        if (height !== 0 && width !== 0) {\n          this.setState({\n            drawableDimensions: {\n              height,\n              width,\n            },\n          });\n        }\n      } catch (e) {\n        // eslint-disable-next-line no-console\n        console.warn('setDimensions Error: ', e);\n      } finally {\n        clearInterval(checkExist);\n      }\n    }, 100);\n  }\n\n  componentDidMount() {\n    this.setDimensions();\n\n    this.observer = new MutationObserver((mutations) => {\n      mutations.forEach(() => {\n        const target = document.getElementById('question-container')?.style?.cssText;\n        const zoom = target?.substring(target.indexOf('--pie-zoom') + 11, target.lastIndexOf('%'));\n        const zoomParsed = zoom?.replace(/\\s/g, '');\n\n        if (zoomParsed) {\n          const newScale = parseFloat(zoomParsed) / 100;\n          if (newScale !== this.state.scale) {\n            this.setState({\n              scale: parseFloat(zoomParsed) / 100,\n            });\n          }\n        } else if (!zoomParsed && this.state.scale !== 1) {\n          this.setState({\n            scale: 1,\n          });\n        }\n      });\n    });\n\n    const target = document.getElementById('question-container');\n    if (target) {\n      this.observer.observe(target, { attributes: true, attributeFilter: ['style'] });\n    }\n  }\n\n  componentWillUnmount() {\n    const { TextEntry } = this.state;\n\n    TextEntry.removeEventListeners();\n    this.observer?.disconnect();\n  }\n\n  handleMakeToolActive(tool) {\n    const { TextEntry } = this.state;\n    const { type } = tool;\n\n    if (type !== 'Text') {\n      this.setState({\n        toolActive: tool,\n      });\n    } else {\n      TextEntry.addNewTextEntry();\n      // Force update\n      this.setState({\n        updatedAt: new Date(),\n      });\n    }\n  }\n\n  checkIfToolIsDisabled = (type) => {\n    if (this.props.disabled) return true;\n\n    const { toolActive } = this.state;\n    // Text will never be disabled since on each \"Text Entry\" click a new text is added\n    if (type === 'Text') {\n      return false;\n    }\n    return type === toolActive.type;\n  };\n\n  handleColorChange(type, color) {\n    const cType = `${type}Color`;\n    this.setState({\n      [cType]: color,\n    });\n  }\n\n  render() {\n    const { classes, disabled, imageUrl, imageDimensions, onSessionChange, session, backgroundImageEnabled } =\n      this.props;\n    const {\n      drawableDimensions,\n      toolActive,\n      fillColor,\n      fillColorList,\n      outlineColor,\n      outlineColorList,\n      paintColor,\n      paintColorList,\n      TextEntry,\n    } = this.state;\n\n    const heightToUse = drawableDimensions.height * this.state.scale;\n\n    return (\n      <div className={classes.base}>\n        {!disabled && (\n          <DrawablePalette\n            fillColor={fillColor}\n            fillList={fillColorList}\n            outlineColor={outlineColor}\n            outlineList={outlineColorList}\n            paintColor={paintColor}\n            paintList={paintColorList}\n            onFillColorChange={(color) => this.handleColorChange('fill', color)}\n            onOutlineColorChange={(color) => this.handleColorChange('outline', color)}\n            onPaintColorChange={(color) => this.handleColorChange('paint', color)}\n          />\n        )}\n\n        <div className={classes.box}>\n          <div className={classes.toolbar}>\n            {TOOLS.map((tool) => {\n              const { type, label, icon } = tool;\n\n              return (\n                <Button\n                  title={label}\n                  key={type}\n                  disabled={this.checkIfToolIsDisabled(type)}\n                  onClick={() => this.handleMakeToolActive(tool)}\n                  label={<Icon path={icon} />}\n                />\n              );\n            })}\n          </div>\n\n          <div\n            ref={(drawable) => {\n              this.drawable = drawable;\n            }}\n            className={classes.drawableHeight}\n            style={{ height: heightToUse, maxHeight: heightToUse }}\n          >\n            <DrawableMain\n              scale={this.state.scale}\n              session={session}\n              disabled={disabled}\n              onSessionChange={onSessionChange}\n              fillColor={fillColor}\n              outlineColor={outlineColor}\n              paintColor={paintColor}\n              imageUrl={imageUrl}\n              drawableDimensions={drawableDimensions}\n              imageDimensions={imageDimensions}\n              toolActive={toolActive}\n              TextEntry={TextEntry}\n              backgroundImageEnabled={backgroundImageEnabled}\n            />\n          </div>\n        </div>\n      </div>\n    );\n  }\n}\n\nconst styles = (theme) => ({\n  base: {\n    marginTop: theme.spacing.unit * 2,\n  },\n  box: {\n    border: '1px solid #E0E1E6',\n    borderRadius: '5px',\n    marginTop: theme.spacing.unit * 2,\n    backgroundColor: '#ECEDF1',\n  },\n  drawableHeight: {\n    minHeight: 350,\n    backgroundColor: '#fff',\n  },\n  toolbar: {\n    borderBottom: '1px solid #E0E1E6',\n    borderTopLeftRadius: '5px',\n    borderTopRightRadius: '5px',\n    padding: '12px 8px 4px',\n    boxSizing: 'border-box',\n    maxWidth: 'calc(100% - 163px)', // 163px is the width set on undoControls\n    '& button': {\n      marginBottom: '8px',\n    },\n  },\n});\n\nexport default withStyles(styles)(Container);\n"],"mappings":"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"}

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

@@ -0,0 +1,98 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _react = _interopRequireDefault(require("react"));
+var _reactKonva = require("react-konva");
+var _drawableHelper = _interopRequireDefault(require("./drawable-helper"));
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+var CircleDrawable = /*#__PURE__*/function (_DrawableHelper) {
+  (0, _inherits2["default"])(CircleDrawable, _DrawableHelper);
+  var _super = _createSuper(CircleDrawable);
+  function CircleDrawable(_props) {
+    var _this;
+    (0, _classCallCheck2["default"])(this, CircleDrawable);
+    _this = _super.call(this, _props, CircleDrawable.TYPE);
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleDragEnd", function (props, event) {
+      var deltaX = _this.startx - event.target.getX();
+      var 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();
+    });
+    var startx = _props.startx,
+      starty = _props.starty,
+      x = _props.x,
+      y = _props.y;
+    _this.startx = startx;
+    _this.starty = starty;
+    _this.x = x || startx;
+    _this.y = y || starty;
+    var dx = _this.startx - _this.x;
+    var dy = _this.starty - _this.y;
+    _this.radius = Math.sqrt(dx * dx + dy * dy);
+    return _this;
+  }
+  (0, _createClass2["default"])(CircleDrawable, [{
+    key: "registerMovement",
+    value: function registerMovement(x, y) {
+      this.x = x;
+      this.y = y;
+      var dx = this.startx - this.x;
+      var dy = this.starty - this.y;
+      this.radius = Math.sqrt(dx * dx + dy * dy);
+    }
+  }, {
+    key: "handleOnClick",
+    value: function handleOnClick(props) {
+      var paint = props.paint,
+        paintColor = props.paintColor,
+        forceUpdate = props.forceUpdate;
+      if (paint) {
+        this.paintColor = paintColor;
+        forceUpdate();
+      }
+    }
+  }, {
+    key: "render",
+    value: function render(props) {
+      var _this2 = this;
+      var draggable = props.draggable,
+        key = props.key,
+        onMouseOverElement = props.onMouseOverElement,
+        onMouseOutElement = props.onMouseOutElement;
+      return /*#__PURE__*/_react["default"].createElement(_reactKonva.Circle, {
+        key: key,
+        draggable: draggable,
+        radius: this.radius,
+        x: this.startx,
+        y: this.starty,
+        fill: this.paintColor || this.fillColor,
+        onClick: function onClick() {
+          return _this2.handleOnClick(props);
+        },
+        onDragEnd: this.handleDragEnd.bind(this, props),
+        onMouseEnter: onMouseOverElement,
+        onMouseLeave: onMouseOutElement,
+        stroke: this.outlineColor
+      });
+    }
+  }]);
+  return CircleDrawable;
+}(_drawableHelper["default"]);
+exports["default"] = CircleDrawable;
+(0, _defineProperty2["default"])(CircleDrawable, "TYPE", 'CircleDrawable');
+//# sourceMappingURL=drawable-circle.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"drawable-circle.js","names":["_react","_interopRequireDefault","require","_reactKonva","_drawableHelper","_createSuper","Derived","hasNativeReflectConstruct","_isNativeReflectConstruct","_createSuperInternal","Super","_getPrototypeOf2","result","NewTarget","constructor","Reflect","construct","arguments","apply","_possibleConstructorReturn2","sham","Proxy","Boolean","prototype","valueOf","call","e","CircleDrawable","_DrawableHelper","_inherits2","_super","props","_this","_classCallCheck2","TYPE","_defineProperty2","_assertThisInitialized2","event","deltaX","startx","target","getX","deltaY","starty","getY","x","y","handleSessionChange","dx","dy","radius","Math","sqrt","_createClass2","key","value","registerMovement","handleOnClick","paint","paintColor","forceUpdate","render","_this2","draggable","onMouseOverElement","onMouseOutElement","createElement","Circle","fill","fillColor","onClick","onDragEnd","handleDragEnd","bind","onMouseEnter","onMouseLeave","stroke","outlineColor","DrawableHelper","exports"],"sources":["../../src/drawing-response/drawable-circle.jsx"],"sourcesContent":["import React from 'react';\nimport { Circle } from 'react-konva';\n\nimport DrawableHelper from './drawable-helper';\n\nexport default class CircleDrawable extends DrawableHelper {\n  static TYPE = 'CircleDrawable';\n  constructor(props) {\n    super(props, CircleDrawable.TYPE);\n    const { startx, starty, x, y } = props;\n\n    this.startx = startx;\n    this.starty = starty;\n    this.x = x || startx;\n    this.y = y || starty;\n\n    const dx = this.startx - this.x;\n    const dy = this.starty - this.y;\n\n    this.radius = Math.sqrt(dx * dx + dy * dy);\n  }\n\n  registerMovement(x, y) {\n    this.x = x;\n    this.y = y;\n\n    const dx = this.startx - this.x;\n    const dy = this.starty - this.y;\n\n    this.radius = Math.sqrt(dx * dx + dy * dy);\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      <Circle\n        key={key}\n        draggable={draggable}\n        radius={this.radius}\n        x={this.startx}\n        y={this.starty}\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      />\n    );\n  }\n}\n"],"mappings":"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"}

package/lib/drawing-response/drawable-eraser.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 _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _react = _interopRequireDefault(require("react"));
+var _reactKonva = require("react-konva");
+var _drawableHelper = _interopRequireDefault(require("./drawable-helper"));
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+var EraserDrawable = /*#__PURE__*/function (_DrawableHelper) {
+  (0, _inherits2["default"])(EraserDrawable, _DrawableHelper);
+  var _super = _createSuper(EraserDrawable);
+  function EraserDrawable(_props) {
+    var _this;
+    (0, _classCallCheck2["default"])(this, EraserDrawable);
+    _this = _super.call(this, _props, EraserDrawable.TYPE);
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleDragEnd", function (props, event) {
+      _this.posX = event.target.getX();
+      _this.posY = event.target.getY();
+      props.handleSessionChange();
+    });
+    var startx = _props.startx,
+      starty = _props.starty,
+      points = _props.points,
+      posX = _props.posX,
+      posY = _props.posY;
+    _this.points = points || [startx, starty];
+    _this.posX = posX || 0;
+    _this.posY = posY || 0;
+    return _this;
+  }
+  (0, _createClass2["default"])(EraserDrawable, [{
+    key: "registerMovement",
+    value: function registerMovement(x, y) {
+      this.points = [].concat((0, _toConsumableArray2["default"])(this.points), [x, y]);
+    }
+  }, {
+    key: "render",
+    value: function render(props) {
+      var draggable = props.draggable,
+        key = props.key,
+        onMouseOverElement = props.onMouseOverElement,
+        onMouseOutElement = props.onMouseOutElement;
+      return /*#__PURE__*/_react["default"].createElement(_reactKonva.Line, {
+        key: key,
+        draggable: draggable,
+        globalCompositeOperation: "destination-out",
+        tension: 0,
+        bezier: true,
+        points: this.points,
+        onDragEnd: this.handleDragEnd.bind(this, props),
+        onMouseEnter: onMouseOverElement,
+        onMouseLeave: onMouseOutElement,
+        strokeStyle: "#df4b26",
+        lineJoin: "round",
+        lineWidth: "5",
+        fill: "white",
+        stroke: "white",
+        strokeWidth: 5,
+        x: this.posX,
+        y: this.posY
+      });
+    }
+  }]);
+  return EraserDrawable;
+}(_drawableHelper["default"]);
+exports["default"] = EraserDrawable;
+(0, _defineProperty2["default"])(EraserDrawable, "TYPE", 'EraserDrawable');
+//# sourceMappingURL=drawable-eraser.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"drawable-eraser.js","names":["_react","_interopRequireDefault","require","_reactKonva","_drawableHelper","_createSuper","Derived","hasNativeReflectConstruct","_isNativeReflectConstruct","_createSuperInternal","Super","_getPrototypeOf2","result","NewTarget","constructor","Reflect","construct","arguments","apply","_possibleConstructorReturn2","sham","Proxy","Boolean","prototype","valueOf","call","e","EraserDrawable","_DrawableHelper","_inherits2","_super","props","_this","_classCallCheck2","TYPE","_defineProperty2","_assertThisInitialized2","event","posX","target","getX","posY","getY","handleSessionChange","startx","starty","points","_createClass2","key","value","registerMovement","x","y","concat","_toConsumableArray2","render","draggable","onMouseOverElement","onMouseOutElement","createElement","Line","globalCompositeOperation","tension","bezier","onDragEnd","handleDragEnd","bind","onMouseEnter","onMouseLeave","strokeStyle","lineJoin","lineWidth","fill","stroke","strokeWidth","DrawableHelper","exports"],"sources":["../../src/drawing-response/drawable-eraser.jsx"],"sourcesContent":["import React from 'react';\nimport { Line } from 'react-konva';\n\nimport DrawableHelper from './drawable-helper';\n\nexport default class EraserDrawable extends DrawableHelper {\n  static TYPE = 'EraserDrawable';\n  constructor(props) {\n    super(props, EraserDrawable.TYPE);\n    const { startx, starty, points, posX, posY } = props;\n\n    this.points = points || [startx, starty];\n    this.posX = posX || 0;\n    this.posY = posY || 0;\n  }\n\n  registerMovement(x, y) {\n    this.points = [...this.points, x, y];\n  }\n\n  handleDragEnd = (props, event) => {\n    this.posX = event.target.getX();\n    this.posY = event.target.getY();\n\n    props.handleSessionChange();\n  };\n\n  render(props) {\n    const { draggable, key, onMouseOverElement, onMouseOutElement } = props;\n\n    return (\n      <Line\n        key={key}\n        draggable={draggable}\n        globalCompositeOperation=\"destination-out\"\n        tension={0}\n        bezier={true}\n        points={this.points}\n        onDragEnd={this.handleDragEnd.bind(this, props)}\n        onMouseEnter={onMouseOverElement}\n        onMouseLeave={onMouseOutElement}\n        strokeStyle=\"#df4b26\"\n        lineJoin=\"round\"\n        lineWidth=\"5\"\n        fill=\"white\"\n        stroke=\"white\"\n        strokeWidth={5}\n        x={this.posX}\n        y={this.posY}\n      />\n    );\n  }\n}\n"],"mappings":"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"}

package/lib/drawing-response/drawable-free-path.js

@@ -0,0 +1,90 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _react = _interopRequireDefault(require("react"));
+var _reactKonva = require("react-konva");
+var _drawableHelper = _interopRequireDefault(require("./drawable-helper"));
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+var FreePathDrawable = /*#__PURE__*/function (_DrawableHelper) {
+  (0, _inherits2["default"])(FreePathDrawable, _DrawableHelper);
+  var _super = _createSuper(FreePathDrawable);
+  function FreePathDrawable(_props) {
+    var _this;
+    (0, _classCallCheck2["default"])(this, FreePathDrawable);
+    _this = _super.call(this, _props, FreePathDrawable.TYPE);
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleDragEnd", function (props, event) {
+      _this.posX = event.target.getX();
+      _this.posY = event.target.getY();
+      props.handleSessionChange();
+    });
+    var startx = _props.startx,
+      starty = _props.starty,
+      points = _props.points,
+      posX = _props.posX,
+      posY = _props.posY;
+    _this.points = points || [startx, starty];
+    _this.posX = posX || 0;
+    _this.posY = posY || 0;
+    return _this;
+  }
+  (0, _createClass2["default"])(FreePathDrawable, [{
+    key: "registerMovement",
+    value: function registerMovement(x, y) {
+      this.points = [].concat((0, _toConsumableArray2["default"])(this.points), [x, y]);
+    }
+  }, {
+    key: "handleOnClick",
+    value: function handleOnClick(props) {
+      var paint = props.paint,
+        paintColor = props.paintColor,
+        forceUpdate = props.forceUpdate;
+      if (paint) {
+        this.paintColor = paintColor;
+        forceUpdate();
+      }
+    }
+  }, {
+    key: "render",
+    value: function render(props) {
+      var _this2 = this;
+      var draggable = props.draggable,
+        key = props.key,
+        onMouseOverElement = props.onMouseOverElement,
+        onMouseOutElement = props.onMouseOutElement;
+      return /*#__PURE__*/_react["default"].createElement(_reactKonva.Line, {
+        key: key,
+        draggable: draggable,
+        tension: 0,
+        bezier: true,
+        points: this.points,
+        fill: this.paintColor || this.fillColor,
+        onClick: function onClick() {
+          return _this2.handleOnClick(props);
+        },
+        onDragEnd: this.handleDragEnd.bind(this, props),
+        onMouseEnter: onMouseOverElement,
+        onMouseLeave: onMouseOutElement,
+        stroke: this.paintColor || this.outlineColor,
+        x: this.posX,
+        y: this.posY
+      });
+    }
+  }]);
+  return FreePathDrawable;
+}(_drawableHelper["default"]);
+exports["default"] = FreePathDrawable;
+(0, _defineProperty2["default"])(FreePathDrawable, "TYPE", 'FreePathDrawable');
+//# sourceMappingURL=drawable-free-path.js.map