import { jsxs, jsx } from 'react/jsx-runtime';
import classNames from '../../_virtual/index.js';
import Typography from '../Typography/Typography.js';

const HistoryCard = ({ variant, title, tabTitle, comment, profileShortName, }) => {
    return (jsxs("div", { className: "ff-history-card", children: [jsx("div", { className: classNames('header', `header--${variant}`), children: jsx(Typography, { fontWeight: 'semi-bold', children: tabTitle }) }), jsxs("div", { className: "body", children: [jsx("div", { className: "title", children: jsxs("div", { className: "profile", children: [jsx(Typography, { className: classNames('avatar', `avatar--${variant}`), children: profileShortName }), jsx(Typography, { children: title })] }) }), jsxs("div", { className: "comment-container", children: [jsx(Typography, { fontWeight: "semi-bold", className: "heading", children: "Comments:" }), jsx(Typography, { color: 'var(--details-page-value-color)', className: "comment", children: comment })] })] })] }));
};

export { HistoryCard as default };
//# sourceMappingURL=HistoryCard.js.map
