import { __assign, __rest } from "tslib";
/* eslint-disable jsx-a11y/anchor-has-content */
/* eslint-disable jsx-a11y/control-has-associated-label */
// @ts-nocheck
import './MemberCard.css';
import React from 'react';
import { generatePath, NavLink } from 'react-router-dom';
import { IconFacebook } from '../../icons/IconFacebook/IconFacebook';
import { IconLinkedin } from '../../icons/IconLinkedin/IconLinkedin';
import { IconMedium } from '../../icons/IconMedium/IconMedium';
import { IconSkype } from '../../icons/IconSkype/IconSkype';
import { IconTwitter } from '../../icons/IconTwitter/IconTwitter';
import { cn } from '../../utils/bem';
import { forwardRefWithAs } from '../../utils/types/PropsWithAsAttributes';
import { Button } from '../Button/Button';
import { usePropsHandler } from '../EventInterceptor/usePropsHandler';
import { Picture } from '../Picture/Picture';
import { Typography } from '../Typography/Typography';
import { User } from '../User/User';
export var cnMemberCard = cn('MemberCard');
export var MemberCard = forwardRefWithAs(function (props, ref) {
    var _a;
    var _b = usePropsHandler(cnMemberCard(), props), routePath = _b.routePath, data = __rest(_b, ["routePath"]);
    var slug = data.slug, photo = data.photo, firstName = data.firstName, lastName = data.lastName, title = data.title, location = data.location, position = data.position, view = data.view, size = data.size, phones = data.phones, email = data.email, skype = data.skype, contacts = data.contacts, socials = data.socials, linkedIn = data.linkedIn, twitter = data.twitter, medium = data.medium, facebook = data.facebook, isHiddenPage = data.isHiddenPage;
    if (size === 'xs') {
        return (React.createElement(React.Fragment, null,
            React.createElement(User, { className: cnMemberCard({ view: view, size: size }), avatarUrl: (_a = photo === null || photo === void 0 ? void 0 : photo.desktop) !== null && _a !== void 0 ? _a : photo === null || photo === void 0 ? void 0 : photo.url, info: position, name: "".concat(firstName, " ").concat(lastName), contacts: function () { return (React.createElement(React.Fragment, null,
                    phones.map(function (phone, index) { return (React.createElement("div", { key: phone + index },
                        React.createElement(Typography.Text, { as: "a", href: 'tel:' + phone, size: "s", key: phone }, phone))); }),
                    email && (React.createElement("div", null,
                        React.createElement(Typography.Text, { as: "a", href: 'mailto:' + email, size: "s" }, email))))); }, socials: function () { return (React.createElement(React.Fragment, null,
                    skype && (React.createElement(Button, { view: "ghost", onlyIcon: true, iconRight: IconSkype, as: "a", href: 'skype:' + skype, iconSize: "xs" })),
                    twitter && (React.createElement(Button, { view: "ghost", onlyIcon: true, iconRight: IconTwitter, as: "a", href: twitter, iconSize: "xs" })),
                    facebook && (React.createElement(Button, { view: "ghost", onlyIcon: true, iconRight: IconFacebook, as: "a", href: facebook, iconSize: "xs" })),
                    medium && (React.createElement(Button, { view: "ghost", onlyIcon: true, iconRight: IconMedium, as: "a", href: medium, iconSize: "xs" })),
                    linkedIn && (React.createElement(Button, { view: "ghost", onlyIcon: true, iconRight: IconLinkedin, as: "a", href: linkedIn, iconSize: "xs" })))); } })));
    }
    return (React.createElement("div", { className: cnMemberCard({
            view: view,
            size: size,
            clicked: !!routePath && !!slug && !isHiddenPage
        }) },
        routePath && slug && !isHiddenPage && (React.createElement(NavLink, { className: cnMemberCard('Link'), to: generatePath(routePath, { slug: slug }) })),
        React.createElement("div", { className: cnMemberCard('Inner') },
            position && (React.createElement("div", { className: cnMemberCard('Location') },
                React.createElement(Typography.Text, { weight: "bold", size: "xs", transform: "uppercase" }, position))),
            location && (React.createElement("div", { className: cnMemberCard('Location') },
                React.createElement(Typography.Text, { weight: "bold", size: "xs", transform: "uppercase" }, location))),
            photo && Object.keys(photo).length > 0 && (React.createElement("div", { className: cnMemberCard('Picture') },
                React.createElement(Picture, __assign({}, photo)))),
            React.createElement("div", { className: cnMemberCard('Title') },
                React.createElement(Typography.Text, { weight: "bold" },
                    firstName,
                    " ",
                    lastName)),
            title && (React.createElement("div", { className: cnMemberCard('SubTitle') },
                React.createElement(Typography.Text, { size: "s" }, title))),
            contacts && (React.createElement("div", { className: cnMemberCard('Contacts') },
                phones.map(function (item) { return (React.createElement(Typography.Text, { size: "s", as: "a", href: 'tel:' + item }, item)); }),
                email && (React.createElement(Typography.Text, { size: "s", as: "a", href: 'mailto:' + email }, email)))),
            socials && (skype || linkedIn || twitter || twitter || medium) && (React.createElement("div", { className: cnMemberCard('Socials') },
                skype && (React.createElement(Button, { view: "ghost", onlyIcon: true, iconRight: IconSkype, as: "a", href: 'skype:' + skype, iconSize: "xs" })),
                twitter && (React.createElement(Button, { view: "ghost", onlyIcon: true, iconRight: IconTwitter, as: "a", target: "_blank", href: twitter, iconSize: "xs" })),
                linkedIn && (React.createElement(Button, { view: "ghost", onlyIcon: true, iconRight: IconLinkedin, as: "a", target: "_blank", href: linkedIn, iconSize: "xs" })),
                medium && (React.createElement(Button, { view: "ghost", onlyIcon: true, iconRight: IconMedium, as: "a", target: "_blank", href: medium, iconSize: "xs" })),
                facebook && (React.createElement(Button, { view: "ghost", onlyIcon: true, iconRight: IconFacebook, as: "a", target: "_blank", href: facebook, iconSize: "xs" })))))));
});
