"use strict";
var __assign = (this && this.__assign) || function () {
    __assign = Object.assign || function(t) {
        for (var s, i = 1, n = arguments.length; i < n; i++) {
            s = arguments[i];
            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
                t[p] = s[p];
        }
        return t;
    };
    return __assign.apply(this, arguments);
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.GlLogoCard = void 0;
var jsx_runtime_1 = require("react/jsx-runtime");
/* eslint-disable @typescript-eslint/no-namespace */
var react_1 = require("react");
var theme_1 = require("../theme");
var GlLogo_1 = require("../utils/GlLogo");
var GlCard_1 = require("./GlCard");
var theme_2 = require("../theme");
var GlButton_1 = require("../utils/GlButton");
var tss_react_1 = require("tss-react");
exports.GlLogoCard = (0, react_1.memo)(function (props) {
    var _a;
    var className = props.className, iconUrls = props.iconUrls, paragraph = props.paragraph, title = props.title, buttonLabel = props.buttonLabel, overlapIcons = props.overlapIcons, link = props.link;
    var _b = useStyles({
        "numberOfIcons": (_a = iconUrls === null || iconUrls === void 0 ? void 0 : iconUrls.length) !== null && _a !== void 0 ? _a : 0,
        "overlapIcons": overlapIcons !== null && overlapIcons !== void 0 ? overlapIcons : false,
    }), classes = _b.classes, cx = _b.cx, css = _b.css;
    classes = (0, tss_react_1.useMergedClasses)(classes, props.classes);
    return ((0, jsx_runtime_1.jsxs)(GlCard_1.GlCard, __assign({ link: link, className: cx(classes.root, className) }, { children: [iconUrls && ((0, jsx_runtime_1.jsx)("div", __assign({ className: classes.iconWrapper }, { children: iconUrls.map(function (url, index) { return ((0, jsx_runtime_1.jsx)(GlLogo_1.GlLogo, { className: cx(classes.icon, css({
                        "zIndex": iconUrls.length - index,
                    })), logoUrl: url }, index)); }) }))), (0, jsx_runtime_1.jsxs)("div", __assign({ className: classes.textWrapper }, { children: [title !== undefined && ((0, jsx_runtime_1.jsx)(theme_1.Text, __assign({ typo: "section heading", className: classes.title }, { children: title }))), paragraph !== undefined && ((0, jsx_runtime_1.jsx)(theme_1.Text, __assign({ typo: "body 1", className: classes.paragraph }, { children: paragraph })))] })), buttonLabel !== undefined && ((0, jsx_runtime_1.jsx)(GlButton_1.GlButton, __assign({ type: "submit", href: link === null || link === void 0 ? void 0 : link.href, variant: "secondary", onClick: link === null || link === void 0 ? void 0 : link.onClick, className: classes.button }, { children: buttonLabel })))] })));
});
var useStyles = (0, theme_1.makeStyles)({ "name": { GlLogoCard: exports.GlLogoCard } })(function (theme, _a) {
    var numberOfIcons = _a.numberOfIcons, overlapIcons = _a.overlapIcons;
    return ({
        "root": {
            "padding": theme.spacing({
                "rightLeft": 3,
                "topBottom": 4,
            }),
            "boxShadow": theme.shadows[1],
            "display": "flex",
            "flexDirection": "column",
            "justifyContent": "space-between",
            "alignItems": "center",
            "margin": (function () {
                if (theme.windowInnerWidth >= theme_2.breakpointsValues.lg) {
                    return undefined;
                }
                return theme.spacing(1);
            })(),
        },
        "iconWrapper": {
            "marginRight": overlapIcons ? theme.spacing(3) + 5 : undefined,
            "display": "grid",
            "columnGap": theme.spacing(2),
            "gridTemplateColumns": (function () {
                if (overlapIcons) {
                    return "repeat(auto-fit, minmax(10px, max-content))";
                }
                return "repeat(".concat(numberOfIcons, ", 1fr)");
            })(),
            "width": (function () {
                if (!overlapIcons) {
                    return undefined;
                }
                return numberOfIcons * 35;
            })(),
        },
        "icon": __assign({}, (function () {
            var value = (function () {
                if (theme.windowInnerWidth >= theme_2.breakpointsValues.lg) {
                    return 50;
                }
                return 40;
            })();
            return {
                "width": value,
                "fill": theme.colors.palette.focus.main,
                "& svg": {
                    "width": value,
                    "height": value,
                },
            };
        })()),
        "title": {
            "marginTop": theme.spacing(4),
        },
        "paragraph": {
            "marginTop": theme.spacing(4),
        },
        "textWrapper": {
            "textAlign": "center",
            "marginBottom": theme.spacing(4),
        },
        "button": {},
    });
});
//# sourceMappingURL=GlLogoCard.js.map