@netlib/widerrufsbutton 2.1.11 → 2.1.14
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/fallback.cjs.js +34 -17
- package/dist/fallback.es.js +37 -20
- package/dist/index.cjs.js +33 -16
- package/dist/index.es.js +139 -101
- package/dist/styles.d.ts +1 -1
- package/dist/widerruf.html +19 -4
- package/dist/widerrufsbutton.iife.js +25 -13
- package/package.json +1 -1
package/dist/fallback.cjs.js
CHANGED
|
@@ -227,10 +227,22 @@
|
|
|
227
227
|
color: #374151;
|
|
228
228
|
text-decoration: underline;
|
|
229
229
|
}
|
|
230
|
-
|
|
230
|
+
|
|
231
|
+
/* Honeypot — off-screen, never visible, not tabbable */
|
|
232
|
+
.wrb-hp {
|
|
233
|
+
position: absolute !important;
|
|
234
|
+
left: -10000px !important;
|
|
235
|
+
top: auto !important;
|
|
236
|
+
width: 1px !important;
|
|
237
|
+
height: 1px !important;
|
|
238
|
+
overflow: hidden !important;
|
|
239
|
+
opacity: 0 !important;
|
|
240
|
+
pointer-events: none !important;
|
|
241
|
+
}
|
|
242
|
+
`;function r(e){return e.replace(/&/g,"&").replace(/</g,"<").replace(/>/g,">").replace(/"/g,""")}function l(e){if(!e.privacyUrl)return"";const a=r(e.privacyLabel??"Datenschutz");return`
|
|
231
243
|
<div class="wrb-legal-links">
|
|
232
244
|
<a href="${r(e.privacyUrl)}" class="wrb-legal-link" rel="noopener noreferrer">${a}</a>
|
|
233
|
-
</div>`}function s(e){const a=[];return e.companyName&&a.push(`data-company-name="${r(e.companyName)}"`),e.senderEmail&&a.push(`data-sender-email="${r(e.senderEmail)}"`),e.authToken&&a.push(`data-auth-token="${r(e.authToken)}"`),a.length?" "+a.join(" "):""}function d(e,a="",t=""){const
|
|
245
|
+
</div>`}function s(e){const a=[];return e.companyName&&a.push(`data-company-name="${r(e.companyName)}"`),e.senderEmail&&a.push(`data-sender-email="${r(e.senderEmail)}"`),e.authToken&&a.push(`data-auth-token="${r(e.authToken)}"`),a.length?" "+a.join(" "):""}function d(e,a="",t=""){const n=r(e.successUrl??a),i=r(e.errorUrl??t);return`
|
|
234
246
|
<div class="wrb-field">
|
|
235
247
|
<label class="wrb-label">
|
|
236
248
|
Vorname <span class="wrb-required" aria-hidden="true">*</span>
|
|
@@ -251,16 +263,15 @@
|
|
|
251
263
|
</label>
|
|
252
264
|
<input class="wrb-input" type="email" name="email" autocomplete="email"
|
|
253
265
|
placeholder="name@beispiel.de" required>
|
|
254
|
-
<p class="wrb-hint"
|
|
266
|
+
<p class="wrb-hint"An diese Adresse senden wir Ihnen die Eingangsbestätigung.</p>
|
|
255
267
|
</div>
|
|
256
268
|
<div class="wrb-field">
|
|
257
269
|
<label class="wrb-label">
|
|
258
|
-
|
|
270
|
+
Rechnungs- / Lieferschein- / Auftragsnummer
|
|
259
271
|
<span class="wrb-required" aria-hidden="true">*</span>
|
|
260
272
|
</label>
|
|
261
273
|
<input class="wrb-input" type="text" name="orderNumber"
|
|
262
|
-
placeholder="z.B.
|
|
263
|
-
<p class="wrb-hint">Zu finden in Ihrer Bestellbestätigung.</p>
|
|
274
|
+
placeholder="z.B. RE123456" required>
|
|
264
275
|
</div>
|
|
265
276
|
<div class="wrb-field">
|
|
266
277
|
<label class="wrb-label">Widerrufsgrund</label>
|
|
@@ -270,8 +281,12 @@
|
|
|
270
281
|
</p>
|
|
271
282
|
</div>
|
|
272
283
|
<input type="hidden" name="action" value="${r(e.action)}">
|
|
273
|
-
${
|
|
274
|
-
${i?`<input type="hidden" name="errorUrl" value="${i}">`:""}
|
|
284
|
+
${n?`<input type="hidden" name="successUrl" value="${n}">`:""}
|
|
285
|
+
${i?`<input type="hidden" name="errorUrl" value="${i}">`:""}
|
|
286
|
+
<div class="wrb-hp" aria-hidden="true">
|
|
287
|
+
<label>Website (leer lassen)</label>
|
|
288
|
+
<input type="text" name="wrbWebsite" tabindex="-1" autocomplete="off" value="">
|
|
289
|
+
</div>`}function b(e){const a=e.companyName?`Widerruf – ${r(e.companyName)}`:"Widerrufsformular",t=r(e.formAction??e.apiUrl??"/rest/v1/apiCancellation");return`<!DOCTYPE html>
|
|
275
290
|
<html lang="de">
|
|
276
291
|
<head>
|
|
277
292
|
<meta charset="UTF-8">
|
|
@@ -308,12 +323,12 @@
|
|
|
308
323
|
</button>
|
|
309
324
|
</div>
|
|
310
325
|
</form>
|
|
311
|
-
${
|
|
326
|
+
${l(e)}
|
|
312
327
|
</div>
|
|
313
328
|
</div>
|
|
314
329
|
</div>
|
|
315
330
|
</body>
|
|
316
|
-
</html>`}function
|
|
331
|
+
</html>`}function p(e,{inlineStyles:a=!0}={}){const t=e.companyName?`Widerruf – ${r(e.companyName)}`:"Widerrufsformular",n=r(e.formAction??e.apiUrl??"/rest/v1/apiCancellation"),i=`
|
|
317
332
|
#wrb-modal, #wrb-success, #wrb-error { display: none; }
|
|
318
333
|
#wrb-modal:target, #wrb-success:target, #wrb-error:target { display: flex; }`;return`${a?`<style>${i}
|
|
319
334
|
${o}</style>`:`<style>${i}</style>`}
|
|
@@ -327,7 +342,7 @@ ${o}</style>`:`<style>${i}</style>`}
|
|
|
327
342
|
</div>
|
|
328
343
|
<div class="wrb-modal-body">
|
|
329
344
|
${e.introText?`<p class="wrb-intro">${r(e.introText)}</p>`:""}
|
|
330
|
-
<form method="POST" action="${
|
|
345
|
+
<form method="POST" action="${n}"${s(e)}>
|
|
331
346
|
${d(e,"#wrb-success","#wrb-error")}
|
|
332
347
|
<div class="wrb-actions">
|
|
333
348
|
<a href="#" class="wrb-cancel-btn">${r(e.cancelLabel??"Abbrechen")}</a>
|
|
@@ -336,7 +351,7 @@ ${o}</style>`:`<style>${i}</style>`}
|
|
|
336
351
|
</button>
|
|
337
352
|
</div>
|
|
338
353
|
</form>
|
|
339
|
-
${
|
|
354
|
+
${l(e)}
|
|
340
355
|
</div>
|
|
341
356
|
</div>
|
|
342
357
|
</div>
|
|
@@ -353,11 +368,13 @@ ${o}</style>`:`<style>${i}</style>`}
|
|
|
353
368
|
<span class="wrb-success-icon">✓</span>
|
|
354
369
|
<h3>Widerruf eingegangen</h3>
|
|
355
370
|
<p>
|
|
356
|
-
Ihr Widerruf wurde erfolgreich übermittelt.
|
|
357
|
-
|
|
371
|
+
Vielen Dank. Ihr Widerruf wurde erfolgreich an uns übermittelt.
|
|
372
|
+
</p>
|
|
373
|
+
<p>
|
|
374
|
+
Sie erhalten in Kürze eine Bestätigung per E-Mail. Wir werden Ihr Anliegen schnellstmöglich bearbeiten.
|
|
358
375
|
</p>
|
|
359
376
|
</div>
|
|
360
|
-
${
|
|
377
|
+
${l(e)}
|
|
361
378
|
</div>
|
|
362
379
|
</div>
|
|
363
380
|
</div>
|
|
@@ -378,7 +395,7 @@ ${o}</style>`:`<style>${i}</style>`}
|
|
|
378
395
|
<a href="#" class="wrb-cancel-btn">Schließen</a>
|
|
379
396
|
<a href="#wrb-modal" class="wrb-submit-btn">Erneut versuchen</a>
|
|
380
397
|
</div>
|
|
381
|
-
${
|
|
398
|
+
${l(e)}
|
|
382
399
|
</div>
|
|
383
400
|
</div>
|
|
384
|
-
</div>`}exports.generateFallbackHtml=b;exports.generateModalHtml=
|
|
401
|
+
</div>`}exports.generateFallbackHtml=b;exports.generateModalHtml=p;
|
package/dist/fallback.es.js
CHANGED
|
@@ -227,11 +227,23 @@ const o = `
|
|
|
227
227
|
color: #374151;
|
|
228
228
|
text-decoration: underline;
|
|
229
229
|
}
|
|
230
|
+
|
|
231
|
+
/* Honeypot — off-screen, never visible, not tabbable */
|
|
232
|
+
.wrb-hp {
|
|
233
|
+
position: absolute !important;
|
|
234
|
+
left: -10000px !important;
|
|
235
|
+
top: auto !important;
|
|
236
|
+
width: 1px !important;
|
|
237
|
+
height: 1px !important;
|
|
238
|
+
overflow: hidden !important;
|
|
239
|
+
opacity: 0 !important;
|
|
240
|
+
pointer-events: none !important;
|
|
241
|
+
}
|
|
230
242
|
`;
|
|
231
243
|
function r(e) {
|
|
232
244
|
return e.replace(/&/g, "&").replace(/</g, "<").replace(/>/g, ">").replace(/"/g, """);
|
|
233
245
|
}
|
|
234
|
-
function
|
|
246
|
+
function l(e) {
|
|
235
247
|
if (!e.privacyUrl) return "";
|
|
236
248
|
const a = r(e.privacyLabel ?? "Datenschutz");
|
|
237
249
|
return `
|
|
@@ -244,7 +256,7 @@ function s(e) {
|
|
|
244
256
|
return e.companyName && a.push(`data-company-name="${r(e.companyName)}"`), e.senderEmail && a.push(`data-sender-email="${r(e.senderEmail)}"`), e.authToken && a.push(`data-auth-token="${r(e.authToken)}"`), a.length ? " " + a.join(" ") : "";
|
|
245
257
|
}
|
|
246
258
|
function d(e, a = "", t = "") {
|
|
247
|
-
const
|
|
259
|
+
const n = r(e.successUrl ?? a), i = r(e.errorUrl ?? t);
|
|
248
260
|
return `
|
|
249
261
|
<div class="wrb-field">
|
|
250
262
|
<label class="wrb-label">
|
|
@@ -266,16 +278,15 @@ function d(e, a = "", t = "") {
|
|
|
266
278
|
</label>
|
|
267
279
|
<input class="wrb-input" type="email" name="email" autocomplete="email"
|
|
268
280
|
placeholder="name@beispiel.de" required>
|
|
269
|
-
<p class="wrb-hint"
|
|
281
|
+
<p class="wrb-hint"An diese Adresse senden wir Ihnen die Eingangsbestätigung.</p>
|
|
270
282
|
</div>
|
|
271
283
|
<div class="wrb-field">
|
|
272
284
|
<label class="wrb-label">
|
|
273
|
-
|
|
285
|
+
Rechnungs- / Lieferschein- / Auftragsnummer
|
|
274
286
|
<span class="wrb-required" aria-hidden="true">*</span>
|
|
275
287
|
</label>
|
|
276
288
|
<input class="wrb-input" type="text" name="orderNumber"
|
|
277
|
-
placeholder="z.B.
|
|
278
|
-
<p class="wrb-hint">Zu finden in Ihrer Bestellbestätigung.</p>
|
|
289
|
+
placeholder="z.B. RE123456" required>
|
|
279
290
|
</div>
|
|
280
291
|
<div class="wrb-field">
|
|
281
292
|
<label class="wrb-label">Widerrufsgrund</label>
|
|
@@ -285,10 +296,14 @@ function d(e, a = "", t = "") {
|
|
|
285
296
|
</p>
|
|
286
297
|
</div>
|
|
287
298
|
<input type="hidden" name="action" value="${r(e.action)}">
|
|
288
|
-
${
|
|
289
|
-
${i ? `<input type="hidden" name="errorUrl" value="${i}">` : ""}
|
|
299
|
+
${n ? `<input type="hidden" name="successUrl" value="${n}">` : ""}
|
|
300
|
+
${i ? `<input type="hidden" name="errorUrl" value="${i}">` : ""}
|
|
301
|
+
<div class="wrb-hp" aria-hidden="true">
|
|
302
|
+
<label>Website (leer lassen)</label>
|
|
303
|
+
<input type="text" name="wrbWebsite" tabindex="-1" autocomplete="off" value="">
|
|
304
|
+
</div>`;
|
|
290
305
|
}
|
|
291
|
-
function
|
|
306
|
+
function p(e) {
|
|
292
307
|
const a = e.companyName ? `Widerruf – ${r(e.companyName)}` : "Widerrufsformular", t = r(e.formAction ?? e.apiUrl ?? "/rest/v1/apiCancellation");
|
|
293
308
|
return `<!DOCTYPE html>
|
|
294
309
|
<html lang="de">
|
|
@@ -327,15 +342,15 @@ function c(e) {
|
|
|
327
342
|
</button>
|
|
328
343
|
</div>
|
|
329
344
|
</form>
|
|
330
|
-
${
|
|
345
|
+
${l(e)}
|
|
331
346
|
</div>
|
|
332
347
|
</div>
|
|
333
348
|
</div>
|
|
334
349
|
</body>
|
|
335
350
|
</html>`;
|
|
336
351
|
}
|
|
337
|
-
function
|
|
338
|
-
const t = e.companyName ? `Widerruf – ${r(e.companyName)}` : "Widerrufsformular",
|
|
352
|
+
function c(e, { inlineStyles: a = !0 } = {}) {
|
|
353
|
+
const t = e.companyName ? `Widerruf – ${r(e.companyName)}` : "Widerrufsformular", n = r(e.formAction ?? e.apiUrl ?? "/rest/v1/apiCancellation"), i = `
|
|
339
354
|
#wrb-modal, #wrb-success, #wrb-error { display: none; }
|
|
340
355
|
#wrb-modal:target, #wrb-success:target, #wrb-error:target { display: flex; }`;
|
|
341
356
|
return `${a ? `<style>${i}
|
|
@@ -350,7 +365,7 @@ ${o}</style>` : `<style>${i}</style>`}
|
|
|
350
365
|
</div>
|
|
351
366
|
<div class="wrb-modal-body">
|
|
352
367
|
${e.introText ? `<p class="wrb-intro">${r(e.introText)}</p>` : ""}
|
|
353
|
-
<form method="POST" action="${
|
|
368
|
+
<form method="POST" action="${n}"${s(e)}>
|
|
354
369
|
${d(e, "#wrb-success", "#wrb-error")}
|
|
355
370
|
<div class="wrb-actions">
|
|
356
371
|
<a href="#" class="wrb-cancel-btn">${r(e.cancelLabel ?? "Abbrechen")}</a>
|
|
@@ -359,7 +374,7 @@ ${o}</style>` : `<style>${i}</style>`}
|
|
|
359
374
|
</button>
|
|
360
375
|
</div>
|
|
361
376
|
</form>
|
|
362
|
-
${
|
|
377
|
+
${l(e)}
|
|
363
378
|
</div>
|
|
364
379
|
</div>
|
|
365
380
|
</div>
|
|
@@ -376,11 +391,13 @@ ${o}</style>` : `<style>${i}</style>`}
|
|
|
376
391
|
<span class="wrb-success-icon">✓</span>
|
|
377
392
|
<h3>Widerruf eingegangen</h3>
|
|
378
393
|
<p>
|
|
379
|
-
Ihr Widerruf wurde erfolgreich übermittelt.
|
|
380
|
-
|
|
394
|
+
Vielen Dank. Ihr Widerruf wurde erfolgreich an uns übermittelt.
|
|
395
|
+
</p>
|
|
396
|
+
<p>
|
|
397
|
+
Sie erhalten in Kürze eine Bestätigung per E-Mail. Wir werden Ihr Anliegen schnellstmöglich bearbeiten.
|
|
381
398
|
</p>
|
|
382
399
|
</div>
|
|
383
|
-
${
|
|
400
|
+
${l(e)}
|
|
384
401
|
</div>
|
|
385
402
|
</div>
|
|
386
403
|
</div>
|
|
@@ -401,12 +418,12 @@ ${o}</style>` : `<style>${i}</style>`}
|
|
|
401
418
|
<a href="#" class="wrb-cancel-btn">Schließen</a>
|
|
402
419
|
<a href="#wrb-modal" class="wrb-submit-btn">Erneut versuchen</a>
|
|
403
420
|
</div>
|
|
404
|
-
${
|
|
421
|
+
${l(e)}
|
|
405
422
|
</div>
|
|
406
423
|
</div>
|
|
407
424
|
</div>`;
|
|
408
425
|
}
|
|
409
426
|
export {
|
|
410
|
-
|
|
411
|
-
|
|
427
|
+
p as generateFallbackHtml,
|
|
428
|
+
c as generateModalHtml
|
|
412
429
|
};
|
package/dist/index.cjs.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),m=require("react"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),m=require("react"),O=require("react-dom");async function I(e,t){const a={"Content-Type":"application/json"};e.authToken&&(a.Authorization=`Bearer ${e.authToken}`);const o={action:e.action,payload:{...t,...e.companyName?{companyName:e.companyName}:{},...e.senderEmail?{senderEmail:e.senderEmail}:{}}},n=await fetch(e.apiUrl,{method:"PATCH",headers:a,body:JSON.stringify(o)});let c;try{c=await n.json()}catch{if(!n.ok)throw new Error(`Server antwortete mit Status ${n.status}`);return}if(c!==null&&typeof c=="object"&&"ok"in c&&c.ok===!1){const i=c.message;throw new Error(typeof i=="string"&&i?i:`Server antwortete mit Status ${n.status}`)}if(!n.ok)throw new Error(`Server antwortete mit Status ${n.status}`)}const R={firstName:"",lastName:"",email:"",orderNumber:"",reason:""};function $(e){const t={};return e.firstName.trim()||(t.firstName="Bitte geben Sie Ihren Vornamen an."),e.lastName.trim()||(t.lastName="Bitte geben Sie Ihren Nachnamen an."),e.email.trim()?/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(e.email)||(t.email="Bitte geben Sie eine gültige E-Mail-Adresse an."):t.email="Bitte geben Sie Ihre E-Mail-Adresse an.",e.orderNumber.trim()||(t.orderNumber="Bitte geben Sie die Rechnungs-, Lieferschein- oder Auftragsnummer an."),t}function T({config:e,onClose:t}){const[a,o]=m.useState(R),[n,c]=m.useState({}),[i,f]=m.useState({}),[h,b]=m.useState("idle"),[d,w]=m.useState(""),y=m.useRef(null),W=m.useRef(null);m.useEffect(()=>{var p;(p=y.current)==null||p.focus();const s=u=>u.key==="Escape"&&t();return document.addEventListener("keydown",s),()=>document.removeEventListener("keydown",s)},[t]);function x(s,p){const u={...a,[s]:p};if(o(u),i[s]){const N=$(u);c(k=>({...k,[s]:N[s]}))}}function v(s){f(u=>({...u,[s]:!0}));const p=$(a);c(u=>({...u,[s]:p[s]}))}async function L(s){var N,k,A;if(s.preventDefault(),(((N=W.current)==null?void 0:N.value)??"").trim()!==""){b("success");return}const p=Object.fromEntries(Object.keys(a).map(j=>[j,!0]));f(p);const u=$(a);if(c(u),!(Object.keys(u).length>0)){b("loading"),w("");try{await I(e,a),b("success"),(k=e.onSuccess)==null||k.call(e)}catch(j){const z=j instanceof Error?j:new Error("Ein unbekannter Fehler ist aufgetreten.");w(z.message),b("error"),(A=e.onError)==null||A.call(e,z)}}}const U=e.companyName?`Widerruf – ${e.companyName}`:"Widerrufsformular";return r.jsx("div",{className:"wrb-overlay",role:"dialog","aria-modal":"true","aria-labelledby":"wrb-title",onClick:s=>s.target===s.currentTarget&&t(),children:r.jsxs("div",{className:"wrb-modal",children:[r.jsxs("div",{className:"wrb-modal-header",children:[r.jsx("h2",{className:"wrb-modal-title",id:"wrb-title",children:U}),r.jsx("button",{className:"wrb-close-btn",onClick:t,"aria-label":"Schließen",type:"button",children:"✕"})]}),h==="success"?r.jsxs("div",{className:"wrb-modal-body",children:[r.jsxs("div",{className:"wrb-success",children:[r.jsx("span",{className:"wrb-success-icon",children:"✓"}),r.jsx("h3",{children:"Widerruf eingegangen"}),r.jsxs("p",{children:["Ihr Widerruf wurde erfolgreich übermittelt. Sie erhalten in Kürze eine Bestätigung an ",r.jsx("strong",{children:a.email}),"."]})]}),r.jsx(C,{config:e})]}):r.jsxs("div",{className:"wrb-modal-body",children:[e.introText&&r.jsx("p",{className:"wrb-intro",children:e.introText}),h==="error"&&d&&r.jsx("div",{className:"wrb-alert wrb-alert-error",role:"alert",children:d}),r.jsxs("form",{onSubmit:L,noValidate:!0,children:[r.jsx(g,{label:"Vorname",required:!0,error:i.firstName?n.firstName:void 0,children:r.jsx("input",{ref:y,className:`wrb-input${i.firstName&&n.firstName?" wrb-error":""}`,type:"text",autoComplete:"given-name",value:a.firstName,onChange:s=>x("firstName",s.target.value),onBlur:()=>v("firstName"),placeholder:"Max"})}),r.jsx(g,{label:"Nachname",required:!0,error:i.lastName?n.lastName:void 0,children:r.jsx("input",{className:`wrb-input${i.lastName&&n.lastName?" wrb-error":""}`,type:"text",autoComplete:"family-name",value:a.lastName,onChange:s=>x("lastName",s.target.value),onBlur:()=>v("lastName"),placeholder:"Mustermann"})}),r.jsx(g,{label:"E-Mail-Adresse",required:!0,hint:"An diese Adresse senden wir Ihnen die Eingangsbestätigung.",error:i.email?n.email:void 0,children:r.jsx("input",{className:`wrb-input${i.email&&n.email?" wrb-error":""}`,type:"email",autoComplete:"email",value:a.email,onChange:s=>x("email",s.target.value),onBlur:()=>v("email"),placeholder:"name@beispiel.de"})}),r.jsx(g,{label:"Rechnungs- / Lieferschein- / Auftragsnummer",required:!0,error:i.orderNumber?n.orderNumber:void 0,children:r.jsx("input",{className:`wrb-input${i.orderNumber&&n.orderNumber?" wrb-error":""}`,type:"text",value:a.orderNumber,onChange:s=>x("orderNumber",s.target.value),onBlur:()=>v("orderNumber"),placeholder:"z.B. RE123456"})}),r.jsx(g,{label:"Widerrufsgrund",hint:"Freiwillige Angabe – ein Widerruf ist ohne Angabe von Gründen möglich.",children:r.jsx("textarea",{className:"wrb-textarea",value:a.reason,onChange:s=>x("reason",s.target.value),placeholder:"Optional",rows:2})}),r.jsxs("div",{className:"wrb-hp","aria-hidden":"true",children:[r.jsx("label",{children:"Website (leer lassen)"}),r.jsx("input",{ref:W,type:"text",name:"wrbWebsite",tabIndex:-1,autoComplete:"off",defaultValue:""})]}),r.jsxs("div",{className:"wrb-actions",children:[r.jsx("button",{type:"button",className:"wrb-cancel-btn",onClick:t,children:e.cancelLabel??"Abbrechen"}),r.jsx("button",{type:"submit",className:"wrb-submit-btn",disabled:h==="loading",children:h==="loading"?"Wird gesendet…":e.submitLabel??"Absenden"})]})]}),r.jsx(C,{config:e})]})]})})}function g({label:e,required:t,hint:a,error:o,children:n}){return r.jsxs("div",{className:"wrb-field",children:[r.jsxs("label",{className:"wrb-label",children:[e,t&&r.jsx("span",{className:"wrb-required","aria-hidden":"true",children:"*"})]}),n,a&&!o&&r.jsx("p",{className:"wrb-hint",children:a}),o&&r.jsx("p",{className:"wrb-field-error",role:"alert",children:o})]})}function C({config:e}){return e.privacyUrl?r.jsx("div",{className:"wrb-legal-links",children:r.jsx("a",{href:e.privacyUrl,className:"wrb-legal-link",target:"_blank",rel:"noopener noreferrer",children:e.privacyLabel??"Datenschutz"})}):null}const E=`
|
|
2
2
|
/* Widerrufsbutton widget — prefix: wrb- */
|
|
3
3
|
.wrb-btn {
|
|
4
4
|
display: inline-flex;
|
|
@@ -227,10 +227,22 @@
|
|
|
227
227
|
color: #374151;
|
|
228
228
|
text-decoration: underline;
|
|
229
229
|
}
|
|
230
|
-
|
|
230
|
+
|
|
231
|
+
/* Honeypot — off-screen, never visible, not tabbable */
|
|
232
|
+
.wrb-hp {
|
|
233
|
+
position: absolute !important;
|
|
234
|
+
left: -10000px !important;
|
|
235
|
+
top: auto !important;
|
|
236
|
+
width: 1px !important;
|
|
237
|
+
height: 1px !important;
|
|
238
|
+
overflow: hidden !important;
|
|
239
|
+
opacity: 0 !important;
|
|
240
|
+
pointer-events: none !important;
|
|
241
|
+
}
|
|
242
|
+
`;function P(){const e="wrb-styles";if(document.getElementById(e))return;const t=document.createElement("style");t.id=e,t.textContent=E,document.head.appendChild(t)}function q(e){e.dataset.wrbUpgraded||(e.dataset.wrbUpgraded="true",e.addEventListener("submit",async t=>{t.preventDefault();const a=e.querySelector('.wrb-submit-btn, button[type="submit"]'),o=(a==null?void 0:a.textContent)??"";a&&(a.disabled=!0,a.textContent="Wird gesendet…");const n=new FormData(e);if(String(n.get("wrbWebsite")??"").trim()!==""){e.reset(),location.hash="#wrb-success",a&&(a.disabled=!1,a.textContent=o);return}const c=String(n.get("action")??""),i={firstName:String(n.get("firstName")??""),lastName:String(n.get("lastName")??""),email:String(n.get("email")??""),orderNumber:String(n.get("orderNumber")??""),reason:String(n.get("reason")??"")};e.dataset.companyName&&(i.companyName=e.dataset.companyName),e.dataset.senderEmail&&(i.senderEmail=e.dataset.senderEmail);const f={"Content-Type":"application/json"};e.dataset.authToken&&(f.Authorization=`Bearer ${e.dataset.authToken}`);const h=e.getAttribute("action")??"";try{const b=await fetch(h,{method:"PATCH",headers:f,body:JSON.stringify({action:c,payload:i})});let d=null;try{d=await b.json()}catch{}if(!(d&&typeof d=="object"&&"ok"in d?d.ok!==!1:b.ok)){const y=d&&typeof d=="object"&&"message"in d?String(d.message??""):"";throw new Error(y||`Server antwortete mit Status ${b.status}`)}e.reset(),location.hash="#wrb-success"}catch(b){const d=b instanceof Error?b:new Error("Unbekannter Fehler"),w=document.querySelector("#wrb-error .wrb-alert");w&&(w.textContent=d.message),location.hash="#wrb-error"}finally{a&&(a.disabled=!1,a.textContent=o)}}))}function F(){typeof document>"u"||document.querySelectorAll("#wrb-modal form").forEach(q)}function D({config:e}){const[t,a]=m.useState(!1);return m.useEffect(()=>{P(),F()},[]),r.jsxs(r.Fragment,{children:[r.jsx("button",{type:"button",className:`wrb-btn${e.buttonClass?` ${e.buttonClass}`:""}`,onClick:()=>a(!0),children:e.buttonLabel??"Vertrag widerrufen"}),t&&O.createPortal(r.jsx(T,{config:e,onClose:()=>a(!1)}),document.body)]})}function l(e){return e.replace(/&/g,"&").replace(/</g,"<").replace(/>/g,">").replace(/"/g,""")}function S(e){if(!e.privacyUrl)return"";const t=l(e.privacyLabel??"Datenschutz");return`
|
|
231
243
|
<div class="wrb-legal-links">
|
|
232
244
|
<a href="${l(e.privacyUrl)}" class="wrb-legal-link" rel="noopener noreferrer">${t}</a>
|
|
233
|
-
</div>`}function
|
|
245
|
+
</div>`}function M(e){const t=[];return e.companyName&&t.push(`data-company-name="${l(e.companyName)}"`),e.senderEmail&&t.push(`data-sender-email="${l(e.senderEmail)}"`),e.authToken&&t.push(`data-auth-token="${l(e.authToken)}"`),t.length?" "+t.join(" "):""}function B(e,t="",a=""){const o=l(e.successUrl??t),n=l(e.errorUrl??a);return`
|
|
234
246
|
<div class="wrb-field">
|
|
235
247
|
<label class="wrb-label">
|
|
236
248
|
Vorname <span class="wrb-required" aria-hidden="true">*</span>
|
|
@@ -251,16 +263,15 @@
|
|
|
251
263
|
</label>
|
|
252
264
|
<input class="wrb-input" type="email" name="email" autocomplete="email"
|
|
253
265
|
placeholder="name@beispiel.de" required>
|
|
254
|
-
<p class="wrb-hint"
|
|
266
|
+
<p class="wrb-hint"An diese Adresse senden wir Ihnen die Eingangsbestätigung.</p>
|
|
255
267
|
</div>
|
|
256
268
|
<div class="wrb-field">
|
|
257
269
|
<label class="wrb-label">
|
|
258
|
-
|
|
270
|
+
Rechnungs- / Lieferschein- / Auftragsnummer
|
|
259
271
|
<span class="wrb-required" aria-hidden="true">*</span>
|
|
260
272
|
</label>
|
|
261
273
|
<input class="wrb-input" type="text" name="orderNumber"
|
|
262
|
-
placeholder="z.B.
|
|
263
|
-
<p class="wrb-hint">Zu finden in Ihrer Bestellbestätigung.</p>
|
|
274
|
+
placeholder="z.B. RE123456" required>
|
|
264
275
|
</div>
|
|
265
276
|
<div class="wrb-field">
|
|
266
277
|
<label class="wrb-label">Widerrufsgrund</label>
|
|
@@ -271,7 +282,11 @@
|
|
|
271
282
|
</div>
|
|
272
283
|
<input type="hidden" name="action" value="${l(e.action)}">
|
|
273
284
|
${o?`<input type="hidden" name="successUrl" value="${o}">`:""}
|
|
274
|
-
${n?`<input type="hidden" name="errorUrl" value="${n}">`:""}
|
|
285
|
+
${n?`<input type="hidden" name="errorUrl" value="${n}">`:""}
|
|
286
|
+
<div class="wrb-hp" aria-hidden="true">
|
|
287
|
+
<label>Website (leer lassen)</label>
|
|
288
|
+
<input type="text" name="wrbWebsite" tabindex="-1" autocomplete="off" value="">
|
|
289
|
+
</div>`}function H(e){const t=e.companyName?`Widerruf – ${l(e.companyName)}`:"Widerrufsformular",a=l(e.formAction??e.apiUrl??"/rest/v1/apiCancellation");return`<!DOCTYPE html>
|
|
275
290
|
<html lang="de">
|
|
276
291
|
<head>
|
|
277
292
|
<meta charset="UTF-8">
|
|
@@ -300,8 +315,8 @@
|
|
|
300
315
|
</div>
|
|
301
316
|
<div class="wrb-modal-body">
|
|
302
317
|
${e.introText?`<p class="wrb-intro">${l(e.introText)}</p>`:""}
|
|
303
|
-
<form method="POST" action="${a}"${
|
|
304
|
-
${
|
|
318
|
+
<form method="POST" action="${a}"${M(e)}>
|
|
319
|
+
${B(e)}
|
|
305
320
|
<div class="wrb-actions">
|
|
306
321
|
<button type="submit" class="wrb-submit-btn">
|
|
307
322
|
${l(e.submitLabel??"Absenden")}
|
|
@@ -313,7 +328,7 @@
|
|
|
313
328
|
</div>
|
|
314
329
|
</div>
|
|
315
330
|
</body>
|
|
316
|
-
</html>`}function
|
|
331
|
+
</html>`}function V(e,{inlineStyles:t=!0}={}){const a=e.companyName?`Widerruf – ${l(e.companyName)}`:"Widerrufsformular",o=l(e.formAction??e.apiUrl??"/rest/v1/apiCancellation"),n=`
|
|
317
332
|
#wrb-modal, #wrb-success, #wrb-error { display: none; }
|
|
318
333
|
#wrb-modal:target, #wrb-success:target, #wrb-error:target { display: flex; }`;return`${t?`<style>${n}
|
|
319
334
|
${E}</style>`:`<style>${n}</style>`}
|
|
@@ -327,8 +342,8 @@ ${E}</style>`:`<style>${n}</style>`}
|
|
|
327
342
|
</div>
|
|
328
343
|
<div class="wrb-modal-body">
|
|
329
344
|
${e.introText?`<p class="wrb-intro">${l(e.introText)}</p>`:""}
|
|
330
|
-
<form method="POST" action="${o}"${
|
|
331
|
-
${
|
|
345
|
+
<form method="POST" action="${o}"${M(e)}>
|
|
346
|
+
${B(e,"#wrb-success","#wrb-error")}
|
|
332
347
|
<div class="wrb-actions">
|
|
333
348
|
<a href="#" class="wrb-cancel-btn">${l(e.cancelLabel??"Abbrechen")}</a>
|
|
334
349
|
<button type="submit" class="wrb-submit-btn">
|
|
@@ -353,8 +368,10 @@ ${E}</style>`:`<style>${n}</style>`}
|
|
|
353
368
|
<span class="wrb-success-icon">✓</span>
|
|
354
369
|
<h3>Widerruf eingegangen</h3>
|
|
355
370
|
<p>
|
|
356
|
-
Ihr Widerruf wurde erfolgreich übermittelt.
|
|
357
|
-
|
|
371
|
+
Vielen Dank. Ihr Widerruf wurde erfolgreich an uns übermittelt.
|
|
372
|
+
</p>
|
|
373
|
+
<p>
|
|
374
|
+
Sie erhalten in Kürze eine Bestätigung per E-Mail. Wir werden Ihr Anliegen schnellstmöglich bearbeiten.
|
|
358
375
|
</p>
|
|
359
376
|
</div>
|
|
360
377
|
${S(e)}
|
|
@@ -381,4 +398,4 @@ ${E}</style>`:`<style>${n}</style>`}
|
|
|
381
398
|
${S(e)}
|
|
382
399
|
</div>
|
|
383
400
|
</div>
|
|
384
|
-
</div>`}exports.WiderrufsModal=
|
|
401
|
+
</div>`}exports.WiderrufsModal=T;exports.WiderrufsWidget=D;exports.generateFallbackHtml=H;exports.generateModalHtml=V;exports.upgradeAllStaticForms=F;exports.upgradeStaticForm=q;
|