@jacobsdigitalfactory/react-image-hotspots/dist/Hotspot.js

React component for rendering images with hotspots

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = void 0;

var _react = _interopRequireDefault(require("react"));

var _propTypes = _interopRequireDefault(require("prop-types"));

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }

function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }

function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }

function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }

function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }

function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }

function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }

function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }

function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }

var Hotspot =
/*#__PURE__*/
function (_React$Component) {
  _inherits(Hotspot, _React$Component);

  function Hotspot() {
    _classCallCheck(this, Hotspot);

    return _possibleConstructorReturn(this, _getPrototypeOf(Hotspot).apply(this, arguments));
  }

  _createClass(Hotspot, [{
    key: "render",
    value: function render() {
      var _this$props = this.props,
          x = _this$props.x,
          y = _this$props.y,
          content = _this$props.content,
          _this$props$style = _this$props.style,
          style = _this$props$style === void 0 ? {
        fontFamily: 'Sans-Serif',
        background: 'white',
        boxShadow: '0px 0px 2px 0px rgba(0,0,0,0.5)',
        pointerEvents: 'auto'
      } : _this$props$style;
      var hotspotStyle = Object.assign({
        position: 'absolute',
        display: 'block',
        top: y + '%',
        left: x + '%'
      }, style);
      return _react["default"].createElement("div", {
        className: "hotspot",
        style: hotspotStyle
      }, content);
    }
  }]);

  return Hotspot;
}(_react["default"].Component);

Hotspot.propTypes = {
  /** percentage from the left of the image to show this hotspot */
  x: _propTypes["default"].number,

  /** percentage from the top of the image to show this hotspot */
  y: _propTypes["default"].number,

  /** the content of the hotspot */
  content: _propTypes["default"].element,

  /** the style of the hotspot */
  style: _propTypes["default"].object
};
var _default = Hotspot;
exports["default"] = _default;
//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uL3NyYy9Ib3RzcG90LmpzIl0sIm5hbWVzIjpbIkhvdHNwb3QiLCJwcm9wcyIsIngiLCJ5IiwiY29udGVudCIsInN0eWxlIiwiZm9udEZhbWlseSIsImJhY2tncm91bmQiLCJib3hTaGFkb3ciLCJwb2ludGVyRXZlbnRzIiwiaG90c3BvdFN0eWxlIiwiT2JqZWN0IiwiYXNzaWduIiwicG9zaXRpb24iLCJkaXNwbGF5IiwidG9wIiwibGVmdCIsIlJlYWN0IiwiQ29tcG9uZW50IiwicHJvcFR5cGVzIiwiUHJvcFR5cGVzIiwibnVtYmVyIiwiZWxlbWVudCIsIm9iamVjdCJdLCJtYXBwaW5ncyI6Ijs7Ozs7OztBQUFBOztBQUNBOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7O0lBRU1BLE87Ozs7Ozs7Ozs7Ozs7NkJBQ007QUFBQSx3QkFNRixLQUFLQyxLQU5IO0FBQUEsVUFDQUMsQ0FEQSxlQUNBQSxDQURBO0FBQUEsVUFDR0MsQ0FESCxlQUNHQSxDQURIO0FBQUEsVUFDTUMsT0FETixlQUNNQSxPQUROO0FBQUEsMENBQ2VDLEtBRGY7QUFBQSxVQUNlQSxLQURmLGtDQUN1QjtBQUM3QkMsUUFBQUEsVUFBVSxFQUFFLFlBRGlCO0FBRTdCQyxRQUFBQSxVQUFVLEVBQUUsT0FGaUI7QUFHN0JDLFFBQUFBLFNBQVMsRUFBRSxpQ0FIa0I7QUFJN0JDLFFBQUFBLGFBQWEsRUFBRTtBQUpjLE9BRHZCO0FBUVIsVUFBTUMsWUFBWSxHQUFHQyxNQUFNLENBQUNDLE1BQVAsQ0FBYztBQUNqQ0MsUUFBQUEsUUFBUSxFQUFFLFVBRHVCO0FBRWpDQyxRQUFBQSxPQUFPLEVBQUUsT0FGd0I7QUFHakNDLFFBQUFBLEdBQUcsRUFBRVosQ0FBQyxHQUFHLEdBSHdCO0FBSWpDYSxRQUFBQSxJQUFJLEVBQUVkLENBQUMsR0FBRztBQUp1QixPQUFkLEVBS2xCRyxLQUxrQixDQUFyQjtBQU9BLGFBQU87QUFBSyxRQUFBLFNBQVMsRUFBQyxTQUFmO0FBQXlCLFFBQUEsS0FBSyxFQUFFSztBQUFoQyxTQUFnRE4sT0FBaEQsQ0FBUDtBQUNEOzs7O0VBakJtQmEsa0JBQU1DLFM7O0FBb0I1QmxCLE9BQU8sQ0FBQ21CLFNBQVIsR0FBb0I7QUFDbEI7QUFDQWpCLEVBQUFBLENBQUMsRUFBRWtCLHNCQUFVQyxNQUZLOztBQUdsQjtBQUNBbEIsRUFBQUEsQ0FBQyxFQUFFaUIsc0JBQVVDLE1BSks7O0FBS2xCO0FBQ0FqQixFQUFBQSxPQUFPLEVBQUVnQixzQkFBVUUsT0FORDs7QUFPbEI7QUFDQWpCLEVBQUFBLEtBQUssRUFBRWUsc0JBQVVHO0FBUkMsQ0FBcEI7ZUFXZXZCLE8iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgUmVhY3QgZnJvbSAncmVhY3QnXG5pbXBvcnQgUHJvcFR5cGVzIGZyb20gJ3Byb3AtdHlwZXMnXG5cbmNsYXNzIEhvdHNwb3QgZXh0ZW5kcyBSZWFjdC5Db21wb25lbnQge1xuICByZW5kZXIgKCkge1xuICAgIGNvbnN0IHsgeCwgeSwgY29udGVudCwgc3R5bGUgPSB7XG4gICAgICBmb250RmFtaWx5OiAnU2Fucy1TZXJpZicsXG4gICAgICBiYWNrZ3JvdW5kOiAnd2hpdGUnLFxuICAgICAgYm94U2hhZG93OiAnMHB4IDBweCAycHggMHB4IHJnYmEoMCwwLDAsMC41KScsXG4gICAgICBwb2ludGVyRXZlbnRzOiAnYXV0bydcbiAgICB9IH0gPSB0aGlzLnByb3BzXG5cbiAgICBjb25zdCBob3RzcG90U3R5bGUgPSBPYmplY3QuYXNzaWduKHtcbiAgICAgIHBvc2l0aW9uOiAnYWJzb2x1dGUnLFxuICAgICAgZGlzcGxheTogJ2Jsb2NrJyxcbiAgICAgIHRvcDogeSArICclJyxcbiAgICAgIGxlZnQ6IHggKyAnJSdcbiAgICB9LCBzdHlsZSlcblxuICAgIHJldHVybiA8ZGl2IGNsYXNzTmFtZT0naG90c3BvdCcgc3R5bGU9e2hvdHNwb3RTdHlsZX0+eyBjb250ZW50IH08L2Rpdj5cbiAgfVxufVxuXG5Ib3RzcG90LnByb3BUeXBlcyA9IHtcbiAgLyoqIHBlcmNlbnRhZ2UgZnJvbSB0aGUgbGVmdCBvZiB0aGUgaW1hZ2UgdG8gc2hvdyB0aGlzIGhvdHNwb3QgKi9cbiAgeDogUHJvcFR5cGVzLm51bWJlcixcbiAgLyoqIHBlcmNlbnRhZ2UgZnJvbSB0aGUgdG9wIG9mIHRoZSBpbWFnZSB0byBzaG93IHRoaXMgaG90c3BvdCAqL1xuICB5OiBQcm9wVHlwZXMubnVtYmVyLFxuICAvKiogdGhlIGNvbnRlbnQgb2YgdGhlIGhvdHNwb3QgKi9cbiAgY29udGVudDogUHJvcFR5cGVzLmVsZW1lbnQsXG4gIC8qKiB0aGUgc3R5bGUgb2YgdGhlIGhvdHNwb3QgKi9cbiAgc3R5bGU6IFByb3BUeXBlcy5vYmplY3Rcbn1cblxuZXhwb3J0IGRlZmF1bHQgSG90c3BvdFxuIl19