UNPKG

@intuitionrobotics/thunderstorm

Version:
68 lines 2.69 kB
"use strict"; /* * Thunderstorm is a full web app framework! * * Typescript & Express backend infrastructure that natively runs on firebase function * Typescript & React frontend infrastructure * * Copyright (C) 2020 Intuition Robotics * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ Object.defineProperty(exports, "__esModule", { value: true }); exports.Tooltip = exports.TooltipDefaultStyle = void 0; const React = require("react"); const TooltipModule_1 = require("./TooltipModule"); const BaseComponent_1 = require("../../core/BaseComponent"); const ts_common_1 = require("@intuitionrobotics/ts-common"); exports.TooltipDefaultStyle = { backgroundColor: "#f9f9f9", borderRadius: "3px", boxShadow: "0 0 4px 0 #00000066", color: "#333435", fontSize: "13px", padding: "1px 3px", position: "fixed", }; class Tooltip extends BaseComponent_1.BaseComponent { constructor(props) { super(props); this.ref = React.createRef(); this.__showTooltip = (model) => { this.setState(() => ({ model })); if (!model) return; const duration = model.duration; if (duration <= 0) return; if (this.timeoutInterval) clearTimeout(this.timeoutInterval); this.timeoutInterval = (0, ts_common_1._setTimeout)(TooltipModule_1.TooltipModule.hide, duration, model); }; this.state = {}; } render() { const { model } = this.state; if (!model || !model.content) return null; const top = model.location && model.location.y; const left = model.location && model.location.x; const positionStyle = { top: `${top}px`, left: `${left}px` }; return React.createElement("div", { ref: this.ref, id: "tooltip", style: Object.assign(Object.assign({}, (model.style || exports.TooltipDefaultStyle)), positionStyle) }, typeof model.content === "string" ? React.createElement("div", { dangerouslySetInnerHTML: { __html: model.content } }) : model.content); } } exports.Tooltip = Tooltip; //# sourceMappingURL=Tooltip.js.map