@metamask/design-system-react-native/dist/components/AvatarIcon/AvatarIcon.mjs

Design System React Native

function $importDefault(module) {
    if (module?.__esModule) {
        return module.default;
    }
    return module;
}
import { useTailwind } from "@metamask/design-system-twrnc-preset";
import $React from "react";
const React = $importDefault($React);
import { AvatarIconSize, AvatarBaseShape, AvatarIconSeverity } from "../../types/index.mjs";
import { AvatarBase } from "../AvatarBase/index.mjs";
import { Icon } from "../Icon/index.mjs";
import { MAP_AVATARICON_SIZE_ICONSIZE, MAP_AVATARICON_SEVERITY_ICONCOLOR, TWCLASSMAP_AVATARICON_SEVERITY_BACKGROUNDCOLOR } from "./AvatarIcon.constants.mjs";
export const AvatarIcon = ({ size = AvatarIconSize.Md, shape = AvatarBaseShape.Circle, severity = AvatarIconSeverity.Neutral, iconName, iconProps, twClassName = '', style, ...props }) => {
    const tw = useTailwind();
    const twContainerClassNames = `
    ${TWCLASSMAP_AVATARICON_SEVERITY_BACKGROUNDCOLOR[severity]}
    ${twClassName}
  `;
    return (<AvatarBase size={size} shape={shape} style={[tw `${twContainerClassNames}`, style]} accessibilityRole="image" {...props}>
      <Icon name={iconName} size={MAP_AVATARICON_SIZE_ICONSIZE[size]} color={MAP_AVATARICON_SEVERITY_ICONCOLOR[severity]} {...iconProps}/>
    </AvatarBase>);
};
//# sourceMappingURL=AvatarIcon.mjs.map