@planetaexo/design-system 0.6.0 → 0.8.0

package/dist/index.cjs

@@ -2262,21 +2262,18 @@ function AdventureSection({
   onRemoveTraveller,
   onAddSuggestedTraveller,
   onAddTraveller,
-  onUnassignFromAdventure
+  onUnassignFromAdventure,
+  hasSubmitAddTraveller,
+  hasSubmitEditTraveller,
+  hasConfirmRemoveTraveller,
+  onRequestOpenAddModal,
+  onRequestOpenEditModal,
+  onRequestOpenDeleteModal,
+  cannotRemoveLastTravellerLabel
 }) {
   var _a, _b, _c, _d;
   const [detailsOpen, setDetailsOpen] = React22__namespace.useState(false);
-  const [addModalOpen, setAddModalOpen] = React22__namespace.useState(false);
-  const [newTraveller, setNewTraveller] = React22__namespace.useState({
-    firstName: "",
-    lastName: "",
-    passport: "",
-    type: "adult",
-    email: "",
-    dateOfBirth: "",
-    phone: ""
-  });
-  const setField = (k, v) => setNewTraveller((p) => __spreadProps(__spreadValues({}, p), { [k]: v }));
+  const [itineraryOpen, setItineraryOpen] = React22__namespace.useState(true);
   const handleCopyUrl = (url) => {
     navigator.clipboard.writeText(url);
   };
@@ -2342,8 +2339,31 @@ function AdventureSection({
       )) })
     ] }),
     (adventure.detailsSlot || adventure.description) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "border-t border-border px-5 lg:px-6 py-5 flex flex-col gap-2", children: [
-      /* @__PURE__ */ jsxRuntime.jsx("h4", { className: "text-xs font-bold text-muted-foreground font-heading uppercase tracking-widest", children: (_d = adventure.itineraryLabel) != null ? _d : "Itinerary" }),
-      adventure.detailsSlot ? /* @__PURE__ */ jsxRuntime.jsx(
+      /* @__PURE__ */ jsxRuntime.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__ */ jsxRuntime.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__ */ jsxRuntime.jsx(
+              lucideReact.ChevronDownIcon,
+              {
+                className: cn(
+                  "w-4 h-4 text-muted-foreground shrink-0 transition-transform",
+                  itineraryOpen && "rotate-180"
+                )
+              }
+            )
+          ]
+        }
+      ),
+      itineraryOpen && (adventure.detailsSlot ? /* @__PURE__ */ jsxRuntime.jsx(
         "div",
         {
           className: cn(
@@ -2360,7 +2380,7 @@ function AdventureSection({
           ),
           children: adventure.detailsSlot
         }
-      ) : /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-foreground/80 leading-relaxed font-sans", children: adventure.description })
+      ) : /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-foreground/80 leading-relaxed font-sans", children: adventure.description }))
     ] }),
     detailsOpen && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "border-t border-border px-5 lg:px-6 py-5 flex flex-col gap-5 bg-muted/10", children: [
       adventure.included && adventure.included.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-2", children: [
@@ -2434,11 +2454,17 @@ function AdventureSection({
               ]
             }
           ),
-          /* @__PURE__ */ jsxRuntime.jsxs(
+          (onAddTraveller || hasSubmitAddTraveller) && /* @__PURE__ */ jsxRuntime.jsxs(
             "button",
             {
               type: "button",
-              onClick: () => onAddTraveller ? onAddTraveller(adventure.id) : setAddModalOpen(true),
+              onClick: () => {
+                if (onAddTraveller) {
+                  onAddTraveller(adventure.id);
+                } else {
+                  onRequestOpenAddModal == null ? void 0 : onRequestOpenAddModal(adventure.id);
+                }
+              },
               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__ */ jsxRuntime.jsx(lucideReact.PlusIcon, { className: "w-3 h-3" }),
@@ -2449,94 +2475,132 @@ function AdventureSection({
           )
         ] })
       ] }),
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col divide-y divide-border", children: adventure.travellers.map((t) => /* @__PURE__ */ jsxRuntime.jsxs(
-        "div",
-        {
-          className: "flex flex-col sm:flex-row sm:items-center gap-2 sm:gap-3 py-3 first:pt-0",
-          children: [
-            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-3 min-w-0 flex-1", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-0.5 min-w-0 flex-1", children: [
-              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 min-w-0", children: [
-                /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-sm font-semibold text-foreground font-ui truncate", children: [
-                  t.firstName,
-                  " ",
-                  t.lastName
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col divide-y divide-border", children: adventure.travellers.map((t) => {
+        const canRemoveTraveller = adventure.travellers.length > 1;
+        const disabledRemoveTitle = canRemoveTraveller ? void 0 : cannotRemoveLastTravellerLabel != null ? cannotRemoveLastTravellerLabel : "Cannot remove last traveller";
+        return /* @__PURE__ */ jsxRuntime.jsxs(
+          "div",
+          {
+            className: "flex flex-col sm:flex-row sm:items-center gap-2 sm:gap-3 py-3 first:pt-0",
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-3 min-w-0 flex-1", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-0.5 min-w-0 flex-1", children: [
+                /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 min-w-0", children: [
+                  /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-sm font-semibold text-foreground font-ui truncate", children: [
+                    t.firstName,
+                    " ",
+                    t.lastName
+                  ] }),
+                  t.isChild && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs font-semibold font-heading rounded-full px-2 py-0.5 bg-orange-100 text-orange-700 dark:bg-orange-900/30 dark:text-orange-400 shrink-0", children: "Child" })
                 ] }),
-                t.isChild && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs font-semibold font-heading rounded-full px-2 py-0.5 bg-orange-100 text-orange-700 dark:bg-orange-900/30 dark:text-orange-400 shrink-0", children: "Child" })
-              ] }),
-              t.formUrl && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
-                /* @__PURE__ */ jsxRuntime.jsxs(
-                  "a",
-                  {
-                    href: t.formUrl,
-                    target: "_blank",
-                    rel: "noopener noreferrer",
-                    className: "flex items-center gap-1 text-xs text-primary hover:text-primary/80 transition-colors font-ui",
-                    children: [
-                      /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ExternalLinkIcon, { className: "w-3 h-3" }),
-                      "Open"
-                    ]
-                  }
-                ),
-                /* @__PURE__ */ jsxRuntime.jsx(
-                  "button",
-                  {
-                    type: "button",
-                    onClick: () => handleCopyUrl(t.formUrl),
-                    className: "flex items-center text-xs text-muted-foreground hover:text-primary transition-colors font-ui",
-                    "aria-label": "Copy form URL",
-                    children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.CopyIcon, { className: "w-3 h-3" })
-                  }
-                )
-              ] })
-            ] }) }),
-            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 sm:gap-3 justify-between sm:justify-end", children: [
-              /* @__PURE__ */ jsxRuntime.jsx(
-                "span",
-                {
-                  className: cn(
-                    "inline-flex items-center rounded-full px-2.5 py-0.5 text-xs font-bold font-heading uppercase tracking-wider shrink-0",
-                    t.status === "completed" ? "bg-green-100 text-green-800 dark:bg-green-900/30 dark:text-green-400" : "bg-yellow-100 text-yellow-800 dark:bg-yellow-900/30 dark:text-yellow-400"
+                t.formUrl && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
+                  /* @__PURE__ */ jsxRuntime.jsxs(
+                    "a",
+                    {
+                      href: t.formUrl,
+                      target: "_blank",
+                      rel: "noopener noreferrer",
+                      className: "flex items-center gap-1 text-xs text-primary hover:text-primary/80 transition-colors font-ui",
+                      children: [
+                        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ExternalLinkIcon, { className: "w-3 h-3" }),
+                        "Open"
+                      ]
+                    }
                   ),
-                  children: t.status
-                }
-              ),
-              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-0.5 shrink-0", children: [
-                onEditTraveller && /* @__PURE__ */ jsxRuntime.jsx(
-                  "button",
-                  {
-                    type: "button",
-                    onClick: () => onEditTraveller(adventure.id, t.id),
-                    className: "flex h-8 w-8 sm:h-7 sm:w-7 items-center justify-center rounded-lg text-muted-foreground hover:text-primary hover:bg-primary/10 transition-colors",
-                    "aria-label": `Edit ${t.firstName}`,
-                    children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.PencilIcon, { className: "w-3.5 h-3.5" })
-                  }
-                ),
-                onRemoveTraveller && /* @__PURE__ */ jsxRuntime.jsx(
-                  "button",
+                  /* @__PURE__ */ jsxRuntime.jsx(
+                    "button",
+                    {
+                      type: "button",
+                      onClick: () => handleCopyUrl(t.formUrl),
+                      className: "flex items-center text-xs text-muted-foreground hover:text-primary transition-colors font-ui",
+                      "aria-label": "Copy form URL",
+                      children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.CopyIcon, { className: "w-3 h-3" })
+                    }
+                  )
+                ] })
+              ] }) }),
+              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 sm:gap-3 justify-between sm:justify-end", children: [
+                /* @__PURE__ */ jsxRuntime.jsx(
+                  "span",
                   {
-                    type: "button",
-                    onClick: () => onRemoveTraveller(adventure.id, t.id),
-                    className: "flex h-8 w-8 sm:h-7 sm:w-7 items-center justify-center rounded-lg text-muted-foreground hover:text-destructive hover:bg-destructive/10 transition-colors",
-                    "aria-label": `Delete ${t.firstName}`,
-                    children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Trash2Icon, { className: "w-3.5 h-3.5" })
+                    className: cn(
+                      "inline-flex items-center rounded-full px-2.5 py-0.5 text-xs font-bold font-heading uppercase tracking-wider shrink-0",
+                      t.status === "completed" ? "bg-green-100 text-green-800 dark:bg-green-900/30 dark:text-green-400" : "bg-yellow-100 text-yellow-800 dark:bg-yellow-900/30 dark:text-yellow-400"
+                    ),
+                    children: t.status
                   }
                 ),
-                (onUnassignFromAdventure || onRemoveTraveller) && /* @__PURE__ */ jsxRuntime.jsx(
-                  "button",
-                  {
-                    type: "button",
-                    onClick: () => onUnassignFromAdventure ? onUnassignFromAdventure(adventure.id, t.id) : onRemoveTraveller(adventure.id, t.id),
-                    className: "flex h-8 w-8 sm:h-7 sm:w-7 items-center justify-center rounded-lg text-muted-foreground hover:text-amber-500 hover:bg-amber-500/10 transition-colors",
-                    "aria-label": `Remove ${t.firstName} from adventure`,
-                    children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.UserMinusIcon, { className: "w-3.5 h-3.5" })
-                  }
-                )
+                /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-0.5 shrink-0", children: [
+                  (onEditTraveller || hasSubmitEditTraveller) && /* @__PURE__ */ jsxRuntime.jsx(
+                    "button",
+                    {
+                      type: "button",
+                      onClick: () => {
+                        if (onEditTraveller) {
+                          onEditTraveller(adventure.id, t.id);
+                        } else {
+                          onRequestOpenEditModal == null ? void 0 : onRequestOpenEditModal(adventure.id, t);
+                        }
+                      },
+                      className: "flex h-8 w-8 sm:h-7 sm:w-7 items-center justify-center rounded-lg text-muted-foreground hover:text-primary hover:bg-primary/10 transition-colors",
+                      "aria-label": `Edit ${t.firstName}`,
+                      children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.PencilIcon, { className: "w-3.5 h-3.5" })
+                    }
+                  ),
+                  (onRemoveTraveller || hasConfirmRemoveTraveller) && /* @__PURE__ */ jsxRuntime.jsx(
+                    "button",
+                    {
+                      type: "button",
+                      onClick: () => {
+                        if (!canRemoveTraveller) return;
+                        if (onRemoveTraveller) {
+                          onRemoveTraveller(adventure.id, t.id);
+                        } else {
+                          onRequestOpenDeleteModal == null ? void 0 : onRequestOpenDeleteModal(adventure.id, t);
+                        }
+                      },
+                      disabled: !canRemoveTraveller,
+                      title: disabledRemoveTitle,
+                      "aria-disabled": !canRemoveTraveller,
+                      className: cn(
+                        "flex h-8 w-8 sm:h-7 sm:w-7 items-center justify-center rounded-lg text-muted-foreground hover:text-destructive hover:bg-destructive/10 transition-colors",
+                        "disabled:opacity-40 disabled:cursor-not-allowed disabled:pointer-events-none disabled:hover:text-muted-foreground disabled:hover:bg-transparent"
+                      ),
+                      "aria-label": `Delete ${t.firstName}`,
+                      children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Trash2Icon, { className: "w-3.5 h-3.5" })
+                    }
+                  ),
+                  (onUnassignFromAdventure || onRemoveTraveller || hasConfirmRemoveTraveller) && /* @__PURE__ */ jsxRuntime.jsx(
+                    "button",
+                    {
+                      type: "button",
+                      onClick: () => {
+                        if (!canRemoveTraveller) return;
+                        if (onUnassignFromAdventure) {
+                          onUnassignFromAdventure(adventure.id, t.id);
+                        } else if (onRemoveTraveller) {
+                          onRemoveTraveller(adventure.id, t.id);
+                        } else {
+                          onRequestOpenDeleteModal == null ? void 0 : onRequestOpenDeleteModal(adventure.id, t);
+                        }
+                      },
+                      disabled: !canRemoveTraveller,
+                      title: disabledRemoveTitle,
+                      "aria-disabled": !canRemoveTraveller,
+                      className: cn(
+                        "flex h-8 w-8 sm:h-7 sm:w-7 items-center justify-center rounded-lg text-muted-foreground hover:text-amber-500 hover:bg-amber-500/10 transition-colors",
+                        "disabled:opacity-40 disabled:cursor-not-allowed disabled:pointer-events-none disabled:hover:text-muted-foreground disabled:hover:bg-transparent"
+                      ),
+                      "aria-label": `Remove ${t.firstName} from adventure`,
+                      children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.UserMinusIcon, { className: "w-3.5 h-3.5" })
+                    }
+                  )
+                ] })
               ] })
-            ] })
-          ]
-        },
-        t.id
-      )) }),
+            ]
+          },
+          t.id
+        );
+      }) }),
       adventure.suggestedTravellers && adventure.suggestedTravellers.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-2 pt-2", children: [
         /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-muted-foreground font-ui", children: "Add to this adventure" }),
         /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-wrap gap-2", children: adventure.suggestedTravellers.map((st) => /* @__PURE__ */ jsxRuntime.jsxs(
@@ -2582,111 +2646,303 @@ function AdventureSection({
           ] })
         ] });
       })()
-    ] }),
-    /* @__PURE__ */ jsxRuntime.jsx(Dialog, { open: addModalOpen, onOpenChange: setAddModalOpen, children: /* @__PURE__ */ jsxRuntime.jsxs(DialogContent, { className: "sm:max-w-md", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(DialogHeader, { children: /* @__PURE__ */ jsxRuntime.jsx(DialogTitle, { className: "font-heading text-xl", children: "Add traveller" }) }),
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-4 pt-2", children: [
-        /* @__PURE__ */ jsxRuntime.jsx(
-          FloatingInput,
-          {
-            label: "First name",
-            required: true,
-            value: newTraveller.firstName,
-            onChange: (e) => setField("firstName", e.target.value)
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          FloatingInput,
-          {
-            label: "Last name",
-            required: true,
-            value: newTraveller.lastName,
-            onChange: (e) => setField("lastName", e.target.value)
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          FloatingInput,
-          {
-            label: "Passport (optional)",
-            value: newTraveller.passport,
-            onChange: (e) => setField("passport", e.target.value)
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsxs(
-          FloatingSelect,
-          {
-            label: "Type (adult/child/senior)",
-            value: newTraveller.type,
-            onChange: (e) => setField("type", e.target.value),
-            children: [
-              /* @__PURE__ */ jsxRuntime.jsx("option", { value: "adult", children: "Adult" }),
-              /* @__PURE__ */ jsxRuntime.jsx("option", { value: "child", children: "Child" }),
-              /* @__PURE__ */ jsxRuntime.jsx("option", { value: "senior", children: "Senior" })
-            ]
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          FloatingInput,
-          {
-            label: "Email",
-            type: "email",
-            required: true,
-            value: newTraveller.email,
-            onChange: (e) => setField("email", e.target.value)
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          FloatingInput,
-          {
-            label: "Date of birth",
-            type: "date",
-            value: newTraveller.dateOfBirth,
-            onChange: (e) => setField("dateOfBirth", e.target.value)
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          FloatingInput,
-          {
-            label: "Phone (optional)",
-            type: "tel",
-            value: newTraveller.phone,
-            onChange: (e) => setField("phone", e.target.value)
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-3 pt-2", children: [
+    ] })
+  ] });
+}
+function TravellerFormFields({ value, onChange, config }) {
+  var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r;
+  const labels = (_a = config == null ? void 0 : config.labels) != null ? _a : {};
+  const disabledTypes = new Set((_b = config == null ? void 0 : config.disabledPersonTypes) != null ? _b : []);
+  const documentLabel = (config == null ? void 0 : config.requireCpf) ? (_c = labels.documentCpf) != null ? _c : "CPF" : (_d = labels.documentPassport) != null ? _d : "Passport (optional)";
+  const documentPlaceholder = (config == null ? void 0 : config.requireCpf) ? "000.000.000-00" : void 0;
+  const isChild = value.personType === "CHILD";
+  const childEmail = config == null ? void 0 : config.childEmailFromContact;
+  const emailRequired = value.personType === "ADULT" || value.personType === "SENIOR";
+  const emailLabel = `${(_e = labels.email) != null ? _e : "Email"}${emailRequired ? " *" : ""}`;
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      FloatingInput,
+      {
+        label: (_f = labels.firstName) != null ? _f : "First name *",
+        required: true,
+        value: value.firstName,
+        onChange: (e) => onChange({ firstName: e.target.value })
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      FloatingInput,
+      {
+        label: (_g = labels.lastName) != null ? _g : "Last name *",
+        required: true,
+        value: value.lastName,
+        onChange: (e) => onChange({ lastName: e.target.value })
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      FloatingInput,
+      {
+        label: documentLabel,
+        placeholder: documentPlaceholder,
+        value: (_h = value.documentNumber) != null ? _h : "",
+        onChange: (e) => onChange({ documentNumber: e.target.value })
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsxs(
+      FloatingSelect,
+      {
+        label: (_i = labels.personTypeLabel) != null ? _i : "Type (adult/child/senior)",
+        value: value.personType,
+        onChange: (e) => onChange({ personType: e.target.value }),
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx("option", { value: "ADULT", disabled: disabledTypes.has("ADULT"), children: (_j = labels.personTypeAdult) != null ? _j : "Adult" }),
+          /* @__PURE__ */ jsxRuntime.jsx("option", { value: "CHILD", disabled: disabledTypes.has("CHILD"), children: (_k = labels.personTypeChild) != null ? _k : "Child" }),
+          /* @__PURE__ */ jsxRuntime.jsx("option", { value: "SENIOR", disabled: disabledTypes.has("SENIOR"), children: (_l = labels.personTypeSenior) != null ? _l : "Senior" })
+        ]
+      }
+    ),
+    isChild && childEmail ? /* @__PURE__ */ jsxRuntime.jsx(
+      FloatingInput,
+      {
+        label: (_m = labels.email) != null ? _m : "Email",
+        type: "email",
+        value: childEmail,
+        readOnly: true,
+        disabled: true
+      }
+    ) : /* @__PURE__ */ jsxRuntime.jsx(
+      FloatingInput,
+      {
+        label: emailLabel,
+        type: "email",
+        value: (_n = value.email) != null ? _n : "",
+        onChange: (e) => onChange({ email: e.target.value }),
+        required: emailRequired
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      FloatingInput,
+      {
+        label: (_o = labels.birthDate) != null ? _o : "Date of birth",
+        type: "date",
+        value: (_p = value.birthDate) != null ? _p : "",
+        onChange: (e) => onChange({ birthDate: e.target.value })
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      FloatingInput,
+      {
+        label: (_q = labels.phone) != null ? _q : "Phone (optional)",
+        type: "tel",
+        value: (_r = value.phone) != null ? _r : "",
+        onChange: (e) => onChange({ phone: e.target.value }),
+        placeholder: "+5511987654321"
+      }
+    )
+  ] });
+}
+function createInitialAddFormData(config) {
+  var _a;
+  const disabled = new Set((_a = config == null ? void 0 : config.disabledPersonTypes) != null ? _a : []);
+  const personType = !disabled.has("ADULT") ? "ADULT" : !disabled.has("CHILD") ? "CHILD" : "SENIOR";
+  return {
+    firstName: "",
+    lastName: "",
+    email: "",
+    documentNumber: "",
+    phone: "",
+    birthDate: "",
+    personType
+  };
+}
+function AddTravellerDialog({
+  open,
+  adventureId,
+  onClose,
+  onSubmit,
+  config,
+  saving,
+  errorMessage
+}) {
+  var _a, _b, _c, _d, _e;
+  const [form, setForm] = React22__namespace.useState(() => createInitialAddFormData(config));
+  React22__namespace.useEffect(() => {
+    if (open) {
+      setForm(createInitialAddFormData(config));
+    }
+  }, [open, config]);
+  const childEmailFromContact = config == null ? void 0 : config.childEmailFromContact;
+  const labels = (_a = config == null ? void 0 : config.labels) != null ? _a : {};
+  const handleSubmit = async (e) => {
+    var _a2, _b2, _c2;
+    e.preventDefault();
+    if (!adventureId) return;
+    const data = __spreadProps(__spreadValues({}, form), {
+      firstName: form.firstName.trim(),
+      lastName: form.lastName.trim(),
+      email: form.personType === "CHILD" && childEmailFromContact ? childEmailFromContact : ((_a2 = form.email) == null ? void 0 : _a2.trim()) || void 0,
+      documentNumber: ((_b2 = form.documentNumber) == null ? void 0 : _b2.trim()) || void 0,
+      phone: ((_c2 = form.phone) == null ? void 0 : _c2.trim()) || void 0,
+      birthDate: form.birthDate || void 0
+    });
+    await onSubmit(adventureId, data);
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Dialog,
+    {
+      open,
+      onOpenChange: (o) => {
+        if (!o) onClose();
+      },
+      children: /* @__PURE__ */ jsxRuntime.jsxs(DialogContent, { className: "sm:max-w-lg", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(DialogHeader, { children: /* @__PURE__ */ jsxRuntime.jsx(DialogTitle, { className: "font-heading text-xl", children: (_b = labels.modalAddTitle) != null ? _b : "Add traveller" }) }),
+        /* @__PURE__ */ jsxRuntime.jsxs("form", { onSubmit: handleSubmit, className: "space-y-3", children: [
           /* @__PURE__ */ jsxRuntime.jsx(
-            "button",
+            TravellerFormFields,
             {
-              type: "button",
-              onClick: () => setAddModalOpen(false),
-              className: "text-sm font-ui text-muted-foreground hover:text-foreground transition-colors",
-              children: "Cancel"
+              value: form,
+              onChange: (patch) => setForm((prev) => __spreadValues(__spreadValues({}, prev), patch)),
+              config
             }
           ),
+          errorMessage && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-destructive font-sans", children: errorMessage }),
+          /* @__PURE__ */ jsxRuntime.jsxs(DialogFooter, { children: [
+            /* @__PURE__ */ jsxRuntime.jsx(Button, { type: "button", variant: "outline", size: "sm", onClick: onClose, children: (_c = labels.cancel) != null ? _c : "Cancel" }),
+            /* @__PURE__ */ jsxRuntime.jsx(Button, { type: "submit", size: "sm", disabled: saving, children: saving ? (_d = labels.saving) != null ? _d : "Saving..." : (_e = labels.add) != null ? _e : "Add" })
+          ] })
+        ] })
+      ] })
+    }
+  );
+}
+function EditTravellerDialog({
+  open,
+  adventureId,
+  traveller,
+  onClose,
+  onSubmit,
+  config,
+  saving,
+  errorMessage
+}) {
+  var _a, _b, _c, _d, _e;
+  const [form, setForm] = React22__namespace.useState(() => ({
+    firstName: "",
+    lastName: "",
+    email: "",
+    documentNumber: "",
+    phone: "",
+    birthDate: "",
+    personType: "ADULT"
+  }));
+  React22__namespace.useEffect(() => {
+    var _a2, _b2, _c2, _d2, _e2, _f;
+    if (open && traveller) {
+      setForm({
+        firstName: (_a2 = traveller.firstName) != null ? _a2 : "",
+        lastName: (_b2 = traveller.lastName) != null ? _b2 : "",
+        email: (_c2 = traveller.email) != null ? _c2 : "",
+        documentNumber: (_d2 = traveller.documentNumber) != null ? _d2 : "",
+        phone: (_e2 = traveller.phone) != null ? _e2 : "",
+        birthDate: traveller.birthDate ? traveller.birthDate.slice(0, 10) : "",
+        personType: (_f = traveller.personType) != null ? _f : traveller.isChild ? "CHILD" : "ADULT"
+      });
+    }
+  }, [open, traveller]);
+  const childEmailFromContact = config == null ? void 0 : config.childEmailFromContact;
+  const labels = (_a = config == null ? void 0 : config.labels) != null ? _a : {};
+  const handleSubmit = async (e) => {
+    var _a2, _b2, _c2;
+    e.preventDefault();
+    if (!adventureId || !traveller) return;
+    const data = __spreadProps(__spreadValues({}, form), {
+      firstName: form.firstName.trim(),
+      lastName: form.lastName.trim(),
+      email: form.personType === "CHILD" && childEmailFromContact ? childEmailFromContact : ((_a2 = form.email) == null ? void 0 : _a2.trim()) || void 0,
+      documentNumber: ((_b2 = form.documentNumber) == null ? void 0 : _b2.trim()) || void 0,
+      phone: ((_c2 = form.phone) == null ? void 0 : _c2.trim()) || void 0,
+      birthDate: form.birthDate || void 0
+    });
+    await onSubmit(adventureId, traveller.id, data);
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Dialog,
+    {
+      open,
+      onOpenChange: (o) => {
+        if (!o) onClose();
+      },
+      children: /* @__PURE__ */ jsxRuntime.jsxs(DialogContent, { className: "sm:max-w-lg", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(DialogHeader, { children: /* @__PURE__ */ jsxRuntime.jsx(DialogTitle, { className: "font-heading text-xl", children: (_b = labels.modalEditTitle) != null ? _b : "Edit traveller" }) }),
+        /* @__PURE__ */ jsxRuntime.jsxs("form", { onSubmit: handleSubmit, className: "space-y-3", children: [
           /* @__PURE__ */ jsxRuntime.jsx(
-            "button",
+            TravellerFormFields,
+            {
+              value: form,
+              onChange: (patch) => setForm((prev) => __spreadValues(__spreadValues({}, prev), patch)),
+              config
+            }
+          ),
+          errorMessage && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-destructive font-sans", children: errorMessage }),
+          /* @__PURE__ */ jsxRuntime.jsxs(DialogFooter, { children: [
+            /* @__PURE__ */ jsxRuntime.jsx(Button, { type: "button", variant: "outline", size: "sm", onClick: onClose, children: (_c = labels.cancel) != null ? _c : "Cancel" }),
+            /* @__PURE__ */ jsxRuntime.jsx(Button, { type: "submit", size: "sm", disabled: saving, children: saving ? (_d = labels.saving) != null ? _d : "Saving..." : (_e = labels.save) != null ? _e : "Save" })
+          ] })
+        ] })
+      ] })
+    }
+  );
+}
+function DeleteTravellerDialog({
+  open,
+  adventureId,
+  traveller,
+  onClose,
+  onConfirm,
+  config,
+  saving,
+  errorMessage
+}) {
+  var _a, _b, _c, _d, _e, _f, _g, _h, _i;
+  const labels = (_a = config == null ? void 0 : config.labels) != null ? _a : {};
+  const name = traveller ? `${(_b = traveller.firstName) != null ? _b : ""} ${(_c = traveller.lastName) != null ? _c : ""}`.trim() : "";
+  const description = ((_d = labels.modalDeleteConfirm) != null ? _d : 'Delete traveller "{name}"?').replace(
+    "{name}",
+    name
+  );
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Dialog,
+    {
+      open,
+      onOpenChange: (o) => {
+        if (!o) onClose();
+      },
+      children: /* @__PURE__ */ jsxRuntime.jsxs(DialogContent, { className: "sm:max-w-sm", children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(DialogHeader, { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(DialogTitle, { children: (_e = labels.modalDeleteTitle) != null ? _e : "Delete traveller?" }),
+          /* @__PURE__ */ jsxRuntime.jsx(DialogDescription, { children: description })
+        ] }),
+        errorMessage && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-destructive font-sans", children: errorMessage }),
+        /* @__PURE__ */ jsxRuntime.jsxs(DialogFooter, { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(Button, { type: "button", variant: "outline", size: "sm", onClick: onClose, children: (_f = labels.cancel) != null ? _f : "Cancel" }),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            Button,
             {
               type: "button",
+              variant: "destructive",
+              size: "sm",
+              disabled: saving,
               onClick: () => {
-                setAddModalOpen(false);
-                setNewTraveller({
-                  firstName: "",
-                  lastName: "",
-                  passport: "",
-                  type: "adult",
-                  email: "",
-                  dateOfBirth: "",
-                  phone: ""
-                });
+                if (adventureId && traveller) {
+                  void onConfirm(adventureId, traveller.id);
+                }
               },
-              className: "rounded-full bg-primary px-6 py-2.5 text-sm font-bold text-primary-foreground font-heading hover:bg-primary/90 transition-colors",
-              children: "Add"
+              children: saving ? (_h = (_g = labels.deleting) != null ? _g : labels.saving) != null ? _h : "Deleting..." : (_i = labels.delete) != null ? _i : "Delete"
             }
           )
         ] })
       ] })
-    ] }) })
-  ] });
+    }
+  );
 }
 function OrderSummary({
   adventures,
@@ -2802,6 +3058,10 @@ function BookingDetails({
   contact,
   agentName,
   agentContactUrl,
+  agentNameFallback,
+  agentLabel,
+  agentContactLabel,
+  cannotRemoveLastTravellerLabel,
   adventures,
   summaryLineItems,
   subtotal,
@@ -2813,6 +3073,14 @@ function BookingDetails({
   onAddSuggestedTraveller,
   onAddTraveller,
   onUnassignFromAdventure,
+  onSubmitAddTraveller,
+  onSubmitEditTraveller,
+  onConfirmRemoveTraveller,
+  travellerFormConfig,
+  addTravellerSaving,
+  editTravellerSaving,
+  removeTravellerSaving,
+  travellerFormError,
   onPayBalance,
   onCancelRequest,
   logoSrc,
@@ -2823,6 +3091,72 @@ function BookingDetails({
 }) {
   var _a, _b, _c;
   const people = totalPeople(adventures);
+  const hasSubmitAddTraveller = !!onSubmitAddTraveller;
+  const hasSubmitEditTraveller = !!onSubmitEditTraveller;
+  const hasConfirmRemoveTraveller = !!onConfirmRemoveTraveller;
+  const [addModalState, setAddModalState] = React22__namespace.useState({
+    open: false,
+    adventureId: null
+  });
+  const [editModalState, setEditModalState] = React22__namespace.useState({ open: false, adventureId: null, traveller: null });
+  const [deleteModalState, setDeleteModalState] = React22__namespace.useState({ open: false, adventureId: null, traveller: null });
+  const handleRequestOpenAddModal = React22__namespace.useCallback((adventureId) => {
+    setAddModalState({ open: true, adventureId });
+  }, []);
+  const handleRequestOpenEditModal = React22__namespace.useCallback(
+    (adventureId, traveller) => {
+      setEditModalState({ open: true, adventureId, traveller });
+    },
+    []
+  );
+  const handleRequestOpenDeleteModal = React22__namespace.useCallback(
+    (adventureId, traveller) => {
+      setDeleteModalState({ open: true, adventureId, traveller });
+    },
+    []
+  );
+  const closeAddModal = React22__namespace.useCallback(() => {
+    setAddModalState({ open: false, adventureId: null });
+  }, []);
+  const closeEditModal = React22__namespace.useCallback(() => {
+    setEditModalState({ open: false, adventureId: null, traveller: null });
+  }, []);
+  const closeDeleteModal = React22__namespace.useCallback(() => {
+    setDeleteModalState({ open: false, adventureId: null, traveller: null });
+  }, []);
+  const handleAddSubmit = React22__namespace.useCallback(
+    async (adventureId, data) => {
+      if (!onSubmitAddTraveller) return;
+      try {
+        await onSubmitAddTraveller(adventureId, data);
+        closeAddModal();
+      } catch (e) {
+      }
+    },
+    [onSubmitAddTraveller, closeAddModal]
+  );
+  const handleEditSubmit = React22__namespace.useCallback(
+    async (adventureId, travellerId, data) => {
+      if (!onSubmitEditTraveller) return;
+      try {
+        await onSubmitEditTraveller(adventureId, travellerId, data);
+        closeEditModal();
+      } catch (e) {
+      }
+    },
+    [onSubmitEditTraveller, closeEditModal]
+  );
+  const handleDeleteConfirm = React22__namespace.useCallback(
+    async (adventureId, travellerId) => {
+      if (!onConfirmRemoveTraveller) return;
+      try {
+        await onConfirmRemoveTraveller(adventureId, travellerId);
+        closeDeleteModal();
+      } catch (e) {
+      }
+    },
+    [onConfirmRemoveTraveller, closeDeleteModal]
+  );
   return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
     (logoSrc || onSignOut) && /* @__PURE__ */ jsxRuntime.jsx("header", { className: "w-full border-b border-border bg-card/50 backdrop-blur-sm sticky top-0 z-30", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-full max-w-5xl mx-auto px-4 sm:px-6 lg:px-0 h-14 flex items-center justify-between gap-4", children: [
       /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1" }),
@@ -2877,26 +3211,49 @@ function BookingDetails({
               /* @__PURE__ */ jsxRuntime.jsx("p", { className: "font-semibold", children: contact.name }),
               contact.email && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground font-sans truncate", children: contact.email })
             ] }),
-            agentName && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "rounded-xl border border-border bg-card p-4 flex items-center gap-3.5 min-w-0", children: [
-              /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex h-10 w-10 shrink-0 items-center justify-center rounded-full bg-primary/10 text-primary font-heading font-bold text-sm uppercase", children: agentName.charAt(0) }),
-              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-0.5 min-w-0", children: [
-                /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs font-bold text-muted-foreground font-heading uppercase tracking-widest", children: "Your Agent" }),
-                /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-semibold text-foreground font-sans", children: agentName })
-              ] }),
-              agentContactUrl && /* @__PURE__ */ jsxRuntime.jsxs(
-                "a",
-                {
-                  href: agentContactUrl,
-                  target: "_blank",
-                  rel: "noopener noreferrer",
-                  className: "ml-auto shrink-0 flex items-center gap-1.5 rounded-full bg-primary/10 px-3.5 py-1.5 text-xs font-semibold text-primary font-ui transition-colors hover:bg-primary/20",
-                  children: [
-                    /* @__PURE__ */ jsxRuntime.jsx(lucideReact.MessageCircleIcon, { className: "w-3.5 h-3.5" }),
-                    "Contact"
-                  ]
-                }
-              )
-            ] }),
+            (() => {
+              const hasAgent = !!agentName;
+              const displayName = hasAgent ? agentName : agentNameFallback != null ? agentNameFallback : "No agent assigned";
+              const initial = hasAgent ? agentName.charAt(0) : "?";
+              return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "rounded-xl border border-border bg-card p-4 flex items-center gap-3.5 min-w-0", children: [
+                /* @__PURE__ */ jsxRuntime.jsx(
+                  "div",
+                  {
+                    className: cn(
+                      "flex h-10 w-10 shrink-0 items-center justify-center rounded-full font-heading font-bold text-sm uppercase",
+                      hasAgent ? "bg-primary/10 text-primary" : "bg-muted text-muted-foreground"
+                    ),
+                    children: initial
+                  }
+                ),
+                /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-0.5 min-w-0", children: [
+                  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs font-bold text-muted-foreground font-heading uppercase tracking-widest", children: agentLabel != null ? agentLabel : "Your Agent" }),
+                  /* @__PURE__ */ jsxRuntime.jsx(
+                    "p",
+                    {
+                      className: cn(
+                        "text-sm font-sans truncate",
+                        hasAgent ? "font-semibold text-foreground" : "italic text-muted-foreground"
+                      ),
+                      children: displayName
+                    }
+                  )
+                ] }),
+                hasAgent && agentContactUrl && /* @__PURE__ */ jsxRuntime.jsxs(
+                  "a",
+                  {
+                    href: agentContactUrl,
+                    target: "_blank",
+                    rel: "noopener noreferrer",
+                    className: "ml-auto shrink-0 flex items-center gap-1.5 rounded-full bg-primary/10 px-3.5 py-1.5 text-xs font-semibold text-primary font-ui transition-colors hover:bg-primary/20",
+                    children: [
+                      /* @__PURE__ */ jsxRuntime.jsx(lucideReact.MessageCircleIcon, { className: "w-3.5 h-3.5" }),
+                      agentContactLabel != null ? agentContactLabel : "Contact"
+                    ]
+                  }
+                )
+              ] });
+            })(),
             /* @__PURE__ */ jsxRuntime.jsxs(InfoCard, { label: "Total People", children: [
               /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
                 /* @__PURE__ */ jsxRuntime.jsx(lucideReact.UsersIcon, { className: "w-4 h-4 text-primary shrink-0" }),
@@ -2927,7 +3284,14 @@ function BookingDetails({
                 onRemoveTraveller,
                 onAddSuggestedTraveller,
                 onAddTraveller,
-                onUnassignFromAdventure
+                onUnassignFromAdventure,
+                hasSubmitAddTraveller,
+                hasSubmitEditTraveller,
+                hasConfirmRemoveTraveller,
+                onRequestOpenAddModal: handleRequestOpenAddModal,
+                onRequestOpenEditModal: handleRequestOpenEditModal,
+                onRequestOpenDeleteModal: handleRequestOpenDeleteModal,
+                cannotRemoveLastTravellerLabel
               },
               adventure.id
             ))
@@ -3003,6 +3367,44 @@ function BookingDetails({
           ] })
         ]
       }
+    ),
+    hasSubmitAddTraveller && /* @__PURE__ */ jsxRuntime.jsx(
+      AddTravellerDialog,
+      {
+        open: addModalState.open,
+        adventureId: addModalState.adventureId,
+        onClose: closeAddModal,
+        onSubmit: handleAddSubmit,
+        config: travellerFormConfig,
+        saving: addTravellerSaving,
+        errorMessage: addModalState.open ? travellerFormError : null
+      }
+    ),
+    hasSubmitEditTraveller && /* @__PURE__ */ jsxRuntime.jsx(
+      EditTravellerDialog,
+      {
+        open: editModalState.open,
+        adventureId: editModalState.adventureId,
+        traveller: editModalState.traveller,
+        onClose: closeEditModal,
+        onSubmit: handleEditSubmit,
+        config: travellerFormConfig,
+        saving: editTravellerSaving,
+        errorMessage: editModalState.open ? travellerFormError : null
+      }
+    ),
+    hasConfirmRemoveTraveller && /* @__PURE__ */ jsxRuntime.jsx(
+      DeleteTravellerDialog,
+      {
+        open: deleteModalState.open,
+        adventureId: deleteModalState.adventureId,
+        traveller: deleteModalState.traveller,
+        onClose: closeDeleteModal,
+        onConfirm: handleDeleteConfirm,
+        config: travellerFormConfig,
+        saving: removeTravellerSaving,
+        errorMessage: deleteModalState.open ? travellerFormError : null
+      }
     )
   ] });
 }