"use strict";
var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
    return cooked;
};
var __importStar = (this && this.__importStar) || function (mod) {
    if (mod && mod.__esModule) return mod;
    var result = {};
    if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result[k] = mod[k];
    result["default"] = mod;
    return result;
};
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
var _a;
Object.defineProperty(exports, "__esModule", { value: true });
var React = __importStar(require("react"));
var styled_components_1 = __importDefault(require("styled-components"));
var styleConstants_1 = require("../styleConstants");
var icons_1 = require("../icons");
var NoticeTypes;
(function (NoticeTypes) {
    NoticeTypes[NoticeTypes["INFO"] = 0] = "INFO";
    NoticeTypes[NoticeTypes["ERROR"] = 1] = "ERROR";
    NoticeTypes[NoticeTypes["ALERT"] = 2] = "ALERT";
    NoticeTypes[NoticeTypes["ATTENTION"] = 3] = "ATTENTION";
    NoticeTypes[NoticeTypes["FOUNDATION_ACTION"] = 4] = "FOUNDATION_ACTION";
})(NoticeTypes = exports.NoticeTypes || (exports.NoticeTypes = {}));
var typeColors = (_a = {},
    _a[NoticeTypes.INFO] = {
        border: "rgb(208,237,237)",
        background: "rgb(208,237,237)",
        color: styleConstants_1.colors.primary.CIVIL_GRAY_1,
        weight: "400",
    },
    _a[NoticeTypes.ERROR] = {
        border: "rgb(242, 82, 74,1)",
        background: "rgb(242, 82, 74,0.1)",
        color: styleConstants_1.colors.primary.CIVIL_GRAY_1,
        weight: "400",
    },
    _a[NoticeTypes.ALERT] = {
        border: "rgba(94,94,94,0.12)",
        background: "#FFFDE9",
        color: styleConstants_1.colors.primary.CIVIL_GRAY_1,
        weight: "400",
    },
    _a[NoticeTypes.ATTENTION] = {
        border: "rgba(255,00,0,1)",
        background: "#FBF9F6",
        color: styleConstants_1.colors.primary.CIVIL_GRAY_1,
        weight: "400",
    },
    _a[NoticeTypes.FOUNDATION_ACTION] = {
        border: styleConstants_1.colors.accent.CIVIL_GRAY_3,
        background: styleConstants_1.colors.basic.WHITE,
        color: styleConstants_1.colors.primary.BLACK,
        weight: "bold",
    },
    _a);
exports.NoticeContainer = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: row;\n  color: ", ";\n  font-family: ", ";\n  font-size: 14px;\n  line-height: 20px;\n  padding: 30px 0;\n  text-align: center;\n  border: 1px solid ", ";\n  border-radius: 4px;\n  background-color: ", ";\n  align-items: center;\n  font-weight: ", ";\n"], ["\n  display: flex;\n  flex-direction: row;\n  color: ", ";\n  font-family: ", ";\n  font-size: 14px;\n  line-height: 20px;\n  padding: 30px 0;\n  text-align: center;\n  border: 1px solid ", ";\n  border-radius: 4px;\n  background-color: ", ";\n  align-items: center;\n  font-weight: ", ";\n"])), function (props) { return typeColors[props.type].color; }, styleConstants_1.fonts.SANS_SERIF, function (props) { return typeColors[props.type].border; }, function (props) { return typeColors[props.type].background; }, function (props) { return typeColors[props.type].weight; });
exports.NoticeIconContainer = styled_components_1.default("div")(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  padding-left: 24px;\n  width: 52px;\n"], ["\n  padding-left: 24px;\n  width: 52px;\n"])));
exports.NoticeMessageContainer = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  flex-grow: 1;\n  margin-right: 80px;\n  margin-left: 28px;\n"], ["\n  flex-grow: 1;\n  margin-right: 80px;\n  margin-left: 28px;\n"])));
exports.Notice = function (_a) {
    var className = _a.className, children = _a.children, type = _a.type, icon = _a.icon;
    var displayIcon = null;
    if (type === NoticeTypes.ERROR) {
        displayIcon = React.createElement(icons_1.InfoNotification, null);
    }
    else if (type === NoticeTypes.FOUNDATION_ACTION) {
        displayIcon = icon;
    }
    return (React.createElement(exports.NoticeContainer, { type: type, className: className },
        React.createElement(exports.NoticeIconContainer, null, displayIcon),
        React.createElement(exports.NoticeMessageContainer, null, children)));
};
var templateObject_1, templateObject_2, templateObject_3;
//# sourceMappingURL=index.js.map