"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.ErrorRender = exports.Error = void 0;
const tslib_1 = require("tslib");
const jsx_runtime_1 = require("react/jsx-runtime");
const core_1 = require("@material-ui/core");
const styled_components_1 = tslib_1.__importDefault(require("styled-components"));
const AttentionIcon_1 = require("../../../CommonUI/Icon/AttentionIcon");
const Error = ({ issues }) => {
    if (issues.length === 0)
        return null;
    return ((0, jsx_runtime_1.jsx)(core_1.Tooltip, { title: issues[0].issue, children: (0, jsx_runtime_1.jsx)(exports.ErrorRender, { id: issues[0].elementId, children: (0, jsx_runtime_1.jsx)(AttentionIcon_1.AttentionIcon, {}) }) }));
};
exports.Error = Error;
exports.ErrorRender = styled_components_1.default.div `
    position: absolute;
    bottom: 0;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: center;

    width: 24px;

    z-index: 1;
`;
//# sourceMappingURL=Error.js.map