@pie-element/hotspot 4.8.3 → 4.8.4-next.1008

package/configure/lib/hotspot-drawable.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/hotspot-drawable.jsx"],"names":["Drawable","props","e","target","currentTarget","onUpdateShapes","shapes","newShapes","slice","value","map","c","parseInt","id","filter","isNaN","push","height","width","x","evt","layerX","y","layerY","group","index","length","setState","isDrawing","isDrawingShapeId","state","stateShapes","undefined","mouseX","mouseY","currShapeIndex","findIndex","shape","currShape","newWidth","newHeight","newShapesList","updatedProps","multipleCorrect","correct","onUpdateImageDimension","resizeHandle","resize","elementStyle","getComputedStyle","parseFloat","dimensions","addEventListener","initialiseResize","window","startResizing","stopResizing","bounds","getBoundingClientRect","box","image","disableDrag","preserveAspectRatioEnabled","clientX","left","clientY","top","resizeValid","checkIfResizeValid","hasMinimumWidth","style","resizing","enableDrag","removeEventListener","drawable","forEach","right","bottom","classes","imageUrl","hotspotColor","outlineColor","strokeWidth","heightFromState","widthFromState","shapesToUse","base","imageContainer","handleOnImageLoad","ref","stage","handleOnMouseDown","handleOnMouseUp","handleMouseMove","Tag","Polygon","Rectangle","handleOnSetAsCorrect","handleOnDragEnd","points","nextProps","prevState","React","Component","styles","position","alignItems","display","justifyContent","borderBottom","borderRight","cursor","propTypes","PropTypes","object","isRequired","func","string","bool","array","number"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { Layer, Stage } from 'react-konva';\nimport max from 'lodash/max';\nimport cloneDeep from 'lodash/cloneDeep';\nimport { withStyles } from '@material-ui/core/styles/index';\n\nimport Rectangle from './hotspot-rectangle';\nimport Polygon from './hotspot-polygon';\nimport { updateImageDimensions, getUpdatedShapes } from './utils';\n\nexport class Drawable extends React.Component {\n  static getDerivedStateFromProps(nextProps, prevState) {\n    let dimensions = nextProps.dimensions;\n\n    if (prevState && prevState.resizing) {\n      dimensions = prevState.dimensions;\n    }\n\n    return {\n      ...prevState,\n      dimensions: dimensions,\n    }\n  }\n\n  constructor(props) {\n    super(props);\n\n    this.state = {\n      isDrawing: false,\n      stateShapes: false,\n      resizing: false,\n      dimensions: {\n        height: 0,\n        width: 0,\n      },\n    }\n  }\n\n  /// start of handling HotSpots section\n  handleOnMouseDown = (e) => {\n    if (e.target === e.currentTarget) {\n      const { onUpdateShapes, shapes } = this.props;\n      // Add a new rectangle at the mouse position with 0 width and height\n      const newShapes = shapes.slice();\n      const value = max(newShapes.map(c => parseInt(c.id)).filter(id => !isNaN(id))) || 0;\n\n      newShapes.push({\n        id: `${value + 1}`,\n        height: 0,\n        width: 0,\n        x: e.evt.layerX,\n        y: e.evt.layerY,\n        group: 'rectangles',\n        index: shapes.length\n      });\n\n      this.setState({ isDrawing: true, isDrawingShapeId: `${value + 1}` });\n      onUpdateShapes(newShapes);\n    }\n  };\n\n  handleOnMouseUp = () => {\n    // !IMPORTANT: currently, only 'rectangles' are drawable\n    const { isDrawing, stateShapes } = this.state;\n    const { onUpdateShapes } = this.props;\n\n    // If we're drawing a shape, a click finishes the drawing and sends the new shapes to HOC\n    if (isDrawing) {\n      this.setState({ isDrawing: !isDrawing, stateShapes: false, isDrawingShapeId: undefined });\n\n      if (stateShapes) {\n        onUpdateShapes(stateShapes);\n      }\n    }\n  };\n\n  handleMouseMove = (e) => {\n    // !IMPORTANT: currently, only 'rectangles' are drawable\n    const { isDrawing, isDrawingShapeId } = this.state;\n    const { shapes } = this.props;\n\n    if (isDrawing && isDrawingShapeId) {\n      const mouseX = e.evt.layerX;\n      const mouseY = e.evt.layerY;\n\n      const currShapeIndex = shapes.findIndex(shape => shape.id === isDrawingShapeId);\n      const currShape = shapes[currShapeIndex];\n\n      if (currShape) {\n        const newWidth = mouseX - currShape.x;\n        const newHeight = mouseY - currShape.y;\n\n        const newShapesList = shapes.slice();\n\n        newShapesList[currShapeIndex] = {\n          ...newShapesList[currShapeIndex],\n          height: newHeight,\n          width: newWidth,\n          x: currShape.x,\n          y: currShape.y\n        };\n\n        // On mouse move don't trigger any event. Put the shapes on this state instead.\n        this.setState({ stateShapes: newShapesList });\n      }\n    }\n  };\n\n  handleOnDragEnd = (id, updatedProps) => {\n    const { shapes, onUpdateShapes } = this.props;\n    const newShapes = shapes.map(shape => {\n      if (shape.id === id) {\n        return {\n          ...shape,\n          ...updatedProps\n        }\n      }\n      return shape;\n    });\n\n    onUpdateShapes(cloneDeep(newShapes));\n  };\n\n  handleOnSetAsCorrect = (shape) => {\n    const { id } = shape;\n    const { multipleCorrect, shapes, onUpdateShapes } = this.props;\n\n    let newShapes = [];\n\n    if (multipleCorrect) {\n      newShapes = shapes.map(shape => {\n        if (shape.id === id) {\n          shape.correct = !shape.correct;\n        }\n        return shape;\n      })\n    } else {\n      newShapes = shapes.map(shape => {\n        shape.correct = shape.id === id;\n        return shape;\n      })\n    }\n\n    onUpdateShapes(cloneDeep(newShapes));\n  };\n  /// end of handling HotSpots section\n\n  /// start of handling Image section\n  handleOnImageLoad = ({ target }) => {\n    const { onUpdateImageDimension } = this.props;\n    const resizeHandle = this.resize;\n    const elementStyle = getComputedStyle(target);\n    const newHeight = parseFloat(elementStyle.height);\n    const newWidth = parseFloat(elementStyle.width);\n\n    const dimensions = {\n      height: newHeight,\n      width: newWidth\n    };\n\n    this.setState(\n      { dimensions },\n      () => onUpdateImageDimension(dimensions));\n\n    resizeHandle.addEventListener('mousedown', this.initialiseResize, false);\n  };\n\n  initialiseResize = () => {\n    window.addEventListener('mousemove', this.startResizing, false);\n    window.addEventListener('mouseup', this.stopResizing, false);\n  };\n\n  checkIfResizeValid(x, y) {\n    const { shapes } = this.state;\n    let drawable = true;\n\n    // Do not allow resizing over the hotspots\n    shapes && shapes.forEach(shape => {\n      const right = shape.x + shape.width + 5;\n      const bottom = shape.y + shape.height + 5;\n      if (x <= right || y <= bottom) {\n        drawable = false\n      }\n    });\n    return drawable;\n  }\n\n  startResizing = (e) => {\n    const bounds = e.target.getBoundingClientRect();\n    const box = this.image;\n    const {\n      disableDrag,\n      preserveAspectRatioEnabled,\n      dimensions,\n      shapes\n    } = this.props;\n\n    // todo previously we had state.dimensions, is it needed?\n    const { width, height } = updateImageDimensions(\n      dimensions,\n      {\n        width: e.clientX - bounds.left,\n        height: e.clientY - bounds.top\n      },\n      preserveAspectRatioEnabled\n    );\n\n    const resizeValid = this.checkIfResizeValid(width, height);\n    const hasMinimumWidth = width > 150 && height > 150;\n\n    if (resizeValid && hasMinimumWidth) {\n      box.style.width = `${width}px`;\n      box.style.height = `${height}px`;\n\n      this.setState({\n        resizing: true,\n        dimensions: { height: height, width: width },\n        stateShapes: getUpdatedShapes(dimensions, { width, height }, shapes)\n      });\n    }\n\n    disableDrag();\n  };\n\n  stopResizing = () => {\n    const { enableDrag, onUpdateImageDimension, onUpdateShapes } = this.props;\n    const { dimensions, stateShapes } = this.state;\n\n    enableDrag();\n\n    if (stateShapes) {\n      onUpdateShapes(cloneDeep(stateShapes));\n    }\n\n    onUpdateImageDimension(dimensions);\n\n    window.removeEventListener('mousemove', this.startResizing, false);\n    window.removeEventListener('mouseup', this.stopResizing, false);\n\n    this.setState({ resizing: false, stateShapes: false });\n  };\n  /// end of handling Image section\n\n  render() {\n    const {\n      classes,\n      imageUrl,\n      dimensions: { height, width },\n      hotspotColor,\n      outlineColor,\n      shapes,\n      strokeWidth\n    } = this.props;\n    const {\n      stateShapes,\n      isDrawing,\n      dimensions: { height: heightFromState, width: widthFromState }\n    } = this.state;\n    const shapesToUse = stateShapes || shapes;\n\n    return (\n      <div className={classes.base}>\n        {imageUrl && (\n          <div className={classes.imageContainer}>\n            <img\n              className={classes.image}\n              onLoad={this.handleOnImageLoad}\n              ref={ref => {\n                this.image = ref;\n              }}\n              src={imageUrl}\n              {...height && width ? { style: { height, width } } : {}}\n            />\n            <div ref={ref => {\n              this.resize = ref;\n            }} className={classes.resize}/>\n          </div>\n        )}\n\n        <Stage\n          className={classes.stage}\n          height={heightFromState || height}\n          width={widthFromState || width}\n          onMouseDown={this.handleOnMouseDown }\n          onMouseUp={this.handleOnMouseUp }\n          onMouseMove={this.handleMouseMove }\n        >\n          <Layer>\n            {shapesToUse.map((shape, index) => {\n              const Tag = shape.group === 'polygons' ? Polygon : Rectangle;\n\n              return (\n                <Tag\n                  correct={shape.correct}\n                  isDrawing={isDrawing}\n                  height={shape.height}\n                  hotspotColor={hotspotColor}\n                  id={shape.id}\n                  key={index}\n                  onClick={() => this.handleOnSetAsCorrect(shape)}\n                  onDragEnd={this.handleOnDragEnd}\n                  outlineColor={outlineColor}\n                  width={shape.width}\n                  x={shape.x}\n                  y={shape.y}\n                  points={shape.points}\n                  strokeWidth={strokeWidth}\n                />\n              );\n            })}\n          </Layer>\n        </Stage>\n      </div>\n    );\n  }\n}\n\nconst styles = () => ({\n  base: {\n    position: 'relative'\n  },\n  image: {\n    alignItems: 'center',\n    display: 'flex',\n    justifyContent: 'center',\n  },\n  imageContainer: {\n    position: 'relative',\n    width: 'fit-content'\n  },\n  resize: {\n    borderBottom: '1px solid #727272',\n    borderRight: '1px solid #727272',\n    bottom: '-10px',\n    cursor: 'se-resize',\n    height: '10px',\n    position: 'absolute',\n    right: '-10px',\n    width: '10px'\n  },\n  stage: {\n    left: 0,\n    top: 0,\n    position: 'absolute'\n  }\n});\n\nDrawable.propTypes = {\n  classes: PropTypes.object.isRequired,\n  disableDrag: PropTypes.func.isRequired,\n  dimensions: PropTypes.object.isRequired,\n  enableDrag: PropTypes.func.isRequired,\n  imageUrl: PropTypes.string.isRequired,\n  hotspotColor: PropTypes.string.isRequired,\n  multipleCorrect: PropTypes.bool.isRequired,\n  onUpdateImageDimension: PropTypes.func.isRequired,\n  onUpdateShapes: PropTypes.func.isRequired,\n  outlineColor: PropTypes.string.isRequired,\n  shapes: PropTypes.array.isRequired,\n  strokeWidth: PropTypes.number,\n  preserveAspectRatioEnabled: PropTypes.bool\n};\n\nexport default withStyles(styles)(Drawable);\n"],"file":"hotspot-drawable.js"}
+{"version":3,"sources":["../src/hotspot-drawable.jsx"],"names":["IMAGE_MAX_WIDTH","Drawable","props","e","target","currentTarget","onUpdateShapes","shapes","newShapes","slice","value","map","c","parseInt","id","filter","isNaN","push","height","width","x","evt","layerX","y","layerY","group","index","length","setState","isDrawing","isDrawingShapeId","state","stateShapes","undefined","mouseX","mouseY","currShapeIndex","findIndex","shape","currShape","newWidth","newHeight","newShapesList","updatedProps","multipleCorrect","correct","onUpdateImageDimension","resizeHandle","resize","elementStyle","getComputedStyle","parseFloat","aspectWidth","dimensions","addEventListener","initialiseResize","window","startResizing","stopResizing","bounds","getBoundingClientRect","box","image","disableDrag","preserveAspectRatioEnabled","clientX","left","clientY","top","resizeValid","checkIfResizeValid","hasMinimumWidth","style","resizing","enableDrag","removeEventListener","drawable","forEach","right","bottom","classes","imageUrl","hotspotColor","outlineColor","strokeWidth","heightFromState","widthFromState","shapesToUse","base","imageContainer","handleOnImageLoad","ref","stage","handleOnMouseDown","handleOnMouseUp","handleMouseMove","Tag","Polygon","Rectangle","handleOnSetAsCorrect","handleOnDragEnd","points","nextProps","prevState","React","Component","styles","position","alignItems","display","justifyContent","borderBottom","borderRight","cursor","propTypes","PropTypes","object","isRequired","func","string","bool","array","number"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { Layer, Stage } from 'react-konva';\nimport max from 'lodash/max';\nimport cloneDeep from 'lodash/cloneDeep';\nimport { withStyles } from '@material-ui/core/styles/index';\n\nimport Rectangle from './hotspot-rectangle';\nimport Polygon from './hotspot-polygon';\nimport { updateImageDimensions, getUpdatedShapes } from './utils';\n\nconst IMAGE_MAX_WIDTH = 800;\n\nexport class Drawable extends React.Component {\n  static getDerivedStateFromProps(nextProps, prevState) {\n    let dimensions = nextProps.dimensions;\n\n    if (prevState && prevState.resizing) {\n      dimensions = prevState.dimensions;\n    }\n\n    return {\n      ...prevState,\n      dimensions: dimensions,\n    }\n  }\n\n  constructor(props) {\n    super(props);\n\n    this.state = {\n      isDrawing: false,\n      stateShapes: false,\n      resizing: false,\n      dimensions: {\n        height: 0,\n        width: 0,\n      },\n    }\n  }\n\n  /// start of handling HotSpots section\n  handleOnMouseDown = (e) => {\n    if (e.target === e.currentTarget) {\n      const { onUpdateShapes, shapes } = this.props;\n      // Add a new rectangle at the mouse position with 0 width and height\n      const newShapes = shapes.slice();\n      const value = max(newShapes.map(c => parseInt(c.id)).filter(id => !isNaN(id))) || 0;\n\n      newShapes.push({\n        id: `${value + 1}`,\n        height: 0,\n        width: 0,\n        x: e.evt.layerX,\n        y: e.evt.layerY,\n        group: 'rectangles',\n        index: shapes.length\n      });\n\n      this.setState({ isDrawing: true, isDrawingShapeId: `${value + 1}` });\n      onUpdateShapes(newShapes);\n    }\n  };\n\n  handleOnMouseUp = () => {\n    // !IMPORTANT: currently, only 'rectangles' are drawable\n    const { isDrawing, stateShapes } = this.state;\n    const { onUpdateShapes } = this.props;\n\n    // If we're drawing a shape, a click finishes the drawing and sends the new shapes to HOC\n    if (isDrawing) {\n      this.setState({ isDrawing: !isDrawing, stateShapes: false, isDrawingShapeId: undefined });\n\n      if (stateShapes) {\n        onUpdateShapes(stateShapes);\n      }\n    }\n  };\n\n  handleMouseMove = (e) => {\n    // !IMPORTANT: currently, only 'rectangles' are drawable\n    const { isDrawing, isDrawingShapeId } = this.state;\n    const { shapes } = this.props;\n\n    if (isDrawing && isDrawingShapeId) {\n      const mouseX = e.evt.layerX;\n      const mouseY = e.evt.layerY;\n\n      const currShapeIndex = shapes.findIndex(shape => shape.id === isDrawingShapeId);\n      const currShape = shapes[currShapeIndex];\n\n      if (currShape) {\n        const newWidth = mouseX - currShape.x;\n        const newHeight = mouseY - currShape.y;\n\n        const newShapesList = shapes.slice();\n\n        newShapesList[currShapeIndex] = {\n          ...newShapesList[currShapeIndex],\n          height: newHeight,\n          width: newWidth,\n          x: currShape.x,\n          y: currShape.y\n        };\n\n        // On mouse move don't trigger any event. Put the shapes on this state instead.\n        this.setState({ stateShapes: newShapesList });\n      }\n    }\n  };\n\n  handleOnDragEnd = (id, updatedProps) => {\n    const { shapes, onUpdateShapes } = this.props;\n    const newShapes = shapes.map(shape => {\n      if (shape.id === id) {\n        return {\n          ...shape,\n          ...updatedProps\n        }\n      }\n      return shape;\n    });\n\n    onUpdateShapes(cloneDeep(newShapes));\n  };\n\n  handleOnSetAsCorrect = (shape) => {\n    const { id } = shape;\n    const { multipleCorrect, shapes, onUpdateShapes } = this.props;\n\n    let newShapes = [];\n\n    if (multipleCorrect) {\n      newShapes = shapes.map(shape => {\n        if (shape.id === id) {\n          shape.correct = !shape.correct;\n        }\n        return shape;\n      })\n    } else {\n      newShapes = shapes.map(shape => {\n        shape.correct = shape.id === id;\n        return shape;\n      })\n    }\n\n    onUpdateShapes(cloneDeep(newShapes));\n  };\n  /// end of handling HotSpots section\n\n  /// start of handling Image section\n  handleOnImageLoad = ({ target }) => {\n    const { onUpdateImageDimension } = this.props;\n    const resizeHandle = this.resize;\n    const elementStyle = getComputedStyle(target);\n    const newHeight = parseFloat(elementStyle.height);\n    const newWidth = parseFloat(elementStyle.width);\n    const aspectWidth = newWidth / IMAGE_MAX_WIDTH;\n\n    const dimensions = newWidth > IMAGE_MAX_WIDTH ? {\n      height: newHeight / aspectWidth,\n      width: IMAGE_MAX_WIDTH\n    } : {\n      height: newHeight,\n      width: newWidth\n    };\n\n    this.setState(\n      { dimensions },\n      () => onUpdateImageDimension(dimensions));\n\n    resizeHandle.addEventListener('mousedown', this.initialiseResize, false);\n  };\n\n  initialiseResize = () => {\n    window.addEventListener('mousemove', this.startResizing, false);\n    window.addEventListener('mouseup', this.stopResizing, false);\n  };\n\n  checkIfResizeValid(x, y) {\n    const { shapes } = this.state;\n    let drawable = true;\n\n    // Do not allow resizing over the hotspots\n    shapes && shapes.forEach(shape => {\n      const right = shape.x + shape.width + 5;\n      const bottom = shape.y + shape.height + 5;\n      if (x <= right || y <= bottom) {\n        drawable = false\n      }\n    });\n    return drawable;\n  }\n\n  startResizing = (e) => {\n    const bounds = e.target.getBoundingClientRect();\n    const box = this.image;\n    const {\n      disableDrag,\n      preserveAspectRatioEnabled,\n      dimensions,\n      shapes\n    } = this.props;\n\n    // todo previously we had state.dimensions, is it needed?\n    const { width, height } = updateImageDimensions(\n      dimensions,\n      {\n        width: e.clientX - bounds.left,\n        height: e.clientY - bounds.top\n      },\n      preserveAspectRatioEnabled\n    );\n\n    const resizeValid = this.checkIfResizeValid(width, height);\n    const hasMinimumWidth = width > 150 && height > 150;\n\n    if (resizeValid && hasMinimumWidth && box) {\n      box.style.width = `${width}px`;\n      box.style.height = `${height}px`;\n\n      this.setState({\n        resizing: true,\n        dimensions: { height: height, width: width },\n        stateShapes: getUpdatedShapes(dimensions, { width, height }, shapes)\n      });\n    }\n\n    disableDrag();\n  };\n\n  stopResizing = () => {\n    const { enableDrag, onUpdateImageDimension, onUpdateShapes } = this.props;\n    const { dimensions, stateShapes } = this.state;\n\n    enableDrag();\n\n    if (stateShapes) {\n      onUpdateShapes(cloneDeep(stateShapes));\n    }\n\n    onUpdateImageDimension(dimensions);\n\n    window.removeEventListener('mousemove', this.startResizing, false);\n    window.removeEventListener('mouseup', this.stopResizing, false);\n\n    this.setState({ resizing: false, stateShapes: false });\n  };\n  /// end of handling Image section\n\n  render() {\n    const {\n      classes,\n      imageUrl,\n      dimensions: { height, width },\n      hotspotColor,\n      outlineColor,\n      shapes,\n      strokeWidth\n    } = this.props;\n    const {\n      stateShapes,\n      isDrawing,\n      dimensions: { height: heightFromState, width: widthFromState }\n    } = this.state;\n    const shapesToUse = stateShapes || shapes;\n\n    return (\n      <div className={classes.base}>\n        {imageUrl && (\n          <div className={classes.imageContainer}>\n            <img\n              className={classes.image}\n              onLoad={this.handleOnImageLoad}\n              ref={ref => {\n                this.image = ref;\n              }}\n              src={imageUrl}\n              {...height && width ? { style: { height, width } } : {}}\n            />\n            <div ref={ref => {\n              this.resize = ref;\n            }} className={classes.resize}/>\n          </div>\n        )}\n\n        <Stage\n          className={classes.stage}\n          height={heightFromState || height}\n          width={widthFromState || width}\n          onMouseDown={this.handleOnMouseDown }\n          onMouseUp={this.handleOnMouseUp }\n          onMouseMove={this.handleMouseMove }\n        >\n          <Layer>\n            {shapesToUse.map((shape, index) => {\n              const Tag = shape.group === 'polygons' ? Polygon : Rectangle;\n\n              return (\n                <Tag\n                  correct={shape.correct}\n                  isDrawing={isDrawing}\n                  height={shape.height}\n                  hotspotColor={hotspotColor}\n                  id={shape.id}\n                  key={index}\n                  onClick={() => this.handleOnSetAsCorrect(shape)}\n                  onDragEnd={this.handleOnDragEnd}\n                  outlineColor={outlineColor}\n                  width={shape.width}\n                  x={shape.x}\n                  y={shape.y}\n                  points={shape.points}\n                  strokeWidth={strokeWidth}\n                />\n              );\n            })}\n          </Layer>\n        </Stage>\n      </div>\n    );\n  }\n}\n\nconst styles = () => ({\n  base: {\n    position: 'relative'\n  },\n  image: {\n    alignItems: 'center',\n    display: 'flex',\n    justifyContent: 'center',\n  },\n  imageContainer: {\n    position: 'relative',\n    width: 'fit-content'\n  },\n  resize: {\n    borderBottom: '1px solid #727272',\n    borderRight: '1px solid #727272',\n    bottom: '-10px',\n    cursor: 'se-resize',\n    height: '10px',\n    position: 'absolute',\n    right: '-10px',\n    width: '10px'\n  },\n  stage: {\n    left: 0,\n    top: 0,\n    position: 'absolute'\n  }\n});\n\nDrawable.propTypes = {\n  classes: PropTypes.object.isRequired,\n  disableDrag: PropTypes.func.isRequired,\n  dimensions: PropTypes.object.isRequired,\n  enableDrag: PropTypes.func.isRequired,\n  imageUrl: PropTypes.string.isRequired,\n  hotspotColor: PropTypes.string.isRequired,\n  multipleCorrect: PropTypes.bool.isRequired,\n  onUpdateImageDimension: PropTypes.func.isRequired,\n  onUpdateShapes: PropTypes.func.isRequired,\n  outlineColor: PropTypes.string.isRequired,\n  shapes: PropTypes.array.isRequired,\n  strokeWidth: PropTypes.number,\n  preserveAspectRatioEnabled: PropTypes.bool\n};\n\nexport default withStyles(styles)(Drawable);\n"],"file":"hotspot-drawable.js"}

package/configure/lib/hotspot-palette.js

@@ -35,7 +35,7 @@ var _styles = require("@material-ui/core/styles");
 
 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 { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }
+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 Palette = /*#__PURE__*/function (_React$Component) {
   (0, _inherits2["default"])(Palette, _React$Component);

package/configure/lib/hotspot-palette.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/hotspot-palette.jsx"],"names":["Palette","name","event","value","target","props","onHotspotColorChange","onOutlineColorChange","classes","hotspotColor","outlineColor","hotspotList","outlineList","base","input","select","onChange","map","hotspot","item","backgroundColor","outline","border","React","Component","styles","theme","marginTop","spacing","unit","display","flex","width","borderRadius","height","marginLeft","marginRight","propTypes","PropTypes","object","isRequired","string","array","func"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { InputContainer } from '@pie-lib/config-ui';\nimport Select from '@material-ui/core/Select';\nimport MenuItem from '@material-ui/core/MenuItem';\nimport { withStyles } from '@material-ui/core/styles';\n\nclass Palette extends React.Component {\n  onChange = (name) => event => {\n    const { value } = event.target;\n    const { onHotspotColorChange, onOutlineColorChange } = this.props;\n\n    if (name === 'hotspot') {\n      onHotspotColorChange(value);\n    } else {\n      onOutlineColorChange(value)\n    }\n  };\n\n  render() {\n    const { classes, hotspotColor, outlineColor, hotspotList, outlineList } = this.props;\n\n    return (\n      <div className={classes.base}>\n        <InputContainer label=\"Hot Spot\" className={classes.input}>\n          <Select\n            className={classes.select}\n            onChange={this.onChange('hotspot')}\n            value={hotspotColor}\n          >\n            {hotspotList.map(hotspot => (\n              <MenuItem\n                key={hotspot}\n                value={hotspot}\n                className={classes.item}\n                style={{ backgroundColor: hotspot }}\n              >\n                {hotspot}\n              </MenuItem>\n            ))}\n          </Select>\n        </InputContainer>\n\n        <InputContainer label=\"Response Outline\" className={classes.input}>\n          <Select\n            className={classes.select}\n            onChange={this.onChange('outline')}\n            value={outlineColor}\n          >\n            {outlineList.map(outline => (\n              <MenuItem\n                key={outline}\n                value={outline}\n                className={classes.item}\n                style={{ border: `2px solid ${outline}` }}\n              >\n                {outline}\n              </MenuItem>\n            ))}\n          </Select>\n        </InputContainer>\n      </div>\n    );\n  }\n}\n\nconst styles = theme => ({\n  base: {\n    marginTop: theme.spacing.unit * 2,\n    display: 'flex'\n  },\n  input: {\n    flex: 1,\n    width: '90%'\n  },\n  item: {\n    borderRadius: '2px',\n    height: '22px',\n    marginLeft: theme.spacing.unit * 2,\n    marginRight: theme.spacing.unit * 2,\n    marginTop: theme.spacing.unit * 2\n  },\n});\n\nPalette.propTypes = {\n  classes: PropTypes.object.isRequired,\n  hotspotColor: PropTypes.string.isRequired,\n  hotspotList: PropTypes.array.isRequired,\n  onHotspotColorChange: PropTypes.func.isRequired,\n  onOutlineColorChange: PropTypes.func.isRequired,\n  outlineColor: PropTypes.string.isRequired,\n  outlineList: PropTypes.array.isRequired\n};\n\nexport default withStyles(styles)(Palette);\n"],"file":"hotspot-palette.js"}
+{"version":3,"sources":["../src/hotspot-palette.jsx"],"names":["Palette","name","event","value","target","props","onHotspotColorChange","onOutlineColorChange","classes","hotspotColor","outlineColor","hotspotList","outlineList","base","input","select","onChange","map","hotspot","item","backgroundColor","outline","border","React","Component","styles","theme","marginTop","spacing","unit","display","flex","width","borderRadius","height","marginLeft","marginRight","propTypes","PropTypes","object","isRequired","string","array","func"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { InputContainer } from '@pie-lib/config-ui';\nimport Select from '@material-ui/core/Select';\nimport MenuItem from '@material-ui/core/MenuItem';\nimport { withStyles } from '@material-ui/core/styles';\n\nclass Palette extends React.Component {\n  onChange = (name) => event => {\n    const { value } = event.target;\n    const { onHotspotColorChange, onOutlineColorChange } = this.props;\n\n    if (name === 'hotspot') {\n      onHotspotColorChange(value);\n    } else {\n      onOutlineColorChange(value)\n    }\n  };\n\n  render() {\n    const { classes, hotspotColor, outlineColor, hotspotList, outlineList } = this.props;\n\n    return (\n      <div className={classes.base}>\n        <InputContainer label=\"Hot Spot\" className={classes.input}>\n          <Select\n            className={classes.select}\n            onChange={this.onChange('hotspot')}\n            value={hotspotColor}\n          >\n            {hotspotList.map(hotspot => (\n              <MenuItem\n                key={hotspot}\n                value={hotspot}\n                className={classes.item}\n                style={{ backgroundColor: hotspot }}\n              >\n                {hotspot}\n              </MenuItem>\n            ))}\n          </Select>\n        </InputContainer>\n\n        <InputContainer label=\"Response Outline\" className={classes.input}>\n          <Select\n            className={classes.select}\n            onChange={this.onChange('outline')}\n            value={outlineColor}\n          >\n            {outlineList.map(outline => (\n              <MenuItem\n                key={outline}\n                value={outline}\n                className={classes.item}\n                style={{ border: `2px solid ${outline}` }}\n              >\n                {outline}\n              </MenuItem>\n            ))}\n          </Select>\n        </InputContainer>\n      </div>\n    );\n  }\n}\n\nconst styles = theme => ({\n  base: {\n    marginTop: theme.spacing.unit * 2,\n    display: 'flex'\n  },\n  input: {\n    flex: 1,\n    width: '90%'\n  },\n  item: {\n    borderRadius: '2px',\n    height: '22px',\n    marginLeft: theme.spacing.unit * 2,\n    marginRight: theme.spacing.unit * 2,\n    marginTop: theme.spacing.unit * 2\n  },\n});\n\nPalette.propTypes = {\n  classes: PropTypes.object.isRequired,\n  hotspotColor: PropTypes.string.isRequired,\n  hotspotList: PropTypes.array.isRequired,\n  onHotspotColorChange: PropTypes.func.isRequired,\n  onOutlineColorChange: PropTypes.func.isRequired,\n  outlineColor: PropTypes.string.isRequired,\n  outlineList: PropTypes.array.isRequired\n};\n\nexport default withStyles(styles)(Palette);\n"],"file":"hotspot-palette.js"}

package/configure/lib/hotspot-polygon.js

@@ -33,7 +33,7 @@ var _index = require("@material-ui/core/styles/index");
 
 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 { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }
+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 PolComponent = /*#__PURE__*/function (_React$Component) {
   (0, _inherits2["default"])(PolComponent, _React$Component);

package/configure/lib/hotspot-polygon.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/hotspot-polygon.jsx"],"names":["PolComponent","e","points","props","xList","map","p","x","yList","y","width","Math","max","min","height","isDrawing","onClick","id","cancelBubble","document","body","style","cursor","onDragEnd","target","state","newPoints","reduce","acc","currentPointCoordinate","index","length","push","classes","correct","hotspotColor","outlineColor","strokeWidth","base","handleClick","handleMouseLeave","handleMouseEnter","handleOnDragEnd","nextProps","xOffset","yOffset","point","concat","React","Component","styles","opacity","propTypes","PropTypes","object","isRequired","bool","string","func","arrayOf","shape","number","defaultProps"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { Group, Line } from 'react-konva';\nimport { withStyles } from '@material-ui/core/styles/index';\n\nclass PolComponent extends React.Component {\n  static getDerivedStateFromProps(nextProps) {\n    const { points } = nextProps;\n    const xList = points.map(p => (p.x));\n    const yList = points.map(p => (p.y));\n\n    const xOffset = Math.min(...xList);\n    const yOffset = Math.max(...yList);\n\n    if (points.length) {\n      return {\n        x: xOffset,\n        y: yOffset,\n        points: points.reduce((acc, point) => { return acc.concat([point.x - xOffset, point.y - yOffset]) }, [])\n      };\n    }\n\n    return {\n      x: 0,\n      y: 0,\n      points: []\n    };\n  }\n\n  state = {};\n\n  handleClick = (e) => {\n    const { points } = this.props;\n    const xList = points.map(p => (p.x));\n    const yList = points.map(p => (p.y));\n\n    const width = Math.max(...xList) - Math.min(...xList);\n    const height = Math.max(...yList) - Math.min(...yList);\n\n    const { isDrawing, onClick, id } = this.props;\n\n    if (width < 0 && height < 0 && isDrawing) {\n      return;\n    }\n\n    e.cancelBubble = true;\n    onClick(id);\n  };\n\n  handleMouseEnter = () => {\n    document.body.style.cursor = 'pointer';\n  };\n\n  handleMouseLeave = () => {\n    document.body.style.cursor = 'default';\n  };\n\n  handleOnDragEnd = (e) => {\n    const { onDragEnd, id } = this.props;\n    const points = e.target.points() || this.state.points;\n\n    const newPoints = points.reduce((acc, currentPointCoordinate, index) => {\n      if (index % 2 === 0 && index + 1 < points.length) {\n        acc.push({\n          x: currentPointCoordinate + e.target.x(),\n          y: points[index + 1]  + e.target.y()\n        });\n\n        return acc;\n      } else {\n        return acc;\n      }\n    }, []);\n\n    onDragEnd(id, {\n      points: newPoints\n    })\n  };\n\n  render() {\n    const {\n      classes,\n      correct,\n      hotspotColor,\n      outlineColor,\n      strokeWidth = 5\n    } = this.props;\n    const { points, x, y } = this.state;\n\n    return (\n      <Group>\n        <Line\n          classes={classes.base}\n          points={points}\n          closed={true}\n          fill={hotspotColor}\n          onClick={this.handleClick}\n          onTap={this.handleClick}\n          draggable\n          stroke={outlineColor}\n          strokeWidth={correct ? strokeWidth : 0}\n          onMouseLeave={this.handleMouseLeave}\n          onMouseEnter={this.handleMouseEnter}\n          onDragEnd={this.handleOnDragEnd}\n          x={x}\n          y={y}\n        />\n      </Group>\n    );\n  }\n}\n\nconst styles = () => ({\n  base: {\n    cursor: 'pointer',\n    opacity: 0.5\n  },\n});\n\nPolComponent.propTypes = {\n  classes: PropTypes.object.isRequired,\n  correct: PropTypes.bool,\n  isDrawing: PropTypes.bool.isRequired,\n  id: PropTypes.string.isRequired,\n  hotspotColor: PropTypes.string.isRequired,\n  onClick: PropTypes.func.isRequired,\n  onDragEnd: PropTypes.func.isRequired,\n  outlineColor: PropTypes.string.isRequired,\n  points: PropTypes.arrayOf(PropTypes.shape({\n    x: PropTypes.number,\n    y: PropTypes.number\n  })).isRequired,\n  strokeWidth: PropTypes.number\n};\n\nPolComponent.defaultProps = {\n  correct: false,\n};\n\nexport default withStyles(styles)(PolComponent);\n"],"file":"hotspot-polygon.js"}
+{"version":3,"sources":["../src/hotspot-polygon.jsx"],"names":["PolComponent","e","points","props","xList","map","p","x","yList","y","width","Math","max","min","height","isDrawing","onClick","id","cancelBubble","document","body","style","cursor","onDragEnd","target","state","newPoints","reduce","acc","currentPointCoordinate","index","length","push","classes","correct","hotspotColor","outlineColor","strokeWidth","base","handleClick","handleMouseLeave","handleMouseEnter","handleOnDragEnd","nextProps","xOffset","yOffset","point","concat","React","Component","styles","opacity","propTypes","PropTypes","object","isRequired","bool","string","func","arrayOf","shape","number","defaultProps"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { Group, Line } from 'react-konva';\nimport { withStyles } from '@material-ui/core/styles/index';\n\nclass PolComponent extends React.Component {\n  static getDerivedStateFromProps(nextProps) {\n    const { points } = nextProps;\n    const xList = points.map(p => (p.x));\n    const yList = points.map(p => (p.y));\n\n    const xOffset = Math.min(...xList);\n    const yOffset = Math.max(...yList);\n\n    if (points.length) {\n      return {\n        x: xOffset,\n        y: yOffset,\n        points: points.reduce((acc, point) => { return acc.concat([point.x - xOffset, point.y - yOffset]) }, [])\n      };\n    }\n\n    return {\n      x: 0,\n      y: 0,\n      points: []\n    };\n  }\n\n  state = {};\n\n  handleClick = (e) => {\n    const { points } = this.props;\n    const xList = points.map(p => (p.x));\n    const yList = points.map(p => (p.y));\n\n    const width = Math.max(...xList) - Math.min(...xList);\n    const height = Math.max(...yList) - Math.min(...yList);\n\n    const { isDrawing, onClick, id } = this.props;\n\n    if (width < 0 && height < 0 && isDrawing) {\n      return;\n    }\n\n    e.cancelBubble = true;\n    onClick(id);\n  };\n\n  handleMouseEnter = () => {\n    document.body.style.cursor = 'pointer';\n  };\n\n  handleMouseLeave = () => {\n    document.body.style.cursor = 'default';\n  };\n\n  handleOnDragEnd = (e) => {\n    const { onDragEnd, id } = this.props;\n    const points = e.target.points() || this.state.points;\n\n    const newPoints = points.reduce((acc, currentPointCoordinate, index) => {\n      if (index % 2 === 0 && index + 1 < points.length) {\n        acc.push({\n          x: currentPointCoordinate + e.target.x(),\n          y: points[index + 1]  + e.target.y()\n        });\n\n        return acc;\n      } else {\n        return acc;\n      }\n    }, []);\n\n    onDragEnd(id, {\n      points: newPoints\n    })\n  };\n\n  render() {\n    const {\n      classes,\n      correct,\n      hotspotColor,\n      outlineColor,\n      strokeWidth = 5\n    } = this.props;\n    const { points, x, y } = this.state;\n\n    return (\n      <Group>\n        <Line\n          classes={classes.base}\n          points={points}\n          closed={true}\n          fill={hotspotColor}\n          onClick={this.handleClick}\n          onTap={this.handleClick}\n          draggable\n          stroke={outlineColor}\n          strokeWidth={correct ? strokeWidth : 0}\n          onMouseLeave={this.handleMouseLeave}\n          onMouseEnter={this.handleMouseEnter}\n          onDragEnd={this.handleOnDragEnd}\n          x={x}\n          y={y}\n        />\n      </Group>\n    );\n  }\n}\n\nconst styles = () => ({\n  base: {\n    cursor: 'pointer',\n    opacity: 0.5\n  },\n});\n\nPolComponent.propTypes = {\n  classes: PropTypes.object.isRequired,\n  correct: PropTypes.bool,\n  isDrawing: PropTypes.bool.isRequired,\n  id: PropTypes.string.isRequired,\n  hotspotColor: PropTypes.string.isRequired,\n  onClick: PropTypes.func.isRequired,\n  onDragEnd: PropTypes.func.isRequired,\n  outlineColor: PropTypes.string.isRequired,\n  points: PropTypes.arrayOf(PropTypes.shape({\n    x: PropTypes.number,\n    y: PropTypes.number\n  })).isRequired,\n  strokeWidth: PropTypes.number\n};\n\nPolComponent.defaultProps = {\n  correct: false,\n};\n\nexport default withStyles(styles)(PolComponent);\n"],"file":"hotspot-polygon.js"}

package/configure/lib/hotspot-rectangle.js

@@ -31,7 +31,7 @@ var _index = require("@material-ui/core/styles/index");
 
 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 { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }
+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 RectComponent = /*#__PURE__*/function (_React$Component) {
   (0, _inherits2["default"])(RectComponent, _React$Component);

package/configure/lib/hotspot-rectangle.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/hotspot-rectangle.jsx"],"names":["RectComponent","e","props","width","height","isDrawing","onClick","id","cancelBubble","document","body","style","cursor","onDragEnd","x","target","y","classes","correct","hotspotColor","outlineColor","strokeWidth","base","handleClick","handleMouseLeave","handleMouseEnter","handleOnDragEnd","React","Component","styles","opacity","propTypes","PropTypes","object","isRequired","bool","string","number","func","defaultProps"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { Rect, Group } from 'react-konva';\nimport { withStyles } from '@material-ui/core/styles/index';\n\nclass RectComponent extends React.Component {\n  handleClick = (e) => {\n    const { width, height, isDrawing, onClick, id } = this.props;\n    if (width < 0 && height < 0 && isDrawing) {\n      return;\n    }\n    e.cancelBubble = true;\n    onClick(id);\n  };\n\n  handleMouseEnter = () => {\n    document.body.style.cursor = 'pointer';\n  };\n\n  handleMouseLeave = () => {\n    document.body.style.cursor = 'default';\n  };\n\n  handleOnDragEnd = (e) => {\n    const { onDragEnd, id } = this.props;\n\n    onDragEnd(id, {\n      x: e.target.x(),\n      y: e.target.y()\n    })\n  };\n\n  render() {\n    const {\n      classes,\n      correct,\n      height,\n      hotspotColor,\n      outlineColor,\n      width,\n      x,\n      y,\n      strokeWidth = 5\n    } = this.props;\n\n    return (\n      <Group>\n        <Rect\n          classes={classes.base}\n          width={width}\n          height={height}\n          fill={hotspotColor}\n          onClick={this.handleClick}\n          onTap={this.handleClick}\n          draggable\n          stroke={outlineColor}\n          strokeWidth={correct ? strokeWidth : 0}\n          onMouseLeave={this.handleMouseLeave}\n          onMouseEnter={this.handleMouseEnter}\n          onDragEnd={this.handleOnDragEnd}\n          x={x}\n          y={y}\n        />\n      </Group>\n    );\n  }\n}\n\nconst styles = () => ({\n  base: {\n    cursor: 'pointer',\n    opacity: 0.5\n  },\n});\n\nRectComponent.propTypes = {\n  classes: PropTypes.object.isRequired,\n  correct: PropTypes.bool,\n  isDrawing: PropTypes.bool.isRequired,\n  id: PropTypes.string.isRequired,\n  height: PropTypes.number.isRequired,\n  hotspotColor: PropTypes.string.isRequired,\n  onClick: PropTypes.func.isRequired,\n  onDragEnd: PropTypes.func.isRequired,\n  outlineColor: PropTypes.string.isRequired,\n  width: PropTypes.number.isRequired,\n  x: PropTypes.number.isRequired,\n  y: PropTypes.number.isRequired,\n  strokeWidth: PropTypes.number\n};\n\nRectComponent.defaultProps = {\n  correct: false,\n};\n\nexport default withStyles(styles)(RectComponent);\n"],"file":"hotspot-rectangle.js"}
+{"version":3,"sources":["../src/hotspot-rectangle.jsx"],"names":["RectComponent","e","props","width","height","isDrawing","onClick","id","cancelBubble","document","body","style","cursor","onDragEnd","x","target","y","classes","correct","hotspotColor","outlineColor","strokeWidth","base","handleClick","handleMouseLeave","handleMouseEnter","handleOnDragEnd","React","Component","styles","opacity","propTypes","PropTypes","object","isRequired","bool","string","number","func","defaultProps"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { Rect, Group } from 'react-konva';\nimport { withStyles } from '@material-ui/core/styles/index';\n\nclass RectComponent extends React.Component {\n  handleClick = (e) => {\n    const { width, height, isDrawing, onClick, id } = this.props;\n    if (width < 0 && height < 0 && isDrawing) {\n      return;\n    }\n    e.cancelBubble = true;\n    onClick(id);\n  };\n\n  handleMouseEnter = () => {\n    document.body.style.cursor = 'pointer';\n  };\n\n  handleMouseLeave = () => {\n    document.body.style.cursor = 'default';\n  };\n\n  handleOnDragEnd = (e) => {\n    const { onDragEnd, id } = this.props;\n\n    onDragEnd(id, {\n      x: e.target.x(),\n      y: e.target.y()\n    })\n  };\n\n  render() {\n    const {\n      classes,\n      correct,\n      height,\n      hotspotColor,\n      outlineColor,\n      width,\n      x,\n      y,\n      strokeWidth = 5\n    } = this.props;\n\n    return (\n      <Group>\n        <Rect\n          classes={classes.base}\n          width={width}\n          height={height}\n          fill={hotspotColor}\n          onClick={this.handleClick}\n          onTap={this.handleClick}\n          draggable\n          stroke={outlineColor}\n          strokeWidth={correct ? strokeWidth : 0}\n          onMouseLeave={this.handleMouseLeave}\n          onMouseEnter={this.handleMouseEnter}\n          onDragEnd={this.handleOnDragEnd}\n          x={x}\n          y={y}\n        />\n      </Group>\n    );\n  }\n}\n\nconst styles = () => ({\n  base: {\n    cursor: 'pointer',\n    opacity: 0.5\n  },\n});\n\nRectComponent.propTypes = {\n  classes: PropTypes.object.isRequired,\n  correct: PropTypes.bool,\n  isDrawing: PropTypes.bool.isRequired,\n  id: PropTypes.string.isRequired,\n  height: PropTypes.number.isRequired,\n  hotspotColor: PropTypes.string.isRequired,\n  onClick: PropTypes.func.isRequired,\n  onDragEnd: PropTypes.func.isRequired,\n  outlineColor: PropTypes.string.isRequired,\n  width: PropTypes.number.isRequired,\n  x: PropTypes.number.isRequired,\n  y: PropTypes.number.isRequired,\n  strokeWidth: PropTypes.number\n};\n\nRectComponent.defaultProps = {\n  correct: false,\n};\n\nexport default withStyles(styles)(RectComponent);\n"],"file":"hotspot-rectangle.js"}

package/configure/lib/index.js

@@ -35,13 +35,13 @@ var _root = _interopRequireDefault(require("./root"));
 
 var _defaults = _interopRequireDefault(require("./defaults"));
 
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
 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 { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }
+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 log = (0, _debug["default"])('hotspot:configure');
 

package/configure/lib/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.js"],"names":["log","HotspotConfigure","c","_configuration","_render","m","propertyType","_model","shapes","rectangles","polygons","map","shape","correct","onModelChanged","colorType","color","prompt","rationale","teacherInstructions","dimensions","imageUrl","handler","dispatchEvent","InsertImageEvent","src","done","DeleteImageEvent","createDefaultModel","sensibleDefaults","configuration","bind","s","reset","resetValue","ModelUpdatedEvent","dispatchModelUpdated","element","React","createElement","Root","model","onColorChanged","onImageUpload","onRationaleChanged","onConfigurationChanged","onPromptChanged","onUpdateImageDimension","imageSupport","add","insertImage","onDeleteImage","onUpdateShapes","onModelChangedByConfig","onTeacherInstructionsChanged","ReactDOM","render","HTMLElement","hotspotList","hotspotColor","outlineList","outlineColor"],"mappings":"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","sourcesContent":["import React from 'react';\nimport ReactDOM from 'react-dom';\nimport debug from 'debug';\nimport {\n  ModelUpdatedEvent,\n  DeleteImageEvent,\n  InsertImageEvent,\n} from '@pie-framework/pie-configure-events';\n\nimport Root from './root';\nimport sensibleDefaults from './defaults';\n\nconst log = debug('hotspot:configure');\n\nexport default class HotspotConfigure extends HTMLElement {\n  static createDefaultModel = (model = {}) => ({\n    ...sensibleDefaults.model,\n    ...model,\n    hotspotList: model.hotspotList || [model.hotspotColor] || sensibleDefaults.model.hotspotList,\n    outlineList: model.outlineList || [model.outlineColor] || sensibleDefaults.model.outlineList,\n    shapes: model.shapes || sensibleDefaults.model.shapes || {}\n  });\n\n  constructor() {\n    super();\n    this._model = HotspotConfigure.createDefaultModel();\n    this._configuration = sensibleDefaults.configuration;\n    this.onModelChanged = this.onModelChanged.bind(this);\n  }\n\n  set model(s) {\n    this._model = HotspotConfigure.createDefaultModel(s);\n    this._render();\n  }\n\n  set configuration(c) {\n    this._configuration = c;\n    this._render();\n  }\n\n  dispatchModelUpdated(reset) {\n    const resetValue = !!reset;\n\n    this.dispatchEvent(new ModelUpdatedEvent(this._model, resetValue));\n  }\n\n  onModelChanged(m, reset) {\n    this._model = m;\n    this.dispatchModelUpdated(reset);\n    this._render();\n  }\n\n  onConfigurationChanged = (c) => {\n    this._configuration = c;\n    this._render();\n  };\n\n  onModelChangedByConfig = (m, propertyType) => {\n    const _model = m;\n\n    if (propertyType === 'multipleCorrect') {\n      const { rectangles = [], polygons = [] } = _model.shapes || {};\n\n      _model.shapes.rectangles = rectangles.map(shape => ({ ...shape, correct: false }));\n      _model.shapes.polygons = polygons.map(shape => ({ ...shape, correct: false }));\n    }\n\n    this.onModelChanged(_model);\n  };\n\n  onColorChanged = (colorType, color) => {\n    this.onModelChanged({\n      ...this._model,\n      [colorType]: color\n    });\n  };\n\n  onPromptChanged = prompt => {\n    this.onModelChanged({\n      ...this._model,\n      prompt\n    });\n  };\n\n  onRationaleChanged = rationale => {\n    this.onModelChanged({\n      ...this._model,\n      rationale\n    });\n  };\n\n  onTeacherInstructionsChanged = teacherInstructions => {\n    this.onModelChanged({\n      ...this._model,\n      teacherInstructions\n    });\n  };\n\n  onUpdateImageDimension = dimensions => {\n    this.onModelChanged({\n      ...this._model,\n      dimensions\n    });\n  };\n\n  onUpdateShapes = shapes => {\n    this.onModelChanged({\n      ...this._model,\n      shapes\n    });\n  };\n\n  onImageUpload = imageUrl => {\n    this.onModelChanged({\n      ...this._model,\n      imageUrl\n    });\n  };\n\n  insertImage = handler => {\n    this.dispatchEvent(new InsertImageEvent(handler));\n  };\n\n  onDeleteImage = (src, done) => {\n    this.dispatchEvent(new DeleteImageEvent(src, done));\n  };\n\n  _render() {\n    log('_render');\n    let element = React.createElement(Root, {\n      configuration: this._configuration,\n      model: this._model,\n      onColorChanged: this.onColorChanged,\n      onImageUpload: this.onImageUpload,\n      onRationaleChanged: this.onRationaleChanged,\n      onConfigurationChanged: this.onConfigurationChanged,\n      onPromptChanged: this.onPromptChanged,\n      onUpdateImageDimension: this.onUpdateImageDimension,\n      imageSupport: {\n        add: this.insertImage,\n        delete: this.onDeleteImage\n      },\n      onUpdateShapes: this.onUpdateShapes,\n      onModelChangedByConfig: this.onModelChangedByConfig,\n      onTeacherInstructionsChanged: this.onTeacherInstructionsChanged,\n    });\n\n    ReactDOM.render(element, this);\n  }\n}\n"],"file":"index.js"}
+{"version":3,"sources":["../src/index.js"],"names":["log","HotspotConfigure","c","_configuration","_render","m","propertyType","_model","shapes","rectangles","polygons","map","shape","correct","onModelChanged","colorType","color","prompt","rationale","teacherInstructions","dimensions","imageUrl","handler","dispatchEvent","InsertImageEvent","src","done","DeleteImageEvent","createDefaultModel","sensibleDefaults","configuration","bind","s","reset","resetValue","ModelUpdatedEvent","dispatchModelUpdated","element","React","createElement","Root","model","onColorChanged","onImageUpload","onRationaleChanged","onConfigurationChanged","onPromptChanged","onUpdateImageDimension","imageSupport","add","insertImage","onDeleteImage","onUpdateShapes","onModelChangedByConfig","onTeacherInstructionsChanged","ReactDOM","render","HTMLElement","hotspotList","hotspotColor","outlineList","outlineColor"],"mappings":"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","sourcesContent":["import React from 'react';\nimport ReactDOM from 'react-dom';\nimport debug from 'debug';\nimport {\n  ModelUpdatedEvent,\n  DeleteImageEvent,\n  InsertImageEvent,\n} from '@pie-framework/pie-configure-events';\n\nimport Root from './root';\nimport sensibleDefaults from './defaults';\n\nconst log = debug('hotspot:configure');\n\nexport default class HotspotConfigure extends HTMLElement {\n  static createDefaultModel = (model = {}) => ({\n    ...sensibleDefaults.model,\n    ...model,\n    hotspotList: model.hotspotList || [model.hotspotColor] || sensibleDefaults.model.hotspotList,\n    outlineList: model.outlineList || [model.outlineColor] || sensibleDefaults.model.outlineList,\n    shapes: model.shapes || sensibleDefaults.model.shapes || {}\n  });\n\n  constructor() {\n    super();\n    this._model = HotspotConfigure.createDefaultModel();\n    this._configuration = sensibleDefaults.configuration;\n    this.onModelChanged = this.onModelChanged.bind(this);\n  }\n\n  set model(s) {\n    this._model = HotspotConfigure.createDefaultModel(s);\n    this._render();\n  }\n\n  set configuration(c) {\n    this._configuration = c;\n    this._render();\n  }\n\n  dispatchModelUpdated(reset) {\n    const resetValue = !!reset;\n\n    this.dispatchEvent(new ModelUpdatedEvent(this._model, resetValue));\n  }\n\n  onModelChanged(m, reset) {\n    this._model = m;\n    this.dispatchModelUpdated(reset);\n    this._render();\n  }\n\n  onConfigurationChanged = (c) => {\n    this._configuration = c;\n    this._render();\n  };\n\n  onModelChangedByConfig = (m, propertyType) => {\n    const _model = m;\n\n    if (propertyType === 'multipleCorrect') {\n      const { rectangles = [], polygons = [] } = _model.shapes || {};\n\n      _model.shapes.rectangles = rectangles.map(shape => ({ ...shape, correct: false }));\n      _model.shapes.polygons = polygons.map(shape => ({ ...shape, correct: false }));\n    }\n\n    this.onModelChanged(_model);\n  };\n\n  onColorChanged = (colorType, color) => {\n    this.onModelChanged({\n      ...this._model,\n      [colorType]: color\n    });\n  };\n\n  onPromptChanged = prompt => {\n    this.onModelChanged({\n      ...this._model,\n      prompt\n    });\n  };\n\n  onRationaleChanged = rationale => {\n    this.onModelChanged({\n      ...this._model,\n      rationale\n    });\n  };\n\n  onTeacherInstructionsChanged = teacherInstructions => {\n    this.onModelChanged({\n      ...this._model,\n      teacherInstructions\n    });\n  };\n\n  onUpdateImageDimension = dimensions => {\n    this.onModelChanged({\n      ...this._model,\n      dimensions\n    });\n  };\n\n  onUpdateShapes = shapes => {\n    this.onModelChanged({\n      ...this._model,\n      shapes\n    });\n  };\n\n  onImageUpload = imageUrl => {\n    this.onModelChanged({\n      ...this._model,\n      imageUrl\n    });\n  };\n\n  insertImage = handler => {\n    this.dispatchEvent(new InsertImageEvent(handler));\n  };\n\n  onDeleteImage = (src, done) => {\n    this.dispatchEvent(new DeleteImageEvent(src, done));\n  };\n\n  _render() {\n    log('_render');\n    let element = React.createElement(Root, {\n      configuration: this._configuration,\n      model: this._model,\n      onColorChanged: this.onColorChanged,\n      onImageUpload: this.onImageUpload,\n      onRationaleChanged: this.onRationaleChanged,\n      onConfigurationChanged: this.onConfigurationChanged,\n      onPromptChanged: this.onPromptChanged,\n      onUpdateImageDimension: this.onUpdateImageDimension,\n      imageSupport: {\n        add: this.insertImage,\n        delete: this.onDeleteImage\n      },\n      onUpdateShapes: this.onUpdateShapes,\n      onModelChangedByConfig: this.onModelChangedByConfig,\n      onTeacherInstructionsChanged: this.onTeacherInstructionsChanged,\n    });\n\n    ReactDOM.render(element, this);\n  }\n}\n"],"file":"index.js"}

package/configure/lib/root.js

@@ -29,23 +29,29 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 
 var _editableHtml = _interopRequireDefault(require("@pie-lib/editable-html"));
 
+var _styles = require("@material-ui/core/styles");
+
 var _Typography = _interopRequireDefault(require("@material-ui/core/Typography"));
 
-var _styles = require("@material-ui/core/styles");
+var _Info = _interopRequireDefault(require("@material-ui/icons/Info"));
+
+var _Tooltip = _interopRequireDefault(require("@material-ui/core/Tooltip"));
 
 var _hotspotPalette = _interopRequireDefault(require("./hotspot-palette"));
 
 var _hotspotContainer = _interopRequireDefault(require("./hotspot-container"));
 
+var _classnames = _interopRequireDefault(require("classnames"));
+
 var _utils = require("./utils");
 
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
 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 { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }
+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 Panel = _configUi.settings.Panel,
     toggle = _configUi.settings.toggle;
@@ -125,13 +131,40 @@ var Root = /*#__PURE__*/function (_React$Component) {
           teacherInstructions = _ref$teacherInstructi === void 0 ? {} : _ref$teacherInstructi,
           _ref$rationale = _ref.rationale,
           rationale = _ref$rationale === void 0 ? {} : _ref$rationale,
+          _ref$spellCheck = _ref.spellCheck,
+          spellCheck = _ref$spellCheck === void 0 ? {} : _ref$spellCheck,
           _ref$preserveAspectRa = _ref.preserveAspectRatio,
-          preserveAspectRatio = _ref$preserveAspectRa === void 0 ? {} : _ref$preserveAspectRa;
+          preserveAspectRatio = _ref$preserveAspectRa === void 0 ? {} : _ref$preserveAspectRa,
+          _ref$maxImageWidth = _ref.maxImageWidth,
+          maxImageWidth = _ref$maxImageWidth === void 0 ? {} : _ref$maxImageWidth,
+          _ref$maxImageHeight = _ref.maxImageHeight,
+          maxImageHeight = _ref$maxImageHeight === void 0 ? {} : _ref$maxImageHeight;
 
       var _ref2 = model || {},
           teacherInstructionsEnabled = _ref2.teacherInstructionsEnabled,
           promptEnabled = _ref2.promptEnabled,
-          rationaleEnabled = _ref2.rationaleEnabled;
+          rationaleEnabled = _ref2.rationaleEnabled,
+          spellCheckEnabled = _ref2.spellCheckEnabled,
+          errors = _ref2.errors;
+
+      var _ref3 = errors || {},
+          shapesError = _ref3.shapesError,
+          selectionsError = _ref3.selectionsError;
+
+      var toolbarOpts = {};
+      var validationMessage = (0, _utils.generateValidationMessage)(configuration);
+      var defaultImageMaxWidth = maxImageWidth && maxImageWidth.prompt;
+      var defaultImageMaxHeight = maxImageHeight && maxImageHeight.prompt;
+
+      switch (model.toolbarEditorPosition) {
+        case 'top':
+          toolbarOpts.position = 'top';
+          break;
+
+        default:
+          toolbarOpts.position = 'bottom';
+          break;
+      }
 
       return /*#__PURE__*/_react["default"].createElement("div", {
         className: classes.base
@@ -149,7 +182,8 @@ var Root = /*#__PURE__*/function (_React$Component) {
             },
             Properties: {
               teacherInstructionsEnabled: teacherInstructions.settings && toggle(teacherInstructions.label),
-              rationaleEnabled: rationale.settings && toggle(rationale.label)
+              rationaleEnabled: rationale.settings && toggle(rationale.label),
+              spellCheckEnabled: spellCheck.settings && toggle(spellCheck.label)
             }
           }
         })
@@ -162,7 +196,11 @@ var Root = /*#__PURE__*/function (_React$Component) {
         markup: model.teacherInstructions || '',
         onChange: onTeacherInstructionsChanged,
         imageSupport: imageSupport,
-        nonEmpty: false
+        nonEmpty: false,
+        toolbarOpts: toolbarOpts,
+        spellCheck: spellCheckEnabled,
+        maxImageWidth: maxImageWidth && maxImageWidth.teacherInstructions || defaultImageMaxWidth,
+        maxImageHeight: maxImageHeight && maxImageHeight.teacherInstructions || defaultImageMaxHeight
       })), promptEnabled && /*#__PURE__*/_react["default"].createElement(_configUi.InputContainer, {
         label: prompt.label,
         className: classes.prompt
@@ -170,18 +208,46 @@ var Root = /*#__PURE__*/function (_React$Component) {
         markup: model.prompt || '',
         onChange: onPromptChanged,
         imageSupport: imageSupport,
-        nonEmpty: false
+        nonEmpty: false,
+        toolbarOpts: toolbarOpts,
+        spellCheck: spellCheckEnabled,
+        maxImageWidth: defaultImageMaxWidth,
+        maxImageHeight: defaultImageMaxHeight
       })), rationaleEnabled && /*#__PURE__*/_react["default"].createElement(_configUi.InputContainer, {
         label: rationale.label,
         className: classes.prompt
       }, /*#__PURE__*/_react["default"].createElement(_editableHtml["default"], {
         markup: model.rationale || '',
         onChange: onRationaleChanged,
-        imageSupport: imageSupport
-      })), /*#__PURE__*/_react["default"].createElement(_Typography["default"], {
-        className: classes.label,
+        imageSupport: imageSupport,
+        toolbarOpts: toolbarOpts,
+        spellCheck: spellCheckEnabled,
+        maxImageWidth: maxImageWidth && maxImageWidth.rationale || defaultImageMaxWidth,
+        maxImageHeight: maxImageHeight && maxImageHeight.rationale || defaultImageMaxHeight
+      })), /*#__PURE__*/_react["default"].createElement("div", {
+        className: (0, _classnames["default"])(classes.label, classes.flexContainer)
+      }, /*#__PURE__*/_react["default"].createElement(_Typography["default"], {
+        className: classes.subheading,
         variant: "subheading"
-      }, "Define Hotspot"), /*#__PURE__*/_react["default"].createElement(_hotspotPalette["default"], {
+      }, "Define Hotspot"), /*#__PURE__*/_react["default"].createElement(_Tooltip["default"], {
+        classes: {
+          tooltip: classes.tooltip
+        },
+        disableFocusListener: true,
+        disableTouchListener: true,
+        placement: 'left',
+        title: validationMessage
+      }, /*#__PURE__*/_react["default"].createElement(_Info["default"], {
+        fontSize: 'small',
+        color: 'primary',
+        style: {
+          "float": 'right'
+        }
+      }))), shapesError && /*#__PURE__*/_react["default"].createElement("div", {
+        className: classes.errorText
+      }, shapesError), selectionsError && /*#__PURE__*/_react["default"].createElement("div", {
+        className: classes.errorText
+      }, selectionsError), /*#__PURE__*/_react["default"].createElement(_hotspotPalette["default"], {
         hotspotColor: model.hotspotColor,
         hotspotList: model.hotspotList,
         outlineColor: model.outlineColor,
@@ -260,12 +326,29 @@ var styles = function styles(theme) {
       paddingTop: theme.spacing.unit * 2,
       width: '100%'
     },
+    subheading: {
+      marginRight: '5px'
+    },
     regular: {
       marginBottom: theme.spacing.unit * 3
     },
     switchElement: {
       justifyContent: 'space-between',
       margin: 0
+    },
+    flexContainer: {
+      display: 'flex',
+      alignItems: 'center'
+    },
+    tooltip: {
+      fontSize: '12px',
+      whiteSpace: 'pre',
+      maxWidth: '500px'
+    },
+    errorText: {
+      fontSize: '12px',
+      color: 'red',
+      padding: '5px 0'
     }
   };
 };