import { jsx, jsxs } from "react/jsx-runtime";
import { Html, Head, Preview, Body, Container, Heading, Text, Section, Button, Hr } from "@react-email/components";
function NotificationEmail({ title, body, actions, panelUrl, copy }) {
  return /* @__PURE__ */ jsxs(Html, { children: [
    /* @__PURE__ */ jsx(Head, {}),
    /* @__PURE__ */ jsx(Preview, { children: copy.preview }),
    /* @__PURE__ */ jsx(Body, { style: { backgroundColor: "#f5f5f5", fontFamily: "Arial, sans-serif", margin: 0, padding: 0 }, children: /* @__PURE__ */ jsx(Container, { style: { maxWidth: 560, margin: "0 auto", padding: "24px" }, children: /* @__PURE__ */ jsxs(Section, { style: { backgroundColor: "#ffffff", padding: "24px", borderRadius: 12 }, children: [
      /* @__PURE__ */ jsx(Heading, { as: "h1", style: { fontSize: "22px", margin: "0 0 8px", color: "#111827" }, children: copy.heading }),
      /* @__PURE__ */ jsx(Text, { style: { margin: "0 0 16px", color: "#4b5563" }, children: title }),
      body && /* @__PURE__ */ jsx(Text, { style: { margin: "0 0 16px", color: "#111827", fontSize: "15px" }, children: body }),
      /* @__PURE__ */ jsx(Text, { style: { margin: "0 0 16px", color: "#6b7280", fontSize: "13px" }, children: copy.bodyIntro }),
      actions.length > 0 && /* @__PURE__ */ jsx(Section, { style: { marginBottom: 16 }, children: actions.map((action) => /* @__PURE__ */ jsx(
        Button,
        {
          href: action.href,
          style: {
            backgroundColor: "#111827",
            color: "#ffffff",
            padding: "10px 16px",
            borderRadius: 8,
            textDecoration: "none",
            display: "inline-block",
            marginRight: 8,
            marginBottom: 8,
            fontSize: "13px"
          },
          children: action.label
        },
        action.id
      )) }),
      /* @__PURE__ */ jsx(Text, { style: { margin: "0 0 16px", color: "#6b7280", fontSize: "12px" }, children: copy.actionNotice }),
      /* @__PURE__ */ jsx(
        Button,
        {
          href: panelUrl,
          style: {
            backgroundColor: "#2563eb",
            color: "#ffffff",
            padding: "12px 18px",
            borderRadius: 8,
            textDecoration: "none",
            display: "inline-block",
            fontSize: "14px"
          },
          children: copy.openCta
        }
      ),
      /* @__PURE__ */ jsx(Hr, { style: { margin: "24px 0", borderColor: "#e5e7eb" } }),
      /* @__PURE__ */ jsx(Text, { style: { margin: 0, color: "#9ca3af", fontSize: "12px" }, children: copy.footer })
    ] }) }) })
  ] });
}
var NotificationEmail_default = NotificationEmail;
export {
  NotificationEmail,
  NotificationEmail_default as default
};
//# sourceMappingURL=NotificationEmail.js.map
