@dani-builder/strapi-plugin-builder 1.0.0 → 1.2.0

package/dist/admin/index.mjs

@@ -14,8 +14,14 @@ var __export = (target, all) => {
 };
 
 // admin/src/form.ts
-function savePayload(form) {
+function savePayload(form, includeNotifications = false) {
+  const notifications = structuredClone(form.notifications ?? {});
+  if (notifications.email) {
+    notifications.email.to = notifications.email.to.map((value) => value.trim()).filter(Boolean);
+    notifications.email.cc = notifications.email.cc?.map((value) => value.trim()).filter(Boolean);
+  }
   return {
+    ...includeNotifications ? { notifications } : {},
     slug: form.slug,
     name: form.name,
     targetUid: form.targetUid,
@@ -89,13 +95,19 @@ function formApi(client) {
         params: { targetUid }
       })).data.data;
     },
-    async save(form, id) {
-      const body = { data: savePayload(form) };
+    async save(form, id, includeNotifications = false) {
+      const body = { data: savePayload(form, includeNotifications) };
       return (id ? await client.put(
         `${root}/${encodeURIComponent(id)}`,
         body
       ) : await client.post(root, body)).data.data;
     },
+    async testSend(id, sampleFields) {
+      return (await client.post(
+        `${root}/${encodeURIComponent(id)}/test-send`,
+        { data: sampleFields }
+      )).data.data;
+    },
     async remove(id) {
       await client.del(`${root}/${encodeURIComponent(id)}`);
     },
@@ -124,6 +136,30 @@ function downloadForm(value, slug) {
   anchor.click();
   URL.revokeObjectURL(url);
 }
+function submissionApi(client) {
+  const root2 = "/plugins/builder/submissions";
+  return {
+    async list(params) {
+      return (await client.get(root2, { params })).data;
+    },
+    async get(id) {
+      return (await client.get(
+        `${root2}/${encodeURIComponent(id)}`
+      )).data.data;
+    },
+    async status(id, status) {
+      return (await client.put(
+        `${root2}/${encodeURIComponent(id)}/status`,
+        { data: { status } }
+      )).data.data;
+    },
+    async redeliver(id) {
+      return (await client.post(
+        `${root2}/${encodeURIComponent(id)}/redeliver`
+      )).data.data;
+    }
+  };
+}
 var root;
 var init_api = __esm({
   "admin/src/api.ts"() {
@@ -133,7 +169,22 @@ var init_api = __esm({
   }
 });
 
+// admin/src/submission.ts
+var submissionStatuses;
+var init_submission = __esm({
+  "admin/src/submission.ts"() {
+    "use strict";
+    submissionStatuses = [
+      "received",
+      "reviewing",
+      "responded",
+      "closed"
+    ];
+  }
+});
+
 // admin/src/ui.tsx
+import { useId } from "react";
 import { Box, Flex, Typography } from "@strapi/design-system";
 import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
 function Section({
@@ -151,9 +202,13 @@ function TextField({
   onChange,
   disabled,
   required,
-  multiline
+  multiline,
+  secret,
+  error
 }) {
+  const errorId = useId();
   const props = {
+    "aria-describedby": error ? errorId : void 0,
     value,
     disabled,
     required,
@@ -170,7 +225,16 @@ function TextField({
   };
   return /* @__PURE__ */ jsxs2("label", { style: { display: "grid", gap: 6 }, children: [
     /* @__PURE__ */ jsx2(Typography, { children: label }),
-    multiline ? /* @__PURE__ */ jsx2("textarea", { ...props, rows: 3 }) : /* @__PURE__ */ jsx2("input", { ...props })
+    multiline ? /* @__PURE__ */ jsx2("textarea", { ...props, rows: 3, "aria-invalid": Boolean(error) }) : /* @__PURE__ */ jsx2(
+      "input",
+      {
+        ...props,
+        type: secret ? "password" : "text",
+        autoComplete: secret ? "new-password" : void 0,
+        "aria-invalid": Boolean(error)
+      }
+    ),
+    error && /* @__PURE__ */ jsx2(Typography, { id: errorId, textColor: "danger700", role: "alert", children: error })
   ] });
 }
 function ErrorNotice({ message }) {
@@ -182,19 +246,309 @@ var init_ui = __esm({
   }
 });
 
+// admin/src/submission-page.tsx
+import { useCallback, useEffect, useRef, useState } from "react";
+import {
+  Button,
+  Flex as Flex2,
+  Table,
+  Tbody,
+  Td,
+  Th,
+  Thead,
+  Tr,
+  Typography as Typography2
+} from "@strapi/design-system";
+import { Layouts, Page, useFetchClient, useRBAC } from "@strapi/strapi/admin";
+import { Link } from "react-router-dom";
+import { Fragment, jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+function TargetLink({ row }) {
+  const { allowedActions, isLoading } = useRBAC([
+    {
+      action: "plugin::content-manager.explorer.read",
+      subject: row.targetUid
+    }
+  ]);
+  if (isLoading || !allowedActions.canRead || !row.targetDocumentId)
+    return null;
+  return /* @__PURE__ */ jsx3(
+    Link,
+    {
+      to: `/content-manager/collection-types/${encodeURIComponent(row.targetUid)}/${encodeURIComponent(row.targetDocumentId)}`,
+      children: "Open submitted record"
+    }
+  );
+}
+function SubmissionPage({ canUpdate }) {
+  const client = useFetchClient();
+  const { get } = client;
+  const [slug, setSlug] = useState("");
+  const [formFilter, setFormFilter] = useState("");
+  const [status, setStatus] = useState("");
+  const [page, setPage] = useState(1);
+  const [result, setResult] = useState(null);
+  const [selected, setSelected] = useState(null);
+  const [loading, setLoading] = useState(true);
+  const [busy, setBusy] = useState(false);
+  const [error, setError] = useState("");
+  const lock = useRef(false);
+  const generation = useRef(0);
+  const load = useCallback(async () => {
+    const current = ++generation.current;
+    setLoading(true);
+    setError("");
+    try {
+      const response = (await get("/plugins/builder/submissions", {
+        params: {
+          page,
+          ...formFilter ? { slug: formFilter } : {},
+          ...status ? { status } : {}
+        }
+      })).data;
+      if (current === generation.current) setResult(response);
+    } catch (cause) {
+      if (current === generation.current) setError(errorMessage(cause));
+    } finally {
+      if (current === generation.current) setLoading(false);
+    }
+  }, [get, page, formFilter, status]);
+  useEffect(() => {
+    setSelected(null);
+    void load();
+    return () => {
+      generation.current++;
+    };
+  }, [load]);
+  async function mutate(action) {
+    if (lock.current) return;
+    lock.current = true;
+    setBusy(true);
+    setError("");
+    try {
+      await action();
+    } catch (cause) {
+      setError(errorMessage(cause));
+    } finally {
+      lock.current = false;
+      setBusy(false);
+    }
+  }
+  const api = submissionApi(client);
+  return /* @__PURE__ */ jsxs3(Fragment, { children: [
+    /* @__PURE__ */ jsx3(
+      Layouts.Header,
+      {
+        title: "Builder Submissions",
+        subtitle: "Review receipt metadata, delivery history and processing status."
+      }
+    ),
+    /* @__PURE__ */ jsx3(Layouts.Content, { children: /* @__PURE__ */ jsxs3(Flex2, { direction: "column", alignItems: "stretch", gap: 6, children: [
+      /* @__PURE__ */ jsx3(ErrorNotice, { message: error }),
+      error && /* @__PURE__ */ jsx3(Button, { disabled: loading || busy, onClick: () => void load(), children: "Retry list" }),
+      /* @__PURE__ */ jsx3(Section, { title: "Filters", children: /* @__PURE__ */ jsxs3(Flex2, { gap: 4, wrap: "wrap", alignItems: "end", children: [
+        /* @__PURE__ */ jsx3(
+          TextField,
+          {
+            label: "Form slug",
+            value: slug,
+            onChange: setSlug,
+            disabled: busy
+          }
+        ),
+        /* @__PURE__ */ jsx3(
+          Button,
+          {
+            disabled: busy,
+            onClick: () => {
+              setPage(1);
+              setFormFilter(slug.trim());
+            },
+            children: "Apply form filter"
+          }
+        ),
+        /* @__PURE__ */ jsxs3("label", { children: [
+          "Status",
+          " ",
+          /* @__PURE__ */ jsxs3(
+            "select",
+            {
+              "aria-label": "Filter status",
+              value: status,
+              disabled: busy,
+              onChange: (event) => {
+                setPage(1);
+                setStatus(event.target.value);
+              },
+              children: [
+                /* @__PURE__ */ jsx3("option", { value: "", children: "All statuses" }),
+                submissionStatuses.map((value) => /* @__PURE__ */ jsx3("option", { children: value }, value))
+              ]
+            }
+          )
+        ] })
+      ] }) }),
+      /* @__PURE__ */ jsxs3(Section, { title: "Submissions", children: [
+        loading ? /* @__PURE__ */ jsx3(Page.Loading, {}) : !result?.data.length ? /* @__PURE__ */ jsx3(Typography2, { children: "No submissions found." }) : /* @__PURE__ */ jsxs3(Table, { colCount: 5, rowCount: result.data.length, children: [
+          /* @__PURE__ */ jsx3(Thead, { children: /* @__PURE__ */ jsx3(Tr, { children: [
+            "Form",
+            "Received",
+            "Status",
+            "Deliveries",
+            "Actions"
+          ].map((label) => /* @__PURE__ */ jsx3(Th, { children: /* @__PURE__ */ jsx3(Typography2, { variant: "sigma", children: label }) }, label)) }) }),
+          /* @__PURE__ */ jsx3(Tbody, { children: result.data.map((row) => /* @__PURE__ */ jsxs3(Tr, { children: [
+            /* @__PURE__ */ jsx3(Td, { children: /* @__PURE__ */ jsx3(Typography2, { children: row.form }) }),
+            /* @__PURE__ */ jsx3(Td, { children: /* @__PURE__ */ jsx3(Typography2, { children: row.createdAt }) }),
+            /* @__PURE__ */ jsx3(Td, { children: /* @__PURE__ */ jsx3(Typography2, { children: row.status }) }),
+            /* @__PURE__ */ jsx3(Td, { children: /* @__PURE__ */ jsx3(Flex2, { direction: "column", alignItems: "start", gap: 2, children: row.deliveries.length ? row.deliveries.map((delivery, i) => /* @__PURE__ */ jsxs3(Typography2, { children: [
+              delivery.channel,
+              ": ",
+              delivery.status,
+              " \xB7",
+              " ",
+              delivery.attempts,
+              " attempts \xB7",
+              " ",
+              delivery.sentAt ?? "Not sent"
+            ] }, i)) : /* @__PURE__ */ jsx3(Typography2, { children: "No deliveries recorded" }) }) }),
+            /* @__PURE__ */ jsx3(Td, { children: /* @__PURE__ */ jsxs3(
+              Button,
+              {
+                disabled: busy,
+                onClick: () => void mutate(async () => {
+                  setSelected(await api.get(row.documentId));
+                }),
+                children: [
+                  "View ",
+                  row.documentId
+                ]
+              }
+            ) })
+          ] }, row.documentId)) })
+        ] }),
+        /* @__PURE__ */ jsxs3(Flex2, { gap: 3, children: [
+          /* @__PURE__ */ jsx3(
+            Button,
+            {
+              disabled: busy || loading || page <= 1,
+              onClick: () => setPage(page - 1),
+              children: "Previous"
+            }
+          ),
+          /* @__PURE__ */ jsxs3(Typography2, { children: [
+            "Page ",
+            page,
+            " \xB7 ",
+            result?.meta.pagination.total ?? 0,
+            " submissions"
+          ] }),
+          /* @__PURE__ */ jsx3(
+            Button,
+            {
+              disabled: busy || loading || page >= (result?.meta.pagination.pageCount ?? 0),
+              onClick: () => setPage(page + 1),
+              children: "Next"
+            }
+          )
+        ] })
+      ] }),
+      selected && /* @__PURE__ */ jsxs3(Section, { title: `Submission ${selected.documentId}`, children: [
+        /* @__PURE__ */ jsxs3(Typography2, { children: [
+          selected.form,
+          " \xB7 Received ",
+          selected.createdAt,
+          " \xB7 Updated",
+          " ",
+          selected.updatedAt
+        ] }),
+        /* @__PURE__ */ jsxs3(Typography2, { children: [
+          "Consent ",
+          selected.consentVersion,
+          " \xB7 ",
+          selected.consentAt
+        ] }),
+        /* @__PURE__ */ jsx3(TargetLink, { row: selected }),
+        /* @__PURE__ */ jsxs3("label", { children: [
+          "Processing status",
+          " ",
+          /* @__PURE__ */ jsx3(
+            "select",
+            {
+              "aria-label": "Processing status",
+              value: selected.status,
+              disabled: !canUpdate || busy,
+              onChange: (event) => {
+                const value = submissionStatuses.find(
+                  (value2) => value2 === event.target.value
+                );
+                if (value)
+                  void mutate(async () => {
+                    const updated = await api.status(
+                      selected.documentId,
+                      value
+                    );
+                    await load();
+                    setSelected(updated);
+                  });
+              },
+              children: submissionStatuses.map((value) => /* @__PURE__ */ jsx3("option", { children: value }, value))
+            }
+          )
+        ] }),
+        selected.deliveries.map((delivery, i) => /* @__PURE__ */ jsxs3(Typography2, { children: [
+          delivery.channel,
+          ": ",
+          delivery.status,
+          " \xB7 ",
+          delivery.attempts,
+          " ",
+          "attempts \xB7 Sent: ",
+          delivery.sentAt ?? "Not sent",
+          delivery.lastError ? ` \xB7 ${delivery.lastError}` : ""
+        ] }, i)),
+        /* @__PURE__ */ jsx3(
+          Button,
+          {
+            disabled: !canUpdate || busy || !selected.deliveries.some(
+              (delivery) => delivery.channel !== "afterSave" && delivery.status === "failed"
+            ),
+            onClick: () => void mutate(async () => {
+              await api.redeliver(selected.documentId);
+              const updated = await api.get(selected.documentId);
+              await load();
+              setSelected(updated);
+            }),
+            children: "Retry notifications"
+          }
+        ),
+        !canUpdate && /* @__PURE__ */ jsx3(Typography2, { children: "Read only. Submission update permission is required to change status or retry notifications." })
+      ] })
+    ] }) })
+  ] });
+}
+var init_submission_page = __esm({
+  "admin/src/submission-page.tsx"() {
+    "use strict";
+    init_api();
+    init_form();
+    init_submission();
+    init_ui();
+  }
+});
+
 // admin/src/import-form.tsx
-import { useRef, useState } from "react";
-import { Button, Flex as Flex2, Typography as Typography2 } from "@strapi/design-system";
-import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+import { useRef as useRef2, useState as useState2 } from "react";
+import { Button as Button2, Flex as Flex3, Typography as Typography3 } from "@strapi/design-system";
+import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
 function ImportForm({
   replace,
   disabled,
   onImport
 }) {
-  const [source, setSource] = useState("");
-  const [error, setError] = useState("");
-  const [busy, setBusy] = useState(false);
-  const lock = useRef(false);
+  const [source, setSource] = useState2("");
+  const [error, setError] = useState2("");
+  const [busy, setBusy] = useState2(false);
+  const lock = useRef2(false);
   async function submit() {
     if (lock.current) return;
     lock.current = true;
@@ -209,16 +563,16 @@ function ImportForm({
       setBusy(false);
     }
   }
-  return /* @__PURE__ */ jsxs3(Flex2, { direction: "column", alignItems: "stretch", gap: 3, children: [
-    /* @__PURE__ */ jsxs3(Typography2, { children: [
+  return /* @__PURE__ */ jsxs4(Flex3, { direction: "column", alignItems: "stretch", gap: 3, children: [
+    /* @__PURE__ */ jsxs4(Typography3, { children: [
       replace ? "Replace this saved form with an exported definition. The slug must match. The server increments the form version." : "Import a form export. A new form starts at version 1.",
       " ",
       "Consent version is preserved. Existing slugs cannot be duplicated."
     ] }),
-    /* @__PURE__ */ jsxs3("label", { children: [
+    /* @__PURE__ */ jsxs4("label", { children: [
       "Choose JSON file",
       " ",
-      /* @__PURE__ */ jsx3(
+      /* @__PURE__ */ jsx4(
         "input",
         {
           type: "file",
@@ -233,7 +587,7 @@ function ImportForm({
         }
       )
     ] }),
-    /* @__PURE__ */ jsx3(
+    /* @__PURE__ */ jsx4(
       TextField,
       {
         label: "Form JSON",
@@ -243,9 +597,9 @@ function ImportForm({
         disabled: busy || disabled
       }
     ),
-    /* @__PURE__ */ jsx3(ErrorNotice, { message: error }),
-    /* @__PURE__ */ jsx3(
-      Button,
+    /* @__PURE__ */ jsx4(ErrorNotice, { message: error }),
+    /* @__PURE__ */ jsx4(
+      Button2,
       {
         type: "button",
         disabled: busy || disabled || !source.trim(),
@@ -264,32 +618,32 @@ var init_import_form = __esm({
 });
 
 // admin/src/form-list-page.tsx
-import { useCallback, useEffect, useRef as useRef2, useState as useState2 } from "react";
+import { useCallback as useCallback2, useEffect as useEffect2, useRef as useRef3, useState as useState3 } from "react";
 import {
-  Button as Button2,
-  Flex as Flex3,
-  Table,
-  Tbody,
-  Td,
-  Th,
-  Thead,
-  Tr,
-  Typography as Typography3
+  Button as Button3,
+  Flex as Flex4,
+  Table as Table2,
+  Tbody as Tbody2,
+  Td as Td2,
+  Th as Th2,
+  Thead as Thead2,
+  Tr as Tr2,
+  Typography as Typography4
 } from "@strapi/design-system";
-import { Layouts, Page, useFetchClient } from "@strapi/strapi/admin";
+import { Layouts as Layouts2, Page as Page2, useFetchClient as useFetchClient2 } from "@strapi/strapi/admin";
 import { useNavigate } from "react-router-dom";
-import { Fragment, jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
+import { Fragment as Fragment2, jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
 function FormListPage({ canUpdate }) {
-  const client = useFetchClient();
+  const client = useFetchClient2();
   const { get } = client;
   const navigate = useNavigate();
-  const [rows, setRows] = useState2([]);
-  const [loading, setLoading] = useState2(true);
-  const [error, setError] = useState2("");
-  const [busy, setBusy] = useState2(false);
-  const [removing, setRemoving] = useState2(null);
-  const lock = useRef2(false);
-  const load = useCallback(async () => {
+  const [rows, setRows] = useState3([]);
+  const [loading, setLoading] = useState3(true);
+  const [error, setError] = useState3("");
+  const [busy, setBusy] = useState3(false);
+  const [removing, setRemoving] = useState3(null);
+  const lock = useRef3(false);
+  const load = useCallback2(async () => {
     setLoading(true);
     setError("");
     try {
@@ -302,7 +656,7 @@ function FormListPage({ canUpdate }) {
       setLoading(false);
     }
   }, [get]);
-  useEffect(() => {
+  useEffect2(() => {
     void load();
   }, [load]);
   async function mutate(action) {
@@ -319,14 +673,14 @@ function FormListPage({ canUpdate }) {
       setBusy(false);
     }
   }
-  return /* @__PURE__ */ jsxs4(Fragment, { children: [
-    /* @__PURE__ */ jsx4(
-      Layouts.Header,
+  return /* @__PURE__ */ jsxs5(Fragment2, { children: [
+    /* @__PURE__ */ jsx5(
+      Layouts2.Header,
       {
         title: "Builder Forms",
         subtitle: "Manage public form definitions and consent.",
-        primaryAction: canUpdate ? /* @__PURE__ */ jsx4(
-          Button2,
+        primaryAction: canUpdate ? /* @__PURE__ */ jsx5(
+          Button3,
           {
             disabled: busy,
             onClick: () => navigate("/plugins/builder/forms/new"),
@@ -335,21 +689,21 @@ function FormListPage({ canUpdate }) {
         ) : void 0
       }
     ),
-    /* @__PURE__ */ jsx4(Layouts.Content, { children: /* @__PURE__ */ jsxs4(Flex3, { direction: "column", alignItems: "stretch", gap: 6, children: [
-      /* @__PURE__ */ jsx4(ErrorNotice, { message: error }),
-      error && /* @__PURE__ */ jsx4(Button2, { onClick: () => void load(), disabled: busy || loading, children: "Retry list" }),
-      /* @__PURE__ */ jsx4(Section, { title: "Forms", children: loading ? /* @__PURE__ */ jsx4(Page.Loading, {}) : rows.length === 0 ? /* @__PURE__ */ jsx4(Typography3, { children: "No forms yet." }) : /* @__PURE__ */ jsxs4(Table, { colCount: 5, rowCount: rows.length, children: [
-        /* @__PURE__ */ jsx4(Thead, { children: /* @__PURE__ */ jsx4(Tr, { children: ["Name", "Slug", "Target", "Version", "Actions"].map(
-          (name) => /* @__PURE__ */ jsx4(Th, { children: /* @__PURE__ */ jsx4(Typography3, { variant: "sigma", children: name }) }, name)
+    /* @__PURE__ */ jsx5(Layouts2.Content, { children: /* @__PURE__ */ jsxs5(Flex4, { direction: "column", alignItems: "stretch", gap: 6, children: [
+      /* @__PURE__ */ jsx5(ErrorNotice, { message: error }),
+      error && /* @__PURE__ */ jsx5(Button3, { onClick: () => void load(), disabled: busy || loading, children: "Retry list" }),
+      /* @__PURE__ */ jsx5(Section, { title: "Forms", children: loading ? /* @__PURE__ */ jsx5(Page2.Loading, {}) : rows.length === 0 ? /* @__PURE__ */ jsx5(Typography4, { children: "No forms yet." }) : /* @__PURE__ */ jsxs5(Table2, { colCount: 5, rowCount: rows.length, children: [
+        /* @__PURE__ */ jsx5(Thead2, { children: /* @__PURE__ */ jsx5(Tr2, { children: ["Name", "Slug", "Target", "Version", "Actions"].map(
+          (name) => /* @__PURE__ */ jsx5(Th2, { children: /* @__PURE__ */ jsx5(Typography4, { variant: "sigma", children: name }) }, name)
         ) }) }),
-        /* @__PURE__ */ jsx4(Tbody, { children: rows.map((row) => /* @__PURE__ */ jsxs4(Tr, { children: [
-          /* @__PURE__ */ jsx4(Td, { children: /* @__PURE__ */ jsx4(Typography3, { children: row.name }) }),
-          /* @__PURE__ */ jsx4(Td, { children: /* @__PURE__ */ jsx4(Typography3, { children: row.slug }) }),
-          /* @__PURE__ */ jsx4(Td, { children: /* @__PURE__ */ jsx4(Typography3, { children: row.targetUid }) }),
-          /* @__PURE__ */ jsx4(Td, { children: /* @__PURE__ */ jsx4(Typography3, { children: row.version }) }),
-          /* @__PURE__ */ jsx4(Td, { children: /* @__PURE__ */ jsxs4(Flex3, { gap: 2, children: [
-            /* @__PURE__ */ jsxs4(
-              Button2,
+        /* @__PURE__ */ jsx5(Tbody2, { children: rows.map((row) => /* @__PURE__ */ jsxs5(Tr2, { children: [
+          /* @__PURE__ */ jsx5(Td2, { children: /* @__PURE__ */ jsx5(Typography4, { children: row.name }) }),
+          /* @__PURE__ */ jsx5(Td2, { children: /* @__PURE__ */ jsx5(Typography4, { children: row.slug }) }),
+          /* @__PURE__ */ jsx5(Td2, { children: /* @__PURE__ */ jsx5(Typography4, { children: row.targetUid }) }),
+          /* @__PURE__ */ jsx5(Td2, { children: /* @__PURE__ */ jsx5(Typography4, { children: row.version }) }),
+          /* @__PURE__ */ jsx5(Td2, { children: /* @__PURE__ */ jsxs5(Flex4, { gap: 2, children: [
+            /* @__PURE__ */ jsxs5(
+              Button3,
               {
                 variant: "secondary",
                 disabled: busy,
@@ -363,8 +717,8 @@ function FormListPage({ canUpdate }) {
                 ]
               }
             ),
-            /* @__PURE__ */ jsx4(
-              Button2,
+            /* @__PURE__ */ jsx5(
+              Button3,
               {
                 variant: "tertiary",
                 disabled: busy,
@@ -377,8 +731,8 @@ function FormListPage({ canUpdate }) {
                 children: "Export"
               }
             ),
-            canUpdate && /* @__PURE__ */ jsx4(
-              Button2,
+            canUpdate && /* @__PURE__ */ jsx5(
+              Button3,
               {
                 variant: "danger-light",
                 disabled: busy,
@@ -389,11 +743,11 @@ function FormListPage({ canUpdate }) {
           ] }) })
         ] }, row.documentId)) })
       ] }) }),
-      removing && /* @__PURE__ */ jsxs4(Section, { title: `Delete ${removing.name}?`, children: [
-        /* @__PURE__ */ jsx4(Typography3, { children: "This permanently deletes the form definition. Forms with submissions cannot be deleted." }),
-        /* @__PURE__ */ jsxs4(Flex3, { gap: 3, children: [
-          /* @__PURE__ */ jsx4(
-            Button2,
+      removing && /* @__PURE__ */ jsxs5(Section, { title: `Delete ${removing.name}?`, children: [
+        /* @__PURE__ */ jsx5(Typography4, { children: "This permanently deletes the form definition. Forms with submissions cannot be deleted." }),
+        /* @__PURE__ */ jsxs5(Flex4, { gap: 3, children: [
+          /* @__PURE__ */ jsx5(
+            Button3,
             {
               variant: "danger",
               disabled: busy,
@@ -405,8 +759,8 @@ function FormListPage({ canUpdate }) {
               children: "Confirm delete"
             }
           ),
-          /* @__PURE__ */ jsx4(
-            Button2,
+          /* @__PURE__ */ jsx5(
+            Button3,
             {
               variant: "secondary",
               disabled: busy,
@@ -416,7 +770,7 @@ function FormListPage({ canUpdate }) {
           )
         ] })
       ] }),
-      canUpdate && /* @__PURE__ */ jsx4(Section, { title: "Import form", children: /* @__PURE__ */ jsx4(
+      canUpdate && /* @__PURE__ */ jsx5(Section, { title: "Import form", children: /* @__PURE__ */ jsx5(
         ImportForm,
         {
           disabled: busy,
@@ -448,8 +802,8 @@ var init_form_list_page = __esm({
 });
 
 // admin/src/field-editor.tsx
-import { Button as Button3, Flex as Flex4, Typography as Typography4 } from "@strapi/design-system";
-import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
+import { Button as Button4, Flex as Flex5, Typography as Typography5 } from "@strapi/design-system";
+import { jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
 function FieldEditor({
   fields,
   schema,
@@ -459,10 +813,10 @@ function FieldEditor({
   function update(index, field) {
     onChange(fields.map((item, at) => at === index ? field : item));
   }
-  return /* @__PURE__ */ jsxs5(Section, { title: "Fields", children: [
-    /* @__PURE__ */ jsx5(Typography4, { children: "Select target fields, then adjust their order and presentation. Required target fields cannot be removed or made optional. Hidden fields remain part of submission validation." }),
-    /* @__PURE__ */ jsx5(Flex4, { wrap: "wrap", gap: 4, children: schema.map((item) => /* @__PURE__ */ jsxs5("label", { children: [
-      /* @__PURE__ */ jsx5(
+  return /* @__PURE__ */ jsxs6(Section, { title: "Fields", children: [
+    /* @__PURE__ */ jsx6(Typography5, { children: "Select target fields, then adjust their order and presentation. Required target fields cannot be removed or made optional. Hidden fields remain part of submission validation." }),
+    /* @__PURE__ */ jsx6(Flex5, { wrap: "wrap", gap: 4, children: schema.map((item) => /* @__PURE__ */ jsxs6("label", { children: [
+      /* @__PURE__ */ jsx6(
         "input",
         {
           type: "checkbox",
@@ -479,14 +833,14 @@ function FieldEditor({
     ] }, item.name)) }),
     fields.map((field, index) => {
       const attribute = schema.find((item) => item.name === field.name);
-      return /* @__PURE__ */ jsxs5(
+      return /* @__PURE__ */ jsxs6(
         Section,
         {
           title: `${index + 1}. ${field.name} (${field.type})`,
           children: [
-            /* @__PURE__ */ jsxs5(Flex4, { gap: 3, children: [
-              /* @__PURE__ */ jsxs5(
-                Button3,
+            /* @__PURE__ */ jsxs6(Flex5, { gap: 3, children: [
+              /* @__PURE__ */ jsxs6(
+                Button4,
                 {
                   type: "button",
                   variant: "secondary",
@@ -499,8 +853,8 @@ function FieldEditor({
                   ]
                 }
               ),
-              /* @__PURE__ */ jsxs5(
-                Button3,
+              /* @__PURE__ */ jsxs6(
+                Button4,
                 {
                   type: "button",
                   variant: "secondary",
@@ -514,7 +868,7 @@ function FieldEditor({
                 }
               )
             ] }),
-            /* @__PURE__ */ jsx5(
+            /* @__PURE__ */ jsx6(
               TextField,
               {
                 label: "Label",
@@ -524,7 +878,7 @@ function FieldEditor({
                 onChange: (label) => update(index, { ...field, label })
               }
             ),
-            /* @__PURE__ */ jsx5(
+            /* @__PURE__ */ jsx6(
               TextField,
               {
                 label: "Placeholder",
@@ -533,7 +887,7 @@ function FieldEditor({
                 onChange: (placeholder) => update(index, { ...field, placeholder })
               }
             ),
-            /* @__PURE__ */ jsx5(
+            /* @__PURE__ */ jsx6(
               TextField,
               {
                 label: "Help text",
@@ -542,8 +896,8 @@ function FieldEditor({
                 onChange: (help) => update(index, { ...field, help })
               }
             ),
-            /* @__PURE__ */ jsxs5("label", { children: [
-              /* @__PURE__ */ jsx5(
+            /* @__PURE__ */ jsxs6("label", { children: [
+              /* @__PURE__ */ jsx6(
                 "input",
                 {
                   type: "checkbox",
@@ -562,8 +916,8 @@ function FieldEditor({
               "Required",
               attribute?.required ? " (required by target schema)" : ""
             ] }),
-            /* @__PURE__ */ jsxs5("label", { children: [
-              /* @__PURE__ */ jsx5(
+            /* @__PURE__ */ jsxs6("label", { children: [
+              /* @__PURE__ */ jsx6(
                 "input",
                 {
                   type: "checkbox",
@@ -578,7 +932,7 @@ function FieldEditor({
               " ",
               "Hidden from form"
             ] }),
-            (field.maxLength !== void 0 || field.min !== void 0 || field.max !== void 0) && /* @__PURE__ */ jsxs5(Typography4, { variant: "pi", children: [
+            (field.maxLength !== void 0 || field.min !== void 0 || field.max !== void 0) && /* @__PURE__ */ jsxs6(Typography5, { variant: "pi", children: [
               "Constraints:",
               " ",
               JSON.stringify({
@@ -587,7 +941,7 @@ function FieldEditor({
                 max: field.max
               })
             ] }),
-            field.options?.map((option, optionIndex) => /* @__PURE__ */ jsx5(
+            field.options?.map((option, optionIndex) => /* @__PURE__ */ jsx6(
               TextField,
               {
                 label: `Option label: ${option.value}`,
@@ -618,32 +972,537 @@ var init_field_editor = __esm({
   }
 });
 
+// admin/src/notifications.ts
+function placeholders(fields) {
+  return [
+    ...fields.map((field) => `field.${field.name}`),
+    "form.name",
+    "submission.id",
+    "submission.receivedAt"
+  ];
+}
+function templateError(value, fields) {
+  const allowed = placeholders(fields);
+  let invalid = false;
+  const rest = value.replace(/{{\s*([^{}]+?)\s*}}/g, (_, key) => {
+    if (!allowed.includes(key)) invalid = true;
+    return "";
+  });
+  return invalid || rest.includes("{{") || rest.includes("}}") ? "Use only the available placeholders." : "";
+}
+function notificationErrors(config, fields) {
+  const errors = {};
+  if (config.email) {
+    if (config.email.replyToField && !fields.some(
+      (field) => field.type === "email" && field.name === config.email?.replyToField
+    ))
+      errors.replyToField = "Choose an email field in this form, or None.";
+    for (const key of ["subject", "body"]) {
+      const error = templateError(config.email[key], fields);
+      if (error) errors[key] = error;
+    }
+    for (const key of ["to", "cc"]) {
+      if (config.email[key]?.some((value) => /[{}]/.test(value)))
+        errors[key] = "Recipients must be fixed email addresses; placeholders are not allowed.";
+    }
+  }
+  if (config.webhook) {
+    try {
+      const url = new URL(config.webhook.url);
+      if (!["http:", "https:"].includes(url.protocol) || url.username || url.password)
+        throw Error("url");
+    } catch {
+      errors.url = "Enter an HTTP or HTTPS URL without credentials.";
+    }
+  }
+  return errors;
+}
+function samplePayload(fields, values) {
+  return Object.fromEntries(
+    fields.flatMap((field) => {
+      const value = values[field.name] ?? "";
+      if (!value && !field.required) return [];
+      return [
+        [
+          field.name,
+          value && ["integer", "decimal"].includes(field.type) ? Number(value) : value && field.type === "boolean" ? value === "true" : value
+        ]
+      ];
+    })
+  );
+}
+function sampleErrors(error) {
+  const response = error && typeof error === "object" && "response" in error ? error.response : void 0;
+  const details = response?.data?.error?.details?.errors;
+  if (!Array.isArray(details)) return {};
+  return Object.fromEntries(
+    details.flatMap((entry) => {
+      if (!entry || typeof entry !== "object" || !("field" in entry) || !("code" in entry) || typeof entry.field !== "string" || typeof entry.code !== "string")
+        return [];
+      return [[entry.field, entry.code]];
+    })
+  );
+}
+var init_notifications = __esm({
+  "admin/src/notifications.ts"() {
+    "use strict";
+  }
+});
+
+// admin/src/notification-editor.tsx
+import { useState as useState4 } from "react";
+import { Button as Button5, Flex as Flex6, Typography as Typography6 } from "@strapi/design-system";
+import { Fragment as Fragment3, jsx as jsx7, jsxs as jsxs7 } from "react/jsx-runtime";
+function NotificationEditor({
+  value,
+  fields,
+  opened,
+  onOpen,
+  onChange,
+  disabled,
+  saveError
+}) {
+  const [target, setTarget] = useState4("body");
+  const errors = notificationErrors(value, fields);
+  function toggle(channel, enabled) {
+    const next = { ...value };
+    if (!enabled) delete next[channel];
+    else if (channel === "email")
+      next.email = {
+        to: [],
+        cc: [],
+        subject: "New submission: {{form.name}}",
+        body: "Submission {{submission.id}} received at {{submission.receivedAt}}"
+      };
+    else next.webhook = { url: "" };
+    onChange(next);
+  }
+  return /* @__PURE__ */ jsxs7(Section, { title: "Notifications", children: [
+    /* @__PURE__ */ jsx7(
+      Button5,
+      {
+        type: "button",
+        variant: "tertiary",
+        onClick: onOpen,
+        disabled: opened,
+        children: opened ? "Notification settings opened" : "Open notification settings"
+      }
+    ),
+    opened && /* @__PURE__ */ jsxs7(Fragment3, { children: [
+      /* @__PURE__ */ jsx7(Typography6, { variant: "pi", children: "Enable a channel to send notifications. Changes take effect after saving the form." }),
+      saveError.startsWith("notifications:") && /* @__PURE__ */ jsx7(ErrorNotice, { message: saveError }),
+      /* @__PURE__ */ jsxs7("label", { children: [
+        /* @__PURE__ */ jsx7(
+          "input",
+          {
+            type: "checkbox",
+            disabled,
+            checked: Boolean(value.email),
+            onChange: (event) => toggle("email", event.target.checked)
+          }
+        ),
+        " ",
+        "Email notifications"
+      ] }),
+      value.email && /* @__PURE__ */ jsxs7(Fragment3, { children: [
+        ["to", "cc"].map((key) => /* @__PURE__ */ jsx7(
+          TextField,
+          {
+            label: key === "to" ? "To (one address per line)" : "Cc (one address per line)",
+            multiline: true,
+            value: (value.email?.[key] ?? []).join("\n"),
+            disabled,
+            error: errors[key],
+            onChange: (text) => onChange({
+              ...value,
+              email: { ...value.email, [key]: text.split("\n") }
+            })
+          },
+          key
+        )),
+        /* @__PURE__ */ jsx7(Typography6, { variant: "pi", children: "Use fixed email addresses. Empty lines are ignored when saving." }),
+        /* @__PURE__ */ jsxs7("label", { children: [
+          "Reply-to field",
+          /* @__PURE__ */ jsxs7(
+            "select",
+            {
+              style: { width: "100%", padding: 10 },
+              disabled,
+              value: value.email.replyToField ?? "",
+              "aria-invalid": Boolean(errors.replyToField),
+              onChange: (event) => {
+                const email = { ...value.email };
+                delete email.replyToField;
+                if (event.target.value)
+                  email.replyToField = event.target.value;
+                onChange({ ...value, email });
+              },
+              children: [
+                /* @__PURE__ */ jsx7("option", { value: "", children: "None" }),
+                fields.filter((field) => field.type === "email").map((field) => /* @__PURE__ */ jsxs7("option", { value: field.name, children: [
+                  field.label,
+                  " (",
+                  field.name,
+                  ")"
+                ] }, field.name))
+              ]
+            }
+          )
+        ] }),
+        errors.replyToField && /* @__PURE__ */ jsx7(ErrorNotice, { message: errors.replyToField }),
+        /* @__PURE__ */ jsx7(
+          TextField,
+          {
+            label: "Email subject",
+            value: value.email.subject,
+            disabled,
+            error: errors.subject,
+            onChange: (subject) => onChange({ ...value, email: { ...value.email, subject } })
+          }
+        ),
+        /* @__PURE__ */ jsx7(
+          TextField,
+          {
+            label: "Email body",
+            multiline: true,
+            value: value.email.body,
+            disabled,
+            error: errors.body,
+            onChange: (body) => onChange({ ...value, email: { ...value.email, body } })
+          }
+        ),
+        /* @__PURE__ */ jsxs7("label", { children: [
+          "Insert placeholder into",
+          /* @__PURE__ */ jsxs7(
+            "select",
+            {
+              style: { width: "100%", padding: 10 },
+              disabled,
+              value: target,
+              onChange: (event) => setTarget(
+                event.target.value === "subject" ? "subject" : "body"
+              ),
+              children: [
+                /* @__PURE__ */ jsx7("option", { value: "subject", children: "Subject" }),
+                /* @__PURE__ */ jsx7("option", { value: "body", children: "Body" })
+              ]
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsx7(Flex6, { gap: 2, wrap: "wrap", children: placeholders(fields).map((key) => /* @__PURE__ */ jsx7(
+          Button5,
+          {
+            type: "button",
+            style: {
+              maxWidth: "100%",
+              height: "auto",
+              whiteSpace: "normal",
+              overflowWrap: "anywhere"
+            },
+            size: "S",
+            variant: "tertiary",
+            disabled,
+            onClick: () => onChange({
+              ...value,
+              email: {
+                ...value.email,
+                [target]: `${value.email[target]}{{${key}}}`
+              }
+            }),
+            children: `{{${key}}}`
+          },
+          key
+        )) })
+      ] }),
+      /* @__PURE__ */ jsxs7("label", { children: [
+        /* @__PURE__ */ jsx7(
+          "input",
+          {
+            type: "checkbox",
+            disabled,
+            checked: Boolean(value.webhook),
+            onChange: (event) => toggle("webhook", event.target.checked)
+          }
+        ),
+        " ",
+        "Webhook notifications"
+      ] }),
+      value.webhook && /* @__PURE__ */ jsxs7(Fragment3, { children: [
+        /* @__PURE__ */ jsx7(
+          TextField,
+          {
+            label: "Webhook URL",
+            value: value.webhook.url,
+            disabled,
+            error: errors.url,
+            onChange: (url) => onChange({ ...value, webhook: { ...value.webhook, url } })
+          }
+        ),
+        /* @__PURE__ */ jsx7(
+          TextField,
+          {
+            label: "Webhook secret",
+            secret: true,
+            value: value.webhook.secret ?? "",
+            disabled,
+            onChange: (secret) => {
+              const webhook = { ...value.webhook };
+              delete webhook.secret;
+              if (secret) webhook.secret = secret;
+              onChange({ ...value, webhook });
+            }
+          }
+        ),
+        /* @__PURE__ */ jsx7(Typography6, { variant: "pi", children: "Stored secrets and header values appear as ********. Leave them untouched to preserve them, or enter a replacement. Clear a secret or remove a header to delete it." }),
+        Object.entries(value.webhook.headers ?? {}).map(
+          ([name, header]) => /* @__PURE__ */ jsxs7(
+            Flex6,
+            {
+              direction: "column",
+              alignItems: "stretch",
+              gap: 2,
+              children: [
+                /* @__PURE__ */ jsx7(
+                  TextField,
+                  {
+                    label: `Header: ${name}`,
+                    secret: true,
+                    value: header,
+                    disabled,
+                    onChange: (next) => onChange({
+                      ...value,
+                      webhook: {
+                        ...value.webhook,
+                        headers: {
+                          ...value.webhook.headers,
+                          [name]: next
+                        }
+                      }
+                    })
+                  }
+                ),
+                /* @__PURE__ */ jsxs7(
+                  Button5,
+                  {
+                    type: "button",
+                    variant: "tertiary",
+                    disabled,
+                    onClick: () => {
+                      const headers = { ...value.webhook.headers };
+                      delete headers[name];
+                      onChange({
+                        ...value,
+                        webhook: { ...value.webhook, headers }
+                      });
+                    },
+                    children: [
+                      "Remove ",
+                      name
+                    ]
+                  }
+                )
+              ]
+            },
+            name
+          )
+        ),
+        /* @__PURE__ */ jsx7(
+          AddHeader,
+          {
+            disabled,
+            names: Object.keys(value.webhook.headers ?? {}),
+            onAdd: (name, header) => onChange({
+              ...value,
+              webhook: {
+                ...value.webhook,
+                headers: { ...value.webhook.headers, [name]: header }
+              }
+            })
+          }
+        )
+      ] })
+    ] })
+  ] });
+}
+function AddHeader({
+  disabled,
+  names,
+  onAdd
+}) {
+  const [name, setName] = useState4("");
+  const [value, setValue] = useState4("");
+  return /* @__PURE__ */ jsxs7(Fragment3, { children: [
+    /* @__PURE__ */ jsx7(
+      TextField,
+      {
+        label: "New header name",
+        value: name,
+        disabled,
+        onChange: setName
+      }
+    ),
+    /* @__PURE__ */ jsx7(
+      TextField,
+      {
+        label: "New header value",
+        secret: true,
+        value,
+        disabled,
+        onChange: setValue
+      }
+    ),
+    /* @__PURE__ */ jsx7(
+      Button5,
+      {
+        type: "button",
+        variant: "tertiary",
+        disabled: disabled || !name.trim() || !value || names.some((item) => item.toLowerCase() === name.trim().toLowerCase()),
+        onClick: () => {
+          onAdd(name.trim(), value);
+          setName("");
+          setValue("");
+        },
+        children: "Add header"
+      }
+    )
+  ] });
+}
+function NotificationTest({
+  fields,
+  disabled,
+  send
+}) {
+  const [values, setValues] = useState4({});
+  const [results, setResults] = useState4(null);
+  const [error, setError] = useState4("");
+  const [errors, setErrors] = useState4({});
+  const [busy, setBusy] = useState4(false);
+  return /* @__PURE__ */ jsxs7(Section, { title: "Test notifications", children: [
+    /* @__PURE__ */ jsx7(Typography6, { variant: "pi", children: "Sends real notifications using the saved settings and these sample values, including hidden fields. Save all changes before testing. No submission record is created." }),
+    disabled && /* @__PURE__ */ jsx7(Typography6, { variant: "pi", children: "Testing requires a saved form, no unsaved changes and forms.update permission." }),
+    fields.map((field) => /* @__PURE__ */ jsx7("div", { style: { display: "grid", gap: 6 }, children: field.type === "boolean" ? /* @__PURE__ */ jsxs7("label", { children: [
+      /* @__PURE__ */ jsxs7(Typography6, { children: [
+        field.label,
+        " (",
+        field.name,
+        ")",
+        field.visibility === "hidden" ? " \xB7 hidden" : ""
+      ] }),
+      /* @__PURE__ */ jsxs7(
+        "select",
+        {
+          disabled: disabled || busy,
+          value: values[field.name] ?? "",
+          onChange: (event) => setValues({ ...values, [field.name]: event.target.value }),
+          children: [
+            /* @__PURE__ */ jsx7("option", { value: "", children: "Choose a value" }),
+            /* @__PURE__ */ jsx7("option", { value: "true", children: "True" }),
+            /* @__PURE__ */ jsx7("option", { value: "false", children: "False" })
+          ]
+        }
+      ),
+      errors[field.name] && /* @__PURE__ */ jsx7(ErrorNotice, { message: errors[field.name] ?? "" })
+    ] }) : /* @__PURE__ */ jsx7(
+      TextField,
+      {
+        label: `${field.label} (${field.name})${field.visibility === "hidden" ? " \xB7 hidden" : ""}`,
+        value: values[field.name] ?? "",
+        disabled: disabled || busy,
+        error: errors[field.name],
+        onChange: (next) => setValues({ ...values, [field.name]: next })
+      }
+    ) }, field.name)),
+    /* @__PURE__ */ jsx7(
+      Button5,
+      {
+        type: "button",
+        disabled: disabled || busy,
+        onClick: async () => {
+          setBusy(true);
+          setError("");
+          setErrors({});
+          setResults(null);
+          try {
+            setResults(await send(samplePayload(fields, values)));
+          } catch (cause) {
+            setError(errorMessage(cause));
+            setErrors(sampleErrors(cause));
+          } finally {
+            setBusy(false);
+          }
+        },
+        children: busy ? "Sending test\u2026" : "Send test notifications"
+      }
+    ),
+    /* @__PURE__ */ jsx7(ErrorNotice, { message: error }),
+    /* @__PURE__ */ jsxs7("div", { "aria-live": "polite", children: [
+      results?.length === 0 && /* @__PURE__ */ jsx7(Typography6, { children: "No notification channels are enabled in the saved settings." }),
+      results?.map((delivery) => /* @__PURE__ */ jsx7(
+        "div",
+        {
+          style: { overflowWrap: "anywhere", marginTop: 12 },
+          children: /* @__PURE__ */ jsxs7(
+            Typography6,
+            {
+              textColor: delivery.status === "sent" ? "success700" : "danger700",
+              children: [
+                delivery.channel,
+                ":",
+                " ",
+                delivery.status === "sent" ? "Success" : "Failed",
+                " \xB7",
+                " ",
+                delivery.attempts,
+                " attempt(s)",
+                delivery.lastError ? ` \xB7 ${delivery.lastError}` : "",
+                delivery.sentAt ? ` \xB7 ${delivery.sentAt}` : ""
+              ]
+            }
+          )
+        },
+        delivery.channel
+      ))
+    ] })
+  ] });
+}
+var init_notification_editor = __esm({
+  "admin/src/notification-editor.tsx"() {
+    "use strict";
+    init_form();
+    init_notifications();
+    init_ui();
+  }
+});
+
 // admin/src/form-editor-page.tsx
-import { useEffect as useEffect2, useRef as useRef3, useState as useState3 } from "react";
-import { Button as Button4, Flex as Flex5, Typography as Typography5 } from "@strapi/design-system";
-import { Layouts as Layouts2, Page as Page2, useFetchClient as useFetchClient2 } from "@strapi/strapi/admin";
+import { useEffect as useEffect3, useRef as useRef4, useState as useState5 } from "react";
+import { Button as Button6, Flex as Flex7, Typography as Typography7 } from "@strapi/design-system";
+import { Layouts as Layouts3, Page as Page3, useFetchClient as useFetchClient3 } from "@strapi/strapi/admin";
 import { useNavigate as useNavigate2, useParams } from "react-router-dom";
-import { Fragment as Fragment2, jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
+import { Fragment as Fragment4, jsx as jsx8, jsxs as jsxs8 } from "react/jsx-runtime";
 function FormEditorPage({ canUpdate }) {
   const { documentId } = useParams();
-  const client = useFetchClient2();
+  const client = useFetchClient3();
   const { get } = client;
   const navigate = useNavigate2();
-  const [draft, setDraft] = useState3(emptyForm);
-  const [version, setVersion] = useState3(null);
-  const [targets, setTargets] = useState3([]);
-  const [schema, setSchema] = useState3([]);
-  const [loading, setLoading] = useState3(true);
-  const [fieldsLoading, setFieldsLoading] = useState3(false);
-  const [error, setError] = useState3("");
-  const [loaded, setLoaded] = useState3(false);
-  const [busy, setBusy] = useState3(false);
-  const [retry, setRetry] = useState3(0);
-  const lock = useRef3(false);
-  const targetRequest = useRef3(0);
-  useEffect2(() => {
+  const [draft, setDraft] = useState5(emptyForm);
+  const [notificationsOpened, setNotificationsOpened] = useState5(false);
+  const [savedDraft, setSavedDraft] = useState5("");
+  const [version, setVersion] = useState5(null);
+  const [targets, setTargets] = useState5([]);
+  const [schema, setSchema] = useState5([]);
+  const [loading, setLoading] = useState5(true);
+  const [fieldsLoading, setFieldsLoading] = useState5(false);
+  const [error, setError] = useState5("");
+  const [loaded, setLoaded] = useState5(false);
+  const [busy, setBusy] = useState5(false);
+  const [retry, setRetry] = useState5(0);
+  const lock = useRef4(false);
+  const targetRequest = useRef4(0);
+  useEffect3(() => {
     let active = true;
     setLoading(true);
+    setNotificationsOpened(false);
     setLoaded(false);
     setError("");
     async function load() {
@@ -663,6 +1522,7 @@ function FormEditorPage({ canUpdate }) {
             consent: { ...emptyForm.consent }
           }
         );
+        setSavedDraft(saved ? JSON.stringify(savePayload(saved, true)) : "");
         setVersion(saved?.version ?? null);
         setSchema(attrs);
         setLoaded(true);
@@ -712,16 +1572,16 @@ function FormEditorPage({ canUpdate }) {
       setBusy(false);
     }
   }
-  if (loading) return /* @__PURE__ */ jsx6(Page2.Loading, {});
+  if (loading) return /* @__PURE__ */ jsx8(Page3.Loading, {});
   const disabled = !canUpdate || busy || fieldsLoading;
-  return /* @__PURE__ */ jsxs6(Fragment2, { children: [
-    /* @__PURE__ */ jsx6(
-      Layouts2.Header,
+  return /* @__PURE__ */ jsxs8(Fragment4, { children: [
+    /* @__PURE__ */ jsx8(
+      Layouts3.Header,
       {
         title: documentId ? draft.name || "Form" : "Create form",
         subtitle: version ? `Form version ${version} \xB7 assigned by server on every save` : "New forms start at version 1.",
-        navigationAction: /* @__PURE__ */ jsx6(
-          Button4,
+        navigationAction: /* @__PURE__ */ jsx8(
+          Button6,
           {
             variant: "tertiary",
             onClick: () => navigate("/plugins/builder/forms"),
@@ -730,18 +1590,23 @@ function FormEditorPage({ canUpdate }) {
         )
       }
     ),
-    /* @__PURE__ */ jsx6(Layouts2.Content, { children: /* @__PURE__ */ jsxs6(Flex5, { direction: "column", alignItems: "stretch", gap: 6, children: [
-      /* @__PURE__ */ jsx6(ErrorNotice, { message: error }),
-      !loaded ? /* @__PURE__ */ jsx6(Button4, { onClick: () => setRetry((value) => value + 1), children: "Retry loading form" }) : /* @__PURE__ */ jsxs6(Fragment2, { children: [
-        /* @__PURE__ */ jsx6(
+    /* @__PURE__ */ jsx8(Layouts3.Content, { children: /* @__PURE__ */ jsxs8(Flex7, { direction: "column", alignItems: "stretch", gap: 6, children: [
+      /* @__PURE__ */ jsx8(ErrorNotice, { message: error }),
+      !loaded ? /* @__PURE__ */ jsx8(Button6, { onClick: () => setRetry((value) => value + 1), children: "Retry loading form" }) : /* @__PURE__ */ jsxs8(Fragment4, { children: [
+        /* @__PURE__ */ jsx8(
           "form",
           {
             onSubmit: (event) => {
               event.preventDefault();
               if (disabled) return;
               void run(async () => {
-                const saved = await formApi(client).save(draft, documentId);
+                const saved = await formApi(client).save(
+                  draft,
+                  documentId,
+                  notificationsOpened
+                );
                 setDraft(saved);
+                setSavedDraft(JSON.stringify(savePayload(saved, true)));
                 setVersion(saved.version);
                 if (!documentId)
                   navigate(`/plugins/builder/forms/${saved.documentId}`, {
@@ -749,9 +1614,9 @@ function FormEditorPage({ canUpdate }) {
                   });
               });
             },
-            children: /* @__PURE__ */ jsxs6(Flex5, { direction: "column", alignItems: "stretch", gap: 6, children: [
-              /* @__PURE__ */ jsxs6(Section, { title: "Definition", children: [
-                /* @__PURE__ */ jsx6(
+            children: /* @__PURE__ */ jsxs8(Flex7, { direction: "column", alignItems: "stretch", gap: 6, children: [
+              /* @__PURE__ */ jsxs8(Section, { title: "Definition", children: [
+                /* @__PURE__ */ jsx8(
                   TextField,
                   {
                     label: "Name",
@@ -761,7 +1626,7 @@ function FormEditorPage({ canUpdate }) {
                     onChange: (name) => setDraft({ ...draft, name })
                   }
                 ),
-                /* @__PURE__ */ jsx6(
+                /* @__PURE__ */ jsx8(
                   TextField,
                   {
                     label: "Slug",
@@ -771,11 +1636,11 @@ function FormEditorPage({ canUpdate }) {
                     onChange: (slug) => setDraft({ ...draft, slug })
                   }
                 ),
-                /* @__PURE__ */ jsx6(Typography5, { variant: "pi", children: "Use lowercase letters, numbers and hyphens. The slug cannot change after creation." }),
-                /* @__PURE__ */ jsxs6("label", { children: [
+                /* @__PURE__ */ jsx8(Typography7, { variant: "pi", children: "Use lowercase letters, numbers and hyphens. The slug cannot change after creation." }),
+                /* @__PURE__ */ jsxs8("label", { children: [
                   "Target content type",
                   " ",
-                  /* @__PURE__ */ jsxs6(
+                  /* @__PURE__ */ jsxs8(
                     "select",
                     {
                       required: true,
@@ -784,8 +1649,8 @@ function FormEditorPage({ canUpdate }) {
                       onChange: (event) => void selectTarget(event.target.value),
                       style: { padding: 10, width: "100%" },
                       children: [
-                        /* @__PURE__ */ jsx6("option", { value: "", children: "Select a target" }),
-                        targets.map((target) => /* @__PURE__ */ jsxs6("option", { value: target.uid, children: [
+                        /* @__PURE__ */ jsx8("option", { value: "", children: "Select a target" }),
+                        targets.map((target) => /* @__PURE__ */ jsxs8("option", { value: target.uid, children: [
                           target.name,
                           " \u2014 ",
                           target.uid
@@ -794,9 +1659,9 @@ function FormEditorPage({ canUpdate }) {
                     }
                   )
                 ] }),
-                fieldsLoading && /* @__PURE__ */ jsx6(Typography5, { children: "Loading target fields\u2026" })
+                fieldsLoading && /* @__PURE__ */ jsx8(Typography7, { children: "Loading target fields\u2026" })
               ] }),
-              /* @__PURE__ */ jsx6(
+              /* @__PURE__ */ jsx8(
                 FieldEditor,
                 {
                   fields: draft.fields,
@@ -805,8 +1670,8 @@ function FormEditorPage({ canUpdate }) {
                   onChange: (fields) => setDraft({ ...draft, fields })
                 }
               ),
-              /* @__PURE__ */ jsxs6(Section, { title: "Consent", children: [
-                /* @__PURE__ */ jsx6(
+              /* @__PURE__ */ jsxs8(Section, { title: "Consent", children: [
+                /* @__PURE__ */ jsx8(
                   TextField,
                   {
                     label: "Consent label",
@@ -820,7 +1685,7 @@ function FormEditorPage({ canUpdate }) {
                     })
                   }
                 ),
-                /* @__PURE__ */ jsx6(
+                /* @__PURE__ */ jsx8(
                   TextField,
                   {
                     label: "Consent version",
@@ -836,10 +1701,22 @@ function FormEditorPage({ canUpdate }) {
                     })
                   }
                 ),
-                /* @__PURE__ */ jsx6(Typography5, { variant: "pi", children: "Consent version identifies the terms accepted by the visitor and is separate from the server form version." })
+                /* @__PURE__ */ jsx8(Typography7, { variant: "pi", children: "Consent version identifies the terms accepted by the visitor and is separate from the server form version." })
               ] }),
-              canUpdate && /* @__PURE__ */ jsx6(
-                Button4,
+              /* @__PURE__ */ jsx8(
+                NotificationEditor,
+                {
+                  value: draft.notifications ?? {},
+                  fields: draft.fields,
+                  opened: notificationsOpened,
+                  onOpen: () => setNotificationsOpened(true),
+                  onChange: (notifications) => setDraft({ ...draft, notifications }),
+                  disabled,
+                  saveError: error
+                }
+              ),
+              canUpdate && /* @__PURE__ */ jsx8(
+                Button6,
                 {
                   type: "submit",
                   disabled: disabled || !draft.targetUid || !draft.fields.length,
@@ -849,9 +1726,18 @@ function FormEditorPage({ canUpdate }) {
             ] })
           }
         ),
-        documentId && /* @__PURE__ */ jsxs6(Section, { title: "Portable definition", children: [
-          /* @__PURE__ */ jsx6(
-            Button4,
+        notificationsOpened && /* @__PURE__ */ jsx8(
+          NotificationTest,
+          {
+            fields: draft.fields,
+            disabled: disabled || !documentId || JSON.stringify(savePayload(draft, true)) !== savedDraft,
+            send: (sample) => formApi(client).testSend(documentId, sample)
+          },
+          savedDraft
+        ),
+        documentId && /* @__PURE__ */ jsxs8(Section, { title: "Portable definition", children: [
+          /* @__PURE__ */ jsx8(
+            Button6,
             {
               disabled: busy,
               onClick: () => void run(
@@ -863,8 +1749,8 @@ function FormEditorPage({ canUpdate }) {
               children: "Export saved form JSON"
             }
           ),
-          /* @__PURE__ */ jsx6(Typography5, { variant: "pi", children: "Export uses the saved definition. Notification credentials are masked by the server." }),
-          canUpdate && /* @__PURE__ */ jsx6(
+          /* @__PURE__ */ jsx8(Typography7, { variant: "pi", children: "Export uses the saved definition. Notification credentials are masked by the server." }),
+          canUpdate && /* @__PURE__ */ jsx8(
             ImportForm,
             {
               replace: true,
@@ -879,6 +1765,11 @@ function FormEditorPage({ canUpdate }) {
                     documentId
                   );
                   setDraft(saved);
+                  setSavedDraft(
+                    JSON.stringify(savePayload(saved, true))
+                  );
+                  setNotificationsOpened(false);
+                  setError("");
                   setVersion(saved.version);
                   setSchema(
                     await formApi(client).fields(saved.targetUid)
@@ -902,6 +1793,7 @@ var init_form_editor_page = __esm({
     init_form();
     init_ui();
     init_field_editor();
+    init_notification_editor();
     init_import_form();
   }
 });
@@ -909,50 +1801,69 @@ var init_form_editor_page = __esm({
 // admin/src/app.tsx
 var app_exports = {};
 __export(app_exports, {
+  SubmissionsApp: () => SubmissionsApp,
   default: () => App
 });
 import { Navigate, Route, Routes } from "react-router-dom";
-import { Layouts as Layouts3, Page as Page3, useRBAC } from "@strapi/strapi/admin";
-import { jsx as jsx7, jsxs as jsxs7 } from "react/jsx-runtime";
-function App() {
-  const { allowedActions, isLoading } = useRBAC(
+import { Layouts as Layouts4, Page as Page4, useRBAC as useRBAC2 } from "@strapi/strapi/admin";
+import { jsx as jsx9, jsxs as jsxs9 } from "react/jsx-runtime";
+function FormsApp() {
+  const { allowedActions, isLoading } = useRBAC2(
     ["read", "update"].map((action) => ({
       action: `plugin::builder.forms.${action}`,
       subject: null
     }))
   );
-  if (isLoading) return /* @__PURE__ */ jsx7(Page3.Loading, {});
-  if (!allowedActions.canRead) return /* @__PURE__ */ jsx7(Page3.NoPermissions, {});
+  if (isLoading) return /* @__PURE__ */ jsx9(Page4.Loading, {});
+  if (!allowedActions.canRead) return /* @__PURE__ */ jsx9(Page4.NoPermissions, {});
   const canUpdate = allowedActions.canUpdate === true;
-  return /* @__PURE__ */ jsx7(Layouts3.Root, { children: /* @__PURE__ */ jsxs7(Routes, { children: [
-    /* @__PURE__ */ jsx7(Route, { index: true, element: /* @__PURE__ */ jsx7(Navigate, { to: "forms", replace: true }) }),
-    /* @__PURE__ */ jsx7(Route, { path: "forms", element: /* @__PURE__ */ jsx7(FormListPage, { canUpdate }) }),
-    /* @__PURE__ */ jsx7(
+  return /* @__PURE__ */ jsx9(Layouts4.Root, { children: /* @__PURE__ */ jsxs9(Routes, { children: [
+    /* @__PURE__ */ jsx9(Route, { index: true, element: /* @__PURE__ */ jsx9(Navigate, { to: "forms", replace: true }) }),
+    /* @__PURE__ */ jsx9(Route, { path: "forms", element: /* @__PURE__ */ jsx9(FormListPage, { canUpdate }) }),
+    /* @__PURE__ */ jsx9(
       Route,
       {
         path: "forms/new",
-        element: canUpdate ? /* @__PURE__ */ jsx7(FormEditorPage, { canUpdate: true }) : /* @__PURE__ */ jsx7(Page3.NoPermissions, {})
+        element: canUpdate ? /* @__PURE__ */ jsx9(FormEditorPage, { canUpdate: true }) : /* @__PURE__ */ jsx9(Page4.NoPermissions, {})
       }
     ),
-    /* @__PURE__ */ jsx7(
+    /* @__PURE__ */ jsx9(
       Route,
       {
         path: "forms/:documentId",
-        element: /* @__PURE__ */ jsx7(FormEditorPage, { canUpdate })
+        element: /* @__PURE__ */ jsx9(FormEditorPage, { canUpdate })
       }
     ),
-    /* @__PURE__ */ jsx7(
+    /* @__PURE__ */ jsx9(
       Route,
       {
         path: "*",
-        element: /* @__PURE__ */ jsx7(Page3.Error, { content: "Form page not found." })
+        element: /* @__PURE__ */ jsx9(Page4.Error, { content: "Form page not found." })
       }
     )
   ] }) });
 }
+function SubmissionsApp() {
+  const { allowedActions, isLoading } = useRBAC2(
+    ["read", "update"].map((action) => ({
+      action: `plugin::builder.submissions.${action}`,
+      subject: null
+    }))
+  );
+  if (isLoading) return /* @__PURE__ */ jsx9(Page4.Loading, {});
+  if (!allowedActions.canRead) return /* @__PURE__ */ jsx9(Page4.NoPermissions, {});
+  return /* @__PURE__ */ jsx9(Layouts4.Root, { children: /* @__PURE__ */ jsx9(SubmissionPage, { canUpdate: allowedActions.canUpdate === true }) });
+}
+function App() {
+  return /* @__PURE__ */ jsxs9(Routes, { children: [
+    /* @__PURE__ */ jsx9(Route, { path: "submissions/*", element: /* @__PURE__ */ jsx9(SubmissionsApp, {}) }),
+    /* @__PURE__ */ jsx9(Route, { path: "*", element: /* @__PURE__ */ jsx9(FormsApp, {}) })
+  ] });
+}
 var init_app = __esm({
   "admin/src/app.tsx"() {
     "use strict";
+    init_submission_page();
     init_form_list_page();
     init_form_editor_page();
   }
@@ -998,6 +1909,20 @@ var index_default = {
       Component: () => Promise.resolve().then(() => (init_app(), app_exports)),
       permissions: [{ action: "plugin::builder.forms.read", subject: null }]
     });
+    app.addMenuLink({
+      to: "plugins/builder/submissions",
+      icon: BuilderIcon,
+      intlLabel: {
+        id: "builder.submissions",
+        defaultMessage: "Builder Submissions"
+      },
+      Component: () => Promise.resolve().then(() => (init_app(), app_exports)).then(({ SubmissionsApp: SubmissionsApp2 }) => ({
+        default: SubmissionsApp2
+      })),
+      permissions: [
+        { action: "plugin::builder.submissions.read", subject: null }
+      ]
+    });
     app.registerPlugin({ id: "builder", name: "Builder" });
   }
 };