import PropTypes from 'prop-types';
import React from 'react';
import { Avatar, Stack, Typography } from '@mui/material';
import { getWordBreakStyle } from '../util';
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
export default function InfoCard({
  logo = '',
  size = 40,
  variant = 'rounded',
  sx = {},
  name,
  description
}) {
  const dimensions = {
    width: size,
    height: size,
    ...sx
  };
  const avatarName = typeof name === 'string' ? name : logo;
  return /*#__PURE__*/_jsxs(Stack, {
    direction: "row",
    spacing: 1,
    sx: {
      alignItems: 'center'
    },
    children: [logo ? /*#__PURE__*/_jsx(Avatar, {
      src: logo,
      alt: avatarName,
      variant: variant,
      sx: dimensions
    }) : /*#__PURE__*/_jsx(Avatar, {
      variant: variant,
      sx: dimensions,
      children: avatarName?.slice(0, 1)
    }), /*#__PURE__*/_jsxs(Stack, {
      direction: "column",
      className: "info-card",
      sx: {
        alignItems: 'flex-start',
        justifyContent: 'space-around',
        wordBreak: getWordBreakStyle(name),
        minWidth: 140
      },
      children: [/*#__PURE__*/_jsx(Typography, {
        variant: "body1",
        component: "div",
        sx: {
          color: 'text.primary'
        },
        children: name
      }), /*#__PURE__*/_jsx(Typography, {
        variant: "subtitle1",
        sx: {
          color: 'text.secondary'
        },
        children: description
      })]
    })]
  });
}
InfoCard.propTypes = {
  logo: PropTypes.string,
  name: PropTypes.oneOfType([PropTypes.string, PropTypes.node]).isRequired,
  description: PropTypes.any.isRequired,
  size: PropTypes.number,
  variant: PropTypes.oneOf(['square', 'rounded', 'circular']),
  sx: PropTypes.object
};