import { __assign } from "tslib";
/* eslint-disable jsx-a11y/control-has-associated-label */
// @ts-nocheck
/* eslint-disable jsx-a11y/anchor-has-content */
import './PageCard.css';
import React, { useMemo } from 'react';
import { IconArrowRight } from '../../icons/IconArrowRight/IconArrowRight';
import { cn } from '../../utils/bem';
import { getSizeByMap } from '../../utils/getSizeByMap';
import { Button } from '../Button/Button';
import { Link } from '../Link/Link';
import { Picture } from '../Picture/Picture';
import { Typography } from '../Typography/Typography';
var cnPageCard = cn('PageCard');
var sizeMapTitle = {
    s: 'tiny',
    m: 'lg',
    l: 'lg'
};
var sizeMapSubTitle = {
    m: 'l'
};
export var PageCard = function (_a) {
    var view = _a.view, title = _a.title, titleTag = _a.titleTag, subtitle = _a.subtitle, linkText = _a.linkText, link = _a.link, linkImage = _a.linkImage, _b = _a.linkView, linkView = _b === void 0 ? 'link-secondary' : _b, decor = _a.decor, _c = _a.size, size = _c === void 0 ? 'm' : _c, _d = _a.lineColor, lineColor = _d === void 0 ? '#0F161A' : _d, _e = _a.decorPosition, decorPosition = _e === void 0 ? 'default' : _e, picture = _a.picture, buttonAttrs = _a.buttonAttrs;
    var handleClick = function (link) {
        if (link.includes('http') || (buttonAttrs === null || buttonAttrs === void 0 ? void 0 : buttonAttrs.target) === '_blank') {
            window.open(link, '_blank');
        }
        else {
            window.location = link;
        }
    };
    var LinkImageComponent = useMemo(function () { return React.createElement(React.Fragment, null, linkImage && React.createElement("img", { src: linkImage.url, alt: "alt" })); }, [linkImage]);
    return (React.createElement("div", { className: cnPageCard({
            decorPosition: decorPosition,
            size: size,
            view: view,
            picture: !!picture,
            hoverState: !!link
        }) },
        link && view !== 'secondary' && (
        // eslint-disable-next-line jsx-a11y/anchor-is-valid
        React.createElement("a", { href: link, onClick: function (e) {
                e.preventDefault();
                handleClick(link);
            }, className: cnPageCard('LinkOverlay') })),
        lineColor && React.createElement("div", { className: cnPageCard('Line'), style: { backgroundColor: lineColor } }),
        picture && React.createElement(Picture, __assign({ className: cnPageCard('Picture') }, picture)),
        React.createElement("div", { className: cnPageCard('Title') },
            React.createElement(Typography.Title, { size: view === 'secondary' ? 'xs' : getSizeByMap(sizeMapTitle, size), as: titleTag }, title)),
        subtitle && (React.createElement("div", { className: cnPageCard('SubTitle') },
            React.createElement(Typography.Text, { size: view === 'secondary' ? 'm' : getSizeByMap(sizeMapSubTitle, size) }, subtitle))),
        linkText && link && (React.createElement("div", { className: cnPageCard('Button') },
            React.createElement(Button, { view: linkView, iconRight: !linkImage && IconArrowRight, iconSize: "m", icon: LinkImageComponent, label: linkText, onClick: function () { return handleClick(link); } }))),
        !linkText && link && (React.createElement("div", { className: cnPageCard('Link') },
            React.createElement(Link, { href: link.link, target: link.targetBlank ? '_blank' : null },
                React.createElement(Typography.Text, null, link.title)))),
        decor && (React.createElement("div", { className: cnPageCard('Decor') },
            React.createElement(Picture, { desktop: decor.url, desktopWebp: decor.urlWebp })))));
};
