payload-plugin-newsletter 0.20.2 → 0.20.4

package/dist/admin.js

@@ -1,1792 +1,241 @@
 "use client";
 "use client";
 
-// src/components/Broadcasts/BroadcastInlinePreview.tsx
-import { useState, useCallback } from "react";
-import { useFormFields } from "@payloadcms/ui";
-
-// src/components/Broadcasts/PreviewControls.tsx
+// src/admin/components/BroadcastInlinePreview.tsx
+import { useState, useEffect, useRef } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
-var PreviewControls = ({
-  onUpdate,
-  device,
-  onDeviceChange,
-  isLoading = false
+var BroadcastInlinePreview = ({
+  data,
+  field: _field,
+  path: _path,
+  schemaPath: _schemaPath,
+  ..._props
 }) => {
-  const controlsStyle = {
-    display: "flex",
-    alignItems: "center",
-    justifyContent: "space-between",
-    padding: "1rem",
-    background: "white",
-    borderBottom: "1px solid #e5e7eb"
-  };
-  const updateButtonStyle = {
-    padding: "0.5rem 1rem",
-    background: "#10b981",
-    color: "white",
-    border: "none",
-    borderRadius: "4px",
-    cursor: isLoading ? "not-allowed" : "pointer",
-    fontSize: "14px",
-    fontWeight: 500,
-    opacity: isLoading ? 0.6 : 1
-  };
-  const deviceSelectorStyle = {
-    display: "flex",
-    gap: "0.5rem"
-  };
-  const deviceButtonStyle = (isActive) => ({
-    display: "flex",
-    alignItems: "center",
-    gap: "0.5rem",
-    padding: "0.5rem 0.75rem",
-    background: isActive ? "#1f2937" : "white",
-    color: isActive ? "white" : "#374151",
-    border: `1px solid ${isActive ? "#1f2937" : "#e5e7eb"}`,
-    borderRadius: "4px",
-    cursor: "pointer",
-    fontSize: "14px"
-  });
-  return /* @__PURE__ */ jsxs("div", { style: controlsStyle, children: [
-    /* @__PURE__ */ jsx(
-      "button",
-      {
-        style: updateButtonStyle,
-        onClick: onUpdate,
-        disabled: isLoading,
-        children: isLoading ? "Updating..." : "Update Preview"
-      }
-    ),
-    /* @__PURE__ */ jsxs("div", { style: deviceSelectorStyle, children: [
-      /* @__PURE__ */ jsxs(
-        "button",
-        {
-          style: deviceButtonStyle(device === "desktop"),
-          onClick: () => onDeviceChange("desktop"),
-          "aria-label": "Desktop view",
-          children: [
-            /* @__PURE__ */ jsxs("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
-              /* @__PURE__ */ jsx("rect", { x: "2", y: "3", width: "20", height: "14", rx: "2", ry: "2" }),
-              /* @__PURE__ */ jsx("line", { x1: "8", y1: "21", x2: "16", y2: "21" }),
-              /* @__PURE__ */ jsx("line", { x1: "12", y1: "17", x2: "12", y2: "21" })
-            ] }),
-            "Desktop"
-          ]
-        }
-      ),
-      /* @__PURE__ */ jsxs(
-        "button",
-        {
-          style: deviceButtonStyle(device === "mobile"),
-          onClick: () => onDeviceChange("mobile"),
-          "aria-label": "Mobile view",
-          children: [
-            /* @__PURE__ */ jsxs("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
-              /* @__PURE__ */ jsx("rect", { x: "5", y: "2", width: "14", height: "20", rx: "2", ry: "2" }),
-              /* @__PURE__ */ jsx("line", { x1: "12", y1: "18", x2: "12", y2: "18" })
-            ] }),
-            "Mobile"
-          ]
-        }
-      )
-    ] })
-  ] });
-};
-
-// src/components/Broadcasts/BroadcastInlinePreview.tsx
-import { Fragment, jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
-var BroadcastInlinePreview = () => {
-  const [device, setDevice] = useState("desktop");
-  const [isLoading, setIsLoading] = useState(false);
-  const [showPreview, setShowPreview] = useState(false);
-  const [previewHtml, setPreviewHtml] = useState(null);
+  const [previewHtml, setPreviewHtml] = useState("");
+  const [loading, setLoading] = useState(false);
   const [error, setError] = useState(null);
-  const fields = useFormFields(([fields2]) => ({
-    subject: fields2["subject"]?.value,
-    preheader: fields2["contentSection.preheader"]?.value,
-    content: fields2["contentSection.content"]?.value
-  }));
-  const updatePreview = useCallback(async () => {
-    if (!fields.content) {
-      setError(new Error("Please add some content before previewing"));
-      return;
-    }
-    setIsLoading(true);
-    setError(null);
-    try {
-      const response = await fetch("/api/broadcasts/preview", {
-        method: "POST",
-        headers: {
-          "Content-Type": "application/json"
-        },
-        body: JSON.stringify({
-          content: fields.content,
-          preheader: fields.preheader,
-          subject: fields.subject
-        })
-      });
-      const data = await response.json();
-      if (!response.ok || !data.success) {
-        throw new Error(data.error || "Failed to generate preview");
-      }
-      setPreviewHtml(data.preview.html);
-      setShowPreview(true);
-    } catch (err) {
-      setError(err);
-      console.error("Failed to update preview:", err);
-    } finally {
-      setIsLoading(false);
-    }
-  }, [fields]);
-  const containerStyle = {
-    border: "1px solid #e5e7eb",
-    borderRadius: "8px",
-    overflow: "hidden",
-    height: "100%",
-    display: "flex",
-    flexDirection: "column"
-  };
-  const headerStyle = {
-    display: "flex",
-    alignItems: "center",
-    justifyContent: "space-between",
-    padding: "1rem",
-    background: "#f9fafb",
-    borderBottom: "1px solid #e5e7eb"
-  };
-  const titleStyle = {
-    fontSize: "16px",
-    fontWeight: 600,
-    color: "#1f2937",
-    margin: 0
-  };
-  const previewContainerStyle = {
-    flex: 1,
-    display: "flex",
-    flexDirection: "column",
-    background: "#f3f4f6",
-    overflow: "hidden"
-  };
-  const errorStyle = {
-    padding: "2rem",
-    textAlign: "center"
-  };
-  const toggleButtonStyle = {
-    padding: "0.5rem 1rem",
-    background: showPreview ? "#ef4444" : "#3b82f6",
-    color: "white",
-    border: "none",
-    borderRadius: "4px",
-    cursor: "pointer",
-    fontSize: "14px",
-    fontWeight: 500
-  };
-  return /* @__PURE__ */ jsxs2("div", { style: containerStyle, children: [
-    /* @__PURE__ */ jsxs2("div", { style: headerStyle, children: [
-      /* @__PURE__ */ jsx2("h3", { style: titleStyle, children: "Email Preview" }),
-      /* @__PURE__ */ jsx2(
-        "button",
-        {
-          onClick: () => showPreview ? setShowPreview(false) : updatePreview(),
-          style: toggleButtonStyle,
-          disabled: isLoading,
-          children: isLoading ? "Loading..." : showPreview ? "Hide Preview" : "Show Preview"
-        }
-      )
-    ] }),
-    showPreview && /* @__PURE__ */ jsx2("div", { style: previewContainerStyle, children: error ? /* @__PURE__ */ jsxs2("div", { style: errorStyle, children: [
-      /* @__PURE__ */ jsx2("p", { style: { color: "#ef4444", margin: "0 0 1rem" }, children: error.message }),
-      /* @__PURE__ */ jsx2(
-        "button",
-        {
-          onClick: updatePreview,
-          style: {
-            padding: "0.5rem 1rem",
-            background: "#3b82f6",
-            color: "white",
-            border: "none",
-            borderRadius: "4px",
-            cursor: "pointer"
-          },
-          children: "Retry"
-        }
-      )
-    ] }) : previewHtml ? /* @__PURE__ */ jsxs2(Fragment, { children: [
-      /* @__PURE__ */ jsx2(
-        PreviewControls,
-        {
-          onUpdate: updatePreview,
-          device,
-          onDeviceChange: setDevice,
-          isLoading
-        }
-      ),
-      /* @__PURE__ */ jsx2(
-        "div",
-        {
-          style: {
-            flex: 1,
-            padding: device === "mobile" ? "1rem" : "2rem",
-            display: "flex",
-            justifyContent: "center",
-            overflow: "auto"
-          },
-          children: /* @__PURE__ */ jsx2(
-            "div",
-            {
-              style: {
-                width: device === "mobile" ? "375px" : "600px",
-                maxWidth: "100%",
-                background: "white",
-                boxShadow: "0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)",
-                borderRadius: "8px",
-                overflow: "hidden"
-              },
-              children: /* @__PURE__ */ jsx2(
-                "iframe",
-                {
-                  srcDoc: previewHtml,
-                  style: {
-                    width: "100%",
-                    height: "100%",
-                    minHeight: "600px",
-                    border: "none"
-                  },
-                  title: "Email Preview"
-                }
-              )
-            }
-          )
-        }
-      )
-    ] }) : null })
-  ] });
-};
-
-// src/components/Broadcasts/StatusBadge.tsx
-import { jsx as jsx3 } from "react/jsx-runtime";
-var statusConfig = {
-  ["draft" /* DRAFT */]: {
-    label: "Draft",
-    color: "#6B7280",
-    // gray
-    backgroundColor: "#F3F4F6"
-  },
-  ["scheduled" /* SCHEDULED */]: {
-    label: "Scheduled",
-    color: "#2563EB",
-    // blue
-    backgroundColor: "#DBEAFE"
-  },
-  ["sending" /* SENDING */]: {
-    label: "Sending",
-    color: "#D97706",
-    // yellow/orange
-    backgroundColor: "#FEF3C7"
-  },
-  ["sent" /* SENT */]: {
-    label: "Sent",
-    color: "#059669",
-    // green
-    backgroundColor: "#D1FAE5"
-  },
-  ["failed" /* FAILED */]: {
-    label: "Failed",
-    color: "#DC2626",
-    // red
-    backgroundColor: "#FEE2E2"
-  },
-  ["paused" /* PAUSED */]: {
-    label: "Paused",
-    color: "#9333EA",
-    // purple
-    backgroundColor: "#EDE9FE"
-  },
-  ["canceled" /* CANCELED */]: {
-    label: "Canceled",
-    color: "#6B7280",
-    // gray
-    backgroundColor: "#F3F4F6"
-  }
-};
-var StatusBadge = ({ cellData }) => {
-  const status = cellData;
-  const config = statusConfig[status] || statusConfig["draft" /* DRAFT */];
-  return /* @__PURE__ */ jsx3(
-    "span",
-    {
-      style: {
-        display: "inline-flex",
-        alignItems: "center",
-        padding: "2px 10px",
-        borderRadius: "12px",
-        fontSize: "12px",
-        fontWeight: "500",
-        color: config.color,
-        backgroundColor: config.backgroundColor
-      },
-      children: config.label
-    }
-  );
-};
-
-// src/components/Broadcasts/EmailPreview.tsx
-import { useState as useState2, useEffect, useRef } from "react";
-
-// src/utils/emailSafeHtml.ts
-import DOMPurify from "isomorphic-dompurify";
-var EMAIL_SAFE_CONFIG = {
-  ALLOWED_TAGS: [
-    "p",
-    "br",
-    "strong",
-    "b",
-    "em",
-    "i",
-    "u",
-    "strike",
-    "s",
-    "span",
-    "a",
-    "h1",
-    "h2",
-    "h3",
-    "ul",
-    "ol",
-    "li",
-    "blockquote",
-    "hr",
-    "img",
-    "div",
-    "table",
-    "tr",
-    "td",
-    "th",
-    "tbody",
-    "thead"
-  ],
-  ALLOWED_ATTR: ["href", "style", "target", "rel", "align", "src", "alt", "width", "height", "border", "cellpadding", "cellspacing"],
-  ALLOWED_STYLES: {
-    "*": [
-      "color",
-      "background-color",
-      "font-size",
-      "font-weight",
-      "font-style",
-      "text-decoration",
-      "text-align",
-      "margin",
-      "margin-top",
-      "margin-right",
-      "margin-bottom",
-      "margin-left",
-      "padding",
-      "padding-top",
-      "padding-right",
-      "padding-bottom",
-      "padding-left",
-      "line-height",
-      "border-left",
-      "border-left-width",
-      "border-left-style",
-      "border-left-color"
-    ]
-  },
-  FORBID_TAGS: ["script", "style", "iframe", "object", "embed", "form", "input"],
-  FORBID_ATTR: ["class", "id", "onclick", "onload", "onerror"]
-};
-async function convertToEmailSafeHtml(editorState, options) {
-  if (!editorState) {
-    return "";
-  }
-  const rawHtml = await lexicalToEmailHtml(editorState, options?.mediaUrl, options?.customBlockConverter);
-  const sanitizedHtml = DOMPurify.sanitize(rawHtml, EMAIL_SAFE_CONFIG);
-  if (options?.wrapInTemplate) {
-    if (options.customWrapper) {
-      return await Promise.resolve(options.customWrapper(sanitizedHtml, {
-        preheader: options.preheader,
-        subject: options.subject
-      }));
-    }
-    return wrapInEmailTemplate(sanitizedHtml, options.preheader);
-  }
-  return sanitizedHtml;
-}
-async function lexicalToEmailHtml(editorState, mediaUrl, customBlockConverter) {
-  const { root } = editorState;
-  if (!root || !root.children) {
-    return "";
-  }
-  const htmlParts = await Promise.all(
-    root.children.map((node) => convertNode(node, mediaUrl, customBlockConverter))
-  );
-  return htmlParts.join("");
-}
-async function convertNode(node, mediaUrl, customBlockConverter) {
-  switch (node.type) {
-    case "paragraph":
-      return convertParagraph(node, mediaUrl, customBlockConverter);
-    case "heading":
-      return convertHeading(node, mediaUrl, customBlockConverter);
-    case "list":
-      return convertList(node, mediaUrl, customBlockConverter);
-    case "listitem":
-      return convertListItem(node, mediaUrl, customBlockConverter);
-    case "blockquote":
-      return convertBlockquote(node, mediaUrl, customBlockConverter);
-    case "text":
-      return convertText(node);
-    case "link":
-      return convertLink(node, mediaUrl, customBlockConverter);
-    case "linebreak":
-      return "<br>";
-    case "upload":
-      return convertUpload(node, mediaUrl);
-    case "block":
-      return await convertBlock(node, mediaUrl, customBlockConverter);
-    default:
-      if (node.children) {
-        const childParts = await Promise.all(
-          node.children.map((child) => convertNode(child, mediaUrl, customBlockConverter))
-        );
-        return childParts.join("");
-      }
-      return "";
-  }
-}
-async function convertParagraph(node, mediaUrl, customBlockConverter) {
-  const align = getAlignment(node.format);
-  const childParts = await Promise.all(
-    (node.children || []).map((child) => convertNode(child, mediaUrl, customBlockConverter))
-  );
-  const children = childParts.join("");
-  if (!children.trim()) {
-    return '<p class="mobile-margin-bottom-16" style="margin: 0 0 16px 0; min-height: 1em;">&nbsp;</p>';
-  }
-  return `<p class="mobile-margin-bottom-16" style="margin: 0 0 16px 0; text-align: ${align}; font-size: 16px; line-height: 1.5;">${children}</p>`;
-}
-async function convertHeading(node, mediaUrl, customBlockConverter) {
-  const tag = node.tag || "h1";
-  const align = getAlignment(node.format);
-  const childParts = await Promise.all(
-    (node.children || []).map((child) => convertNode(child, mediaUrl, customBlockConverter))
-  );
-  const children = childParts.join("");
-  const styles = {
-    h1: "font-size: 32px; font-weight: 700; margin: 0 0 24px 0; line-height: 1.2;",
-    h2: "font-size: 24px; font-weight: 600; margin: 0 0 16px 0; line-height: 1.3;",
-    h3: "font-size: 20px; font-weight: 600; margin: 0 0 12px 0; line-height: 1.4;"
-  };
-  const mobileClasses = {
-    h1: "mobile-font-size-24",
-    h2: "mobile-font-size-20",
-    h3: "mobile-font-size-16"
-  };
-  const style = `${styles[tag] || styles.h3} text-align: ${align};`;
-  const mobileClass = mobileClasses[tag] || mobileClasses.h3;
-  return `<${tag} class="${mobileClass}" style="${style}">${children}</${tag}>`;
-}
-async function convertList(node, mediaUrl, customBlockConverter) {
-  const tag = node.listType === "number" ? "ol" : "ul";
-  const childParts = await Promise.all(
-    (node.children || []).map((child) => convertNode(child, mediaUrl, customBlockConverter))
-  );
-  const children = childParts.join("");
-  const style = tag === "ul" ? "margin: 0 0 16px 0; padding-left: 24px; list-style-type: disc; font-size: 16px; line-height: 1.5;" : "margin: 0 0 16px 0; padding-left: 24px; list-style-type: decimal; font-size: 16px; line-height: 1.5;";
-  return `<${tag} class="mobile-margin-bottom-16" style="${style}">${children}</${tag}>`;
-}
-async function convertListItem(node, mediaUrl, customBlockConverter) {
-  const childParts = await Promise.all(
-    (node.children || []).map((child) => convertNode(child, mediaUrl, customBlockConverter))
-  );
-  const children = childParts.join("");
-  return `<li style="margin: 0 0 8px 0;">${children}</li>`;
-}
-async function convertBlockquote(node, mediaUrl, customBlockConverter) {
-  const childParts = await Promise.all(
-    (node.children || []).map((child) => convertNode(child, mediaUrl, customBlockConverter))
-  );
-  const children = childParts.join("");
-  const style = "margin: 0 0 16px 0; padding-left: 16px; border-left: 4px solid #e5e7eb; color: #6b7280;";
-  return `<blockquote style="${style}">${children}</blockquote>`;
-}
-function convertText(node) {
-  let text = escapeHtml(node.text || "");
-  if (node.format & 1) {
-    text = `<strong>${text}</strong>`;
-  }
-  if (node.format & 2) {
-    text = `<em>${text}</em>`;
-  }
-  if (node.format & 8) {
-    text = `<u>${text}</u>`;
-  }
-  if (node.format & 4) {
-    text = `<strike>${text}</strike>`;
-  }
-  return text;
-}
-async function convertLink(node, mediaUrl, customBlockConverter) {
-  const childParts = await Promise.all(
-    (node.children || []).map((child) => convertNode(child, mediaUrl, customBlockConverter))
-  );
-  const children = childParts.join("");
-  const url = node.fields?.url || "#";
-  const newTab = node.fields?.newTab ?? false;
-  const targetAttr = newTab ? ' target="_blank"' : "";
-  const relAttr = newTab ? ' rel="noopener noreferrer"' : "";
-  return `<a href="${escapeHtml(url)}"${targetAttr}${relAttr} style="color: #2563eb; text-decoration: underline;">${children}</a>`;
-}
-function convertUpload(node, mediaUrl) {
-  const upload = node.value;
-  if (!upload) return "";
-  let src = "";
-  if (typeof upload === "string") {
-    src = upload;
-  } else if (upload.url) {
-    src = upload.url;
-  } else if (upload.filename && mediaUrl) {
-    src = `${mediaUrl}/${upload.filename}`;
-  }
-  const alt = node.fields?.altText || upload.alt || "";
-  const caption = node.fields?.caption || "";
-  const imgHtml = `<img src="${escapeHtml(src)}" alt="${escapeHtml(alt)}" class="mobile-width-100" style="max-width: 100%; height: auto; display: block; margin: 0 auto; border-radius: 6px;" />`;
-  if (caption) {
-    return `
-      <div style="margin: 0 0 16px 0; text-align: center;" class="mobile-margin-bottom-16">
-        ${imgHtml}
-        <p style="margin: 8px 0 0 0; font-size: 14px; color: #6b7280; font-style: italic; text-align: center;" class="mobile-font-size-14">${escapeHtml(caption)}</p>
-      </div>
-    `;
-  }
-  return `<div style="margin: 0 0 16px 0; text-align: center;" class="mobile-margin-bottom-16">${imgHtml}</div>`;
-}
-async function convertBlock(node, mediaUrl, customBlockConverter) {
-  const blockType = node.fields?.blockName || node.blockName;
-  if (customBlockConverter) {
-    try {
-      const customHtml = await customBlockConverter(node, mediaUrl);
-      if (customHtml) {
-        return customHtml;
-      }
-    } catch (error) {
-      console.error(`Custom block converter error for ${blockType}:`, error);
-    }
-  }
-  switch (blockType) {
-    case "button":
-      return convertButtonBlock(node.fields);
-    case "divider":
-      return convertDividerBlock(node.fields);
-    default:
-      if (node.children) {
-        const childParts = await Promise.all(
-          node.children.map((child) => convertNode(child, mediaUrl, customBlockConverter))
-        );
-        return childParts.join("");
-      }
-      return "";
-  }
-}
-function convertButtonBlock(fields) {
-  const text = fields?.text || "Click here";
-  const url = fields?.url || "#";
-  const style = fields?.style || "primary";
-  const styles = {
-    primary: "background-color: #2563eb; color: #ffffff; border: 2px solid #2563eb;",
-    secondary: "background-color: #6b7280; color: #ffffff; border: 2px solid #6b7280;",
-    outline: "background-color: transparent; color: #2563eb; border: 2px solid #2563eb;"
-  };
-  const buttonStyle = `${styles[style] || styles.primary} display: inline-block; padding: 12px 24px; font-size: 16px; font-weight: 600; text-decoration: none; border-radius: 6px; text-align: center;`;
-  return `
-    <div style="margin: 0 0 16px 0; text-align: center;">
-      <a href="${escapeHtml(url)}" target="_blank" rel="noopener noreferrer" style="${buttonStyle}">${escapeHtml(text)}</a>
-    </div>
-  `;
-}
-function convertDividerBlock(fields) {
-  const style = fields?.style || "solid";
-  const styles = {
-    solid: "border-top: 1px solid #e5e7eb;",
-    dashed: "border-top: 1px dashed #e5e7eb;",
-    dotted: "border-top: 1px dotted #e5e7eb;"
-  };
-  return `<hr style="${styles[style] || styles.solid} margin: 24px 0; border-bottom: none; border-left: none; border-right: none;" />`;
-}
-function getAlignment(format) {
-  if (!format) return "left";
-  if (format & 2) return "center";
-  if (format & 3) return "right";
-  if (format & 4) return "justify";
-  return "left";
-}
-function escapeHtml(text) {
-  const map = {
-    "&": "&amp;",
-    "<": "&lt;",
-    ">": "&gt;",
-    '"': "&quot;",
-    "'": "&#039;"
-  };
-  return text.replace(/[&<>"']/g, (m) => map[m]);
-}
-function wrapInEmailTemplate(content, preheader) {
-  return `<!DOCTYPE html>
-<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office">
-<head>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <meta http-equiv="X-UA-Compatible" content="IE=edge">
-  <meta name="x-apple-disable-message-reformatting">
-  <title>Newsletter</title>
-  
-  <!--[if mso]>
-  <noscript>
-    <xml>
-      <o:OfficeDocumentSettings>
-        <o:PixelsPerInch>96</o:PixelsPerInch>
-      </o:OfficeDocumentSettings>
-    </xml>
-  </noscript>
-  <![endif]-->
-  
-  <style>
-    /* Reset and base styles */
-    * {
-      -webkit-text-size-adjust: 100%;
-      -ms-text-size-adjust: 100%;
-    }
-    
-    body {
-      margin: 0 !important;
-      padding: 0 !important;
-      font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
-      font-size: 16px;
-      line-height: 1.5;
-      color: #1A1A1A;
-      background-color: #f8f9fa;
-      -webkit-font-smoothing: antialiased;
-      -moz-osx-font-smoothing: grayscale;
-    }
-    
-    table {
-      border-spacing: 0 !important;
-      border-collapse: collapse !important;
-      table-layout: fixed !important;
-      margin: 0 auto !important;
-    }
-    
-    table table table {
-      table-layout: auto;
-    }
-    
-    img {
-      -ms-interpolation-mode: bicubic;
-      max-width: 100%;
-      height: auto;
-      border: 0;
-      outline: none;
-      text-decoration: none;
-    }
-    
-    /* Responsive styles */
-    @media only screen and (max-width: 640px) {
-      .mobile-hide {
-        display: none !important;
-      }
-      
-      .mobile-center {
-        text-align: center !important;
-      }
-      
-      .mobile-width-100 {
-        width: 100% !important;
-        max-width: 100% !important;
-      }
-      
-      .mobile-padding {
-        padding: 20px !important;
-      }
-      
-      .mobile-padding-sm {
-        padding: 16px !important;
-      }
-      
-      .mobile-font-size-14 {
-        font-size: 14px !important;
-      }
-      
-      .mobile-font-size-16 {
-        font-size: 16px !important;
-      }
-      
-      .mobile-font-size-20 {
-        font-size: 20px !important;
-        line-height: 1.3 !important;
-      }
-      
-      .mobile-font-size-24 {
-        font-size: 24px !important;
-        line-height: 1.2 !important;
-      }
-      
-      /* Stack sections on mobile */
-      .mobile-stack {
-        display: block !important;
-        width: 100% !important;
-      }
-      
-      /* Mobile-specific spacing */
-      .mobile-margin-bottom-16 {
-        margin-bottom: 16px !important;
-      }
-      
-      .mobile-margin-bottom-20 {
-        margin-bottom: 20px !important;
-      }
-    }
-    
-    /* Dark mode support */
-    @media (prefers-color-scheme: dark) {
-      .dark-mode-bg {
-        background-color: #1a1a1a !important;
-      }
-      
-      .dark-mode-text {
-        color: #ffffff !important;
-      }
-      
-      .dark-mode-border {
-        border-color: #333333 !important;
-      }
-    }
-    
-    /* Outlook-specific fixes */
-    <!--[if mso]>
-    <style>
-      table {
-        border-collapse: collapse;
-        border-spacing: 0;
-        border: none;
-        margin: 0;
-      }
-      
-      div, p {
-        margin: 0;
-      }
-    </style>
-    <![endif]-->
-  </style>
-</head>
-<body style="margin: 0; padding: 0; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif; font-size: 16px; line-height: 1.5; color: #1A1A1A; background-color: #f8f9fa;">
-  ${preheader ? `
-  <!-- Preheader text -->
-  <div style="display: none; max-height: 0; overflow: hidden; font-size: 1px; line-height: 1px; color: transparent;">
-    ${escapeHtml(preheader)}
-  </div>
-  ` : ""}
-  
-  <!-- Main container -->
-  <table role="presentation" cellpadding="0" cellspacing="0" width="100%" style="margin: 0; padding: 0; background-color: #f8f9fa;">
-    <tr>
-      <td align="center" style="padding: 20px 10px;">
-        <!-- Email wrapper -->
-        <table role="presentation" cellpadding="0" cellspacing="0" width="600" class="mobile-width-100" style="margin: 0 auto; max-width: 600px;">
-          <tr>
-            <td class="mobile-padding" style="padding: 0;">
-              <!-- Content area with light background -->
-              <div style="background-color: #ffffff; padding: 40px 30px; border-radius: 8px;" class="mobile-padding">
-                ${content}
-              </div>
-            </td>
-          </tr>
-        </table>
-      </td>
-    </tr>
-  </table>
-</body>
-</html>`;
-}
-function replacePersonalizationTags(html, sampleData) {
-  return html.replace(/\{\{([^}]+)\}\}/g, (match, tag) => {
-    const trimmedTag = tag.trim();
-    return sampleData[trimmedTag] || match;
-  });
-}
-
-// src/utils/validateEmailHtml.ts
-function validateEmailHtml(html) {
-  const warnings = [];
-  const errors = [];
-  const sizeInBytes = new Blob([html]).size;
-  if (sizeInBytes > 102400) {
-    warnings.push(`Email size (${Math.round(sizeInBytes / 1024)}KB) exceeds Gmail's 102KB limit - email may be clipped`);
-  }
-  if (html.includes("position:") && (html.includes("position: absolute") || html.includes("position: fixed"))) {
-    errors.push("Absolute/fixed positioning is not supported in most email clients");
-  }
-  if (html.includes("display: flex") || html.includes("display: grid")) {
-    errors.push("Flexbox and Grid layouts are not supported in many email clients");
-  }
-  if (html.includes("@media")) {
-    warnings.push("Media queries may not work in all email clients");
-  }
-  const hasJavaScript = html.includes("<script") || html.includes("onclick") || html.includes("onload") || html.includes("javascript:");
-  if (hasJavaScript) {
-    errors.push("JavaScript is not supported in email and will be stripped by email clients");
-  }
-  const hasExternalStyles = html.includes("<link") && html.includes("stylesheet");
-  if (hasExternalStyles) {
-    errors.push("External stylesheets are not supported - use inline styles only");
-  }
-  if (html.includes("<form") || html.includes("<input") || html.includes("<button")) {
-    errors.push("Forms and form elements are not reliably supported in email");
-  }
-  const unsupportedTags = [
-    "video",
-    "audio",
-    "iframe",
-    "embed",
-    "object",
-    "canvas",
-    "svg"
-  ];
-  for (const tag of unsupportedTags) {
-    if (html.includes(`<${tag}`)) {
-      errors.push(`<${tag}> tags are not supported in email`);
-    }
-  }
-  const imageCount = (html.match(/<img/g) || []).length;
-  const linkCount = (html.match(/<a/g) || []).length;
-  if (imageCount > 20) {
-    warnings.push(`High number of images (${imageCount}) may affect email performance`);
-  }
-  const imagesWithoutAlt = (html.match(/<img(?![^>]*\balt\s*=)[^>]*>/g) || []).length;
-  if (imagesWithoutAlt > 0) {
-    warnings.push(`${imagesWithoutAlt} image(s) missing alt text - important for accessibility`);
-  }
-  const linksWithoutTarget = (html.match(/<a(?![^>]*\btarget\s*=)[^>]*>/g) || []).length;
-  if (linksWithoutTarget > 0) {
-    warnings.push(`${linksWithoutTarget} link(s) missing target="_blank" attribute`);
-  }
-  if (html.includes("margin: auto") || html.includes("margin:auto")) {
-    warnings.push('margin: auto is not supported in Outlook - use align="center" or tables for centering');
-  }
-  if (html.includes("background-image")) {
-    warnings.push("Background images are not reliably supported - consider using <img> tags instead");
-  }
-  if (html.match(/\d+\s*(rem|em)/)) {
-    warnings.push("rem/em units may render inconsistently - use px for reliable sizing");
-  }
-  if (html.match(/margin[^:]*:\s*-\d+/)) {
-    errors.push("Negative margins are not supported in many email clients");
-  }
-  const personalizationTags = html.match(/\{\{([^}]+)\}\}/g) || [];
-  const validTags = ["subscriber.name", "subscriber.email", "subscriber.firstName", "subscriber.lastName"];
-  for (const tag of personalizationTags) {
-    const tagContent = tag.replace(/[{}]/g, "").trim();
-    if (!validTags.includes(tagContent)) {
-      warnings.push(`Unknown personalization tag: ${tag}`);
-    }
-  }
-  return {
-    valid: errors.length === 0,
-    warnings,
-    errors,
-    stats: {
-      sizeInBytes,
-      imageCount,
-      linkCount,
-      hasExternalStyles,
-      hasJavaScript
-    }
-  };
-}
-
-// src/contexts/PluginConfigContext.tsx
-import { createContext, useContext } from "react";
-import { jsx as jsx4 } from "react/jsx-runtime";
-var PluginConfigContext = createContext(null);
-var usePluginConfigOptional = () => {
-  return useContext(PluginConfigContext);
-};
-
-// src/components/Broadcasts/EmailPreview.tsx
-import { jsx as jsx5, jsxs as jsxs3 } from "react/jsx-runtime";
-var SAMPLE_DATA = {
-  "subscriber.name": "John Doe",
-  "subscriber.firstName": "John",
-  "subscriber.lastName": "Doe",
-  "subscriber.email": "john.doe@example.com"
-};
-var VIEWPORT_SIZES = {
-  desktop: { width: 600, scale: 1 },
-  mobile: { width: 320, scale: 0.8 }
-};
-var EmailPreview = ({
-  content,
-  subject,
-  preheader,
-  mode = "desktop",
-  onValidation,
-  pluginConfig: propPluginConfig
-}) => {
-  const contextPluginConfig = usePluginConfigOptional();
-  const pluginConfig = propPluginConfig || contextPluginConfig;
-  const [html, setHtml] = useState2("");
-  const [loading, setLoading] = useState2(false);
-  const [validationResult, setValidationResult] = useState2(null);
   const iframeRef = useRef(null);
   useEffect(() => {
-    const convertContent = async () => {
-      if (!content) {
-        setHtml("");
+    const fetchPreview = async () => {
+      if (!data?.content || !data.content.root?.children?.length) {
+        setPreviewHtml("");
         return;
       }
       setLoading(true);
+      setError(null);
       try {
-        const emailPreviewConfig = pluginConfig?.customizations?.broadcasts?.emailPreview;
-        const emailHtml = await convertToEmailSafeHtml(content, {
-          wrapInTemplate: emailPreviewConfig?.wrapInTemplate ?? true,
-          preheader,
-          subject,
-          customWrapper: emailPreviewConfig?.customWrapper,
-          customBlockConverter: pluginConfig?.customizations?.broadcasts?.customBlockConverter
-        });
-        const personalizedHtml = replacePersonalizationTags(emailHtml, SAMPLE_DATA);
-        const previewHtml = addEmailHeader(personalizedHtml, {
-          subject,
-          from: "Newsletter <noreply@example.com>",
-          to: SAMPLE_DATA["subscriber.email"]
+        const response = await fetch("/api/broadcasts/preview", {
+          method: "POST",
+          headers: {
+            "Content-Type": "application/json"
+          },
+          credentials: "same-origin",
+          // Include cookies for auth
+          body: JSON.stringify({
+            content: data.content,
+            subject: data.subject || "",
+            preheader: data.preheader || ""
+          })
         });
-        setHtml(previewHtml);
-        const validation = validateEmailHtml(emailHtml);
-        setValidationResult(validation);
-        onValidation?.(validation);
-      } catch (error) {
-        console.error("Failed to convert content to HTML:", error);
-        setHtml("<p>Error converting content to HTML</p>");
+        if (!response.ok) {
+          const errorData = await response.json().catch(() => ({}));
+          throw new Error(errorData.error || `Failed to fetch preview: ${response.status}`);
+        }
+        const result = await response.json();
+        if (result.success && result.html) {
+          setPreviewHtml(result.html);
+        } else {
+          throw new Error(result.error || "No preview HTML returned");
+        }
+      } catch (err) {
+        console.error("Preview fetch error:", err);
+        setError(err instanceof Error ? err.message : "Failed to load preview");
       } finally {
         setLoading(false);
       }
     };
-    convertContent();
-  }, [content, subject, preheader, onValidation, pluginConfig]);
+    const timeoutId = setTimeout(fetchPreview, 500);
+    return () => clearTimeout(timeoutId);
+  }, [data?.content, data?.subject, data?.preheader]);
   useEffect(() => {
-    if (iframeRef.current && html) {
-      const doc = iframeRef.current.contentDocument;
-      if (doc) {
-        doc.open();
-        doc.write(html);
-        doc.close();
-      }
-    }
-  }, [html]);
-  const viewport = VIEWPORT_SIZES[mode];
-  return /* @__PURE__ */ jsxs3("div", { style: { height: "100%", display: "flex", flexDirection: "column" }, children: [
-    validationResult && (validationResult.errors.length > 0 || validationResult.warnings.length > 0) && /* @__PURE__ */ jsxs3("div", { style: { padding: "16px", borderBottom: "1px solid #e5e7eb" }, children: [
-      validationResult.errors.length > 0 && /* @__PURE__ */ jsxs3("div", { style: { marginBottom: "12px" }, children: [
-        /* @__PURE__ */ jsxs3("h4", { style: { color: "#dc2626", margin: "0 0 8px 0", fontSize: "14px" }, children: [
-          "Errors (",
-          validationResult.errors.length,
-          ")"
-        ] }),
-        /* @__PURE__ */ jsx5("ul", { style: { margin: 0, paddingLeft: "20px", fontSize: "13px", color: "#dc2626" }, children: validationResult.errors.map((error, index) => /* @__PURE__ */ jsx5("li", { children: error }, index)) })
-      ] }),
-      validationResult.warnings.length > 0 && /* @__PURE__ */ jsxs3("div", { children: [
-        /* @__PURE__ */ jsxs3("h4", { style: { color: "#d97706", margin: "0 0 8px 0", fontSize: "14px" }, children: [
-          "Warnings (",
-          validationResult.warnings.length,
-          ")"
-        ] }),
-        /* @__PURE__ */ jsx5("ul", { style: { margin: 0, paddingLeft: "20px", fontSize: "13px", color: "#d97706" }, children: validationResult.warnings.map((warning, index) => /* @__PURE__ */ jsx5("li", { children: warning }, index)) })
-      ] })
-    ] }),
-    /* @__PURE__ */ jsx5("div", { style: {
-      flex: 1,
+    if (iframeRef.current && previewHtml) {
+      const iframe = iframeRef.current;
+      const resizeIframe = () => {
+        try {
+          const body = iframe.contentDocument?.body;
+          if (body) {
+            iframe.style.height = `${body.scrollHeight + 40}px`;
+          }
+        } catch {
+          iframe.style.height = "600px";
+        }
+      };
+      iframe.onload = resizeIframe;
+      const contentWindow = iframe.contentWindow;
+      if (contentWindow) {
+        contentWindow.addEventListener("resize", resizeIframe);
+        return () => contentWindow.removeEventListener("resize", resizeIframe);
+      }
+    }
+  }, [previewHtml]);
+  if (!data?.content) {
+    return /* @__PURE__ */ jsx("div", { style: {
+      padding: "2rem",
+      textAlign: "center",
+      color: "#666",
+      border: "1px dashed #ddd",
+      borderRadius: "4px",
+      backgroundColor: "#f9f9f9"
+    }, children: /* @__PURE__ */ jsx("p", { children: "Start adding content to see the email preview" }) });
+  }
+  if (loading) {
+    return /* @__PURE__ */ jsx("div", { style: {
+      padding: "2rem",
+      textAlign: "center",
+      border: "1px solid #e0e0e0",
+      borderRadius: "4px",
+      backgroundColor: "#f9f9f9"
+    }, children: /* @__PURE__ */ jsx("div", { style: { display: "inline-block" }, children: "Loading preview..." }) });
+  }
+  if (error) {
+    return /* @__PURE__ */ jsxs("div", { style: {
+      padding: "1rem",
+      border: "1px solid #fee",
+      borderRadius: "4px",
+      backgroundColor: "#fef2f2",
+      color: "#dc2626"
+    }, children: [
+      /* @__PURE__ */ jsx("strong", { children: "Preview Error:" }),
+      " ",
+      error
+    ] });
+  }
+  return /* @__PURE__ */ jsxs("div", { className: "broadcast-preview", style: { marginTop: "1rem" }, children: [
+    /* @__PURE__ */ jsxs("div", { style: {
+      marginBottom: "0.5rem",
       display: "flex",
-      alignItems: "center",
-      justifyContent: "center",
-      backgroundColor: "#f3f4f6",
-      padding: "20px",
-      overflow: "auto"
-    }, children: loading ? /* @__PURE__ */ jsx5("div", { style: { textAlign: "center", color: "#6b7280" }, children: /* @__PURE__ */ jsx5("p", { children: "Loading preview..." }) }) : html ? /* @__PURE__ */ jsx5("div", { style: {
-      backgroundColor: "white",
-      boxShadow: "0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)",
-      borderRadius: "8px",
+      justifyContent: "space-between",
+      alignItems: "center"
+    }, children: [
+      /* @__PURE__ */ jsx("h3", { style: { margin: 0, fontSize: "1rem", fontWeight: "600" }, children: "Email Preview" }),
+      /* @__PURE__ */ jsx("div", { style: { fontSize: "0.875rem", color: "#666" }, children: data.subject && /* @__PURE__ */ jsxs("span", { children: [
+        "Subject: ",
+        data.subject
+      ] }) })
+    ] }),
+    /* @__PURE__ */ jsx("div", { style: {
+      border: "1px solid #e0e0e0",
+      borderRadius: "4px",
       overflow: "hidden",
-      transform: `scale(${viewport.scale})`,
-      transformOrigin: "top center"
-    }, children: /* @__PURE__ */ jsx5(
+      backgroundColor: "#fff"
+    }, children: /* @__PURE__ */ jsx(
       "iframe",
       {
         ref: iframeRef,
-        title: "Email Preview",
+        srcDoc: previewHtml,
         style: {
-          width: `${viewport.width}px`,
-          height: "800px",
+          width: "100%",
+          minHeight: "400px",
           border: "none",
           display: "block"
         },
+        title: "Email Preview",
         sandbox: "allow-same-origin"
       }
-    ) }) : /* @__PURE__ */ jsx5("div", { style: { textAlign: "center", color: "#6b7280" }, children: /* @__PURE__ */ jsx5("p", { children: "Start typing to see the email preview" }) }) }),
-    validationResult && /* @__PURE__ */ jsxs3("div", { style: {
-      padding: "12px 16px",
-      borderTop: "1px solid #e5e7eb",
-      fontSize: "13px",
-      color: "#6b7280",
-      display: "flex",
-      gap: "24px"
-    }, children: [
-      /* @__PURE__ */ jsxs3("span", { children: [
-        "Size: ",
-        Math.round(validationResult.stats.sizeInBytes / 1024),
-        "KB"
-      ] }),
-      /* @__PURE__ */ jsxs3("span", { children: [
-        "Links: ",
-        validationResult.stats.linkCount
-      ] }),
-      /* @__PURE__ */ jsxs3("span", { children: [
-        "Images: ",
-        validationResult.stats.imageCount
-      ] }),
-      /* @__PURE__ */ jsxs3("span", { children: [
-        "Viewport: ",
-        mode === "desktop" ? "600px" : "320px"
-      ] })
-    ] })
+    ) }),
+    /* @__PURE__ */ jsx("div", { style: {
+      marginTop: "0.5rem",
+      fontSize: "0.75rem",
+      color: "#666",
+      textAlign: "center"
+    }, children: "This preview shows how your email will appear when sent" })
   ] });
 };
-function addEmailHeader(html, headers) {
-  const headerHtml = `
-    <div style="background-color: #f9fafb; border-bottom: 1px solid #e5e7eb; padding: 16px; font-family: monospace; font-size: 13px;">
-      <div style="margin-bottom: 8px;"><strong>Subject:</strong> ${escapeHtml2(headers.subject)}</div>
-      <div style="margin-bottom: 8px;"><strong>From:</strong> ${escapeHtml2(headers.from)}</div>
-      <div><strong>To:</strong> ${escapeHtml2(headers.to)}</div>
-    </div>
-  `;
-  return html.replace(/<body[^>]*>/, `$&${headerHtml}`);
-}
-function escapeHtml2(text) {
-  const div = document.createElement("div");
-  div.textContent = text;
-  return div.innerHTML;
-}
 
-// src/components/Broadcasts/BroadcastEditor.tsx
-import { useState as useState3, useCallback as useCallback2 } from "react";
-import { useField, useFormFields as useFormFields2 } from "@payloadcms/ui";
-import { jsx as jsx6, jsxs as jsxs4 } from "react/jsx-runtime";
-var BroadcastEditor = (props) => {
-  const { value } = useField({ path: props.path });
-  const [showPreview, setShowPreview] = useState3(true);
-  const [previewMode, setPreviewMode] = useState3("desktop");
-  const [isValid, setIsValid] = useState3(true);
-  const [validationSummary, setValidationSummary] = useState3("");
-  const fields = useFormFields2(([fields2]) => ({
-    subject: fields2["subject"],
-    preheader: fields2["contentSection.preheader"]
-  }));
-  const handleValidation = useCallback2((result) => {
-    setIsValid(result.valid);
-    const errorCount = result.errors.length;
-    const warningCount = result.warnings.length;
-    if (errorCount > 0) {
-      setValidationSummary(`${errorCount} error${errorCount !== 1 ? "s" : ""}, ${warningCount} warning${warningCount !== 1 ? "s" : ""}`);
-    } else if (warningCount > 0) {
-      setValidationSummary(`${warningCount} warning${warningCount !== 1 ? "s" : ""}`);
-    } else {
-      setValidationSummary("");
-    }
-  }, []);
-  const handleTestEmail = async () => {
-    const pathParts = window.location.pathname.split("/");
-    const broadcastId = pathParts[pathParts.length - 1];
-    if (!broadcastId || broadcastId === "create") {
-      alert("Please save the broadcast before sending a test email");
-      return;
-    }
-    try {
-      const response = await fetch(`/api/broadcasts/${broadcastId}/test`, {
-        method: "POST",
-        headers: {
-          "Content-Type": "application/json"
-        }
-      });
-      if (!response.ok) {
-        const data = await response.json();
-        throw new Error(data.error || "Failed to send test email");
-      }
-      alert("Test email sent successfully! Check your inbox.");
-    } catch (error) {
-      alert(error instanceof Error ? error.message : "Failed to send test email");
+// src/admin/components/StatusBadge.tsx
+import { jsx as jsx2 } from "react/jsx-runtime";
+var StatusBadge = (props) => {
+  const status = props.cellData || "draft";
+  const getStatusColor = (status2) => {
+    switch (status2) {
+      case "sent":
+        return "#22c55e";
+      case "scheduled":
+        return "#3b82f6";
+      case "draft":
+        return "#6b7280";
+      case "failed":
+        return "#ef4444";
+      default:
+        return "#6b7280";
+    }
+  };
+  const getStatusLabel = (status2) => {
+    switch (status2) {
+      case "sent":
+        return "Sent";
+      case "scheduled":
+        return "Scheduled";
+      case "draft":
+        return "Draft";
+      case "failed":
+        return "Failed";
+      default:
+        return status2;
+    }
+  };
+  return /* @__PURE__ */ jsx2(
+    "span",
+    {
+      style: {
+        display: "inline-block",
+        padding: "4px 8px",
+        borderRadius: "12px",
+        fontSize: "12px",
+        fontWeight: "500",
+        color: "#fff",
+        backgroundColor: getStatusColor(status),
+        textTransform: "capitalize"
+      },
+      children: getStatusLabel(status)
     }
-  };
-  return /* @__PURE__ */ jsxs4("div", { style: { height: "600px", display: "flex", flexDirection: "column" }, children: [
-    /* @__PURE__ */ jsxs4("div", { style: {
-      display: "flex",
-      alignItems: "center",
-      justifyContent: "space-between",
-      padding: "12px 16px",
-      borderBottom: "1px solid #e5e7eb",
-      backgroundColor: "#f9fafb"
-    }, children: [
-      /* @__PURE__ */ jsxs4("div", { style: { display: "flex", alignItems: "center", gap: "16px" }, children: [
-        /* @__PURE__ */ jsx6(
-          "button",
-          {
-            type: "button",
-            onClick: () => setShowPreview(!showPreview),
-            style: {
-              padding: "6px 12px",
-              backgroundColor: showPreview ? "#3b82f6" : "#e5e7eb",
-              color: showPreview ? "white" : "#374151",
-              border: "none",
-              borderRadius: "4px",
-              fontSize: "14px",
-              cursor: "pointer"
-            },
-            children: showPreview ? "Hide Preview" : "Show Preview"
-          }
-        ),
-        showPreview && /* @__PURE__ */ jsxs4("div", { style: { display: "flex", gap: "8px" }, children: [
-          /* @__PURE__ */ jsx6(
-            "button",
-            {
-              type: "button",
-              onClick: () => setPreviewMode("desktop"),
-              style: {
-                padding: "6px 12px",
-                backgroundColor: previewMode === "desktop" ? "#6366f1" : "#e5e7eb",
-                color: previewMode === "desktop" ? "white" : "#374151",
-                border: "none",
-                borderRadius: "4px 0 0 4px",
-                fontSize: "14px",
-                cursor: "pointer"
-              },
-              children: "Desktop"
-            }
-          ),
-          /* @__PURE__ */ jsx6(
-            "button",
-            {
-              type: "button",
-              onClick: () => setPreviewMode("mobile"),
-              style: {
-                padding: "6px 12px",
-                backgroundColor: previewMode === "mobile" ? "#6366f1" : "#e5e7eb",
-                color: previewMode === "mobile" ? "white" : "#374151",
-                border: "none",
-                borderRadius: "0 4px 4px 0",
-                fontSize: "14px",
-                cursor: "pointer"
-              },
-              children: "Mobile"
-            }
-          )
-        ] }),
-        showPreview && validationSummary && /* @__PURE__ */ jsx6("div", { style: {
-          padding: "6px 12px",
-          backgroundColor: isValid ? "#fef3c7" : "#fee2e2",
-          color: isValid ? "#92400e" : "#991b1b",
-          borderRadius: "4px",
-          fontSize: "13px"
-        }, children: validationSummary })
-      ] }),
-      showPreview && /* @__PURE__ */ jsx6(
-        "button",
-        {
-          type: "button",
-          onClick: handleTestEmail,
-          style: {
-            padding: "6px 12px",
-            backgroundColor: "#10b981",
-            color: "white",
-            border: "none",
-            borderRadius: "4px",
-            fontSize: "14px",
-            cursor: "pointer"
-          },
-          children: "Send Test Email"
-        }
-      )
-    ] }),
-    /* @__PURE__ */ jsxs4("div", { style: { flex: 1, display: "flex", overflow: "hidden" }, children: [
-      /* @__PURE__ */ jsx6("div", { style: {
-        flex: showPreview ? "0 0 50%" : "1",
-        overflow: "auto",
-        borderRight: showPreview ? "1px solid #e5e7eb" : "none"
-      }, children: /* @__PURE__ */ jsx6("div", { style: { padding: "16px" }, children: /* @__PURE__ */ jsx6("div", { className: "rich-text-lexical" }) }) }),
-      showPreview && /* @__PURE__ */ jsx6("div", { style: { flex: "0 0 50%", overflow: "hidden" }, children: /* @__PURE__ */ jsx6(
-        EmailPreview,
-        {
-          content: value,
-          subject: fields.subject?.value || "Email Subject",
-          preheader: fields.preheader?.value,
-          mode: previewMode,
-          onValidation: handleValidation
-        }
-      ) })
-    ] })
-  ] });
+  );
 };
 
-// src/components/Broadcasts/EmailPreviewField.tsx
-import { useState as useState4 } from "react";
-import { useFormFields as useFormFields3 } from "@payloadcms/ui";
-import { jsx as jsx7, jsxs as jsxs5 } from "react/jsx-runtime";
-var EmailPreviewField = () => {
-  const [previewMode, setPreviewMode] = useState4("desktop");
-  const [isValid, setIsValid] = useState4(true);
-  const [validationSummary, setValidationSummary] = useState4("");
-  const pluginConfig = usePluginConfigOptional();
-  const fields = useFormFields3(([fields2]) => ({
-    content: fields2["contentSection.content"],
-    subject: fields2["subject"],
-    preheader: fields2["contentSection.preheader"],
-    channel: fields2.channel
-  }));
-  const handleValidation = (result) => {
-    setIsValid(result.valid);
-    const errorCount = result.errors.length;
-    const warningCount = result.warnings.length;
-    if (errorCount > 0) {
-      setValidationSummary(`${errorCount} error${errorCount !== 1 ? "s" : ""}, ${warningCount} warning${warningCount !== 1 ? "s" : ""}`);
-    } else if (warningCount > 0) {
-      setValidationSummary(`${warningCount} warning${warningCount !== 1 ? "s" : ""}`);
-    } else {
-      setValidationSummary("");
-    }
-  };
-  const handleTestEmail = async () => {
-    const pathParts = window.location.pathname.split("/");
-    const broadcastId = pathParts[pathParts.length - 1];
-    if (!broadcastId || broadcastId === "create") {
-      alert("Please save the broadcast before sending a test email");
-      return;
-    }
-    try {
-      const response = await fetch(`/api/broadcasts/${broadcastId}/test`, {
-        method: "POST",
-        headers: {
-          "Content-Type": "application/json"
-        }
-      });
-      if (!response.ok) {
-        const data = await response.json();
-        throw new Error(data.error || "Failed to send test email");
-      }
-      alert("Test email sent successfully! Check your inbox.");
-    } catch (error) {
-      alert(error instanceof Error ? error.message : "Failed to send test email");
-    }
-  };
-  return /* @__PURE__ */ jsxs5("div", { style: {
-    marginTop: "24px",
-    border: "1px solid #e5e7eb",
-    borderRadius: "8px",
-    overflow: "hidden"
-  }, children: [
-    /* @__PURE__ */ jsxs5("div", { style: {
-      display: "flex",
-      alignItems: "center",
-      justifyContent: "space-between",
-      padding: "12px 16px",
-      borderBottom: "1px solid #e5e7eb",
-      backgroundColor: "#f9fafb"
-    }, children: [
-      /* @__PURE__ */ jsxs5("div", { style: { display: "flex", alignItems: "center", gap: "16px" }, children: [
-        /* @__PURE__ */ jsx7("h3", { style: { margin: 0, fontSize: "16px", fontWeight: 600 }, children: "Email Preview" }),
-        /* @__PURE__ */ jsxs5("div", { style: { display: "flex", gap: "8px" }, children: [
-          /* @__PURE__ */ jsx7(
-            "button",
-            {
-              type: "button",
-              onClick: () => setPreviewMode("desktop"),
-              style: {
-                padding: "6px 12px",
-                backgroundColor: previewMode === "desktop" ? "#6366f1" : "#e5e7eb",
-                color: previewMode === "desktop" ? "white" : "#374151",
-                border: "none",
-                borderRadius: "4px 0 0 4px",
-                fontSize: "14px",
-                cursor: "pointer"
-              },
-              children: "Desktop"
-            }
-          ),
-          /* @__PURE__ */ jsx7(
-            "button",
-            {
-              type: "button",
-              onClick: () => setPreviewMode("mobile"),
-              style: {
-                padding: "6px 12px",
-                backgroundColor: previewMode === "mobile" ? "#6366f1" : "#e5e7eb",
-                color: previewMode === "mobile" ? "white" : "#374151",
-                border: "none",
-                borderRadius: "0 4px 4px 0",
-                fontSize: "14px",
-                cursor: "pointer"
-              },
-              children: "Mobile"
-            }
-          )
-        ] }),
-        validationSummary && /* @__PURE__ */ jsx7("div", { style: {
-          padding: "6px 12px",
-          backgroundColor: isValid ? "#fef3c7" : "#fee2e2",
-          color: isValid ? "#92400e" : "#991b1b",
-          borderRadius: "4px",
-          fontSize: "13px"
-        }, children: validationSummary })
-      ] }),
-      /* @__PURE__ */ jsx7(
-        "button",
-        {
-          type: "button",
-          onClick: handleTestEmail,
-          style: {
-            padding: "6px 12px",
-            backgroundColor: "#10b981",
-            color: "white",
-            border: "none",
-            borderRadius: "4px",
-            fontSize: "14px",
-            cursor: "pointer"
-          },
-          children: "Send Test Email"
-        }
-      )
+// src/admin/components/EmailPreview.tsx
+import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
+var EmailPreview = ({
+  content,
+  subject,
+  preheader
+}) => {
+  return /* @__PURE__ */ jsxs2("div", { className: "email-preview", style: { padding: "1rem" }, children: [
+    /* @__PURE__ */ jsxs2("div", { style: { marginBottom: "1rem" }, children: [
+      /* @__PURE__ */ jsx3("strong", { children: "Subject:" }),
+      " ",
+      subject || "No subject"
     ] }),
-    /* @__PURE__ */ jsx7("div", { style: { height: "600px" }, children: /* @__PURE__ */ jsx7(
-      EmailPreview,
-      {
-        content: fields.content?.value || null,
-        subject: fields.subject?.value || "Email Subject",
-        preheader: fields.preheader?.value,
-        mode: previewMode,
-        onValidation: handleValidation,
-        pluginConfig: pluginConfig || void 0
-      }
-    ) })
+    preheader && /* @__PURE__ */ jsxs2("div", { style: { marginBottom: "1rem", color: "#666" }, children: [
+      /* @__PURE__ */ jsx3("strong", { children: "Preheader:" }),
+      " ",
+      preheader
+    ] }),
+    /* @__PURE__ */ jsxs2("div", { style: {
+      border: "1px solid #e0e0e0",
+      borderRadius: "4px",
+      padding: "1rem",
+      backgroundColor: "#f9f9f9"
+    }, children: [
+      /* @__PURE__ */ jsx3("div", { children: "Email content will be rendered here" }),
+      content && /* @__PURE__ */ jsxs2("div", { style: { marginTop: "1rem", fontSize: "14px", color: "#666" }, children: [
+        "Content type: ",
+        typeof content
+      ] })
+    ] })
   ] });
 };
-
-// src/components/Broadcasts/BroadcastPreviewField.tsx
-import { jsx as jsx8 } from "react/jsx-runtime";
-var BroadcastPreviewField = () => {
-  return /* @__PURE__ */ jsx8("div", { style: {
-    padding: "1rem",
-    background: "#f9fafb",
-    borderRadius: "4px",
-    fontSize: "14px",
-    color: "#6b7280"
-  }, children: "Email preview is available inline below the content editor." });
-};
-
-// src/contexts/ClientContext.tsx
-import { createContext as createContext2, useContext as useContext2 } from "react";
-import { jsx as jsx9 } from "react/jsx-runtime";
-var PluginConfigContext2 = createContext2(null);
-var PluginConfigProvider = ({ config, children }) => {
-  return /* @__PURE__ */ jsx9(PluginConfigContext2.Provider, { value: config, children });
-};
-var usePluginConfig = () => {
-  const context = useContext2(PluginConfigContext2);
-  if (!context) {
-    throw new Error("usePluginConfig must be used within a PluginConfigProvider");
-  }
-  return context;
-};
-var usePluginConfigOptional2 = () => {
-  return useContext2(PluginConfigContext2);
-};
-
-// src/fields/broadcastInlinePreview.ts
-var createBroadcastInlinePreviewField = () => {
-  return {
-    name: "broadcastInlinePreview",
-    type: "ui",
-    admin: {
-      components: {
-        Field: "payload-plugin-newsletter/components#BroadcastInlinePreview"
-      }
-    }
-  };
-};
-
-// src/fields/broadcastPreview.ts
-var createBroadcastPreviewField = () => {
-  return {
-    name: "broadcastPreview",
-    type: "ui",
-    admin: {
-      components: {
-        Field: "payload-plugin-newsletter/components#BroadcastPreviewField"
-      },
-      position: "sidebar"
-    }
-  };
-};
-
-// src/fields/emailContent.ts
-import {
-  BoldFeature,
-  ItalicFeature,
-  UnderlineFeature,
-  StrikethroughFeature,
-  LinkFeature,
-  OrderedListFeature,
-  UnorderedListFeature,
-  HeadingFeature,
-  ParagraphFeature,
-  AlignFeature,
-  BlockquoteFeature,
-  BlocksFeature,
-  UploadFeature,
-  FixedToolbarFeature,
-  InlineToolbarFeature,
-  lexicalEditor
-} from "@payloadcms/richtext-lexical";
-
-// src/utils/blockValidation.ts
-var EMAIL_INCOMPATIBLE_TYPES = [
-  "chart",
-  "dataTable",
-  "interactive",
-  "streamable",
-  "video",
-  "iframe",
-  "form",
-  "carousel",
-  "tabs",
-  "accordion",
-  "map"
-];
-var validateEmailBlocks = (blocks) => {
-  blocks.forEach((block) => {
-    if (EMAIL_INCOMPATIBLE_TYPES.includes(block.slug)) {
-      console.warn(`\u26A0\uFE0F  Block "${block.slug}" may not be email-compatible. Consider creating an email-specific version.`);
-    }
-    const hasComplexFields = block.fields?.some((field) => {
-      const complexTypes = ["code", "json", "richText", "blocks", "array"];
-      return complexTypes.includes(field.type);
-    });
-    if (hasComplexFields) {
-      console.warn(`\u26A0\uFE0F  Block "${block.slug}" contains complex field types that may not render consistently in email clients.`);
-    }
-  });
-};
-var createEmailSafeBlocks = (customBlocks = []) => {
-  validateEmailBlocks(customBlocks);
-  const baseBlocks = [
-    {
-      slug: "button",
-      fields: [
-        {
-          name: "text",
-          type: "text",
-          label: "Button Text",
-          required: true
-        },
-        {
-          name: "url",
-          type: "text",
-          label: "Button URL",
-          required: true,
-          admin: {
-            description: "Enter the full URL (including https://)"
-          }
-        },
-        {
-          name: "style",
-          type: "select",
-          label: "Button Style",
-          defaultValue: "primary",
-          options: [
-            { label: "Primary", value: "primary" },
-            { label: "Secondary", value: "secondary" },
-            { label: "Outline", value: "outline" }
-          ]
-        }
-      ],
-      interfaceName: "EmailButton",
-      labels: {
-        singular: "Button",
-        plural: "Buttons"
-      }
-    },
-    {
-      slug: "divider",
-      fields: [
-        {
-          name: "style",
-          type: "select",
-          label: "Divider Style",
-          defaultValue: "solid",
-          options: [
-            { label: "Solid", value: "solid" },
-            { label: "Dashed", value: "dashed" },
-            { label: "Dotted", value: "dotted" }
-          ]
-        }
-      ],
-      interfaceName: "EmailDivider",
-      labels: {
-        singular: "Divider",
-        plural: "Dividers"
-      }
-    }
-  ];
-  return [
-    ...baseBlocks,
-    ...customBlocks
-  ];
-};
-
-// src/fields/emailContent.ts
-var createEmailSafeFeatures = (additionalBlocks) => {
-  const baseBlocks = [
-    {
-      slug: "button",
-      fields: [
-        {
-          name: "text",
-          type: "text",
-          label: "Button Text",
-          required: true
-        },
-        {
-          name: "url",
-          type: "text",
-          label: "Button URL",
-          required: true,
-          admin: {
-            description: "Enter the full URL (including https://)"
-          }
-        },
-        {
-          name: "style",
-          type: "select",
-          label: "Button Style",
-          defaultValue: "primary",
-          options: [
-            { label: "Primary", value: "primary" },
-            { label: "Secondary", value: "secondary" },
-            { label: "Outline", value: "outline" }
-          ]
-        }
-      ],
-      interfaceName: "EmailButton",
-      labels: {
-        singular: "Button",
-        plural: "Buttons"
-      }
-    },
-    {
-      slug: "divider",
-      fields: [
-        {
-          name: "style",
-          type: "select",
-          label: "Divider Style",
-          defaultValue: "solid",
-          options: [
-            { label: "Solid", value: "solid" },
-            { label: "Dashed", value: "dashed" },
-            { label: "Dotted", value: "dotted" }
-          ]
-        }
-      ],
-      interfaceName: "EmailDivider",
-      labels: {
-        singular: "Divider",
-        plural: "Dividers"
-      }
-    }
-  ];
-  const allBlocks = [
-    ...baseBlocks,
-    ...additionalBlocks || []
-  ];
-  return [
-    // Toolbars
-    FixedToolbarFeature(),
-    // Fixed toolbar at the top
-    InlineToolbarFeature(),
-    // Floating toolbar when text is selected
-    // Basic text formatting
-    BoldFeature(),
-    ItalicFeature(),
-    UnderlineFeature(),
-    StrikethroughFeature(),
-    // Links with enhanced configuration
-    LinkFeature({
-      fields: [
-        {
-          name: "url",
-          type: "text",
-          required: true,
-          admin: {
-            description: "Enter the full URL (including https://)"
-          }
-        },
-        {
-          name: "newTab",
-          type: "checkbox",
-          label: "Open in new tab",
-          defaultValue: false
-        }
-      ]
-    }),
-    // Lists
-    OrderedListFeature(),
-    UnorderedListFeature(),
-    // Headings - limited to h1, h2, h3 for email compatibility
-    HeadingFeature({
-      enabledHeadingSizes: ["h1", "h2", "h3"]
-    }),
-    // Basic paragraph and alignment
-    ParagraphFeature(),
-    AlignFeature(),
-    // Blockquotes
-    BlockquoteFeature(),
-    // Upload feature for images
-    UploadFeature({
-      collections: {
-        media: {
-          fields: [
-            {
-              name: "caption",
-              type: "text",
-              admin: {
-                description: "Optional caption for the image"
-              }
-            },
-            {
-              name: "altText",
-              type: "text",
-              label: "Alt Text",
-              required: true,
-              admin: {
-                description: "Alternative text for accessibility and when image cannot be displayed"
-              }
-            }
-          ]
-        }
-      }
-    }),
-    // Custom blocks for email-specific content
-    BlocksFeature({
-      blocks: allBlocks
-    })
-  ];
-};
-var createEmailLexicalEditor = (customBlocks = []) => {
-  const emailSafeBlocks = createEmailSafeBlocks(customBlocks);
-  return lexicalEditor({
-    features: [
-      // Toolbars
-      FixedToolbarFeature(),
-      InlineToolbarFeature(),
-      // Basic text formatting
-      BoldFeature(),
-      ItalicFeature(),
-      UnderlineFeature(),
-      StrikethroughFeature(),
-      // Links with enhanced configuration
-      LinkFeature({
-        fields: [
-          {
-            name: "url",
-            type: "text",
-            required: true,
-            admin: {
-              description: "Enter the full URL (including https://)"
-            }
-          },
-          {
-            name: "newTab",
-            type: "checkbox",
-            label: "Open in new tab",
-            defaultValue: false
-          }
-        ]
-      }),
-      // Lists
-      OrderedListFeature(),
-      UnorderedListFeature(),
-      // Headings - limited to h1, h2, h3 for email compatibility
-      HeadingFeature({
-        enabledHeadingSizes: ["h1", "h2", "h3"]
-      }),
-      // Basic paragraph and alignment
-      ParagraphFeature(),
-      AlignFeature(),
-      // Blockquotes
-      BlockquoteFeature(),
-      // Upload feature for images
-      UploadFeature({
-        collections: {
-          media: {
-            fields: [
-              {
-                name: "caption",
-                type: "text",
-                admin: {
-                  description: "Optional caption for the image"
-                }
-              },
-              {
-                name: "altText",
-                type: "text",
-                label: "Alt Text",
-                required: true,
-                admin: {
-                  description: "Alternative text for accessibility and when image cannot be displayed"
-                }
-              }
-            ]
-          }
-        }
-      }),
-      // Email-safe blocks (processed server-side)
-      BlocksFeature({
-        blocks: emailSafeBlocks
-      })
-    ]
-  });
-};
-var emailSafeFeatures = createEmailSafeFeatures();
-var createEmailContentField = (overrides) => {
-  const editor = overrides?.editor || createEmailLexicalEditor(overrides?.additionalBlocks);
-  return {
-    name: "content",
-    type: "richText",
-    required: true,
-    editor,
-    admin: {
-      description: "Email content with limited formatting for compatibility",
-      ...overrides?.admin
-    },
-    ...overrides
-  };
-};
 export {
-  BroadcastEditor,
   BroadcastInlinePreview,
-  BroadcastPreviewField,
   EmailPreview,
-  EmailPreviewField,
-  PluginConfigProvider,
-  StatusBadge,
-  createBroadcastInlinePreviewField,
-  createBroadcastPreviewField,
-  createEmailContentField,
-  usePluginConfig,
-  usePluginConfigOptional2 as usePluginConfigOptional
+  StatusBadge
 };