var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
    return cooked;
};
import React from 'react';
import { ButtonStyle } from '@monstrosity/enums';
import styled from '@monstrosity/utilities/themed-components';
import { IllustrationName } from '@monstrosity/enums/illustrations';
import { BarButton } from '../Button/bar-button';
import { Cover } from '../Cover/cover';
import { Body, Section } from '../../primitives/Typeography/typeography';
var ErrorRoot = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: space-around;\n    align-items: center;\n\theight: 100%;\n\tpadding: 10% 1rem;\n\ttext-align: center;\n\tbackground: ", ";\n"], ["\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: space-around;\n    align-items: center;\n\theight: 100%;\n\tpadding: 10% 1rem;\n\ttext-align: center;\n\tbackground: ", ";\n"])), function (_a) {
    var theme = _a.theme;
    return theme.style.colour.background;
});
var BodyContainer = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n\tpadding: 1.5rem 0;\n"], ["\n\tpadding: 1.5rem 0;\n"])));
export var Error = function (_a) {
    var onClick = _a.onClick, errorCode = _a.errorCode;
    return (React.createElement(ErrorRoot, null,
        React.createElement(Cover, { illustration: IllustrationName.OneWorldTradeCenter }),
        React.createElement(BodyContainer, null,
            React.createElement(Section, null, "Oops! Something went Wrong"),
            React.createElement("br", null),
            React.createElement(Body, null,
                "Error Code: ",
                errorCode)),
        React.createElement(BarButton, { onClick: onClick, label: "Try Again", buttonStyle: ButtonStyle.Primary })));
};
var templateObject_1, templateObject_2;
