@burdenoff/microfe-ggnomad 2026.705.1 → 2026.705.3

package/dist/ggnomad/GGNomadRoot.js

@@ -1,6 +1,6 @@
-import { GGNomadRoutes as e } from "./GGNomadRoutes.js";
-import { GGNomadProvider as t } from "./providers/GGNomadProvider.js";
-import { joinPath as n } from "./utils/navigation.js";
+import { GGNomadProvider as e } from "./providers/GGNomadProvider.js";
+import { joinPath as t } from "./utils/navigation.js";
+import { GGNomadRoutes as n } from "./GGNomadRoutes.js";
 import { useEffect as r } from "react";
 import { Activity as i, BarChart3 as a, Building as o, CalendarCheck as s, Compass as c, LayoutDashboard as l, MapPinned as u, Search as d, Star as f, Tickets as p } from "lucide-react";
 import { useI18n as m } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
@@ -28,63 +28,63 @@ var _ = (_) => {
 				{
 					id: "ggnomad-search",
 					label: x("ggnomad.nav.search", "Search"),
-					path: n(b, "search"),
+					path: t(b, "search"),
 					icon: /* @__PURE__ */ h(d, { size: 16 }),
 					order: 5
 				},
 				{
 					id: "ggnomad-travel",
 					label: x("ggnomad.nav.travel", "Travel"),
-					path: n(b, "travel"),
+					path: t(b, "travel"),
 					icon: /* @__PURE__ */ h(c, { size: 16 }),
 					order: 10
 				},
 				{
 					id: "ggnomad-hospitality",
 					label: x("ggnomad.nav.hospitality", "Hospitality"),
-					path: n(b, "hospitality"),
+					path: t(b, "hospitality"),
 					icon: /* @__PURE__ */ h(o, { size: 16 }),
 					order: 20
 				},
 				{
 					id: "ggnomad-tourism",
 					label: x("ggnomad.nav.tourism", "Tourism"),
-					path: n(b, "tourism"),
+					path: t(b, "tourism"),
 					icon: /* @__PURE__ */ h(u, { size: 16 }),
 					order: 30
 				},
 				{
 					id: "ggnomad-entertainment",
 					label: x("ggnomad.nav.entertainment", "Entertainment"),
-					path: n(b, "entertainment"),
+					path: t(b, "entertainment"),
 					icon: /* @__PURE__ */ h(i, { size: 16 }),
 					order: 40
 				},
 				{
 					id: "ggnomad-bookings",
 					label: x("ggnomad.nav.bookings", "Bookings"),
-					path: n(b, "bookings"),
+					path: t(b, "bookings"),
 					icon: /* @__PURE__ */ h(s, { size: 16 }),
 					order: 50
 				},
 				{
 					id: "ggnomad-favorites",
 					label: x("ggnomad.nav.favorites", "Favorites"),
-					path: n(b, "favorites"),
+					path: t(b, "favorites"),
 					icon: /* @__PURE__ */ h(f, { size: 16 }),
 					order: 60
 				},
 				{
 					id: "ggnomad-provider",
 					label: x("ggnomad.nav.providers", "Providers"),
-					path: n(b, "provider"),
+					path: t(b, "provider"),
 					icon: /* @__PURE__ */ h(p, { size: 16 }),
 					order: 70
 				},
 				{
 					id: "ggnomad-analytics",
 					label: x("ggnomad.nav.analytics", "Analytics"),
-					path: n(b, "analytics"),
+					path: t(b, "analytics"),
 					icon: /* @__PURE__ */ h(a, { size: 16 }),
 					order: 80
 				}
@@ -106,9 +106,9 @@ var _ = (_) => {
 		workspaceId: null,
 		gateway: "global",
 		defaultEnabled: !0,
-		children: /* @__PURE__ */ h(t, {
+		children: /* @__PURE__ */ h(e, {
 			..._,
-			children: /* @__PURE__ */ h(e, {})
+			children: /* @__PURE__ */ h(n, {})
 		})
 	});
 };

package/dist/ggnomad/components/BookingPanel.js

@@ -0,0 +1,219 @@
+import { CREATE_GGNOMAD_BOOKING_MUTATION as e } from "../graphql.js";
+import { cn as t } from "../utils/cn.js";
+import { useGGNomad as n } from "../providers/GGNomadProvider.js";
+import { joinPath as r } from "../utils/navigation.js";
+import { notify as i } from "../utils/notify.js";
+import { useState as a } from "react";
+import { Minus as o, Plus as s } from "lucide-react";
+import { useI18n as c } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
+import { useNavigate as l } from "react-router-dom";
+import { useMutation as u } from "@apollo/client/react";
+import { Button as d, GlassCard as f, Input as p } from "@burdenoff/fe-libs/ui";
+import { Fragment as m, jsx as h, jsxs as g } from "react/jsx-runtime";
+//#region src/ggnomad/components/BookingPanel.tsx
+function _({ bookingType: _, itemId: v, itemName: y, unitPrice: b, currency: x, nights: S, eventDate: C }) {
+	let { t: w } = c(), T = l(), { basePath: E = "/" } = n(), [D, O] = a(""), [k, A] = a(""), [j, M] = a(""), [N, P] = a(1), [F, { loading: I }] = u(e), L = b * (_ === "PROPERTY" && S ? S : N), R = L * .1, z = L + R, B = async () => {
+		if (_ === "PROPERTY") {
+			if (!k || !j) {
+				i.warning(w("ggnomad.booking.validation.missingDates", "Missing dates"), w("ggnomad.booking.validation.propertyDatesRequired", "Please select both check-in and check-out dates."));
+				return;
+			}
+		} else if (_ === "EVENT") {
+			if (!C) {
+				i.warning(w("ggnomad.booking.validation.missingDate", "Missing date"), w("ggnomad.booking.validation.eventDateRequired", "Event date is required for booking."));
+				return;
+			}
+		} else if (!D) {
+			i.warning(w("ggnomad.booking.validation.missingDate", "Missing date"), w("ggnomad.booking.validation.dateRequired", "Please select a date for your booking."));
+			return;
+		}
+		try {
+			let e = {
+				bookingType: _,
+				itemId: v,
+				itemName: y,
+				guestName: w("ggnomad.booking.defaultGuestName", "Demo Guest"),
+				guestEmail: "demo@burdenoff.com",
+				guests: N,
+				totalPrice: Math.round(z * 100) / 100,
+				currency: x,
+				paymentMethod: "card"
+			}, t = await F({ variables: { input: _ === "PROPERTY" ? {
+				...e,
+				checkIn: k,
+				checkOut: j
+			} : _ === "EVENT" ? {
+				...e,
+				eventDate: C
+			} : {
+				...e,
+				eventDate: D
+			} } });
+			if (t.error) {
+				i.error(w("ggnomad.booking.toast.createErrorTitle", "Could not create booking"), t.error.message);
+				return;
+			}
+			let n = t.data?.createGgnomadBooking;
+			i.success(w("ggnomad.booking.toast.createSuccessTitle", "Booking confirmed"), n ? w("ggnomad.booking.toast.createSuccessBody", "{{ref}} · {{item}}").replace("{{ref}}", n.referenceCode).replace("{{item}}", n.itemName) : y), T(r(E, "bookings"));
+		} catch (e) {
+			i.error(w("ggnomad.booking.toast.createErrorTitle", "Could not create booking"), e instanceof Error ? e.message : String(e));
+		}
+	}, V = "text-sm font-medium text-text-primary", H = "w-full";
+	return /* @__PURE__ */ g(f, {
+		treatment: "glass",
+		glow: !0,
+		className: "border-border-seam p-5 sticky top-6",
+		children: [
+			/* @__PURE__ */ h("h2", {
+				className: "mb-4 text-lg font-medium tracking-tight text-text-primary",
+				children: _ === "PROPERTY" ? w("ggnomad.booking.title.property", "Book this stay") : _ === "EVENT" ? w("ggnomad.booking.title.event", "Book tickets") : _ === "TOUR" ? w("ggnomad.booking.title.tour", "Book this tour") : w("ggnomad.booking.title.activity", "Book this activity")
+			}),
+			/* @__PURE__ */ g("div", {
+				className: "space-y-4 mb-6",
+				children: [_ === "PROPERTY" ? /* @__PURE__ */ g(m, { children: [/* @__PURE__ */ g("div", { children: [/* @__PURE__ */ h("label", {
+					htmlFor: "check-in",
+					className: V,
+					children: w("ggnomad.booking.checkIn", "Check-in")
+				}), /* @__PURE__ */ h(p, {
+					id: "check-in",
+					type: "date",
+					value: k,
+					onChange: (e) => A(e.target.value),
+					className: t(H, "mt-2"),
+					"aria-label": w("ggnomad.booking.checkIn", "Check-in")
+				})] }), /* @__PURE__ */ g("div", { children: [/* @__PURE__ */ h("label", {
+					htmlFor: "check-out",
+					className: V,
+					children: w("ggnomad.booking.checkOut", "Check-out")
+				}), /* @__PURE__ */ h(p, {
+					id: "check-out",
+					type: "date",
+					value: j,
+					onChange: (e) => M(e.target.value),
+					className: t(H, "mt-2"),
+					"aria-label": w("ggnomad.booking.checkOut", "Check-out")
+				})] })] }) : _ === "EVENT" ? /* @__PURE__ */ g("div", { children: [/* @__PURE__ */ h("label", {
+					htmlFor: "event-date",
+					className: V,
+					children: w("ggnomad.booking.date", "Date")
+				}), /* @__PURE__ */ h(p, {
+					id: "event-date",
+					type: "date",
+					value: C ? C.split("T")[0] : "",
+					disabled: !0,
+					className: t(H, "mt-2"),
+					"aria-label": w("ggnomad.booking.date", "Date")
+				})] }) : /* @__PURE__ */ g("div", { children: [/* @__PURE__ */ h("label", {
+					htmlFor: "booking-date",
+					className: V,
+					children: w("ggnomad.booking.date", "Date")
+				}), /* @__PURE__ */ h(p, {
+					id: "booking-date",
+					type: "date",
+					value: D,
+					onChange: (e) => O(e.target.value),
+					className: t(H, "mt-2"),
+					"aria-label": w("ggnomad.booking.date", "Date")
+				})] }), /* @__PURE__ */ g("div", { children: [/* @__PURE__ */ h("label", {
+					className: V,
+					children: _ === "PROPERTY" ? w("ggnomad.booking.guests", "Guests") : _ === "EVENT" ? w("ggnomad.booking.tickets", "Tickets") : w("ggnomad.booking.participants", "Participants")
+				}), /* @__PURE__ */ g("div", {
+					className: "flex items-center gap-2 mt-2",
+					children: [
+						/* @__PURE__ */ h(d, {
+							variant: "outline",
+							size: "sm",
+							onClick: () => P(Math.max(1, N - 1)),
+							disabled: N <= 1 || I,
+							"aria-label": w("ggnomad.booking.decreaseQuantity", "Decrease quantity"),
+							className: "flex-shrink-0",
+							children: /* @__PURE__ */ h(o, { className: "size-4" })
+						}),
+						/* @__PURE__ */ h("input", {
+							type: "number",
+							min: 1,
+							value: N,
+							onChange: (e) => P(Math.max(1, parseInt(e.target.value) || 1)),
+							className: "flex-1 h-9 rounded-input border border-border-default bg-bg-surface px-3 py-1 text-center text-sm text-text-primary",
+							"aria-label": _ === "PROPERTY" ? w("ggnomad.booking.guests", "Guests") : _ === "EVENT" ? w("ggnomad.booking.tickets", "Tickets") : w("ggnomad.booking.participants", "Participants")
+						}),
+						/* @__PURE__ */ h(d, {
+							variant: "outline",
+							size: "sm",
+							onClick: () => P(N + 1),
+							disabled: I,
+							"aria-label": w("ggnomad.booking.increaseQuantity", "Increase quantity"),
+							className: "flex-shrink-0",
+							children: /* @__PURE__ */ h(s, { className: "size-4" })
+						})
+					]
+				})] })]
+			}),
+			/* @__PURE__ */ g("div", {
+				className: "space-y-2 mb-6 p-3 rounded-md bg-bg-sunken",
+				children: [
+					/* @__PURE__ */ g("div", {
+						className: "flex justify-between text-sm",
+						children: [/* @__PURE__ */ g("span", {
+							className: "text-text-secondary",
+							children: [
+								x,
+								" ",
+								b.toFixed(2),
+								" ×",
+								" ",
+								_ === "PROPERTY" ? `${S ?? 1} ${w("ggnomad.booking.nights", "nights")}` : `${N} ${w("ggnomad.booking.item", "item")}`
+							]
+						}), /* @__PURE__ */ g("span", {
+							className: "text-text-primary font-medium",
+							children: [
+								x,
+								" ",
+								L.toFixed(2)
+							]
+						})]
+					}),
+					/* @__PURE__ */ g("div", {
+						className: "flex justify-between text-sm",
+						children: [/* @__PURE__ */ h("span", {
+							className: "text-text-secondary",
+							children: w("ggnomad.booking.tax", "Tax (10%)")
+						}), /* @__PURE__ */ g("span", {
+							className: "text-text-primary",
+							children: [
+								x,
+								" ",
+								R.toFixed(2)
+							]
+						})]
+					}),
+					/* @__PURE__ */ g("div", {
+						className: "border-t border-border-seam pt-2 flex justify-between",
+						children: [/* @__PURE__ */ h("span", {
+							className: "font-semibold text-text-primary",
+							children: w("ggnomad.booking.total", "Total")
+						}), /* @__PURE__ */ g("span", {
+							className: "font-bold text-lg text-text-primary",
+							children: [
+								x,
+								" ",
+								z.toFixed(2)
+							]
+						})]
+					})
+				]
+			}),
+			/* @__PURE__ */ h(d, {
+				onClick: () => void B(),
+				disabled: I,
+				className: "w-full bg-gradient-to-r from-action-primary-bg to-action-success-bg text-white font-semibold",
+				size: "lg",
+				children: I ? w("ggnomad.booking.button.creating", "Creating booking…") : _ === "PROPERTY" ? w("ggnomad.booking.button.property", "Book this stay") : _ === "EVENT" ? w("ggnomad.booking.button.event", "Book tickets") : _ === "TOUR" ? w("ggnomad.booking.button.tour", "Book this tour") : w("ggnomad.booking.button.activity", "Book this activity")
+			})
+		]
+	});
+}
+//#endregion
+export { _ as BookingPanel };
+
+//# sourceMappingURL=BookingPanel.js.map

package/dist/ggnomad/components/BookingPanel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BookingPanel.js","names":[],"sources":["../../../src/ggnomad/components/BookingPanel.tsx"],"sourcesContent":["import { useState } from 'react';\nimport { useMutation } from '@apollo/client/react';\nimport type { TypedDocumentNode } from '@apollo/client';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport { useNavigate } from 'react-router-dom';\nimport { Minus, Plus } from 'lucide-react';\nimport { Button, GlassCard, Input } from '@burdenoff/fe-libs/ui';\n\nimport { CREATE_GGNOMAD_BOOKING_MUTATION } from '../graphql';\nimport { useGGNomad } from '../providers/GGNomadProvider';\nimport { joinPath } from '../utils/navigation';\nimport { notify } from '../utils/notify';\nimport { cn } from '../utils/cn';\n\ntype BookingType = 'PROPERTY' | 'TOUR' | 'EVENT' | 'ACTIVITY';\n\ntype BookingPanelProps = {\n  bookingType: BookingType;\n  itemId: string;\n  itemName: string;\n  unitPrice: number;\n  currency: string;\n  /** For PROPERTY bookings, the number of nights to calculate price */\n  nights?: number;\n  /** For EVENT bookings, the event date (ISO string) */\n  eventDate?: string;\n};\n\n/** Frosted glass booking panel with type-specific inputs and real createGgnomadBooking mutation. */\nexport function BookingPanel({\n  bookingType,\n  itemId,\n  itemName,\n  unitPrice,\n  currency,\n  nights,\n  eventDate,\n}: BookingPanelProps) {\n  const { t } = useI18n();\n  const navigate = useNavigate();\n  const { basePath = '/' } = useGGNomad();\n\n  // For properties: check-in and check-out dates\n  // For events/tours/activities: a single date\n  const [selectedDate, setSelectedDate] = useState<string>('');\n  const [checkInDate, setCheckInDate] = useState<string>('');\n  const [checkOutDate, setCheckOutDate] = useState<string>('');\n\n  // Quantity: guests (property), participants (tour/activity), tickets (event)\n  const [quantity, setQuantity] = useState(1);\n\n  type BookingInput = {\n    bookingType: BookingType;\n    itemId: string;\n    itemName: string;\n    guestName: string;\n    guestEmail: string;\n    guests: number;\n    totalPrice: number;\n    currency: string;\n    paymentMethod: string;\n    checkIn?: string;\n    checkOut?: string;\n    eventDate?: string;\n  };\n\n  const [createBooking, { loading: creating }] = useMutation(\n    CREATE_GGNOMAD_BOOKING_MUTATION as TypedDocumentNode<\n      { createGgnomadBooking: { id: string; referenceCode: string; itemName: string } },\n      { input: BookingInput }\n    >\n  );\n\n  // Calculate total: for properties, multiply by nights; for others, multiply by quantity\n  const multiplier = bookingType === 'PROPERTY' && nights ? nights : quantity;\n  const subtotal = unitPrice * multiplier;\n  const taxAmount = subtotal * 0.1; // 10% tax\n  const total = subtotal + taxAmount;\n\n  const handleBooking = async () => {\n    // Validate required fields\n    if (bookingType === 'PROPERTY') {\n      if (!checkInDate || !checkOutDate) {\n        notify.warning(\n          t('ggnomad.booking.validation.missingDates', 'Missing dates'),\n          t(\n            'ggnomad.booking.validation.propertyDatesRequired',\n            'Please select both check-in and check-out dates.'\n          )\n        );\n        return;\n      }\n    } else if (bookingType === 'EVENT') {\n      if (!eventDate) {\n        notify.warning(\n          t('ggnomad.booking.validation.missingDate', 'Missing date'),\n          t('ggnomad.booking.validation.eventDateRequired', 'Event date is required for booking.')\n        );\n        return;\n      }\n    } else {\n      if (!selectedDate) {\n        notify.warning(\n          t('ggnomad.booking.validation.missingDate', 'Missing date'),\n          t('ggnomad.booking.validation.dateRequired', 'Please select a date for your booking.')\n        );\n        return;\n      }\n    }\n\n    try {\n      const baseInput = {\n        bookingType,\n        itemId,\n        itemName,\n        guestName: t('ggnomad.booking.defaultGuestName', 'Demo Guest'),\n        guestEmail: 'demo@burdenoff.com',\n        guests: quantity,\n        totalPrice: Math.round(total * 100) / 100,\n        currency,\n        paymentMethod: 'card',\n      };\n\n      const input: BookingInput =\n        bookingType === 'PROPERTY'\n          ? { ...baseInput, checkIn: checkInDate, checkOut: checkOutDate }\n          : bookingType === 'EVENT'\n            ? { ...baseInput, eventDate: eventDate }\n            : { ...baseInput, eventDate: selectedDate };\n\n      const result = await createBooking({\n        variables: { input },\n      });\n\n      if (result.error) {\n        notify.error(\n          t('ggnomad.booking.toast.createErrorTitle', 'Could not create booking'),\n          result.error.message\n        );\n        return;\n      }\n\n      const created = result.data?.createGgnomadBooking;\n      notify.success(\n        t('ggnomad.booking.toast.createSuccessTitle', 'Booking confirmed'),\n        created\n          ? t('ggnomad.booking.toast.createSuccessBody', '{{ref}} · {{item}}')\n              .replace('{{ref}}', created.referenceCode)\n              .replace('{{item}}', created.itemName)\n          : itemName\n      );\n\n      // Navigate to bookings list\n      navigate(joinPath(basePath, 'bookings'));\n    } catch (err) {\n      notify.error(\n        t('ggnomad.booking.toast.createErrorTitle', 'Could not create booking'),\n        err instanceof Error ? err.message : String(err)\n      );\n    }\n  };\n\n  const labelClass = 'text-sm font-medium text-text-primary';\n  const inputClass = 'w-full';\n\n  return (\n    <GlassCard treatment=\"glass\" glow className=\"border-border-seam p-5 sticky top-6\">\n      <h2 className=\"mb-4 text-lg font-medium tracking-tight text-text-primary\">\n        {bookingType === 'PROPERTY'\n          ? t('ggnomad.booking.title.property', 'Book this stay')\n          : bookingType === 'EVENT'\n            ? t('ggnomad.booking.title.event', 'Book tickets')\n            : bookingType === 'TOUR'\n              ? t('ggnomad.booking.title.tour', 'Book this tour')\n              : t('ggnomad.booking.title.activity', 'Book this activity')}\n      </h2>\n\n      <div className=\"space-y-4 mb-6\">\n        {/* Dates section */}\n        {bookingType === 'PROPERTY' ? (\n          <>\n            <div>\n              <label htmlFor=\"check-in\" className={labelClass}>\n                {t('ggnomad.booking.checkIn', 'Check-in')}\n              </label>\n              <Input\n                id=\"check-in\"\n                type=\"date\"\n                value={checkInDate}\n                onChange={(e) => setCheckInDate(e.target.value)}\n                className={cn(inputClass, 'mt-2')}\n                aria-label={t('ggnomad.booking.checkIn', 'Check-in')}\n              />\n            </div>\n            <div>\n              <label htmlFor=\"check-out\" className={labelClass}>\n                {t('ggnomad.booking.checkOut', 'Check-out')}\n              </label>\n              <Input\n                id=\"check-out\"\n                type=\"date\"\n                value={checkOutDate}\n                onChange={(e) => setCheckOutDate(e.target.value)}\n                className={cn(inputClass, 'mt-2')}\n                aria-label={t('ggnomad.booking.checkOut', 'Check-out')}\n              />\n            </div>\n          </>\n        ) : bookingType === 'EVENT' ? (\n          <div>\n            <label htmlFor=\"event-date\" className={labelClass}>\n              {t('ggnomad.booking.date', 'Date')}\n            </label>\n            <Input\n              id=\"event-date\"\n              type=\"date\"\n              value={eventDate ? eventDate.split('T')[0] : ''}\n              disabled\n              className={cn(inputClass, 'mt-2')}\n              aria-label={t('ggnomad.booking.date', 'Date')}\n            />\n          </div>\n        ) : (\n          <div>\n            <label htmlFor=\"booking-date\" className={labelClass}>\n              {t('ggnomad.booking.date', 'Date')}\n            </label>\n            <Input\n              id=\"booking-date\"\n              type=\"date\"\n              value={selectedDate}\n              onChange={(e) => setSelectedDate(e.target.value)}\n              className={cn(inputClass, 'mt-2')}\n              aria-label={t('ggnomad.booking.date', 'Date')}\n            />\n          </div>\n        )}\n\n        {/* Quantity section */}\n        <div>\n          <label className={labelClass}>\n            {bookingType === 'PROPERTY'\n              ? t('ggnomad.booking.guests', 'Guests')\n              : bookingType === 'EVENT'\n                ? t('ggnomad.booking.tickets', 'Tickets')\n                : t('ggnomad.booking.participants', 'Participants')}\n          </label>\n          <div className=\"flex items-center gap-2 mt-2\">\n            <Button\n              variant=\"outline\"\n              size=\"sm\"\n              onClick={() => setQuantity(Math.max(1, quantity - 1))}\n              disabled={quantity <= 1 || creating}\n              aria-label={t('ggnomad.booking.decreaseQuantity', 'Decrease quantity')}\n              className=\"flex-shrink-0\"\n            >\n              <Minus className=\"size-4\" />\n            </Button>\n            <input\n              type=\"number\"\n              min={1}\n              value={quantity}\n              onChange={(e) => setQuantity(Math.max(1, parseInt(e.target.value) || 1))}\n              className=\"flex-1 h-9 rounded-input border border-border-default bg-bg-surface px-3 py-1 text-center text-sm text-text-primary\"\n              aria-label={\n                bookingType === 'PROPERTY'\n                  ? t('ggnomad.booking.guests', 'Guests')\n                  : bookingType === 'EVENT'\n                    ? t('ggnomad.booking.tickets', 'Tickets')\n                    : t('ggnomad.booking.participants', 'Participants')\n              }\n            />\n            <Button\n              variant=\"outline\"\n              size=\"sm\"\n              onClick={() => setQuantity(quantity + 1)}\n              disabled={creating}\n              aria-label={t('ggnomad.booking.increaseQuantity', 'Increase quantity')}\n              className=\"flex-shrink-0\"\n            >\n              <Plus className=\"size-4\" />\n            </Button>\n          </div>\n        </div>\n      </div>\n\n      {/* Pricing breakdown */}\n      <div className=\"space-y-2 mb-6 p-3 rounded-md bg-bg-sunken\">\n        <div className=\"flex justify-between text-sm\">\n          <span className=\"text-text-secondary\">\n            {currency} {unitPrice.toFixed(2)} ×{' '}\n            {bookingType === 'PROPERTY'\n              ? `${nights ?? 1} ${t('ggnomad.booking.nights', 'nights')}`\n              : `${quantity} ${t('ggnomad.booking.item', 'item')}`}\n          </span>\n          <span className=\"text-text-primary font-medium\">\n            {currency} {subtotal.toFixed(2)}\n          </span>\n        </div>\n        <div className=\"flex justify-between text-sm\">\n          <span className=\"text-text-secondary\">{t('ggnomad.booking.tax', 'Tax (10%)')}</span>\n          <span className=\"text-text-primary\">\n            {currency} {taxAmount.toFixed(2)}\n          </span>\n        </div>\n        <div className=\"border-t border-border-seam pt-2 flex justify-between\">\n          <span className=\"font-semibold text-text-primary\">\n            {t('ggnomad.booking.total', 'Total')}\n          </span>\n          <span className=\"font-bold text-lg text-text-primary\">\n            {currency} {total.toFixed(2)}\n          </span>\n        </div>\n      </div>\n\n      {/* Book button */}\n      <Button\n        onClick={() => void handleBooking()}\n        disabled={creating}\n        className=\"w-full bg-gradient-to-r from-action-primary-bg to-action-success-bg text-white font-semibold\"\n        size=\"lg\"\n      >\n        {creating\n          ? t('ggnomad.booking.button.creating', 'Creating booking…')\n          : bookingType === 'PROPERTY'\n            ? t('ggnomad.booking.button.property', 'Book this stay')\n            : bookingType === 'EVENT'\n              ? t('ggnomad.booking.button.event', 'Book tickets')\n              : bookingType === 'TOUR'\n                ? t('ggnomad.booking.button.tour', 'Book this tour')\n                : t('ggnomad.booking.button.activity', 'Book this activity')}\n      </Button>\n    </GlassCard>\n  );\n}\n"],"mappings":"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"}

package/dist/ggnomad/components/DetailHero.js

@@ -0,0 +1,22 @@
+import { cn as e } from "../utils/cn.js";
+import { jsx as t, jsxs as n } from "react/jsx-runtime";
+//#region src/ggnomad/components/DetailHero.tsx
+function r({ image: r, alt: i, className: a }) {
+	return /* @__PURE__ */ n("div", {
+		className: e("relative mb-5 aspect-[21/9] w-full overflow-hidden rounded-card border border-border-seam", a),
+		children: [r ? /* @__PURE__ */ t("img", {
+			src: r,
+			alt: i ?? "",
+			loading: "eager",
+			decoding: "async",
+			className: "size-full object-cover"
+		}) : /* @__PURE__ */ t("div", {
+			"aria-hidden": "true",
+			className: "size-full bg-gradient-to-br from-action-primary-bg/30 via-bg-sunken to-bg-sunken"
+		}), /* @__PURE__ */ t("div", { className: "pointer-events-none absolute inset-0 bg-gradient-to-t from-black/50 via-transparent to-transparent" })]
+	});
+}
+//#endregion
+export { r as DetailHero };
+
+//# sourceMappingURL=DetailHero.js.map

package/dist/ggnomad/components/DetailHero.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DetailHero.js","names":[],"sources":["../../../src/ggnomad/components/DetailHero.tsx"],"sourcesContent":["import { cn } from '../utils/cn';\n\ninterface DetailHeroProps {\n  /** Primary cover image URL; a branded gradient is shown when absent. */\n  image?: string | null;\n  alt?: string;\n  className?: string;\n}\n\n/**\n * Full-width hero cover for a listing detail page — a 21:9 photo with a bottom\n * gradient scrim, or a branded gradient fallback when the listing has no media.\n */\nexport function DetailHero({ image, alt, className }: DetailHeroProps) {\n  return (\n    <div\n      className={cn(\n        'relative mb-5 aspect-[21/9] w-full overflow-hidden rounded-card border border-border-seam',\n        className\n      )}\n    >\n      {image ? (\n        <img\n          src={image}\n          alt={alt ?? ''}\n          loading=\"eager\"\n          decoding=\"async\"\n          className=\"size-full object-cover\"\n        />\n      ) : (\n        <div\n          aria-hidden=\"true\"\n          className=\"size-full bg-gradient-to-br from-action-primary-bg/30 via-bg-sunken to-bg-sunken\"\n        />\n      )}\n      <div className=\"pointer-events-none absolute inset-0 bg-gradient-to-t from-black/50 via-transparent to-transparent\" />\n    </div>\n  );\n}\n"],"mappings":";;;AAaA,SAAgB,EAAW,EAAE,UAAO,QAAK,gBAA8B;AACrE,QACE,kBAAC,OAAD;EACE,WAAW,EACT,6FACA,EACD;YAJH,CAMG,IACC,kBAAC,OAAD;GACE,KAAK;GACL,KAAK,KAAO;GACZ,SAAQ;GACR,UAAS;GACT,WAAU;GACV,CAAA,GAEF,kBAAC,OAAD;GACE,eAAY;GACZ,WAAU;GACV,CAAA,EAEJ,kBAAC,OAAD,EAAK,WAAU,sGAAuG,CAAA,CAClH"}

package/dist/ggnomad/components/EntityCard.js

@@ -3,22 +3,36 @@ import { Link as t } from "react-router-dom";
 import { GlassCard as n } from "@burdenoff/fe-libs/ui";
 import { Fragment as r, jsx as i, jsxs as a } from "react/jsx-runtime";
 //#region src/ggnomad/components/EntityCard.tsx
-function o({ title: o, meta: s, price: c, badge: l, footer: u, to: d, className: f }) {
-	let p = /* @__PURE__ */ a(r, { children: [
+function o({ title: o, meta: s, price: c, badge: l, footer: u, image: d, imageAlt: f, to: p, className: m }) {
+	let h = /* @__PURE__ */ a(r, { children: [
 		/* @__PURE__ */ a("div", {
-			className: "flex items-start justify-between gap-3",
-			children: [/* @__PURE__ */ a("div", {
-				className: "min-w-0",
-				children: [/* @__PURE__ */ i("p", {
-					className: "truncate font-medium text-text-primary",
-					children: o
-				}), s ? /* @__PURE__ */ i("p", {
-					className: "mt-0.5 text-sm text-text-secondary",
-					children: s
-				}) : null]
-			}), l ? /* @__PURE__ */ i("div", {
-				className: "flex-shrink-0",
-				children: l
+			className: "relative -mx-4 -mt-4 mb-3 aspect-[16/10] overflow-hidden",
+			children: [
+				d ? /* @__PURE__ */ i("img", {
+					src: d,
+					alt: f ?? "",
+					loading: "lazy",
+					decoding: "async",
+					className: "size-full object-cover transition-transform duration-300 group-hover:scale-[1.04]"
+				}) : /* @__PURE__ */ i("div", {
+					"aria-hidden": "true",
+					className: "size-full bg-gradient-to-br from-action-primary-bg/25 via-bg-sunken to-bg-sunken"
+				}),
+				/* @__PURE__ */ i("div", { className: "pointer-events-none absolute inset-0 bg-gradient-to-t from-black/45 via-transparent to-transparent" }),
+				l ? /* @__PURE__ */ i("div", {
+					className: "absolute left-2 top-2",
+					children: l
+				}) : null
+			]
+		}),
+		/* @__PURE__ */ a("div", {
+			className: "min-w-0",
+			children: [/* @__PURE__ */ i("p", {
+				className: "truncate font-medium text-text-primary",
+				children: o
+			}), s ? /* @__PURE__ */ i("p", {
+				className: "mt-0.5 text-sm text-text-secondary",
+				children: s
 			}) : null]
 		}),
 		c ? /* @__PURE__ */ i("p", {
@@ -30,18 +44,18 @@ function o({ title: o, meta: s, price: c, badge: l, footer: u, to: d, className:
 			children: u
 		}) : null
 	] });
-	return d ? /* @__PURE__ */ i(t, {
-		to: d,
-		className: "block rounded-card focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-border-focus focus-visible:ring-offset-2 focus-visible:ring-offset-bg-canvas",
+	return p ? /* @__PURE__ */ i(t, {
+		to: p,
+		className: "group block rounded-card focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-border-focus focus-visible:ring-offset-2 focus-visible:ring-offset-bg-canvas",
 		children: /* @__PURE__ */ i(n, {
 			treatment: "plain",
-			className: e("border-border-seam p-4", f),
-			children: p
+			className: e("overflow-hidden border-border-seam p-4", m),
+			children: h
 		})
 	}) : /* @__PURE__ */ i(n, {
 		treatment: "plain",
-		className: e("border-border-seam p-4", f),
-		children: p
+		className: e("group overflow-hidden border-border-seam p-4", m),
+		children: h
 	});
 }
 //#endregion

package/dist/ggnomad/components/EntityCard.js.map

@@ -1 +1 @@
-{"version":3,"file":"EntityCard.js","names":[],"sources":["../../../src/ggnomad/components/EntityCard.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport { Link } from 'react-router-dom';\nimport { GlassCard } from '@burdenoff/fe-libs/ui';\nimport { cn } from '../utils/cn';\n\ntype EntityCardProps = {\n  title: ReactNode;\n  /** Optional secondary line (category / type / duration). */\n  meta?: ReactNode;\n  /** Right-aligned price or primary figure. */\n  price?: ReactNode;\n  badge?: ReactNode;\n  footer?: ReactNode;\n  /** When provided, the whole card becomes a router Link. */\n  to?: string;\n  className?: string;\n};\n\n/**\n * A calm, low-contrast tile for an inventory item (property, tour, event,\n * provider). Hover only lifts the shadow / seam — never moves. When `to` is set\n * the entire surface is a single accessible link.\n */\nexport function EntityCard({ title, meta, price, badge, footer, to, className }: EntityCardProps) {\n  const body = (\n    <>\n      <div className=\"flex items-start justify-between gap-3\">\n        <div className=\"min-w-0\">\n          <p className=\"truncate font-medium text-text-primary\">{title}</p>\n          {meta ? <p className=\"mt-0.5 text-sm text-text-secondary\">{meta}</p> : null}\n        </div>\n        {badge ? <div className=\"flex-shrink-0\">{badge}</div> : null}\n      </div>\n      {price ? (\n        <p className=\"mt-2 text-sm font-medium tabular-nums text-text-primary\">{price}</p>\n      ) : null}\n      {footer ? <div className=\"mt-2 text-sm text-text-secondary\">{footer}</div> : null}\n    </>\n  );\n\n  if (to) {\n    return (\n      <Link\n        to={to}\n        className=\"block rounded-card focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-border-focus focus-visible:ring-offset-2 focus-visible:ring-offset-bg-canvas\"\n      >\n        <GlassCard treatment=\"plain\" className={cn('border-border-seam p-4', className)}>\n          {body}\n        </GlassCard>\n      </Link>\n    );\n  }\n\n  return (\n    <GlassCard treatment=\"plain\" className={cn('border-border-seam p-4', className)}>\n      {body}\n    </GlassCard>\n  );\n}\n"],"mappings":";;;;;AAuBA,SAAgB,EAAW,EAAE,UAAO,SAAM,UAAO,UAAO,WAAQ,OAAI,gBAA8B;CAChG,IAAM,IACJ,kBAAA,GAAA,EAAA,UAAA;EACE,kBAAC,OAAD;GAAK,WAAU;aAAf,CACE,kBAAC,OAAD;IAAK,WAAU;cAAf,CACE,kBAAC,KAAD;KAAG,WAAU;eAA0C;KAAU,CAAA,EAChE,IAAO,kBAAC,KAAD;KAAG,WAAU;eAAsC;KAAS,CAAA,GAAG,KACnE;OACL,IAAQ,kBAAC,OAAD;IAAK,WAAU;cAAiB;IAAY,CAAA,GAAG,KACpD;;EACL,IACC,kBAAC,KAAD;GAAG,WAAU;aAA2D;GAAU,CAAA,GAChF;EACH,IAAS,kBAAC,OAAD;GAAK,WAAU;aAAoC;GAAa,CAAA,GAAG;EAC5E,EAAA,CAAA;AAgBL,QAbI,IAEA,kBAAC,GAAD;EACM;EACJ,WAAU;YAEV,kBAAC,GAAD;GAAW,WAAU;GAAQ,WAAW,EAAG,0BAA0B,EAAU;aAC5E;GACS,CAAA;EACP,CAAA,GAKT,kBAAC,GAAD;EAAW,WAAU;EAAQ,WAAW,EAAG,0BAA0B,EAAU;YAC5E;EACS,CAAA"}
+{"version":3,"file":"EntityCard.js","names":[],"sources":["../../../src/ggnomad/components/EntityCard.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport { Link } from 'react-router-dom';\nimport { GlassCard } from '@burdenoff/fe-libs/ui';\nimport { cn } from '../utils/cn';\n\ntype EntityCardProps = {\n  title: ReactNode;\n  /** Optional secondary line (category / type / duration). */\n  meta?: ReactNode;\n  /** Right-aligned price or primary figure. */\n  price?: ReactNode;\n  badge?: ReactNode;\n  footer?: ReactNode;\n  /** Optional cover photo URL. Falls back to a branded gradient tile. */\n  image?: string | null;\n  /** Accessible description for the cover photo. */\n  imageAlt?: string;\n  /** When provided, the whole card becomes a router Link. */\n  to?: string;\n  className?: string;\n};\n\n/**\n * An inventory tile for a property / tour / event / activity / provider. When an\n * `image` is supplied it renders a 16:10 cover photo (with a branded gradient\n * fallback otherwise) above the title / meta / price. Hover lifts the shadow and\n * gently zooms the photo. When `to` is set the whole surface is one accessible link.\n */\nexport function EntityCard({\n  title,\n  meta,\n  price,\n  badge,\n  footer,\n  image,\n  imageAlt,\n  to,\n  className,\n}: EntityCardProps) {\n  const cover = (\n    <div className=\"relative -mx-4 -mt-4 mb-3 aspect-[16/10] overflow-hidden\">\n      {image ? (\n        <img\n          src={image}\n          alt={imageAlt ?? ''}\n          loading=\"lazy\"\n          decoding=\"async\"\n          className=\"size-full object-cover transition-transform duration-300 group-hover:scale-[1.04]\"\n        />\n      ) : (\n        <div\n          aria-hidden=\"true\"\n          className=\"size-full bg-gradient-to-br from-action-primary-bg/25 via-bg-sunken to-bg-sunken\"\n        />\n      )}\n      <div className=\"pointer-events-none absolute inset-0 bg-gradient-to-t from-black/45 via-transparent to-transparent\" />\n      {badge ? <div className=\"absolute left-2 top-2\">{badge}</div> : null}\n    </div>\n  );\n\n  const body = (\n    <>\n      {cover}\n      <div className=\"min-w-0\">\n        <p className=\"truncate font-medium text-text-primary\">{title}</p>\n        {meta ? <p className=\"mt-0.5 text-sm text-text-secondary\">{meta}</p> : null}\n      </div>\n      {price ? (\n        <p className=\"mt-2 text-sm font-medium tabular-nums text-text-primary\">{price}</p>\n      ) : null}\n      {footer ? <div className=\"mt-2 text-sm text-text-secondary\">{footer}</div> : null}\n    </>\n  );\n\n  if (to) {\n    return (\n      <Link\n        to={to}\n        className=\"group block rounded-card focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-border-focus focus-visible:ring-offset-2 focus-visible:ring-offset-bg-canvas\"\n      >\n        <GlassCard\n          treatment=\"plain\"\n          className={cn('overflow-hidden border-border-seam p-4', className)}\n        >\n          {body}\n        </GlassCard>\n      </Link>\n    );\n  }\n\n  return (\n    <GlassCard\n      treatment=\"plain\"\n      className={cn('group overflow-hidden border-border-seam p-4', className)}\n    >\n      {body}\n    </GlassCard>\n  );\n}\n"],"mappings":";;;;;AA4BA,SAAgB,EAAW,EACzB,UACA,SACA,UACA,UACA,WACA,UACA,aACA,OACA,gBACkB;CAsBlB,IAAM,IACJ,kBAAA,GAAA,EAAA,UAAA;EArBA,kBAAC,OAAD;GAAK,WAAU;aAAf;IACG,IACC,kBAAC,OAAD;KACE,KAAK;KACL,KAAK,KAAY;KACjB,SAAQ;KACR,UAAS;KACT,WAAU;KACV,CAAA,GAEF,kBAAC,OAAD;KACE,eAAY;KACZ,WAAU;KACV,CAAA;IAEJ,kBAAC,OAAD,EAAK,WAAU,sGAAuG,CAAA;IACrH,IAAQ,kBAAC,OAAD;KAAK,WAAU;eAAyB;KAAY,CAAA,GAAG;IAC5D;;EAMJ,kBAAC,OAAD;GAAK,WAAU;aAAf,CACE,kBAAC,KAAD;IAAG,WAAU;cAA0C;IAAU,CAAA,EAChE,IAAO,kBAAC,KAAD;IAAG,WAAU;cAAsC;IAAS,CAAA,GAAG,KACnE;;EACL,IACC,kBAAC,KAAD;GAAG,WAAU;aAA2D;GAAU,CAAA,GAChF;EACH,IAAS,kBAAC,OAAD;GAAK,WAAU;aAAoC;GAAa,CAAA,GAAG;EAC5E,EAAA,CAAA;AAmBL,QAhBI,IAEA,kBAAC,GAAD;EACM;EACJ,WAAU;YAEV,kBAAC,GAAD;GACE,WAAU;GACV,WAAW,EAAG,0CAA0C,EAAU;aAEjE;GACS,CAAA;EACP,CAAA,GAKT,kBAAC,GAAD;EACE,WAAU;EACV,WAAW,EAAG,gDAAgD,EAAU;YAEvE;EACS,CAAA"}

package/dist/ggnomad/components/index.js

@@ -4,3 +4,5 @@ import "./SectionCard.js";
 import "./EntityCard.js";
 import "./DetailRow.js";
 import "./LoadMoreButton.js";
+import "./DetailHero.js";
+import "./BookingPanel.js";

package/dist/ggnomad/graphql.js

@@ -123,7 +123,18 @@ var t = e`
       }
     }
   }
-`, s = e`
+`;
+e`
+  query GGNomadPropertyForBooking($id: ID!) {
+    ggnomadProperty(id: $id) {
+      id
+      name
+      pricePerNight
+      currency
+    }
+  }
+`;
+var s = e`
   query GGNomadTours($first: Int, $skip: Int) {
     ggnomadTours(pagination: { first: $first, skip: $skip }) {
       id

package/dist/ggnomad/graphql.js.map

@@ -1 +1 @@
-{"version":3,"file":"graphql.js","names":[],"sources":["../../src/ggnomad/graphql.ts"],"sourcesContent":["import { gql } from '@apollo/client/core';\n\nexport const GGNOMAD_OVERVIEW_QUERY = gql`\n  query GGNomadOverview {\n    ggnomadOverviewStats {\n      users\n      listings\n      bookings\n      monthlyRevenue\n    }\n    ggnomadAnalytics {\n      totalRevenue\n      totalBookings\n      totalUsers\n      conversionRate\n      revenueByCategory\n    }\n  }\n`;\n\n/**\n * One bookable item of each type (properties are priced per night, the rest\n * carry a flat price). Used to seed the Bookings \"create demo booking\" action\n * with a REAL listing id so the mutation passes the backend's\n * assertTargetInWorkspace check instead of failing on a synthetic id.\n */\nexport const GGNOMAD_BOOKABLE_SAMPLE_QUERY = gql`\n  query GGNomadBookableSample {\n    ggnomadProperties(pagination: { first: 1, skip: 0 }) {\n      id\n      name\n      pricePerNight\n      currency\n    }\n    ggnomadTours(pagination: { first: 1, skip: 0 }) {\n      id\n      name\n      price\n      currency\n    }\n    ggnomadEvents(pagination: { first: 1, skip: 0 }) {\n      id\n      name\n      price\n      currency\n    }\n    ggnomadActivities(pagination: { first: 1, skip: 0 }) {\n      id\n      name\n      price\n      currency\n    }\n  }\n`;\n\n/**\n * id + name for every favouritable listing type, used to (a) resolve the real\n * entity name for a saved favorite (which the backend only exposes as\n * targetType + targetId) and (b) seed the \"toggle demo favorite\" action with a\n * real target id.\n */\nexport const GGNOMAD_FAVORITE_TARGETS_QUERY = gql`\n  query GGNomadFavoriteTargets {\n    ggnomadProperties(pagination: { first: 100, skip: 0 }) {\n      id\n      name\n    }\n    ggnomadTours(pagination: { first: 100, skip: 0 }) {\n      id\n      name\n    }\n    ggnomadEvents(pagination: { first: 100, skip: 0 }) {\n      id\n      name\n    }\n    ggnomadActivities(pagination: { first: 100, skip: 0 }) {\n      id\n      name\n    }\n  }\n`;\n\nexport const GGNOMAD_PROVIDERS_QUERY = gql`\n  query GGNomadProviders($first: Int, $skip: Int) {\n    ggnomadProviders(pagination: { first: $first, skip: $skip }) {\n      id\n      name\n      type\n      status\n      listingCount\n      totalRevenue\n      rating\n      reviewCount\n      contactEmail\n      website\n    }\n  }\n`;\n\nexport const GGNOMAD_PROPERTIES_QUERY = gql`\n  query GGNomadProperties($first: Int, $skip: Int) {\n    ggnomadProperties(pagination: { first: $first, skip: $skip }) {\n      id\n      name\n      type\n      status\n      description\n      pricePerNight\n      currency\n      rating\n      reviewCount\n      maxGuests\n      amenities\n      images\n      providerId\n    }\n  }\n`;\n\nexport const GGNOMAD_PROPERTY_QUERY = gql`\n  query GGNomadProperty($id: ID!) {\n    ggnomadProperty(id: $id) {\n      id\n      name\n      type\n      status\n      description\n      address\n      pricePerNight\n      currency\n      rating\n      reviewCount\n      bedrooms\n      bathrooms\n      maxGuests\n      checkInTime\n      checkOutTime\n      amenities\n      images\n      provider {\n        id\n        name\n        type\n        rating\n      }\n    }\n  }\n`;\n\nexport const GGNOMAD_TOURS_QUERY = gql`\n  query GGNomadTours($first: Int, $skip: Int) {\n    ggnomadTours(pagination: { first: $first, skip: $skip }) {\n      id\n      name\n      description\n      type\n      status\n      duration\n      difficulty\n      price\n      currency\n      rating\n      reviewCount\n      highlights\n      images\n    }\n  }\n`;\n\nexport const GGNOMAD_TOUR_QUERY = gql`\n  query GGNomadTour($id: ID!) {\n    ggnomadTour(id: $id) {\n      id\n      name\n      description\n      type\n      status\n      duration\n      difficulty\n      price\n      currency\n      rating\n      reviewCount\n      highlights\n      images\n      languages\n      guideName\n      provider {\n        id\n        name\n      }\n    }\n  }\n`;\n\nexport const GGNOMAD_EVENTS_QUERY = gql`\n  query GGNomadEvents($first: Int, $skip: Int) {\n    ggnomadEvents(pagination: { first: $first, skip: $skip }) {\n      id\n      name\n      description\n      category\n      status\n      startsAt\n      price\n      currency\n      rating\n      reviewCount\n      performers\n      images\n    }\n  }\n`;\n\nexport const GGNOMAD_EVENT_QUERY = gql`\n  query GGNomadEvent($id: ID!) {\n    ggnomadEvent(id: $id) {\n      id\n      name\n      description\n      category\n      status\n      startsAt\n      endsAt\n      venue\n      price\n      currency\n      rating\n      reviewCount\n      performers\n      images\n      provider {\n        id\n        name\n      }\n    }\n  }\n`;\n\nexport const GGNOMAD_ACTIVITIES_QUERY = gql`\n  query GGNomadActivities($first: Int, $skip: Int) {\n    ggnomadActivities(pagination: { first: $first, skip: $skip }) {\n      id\n      name\n      description\n      category\n      status\n      duration\n      difficulty\n      price\n      currency\n      rating\n      reviewCount\n      maxParticipants\n      includes\n      requirements\n      images\n    }\n  }\n`;\n\nexport const GGNOMAD_ACTIVITY_QUERY = gql`\n  query GGNomadActivity($id: ID!) {\n    ggnomadActivity(id: $id) {\n      id\n      name\n      description\n      category\n      status\n      location\n      duration\n      difficulty\n      price\n      currency\n      rating\n      reviewCount\n      maxParticipants\n      includes\n      requirements\n      safetyInfo\n      images\n      provider {\n        id\n        name\n      }\n    }\n  }\n`;\n\nexport const GGNOMAD_TRIPS_QUERY = gql`\n  query GGNomadTrips($first: Int, $skip: Int) {\n    ggnomadTrips(pagination: { first: $first, skip: $skip }) {\n      id\n      name\n      transportMode\n      status\n      origin\n      destination\n      departureAt\n      arrivalAt\n      isRoundTrip\n      carrier\n      class\n      price\n      currency\n      passengers\n      ecoFriendly\n    }\n  }\n`;\n\nexport const GGNOMAD_BOOKINGS_QUERY = gql`\n  query GGNomadBookings($first: Int, $skip: Int) {\n    ggnomadBookings(pagination: { first: $first, skip: $skip }) {\n      id\n      referenceCode\n      bookingType\n      status\n      itemId\n      itemName\n      guestName\n      guestEmail\n      guestPhone\n      guests\n      checkIn\n      checkOut\n      eventDate\n      totalPrice\n      currency\n      paymentStatus\n      paymentMethod\n      specialRequests\n      createdAt\n    }\n  }\n`;\n\nexport const GGNOMAD_FAVORITES_QUERY = gql`\n  query GGNomadFavorites {\n    ggnomadFavorites\n  }\n`;\n\nexport const CREATE_GGNOMAD_BOOKING_MUTATION = gql`\n  mutation CreateGGNomadBooking($input: CreateGgnomadBookingInput!) {\n    createGgnomadBooking(input: $input) {\n      id\n      referenceCode\n      bookingType\n      status\n      itemId\n      itemName\n      guestName\n      totalPrice\n      currency\n      createdAt\n    }\n  }\n`;\n\nexport const TOGGLE_GGNOMAD_FAVORITE_MUTATION = gql`\n  mutation ToggleGGNomadFavorite($input: ToggleGgnomadFavoriteInput!) {\n    toggleGgnomadFavorite(input: $input)\n  }\n`;\n\nexport const CANCEL_GGNOMAD_BOOKING_MUTATION = gql`\n  mutation CancelGGNomadBooking($id: ID!, $reason: String) {\n    cancelGgnomadBooking(id: $id, reason: $reason) {\n      id\n      status\n    }\n  }\n`;\n"],"mappings":";;AAEA,IAAa,IAAyB,CAAG;;;;;;;;;;;;;;;;GAwB5B,IAAgC,CAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmCnC,IAAiC,CAAG;;;;;;;;;;;;;;;;;;;GAqBpC,IAA0B,CAAG;;;;;;;;;;;;;;;GAiB7B,IAA2B,CAAG;;;;;;;;;;;;;;;;;;GAoB9B,IAAyB,CAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8B5B,IAAsB,CAAG;;;;;;;;;;;;;;;;;;GAoBzB,IAAqB,CAAG;;;;;;;;;;;;;;;;;;;;;;;;GA0BxB,IAAuB,CAAG;;;;;;;;;;;;;;;;;GAmB1B,IAAsB,CAAG;;;;;;;;;;;;;;;;;;;;;;;GAyBzB,IAA2B,CAAG;;;;;;;;;;;;;;;;;;;;GAsB9B,IAAyB,CAAG;;;;;;;;;;;;;;;;;;;;;;;;;;GA4B5B,IAAsB,CAAG;;;;;;;;;;;;;;;;;;;;GAsBzB,IAAyB,CAAG;;;;;;;;;;;;;;;;;;;;;;;;GA0B5B,IAA0B,CAAG;;;;GAM7B,IAAkC,CAAG;;;;;;;;;;;;;;;GAiBrC,IAAmC,CAAG;;;;GAMtC,IAAkC,CAAG"}
+{"version":3,"file":"graphql.js","names":[],"sources":["../../src/ggnomad/graphql.ts"],"sourcesContent":["import { gql } from '@apollo/client/core';\n\nexport const GGNOMAD_OVERVIEW_QUERY = gql`\n  query GGNomadOverview {\n    ggnomadOverviewStats {\n      users\n      listings\n      bookings\n      monthlyRevenue\n    }\n    ggnomadAnalytics {\n      totalRevenue\n      totalBookings\n      totalUsers\n      conversionRate\n      revenueByCategory\n    }\n  }\n`;\n\n/**\n * One bookable item of each type (properties are priced per night, the rest\n * carry a flat price). Used to seed the Bookings \"create demo booking\" action\n * with a REAL listing id so the mutation passes the backend's\n * assertTargetInWorkspace check instead of failing on a synthetic id.\n */\nexport const GGNOMAD_BOOKABLE_SAMPLE_QUERY = gql`\n  query GGNomadBookableSample {\n    ggnomadProperties(pagination: { first: 1, skip: 0 }) {\n      id\n      name\n      pricePerNight\n      currency\n    }\n    ggnomadTours(pagination: { first: 1, skip: 0 }) {\n      id\n      name\n      price\n      currency\n    }\n    ggnomadEvents(pagination: { first: 1, skip: 0 }) {\n      id\n      name\n      price\n      currency\n    }\n    ggnomadActivities(pagination: { first: 1, skip: 0 }) {\n      id\n      name\n      price\n      currency\n    }\n  }\n`;\n\n/**\n * id + name for every favouritable listing type, used to (a) resolve the real\n * entity name for a saved favorite (which the backend only exposes as\n * targetType + targetId) and (b) seed the \"toggle demo favorite\" action with a\n * real target id.\n */\nexport const GGNOMAD_FAVORITE_TARGETS_QUERY = gql`\n  query GGNomadFavoriteTargets {\n    ggnomadProperties(pagination: { first: 100, skip: 0 }) {\n      id\n      name\n    }\n    ggnomadTours(pagination: { first: 100, skip: 0 }) {\n      id\n      name\n    }\n    ggnomadEvents(pagination: { first: 100, skip: 0 }) {\n      id\n      name\n    }\n    ggnomadActivities(pagination: { first: 100, skip: 0 }) {\n      id\n      name\n    }\n  }\n`;\n\nexport const GGNOMAD_PROVIDERS_QUERY = gql`\n  query GGNomadProviders($first: Int, $skip: Int) {\n    ggnomadProviders(pagination: { first: $first, skip: $skip }) {\n      id\n      name\n      type\n      status\n      listingCount\n      totalRevenue\n      rating\n      reviewCount\n      contactEmail\n      website\n    }\n  }\n`;\n\nexport const GGNOMAD_PROPERTIES_QUERY = gql`\n  query GGNomadProperties($first: Int, $skip: Int) {\n    ggnomadProperties(pagination: { first: $first, skip: $skip }) {\n      id\n      name\n      type\n      status\n      description\n      pricePerNight\n      currency\n      rating\n      reviewCount\n      maxGuests\n      amenities\n      images\n      providerId\n    }\n  }\n`;\n\nexport const GGNOMAD_PROPERTY_QUERY = gql`\n  query GGNomadProperty($id: ID!) {\n    ggnomadProperty(id: $id) {\n      id\n      name\n      type\n      status\n      description\n      address\n      pricePerNight\n      currency\n      rating\n      reviewCount\n      bedrooms\n      bathrooms\n      maxGuests\n      checkInTime\n      checkOutTime\n      amenities\n      images\n      provider {\n        id\n        name\n        type\n        rating\n      }\n    }\n  }\n`;\n\n// Query to get property details for booking - ensures id is included\nexport const GGNOMAD_PROPERTY_FOR_BOOKING_QUERY = gql`\n  query GGNomadPropertyForBooking($id: ID!) {\n    ggnomadProperty(id: $id) {\n      id\n      name\n      pricePerNight\n      currency\n    }\n  }\n`;\n\nexport const GGNOMAD_TOURS_QUERY = gql`\n  query GGNomadTours($first: Int, $skip: Int) {\n    ggnomadTours(pagination: { first: $first, skip: $skip }) {\n      id\n      name\n      description\n      type\n      status\n      duration\n      difficulty\n      price\n      currency\n      rating\n      reviewCount\n      highlights\n      images\n    }\n  }\n`;\n\nexport const GGNOMAD_TOUR_QUERY = gql`\n  query GGNomadTour($id: ID!) {\n    ggnomadTour(id: $id) {\n      id\n      name\n      description\n      type\n      status\n      duration\n      difficulty\n      price\n      currency\n      rating\n      reviewCount\n      highlights\n      images\n      languages\n      guideName\n      provider {\n        id\n        name\n      }\n    }\n  }\n`;\n\nexport const GGNOMAD_EVENTS_QUERY = gql`\n  query GGNomadEvents($first: Int, $skip: Int) {\n    ggnomadEvents(pagination: { first: $first, skip: $skip }) {\n      id\n      name\n      description\n      category\n      status\n      startsAt\n      price\n      currency\n      rating\n      reviewCount\n      performers\n      images\n    }\n  }\n`;\n\nexport const GGNOMAD_EVENT_QUERY = gql`\n  query GGNomadEvent($id: ID!) {\n    ggnomadEvent(id: $id) {\n      id\n      name\n      description\n      category\n      status\n      startsAt\n      endsAt\n      venue\n      price\n      currency\n      rating\n      reviewCount\n      performers\n      images\n      provider {\n        id\n        name\n      }\n    }\n  }\n`;\n\nexport const GGNOMAD_ACTIVITIES_QUERY = gql`\n  query GGNomadActivities($first: Int, $skip: Int) {\n    ggnomadActivities(pagination: { first: $first, skip: $skip }) {\n      id\n      name\n      description\n      category\n      status\n      duration\n      difficulty\n      price\n      currency\n      rating\n      reviewCount\n      maxParticipants\n      includes\n      requirements\n      images\n    }\n  }\n`;\n\nexport const GGNOMAD_ACTIVITY_QUERY = gql`\n  query GGNomadActivity($id: ID!) {\n    ggnomadActivity(id: $id) {\n      id\n      name\n      description\n      category\n      status\n      location\n      duration\n      difficulty\n      price\n      currency\n      rating\n      reviewCount\n      maxParticipants\n      includes\n      requirements\n      safetyInfo\n      images\n      provider {\n        id\n        name\n      }\n    }\n  }\n`;\n\nexport const GGNOMAD_TRIPS_QUERY = gql`\n  query GGNomadTrips($first: Int, $skip: Int) {\n    ggnomadTrips(pagination: { first: $first, skip: $skip }) {\n      id\n      name\n      transportMode\n      status\n      origin\n      destination\n      departureAt\n      arrivalAt\n      isRoundTrip\n      carrier\n      class\n      price\n      currency\n      passengers\n      ecoFriendly\n    }\n  }\n`;\n\nexport const GGNOMAD_BOOKINGS_QUERY = gql`\n  query GGNomadBookings($first: Int, $skip: Int) {\n    ggnomadBookings(pagination: { first: $first, skip: $skip }) {\n      id\n      referenceCode\n      bookingType\n      status\n      itemId\n      itemName\n      guestName\n      guestEmail\n      guestPhone\n      guests\n      checkIn\n      checkOut\n      eventDate\n      totalPrice\n      currency\n      paymentStatus\n      paymentMethod\n      specialRequests\n      createdAt\n    }\n  }\n`;\n\nexport const GGNOMAD_FAVORITES_QUERY = gql`\n  query GGNomadFavorites {\n    ggnomadFavorites\n  }\n`;\n\nexport const CREATE_GGNOMAD_BOOKING_MUTATION = gql`\n  mutation CreateGGNomadBooking($input: CreateGgnomadBookingInput!) {\n    createGgnomadBooking(input: $input) {\n      id\n      referenceCode\n      bookingType\n      status\n      itemId\n      itemName\n      guestName\n      totalPrice\n      currency\n      createdAt\n    }\n  }\n`;\n\nexport const TOGGLE_GGNOMAD_FAVORITE_MUTATION = gql`\n  mutation ToggleGGNomadFavorite($input: ToggleGgnomadFavoriteInput!) {\n    toggleGgnomadFavorite(input: $input)\n  }\n`;\n\nexport const CANCEL_GGNOMAD_BOOKING_MUTATION = gql`\n  mutation CancelGGNomadBooking($id: ID!, $reason: String) {\n    cancelGgnomadBooking(id: $id, reason: $reason) {\n      id\n      status\n    }\n  }\n`;\n"],"mappings":";;AAEA,IAAa,IAAyB,CAAG;;;;;;;;;;;;;;;;GAwB5B,IAAgC,CAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmCnC,IAAiC,CAAG;;;;;;;;;;;;;;;;;;;GAqBpC,IAA0B,CAAG;;;;;;;;;;;;;;;GAiB7B,IAA2B,CAAG;;;;;;;;;;;;;;;;;;GAoB9B,IAAyB,CAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA+BS,CAAG;;;;;;;;;;AAWrD,IAAa,IAAsB,CAAG;;;;;;;;;;;;;;;;;;GAoBzB,IAAqB,CAAG;;;;;;;;;;;;;;;;;;;;;;;;GA0BxB,IAAuB,CAAG;;;;;;;;;;;;;;;;;GAmB1B,IAAsB,CAAG;;;;;;;;;;;;;;;;;;;;;;;GAyBzB,IAA2B,CAAG;;;;;;;;;;;;;;;;;;;;GAsB9B,IAAyB,CAAG;;;;;;;;;;;;;;;;;;;;;;;;;;GA4B5B,IAAsB,CAAG;;;;;;;;;;;;;;;;;;;;GAsBzB,IAAyB,CAAG;;;;;;;;;;;;;;;;;;;;;;;;GA0B5B,IAA0B,CAAG;;;;GAM7B,IAAkC,CAAG;;;;;;;;;;;;;;;GAiBrC,IAAmC,CAAG;;;;GAMtC,IAAkC,CAAG"}