UNPKG

@hackoregon/component-library

Version:

Official repo for Hack Oregon React component library

50 lines (44 loc) 2.13 kB
function _templateObject() { var data = _taggedTemplateLiteral(["\n font-family: Helvetica, Arial, sans-serif;\n font-size: 14px;\n position: absolute;\n padding: 4px;\n margin: 8px;\n background: rgba(0, 0, 0, 0.75);\n color: #ffffff;\n max-width: 250px;\n z-index: 9;\n pointer-events: none;\n"]); _templateObject = function _templateObject() { return data; }; return data; } function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); } import React from "react"; import PropTypes from "prop-types"; import { css } from "emotion"; import { get } from "lodash"; import window from "global/window"; var tooltip = css(_templateObject()); var MapTooltip = function MapTooltip(props) { var tooltipInfo = props.tooltipInfo, x = props.x, y = props.y, primaryName = props.primaryName, primaryField = props.primaryField, secondaryName = props.secondaryName, secondaryField = props.secondaryField, isHex = props.isHex; var xPosition = x < get(window, "innerWidth", 1000) * 0.66 ? x : x - get(window, "innerWidth", 1000) * 0.1; var yPostition = y < 375 ? y : y - 50; return React.createElement("div", { className: tooltip, style: { left: xPosition, top: yPostition } }, primaryName ? React.createElement("div", null, primaryName, ": ", tooltipInfo.properties[primaryField]) : null, secondaryName ? React.createElement("div", null, secondaryName, ": ", tooltipInfo.properties[secondaryField]) : null, isHex ? React.createElement("div", null, React.createElement("div", null, "elevation: ", tooltipInfo.elevationValue), React.createElement("div", null, "coordinates: ", tooltipInfo.centroid.join(", "))) : null); }; MapTooltip.propTypes = { tooltipInfo: PropTypes.shape({}), x: PropTypes.number, y: PropTypes.number, primaryName: PropTypes.string, primaryField: PropTypes.string, secondaryName: PropTypes.string, secondaryField: PropTypes.string, isHex: PropTypes.bool }; export default MapTooltip;