https://www.omroepbrabant.nl/_next/static/chunks/pages/contact-67529a4d4c6b8444.js

1(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[1364],{2385:e=>{e.exports={"file-input":"file-input_file-input__ZJ7cu",fileInput:"file-input_file-input__ZJ7cu",input:"file-input_input__weUgP","icon-media":"file-input_icon-media__Vf0to",iconMedia:"file-input_icon-media__Vf0to","button-content":"file-input_button-content__YfOBC",buttonContent:"file-input_button-content__YfOBC"}},5276:(e,t,r)=>{(window.__NEXT_P=window.__NEXT_P||[]).push(["/contact",function(){return r(25852)}])},9931:(e,t,r)=>{"use strict";r.d(t,{A:()=>n});let n=r(14232).createContext({errors:{},fields:{},validFields:{}})},14041:e=>{e.exports={"file-preview":"file-preview_file-preview__RkLNU",filePreview:"file-preview_file-preview__RkLNU",thumb:"file-preview_thumb__IoWX9",appear:"file-preview_appear__li1cB","use-icon":"file-preview_use-icon__OzJ4B",useIcon:"file-preview_use-icon__OzJ4B",icon:"file-preview_icon__Q_Evm","icon--audio":"file-preview_icon--audio__b8wCK",iconAudio:"file-preview_icon--audio__b8wCK","icon--other":"file-preview_icon--other__8whrx",iconOther:"file-preview_icon--other__8whrx",size:"file-preview_size__fYcJi",remove:"file-preview_remove__acYkf"}},25852:(e,t,r)=>{"use strict";r.r(t),r.d(t,{default:()=>P});var n=r(37876),i=r(3509),a=r(90916),o=r(89099),s=r(14232),l=r(74695),c=r(73999),u=r(43574),d=r(50284);function m(e){let t=(0,o.useRouter)();return s.useMemo(()=>{let r=t.query[e];return(Array.isArray(r)?r[0]:r)??null},[t,e])}var f=r(57911),p=r(9637),_=r(69302),h=r(2385),g=r.n(h);let v=e=>{let{error:t,fileTypes:r=["image","audio","video"],icon:i,label:a,maxMb:o=200,multiple:l=!0,name:u,onChange:d}=e,[m,f]=(0,s.useState)(t),h=(0,s.useRef)(null);function v(e){if(e.target&&e.target.files&&0!==e.target.files.length){var t;let n,i;m&&f(void 0),d((t=Array.from(e.target.files),n=[],i=t.filter(e=>{let t=[];return e.size/1024/1024<=o||t.push(`${c.A.form.errors.exceeded_file_size}, max ${o}MB`),r.includes(e.type.substr(0,e.type.indexOf("/")))||t.push(c.A.form.errors.wrong_file_type),!t.length||(n.push(`${e.name}: ${t.join(".")}`),!1)}),n.length&&f(n.join("\n")),i))}}function b(){h.current&&h.current.click()}return(0,s.useEffect)(()=>{t!==m&&f(t)},[t]),(0,n.jsx)(_.A,{error:m,children:e=>(0,n.jsxs)("div",{className:g().fileInput,children:[(0,n.jsx)(p.Ay,{variant:"transparent",onClick:b,children:(0,n.jsxs)("span",{className:g().buttonContent,children:["media"===i&&(0,n.jsx)("span",{className:g().iconMedia}),(0,n.jsx)("span",{children:a})]})}),(0,n.jsx)("input",{ref:h,className:g().input,id:e,type:"file",multiple:l,name:u,onChange:v})]})})};var b=r(15039),x=r.n(b),A=r(14041),j=r.n(A);let w=e=>{let{file:t,thumbSize:r=80}=e,i=-1!==t.type.indexOf("video/")?"video":-1!==t.type.indexOf("image/")?"image":-1!==t.type.indexOf("audio/")?"audio":"other",[a,o]=(0,s.useState)(),l=(0,s.useRef)(null),c="other"===i||"audio"===i,u=function(e){let t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:2;if(0===e)return"0 Bytes";let r=Math.floor(Math.log(e)/Math.log(1024));return`${parseFloat((e/1024**r).toFixed(t<0?0:t))} ${["Bytes","KB","MB","GB","TB","PB","EB","ZB","YB"][r]}`}(t.size);return(0,s.useEffect)(()=>{if("image"===i){let e=new FileReader;e.onload=e=>{var t;return o((null==e||null==(t=e.target)?void 0:t.result)||void 0)},e.readAsDataURL(t)}("video"===i||"audio"===i)&&o(URL.createObjectURL(t))},[i]),(0,n.jsxs)("div",{className:x()(j().thumb,{[j().useIcon]:c}),style:{width:r,height:r},title:`${t.name} - ${u}`,onMouseEnter:function(){l.current&&l.current.play()},onMouseLeave:function(){l.current&&l.current.pause()},children:["video"===i&&a&&(0,n.jsx)("video",{ref:l,loop:!0,width:r,height:r,children:(0,n.jsx)("source",{src:a})}),"audio"===i&&a&&(0,n.jsx)("audio",{ref:l,loop:!0,children:(0,n.jsx)("source",{src:a})}),"image"===i&&a&&(0,n.jsx)("img",{width:r,height:r,src:a,alt:"thumbnail preview"}),c&&(0,n.jsx)("div",{className:x()(j().icon,{[j().iconAudio]:"audio"===i,[j().iconOther]:"other"===i})}),"other"===i&&(0,n.jsx)("div",{className:j().size,children:u})]})},y=e=>{let{file:t,onRemove:r,thumbSize:i}=e;return(0,n.jsxs)("div",{className:j().filePreview,children:[(0,n.jsx)(w,{file:t,thumbSize:i}),(0,n.jsx)("button",{className:j().remove,type:"button",onClick:r,children:c.A.actions.remove})]})};var N=r(39963);let C=e=>{let{message:t,options:r}=e;return(0,n.jsx)(n.Fragment,{children:t.split(/{{|}}/g).map(e=>r&&"function"==typeof r[e]?(0,n.jsx)(s.Fragment,{children:r[e](e)},e):(0,n.jsx)(s.Fragment,{children:e},e))})};var M=r(26199),E=r(8353),I=r(81564),k=r(86547),F=r(36559),S=r.n(F);let B=e=>{let{categories:t}=e,r=(0,u.d)(e=>e.preferences.contactInfo),h=(0,u.d)(e=>e.preferences.contactInfoRemember),g=(0,o.useRouter)(),b=m("subject"),x=m("articleId"),[A,j]=s.useState(""),w=(0,u.d)(e=>e.device.layout),F=(0,f.A)(),B="PHONE"===w?6:9,O=s.useMemo(()=>F>519?487/4-B:(F-32)/4-B,[F,B]),q=s.useMemo(()=>({subject:b,articleId:x,category:A,email:r.email,files:[],message:"",name:r.name,phone:r.phone,public:r.public,remember:h,to:r.to||""}),[r,h,A,b,x]),[P,R]=s.useState(q),[z,$]=s.useState(""),[T,U]=s.useState(!1),[L,K]=s.useState(!1),[J,V]=s.useState("message"),D=(0,l.wA)(),Z=s.useMemo(()=>P.files.reduce((e,t)=>

1e+t.size,0)/1024/1024>200,[P.files]);function Y(e){return t=>{R({...P,[e]:t}),!1===T&&(U(!0),D((0,a.qv)("contactformulier",{number:"0",name:"invoer"})))}}function X(e){R({...P,files:[...P.files,...e]})}function Q(){let e=[];P.public||e.push(c.A.form.errors.required_agreement),P.to||e.push(c.A.form.errors.required_recipient),e&&$(e.join("<br />"))}async function G(e){let t;if(e.preventDefault(),!P.public)return;K(!0);let r=(t=new FormData,Object.keys(P).forEach(e=>{let r=P[e];"string"==typeof r&&t.append(e,r),("number"==typeof r||"boolean"==typeof r)&&t.append(e,JSON.stringify(r)),Array.isArray(r)&&r[0]&&r[0]instanceof File&&r.forEach((e,r)=>t.append(`file${r+1}`,e,e.name))}),t);$("");try{await i.Ay.post("contact",r),D((0,a.qv)("contactformulier",{number:"laatste",name:"formulier verzonden"})),D((0,d.AD)(P.remember)),D((0,d.r_)({email:P.remember&&P.email||"",name:P.remember&&P.name||"",phone:P.remember&&P.phone||"",public:P.remember&&P.public||!1,to:P.remember&&P.to||""})),V("success")}catch(e){$(e.message)}K(!1)}if(s.useEffect(()=>(T&&(window.onbeforeunload=()=>!0),()=>{window.onbeforeunload=()=>void 0}),[T]),s.useEffect(()=>{R({...P,...r,to:r.to||q.to,remember:h})},[r,h]),"success"===J)return(0,n.jsx)(M.A,{buttonLabel:c.A.contact.submit_form_success.button_label,title:c.A.contact.submit_form_success.title,imageType:"success",onButtonClick:()=>g.push("/")});let W=e=>{"Enter"===e.key&&e.preventDefault()};return(0,n.jsxs)("section",{className:S().contactPage,children:[(0,n.jsxs)("header",{children:["contact-info"===J&&(0,n.jsx)(p.Ay,{className:S().back,variant:"transparent",onClick:()=>V("message"),children:c.A.common.back}),"message"===J&&(0,n.jsxs)("h1",{className:S().title,children:[c.A.common.greeting,(0,n.jsxs)("span",{role:"img","aria-label":"wave",children:[" ","\uD83D\uDC4B"," "]}),c.A.contact.message_title]}),"contact-info"===J&&(0,n.jsx)("h1",{className:S().title,children:c.A.contact.contact_info_title})]}),(0,n.jsx)(N.A,{action:"/contact",method:"POST",encType:"multipart/form-data",className:S().contactForm,onSubmit:G,children:e=>(0,n.jsxs)("fieldset",{className:S().fieldset,children:[(0,n.jsx)("legend",{className:S().hide,children:c.A.accessibility.contact_page_legend}),P.articleId&&(0,n.jsx)("input",{type:"hidden",name:"articleId",value:P.articleId}),"message"===J&&(0,n.jsxs)(n.Fragment,{children:[(0,n.jsx)(I.A,{required:!0,name:"message",label:c.A.form.message,value:P.message,placeholder:"Typ hier je bericht...",disabled:!1,requiredMessage:c.A.form.errors.required_message,multiline:5,onChange:Y("message")}),P.files.length>0&&(0,n.jsx)("div",{className:S().preview,children:P.files.map((e,t)=>(0,n.jsx)(y,{file:e,thumbSize:O,onRemove:()=>{R({...P,files:[...P.files.slice(0,t),...P.files.slice(t+1)]})}},`${e.name}_${e.lastModified}`))}),(0,n.jsx)(v,{error:Z?`${c.A.form.errors.exceeded_total_file_size}, max 200MB`:void 0,icon:"media",label:c.A.form.file,maxMb:200,name:"file",onChange:X}),(0,n.jsx)(p.Ay,{className:S().submit,disabled:0===P.message.length||Z,onClick:()=>V("contact-info"),children:c.A.common.continue})]}),"contact-info"===J&&(0,n.jsxs)(n.Fragment,{children:[(0,n.jsx)(I.A,{required:!0,name:"name",label:c.A.form.name,value:P.name,placeholder:c.A.form.placeholder.name,disabled:!1,requiredMessage:c.A.form.errors.required_name,onChange:Y("name")}),(0,n.jsx)(I.A,{name:"phone",label:c.A.form.phone,value:P.phone,placeholder:c.A.form.placeholder.phone,invalidMessage:c.A.form.errors.invalid_phone,onChange:Y("phone"),disabled:!1,pattern:"^([0-9\\+\\s\\-]){5,18}$"}),(0,n.jsx)(I.A,{required:!0,name:"email",type:"email",label:c.A.form.email,value:P.email,placeholder:c.A.form.placeholder.email,invalidMessage:c.A.form.errors.invalid_email,requiredMessage:c.A.form.errors.invalid_email,onChange:Y("email"),disabled:!1,pattern:"[^@]+@[^\\.]+\\..+"}),t&&t.length>0&&(0,n.jsx)(_.A,{label:c.A.form.to,children:()=>(0,n.jsx)("div",{className:S().to,children:(0,n.jsxs)("fieldset",{className:S().fieldset,children:[(0,n.jsx)("legend",{className:S().hide,children:c.A.form.to}),t.map(e=>(0,n.jsx)(p.Ay,{variant:P.to===e?"default":"transparent",current:P.to===e,onClick:()=>R({...P,to:e}),children:e}))]})})}),(0,n.jsx)("div",{className:S().toggle,onKeyDown:e=>W(e),children:(0,n.jsx)(k.A,{id:"public",label:(0,n.jsx)(C,{message:c.A.form.agree_terms_and_conditions,options:{"algemene voorwaarden":e=>(0,n.jsx)(E.A,{url:"/actievoorwaarden",navigation:"content:terms and conditions",children:e})}}),toggled:P.public,onChange:()=>R({...P,public:!P.public})})}),(0,n.jsx)("div",{className:S().toggle,onKeyDown:e=>W(e),children:(0,n.jsx)(k.A,{id:"remember",label:c.A.form.remember_contact,toggled:P.remember,onChange:()=>R({...P,remember:!P.remember})})}),(0,n.jsx)(_.A,{error:z,children:()=>(0,n.jsx)(p.Ay,{className:S().submit,disabled:!e||!P.public||!P.to,type:"submit",busy:L,onDisabledClick:Q,children:c.A.common.send})})]})]})})]})};var O=r(83241);let q=e=>{let{categories:t}=e;return(0,n.jsx)(B,{categories:t})};q.getInitialProps=async()=>({categories:(await i.Ay.get("info/contact")).categories,meta:{title:"Contact"},pageview:(0,a.Ap)("contact","contact formulier"),smartPageTag:{chapter1:"contact",name:"index"}});let P=(0,O.A)(q)},30131:e=>{e.exports={wrapper:"text-input_wrapper__Jjj95",input:"text-input_input__mXF

1IJ","has-icon":"text-input_has-icon__AsKVz",hasIcon:"text-input_has-icon__AsKVz",icon:"text-input_icon__syhs8","icon--search":"text-input_icon--search__vMbUZ",iconSearch:"text-input_icon--search__vMbUZ"}},31111:e=>{e.exports={"form-control":"form-control_form-control__ou52R",formControl:"form-control_form-control__ou52R","no-margin":"form-control_no-margin__ohvgt",noMargin:"form-control_no-margin__ohvgt",label:"form-control_label__aEIS5",error:"form-control_error__UIIVg"}},36559:e=>{e.exports={"contact-page":"contact-page_contact-page__Qx_vp",contactPage:"contact-page_contact-page__Qx_vp",title:"contact-page_title__GKoWt",fieldset:"contact-page_fieldset__YEUT1",intro:"contact-page_intro__7rkZA",information:"contact-page_information__Oc0Ld",preview:"contact-page_preview__ZIzdf",submit:"contact-page_submit__4hFXG",to:"contact-page_to__beKn4",toggle:"contact-page_toggle__C4BAU",back:"contact-page_back__w3JnN",hide:"contact-page_hide__7Q67b"}},39963:(e,t,r)=>{"use strict";r.d(t,{A:()=>s});var n=r(37876),i=r(14232),a=r(73999),o=r(9931);let s=e=>{let{action:t,children:r,className:s,encType:l,method:c,onSubmit:u}=e,[d,m]=(0,i.useState)({}),[f,p]=(0,i.useState)({}),[_,h]=(0,i.useState)({}),g=(0,i.useRef)({}),v=(0,i.useRef)({}),b=(0,i.useRef)({}),x=Object.keys(f).every(e=>{let t=v.current[e],r=b.current[e];return void 0!==r?r:!t.required});function A(e,t){let r,n=v.current[e];n&&(n.required&&""===t&&(r=n.requiredMessage||a.A.form.errors.required),n.pattern&&t&&t.length>0&&!n.pattern.value.test(t)&&(r=n.pattern.message?n.pattern.message:a.A.form.errors.invalid_general),g.current[e]=r,b.current[e]=!r,m({...g.current}),h({...b.current}))}return(0,n.jsx)(o.A.Provider,{value:{errors:d,fields:f,setField:function(e,t){v.current={...v.current,[e]:t},p(v.current)},setValidField:function(e,t){b.current[e]=t,h({...b.current})},validate:A,validFields:_},children:(0,n.jsx)("form",{action:t,className:s,encType:l,method:c,onSubmit:u,children:r&&r(x,function(){m({}),h({}),g.current={},b.current={}},A)})})}},57911:(e,t,r)=>{"use strict";r.d(t,{A:()=>a});var n=r(14232);let i=()=>window.innerWidth;function a(){let e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:100,[t,r]=(0,n.useState)(i),a=(0,n.useCallback)(()=>{r(i())},[]);return(0,n.useEffect)(()=>{let t,r=()=>{clearTimeout(t),t=setTimeout(a,e)};return window.addEventListener("resize",r,{passive:!0}),()=>{window.removeEventListener("resize",r),clearTimeout(t)}},[a,e]),t}},69302:(e,t,r)=>{"use strict";r.d(t,{A:()=>l});var n=r(37876),i=r(25121),a=r(36863),o=r(31111),s=r.n(o);let l=e=>{let{children:t,error:r,label:o,required:l,noMargin:c}=e,u=(0,i.p)(),d=(0,a.cx)(s().formControl,c&&s().noMargin);return(0,n.jsxs)("div",{className:d,children:[o&&(0,n.jsxs)("label",{className:s().label,htmlFor:u,children:[o,l?(0,n.jsx)("span",{children:"\xa0*"}):null]}),t(o?u:void 0),(0,n.jsx)("div",{role:"alert",children:r&&(0,n.jsx)("div",{className:s().error,dangerouslySetInnerHTML:{__html:r}})})]})}},81564:(e,t,r)=>{"use strict";r.d(t,{A:()=>m});var n=r(37876),i=r(15039),a=r.n(i),o=r(14232),s=r(59957),l=r(9931),c=r(69302),u=r(30131),d=r.n(u);let m=e=>{let{disabled:t,error:r,icon:i,invalidMessage:u,label:m,multiline:f,name:p,onChange:_,onKeyUp:h,placeholder:g,required:v,requiredMessage:b,type:x="text",pattern:A,value:j,noMargin:w,autocomplete:y=!0}=e,{error:N,fieldClassname:C,validate:M,validateOnBlur:E}=function(e){let{invalidMessage:t,name:r,pattern:n,required:i,requiredMessage:a}=e,s=(0,o.useContext)(l.A),c=s.errors[r],u=s.validFields[r],d=function(e){if(void 0!==e)return e?"valid":"invalid"}(u);function m(e){"function"==typeof s.validate&&s.validate(r,e)}return(0,o.useEffect)(()=>{"function"==typeof s.setField&&s.setField(r,{pattern:n?{value:new RegExp(n),message:t}:void 0,required:i,requiredMessage:a})},[r,n,i]),{error:c,fieldClassname:d,setValidField:function(e,t){"function"==typeof s.setValidField&&s.setValidField(e,t)},valid:u,validate:m,validateOnBlur:function(e){m(e.currentTarget.value)}}}({invalidMessage:u,name:p,pattern:A,required:v,requiredMessage:b}),I=(0,o.useRef)(!1),k=f?"textarea":"input",F=d().input;return i&&(F=a()(F,d().hasIcon)),(0,o.useEffect)(()=>{!I.current&&j&&M(j)}

1,[j]),(0,n.jsx)(c.A,{label:m,error:r||N,required:v,noMargin:w,children:e=>(0,n.jsxs)("div",{className:a()(d().wrapper,i&&d().hasIcon),children:[i&&(0,n.jsx)("div",{className:a()(d().icon,d()[`icon${(0,s.A)(i)}`])}),(0,n.jsx)(k,{autoComplete:y?"on":"off",id:e,type:x,className:a()(F,C),name:p,value:j,required:v,disabled:t,pattern:A,rows:"number"==typeof f?f:void 0,placeholder:g,onChange:e=>_(e.target.value),onBlur:e=>{E(e),I.current=!1},onFocus:()=>{I.current=!0},onKeyUp:h})]})})}},83241:(e,t,r)=>{"use strict";r.d(t,{A:()=>l,P:()=>s});var n=r(37876);r(14232);var i=r(90916),a=r(97020),o=r(1292);function s(e,t){var r;let n=(null==(r=e.response)?void 0:r.status)||500;n<400&&(n=500),t.res&&(t.res.statusCode=n);let o=(0,a.A)(n);return{meta:{title:`${n}`},error:o,pageview:(0,i.Ap)(`error:${n}`,"error"),smartPageTag:{chapter1:`Status ${n}`,name:o.title}}}function l(e,t){let r=t=>(0,n.jsx)(o.A,{...t,Component:e});return r.getInitialProps=async r=>{try{if(e.getInitialProps){let t=await e.getInitialProps(r),{error:n,meta:i,pageview:a,segment:o,smartPageTag:s,targeting:l}=t;return{error:n,meta:i,pageview:a,props:t,segment:o,smartPageTag:s,targeting:l}}throw Error(`${e.name} is missing a getInitialProps`)}catch(e){if(t)return t(e,r);return s(e,r)}},r}}},e=>{e.O(0,[1324,8175,636,6593,8792],()=>e(e.s=5276)),_N_E=e.O()}]);