@dashboard-designer/ui 0.1.0 → 0.1.2

package/dist/index.js

@@ -1,20 +1,21 @@
 // src/designer/DashboardDesigner.tsx
-import React11, { useEffect as useEffect11, useMemo as useMemo6, useState as useState11 } from "react";
+import React13, { useEffect as useEffect13, useMemo as useMemo6, useState as useState12 } from "react";
 import GridLayout from "react-grid-layout";
-import { useTranslation as useTranslation13 } from "react-i18next";
+import { useTranslation as useTranslation15 } from "react-i18next";
 import {
   ArrowUpLeft,
   FileDown,
   History as History2,
+  Mail as Mail2,
   Pencil,
-  Plus as Plus5,
+  Plus as Plus6,
   Printer,
   Redo2,
   RotateCcw as RotateCcw3,
   Save as Save2,
   Settings2,
   Share2,
-  Trash2 as Trash24,
+  Trash2 as Trash25,
   Undo2
 } from "lucide-react";
 import {
@@ -79,6 +80,11 @@ var DashboardApiClient = class {
       body: JSON.stringify(connection)
     });
   }
+  deleteConnection(id) {
+    return this.req(`/api/connections/${id}`, {
+      method: "DELETE"
+    });
+  }
   testConnection(id) {
     return this.req(`/api/connections/${id}/test`, {
       method: "POST",
@@ -150,6 +156,15 @@ var DashboardApiClient = class {
       body: JSON.stringify(input)
     });
   }
+  emailStatus() {
+    return this.req("/api/email/status");
+  }
+  sendDashboardEmail(input) {
+    return this.req("/api/email/send", {
+      method: "POST",
+      body: JSON.stringify(input)
+    });
+  }
 };
 
 // src/i18n.ts
@@ -360,13 +375,55 @@ var resources = {
       exportOptions: "Export & print",
       allowPrint: "Allow print",
       allowExportPdf: "Allow export to PDF",
+      allowEmail: "Allow send email",
+      emailAttachmentOptions: "Email attachments",
+      emailAttachPdf: "Attach dashboard PDF",
+      emailAllowExtraAttachments: "Allow additional files",
+      emailMaxExtraAttachments: "Max additional files",
       print: "Print",
       printDashboard: "Print dashboard",
       exportPdf: "Export PDF",
       exportPdfHint: "Open the print dialog and choose Save as PDF",
+      emailAction: "Email",
+      sendEmail: "Send email",
+      composeEmail: "Compose email",
+      emailTo: "To",
+      emailCc: "Cc",
+      emailSubject: "Subject",
+      emailBody: "Message",
+      emailAttachment: "Attachment",
+      emailAttachments: "Attachments",
+      emailAddAttachment: "Add file",
+      emailAttachmentPdfNote: "Generated on send",
+      emailTooManyAttachments: "You can add up to {{count}} extra files",
+      emailBodyPlaceholder: "Write your message\u2026",
+      emailFormatToolbar: "Formatting",
+      emailBold: "Bold",
+      emailItalic: "Italic",
+      emailUnderline: "Underline",
+      emailBulletList: "Bullet list",
+      emailNumberedList: "Numbered list",
+      emailInsertLink: "Insert link",
+      emailClearFormat: "Clear formatting",
+      emailLinkPrompt: "Link URL",
+      emailSending: "Sending\u2026",
+      emailSent: "Email sent",
+      emailNotConfigured: "Email is not configured on the server. Set DD_SMTP_HOST and DD_SMTP_FROM.",
+      emailComposeHint: "Compose a formatted message. A PDF of the dashboard is attached automatically; you can add more files.",
+      emailDefaultSubject: "Dashboard: {{title}}",
+      emailDefaultBody: "Please find the dashboard \u201C{{title}}\u201D attached as a PDF.",
       helpExportOptions: "Control which export actions appear in the dashboard toolbar.",
       helpAllowPrint: "Shows a Print button that opens the browser print dialog for this dashboard.",
       helpAllowExportPdf: "Shows Export PDF. Uses the print dialog so charts render correctly \u2014 choose Save as PDF as the destination.",
+      helpAllowEmail: "Shows Send email in the toolbar. Requires SMTP settings on the API (DD_SMTP_*).",
+      helpEmailAttachPdf: "When enabled, Send email generates and attaches a PDF snapshot of the dashboard.",
+      helpEmailAllowExtraAttachments: "When enabled, users can add their own files in the compose dialog.",
+      helpEmailMaxExtraAttachments: "Maximum number of user-added files (0\u201310).",
+      helpEmailTo: "Recipient addresses, separated by commas.",
+      helpEmailCc: "Optional Cc recipients, separated by commas.",
+      helpEmailBody: "Format with the toolbar: bold, italic, lists, and links. Sent as HTML email.",
+      helpEmailAttachment: "A PDF snapshot of the visible dashboard canvas is generated when you click Send.",
+      helpEmailExtraAttachments: "Optional extra files (up to 5, 10MB each). Images, PDFs, and documents are supported.",
       themeColors: "Color theme",
       themePreset: "Theme",
       themePresetDefault: "Default (forest)",
@@ -617,13 +674,55 @@ var resources = {
       exportOptions: "Exportar e imprimir",
       allowPrint: "Permitir imprimir",
       allowExportPdf: "Permitir exportar a PDF",
+      allowEmail: "Permitir enviar correo",
+      emailAttachmentOptions: "Adjuntos del correo",
+      emailAttachPdf: "Adjuntar PDF del panel",
+      emailAllowExtraAttachments: "Permitir archivos adicionales",
+      emailMaxExtraAttachments: "M\xE1x. archivos adicionales",
       print: "Imprimir",
       printDashboard: "Imprimir panel",
       exportPdf: "Exportar PDF",
       exportPdfHint: "Abre el di\xE1logo de impresi\xF3n y elija Guardar como PDF",
+      emailAction: "Correo",
+      sendEmail: "Enviar correo",
+      composeEmail: "Redactar correo",
+      emailTo: "Para",
+      emailCc: "Cc",
+      emailSubject: "Asunto",
+      emailBody: "Mensaje",
+      emailAttachment: "Adjunto",
+      emailAttachments: "Adjuntos",
+      emailAddAttachment: "A\xF1adir archivo",
+      emailAttachmentPdfNote: "Se genera al enviar",
+      emailTooManyAttachments: "Puede a\xF1adir hasta {{count}} archivos extra",
+      emailBodyPlaceholder: "Escriba su mensaje\u2026",
+      emailFormatToolbar: "Formato",
+      emailBold: "Negrita",
+      emailItalic: "Cursiva",
+      emailUnderline: "Subrayado",
+      emailBulletList: "Lista con vi\xF1etas",
+      emailNumberedList: "Lista numerada",
+      emailInsertLink: "Insertar enlace",
+      emailClearFormat: "Quitar formato",
+      emailLinkPrompt: "URL del enlace",
+      emailSending: "Enviando\u2026",
+      emailSent: "Correo enviado",
+      emailNotConfigured: "El correo no est\xE1 configurado en el servidor. Defina DD_SMTP_HOST y DD_SMTP_FROM.",
+      emailComposeHint: "Redacte un mensaje con formato. Se adjunta autom\xE1ticamente un PDF del panel; puede a\xF1adir m\xE1s archivos.",
+      emailDefaultSubject: "Panel: {{title}}",
+      emailDefaultBody: "Adjunto encontrar\xE1 el panel \u201C{{title}}\u201D en PDF.",
       helpExportOptions: "Controla qu\xE9 acciones de exportaci\xF3n aparecen en la barra del panel.",
       helpAllowPrint: "Muestra Imprimir y abre el di\xE1logo de impresi\xF3n del navegador.",
       helpAllowExportPdf: "Muestra Exportar PDF. Usa el di\xE1logo de impresi\xF3n para que los gr\xE1ficos se vean bien \u2014 elija Guardar como PDF.",
+      helpAllowEmail: "Muestra Enviar correo en la barra. Requiere SMTP en la API (DD_SMTP_*).",
+      helpEmailAttachPdf: "Si est\xE1 activo, Enviar correo genera y adjunta una instant\xE1nea PDF del panel.",
+      helpEmailAllowExtraAttachments: "Si est\xE1 activo, los usuarios pueden a\xF1adir archivos en el di\xE1logo de composici\xF3n.",
+      helpEmailMaxExtraAttachments: "N\xFAmero m\xE1ximo de archivos a\xF1adidos por el usuario (0\u201310).",
+      helpEmailTo: "Direcciones de destinatario, separadas por comas.",
+      helpEmailCc: "Destinatarios en copia (opcional), separados por comas.",
+      helpEmailBody: "Use la barra para negrita, cursiva, listas y enlaces. Se env\xEDa como HTML.",
+      helpEmailAttachment: "Al pulsar Enviar se genera una instant\xE1nea PDF del lienzo visible del panel.",
+      helpEmailExtraAttachments: "Archivos opcionales (hasta 5, 10 MB cada uno). Se admiten im\xE1genes, PDF y documentos.",
       themeColors: "Tema de color",
       themePreset: "Tema",
       themePresetDefault: "Predeterminado (bosque)",
@@ -3533,17 +3632,581 @@ function SharePanel({ open, onClose, dashboardId, api }) {
   ) });
 }
 
-// src/designer/DashboardSettingsPanel.tsx
-import { useEffect as useEffect9, useMemo as useMemo5, useState as useState9 } from "react";
-import { Plus as Plus4, RotateCcw as RotateCcw2, Trash2 as Trash23, X as X7 } from "lucide-react";
+// src/designer/EmailComposePanel.tsx
+import { useEffect as useEffect10, useId as useId5, useRef as useRef7, useState as useState9 } from "react";
+import { Mail, Paperclip, Plus as Plus4, Trash2 as Trash23, X as X7 } from "lucide-react";
+import { useTranslation as useTranslation13 } from "react-i18next";
+import { resolveEmailOptions } from "@dashboard-designer/core";
+
+// src/components/RichTextEditor.tsx
+import { useEffect as useEffect9, useRef as useRef6 } from "react";
+import {
+  Bold,
+  Italic,
+  Link2 as Link22,
+  List,
+  ListOrdered,
+  RemoveFormatting,
+  Underline
+} from "lucide-react";
 import { useTranslation as useTranslation12 } from "react-i18next";
+import { jsx as jsx12, jsxs as jsxs12 } from "react/jsx-runtime";
+function escapeHtml(text) {
+  return text.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;");
+}
+function plainTextToEmailHtml(text) {
+  const trimmed = text.trim();
+  if (!trimmed) return "<p><br></p>";
+  if (/<[a-z][\s\S]*>/i.test(trimmed)) return trimmed;
+  return trimmed.split(/\n{2,}/).map((block) => `<p>${escapeHtml(block).replace(/\n/g, "<br>")}</p>`).join("");
+}
+function htmlToPlainText(html) {
+  if (typeof document === "undefined") {
+    return html.replace(/<[^>]+>/g, " ").replace(/\s+/g, " ").trim();
+  }
+  const el = document.createElement("div");
+  el.innerHTML = html;
+  return (el.innerText || el.textContent || "").replace(/\u00a0/g, " ").trim();
+}
+function runCommand(command, value) {
+  document.execCommand(command, false, value);
+}
+function RichTextEditor({
+  id,
+  valueHtml,
+  onChange,
+  disabled,
+  placeholder
+}) {
+  const { t } = useTranslation12();
+  const ref = useRef6(null);
+  const lastEmitted = useRef6(valueHtml);
+  useEffect9(() => {
+    const el = ref.current;
+    if (!el) return;
+    if (valueHtml !== lastEmitted.current && el.innerHTML !== valueHtml) {
+      el.innerHTML = valueHtml || "<p><br></p>";
+      lastEmitted.current = valueHtml;
+    }
+  }, [valueHtml]);
+  const emit = () => {
+    const el = ref.current;
+    if (!el) return;
+    const html = el.innerHTML;
+    lastEmitted.current = html;
+    onChange(html);
+  };
+  const format = (command, value) => {
+    if (disabled) return;
+    ref.current?.focus();
+    runCommand(command, value);
+    emit();
+  };
+  const addLink = () => {
+    if (disabled) return;
+    const url = window.prompt(t("emailLinkPrompt"), "https://");
+    if (!url) return;
+    format("createLink", url);
+  };
+  return /* @__PURE__ */ jsxs12("div", { className: `dd-rte${disabled ? " is-disabled" : ""}`, children: [
+    /* @__PURE__ */ jsxs12("div", { className: "dd-rte-toolbar", role: "toolbar", "aria-label": t("emailFormatToolbar"), children: [
+      /* @__PURE__ */ jsx12(
+        "button",
+        {
+          type: "button",
+          className: "dd-btn dd-btn-ghost dd-btn-icon",
+          title: t("emailBold"),
+          "aria-label": t("emailBold"),
+          disabled,
+          onMouseDown: (e) => e.preventDefault(),
+          onClick: () => format("bold"),
+          children: /* @__PURE__ */ jsx12(Bold, { size: ICON_SIZE })
+        }
+      ),
+      /* @__PURE__ */ jsx12(
+        "button",
+        {
+          type: "button",
+          className: "dd-btn dd-btn-ghost dd-btn-icon",
+          title: t("emailItalic"),
+          "aria-label": t("emailItalic"),
+          disabled,
+          onMouseDown: (e) => e.preventDefault(),
+          onClick: () => format("italic"),
+          children: /* @__PURE__ */ jsx12(Italic, { size: ICON_SIZE })
+        }
+      ),
+      /* @__PURE__ */ jsx12(
+        "button",
+        {
+          type: "button",
+          className: "dd-btn dd-btn-ghost dd-btn-icon",
+          title: t("emailUnderline"),
+          "aria-label": t("emailUnderline"),
+          disabled,
+          onMouseDown: (e) => e.preventDefault(),
+          onClick: () => format("underline"),
+          children: /* @__PURE__ */ jsx12(Underline, { size: ICON_SIZE })
+        }
+      ),
+      /* @__PURE__ */ jsx12("span", { className: "dd-rte-sep", "aria-hidden": true }),
+      /* @__PURE__ */ jsx12(
+        "button",
+        {
+          type: "button",
+          className: "dd-btn dd-btn-ghost dd-btn-icon",
+          title: t("emailBulletList"),
+          "aria-label": t("emailBulletList"),
+          disabled,
+          onMouseDown: (e) => e.preventDefault(),
+          onClick: () => format("insertUnorderedList"),
+          children: /* @__PURE__ */ jsx12(List, { size: ICON_SIZE })
+        }
+      ),
+      /* @__PURE__ */ jsx12(
+        "button",
+        {
+          type: "button",
+          className: "dd-btn dd-btn-ghost dd-btn-icon",
+          title: t("emailNumberedList"),
+          "aria-label": t("emailNumberedList"),
+          disabled,
+          onMouseDown: (e) => e.preventDefault(),
+          onClick: () => format("insertOrderedList"),
+          children: /* @__PURE__ */ jsx12(ListOrdered, { size: ICON_SIZE })
+        }
+      ),
+      /* @__PURE__ */ jsx12("span", { className: "dd-rte-sep", "aria-hidden": true }),
+      /* @__PURE__ */ jsx12(
+        "button",
+        {
+          type: "button",
+          className: "dd-btn dd-btn-ghost dd-btn-icon",
+          title: t("emailInsertLink"),
+          "aria-label": t("emailInsertLink"),
+          disabled,
+          onMouseDown: (e) => e.preventDefault(),
+          onClick: addLink,
+          children: /* @__PURE__ */ jsx12(Link22, { size: ICON_SIZE })
+        }
+      ),
+      /* @__PURE__ */ jsx12(
+        "button",
+        {
+          type: "button",
+          className: "dd-btn dd-btn-ghost dd-btn-icon",
+          title: t("emailClearFormat"),
+          "aria-label": t("emailClearFormat"),
+          disabled,
+          onMouseDown: (e) => e.preventDefault(),
+          onClick: () => format("removeFormat"),
+          children: /* @__PURE__ */ jsx12(RemoveFormatting, { size: ICON_SIZE })
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx12(
+      "div",
+      {
+        id,
+        ref,
+        className: "dd-rte-editor dd-input",
+        contentEditable: !disabled,
+        role: "textbox",
+        "aria-multiline": "true",
+        "data-placeholder": placeholder,
+        suppressContentEditableWarning: true,
+        onInput: emit,
+        onBlur: emit
+      }
+    )
+  ] });
+}
+
+// src/export/captureDashboardPdf.ts
+import html2canvas from "html2canvas";
+import { jsPDF } from "jspdf";
+function slugifyTitle2(title) {
+  const s = title.trim().toLowerCase().replace(/[^a-z0-9]+/g, "-").replace(/^-+|-+$/g, "");
+  return s || "dashboard";
+}
+function blobToBase64(blob) {
+  return new Promise((resolve, reject) => {
+    const reader = new FileReader();
+    reader.onload = () => {
+      const result = String(reader.result || "");
+      const comma = result.indexOf(",");
+      resolve(comma >= 0 ? result.slice(comma + 1) : result);
+    };
+    reader.onerror = () => reject(reader.error || new Error("Failed to read PDF"));
+    reader.readAsDataURL(blob);
+  });
+}
+async function captureDashboardPdfAttachment(canvasEl, title) {
+  if (!canvasEl) {
+    throw new Error("Dashboard canvas not found. Close this dialog and try again.");
+  }
+  const shot = await html2canvas(canvasEl, {
+    scale: Math.min(2, window.devicePixelRatio || 1.5),
+    useCORS: true,
+    allowTaint: true,
+    logging: false,
+    backgroundColor: "#ffffff",
+    scrollX: 0,
+    scrollY: -window.scrollY
+  });
+  const imgWidthPx = shot.width;
+  const imgHeightPx = shot.height;
+  if (imgWidthPx < 8 || imgHeightPx < 8) {
+    throw new Error("Could not capture dashboard for PDF");
+  }
+  const orientation = imgWidthPx >= imgHeightPx ? "landscape" : "portrait";
+  const pdf = new jsPDF({ orientation, unit: "pt", format: "a4", compress: true });
+  const pageWidth = pdf.internal.pageSize.getWidth();
+  const pageHeight = pdf.internal.pageSize.getHeight();
+  const margin = 24;
+  const usableWidth = pageWidth - margin * 2;
+  const usableHeight = pageHeight - margin * 2;
+  const scale = usableWidth / imgWidthPx;
+  const pageSliceHeightPx = usableHeight / scale;
+  let yPx = 0;
+  let pageIndex = 0;
+  while (yPx < imgHeightPx - 0.5) {
+    if (pageIndex > 0) pdf.addPage();
+    const sliceHeightPx = Math.min(pageSliceHeightPx, imgHeightPx - yPx);
+    const sliceCanvas = document.createElement("canvas");
+    sliceCanvas.width = imgWidthPx;
+    sliceCanvas.height = Math.max(1, Math.ceil(sliceHeightPx));
+    const ctx = sliceCanvas.getContext("2d");
+    if (!ctx) throw new Error("Could not create PDF page");
+    ctx.fillStyle = "#ffffff";
+    ctx.fillRect(0, 0, sliceCanvas.width, sliceCanvas.height);
+    ctx.drawImage(
+      shot,
+      0,
+      yPx,
+      imgWidthPx,
+      sliceHeightPx,
+      0,
+      0,
+      imgWidthPx,
+      sliceHeightPx
+    );
+    const sliceData = sliceCanvas.toDataURL("image/jpeg", 0.92);
+    const sliceRenderHeight = sliceHeightPx * scale;
+    pdf.addImage(sliceData, "JPEG", margin, margin, usableWidth, sliceRenderHeight);
+    yPx += sliceHeightPx;
+    pageIndex += 1;
+    if (pageIndex > 40) break;
+  }
+  const blob = pdf.output("blob");
+  const contentBase64 = await blobToBase64(blob);
+  return {
+    filename: `${slugifyTitle2(title)}.pdf`,
+    contentType: "application/pdf",
+    contentBase64,
+    byteLength: blob.size
+  };
+}
+
+// src/designer/EmailComposePanel.tsx
+import { jsx as jsx13, jsxs as jsxs13 } from "react/jsx-runtime";
+var MAX_EXTRA_BYTES = 10 * 1024 * 1024;
+function slugify(title) {
+  const s = title.trim().toLowerCase().replace(/[^a-z0-9]+/g, "-").replace(/^-+|-+$/g, "");
+  return s || "dashboard";
+}
+function readFileAsAttachment(file) {
+  return new Promise((resolve, reject) => {
+    if (file.size > MAX_EXTRA_BYTES) {
+      reject(new Error(`File \u201C${file.name}\u201D exceeds 10MB`));
+      return;
+    }
+    const reader = new FileReader();
+    reader.onload = () => {
+      const result = String(reader.result || "");
+      const comma = result.indexOf(",");
+      const contentBase64 = comma >= 0 ? result.slice(comma + 1) : result;
+      resolve({
+        id: crypto.randomUUID(),
+        filename: file.name,
+        contentType: file.type || "application/octet-stream",
+        contentBase64
+      });
+    };
+    reader.onerror = () => reject(reader.error || new Error(`Failed to read ${file.name}`));
+    reader.readAsDataURL(file);
+  });
+}
+function EmailComposePanel({
+  open,
+  onClose,
+  dashboard,
+  api,
+  canvasElementId = "dd-canvas"
+}) {
+  const { t } = useTranslation13();
+  const fileInputId = useId5();
+  const fileInputRef = useRef7(null);
+  const emailOpts = resolveEmailOptions(dashboard.exportOptions);
+  const maxExtra = emailOpts.maxExtraAttachments;
+  const [to, setTo] = useState9("");
+  const [cc, setCc] = useState9("");
+  const [subject, setSubject] = useState9("");
+  const [bodyHtml, setBodyHtml] = useState9("<p><br></p>");
+  const [extraAttachments, setExtraAttachments] = useState9([]);
+  const [configured, setConfigured] = useState9(null);
+  const [sending, setSending] = useState9(false);
+  const [error, setError] = useState9(null);
+  const [success, setSuccess] = useState9(null);
+  const dashboardPdfName = `${slugify(dashboard.title)}.pdf`;
+  const showAttachments = emailOpts.attachPdf || emailOpts.allowExtraAttachments && maxExtra > 0;
+  useEffect10(() => {
+    if (!open) return;
+    setError(null);
+    setSuccess(null);
+    setTo("");
+    setCc("");
+    setSubject(t("emailDefaultSubject", { title: dashboard.title }));
+    setBodyHtml(plainTextToEmailHtml(t("emailDefaultBody", { title: dashboard.title })));
+    setExtraAttachments([]);
+    setConfigured(null);
+    api.emailStatus().then((r) => setConfigured(r.configured)).catch(() => setConfigured(false));
+  }, [open, dashboard.id, dashboard.title, api, t]);
+  if (!open) return null;
+  const addFiles = async (files) => {
+    if (!files?.length || !emailOpts.allowExtraAttachments) return;
+    setError(null);
+    try {
+      const remaining = maxExtra - extraAttachments.length;
+      if (remaining <= 0) {
+        setError(t("emailTooManyAttachments", { count: maxExtra }));
+        return;
+      }
+      const picked = Array.from(files).slice(0, remaining);
+      const loaded = await Promise.all(picked.map(readFileAsAttachment));
+      setExtraAttachments((prev) => [...prev, ...loaded]);
+    } catch (err) {
+      setError(err.message);
+    } finally {
+      if (fileInputRef.current) fileInputRef.current.value = "";
+    }
+  };
+  const removeExtra = (id) => {
+    setExtraAttachments((prev) => prev.filter((a) => a.id !== id));
+  };
+  const send = async () => {
+    setSending(true);
+    setError(null);
+    setSuccess(null);
+    try {
+      let attachment;
+      if (emailOpts.attachPdf) {
+        const canvas = document.getElementById(canvasElementId);
+        const pdf = await captureDashboardPdfAttachment(canvas, dashboard.title);
+        attachment = {
+          filename: pdf.filename,
+          contentType: pdf.contentType,
+          contentBase64: pdf.contentBase64
+        };
+      }
+      const extras = emailOpts.allowExtraAttachments ? extraAttachments.slice(0, maxExtra).map(({ filename, contentType, contentBase64 }) => ({
+        filename,
+        contentType,
+        contentBase64
+      })) : [];
+      const plain = htmlToPlainText(bodyHtml);
+      await api.sendDashboardEmail({
+        to,
+        cc: cc.trim() || void 0,
+        subject,
+        body: plain,
+        bodyHtml,
+        dashboardTitle: dashboard.title,
+        attachment,
+        extraAttachments: extras.length ? extras : void 0
+      });
+      setSuccess(t("emailSent"));
+    } catch (err) {
+      setError(err.message);
+    } finally {
+      setSending(false);
+    }
+  };
+  return /* @__PURE__ */ jsx13("div", { className: "dd-modal-backdrop", role: "presentation", onClick: onClose, children: /* @__PURE__ */ jsxs13(
+    "div",
+    {
+      className: "dd-dialog dd-email-panel",
+      role: "dialog",
+      "aria-modal": "true",
+      "aria-labelledby": "dd-email-title",
+      onClick: (e) => e.stopPropagation(),
+      children: [
+        /* @__PURE__ */ jsxs13("header", { className: "dd-dialog-header", children: [
+          /* @__PURE__ */ jsxs13("h2", { id: "dd-email-title", children: [
+            /* @__PURE__ */ jsx13(Mail, { size: ICON_SIZE, "aria-hidden": true }),
+            " ",
+            t("composeEmail")
+          ] }),
+          /* @__PURE__ */ jsx13(
+            "button",
+            {
+              type: "button",
+              className: "dd-btn dd-btn-ghost dd-btn-icon",
+              onClick: onClose,
+              "aria-label": t("cancel"),
+              children: /* @__PURE__ */ jsx13(X7, { size: ICON_SIZE })
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxs13("div", { className: "dd-dialog-body dd-email-body-wrap", children: [
+          configured === false && /* @__PURE__ */ jsx13("p", { className: "dd-error", role: "alert", children: t("emailNotConfigured") }),
+          /* @__PURE__ */ jsx13("p", { className: "dd-hint", children: t("emailComposeHint") }),
+          /* @__PURE__ */ jsxs13("div", { className: "dd-field", children: [
+            /* @__PURE__ */ jsx13(FieldLabel, { htmlFor: "dd-email-to", help: t("helpEmailTo"), children: t("emailTo") }),
+            /* @__PURE__ */ jsx13(
+              "input",
+              {
+                id: "dd-email-to",
+                className: "dd-input",
+                type: "text",
+                value: to,
+                onChange: (e) => setTo(e.target.value),
+                placeholder: "name@example.com",
+                autoComplete: "email"
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs13("div", { className: "dd-field", children: [
+            /* @__PURE__ */ jsx13(FieldLabel, { htmlFor: "dd-email-cc", help: t("helpEmailCc"), children: t("emailCc") }),
+            /* @__PURE__ */ jsx13(
+              "input",
+              {
+                id: "dd-email-cc",
+                className: "dd-input",
+                type: "text",
+                value: cc,
+                onChange: (e) => setCc(e.target.value),
+                placeholder: "optional",
+                autoComplete: "email"
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs13("div", { className: "dd-field", children: [
+            /* @__PURE__ */ jsx13(FieldLabel, { htmlFor: "dd-email-subject", children: t("emailSubject") }),
+            /* @__PURE__ */ jsx13(
+              "input",
+              {
+                id: "dd-email-subject",
+                className: "dd-input",
+                type: "text",
+                value: subject,
+                onChange: (e) => setSubject(e.target.value)
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs13("div", { className: "dd-field", children: [
+            /* @__PURE__ */ jsx13(FieldLabel, { htmlFor: "dd-email-body", help: t("helpEmailBody"), children: t("emailBody") }),
+            /* @__PURE__ */ jsx13(
+              RichTextEditor,
+              {
+                id: "dd-email-body",
+                valueHtml: bodyHtml,
+                onChange: setBodyHtml,
+                disabled: sending,
+                placeholder: t("emailBodyPlaceholder")
+              }
+            )
+          ] }),
+          showAttachments && /* @__PURE__ */ jsxs13("div", { className: "dd-field dd-email-attachment-field", children: [
+            /* @__PURE__ */ jsx13(FieldLabel, { help: t("helpEmailAttachment"), children: t("emailAttachments") }),
+            /* @__PURE__ */ jsxs13("ul", { className: "dd-email-attach-list", children: [
+              emailOpts.attachPdf && /* @__PURE__ */ jsxs13("li", { className: "dd-email-attachment", children: [
+                /* @__PURE__ */ jsx13(Paperclip, { size: ICON_SIZE, "aria-hidden": true }),
+                /* @__PURE__ */ jsx13("code", { children: dashboardPdfName }),
+                /* @__PURE__ */ jsx13("span", { className: "dd-muted dd-email-attachment-note", children: t("emailAttachmentPdfNote") })
+              ] }),
+              emailOpts.allowExtraAttachments && extraAttachments.map((file) => /* @__PURE__ */ jsxs13("li", { className: "dd-email-attachment", children: [
+                /* @__PURE__ */ jsx13(Paperclip, { size: ICON_SIZE, "aria-hidden": true }),
+                /* @__PURE__ */ jsx13("code", { title: file.filename, children: file.filename }),
+                /* @__PURE__ */ jsx13(
+                  "button",
+                  {
+                    type: "button",
+                    className: "dd-btn dd-btn-ghost dd-btn-icon",
+                    title: t("remove"),
+                    "aria-label": t("remove"),
+                    disabled: sending,
+                    onClick: () => removeExtra(file.id),
+                    children: /* @__PURE__ */ jsx13(Trash23, { size: ICON_SIZE })
+                  }
+                )
+              ] }, file.id))
+            ] }),
+            emailOpts.allowExtraAttachments && maxExtra > 0 && /* @__PURE__ */ jsxs13("div", { className: "dd-email-attach-actions", children: [
+              /* @__PURE__ */ jsx13(
+                "input",
+                {
+                  ref: fileInputRef,
+                  id: fileInputId,
+                  type: "file",
+                  multiple: true,
+                  className: "dd-visually-hidden",
+                  onChange: (e) => void addFiles(e.target.files),
+                  disabled: sending || extraAttachments.length >= maxExtra
+                }
+              ),
+              /* @__PURE__ */ jsxs13(
+                "button",
+                {
+                  type: "button",
+                  className: "dd-btn",
+                  disabled: sending || extraAttachments.length >= maxExtra,
+                  onClick: () => fileInputRef.current?.click(),
+                  children: [
+                    /* @__PURE__ */ jsx13(Plus4, { size: ICON_SIZE }),
+                    t("emailAddAttachment")
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsx13(FieldHelp, { text: t("helpEmailExtraAttachments") })
+            ] })
+          ] }),
+          error && /* @__PURE__ */ jsx13("p", { className: "dd-error", role: "alert", children: error }),
+          success && /* @__PURE__ */ jsx13("p", { className: "dd-status-ok", role: "status", children: success })
+        ] }),
+        /* @__PURE__ */ jsx13("footer", { className: "dd-dialog-footer", children: /* @__PURE__ */ jsxs13("div", { className: "dd-dialog-footer-end", children: [
+          /* @__PURE__ */ jsx13("button", { type: "button", className: "dd-btn", onClick: onClose, disabled: sending, children: t("cancel") }),
+          /* @__PURE__ */ jsxs13(
+            "button",
+            {
+              type: "button",
+              className: "dd-btn dd-btn-primary",
+              onClick: () => void send(),
+              disabled: sending || !to.trim() || !subject.trim() || configured === false,
+              children: [
+                /* @__PURE__ */ jsx13(Mail, { size: ICON_SIZE }),
+                sending ? t("emailSending") : t("sendEmail")
+              ]
+            }
+          )
+        ] }) })
+      ]
+    }
+  ) });
+}
+
+// src/designer/DashboardSettingsPanel.tsx
+import { useEffect as useEffect11, useMemo as useMemo5, useState as useState10 } from "react";
+import { Plus as Plus5, RotateCcw as RotateCcw2, Trash2 as Trash24, X as X8 } from "lucide-react";
+import { useTranslation as useTranslation14 } from "react-i18next";
 import {
   matchThemePreset,
   resolveDashboardTheme as resolveDashboardTheme2,
+  resolveEmailOptions as resolveEmailOptions2,
   resolveExportOptions,
   THEME_PRESETS
 } from "@dashboard-designer/core";
-import { jsx as jsx12, jsxs as jsxs12 } from "react/jsx-runtime";
+import { jsx as jsx14, jsxs as jsxs14 } from "react/jsx-runtime";
 var CURRENCIES = ["USD", "EUR", "GBP", "INR", "JPY", "CAD", "AUD", "MXN"];
 var TIMEZONES = [
   "UTC",
@@ -3559,6 +4222,7 @@ var TIMEZONES = [
 function draftFromDashboard(dashboard) {
   const theme = resolveDashboardTheme2(dashboard.theme);
   const exportOpts = resolveExportOptions(dashboard.exportOptions);
+  const emailOpts = resolveEmailOptions2(dashboard.exportOptions);
   return {
     locale: dashboard.locale || "en",
     currency: dashboard.currency || "USD",
@@ -3567,9 +4231,16 @@ function draftFromDashboard(dashboard) {
     accent: theme.accent,
     chartColors: [...theme.chartColors],
     allowPrint: exportOpts.print,
-    allowPdf: exportOpts.pdf
+    allowPdf: exportOpts.pdf,
+    allowEmail: exportOpts.email,
+    emailAttachPdf: emailOpts.attachPdf,
+    emailAllowExtra: emailOpts.allowExtraAttachments,
+    emailMaxExtra: emailOpts.maxExtraAttachments
   };
 }
+function isDefaultEmailOptions(draft) {
+  return draft.emailAttachPdf && draft.emailAllowExtra && draft.emailMaxExtra === 5;
+}
 function normalizeHex(value, fallback) {
   const v = value.trim();
   if (/^#[0-9a-f]{6}$/i.test(v)) return v.toLowerCase();
@@ -3587,9 +4258,9 @@ function DashboardSettingsPanel({
   onClose,
   onChange
 }) {
-  const { t } = useTranslation12();
-  const [draft, setDraft] = useState9(() => draftFromDashboard(dashboard));
-  useEffect9(() => {
+  const { t } = useTranslation14();
+  const [draft, setDraft] = useState10(() => draftFromDashboard(dashboard));
+  useEffect11(() => {
     if (!open) return;
     setDraft(draftFromDashboard(dashboard));
   }, [
@@ -3632,7 +4303,17 @@ function DashboardSettingsPanel({
       )
     };
     const isDefault = matchThemePreset(theme) === "default";
-    const exportOptions = draft.allowPrint && draft.allowPdf ? void 0 : { print: draft.allowPrint, pdf: draft.allowPdf };
+    const emailOptions = draft.allowEmail && !isDefaultEmailOptions(draft) ? {
+      attachPdf: draft.emailAttachPdf,
+      allowExtraAttachments: draft.emailAllowExtra,
+      maxExtraAttachments: draft.emailMaxExtra
+    } : void 0;
+    const exportOptions = draft.allowPrint && draft.allowPdf && !draft.allowEmail && !emailOptions ? void 0 : {
+      print: draft.allowPrint,
+      pdf: draft.allowPdf,
+      ...draft.allowEmail ? { email: true } : {},
+      ...emailOptions ? { emailOptions } : {}
+    };
     onChange({
       locale: draft.locale,
       currency: draft.currency,
@@ -3643,7 +4324,7 @@ function DashboardSettingsPanel({
     });
     onClose();
   };
-  return /* @__PURE__ */ jsx12("div", { className: "dd-modal-backdrop", role: "presentation", onClick: onClose, children: /* @__PURE__ */ jsxs12(
+  return /* @__PURE__ */ jsx14("div", { className: "dd-modal-backdrop", role: "presentation", onClick: onClose, children: /* @__PURE__ */ jsxs14(
     "div",
     {
       className: "dd-dialog dd-settings-panel",
@@ -3652,25 +4333,25 @@ function DashboardSettingsPanel({
       "aria-labelledby": "dd-settings-title",
       onClick: (e) => e.stopPropagation(),
       children: [
-        /* @__PURE__ */ jsxs12("header", { className: "dd-dialog-header", children: [
-          /* @__PURE__ */ jsx12("h2", { id: "dd-settings-title", children: t("dashboardSettings") }),
-          /* @__PURE__ */ jsx12(
+        /* @__PURE__ */ jsxs14("header", { className: "dd-dialog-header", children: [
+          /* @__PURE__ */ jsx14("h2", { id: "dd-settings-title", children: t("dashboardSettings") }),
+          /* @__PURE__ */ jsx14(
             "button",
             {
               type: "button",
               className: "dd-btn dd-btn-ghost dd-btn-icon",
               onClick: onClose,
               "aria-label": t("cancel"),
-              children: /* @__PURE__ */ jsx12(X7, { size: ICON_SIZE })
+              children: /* @__PURE__ */ jsx14(X8, { size: ICON_SIZE })
             }
           )
         ] }),
-        /* @__PURE__ */ jsxs12("div", { className: "dd-dialog-body", children: [
-          /* @__PURE__ */ jsx12("p", { className: "dd-hint", children: t("dashboardSettingsHint") }),
-          /* @__PURE__ */ jsxs12("div", { className: "dd-settings-grid", children: [
-            /* @__PURE__ */ jsxs12("div", { className: "dd-field", children: [
-              /* @__PURE__ */ jsx12(FieldLabel, { htmlFor: "dd-dash-locale", help: t("helpLocale"), children: t("locale") }),
-              /* @__PURE__ */ jsxs12(
+        /* @__PURE__ */ jsxs14("div", { className: "dd-dialog-body", children: [
+          /* @__PURE__ */ jsx14("p", { className: "dd-hint", children: t("dashboardSettingsHint") }),
+          /* @__PURE__ */ jsxs14("div", { className: "dd-settings-grid", children: [
+            /* @__PURE__ */ jsxs14("div", { className: "dd-field", children: [
+              /* @__PURE__ */ jsx14(FieldLabel, { htmlFor: "dd-dash-locale", help: t("helpLocale"), children: t("locale") }),
+              /* @__PURE__ */ jsxs14(
                 "select",
                 {
                   id: "dd-dash-locale",
@@ -3678,30 +4359,30 @@ function DashboardSettingsPanel({
                   value: draft.locale,
                   onChange: (e) => setDraft((d) => ({ ...d, locale: e.target.value })),
                   children: [
-                    /* @__PURE__ */ jsx12("option", { value: "en", children: "English" }),
-                    /* @__PURE__ */ jsx12("option", { value: "es", children: "Espa\xF1ol" }),
-                    /* @__PURE__ */ jsx12("option", { value: "ar", children: "\u0627\u0644\u0639\u0631\u0628\u064A\u0629 (RTL)" }),
-                    /* @__PURE__ */ jsx12("option", { value: "he", children: "\u05E2\u05D1\u05E8\u05D9\u05EA (RTL)" })
+                    /* @__PURE__ */ jsx14("option", { value: "en", children: "English" }),
+                    /* @__PURE__ */ jsx14("option", { value: "es", children: "Espa\xF1ol" }),
+                    /* @__PURE__ */ jsx14("option", { value: "ar", children: "\u0627\u0644\u0639\u0631\u0628\u064A\u0629 (RTL)" }),
+                    /* @__PURE__ */ jsx14("option", { value: "he", children: "\u05E2\u05D1\u05E8\u05D9\u05EA (RTL)" })
                   ]
                 }
               )
             ] }),
-            /* @__PURE__ */ jsxs12("div", { className: "dd-field", children: [
-              /* @__PURE__ */ jsx12(FieldLabel, { htmlFor: "dd-dash-currency", help: t("helpCurrency"), children: t("currency") }),
-              /* @__PURE__ */ jsx12(
+            /* @__PURE__ */ jsxs14("div", { className: "dd-field", children: [
+              /* @__PURE__ */ jsx14(FieldLabel, { htmlFor: "dd-dash-currency", help: t("helpCurrency"), children: t("currency") }),
+              /* @__PURE__ */ jsx14(
                 "select",
                 {
                   id: "dd-dash-currency",
                   className: "dd-input",
                   value: draft.currency,
                   onChange: (e) => setDraft((d) => ({ ...d, currency: e.target.value })),
-                  children: CURRENCIES.map((c) => /* @__PURE__ */ jsx12("option", { value: c, children: c }, c))
+                  children: CURRENCIES.map((c) => /* @__PURE__ */ jsx14("option", { value: c, children: c }, c))
                 }
               )
             ] }),
-            /* @__PURE__ */ jsxs12("div", { className: "dd-field", children: [
-              /* @__PURE__ */ jsx12(FieldLabel, { htmlFor: "dd-dash-tz", help: t("helpTimeZone"), children: t("timeZone") }),
-              /* @__PURE__ */ jsxs12(
+            /* @__PURE__ */ jsxs14("div", { className: "dd-field", children: [
+              /* @__PURE__ */ jsx14(FieldLabel, { htmlFor: "dd-dash-tz", help: t("helpTimeZone"), children: t("timeZone") }),
+              /* @__PURE__ */ jsxs14(
                 "select",
                 {
                   id: "dd-dash-tz",
@@ -3709,15 +4390,15 @@ function DashboardSettingsPanel({
                   value: draft.timeZone,
                   onChange: (e) => setDraft((d) => ({ ...d, timeZone: e.target.value })),
                   children: [
-                    /* @__PURE__ */ jsx12("option", { value: "", children: t("timeZoneBrowser") }),
-                    TIMEZONES.map((tz) => /* @__PURE__ */ jsx12("option", { value: tz, children: tz }, tz))
+                    /* @__PURE__ */ jsx14("option", { value: "", children: t("timeZoneBrowser") }),
+                    TIMEZONES.map((tz) => /* @__PURE__ */ jsx14("option", { value: tz, children: tz }, tz))
                   ]
                 }
               )
             ] }),
-            /* @__PURE__ */ jsxs12("div", { className: "dd-field", children: [
-              /* @__PURE__ */ jsx12(FieldLabel, { htmlFor: "dd-dash-dir", help: t("helpTextDirection"), children: t("textDirection") }),
-              /* @__PURE__ */ jsxs12(
+            /* @__PURE__ */ jsxs14("div", { className: "dd-field", children: [
+              /* @__PURE__ */ jsx14(FieldLabel, { htmlFor: "dd-dash-dir", help: t("helpTextDirection"), children: t("textDirection") }),
+              /* @__PURE__ */ jsxs14(
                 "select",
                 {
                   id: "dd-dash-dir",
@@ -3725,22 +4406,22 @@ function DashboardSettingsPanel({
                   value: draft.dir,
                   onChange: (e) => setDraft((d) => ({ ...d, dir: e.target.value })),
                   children: [
-                    /* @__PURE__ */ jsx12("option", { value: "", children: t("dirAuto") }),
-                    /* @__PURE__ */ jsx12("option", { value: "ltr", children: "LTR" }),
-                    /* @__PURE__ */ jsx12("option", { value: "rtl", children: "RTL" })
+                    /* @__PURE__ */ jsx14("option", { value: "", children: t("dirAuto") }),
+                    /* @__PURE__ */ jsx14("option", { value: "ltr", children: "LTR" }),
+                    /* @__PURE__ */ jsx14("option", { value: "rtl", children: "RTL" })
                   ]
                 }
               )
             ] })
           ] }),
-          /* @__PURE__ */ jsxs12("div", { className: "dd-theme-section", children: [
-            /* @__PURE__ */ jsx12("div", { className: "dd-theme-section-head", children: /* @__PURE__ */ jsxs12("div", { children: [
-              /* @__PURE__ */ jsx12("h3", { className: "dd-theme-title", children: t("exportOptions") }),
-              /* @__PURE__ */ jsx12("p", { className: "dd-hint dd-theme-hint", children: t("helpExportOptions") })
+          /* @__PURE__ */ jsxs14("div", { className: "dd-theme-section", children: [
+            /* @__PURE__ */ jsx14("div", { className: "dd-theme-section-head", children: /* @__PURE__ */ jsxs14("div", { children: [
+              /* @__PURE__ */ jsx14("h3", { className: "dd-theme-title", children: t("exportOptions") }),
+              /* @__PURE__ */ jsx14("p", { className: "dd-hint dd-theme-hint", children: t("helpExportOptions") })
             ] }) }),
-            /* @__PURE__ */ jsxs12("div", { className: "dd-field dd-check-field", children: [
-              /* @__PURE__ */ jsxs12("label", { className: "dd-check-row", htmlFor: "dd-export-print", children: [
-                /* @__PURE__ */ jsx12(
+            /* @__PURE__ */ jsxs14("div", { className: "dd-field dd-check-field", children: [
+              /* @__PURE__ */ jsxs14("label", { className: "dd-check-row", htmlFor: "dd-export-print", children: [
+                /* @__PURE__ */ jsx14(
                   "input",
                   {
                     id: "dd-export-print",
@@ -3749,13 +4430,13 @@ function DashboardSettingsPanel({
                     onChange: (e) => setDraft((d) => ({ ...d, allowPrint: e.target.checked }))
                   }
                 ),
-                /* @__PURE__ */ jsx12("span", { className: "dd-check-row-text", children: t("allowPrint") })
+                /* @__PURE__ */ jsx14("span", { className: "dd-check-row-text", children: t("allowPrint") })
               ] }),
-              /* @__PURE__ */ jsx12(FieldHelp, { text: t("helpAllowPrint") })
+              /* @__PURE__ */ jsx14(FieldHelp, { text: t("helpAllowPrint") })
             ] }),
-            /* @__PURE__ */ jsxs12("div", { className: "dd-field dd-check-field", children: [
-              /* @__PURE__ */ jsxs12("label", { className: "dd-check-row", htmlFor: "dd-export-pdf", children: [
-                /* @__PURE__ */ jsx12(
+            /* @__PURE__ */ jsxs14("div", { className: "dd-field dd-check-field", children: [
+              /* @__PURE__ */ jsxs14("label", { className: "dd-check-row", htmlFor: "dd-export-pdf", children: [
+                /* @__PURE__ */ jsx14(
                   "input",
                   {
                     id: "dd-export-pdf",
@@ -3764,18 +4445,87 @@ function DashboardSettingsPanel({
                     onChange: (e) => setDraft((d) => ({ ...d, allowPdf: e.target.checked }))
                   }
                 ),
-                /* @__PURE__ */ jsx12("span", { className: "dd-check-row-text", children: t("allowExportPdf") })
+                /* @__PURE__ */ jsx14("span", { className: "dd-check-row-text", children: t("allowExportPdf") })
+              ] }),
+              /* @__PURE__ */ jsx14(FieldHelp, { text: t("helpAllowExportPdf") })
+            ] }),
+            /* @__PURE__ */ jsxs14("div", { className: "dd-field dd-check-field", children: [
+              /* @__PURE__ */ jsxs14("label", { className: "dd-check-row", htmlFor: "dd-export-email", children: [
+                /* @__PURE__ */ jsx14(
+                  "input",
+                  {
+                    id: "dd-export-email",
+                    type: "checkbox",
+                    checked: draft.allowEmail,
+                    onChange: (e) => setDraft((d) => ({ ...d, allowEmail: e.target.checked }))
+                  }
+                ),
+                /* @__PURE__ */ jsx14("span", { className: "dd-check-row-text", children: t("allowEmail") })
+              ] }),
+              /* @__PURE__ */ jsx14(FieldHelp, { text: t("helpAllowEmail") })
+            ] }),
+            draft.allowEmail && /* @__PURE__ */ jsxs14("div", { className: "dd-email-options", children: [
+              /* @__PURE__ */ jsx14("p", { className: "dd-hint dd-email-options-title", children: t("emailAttachmentOptions") }),
+              /* @__PURE__ */ jsxs14("div", { className: "dd-field dd-check-field", children: [
+                /* @__PURE__ */ jsxs14("label", { className: "dd-check-row", htmlFor: "dd-email-attach-pdf", children: [
+                  /* @__PURE__ */ jsx14(
+                    "input",
+                    {
+                      id: "dd-email-attach-pdf",
+                      type: "checkbox",
+                      checked: draft.emailAttachPdf,
+                      onChange: (e) => setDraft((d) => ({ ...d, emailAttachPdf: e.target.checked }))
+                    }
+                  ),
+                  /* @__PURE__ */ jsx14("span", { className: "dd-check-row-text", children: t("emailAttachPdf") })
+                ] }),
+                /* @__PURE__ */ jsx14(FieldHelp, { text: t("helpEmailAttachPdf") })
+              ] }),
+              /* @__PURE__ */ jsxs14("div", { className: "dd-field dd-check-field", children: [
+                /* @__PURE__ */ jsxs14("label", { className: "dd-check-row", htmlFor: "dd-email-allow-extra", children: [
+                  /* @__PURE__ */ jsx14(
+                    "input",
+                    {
+                      id: "dd-email-allow-extra",
+                      type: "checkbox",
+                      checked: draft.emailAllowExtra,
+                      onChange: (e) => setDraft((d) => ({ ...d, emailAllowExtra: e.target.checked }))
+                    }
+                  ),
+                  /* @__PURE__ */ jsx14("span", { className: "dd-check-row-text", children: t("emailAllowExtraAttachments") })
+                ] }),
+                /* @__PURE__ */ jsx14(FieldHelp, { text: t("helpEmailAllowExtraAttachments") })
               ] }),
-              /* @__PURE__ */ jsx12(FieldHelp, { text: t("helpAllowExportPdf") })
+              draft.emailAllowExtra && /* @__PURE__ */ jsxs14("div", { className: "dd-field", children: [
+                /* @__PURE__ */ jsx14(FieldLabel, { htmlFor: "dd-email-max-extra", help: t("helpEmailMaxExtraAttachments"), children: t("emailMaxExtraAttachments") }),
+                /* @__PURE__ */ jsx14(
+                  "input",
+                  {
+                    id: "dd-email-max-extra",
+                    className: "dd-input",
+                    type: "number",
+                    min: 0,
+                    max: 10,
+                    value: draft.emailMaxExtra,
+                    onChange: (e) => {
+                      const n = Number(e.target.value);
+                      setDraft((d) => ({
+                        ...d,
+                        emailMaxExtra: Number.isFinite(n) ? Math.max(0, Math.min(10, Math.floor(n))) : 5
+                      }));
+                    }
+                  }
+                )
+              ] })
             ] })
           ] }),
-          /* @__PURE__ */ jsxs12("div", { className: "dd-theme-section", children: [
-            /* @__PURE__ */ jsxs12("div", { className: "dd-theme-section-head", children: [
-              /* @__PURE__ */ jsxs12("div", { children: [
-                /* @__PURE__ */ jsx12("h3", { className: "dd-theme-title", children: t("themeColors") }),
-                /* @__PURE__ */ jsx12("p", { className: "dd-hint dd-theme-hint", children: t("helpThemeColors") })
+          /* @__PURE__ */ jsxs14("div", { className: "dd-theme-section", children: [
+            /* @__PURE__ */ jsxs14("div", { className: "dd-theme-section-head", children: [
+              /* @__PURE__ */ jsxs14("div", { children: [
+                /* @__PURE__ */ jsx14("h3", { className: "dd-theme-title", children: t("themeColors") }),
+                /* @__PURE__ */ jsx14("p", { className: "dd-hint dd-theme-hint", children: t("helpThemeColors") })
               ] }),
-              /* @__PURE__ */ jsxs12(
+              /* @__PURE__ */ jsxs14(
                 "button",
                 {
                   type: "button",
@@ -3783,15 +4533,15 @@ function DashboardSettingsPanel({
                   onClick: resetTheme,
                   title: t("resetTheme"),
                   children: [
-                    /* @__PURE__ */ jsx12(RotateCcw2, { size: ICON_SIZE }),
+                    /* @__PURE__ */ jsx14(RotateCcw2, { size: ICON_SIZE }),
                     t("resetTheme")
                   ]
                 }
               )
             ] }),
-            /* @__PURE__ */ jsxs12("div", { className: "dd-field", children: [
-              /* @__PURE__ */ jsx12(FieldLabel, { htmlFor: "dd-theme-preset", help: t("helpThemePreset"), children: t("themePreset") }),
-              /* @__PURE__ */ jsxs12(
+            /* @__PURE__ */ jsxs14("div", { className: "dd-field", children: [
+              /* @__PURE__ */ jsx14(FieldLabel, { htmlFor: "dd-theme-preset", help: t("helpThemePreset"), children: t("themePreset") }),
+              /* @__PURE__ */ jsxs14(
                 "select",
                 {
                   id: "dd-theme-preset",
@@ -3802,19 +4552,19 @@ function DashboardSettingsPanel({
                     applyPreset(e.target.value);
                   },
                   children: [
-                    /* @__PURE__ */ jsx12("option", { value: "default", children: t("themePresetDefault") }),
-                    /* @__PURE__ */ jsx12("option", { value: "ocean", children: t("themePresetOcean") }),
-                    /* @__PURE__ */ jsx12("option", { value: "sunset", children: t("themePresetSunset") }),
-                    /* @__PURE__ */ jsx12("option", { value: "slate", children: t("themePresetSlate") }),
-                    /* @__PURE__ */ jsx12("option", { value: "custom", disabled: presetId !== "custom", children: t("themePresetCustom") })
+                    /* @__PURE__ */ jsx14("option", { value: "default", children: t("themePresetDefault") }),
+                    /* @__PURE__ */ jsx14("option", { value: "ocean", children: t("themePresetOcean") }),
+                    /* @__PURE__ */ jsx14("option", { value: "sunset", children: t("themePresetSunset") }),
+                    /* @__PURE__ */ jsx14("option", { value: "slate", children: t("themePresetSlate") }),
+                    /* @__PURE__ */ jsx14("option", { value: "custom", disabled: presetId !== "custom", children: t("themePresetCustom") })
                   ]
                 }
               )
             ] }),
-            /* @__PURE__ */ jsxs12("div", { className: "dd-field", children: [
-              /* @__PURE__ */ jsx12(FieldLabel, { htmlFor: "dd-theme-accent", help: t("helpThemeAccent"), children: t("themeAccent") }),
-              /* @__PURE__ */ jsxs12("div", { className: "dd-color-row", children: [
-                /* @__PURE__ */ jsx12(
+            /* @__PURE__ */ jsxs14("div", { className: "dd-field", children: [
+              /* @__PURE__ */ jsx14(FieldLabel, { htmlFor: "dd-theme-accent", help: t("helpThemeAccent"), children: t("themeAccent") }),
+              /* @__PURE__ */ jsxs14("div", { className: "dd-color-row", children: [
+                /* @__PURE__ */ jsx14(
                   "input",
                   {
                     id: "dd-theme-accent",
@@ -3825,7 +4575,7 @@ function DashboardSettingsPanel({
                     "aria-label": t("themeAccent")
                   }
                 ),
-                /* @__PURE__ */ jsx12(
+                /* @__PURE__ */ jsx14(
                   "input",
                   {
                     className: "dd-input dd-color-hex",
@@ -3836,10 +4586,10 @@ function DashboardSettingsPanel({
                 )
               ] })
             ] }),
-            /* @__PURE__ */ jsxs12("div", { className: "dd-field", children: [
-              /* @__PURE__ */ jsx12(FieldLabel, { help: t("helpThemeChartColors"), children: t("themeChartColors") }),
-              /* @__PURE__ */ jsx12("div", { className: "dd-chart-color-list", children: draft.chartColors.map((color, index) => /* @__PURE__ */ jsxs12("div", { className: "dd-color-row", children: [
-                /* @__PURE__ */ jsx12(
+            /* @__PURE__ */ jsxs14("div", { className: "dd-field", children: [
+              /* @__PURE__ */ jsx14(FieldLabel, { help: t("helpThemeChartColors"), children: t("themeChartColors") }),
+              /* @__PURE__ */ jsx14("div", { className: "dd-chart-color-list", children: draft.chartColors.map((color, index) => /* @__PURE__ */ jsxs14("div", { className: "dd-color-row", children: [
+                /* @__PURE__ */ jsx14(
                   "input",
                   {
                     type: "color",
@@ -3856,7 +4606,7 @@ function DashboardSettingsPanel({
                     "aria-label": t("themeChartColorN", { n: index + 1 })
                   }
                 ),
-                /* @__PURE__ */ jsx12(
+                /* @__PURE__ */ jsx14(
                   "input",
                   {
                     className: "dd-input dd-color-hex",
@@ -3869,7 +4619,7 @@ function DashboardSettingsPanel({
                     spellCheck: false
                   }
                 ),
-                /* @__PURE__ */ jsx12(
+                /* @__PURE__ */ jsx14(
                   "button",
                   {
                     type: "button",
@@ -3881,11 +4631,11 @@ function DashboardSettingsPanel({
                       ...d,
                       chartColors: d.chartColors.filter((_, i) => i !== index)
                     })),
-                    children: /* @__PURE__ */ jsx12(Trash23, { size: ICON_SIZE })
+                    children: /* @__PURE__ */ jsx14(Trash24, { size: ICON_SIZE })
                   }
                 )
               ] }, index)) }),
-              /* @__PURE__ */ jsxs12(
+              /* @__PURE__ */ jsxs14(
                 "button",
                 {
                   type: "button",
@@ -3898,12 +4648,12 @@ function DashboardSettingsPanel({
                     ]
                   })),
                   children: [
-                    /* @__PURE__ */ jsx12(Plus4, { size: ICON_SIZE }),
+                    /* @__PURE__ */ jsx14(Plus5, { size: ICON_SIZE }),
                     t("addColor")
                   ]
                 }
               ),
-              /* @__PURE__ */ jsx12("div", { className: "dd-theme-preview", "aria-hidden": true, children: draft.chartColors.map((c, i) => /* @__PURE__ */ jsx12(
+              /* @__PURE__ */ jsx14("div", { className: "dd-theme-preview", "aria-hidden": true, children: draft.chartColors.map((c, i) => /* @__PURE__ */ jsx14(
                 "span",
                 {
                   className: "dd-theme-preview-chip",
@@ -3914,9 +4664,9 @@ function DashboardSettingsPanel({
             ] })
           ] })
         ] }),
-        /* @__PURE__ */ jsxs12("footer", { className: "dd-dialog-footer dd-dialog-footer-end", children: [
-          /* @__PURE__ */ jsx12("button", { type: "button", className: "dd-btn", onClick: onClose, children: t("cancel") }),
-          /* @__PURE__ */ jsx12("button", { type: "button", className: "dd-btn dd-btn-primary", onClick: apply, children: t("apply") })
+        /* @__PURE__ */ jsxs14("footer", { className: "dd-dialog-footer dd-dialog-footer-end", children: [
+          /* @__PURE__ */ jsx14("button", { type: "button", className: "dd-btn", onClick: onClose, children: t("cancel") }),
+          /* @__PURE__ */ jsx14("button", { type: "button", className: "dd-btn dd-btn-primary", onClick: apply, children: t("apply") })
         ] })
       ]
     }
@@ -3924,7 +4674,7 @@ function DashboardSettingsPanel({
 }
 
 // src/designer/useDashboardHistory.ts
-import { useCallback, useEffect as useEffect10, useRef as useRef6, useState as useState10 } from "react";
+import { useCallback, useEffect as useEffect12, useRef as useRef8, useState as useState11 } from "react";
 var MAX_HISTORY = 50;
 function cloneDashboard(dashboard) {
   return structuredClone(dashboard);
@@ -3933,22 +4683,22 @@ function dashboardsEqual(a, b) {
   return JSON.stringify(a) === JSON.stringify(b);
 }
 function useDashboardHistory(initial, onChange, readOnly = false) {
-  const [dashboard, setDashboard] = useState10(() => cloneDashboard(initial));
-  const [past, setPast] = useState10([]);
-  const [future, setFuture] = useState10([]);
-  const [baseline, setBaseline] = useState10(() => cloneDashboard(initial));
-  const presentRef = useRef6(dashboard);
-  const pastRef = useRef6(past);
-  const futureRef = useRef6(future);
-  const baselineRef = useRef6(baseline);
-  const skipNextExternalSync = useRef6(false);
-  const layoutBeforeRef = useRef6(null);
-  const suppressLayoutWriteRef = useRef6(false);
+  const [dashboard, setDashboard] = useState11(() => cloneDashboard(initial));
+  const [past, setPast] = useState11([]);
+  const [future, setFuture] = useState11([]);
+  const [baseline, setBaseline] = useState11(() => cloneDashboard(initial));
+  const presentRef = useRef8(dashboard);
+  const pastRef = useRef8(past);
+  const futureRef = useRef8(future);
+  const baselineRef = useRef8(baseline);
+  const skipNextExternalSync = useRef8(false);
+  const layoutBeforeRef = useRef8(null);
+  const suppressLayoutWriteRef = useRef8(false);
   presentRef.current = dashboard;
   pastRef.current = past;
   futureRef.current = future;
   baselineRef.current = baseline;
-  useEffect10(() => {
+  useEffect12(() => {
     if (skipNextExternalSync.current) {
       skipNextExternalSync.current = false;
       return;
@@ -3970,7 +4720,7 @@ function useDashboardHistory(initial, onChange, readOnly = false) {
       setDashboard(next);
     }
   }, [initial]);
-  useEffect10(() => {
+  useEffect12(() => {
     if (readOnly) return;
     setBaseline(cloneDashboard(presentRef.current));
     pastRef.current = [];
@@ -3978,7 +4728,7 @@ function useDashboardHistory(initial, onChange, readOnly = false) {
     setPast([]);
     setFuture([]);
   }, [readOnly]);
-  useEffect10(() => {
+  useEffect12(() => {
     if (!suppressLayoutWriteRef.current) return;
     let inner = 0;
     const outer = requestAnimationFrame(() => {
@@ -4131,9 +4881,7 @@ function useDashboardHistory(initial, onChange, readOnly = false) {
 }
 
 // src/designer/DashboardDesigner.tsx
-import "react-grid-layout/css/styles.css";
-import "react-resizable/css/styles.css";
-import { Fragment as Fragment5, jsx as jsx13, jsxs as jsxs13 } from "react/jsx-runtime";
+import { Fragment as Fragment5, jsx as jsx15, jsxs as jsxs15 } from "react/jsx-runtime";
 function listboxFilterField(widget) {
   const override = widget.chartOptions.filterField;
   if (typeof override === "string" && override.trim()) return override.trim();
@@ -4189,25 +4937,25 @@ function WidgetCard({
   listboxSelection,
   onListboxSelectionChange
 }) {
-  const { t } = useTranslation13();
+  const { t } = useTranslation15();
   const { data, error, loading } = useWidgetData(api, widget, globalFilters, refreshKey);
   const TypeIcon = chartTypeIcon[widget.type];
   const stopDrag = (e) => {
     e.stopPropagation();
   };
-  return /* @__PURE__ */ jsxs13("div", { className: `dd-widget ${selected ? "selected" : ""}`, onClick: onSelect, role: "presentation", children: [
-    /* @__PURE__ */ jsxs13("div", { className: "dd-widget-header", children: [
-      /* @__PURE__ */ jsxs13("div", { className: readOnly ? "dd-widget-title-wrap" : "dd-widget-drag", children: [
-        !readOnly && /* @__PURE__ */ jsx13("span", { className: "dd-widget-drag-grip", "aria-hidden": true }),
-        /* @__PURE__ */ jsx13("span", { className: "dd-widget-title", children: widget.title })
+  return /* @__PURE__ */ jsxs15("div", { className: `dd-widget ${selected ? "selected" : ""}`, onClick: onSelect, role: "presentation", children: [
+    /* @__PURE__ */ jsxs15("div", { className: "dd-widget-header", children: [
+      /* @__PURE__ */ jsxs15("div", { className: readOnly ? "dd-widget-title-wrap" : "dd-widget-drag", children: [
+        !readOnly && /* @__PURE__ */ jsx15("span", { className: "dd-widget-drag-grip", "aria-hidden": true }),
+        /* @__PURE__ */ jsx15("span", { className: "dd-widget-title", children: widget.title })
       ] }),
-      /* @__PURE__ */ jsxs13("div", { className: "dd-widget-header-actions", children: [
-        /* @__PURE__ */ jsxs13("span", { className: "dd-badge", title: widget.type, children: [
-          /* @__PURE__ */ jsx13(TypeIcon, { size: 12, strokeWidth: 2.25, "aria-hidden": true }),
+      /* @__PURE__ */ jsxs15("div", { className: "dd-widget-header-actions", children: [
+        /* @__PURE__ */ jsxs15("span", { className: "dd-badge", title: widget.type, children: [
+          /* @__PURE__ */ jsx15(TypeIcon, { size: 12, strokeWidth: 2.25, "aria-hidden": true }),
           widget.type
         ] }),
-        !readOnly && /* @__PURE__ */ jsxs13(Fragment5, { children: [
-          /* @__PURE__ */ jsx13(
+        !readOnly && /* @__PURE__ */ jsxs15(Fragment5, { children: [
+          /* @__PURE__ */ jsx15(
             "button",
             {
               type: "button",
@@ -4221,10 +4969,10 @@ function WidgetCard({
                 e.stopPropagation();
                 onEdit();
               },
-              children: /* @__PURE__ */ jsx13(Pencil, { size: ICON_SIZE })
+              children: /* @__PURE__ */ jsx15(Pencil, { size: ICON_SIZE })
             }
           ),
-          /* @__PURE__ */ jsx13(
+          /* @__PURE__ */ jsx15(
             "button",
             {
               type: "button",
@@ -4238,13 +4986,13 @@ function WidgetCard({
                 e.stopPropagation();
                 onDelete();
               },
-              children: /* @__PURE__ */ jsx13(Trash24, { size: ICON_SIZE })
+              children: /* @__PURE__ */ jsx15(Trash25, { size: ICON_SIZE })
             }
           )
         ] })
       ] })
     ] }),
-    /* @__PURE__ */ jsxs13(
+    /* @__PURE__ */ jsxs15(
       "div",
       {
         className: "dd-widget-body",
@@ -4254,8 +5002,8 @@ function WidgetCard({
           onEdit();
         },
         children: [
-          error && /* @__PURE__ */ jsx13("div", { className: "dd-error", children: error }),
-          !error && /* @__PURE__ */ jsx13(
+          error && /* @__PURE__ */ jsx15("div", { className: "dd-error", children: error }),
+          !error && /* @__PURE__ */ jsx15(
             ChartRenderer,
             {
               widget,
@@ -4286,7 +5034,7 @@ function DashboardDesigner({
   onToggleEdit
 }) {
   ensureI18n(locale);
-  const { t, i18n: i18n2 } = useTranslation13();
+  const { t, i18n: i18n2 } = useTranslation15();
   const api = useMemo6(() => new DashboardApiClient(apiBaseUrl, auth), [apiBaseUrl, auth]);
   const seed = useMemo6(() => initial ?? createEmptyDashboard(), [initial]);
   const {
@@ -4306,19 +5054,19 @@ function DashboardDesigner({
     canRedo,
     canReset
   } = useDashboardHistory(seed, onChange, readOnly);
-  const [editingTitle, setEditingTitle] = useState11(false);
-  const [historyOpen, setHistoryOpen] = useState11(false);
-  const [filtersPanel, setFiltersPanel] = useState11(DEFAULT_FILTERS_PANEL);
-  const titleInputRef = React11.useRef(null);
-  const titleFocusSnapshot = React11.useRef(null);
-  useEffect11(() => {
+  const [editingTitle, setEditingTitle] = useState12(false);
+  const [historyOpen, setHistoryOpen] = useState12(false);
+  const [filtersPanel, setFiltersPanel] = useState12(DEFAULT_FILTERS_PANEL);
+  const titleInputRef = React13.useRef(null);
+  const titleFocusSnapshot = React13.useRef(null);
+  useEffect13(() => {
     if (!editingTitle) return;
     const el = titleInputRef.current;
     if (!el) return;
     el.focus();
     el.select();
   }, [editingTitle]);
-  useEffect11(() => {
+  useEffect13(() => {
     if (readOnly) {
       setEditingTitle(false);
       setHistoryOpen(false);
@@ -4326,18 +5074,19 @@ function DashboardDesigner({
       setSettingsOpen(false);
     }
   }, [readOnly]);
-  const [selectedId, setSelectedId] = useState11(null);
-  const [connections, setConnections] = useState11([]);
-  const [refreshKey, setRefreshKey] = useState11(0);
-  const [width, setWidth] = useState11(900);
-  const [drillTrail, setDrillTrail] = useState11([]);
-  const [modalOpen, setModalOpen] = useState11(false);
-  const [modalMode, setModalMode] = useState11("add");
-  const [editingWidget, setEditingWidget] = useState11(null);
-  const [shareOpen, setShareOpen] = useState11(false);
-  const [settingsOpen, setSettingsOpen] = useState11(false);
-  const [drillError, setDrillError] = useState11(null);
-  const [listboxSelections, setListboxSelections] = useState11({});
+  const [selectedId, setSelectedId] = useState12(null);
+  const [connections, setConnections] = useState12([]);
+  const [refreshKey, setRefreshKey] = useState12(0);
+  const [width, setWidth] = useState12(900);
+  const [drillTrail, setDrillTrail] = useState12([]);
+  const [modalOpen, setModalOpen] = useState12(false);
+  const [modalMode, setModalMode] = useState12("add");
+  const [editingWidget, setEditingWidget] = useState12(null);
+  const [shareOpen, setShareOpen] = useState12(false);
+  const [emailOpen, setEmailOpen] = useState12(false);
+  const [settingsOpen, setSettingsOpen] = useState12(false);
+  const [drillError, setDrillError] = useState12(null);
+  const [listboxSelections, setListboxSelections] = useState12({});
   const effectiveReadOnly = readOnly || drillTrail.length > 0;
   const textDir = resolveDashboardDir(dashboard);
   const effectiveLocale = dashboard.locale || locale;
@@ -4350,7 +5099,7 @@ function DashboardDesigner({
   const handleExportPdf = () => {
     exportDashboardPdf(document.getElementById("dd-canvas"), dashboard.title);
   };
-  useEffect11(() => {
+  useEffect13(() => {
     setListboxSelections({});
   }, [dashboard.id]);
   const effectiveFiltersFor = (widget) => {
@@ -4362,13 +5111,13 @@ function DashboardDesigner({
     const globals = dashboard.globalFilters.filter((f) => !f.id.startsWith("listbox:"));
     return [...globals, ...fromListboxes];
   };
-  useEffect11(() => {
+  useEffect13(() => {
     void i18n2.changeLanguage(effectiveLocale);
   }, [effectiveLocale, i18n2]);
-  useEffect11(() => {
+  useEffect13(() => {
     api.listConnections().then((r) => setConnections(r.connections)).catch(() => setConnections([]));
   }, [api]);
-  useEffect11(() => {
+  useEffect13(() => {
     const el = document.getElementById("dd-canvas");
     if (!el) return;
     const measure = () => {
@@ -4381,7 +5130,7 @@ function DashboardDesigner({
     measure();
     return () => ro.disconnect();
   }, []);
-  useEffect11(() => {
+  useEffect13(() => {
     if (effectiveReadOnly) return;
     const onKeyDown = (e) => {
       const target = e.target;
@@ -4582,16 +5331,16 @@ function DashboardDesigner({
     }
     setRefreshKey((k) => k + 1);
   };
-  return /* @__PURE__ */ jsxs13(
+  return /* @__PURE__ */ jsxs15(
     "div",
     {
       className: `dd-root ${effectiveReadOnly ? "dd-readonly" : ""} ${filtersPanel.open || filtersPanel.collapsed ? "dd-has-filters-side" : ""} ${filtersPanel.collapsed ? "dd-filters-side-is-collapsed" : ""} ${filtersPanel.pinned ? "dd-filters-side-is-pinned" : ""}`,
       dir: textDir,
       style: themeStyle,
       children: [
-        /* @__PURE__ */ jsxs13("header", { className: "dd-toolbar", children: [
-          /* @__PURE__ */ jsxs13("div", { className: "dd-toolbar-left", children: [
-            editingTitle && !effectiveReadOnly ? /* @__PURE__ */ jsx13(
+        /* @__PURE__ */ jsxs15("header", { className: "dd-toolbar", children: [
+          /* @__PURE__ */ jsxs15("div", { className: "dd-toolbar-left", children: [
+            editingTitle && !effectiveReadOnly ? /* @__PURE__ */ jsx15(
               "input",
               {
                 ref: titleInputRef,
@@ -4621,7 +5370,7 @@ function DashboardDesigner({
                   }
                 }
               }
-            ) : /* @__PURE__ */ jsx13(
+            ) : /* @__PURE__ */ jsx15(
               "button",
               {
                 type: "button",
@@ -4635,19 +5384,19 @@ function DashboardDesigner({
                 children: dashboard.title || t("title")
               }
             ),
-            drillTrail.length > 0 && /* @__PURE__ */ jsxs13("span", { className: "dd-drill-crumb dd-muted", children: [
+            drillTrail.length > 0 && /* @__PURE__ */ jsxs15("span", { className: "dd-drill-crumb dd-muted", children: [
               drillTrail.map((f) => f.title).join(" \u203A "),
               " \u203A ",
               dashboard.title
             ] })
           ] }),
-          /* @__PURE__ */ jsxs13("div", { className: "dd-toolbar-right", children: [
-            drillError && /* @__PURE__ */ jsx13("span", { className: "dd-error dd-inline-error", children: drillError }),
-            drillTrail.length > 0 && /* @__PURE__ */ jsxs13("button", { type: "button", className: "dd-btn", onClick: handleDrillBack, children: [
-              /* @__PURE__ */ jsx13(ArrowUpLeft, { size: ICON_SIZE }),
+          /* @__PURE__ */ jsxs15("div", { className: "dd-toolbar-right", children: [
+            drillError && /* @__PURE__ */ jsx15("span", { className: "dd-error dd-inline-error", children: drillError }),
+            drillTrail.length > 0 && /* @__PURE__ */ jsxs15("button", { type: "button", className: "dd-btn", onClick: handleDrillBack, children: [
+              /* @__PURE__ */ jsx15(ArrowUpLeft, { size: ICON_SIZE }),
               t("drillBack")
             ] }),
-            /* @__PURE__ */ jsx13(
+            /* @__PURE__ */ jsx15(
               GlobalFiltersPopover,
               {
                 filters: dashboard.globalFilters,
@@ -4657,8 +5406,8 @@ function DashboardDesigner({
                 onPanelChange: setFiltersPanel
               }
             ),
-            (exportOpts.print || exportOpts.pdf) && /* @__PURE__ */ jsxs13("div", { className: "dd-toolbar-export", role: "group", "aria-label": t("exportOptions"), children: [
-              exportOpts.print && /* @__PURE__ */ jsxs13(
+            (exportOpts.print || exportOpts.pdf || exportOpts.email) && /* @__PURE__ */ jsxs15("div", { className: "dd-toolbar-export", role: "group", "aria-label": t("exportOptions"), children: [
+              exportOpts.print && /* @__PURE__ */ jsxs15(
                 "button",
                 {
                   type: "button",
@@ -4667,12 +5416,12 @@ function DashboardDesigner({
                   "aria-label": t("printDashboard"),
                   onClick: handlePrint,
                   children: [
-                    /* @__PURE__ */ jsx13(Printer, { size: ICON_SIZE }),
+                    /* @__PURE__ */ jsx15(Printer, { size: ICON_SIZE }),
                     t("print")
                   ]
                 }
               ),
-              exportOpts.pdf && /* @__PURE__ */ jsxs13(
+              exportOpts.pdf && /* @__PURE__ */ jsxs15(
                 "button",
                 {
                   type: "button",
@@ -4681,13 +5430,27 @@ function DashboardDesigner({
                   "aria-label": t("exportPdf"),
                   onClick: handleExportPdf,
                   children: [
-                    /* @__PURE__ */ jsx13(FileDown, { size: ICON_SIZE }),
+                    /* @__PURE__ */ jsx15(FileDown, { size: ICON_SIZE }),
                     t("exportPdf")
                   ]
                 }
+              ),
+              exportOpts.email && /* @__PURE__ */ jsxs15(
+                "button",
+                {
+                  type: "button",
+                  className: "dd-btn",
+                  title: t("sendEmail"),
+                  "aria-label": t("sendEmail"),
+                  onClick: () => setEmailOpen(true),
+                  children: [
+                    /* @__PURE__ */ jsx15(Mail2, { size: ICON_SIZE }),
+                    t("emailAction")
+                  ]
+                }
               )
             ] }),
-            onToggleEdit && readOnly && drillTrail.length === 0 && /* @__PURE__ */ jsxs13(
+            onToggleEdit && readOnly && drillTrail.length === 0 && /* @__PURE__ */ jsxs15(
               "button",
               {
                 type: "button",
@@ -4696,13 +5459,13 @@ function DashboardDesigner({
                 "aria-label": t("edit"),
                 onClick: onToggleEdit,
                 children: [
-                  /* @__PURE__ */ jsx13(Pencil, { size: ICON_SIZE }),
+                  /* @__PURE__ */ jsx15(Pencil, { size: ICON_SIZE }),
                   t("edit")
                 ]
               }
             ),
-            !effectiveReadOnly && /* @__PURE__ */ jsxs13(Fragment5, { children: [
-              /* @__PURE__ */ jsxs13(
+            !effectiveReadOnly && /* @__PURE__ */ jsxs15(Fragment5, { children: [
+              /* @__PURE__ */ jsxs15(
                 "button",
                 {
                   type: "button",
@@ -4711,12 +5474,12 @@ function DashboardDesigner({
                   "aria-label": t("shareDashboard"),
                   onClick: () => setShareOpen(true),
                   children: [
-                    /* @__PURE__ */ jsx13(Share2, { size: ICON_SIZE }),
+                    /* @__PURE__ */ jsx15(Share2, { size: ICON_SIZE }),
                     t("share")
                   ]
                 }
               ),
-              /* @__PURE__ */ jsx13(
+              /* @__PURE__ */ jsx15(
                 "button",
                 {
                   type: "button",
@@ -4724,10 +5487,10 @@ function DashboardDesigner({
                   title: t("dashboardSettings"),
                   "aria-label": t("dashboardSettings"),
                   onClick: () => setSettingsOpen(true),
-                  children: /* @__PURE__ */ jsx13(Settings2, { size: ICON_SIZE })
+                  children: /* @__PURE__ */ jsx15(Settings2, { size: ICON_SIZE })
                 }
               ),
-              /* @__PURE__ */ jsxs13(
+              /* @__PURE__ */ jsxs15(
                 "button",
                 {
                   type: "button",
@@ -4736,13 +5499,13 @@ function DashboardDesigner({
                   "aria-label": t("versionHistory"),
                   onClick: () => setHistoryOpen(true),
                   children: [
-                    /* @__PURE__ */ jsx13(History2, { size: ICON_SIZE }),
+                    /* @__PURE__ */ jsx15(History2, { size: ICON_SIZE }),
                     t("history")
                   ]
                 }
               ),
-              /* @__PURE__ */ jsxs13("div", { className: "dd-toolbar-history", role: "group", "aria-label": t("editHistory"), children: [
-                /* @__PURE__ */ jsx13(
+              /* @__PURE__ */ jsxs15("div", { className: "dd-toolbar-history", role: "group", "aria-label": t("editHistory"), children: [
+                /* @__PURE__ */ jsx15(
                   "button",
                   {
                     type: "button",
@@ -4751,10 +5514,10 @@ function DashboardDesigner({
                     "aria-label": t("undo"),
                     disabled: !canUndo,
                     onClick: handleUndo,
-                    children: /* @__PURE__ */ jsx13(Undo2, { size: ICON_SIZE })
+                    children: /* @__PURE__ */ jsx15(Undo2, { size: ICON_SIZE })
                   }
                 ),
-                /* @__PURE__ */ jsx13(
+                /* @__PURE__ */ jsx15(
                   "button",
                   {
                     type: "button",
@@ -4763,10 +5526,10 @@ function DashboardDesigner({
                     "aria-label": t("redo"),
                     disabled: !canRedo,
                     onClick: handleRedo,
-                    children: /* @__PURE__ */ jsx13(Redo2, { size: ICON_SIZE })
+                    children: /* @__PURE__ */ jsx15(Redo2, { size: ICON_SIZE })
                   }
                 ),
-                /* @__PURE__ */ jsx13(
+                /* @__PURE__ */ jsx15(
                   "button",
                   {
                     type: "button",
@@ -4775,23 +5538,23 @@ function DashboardDesigner({
                     "aria-label": t("reset"),
                     disabled: !canReset,
                     onClick: handleReset,
-                    children: /* @__PURE__ */ jsx13(RotateCcw3, { size: ICON_SIZE })
+                    children: /* @__PURE__ */ jsx15(RotateCcw3, { size: ICON_SIZE })
                   }
                 )
               ] }),
-              /* @__PURE__ */ jsxs13("button", { type: "button", className: "dd-btn", onClick: openAddModal, children: [
-                /* @__PURE__ */ jsx13(Plus5, { size: ICON_SIZE }),
+              /* @__PURE__ */ jsxs15("button", { type: "button", className: "dd-btn", onClick: openAddModal, children: [
+                /* @__PURE__ */ jsx15(Plus6, { size: ICON_SIZE }),
                 t("add")
               ] }),
-              /* @__PURE__ */ jsxs13("button", { type: "button", className: "dd-btn dd-btn-primary", onClick: () => void handleSave(), children: [
-                /* @__PURE__ */ jsx13(Save2, { size: ICON_SIZE }),
+              /* @__PURE__ */ jsxs15("button", { type: "button", className: "dd-btn dd-btn-primary", onClick: () => void handleSave(), children: [
+                /* @__PURE__ */ jsx15(Save2, { size: ICON_SIZE }),
                 t("save")
               ] })
             ] })
           ] })
         ] }),
-        /* @__PURE__ */ jsxs13("div", { className: "dd-workspace", children: [
-          /* @__PURE__ */ jsx13(
+        /* @__PURE__ */ jsxs15("div", { className: "dd-workspace", children: [
+          /* @__PURE__ */ jsx15(
             GlobalFiltersSidePanel,
             {
               filters: dashboard.globalFilters,
@@ -4801,15 +5564,15 @@ function DashboardDesigner({
               onPanelChange: setFiltersPanel
             }
           ),
-          /* @__PURE__ */ jsx13("div", { className: "dd-main dd-main-canvas-only", children: /* @__PURE__ */ jsxs13("div", { id: "dd-canvas", className: "dd-canvas", children: [
-            dashboard.widgets.length === 0 && !effectiveReadOnly && /* @__PURE__ */ jsxs13("div", { className: "dd-canvas-empty", children: [
-              /* @__PURE__ */ jsx13("p", { children: t("emptyCanvas") }),
-              /* @__PURE__ */ jsxs13("button", { type: "button", className: "dd-btn dd-btn-primary", onClick: openAddModal, children: [
-                /* @__PURE__ */ jsx13(Plus5, { size: ICON_SIZE }),
+          /* @__PURE__ */ jsx15("div", { className: "dd-main dd-main-canvas-only", children: /* @__PURE__ */ jsxs15("div", { id: "dd-canvas", className: "dd-canvas", children: [
+            dashboard.widgets.length === 0 && !effectiveReadOnly && /* @__PURE__ */ jsxs15("div", { className: "dd-canvas-empty", children: [
+              /* @__PURE__ */ jsx15("p", { children: t("emptyCanvas") }),
+              /* @__PURE__ */ jsxs15("button", { type: "button", className: "dd-btn dd-btn-primary", onClick: openAddModal, children: [
+                /* @__PURE__ */ jsx15(Plus6, { size: ICON_SIZE }),
                 t("addWidget")
               ] })
             ] }),
-            /* @__PURE__ */ jsx13(
+            /* @__PURE__ */ jsx15(
               GridLayout,
               {
                 className: "layout",
@@ -4829,7 +5592,7 @@ function DashboardDesigner({
                 draggableHandle: ".dd-widget-drag",
                 draggableCancel: ".dd-widget-edit, .dd-widget-delete, .dd-widget-header-actions, .dd-chart-fill, .recharts-wrapper, .dd-listbox",
                 compactType: "vertical",
-                children: dashboard.widgets.map((widget) => /* @__PURE__ */ jsx13("div", { children: /* @__PURE__ */ jsx13(
+                children: dashboard.widgets.map((widget) => /* @__PURE__ */ jsx15("div", { children: /* @__PURE__ */ jsx15(
                   WidgetCard,
                   {
                     widget,
@@ -4857,7 +5620,7 @@ function DashboardDesigner({
             )
           ] }) })
         ] }),
-        !effectiveReadOnly && /* @__PURE__ */ jsx13(
+        !effectiveReadOnly && /* @__PURE__ */ jsx15(
           WidgetEditorModal,
           {
             open: modalOpen,
@@ -4875,7 +5638,7 @@ function DashboardDesigner({
             }
           }
         ),
-        /* @__PURE__ */ jsx13(
+        /* @__PURE__ */ jsx15(
           HistoryPanel,
           {
             open: historyOpen && !effectiveReadOnly,
@@ -4892,7 +5655,7 @@ function DashboardDesigner({
             }
           }
         ),
-        /* @__PURE__ */ jsx13(
+        /* @__PURE__ */ jsx15(
           SharePanel,
           {
             open: shareOpen && !effectiveReadOnly,
@@ -4901,7 +5664,16 @@ function DashboardDesigner({
             api
           }
         ),
-        /* @__PURE__ */ jsx13(
+        /* @__PURE__ */ jsx15(
+          EmailComposePanel,
+          {
+            open: emailOpen,
+            onClose: () => setEmailOpen(false),
+            dashboard,
+            api
+          }
+        ),
+        /* @__PURE__ */ jsx15(
           DashboardSettingsPanel,
           {
             open: settingsOpen && !effectiveReadOnly,
@@ -4916,9 +5688,9 @@ function DashboardDesigner({
 }
 
 // src/viewer/DashboardViewer.tsx
-import { jsx as jsx14 } from "react/jsx-runtime";
+import { jsx as jsx16 } from "react/jsx-runtime";
 function DashboardViewer({ dashboard, apiBaseUrl, auth, locale }) {
-  return /* @__PURE__ */ jsx14(
+  return /* @__PURE__ */ jsx16(
     DashboardDesigner,
     {
       dashboard,