@bigz-app/booking-widget 1.1.4 → 1.1.6
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 +126 -164
- package/dist/booking-widget.js.map +1 -1
- package/dist/components/PromoDialog.d.ts.map +1 -1
- package/dist/components/UniversalBookingWidget.d.ts.map +1 -1
- package/dist/components/booking/BookingForm.d.ts +2 -0
- package/dist/components/booking/BookingForm.d.ts.map +1 -1
- package/dist/components/booking/BookingSuccessModal.d.ts.map +1 -1
- package/dist/components/upsells/UpsellCard.d.ts +3 -2
- package/dist/components/upsells/UpsellCard.d.ts.map +1 -1
- package/dist/components/upsells/UpsellsStep.d.ts +4 -1
- package/dist/components/upsells/UpsellsStep.d.ts.map +1 -1
- package/dist/components/upsells/index.d.ts +1 -1
- package/dist/components/upsells/index.d.ts.map +1 -1
- package/dist/i18n/i18n-context.d.ts.map +1 -1
- package/dist/i18n/locales/de.d.ts.map +1 -1
- package/dist/i18n/locales/en.d.ts.map +1 -1
- package/dist/i18n/locales/es.d.ts.map +1 -1
- package/dist/i18n/locales/pt.d.ts.map +1 -1
- package/dist/i18n/locales/sv.d.ts.map +1 -1
- package/dist/index.cjs +126 -164
- package/dist/index.cjs.map +1 -1
- package/dist/index.esm.js +126 -164
- package/dist/index.esm.js.map +1 -1
- package/package.json +1 -1
package/dist/index.esm.js
CHANGED
|
@@ -334,6 +334,7 @@ const de$1 = {
|
|
|
334
334
|
"success.age": "{{age}} Jahre",
|
|
335
335
|
"success.paymentSummary": "Zahlungsübersicht",
|
|
336
336
|
"success.total": "Gesamtbetrag",
|
|
337
|
+
"success.discount": "Rabatt",
|
|
337
338
|
"success.product": "Produkt",
|
|
338
339
|
"success.contactInfo": "Kontaktdaten",
|
|
339
340
|
"success.name": "Name:",
|
|
@@ -542,6 +543,7 @@ const en = {
|
|
|
542
543
|
"success.age": "{{age}} years",
|
|
543
544
|
"success.paymentSummary": "Payment Summary",
|
|
544
545
|
"success.total": "Total",
|
|
546
|
+
"success.discount": "Discount",
|
|
545
547
|
"success.product": "Product",
|
|
546
548
|
"success.contactInfo": "Contact Information",
|
|
547
549
|
"success.name": "Name:",
|
|
@@ -750,6 +752,7 @@ const es = {
|
|
|
750
752
|
"success.age": "{{age}} años",
|
|
751
753
|
"success.paymentSummary": "Resumen del pago",
|
|
752
754
|
"success.total": "Total",
|
|
755
|
+
"success.discount": "Descuento",
|
|
753
756
|
"success.product": "Producto",
|
|
754
757
|
"success.contactInfo": "Datos de contacto",
|
|
755
758
|
"success.name": "Nombre:",
|
|
@@ -958,6 +961,7 @@ const pt = {
|
|
|
958
961
|
"success.age": "{{age}} anos",
|
|
959
962
|
"success.paymentSummary": "Resumo do pagamento",
|
|
960
963
|
"success.total": "Total",
|
|
964
|
+
"success.discount": "Desconto",
|
|
961
965
|
"success.product": "Produto",
|
|
962
966
|
"success.contactInfo": "Dados de contacto",
|
|
963
967
|
"success.name": "Nome:",
|
|
@@ -1166,6 +1170,7 @@ const sv = {
|
|
|
1166
1170
|
"success.age": "{{age}} år",
|
|
1167
1171
|
"success.paymentSummary": "Betalningssammanfattning",
|
|
1168
1172
|
"success.total": "Totalt",
|
|
1173
|
+
"success.discount": "Rabatt",
|
|
1169
1174
|
"success.product": "Produkt",
|
|
1170
1175
|
"success.contactInfo": "Kontaktuppgifter",
|
|
1171
1176
|
"success.name": "Namn:",
|
|
@@ -1292,7 +1297,7 @@ function persistLocale(locale) {
|
|
|
1292
1297
|
const I18nContext = createContext(null);
|
|
1293
1298
|
function I18nProvider({ configLocale, children }) {
|
|
1294
1299
|
// Priority: configLocale (site owner) > persisted user choice > browser language > "de"
|
|
1295
|
-
// If configLocale is set, the site owner has locked the language
|
|
1300
|
+
// If configLocale is set, the site owner has locked the language - don't restore user choice.
|
|
1296
1301
|
const [overrideLocale, setOverrideLocale] = useState(() => {
|
|
1297
1302
|
if (configLocale)
|
|
1298
1303
|
return null;
|
|
@@ -11001,6 +11006,13 @@ function mergeStyles(...styles) {
|
|
|
11001
11006
|
return Object.assign({}, ...styles.filter(Boolean));
|
|
11002
11007
|
}
|
|
11003
11008
|
|
|
11009
|
+
function getEffectivePrice(upsell, round) {
|
|
11010
|
+
const dp = upsell.discountPercent ?? 0;
|
|
11011
|
+
if (dp <= 0)
|
|
11012
|
+
return upsell.price;
|
|
11013
|
+
const raw = Math.round(upsell.price * (100 - dp) / 100);
|
|
11014
|
+
return round ? Math.floor(raw / 100) * 100 : raw;
|
|
11015
|
+
}
|
|
11004
11016
|
// Local style aliases from shared styles
|
|
11005
11017
|
const cardStyles = cardStyles$1.base;
|
|
11006
11018
|
const sectionHeaderStyles = sectionStyles.header;
|
|
@@ -11011,6 +11023,7 @@ function BookingForm({ config, eventDetails, stripePromise, onSuccess, onError,
|
|
|
11011
11023
|
const t$1 = useTranslations();
|
|
11012
11024
|
const { locale } = useLocale();
|
|
11013
11025
|
const timezone = useTimezone();
|
|
11026
|
+
const roundEnabled = systemConfig?.roundPricesEnabled !== false;
|
|
11014
11027
|
const [appliedVouchers, setAppliedVouchers] = useState([]);
|
|
11015
11028
|
const paymentSectionRef = useRef(null);
|
|
11016
11029
|
// Payment option: "deposit" or "full" - only relevant when deposit is available
|
|
@@ -11081,7 +11094,7 @@ function BookingForm({ config, eventDetails, stripePromise, onSuccess, onError,
|
|
|
11081
11094
|
participantUpsellIds.forEach(upsellId => {
|
|
11082
11095
|
const upsell = upsells.find(u => u.id === upsellId);
|
|
11083
11096
|
if (upsell) {
|
|
11084
|
-
total += upsell
|
|
11097
|
+
total += getEffectivePrice(upsell, roundEnabled);
|
|
11085
11098
|
}
|
|
11086
11099
|
});
|
|
11087
11100
|
}
|
|
@@ -11357,7 +11370,7 @@ function BookingForm({ config, eventDetails, stripePromise, onSuccess, onError,
|
|
|
11357
11370
|
padding: 0,
|
|
11358
11371
|
}, children: "\u00D7" })] }))] }), upsells.length > 0 && (jsx("div", { style: participantUpsellStyles.container, children: upsells.map((upsell) => {
|
|
11359
11372
|
const isSelected = (participantUpsells[index] || []).includes(upsell.id);
|
|
11360
|
-
return (jsxs("label", { htmlFor: `upsell-${index}-${upsell.id}`, style: isSelected ? participantUpsellStyles.labelSelected : participantUpsellStyles.label, children: [jsx("input", { id: `upsell-${index}-${upsell.id}`, type: "checkbox", style: participantUpsellStyles.checkbox, checked: isSelected, onChange: () => toggleParticipantUpsell(index, upsell.id) }), jsx("span", { style: { fontWeight: 500 }, children: upsell.name }), jsxs("span", { style: { fontSize: "12px", opacity: 0.8 }, children: ["(+", formatCurrency(upsell
|
|
11373
|
+
return (jsxs("label", { htmlFor: `upsell-${index}-${upsell.id}`, style: isSelected ? participantUpsellStyles.labelSelected : participantUpsellStyles.label, children: [jsx("input", { id: `upsell-${index}-${upsell.id}`, type: "checkbox", style: participantUpsellStyles.checkbox, checked: isSelected, onChange: () => toggleParticipantUpsell(index, upsell.id) }), jsx("span", { style: { fontWeight: 500 }, children: upsell.name }), jsxs("span", { style: { fontSize: "12px", opacity: 0.8 }, children: ["(+", formatCurrency(getEffectivePrice(upsell, roundEnabled)), ")"] })] }, upsell.id));
|
|
11361
11374
|
}) }))] }, index))), watchedParticipants.length < eventDetails.availableSpots ? (jsx("div", { style: {
|
|
11362
11375
|
display: "flex",
|
|
11363
11376
|
flexDirection: "column",
|
|
@@ -11389,7 +11402,7 @@ function BookingForm({ config, eventDetails, stripePromise, onSuccess, onError,
|
|
|
11389
11402
|
const countWithUpsell = watchedParticipants.filter((p, idx) => p.name.trim() && (participantUpsells[idx] || []).includes(upsell.id)).length;
|
|
11390
11403
|
if (countWithUpsell === 0)
|
|
11391
11404
|
return null;
|
|
11392
|
-
const upsellLineTotal = upsell
|
|
11405
|
+
const upsellLineTotal = getEffectivePrice(upsell, roundEnabled) * countWithUpsell;
|
|
11393
11406
|
return (jsxs("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center", fontSize: "13px" }, children: [jsxs("span", { style: { color: "var(--bw-highlight-color)", fontFamily: "var(--bw-font-family)" }, children: ["+ ", upsell.name, " (", countWithUpsell, "\u00D7)"] }), jsx("span", { style: { color: "var(--bw-highlight-color)", fontFamily: "var(--bw-font-family)" }, children: formatCurrency(upsellLineTotal) })] }, upsell.id));
|
|
11394
11407
|
})] })), appliedVouchers.length > 0 && (jsxs(Fragment, { 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: t$1("summary.subtotal") }), jsx("span", { style: {
|
|
11395
11408
|
fontFamily: "var(--bw-font-family)",
|
|
@@ -11514,7 +11527,7 @@ function BookingForm({ config, eventDetails, stripePromise, onSuccess, onError,
|
|
|
11514
11527
|
: t$1("payment.fillRequired");
|
|
11515
11528
|
return (jsx("div", { style: {
|
|
11516
11529
|
...cardStyles,
|
|
11517
|
-
|
|
11530
|
+
border: "1px solid var(--bw-warning-color)",
|
|
11518
11531
|
color: "var(--bw-warning-color)",
|
|
11519
11532
|
fontFamily: "var(--bw-font-family)",
|
|
11520
11533
|
textAlign: "center",
|
|
@@ -11683,6 +11696,7 @@ const BookingSuccessModal = ({ isOpen, onClose, config, onError, paymentIntentId
|
|
|
11683
11696
|
payments: data.payments,
|
|
11684
11697
|
orderItems: data.orderItems,
|
|
11685
11698
|
purchases: data.purchases || [],
|
|
11699
|
+
discount: data.discount || null,
|
|
11686
11700
|
stripePaymentIntent: data.stripePaymentIntent,
|
|
11687
11701
|
});
|
|
11688
11702
|
setEventDetails({
|
|
@@ -11932,7 +11946,7 @@ const BookingSuccessModal = ({ isOpen, onClose, config, onError, paymentIntentId
|
|
|
11932
11946
|
color: "var(--bw-text-color)",
|
|
11933
11947
|
margin: "0",
|
|
11934
11948
|
fontFamily: "var(--bw-font-family)",
|
|
11935
|
-
}, children: t("success.paymentSummary") }) }), jsx("div", { className: "print-only", children: jsx("div", { className: "print-section-title", children: t("success.paymentSummary") }) }), jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "8px" }, children: [jsxs("div", { className: "print-hidden", style: { display: "flex", flexDirection: "column", gap: "var(--bw-spacing-small)" }, children: [jsxs("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center" }, children: [jsxs("span", { style: { color: "var(--bw-text-muted)", fontFamily: "var(--bw-font-family)", fontSize: "var(--bw-font-size-small)" }, children: [eventDetails.name, " (", booking.participantCount, "x ", formatCurrency(eventDetails.price), ")"] }), jsx("span", { style: { color: "var(--bw-text-color)", fontFamily: "var(--bw-font-family)" }, children: formatCurrency(eventDetails.price * booking.participantCount) })] }), bookingData.purchases && bookingData.purchases.length > 0 && (jsx(Fragment, { children: bookingData.purchases.map((purchase) => (jsxs("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center" }, children: [jsxs("span", { style: { color: "var(--bw-text-muted)", fontFamily: "var(--bw-font-family)", fontSize: "var(--bw-font-size-small)" }, children: [purchase.product?.name || t("success.product"), " (", purchase.quantity, "x ", formatCurrency(purchase.unitPrice), ")"] }), jsx("span", { style: { color: "var(--bw-text-color)", fontFamily: "var(--bw-font-family)" }, children: formatCurrency(purchase.totalPrice) })] }, purchase.id))) })), jsxs("div", { style: {
|
|
11949
|
+
}, children: t("success.paymentSummary") }) }), jsx("div", { className: "print-only", children: jsx("div", { className: "print-section-title", children: t("success.paymentSummary") }) }), jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "8px" }, children: [jsxs("div", { className: "print-hidden", style: { display: "flex", flexDirection: "column", gap: "var(--bw-spacing-small)" }, children: [jsxs("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center" }, children: [jsxs("span", { style: { color: "var(--bw-text-muted)", fontFamily: "var(--bw-font-family)", fontSize: "var(--bw-font-size-small)" }, children: [eventDetails.name, " (", booking.participantCount, "x ", formatCurrency(eventDetails.price), ")"] }), jsx("span", { style: { color: "var(--bw-text-color)", fontFamily: "var(--bw-font-family)" }, children: formatCurrency(eventDetails.price * booking.participantCount) })] }), bookingData.discount && bookingData.discount.amount > 0 && (jsxs("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center" }, children: [jsxs("span", { style: { color: "var(--bw-success-color, #10B981)", fontFamily: "var(--bw-font-family)", fontSize: "var(--bw-font-size-small)" }, children: [t("success.discount"), " (", bookingData.discount.code, ")"] }), jsxs("span", { style: { color: "var(--bw-success-color, #10B981)", fontFamily: "var(--bw-font-family)" }, children: ["-", formatCurrency(bookingData.discount.amount)] })] })), bookingData.purchases && bookingData.purchases.length > 0 && (jsx(Fragment, { children: bookingData.purchases.map((purchase) => (jsxs("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center" }, children: [jsxs("span", { style: { color: "var(--bw-text-muted)", fontFamily: "var(--bw-font-family)", fontSize: "var(--bw-font-size-small)" }, children: [purchase.product?.name || t("success.product"), " (", purchase.quantity, "x ", formatCurrency(purchase.unitPrice), ")"] }), jsx("span", { style: { color: "var(--bw-text-color)", fontFamily: "var(--bw-font-family)" }, children: formatCurrency(purchase.totalPrice) })] }, purchase.id))) })), jsxs("div", { style: {
|
|
11936
11950
|
display: "flex",
|
|
11937
11951
|
justifyContent: "space-between",
|
|
11938
11952
|
alignItems: "center",
|
|
@@ -13264,52 +13278,24 @@ const getThemeConfig = (theme = "generic") => {
|
|
|
13264
13278
|
backgroundImage: "https://images.unsplash.com/photo-1502680390469-be75c86b636f?w=600&q=80",
|
|
13265
13279
|
primaryColor: "#0c4a6e",
|
|
13266
13280
|
secondaryColor: "#0891b2",
|
|
13267
|
-
icon: "🏄♂️",
|
|
13268
|
-
decorations: ["🎄", "⭐"],
|
|
13269
|
-
animation: {
|
|
13270
|
-
floatDuration: 3,
|
|
13271
|
-
sparkleEnabled: true,
|
|
13272
|
-
snowfallEnabled: true,
|
|
13273
|
-
},
|
|
13274
13281
|
};
|
|
13275
13282
|
case "summer":
|
|
13276
13283
|
return {
|
|
13277
13284
|
backgroundImage: "https://images.unsplash.com/photo-1507525428034-b723cf961d3e?w=600&q=80",
|
|
13278
13285
|
primaryColor: "#059669",
|
|
13279
13286
|
secondaryColor: "#10b981",
|
|
13280
|
-
icon: "☀️",
|
|
13281
|
-
decorations: ["🌴", "🏖️"],
|
|
13282
|
-
animation: {
|
|
13283
|
-
floatDuration: 2.5,
|
|
13284
|
-
sparkleEnabled: true,
|
|
13285
|
-
snowfallEnabled: false,
|
|
13286
|
-
},
|
|
13287
13287
|
};
|
|
13288
13288
|
case "beach":
|
|
13289
13289
|
return {
|
|
13290
13290
|
backgroundImage: "https://images.unsplash.com/photo-1502680390469-be75c86b636f?w=600&q=80",
|
|
13291
13291
|
primaryColor: "#0891b2",
|
|
13292
13292
|
secondaryColor: "#06b6d4",
|
|
13293
|
-
icon: "🏄♀️",
|
|
13294
|
-
decorations: ["🌊", "🏄"],
|
|
13295
|
-
animation: {
|
|
13296
|
-
floatDuration: 3,
|
|
13297
|
-
sparkleEnabled: false,
|
|
13298
|
-
snowfallEnabled: false,
|
|
13299
|
-
},
|
|
13300
13293
|
};
|
|
13301
13294
|
default:
|
|
13302
13295
|
return {
|
|
13303
13296
|
backgroundImage: undefined,
|
|
13304
13297
|
primaryColor: "#0c4a6e",
|
|
13305
13298
|
secondaryColor: "#0891b2",
|
|
13306
|
-
icon: "🎁",
|
|
13307
|
-
decorations: [],
|
|
13308
|
-
animation: {
|
|
13309
|
-
floatDuration: 3,
|
|
13310
|
-
sparkleEnabled: false,
|
|
13311
|
-
snowfallEnabled: false,
|
|
13312
|
-
},
|
|
13313
13299
|
};
|
|
13314
13300
|
}
|
|
13315
13301
|
};
|
|
@@ -13367,192 +13353,152 @@ function PromoDialog({ config, onClose, onCtaClick }) {
|
|
|
13367
13353
|
position: "fixed",
|
|
13368
13354
|
inset: 0,
|
|
13369
13355
|
zIndex: 60,
|
|
13370
|
-
backgroundColor: "rgba(0, 20, 40, 0.
|
|
13371
|
-
backdropFilter: "blur(
|
|
13356
|
+
backgroundColor: "rgba(0, 20, 40, 0.8)",
|
|
13357
|
+
backdropFilter: "blur(6px)",
|
|
13372
13358
|
transition: "opacity 0.3s ease-out",
|
|
13373
13359
|
opacity: isVisible ? 1 : 0,
|
|
13374
13360
|
} }), jsx("div", { style: {
|
|
13375
13361
|
position: "fixed",
|
|
13376
13362
|
zIndex: 61,
|
|
13377
|
-
width: "
|
|
13378
|
-
maxWidth: "
|
|
13363
|
+
width: "90%",
|
|
13364
|
+
maxWidth: "400px",
|
|
13379
13365
|
transition: "all 0.3s",
|
|
13380
13366
|
top: "50%",
|
|
13381
13367
|
left: "50%",
|
|
13382
|
-
transform: `translate(-50%, -50%) scale(${isVisible ? 1 : 0.
|
|
13368
|
+
transform: `translate(-50%, -50%) scale(${isVisible ? 1 : 0.95})`,
|
|
13383
13369
|
opacity: isVisible ? 1 : 0,
|
|
13384
|
-
transitionTimingFunction: "cubic-bezier(0.
|
|
13370
|
+
transitionTimingFunction: "cubic-bezier(0.16, 1, 0.3, 1)",
|
|
13385
13371
|
}, children: jsxs("div", { style: {
|
|
13386
13372
|
position: "relative",
|
|
13387
13373
|
overflow: "hidden",
|
|
13388
|
-
borderRadius: "
|
|
13389
|
-
boxShadow: "0 25px
|
|
13374
|
+
borderRadius: "20px",
|
|
13375
|
+
boxShadow: "0 25px 50px -12px rgba(0,0,0,0.5), 0 0 0 1px rgba(255,255,255,0.08)",
|
|
13390
13376
|
background: `linear-gradient(165deg, ${themeConfig.primaryColor} 0%, ${themeConfig.primaryColor} 40%, ${themeConfig.secondaryColor} 100%)`,
|
|
13391
|
-
}, children: [themeConfig.
|
|
13392
|
-
Array.from({ length: 15 }).map((_, i) => (jsx("div", { style: {
|
|
13393
|
-
position: "absolute",
|
|
13394
|
-
pointerEvents: "none",
|
|
13395
|
-
zIndex: 1,
|
|
13396
|
-
color: "white",
|
|
13397
|
-
opacity: 0,
|
|
13398
|
-
left: `${5 + Math.random() * 90}%`,
|
|
13399
|
-
top: "-10px",
|
|
13400
|
-
fontSize: `${10 + Math.random() * 14}px`,
|
|
13401
|
-
animation: `promo-snow ${4 + Math.random() * 3}s linear infinite`,
|
|
13402
|
-
animationDelay: `${Math.random() * 4}s`,
|
|
13403
|
-
}, children: "\u2744" }, i))), jsxs("div", { style: {
|
|
13377
|
+
}, children: [themeConfig.backgroundImage && (jsxs("div", { style: {
|
|
13404
13378
|
position: "relative",
|
|
13405
|
-
|
|
13406
|
-
alignItems: "center",
|
|
13407
|
-
justifyContent: "center",
|
|
13379
|
+
height: "120px",
|
|
13408
13380
|
overflow: "hidden",
|
|
13409
|
-
|
|
13410
|
-
background: `linear-gradient(180deg, rgba(0,0,0,0) 0%, ${themeConfig.primaryColor}cc 100%)`,
|
|
13411
|
-
}, children: [themeConfig.backgroundImage && (jsx("img", { src: themeConfig.backgroundImage, alt: "Background", style: {
|
|
13381
|
+
}, children: [jsx("img", { src: themeConfig.backgroundImage, alt: "", style: {
|
|
13412
13382
|
position: "absolute",
|
|
13413
13383
|
inset: 0,
|
|
13414
13384
|
width: "100%",
|
|
13415
13385
|
height: "100%",
|
|
13416
13386
|
objectFit: "cover",
|
|
13417
|
-
opacity: 0.
|
|
13418
|
-
} })
|
|
13387
|
+
opacity: 0.5,
|
|
13388
|
+
} }), jsx("div", { style: {
|
|
13419
13389
|
position: "absolute",
|
|
13420
13390
|
inset: 0,
|
|
13421
|
-
background: `linear-gradient(180deg, ${themeConfig.primaryColor}
|
|
13422
|
-
} }), jsx("
|
|
13423
|
-
position: "relative",
|
|
13424
|
-
zIndex: 2,
|
|
13425
|
-
fontSize: "64px",
|
|
13426
|
-
filter: "drop-shadow(0 8px 16px rgba(0,0,0,0.4))",
|
|
13427
|
-
animation: `promo-float ${themeConfig.animation?.floatDuration || 3}s ease-in-out infinite`,
|
|
13428
|
-
}, children: themeConfig.icon }), themeConfig.decorations &&
|
|
13429
|
-
themeConfig.decorations.map((decoration, i) => (jsx("div", { style: {
|
|
13430
|
-
position: "absolute",
|
|
13431
|
-
top: i === 0 ? "16px" : "20px",
|
|
13432
|
-
left: i === 0 ? "20px" : "auto",
|
|
13433
|
-
right: i === 1 ? "20px" : "auto",
|
|
13434
|
-
fontSize: i === 0 ? "28px" : "24px",
|
|
13435
|
-
animation: themeConfig.animation?.sparkleEnabled
|
|
13436
|
-
? `promo-sparkle 2s ease-in-out infinite ${i * 0.5}s`
|
|
13437
|
-
: undefined,
|
|
13438
|
-
}, children: decoration }, i)))] }), jsx("button", { onClick: handleClose, style: {
|
|
13391
|
+
background: `linear-gradient(180deg, ${themeConfig.primaryColor}33 0%, ${themeConfig.primaryColor}ee 100%)`,
|
|
13392
|
+
} })] })), jsx("button", { onClick: handleClose, style: {
|
|
13439
13393
|
position: "absolute",
|
|
13440
|
-
top: "
|
|
13441
|
-
right: "
|
|
13394
|
+
top: "12px",
|
|
13395
|
+
right: "12px",
|
|
13442
13396
|
display: "flex",
|
|
13443
13397
|
alignItems: "center",
|
|
13444
13398
|
justifyContent: "center",
|
|
13445
13399
|
cursor: "pointer",
|
|
13446
13400
|
zIndex: 10,
|
|
13447
|
-
width: "
|
|
13448
|
-
height: "
|
|
13401
|
+
width: "32px",
|
|
13402
|
+
height: "32px",
|
|
13449
13403
|
borderRadius: "50%",
|
|
13450
13404
|
border: "none",
|
|
13451
|
-
backgroundColor: "rgba(0, 0, 0, 0.
|
|
13405
|
+
backgroundColor: "rgba(0, 0, 0, 0.25)",
|
|
13452
13406
|
backdropFilter: "blur(4px)",
|
|
13453
|
-
color: "
|
|
13454
|
-
fontSize: "
|
|
13407
|
+
color: "rgba(255,255,255,0.8)",
|
|
13408
|
+
fontSize: "18px",
|
|
13455
13409
|
lineHeight: 1,
|
|
13456
|
-
transition: "
|
|
13410
|
+
transition: "background-color 0.15s ease",
|
|
13457
13411
|
}, children: "\u00D7" }), jsxs("div", { style: {
|
|
13458
13412
|
position: "relative",
|
|
13459
13413
|
textAlign: "center",
|
|
13460
13414
|
zIndex: 2,
|
|
13461
|
-
padding: "
|
|
13415
|
+
padding: "20px 24px 24px",
|
|
13462
13416
|
}, children: [jsx("h2", { style: {
|
|
13463
|
-
fontWeight:
|
|
13464
|
-
fontSize: "
|
|
13417
|
+
fontWeight: 700,
|
|
13418
|
+
fontSize: "20px",
|
|
13465
13419
|
color: "white",
|
|
13466
|
-
|
|
13467
|
-
|
|
13468
|
-
filter: "drop-shadow(0 2px 8px rgba(0,0,0,0.3))",
|
|
13420
|
+
letterSpacing: "-0.02em",
|
|
13421
|
+
lineHeight: 1.25,
|
|
13469
13422
|
margin: "0 0 6px 0",
|
|
13470
13423
|
}, children: config.title }), jsxs("p", { style: {
|
|
13471
|
-
fontSize: "
|
|
13472
|
-
color: "rgba(255, 255, 255, 0.
|
|
13473
|
-
marginBottom: "20px",
|
|
13424
|
+
fontSize: "14px",
|
|
13425
|
+
color: "rgba(255, 255, 255, 0.85)",
|
|
13474
13426
|
lineHeight: 1.5,
|
|
13475
|
-
margin: "0 0
|
|
13476
|
-
}, children: [config.subtitle, config.discountAmount && (jsxs(Fragment, { children: [
|
|
13477
|
-
marginBottom: "
|
|
13478
|
-
backgroundColor: "
|
|
13479
|
-
borderRadius: "
|
|
13480
|
-
padding: "
|
|
13481
|
-
|
|
13427
|
+
margin: "0 0 16px 0",
|
|
13428
|
+
}, children: [config.subtitle, config.discountAmount && (jsxs(Fragment, { children: [" - ", jsxs("strong", { style: { color: "white" }, children: [config.discountAmount, " ", t("promo.discount")] })] }))] }), config.discountCode && (jsxs("div", { style: {
|
|
13429
|
+
marginBottom: "16px",
|
|
13430
|
+
backgroundColor: "rgba(255,255,255,0.12)",
|
|
13431
|
+
borderRadius: "12px",
|
|
13432
|
+
padding: "12px 16px",
|
|
13433
|
+
border: "1px solid rgba(255,255,255,0.1)",
|
|
13482
13434
|
}, children: [jsx("p", { style: {
|
|
13483
13435
|
textTransform: "uppercase",
|
|
13484
|
-
fontWeight:
|
|
13485
|
-
fontSize: "
|
|
13436
|
+
fontWeight: 500,
|
|
13437
|
+
fontSize: "10px",
|
|
13486
13438
|
letterSpacing: "1.5px",
|
|
13487
|
-
color: "
|
|
13488
|
-
|
|
13489
|
-
margin: "0 0 10px 0",
|
|
13439
|
+
color: "rgba(255,255,255,0.6)",
|
|
13440
|
+
margin: "0 0 8px 0",
|
|
13490
13441
|
}, children: t("promo.giftCode") }), jsxs("div", { style: {
|
|
13491
13442
|
display: "flex",
|
|
13492
13443
|
alignItems: "center",
|
|
13493
13444
|
justifyContent: "center",
|
|
13494
|
-
gap: "
|
|
13495
|
-
}, children: [jsx("
|
|
13496
|
-
|
|
13497
|
-
|
|
13498
|
-
|
|
13499
|
-
|
|
13500
|
-
|
|
13501
|
-
|
|
13502
|
-
fontSize: "28px",
|
|
13503
|
-
color: "white",
|
|
13504
|
-
letterSpacing: "6px",
|
|
13505
|
-
filter: "drop-shadow(0 2px 4px rgba(0,0,0,0.2))",
|
|
13506
|
-
}, children: discountCode }) }), jsx("button", { onClick: handleCopyCode, style: {
|
|
13445
|
+
gap: "10px",
|
|
13446
|
+
}, children: [jsx("span", { style: {
|
|
13447
|
+
fontWeight: 800,
|
|
13448
|
+
fontSize: "22px",
|
|
13449
|
+
color: "white",
|
|
13450
|
+
letterSpacing: "4px",
|
|
13451
|
+
fontFamily: "monospace, monospace",
|
|
13452
|
+
}, children: discountCode }), jsx("button", { onClick: handleCopyCode, style: {
|
|
13507
13453
|
display: "flex",
|
|
13508
13454
|
alignItems: "center",
|
|
13509
13455
|
cursor: "pointer",
|
|
13510
13456
|
whiteSpace: "nowrap",
|
|
13511
|
-
padding: "12px
|
|
13512
|
-
borderRadius: "
|
|
13513
|
-
border: "
|
|
13514
|
-
|
|
13515
|
-
|
|
13516
|
-
|
|
13517
|
-
|
|
13457
|
+
padding: "6px 12px",
|
|
13458
|
+
borderRadius: "8px",
|
|
13459
|
+
border: "1px solid rgba(255,255,255,0.2)",
|
|
13460
|
+
backgroundColor: copied
|
|
13461
|
+
? "rgba(34, 197, 94, 0.2)"
|
|
13462
|
+
: "rgba(255,255,255,0.1)",
|
|
13463
|
+
color: copied ? "#86efac" : "rgba(255,255,255,0.8)",
|
|
13464
|
+
fontSize: "12px",
|
|
13518
13465
|
fontWeight: 600,
|
|
13519
13466
|
transition: "all 0.15s ease",
|
|
13520
|
-
gap: "
|
|
13521
|
-
}, children: copied ? (jsxs(Fragment, { children: ["\u2713 ", t("promo.copied")] })) : (jsxs(Fragment, { children: [jsxs("svg", { width: "
|
|
13467
|
+
gap: "4px",
|
|
13468
|
+
}, children: copied ? (jsxs(Fragment, { children: ["\u2713 ", t("promo.copied")] })) : (jsxs(Fragment, { children: [jsxs("svg", { width: "13", height: "13", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", children: [jsx("rect", { x: "9", y: "9", width: "13", height: "13", rx: "2", ry: "2" }), jsx("path", { d: "M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1" })] }), t("promo.copy")] })) })] })] })), config.activities && config.activities.length > 0 && (jsx("div", { style: {
|
|
13522
13469
|
display: "flex",
|
|
13523
13470
|
justifyContent: "center",
|
|
13524
|
-
gap: "
|
|
13525
|
-
marginBottom: "
|
|
13471
|
+
gap: "6px",
|
|
13472
|
+
marginBottom: "16px",
|
|
13526
13473
|
flexWrap: "wrap",
|
|
13527
13474
|
}, children: config.activities.map((activity) => (jsx("span", { style: {
|
|
13528
13475
|
fontWeight: 500,
|
|
13529
|
-
backgroundColor: "rgba(255, 255, 255, 0.
|
|
13530
|
-
|
|
13531
|
-
|
|
13532
|
-
|
|
13533
|
-
|
|
13534
|
-
|
|
13476
|
+
backgroundColor: "rgba(255, 255, 255, 0.1)",
|
|
13477
|
+
padding: "4px 10px",
|
|
13478
|
+
borderRadius: "16px",
|
|
13479
|
+
fontSize: "12px",
|
|
13480
|
+
color: "rgba(255,255,255,0.85)",
|
|
13481
|
+
border: "1px solid rgba(255,255,255,0.08)",
|
|
13535
13482
|
}, children: activity }, activity))) })), jsxs("button", { onClick: handleCtaClick, style: {
|
|
13536
13483
|
width: "100%",
|
|
13537
13484
|
display: "flex",
|
|
13538
13485
|
alignItems: "center",
|
|
13539
13486
|
justifyContent: "center",
|
|
13540
13487
|
cursor: "pointer",
|
|
13541
|
-
fontWeight:
|
|
13542
|
-
padding: "
|
|
13543
|
-
borderRadius: "
|
|
13488
|
+
fontWeight: 600,
|
|
13489
|
+
padding: "14px 20px",
|
|
13490
|
+
borderRadius: "12px",
|
|
13544
13491
|
border: "none",
|
|
13545
|
-
color:
|
|
13546
|
-
fontSize: "
|
|
13492
|
+
color: themeConfig.primaryColor,
|
|
13493
|
+
fontSize: "15px",
|
|
13547
13494
|
transition: "all 0.15s ease",
|
|
13548
|
-
gap: "
|
|
13549
|
-
background:
|
|
13550
|
-
boxShadow:
|
|
13551
|
-
}, children: [config.ctaText, jsx("span", { children: "\u2192" })] }), config.validityText && (jsx("p", { style: {
|
|
13552
|
-
|
|
13553
|
-
|
|
13554
|
-
|
|
13555
|
-
margin: "16px 0 0 0",
|
|
13495
|
+
gap: "8px",
|
|
13496
|
+
background: "white",
|
|
13497
|
+
boxShadow: "0 4px 12px rgba(0,0,0,0.15)",
|
|
13498
|
+
}, children: [config.ctaText, jsx("span", { style: { fontSize: "14px" }, children: "\u2192" })] }), config.validityText && (jsx("p", { style: {
|
|
13499
|
+
fontSize: "11px",
|
|
13500
|
+
color: "rgba(255, 255, 255, 0.5)",
|
|
13501
|
+
margin: "12px 0 0 0",
|
|
13556
13502
|
}, children: config.validityText }))] })] }) })] }));
|
|
13557
13503
|
return createPortal(dialogContent, portalContainer);
|
|
13558
13504
|
}
|
|
@@ -13564,7 +13510,9 @@ const cardBaseStyles = {
|
|
|
13564
13510
|
flexDirection: "column",
|
|
13565
13511
|
padding: "16px",
|
|
13566
13512
|
backgroundColor: "var(--bw-surface-color)",
|
|
13567
|
-
|
|
13513
|
+
borderWidth: "2px",
|
|
13514
|
+
borderStyle: "solid",
|
|
13515
|
+
borderColor: "var(--bw-border-color)",
|
|
13568
13516
|
borderRadius: "var(--bw-border-radius)",
|
|
13569
13517
|
cursor: "pointer",
|
|
13570
13518
|
transition: "all 0.2s ease",
|
|
@@ -13589,7 +13537,9 @@ const checkboxContainerStyles = {
|
|
|
13589
13537
|
const checkboxInnerStyles = {
|
|
13590
13538
|
width: "24px",
|
|
13591
13539
|
height: "24px",
|
|
13592
|
-
|
|
13540
|
+
borderWidth: "2px",
|
|
13541
|
+
borderStyle: "solid",
|
|
13542
|
+
borderColor: "var(--bw-border-color)",
|
|
13593
13543
|
borderRadius: "6px",
|
|
13594
13544
|
display: "flex",
|
|
13595
13545
|
alignItems: "center",
|
|
@@ -13715,10 +13665,11 @@ function formatUnavailableReason(reason, t) {
|
|
|
13715
13665
|
return t("upsells.reason.notEnoughSpots", { eventTypeName: reason.eventTypeName });
|
|
13716
13666
|
}
|
|
13717
13667
|
}
|
|
13718
|
-
function UpsellCard({ upsell, isSelected, participantCount, onSelect, }) {
|
|
13668
|
+
function UpsellCard({ upsell, isSelected, participantCount, onSelect, roundPricesEnabled = true, }) {
|
|
13719
13669
|
const t = useTranslations();
|
|
13720
13670
|
const { locale } = useLocale();
|
|
13721
|
-
const
|
|
13671
|
+
const effectivePrice = getEffectiveUpsellPrice(upsell, roundPricesEnabled);
|
|
13672
|
+
const totalPrice = effectivePrice * participantCount;
|
|
13722
13673
|
const isDisabled = !upsell.available;
|
|
13723
13674
|
const getCardStyles = () => {
|
|
13724
13675
|
if (isDisabled)
|
|
@@ -13736,12 +13687,19 @@ function UpsellCard({ upsell, isSelected, participantCount, onSelect, }) {
|
|
|
13736
13687
|
weekday: "short",
|
|
13737
13688
|
day: "numeric",
|
|
13738
13689
|
month: "short",
|
|
13739
|
-
})] }), jsx("span", { style: { color: "var(--bw-text-muted)" }, children: t("upsells.spotsFree", { count: upsell.suggestedEventInstance.availableSpots }) })] }))] }), jsxs("div", { style: priceContainerStyles, children: [jsxs("span", { style: pricePerPersonStyles, children: [formatCurrency(
|
|
13690
|
+
})] }), jsx("span", { style: { color: "var(--bw-text-muted)" }, children: t("upsells.spotsFree", { count: upsell.suggestedEventInstance.availableSpots }) })] }))] }), jsxs("div", { style: priceContainerStyles, children: [jsxs("span", { style: pricePerPersonStyles, children: [formatCurrency(effectivePrice), "/", t("common.perPerson")] }), participantCount > 1 && (jsxs("span", { style: priceTotalStyles, children: ["= ", formatCurrency(totalPrice)] }))] }), isDisabled && (jsx("div", { style: unavailableOverlayStyles, children: jsx("span", { children: upsell.unavailableReason
|
|
13740
13691
|
? formatUnavailableReason(upsell.unavailableReason, t)
|
|
13741
13692
|
: t("upsells.notAvailable") }) }))] }));
|
|
13742
13693
|
}
|
|
13743
13694
|
|
|
13744
|
-
function
|
|
13695
|
+
function getEffectiveUpsellPrice(upsell, round = true) {
|
|
13696
|
+
const dp = upsell.discountPercent ?? 0;
|
|
13697
|
+
if (dp <= 0)
|
|
13698
|
+
return upsell.price;
|
|
13699
|
+
const raw = Math.round(upsell.price * (100 - dp) / 100);
|
|
13700
|
+
return round ? Math.floor(raw / 100) * 100 : raw;
|
|
13701
|
+
}
|
|
13702
|
+
function UpsellsStep({ upsells, selectedUpsells, participantCount, isLoading, isOpen, onClose, onSelect, onContinue, onBack, roundPricesEnabled = true, }) {
|
|
13745
13703
|
const t = useTranslations();
|
|
13746
13704
|
const selectUpsell = (upsellId) => {
|
|
13747
13705
|
const exists = selectedUpsells.find((s) => s.upsellPackageId === upsellId);
|
|
@@ -13760,7 +13718,7 @@ function UpsellsStep({ upsells, selectedUpsells, participantCount, isLoading, is
|
|
|
13760
13718
|
return selectedUpsells.reduce((total, selection) => {
|
|
13761
13719
|
const upsell = upsells.find((u) => u.id === selection.upsellPackageId);
|
|
13762
13720
|
if (upsell) {
|
|
13763
|
-
return total + upsell
|
|
13721
|
+
return total + getEffectiveUpsellPrice(upsell, roundPricesEnabled) * selection.quantity;
|
|
13764
13722
|
}
|
|
13765
13723
|
return total;
|
|
13766
13724
|
}, 0);
|
|
@@ -13768,7 +13726,7 @@ function UpsellsStep({ upsells, selectedUpsells, participantCount, isLoading, is
|
|
|
13768
13726
|
const selectedTotal = calculateTotal();
|
|
13769
13727
|
const selectedCount = selectedUpsells.length;
|
|
13770
13728
|
const footerContent = (jsxs(Fragment, { children: [jsx("button", { type: "button", onClick: onBack, style: mergeStyles(buttonStyles.secondary, buttonStyles.fullWidth), children: t("common.back") }), jsx("button", { type: "button", onClick: onContinue, style: mergeStyles(buttonStyles.primary, buttonStyles.fullWidth), children: selectedCount === 0 ? t("button.continueWithout") : t("button.continue") })] }));
|
|
13771
|
-
return (jsx(Sidebar, { isOpen: isOpen, onClose: onClose, title: t("upsells.title"), footer: footerContent, children: jsxs("div", { style: { display: "flex", flexDirection: "column", height: "100%", padding: "16px 16px" }, children: [isLoading && (jsxs("div", { style: { display: "flex", flexDirection: "column", alignItems: "center", justifyContent: "center", gap: "12px", padding: "40px 20px", ...textStyles.muted }, children: [spinner(), jsx("span", { children: t("upsells.loading") })] })), !isLoading && upsells.length === 0 && (jsx("div", { style: { textAlign: "center", padding: "40px 20px", ...textStyles.muted }, children: jsx("p", { children: t("upsells.noExtras") }) })), !isLoading && upsells.length > 0 && (jsx("div", { style: { display: "flex", flexDirection: "column", gap: "12px", flex: 1, overflowY: "auto", paddingBottom: "16px" }, children: upsells.map((upsell) => (jsx(UpsellCard, { upsell: upsell, isSelected: isSelected(upsell.id), participantCount: participantCount, onSelect: () => selectUpsell(upsell.id) }, upsell.id))) })), selectedCount > 0 && (jsxs("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center", marginTop: "16px", paddingBottom: "16px", paddingTop: "16px", borderTop: "1px solid var(--bw-border-color)", fontSize: "14px" }, children: [jsx("span", { style: textStyles.muted, children: selectedCount === 1 ? t("upsells.selected", { count: selectedCount }) : t("upsells.selectedPlural", { count: selectedCount }) }), jsxs("span", { style: { fontWeight: 600, color: "var(--bw-highlight-color)", fontFamily: "var(--bw-font-family)" }, children: ["+", formatCurrency(selectedTotal)] })] }))] }) }));
|
|
13729
|
+
return (jsx(Sidebar, { isOpen: isOpen, onClose: onClose, title: t("upsells.title"), footer: footerContent, children: jsxs("div", { style: { display: "flex", flexDirection: "column", height: "100%", padding: "16px 16px" }, children: [isLoading && (jsxs("div", { style: { display: "flex", flexDirection: "column", alignItems: "center", justifyContent: "center", gap: "12px", padding: "40px 20px", ...textStyles.muted }, children: [spinner(), jsx("span", { children: t("upsells.loading") })] })), !isLoading && upsells.length === 0 && (jsx("div", { style: { textAlign: "center", padding: "40px 20px", ...textStyles.muted }, children: jsx("p", { children: t("upsells.noExtras") }) })), !isLoading && upsells.length > 0 && (jsx("div", { style: { display: "flex", flexDirection: "column", gap: "12px", flex: 1, overflowY: "auto", paddingBottom: "16px" }, children: upsells.map((upsell) => (jsx(UpsellCard, { upsell: upsell, isSelected: isSelected(upsell.id), participantCount: participantCount, onSelect: () => selectUpsell(upsell.id), roundPricesEnabled: roundPricesEnabled }, upsell.id))) })), selectedCount > 0 && (jsxs("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center", marginTop: "16px", paddingBottom: "16px", paddingTop: "16px", borderTop: "1px solid var(--bw-border-color)", fontSize: "14px" }, children: [jsx("span", { style: textStyles.muted, children: selectedCount === 1 ? t("upsells.selected", { count: selectedCount }) : t("upsells.selectedPlural", { count: selectedCount }) }), jsxs("span", { style: { fontWeight: 600, color: "var(--bw-highlight-color)", fontFamily: "var(--bw-font-family)" }, children: ["+", formatCurrency(selectedTotal)] })] }))] }) }));
|
|
13772
13730
|
}
|
|
13773
13731
|
|
|
13774
13732
|
// Main widget component
|
|
@@ -14028,6 +13986,7 @@ function UniversalBookingWidgetInner({ config: baseConfig, onWidgetLanguage, onT
|
|
|
14028
13986
|
connectedAccountId: data.connectedAccountId,
|
|
14029
13987
|
mollieProfileId: data.mollieProfileId,
|
|
14030
13988
|
mollieTestmode: data.mollieTestmode,
|
|
13989
|
+
roundPricesEnabled: data.roundPricesEnabled ?? true,
|
|
14031
13990
|
});
|
|
14032
13991
|
}
|
|
14033
13992
|
if (data.stripePublishableKey) {
|
|
@@ -14086,6 +14045,7 @@ function UniversalBookingWidgetInner({ config: baseConfig, onWidgetLanguage, onT
|
|
|
14086
14045
|
connectedAccountId: data.connectedAccountId,
|
|
14087
14046
|
mollieProfileId: data.mollieProfileId,
|
|
14088
14047
|
mollieTestmode: data.mollieTestmode,
|
|
14048
|
+
roundPricesEnabled: data.roundPricesEnabled ?? true,
|
|
14089
14049
|
});
|
|
14090
14050
|
if (!stripePromise && data.stripePublishableKey) {
|
|
14091
14051
|
const stripeOptions = {
|
|
@@ -14234,6 +14194,8 @@ function UniversalBookingWidgetInner({ config: baseConfig, onWidgetLanguage, onT
|
|
|
14234
14194
|
const handleBookingSuccess = (result) => {
|
|
14235
14195
|
setIsSuccess(true);
|
|
14236
14196
|
setSuccessPaymentIntentId(result.paymentIntent.id);
|
|
14197
|
+
setSidebarOpen(false);
|
|
14198
|
+
setShouldRenderBookingForm(false);
|
|
14237
14199
|
config.onSuccess?.(result);
|
|
14238
14200
|
};
|
|
14239
14201
|
const handleBookingError = (errorMessage) => {
|
|
@@ -14490,7 +14452,7 @@ function UniversalBookingWidgetInner({ config: baseConfig, onWidgetLanguage, onT
|
|
|
14490
14452
|
setShouldRenderInstanceSelection(true);
|
|
14491
14453
|
}
|
|
14492
14454
|
}, children: config.buttonText ||
|
|
14493
|
-
(isDirectInstanceMode ? t("button.bookNow") : t("button.selectDate")) }), shouldRenderInstanceSelection && (jsx(EventInstanceSelection, { eventInstances: eventInstances, selectedEventType: selectedEventType, onEventInstanceSelect: handleEventInstanceSelect, onBackToEventTypes: () => setSidebarOpen(false), isOpen: sidebarOpen && currentStep === "eventInstances", onClose: () => setSidebarOpen(false), isLoadingEventInstances: isLoadingEventInstances, isLoadingEventDetails: isLoadingEventDetails })), shouldRenderUpsells && (jsx(UpsellsStep, { upsells: upsells, selectedUpsells: selectedUpsells, participantCount: tempParticipantCount, isLoading: isLoadingUpsells, isOpen: currentStep === "upsells", onClose: () => setCurrentStep("eventInstances"), onSelect: handleUpsellsSelect, onContinue: handleUpsellsContinue, onBack: handleUpsellsBack })), 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, selectedUpsells: selectedUpsells, upsells: upsells })), jsx(BookingSuccessModal, { isOpen: isSuccess, onClose: () => {
|
|
14455
|
+
(isDirectInstanceMode ? t("button.bookNow") : t("button.selectDate")) }), shouldRenderInstanceSelection && (jsx(EventInstanceSelection, { eventInstances: eventInstances, selectedEventType: selectedEventType, onEventInstanceSelect: handleEventInstanceSelect, onBackToEventTypes: () => setSidebarOpen(false), isOpen: sidebarOpen && currentStep === "eventInstances", onClose: () => setSidebarOpen(false), isLoadingEventInstances: isLoadingEventInstances, isLoadingEventDetails: isLoadingEventDetails })), shouldRenderUpsells && (jsx(UpsellsStep, { upsells: upsells, selectedUpsells: selectedUpsells, participantCount: tempParticipantCount, isLoading: isLoadingUpsells, isOpen: currentStep === "upsells", onClose: () => setCurrentStep("eventInstances"), onSelect: handleUpsellsSelect, onContinue: handleUpsellsContinue, onBack: handleUpsellsBack, roundPricesEnabled: systemConfig?.roundPricesEnabled !== false })), 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, selectedUpsells: selectedUpsells, upsells: upsells })), jsx(BookingSuccessModal, { isOpen: isSuccess, onClose: () => {
|
|
14494
14456
|
setIsSuccess(false);
|
|
14495
14457
|
setCurrentStep("eventTypes");
|
|
14496
14458
|
setSidebarOpen(false);
|
|
@@ -14537,7 +14499,7 @@ function UniversalBookingWidgetInner({ config: baseConfig, onWidgetLanguage, onT
|
|
|
14537
14499
|
};
|
|
14538
14500
|
};
|
|
14539
14501
|
const backHandlers = getBackHandlers();
|
|
14540
|
-
return (jsxs(StyleProvider, { config: config, children: [jsxs("div", { ref: setWidgetContainerRef, children: [cardsView, shouldRenderInstanceSelection && (jsx(EventInstanceSelection, { eventInstances: eventInstances, selectedEventType: selectedEventType, onEventInstanceSelect: handleEventInstanceSelect, onBackToEventTypes: handleBackToEventTypes, isOpen: currentStep === "eventInstances", onClose: handleBackToEventTypes, isLoadingEventInstances: isLoadingEventInstances, isLoadingEventDetails: isLoadingEventDetails })), shouldRenderUpsells && (jsx(UpsellsStep, { upsells: upsells, selectedUpsells: selectedUpsells, participantCount: tempParticipantCount, isLoading: isLoadingUpsells, isOpen: currentStep === "upsells", onClose: () => setCurrentStep("eventInstances"), onSelect: handleUpsellsSelect, onContinue: handleUpsellsContinue, onBack: handleUpsellsBack })), 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, selectedUpsells: selectedUpsells, upsells: upsells })), jsx(BookingSuccessModal, { isOpen: isSuccess, onClose: () => {
|
|
14502
|
+
return (jsxs(StyleProvider, { config: config, children: [jsxs("div", { ref: setWidgetContainerRef, children: [cardsView, shouldRenderInstanceSelection && (jsx(EventInstanceSelection, { eventInstances: eventInstances, selectedEventType: selectedEventType, onEventInstanceSelect: handleEventInstanceSelect, onBackToEventTypes: handleBackToEventTypes, isOpen: currentStep === "eventInstances", onClose: handleBackToEventTypes, isLoadingEventInstances: isLoadingEventInstances, isLoadingEventDetails: isLoadingEventDetails })), shouldRenderUpsells && (jsx(UpsellsStep, { upsells: upsells, selectedUpsells: selectedUpsells, participantCount: tempParticipantCount, isLoading: isLoadingUpsells, isOpen: currentStep === "upsells", onClose: () => setCurrentStep("eventInstances"), onSelect: handleUpsellsSelect, onContinue: handleUpsellsContinue, onBack: handleUpsellsBack, roundPricesEnabled: systemConfig?.roundPricesEnabled !== false })), 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, selectedUpsells: selectedUpsells, upsells: upsells })), jsx(BookingSuccessModal, { isOpen: isSuccess, onClose: () => {
|
|
14541
14503
|
setIsSuccess(false);
|
|
14542
14504
|
setCurrentStep("eventTypes");
|
|
14543
14505
|
setSuccessPaymentIntentId(null);
|
|
@@ -14593,7 +14555,7 @@ function styleInject(css, ref) {
|
|
|
14593
14555
|
}
|
|
14594
14556
|
}
|
|
14595
14557
|
|
|
14596
|
-
var css_248z = ".booking-widget-container{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;box-sizing:border-box;color:var(--bw-text-color,#1e293b);direction:ltr;display:block;font-family:var(--bw-font-family,system-ui,-apple-system,sans-serif);font-size:var(--bw-font-size,14px);isolation:isolate;line-height:1.5;position:relative;text-align:left}.booking-widget-container *,.booking-widget-container :after,.booking-widget-container :before{box-sizing:border-box;margin:0;padding:0}.booking-widget-container input,.booking-widget-container select,.booking-widget-container textarea{font-family:inherit;font-size:inherit;line-height:inherit}.booking-widget-container button{background:none;border:none;cursor:pointer;font-family:inherit;font-size:inherit}.booking-widget-container a{color:inherit;text-decoration:none}.booking-widget-container img{display:block;height:auto;max-width:100%;vertical-align:middle}.booking-widget-container ol,.booking-widget-container ul{list-style:none}.booking-widget-container h1,.booking-widget-container h2,.booking-widget-container h3,.booking-widget-container h4,.booking-widget-container h5,.booking-widget-container h6{font-size:inherit;font-weight:inherit}#booking-widget-portal{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:var(--bw-text-color,#1e293b);direction:ltr;font-family:var(--bw-font-family,system-ui,-apple-system,sans-serif);font-size:var(--bw-font-size,14px);isolation:isolate;line-height:1.5;text-align:left}#booking-widget-portal *,#booking-widget-portal :after,#booking-widget-portal :before{box-sizing:border-box}#booking-widget-portal-root{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:var(--bw-text-color,#1e293b);font-family:var(--bw-font-family,system-ui,-apple-system,sans-serif);font-size:var(--bw-font-size,14px);line-height:1.5}:root{--bw-highlight-color:#00b1aa;--bw-highlight-color-rgb:0,177,170;--bw-background-color:#f8fdfe;--bw-surface-color:#fff;--bw-text-color:#0e7490;--bw-text-muted:rgba(14,116,144,.7);--bw-border-color:#bae6fd;--bw-success-color:#38bdf8;--bw-warning-color:#fbbf24;--bw-error-color:#f43f5e;--bw-border-radius:18px;--bw-border-radius-small:calc(var(--bw-border-radius)*0.8);--bw-spacing:16px;--bw-spacing-large:24px;--bw-font-family:\"Inter\",system-ui,sans-serif;--bw-font-size:14px;--bw-font-size-large:18px;--bw-font-size-small:12px;--bw-shadow-md:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06);--bw-shadow-lg:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05);--bw-highlight-muted:rgba(0,177,170,.1);--bw-highlight-subtle:rgba(0,177,170,.05);--bw-text-subtle:rgba(14,116,144,.4)}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes shimmer{0%{transform:translateX(-100%)}to{transform:translateX(100%)}}@keyframes
|
|
14558
|
+
var css_248z = ".booking-widget-container{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;box-sizing:border-box;color:var(--bw-text-color,#1e293b);direction:ltr;display:block;font-family:var(--bw-font-family,system-ui,-apple-system,sans-serif);font-size:var(--bw-font-size,14px);isolation:isolate;line-height:1.5;position:relative;text-align:left}.booking-widget-container *,.booking-widget-container :after,.booking-widget-container :before{box-sizing:border-box;margin:0;padding:0}.booking-widget-container input,.booking-widget-container select,.booking-widget-container textarea{font-family:inherit;font-size:inherit;line-height:inherit}.booking-widget-container button{background:none;border:none;cursor:pointer;font-family:inherit;font-size:inherit}.booking-widget-container a{color:inherit;text-decoration:none}.booking-widget-container img{display:block;height:auto;max-width:100%;vertical-align:middle}.booking-widget-container ol,.booking-widget-container ul{list-style:none}.booking-widget-container h1,.booking-widget-container h2,.booking-widget-container h3,.booking-widget-container h4,.booking-widget-container h5,.booking-widget-container h6{font-size:inherit;font-weight:inherit}#booking-widget-portal{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:var(--bw-text-color,#1e293b);direction:ltr;font-family:var(--bw-font-family,system-ui,-apple-system,sans-serif);font-size:var(--bw-font-size,14px);isolation:isolate;line-height:1.5;text-align:left}#booking-widget-portal *,#booking-widget-portal :after,#booking-widget-portal :before{box-sizing:border-box}#booking-widget-portal-root{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:var(--bw-text-color,#1e293b);font-family:var(--bw-font-family,system-ui,-apple-system,sans-serif);font-size:var(--bw-font-size,14px);line-height:1.5}:root{--bw-highlight-color:#00b1aa;--bw-highlight-color-rgb:0,177,170;--bw-background-color:#f8fdfe;--bw-surface-color:#fff;--bw-text-color:#0e7490;--bw-text-muted:rgba(14,116,144,.7);--bw-border-color:#bae6fd;--bw-success-color:#38bdf8;--bw-warning-color:#fbbf24;--bw-error-color:#f43f5e;--bw-border-radius:18px;--bw-border-radius-small:calc(var(--bw-border-radius)*0.8);--bw-spacing:16px;--bw-spacing-large:24px;--bw-font-family:\"Inter\",system-ui,sans-serif;--bw-font-size:14px;--bw-font-size-large:18px;--bw-font-size-small:12px;--bw-shadow-md:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06);--bw-shadow-lg:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05);--bw-highlight-muted:rgba(0,177,170,.1);--bw-highlight-subtle:rgba(0,177,170,.05);--bw-text-subtle:rgba(14,116,144,.4)}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes shimmer{0%{transform:translateX(-100%)}to{transform:translateX(100%)}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes fade-out{0%{opacity:1}to{opacity:0}}@keyframes slide-in-right{0%{opacity:0;transform:translateX(100%)}to{opacity:1;transform:translateX(0)}}@keyframes slide-out-right{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(100%)}}@keyframes slide-in-up{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes scale-in{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.animate-spin{animation:spin 1s linear infinite}.animate-shimmer{animation:shimmer 2s infinite}.animate-pulse{animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}.animate-fade-in{animation:fade-in .2s ease-out}.animate-slide-in-up{animation:slide-in-up .3s ease-out}.animate-scale-in{animation:scale-in .2s ease-out}.skeleton-shimmer{overflow:hidden;position:relative}.skeleton-shimmer:after{animation:shimmer 1.5s infinite;background:linear-gradient(90deg,transparent,hsla(0,0%,100%,.3),transparent);content:\"\";height:100%;left:0;position:absolute;top:0;width:100%}@media (max-width:768px){.sidebar-mobile{border-radius:0!important;max-width:100%!important;width:100%!important}}@media (max-width:600px){.event-type-list{gap:12px!important;padding:8px!important}.event-type-card{flex:1 1 100%!important;max-width:100%!important;padding:0!important}.event-type-img{height:160px!important}.event-type-title{font-size:1.1rem!important}.event-type-desc{font-size:.8rem!important;max-height:100px!important;min-height:100px!important}.event-type-content{padding:16px 24px!important}}.event-type-markdown{overflow:visible!important}.event-type-markdown p{color:var(--bw-text-muted);font-family:var(--bw-font-family);line-height:1.6;margin:0 0 8px}.event-type-markdown p:last-child{margin-bottom:0}.event-type-markdown h2{font-size:18px!important;font-weight:700!important;margin:12px 0 6px!important}.event-type-markdown h2,.event-type-markdown h3{color:var(--bw-text-color)!important;line-height:1.3!important}.event-type-markdown h3{font-size:16px!important;font-weight:600!important;margin:10px 0 4px!important}.event-type-markdown strong{color:var(--bw-text-color);font-weight:600}.event-type-markdown em{font-style:italic}.event-type-markdown u{text-decoration:underline}.event-type-markdown ul{list-style:none!important;margin:6px 0!important;padding:0 0 0 24px!important;position:relative!important}.event-type-markdown ul li{color:var(--bw-text-muted)!important;font-family:var(--bw-font-family)!important;margin-bottom:2px!important;padding-left:0!important;position:relative!important}.event-type-markdown ul li:before{color:var(--bw-text-color)!important;content:\"•\"!important;font-weight:700!important;left:-16px!important;position:absolute!important;top:0!important}.event-type-markdown ol{counter-reset:list-counter!important;list-style:none!important;margin:6px 0!important;padding:0 0 0 24px!important;position:relative!important}.event-type-markdown ol li{color:var(--bw-text-muted)!important;counter-increment:list-counter!important;font-family:var(--bw-font-family)!important;margin-bottom:2px!important;padding-left:0!important;position:relative!important}.event-type-markdown ol li:before{color:var(--bw-text-color)!important;content:counter(list-counter) \".\"!important;font-weight:700!important;left:-20px!important;position:absolute!important;top:0!important}.event-type-markdown blockquote{border-left:2px solid var(--bw-border-color);color:var(--bw-text-muted);font-style:italic;margin:4px 0;padding-left:12px}.event-type-markdown a{color:var(--bw-highlight-color);text-decoration:underline}.markdown-content h1,.markdown-content h2,.markdown-content h3,.markdown-content h4,.markdown-content h5,.markdown-content h6{color:var(--bw-text-color);font-weight:600;margin-bottom:.5em}.markdown-content h1{font-size:1.5em}.markdown-content h2{font-size:1.25em}.markdown-content h3{font-size:1.1em}.markdown-content p{line-height:1.6;margin-bottom:1em}.markdown-content ol,.markdown-content ul{margin-bottom:1em;padding-left:1.5em}.markdown-content ul{list-style-type:disc}.markdown-content ol{list-style-type:decimal}.markdown-content li{margin-bottom:.25em}.markdown-content a{color:var(--bw-highlight-color);text-decoration:underline}.markdown-content a:hover{opacity:.8}.markdown-content strong{font-weight:600}.markdown-content em{font-style:italic}.markdown-content code{background:var(--bw-highlight-subtle);border-radius:4px;font-family:monospace;font-size:.9em;padding:.125em .25em}.markdown-content blockquote{border-left:3px solid var(--bw-highlight-color);color:var(--bw-text-muted);margin:1em 0;padding-left:1em}.print-only{display:none}.print-hidden{display:block}@media print{.print-only{display:block}.print-hidden{display:none!important}.print-booking-header{border-bottom:2px solid #000;display:block;margin-bottom:24px;padding-bottom:16px;text-align:center}.print-booking-header h1{font-size:24px;margin:0 0 8px}.print-booking-header .subtitle{color:#666;font-size:14px}.print-booking-card{border:1px solid #ccc;border-radius:8px;margin-bottom:16px;padding:16px;page-break-inside:avoid}.print-section-title{border-bottom:1px solid #ddd;display:block;font-size:16px;font-weight:600;margin-bottom:12px;padding-bottom:8px}.print-detail-grid{display:grid;gap:12px;grid-template-columns:1fr 1fr}.print-detail-item{margin-bottom:8px}.print-detail-label{color:#666;font-size:12px;margin-bottom:4px}.print-detail-value{font-size:14px;font-weight:600}.print-status-badge{border-radius:9999px;display:inline-block;font-size:12px;font-weight:600;padding:4px 12px}.print-status-paid{background-color:#dcfce7;color:#166534;display:inline-block}.print-participant{align-items:center;background-color:#f9fafb;border-radius:4px;display:flex;justify-content:space-between;margin-bottom:8px;padding:8px}.print-participant-name{font-weight:600}.print-participant-age{color:#666;font-size:12px}.print-payment-summary{display:block}.print-payment-row{border-bottom:1px solid #eee;display:flex;justify-content:space-between;padding:4px 0}.print-payment-row:last-child{border-bottom:none;font-weight:600}.print-footer{border-top:1px solid #ddd;color:#666;display:block;font-size:12px;margin-top:24px;padding-top:16px;text-align:center}.print-footer p{margin:4px 0}}";
|
|
14597
14559
|
styleInject(css_248z);
|
|
14598
14560
|
|
|
14599
14561
|
// Export init function for vanilla JS usage
|