@paroicms/contact-form-plugin 0.11.1 → 0.12.0

package/backend/dist/contact-form-mail.js

@@ -16,19 +16,15 @@ async function sendContactFormMail(service, input, i18n) {
         if (!(await service.validateRecaptchaResponse(gRecaptchaResponse))) {
             throw new Error("invalid recaptcha response");
         }
-        const noSubject = i18n.translate({
-            key: "noSubject",
-            language: input.language,
-        });
-        const contactFrom = i18n.translate({
-            key: "contactFrom",
+        const defaultSubject = i18n.translate({
+            key: "defaultSubject",
             language: input.language,
             args: [service.fqdn],
         });
         await service.sendMail({
             to: contactEmail,
             replyTo: { email, name },
-            subject: `${subject ?? noSubject} ${contactFrom}`,
+            subject: subject ? `${subject} – ${defaultSubject}` : defaultSubject,
             html: `<p>${i18n.translate({
                 key: "nameIs",
                 language: input.language,

package/backend/locales/en.json

@@ -1,6 +1,5 @@
 {
-  "noSubject": "-no subject-",
-  "contactFrom": "(contact from $1)",
+  "defaultSubject": "Contact from $1",
   "nameIs": "<b>Name:</b> $1",
   "emailIs": "<b>E-mail:</b> $1",
   "sendUsAnEmailTo": "send us an e-mail to: $1",

package/backend/locales/fr.json

@@ -1,8 +1,7 @@
 {
-  "noSubject": "-sans sujet-",
-  "contactFrom": "(contact via $1)",
+  "defaultSubject": "Contact provenant de $1",
   "nameIs": "<b>Nom :</b> $1",
-  "emailIs": "<b>E-mail :</b> $1",
-  "sendUsAnEmailTo": "envoyez-nous un e-mail directement à : $1",
+  "emailIs": "<b>Courriel :</b> $1",
+  "sendUsAnEmailTo": "envoyez-nous un courriel directement à : $1",
   "sorryMessage": "désolé, le site est mal configuré"
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@paroicms/contact-form-plugin",
-  "version": "0.11.1",
+  "version": "0.12.0",
   "description": "Contact form plugin for ParoiCMS",
   "keywords": [
     "paroicms",
@@ -33,7 +33,7 @@
   },
   "devDependencies": {
     "@paroicms/public-anywhere-lib": "0.8.3",
-    "@paroicms/public-server-lib": "0.16.3",
+    "@paroicms/public-server-lib": "0.16.4",
     "@solid-primitives/i18n": "~2.1.1",
     "@types/node": "~20.14.8",
     "rimraf": "~6.0.1",

package/public-front/dist/public-front-plugin.mjs

@@ -1 +1 @@
-import{insert as c,setAttribute as p,createComponent as M,effect as f,template as $,render as re}from"https://esm.sh/solid-js@1.9.3/web";import{createMemo as oe,createSignal as i,Show as V,onMount as ce,onCleanup as le}from"https://esm.sh/solid-js@1.9.3";function ie(e){return e.varName?` for '${e.varName}'`:""}function de(e,s={}){if(e==null||e===""&&!s.allowEmpty)throw new Error(`Missing string value${ie(s)}`);return typeof e=="string"?e:e.toString()}var G=e=>e!=null&&(e=Object.getPrototypeOf(e),e===Array.prototype||e===Object.prototype);function Y(e,s,a){for(const[n,r]of Object.entries(s)){const m=`${a}.${n}`;e[m]=r,G(r)&&Y(e,r,m)}}function ue(e){const s={...e};for(const[a,n]of Object.entries(e))G(n)&&Y(s,n,a);return s}var me=(e,s)=>{if(s)for(const[a,n]of Object.entries(s))e=e.replace(new RegExp(`{{\\s*${a}\\s*}}`,"g"),n);return e},pe=e=>e;function ge(e,s=pe){return(a,...n)=>{a[0]==="."&&(a=a.slice(1));const r=e()?.[a];switch(typeof r){case"function":return r(...n);case"string":return s(r,n[0]);default:return r}}}const he="Name",fe="Email",be="Subject",ve="Message",Fe="Send",$e="The e-mail address on which we can reply to you",Ce="Your name",Ee="The subject of your message",ye="Enter your message here...",we="Unexpected error, the message could not be sent.",xe="Return Home",Se="Your message has been sent. If there is a response, it will be sent to the address",je={name:he,email:fe,subject:be,message:ve,send:Fe,emailPlaceholder:$e,namePlaceholder:Ce,subjectPlaceholder:Ee,messagePlaceholder:ye,unexpectedErrorMessage:we,returnHome:xe,successMessage:Se},Me="Nom",Pe="E-mail",_e="Sujet",Re="Message",Le="Envoyer",Te="L'adresse e-mail sur laquelle nous pourrons vous répondre",He="Votre nom",Oe="Le sujet de votre message",ke="Saisissez votre message",Ae="Erreur inattendue, le message n'a pas pu être envoyé.",Ie="Retourner à l'accueil",Ne="Votre message a été envoyé. S'il y a une réponse, elle sera envoyée à l'adresse",qe={name:Me,email:Pe,subject:_e,message:Re,send:Le,emailPlaceholder:Te,namePlaceholder:He,subjectPlaceholder:Oe,messagePlaceholder:ke,unexpectedErrorMessage:Ae,returnHome:Ie,successMessage:Ne},B={en:je,fr:qe};function Ue(e){const s=oe((()=>{const n=e in B?e:"en";return ue(B[n])}));return{t:ge(s,me)}}async function De(e,s,a){a(!0);try{const n=await Ve(e);return s.reset(),n}finally{a(!1)}}async function Ve(e){const s=await fetch("/api/plugin/contact-form",{headers:{"Content-Type":"application/json"},body:JSON.stringify(e),method:"POST"});if(s.status!==200){const n=await s.text();throw new Error(`Unexpected error: ${n}`)}return await s.json()}var Be=$("<div class=ContactForm-error>"),Ge=$('<div class="ContactForm-done ContactForm-ended"><div class=ContactForm-endedMessage><p></p><p></p></div><div class=ContactForm-endedActions><a class=BigBtn>'),Ye=$("<form class=ContactForm><div class=ContactForm-fieldGroup><label class=ContactFormField><span class=ContactFormField-label></span><input class=ContactFormField-input type=email name=email required></label><label class=ContactFormField><span class=ContactFormField-label></span><input class=ContactFormField-input type=text name=name required></label><label class=ContactFormField><span class=ContactFormField-label></span><input class=ContactFormField-input type=text name=subject></label><label class=ContactFormField><span class=ContactFormField-label></span><textarea class=ContactFormField-textarea rows=5 name=message required></textarea></label></div><div class=ContactForm-action><button type=submit class=ContactForm-btn>"),ze=$("<div class=ContactForm-captcha><div class=g-recaptcha data-callback=onRecaptchaSubmitted data-expired-callback=onRecaptchaExpired>");function Je({recaptchaKey:e,language:s,homeUrl:a}){const[n,r]=i(""),[m,z]=i(""),[P,J]=i(),[_,Q]=i(""),[W,X]=i(),[R,L]=i(!e),[T,C]=i(),[Z,H]=i(""),[K,ee]=i(!1),{t:o}=Ue(s),te=async l=>{try{if(l.preventDefault(),!R()||!b)throw new Error("Erreur de recaptcha");const d=await De({language:s,name:n(),subject:P(),message:_(),email:m(),gRecaptchaResponse:W()},b,ee);d.success?C(!0):(C(!1),H(d.message??o("unexpectedErrorMessage")))}catch{C(!1),H(o("unexpectedErrorMessage"))}},b=(()=>{var l=Ye(),d=l.firstChild,O=d.firstChild,k=O.firstChild,E=k.nextSibling,A=O.nextSibling,I=A.firstChild,y=I.nextSibling,N=A.nextSibling,q=N.firstChild,w=q.nextSibling,ae=N.nextSibling,U=ae.firstChild,x=U.nextSibling,S=d.nextSibling,j=S.firstChild;return l.addEventListener("submit",te),c(k,(()=>o("email"))),E.addEventListener("change",(t=>{z(t.currentTarget.value)})),c(I,(()=>o("name"))),y.addEventListener("change",(t=>r(t.currentTarget.value))),c(q,(()=>o("subject"))),w.addEventListener("change",(t=>J(t.currentTarget.value))),c(U,(()=>o("message"))),x.addEventListener("change",(t=>Q(t.currentTarget.value))),c(l,e&&(()=>{var t=ze(),u=t.firstChild;return p(u,"data-sitekey",e),t})(),S),c(l,M(V,{get when(){return T()===!1},get children(){var t=Be();return c(t,Z),t}}),S),c(j,(()=>o("send"))),c(l,M(V,{get when(){return T()===!0},get children(){var t=Ge(),u=t.firstChild,g=u.firstChild,v=g.nextSibling,F=u.nextSibling,h=F.firstChild;return c(g,(()=>o("successMessage"))),c(v,m),p(h,"href",a),c(h,(()=>o("returnHome"))),t}}),null),f((t=>{var u=o("emailPlaceholder"),g=o("namePlaceholder"),v=o("subjectPlaceholder"),F=o("messagePlaceholder"),h=!!K(),D=!R();return u!==t.e&&p(E,"placeholder",t.e=u),g!==t.t&&p(y,"placeholder",t.t=g),v!==t.a&&p(w,"placeholder",t.a=v),F!==t.o&&p(x,"placeholder",t.o=F),h!==t.i&&j.classList.toggle("inProgress",t.i=h),D!==t.n&&(j.disabled=t.n=D),t}),{e:void 0,t:void 0,a:void 0,o:void 0,i:void 0,n:void 0}),f((()=>E.value=m())),f((()=>y.value=n())),f((()=>w.value=P()??"")),f((()=>x.value=_())),l})();return ce((()=>{e&&(window.onRecaptchaSubmitted=se,window.onRecaptchaExpired=ne)})),le((()=>{e&&(window.onRecaptchaSubmitted=void 0,window.onRecaptchaExpired=void 0)})),b;function se(l){if(!l)return;L(!0);const d=b?.elements.namedItem("g-recaptcha-response");X(d.value)}function ne(){L(!1)}}function Qe(e,{language:s}){if(!s)throw new Error("Missing language");const a=e.dataset.recaptchaKey,n=de(e.dataset.homeUrl),r=document.createElement("script");r.setAttribute("src","https://www.google.com/recaptcha/api.js"),document.head.appendChild(r),re((()=>M(Je,{recaptchaKey:a,language:s,homeUrl:n})),e)}document.addEventListener("DOMContentLoaded",(()=>{const e=document.documentElement.lang,s=document.querySelector("[data-effect='contactForm']");s&&Qe(s,{language:e})}));
+import{template as F,insert as c,setAttribute as h,createComponent as M,effect as $,render as K}from"https://esm.sh/solid-js@1.9.3/web";import{createMemo as ee,createSignal as d,Show as D,onMount as te,onCleanup as se}from"https://esm.sh/solid-js@1.9.3";function ne(e){return e.varName?` for '${e.varName}'`:""}function ae(e,t={}){if(e==null||e===""&&!t.allowEmpty)throw new Error(`Missing string value${ne(t)}`);return typeof e=="string"?e:e.toString()}var N=e=>e!=null&&(e=Object.getPrototypeOf(e),e===Array.prototype||e===Object.prototype);function U(e,t,a){for(const[n,r]of Object.entries(t)){const m=`${a}.${n}`;e[m]=r,N(r)&&U(e,r,m)}}function re(e){const t={...e};for(const[a,n]of Object.entries(e))N(n)&&U(t,n,a);return t}var oe=(e,t)=>{if(t)for(const[a,n]of Object.entries(t))e=e.replace(new RegExp(`{{\\s*${a}\\s*}}`,"g"),n);return e},ce=e=>e;function le(e,t=ce){return(a,...n)=>{a[0]==="."&&(a=a.slice(1));const r=e()?.[a];switch(typeof r){case"function":return r(...n);case"string":return t(r,n[0]);default:return r}}}const ie="Name",de="Email",ue="Subject",me="Message",ge="Send",pe="johndoe@gmail.com",he="John Doe",fe="The subject of your message",be="Enter your message here…",ve="Unexpected error, the message could not be sent.",$e="Return Home",Fe="Your message has been sent. If there is a response, it will be sent to the address:",Ce={name:ie,email:de,subject:ue,message:me,send:ge,emailPlaceholder:pe,namePlaceholder:he,subjectPlaceholder:fe,messagePlaceholder:be,unexpectedErrorMessage:ve,returnHome:$e,successMessage:Fe},Ee="Nom",we="Courriel",ye="Sujet",xe="Message",Se="Envoyer",Me="johndoe@gmail.com",Pe="John Doe",je="Le sujet de votre message",_e="Saisissez votre message…",Re="Erreur inattendue, le message n'a pas pu être envoyé.",He="Retourner à l'accueil",Le="Votre message a été envoyé. S'il y a une réponse, elle sera envoyée à l'adresse :",Oe={name:Ee,email:we,subject:ye,message:xe,send:Se,emailPlaceholder:Me,namePlaceholder:Pe,subjectPlaceholder:je,messagePlaceholder:_e,unexpectedErrorMessage:Re,returnHome:He,successMessage:Le},I={en:Ce,fr:Oe};function Te(e){const t=ee((()=>{const n=e in I?e:"en";return re(I[n])}));return{t:le(t,oe)}}async function ke(e,t,a){a(!0);try{const n=await Ae(e);return t.reset(),n}finally{a(!1)}}async function Ae(e){const t=await fetch("/api/plugin/contact-form",{headers:{"Content-Type":"application/json"},body:JSON.stringify(e),method:"POST"});if(t.status!==200){const n=await t.text();throw new Error(`Unexpected error: ${n}`)}return await t.json()}var De=F("<div class=ContactForm-error>"),Ie=F('<div class="ContactForm-done ContactForm-ended"><div class=ContactForm-endedMessage><p></p><p></p></div><div class=ContactForm-endedActions><a class=BigBtn>'),Ne=F("<form class=ContactForm><div class=ContactForm-fieldGroup><label class=ContactFormField><span class=ContactFormField-label></span><input class=ContactFormField-input type=text name=name required></label><label class=ContactFormField><span class=ContactFormField-label></span><input class=ContactFormField-input type=email name=email required></label><label class=ContactFormField><span class=ContactFormField-label></span><textarea class=ContactFormField-textarea rows=5 name=message required></textarea></label></div><div class=ContactForm-action><button type=submit class=ContactForm-btn>"),Ue=F("<div class=ContactForm-captcha><div class=g-recaptcha data-callback=onRecaptchaSubmitted data-expired-callback=onRecaptchaExpired>");function qe({recaptchaKey:e,language:t,homeUrl:a}){const[n,r]=d(""),[m,q]=d(""),[P,J]=d(""),[B,G]=d(),[j,_]=d(!e),[R,C]=d(),[V,H]=d(""),[z,Y]=d(!1),{t:o}=Te(t),Q=async l=>{try{if(l.preventDefault(),!j()||!f)throw new Error("Erreur de recaptcha");const i=await ke({language:t,name:n(),message:P(),email:m(),gRecaptchaResponse:B()},f,Y);i.success?C(!0):(C(!1),H(i.message??o("unexpectedErrorMessage")))}catch{C(!1),H(o("unexpectedErrorMessage"))}},f=(()=>{var l=Ne(),i=l.firstChild,L=i.firstChild,O=L.firstChild,E=O.nextSibling,T=L.nextSibling,k=T.firstChild,w=k.nextSibling,Z=T.nextSibling,A=Z.firstChild,y=A.nextSibling,x=i.nextSibling,S=x.firstChild;return l.addEventListener("submit",Q),c(O,(()=>o("name"))),E.addEventListener("change",(s=>r(s.currentTarget.value))),c(k,(()=>o("email"))),w.addEventListener("change",(s=>{q(s.currentTarget.value)})),c(A,(()=>o("message"))),y.addEventListener("change",(s=>J(s.currentTarget.value))),c(l,e&&(()=>{var s=Ue(),u=s.firstChild;return h(u,"data-sitekey",e),s})(),x),c(l,M(D,{get when(){return R()===!1},get children(){var s=De();return c(s,V),s}}),x),c(S,(()=>o("send"))),c(l,M(D,{get when(){return R()===!0},get children(){var s=Ie(),u=s.firstChild,g=u.firstChild,b=g.nextSibling,v=u.nextSibling,p=v.firstChild;return c(g,(()=>o("successMessage"))),c(b,m),h(p,"href",a),c(p,(()=>o("returnHome"))),s}}),null),$((s=>{var u=o("namePlaceholder"),g=o("emailPlaceholder"),b=o("messagePlaceholder"),v=!!z(),p=!j();return u!==s.e&&h(E,"placeholder",s.e=u),g!==s.t&&h(w,"placeholder",s.t=g),b!==s.a&&h(y,"placeholder",s.a=b),v!==s.o&&S.classList.toggle("inProgress",s.o=v),p!==s.i&&(S.disabled=s.i=p),s}),{e:void 0,t:void 0,a:void 0,o:void 0,i:void 0}),$((()=>E.value=n())),$((()=>w.value=m())),$((()=>y.value=P())),l})();return te((()=>{e&&(window.onRecaptchaSubmitted=W,window.onRecaptchaExpired=X)})),se((()=>{e&&(window.onRecaptchaSubmitted=void 0,window.onRecaptchaExpired=void 0)})),f;function W(l){if(!l)return;_(!0);const i=f?.elements.namedItem("g-recaptcha-response");G(i.value)}function X(){_(!1)}}function Je(e,{language:t}){if(!t)throw new Error("Missing language");const a=e.dataset.recaptchaKey,n=ae(e.dataset.homeUrl),r=document.createElement("script");r.setAttribute("src","https://www.google.com/recaptcha/api.js"),document.head.appendChild(r),K((()=>M(qe,{recaptchaKey:a,language:t,homeUrl:n})),e)}document.addEventListener("DOMContentLoaded",(()=>{const e=document.documentElement.lang,t=document.querySelector("[data-effect='contactForm']");t&&Je(t,{language:e})}));

package/public-front/dist/style.css

@@ -1 +1 @@
-.ContactForm{margin-bottom:30px;margin-left:auto;margin-right:auto;position:relative}.ContactForm-error{margin:50px 50px 0;padding:20px}.ContactForm-done{display:flex;inset:0;position:absolute}.ContactForm-action{display:flex;justify-content:center;margin-top:50px}@media (max-width: 800px){.ContactForm-action{margin-top:30px}}.ContactForm-ended{align-content:center;align-items:center;flex-direction:column;justify-content:center;padding:20px;text-align:center;transition:opacity .4s;width:100%}.ContactForm-endedMessage{max-width:500px;font-size:18px;line-height:1.5}.ContactForm-endedActions{display:flex;gap:10px;margin-top:50px}.ContactForm-fieldGroup>*{margin-bottom:20px}.ContactFormField{display:block}.ContactFormField-label{display:block;font-size:16px;margin-bottom:5px}.ContactFormField-input,.ContactFormField-textarea{font-size:16px;display:block;padding:8px;width:100%}.ContactForm-btn{border:2px solid #ddbe8b;display:inline-block;font-size:20px;padding:12px 40px;position:relative;text-align:center}.ContactForm-btn:disabled{cursor:not-allowed}.ContactForm-btn.inProgress{pointer-events:none}.ContactForm-btn.inProgress:before{animation:contactFormSpin 2s linear infinite;border-radius:50%;box-sizing:border-box;content:"";display:block;height:26px;position:absolute;right:6px;top:calc(50% - 13px);width:26px}@keyframes contactFormSpin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}
+.ContactForm{margin-bottom:30px;margin-left:auto;margin-right:auto;position:relative}.ContactForm-error{margin:50px 50px 0;padding:20px}.ContactForm-done{display:flex;inset:0;position:absolute}.ContactForm-action{display:flex;justify-content:center;margin-top:50px}@media (max-width: 800px){.ContactForm-action{margin-top:30px}}.ContactForm-ended{align-content:center;align-items:center;flex-direction:column;justify-content:center;padding:20px;text-align:center;transition:opacity .4s;width:100%}.ContactForm-endedMessage{max-width:500px;font-size:18px;line-height:1.5}.ContactForm-endedActions{display:flex;gap:10px;margin-top:50px}.ContactForm-fieldGroup>*{margin-bottom:20px}.ContactFormField{display:block}.ContactFormField-label{display:block;font-size:16px;margin-bottom:5px}.ContactFormField-input,.ContactFormField-textarea{font-size:16px;display:block;padding:8px;width:100%}.ContactForm-btn{text-align:center}.ContactForm-btn:disabled{cursor:not-allowed}.ContactForm-btn.inProgress{pointer-events:none}.ContactForm-btn.inProgress:before{animation:contactFormSpin 2s linear infinite;border-radius:50%;box-sizing:border-box;content:"";display:block;height:26px;position:absolute;right:6px;top:calc(50% - 13px);width:26px}@keyframes contactFormSpin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}