@bigz-app/booking-widget 0.1.24 → 0.2.0
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/booking-widget.js +691 -538
- package/dist/booking-widget.js.map +1 -1
- package/dist/components/BookingForm.d.ts.map +1 -1
- package/dist/components/BookingSuccessModal.d.ts +10 -0
- package/dist/components/BookingSuccessModal.d.ts.map +1 -0
- package/dist/components/EventTypeDetailsDialog.d.ts.map +1 -1
- package/dist/components/EventTypeSelection.d.ts.map +1 -1
- package/dist/components/ImageCarousel.d.ts.map +1 -1
- package/dist/components/PaymentForm.d.ts.map +1 -1
- package/dist/components/Sidebar.d.ts.map +1 -1
- package/dist/components/UniversalBookingWidget.d.ts.map +1 -1
- package/dist/components/shared/DialogPortal.d.ts +15 -0
- package/dist/components/shared/DialogPortal.d.ts.map +1 -0
- package/dist/index.cjs +691 -538
- package/dist/index.cjs.map +1 -1
- package/dist/index.esm.js +691 -538
- package/dist/index.esm.js.map +1 -1
- package/dist/styles/StyleProvider.d.ts.map +1 -1
- package/dist/utils.d.ts +6 -0
- package/dist/utils.d.ts.map +1 -1
- package/package.json +1 -1
package/dist/index.esm.js
CHANGED
|
@@ -571,6 +571,13 @@ const StyleProvider = ({ config, children, }) => {
|
|
|
571
571
|
direction: ltr;
|
|
572
572
|
isolation: isolate;
|
|
573
573
|
}
|
|
574
|
+
.print-only {
|
|
575
|
+
display: none;
|
|
576
|
+
}
|
|
577
|
+
.print-hidden {
|
|
578
|
+
display: block;
|
|
579
|
+
}
|
|
580
|
+
@media print {
|
|
574
581
|
`;
|
|
575
582
|
// Inject CSS reset styles
|
|
576
583
|
useEffect(() => {
|
|
@@ -916,6 +923,26 @@ const createRequestBody = (config, additionalData) => {
|
|
|
916
923
|
organizationId: config.organizationId,
|
|
917
924
|
};
|
|
918
925
|
};
|
|
926
|
+
// Helper function to detect Stripe return parameters in URL
|
|
927
|
+
const detectStripeReturn = () => {
|
|
928
|
+
if (typeof window === "undefined") {
|
|
929
|
+
return null;
|
|
930
|
+
}
|
|
931
|
+
const urlParams = new URLSearchParams(window.location.search);
|
|
932
|
+
// Check for Stripe return parameters
|
|
933
|
+
const paymentIntent = urlParams.get("payment_intent");
|
|
934
|
+
const paymentIntentClientSecret = urlParams.get("payment_intent_client_secret");
|
|
935
|
+
const redirectStatus = urlParams.get("redirect_status");
|
|
936
|
+
if (paymentIntent && paymentIntentClientSecret && redirectStatus) {
|
|
937
|
+
return {
|
|
938
|
+
isStripeReturn: true,
|
|
939
|
+
paymentIntent,
|
|
940
|
+
paymentIntentClientSecret,
|
|
941
|
+
redirectStatus,
|
|
942
|
+
};
|
|
943
|
+
}
|
|
944
|
+
return null;
|
|
945
|
+
};
|
|
919
946
|
|
|
920
947
|
var isCheckBoxInput = (element) => element.type === 'checkbox';
|
|
921
948
|
|
|
@@ -6669,15 +6696,8 @@ ZodNullable.create;
|
|
|
6669
6696
|
|
|
6670
6697
|
function n(){return n=Object.assign?Object.assign.bind():function(e){for(var n=1;n<arguments.length;n++){var r=arguments[n];for(var t in r)Object.prototype.hasOwnProperty.call(r,t)&&(e[t]=r[t]);}return e},n.apply(this,arguments)}const r=["children","options"],o=["allowFullScreen","allowTransparency","autoComplete","autoFocus","autoPlay","cellPadding","cellSpacing","charSet","classId","colSpan","contentEditable","contextMenu","crossOrigin","encType","formAction","formEncType","formMethod","formNoValidate","formTarget","frameBorder","hrefLang","inputMode","keyParams","keyType","marginHeight","marginWidth","maxLength","mediaGroup","minLength","noValidate","radioGroup","readOnly","rowSpan","spellCheck","srcDoc","srcLang","srcSet","tabIndex","useMap"].reduce((e,n)=>(e[n.toLowerCase()]=n,e),{class:"className",for:"htmlFor"}),a={amp:"&",apos:"'",gt:">",lt:"<",nbsp:" ",quot:"“"},c=["style","script","pre"],i=["src","href","data","formAction","srcDoc","action"],u=/([-A-Z0-9_:]+)(?:\s*=\s*(?:(?:"((?:\\.|[^"])*)")|(?:'((?:\\.|[^'])*)')|(?:\{((?:\\.|{[^}]*?}|[^}])*)\})))?/gi,l=/mailto:/i,s=/\n{2,}$/,f=/^(\s*>[\s\S]*?)(?=\n\n|$)/,_=/^ *> ?/gm,d=/^(?:\[!([^\]]*)\]\n)?([\s\S]*)/,p=/^ {2,}\n/,y=/^(?:( *[-*_])){3,} *(?:\n *)+\n/,h=/^(?: {1,3})?(`{3,}|~{3,}) *(\S+)? *([^\n]*?)?\n([\s\S]*?)(?:\1\n?|$)/,g=/^(?: {4}[^\n]+\n*)+(?:\n *)+\n?/,m=/^(`+)((?:\\`|(?!\1)`|[^`])+)\1/,k=/^(?:\n *)*\n/,x=/\r\n?/g,v=/^\[\^([^\]]+)](:(.*)((\n+ {4,}.*)|(\n(?!\[\^).+))*)/,q=/^\[\^([^\]]+)]/,b=/\f/g,S=/^---[ \t]*\n(.|\n)*\n---[ \t]*\n/,$=/^\s*?\[(x|\s)\]/,z=/^ *(#{1,6}) *([^\n]+?)(?: +#*)?(?:\n *)*(?:\n|$)/,E=/^ *(#{1,6}) +([^\n]+?)(?: +#*)?(?:\n *)*(?:\n|$)/,A=/^([^\n]+)\n *(=|-){3,} *\n/,R=/^ *(?!<[a-z][^ >/]* ?\/>)<([a-z][^ >/]*) ?((?:[^>]*[^/])?)>\n?(\s*(?:<\1[^>]*?>[\s\S]*?<\/\1>|(?!<\1\b)[\s\S])*?)<\/\1>(?!<\/\1>)\n*/i,B=/&([a-z0-9]+|#[0-9]{1,6}|#x[0-9a-fA-F]{1,6});/gi,L=/^<!--[\s\S]*?(?:-->)/,O=/^(data|aria|x)-[a-z_][a-z\d_.-]*$/,j=/^ *<([a-z][a-z0-9:]*)(?:\s+((?:<.*?>|[^>])*))?\/?>(?!<\/\1>)(\s*\n)?/i,C=/^\{.*\}$/,I=/^(https?:\/\/[^\s<]+[^<.,:;"')\]\s])/,T=/^<([^ >]+@[^ >]+)>/,M=/^<([^ >]+:\/[^ >]+)>/,w=/-([a-z])?/gi,D=/^(\|.*)\n(?: *(\|? *[-:]+ *\|[-| :]*)\n((?:.*\|.*\n)*))?\n?/,F=/^[^\n]+(?: \n|\n{2,})/,P=/^\[([^\]]*)\]:\s+<?([^\s>]+)>?\s*("([^"]*)")?/,Z=/^!\[([^\]]*)\] ?\[([^\]]*)\]/,N=/^\[([^\]]*)\] ?\[([^\]]*)\]/,G=/(\n|^[-*]\s|^#|^ {2,}|^-{2,}|^>\s)/,U=/\t/g,V=/(^ *\||\| *$)/g,H=/^ *:-+: *$/,Q=/^ *:-+ *$/,W=/^ *-+: *$/,J="((?:\\[.*?\\][([].*?[)\\]]|<.*?>(?:.*?<.*?>)?|`.*?`|\\\\\\1|[\\s\\S])+?)",K=RegExp(`^([*_])\\1${J}\\1\\1(?!\\1)`),X=RegExp(`^([*_])${J}\\1(?!\\1)`),Y=RegExp(`^(==)${J}\\1`),ee=RegExp(`^(~~)${J}\\1`),ne=/^(:[a-zA-Z0-9-_]+:)/,re=/^\\([^0-9A-Za-z\s])/,te=/\\([^0-9A-Za-z\s])/g,oe=/^[\s\S](?:(?! \n|[0-9]\.|http)[^=*_~\-\n:<`\\\[!])*/,ae=/^\n+/,ce=/^([ \t]*)/,ie=/(?:^|\n)( *)$/,ue="(?:\\d+\\.)",le="(?:[*+-])";function se(e){return "( *)("+(1===e?ue:le)+") +"}const fe=se(1),_e=se(2);function de(e){return RegExp("^"+(1===e?fe:_e))}const pe=de(1),ye=de(2);function he(e){return RegExp("^"+(1===e?fe:_e)+"[^\\n]*(?:\\n(?!\\1"+(1===e?ue:le)+" )[^\\n]*)*(\\n|$)","gm")}const ge=he(1),me=he(2);function ke(e){const n=1===e?ue:le;return RegExp("^( *)("+n+") [\\s\\S]+?(?:\\n{2,}(?! )(?!\\1"+n+" (?!"+n+" ))\\n*|\\s*\\n*$)")}const xe=ke(1),ve=ke(2);function qe(e,n){const r=1===n,t=r?xe:ve,o=r?ge:me,a=r?pe:ye;return {t:e=>a.test(e),o:je(function(e,n){const r=ie.exec(n.prevCapture);return r&&(n.list||!n.inline&&!n.simple)?t.exec(e=r[1]+e):null}),i:1,u(e,n,t){const c=r?+e[2]:void 0,i=e[0].replace(s,"\n").match(o);let u=false;return {items:i.map(function(e,r){const o=a.exec(e)[0].length,c=RegExp("^ {1,"+o+"}","gm"),l=e.replace(c,"").replace(a,""),s=r===i.length-1,f=-1!==l.indexOf("\n\n")||s&&u;u=f;const _=t.inline,d=t.list;let p;t.list=true,f?(t.inline=false,p=$e(l)+"\n\n"):(t.inline=true,p=$e(l));const y=n(p,t);return t.inline=_,t.list=d,y}),ordered:r,start:c}},l:(n,r,t)=>e(n.ordered?"ol":"ul",{key:t.key,start:"20"===n.type?n.start:void 0},n.items.map(function(n,o){return e("li",{key:o},r(n,t))}))}}const be=RegExp("^\\[((?:\\[[^\\[\\]]*(?:\\[[^\\[\\]]*\\][^\\[\\]]*)*\\]|[^\\[\\]])*)\\]\\(\\s*<?((?:\\([^)]*\\)|[^\\s\\\\]|\\\\.)*?)>?(?:\\s+['\"]([\\s\\S]*?)['\"])?\\s*\\)"),Se=/^!\[(.*?)\]\( *((?:\([^)]*\)|[^() ])*) *"?([^)"]*)?"?\)/;function $e(e){let n=e.length;for(;n>0&&e[n-1]<=" ";)n--;return e.slice(0,n)}function ze(e,n){return e.startsWith(n)}function Ee(e,n,r){if(Array.isArray(r)){for(let n=0;n<r.length;n++)if(ze(e,r[n]))return true;return false}return r(e,n)}function Ae(e){return e.replace(/[ÀÁÂÃÄÅàáâãä忯]/g,"a").replace(/[çÇ]/g,"c").replace(/[ðÐ]/g,"d").replace(/[ÈÉÊËéèêë]/g,"e").replace(/[ÏïÎîÍíÌì]/g,"i").replace(/[Ññ]/g,"n").replace(/[øØœŒÕõÔôÓóÒò]/g,"o").replace(/[ÜüÛûÚúÙù]/g,"u").replace(/[ŸÿÝý]/g,"y").replace(/[^a-z0-9- ]/gi,"").replace(/ /gi,"-").toLowerCase()}function Re(e){return W.test(e)?"right":H.test(e)?"center":Q.test(e)?"left":null}function Be(e,n,r,t){const o=r.inTable;r.inTable=true;let a=[[]],c="";function i(){if(!c)return;const e=a[a.length-1];e.push.apply(e,n(c,r)),c="";}return e.trim().split(/(`[^`]*`|\\\||\|)/).filter(Boolean).forEach((e,n,r)=>{"|"===e.trim()&&(i(),t)?0!==n&&n!==r.length-1&&a.push([]):c+=e;}),i(),r.inTable=o,a}function Le(e,n,r){r.inline=true;const t=e[2]?e[2].replace(V,"").split("|").map(Re):[],o=e[3]?function(e,n,r){return e.trim().split("\n").map(function(e){return Be(e,n,r,true)})}(e[3],n,r):[],a=Be(e[1],n,r,!!o.length);return r.inline=false,o.length?{align:t,cells:o,header:a,type:"25"}:{children:a,type:"21"}}function Oe(e,n){return null==e.align[n]?{}:{textAlign:e.align[n]}}function je(e){return e.inline=1,e}function Ce(e){return je(function(n,r){return r.inline?e.exec(n):null})}function Ie(e){return je(function(n,r){return r.inline||r.simple?e.exec(n):null})}function Te(e){return function(n,r){return r.inline||r.simple?null:e.exec(n)}}function Me(e){return je(function(n){return e.exec(n)})}const we=/(javascript|vbscript|data(?!:image)):/i;function De(e){try{const n=decodeURIComponent(e).replace(/[^A-Za-z0-9/:]/g,"");if(we.test(n))return null}catch(e){return null}return e}function Fe(e){return e?e.replace(te,"$1"):e}function Pe(e,n,r){const t=r.inline||false,o=r.simple||false;r.inline=true,r.simple=true;const a=e(n,r);return r.inline=t,r.simple=o,a}function Ze(e,n,r){const t=r.inline||false,o=r.simple||false;r.inline=false,r.simple=true;const a=e(n,r);return r.inline=t,r.simple=o,a}function Ne(e,n,r){const t=r.inline||false;r.inline=false;const o=e(n,r);return r.inline=t,o}const Ge=(e,n,r)=>({children:Pe(n,e[2],r)});function Ue(){return {}}function Ve(){return null}function He(...e){return e.filter(Boolean).join(" ")}function Qe(e,n,r){let t=e;const o=n.split(".");for(;o.length&&(t=t[o[0]],void 0!==t);)o.shift();return t||r}function We(r="",t={}){t.overrides=t.overrides||{},t.namedCodesToUnicode=t.namedCodesToUnicode?n({},a,t.namedCodesToUnicode):a;const s=t.slugify||Ae,V=t.sanitizer||De,H=t.createElement||React__default.createElement,Q=[f,h,g,t.enforceAtxHeadings?E:z,A,D,xe,ve],W=[...Q,F,R,L,j];function J(e,r,...o){const a=Qe(t.overrides,e+".props",{});return H(function(e,n){const r=Qe(n,e);return r?"function"==typeof r||"object"==typeof r&&"render"in r?r:Qe(n,e+".component",e):e}(e,t.overrides),n({},r,a,{className:He(null==r?void 0:r.className,a.className)||void 0}),...o)}function te(e){e=e.replace(S,"");let n=false;t.forceInline?n=true:t.forceBlock||(n=false===G.test(e));const r=_e(fe(n?e:$e(e).replace(ae,"")+"\n\n",{inline:n}));for(;"string"==typeof r[r.length-1]&&!r[r.length-1].trim();)r.pop();if(null===t.wrapper)return r;const o=t.wrapper||(n?"span":"div");let a;if(r.length>1||t.forceWrapper)a=r;else {if(1===r.length)return a=r[0],"string"==typeof a?J("span",{key:"outer"},a):a;a=null;}return H(o,{key:"outer"},a)}function ie(e,n){if(!n||!n.trim())return null;const r=n.match(u);return r?r.reduce(function(n,r){const t=r.indexOf("=");if(-1!==t){const a=function(e){return -1!==e.indexOf("-")&&null===e.match(O)&&(e=e.replace(w,function(e,n){return n.toUpperCase()})),e}(r.slice(0,t)).trim(),c=function(e){const n=e[0];return ('"'===n||"'"===n)&&e.length>=2&&e[e.length-1]===n?e.slice(1,-1):e}(r.slice(t+1).trim()),u=o[a]||a;if("ref"===u)return n;const l=n[u]=function(e,n,r,t){return "style"===n?function(e){const n=[];let r="",t=false,o=false,a="";if(!e)return n;for(let c=0;c<e.length;c++){const i=e[c];if('"'!==i&&"'"!==i||t||(o?i===a&&(o=false,a=""):(o=true,a=i)),"("===i&&r.endsWith("url")?t=true:")"===i&&t&&(t=false),";"!==i||o||t)r+=i;else {const e=r.trim();if(e){const r=e.indexOf(":");if(r>0){const t=e.slice(0,r).trim(),o=e.slice(r+1).trim();n.push([t,o]);}}r="";}}const c=r.trim();if(c){const e=c.indexOf(":");if(e>0){const r=c.slice(0,e).trim(),t=c.slice(e+1).trim();n.push([r,t]);}}return n}(r).reduce(function(n,[r,o]){return n[r.replace(/(-[a-z])/g,e=>e[1].toUpperCase())]=t(o,e,r),n},{}):-1!==i.indexOf(n)?t(Fe(r),e,n):(r.match(C)&&(r=Fe(r.slice(1,r.length-1))),"true"===r||"false"!==r&&r)}(e,a,c,V);"string"==typeof l&&(R.test(l)||j.test(l))&&(n[u]=te(l.trim()));}else "style"!==r&&(n[o[r]||r]=true);return n},{}):null}const ue=[],le={},se={0:{t:[">"],o:Te(f),i:1,u(e,n,r){const[,t,o]=e[0].replace(_,"").match(d);return {alert:t,children:n(o,r)}},l(e,n,r){const t={key:r.key};return e.alert&&(t.className="markdown-alert-"+s(e.alert.toLowerCase(),Ae),e.children.unshift({attrs:{},children:[{type:"27",text:e.alert}],noInnerParse:true,type:"11",tag:"header"})),J("blockquote",t,n(e.children,r))}},1:{o:Me(p),i:1,u:Ue,l:(e,n,r)=>J("br",{key:r.key})},2:{t:e=>{const n=e[0];return "-"===n||"*"===n||"_"===n},o:Te(y),i:1,u:Ue,l:(e,n,r)=>J("hr",{key:r.key})},3:{t:[" "],o:Te(g),i:0,u:e=>({lang:void 0,text:Fe($e(e[0].replace(/^ {4}/gm,"")))}),l:(e,r,t)=>J("pre",{key:t.key},J("code",n({},e.attrs,{className:e.lang?"lang-"+e.lang:""}),e.text))},4:{t:["```","~~~"],o:Te(h),i:0,u:e=>({attrs:ie("code",e[3]||""),lang:e[2]||void 0,text:e[4],type:"3"})},5:{t:["`"],o:Ie(m),i:3,u:e=>({text:Fe(e[2])}),l:(e,n,r)=>J("code",{key:r.key},e.text)},6:{t:["[^"],o:Te(v),i:0,u:e=>(ue.push({footnote:e[2],identifier:e[1]}),{}),l:Ve},7:{t:["[^"],o:Ce(q),i:1,u:e=>({target:"#"+s(e[1],Ae),text:e[1]}),l:(e,n,r)=>J("a",{key:r.key,href:V(e.target,"a","href")},J("sup",{key:r.key},e.text))},8:{t:["[ ]","[x]"],o:Ce($),i:1,u:e=>({completed:"x"===e[1].toLowerCase()}),l:(e,n,r)=>J("input",{checked:e.completed,key:r.key,readOnly:true,type:"checkbox"})},9:{t:["#"],o:Te(t.enforceAtxHeadings?E:z),i:1,u:(e,n,r)=>({children:Pe(n,e[2],r),id:s(e[2],Ae),level:e[1].length}),l:(e,n,r)=>J("h"+e.level,{id:e.id,key:r.key},n(e.children,r))},10:{o:Te(A),i:0,u:(e,n,r)=>({children:Pe(n,e[1],r),level:"="===e[2]?1:2,type:"9"})},11:{t:["<"],o:Me(R),i:1,u(e,n,r){const[,t]=e[3].match(ce),o=RegExp("^"+t,"gm"),a=e[3].replace(o,""),i=(u=a,W.some(e=>e.test(u))?Ne:Pe);var u;const l=e[1].toLowerCase(),s=-1!==c.indexOf(l),f=(s?l:e[1]).trim(),_={attrs:ie(f,e[2]),noInnerParse:s,tag:f};if(r.inAnchor=r.inAnchor||"a"===l,s)_.text=e[3];else {const e=r.inHTML;r.inHTML=true,_.children=i(n,a,r),r.inHTML=e;}return r.inAnchor=false,_},l:(e,r,t)=>J(e.tag,n({key:t.key},e.attrs),e.text||(e.children?r(e.children,t):""))},13:{t:["<"],o:Me(j),i:1,u(e){const n=e[1].trim();return {attrs:ie(n,e[2]||""),tag:n}},l:(e,r,t)=>J(e.tag,n({},e.attrs,{key:t.key}))},12:{t:["\x3c!--"],o:Me(L),i:1,u:()=>({}),l:Ve},14:{t:["!["],o:Ie(Se),i:1,u:e=>({alt:Fe(e[1]),target:Fe(e[2]),title:Fe(e[3])}),l:(e,n,r)=>J("img",{key:r.key,alt:e.alt||void 0,title:e.title||void 0,src:V(e.target,"img","src")})},15:{t:["["],o:Ce(be),i:3,u:(e,n,r)=>({children:Ze(n,e[1],r),target:Fe(e[2]),title:Fe(e[3])}),l:(e,n,r)=>J("a",{key:r.key,href:V(e.target,"a","href"),title:e.title},n(e.children,r))},16:{t:["<"],o:Ce(M),i:0,u:e=>({children:[{text:e[1],type:"27"}],target:e[1],type:"15"})},17:{t:(e,n)=>!n.inAnchor&&!t.disableAutoLink&&(ze(e,"http://")||ze(e,"https://")),o:Ce(I),i:0,u:e=>({children:[{text:e[1],type:"27"}],target:e[1],title:void 0,type:"15"})},18:{t:["<"],o:Ce(T),i:0,u(e){let n=e[1],r=e[1];return l.test(r)||(r="mailto:"+r),{children:[{text:n.replace("mailto:",""),type:"27"}],target:r,type:"15"}}},20:qe(J,1),33:qe(J,2),19:{o:Te(k),i:3,u:Ue,l:()=>"\n"},21:{o:je(function(e,n){if(n.inline||n.simple||n.inHTML&&-1===e.indexOf("\n\n")&&-1===n.prevCapture.indexOf("\n\n"))return null;let r="";e.split("\n").every(e=>(e+="\n",!Q.some(n=>n.test(e))&&(r+=e,!!e.trim())));const t=$e(r);return ""===t?null:[r,,t]}),i:3,u:Ge,l:(e,n,r)=>J("p",{key:r.key},n(e.children,r))},22:{t:["["],o:Ce(P),i:0,u:e=>(le[e[1]]={target:e[2],title:e[4]},{}),l:Ve},23:{t:["!["],o:Ie(Z),i:0,u:e=>({alt:e[1]?Fe(e[1]):void 0,ref:e[2]}),l:(e,n,r)=>le[e.ref]?J("img",{key:r.key,alt:e.alt,src:V(le[e.ref].target,"img","src"),title:le[e.ref].title}):null},24:{t:e=>"["===e[0]&&-1===e.indexOf("]("),o:Ce(N),i:0,u:(e,n,r)=>({children:n(e[1],r),fallbackChildren:e[0],ref:e[2]}),l:(e,n,r)=>le[e.ref]?J("a",{key:r.key,href:V(le[e.ref].target,"a","href"),title:le[e.ref].title},n(e.children,r)):J("span",{key:r.key},e.fallbackChildren)},25:{t:["|"],o:Te(D),i:1,u:Le,l(e,n,r){const t=e;return J("table",{key:r.key},J("thead",null,J("tr",null,t.header.map(function(e,o){return J("th",{key:o,style:Oe(t,o)},n(e,r))}))),J("tbody",null,t.cells.map(function(e,o){return J("tr",{key:o},e.map(function(e,o){return J("td",{key:o,style:Oe(t,o)},n(e,r))}))})))}},27:{o:je(function(e,n){let r;return ze(e,":")&&(r=ne.exec(e)),r||oe.exec(e)}),i:4,u(e){const n=e[0];return {text:-1===n.indexOf("&")?n:n.replace(B,(e,n)=>t.namedCodesToUnicode[n]||e)}},l:e=>e.text},28:{t:["**","__"],o:Ie(K),i:2,u:(e,n,r)=>({children:n(e[2],r)}),l:(e,n,r)=>J("strong",{key:r.key},n(e.children,r))},29:{t:e=>{const n=e[0];return ("*"===n||"_"===n)&&e[1]!==n},o:Ie(X),i:3,u:(e,n,r)=>({children:n(e[2],r)}),l:(e,n,r)=>J("em",{key:r.key},n(e.children,r))},30:{t:["\\"],o:Ie(re),i:1,u:e=>({text:e[1],type:"27"})},31:{t:["=="],o:Ie(Y),i:3,u:Ge,l:(e,n,r)=>J("mark",{key:r.key},n(e.children,r))},32:{t:["~~"],o:Ie(ee),i:3,u:Ge,l:(e,n,r)=>J("del",{key:r.key},n(e.children,r))}};true===t.disableParsingRawHTML&&(delete se[11],delete se[13]);const fe=function(e){var n=Object.keys(e);function r(t,o){var a=[];if(o.prevCapture=o.prevCapture||"",t.trim())for(;t;)for(var c=0;c<n.length;){var i=n[c],u=e[i];if(!u.t||Ee(t,o,u.t)){var l=u.o(t,o);if(l&&l[0]){t=t.substring(l[0].length);var s=u.u(l,r,o);o.prevCapture+=l[0],s.type||(s.type=i),a.push(s);break}c++;}else c++;}return o.prevCapture="",a}return n.sort(function(n,r){return e[n].i-e[r].i||(n<r?-1:1)}),function(e,n){return r(function(e){return e.replace(x,"\n").replace(b,"").replace(U," ")}(e),n)}}(se),_e=(de=function(e,n){return function(r,t,o){const a=e[r.type].l;return n?n(()=>a(r,t,o),r,t,o):a(r,t,o)}}(se,t.renderRule),function e(n,r={}){if(Array.isArray(n)){const t=r.key,o=[];let a=false;for(let t=0;t<n.length;t++){r.key=t;const c=e(n[t],r),i="string"==typeof c;i&&a?o[o.length-1]+=c:null!==c&&o.push(c),a=i;}return r.key=t,o}return de(n,e,r)});var de;const pe=te(r);return ue.length?J("div",null,pe,J("footer",{key:"footer"},ue.map(function(e){return J("div",{id:s(e.identifier,Ae),key:e.identifier},e.identifier,_e(fe(e.footnote,{inline:true})))}))):pe}var Markdown = n=>{let{children:t="",options:o}=n,a=function(e,n){if(null==e)return {};var r,t,o={},a=Object.keys(e);for(t=0;t<a.length;t++)n.indexOf(r=a[t])>=0||(o[r]=e[r]);return o}(n,r);return React__default.cloneElement(We(t,o),a)};
|
|
6671
6698
|
|
|
6672
|
-
// Helper function to preprocess markdown for underline support
|
|
6673
|
-
const preprocessMarkdown$1 = (markdown) => {
|
|
6674
|
-
// Convert double underscores to HTML underline tags for React Markdown
|
|
6675
|
-
return markdown.replace(/__([^_]+)__/g, "<u>$1</u>");
|
|
6676
|
-
};
|
|
6677
|
-
const IconCheck$1 = ({ size = 16, color = "#10b981" }) => (jsx("svg", { width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: color, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: jsx("polyline", { points: "20 6 9 17 4 12" }) }));
|
|
6678
|
-
const IconWave$1 = ({ size = 20, color = "#0ea5e9" }) => (jsxs("svg", { width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: color, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [jsx("path", { d: "M2 18c2-2 6-2 8 0s6 2 8 0 6-2 8 0" }), jsx("path", { d: "M2 12c2-2 6-2 8 0s6 2 8 0 6-2 8 0" }), jsx("path", { d: "M2 6c2-2 6-2 8 0s6 2 8 0 6-2 8 0" })] }));
|
|
6679
6699
|
// Portal component that renders dialog at document body level
|
|
6680
|
-
function DialogPortal({ children, isOpen }) {
|
|
6700
|
+
function DialogPortal({ children, isOpen, zIndex = 999999, }) {
|
|
6681
6701
|
const [portalRoot, setPortalRoot] = React__default__default.useState(null);
|
|
6682
6702
|
React__default__default.useEffect(() => {
|
|
6683
6703
|
if (!isOpen) {
|
|
@@ -6709,9 +6729,12 @@ function DialogPortal({ children, isOpen }) {
|
|
|
6709
6729
|
"--bw-border-radius-small",
|
|
6710
6730
|
"--bw-spacing",
|
|
6711
6731
|
"--bw-spacing-large",
|
|
6732
|
+
"--bw-spacing-small",
|
|
6712
6733
|
"--bw-font-family",
|
|
6713
6734
|
"--bw-font-size",
|
|
6714
6735
|
"--bw-font-size-large",
|
|
6736
|
+
"--bw-font-size-small",
|
|
6737
|
+
"--bw-font-size-xl",
|
|
6715
6738
|
"--bw-shadow-lg",
|
|
6716
6739
|
"--bw-shadow-md",
|
|
6717
6740
|
"--bw-highlight-muted",
|
|
@@ -6739,7 +6762,7 @@ function DialogPortal({ children, isOpen }) {
|
|
|
6739
6762
|
left: 0;
|
|
6740
6763
|
width: 100%;
|
|
6741
6764
|
height: 100%;
|
|
6742
|
-
z-index:
|
|
6765
|
+
z-index: ${zIndex};
|
|
6743
6766
|
pointer-events: none;
|
|
6744
6767
|
${cssProperties}
|
|
6745
6768
|
`;
|
|
@@ -6760,7 +6783,7 @@ function DialogPortal({ children, isOpen }) {
|
|
|
6760
6783
|
}
|
|
6761
6784
|
document.body.style.overflow = "";
|
|
6762
6785
|
};
|
|
6763
|
-
}, [isOpen]);
|
|
6786
|
+
}, [isOpen, zIndex]);
|
|
6764
6787
|
if (!isOpen || !portalRoot)
|
|
6765
6788
|
return null;
|
|
6766
6789
|
return createPortal(jsx("div", { style: {
|
|
@@ -6769,7 +6792,8 @@ function DialogPortal({ children, isOpen }) {
|
|
|
6769
6792
|
height: "100%",
|
|
6770
6793
|
}, children: children }), portalRoot);
|
|
6771
6794
|
}
|
|
6772
|
-
|
|
6795
|
+
// Shared dialog wrapper component
|
|
6796
|
+
function DialogWrapper({ isOpen, onClose, children, maxWidth = "700px", className, zIndex = 999999, }) {
|
|
6773
6797
|
// Get fallback styles from the widget container for cases where CSS variables aren't available
|
|
6774
6798
|
const [fallbackStyles, setFallbackStyles] = React__default__default.useState({});
|
|
6775
6799
|
React__default__default.useEffect(() => {
|
|
@@ -6806,15 +6830,10 @@ function EventTypeDetailsDialog({ isOpen, onClose, eventType, onEventTypeSelect,
|
|
|
6806
6830
|
return () => {
|
|
6807
6831
|
document.removeEventListener("keydown", handleEscape);
|
|
6808
6832
|
};
|
|
6809
|
-
}, [isOpen]);
|
|
6810
|
-
if (!isOpen
|
|
6833
|
+
}, [isOpen, onClose]);
|
|
6834
|
+
if (!isOpen)
|
|
6811
6835
|
return null;
|
|
6812
|
-
|
|
6813
|
-
const handleBookingClick = () => {
|
|
6814
|
-
onEventTypeSelect(eventType);
|
|
6815
|
-
onClose();
|
|
6816
|
-
};
|
|
6817
|
-
return (jsx(DialogPortal, { isOpen: isOpen, children: jsx("div", { style: fallbackStyles, children: jsx("div", { style: {
|
|
6836
|
+
return (jsx(DialogPortal, { isOpen: isOpen, zIndex: zIndex, children: jsx("div", { style: fallbackStyles, className: className, children: jsx("div", { style: {
|
|
6818
6837
|
position: "fixed",
|
|
6819
6838
|
top: 0,
|
|
6820
6839
|
left: 0,
|
|
@@ -6827,11 +6846,11 @@ function EventTypeDetailsDialog({ isOpen, onClose, eventType, onEventTypeSelect,
|
|
|
6827
6846
|
alignItems: "center",
|
|
6828
6847
|
justifyContent: "center",
|
|
6829
6848
|
padding: "var(--bw-spacing)",
|
|
6830
|
-
zIndex:
|
|
6849
|
+
zIndex: zIndex,
|
|
6831
6850
|
}, onClick: onClose, children: jsxs("div", { style: {
|
|
6832
6851
|
backgroundColor: "var(--bw-surface-color)",
|
|
6833
6852
|
borderRadius: "var(--bw-border-radius)",
|
|
6834
|
-
maxWidth
|
|
6853
|
+
maxWidth,
|
|
6835
6854
|
width: "100%",
|
|
6836
6855
|
maxHeight: "90vh",
|
|
6837
6856
|
overflow: "auto",
|
|
@@ -6859,181 +6878,199 @@ function EventTypeDetailsDialog({ isOpen, onClose, eventType, onEventTypeSelect,
|
|
|
6859
6878
|
e.currentTarget.style.backgroundColor = "var(--bw-border-color)";
|
|
6860
6879
|
}, onMouseLeave: (e) => {
|
|
6861
6880
|
e.currentTarget.style.backgroundColor = "var(--bw-surface-color)";
|
|
6862
|
-
}, children: "\u00D7" }),
|
|
6863
|
-
|
|
6864
|
-
|
|
6865
|
-
|
|
6866
|
-
|
|
6867
|
-
|
|
6868
|
-
|
|
6869
|
-
|
|
6870
|
-
|
|
6871
|
-
|
|
6872
|
-
|
|
6873
|
-
|
|
6874
|
-
|
|
6875
|
-
|
|
6876
|
-
|
|
6877
|
-
|
|
6878
|
-
|
|
6879
|
-
|
|
6880
|
-
|
|
6881
|
-
|
|
6882
|
-
|
|
6883
|
-
|
|
6884
|
-
|
|
6885
|
-
|
|
6886
|
-
|
|
6887
|
-
|
|
6888
|
-
|
|
6889
|
-
|
|
6890
|
-
|
|
6891
|
-
|
|
6892
|
-
|
|
6893
|
-
|
|
6894
|
-
|
|
6895
|
-
|
|
6896
|
-
|
|
6897
|
-
|
|
6898
|
-
color: "var(--bw-text-color)",
|
|
6899
|
-
}, children: [jsx("div", { style: { marginTop: "4px", flexShrink: 0 }, children: jsx(IconCheck$1, { size: 16, color: "var(--bw-success-color)" }) }), jsx("span", { children: highlight.trim() })] }, index))) }) }) }))] }), eventType.description && (jsxs("div", { style: {
|
|
6900
|
-
marginBottom: "24px",
|
|
6901
|
-
color: "var(--bw-text-muted)",
|
|
6902
|
-
fontSize: "16px",
|
|
6903
|
-
lineHeight: "1.6",
|
|
6881
|
+
}, children: "\u00D7" }), children] }) }) }) }));
|
|
6882
|
+
}
|
|
6883
|
+
|
|
6884
|
+
// Helper function to preprocess markdown for underline support
|
|
6885
|
+
const preprocessMarkdown$1 = (markdown) => {
|
|
6886
|
+
// Convert double underscores to HTML underline tags for React Markdown
|
|
6887
|
+
return markdown.replace(/__([^_]+)__/g, "<u>$1</u>");
|
|
6888
|
+
};
|
|
6889
|
+
const IconCheck$1 = ({ size = 16, color = "#10b981" }) => (jsx("svg", { width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: color, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: jsx("polyline", { points: "20 6 9 17 4 12" }) }));
|
|
6890
|
+
const IconWave$1 = ({ size = 20, color = "#0ea5e9" }) => (jsxs("svg", { width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: color, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [jsx("path", { d: "M2 18c2-2 6-2 8 0s6 2 8 0 6-2 8 0" }), jsx("path", { d: "M2 12c2-2 6-2 8 0s6 2 8 0 6-2 8 0" }), jsx("path", { d: "M2 6c2-2 6-2 8 0s6 2 8 0 6-2 8 0" })] }));
|
|
6891
|
+
function EventTypeDetailsDialog({ isOpen, onClose, eventType, onEventTypeSelect, }) {
|
|
6892
|
+
if (!isOpen || !eventType)
|
|
6893
|
+
return null;
|
|
6894
|
+
const isAvailable = eventType.hasAvailableInstances;
|
|
6895
|
+
const handleBookingClick = () => {
|
|
6896
|
+
onEventTypeSelect(eventType);
|
|
6897
|
+
onClose();
|
|
6898
|
+
};
|
|
6899
|
+
return (jsx(DialogWrapper, { isOpen: isOpen, onClose: onClose, maxWidth: "700px", children: jsxs("div", { style: { padding: "var(--bw-spacing-large)" }, children: [jsxs("div", { style: {
|
|
6900
|
+
marginBottom: "24px",
|
|
6901
|
+
padding: "16px",
|
|
6902
|
+
backgroundColor: "var(--bw-background-color)",
|
|
6903
|
+
borderRadius: "var(--bw-border-radius)",
|
|
6904
|
+
border: `1px solid var(--bw-border-color)`,
|
|
6905
|
+
}, children: [jsxs("div", { children: [jsx("div", { style: {
|
|
6906
|
+
fontSize: "14px",
|
|
6907
|
+
fontWeight: "600",
|
|
6908
|
+
color: "var(--bw-highlight-color)",
|
|
6909
|
+
marginBottom: "8px",
|
|
6910
|
+
fontFamily: "var(--bw-font-family)",
|
|
6911
|
+
}, children: eventType.category.name }), jsx("h2", { style: {
|
|
6912
|
+
fontSize: "28px",
|
|
6913
|
+
fontWeight: "700",
|
|
6914
|
+
color: "var(--bw-text-color)",
|
|
6915
|
+
marginBottom: "16px",
|
|
6916
|
+
lineHeight: "1.3",
|
|
6904
6917
|
fontFamily: "var(--bw-font-family)",
|
|
6905
|
-
|
|
6906
|
-
}, children:
|
|
6907
|
-
|
|
6908
|
-
|
|
6909
|
-
|
|
6910
|
-
color: var(--bw-text-muted) !important;
|
|
6911
|
-
font-family: var(--bw-font-family) !important;
|
|
6912
|
-
line-height: 1.6 !important;
|
|
6913
|
-
}
|
|
6914
|
-
.bw-markdown-content p:last-child {
|
|
6915
|
-
margin-bottom: 0 !important;
|
|
6916
|
-
}
|
|
6917
|
-
.bw-markdown-content h2 {
|
|
6918
|
-
font-size: 20px !important;
|
|
6919
|
-
font-weight: 700 !important;
|
|
6920
|
-
color: var(--bw-text-color) !important;
|
|
6921
|
-
margin: 20px 0 8px 0 !important;
|
|
6922
|
-
line-height: 1.3 !important;
|
|
6923
|
-
display: block !important;
|
|
6924
|
-
}
|
|
6925
|
-
.bw-markdown-content h3 {
|
|
6926
|
-
font-size: 18px !important;
|
|
6927
|
-
font-weight: 600 !important;
|
|
6928
|
-
color: var(--bw-text-color) !important;
|
|
6929
|
-
margin: 16px 0 8px 0 !important;
|
|
6930
|
-
line-height: 1.3 !important;
|
|
6931
|
-
display: block !important;
|
|
6932
|
-
}
|
|
6933
|
-
.bw-markdown-content strong {
|
|
6934
|
-
font-weight: 700 !important;
|
|
6935
|
-
color: var(--bw-text-color) !important;
|
|
6936
|
-
}
|
|
6937
|
-
.bw-markdown-content em {
|
|
6938
|
-
font-style: italic !important;
|
|
6939
|
-
}
|
|
6940
|
-
.bw-markdown-content u {
|
|
6941
|
-
text-decoration: underline !important;
|
|
6942
|
-
}
|
|
6943
|
-
.bw-markdown-content ul {
|
|
6944
|
-
margin: 12px 0 !important;
|
|
6945
|
-
padding-left: 24px !important;
|
|
6946
|
-
list-style-type: disc !important;
|
|
6947
|
-
display: block !important;
|
|
6948
|
-
}
|
|
6949
|
-
.bw-markdown-content ol {
|
|
6950
|
-
margin: 12px 0 !important;
|
|
6951
|
-
padding-left: 24px !important;
|
|
6952
|
-
list-style-type: decimal !important;
|
|
6953
|
-
display: block !important;
|
|
6954
|
-
}
|
|
6955
|
-
.bw-markdown-content li {
|
|
6956
|
-
margin-bottom: 4px !important;
|
|
6957
|
-
display: list-item !important;
|
|
6958
|
-
color: var(--bw-text-muted) !important;
|
|
6959
|
-
font-family: var(--bw-font-family) !important;
|
|
6960
|
-
line-height: 1.6 !important;
|
|
6961
|
-
}
|
|
6962
|
-
.bw-markdown-content blockquote {
|
|
6963
|
-
margin: 12px 0 !important;
|
|
6964
|
-
padding-left: 16px !important;
|
|
6965
|
-
border-left: 3px solid var(--bw-border-color) !important;
|
|
6966
|
-
font-style: italic !important;
|
|
6967
|
-
color: var(--bw-text-muted) !important;
|
|
6968
|
-
display: block !important;
|
|
6969
|
-
}
|
|
6970
|
-
.bw-markdown-content a {
|
|
6971
|
-
color: var(--bw-highlight-color) !important;
|
|
6972
|
-
text-decoration: underline !important;
|
|
6973
|
-
}
|
|
6974
|
-
.bw-markdown-content a:hover {
|
|
6975
|
-
text-decoration: none !important;
|
|
6976
|
-
}
|
|
6977
|
-
`,
|
|
6978
|
-
} }), jsx("div", { className: "bw-markdown-content", children: Markdown({ children: preprocessMarkdown$1(eventType.description) }) })] })), jsxs("div", { style: {
|
|
6918
|
+
margin: "0 0 16px 0",
|
|
6919
|
+
}, children: eventType.name })] }), eventType.highlights && eventType.highlights.length > 0 && (jsx("div", { style: { display: "flex", alignItems: "center", gap: "8px" }, children: jsx("div", { style: { marginBottom: "24px" }, children: jsx("ul", { style: {
|
|
6920
|
+
listStyle: "none",
|
|
6921
|
+
padding: "0",
|
|
6922
|
+
margin: "0",
|
|
6979
6923
|
display: "flex",
|
|
6980
|
-
|
|
6981
|
-
|
|
6982
|
-
|
|
6983
|
-
|
|
6984
|
-
|
|
6985
|
-
|
|
6986
|
-
|
|
6987
|
-
|
|
6988
|
-
|
|
6989
|
-
|
|
6990
|
-
|
|
6991
|
-
|
|
6992
|
-
|
|
6993
|
-
|
|
6994
|
-
|
|
6995
|
-
|
|
6996
|
-
|
|
6997
|
-
|
|
6998
|
-
|
|
6999
|
-
|
|
7000
|
-
|
|
7001
|
-
|
|
7002
|
-
|
|
7003
|
-
|
|
7004
|
-
|
|
7005
|
-
|
|
7006
|
-
|
|
7007
|
-
|
|
7008
|
-
|
|
7009
|
-
|
|
7010
|
-
|
|
7011
|
-
|
|
7012
|
-
|
|
7013
|
-
|
|
7014
|
-
|
|
7015
|
-
|
|
7016
|
-
|
|
7017
|
-
|
|
7018
|
-
|
|
7019
|
-
|
|
7020
|
-
|
|
7021
|
-
|
|
7022
|
-
|
|
6924
|
+
flexDirection: "column",
|
|
6925
|
+
gap: "3px",
|
|
6926
|
+
}, children: eventType.highlights
|
|
6927
|
+
.filter((highlight) => highlight.trim())
|
|
6928
|
+
.map((highlight, index) => (jsxs("li", { style: {
|
|
6929
|
+
display: "flex",
|
|
6930
|
+
alignItems: "flex-start",
|
|
6931
|
+
gap: "10px",
|
|
6932
|
+
fontFamily: "var(--bw-font-family)",
|
|
6933
|
+
fontSize: "16px",
|
|
6934
|
+
lineHeight: "1.6",
|
|
6935
|
+
color: "var(--bw-text-color)",
|
|
6936
|
+
}, children: [jsx("div", { style: { marginTop: "4px", flexShrink: 0 }, children: jsx(IconCheck$1, { size: 16, color: "var(--bw-success-color)" }) }), jsx("span", { children: highlight.trim() })] }, index))) }) }) }))] }), eventType.description && (jsxs("div", { style: {
|
|
6937
|
+
marginBottom: "24px",
|
|
6938
|
+
color: "var(--bw-text-muted)",
|
|
6939
|
+
fontSize: "16px",
|
|
6940
|
+
lineHeight: "1.6",
|
|
6941
|
+
fontFamily: "var(--bw-font-family)",
|
|
6942
|
+
padding: "0px 20px",
|
|
6943
|
+
}, children: [jsx("style", { dangerouslySetInnerHTML: {
|
|
6944
|
+
__html: `
|
|
6945
|
+
.bw-markdown-content p {
|
|
6946
|
+
margin: 0 0 12px 0 !important;
|
|
6947
|
+
color: var(--bw-text-muted) !important;
|
|
6948
|
+
font-family: var(--bw-font-family) !important;
|
|
6949
|
+
line-height: 1.6 !important;
|
|
6950
|
+
}
|
|
6951
|
+
.bw-markdown-content p:last-child {
|
|
6952
|
+
margin-bottom: 0 !important;
|
|
6953
|
+
}
|
|
6954
|
+
.bw-markdown-content h2 {
|
|
6955
|
+
font-size: 20px !important;
|
|
6956
|
+
font-weight: 700 !important;
|
|
6957
|
+
color: var(--bw-text-color) !important;
|
|
6958
|
+
margin: 20px 0 8px 0 !important;
|
|
6959
|
+
line-height: 1.3 !important;
|
|
6960
|
+
display: block !important;
|
|
6961
|
+
}
|
|
6962
|
+
.bw-markdown-content h3 {
|
|
6963
|
+
font-size: 18px !important;
|
|
6964
|
+
font-weight: 600 !important;
|
|
6965
|
+
color: var(--bw-text-color) !important;
|
|
6966
|
+
margin: 16px 0 8px 0 !important;
|
|
6967
|
+
line-height: 1.3 !important;
|
|
6968
|
+
display: block !important;
|
|
6969
|
+
}
|
|
6970
|
+
.bw-markdown-content strong {
|
|
6971
|
+
font-weight: 700 !important;
|
|
6972
|
+
color: var(--bw-text-color) !important;
|
|
6973
|
+
}
|
|
6974
|
+
.bw-markdown-content em {
|
|
6975
|
+
font-style: italic !important;
|
|
6976
|
+
}
|
|
6977
|
+
.bw-markdown-content u {
|
|
6978
|
+
text-decoration: underline !important;
|
|
6979
|
+
}
|
|
6980
|
+
.bw-markdown-content ul {
|
|
6981
|
+
margin: 12px 0 !important;
|
|
6982
|
+
padding-left: 24px !important;
|
|
6983
|
+
list-style-type: disc !important;
|
|
6984
|
+
display: block !important;
|
|
6985
|
+
}
|
|
6986
|
+
.bw-markdown-content ol {
|
|
6987
|
+
margin: 12px 0 !important;
|
|
6988
|
+
padding-left: 24px !important;
|
|
6989
|
+
list-style-type: decimal !important;
|
|
6990
|
+
display: block !important;
|
|
6991
|
+
}
|
|
6992
|
+
.bw-markdown-content li {
|
|
6993
|
+
margin-bottom: 4px !important;
|
|
6994
|
+
display: list-item !important;
|
|
6995
|
+
color: var(--bw-text-muted) !important;
|
|
6996
|
+
font-family: var(--bw-font-family) !important;
|
|
6997
|
+
line-height: 1.6 !important;
|
|
6998
|
+
}
|
|
6999
|
+
.bw-markdown-content blockquote {
|
|
7000
|
+
margin: 12px 0 !important;
|
|
7001
|
+
padding-left: 16px !important;
|
|
7002
|
+
border-left: 3px solid var(--bw-border-color) !important;
|
|
7003
|
+
font-style: italic !important;
|
|
7004
|
+
color: var(--bw-text-muted) !important;
|
|
7005
|
+
display: block !important;
|
|
7006
|
+
}
|
|
7007
|
+
.bw-markdown-content a {
|
|
7008
|
+
color: var(--bw-highlight-color) !important;
|
|
7009
|
+
text-decoration: underline !important;
|
|
7010
|
+
}
|
|
7011
|
+
.bw-markdown-content a:hover {
|
|
7012
|
+
text-decoration: none !important;
|
|
7013
|
+
}
|
|
7014
|
+
`,
|
|
7015
|
+
} }), jsx("div", { className: "bw-markdown-content", children: Markdown({ children: preprocessMarkdown$1(eventType.description) }) })] })), jsxs("div", { style: {
|
|
7016
|
+
display: "flex",
|
|
7017
|
+
justifyContent: "space-between",
|
|
7018
|
+
alignItems: "center",
|
|
7019
|
+
marginTop: "32px",
|
|
7020
|
+
padding: "20px",
|
|
7021
|
+
backgroundColor: "var(--bw-background-color)",
|
|
7022
|
+
borderRadius: "var(--bw-border-radius)",
|
|
7023
|
+
border: `1px solid var(--bw-border-color)`,
|
|
7024
|
+
}, children: [jsxs("div", { children: [jsx("div", { className: "bw-event-type-price", style: {
|
|
7025
|
+
fontWeight: "700",
|
|
7026
|
+
color: "var(--bw-text-color)",
|
|
7027
|
+
fontFamily: "var(--bw-font-family)",
|
|
7028
|
+
textAlign: "left",
|
|
7029
|
+
}, children: eventType.groupedDurations && jsx("span", { children: eventType.groupedDurations }) }), jsx("div", { className: "bw-event-type-price", style: {
|
|
7030
|
+
fontSize: "clamp(1.72rem, 4vw, 32px)",
|
|
7031
|
+
fontWeight: "700",
|
|
7032
|
+
color: "var(--bw-text-color)",
|
|
7033
|
+
fontFamily: "var(--bw-font-family)",
|
|
7034
|
+
textAlign: "right",
|
|
7035
|
+
}, children: jsxs("span", { children: ["ab ", formatCurrency(eventType.minPrice)] }) })] }), isAvailable && (jsxs("button", { onClick: handleBookingClick, style: {
|
|
7036
|
+
backgroundColor: "var(--bw-highlight-color)",
|
|
7037
|
+
color: "white",
|
|
7038
|
+
padding: "14px 28px",
|
|
7039
|
+
border: "none",
|
|
7040
|
+
borderRadius: "var(--bw-border-radius)",
|
|
7041
|
+
fontSize: "16px",
|
|
7042
|
+
fontWeight: "600",
|
|
7043
|
+
fontFamily: "var(--bw-font-family)",
|
|
7023
7044
|
display: "flex",
|
|
7024
7045
|
alignItems: "center",
|
|
7025
|
-
|
|
7026
|
-
|
|
7027
|
-
|
|
7028
|
-
|
|
7029
|
-
|
|
7030
|
-
|
|
7031
|
-
|
|
7032
|
-
|
|
7033
|
-
|
|
7034
|
-
|
|
7035
|
-
|
|
7036
|
-
|
|
7046
|
+
gap: "8px",
|
|
7047
|
+
cursor: "pointer",
|
|
7048
|
+
transition: "all 0.2s ease",
|
|
7049
|
+
}, onMouseEnter: (e) => {
|
|
7050
|
+
e.currentTarget.style.opacity = "0.9";
|
|
7051
|
+
e.currentTarget.style.transform = "translateY(-1px)";
|
|
7052
|
+
}, onMouseLeave: (e) => {
|
|
7053
|
+
e.currentTarget.style.opacity = "1";
|
|
7054
|
+
e.currentTarget.style.transform = "translateY(0)";
|
|
7055
|
+
}, children: [jsx(IconWave$1, { size: 20, color: "white" }), "Jetzt buchen"] }))] }), !isAvailable && (jsx("div", { style: {
|
|
7056
|
+
position: "absolute",
|
|
7057
|
+
inset: 0,
|
|
7058
|
+
backgroundColor: "rgba(0, 0, 0, 0.3)",
|
|
7059
|
+
backdropFilter: "blur(2px)",
|
|
7060
|
+
display: "flex",
|
|
7061
|
+
alignItems: "center",
|
|
7062
|
+
justifyContent: "center",
|
|
7063
|
+
borderRadius: "var(--bw-border-radius)",
|
|
7064
|
+
}, children: jsx("div", { style: {
|
|
7065
|
+
backgroundColor: "rgba(255, 255, 255, 0.9)",
|
|
7066
|
+
padding: "16px 32px",
|
|
7067
|
+
borderRadius: "var(--bw-border-radius)",
|
|
7068
|
+
color: "var(--bw-text-color)",
|
|
7069
|
+
fontWeight: "600",
|
|
7070
|
+
fontSize: "18px",
|
|
7071
|
+
fontFamily: "var(--bw-font-family)",
|
|
7072
|
+
boxShadow: "var(--bw-shadow-md)",
|
|
7073
|
+
}, children: "Ausgebucht" }) }))] }) }));
|
|
7037
7074
|
}
|
|
7038
7075
|
|
|
7039
7076
|
// Carousel navigation icons
|
|
@@ -7085,7 +7122,7 @@ const ImageCarousel = ({ images, eventName }) => {
|
|
|
7085
7122
|
if (images.length === 0) {
|
|
7086
7123
|
return jsx(EventImagePlaceholder, {});
|
|
7087
7124
|
}
|
|
7088
|
-
return (jsxs("div", { style: { position: "relative", width: "100%", height: "100%", overflow: "hidden" }, children: [jsx("div", { style: {
|
|
7125
|
+
return (jsxs("div", { style: { position: "relative", width: "100%", height: "100%", overflow: "hidden", borderRadius: "inherit" }, children: [jsx("div", { style: {
|
|
7089
7126
|
display: "flex",
|
|
7090
7127
|
width: `${images.length * 100}%`,
|
|
7091
7128
|
height: "100%",
|
|
@@ -7097,6 +7134,7 @@ const ImageCarousel = ({ images, eventName }) => {
|
|
|
7097
7134
|
flexShrink: 0,
|
|
7098
7135
|
overflow: "hidden",
|
|
7099
7136
|
position: "relative",
|
|
7137
|
+
borderRadius: "inherit"
|
|
7100
7138
|
}, children: jsx("img", { src: image, alt: `${eventName} - Bild ${index + 1}`, style: {
|
|
7101
7139
|
width: "100%",
|
|
7102
7140
|
height: "100%",
|
|
@@ -7105,6 +7143,7 @@ const ImageCarousel = ({ images, eventName }) => {
|
|
|
7105
7143
|
position: "absolute",
|
|
7106
7144
|
top: 0,
|
|
7107
7145
|
left: 0,
|
|
7146
|
+
borderRadius: "inherit"
|
|
7108
7147
|
} }) }, index))) }), images.length > 1 && (jsxs(Fragment, { children: [jsx("button", { onClick: prevImage, disabled: isTransitioning, style: {
|
|
7109
7148
|
position: "absolute",
|
|
7110
7149
|
left: "12px",
|
|
@@ -7581,6 +7620,7 @@ function EventTypeSelection({ eventTypes, onEventTypeSelect, isLoading = false,
|
|
|
7581
7620
|
backgroundColor: "var(--bw-surface-color)",
|
|
7582
7621
|
border: `1px solid var(--bw-border-color)`,
|
|
7583
7622
|
borderRadius: "var(--bw-border-radius)",
|
|
7623
|
+
overflow: "hidden",
|
|
7584
7624
|
transition: "all 0.3s ease",
|
|
7585
7625
|
cursor: isAvailable ? "pointer" : "not-allowed",
|
|
7586
7626
|
opacity: isAvailable ? 1 : 0.6,
|
|
@@ -9085,7 +9125,7 @@ const spinner = (borderColor) => (jsx("div", { style: {
|
|
|
9085
9125
|
borderRadius: "50%",
|
|
9086
9126
|
} }) }));
|
|
9087
9127
|
// Inner component that uses the Stripe hooks
|
|
9088
|
-
function PaymentFormInner({ config, eventDetails, formData, totalAmount, discountCode, onSuccess, onError,
|
|
9128
|
+
function PaymentFormInner({ config, eventDetails, formData, totalAmount, discountCode, onSuccess, onError, }) {
|
|
9089
9129
|
const stripe = reactStripe_umdExports.useStripe();
|
|
9090
9130
|
const elements = reactStripe_umdExports.useElements();
|
|
9091
9131
|
const [isLoading, setIsLoading] = useState(false);
|
|
@@ -9111,26 +9151,12 @@ function PaymentFormInner({ config, eventDetails, formData, totalAmount, discoun
|
|
|
9111
9151
|
return;
|
|
9112
9152
|
}
|
|
9113
9153
|
// First, confirm the payment with Stripe
|
|
9154
|
+
// Build return URL for Stripe redirect
|
|
9155
|
+
const baseUrl = window !== undefined ? window.location.href : `${config.bookingSystemUrl}/booking-success`;
|
|
9156
|
+
const returnUrl = new URL(baseUrl);
|
|
9114
9157
|
const confirmParams = {
|
|
9115
|
-
return_url:
|
|
9158
|
+
return_url: returnUrl.toString(),
|
|
9116
9159
|
};
|
|
9117
|
-
// Ensure return_url is properly formatted and doesn't contain fragment identifiers
|
|
9118
|
-
try {
|
|
9119
|
-
const url = new URL(confirmParams.return_url);
|
|
9120
|
-
// Remove any fragment identifiers that might cause issues
|
|
9121
|
-
url.hash = "";
|
|
9122
|
-
confirmParams.return_url = url.toString();
|
|
9123
|
-
}
|
|
9124
|
-
catch (e) {
|
|
9125
|
-
console.warn("[PAYMENT_FORM] Invalid return_url, using fallback:", confirmParams.return_url);
|
|
9126
|
-
// Fallback to current origin if URL parsing fails
|
|
9127
|
-
confirmParams.return_url = window.location.origin + window.location.pathname;
|
|
9128
|
-
}
|
|
9129
|
-
console.log("[PAYMENT_FORM] Confirming payment with params:", {
|
|
9130
|
-
paymentIntentId: clientSecret.split("_secret_")[0],
|
|
9131
|
-
return_url: confirmParams.return_url,
|
|
9132
|
-
redirect: "if_required",
|
|
9133
|
-
});
|
|
9134
9160
|
const { error, paymentIntent } = await stripe.confirmPayment({
|
|
9135
9161
|
elements,
|
|
9136
9162
|
confirmParams,
|
|
@@ -9148,91 +9174,15 @@ function PaymentFormInner({ config, eventDetails, formData, totalAmount, discoun
|
|
|
9148
9174
|
setPaymentError(error.message || "Zahlungsfehler");
|
|
9149
9175
|
}
|
|
9150
9176
|
else {
|
|
9151
|
-
setPaymentError("Ein unerwarteter Fehler ist aufgetreten.");
|
|
9177
|
+
setPaymentError("Ein unerwarteter Fehler ist aufgetreten. Bitte versuche es nochmal.");
|
|
9152
9178
|
}
|
|
9153
9179
|
return;
|
|
9154
9180
|
}
|
|
9155
9181
|
// Payment succeeded, now create the booking
|
|
9156
9182
|
if (paymentIntent && paymentIntent.status === "succeeded") {
|
|
9157
|
-
// Check if we have system configuration
|
|
9158
|
-
if (!systemConfig) {
|
|
9159
|
-
throw new Error("System-Konfiguration nicht verfügbar. Bitte lade die Seite neu.");
|
|
9160
|
-
}
|
|
9161
|
-
// Determine which endpoint to use based on system mode
|
|
9162
|
-
const isConnectMode = systemConfig.systemMode === "connect";
|
|
9163
|
-
const endpoint = isConnectMode
|
|
9164
|
-
? "/booking/create-from-payment"
|
|
9165
|
-
: "/booking-proxy/create-booking";
|
|
9166
|
-
// Calculate if this is a deposit payment
|
|
9167
|
-
const fullAmount = eventDetails.price * formData.participants.filter((p) => p.name.trim()).length;
|
|
9168
|
-
const isDepositPayment = eventDetails.deposit > 0;
|
|
9169
|
-
// Build request body based on mode
|
|
9170
|
-
const requestData = {
|
|
9171
|
-
// Payment info
|
|
9172
|
-
paymentIntentId: paymentIntent.id,
|
|
9173
|
-
paymentMethod: "card",
|
|
9174
|
-
paymentStatus: isDepositPayment ? "deposit_paid" : "paid",
|
|
9175
|
-
totalAmount,
|
|
9176
|
-
depositAmount: isDepositPayment ? totalAmount : undefined,
|
|
9177
|
-
fullAmount: fullAmount,
|
|
9178
|
-
// Customer info
|
|
9179
|
-
customerEmail: formData.customerEmail,
|
|
9180
|
-
customerName: formData.customerName,
|
|
9181
|
-
customerPhone: formData.customerPhone,
|
|
9182
|
-
// Booking info
|
|
9183
|
-
participants: formData.participants.filter((p) => p.name.trim()),
|
|
9184
|
-
eventInstanceId: config.eventInstanceId || eventDetails.id,
|
|
9185
|
-
organizationId: config.organizationId, // Ensure organization ID is always included
|
|
9186
|
-
discountCode: discountCode?.code,
|
|
9187
|
-
notes: "",
|
|
9188
|
-
};
|
|
9189
|
-
// Add mode-specific fields
|
|
9190
|
-
if (isConnectMode) {
|
|
9191
|
-
Object.assign(requestData, {
|
|
9192
|
-
source: "connect",
|
|
9193
|
-
stripeAccountType: "connect",
|
|
9194
|
-
});
|
|
9195
|
-
}
|
|
9196
|
-
else {
|
|
9197
|
-
// ApiKey mode - include required proxy fields
|
|
9198
|
-
Object.assign(requestData, {
|
|
9199
|
-
bookingSystemApiUrl: config.apiBaseUrl,
|
|
9200
|
-
// apiKey would be added here if required
|
|
9201
|
-
});
|
|
9202
|
-
}
|
|
9203
|
-
console.log(`[PAYMENT_FORM] Attempting booking creation via ${endpoint}`, {
|
|
9204
|
-
mode: isConnectMode ? "connect" : "apikey",
|
|
9205
|
-
paymentIntentId: paymentIntent.id,
|
|
9206
|
-
eventInstanceId: requestData.eventInstanceId,
|
|
9207
|
-
organizationId: requestData.organizationId,
|
|
9208
|
-
participantCount: requestData.participants.length,
|
|
9209
|
-
});
|
|
9210
|
-
const bookingResponse = await fetch(getApiUrl(config.apiBaseUrl, endpoint), {
|
|
9211
|
-
method: "POST",
|
|
9212
|
-
headers: createApiHeaders(config),
|
|
9213
|
-
body: JSON.stringify(createRequestBody(config, requestData)),
|
|
9214
|
-
});
|
|
9215
|
-
const bookingData = await bookingResponse.json();
|
|
9216
|
-
if (!bookingResponse.ok) {
|
|
9217
|
-
console.error(`[PAYMENT_FORM] Booking creation failed:`, {
|
|
9218
|
-
status: bookingResponse.status,
|
|
9219
|
-
error: bookingData.error,
|
|
9220
|
-
details: bookingData.details,
|
|
9221
|
-
paymentIntentId: paymentIntent.id,
|
|
9222
|
-
});
|
|
9223
|
-
throw new Error(bookingData.error || "Fehler beim Erstellen der Buchung");
|
|
9224
|
-
}
|
|
9225
|
-
console.log(`[PAYMENT_FORM] Booking created successfully:`, {
|
|
9226
|
-
bookingId: bookingData.booking?.id,
|
|
9227
|
-
orderId: bookingData.order?.id,
|
|
9228
|
-
paymentIntentId: paymentIntent.id,
|
|
9229
|
-
});
|
|
9230
9183
|
// Booking created successfully
|
|
9231
9184
|
onSuccess({
|
|
9232
|
-
booking: bookingData.booking,
|
|
9233
|
-
payment: "succeeded",
|
|
9234
9185
|
paymentIntent: paymentIntent,
|
|
9235
|
-
formData: formData,
|
|
9236
9186
|
});
|
|
9237
9187
|
}
|
|
9238
9188
|
else {
|
|
@@ -9335,11 +9285,6 @@ function PaymentForm({ config, eventDetails, formData, totalAmount, discountCode
|
|
|
9335
9285
|
setIsCreatingPaymentIntent(true);
|
|
9336
9286
|
setPaymentError(null);
|
|
9337
9287
|
try {
|
|
9338
|
-
// Determine endpoint based on system mode
|
|
9339
|
-
const isConnectMode = systemConfig.systemMode === "connect";
|
|
9340
|
-
const endpoint = isConnectMode
|
|
9341
|
-
? "/booking/create-payment-intent"
|
|
9342
|
-
: "/booking-proxy/create-payment-intent";
|
|
9343
9288
|
// Build request data with validation
|
|
9344
9289
|
const requestData = {
|
|
9345
9290
|
eventInstanceId: config.eventInstanceId || eventDetails.id,
|
|
@@ -9348,7 +9293,10 @@ function PaymentForm({ config, eventDetails, formData, totalAmount, discountCode
|
|
|
9348
9293
|
currency: "eur",
|
|
9349
9294
|
participants: formData.participants.filter((p) => p.name?.trim()),
|
|
9350
9295
|
discountCode: discountCode?.code,
|
|
9296
|
+
customerName: formData.customerName?.trim(),
|
|
9351
9297
|
customerEmail: formData.customerEmail?.trim(),
|
|
9298
|
+
customerPhone: formData.customerPhone?.trim(),
|
|
9299
|
+
comment: formData.comment?.trim(),
|
|
9352
9300
|
};
|
|
9353
9301
|
// Validate required fields
|
|
9354
9302
|
if (!requestData.eventInstanceId) {
|
|
@@ -9366,34 +9314,13 @@ function PaymentForm({ config, eventDetails, formData, totalAmount, discountCode
|
|
|
9366
9314
|
if (!requestData.customerEmail) {
|
|
9367
9315
|
throw new Error("Customer email is required");
|
|
9368
9316
|
}
|
|
9369
|
-
|
|
9370
|
-
endpoint,
|
|
9371
|
-
mode: isConnectMode ? "connect" : "apikey",
|
|
9372
|
-
amount: requestData.amount,
|
|
9373
|
-
currency: requestData.currency,
|
|
9374
|
-
participantCount: requestData.participants.length,
|
|
9375
|
-
organizationId: requestData.organizationId,
|
|
9376
|
-
eventInstanceId: requestData.eventInstanceId,
|
|
9377
|
-
});
|
|
9378
|
-
// Add mode-specific fields
|
|
9379
|
-
if (!isConnectMode) {
|
|
9380
|
-
// ApiKey mode needs additional fields
|
|
9381
|
-
Object.assign(requestData, {
|
|
9382
|
-
bookingSystemApiUrl: config.apiBaseUrl,
|
|
9383
|
-
// apiKey would be added here if required
|
|
9384
|
-
});
|
|
9385
|
-
}
|
|
9386
|
-
const response = await fetch(getApiUrl(config.apiBaseUrl, endpoint), {
|
|
9317
|
+
const response = await fetch(getApiUrl(config.apiBaseUrl, "/booking/create-payment-intent"), {
|
|
9387
9318
|
method: "POST",
|
|
9388
9319
|
headers: createApiHeaders(config),
|
|
9389
9320
|
body: JSON.stringify(createRequestBody(config, requestData)),
|
|
9390
9321
|
});
|
|
9391
9322
|
const data = await response.json();
|
|
9392
9323
|
if (response.ok) {
|
|
9393
|
-
console.log("[PAYMENT_FORM] Payment intent created successfully:", {
|
|
9394
|
-
hasClientSecret: !!data.clientSecret,
|
|
9395
|
-
clientSecretPrefix: `${data.clientSecret?.substring(0, 20)}...`,
|
|
9396
|
-
});
|
|
9397
9324
|
setClientSecret(data.clientSecret);
|
|
9398
9325
|
}
|
|
9399
9326
|
else {
|
|
@@ -9549,6 +9476,7 @@ function Sidebar({ isOpen, onClose, title, children, width = "400px" }) {
|
|
|
9549
9476
|
position: "absolute",
|
|
9550
9477
|
inset: 0,
|
|
9551
9478
|
backgroundColor: "rgba(0, 0, 0, 0.5)",
|
|
9479
|
+
backdropFilter: "blur(10px)",
|
|
9552
9480
|
opacity: isAnimating ? 1 : 0,
|
|
9553
9481
|
transition: "opacity 0.25s ease-out",
|
|
9554
9482
|
}, onClick: onClose }), jsxs("div", { style: {
|
|
@@ -9895,11 +9823,11 @@ function BookingForm({ config, eventDetails, stripePromise, onSuccess, onError,
|
|
|
9895
9823
|
display: "flex",
|
|
9896
9824
|
alignItems: "center",
|
|
9897
9825
|
gap: "4px",
|
|
9898
|
-
}, children: [jsx(
|
|
9826
|
+
}, children: [jsx(IconCalendar, { size: 20, color: "var(--bw-highlight-color)" }), " Uhrzeit:"] }), jsx("span", { style: {
|
|
9899
9827
|
color: "var(--bw-text-color)",
|
|
9900
9828
|
fontWeight: "500",
|
|
9901
9829
|
fontFamily: "var(--bw-font-family)",
|
|
9902
|
-
}, children:
|
|
9830
|
+
}, children: formatTime(eventDetails.startTime, "Europe/Berlin", "de") })] }), jsxs("div", { style: { display: "flex", alignItems: "center", justifyContent: "space-between" }, children: [jsxs("span", { style: {
|
|
9903
9831
|
color: "var(--bw-text-muted)",
|
|
9904
9832
|
fontFamily: "var(--bw-font-family)",
|
|
9905
9833
|
display: "flex",
|
|
@@ -9909,7 +9837,17 @@ function BookingForm({ config, eventDetails, stripePromise, onSuccess, onError,
|
|
|
9909
9837
|
color: "var(--bw-text-color)",
|
|
9910
9838
|
fontWeight: "500",
|
|
9911
9839
|
fontFamily: "var(--bw-font-family)",
|
|
9912
|
-
}, children: [eventDetails.durationDays, " Tag", eventDetails.durationDays > 1 ? "e" : ""] })] })
|
|
9840
|
+
}, children: [eventDetails.durationDays, " Tag", eventDetails.durationDays > 1 ? "e" : ""] })] }), jsxs("div", { style: { display: "flex", alignItems: "center", justifyContent: "space-between" }, children: [jsxs("span", { style: {
|
|
9841
|
+
color: "var(--bw-text-muted)",
|
|
9842
|
+
fontFamily: "var(--bw-font-family)",
|
|
9843
|
+
display: "flex",
|
|
9844
|
+
alignItems: "center",
|
|
9845
|
+
gap: "4px",
|
|
9846
|
+
}, children: [jsx(IconMoney, { size: 20, color: "var(--bw-highlight-color)" }), " Preis:"] }), jsxs("span", { style: {
|
|
9847
|
+
color: "var(--bw-text-color)",
|
|
9848
|
+
fontWeight: "500",
|
|
9849
|
+
fontFamily: "var(--bw-font-family)",
|
|
9850
|
+
}, children: [formatCurrency(eventDetails.price), " pro Person"] })] })] })] }), jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "var(--bw-spacing-large)" }, children: [jsxs("form", { style: { display: "flex", flexDirection: "column", gap: "var(--bw-spacing-large)" }, children: [jsxs("div", { style: {
|
|
9913
9851
|
backgroundColor: "var(--bw-surface-color)",
|
|
9914
9852
|
border: `1px solid var(--bw-border-color)`,
|
|
9915
9853
|
backdropFilter: "blur(4px)",
|
|
@@ -10066,9 +10004,10 @@ function BookingForm({ config, eventDetails, stripePromise, onSuccess, onError,
|
|
|
10066
10004
|
height: "20px",
|
|
10067
10005
|
border: "1px solid var(--bw-border-color)",
|
|
10068
10006
|
accentColor: "var(--bw-highlight-color)",
|
|
10069
|
-
|
|
10070
|
-
|
|
10071
|
-
|
|
10007
|
+
cursor: "pointer",
|
|
10008
|
+
appearance: "checkbox",
|
|
10009
|
+
WebkitAppearance: "checkbox",
|
|
10010
|
+
MozAppearance: "checkbox",
|
|
10072
10011
|
} }), jsxs("label", { htmlFor: "acceptTerms", style: {
|
|
10073
10012
|
fontSize: "var(--bw-font-size)",
|
|
10074
10013
|
color: "var(--bw-text-muted)",
|
|
@@ -10078,7 +10017,7 @@ function BookingForm({ config, eventDetails, stripePromise, onSuccess, onError,
|
|
|
10078
10017
|
}, children: ["Ich akzeptiere die", " ", jsx("a", { href: eventDetails.agbUrl || "/terms", style: {
|
|
10079
10018
|
color: "var(--bw-highlight-color)",
|
|
10080
10019
|
textDecoration: "none",
|
|
10081
|
-
}, target: "_blank", rel: "noopener noreferrer", children: "
|
|
10020
|
+
}, target: "_blank", rel: "noopener noreferrer", children: "AGBs" }), "*"] })] }), form.formState.errors.acceptTerms && (jsx("p", { style: {
|
|
10082
10021
|
color: "var(--bw-error-color)",
|
|
10083
10022
|
fontSize: "var(--bw-font-size)",
|
|
10084
10023
|
marginTop: "8px",
|
|
@@ -10231,6 +10170,341 @@ function BookingForm({ config, eventDetails, stripePromise, onSuccess, onError,
|
|
|
10231
10170
|
` })] }) }));
|
|
10232
10171
|
}
|
|
10233
10172
|
|
|
10173
|
+
const BookingSuccessModal = ({ isOpen, onClose, config, onError, paymentIntentId, }) => {
|
|
10174
|
+
const [bookingData, setBookingData] = useState(null);
|
|
10175
|
+
const [eventDetails, setEventDetails] = useState(null);
|
|
10176
|
+
const [formData, setFormData] = useState(null);
|
|
10177
|
+
const [isLoading, setIsLoading] = useState(false);
|
|
10178
|
+
const [paymentStatus, setPaymentStatus] = useState(null);
|
|
10179
|
+
const fetchBookingData = async (intentId) => {
|
|
10180
|
+
const targetPaymentIntentId = paymentIntentId;
|
|
10181
|
+
// If we have payment intent ID, fetch from API
|
|
10182
|
+
if (targetPaymentIntentId) {
|
|
10183
|
+
setIsLoading(true);
|
|
10184
|
+
try {
|
|
10185
|
+
const response = await fetch(getApiUrl(config.apiBaseUrl, "/booking/get-booking-by-payment-intent"), {
|
|
10186
|
+
method: "POST",
|
|
10187
|
+
headers: createApiHeaders(config),
|
|
10188
|
+
body: JSON.stringify(createRequestBody(config, {
|
|
10189
|
+
paymentIntentId: targetPaymentIntentId,
|
|
10190
|
+
})),
|
|
10191
|
+
});
|
|
10192
|
+
const data = await response.json();
|
|
10193
|
+
if (response.ok) {
|
|
10194
|
+
setBookingData({
|
|
10195
|
+
booking: data.booking,
|
|
10196
|
+
order: data.order,
|
|
10197
|
+
payments: data.payments,
|
|
10198
|
+
orderItems: data.orderItems,
|
|
10199
|
+
stripePaymentIntent: data.stripePaymentIntent,
|
|
10200
|
+
});
|
|
10201
|
+
setEventDetails({
|
|
10202
|
+
id: data.booking.eventInstance.id,
|
|
10203
|
+
name: data.booking.eventInstance.eventType.name,
|
|
10204
|
+
description: data.booking.eventInstance.eventType.description,
|
|
10205
|
+
startTime: data.booking.eventInstance.startTime,
|
|
10206
|
+
endTime: data.booking.eventInstance.endTime,
|
|
10207
|
+
price: data.order.total / data.booking.participantCount,
|
|
10208
|
+
});
|
|
10209
|
+
setFormData({
|
|
10210
|
+
customerEmail: data.booking.customerEmail,
|
|
10211
|
+
customerName: data.booking.customerName,
|
|
10212
|
+
customerPhone: data.booking.customerPhone,
|
|
10213
|
+
participants: data.booking.participants || [],
|
|
10214
|
+
});
|
|
10215
|
+
// Set payment status from Stripe data or order status
|
|
10216
|
+
setPaymentStatus(data.stripePaymentIntent?.status || data.order.status);
|
|
10217
|
+
}
|
|
10218
|
+
else {
|
|
10219
|
+
onError?.(data.error || "Fehler beim Abrufen der Buchungsdaten");
|
|
10220
|
+
}
|
|
10221
|
+
}
|
|
10222
|
+
catch (err) {
|
|
10223
|
+
console.error("[BookingSuccessModal] Error fetching booking data:", err);
|
|
10224
|
+
onError?.("Ein Fehler ist bei der Verarbeitung aufgetreten.");
|
|
10225
|
+
}
|
|
10226
|
+
finally {
|
|
10227
|
+
setIsLoading(false);
|
|
10228
|
+
}
|
|
10229
|
+
return;
|
|
10230
|
+
}
|
|
10231
|
+
};
|
|
10232
|
+
useEffect(() => {
|
|
10233
|
+
if (isOpen) {
|
|
10234
|
+
fetchBookingData();
|
|
10235
|
+
}
|
|
10236
|
+
}, [isOpen, paymentIntentId, config, onError]);
|
|
10237
|
+
if (!isOpen)
|
|
10238
|
+
return null;
|
|
10239
|
+
// Show loading state while fetching data
|
|
10240
|
+
if (isLoading || !bookingData) {
|
|
10241
|
+
return (jsx(DialogWrapper, { isOpen: isOpen, onClose: onClose, maxWidth: "700px", children: jsx("div", { style: {
|
|
10242
|
+
padding: "var(--bw-spacing-large)",
|
|
10243
|
+
textAlign: "center",
|
|
10244
|
+
minHeight: "200px",
|
|
10245
|
+
display: "flex",
|
|
10246
|
+
alignItems: "center",
|
|
10247
|
+
justifyContent: "center",
|
|
10248
|
+
}, children: jsx("div", { style: {
|
|
10249
|
+
color: "var(--bw-text-muted)",
|
|
10250
|
+
fontFamily: "var(--bw-font-family)",
|
|
10251
|
+
fontSize: "var(--bw-font-size-large)",
|
|
10252
|
+
}, children: "Buchungsdaten werden geladen..." }) }) }));
|
|
10253
|
+
}
|
|
10254
|
+
const booking = bookingData.booking;
|
|
10255
|
+
new Date(eventDetails.startTime);
|
|
10256
|
+
new Date(eventDetails.endTime);
|
|
10257
|
+
const handlePrint = () => {
|
|
10258
|
+
window.print();
|
|
10259
|
+
};
|
|
10260
|
+
const formatTime12 = (dateString) => {
|
|
10261
|
+
return formatTime(dateString, "Europe/Berlin", "de");
|
|
10262
|
+
};
|
|
10263
|
+
const formatDate12 = (dateString) => {
|
|
10264
|
+
return formatEventDate(dateString);
|
|
10265
|
+
};
|
|
10266
|
+
return (jsx(DialogWrapper, { isOpen: isOpen, onClose: onClose, maxWidth: "700px", children: jsxs("div", { style: {
|
|
10267
|
+
fontFamily: "var(--bw-font-family)",
|
|
10268
|
+
padding: "var(--bw-spacing-large)",
|
|
10269
|
+
maxWidth: "100%",
|
|
10270
|
+
}, children: [jsxs("div", { className: "flex justify-between items-center print-hidden", style: {
|
|
10271
|
+
marginBottom: "var(--bw-spacing-large)",
|
|
10272
|
+
display: "flex",
|
|
10273
|
+
alignItems: "center",
|
|
10274
|
+
justifyContent: "space-between",
|
|
10275
|
+
}, children: [jsxs("h1", { className: "font-bold text-3xl flex items-center gap-2", style: {
|
|
10276
|
+
color: "var(--bw-text-color)",
|
|
10277
|
+
fontFamily: "var(--bw-font-family)",
|
|
10278
|
+
marginBottom: "var(--bw-spacing-large)",
|
|
10279
|
+
display: "flex",
|
|
10280
|
+
alignItems: "center",
|
|
10281
|
+
gap: "var(--bw-spacing-small)",
|
|
10282
|
+
}, children: [jsx("div", { style: {
|
|
10283
|
+
width: "32px",
|
|
10284
|
+
height: "32px",
|
|
10285
|
+
backgroundColor: "var(--bw-highlight-color, #10B981)",
|
|
10286
|
+
borderRadius: "50%",
|
|
10287
|
+
display: "flex",
|
|
10288
|
+
alignItems: "center",
|
|
10289
|
+
justifyContent: "center",
|
|
10290
|
+
color: "white",
|
|
10291
|
+
}, children: "\u2713" }), jsx("p", { style: {
|
|
10292
|
+
fontSize: "var(--bw-font-size-large)",
|
|
10293
|
+
fontWeight: "600",
|
|
10294
|
+
color: "var(--bw-highlight-color)",
|
|
10295
|
+
margin: "0px 10px",
|
|
10296
|
+
}, children: "Buchung erfolgreich erstellt!" })] }), jsx("button", { onClick: handlePrint, style: {
|
|
10297
|
+
backgroundColor: "transparent",
|
|
10298
|
+
border: `1px solid var(--bw-border-color)`,
|
|
10299
|
+
color: "var(--bw-text-color)",
|
|
10300
|
+
padding: "8px 16px",
|
|
10301
|
+
borderRadius: "var(--bw-border-radius)",
|
|
10302
|
+
cursor: "pointer",
|
|
10303
|
+
fontFamily: "var(--bw-font-family)",
|
|
10304
|
+
fontSize: "var(--bw-font-size-small)",
|
|
10305
|
+
}, children: "Drucken" })] }), jsxs("div", { className: "print-only print-booking-header", children: [jsx("h1", { children: "Buchungsbest\u00E4tigung" }), jsx("div", { className: "subtitle", children: "Vielen Dank f\u00FCr deine Buchung! Hier sind deine Buchungsdetails." })] }), jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "var(--bw-spacing-large)" }, children: [jsxs("div", { className: "print-booking-card", style: {
|
|
10306
|
+
backgroundColor: "var(--bw-surface-color)",
|
|
10307
|
+
border: `1px solid var(--bw-border-color)`,
|
|
10308
|
+
borderRadius: "var(--bw-border-radius)",
|
|
10309
|
+
padding: "var(--bw-spacing)",
|
|
10310
|
+
marginBottom: "var(--bw-spacing-large)",
|
|
10311
|
+
}, children: [jsx("div", { className: "print-hidden", style: { marginBottom: "var(--bw-spacing)" }, children: jsx("h3", { style: {
|
|
10312
|
+
fontSize: "var(--bw-font-size-large)",
|
|
10313
|
+
fontWeight: "600",
|
|
10314
|
+
color: "var(--bw-text-color)",
|
|
10315
|
+
margin: "0",
|
|
10316
|
+
fontFamily: "var(--bw-font-family)",
|
|
10317
|
+
}, children: "Buchungsdetails" }) }), jsx("div", { className: "print-only", children: jsx("div", { className: "print-section-title", children: "Buchungsdetails" }) }), jsxs("div", { className: "space-y-4 print-only:space-y-2 print-only:p-0", children: [jsxs("div", { className: "gap-4 grid grid-cols-2 print-detail-grid", style: {
|
|
10318
|
+
display: "grid",
|
|
10319
|
+
gridTemplateColumns: "1fr 1fr",
|
|
10320
|
+
gap: "var(--bw-spacing)",
|
|
10321
|
+
}, children: [jsxs("div", { className: "print-detail-item", style: { marginBottom: "span 2" }, children: [jsx("div", { className: "font-medium text-muted-foreground text-sm print-detail-label", style: {
|
|
10322
|
+
color: "var(--bw-text-muted)",
|
|
10323
|
+
fontSize: "var(--bw-font-size-small)",
|
|
10324
|
+
fontFamily: "var(--bw-font-family)",
|
|
10325
|
+
}, children: "Buchungs-ID" }), jsx("p", { className: "font-semibold print-detail-value", style: {
|
|
10326
|
+
fontWeight: "600",
|
|
10327
|
+
color: "var(--bw-text-color)",
|
|
10328
|
+
fontFamily: "var(--bw-font-family)",
|
|
10329
|
+
fontSize: "var(--bw-font-size-medium)",
|
|
10330
|
+
margin: "0px 0px 6px 0",
|
|
10331
|
+
}, children: booking.bookingHash })] }), jsxs("div", { className: "print-detail-item", children: [jsx("div", { className: "font-medium text-muted-foreground text-sm print-detail-label", style: {
|
|
10332
|
+
color: "var(--bw-text-muted)",
|
|
10333
|
+
fontSize: "var(--bw-font-size-small)",
|
|
10334
|
+
fontFamily: "var(--bw-font-family)",
|
|
10335
|
+
}, children: "Bezahl-Status" }), jsxs("div", { children: [jsx("span", { className: "print-hidden", style: {
|
|
10336
|
+
backgroundColor: "var(--bw-success-color, #10B981)",
|
|
10337
|
+
color: "white",
|
|
10338
|
+
padding: "2px 8px",
|
|
10339
|
+
borderRadius: "var(--bw-border-radius-small)",
|
|
10340
|
+
fontSize: "var(--bw-font-size-small)",
|
|
10341
|
+
fontFamily: "var(--bw-font-family)",
|
|
10342
|
+
width: "fit-content",
|
|
10343
|
+
}, children: paymentStatus === "succeeded"
|
|
10344
|
+
? "erfolgreich"
|
|
10345
|
+
: paymentStatus === "canceled" || paymentStatus === "failed"
|
|
10346
|
+
? "fehlgeschlagen"
|
|
10347
|
+
: "in Bearbeitung" }), jsx("span", { className: "print-only print-status-badge print-status-paid", children: "Bezahlt" })] })] })] }), jsxs("div", { className: "print-detail-item print-only:col-span-2", children: [jsx("div", { className: "font-medium text-muted-foreground text-sm print-detail-label", style: {
|
|
10348
|
+
color: "var(--bw-text-muted)",
|
|
10349
|
+
fontSize: "var(--bw-font-size-small)",
|
|
10350
|
+
fontFamily: "var(--bw-font-family)",
|
|
10351
|
+
}, children: "Event" }), jsx("p", { className: "font-semibold print-detail-value", style: {
|
|
10352
|
+
fontWeight: "600",
|
|
10353
|
+
color: "var(--bw-text-color)",
|
|
10354
|
+
fontFamily: "var(--bw-font-family)",
|
|
10355
|
+
fontSize: "var(--bw-font-size-large)",
|
|
10356
|
+
margin: "0 0 6px 0",
|
|
10357
|
+
}, children: eventDetails.name })] }), jsxs("div", { className: "gap-4 grid grid-cols-2 print-detail-grid", style: {
|
|
10358
|
+
display: "grid",
|
|
10359
|
+
gridTemplateColumns: "1fr 1fr",
|
|
10360
|
+
gap: "var(--bw-spacing)",
|
|
10361
|
+
}, children: [jsxs("div", { className: "print-detail-item", children: [jsx("div", { className: "font-medium text-muted-foreground text-sm print-detail-label", style: {
|
|
10362
|
+
color: "var(--bw-text-muted)",
|
|
10363
|
+
fontSize: "var(--bw-font-size-small)",
|
|
10364
|
+
fontFamily: "var(--bw-font-family)",
|
|
10365
|
+
}, children: "Datum" }), jsx("p", { className: "print-detail-value", style: {
|
|
10366
|
+
fontWeight: "600",
|
|
10367
|
+
color: "var(--bw-text-color)",
|
|
10368
|
+
fontFamily: "var(--bw-font-family)",
|
|
10369
|
+
fontSize: "var(--bw-font-size-large)",
|
|
10370
|
+
margin: "0 0 6px 0",
|
|
10371
|
+
}, children: formatDate12(eventDetails.startTime) })] }), jsxs("div", { className: "print-detail-item", children: [jsx("div", { className: "font-medium text-muted-foreground text-sm print-detail-label", style: {
|
|
10372
|
+
color: "var(--bw-text-muted)",
|
|
10373
|
+
fontSize: "var(--bw-font-size-small)",
|
|
10374
|
+
fontFamily: "var(--bw-font-family)",
|
|
10375
|
+
}, children: "Zeit" }), jsxs("p", { className: "print-detail-value", style: {
|
|
10376
|
+
fontWeight: "600",
|
|
10377
|
+
color: "var(--bw-text-color)",
|
|
10378
|
+
fontFamily: "var(--bw-font-family)",
|
|
10379
|
+
fontSize: "var(--bw-font-size-large)",
|
|
10380
|
+
margin: "0 0 6px 0",
|
|
10381
|
+
}, children: [formatTime12(eventDetails.startTime), " - ", formatTime12(eventDetails.endTime)] })] })] })] })] }), formData.participants && formData.participants.length > 0 && (jsxs("div", { className: "print-booking-card", style: {
|
|
10382
|
+
border: `1px solid var(--bw-border-color)`,
|
|
10383
|
+
borderRadius: "var(--bw-border-radius)",
|
|
10384
|
+
padding: "var(--bw-spacing)",
|
|
10385
|
+
marginBottom: "var(--bw-spacing-large)",
|
|
10386
|
+
}, children: [jsx("div", { className: "print-hidden", style: { marginBottom: "var(--bw-spacing)" }, children: jsxs("h3", { style: {
|
|
10387
|
+
fontSize: "var(--bw-font-size-large)",
|
|
10388
|
+
fontWeight: "600",
|
|
10389
|
+
color: "var(--bw-text-color)",
|
|
10390
|
+
margin: "0",
|
|
10391
|
+
fontFamily: "var(--bw-font-family)",
|
|
10392
|
+
}, children: ["Teilnehmer (", formData.participants.length, ")"] }) }), jsx("div", { className: "print-only", children: jsxs("div", { className: "print-section-title", children: ["Teilnehmer (", formData.participants.length, ")"] }) }), jsx("div", { className: "print-only:p-0", children: jsx("div", { className: "space-y-3 print-only:space-y-1", style: {
|
|
10393
|
+
display: "flex",
|
|
10394
|
+
flexDirection: "column",
|
|
10395
|
+
gap: "var(--bw-spacing-small)",
|
|
10396
|
+
}, children: formData.participants
|
|
10397
|
+
.filter((p) => p.name.trim())
|
|
10398
|
+
.map((participant, index) => (jsx("div", { className: "flex justify-between items-center bg-muted p-3 rounded-lg print-participant", style: {
|
|
10399
|
+
display: "flex",
|
|
10400
|
+
justifyContent: "space-between",
|
|
10401
|
+
alignItems: "center",
|
|
10402
|
+
backgroundColor: "var(--bw-surface-color, #f9fafb)",
|
|
10403
|
+
padding: "var(--bw-spacing-small)",
|
|
10404
|
+
borderRadius: "var(--bw-border-radius-small)",
|
|
10405
|
+
}, children: jsxs("div", { className: "print-participant-info", children: [jsx("div", { className: "print-participant-name", style: {
|
|
10406
|
+
color: "var(--bw-text-color)",
|
|
10407
|
+
fontFamily: "var(--bw-font-family)",
|
|
10408
|
+
}, children: participant.name }), participant.age && (jsxs("div", { className: "text-muted-foreground text-sm print-participant-age", style: {
|
|
10409
|
+
color: "var(--bw-text-muted)",
|
|
10410
|
+
fontSize: "var(--bw-font-size-small)",
|
|
10411
|
+
fontFamily: "var(--bw-font-family)",
|
|
10412
|
+
}, children: [participant.age, " Jahre"] }))] }) }, index))) }) })] })), jsxs("div", { className: "print-booking-card", style: {
|
|
10413
|
+
backgroundColor: "var(--bw-surface-color)",
|
|
10414
|
+
border: `1px solid var(--bw-border-color)`,
|
|
10415
|
+
borderRadius: "var(--bw-border-radius)",
|
|
10416
|
+
padding: "var(--bw-spacing)",
|
|
10417
|
+
marginBottom: "var(--bw-spacing-large)",
|
|
10418
|
+
}, children: [jsx("div", { className: "print-hidden", style: { marginBottom: "var(--bw-spacing)" }, children: jsx("h3", { style: {
|
|
10419
|
+
fontSize: "var(--bw-font-size-large)",
|
|
10420
|
+
fontWeight: "600",
|
|
10421
|
+
color: "var(--bw-text-color)",
|
|
10422
|
+
margin: "0",
|
|
10423
|
+
fontFamily: "var(--bw-font-family)",
|
|
10424
|
+
}, children: "Zahlungs\u00FCbersicht" }) }), jsx("div", { className: "print-only", children: jsx("div", { className: "print-section-title", children: "Zahlungs\u00FCbersicht" }) }), jsxs("div", { className: "space-y-2 print-only:p-0 print-only:space-y-1", children: [jsxs("div", { className: "print-payment-summary print-only", children: [jsxs("div", { className: "print-payment-row", children: [jsx("span", { children: "Gesamtbetrag" }), jsx("span", { children: formatCurrency(booking.total) })] }), jsxs("div", { className: "print-payment-row", children: [jsx("span", { children: "Bezahlt" }), jsx("span", { children: formatCurrency(booking.total) })] })] }), jsxs("div", { className: "print-hidden space-y-2", style: { display: "flex", flexDirection: "column", gap: "var(--bw-spacing-small)" }, children: [jsxs("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center" }, children: [jsx("span", { style: { color: "var(--bw-text-color)", fontFamily: "var(--bw-font-family)" }, children: "Gesamtbetrag" }), jsx("span", { style: { color: "var(--bw-text-color)", fontFamily: "var(--bw-font-family)" }, children: formatCurrency(booking.total) })] }), jsxs("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center" }, children: [jsx("span", { style: { color: "var(--bw-text-color)", fontFamily: "var(--bw-font-family)" }, children: "Bezahlt" }), jsx("span", { style: { color: "var(--bw-text-color)", fontFamily: "var(--bw-font-family)" }, children: formatCurrency(booking.total) })] })] })] })] }), jsxs("div", { className: "print-booking-card", style: {
|
|
10425
|
+
backgroundColor: "var(--bw-surface-color)",
|
|
10426
|
+
border: `1px solid var(--bw-border-color)`,
|
|
10427
|
+
borderRadius: "var(--bw-border-radius)",
|
|
10428
|
+
padding: "var(--bw-spacing)",
|
|
10429
|
+
marginBottom: "var(--bw-spacing-large)",
|
|
10430
|
+
}, children: [jsx("div", { className: "print-hidden", style: { marginBottom: "var(--bw-spacing)" }, children: jsx("h3", { style: {
|
|
10431
|
+
fontSize: "var(--bw-font-size-large)",
|
|
10432
|
+
fontWeight: "600",
|
|
10433
|
+
color: "var(--bw-text-color)",
|
|
10434
|
+
margin: "0",
|
|
10435
|
+
fontFamily: "var(--bw-font-family)",
|
|
10436
|
+
}, children: "Kontaktdaten" }) }), jsx("div", { className: "print-only", children: jsx("div", { className: "print-section-title", children: "Kontaktdaten" }) }), jsxs("div", { className: "space-y-2 print-only:p-0 print-only:space-y-1", style: { display: "flex", flexDirection: "column", gap: "var(--bw-spacing-small)" }, children: [jsxs("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center" }, children: [jsx("span", { style: { color: "var(--bw-text-muted)", fontFamily: "var(--bw-font-family)" }, children: "Name:" }), jsx("span", { style: { color: "var(--bw-text-color)", fontFamily: "var(--bw-font-family)" }, children: formData.customerName })] }), jsxs("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center" }, children: [jsx("span", { style: { color: "var(--bw-text-muted)", fontFamily: "var(--bw-font-family)" }, children: "E-Mail:" }), jsx("span", { style: { color: "var(--bw-text-color)", fontFamily: "var(--bw-font-family)" }, children: formData.customerEmail })] }), formData.customerPhone && (jsxs("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center" }, children: [jsx("span", { style: { color: "var(--bw-text-muted)", fontFamily: "var(--bw-font-family)" }, children: "Telefon:" }), jsx("span", { style: { color: "var(--bw-text-color)", fontFamily: "var(--bw-font-family)" }, children: formData.customerPhone })] }))] })] }), jsx("div", { className: "print-booking-card", style: {
|
|
10437
|
+
backgroundColor: "var(--bw-surface-color)",
|
|
10438
|
+
border: `1px solid var(--bw-border-color)`,
|
|
10439
|
+
borderRadius: "var(--bw-border-radius)",
|
|
10440
|
+
padding: "var(--bw-spacing)",
|
|
10441
|
+
marginBottom: "var(--bw-spacing-large)",
|
|
10442
|
+
textAlign: "center",
|
|
10443
|
+
}, children: jsxs("p", { style: {
|
|
10444
|
+
color: "var(--bw-text-muted)",
|
|
10445
|
+
margin: 0,
|
|
10446
|
+
fontFamily: "var(--bw-font-family)",
|
|
10447
|
+
fontSize: "var(--bw-font-size-small)",
|
|
10448
|
+
textAlign: "center",
|
|
10449
|
+
}, children: ["Eine Best\u00E4tigungs-E-Mail wird in K\u00FCrze an ", formData.customerEmail, " gesendet."] }) }), paymentStatus && paymentStatus !== "succeeded" && (jsxs("div", { style: {
|
|
10450
|
+
backgroundColor: "var(--bw-warning-bg, #FEF3C7)",
|
|
10451
|
+
border: "1px solid var(--bw-warning-border, #F59E0B)",
|
|
10452
|
+
borderRadius: "var(--bw-border-radius)",
|
|
10453
|
+
padding: "var(--bw-spacing)",
|
|
10454
|
+
marginBottom: "var(--bw-spacing-large)",
|
|
10455
|
+
textAlign: "center",
|
|
10456
|
+
}, children: [jsx("p", { style: {
|
|
10457
|
+
color: "var(--bw-warning-text, #92400E)",
|
|
10458
|
+
margin: "0 0 var(--bw-spacing) 0",
|
|
10459
|
+
fontFamily: "var(--bw-font-family)",
|
|
10460
|
+
fontWeight: "600",
|
|
10461
|
+
}, children: "Zahlung wird noch verarbeitet" }), jsxs("p", { style: {
|
|
10462
|
+
color: "var(--bw-warning-text, #92400E)",
|
|
10463
|
+
margin: "0 0 var(--bw-spacing) 0",
|
|
10464
|
+
fontFamily: "var(--bw-font-family)",
|
|
10465
|
+
fontSize: "var(--bw-font-size-small)",
|
|
10466
|
+
}, children: ["Status: ", paymentStatus] }), jsx("button", { onClick: () => fetchBookingData(), disabled: isLoading, style: {
|
|
10467
|
+
backgroundColor: "var(--bw-warning-text, #92400E)",
|
|
10468
|
+
color: "white",
|
|
10469
|
+
padding: "8px 16px",
|
|
10470
|
+
border: "none",
|
|
10471
|
+
borderRadius: "var(--bw-border-radius)",
|
|
10472
|
+
fontSize: "var(--bw-font-size-small)",
|
|
10473
|
+
fontWeight: "600",
|
|
10474
|
+
cursor: isLoading ? "not-allowed" : "pointer",
|
|
10475
|
+
fontFamily: "var(--bw-font-family)",
|
|
10476
|
+
opacity: isLoading ? 0.6 : 1,
|
|
10477
|
+
transition: "all 0.2s ease",
|
|
10478
|
+
}, children: isLoading ? "Aktualisiere..." : "Status aktualisieren" })] })), jsx("div", { style: {
|
|
10479
|
+
textAlign: "center",
|
|
10480
|
+
marginTop: "var(--bw-spacing-large)",
|
|
10481
|
+
paddingTop: "var(--bw-spacing)",
|
|
10482
|
+
borderTop: `1px solid var(--bw-border-color)`,
|
|
10483
|
+
}, children: jsx("button", { onClick: onClose, style: {
|
|
10484
|
+
backgroundColor: "var(--bw-highlight-color)",
|
|
10485
|
+
color: "white",
|
|
10486
|
+
padding: "12px 32px",
|
|
10487
|
+
border: "none",
|
|
10488
|
+
borderRadius: "var(--bw-border-radius)",
|
|
10489
|
+
fontSize: "var(--bw-font-size)",
|
|
10490
|
+
fontWeight: "600",
|
|
10491
|
+
cursor: "pointer",
|
|
10492
|
+
fontFamily: "var(--bw-font-family)",
|
|
10493
|
+
transition: "all 0.2s ease",
|
|
10494
|
+
}, onMouseEnter: (e) => {
|
|
10495
|
+
e.currentTarget.style.opacity = "0.9";
|
|
10496
|
+
}, onMouseLeave: (e) => {
|
|
10497
|
+
e.currentTarget.style.opacity = "1";
|
|
10498
|
+
}, children: "Schlie\u00DFen" }) }), jsxs("div", { className: "print-only print-footer", children: [jsxs("p", { children: ["Diese Buchungsbest\u00E4tigung wurde am", " ", new Date().toLocaleString("de-DE", {
|
|
10499
|
+
day: "2-digit",
|
|
10500
|
+
month: "2-digit",
|
|
10501
|
+
year: "numeric",
|
|
10502
|
+
hour: "2-digit",
|
|
10503
|
+
minute: "2-digit",
|
|
10504
|
+
timeZone: "Europe/Berlin",
|
|
10505
|
+
}), " ", "erstellt."] }), jsx("p", { children: "Bei Fragen zu deiner Buchung kontaktiere uns gerne." })] })] })] }) }));
|
|
10506
|
+
};
|
|
10507
|
+
|
|
10234
10508
|
const months = [
|
|
10235
10509
|
"Januar",
|
|
10236
10510
|
"Februar",
|
|
@@ -11308,198 +11582,6 @@ function NextEventsPreview({ events, onEventSelect, onShowAll, showAllButtonText
|
|
|
11308
11582
|
}
|
|
11309
11583
|
|
|
11310
11584
|
// Predefined themes & Style Provider have been moved to ../styles/StyleProvider.tsx
|
|
11311
|
-
// Success Modal Component
|
|
11312
|
-
const BookingSuccessModal = ({ isOpen, onClose, bookingData, eventDetails, formData, config, }) => {
|
|
11313
|
-
if (!isOpen || !bookingData)
|
|
11314
|
-
return null;
|
|
11315
|
-
const booking = bookingData.booking;
|
|
11316
|
-
return (jsx("div", { style: {
|
|
11317
|
-
position: "fixed",
|
|
11318
|
-
top: 0,
|
|
11319
|
-
left: 0,
|
|
11320
|
-
right: 0,
|
|
11321
|
-
bottom: 0,
|
|
11322
|
-
backgroundColor: "rgba(0, 0, 0, 0.5)",
|
|
11323
|
-
zIndex: 10000,
|
|
11324
|
-
display: "flex",
|
|
11325
|
-
alignItems: "center",
|
|
11326
|
-
justifyContent: "center",
|
|
11327
|
-
padding: "var(--bw-spacing)",
|
|
11328
|
-
}, children: jsxs("div", { style: {
|
|
11329
|
-
backgroundColor: "var(--bw-background-color)",
|
|
11330
|
-
borderRadius: "var(--bw-border-radius)",
|
|
11331
|
-
padding: "var(--bw-spacing-large)",
|
|
11332
|
-
maxWidth: "500px",
|
|
11333
|
-
width: "100%",
|
|
11334
|
-
maxHeight: "90vh",
|
|
11335
|
-
overflow: "auto",
|
|
11336
|
-
position: "relative",
|
|
11337
|
-
border: `1px solid var(--bw-border-color)`,
|
|
11338
|
-
boxShadow: "0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04)",
|
|
11339
|
-
}, children: [jsx("button", { onClick: onClose, style: {
|
|
11340
|
-
position: "absolute",
|
|
11341
|
-
top: "var(--bw-spacing)",
|
|
11342
|
-
right: "var(--bw-spacing)",
|
|
11343
|
-
background: "none",
|
|
11344
|
-
border: "none",
|
|
11345
|
-
fontSize: "24px",
|
|
11346
|
-
cursor: "pointer",
|
|
11347
|
-
color: "var(--bw-text-muted)",
|
|
11348
|
-
width: "32px",
|
|
11349
|
-
height: "32px",
|
|
11350
|
-
display: "flex",
|
|
11351
|
-
alignItems: "center",
|
|
11352
|
-
justifyContent: "center",
|
|
11353
|
-
borderRadius: "var(--bw-border-radius-small)",
|
|
11354
|
-
}, children: "\u00D7" }), jsxs("div", { style: {
|
|
11355
|
-
textAlign: "center",
|
|
11356
|
-
marginBottom: "var(--bw-spacing-large)",
|
|
11357
|
-
}, children: [jsx("div", { style: {
|
|
11358
|
-
width: "64px",
|
|
11359
|
-
height: "64px",
|
|
11360
|
-
backgroundColor: "var(--bw-success-color, #10B981)",
|
|
11361
|
-
borderRadius: "50%",
|
|
11362
|
-
margin: "0 auto var(--bw-spacing)",
|
|
11363
|
-
display: "flex",
|
|
11364
|
-
alignItems: "center",
|
|
11365
|
-
justifyContent: "center",
|
|
11366
|
-
fontSize: "32px",
|
|
11367
|
-
color: "white",
|
|
11368
|
-
}, children: "\u2713" }), jsx("h2", { style: {
|
|
11369
|
-
fontSize: "var(--bw-font-size-xl)",
|
|
11370
|
-
fontWeight: "700",
|
|
11371
|
-
color: "var(--bw-text-color)",
|
|
11372
|
-
margin: "0 0 var(--bw-spacing-small) 0",
|
|
11373
|
-
fontFamily: "var(--bw-font-family)",
|
|
11374
|
-
}, children: "Buchung erfolgreich!" }), jsx("p", { style: {
|
|
11375
|
-
color: "var(--bw-text-muted)",
|
|
11376
|
-
fontFamily: "var(--bw-font-family)",
|
|
11377
|
-
margin: 0,
|
|
11378
|
-
}, children: "Deine Buchung wurde erfolgreich abgeschlossen." })] }), jsxs("div", { style: {
|
|
11379
|
-
backgroundColor: "var(--bw-surface-color)",
|
|
11380
|
-
border: `1px solid var(--bw-border-color)`,
|
|
11381
|
-
borderRadius: "var(--bw-border-radius)",
|
|
11382
|
-
padding: "var(--bw-spacing)",
|
|
11383
|
-
marginBottom: "var(--bw-spacing-large)",
|
|
11384
|
-
}, children: [jsx("h3", { style: {
|
|
11385
|
-
fontSize: "var(--bw-font-size-large)",
|
|
11386
|
-
fontWeight: "600",
|
|
11387
|
-
color: "var(--bw-text-color)",
|
|
11388
|
-
margin: "0 0 var(--bw-spacing) 0",
|
|
11389
|
-
fontFamily: "var(--bw-font-family)",
|
|
11390
|
-
}, children: "Buchungsdetails" }), jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "var(--bw-spacing)" }, children: [booking.bookingHash && (jsxs("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center" }, children: [jsx("span", { style: { color: "var(--bw-text-muted)", fontFamily: "var(--bw-font-family)" }, children: "Buchungs-ID:" }), jsx("span", { style: {
|
|
11391
|
-
color: "var(--bw-text-color)",
|
|
11392
|
-
fontWeight: "500",
|
|
11393
|
-
fontFamily: "monospace",
|
|
11394
|
-
fontSize: "var(--bw-font-size-small)",
|
|
11395
|
-
backgroundColor: "var(--bw-background-color)",
|
|
11396
|
-
padding: "4px 8px",
|
|
11397
|
-
borderRadius: "var(--bw-border-radius-small)",
|
|
11398
|
-
}, children: booking.bookingHash })] })), jsxs("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center" }, children: [jsx("span", { style: { color: "var(--bw-text-muted)", fontFamily: "var(--bw-font-family)" }, children: "Event:" }), jsx("span", { style: {
|
|
11399
|
-
color: "var(--bw-text-color)",
|
|
11400
|
-
fontWeight: "500",
|
|
11401
|
-
fontFamily: "var(--bw-font-family)",
|
|
11402
|
-
textAlign: "right",
|
|
11403
|
-
maxWidth: "60%",
|
|
11404
|
-
}, children: eventDetails.name })] }), jsxs("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center" }, children: [jsx("span", { style: { color: "var(--bw-text-muted)", fontFamily: "var(--bw-font-family)" }, children: "Datum:" }), jsx("span", { style: {
|
|
11405
|
-
color: "var(--bw-text-color)",
|
|
11406
|
-
fontWeight: "500",
|
|
11407
|
-
fontFamily: "var(--bw-font-family)",
|
|
11408
|
-
textAlign: "right",
|
|
11409
|
-
maxWidth: "60%",
|
|
11410
|
-
}, children: formatDate(eventDetails.startTime) })] }), jsxs("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center" }, children: [jsx("span", { style: { color: "var(--bw-text-muted)", fontFamily: "var(--bw-font-family)" }, children: "Teilnehmer:" }), jsx("span", { style: {
|
|
11411
|
-
color: "var(--bw-text-color)",
|
|
11412
|
-
fontWeight: "500",
|
|
11413
|
-
fontFamily: "var(--bw-font-family)",
|
|
11414
|
-
}, children: booking.participantCount })] }), jsxs("div", { style: {
|
|
11415
|
-
display: "flex",
|
|
11416
|
-
justifyContent: "space-between",
|
|
11417
|
-
alignItems: "center",
|
|
11418
|
-
borderTop: `1px solid var(--bw-border-color)`,
|
|
11419
|
-
paddingTop: "var(--bw-spacing)",
|
|
11420
|
-
marginTop: "var(--bw-spacing)",
|
|
11421
|
-
}, children: [jsx("span", { style: {
|
|
11422
|
-
color: "var(--bw-text-color)",
|
|
11423
|
-
fontWeight: "600",
|
|
11424
|
-
fontFamily: "var(--bw-font-family)",
|
|
11425
|
-
}, children: "Gesamtbetrag:" }), jsx("span", { style: {
|
|
11426
|
-
color: "var(--bw-text-color)",
|
|
11427
|
-
fontWeight: "600",
|
|
11428
|
-
fontSize: "var(--bw-font-size-large)",
|
|
11429
|
-
fontFamily: "var(--bw-font-family)",
|
|
11430
|
-
}, children: formatCurrency(booking.total) })] })] })] }), formData.participants && formData.participants.length > 0 && (jsxs("div", { style: {
|
|
11431
|
-
backgroundColor: "var(--bw-surface-color)",
|
|
11432
|
-
border: `1px solid var(--bw-border-color)`,
|
|
11433
|
-
borderRadius: "var(--bw-border-radius)",
|
|
11434
|
-
padding: "var(--bw-spacing)",
|
|
11435
|
-
marginBottom: "var(--bw-spacing-large)",
|
|
11436
|
-
}, children: [jsx("h3", { style: {
|
|
11437
|
-
fontSize: "var(--bw-font-size-large)",
|
|
11438
|
-
fontWeight: "600",
|
|
11439
|
-
color: "var(--bw-text-color)",
|
|
11440
|
-
margin: "0 0 var(--bw-spacing) 0",
|
|
11441
|
-
fontFamily: "var(--bw-font-family)",
|
|
11442
|
-
}, children: "Teilnehmer" }), jsx("div", { style: { display: "flex", flexDirection: "column", gap: "var(--bw-spacing-small)" }, children: formData.participants
|
|
11443
|
-
.filter((p) => p.name.trim())
|
|
11444
|
-
.map((participant, index) => (jsxs("div", { style: {
|
|
11445
|
-
display: "flex",
|
|
11446
|
-
justifyContent: "space-between",
|
|
11447
|
-
alignItems: "center",
|
|
11448
|
-
padding: "var(--bw-spacing-small)",
|
|
11449
|
-
backgroundColor: "var(--bw-background-color)",
|
|
11450
|
-
borderRadius: "var(--bw-border-radius-small)",
|
|
11451
|
-
}, children: [jsx("span", { style: {
|
|
11452
|
-
color: "var(--bw-text-color)",
|
|
11453
|
-
fontFamily: "var(--bw-font-family)",
|
|
11454
|
-
}, children: participant.name }), participant.age && (jsxs("span", { style: {
|
|
11455
|
-
color: "var(--bw-text-muted)",
|
|
11456
|
-
fontSize: "var(--bw-font-size-small)",
|
|
11457
|
-
fontFamily: "var(--bw-font-family)",
|
|
11458
|
-
}, children: [participant.age, " Jahre"] }))] }, index))) })] })), jsxs("div", { style: {
|
|
11459
|
-
backgroundColor: "var(--bw-surface-color)",
|
|
11460
|
-
border: `1px solid var(--bw-border-color)`,
|
|
11461
|
-
borderRadius: "var(--bw-border-radius)",
|
|
11462
|
-
padding: "var(--bw-spacing)",
|
|
11463
|
-
marginBottom: "var(--bw-spacing-large)",
|
|
11464
|
-
}, children: [jsx("h3", { style: {
|
|
11465
|
-
fontSize: "var(--bw-font-size-large)",
|
|
11466
|
-
fontWeight: "600",
|
|
11467
|
-
color: "var(--bw-text-color)",
|
|
11468
|
-
margin: "0 0 var(--bw-spacing) 0",
|
|
11469
|
-
fontFamily: "var(--bw-font-family)",
|
|
11470
|
-
}, children: "Kontaktdaten" }), jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "var(--bw-spacing-small)" }, children: [jsxs("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center" }, children: [jsx("span", { style: { color: "var(--bw-text-muted)", fontFamily: "var(--bw-font-family)" }, children: "Name:" }), jsx("span", { style: { color: "var(--bw-text-color)", fontFamily: "var(--bw-font-family)" }, children: formData.customerName })] }), jsxs("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center" }, children: [jsx("span", { style: { color: "var(--bw-text-muted)", fontFamily: "var(--bw-font-family)" }, children: "E-Mail:" }), jsx("span", { style: { color: "var(--bw-text-color)", fontFamily: "var(--bw-font-family)" }, children: formData.customerEmail })] }), formData.customerPhone && (jsxs("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center" }, children: [jsx("span", { style: { color: "var(--bw-text-muted)", fontFamily: "var(--bw-font-family)" }, children: "Telefon:" }), jsx("span", { style: { color: "var(--bw-text-color)", fontFamily: "var(--bw-font-family)" }, children: formData.customerPhone })] }))] })] }), jsxs("div", { style: {
|
|
11471
|
-
backgroundColor: "var(--bw-surface-muted-bg, rgba(59, 130, 246, 0.05))",
|
|
11472
|
-
border: `1px solid var(--bw-border-color)`,
|
|
11473
|
-
borderRadius: "var(--bw-border-radius)",
|
|
11474
|
-
padding: "var(--bw-spacing)",
|
|
11475
|
-
marginBottom: "var(--bw-spacing-large)",
|
|
11476
|
-
textAlign: "center",
|
|
11477
|
-
}, children: [jsx("div", { style: {
|
|
11478
|
-
color: "var(--bw-highlight-color)",
|
|
11479
|
-
fontSize: "24px",
|
|
11480
|
-
marginBottom: "var(--bw-spacing-small)",
|
|
11481
|
-
}, children: "\uD83D\uDCE7" }), jsxs("p", { style: {
|
|
11482
|
-
color: "var(--bw-text-muted)",
|
|
11483
|
-
margin: 0,
|
|
11484
|
-
fontFamily: "var(--bw-font-family)",
|
|
11485
|
-
fontSize: "var(--bw-font-size-small)",
|
|
11486
|
-
}, children: ["Eine Best\u00E4tigungs-E-Mail wird in K\u00FCrze an ", formData.customerEmail, " gesendet."] })] }), jsx("div", { style: { textAlign: "center" }, children: jsx("button", { onClick: onClose, style: {
|
|
11487
|
-
backgroundColor: "var(--bw-highlight-color)",
|
|
11488
|
-
color: "white",
|
|
11489
|
-
padding: "12px 32px",
|
|
11490
|
-
border: "none",
|
|
11491
|
-
borderRadius: "var(--bw-border-radius)",
|
|
11492
|
-
fontSize: "var(--bw-font-size)",
|
|
11493
|
-
fontWeight: "600",
|
|
11494
|
-
cursor: "pointer",
|
|
11495
|
-
fontFamily: "var(--bw-font-family)",
|
|
11496
|
-
transition: "all 0.2s ease",
|
|
11497
|
-
}, onMouseEnter: (e) => {
|
|
11498
|
-
e.currentTarget.style.opacity = "0.9";
|
|
11499
|
-
}, onMouseLeave: (e) => {
|
|
11500
|
-
e.currentTarget.style.opacity = "1";
|
|
11501
|
-
}, children: "Schlie\u00DFen" }) })] }) }));
|
|
11502
|
-
};
|
|
11503
11585
|
// Main widget component
|
|
11504
11586
|
function UniversalBookingWidget({ config: baseConfig }) {
|
|
11505
11587
|
// Apply URL parameter inference
|
|
@@ -11529,7 +11611,6 @@ function UniversalBookingWidget({ config: baseConfig }) {
|
|
|
11529
11611
|
// Booking flow state
|
|
11530
11612
|
const [eventDetails, setEventDetails] = useState(null);
|
|
11531
11613
|
const [stripePromise, setStripePromise] = useState(null);
|
|
11532
|
-
const [clientSecret, setClientSecret] = useState(null);
|
|
11533
11614
|
// SEPARATED LOADING STATES
|
|
11534
11615
|
const [isLoading, setIsLoading] = useState(true); // Only for initial widget load
|
|
11535
11616
|
const [isLoadingEventInstances, setIsLoadingEventInstances] = useState(false); // For loading event instances in sidebar
|
|
@@ -11537,7 +11618,7 @@ function UniversalBookingWidget({ config: baseConfig }) {
|
|
|
11537
11618
|
const [isLoadingShowAll, setIsLoadingShowAll] = useState(false); // For "show all events" operation
|
|
11538
11619
|
const [error, setError] = useState(null);
|
|
11539
11620
|
const [isSuccess, setIsSuccess] = useState(false);
|
|
11540
|
-
const [
|
|
11621
|
+
const [successPaymentIntentId, setSuccessPaymentIntentId] = useState(null);
|
|
11541
11622
|
const [systemConfig, setSystemConfig] = useState(null);
|
|
11542
11623
|
// PERFORMANCE OPTIMIZATION: Lazy component loading
|
|
11543
11624
|
const [shouldRenderInstanceSelection, setShouldRenderInstanceSelection] = useState(false);
|
|
@@ -11584,6 +11665,29 @@ function UniversalBookingWidget({ config: baseConfig }) {
|
|
|
11584
11665
|
initializeWidget();
|
|
11585
11666
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
11586
11667
|
}, [config]);
|
|
11668
|
+
// Handle Stripe payment return
|
|
11669
|
+
useEffect(() => {
|
|
11670
|
+
const handleStripeReturn = () => {
|
|
11671
|
+
const stripeReturn = detectStripeReturn();
|
|
11672
|
+
if (stripeReturn) {
|
|
11673
|
+
if (stripeReturn.redirectStatus === "succeeded") {
|
|
11674
|
+
// Store payment intent ID and show success modal
|
|
11675
|
+
setSuccessPaymentIntentId(stripeReturn.paymentIntent);
|
|
11676
|
+
setIsSuccess(true);
|
|
11677
|
+
}
|
|
11678
|
+
else if (stripeReturn.redirectStatus === "failed") {
|
|
11679
|
+
setError("Die Zahlung war nicht erfolgreich. Bitte versuche es erneut.");
|
|
11680
|
+
}
|
|
11681
|
+
else {
|
|
11682
|
+
setError("Die Zahlung konnte nicht abgeschlossen werden. Bitte versuche es erneut.");
|
|
11683
|
+
}
|
|
11684
|
+
}
|
|
11685
|
+
};
|
|
11686
|
+
// Only run on mount to avoid running multiple times
|
|
11687
|
+
if (!isLoading) {
|
|
11688
|
+
handleStripeReturn();
|
|
11689
|
+
}
|
|
11690
|
+
}, [isLoading]); // Only depend on isLoading to run after initial load
|
|
11587
11691
|
// PERFORMANCE OPTIMIZATION: Lazy load components when needed
|
|
11588
11692
|
useEffect(() => {
|
|
11589
11693
|
if (currentStep === "eventInstances" && !shouldRenderInstanceSelection) {
|
|
@@ -11826,7 +11930,7 @@ function UniversalBookingWidget({ config: baseConfig }) {
|
|
|
11826
11930
|
};
|
|
11827
11931
|
const handleBookingSuccess = (result) => {
|
|
11828
11932
|
setIsSuccess(true);
|
|
11829
|
-
|
|
11933
|
+
setSuccessPaymentIntentId(result.paymentIntent.id);
|
|
11830
11934
|
config.onSuccess?.(result);
|
|
11831
11935
|
};
|
|
11832
11936
|
const handleBookingError = (errorMessage) => {
|
|
@@ -11990,16 +12094,6 @@ function UniversalBookingWidget({ config: baseConfig }) {
|
|
|
11990
12094
|
fontFamily: "var(--bw-font-family)",
|
|
11991
12095
|
}, children: "Falls das Problem weiterhin besteht, kontaktiere bitte den Support." })] }) }) }));
|
|
11992
12096
|
}
|
|
11993
|
-
// Success state
|
|
11994
|
-
if (isSuccess) {
|
|
11995
|
-
return (jsx(StyleProvider, { config: config, children: jsx(BookingSuccessModal, { isOpen: isSuccess, onClose: () => {
|
|
11996
|
-
setIsSuccess(false);
|
|
11997
|
-
setCurrentStep("eventTypes");
|
|
11998
|
-
// Reset lazy loading flags
|
|
11999
|
-
setShouldRenderInstanceSelection(false);
|
|
12000
|
-
setShouldRenderBookingForm(false);
|
|
12001
|
-
}, bookingData: successData, eventDetails: eventDetails, formData: successData.formData, config: config }) }));
|
|
12002
|
-
}
|
|
12003
12097
|
// Main view based on view mode
|
|
12004
12098
|
if (viewMode === "next-events" && showingPreview) {
|
|
12005
12099
|
// Next events preview mode
|
|
@@ -12015,17 +12109,47 @@ function UniversalBookingWidget({ config: baseConfig }) {
|
|
|
12015
12109
|
setCurrentStep("eventTypes");
|
|
12016
12110
|
setShowingPreview(true);
|
|
12017
12111
|
setEventDetails(null);
|
|
12018
|
-
}, systemConfig: systemConfig }))
|
|
12112
|
+
}, systemConfig: systemConfig })), jsx(BookingSuccessModal, { isOpen: isSuccess, onClose: () => {
|
|
12113
|
+
setIsSuccess(false);
|
|
12114
|
+
setCurrentStep("eventTypes");
|
|
12115
|
+
setShowingPreview(true);
|
|
12116
|
+
// Reset state
|
|
12117
|
+
setSuccessPaymentIntentId(null);
|
|
12118
|
+
// Reset lazy loading flags
|
|
12119
|
+
setShouldRenderInstanceSelection(false);
|
|
12120
|
+
setShouldRenderBookingForm(false);
|
|
12121
|
+
// Clean up URL to remove Stripe parameters
|
|
12122
|
+
const url = new URL(window.location.href);
|
|
12123
|
+
url.searchParams.delete("payment_intent");
|
|
12124
|
+
url.searchParams.delete("payment_intent_client_secret");
|
|
12125
|
+
url.searchParams.delete("redirect_status");
|
|
12126
|
+
window.history.replaceState({}, "", url.toString());
|
|
12127
|
+
}, config: config, onError: setError, paymentIntentId: successPaymentIntentId })] }));
|
|
12019
12128
|
}
|
|
12020
12129
|
if (viewMode === "next-events" && !showingPreview && currentStep === "eventInstances") {
|
|
12021
12130
|
// Show all events for the single event type
|
|
12022
|
-
return (
|
|
12023
|
-
|
|
12024
|
-
|
|
12025
|
-
|
|
12026
|
-
|
|
12027
|
-
|
|
12028
|
-
|
|
12131
|
+
return (jsxs(StyleProvider, { config: config, children: [shouldRenderInstanceSelection && (jsx(EventInstanceSelection, { eventInstances: eventInstances, selectedEventType: selectedEventType, onEventInstanceSelect: handleEventInstanceSelect, onBackToEventTypes: () => {
|
|
12132
|
+
setShowingPreview(true);
|
|
12133
|
+
setCurrentStep("eventTypes");
|
|
12134
|
+
}, isOpen: currentStep === "eventInstances", onClose: () => {
|
|
12135
|
+
setShowingPreview(true);
|
|
12136
|
+
setCurrentStep("eventTypes");
|
|
12137
|
+
}, isLoadingEventInstances: isLoadingEventInstances, isLoadingEventDetails: isLoadingEventDetails })), jsx(BookingSuccessModal, { isOpen: isSuccess, onClose: () => {
|
|
12138
|
+
setIsSuccess(false);
|
|
12139
|
+
setCurrentStep("eventTypes");
|
|
12140
|
+
setShowingPreview(true);
|
|
12141
|
+
// Reset state
|
|
12142
|
+
setSuccessPaymentIntentId(null);
|
|
12143
|
+
// Reset lazy loading flags
|
|
12144
|
+
setShouldRenderInstanceSelection(false);
|
|
12145
|
+
setShouldRenderBookingForm(false);
|
|
12146
|
+
// Clean up URL to remove Stripe parameters
|
|
12147
|
+
const url = new URL(window.location.href);
|
|
12148
|
+
url.searchParams.delete("payment_intent");
|
|
12149
|
+
url.searchParams.delete("payment_intent_client_secret");
|
|
12150
|
+
url.searchParams.delete("redirect_status");
|
|
12151
|
+
window.history.replaceState({}, "", url.toString());
|
|
12152
|
+
}, config: config, onError: setError, paymentIntentId: successPaymentIntentId })] }));
|
|
12029
12153
|
}
|
|
12030
12154
|
if (viewMode === "button" && (isSingleEventTypeMode || isDirectInstanceMode)) {
|
|
12031
12155
|
// Button mode - show button that opens sidebar/booking directly
|
|
@@ -12055,7 +12179,22 @@ function UniversalBookingWidget({ config: baseConfig }) {
|
|
|
12055
12179
|
setShouldRenderInstanceSelection(true);
|
|
12056
12180
|
}
|
|
12057
12181
|
}, children: config.buttonText ||
|
|
12058
|
-
(isDirectInstanceMode ? "Jetzt buchen" : "Jetzt Termin auswählen") }), shouldRenderInstanceSelection && (jsx(EventInstanceSelection, { eventInstances: eventInstances, selectedEventType: selectedEventType, onEventInstanceSelect: handleEventInstanceSelect, onBackToEventTypes: () => setSidebarOpen(false), isOpen: sidebarOpen, onClose: () => setSidebarOpen(false), isLoadingEventInstances: isLoadingEventInstances, isLoadingEventDetails: isLoadingEventDetails })), shouldRenderBookingForm && eventDetails && (jsx(BookingForm, { config: config, eventDetails: eventDetails, stripePromise: stripePromise, onSuccess: handleBookingSuccess, onError: handleBookingError, onBackToEventInstances: () => setCurrentStep(isDirectInstanceMode ? "eventTypes" : "eventInstances"), onBackToEventTypes: () => setSidebarOpen(false), selectedEventType: selectedEventType, selectedEventInstance: selectedEventInstance, isOpen: currentStep === "booking" && !!eventDetails, onClose: () => setCurrentStep(isDirectInstanceMode ? "eventTypes" : "eventInstances"), systemConfig: systemConfig }))
|
|
12182
|
+
(isDirectInstanceMode ? "Jetzt buchen" : "Jetzt Termin auswählen") }), shouldRenderInstanceSelection && (jsx(EventInstanceSelection, { eventInstances: eventInstances, selectedEventType: selectedEventType, onEventInstanceSelect: handleEventInstanceSelect, onBackToEventTypes: () => setSidebarOpen(false), isOpen: sidebarOpen, onClose: () => setSidebarOpen(false), isLoadingEventInstances: isLoadingEventInstances, isLoadingEventDetails: isLoadingEventDetails })), shouldRenderBookingForm && eventDetails && (jsx(BookingForm, { config: config, eventDetails: eventDetails, stripePromise: stripePromise, onSuccess: handleBookingSuccess, onError: handleBookingError, onBackToEventInstances: () => setCurrentStep(isDirectInstanceMode ? "eventTypes" : "eventInstances"), onBackToEventTypes: () => setSidebarOpen(false), selectedEventType: selectedEventType, selectedEventInstance: selectedEventInstance, isOpen: currentStep === "booking" && !!eventDetails, onClose: () => setCurrentStep(isDirectInstanceMode ? "eventTypes" : "eventInstances"), systemConfig: systemConfig })), jsx(BookingSuccessModal, { isOpen: isSuccess, onClose: () => {
|
|
12183
|
+
setIsSuccess(false);
|
|
12184
|
+
setCurrentStep("eventTypes");
|
|
12185
|
+
setSidebarOpen(false);
|
|
12186
|
+
// Reset state
|
|
12187
|
+
setSuccessPaymentIntentId(null);
|
|
12188
|
+
// Reset lazy loading flags
|
|
12189
|
+
setShouldRenderInstanceSelection(false);
|
|
12190
|
+
setShouldRenderBookingForm(false);
|
|
12191
|
+
// Clean up URL to remove Stripe parameters
|
|
12192
|
+
const url = new URL(window.location.href);
|
|
12193
|
+
url.searchParams.delete("payment_intent");
|
|
12194
|
+
url.searchParams.delete("payment_intent_client_secret");
|
|
12195
|
+
url.searchParams.delete("redirect_status");
|
|
12196
|
+
window.history.replaceState({}, "", url.toString());
|
|
12197
|
+
}, config: config, onError: setError, paymentIntentId: successPaymentIntentId })] }) }));
|
|
12059
12198
|
}
|
|
12060
12199
|
// Cards mode (default) - show event type selection
|
|
12061
12200
|
const cardsView = (jsx(EventTypeSelection, { eventTypes: eventTypes, onEventTypeSelect: handleEventTypeSelect, isLoading: isLoading, skeletonCount: getSkeletonCount() }));
|
|
@@ -12088,7 +12227,21 @@ function UniversalBookingWidget({ config: baseConfig }) {
|
|
|
12088
12227
|
};
|
|
12089
12228
|
};
|
|
12090
12229
|
const backHandlers = getBackHandlers();
|
|
12091
|
-
return (jsxs(StyleProvider, { config: config, children: [cardsView, shouldRenderInstanceSelection && (jsx(EventInstanceSelection, { eventInstances: eventInstances, selectedEventType: selectedEventType, onEventInstanceSelect: handleEventInstanceSelect, onBackToEventTypes: handleBackToEventTypes, isOpen: currentStep === "eventInstances", onClose: handleBackToEventTypes, isLoadingEventInstances: isLoadingEventInstances, isLoadingEventDetails: isLoadingEventDetails })), shouldRenderBookingForm && eventDetails && (jsx(BookingForm, { config: config, eventDetails: eventDetails, stripePromise: stripePromise, onSuccess: handleBookingSuccess, onError: handleBookingError, onBackToEventInstances: backHandlers.onBackToEventInstances, onBackToEventTypes: backHandlers.onBackToEventTypes, selectedEventType: selectedEventType, selectedEventInstance: selectedEventInstance, isOpen: currentStep === "booking" && !!eventDetails, onClose: backHandlers.onClose, systemConfig: systemConfig }))
|
|
12230
|
+
return (jsxs(StyleProvider, { config: config, children: [cardsView, shouldRenderInstanceSelection && (jsx(EventInstanceSelection, { eventInstances: eventInstances, selectedEventType: selectedEventType, onEventInstanceSelect: handleEventInstanceSelect, onBackToEventTypes: handleBackToEventTypes, isOpen: currentStep === "eventInstances", onClose: handleBackToEventTypes, isLoadingEventInstances: isLoadingEventInstances, isLoadingEventDetails: isLoadingEventDetails })), shouldRenderBookingForm && eventDetails && (jsx(BookingForm, { config: config, eventDetails: eventDetails, stripePromise: stripePromise, onSuccess: handleBookingSuccess, onError: handleBookingError, onBackToEventInstances: backHandlers.onBackToEventInstances, onBackToEventTypes: backHandlers.onBackToEventTypes, selectedEventType: selectedEventType, selectedEventInstance: selectedEventInstance, isOpen: currentStep === "booking" && !!eventDetails, onClose: backHandlers.onClose, systemConfig: systemConfig })), jsx(BookingSuccessModal, { isOpen: isSuccess, onClose: () => {
|
|
12231
|
+
setIsSuccess(false);
|
|
12232
|
+
setCurrentStep("eventTypes");
|
|
12233
|
+
// Reset state
|
|
12234
|
+
setSuccessPaymentIntentId(null);
|
|
12235
|
+
// Reset lazy loading flags
|
|
12236
|
+
setShouldRenderInstanceSelection(false);
|
|
12237
|
+
setShouldRenderBookingForm(false);
|
|
12238
|
+
// Clean up URL to remove Stripe parameters
|
|
12239
|
+
const url = new URL(window.location.href);
|
|
12240
|
+
url.searchParams.delete("payment_intent");
|
|
12241
|
+
url.searchParams.delete("payment_intent_client_secret");
|
|
12242
|
+
url.searchParams.delete("redirect_status");
|
|
12243
|
+
window.history.replaceState({}, "", url.toString());
|
|
12244
|
+
}, config: config, onError: setError, paymentIntentId: successPaymentIntentId })] }));
|
|
12092
12245
|
}
|
|
12093
12246
|
|
|
12094
12247
|
// Export init function for vanilla JS usage
|