@bigz-app/booking-widget 1.1.5 → 1.1.7
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 +59 -19
- package/dist/booking-widget.js.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/booking/PaymentForm.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 +59 -19
- package/dist/index.cjs.map +1 -1
- package/dist/index.esm.js +59 -19
- package/dist/index.esm.js.map +1 -1
- package/package.json +1 -1
package/dist/booking-widget.js
CHANGED
|
@@ -392,6 +392,7 @@
|
|
|
392
392
|
"success.age": "{{age}} Jahre",
|
|
393
393
|
"success.paymentSummary": "Zahlungsübersicht",
|
|
394
394
|
"success.total": "Gesamtbetrag",
|
|
395
|
+
"success.discount": "Rabatt",
|
|
395
396
|
"success.product": "Produkt",
|
|
396
397
|
"success.contactInfo": "Kontaktdaten",
|
|
397
398
|
"success.name": "Name:",
|
|
@@ -600,6 +601,7 @@
|
|
|
600
601
|
"success.age": "{{age}} years",
|
|
601
602
|
"success.paymentSummary": "Payment Summary",
|
|
602
603
|
"success.total": "Total",
|
|
604
|
+
"success.discount": "Discount",
|
|
603
605
|
"success.product": "Product",
|
|
604
606
|
"success.contactInfo": "Contact Information",
|
|
605
607
|
"success.name": "Name:",
|
|
@@ -808,6 +810,7 @@
|
|
|
808
810
|
"success.age": "{{age}} años",
|
|
809
811
|
"success.paymentSummary": "Resumen del pago",
|
|
810
812
|
"success.total": "Total",
|
|
813
|
+
"success.discount": "Descuento",
|
|
811
814
|
"success.product": "Producto",
|
|
812
815
|
"success.contactInfo": "Datos de contacto",
|
|
813
816
|
"success.name": "Nombre:",
|
|
@@ -1016,6 +1019,7 @@
|
|
|
1016
1019
|
"success.age": "{{age}} anos",
|
|
1017
1020
|
"success.paymentSummary": "Resumo do pagamento",
|
|
1018
1021
|
"success.total": "Total",
|
|
1022
|
+
"success.discount": "Desconto",
|
|
1019
1023
|
"success.product": "Produto",
|
|
1020
1024
|
"success.contactInfo": "Dados de contacto",
|
|
1021
1025
|
"success.name": "Nome:",
|
|
@@ -1224,6 +1228,7 @@
|
|
|
1224
1228
|
"success.age": "{{age}} år",
|
|
1225
1229
|
"success.paymentSummary": "Betalningssammanfattning",
|
|
1226
1230
|
"success.total": "Totalt",
|
|
1231
|
+
"success.discount": "Rabatt",
|
|
1227
1232
|
"success.product": "Produkt",
|
|
1228
1233
|
"success.contactInfo": "Kontaktuppgifter",
|
|
1229
1234
|
"success.name": "Namn:",
|
|
@@ -1350,7 +1355,7 @@
|
|
|
1350
1355
|
const I18nContext = R$2(null);
|
|
1351
1356
|
function I18nProvider({ configLocale, children }) {
|
|
1352
1357
|
// Priority: configLocale (site owner) > persisted user choice > browser language > "de"
|
|
1353
|
-
// If configLocale is set, the site owner has locked the language
|
|
1358
|
+
// If configLocale is set, the site owner has locked the language - don't restore user choice.
|
|
1354
1359
|
const [overrideLocale, setOverrideLocale] = d$1(() => {
|
|
1355
1360
|
if (configLocale)
|
|
1356
1361
|
return null;
|
|
@@ -6605,6 +6610,7 @@
|
|
|
6605
6610
|
formData.participants,
|
|
6606
6611
|
formData.customerEmail,
|
|
6607
6612
|
formData.customerName,
|
|
6613
|
+
formData.comment,
|
|
6608
6614
|
totalAmount,
|
|
6609
6615
|
discountCode,
|
|
6610
6616
|
giftCards,
|
|
@@ -11127,6 +11133,13 @@
|
|
|
11127
11133
|
return Object.assign({}, ...styles.filter(Boolean));
|
|
11128
11134
|
}
|
|
11129
11135
|
|
|
11136
|
+
function getEffectivePrice(upsell, round) {
|
|
11137
|
+
const dp = upsell.discountPercent ?? 0;
|
|
11138
|
+
if (dp <= 0)
|
|
11139
|
+
return upsell.price;
|
|
11140
|
+
const raw = Math.round(upsell.price * (100 - dp) / 100);
|
|
11141
|
+
return round ? Math.floor(raw / 100) * 100 : raw;
|
|
11142
|
+
}
|
|
11130
11143
|
// Local style aliases from shared styles
|
|
11131
11144
|
const cardStyles = cardStyles$1.base;
|
|
11132
11145
|
const sectionHeaderStyles = sectionStyles.header;
|
|
@@ -11137,6 +11150,7 @@
|
|
|
11137
11150
|
const t$1 = useTranslations();
|
|
11138
11151
|
const { locale } = useLocale();
|
|
11139
11152
|
const timezone = useTimezone();
|
|
11153
|
+
const roundEnabled = systemConfig?.roundPricesEnabled !== false;
|
|
11140
11154
|
const [appliedVouchers, setAppliedVouchers] = d$1([]);
|
|
11141
11155
|
const paymentSectionRef = A$2(null);
|
|
11142
11156
|
// Payment option: "deposit" or "full" - only relevant when deposit is available
|
|
@@ -11158,6 +11172,8 @@
|
|
|
11158
11172
|
const watchedParticipants = form.watch("participants");
|
|
11159
11173
|
const watchedCustomerName = form.watch("customerName");
|
|
11160
11174
|
const watchedCustomerEmail = form.watch("customerEmail");
|
|
11175
|
+
const watchedComment = form.watch("comment");
|
|
11176
|
+
const watchedCustomerPhone = form.watch("customerPhone");
|
|
11161
11177
|
const customerNameError = form.formState.errors.customerName;
|
|
11162
11178
|
const customerEmailError = form.formState.errors.customerEmail;
|
|
11163
11179
|
const watchedAcceptTerms = form.watch("acceptTerms");
|
|
@@ -11207,7 +11223,7 @@
|
|
|
11207
11223
|
participantUpsellIds.forEach(upsellId => {
|
|
11208
11224
|
const upsell = upsells.find(u => u.id === upsellId);
|
|
11209
11225
|
if (upsell) {
|
|
11210
|
-
total += upsell
|
|
11226
|
+
total += getEffectivePrice(upsell, roundEnabled);
|
|
11211
11227
|
}
|
|
11212
11228
|
});
|
|
11213
11229
|
}
|
|
@@ -11269,6 +11285,13 @@
|
|
|
11269
11285
|
participantIndices,
|
|
11270
11286
|
}));
|
|
11271
11287
|
}, [participantUpsells, watchedParticipants]);
|
|
11288
|
+
const paymentFormData = T$2(() => ({
|
|
11289
|
+
customerName: watchedCustomerName,
|
|
11290
|
+
customerEmail: watchedCustomerEmail,
|
|
11291
|
+
customerPhone: watchedCustomerPhone,
|
|
11292
|
+
participants: watchedParticipants,
|
|
11293
|
+
comment: watchedComment,
|
|
11294
|
+
}), [watchedCustomerName, watchedCustomerEmail, watchedCustomerPhone, watchedParticipants, watchedComment]);
|
|
11272
11295
|
const appliedDiscountCode = appliedVouchers.find((v) => v.type === "discount");
|
|
11273
11296
|
const appliedGiftCards = appliedVouchers.filter((v) => v.type === "giftCard");
|
|
11274
11297
|
const handleVoucherValidated = q$2((voucher, _error) => {
|
|
@@ -11483,7 +11506,7 @@
|
|
|
11483
11506
|
padding: 0,
|
|
11484
11507
|
}, children: "\u00D7" })] }))] }), upsells.length > 0 && (u$2("div", { style: participantUpsellStyles.container, children: upsells.map((upsell) => {
|
|
11485
11508
|
const isSelected = (participantUpsells[index] || []).includes(upsell.id);
|
|
11486
|
-
return (u$2("label", { htmlFor: `upsell-${index}-${upsell.id}`, style: isSelected ? participantUpsellStyles.labelSelected : participantUpsellStyles.label, children: [u$2("input", { id: `upsell-${index}-${upsell.id}`, type: "checkbox", style: participantUpsellStyles.checkbox, checked: isSelected, onChange: () => toggleParticipantUpsell(index, upsell.id) }), u$2("span", { style: { fontWeight: 500 }, children: upsell.name }), u$2("span", { style: { fontSize: "12px", opacity: 0.8 }, children: ["(+", formatCurrency(upsell
|
|
11509
|
+
return (u$2("label", { htmlFor: `upsell-${index}-${upsell.id}`, style: isSelected ? participantUpsellStyles.labelSelected : participantUpsellStyles.label, children: [u$2("input", { id: `upsell-${index}-${upsell.id}`, type: "checkbox", style: participantUpsellStyles.checkbox, checked: isSelected, onChange: () => toggleParticipantUpsell(index, upsell.id) }), u$2("span", { style: { fontWeight: 500 }, children: upsell.name }), u$2("span", { style: { fontSize: "12px", opacity: 0.8 }, children: ["(+", formatCurrency(getEffectivePrice(upsell, roundEnabled)), ")"] })] }, upsell.id));
|
|
11487
11510
|
}) }))] }, index))), watchedParticipants.length < eventDetails.availableSpots ? (u$2("div", { style: {
|
|
11488
11511
|
display: "flex",
|
|
11489
11512
|
flexDirection: "column",
|
|
@@ -11515,7 +11538,7 @@
|
|
|
11515
11538
|
const countWithUpsell = watchedParticipants.filter((p, idx) => p.name.trim() && (participantUpsells[idx] || []).includes(upsell.id)).length;
|
|
11516
11539
|
if (countWithUpsell === 0)
|
|
11517
11540
|
return null;
|
|
11518
|
-
const upsellLineTotal = upsell
|
|
11541
|
+
const upsellLineTotal = getEffectivePrice(upsell, roundEnabled) * countWithUpsell;
|
|
11519
11542
|
return (u$2("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center", fontSize: "13px" }, children: [u$2("span", { style: { color: "var(--bw-highlight-color)", fontFamily: "var(--bw-font-family)" }, children: ["+ ", upsell.name, " (", countWithUpsell, "\u00D7)"] }), u$2("span", { style: { color: "var(--bw-highlight-color)", fontFamily: "var(--bw-font-family)" }, children: formatCurrency(upsellLineTotal) })] }, upsell.id));
|
|
11520
11543
|
})] })), appliedVouchers.length > 0 && (u$2(k$3, { children: [u$2("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center" }, children: [u$2("span", { style: { color: "var(--bw-text-muted)", fontFamily: "var(--bw-font-family)" }, children: t$1("summary.subtotal") }), u$2("span", { style: {
|
|
11521
11544
|
fontFamily: "var(--bw-font-family)",
|
|
@@ -11640,7 +11663,7 @@
|
|
|
11640
11663
|
: t$1("payment.fillRequired");
|
|
11641
11664
|
return (u$2("div", { style: {
|
|
11642
11665
|
...cardStyles,
|
|
11643
|
-
|
|
11666
|
+
border: "1px solid var(--bw-warning-color)",
|
|
11644
11667
|
color: "var(--bw-warning-color)",
|
|
11645
11668
|
fontFamily: "var(--bw-font-family)",
|
|
11646
11669
|
textAlign: "center",
|
|
@@ -11658,9 +11681,9 @@
|
|
|
11658
11681
|
}
|
|
11659
11682
|
: null;
|
|
11660
11683
|
if (systemConfig?.paymentProvider === "mollie") {
|
|
11661
|
-
return (u$2("div", { style: cardStyles, children: [u$2("h2", { style: { ...sectionHeaderStyles }, children: t$1("summary.payment") }), u$2(MolliePaymentForm, { config: config, eventDetails: eventDetails, formData:
|
|
11684
|
+
return (u$2("div", { style: cardStyles, children: [u$2("h2", { style: { ...sectionHeaderStyles }, children: t$1("summary.payment") }), u$2(MolliePaymentForm, { config: config, eventDetails: eventDetails, formData: paymentFormData, totalAmount: paymentAmount, discountCode: discountCodeProp, giftCards: appliedGiftCards, onSuccess: onSuccess, onError: onError, upsellSelections: aggregatedUpsellSelections(), mollieProfileId: systemConfig?.mollieProfileId, mollieTestmode: systemConfig?.mollieTestmode })] }));
|
|
11662
11685
|
}
|
|
11663
|
-
return (u$2("div", { style: cardStyles, children: [u$2("h2", { style: { ...sectionHeaderStyles }, children: t$1("summary.payment") }), u$2(PaymentForm, { config: config, eventDetails: eventDetails, formData:
|
|
11686
|
+
return (u$2("div", { style: cardStyles, children: [u$2("h2", { style: { ...sectionHeaderStyles }, children: t$1("summary.payment") }), u$2(PaymentForm, { config: config, eventDetails: eventDetails, formData: paymentFormData, totalAmount: paymentAmount, discountCode: discountCodeProp, giftCards: appliedGiftCards, onSuccess: onSuccess, onError: onError, systemConfig: systemConfig ?? null, stripePromise: stripePromise, stripeAppearance: stripeAppearance, upsellSelections: aggregatedUpsellSelections() })] }));
|
|
11664
11687
|
})() })] })] })] }) }));
|
|
11665
11688
|
}
|
|
11666
11689
|
|
|
@@ -11809,6 +11832,7 @@
|
|
|
11809
11832
|
payments: data.payments,
|
|
11810
11833
|
orderItems: data.orderItems,
|
|
11811
11834
|
purchases: data.purchases || [],
|
|
11835
|
+
discount: data.discount || null,
|
|
11812
11836
|
stripePaymentIntent: data.stripePaymentIntent,
|
|
11813
11837
|
});
|
|
11814
11838
|
setEventDetails({
|
|
@@ -12058,7 +12082,7 @@
|
|
|
12058
12082
|
color: "var(--bw-text-color)",
|
|
12059
12083
|
margin: "0",
|
|
12060
12084
|
fontFamily: "var(--bw-font-family)",
|
|
12061
|
-
}, children: t("success.paymentSummary") }) }), u$2("div", { className: "print-only", children: u$2("div", { className: "print-section-title", children: t("success.paymentSummary") }) }), u$2("div", { style: { display: "flex", flexDirection: "column", gap: "8px" }, children: [u$2("div", { className: "print-hidden", style: { display: "flex", flexDirection: "column", gap: "var(--bw-spacing-small)" }, children: [u$2("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center" }, children: [u$2("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), ")"] }), u$2("span", { style: { color: "var(--bw-text-color)", fontFamily: "var(--bw-font-family)" }, children: formatCurrency(eventDetails.price * booking.participantCount) })] }), bookingData.purchases && bookingData.purchases.length > 0 && (u$2(k$3, { children: bookingData.purchases.map((purchase) => (u$2("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center" }, children: [u$2("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), ")"] }), u$2("span", { style: { color: "var(--bw-text-color)", fontFamily: "var(--bw-font-family)" }, children: formatCurrency(purchase.totalPrice) })] }, purchase.id))) })), u$2("div", { style: {
|
|
12085
|
+
}, children: t("success.paymentSummary") }) }), u$2("div", { className: "print-only", children: u$2("div", { className: "print-section-title", children: t("success.paymentSummary") }) }), u$2("div", { style: { display: "flex", flexDirection: "column", gap: "8px" }, children: [u$2("div", { className: "print-hidden", style: { display: "flex", flexDirection: "column", gap: "var(--bw-spacing-small)" }, children: [u$2("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center" }, children: [u$2("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), ")"] }), u$2("span", { style: { color: "var(--bw-text-color)", fontFamily: "var(--bw-font-family)" }, children: formatCurrency(eventDetails.price * booking.participantCount) })] }), bookingData.discount && bookingData.discount.amount > 0 && (u$2("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center" }, children: [u$2("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, ")"] }), u$2("span", { style: { color: "var(--bw-success-color, #10B981)", fontFamily: "var(--bw-font-family)" }, children: ["-", formatCurrency(bookingData.discount.amount)] })] })), bookingData.purchases && bookingData.purchases.length > 0 && (u$2(k$3, { children: bookingData.purchases.map((purchase) => (u$2("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center" }, children: [u$2("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), ")"] }), u$2("span", { style: { color: "var(--bw-text-color)", fontFamily: "var(--bw-font-family)" }, children: formatCurrency(purchase.totalPrice) })] }, purchase.id))) })), u$2("div", { style: {
|
|
12062
12086
|
display: "flex",
|
|
12063
12087
|
justifyContent: "space-between",
|
|
12064
12088
|
alignItems: "center",
|
|
@@ -13537,7 +13561,7 @@
|
|
|
13537
13561
|
color: "rgba(255, 255, 255, 0.85)",
|
|
13538
13562
|
lineHeight: 1.5,
|
|
13539
13563
|
margin: "0 0 16px 0",
|
|
13540
|
-
}, children: [config.subtitle, config.discountAmount && (u$2(k$3, { children: ["
|
|
13564
|
+
}, children: [config.subtitle, config.discountAmount && (u$2(k$3, { children: [" - ", u$2("strong", { style: { color: "white" }, children: [config.discountAmount, " ", t("promo.discount")] })] }))] }), config.discountCode && (u$2("div", { style: {
|
|
13541
13565
|
marginBottom: "16px",
|
|
13542
13566
|
backgroundColor: "rgba(255,255,255,0.12)",
|
|
13543
13567
|
borderRadius: "12px",
|
|
@@ -13622,7 +13646,9 @@
|
|
|
13622
13646
|
flexDirection: "column",
|
|
13623
13647
|
padding: "16px",
|
|
13624
13648
|
backgroundColor: "var(--bw-surface-color)",
|
|
13625
|
-
|
|
13649
|
+
borderWidth: "2px",
|
|
13650
|
+
borderStyle: "solid",
|
|
13651
|
+
borderColor: "var(--bw-border-color)",
|
|
13626
13652
|
borderRadius: "var(--bw-border-radius)",
|
|
13627
13653
|
cursor: "pointer",
|
|
13628
13654
|
transition: "all 0.2s ease",
|
|
@@ -13647,7 +13673,9 @@
|
|
|
13647
13673
|
const checkboxInnerStyles = {
|
|
13648
13674
|
width: "24px",
|
|
13649
13675
|
height: "24px",
|
|
13650
|
-
|
|
13676
|
+
borderWidth: "2px",
|
|
13677
|
+
borderStyle: "solid",
|
|
13678
|
+
borderColor: "var(--bw-border-color)",
|
|
13651
13679
|
borderRadius: "6px",
|
|
13652
13680
|
display: "flex",
|
|
13653
13681
|
alignItems: "center",
|
|
@@ -13773,10 +13801,11 @@
|
|
|
13773
13801
|
return t("upsells.reason.notEnoughSpots", { eventTypeName: reason.eventTypeName });
|
|
13774
13802
|
}
|
|
13775
13803
|
}
|
|
13776
|
-
function UpsellCard({ upsell, isSelected, participantCount, onSelect, }) {
|
|
13804
|
+
function UpsellCard({ upsell, isSelected, participantCount, onSelect, roundPricesEnabled = true, }) {
|
|
13777
13805
|
const t = useTranslations();
|
|
13778
13806
|
const { locale } = useLocale();
|
|
13779
|
-
const
|
|
13807
|
+
const effectivePrice = getEffectiveUpsellPrice(upsell, roundPricesEnabled);
|
|
13808
|
+
const totalPrice = effectivePrice * participantCount;
|
|
13780
13809
|
const isDisabled = !upsell.available;
|
|
13781
13810
|
const getCardStyles = () => {
|
|
13782
13811
|
if (isDisabled)
|
|
@@ -13794,12 +13823,19 @@
|
|
|
13794
13823
|
weekday: "short",
|
|
13795
13824
|
day: "numeric",
|
|
13796
13825
|
month: "short",
|
|
13797
|
-
})] }), u$2("span", { style: { color: "var(--bw-text-muted)" }, children: t("upsells.spotsFree", { count: upsell.suggestedEventInstance.availableSpots }) })] }))] }), u$2("div", { style: priceContainerStyles, children: [u$2("span", { style: pricePerPersonStyles, children: [formatCurrency(
|
|
13826
|
+
})] }), u$2("span", { style: { color: "var(--bw-text-muted)" }, children: t("upsells.spotsFree", { count: upsell.suggestedEventInstance.availableSpots }) })] }))] }), u$2("div", { style: priceContainerStyles, children: [u$2("span", { style: pricePerPersonStyles, children: [formatCurrency(effectivePrice), "/", t("common.perPerson")] }), participantCount > 1 && (u$2("span", { style: priceTotalStyles, children: ["= ", formatCurrency(totalPrice)] }))] }), isDisabled && (u$2("div", { style: unavailableOverlayStyles, children: u$2("span", { children: upsell.unavailableReason
|
|
13798
13827
|
? formatUnavailableReason(upsell.unavailableReason, t)
|
|
13799
13828
|
: t("upsells.notAvailable") }) }))] }));
|
|
13800
13829
|
}
|
|
13801
13830
|
|
|
13802
|
-
function
|
|
13831
|
+
function getEffectiveUpsellPrice(upsell, round = true) {
|
|
13832
|
+
const dp = upsell.discountPercent ?? 0;
|
|
13833
|
+
if (dp <= 0)
|
|
13834
|
+
return upsell.price;
|
|
13835
|
+
const raw = Math.round(upsell.price * (100 - dp) / 100);
|
|
13836
|
+
return round ? Math.floor(raw / 100) * 100 : raw;
|
|
13837
|
+
}
|
|
13838
|
+
function UpsellsStep({ upsells, selectedUpsells, participantCount, isLoading, isOpen, onClose, onSelect, onContinue, onBack, roundPricesEnabled = true, }) {
|
|
13803
13839
|
const t = useTranslations();
|
|
13804
13840
|
const selectUpsell = (upsellId) => {
|
|
13805
13841
|
const exists = selectedUpsells.find((s) => s.upsellPackageId === upsellId);
|
|
@@ -13818,7 +13854,7 @@
|
|
|
13818
13854
|
return selectedUpsells.reduce((total, selection) => {
|
|
13819
13855
|
const upsell = upsells.find((u) => u.id === selection.upsellPackageId);
|
|
13820
13856
|
if (upsell) {
|
|
13821
|
-
return total + upsell
|
|
13857
|
+
return total + getEffectiveUpsellPrice(upsell, roundPricesEnabled) * selection.quantity;
|
|
13822
13858
|
}
|
|
13823
13859
|
return total;
|
|
13824
13860
|
}, 0);
|
|
@@ -13826,7 +13862,7 @@
|
|
|
13826
13862
|
const selectedTotal = calculateTotal();
|
|
13827
13863
|
const selectedCount = selectedUpsells.length;
|
|
13828
13864
|
const footerContent = (u$2(k$3, { children: [u$2("button", { type: "button", onClick: onBack, style: mergeStyles(buttonStyles.secondary, buttonStyles.fullWidth), children: t("common.back") }), u$2("button", { type: "button", onClick: onContinue, style: mergeStyles(buttonStyles.primary, buttonStyles.fullWidth), children: selectedCount === 0 ? t("button.continueWithout") : t("button.continue") })] }));
|
|
13829
|
-
return (u$2(Sidebar, { isOpen: isOpen, onClose: onClose, title: t("upsells.title"), footer: footerContent, children: u$2("div", { style: { display: "flex", flexDirection: "column", height: "100%", padding: "16px 16px" }, children: [isLoading && (u$2("div", { style: { display: "flex", flexDirection: "column", alignItems: "center", justifyContent: "center", gap: "12px", padding: "40px 20px", ...textStyles.muted }, children: [spinner(), u$2("span", { children: t("upsells.loading") })] })), !isLoading && upsells.length === 0 && (u$2("div", { style: { textAlign: "center", padding: "40px 20px", ...textStyles.muted }, children: u$2("p", { children: t("upsells.noExtras") }) })), !isLoading && upsells.length > 0 && (u$2("div", { style: { display: "flex", flexDirection: "column", gap: "12px", flex: 1, overflowY: "auto", paddingBottom: "16px" }, children: upsells.map((upsell) => (u$2(UpsellCard, { upsell: upsell, isSelected: isSelected(upsell.id), participantCount: participantCount, onSelect: () => selectUpsell(upsell.id) }, upsell.id))) })), selectedCount > 0 && (u$2("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: [u$2("span", { style: textStyles.muted, children: selectedCount === 1 ? t("upsells.selected", { count: selectedCount }) : t("upsells.selectedPlural", { count: selectedCount }) }), u$2("span", { style: { fontWeight: 600, color: "var(--bw-highlight-color)", fontFamily: "var(--bw-font-family)" }, children: ["+", formatCurrency(selectedTotal)] })] }))] }) }));
|
|
13865
|
+
return (u$2(Sidebar, { isOpen: isOpen, onClose: onClose, title: t("upsells.title"), footer: footerContent, children: u$2("div", { style: { display: "flex", flexDirection: "column", height: "100%", padding: "16px 16px" }, children: [isLoading && (u$2("div", { style: { display: "flex", flexDirection: "column", alignItems: "center", justifyContent: "center", gap: "12px", padding: "40px 20px", ...textStyles.muted }, children: [spinner(), u$2("span", { children: t("upsells.loading") })] })), !isLoading && upsells.length === 0 && (u$2("div", { style: { textAlign: "center", padding: "40px 20px", ...textStyles.muted }, children: u$2("p", { children: t("upsells.noExtras") }) })), !isLoading && upsells.length > 0 && (u$2("div", { style: { display: "flex", flexDirection: "column", gap: "12px", flex: 1, overflowY: "auto", paddingBottom: "16px" }, children: upsells.map((upsell) => (u$2(UpsellCard, { upsell: upsell, isSelected: isSelected(upsell.id), participantCount: participantCount, onSelect: () => selectUpsell(upsell.id), roundPricesEnabled: roundPricesEnabled }, upsell.id))) })), selectedCount > 0 && (u$2("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: [u$2("span", { style: textStyles.muted, children: selectedCount === 1 ? t("upsells.selected", { count: selectedCount }) : t("upsells.selectedPlural", { count: selectedCount }) }), u$2("span", { style: { fontWeight: 600, color: "var(--bw-highlight-color)", fontFamily: "var(--bw-font-family)" }, children: ["+", formatCurrency(selectedTotal)] })] }))] }) }));
|
|
13830
13866
|
}
|
|
13831
13867
|
|
|
13832
13868
|
// Main widget component
|
|
@@ -14086,6 +14122,7 @@
|
|
|
14086
14122
|
connectedAccountId: data.connectedAccountId,
|
|
14087
14123
|
mollieProfileId: data.mollieProfileId,
|
|
14088
14124
|
mollieTestmode: data.mollieTestmode,
|
|
14125
|
+
roundPricesEnabled: data.roundPricesEnabled ?? true,
|
|
14089
14126
|
});
|
|
14090
14127
|
}
|
|
14091
14128
|
if (data.stripePublishableKey) {
|
|
@@ -14144,6 +14181,7 @@
|
|
|
14144
14181
|
connectedAccountId: data.connectedAccountId,
|
|
14145
14182
|
mollieProfileId: data.mollieProfileId,
|
|
14146
14183
|
mollieTestmode: data.mollieTestmode,
|
|
14184
|
+
roundPricesEnabled: data.roundPricesEnabled ?? true,
|
|
14147
14185
|
});
|
|
14148
14186
|
if (!stripePromise && data.stripePublishableKey) {
|
|
14149
14187
|
const stripeOptions = {
|
|
@@ -14292,6 +14330,8 @@
|
|
|
14292
14330
|
const handleBookingSuccess = (result) => {
|
|
14293
14331
|
setIsSuccess(true);
|
|
14294
14332
|
setSuccessPaymentIntentId(result.paymentIntent.id);
|
|
14333
|
+
setSidebarOpen(false);
|
|
14334
|
+
setShouldRenderBookingForm(false);
|
|
14295
14335
|
config.onSuccess?.(result);
|
|
14296
14336
|
};
|
|
14297
14337
|
const handleBookingError = (errorMessage) => {
|
|
@@ -14548,7 +14588,7 @@
|
|
|
14548
14588
|
setShouldRenderInstanceSelection(true);
|
|
14549
14589
|
}
|
|
14550
14590
|
}, children: config.buttonText ||
|
|
14551
|
-
(isDirectInstanceMode ? t("button.bookNow") : t("button.selectDate")) }), shouldRenderInstanceSelection && (u$2(EventInstanceSelection, { eventInstances: eventInstances, selectedEventType: selectedEventType, onEventInstanceSelect: handleEventInstanceSelect, onBackToEventTypes: () => setSidebarOpen(false), isOpen: sidebarOpen && currentStep === "eventInstances", onClose: () => setSidebarOpen(false), isLoadingEventInstances: isLoadingEventInstances, isLoadingEventDetails: isLoadingEventDetails })), shouldRenderUpsells && (u$2(UpsellsStep, { upsells: upsells, selectedUpsells: selectedUpsells, participantCount: tempParticipantCount, isLoading: isLoadingUpsells, isOpen: currentStep === "upsells", onClose: () => setCurrentStep("eventInstances"), onSelect: handleUpsellsSelect, onContinue: handleUpsellsContinue, onBack: handleUpsellsBack })), shouldRenderBookingForm && eventDetails && (u$2(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 })), u$2(BookingSuccessModal, { isOpen: isSuccess, onClose: () => {
|
|
14591
|
+
(isDirectInstanceMode ? t("button.bookNow") : t("button.selectDate")) }), shouldRenderInstanceSelection && (u$2(EventInstanceSelection, { eventInstances: eventInstances, selectedEventType: selectedEventType, onEventInstanceSelect: handleEventInstanceSelect, onBackToEventTypes: () => setSidebarOpen(false), isOpen: sidebarOpen && currentStep === "eventInstances", onClose: () => setSidebarOpen(false), isLoadingEventInstances: isLoadingEventInstances, isLoadingEventDetails: isLoadingEventDetails })), shouldRenderUpsells && (u$2(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 && (u$2(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 })), u$2(BookingSuccessModal, { isOpen: isSuccess, onClose: () => {
|
|
14552
14592
|
setIsSuccess(false);
|
|
14553
14593
|
setCurrentStep("eventTypes");
|
|
14554
14594
|
setSidebarOpen(false);
|
|
@@ -14595,7 +14635,7 @@
|
|
|
14595
14635
|
};
|
|
14596
14636
|
};
|
|
14597
14637
|
const backHandlers = getBackHandlers();
|
|
14598
|
-
return (u$2(StyleProvider, { config: config, children: [u$2("div", { ref: setWidgetContainerRef, children: [cardsView, shouldRenderInstanceSelection && (u$2(EventInstanceSelection, { eventInstances: eventInstances, selectedEventType: selectedEventType, onEventInstanceSelect: handleEventInstanceSelect, onBackToEventTypes: handleBackToEventTypes, isOpen: currentStep === "eventInstances", onClose: handleBackToEventTypes, isLoadingEventInstances: isLoadingEventInstances, isLoadingEventDetails: isLoadingEventDetails })), shouldRenderUpsells && (u$2(UpsellsStep, { upsells: upsells, selectedUpsells: selectedUpsells, participantCount: tempParticipantCount, isLoading: isLoadingUpsells, isOpen: currentStep === "upsells", onClose: () => setCurrentStep("eventInstances"), onSelect: handleUpsellsSelect, onContinue: handleUpsellsContinue, onBack: handleUpsellsBack })), shouldRenderBookingForm && eventDetails && (u$2(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 })), u$2(BookingSuccessModal, { isOpen: isSuccess, onClose: () => {
|
|
14638
|
+
return (u$2(StyleProvider, { config: config, children: [u$2("div", { ref: setWidgetContainerRef, children: [cardsView, shouldRenderInstanceSelection && (u$2(EventInstanceSelection, { eventInstances: eventInstances, selectedEventType: selectedEventType, onEventInstanceSelect: handleEventInstanceSelect, onBackToEventTypes: handleBackToEventTypes, isOpen: currentStep === "eventInstances", onClose: handleBackToEventTypes, isLoadingEventInstances: isLoadingEventInstances, isLoadingEventDetails: isLoadingEventDetails })), shouldRenderUpsells && (u$2(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 && (u$2(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 })), u$2(BookingSuccessModal, { isOpen: isSuccess, onClose: () => {
|
|
14599
14639
|
setIsSuccess(false);
|
|
14600
14640
|
setCurrentStep("eventTypes");
|
|
14601
14641
|
setSuccessPaymentIntentId(null);
|