@atlaskit/tooltip/dist/cjs/TooltipContainer.js

A tooltip is a floating, non-actionable label used to explain a user interface element or feature.

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = require("tslib");
/** @jsx jsx */
var react_1 = require("react");
var core_1 = require("@emotion/core");
var colors_1 = require("@atlaskit/theme/colors");
var components_1 = tslib_1.__importDefault(require("@atlaskit/theme/components"));
var constants_1 = require("@atlaskit/theme/constants");
var TooltipPrimitive_1 = tslib_1.__importDefault(require("./TooltipPrimitive"));
var baseCss = core_1.css(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  border-radius: ", "px;\n  box-sizing: border-box;\n  font-size: 12px;\n  left: 0;\n  line-height: 1.3;\n  max-width: 240px;\n  padding: 2px 6px;\n  top: 0;\n  word-wrap: break-word;\n  overflow-wrap: break-word;\n"], ["\n  border-radius: ", "px;\n  box-sizing: border-box;\n  font-size: 12px;\n  left: 0;\n  line-height: 1.3;\n  max-width: 240px;\n  padding: 2px 6px;\n  top: 0;\n  word-wrap: break-word;\n  overflow-wrap: break-word;\n"])), constants_1.borderRadius());
var truncateCss = core_1.css(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n  max-width: 420px;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n"], ["\n  max-width: 420px;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n"])));
var TooltipContainer = react_1.forwardRef(function TooltipContainer(_a, ref) {
    var style = _a.style, className = _a.className, children = _a.children, truncate = _a.truncate, placement = _a.placement, testId = _a.testId;
    return (core_1.jsx(components_1.default.Consumer, null, function (_a) {
        var mode = _a.mode;
        return (core_1.jsx(TooltipPrimitive_1.default, { ref: ref, style: style, className: className, placement: placement, testId: testId, css: [
                baseCss,
                truncate ? truncateCss : null,
                core_1.css(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject(["\n                background-color: ", ";\n                color: ", ";\n              "], ["\n                background-color: ", ";\n                color: ", ";\n              "])), mode === 'light' ? colors_1.N800 : colors_1.DN0, mode === 'light' ? colors_1.N0 : colors_1.DN600),
            ] }, children));
    }));
});
TooltipContainer.displayName = 'TooltipContainer';
exports.default = TooltipContainer;
var templateObject_1, templateObject_2, templateObject_3;
//# sourceMappingURL=TooltipContainer.js.map