react-mapfilter/commonjs/ReportView/MarkerIcon.js

These components are designed for viewing data in Mapeo. They share a common interface:

"use strict";

var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");

var _interopRequireWildcard = require("@babel/runtime-corejs3/helpers/interopRequireWildcard");

var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");

_Object$defineProperty(exports, "__esModule", {
  value: true
});

exports.default = void 0;

var React = _interopRequireWildcard(require("react"));

var _objectAssign = _interopRequireDefault(require("object-assign"));

// @flow
var styles = {
  svg: {
    width: 32,
    height: 32
  },
  outline: {
    stroke: '#ffffff',
    strokeWidth: 4.9,
    strokeMiterlimit: 4,
    strokeOpacity: 0.75,
    fill: 'none'
  },
  text: {
    fill: '#fff'
  }
};
/*:: type Props = {
  style: Object,
  color: string,
  label?: string
}*/

/* A circle icon with an optional label, for map & reports */
var MarkerIcon
/*: React.StatelessFunctionalComponent<Props>*/
= function MarkerIcon(_ref) {
  var _ref$style = _ref.style,
      style = _ref$style === void 0 ? {} : _ref$style,
      _ref$color = _ref.color,
      color = _ref$color === void 0 ? '#000000' : _ref$color,
      label = _ref.label;
  return /*#__PURE__*/React.createElement("svg", {
    version: "1.1",
    style: (0, _objectAssign.default)({}, styles.svg, style),
    viewBox: "0 0 40 40"
  }, /*#__PURE__*/React.createElement("circle", {
    style: (0, _objectAssign.default)({}, styles.outline, {
      fill: color
    }),
    r: "20",
    cx: "20",
    cy: "20"
  }), label && /*#__PURE__*/React.createElement("text", {
    x: "20",
    y: "27",
    fontSize: "20",
    fontFamily: "Roboto",
    textAnchor: "middle",
    style: styles.text
  }, label));
};

var _default = MarkerIcon;
exports.default = _default;
//# sourceMappingURL=MarkerIcon.js.map