import React from 'react';
import { makeStyles, useTheme, darken } from '@material-ui/core';
import { UnityFluentIcon } from '../../../../utilities/iconLibrary/UnityFluentIcon';
import { getUnityIconFromName } from '../../../../utilities/iconLibrary/UnityIconLibrary';
import { getIconFromName } from '../../../../utilities/tree/TreeUtilities';
import clsx from 'clsx';
const useStyles = makeStyles((theme) => ({
    iconContainer: {
        display: 'flex',
        alignItems: 'center',
        justifyContent: 'center',
        borderRadius: 50,
        marginTop: theme.spacing(0.5),
        marginBottom: theme.spacing(0.5),
        marginRight: (props) => !(props === null || props === void 0 ? void 0 : props.removeMargin) && theme.spacing(1),
        width: theme.spacing(4),
        height: theme.spacing(4),
        backgroundColor: '#ffffff'
    },
    border: {
        border: (props) => {
            var _a, _b;
            return ((_a = props === null || props === void 0 ? void 0 : props.color) === null || _a === void 0 ? void 0 : _a.hex)
                ? `1px solid ${darken((_b = props === null || props === void 0 ? void 0 : props.color) === null || _b === void 0 ? void 0 : _b.hex, 0.1)}`
                : `1px solid ${theme.palette.secondary.main}`;
        }
    }
}));
/**
 * IconRenderer
 */
export const IconRenderer = (props) => {
    const { value, noBorder, removeContainer } = props;
    const { color, name, type } = value;
    const classes = useStyles(value);
    const theme = useTheme(props);
    return (React.createElement("div", { className: clsx(!removeContainer && classes.iconContainer, !noBorder && classes.border) }, React.createElement(UnityFluentIcon, { size: "medium", color: (color === null || color === void 0 ? void 0 : color.hex) || theme.palette.secondary.main, type: type, icon: type === 'unity' ? getUnityIconFromName(name) : getIconFromName(name), style: {
            color: (color === null || color === void 0 ? void 0 : color.hex)
                ? darken(color === null || color === void 0 ? void 0 : color.hex, 0.1)
                : theme.palette.secondary.main
        } })));
};
//# sourceMappingURL=IconRenderer.js.map