@netlib/widerrufsbutton 1.2.0 → 2.1.1

package/dist/index.es.js

@@ -1,91 +1,89 @@
-import { jsx as t, jsxs as c, Fragment as O } from "react/jsx-runtime";
-import { useState as m, useRef as q, useEffect as T } from "react";
-import { createPortal as D } from "react-dom";
-async function I(e, r) {
-  const a = {
+import { jsx as a, jsxs as c, Fragment as L } from "react/jsx-runtime";
+import { useState as w, useRef as q, useEffect as C } from "react";
+import { createPortal as F } from "react-dom";
+async function O(e, r) {
+  const t = {
     "Content-Type": "application/json"
   };
-  e.authToken && (a.Authorization = `Bearer ${e.authToken}`);
+  e.authToken && (t.Authorization = `Bearer ${e.authToken}`);
   const o = {
     action: e.action,
     payload: {
       ...r,
-      datum: (/* @__PURE__ */ new Date()).toISOString()
+      ...e.companyName ? { companyName: e.companyName } : {},
+      ...e.senderEmail ? { senderEmail: e.senderEmail } : {}
     }
-  }, i = await fetch(e.apiUrl, {
+  }, l = await fetch(e.apiUrl, {
     method: "PATCH",
-    headers: a,
+    headers: t,
     body: JSON.stringify(o)
   });
-  let l;
+  let d;
   try {
-    l = await i.json();
+    d = await l.json();
   } catch {
-    if (!i.ok) throw new Error(`Server antwortete mit Status ${i.status}`);
+    if (!l.ok) throw new Error(`Server antwortete mit Status ${l.status}`);
     return;
   }
-  if (l !== null && typeof l == "object" && "ok" in l && l.ok === !1) {
-    const d = l.message;
-    throw new Error(typeof d == "string" && d ? d : `Server antwortete mit Status ${i.status}`);
+  if (d !== null && typeof d == "object" && "ok" in d && d.ok === !1) {
+    const s = d.message;
+    throw new Error(typeof s == "string" && s ? s : `Server antwortete mit Status ${l.status}`);
   }
-  if (!i.ok)
-    throw new Error(`Server antwortete mit Status ${i.status}`);
-}
-const C = (/* @__PURE__ */ new Date()).toLocaleDateString("de-DE", {
-  day: "2-digit",
-  month: "2-digit",
-  year: "numeric"
-}), U = {
-  name: "",
+  if (!l.ok)
+    throw new Error(`Server antwortete mit Status ${l.status}`);
+}
+const I = {
+  firstName: "",
+  lastName: "",
   email: "",
   orderNumber: "",
   reason: "",
-  datum: C
+  userMessage: ""
 };
-function N(e) {
+function k(e) {
   const r = {};
-  return e.name.trim() || (r.name = "Bitte geben Sie Ihren Namen an."), e.email.trim() ? /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(e.email) || (r.email = "Bitte geben Sie eine gültige E-Mail-Adresse an.") : r.email = "Bitte geben Sie Ihre E-Mail-Adresse an.", e.orderNumber.trim() || (r.orderNumber = "Bitte geben Sie die Bestellnummer oder Vertragsnummer an."), r;
+  return e.firstName.trim() || (r.firstName = "Bitte geben Sie Ihren Vornamen an."), e.lastName.trim() || (r.lastName = "Bitte geben Sie Ihren Nachnamen an."), e.email.trim() ? /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(e.email) || (r.email = "Bitte geben Sie eine gültige E-Mail-Adresse an.") : r.email = "Bitte geben Sie Ihre E-Mail-Adresse an.", e.orderNumber.trim() || (r.orderNumber = "Bitte geben Sie die Bestellnummer oder Vertragsnummer an."), r;
 }
-function V({ config: e, onClose: r }) {
-  const [a, o] = m(U), [i, l] = m({}), [d, S] = m({}), [w, y] = m("idle"), [E, z] = m(""), W = q(null);
-  T(() => {
+function U({ config: e, onClose: r }) {
+  const [t, o] = w(I), [l, d] = w({}), [s, S] = w({}), [h, N] = w("idle"), [E, z] = w(""), W = q(null);
+  C(() => {
     var u;
     (u = W.current) == null || u.focus();
     const n = (b) => b.key === "Escape" && r();
     return document.addEventListener("keydown", n), () => document.removeEventListener("keydown", n);
   }, [r]);
-  function h(n, u) {
-    const b = { ...a, [n]: u };
-    if (o(b), d[n]) {
-      const f = N(b);
-      l((g) => ({ ...g, [n]: f[n] }));
+  function m(n, u) {
+    const b = { ...t, [n]: u };
+    if (o(b), s[n]) {
+      const g = k(b);
+      d((x) => ({ ...x, [n]: g[n] }));
     }
   }
-  function k(n) {
+  function f(n) {
     S((b) => ({ ...b, [n]: !0 }));
-    const u = N(a);
-    l((b) => ({ ...b, [n]: u[n] }));
+    const u = k(t);
+    d((b) => ({ ...b, [n]: u[n] }));
   }
-  async function F(n) {
-    var f, g;
+  async function T(n) {
+    var g, x;
     n.preventDefault();
     const u = Object.fromEntries(
-      Object.keys(a).map((x) => [x, !0])
+      Object.keys(t).map((v) => [v, !0])
     );
     S(u);
-    const b = N(a);
-    if (l(b), !(Object.keys(b).length > 0)) {
-      y("loading"), z("");
+    const b = k(t);
+    if (d(b), !(Object.keys(b).length > 0)) {
+      N("loading"), z("");
       try {
-        await I(e, a), y("success"), (f = e.onSuccess) == null || f.call(e);
-      } catch (x) {
-        const A = x instanceof Error ? x : new Error("Ein unbekannter Fehler ist aufgetreten.");
-        z(A.message), y("error"), (g = e.onError) == null || g.call(e, A);
+        await O(e, t), N("success"), (g = e.onSuccess) == null || g.call(e);
+      } catch (v) {
+        const B = v instanceof Error ? v : new Error("Ein unbekannter Fehler ist aufgetreten.");
+        z(B.message), N("error"), (x = e.onError) == null || x.call(e, B);
       }
     }
   }
-  const M = e.companyName ? `Widerruf – ${e.companyName}` : "Widerrufsformular";
-  return /* @__PURE__ */ t(
+  const j = e.companyName ? `Widerruf – ${e.companyName}` : "Widerrufsformular";
+  return /* @__PURE__ */ a(
     "div",
     {
       className: "wrb-overlay",
@@ -95,8 +93,8 @@ function V({ config: e, onClose: r }) {
       onClick: (n) => n.target === n.currentTarget && r(),
       children: /* @__PURE__ */ c("div", { className: "wrb-modal", children: [
         /* @__PURE__ */ c("div", { className: "wrb-modal-header", children: [
-          /* @__PURE__ */ t("h2", { className: "wrb-modal-title", id: "wrb-title", children: M }),
-          /* @__PURE__ */ t(
+          /* @__PURE__ */ a("h2", { className: "wrb-modal-title", id: "wrb-title", children: j }),
+          /* @__PURE__ */ a(
             "button",
             {
               className: "wrb-close-btn",
@@ -107,103 +105,132 @@ function V({ config: e, onClose: r }) {
             }
           )
         ] }),
-        w === "success" ? /* @__PURE__ */ c("div", { className: "wrb-modal-body", children: [
+        h === "success" ? /* @__PURE__ */ c("div", { className: "wrb-modal-body", children: [
           /* @__PURE__ */ c("div", { className: "wrb-success", children: [
-            /* @__PURE__ */ t("span", { className: "wrb-success-icon", children: "✓" }),
-            /* @__PURE__ */ t("h3", { children: "Widerruf eingegangen" }),
+            /* @__PURE__ */ a("span", { className: "wrb-success-icon", children: "✓" }),
+            /* @__PURE__ */ a("h3", { children: "Widerruf eingegangen" }),
             /* @__PURE__ */ c("p", { children: [
               "Ihr Widerruf wurde erfolgreich übermittelt. Sie erhalten in Kürze eine Bestätigung an ",
-              /* @__PURE__ */ t("strong", { children: a.email }),
+              /* @__PURE__ */ a("strong", { children: t.email }),
               "."
             ] })
           ] }),
-          /* @__PURE__ */ t(B, { links: e.legalLinks })
+          /* @__PURE__ */ a(A, { links: e.legalLinks })
         ] }) : /* @__PURE__ */ c("div", { className: "wrb-modal-body", children: [
-          e.introText && /* @__PURE__ */ t("p", { className: "wrb-intro", children: e.introText }),
-          w === "error" && E && /* @__PURE__ */ t("div", { className: "wrb-alert wrb-alert-error", role: "alert", children: E }),
-          /* @__PURE__ */ c("form", { onSubmit: F, noValidate: !0, children: [
-            /* @__PURE__ */ t(
+          e.introText && /* @__PURE__ */ a("p", { className: "wrb-intro", children: e.introText }),
+          h === "error" && E && /* @__PURE__ */ a("div", { className: "wrb-alert wrb-alert-error", role: "alert", children: E }),
+          /* @__PURE__ */ c("form", { onSubmit: T, noValidate: !0, children: [
+            /* @__PURE__ */ a(
               p,
               {
-                label: "Name",
+                label: "Vorname",
                 required: !0,
-                error: d.name ? i.name : void 0,
-                children: /* @__PURE__ */ t(
+                error: s.firstName ? l.firstName : void 0,
+                children: /* @__PURE__ */ a(
                   "input",
                   {
                     ref: W,
-                    className: `wrb-input${d.name && i.name ? " wrb-error" : ""}`,
+                    className: `wrb-input${s.firstName && l.firstName ? " wrb-error" : ""}`,
                     type: "text",
-                    autoComplete: "name",
-                    value: a.name,
-                    onChange: (n) => h("name", n.target.value),
-                    onBlur: () => k("name"),
-                    placeholder: "Vor- und Nachname"
+                    autoComplete: "given-name",
+                    value: t.firstName,
+                    onChange: (n) => m("firstName", n.target.value),
+                    onBlur: () => f("firstName"),
+                    placeholder: "Max"
                   }
                 )
               }
             ),
-            /* @__PURE__ */ t(
+            /* @__PURE__ */ a(
+              p,
+              {
+                label: "Nachname",
+                required: !0,
+                error: s.lastName ? l.lastName : void 0,
+                children: /* @__PURE__ */ a(
+                  "input",
+                  {
+                    className: `wrb-input${s.lastName && l.lastName ? " wrb-error" : ""}`,
+                    type: "text",
+                    autoComplete: "family-name",
+                    value: t.lastName,
+                    onChange: (n) => m("lastName", n.target.value),
+                    onBlur: () => f("lastName"),
+                    placeholder: "Mustermann"
+                  }
+                )
+              }
+            ),
+            /* @__PURE__ */ a(
               p,
               {
                 label: "E-Mail-Adresse",
                 required: !0,
                 hint: "Hierüber erhalten Sie die Eingangsbestätigung.",
-                error: d.email ? i.email : void 0,
-                children: /* @__PURE__ */ t(
+                error: s.email ? l.email : void 0,
+                children: /* @__PURE__ */ a(
                   "input",
                   {
-                    className: `wrb-input${d.email && i.email ? " wrb-error" : ""}`,
+                    className: `wrb-input${s.email && l.email ? " wrb-error" : ""}`,
                     type: "email",
                     autoComplete: "email",
-                    value: a.email,
-                    onChange: (n) => h("email", n.target.value),
-                    onBlur: () => k("email"),
+                    value: t.email,
+                    onChange: (n) => m("email", n.target.value),
+                    onBlur: () => f("email"),
                     placeholder: "name@beispiel.de"
                   }
                 )
               }
             ),
-            /* @__PURE__ */ t(
+            /* @__PURE__ */ a(
               p,
               {
                 label: "Bestell- / Auftrags- / Vertragsnummer",
                 required: !0,
                 hint: "Zu finden in Ihrer Bestellbestätigung.",
-                error: d.orderNumber ? i.orderNumber : void 0,
-                children: /* @__PURE__ */ t(
+                error: s.orderNumber ? l.orderNumber : void 0,
+                children: /* @__PURE__ */ a(
                   "input",
                   {
-                    className: `wrb-input${d.orderNumber && i.orderNumber ? " wrb-error" : ""}`,
+                    className: `wrb-input${s.orderNumber && l.orderNumber ? " wrb-error" : ""}`,
                     type: "text",
-                    value: a.orderNumber,
-                    onChange: (n) => h("orderNumber", n.target.value),
-                    onBlur: () => k("orderNumber"),
+                    value: t.orderNumber,
+                    onChange: (n) => m("orderNumber", n.target.value),
+                    onBlur: () => f("orderNumber"),
                     placeholder: "z.B. 10045678"
                   }
                 )
               }
             ),
-            /* @__PURE__ */ t(
+            /* @__PURE__ */ a(
               p,
               {
-                label: "reason",
+                label: "Widerrufsgrund",
                 hint: "Freiwillige Angabe – ein Widerruf ist ohne Angabe von Gründen möglich.",
-                children: /* @__PURE__ */ t(
+                children: /* @__PURE__ */ a(
                   "textarea",
                   {
                     className: "wrb-textarea",
-                    value: a.reason,
-                    onChange: (n) => h("reason", n.target.value),
+                    value: t.reason,
+                    onChange: (n) => m("reason", n.target.value),
                     placeholder: "Optional",
-                    rows: 3
+                    rows: 2
                   }
                 )
               }
             ),
-            /* @__PURE__ */ t(p, { label: "Datum der Widerrufserklärung", children: /* @__PURE__ */ t("div", { className: "wrb-date-display", children: C }) }),
+            /* @__PURE__ */ a(p, { label: "Nachricht", children: /* @__PURE__ */ a(
+              "textarea",
+              {
+                className: "wrb-textarea",
+                value: t.userMessage,
+                onChange: (n) => m("userMessage", n.target.value),
+                placeholder: "Optional",
+                rows: 3
+              }
+            ) }),
             /* @__PURE__ */ c("div", { className: "wrb-actions", children: [
-              /* @__PURE__ */ t(
+              /* @__PURE__ */ a(
                 "button",
                 {
                   type: "button",
@@ -212,36 +239,36 @@ function V({ config: e, onClose: r }) {
                   children: e.cancelLabel ?? "Abbrechen"
                 }
               ),
-              /* @__PURE__ */ t(
+              /* @__PURE__ */ a(
                 "button",
                 {
                   type: "submit",
                   className: "wrb-submit-btn",
-                  disabled: w === "loading",
-                  children: w === "loading" ? "Wird gesendet…" : e.submitLabel ?? "Absenden"
+                  disabled: h === "loading",
+                  children: h === "loading" ? "Wird gesendet…" : e.submitLabel ?? "Absenden"
                 }
               )
             ] })
           ] }),
-          /* @__PURE__ */ t(B, { links: e.legalLinks })
+          /* @__PURE__ */ a(A, { links: e.legalLinks })
         ] })
       ] })
     }
   );
 }
-function p({ label: e, required: r, hint: a, error: o, children: i }) {
+function p({ label: e, required: r, hint: t, error: o, children: l }) {
   return /* @__PURE__ */ c("div", { className: "wrb-field", children: [
     /* @__PURE__ */ c("label", { className: "wrb-label", children: [
       e,
-      r && /* @__PURE__ */ t("span", { className: "wrb-required", "aria-hidden": "true", children: "*" })
+      r && /* @__PURE__ */ a("span", { className: "wrb-required", "aria-hidden": "true", children: "*" })
     ] }),
-    i,
-    a && !o && /* @__PURE__ */ t("p", { className: "wrb-hint", children: a }),
-    o && /* @__PURE__ */ t("p", { className: "wrb-field-error", role: "alert", children: o })
+    l,
+    t && !o && /* @__PURE__ */ a("p", { className: "wrb-hint", children: t }),
+    o && /* @__PURE__ */ a("p", { className: "wrb-field-error", role: "alert", children: o })
   ] });
 }
-function B({ links: e }) {
-  return e != null && e.length ? /* @__PURE__ */ t("div", { className: "wrb-legal-links", children: e.map((r) => /* @__PURE__ */ t(
+function A({ links: e }) {
+  return e != null && e.length ? /* @__PURE__ */ a("div", { className: "wrb-legal-links", children: e.map((r) => /* @__PURE__ */ a(
     "a",
     {
       href: r.href,
@@ -483,59 +510,59 @@ const $ = `
   text-decoration: underline;
 }
 `;
-function P() {
+function V() {
   const e = "wrb-styles";
   if (document.getElementById(e)) return;
   const r = document.createElement("style");
   r.id = e, r.textContent = $, document.head.appendChild(r);
 }
-function Y({ config: e }) {
-  const [r, a] = m(!1);
-  return T(() => {
-    P();
-  }, []), /* @__PURE__ */ c(O, { children: [
-    /* @__PURE__ */ t(
+function K({ config: e }) {
+  const [r, t] = w(!1);
+  return C(() => {
+    V();
+  }, []), /* @__PURE__ */ c(L, { children: [
+    /* @__PURE__ */ a(
       "button",
       {
         type: "button",
         className: `wrb-btn${e.buttonClass ? ` ${e.buttonClass}` : ""}`,
-        onClick: () => a(!0),
+        onClick: () => t(!0),
         children: e.buttonLabel ?? "Vertrag widerrufen"
       }
     ),
-    r && D(
-      /* @__PURE__ */ t(V, { config: e, onClose: () => a(!1) }),
+    r && F(
+      /* @__PURE__ */ a(U, { config: e, onClose: () => t(!1) }),
       document.body
     )
   ] });
 }
-function s(e) {
+function i(e) {
   return e.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;");
 }
-function L() {
-  return (/* @__PURE__ */ new Date()).toLocaleDateString("de-DE", {
-    day: "2-digit",
-    month: "2-digit",
-    year: "numeric"
-  });
-}
-function v(e) {
+function y(e) {
   var r;
   return (r = e.legalLinks) != null && r.length ? `
       <div class="wrb-legal-links">
-        ${e.legalLinks.map((a) => `<a href="${s(a.href)}" class="wrb-legal-link" rel="noopener noreferrer">${s(a.name)}</a>`).join(`
+        ${e.legalLinks.map((t) => `<a href="${i(t.href)}" class="wrb-legal-link" rel="noopener noreferrer">${i(t.name)}</a>`).join(`
         `)}
       </div>` : "";
 }
-function j(e, r, a = "", o = "") {
-  const i = s(e.successUrl ?? a), l = s(e.errorUrl ?? o);
+function M(e, r = "", t = "") {
+  const o = i(e.successUrl ?? r), l = i(e.errorUrl ?? t);
   return `
           <div class="wrb-field">
             <label class="wrb-label">
-              Name <span class="wrb-required" aria-hidden="true">*</span>
+              Vorname <span class="wrb-required" aria-hidden="true">*</span>
+            </label>
+            <input class="wrb-input" type="text" name="firstName" autocomplete="given-name"
+              placeholder="Max" required>
+          </div>
+          <div class="wrb-field">
+            <label class="wrb-label">
+              Nachname <span class="wrb-required" aria-hidden="true">*</span>
             </label>
-            <input class="wrb-input" type="text" name="name" autocomplete="name"
-              placeholder="Vor- und Nachname" required>
+            <input class="wrb-input" type="text" name="lastName" autocomplete="family-name"
+              placeholder="Mustermann" required>
           </div>
           <div class="wrb-field">
             <label class="wrb-label">
@@ -555,29 +582,28 @@ function j(e, r, a = "", o = "") {
             <p class="wrb-hint">Zu finden in Ihrer Bestellbestätigung.</p>
           </div>
           <div class="wrb-field">
-            <label class="wrb-label">reason</label>
-            <textarea class="wrb-textarea" name="reason" placeholder="Optional" rows="3"></textarea>
+            <label class="wrb-label">Widerrufsgrund</label>
+            <textarea class="wrb-textarea" name="reason" placeholder="Optional" rows="2"></textarea>
             <p class="wrb-hint">
               Freiwillige Angabe – ein Widerruf ist ohne Angabe von Gründen möglich.
             </p>
           </div>
           <div class="wrb-field">
-            <label class="wrb-label">Datum der Widerrufserklärung</label>
-            <div class="wrb-date-display">${r}</div>
-            <input type="hidden" name="datum" value="${r}">
+            <label class="wrb-label">Nachricht</label>
+            <textarea class="wrb-textarea" name="userMessage" placeholder="Optional" rows="3"></textarea>
           </div>
-          <input type="hidden" name="action" value="${s(e.action)}">
-          ${i ? `<input type="hidden" name="successUrl" value="${i}">` : ""}
+          <input type="hidden" name="action" value="${i(e.action)}">
+          ${o ? `<input type="hidden" name="successUrl" value="${o}">` : ""}
           ${l ? `<input type="hidden" name="errorUrl" value="${l}">` : ""}`;
 }
-function _(e) {
-  const r = L(), a = e.companyName ? `Widerruf – ${s(e.companyName)}` : "Widerrufsformular", o = s(e.formAction ?? e.apiUrl ?? "/rest/v1/apiCancellation");
+function Y(e) {
+  const r = e.companyName ? `Widerruf – ${i(e.companyName)}` : "Widerrufsformular", t = i(e.formAction ?? e.apiUrl ?? "/rest/v1/apiCancellation");
   return `<!DOCTYPE html>
 <html lang="de">
 <head>
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>${a}</title>
+  <title>${r}</title>
   <style>
     *, *::before, *::after { box-sizing: border-box; }
     body { margin: 0; background: #f9fafb; }
@@ -597,27 +623,27 @@ function _(e) {
   <div class="wrb-page">
     <div class="wrb-modal">
       <div class="wrb-modal-header">
-        <h1 class="wrb-modal-title">${a}</h1>
+        <h1 class="wrb-modal-title">${r}</h1>
       </div>
       <div class="wrb-modal-body">
-        ${e.introText ? `<p class="wrb-intro">${s(e.introText)}</p>` : ""}
-        <form method="POST" action="${o}" novalidate>
-          ${j(e, r)}
+        ${e.introText ? `<p class="wrb-intro">${i(e.introText)}</p>` : ""}
+        <form method="POST" action="${t}" novalidate>
+          ${M(e)}
           <div class="wrb-actions">
             <button type="submit" class="wrb-submit-btn">
-              ${s(e.submitLabel ?? "Absenden")}
+              ${i(e.submitLabel ?? "Absenden")}
             </button>
           </div>
         </form>
-        ${v(e)}
+        ${y(e)}
       </div>
     </div>
   </div>
 </body>
 </html>`;
 }
-function G(e, { inlineStyles: r = !0 } = {}) {
-  const a = L(), o = e.companyName ? `Widerruf – ${s(e.companyName)}` : "Widerrufsformular", i = s(e.formAction ?? e.apiUrl ?? "/rest/v1/apiCancellation"), l = `
+function _(e, { inlineStyles: r = !0 } = {}) {
+  const t = e.companyName ? `Widerruf – ${i(e.companyName)}` : "Widerrufsformular", o = i(e.formAction ?? e.apiUrl ?? "/rest/v1/apiCancellation"), l = `
 #wrb-modal, #wrb-success, #wrb-error { display: none; }
 #wrb-modal:target, #wrb-success:target, #wrb-error:target { display: flex; }`;
   return `${r ? `<style>${l}
@@ -627,21 +653,21 @@ ${$}</style>` : `<style>${l}</style>`}
 <div id="wrb-modal" class="wrb-overlay" role="dialog" aria-modal="true" aria-labelledby="wrb-modal-title">
   <div class="wrb-modal">
     <div class="wrb-modal-header">
-      <h2 class="wrb-modal-title" id="wrb-modal-title">${o}</h2>
+      <h2 class="wrb-modal-title" id="wrb-modal-title">${t}</h2>
       <a href="#" class="wrb-close-btn" aria-label="Schließen">✕</a>
     </div>
     <div class="wrb-modal-body">
-      ${e.introText ? `<p class="wrb-intro">${s(e.introText)}</p>` : ""}
-      <form method="POST" action="${i}" novalidate>
-        ${j(e, a, "#wrb-success", "#wrb-error")}
+      ${e.introText ? `<p class="wrb-intro">${i(e.introText)}</p>` : ""}
+      <form method="POST" action="${o}" novalidate>
+        ${M(e, "#wrb-success", "#wrb-error")}
         <div class="wrb-actions">
-          <a href="#" class="wrb-cancel-btn">${s(e.cancelLabel ?? "Abbrechen")}</a>
+          <a href="#" class="wrb-cancel-btn">${i(e.cancelLabel ?? "Abbrechen")}</a>
           <button type="submit" class="wrb-submit-btn">
-            ${s(e.submitLabel ?? "Absenden")}
+            ${i(e.submitLabel ?? "Absenden")}
           </button>
         </div>
       </form>
-      ${v(e)}
+      ${y(e)}
     </div>
   </div>
 </div>
@@ -662,7 +688,7 @@ ${$}</style>` : `<style>${l}</style>`}
           Bestätigung per E-Mail.
         </p>
       </div>
-      ${v(e)}
+      ${y(e)}
     </div>
   </div>
 </div>
@@ -683,14 +709,14 @@ ${$}</style>` : `<style>${l}</style>`}
         <a href="#" class="wrb-cancel-btn">Schließen</a>
         <a href="#wrb-modal" class="wrb-submit-btn">Erneut versuchen</a>
       </div>
-      ${v(e)}
+      ${y(e)}
     </div>
   </div>
 </div>`;
 }
 export {
-  V as WiderrufsModal,
-  Y as WiderrufsWidget,
-  _ as generateFallbackHtml,
-  G as generateModalHtml
+  U as WiderrufsModal,
+  K as WiderrufsWidget,
+  Y as generateFallbackHtml,
+  _ as generateModalHtml
 };

package/dist/types.d.ts

@@ -15,6 +15,8 @@ export interface WiderrufsConfig {
     buttonClass?: string;
     /** Name of the company/shop shown in the modal header */
     companyName?: string;
+    /** Sender/reply-to e-mail address for confirmation mails */
+    senderEmail?: string;
     /** Bearer token or API key for Authorization header */
     authToken?: string;
     /** Label for the cancel button (default: "Abbrechen") */
@@ -35,10 +37,11 @@ export interface WiderrufsConfig {
     onError?: (error: Error) => void;
 }
 export interface WiderrufsFormData {
-    name: string;
+    firstName: string;
+    lastName: string;
     email: string;
     orderNumber: string;
     reason: string;
-    datum: string;
+    userMessage: string;
 }
 export type SubmitStatus = 'idle' | 'loading' | 'success' | 'error';