@planetaexo/design-system 0.45.0 → 0.46.0

package/dist/index.cjs

@@ -4809,7 +4809,12 @@ var DEFAULT_LABELS3 = {
   adventuresLabel: "Adventures",
   totalTravellersLabel: "Total Travellers",
   agentLabel: "Agent",
-  addressLabel: "Address",
+  bookingPersonHeading: "Booking person",
+  nameLabel: "Name",
+  emailLabel: "Email",
+  phoneLabel: "Phone",
+  countryLabel: "Country",
+  addressLabel: "Billing address",
   adultsUnit: "adult(s)",
   childrenUnit: "child(ren)",
   travellersLabel: "Travellers",
@@ -4841,6 +4846,9 @@ function BookingPaymentConfirmationEmail({
   depositInfo,
   agent,
   responsiblePersonAddress,
+  responsiblePersonEmail,
+  responsiblePersonPhone,
+  responsiblePersonCountry,
   viewBookingUrl,
   labels,
   className,
@@ -4852,6 +4860,26 @@ function BookingPaymentConfirmationEmail({
     return (_a = a.travellers) != null ? _a : [];
   });
   const isManualFlow = flow === "manual";
+  const personFieldLabel = {
+    margin: "0 0 2px 0",
+    fontSize: "11px",
+    fontWeight: 700,
+    color: emailTokens.mutedForeground,
+    textTransform: "uppercase",
+    letterSpacing: "0.08em",
+    fontFamily: emailTokens.fontFamily
+  };
+  const personFieldValue = {
+    margin: 0,
+    fontSize: "14px",
+    color: emailTokens.foreground,
+    lineHeight: "1.5"
+  };
+  const personFieldCell = {
+    verticalAlign: "top",
+    padding: "0 12px 14px 0",
+    width: "50%"
+  };
   const ctaStyle = {
     display: "inline-block",
     backgroundColor: emailTokens.primary,
@@ -4919,8 +4947,7 @@ function BookingPaymentConfirmationEmail({
               { label: l.bookingNumberLabel, value: bookingReference, valueColor: emailTokens.primary },
               { label: l.adventuresLabel, value: adventures.length },
               { label: l.totalTravellersLabel, value: allTravellers.length },
-              { label: l.agentLabel, value: agent },
-              ...responsiblePersonAddress && responsiblePersonAddress.trim().length > 0 ? [{ label: l.addressLabel, value: responsiblePersonAddress }] : []
+              { label: l.agentLabel, value: agent }
             ]
           }
         ) }),
@@ -5029,6 +5056,50 @@ function BookingPaymentConfirmationEmail({
           ) })
         ] }),
         /* @__PURE__ */ jsxRuntime.jsx("hr", { style: { border: "none", borderTop: `1px solid ${emailTokens.border}`, margin: "0 32px" } }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { style: { paddingLeft: "32px", paddingRight: "32px", paddingTop: "32px", paddingBottom: "32px" }, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { borderRadius: "16px", border: `1px solid ${emailTokens.border}`, padding: "20px" }, children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "p",
+            {
+              style: {
+                margin: "0 0 16px 0",
+                fontSize: "12px",
+                fontWeight: 700,
+                color: emailTokens.mutedForeground,
+                textTransform: "uppercase",
+                letterSpacing: "0.1em",
+                fontFamily: emailTokens.fontFamily
+              },
+              children: l.bookingPersonHeading
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx("table", { cellPadding: 0, cellSpacing: 0, style: { width: "100%", borderCollapse: "collapse" }, children: /* @__PURE__ */ jsxRuntime.jsxs("tbody", { children: [
+            /* @__PURE__ */ jsxRuntime.jsxs("tr", { children: [
+              /* @__PURE__ */ jsxRuntime.jsxs("td", { style: personFieldCell, children: [
+                /* @__PURE__ */ jsxRuntime.jsx("p", { style: personFieldLabel, children: l.nameLabel }),
+                /* @__PURE__ */ jsxRuntime.jsx("p", { style: __spreadProps(__spreadValues({}, personFieldValue), { fontWeight: 600 }), children: recipientName })
+              ] }),
+              /* @__PURE__ */ jsxRuntime.jsxs("td", { style: personFieldCell, children: [
+                /* @__PURE__ */ jsxRuntime.jsx("p", { style: personFieldLabel, children: l.emailLabel }),
+                /* @__PURE__ */ jsxRuntime.jsx("p", { style: personFieldValue, children: responsiblePersonEmail || "\u2014" })
+              ] })
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsxs("tr", { children: [
+              /* @__PURE__ */ jsxRuntime.jsxs("td", { style: personFieldCell, children: [
+                /* @__PURE__ */ jsxRuntime.jsx("p", { style: personFieldLabel, children: l.phoneLabel }),
+                /* @__PURE__ */ jsxRuntime.jsx("p", { style: personFieldValue, children: responsiblePersonPhone || "\u2014" })
+              ] }),
+              /* @__PURE__ */ jsxRuntime.jsx("td", { style: personFieldCell, children: responsiblePersonCountry && responsiblePersonCountry.trim().length > 0 ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+                /* @__PURE__ */ jsxRuntime.jsx("p", { style: personFieldLabel, children: l.countryLabel }),
+                /* @__PURE__ */ jsxRuntime.jsx("p", { style: personFieldValue, children: responsiblePersonCountry })
+              ] }) : null })
+            ] }),
+            responsiblePersonAddress && responsiblePersonAddress.trim().length > 0 && /* @__PURE__ */ jsxRuntime.jsx("tr", { children: /* @__PURE__ */ jsxRuntime.jsxs("td", { colSpan: 2, style: __spreadProps(__spreadValues({}, personFieldCell), { width: "auto", paddingRight: 0, paddingBottom: 0 }), children: [
+              /* @__PURE__ */ jsxRuntime.jsx("p", { style: personFieldLabel, children: l.addressLabel }),
+              /* @__PURE__ */ jsxRuntime.jsx("p", { style: __spreadProps(__spreadValues({}, personFieldValue), { whiteSpace: "pre-line" }), children: responsiblePersonAddress })
+            ] }) })
+          ] }) })
+        ] }) }),
+        /* @__PURE__ */ jsxRuntime.jsx("hr", { style: { border: "none", borderTop: `1px solid ${emailTokens.border}`, margin: "0 32px" } }),
         /* @__PURE__ */ jsxRuntime.jsx("div", { style: { paddingLeft: "32px", paddingRight: "32px", paddingTop: "32px", paddingBottom: "40px" }, children: isManualFlow ? (
           // Manual flow: closing message + CTA no rodapé (substitui footerMessage/footerContact).
           /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
@@ -5056,7 +5127,6 @@ var DEFAULT_LABELS4 = {
   startingDateLabel: "Starting Date:",
   numberOfPeopleLabel: "Number of People:",
   hostLabel: "Host:",
-  addressLabel: "Address:",
   postCtaMessage: "After adding everyone, you will also receive your own registration email, just like the other travellers. Please make sure everyone completes this step so we can organise everything properly.",
   closingMessage: "If you have any questions, just reply to this email \u2014 happy to help.",
   nextStepsHeading: "Next steps:"
@@ -5075,7 +5145,6 @@ function BookingCreatedEmail({
   className,
   nextSteps,
   nextStepsImportant,
-  responsiblePersonAddress,
   directBookingLinkLabel
 }) {
   const l = __spreadValues(__spreadValues({}, DEFAULT_LABELS4), labels);
@@ -5097,8 +5166,7 @@ function BookingCreatedEmail({
     { label: l.adventureLabel, value: adventure },
     { label: l.startingDateLabel, value: startingDate },
     { label: l.numberOfPeopleLabel, value: String(numberOfPeople) },
-    { label: l.hostLabel, value: host },
-    ...responsiblePersonAddress && responsiblePersonAddress.trim().length > 0 ? [{ label: l.addressLabel, value: responsiblePersonAddress }] : []
+    { label: l.hostLabel, value: host }
   ];
   const showNextSteps = Array.isArray(nextSteps) && nextSteps.length > 0;
   return /* @__PURE__ */ jsxRuntime.jsxs(