import React, { useMemo } from 'react';
import { head, toUpper } from 'ramda';
import { getFontColor, getTenantIconColor } from '@reltio/mdm-sdk';
import Typography from '@mui/material/Typography';
import { useStyles } from './styles';
export var TenantIcon = function (_a) {
    var tenant = _a.tenant;
    var styles = useStyles();
    var wrapperStyle = useMemo(function () {
        var bgColor = getTenantIconColor(tenant.id);
        return {
            backgroundColor: bgColor,
            color: getFontColor(bgColor)
        };
    }, [tenant.id]);
    return (React.createElement("div", { style: wrapperStyle, className: styles.root, "data-reltio-id": "reltio-tenant-icon" },
        React.createElement(Typography, { variant: 'body2' }, toUpper(head(tenant.name || tenant.id)))));
};
