@planetaexo/design-system 0.8.0 → 0.9.1

package/dist/index.d.cts

@@ -284,6 +284,13 @@ interface BookingAdventure {
     formName?: string;
     /** Quando true, desabilita o botão "Add contact as traveller" desta aventura. */
     addContactAsTravellerDisabled?: boolean;
+    /** Texto do botão "Add traveller" (desktop). Default: "More travellers". */
+    addTravellerLabel?: string;
+    /** Texto curto exibido em mobile (sm:hidden). Default: "Add". */
+    addTravellerShortLabel?: string;
+    /** Tooltip exibido quando chips de "Add to this adventure" estão desabilitados por capacidade.
+     *  Default: "Adventure full". */
+    atCapacityLabel?: string;
 }
 interface BookingContact {
     name: string;
@@ -337,6 +344,9 @@ interface BookingDetailsProps {
     onAddTraveller?: (adventureId: string) => void;
     /** Quando fornecida, desassocia o viajante da aventura sem deletá-lo da reserva. */
     onUnassignFromAdventure?: (adventureId: string, travellerId: string) => void;
+    /** Quando fornecida, o consumer assume clipboard + feedback visual (ex.: toast). Fallback:
+     *  `navigator.clipboard.writeText` sem feedback. */
+    onCopyFormLink?: (url: string) => void;
     /** Submit do modal de ADD interno. Usado quando `onAddTraveller` NÃO é passado. */
     onSubmitAddTraveller?: (adventureId: string, data: TravellerFormData) => Promise<void> | void;
     /** Submit do modal de EDIT interno. Usado quando `onEditTraveller` NÃO é passado. */
@@ -365,7 +375,7 @@ interface BookingDetailsProps {
     signOutLabel?: string;
     className?: string;
 }
-declare function BookingDetails({ bookingId, status, createdAt, contact, agentName, agentContactUrl, agentNameFallback, agentLabel, agentContactLabel, cannotRemoveLastTravellerLabel, adventures, summaryLineItems, subtotal, total, depositInfo, onAddContactAsTraveller, onEditTraveller, onRemoveTraveller, onAddSuggestedTraveller, onAddTraveller, onUnassignFromAdventure, onSubmitAddTraveller, onSubmitEditTraveller, onConfirmRemoveTraveller, travellerFormConfig, addTravellerSaving, editTravellerSaving, removeTravellerSaving, travellerFormError, onPayBalance, onCancelRequest, logoSrc, logoAlt, onSignOut, signOutLabel, className, }: BookingDetailsProps): react_jsx_runtime.JSX.Element;
+declare function BookingDetails({ bookingId, status, createdAt, contact, agentName, agentContactUrl, agentNameFallback, agentLabel, agentContactLabel, cannotRemoveLastTravellerLabel, adventures, summaryLineItems, subtotal, total, depositInfo, onAddContactAsTraveller, onEditTraveller, onRemoveTraveller, onAddSuggestedTraveller, onAddTraveller, onUnassignFromAdventure, onCopyFormLink, onSubmitAddTraveller, onSubmitEditTraveller, onConfirmRemoveTraveller, travellerFormConfig, addTravellerSaving, editTravellerSaving, removeTravellerSaving, travellerFormError, onPayBalance, onCancelRequest, logoSrc, logoAlt, onSignOut, signOutLabel, className, }: BookingDetailsProps): react_jsx_runtime.JSX.Element;
 
 interface BookingConfirmationLabels {
     ctaButton?: string;

package/dist/index.d.ts

@@ -284,6 +284,13 @@ interface BookingAdventure {
     formName?: string;
     /** Quando true, desabilita o botão "Add contact as traveller" desta aventura. */
     addContactAsTravellerDisabled?: boolean;
+    /** Texto do botão "Add traveller" (desktop). Default: "More travellers". */
+    addTravellerLabel?: string;
+    /** Texto curto exibido em mobile (sm:hidden). Default: "Add". */
+    addTravellerShortLabel?: string;
+    /** Tooltip exibido quando chips de "Add to this adventure" estão desabilitados por capacidade.
+     *  Default: "Adventure full". */
+    atCapacityLabel?: string;
 }
 interface BookingContact {
     name: string;
@@ -337,6 +344,9 @@ interface BookingDetailsProps {
     onAddTraveller?: (adventureId: string) => void;
     /** Quando fornecida, desassocia o viajante da aventura sem deletá-lo da reserva. */
     onUnassignFromAdventure?: (adventureId: string, travellerId: string) => void;
+    /** Quando fornecida, o consumer assume clipboard + feedback visual (ex.: toast). Fallback:
+     *  `navigator.clipboard.writeText` sem feedback. */
+    onCopyFormLink?: (url: string) => void;
     /** Submit do modal de ADD interno. Usado quando `onAddTraveller` NÃO é passado. */
     onSubmitAddTraveller?: (adventureId: string, data: TravellerFormData) => Promise<void> | void;
     /** Submit do modal de EDIT interno. Usado quando `onEditTraveller` NÃO é passado. */
@@ -365,7 +375,7 @@ interface BookingDetailsProps {
     signOutLabel?: string;
     className?: string;
 }
-declare function BookingDetails({ bookingId, status, createdAt, contact, agentName, agentContactUrl, agentNameFallback, agentLabel, agentContactLabel, cannotRemoveLastTravellerLabel, adventures, summaryLineItems, subtotal, total, depositInfo, onAddContactAsTraveller, onEditTraveller, onRemoveTraveller, onAddSuggestedTraveller, onAddTraveller, onUnassignFromAdventure, onSubmitAddTraveller, onSubmitEditTraveller, onConfirmRemoveTraveller, travellerFormConfig, addTravellerSaving, editTravellerSaving, removeTravellerSaving, travellerFormError, onPayBalance, onCancelRequest, logoSrc, logoAlt, onSignOut, signOutLabel, className, }: BookingDetailsProps): react_jsx_runtime.JSX.Element;
+declare function BookingDetails({ bookingId, status, createdAt, contact, agentName, agentContactUrl, agentNameFallback, agentLabel, agentContactLabel, cannotRemoveLastTravellerLabel, adventures, summaryLineItems, subtotal, total, depositInfo, onAddContactAsTraveller, onEditTraveller, onRemoveTraveller, onAddSuggestedTraveller, onAddTraveller, onUnassignFromAdventure, onCopyFormLink, onSubmitAddTraveller, onSubmitEditTraveller, onConfirmRemoveTraveller, travellerFormConfig, addTravellerSaving, editTravellerSaving, removeTravellerSaving, travellerFormError, onPayBalance, onCancelRequest, logoSrc, logoAlt, onSignOut, signOutLabel, className, }: BookingDetailsProps): react_jsx_runtime.JSX.Element;
 
 interface BookingConfirmationLabels {
     ctaButton?: string;

package/dist/index.js

@@ -1353,11 +1353,11 @@ function AdventureCard({ adventure }) {
         /* @__PURE__ */ jsx(Separator, { className: "my-1" }),
         /* @__PURE__ */ jsxs("div", { children: [
           /* @__PURE__ */ jsx("p", { className: "text-[10px] font-bold text-muted-foreground font-heading uppercase tracking-widest mb-3", children: (_f = adventure.itineraryLabel) != null ? _f : "Itinerary" }),
-          adventure.description && !adventure.detailsSlot && /* @__PURE__ */ jsx("p", { className: "text-base text-foreground/80 leading-relaxed font-sans", children: adventure.description }),
+          adventure.description && !adventure.detailsSlot && /* @__PURE__ */ jsx("p", { className: "text-base text-foreground/80 leading-snug font-sans", children: adventure.description }),
           adventure.detailsSlot && /* @__PURE__ */ jsx("div", { className: cn(
             "text-foreground",
             // Base paragraph and heading styles
-            "[&_p]:text-base [&_p]:text-foreground/80 [&_p]:leading-relaxed [&_p]:mb-2",
+            "[&_p]:text-base [&_p]:text-foreground/80 [&_p]:leading-snug [&_p]:mb-2",
             "[&_h2]:text-xl [&_h2]:font-bold [&_h2]:text-foreground [&_h2]:mb-2 [&_h2]:mt-4",
             "[&_h3]:text-lg [&_h3]:font-semibold [&_h3]:text-foreground [&_h3]:mb-1 [&_h3]:mt-3",
             "[&_strong]:font-bold [&_strong]:text-foreground",
@@ -1367,7 +1367,7 @@ function AdventureCard({ adventure }) {
             // Standard lists
             "[&_ul:not(.list-check):not(.list-cross)]:list-disc [&_ul:not(.list-check):not(.list-cross)]:pl-5 [&_ul:not(.list-check):not(.list-cross)]:space-y-1",
             "[&_ol]:list-decimal [&_ol]:pl-5 [&_ol]:space-y-1",
-            "[&_li]:text-base [&_li]:text-foreground/80 [&_li]:leading-relaxed",
+            "[&_li]:text-base [&_li]:text-foreground/80 [&_li]:leading-snug",
             // Check list (✓)
             "[&_.list-check]:list-none [&_.list-check]:pl-5 [&_.list-check]:space-y-1",
             "[&_.list-check_li]:relative [&_.list-check_li]:before:absolute [&_.list-check_li]:before:-left-5 [&_.list-check_li]:before:content-['\u2713'] [&_.list-check_li]:before:text-primary [&_.list-check_li]:before:font-bold",
@@ -2214,16 +2214,29 @@ function StatusBadge({ status }) {
   );
 }
 function totalPeople(adventures) {
-  var _a, _b, _c, _d, _e, _f;
-  let adults = 0;
-  let children = 0;
-  let seniors = 0;
-  for (const a of adventures) {
-    adults += (_b = (_a = a.slots) == null ? void 0 : _a.adults) != null ? _b : 0;
-    children += (_d = (_c = a.slots) == null ? void 0 : _c.children) != null ? _d : 0;
-    seniors += (_f = (_e = a.slots) == null ? void 0 : _e.seniors) != null ? _f : 0;
+  var _a, _b, _c, _d, _e, _f, _g;
+  const byId = /* @__PURE__ */ new Map();
+  for (const adv of adventures) {
+    for (const t of (_a = adv.travellers) != null ? _a : []) {
+      if (!byId.has(t.id)) byId.set(t.id, t);
+    }
+  }
+  if (byId.size === 0) {
+    let adults2 = 0, children2 = 0, seniors2 = 0;
+    for (const a of adventures) {
+      adults2 += (_c = (_b = a.slots) == null ? void 0 : _b.adults) != null ? _c : 0;
+      children2 += (_e = (_d = a.slots) == null ? void 0 : _d.children) != null ? _e : 0;
+      seniors2 += (_g = (_f = a.slots) == null ? void 0 : _f.seniors) != null ? _g : 0;
+    }
+    return { adults: adults2, children: children2, seniors: seniors2, total: adults2 + children2 + seniors2 };
   }
-  return { adults, children, seniors, total: adults + children + seniors };
+  let adults = 0, children = 0, seniors = 0;
+  for (const t of byId.values()) {
+    if (t.personType === "CHILD" || t.isChild) children++;
+    else if (t.personType === "SENIOR") seniors++;
+    else adults++;
+  }
+  return { adults, children, seniors, total: byId.size };
 }
 function InfoCard({
   label,
@@ -2242,6 +2255,7 @@ function AdventureSection({
   onAddSuggestedTraveller,
   onAddTraveller,
   onUnassignFromAdventure,
+  onCopyFormLink,
   hasSubmitAddTraveller,
   hasSubmitEditTraveller,
   hasConfirmRemoveTraveller,
@@ -2250,11 +2264,14 @@ function AdventureSection({
   onRequestOpenDeleteModal,
   cannotRemoveLastTravellerLabel
 }) {
-  var _a, _b, _c, _d;
+  var _a, _b, _c, _d, _e, _f, _g;
   const [detailsOpen, setDetailsOpen] = React22.useState(false);
-  const [itineraryOpen, setItineraryOpen] = React22.useState(true);
   const handleCopyUrl = (url) => {
-    navigator.clipboard.writeText(url);
+    if (onCopyFormLink) {
+      onCopyFormLink(url);
+    } else {
+      void navigator.clipboard.writeText(url);
+    }
   };
   const people = adventure.slots;
   [
@@ -2285,7 +2302,7 @@ function AdventureSection({
             ] })
           ] })
         ] }),
-        (adventure.included && adventure.included.length > 0 || adventure.notIncluded && adventure.notIncluded.length > 0 || adventure.cancellationPolicy && adventure.cancellationPolicy.length > 0) && /* @__PURE__ */ jsxs(
+        (adventure.detailsSlot || adventure.description || adventure.included && adventure.included.length > 0 || adventure.notIncluded && adventure.notIncluded.length > 0 || adventure.cancellationPolicy && adventure.cancellationPolicy.length > 0) && /* @__PURE__ */ jsxs(
           "button",
           {
             type: "button",
@@ -2296,7 +2313,7 @@ function AdventureSection({
               detailsOpen && "border-primary text-primary"
             ),
             children: [
-              "Details",
+              (_d = adventure.itineraryLabel) != null ? _d : "Details",
               detailsOpen ? /* @__PURE__ */ jsx(ChevronUpIcon, { className: "w-3 h-3" }) : /* @__PURE__ */ jsx(ChevronDownIcon, { className: "w-3 h-3" })
             ]
           }
@@ -2317,51 +2334,28 @@ function AdventureSection({
         tag
       )) })
     ] }),
-    (adventure.detailsSlot || adventure.description) && /* @__PURE__ */ jsxs("div", { className: "border-t border-border px-5 lg:px-6 py-5 flex flex-col gap-2", children: [
-      /* @__PURE__ */ jsxs(
-        "button",
-        {
-          type: "button",
-          onClick: () => setItineraryOpen((v) => !v),
-          className: cn(
-            "group flex w-full items-center justify-between gap-2 text-left",
-            "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring rounded"
-          ),
-          "aria-expanded": itineraryOpen,
-          children: [
-            /* @__PURE__ */ jsx("h4", { className: "text-xs font-bold text-muted-foreground font-heading uppercase tracking-widest group-hover:text-foreground transition-colors", children: (_d = adventure.itineraryLabel) != null ? _d : "Itinerary" }),
-            /* @__PURE__ */ jsx(
-              ChevronDownIcon,
-              {
-                className: cn(
-                  "w-4 h-4 text-muted-foreground shrink-0 transition-transform",
-                  itineraryOpen && "rotate-180"
-                )
-              }
-            )
-          ]
-        }
-      ),
-      itineraryOpen && (adventure.detailsSlot ? /* @__PURE__ */ jsx(
-        "div",
-        {
-          className: cn(
-            "text-foreground",
-            "[&_p]:text-sm [&_p]:text-foreground/80 [&_p]:leading-relaxed [&_p]:mb-2",
-            "[&_h2]:text-lg [&_h2]:font-bold [&_h2]:text-foreground [&_h2]:mb-2 [&_h2]:mt-4",
-            "[&_h3]:text-base [&_h3]:font-semibold [&_h3]:text-foreground [&_h3]:mb-1 [&_h3]:mt-3",
-            "[&_strong]:font-bold [&_strong]:text-foreground",
-            "[&_em]:italic",
-            "[&_a]:text-primary [&_a]:underline [&_a]:underline-offset-2",
-            "[&_ul]:list-disc [&_ul]:pl-5 [&_ul]:space-y-1",
-            "[&_ol]:list-decimal [&_ol]:pl-5 [&_ol]:space-y-1",
-            "[&_li]:text-sm [&_li]:text-foreground/80 [&_li]:leading-relaxed"
-          ),
-          children: adventure.detailsSlot
-        }
-      ) : /* @__PURE__ */ jsx("p", { className: "text-sm text-foreground/80 leading-relaxed font-sans", children: adventure.description }))
-    ] }),
     detailsOpen && /* @__PURE__ */ jsxs("div", { className: "border-t border-border px-5 lg:px-6 py-5 flex flex-col gap-5 bg-muted/10", children: [
+      (adventure.detailsSlot || adventure.description) && /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
+        /* @__PURE__ */ jsx("h4", { className: "text-xs font-bold text-muted-foreground font-heading uppercase tracking-widest", children: "Itinerary" }),
+        adventure.detailsSlot ? /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: cn(
+              "text-foreground",
+              "[&_p]:text-sm [&_p]:text-foreground/80 [&_p]:leading-snug [&_p]:mb-2",
+              "[&_h2]:text-lg [&_h2]:font-bold [&_h2]:text-foreground [&_h2]:mb-2 [&_h2]:mt-4",
+              "[&_h3]:text-base [&_h3]:font-semibold [&_h3]:text-foreground [&_h3]:mb-1 [&_h3]:mt-3",
+              "[&_strong]:font-bold [&_strong]:text-foreground",
+              "[&_em]:italic",
+              "[&_a]:text-primary [&_a]:underline [&_a]:underline-offset-2",
+              "[&_ul]:list-disc [&_ul]:pl-5 [&_ul]:space-y-1",
+              "[&_ol]:list-decimal [&_ol]:pl-5 [&_ol]:space-y-1",
+              "[&_li]:text-sm [&_li]:text-foreground/80 [&_li]:leading-snug"
+            ),
+            children: adventure.detailsSlot
+          }
+        ) : /* @__PURE__ */ jsx("p", { className: "text-sm text-foreground/80 leading-snug font-sans", children: adventure.description })
+      ] }),
       adventure.included && adventure.included.length > 0 && /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
         /* @__PURE__ */ jsx("h4", { className: "text-xs font-bold text-muted-foreground font-heading uppercase tracking-widest", children: "O que est\xE1 incluso" }),
         /* @__PURE__ */ jsx("ul", { className: "flex flex-col gap-1.5", children: adventure.included.map((item, i) => /* @__PURE__ */ jsxs(
@@ -2447,8 +2441,8 @@ function AdventureSection({
               className: "flex items-center gap-1.5 rounded-full border border-border px-3 py-1.5 text-xs font-ui text-primary hover:border-primary hover:bg-primary/5 transition-colors",
               children: [
                 /* @__PURE__ */ jsx(PlusIcon, { className: "w-3 h-3" }),
-                /* @__PURE__ */ jsx("span", { className: "hidden sm:inline", children: "More travellers" }),
-                /* @__PURE__ */ jsx("span", { className: "sm:hidden", children: "Add" })
+                /* @__PURE__ */ jsx("span", { className: "hidden sm:inline", children: (_e = adventure.addTravellerLabel) != null ? _e : "More travellers" }),
+                /* @__PURE__ */ jsx("span", { className: "sm:hidden", children: (_g = (_f = adventure.addTravellerShortLabel) != null ? _f : adventure.addTravellerLabel) != null ? _g : "Add" })
               ]
             }
           )
@@ -2580,24 +2574,38 @@ function AdventureSection({
           t.id
         );
       }) }),
-      adventure.suggestedTravellers && adventure.suggestedTravellers.length > 0 && /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2 pt-2", children: [
-        /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground font-ui", children: "Add to this adventure" }),
-        /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-2", children: adventure.suggestedTravellers.map((st) => /* @__PURE__ */ jsxs(
-          "button",
-          {
-            type: "button",
-            onClick: () => onAddSuggestedTraveller == null ? void 0 : onAddSuggestedTraveller(adventure.id, st.id),
-            className: "flex items-center gap-1.5 rounded-full border border-border px-3 py-1.5 text-xs font-ui text-foreground hover:border-primary hover:text-primary hover:bg-primary/5 transition-colors",
-            children: [
-              /* @__PURE__ */ jsx(PlusIcon, { className: "w-3 h-3" }),
-              st.firstName,
-              " ",
-              st.lastName
-            ]
-          },
-          st.id
-        )) })
-      ] }),
+      adventure.suggestedTravellers && adventure.suggestedTravellers.length > 0 && (() => {
+        var _a2;
+        const atCapacity = totalSlots > 0 && adventure.travellers.length >= totalSlots;
+        const atCapacityTooltip = atCapacity ? (_a2 = adventure.atCapacityLabel) != null ? _a2 : "Adventure full" : void 0;
+        return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2 pt-2", children: [
+          /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground font-ui", children: "Add to this adventure" }),
+          /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-2", children: adventure.suggestedTravellers.map((st) => /* @__PURE__ */ jsxs(
+            "button",
+            {
+              type: "button",
+              onClick: () => {
+                if (atCapacity) return;
+                onAddSuggestedTraveller == null ? void 0 : onAddSuggestedTraveller(adventure.id, st.id);
+              },
+              disabled: atCapacity,
+              title: atCapacityTooltip,
+              "aria-disabled": atCapacity,
+              className: cn(
+                "flex items-center gap-1.5 rounded-full border border-border px-3 py-1.5 text-xs font-ui text-foreground hover:border-primary hover:text-primary hover:bg-primary/5 transition-colors",
+                "disabled:opacity-40 disabled:cursor-not-allowed disabled:pointer-events-none disabled:hover:border-border disabled:hover:text-foreground disabled:hover:bg-transparent"
+              ),
+              children: [
+                /* @__PURE__ */ jsx(PlusIcon, { className: "w-3 h-3" }),
+                st.firstName,
+                " ",
+                st.lastName
+              ]
+            },
+            st.id
+          )) })
+        ] });
+      })(),
       adventure.travellers.length > 0 && totalSlots > 0 && (() => {
         const completed = adventure.travellers.filter((t) => t.status === "completed").length;
         const percent = Math.round(completed / totalSlots * 100);
@@ -3052,6 +3060,7 @@ function BookingDetails({
   onAddSuggestedTraveller,
   onAddTraveller,
   onUnassignFromAdventure,
+  onCopyFormLink,
   onSubmitAddTraveller,
   onSubmitEditTraveller,
   onConfirmRemoveTraveller,
@@ -3264,6 +3273,7 @@ function BookingDetails({
                 onAddSuggestedTraveller,
                 onAddTraveller,
                 onUnassignFromAdventure,
+                onCopyFormLink,
                 hasSubmitAddTraveller,
                 hasSubmitEditTraveller,
                 hasConfirmRemoveTraveller,
@@ -3685,7 +3695,7 @@ function BookingConfirmation({
                     /* @__PURE__ */ jsx(
                       "div",
                       {
-                        style: { fontSize: "14px", color: emailTokens.bodyText, lineHeight: "1.6", margin: 0 },
+                        style: { fontSize: "14px", color: emailTokens.bodyText, lineHeight: "1.4", margin: 0 },
                         dangerouslySetInnerHTML: { __html: adventure.description }
                       }
                     )