@loczer/storefront-sdk 0.219.0 → 0.221.0

package/dist/pages/checkout/components/CheckoutDetailsCard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CheckoutDetailsCard.d.ts","sourceRoot":"","sources":["../../../../src/pages/checkout/components/CheckoutDetailsCard.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,OAAO,EAAE,MAAM,eAAe,CAAA;AAG5C,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,UAAU,CAAA;AAOlD,KAAK,YAAY,GAAG,UAAU,CAAC,OAAO,OAAO,CAAC,kBAAkB,CAAC,CAAC,CAAA;AAElE,KAAK,wBAAwB,GAAG;IAC9B,IAAI,EAAE,YAAY,CAAA;CACnB,CAAA;AAED,wBAAgB,mBAAmB,CAAC,EAAE,IAAI,EAAE,EAAE,wBAAwB,2CA2FrE"}
+{"version":3,"file":"CheckoutDetailsCard.d.ts","sourceRoot":"","sources":["../../../../src/pages/checkout/components/CheckoutDetailsCard.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,OAAO,EAAE,MAAM,eAAe,CAAA;AAK5C,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,UAAU,CAAA;AAOlD,KAAK,YAAY,GAAG,UAAU,CAAC,OAAO,OAAO,CAAC,kBAAkB,CAAC,CAAC,CAAA;AAElE,KAAK,wBAAwB,GAAG;IAC9B,IAAI,EAAE,YAAY,CAAA;CACnB,CAAA;AAOD,wBAAgB,mBAAmB,CAAC,EAAE,IAAI,EAAE,EAAE,wBAAwB,2CAsHrE"}

package/dist/pages/checkout/components/CheckoutDetailsCard.js

@@ -4,88 +4,101 @@ import { Textarea as s } from "../../../ui/textarea.js";
 import { Card as c } from "../../../ui/card.js";
 import { jsx as l, jsxs as u } from "react/jsx-runtime";
 import { useTranslation as d } from "react-i18next";
+import { PhoneNumberInput as f, cn as p } from "@rpcbase/ui";
 //#region src/pages/checkout/components/CheckoutDetailsCard.tsx
-function f({ form: f }) {
-	let { t: p } = d();
+var m = (e) => e.startsWith("fr") ? "FR" : "US";
+function h({ form: h }) {
+	let { t: g, i18n: _ } = d();
 	return /* @__PURE__ */ u(c, {
 		className: "border-slate-200 bg-white shadow-sm",
 		children: [/* @__PURE__ */ u("div", {
 			className: "border-b border-slate-200 px-4 py-4",
 			children: [/* @__PURE__ */ l("p", {
 				className: "text-sm font-semibold text-slate-950",
-				children: /* @__PURE__ */ l("span", { children: p("checkout_form_title") })
+				children: /* @__PURE__ */ l("span", { children: g("checkout_form_title") })
 			}), /* @__PURE__ */ l("p", {
 				className: "mt-1 text-xs text-slate-600",
-				children: /* @__PURE__ */ l("span", { children: p("checkout_form_description") })
+				children: /* @__PURE__ */ l("span", { children: g("checkout_form_description") })
 			})]
 		}), /* @__PURE__ */ l("div", {
 			className: "px-4 py-4",
 			children: /* @__PURE__ */ l(t, {
-				...f,
+				...h,
 				children: /* @__PURE__ */ u("form", {
 					onSubmit: (e) => e.preventDefault(),
 					className: "grid gap-3",
 					children: [
 						/* @__PURE__ */ l(r, {
-							control: f.control,
+							control: h.control,
 							name: "first_name",
 							render: ({ field: t }) => /* @__PURE__ */ u(i, { children: [
-								/* @__PURE__ */ l(a, { children: p("checkout_first_name_label") }),
+								/* @__PURE__ */ l(a, { children: g("checkout_first_name_label") }),
 								/* @__PURE__ */ l(n, { children: /* @__PURE__ */ l(e, {
 									...t,
 									autoComplete: "given-name",
-									placeholder: p("checkout_first_name_placeholder")
+									placeholder: g("checkout_first_name_placeholder")
 								}) }),
 								/* @__PURE__ */ l(o, {})
 							] })
 						}),
 						/* @__PURE__ */ l(r, {
-							control: f.control,
+							control: h.control,
 							name: "last_name",
 							render: ({ field: t }) => /* @__PURE__ */ u(i, { children: [
-								/* @__PURE__ */ l(a, { children: p("checkout_last_name_label") }),
+								/* @__PURE__ */ l(a, { children: g("checkout_last_name_label") }),
 								/* @__PURE__ */ l(n, { children: /* @__PURE__ */ l(e, {
 									...t,
 									autoComplete: "family-name",
-									placeholder: p("checkout_last_name_placeholder")
+									placeholder: g("checkout_last_name_placeholder")
 								}) }),
 								/* @__PURE__ */ l(o, {})
 							] })
 						}),
 						/* @__PURE__ */ l(r, {
-							control: f.control,
+							control: h.control,
 							name: "email",
 							render: ({ field: t }) => /* @__PURE__ */ u(i, { children: [
-								/* @__PURE__ */ l(a, { children: p("checkout_email_label") }),
+								/* @__PURE__ */ l(a, { children: g("checkout_email_label") }),
 								/* @__PURE__ */ l(n, { children: /* @__PURE__ */ l(e, {
 									...t,
 									type: "email",
-									placeholder: p("checkout_email_placeholder")
+									placeholder: g("checkout_email_placeholder")
 								}) }),
 								/* @__PURE__ */ l(o, {})
 							] })
 						}),
 						/* @__PURE__ */ l(r, {
-							control: f.control,
+							control: h.control,
 							name: "phone",
-							render: ({ field: t }) => /* @__PURE__ */ u(i, { children: [
-								/* @__PURE__ */ l(a, { children: p("checkout_phone_label") }),
-								/* @__PURE__ */ l(n, { children: /* @__PURE__ */ l(e, {
-									...t,
-									placeholder: p("checkout_phone_placeholder")
+							render: ({ field: e, fieldState: t }) => /* @__PURE__ */ u(i, { children: [
+								/* @__PURE__ */ l(a, { children: g("checkout_phone_label") }),
+								/* @__PURE__ */ l(n, { children: /* @__PURE__ */ l(f, {
+									name: e.name,
+									value: e.value ?? "",
+									onBlur: e.onBlur,
+									onChange: (t) => {
+										let n = t.e164 || t.formattedInternational || t.rawInput || "";
+										e.onChange(n);
+									},
+									defaultCountry: m(_.language),
+									locale: _.language,
+									placeholder: g("checkout_phone_placeholder"),
+									className: "relative",
+									inputClassName: p(t.error && "border-destructive focus-visible:ring-destructive"),
+									renderValidationMessage: ({ message: e }) => t.error?.message ? null : /* @__PURE__ */ l(o, { children: /* @__PURE__ */ l("span", { children: e }) })
 								}) }),
-								/* @__PURE__ */ l(o, {})
+								t.error?.message ? /* @__PURE__ */ l(o, {}) : null
 							] })
 						}),
 						/* @__PURE__ */ l(r, {
-							control: f.control,
+							control: h.control,
 							name: "notes",
 							render: ({ field: e }) => /* @__PURE__ */ u(i, { children: [
-								/* @__PURE__ */ l(a, { children: p("checkout_notes_label") }),
+								/* @__PURE__ */ l(a, { children: g("checkout_notes_label") }),
 								/* @__PURE__ */ l(n, { children: /* @__PURE__ */ l(s, {
 									...e,
 									rows: 4,
-									placeholder: p("checkout_notes_placeholder")
+									placeholder: g("checkout_notes_placeholder")
 								}) }),
 								/* @__PURE__ */ l(o, {})
 							] })
@@ -97,4 +110,4 @@ function f({ form: f }) {
 	});
 }
 //#endregion
-export { f as CheckoutDetailsCard };
+export { h as CheckoutDetailsCard };

package/dist/pages/checkout/components/CheckoutSummaryColumn.d.ts

@@ -3,9 +3,13 @@ import { StorefrontCartPanel } from '../../../components/StorefrontCartPanel';
 import { CheckoutCouponCard } from './CheckoutCouponCard';
 type StorefrontCartPanelProps = ComponentProps<typeof StorefrontCartPanel>;
 type CheckoutCouponCardProps = ComponentProps<typeof CheckoutCouponCard>;
-type CheckoutSummaryColumnProps = Pick<StorefrontCartPanelProps, "lines" | "itemCount" | "totalPerBaseUnitMinor" | "baseUnitLabel" | "estimatedTotalMinor" | "discountedEstimatedTotalMinor" | "discountAmountMinor" | "lateReturnSurchargeMinor" | "couponCode" | "durationInBaseUnitLabel" | "onQuantityChange" | "onRemove"> & {
+type CheckoutSummaryColumnProps = Pick<StorefrontCartPanelProps, "lines" | "itemCount" | "totalPerBaseUnitMinor" | "baseUnitLabel" | "onQuantityChange" | "onRemove"> & {
     coupon?: CheckoutCouponCardProps;
+    bookingSubtotalLabel: string;
+    vatAmountLabel: string;
+    vatRateLabel: string;
+    bookingTotalLabel: string;
 };
-export declare function CheckoutSummaryColumn({ lines, itemCount, totalPerBaseUnitMinor, baseUnitLabel, estimatedTotalMinor, discountedEstimatedTotalMinor, discountAmountMinor, lateReturnSurchargeMinor, couponCode, durationInBaseUnitLabel, coupon, onQuantityChange, onRemove, }: CheckoutSummaryColumnProps): import("react/jsx-runtime").JSX.Element;
+export declare function CheckoutSummaryColumn({ lines, itemCount, totalPerBaseUnitMinor, baseUnitLabel, coupon, bookingSubtotalLabel, vatAmountLabel, vatRateLabel, bookingTotalLabel, onQuantityChange, onRemove, }: CheckoutSummaryColumnProps): import("react/jsx-runtime").JSX.Element;
 export {};
 //# sourceMappingURL=CheckoutSummaryColumn.d.ts.map

package/dist/pages/checkout/components/CheckoutSummaryColumn.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CheckoutSummaryColumn.d.ts","sourceRoot":"","sources":["../../../../src/pages/checkout/components/CheckoutSummaryColumn.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAG3C,OAAO,EAAE,mBAAmB,EAAE,MAAM,yCAAyC,CAAA;AAC7E,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAA;AAGzD,KAAK,wBAAwB,GAAG,cAAc,CAAC,OAAO,mBAAmB,CAAC,CAAA;AAC1E,KAAK,uBAAuB,GAAG,cAAc,CAAC,OAAO,kBAAkB,CAAC,CAAA;AAExE,KAAK,0BAA0B,GAAG,IAAI,CACpC,wBAAwB,EACtB,OAAO,GACP,WAAW,GACX,uBAAuB,GACvB,eAAe,GACf,qBAAqB,GACrB,+BAA+B,GAC/B,qBAAqB,GACrB,0BAA0B,GAC1B,YAAY,GACZ,yBAAyB,GACzB,kBAAkB,GAClB,UAAU,CACb,GAAG;IACF,MAAM,CAAC,EAAE,uBAAuB,CAAA;CACjC,CAAA;AAED,wBAAgB,qBAAqB,CAAC,EACpC,KAAK,EACL,SAAS,EACT,qBAAqB,EACrB,aAAa,EACb,mBAAmB,EACnB,6BAA6B,EAC7B,mBAAmB,EACnB,wBAAwB,EACxB,UAAU,EACV,uBAAuB,EACvB,MAAM,EACN,gBAAgB,EAChB,QAAQ,GACT,EAAE,0BAA0B,2CA0B5B"}
+{"version":3,"file":"CheckoutSummaryColumn.d.ts","sourceRoot":"","sources":["../../../../src/pages/checkout/components/CheckoutSummaryColumn.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAG3C,OAAO,EAAE,mBAAmB,EAAE,MAAM,yCAAyC,CAAA;AAC7E,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAA;AAGzD,KAAK,wBAAwB,GAAG,cAAc,CAAC,OAAO,mBAAmB,CAAC,CAAA;AAC1E,KAAK,uBAAuB,GAAG,cAAc,CAAC,OAAO,kBAAkB,CAAC,CAAA;AAExE,KAAK,0BAA0B,GAAG,IAAI,CACpC,wBAAwB,EACtB,OAAO,GACP,WAAW,GACX,uBAAuB,GACvB,eAAe,GACf,kBAAkB,GAClB,UAAU,CACb,GAAG;IACF,MAAM,CAAC,EAAE,uBAAuB,CAAA;IAChC,oBAAoB,EAAE,MAAM,CAAA;IAC5B,cAAc,EAAE,MAAM,CAAA;IACtB,YAAY,EAAE,MAAM,CAAA;IACpB,iBAAiB,EAAE,MAAM,CAAA;CAC1B,CAAA;AAED,wBAAgB,qBAAqB,CAAC,EACpC,KAAK,EACL,SAAS,EACT,qBAAqB,EACrB,aAAa,EACb,MAAM,EACN,oBAAoB,EACpB,cAAc,EACd,YAAY,EACZ,iBAAiB,EACjB,gBAAgB,EAChB,QAAQ,GACT,EAAE,0BAA0B,2CAgD5B"}

package/dist/pages/checkout/components/CheckoutSummaryColumn.js

@@ -1,32 +1,62 @@
 import { StorefrontCartPanel as e } from "../../../components/StorefrontCartPanel/index.js";
 import { CheckoutCouponCard as t } from "./CheckoutCouponCard.js";
-import { jsx as n } from "react/jsx-runtime";
-import { useTranslation as r } from "react-i18next";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+import { useTranslation as i } from "react-i18next";
 //#region src/pages/checkout/components/CheckoutSummaryColumn.tsx
-function i({ lines: i, itemCount: a, totalPerBaseUnitMinor: o, baseUnitLabel: s, estimatedTotalMinor: c, discountedEstimatedTotalMinor: l, discountAmountMinor: u, lateReturnSurchargeMinor: d, couponCode: f, durationInBaseUnitLabel: p, coupon: m, onQuantityChange: h, onRemove: g }) {
-	let { t: _ } = r();
+function a({ lines: a, itemCount: o, totalPerBaseUnitMinor: s, baseUnitLabel: c, coupon: l, bookingSubtotalLabel: u, vatAmountLabel: d, vatRateLabel: f, bookingTotalLabel: p, onQuantityChange: m, onRemove: h }) {
+	let { t: g } = i();
 	return /* @__PURE__ */ n("div", {
 		className: "lg:col-span-5",
 		children: /* @__PURE__ */ n(e, {
-			lines: i,
-			itemCount: a,
-			totalPerBaseUnitMinor: o,
-			baseUnitLabel: s,
-			estimatedTotalMinor: c,
-			discountedEstimatedTotalMinor: l,
-			discountAmountMinor: u,
-			lateReturnSurchargeMinor: d,
-			couponCode: f,
-			durationInBaseUnitLabel: p,
-			title: _("checkout_summary_title"),
-			description: _("checkout_summary_description"),
+			lines: a,
+			itemCount: o,
+			totalPerBaseUnitMinor: s,
+			baseUnitLabel: c,
+			title: g("checkout_summary_title"),
+			description: g("checkout_summary_description"),
 			editable: !0,
-			summaryAddon: m ? /* @__PURE__ */ n(t, { ...m }) : void 0,
+			summaryAddon: l ? /* @__PURE__ */ n(t, { ...l }) : void 0,
+			pricingSummary: /* @__PURE__ */ r("dl", {
+				className: "grid border-t border-slate-200 pt-3 text-sm",
+				"data-testid": "checkout-booking-totals",
+				children: [
+					/* @__PURE__ */ r("div", {
+						className: "flex items-center justify-between gap-3 py-1.5",
+						children: [/* @__PURE__ */ n("dt", {
+							className: "text-slate-700",
+							children: /* @__PURE__ */ n("span", { children: g("checkout_booking_subtotal") })
+						}), /* @__PURE__ */ n("dd", {
+							className: "font-medium tabular-nums text-slate-900",
+							children: /* @__PURE__ */ n("span", { children: u })
+						})]
+					}),
+					/* @__PURE__ */ r("div", {
+						className: "flex items-center justify-between gap-3 py-1.5",
+						children: [/* @__PURE__ */ n("dt", {
+							className: "text-slate-700",
+							children: /* @__PURE__ */ n("span", { children: g("checkout_payment_vat", { rate: f }) })
+						}), /* @__PURE__ */ n("dd", {
+							className: "font-medium tabular-nums text-slate-900",
+							children: /* @__PURE__ */ n("span", { children: d })
+						})]
+					}),
+					/* @__PURE__ */ r("div", {
+						className: "mt-1 flex items-center justify-between gap-3 border-t border-slate-200 pt-3",
+						children: [/* @__PURE__ */ n("dt", {
+							className: "font-semibold text-slate-950",
+							children: /* @__PURE__ */ n("span", { children: g("checkout_estimated_total") })
+						}), /* @__PURE__ */ n("dd", {
+							className: "text-base font-bold tabular-nums tracking-tight text-slate-950",
+							children: /* @__PURE__ */ n("span", { children: p })
+						})]
+					})
+				]
+			}),
 			stickyTopClassName: "top-32",
-			onQuantityChange: h,
-			onRemove: g
+			onQuantityChange: m,
+			onRemove: h
 		})
 	});
 }
 //#endregion
-export { i as CheckoutSummaryColumn };
+export { a as CheckoutSummaryColumn };