import { jsx as _jsx } from "react/jsx-runtime";
import { Tooltip } from "@material-ui/core";
import styled from "styled-components";
import { AttentionIcon } from "../../../CommonUI/Icon/AttentionIcon";
export const Error = ({ issues }) => {
    if (issues.length === 0)
        return null;
    return (_jsx(Tooltip, Object.assign({ title: issues[0].issue }, { children: _jsx(ErrorRender, Object.assign({ id: issues[0].elementId }, { children: _jsx(AttentionIcon, {}, void 0) }), void 0) }), void 0));
};
export const ErrorRender = styled.div `
    position: absolute;
    bottom: 0;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: center;

    width: 24px;

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