// tmp-babel/notifications/web/NotificationsList/NotificationItem/Notification/NotificationContent/NotificationHeader/index.js
import { TimelineDot } from "@mui/lab";
import { Box, Typography } from "@mui/material";
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
var NotificationHeader = function NotificationHeader2(_ref) {
  var actorName = _ref.actorName, message = _ref.message, unread = _ref.unread, timestamp = _ref.timestamp;
  return /* @__PURE__ */ _jsxs(Box, {
    display: "grid",
    children: [/* @__PURE__ */ _jsxs(Box, {
      display: "flex",
      alignItems: "center",
      justifyContent: "space-between",
      gap: 1,
      children: [/* @__PURE__ */ _jsxs(Box, {
        display: "grid",
        gap: 0.5,
        alignItems: "center",
        gridTemplateColumns: "repeat(2, max-content)",
        children: [/* @__PURE__ */ _jsx(Typography, {
          variant: "body2",
          sx: {
            fontWeight: 700
          },
          children: actorName !== null && actorName !== void 0 ? actorName : ""
        }), /* @__PURE__ */ _jsx(Typography, {
          variant: "body2",
          display: "flex",
          alignItems: "center",
          children: message
        })]
      }), unread && /* @__PURE__ */ _jsx(TimelineDot, {
        color: "error"
      })]
    }), /* @__PURE__ */ _jsx(Typography, {
      variant: "body2",
      sx: {
        color: "text.secondary"
      },
      children: timestamp
    })]
  });
};
var NotificationHeader_default = NotificationHeader;

export {
  NotificationHeader_default
};
//# sourceMappingURL=chunk-LZHEXF6O.mjs.map