@planetaexo/design-system 0.6.0 → 0.7.0

package/dist/index.js

@@ -2241,21 +2241,16 @@ function AdventureSection({
   onRemoveTraveller,
   onAddSuggestedTraveller,
   onAddTraveller,
-  onUnassignFromAdventure
+  onUnassignFromAdventure,
+  hasSubmitAddTraveller,
+  hasSubmitEditTraveller,
+  hasConfirmRemoveTraveller,
+  onRequestOpenAddModal,
+  onRequestOpenEditModal,
+  onRequestOpenDeleteModal
 }) {
   var _a, _b, _c, _d;
   const [detailsOpen, setDetailsOpen] = React22.useState(false);
-  const [addModalOpen, setAddModalOpen] = React22.useState(false);
-  const [newTraveller, setNewTraveller] = React22.useState({
-    firstName: "",
-    lastName: "",
-    passport: "",
-    type: "adult",
-    email: "",
-    dateOfBirth: "",
-    phone: ""
-  });
-  const setField = (k, v) => setNewTraveller((p) => __spreadProps(__spreadValues({}, p), { [k]: v }));
   const handleCopyUrl = (url) => {
     navigator.clipboard.writeText(url);
   };
@@ -2413,11 +2408,17 @@ function AdventureSection({
               ]
             }
           ),
-          /* @__PURE__ */ jsxs(
+          (onAddTraveller || hasSubmitAddTraveller) && /* @__PURE__ */ 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__ */ jsx(PlusIcon, { className: "w-3 h-3" }),
@@ -2480,31 +2481,51 @@ function AdventureSection({
                 }
               ),
               /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-0.5 shrink-0", children: [
-                onEditTraveller && /* @__PURE__ */ jsx(
+                (onEditTraveller || hasSubmitEditTraveller) && /* @__PURE__ */ jsx(
                   "button",
                   {
                     type: "button",
-                    onClick: () => onEditTraveller(adventure.id, t.id),
+                    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__ */ jsx(PencilIcon, { className: "w-3.5 h-3.5" })
                   }
                 ),
-                onRemoveTraveller && /* @__PURE__ */ jsx(
+                (onRemoveTraveller || hasConfirmRemoveTraveller) && /* @__PURE__ */ jsx(
                   "button",
                   {
                     type: "button",
-                    onClick: () => onRemoveTraveller(adventure.id, t.id),
+                    onClick: () => {
+                      if (onRemoveTraveller) {
+                        onRemoveTraveller(adventure.id, t.id);
+                      } else {
+                        onRequestOpenDeleteModal == null ? void 0 : onRequestOpenDeleteModal(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-destructive hover:bg-destructive/10 transition-colors",
                     "aria-label": `Delete ${t.firstName}`,
                     children: /* @__PURE__ */ jsx(Trash2Icon, { className: "w-3.5 h-3.5" })
                   }
                 ),
-                (onUnassignFromAdventure || onRemoveTraveller) && /* @__PURE__ */ jsx(
+                (onUnassignFromAdventure || onRemoveTraveller || hasConfirmRemoveTraveller) && /* @__PURE__ */ jsx(
                   "button",
                   {
                     type: "button",
-                    onClick: () => onUnassignFromAdventure ? onUnassignFromAdventure(adventure.id, t.id) : onRemoveTraveller(adventure.id, t.id),
+                    onClick: () => {
+                      if (onUnassignFromAdventure) {
+                        onUnassignFromAdventure(adventure.id, t.id);
+                      } else if (onRemoveTraveller) {
+                        onRemoveTraveller(adventure.id, t.id);
+                      } else {
+                        onRequestOpenDeleteModal == null ? void 0 : onRequestOpenDeleteModal(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-amber-500 hover:bg-amber-500/10 transition-colors",
                     "aria-label": `Remove ${t.firstName} from adventure`,
                     children: /* @__PURE__ */ jsx(UserMinusIcon, { className: "w-3.5 h-3.5" })
@@ -2561,111 +2582,303 @@ function AdventureSection({
           ] })
         ] });
       })()
-    ] }),
-    /* @__PURE__ */ jsx(Dialog, { open: addModalOpen, onOpenChange: setAddModalOpen, children: /* @__PURE__ */ jsxs(DialogContent, { className: "sm:max-w-md", children: [
-      /* @__PURE__ */ jsx(DialogHeader, { children: /* @__PURE__ */ jsx(DialogTitle, { className: "font-heading text-xl", children: "Add traveller" }) }),
-      /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4 pt-2", children: [
-        /* @__PURE__ */ jsx(
-          FloatingInput,
-          {
-            label: "First name",
-            required: true,
-            value: newTraveller.firstName,
-            onChange: (e) => setField("firstName", e.target.value)
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          FloatingInput,
-          {
-            label: "Last name",
-            required: true,
-            value: newTraveller.lastName,
-            onChange: (e) => setField("lastName", e.target.value)
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          FloatingInput,
-          {
-            label: "Passport (optional)",
-            value: newTraveller.passport,
-            onChange: (e) => setField("passport", e.target.value)
-          }
-        ),
-        /* @__PURE__ */ jsxs(
-          FloatingSelect,
-          {
-            label: "Type (adult/child/senior)",
-            value: newTraveller.type,
-            onChange: (e) => setField("type", e.target.value),
-            children: [
-              /* @__PURE__ */ jsx("option", { value: "adult", children: "Adult" }),
-              /* @__PURE__ */ jsx("option", { value: "child", children: "Child" }),
-              /* @__PURE__ */ jsx("option", { value: "senior", children: "Senior" })
-            ]
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          FloatingInput,
-          {
-            label: "Email",
-            type: "email",
-            required: true,
-            value: newTraveller.email,
-            onChange: (e) => setField("email", e.target.value)
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          FloatingInput,
-          {
-            label: "Date of birth",
-            type: "date",
-            value: newTraveller.dateOfBirth,
-            onChange: (e) => setField("dateOfBirth", e.target.value)
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          FloatingInput,
-          {
-            label: "Phone (optional)",
-            type: "tel",
-            value: newTraveller.phone,
-            onChange: (e) => setField("phone", e.target.value)
-          }
-        ),
-        /* @__PURE__ */ 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__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      FloatingInput,
+      {
+        label: (_f = labels.firstName) != null ? _f : "First name *",
+        required: true,
+        value: value.firstName,
+        onChange: (e) => onChange({ firstName: e.target.value })
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      FloatingInput,
+      {
+        label: (_g = labels.lastName) != null ? _g : "Last name *",
+        required: true,
+        value: value.lastName,
+        onChange: (e) => onChange({ lastName: e.target.value })
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      FloatingInput,
+      {
+        label: documentLabel,
+        placeholder: documentPlaceholder,
+        value: (_h = value.documentNumber) != null ? _h : "",
+        onChange: (e) => onChange({ documentNumber: e.target.value })
+      }
+    ),
+    /* @__PURE__ */ jsxs(
+      FloatingSelect,
+      {
+        label: (_i = labels.personTypeLabel) != null ? _i : "Type (adult/child/senior)",
+        value: value.personType,
+        onChange: (e) => onChange({ personType: e.target.value }),
+        children: [
+          /* @__PURE__ */ jsx("option", { value: "ADULT", disabled: disabledTypes.has("ADULT"), children: (_j = labels.personTypeAdult) != null ? _j : "Adult" }),
+          /* @__PURE__ */ jsx("option", { value: "CHILD", disabled: disabledTypes.has("CHILD"), children: (_k = labels.personTypeChild) != null ? _k : "Child" }),
+          /* @__PURE__ */ jsx("option", { value: "SENIOR", disabled: disabledTypes.has("SENIOR"), children: (_l = labels.personTypeSenior) != null ? _l : "Senior" })
+        ]
+      }
+    ),
+    isChild && childEmail ? /* @__PURE__ */ jsx(
+      FloatingInput,
+      {
+        label: (_m = labels.email) != null ? _m : "Email",
+        type: "email",
+        value: childEmail,
+        readOnly: true,
+        disabled: true
+      }
+    ) : /* @__PURE__ */ jsx(
+      FloatingInput,
+      {
+        label: emailLabel,
+        type: "email",
+        value: (_n = value.email) != null ? _n : "",
+        onChange: (e) => onChange({ email: e.target.value }),
+        required: emailRequired
+      }
+    ),
+    /* @__PURE__ */ 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__ */ 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.useState(() => createInitialAddFormData(config));
+  React22.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__ */ jsx(
+    Dialog,
+    {
+      open,
+      onOpenChange: (o) => {
+        if (!o) onClose();
+      },
+      children: /* @__PURE__ */ jsxs(DialogContent, { className: "sm:max-w-lg", children: [
+        /* @__PURE__ */ jsx(DialogHeader, { children: /* @__PURE__ */ jsx(DialogTitle, { className: "font-heading text-xl", children: (_b = labels.modalAddTitle) != null ? _b : "Add traveller" }) }),
+        /* @__PURE__ */ jsxs("form", { onSubmit: handleSubmit, className: "space-y-3", children: [
           /* @__PURE__ */ 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__ */ jsx("p", { className: "text-xs text-destructive font-sans", children: errorMessage }),
+          /* @__PURE__ */ jsxs(DialogFooter, { children: [
+            /* @__PURE__ */ jsx(Button, { type: "button", variant: "outline", size: "sm", onClick: onClose, children: (_c = labels.cancel) != null ? _c : "Cancel" }),
+            /* @__PURE__ */ 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.useState(() => ({
+    firstName: "",
+    lastName: "",
+    email: "",
+    documentNumber: "",
+    phone: "",
+    birthDate: "",
+    personType: "ADULT"
+  }));
+  React22.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__ */ jsx(
+    Dialog,
+    {
+      open,
+      onOpenChange: (o) => {
+        if (!o) onClose();
+      },
+      children: /* @__PURE__ */ jsxs(DialogContent, { className: "sm:max-w-lg", children: [
+        /* @__PURE__ */ jsx(DialogHeader, { children: /* @__PURE__ */ jsx(DialogTitle, { className: "font-heading text-xl", children: (_b = labels.modalEditTitle) != null ? _b : "Edit traveller" }) }),
+        /* @__PURE__ */ jsxs("form", { onSubmit: handleSubmit, className: "space-y-3", children: [
           /* @__PURE__ */ jsx(
-            "button",
+            TravellerFormFields,
+            {
+              value: form,
+              onChange: (patch) => setForm((prev) => __spreadValues(__spreadValues({}, prev), patch)),
+              config
+            }
+          ),
+          errorMessage && /* @__PURE__ */ jsx("p", { className: "text-xs text-destructive font-sans", children: errorMessage }),
+          /* @__PURE__ */ jsxs(DialogFooter, { children: [
+            /* @__PURE__ */ jsx(Button, { type: "button", variant: "outline", size: "sm", onClick: onClose, children: (_c = labels.cancel) != null ? _c : "Cancel" }),
+            /* @__PURE__ */ 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__ */ jsx(
+    Dialog,
+    {
+      open,
+      onOpenChange: (o) => {
+        if (!o) onClose();
+      },
+      children: /* @__PURE__ */ jsxs(DialogContent, { className: "sm:max-w-sm", children: [
+        /* @__PURE__ */ jsxs(DialogHeader, { children: [
+          /* @__PURE__ */ jsx(DialogTitle, { children: (_e = labels.modalDeleteTitle) != null ? _e : "Delete traveller?" }),
+          /* @__PURE__ */ jsx(DialogDescription, { children: description })
+        ] }),
+        errorMessage && /* @__PURE__ */ jsx("p", { className: "text-xs text-destructive font-sans", children: errorMessage }),
+        /* @__PURE__ */ jsxs(DialogFooter, { children: [
+          /* @__PURE__ */ jsx(Button, { type: "button", variant: "outline", size: "sm", onClick: onClose, children: (_f = labels.cancel) != null ? _f : "Cancel" }),
+          /* @__PURE__ */ 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,
@@ -2792,6 +3005,14 @@ function BookingDetails({
   onAddSuggestedTraveller,
   onAddTraveller,
   onUnassignFromAdventure,
+  onSubmitAddTraveller,
+  onSubmitEditTraveller,
+  onConfirmRemoveTraveller,
+  travellerFormConfig,
+  addTravellerSaving,
+  editTravellerSaving,
+  removeTravellerSaving,
+  travellerFormError,
   onPayBalance,
   onCancelRequest,
   logoSrc,
@@ -2802,6 +3023,72 @@ function BookingDetails({
 }) {
   var _a, _b, _c;
   const people = totalPeople(adventures);
+  const hasSubmitAddTraveller = !!onSubmitAddTraveller;
+  const hasSubmitEditTraveller = !!onSubmitEditTraveller;
+  const hasConfirmRemoveTraveller = !!onConfirmRemoveTraveller;
+  const [addModalState, setAddModalState] = React22.useState({
+    open: false,
+    adventureId: null
+  });
+  const [editModalState, setEditModalState] = React22.useState({ open: false, adventureId: null, traveller: null });
+  const [deleteModalState, setDeleteModalState] = React22.useState({ open: false, adventureId: null, traveller: null });
+  const handleRequestOpenAddModal = React22.useCallback((adventureId) => {
+    setAddModalState({ open: true, adventureId });
+  }, []);
+  const handleRequestOpenEditModal = React22.useCallback(
+    (adventureId, traveller) => {
+      setEditModalState({ open: true, adventureId, traveller });
+    },
+    []
+  );
+  const handleRequestOpenDeleteModal = React22.useCallback(
+    (adventureId, traveller) => {
+      setDeleteModalState({ open: true, adventureId, traveller });
+    },
+    []
+  );
+  const closeAddModal = React22.useCallback(() => {
+    setAddModalState({ open: false, adventureId: null });
+  }, []);
+  const closeEditModal = React22.useCallback(() => {
+    setEditModalState({ open: false, adventureId: null, traveller: null });
+  }, []);
+  const closeDeleteModal = React22.useCallback(() => {
+    setDeleteModalState({ open: false, adventureId: null, traveller: null });
+  }, []);
+  const handleAddSubmit = React22.useCallback(
+    async (adventureId, data) => {
+      if (!onSubmitAddTraveller) return;
+      try {
+        await onSubmitAddTraveller(adventureId, data);
+        closeAddModal();
+      } catch (e) {
+      }
+    },
+    [onSubmitAddTraveller, closeAddModal]
+  );
+  const handleEditSubmit = React22.useCallback(
+    async (adventureId, travellerId, data) => {
+      if (!onSubmitEditTraveller) return;
+      try {
+        await onSubmitEditTraveller(adventureId, travellerId, data);
+        closeEditModal();
+      } catch (e) {
+      }
+    },
+    [onSubmitEditTraveller, closeEditModal]
+  );
+  const handleDeleteConfirm = React22.useCallback(
+    async (adventureId, travellerId) => {
+      if (!onConfirmRemoveTraveller) return;
+      try {
+        await onConfirmRemoveTraveller(adventureId, travellerId);
+        closeDeleteModal();
+      } catch (e) {
+      }
+    },
+    [onConfirmRemoveTraveller, closeDeleteModal]
+  );
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     (logoSrc || onSignOut) && /* @__PURE__ */ jsx("header", { className: "w-full border-b border-border bg-card/50 backdrop-blur-sm sticky top-0 z-30", children: /* @__PURE__ */ 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__ */ jsx("div", { className: "flex-1" }),
@@ -2906,7 +3193,13 @@ function BookingDetails({
                 onRemoveTraveller,
                 onAddSuggestedTraveller,
                 onAddTraveller,
-                onUnassignFromAdventure
+                onUnassignFromAdventure,
+                hasSubmitAddTraveller,
+                hasSubmitEditTraveller,
+                hasConfirmRemoveTraveller,
+                onRequestOpenAddModal: handleRequestOpenAddModal,
+                onRequestOpenEditModal: handleRequestOpenEditModal,
+                onRequestOpenDeleteModal: handleRequestOpenDeleteModal
               },
               adventure.id
             ))
@@ -2982,6 +3275,44 @@ function BookingDetails({
           ] })
         ]
       }
+    ),
+    hasSubmitAddTraveller && /* @__PURE__ */ jsx(
+      AddTravellerDialog,
+      {
+        open: addModalState.open,
+        adventureId: addModalState.adventureId,
+        onClose: closeAddModal,
+        onSubmit: handleAddSubmit,
+        config: travellerFormConfig,
+        saving: addTravellerSaving,
+        errorMessage: addModalState.open ? travellerFormError : null
+      }
+    ),
+    hasSubmitEditTraveller && /* @__PURE__ */ 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__ */ jsx(
+      DeleteTravellerDialog,
+      {
+        open: deleteModalState.open,
+        adventureId: deleteModalState.adventureId,
+        traveller: deleteModalState.traveller,
+        onClose: closeDeleteModal,
+        onConfirm: handleDeleteConfirm,
+        config: travellerFormConfig,
+        saving: removeTravellerSaving,
+        errorMessage: deleteModalState.open ? travellerFormError : null
+      }
     )
   ] });
 }