@planetaexo/design-system 0.54.1 → 0.56.0

package/dist/index.d.cts

@@ -3074,6 +3074,15 @@ declare function TripPage({ title, tagline, destination, duration, images, video
 interface Category2Trip extends TripCardProps {
     /** Marca a trip como featured — sobe para o topo do grid principal. */
     featured?: boolean;
+    /**
+     * Per-group filter membership — `{ groupId: [optionId, …] }`, where the ids
+     * match the `filterGroups` option ids. A trip is kept when, for every active
+     * filter group, its ids intersect the selected option(s). Groups that no trip
+     * carries data for stay display-only (selecting them doesn't filter).
+     */
+    filterTags?: Record<string, string[]>;
+    /** Numeric price driving the price sort (the display string stays in `price`). */
+    priceValue?: number;
 }
 interface Category2BlogPost {
     title: string;
@@ -3105,8 +3114,12 @@ interface CategoryPage2Props {
         label: string;
         href?: string;
     }>;
-    /** Pass true (or a links array) to render the transparent SiteHeader over the hero. */
-    siteHeader?: boolean | SiteHeaderLink[];
+    /**
+     * Render the overlay SiteHeader inside the hero. Pass `true` for the default
+     * header, a `SiteHeaderLink[]` for custom links, or a full
+     * {@link TripSiteHeaderConfig} to wire languages + onLanguageChange.
+     */
+    siteHeader?: boolean | SiteHeaderLink[] | TripSiteHeaderConfig;
     popularTours?: Category2Trip[];
     popularToursTitle?: string;
     popularToursEyebrow?: string;

package/dist/index.d.ts

@@ -3074,6 +3074,15 @@ declare function TripPage({ title, tagline, destination, duration, images, video
 interface Category2Trip extends TripCardProps {
     /** Marca a trip como featured — sobe para o topo do grid principal. */
     featured?: boolean;
+    /**
+     * Per-group filter membership — `{ groupId: [optionId, …] }`, where the ids
+     * match the `filterGroups` option ids. A trip is kept when, for every active
+     * filter group, its ids intersect the selected option(s). Groups that no trip
+     * carries data for stay display-only (selecting them doesn't filter).
+     */
+    filterTags?: Record<string, string[]>;
+    /** Numeric price driving the price sort (the display string stays in `price`). */
+    priceValue?: number;
 }
 interface Category2BlogPost {
     title: string;
@@ -3105,8 +3114,12 @@ interface CategoryPage2Props {
         label: string;
         href?: string;
     }>;
-    /** Pass true (or a links array) to render the transparent SiteHeader over the hero. */
-    siteHeader?: boolean | SiteHeaderLink[];
+    /**
+     * Render the overlay SiteHeader inside the hero. Pass `true` for the default
+     * header, a `SiteHeaderLink[]` for custom links, or a full
+     * {@link TripSiteHeaderConfig} to wire languages + onLanguageChange.
+     */
+    siteHeader?: boolean | SiteHeaderLink[] | TripSiteHeaderConfig;
     popularTours?: Category2Trip[];
     popularToursTitle?: string;
     popularToursEyebrow?: string;

package/dist/index.js

@@ -13757,14 +13757,56 @@ function CategoryPage2({
   const [sort, setSort] = React29.useState(
     defaultSort != null ? defaultSort : (_a = sortOptions == null ? void 0 : sortOptions[0]) == null ? void 0 : _a.id
   );
-  const sortedTrips = React29.useMemo(
-    () => [...trips].sort((a, b) => {
-      const af = a.featured ? 1 : 0;
-      const bf = b.featured ? 1 : 0;
-      return bf - af;
-    }),
-    [trips]
-  );
+  const sortedTrips = React29.useMemo(() => {
+    const active = Object.entries(filterValue).filter(
+      ([, vals]) => vals && vals.length > 0
+    );
+    const filtered = active.length ? trips.filter(
+      (trip) => active.every(([groupId, selected]) => {
+        var _a2, _b;
+        const groupHasData = trips.some(
+          (t) => {
+            var _a3, _b2, _c;
+            return ((_c = (_b2 = (_a3 = t.filterTags) == null ? void 0 : _a3[groupId]) == null ? void 0 : _b2.length) != null ? _c : 0) > 0;
+          }
+        );
+        if (!groupHasData) return true;
+        const tags = (_b = (_a2 = trip.filterTags) == null ? void 0 : _a2[groupId]) != null ? _b : [];
+        return selected.some((id) => tags.includes(id));
+      })
+    ) : trips;
+    const list = [...filtered];
+    switch (sort) {
+      case "price-asc":
+        list.sort((a, b) => {
+          var _a2, _b;
+          return ((_a2 = a.priceValue) != null ? _a2 : Infinity) - ((_b = b.priceValue) != null ? _b : Infinity);
+        });
+        break;
+      case "price-desc":
+        list.sort((a, b) => {
+          var _a2, _b;
+          return ((_a2 = b.priceValue) != null ? _a2 : -Infinity) - ((_b = a.priceValue) != null ? _b : -Infinity);
+        });
+        break;
+      case "duration-asc":
+        list.sort((a, b) => {
+          var _a2, _b;
+          return ((_a2 = a.nights) != null ? _a2 : Infinity) - ((_b = b.nights) != null ? _b : Infinity);
+        });
+        break;
+      case "duration-desc":
+        list.sort((a, b) => {
+          var _a2, _b;
+          return ((_a2 = b.nights) != null ? _a2 : -Infinity) - ((_b = a.nights) != null ? _b : -Infinity);
+        });
+        break;
+      default:
+        list.sort((a, b) => (b.featured ? 1 : 0) - (a.featured ? 1 : 0));
+        break;
+    }
+    return list;
+  }, [trips, filterValue, sort]);
   return /* @__PURE__ */ jsxs("div", { className: cn("w-full", className), children: [
     /* @__PURE__ */ jsxs(
       "section",
@@ -13791,16 +13833,34 @@ function CategoryPage2({
           ] }),
           siteHeader && /* @__PURE__ */ jsx(
             SiteHeader,
-            {
-              links: Array.isArray(siteHeader) ? siteHeader : void 0,
+            __spreadProps(__spreadValues({}, Array.isArray(siteHeader) ? { links: siteHeader } : typeof siteHeader === "object" ? siteHeader : {}), {
               position: "overlay"
-            }
+            })
           ),
           /* @__PURE__ */ jsxs("div", { className: "relative mx-auto w-full max-w-6xl px-6 sm:px-8", children: [
-            breadcrumb && breadcrumb.length > 0 && /* @__PURE__ */ jsx("div", { className: "mb-3 flex items-center gap-1.5 flex-wrap", children: breadcrumb.map((crumb, i) => /* @__PURE__ */ jsxs(React29.Fragment, { children: [
-              i > 0 && /* @__PURE__ */ jsx(ChevronRightIcon, { className: "h-3 w-3 text-white/50 shrink-0" }),
-              /* @__PURE__ */ jsx("span", { className: "text-xs text-white/70 font-ui", children: crumb.label })
-            ] }, i)) }),
+            breadcrumb && breadcrumb.length > 0 && /* @__PURE__ */ jsx("div", { className: "mb-3 flex items-center gap-1.5 flex-wrap", children: breadcrumb.map((crumb, i) => {
+              const isLast = i === breadcrumb.length - 1;
+              return /* @__PURE__ */ jsxs(React29.Fragment, { children: [
+                i > 0 && /* @__PURE__ */ jsx(ChevronRightIcon, { className: "h-3 w-3 text-white/50 shrink-0" }),
+                crumb.href && !isLast ? /* @__PURE__ */ jsx(
+                  "a",
+                  {
+                    href: crumb.href,
+                    className: "text-xs text-white/70 font-ui hover:text-white hover:underline transition-colors",
+                    children: crumb.label
+                  }
+                ) : /* @__PURE__ */ jsx(
+                  "span",
+                  {
+                    className: cn(
+                      "text-xs font-ui",
+                      isLast ? "text-white" : "text-white/70"
+                    ),
+                    children: crumb.label
+                  }
+                )
+              ] }, i);
+            }) }),
             /* @__PURE__ */ jsx("h1", { className: "text-3xl sm:text-5xl font-bold text-white font-heading leading-tight max-w-3xl", children: title }),
             intro && /* @__PURE__ */ jsx("div", { className: "mt-4 text-base sm:text-lg text-white/90 leading-relaxed max-w-2xl [&_strong]:font-semibold [&_a]:underline", children: intro }),
             trustpilotMini && /* @__PURE__ */ jsx("div", { className: "mt-5 max-w-sm", children: /* @__PURE__ */ jsx(TrustpilotEmbed, { config: trustpilotMini }) })
@@ -13818,7 +13878,7 @@ function CategoryPage2({
       ),
       /* @__PURE__ */ jsx("div", { className: "-mx-6 sm:-mx-8 px-6 sm:px-8 overflow-x-auto [&::-webkit-scrollbar]:hidden [-ms-overflow-style:none] [scrollbar-width:none]", children: /* @__PURE__ */ jsx("div", { className: "inline-flex gap-5 min-w-max pb-2", children: popularTours.map((trip, i) => {
         var _b;
-        const _a2 = trip, { featured: _featured, variant: _variant } = _a2, cardProps = __objRest(_a2, ["featured", "variant"]);
+        const _a2 = trip, { featured: _featured, variant: _variant, filterTags: _filterTags, priceValue: _priceValue } = _a2, cardProps = __objRest(_a2, ["featured", "variant", "filterTags", "priceValue"]);
         return /* @__PURE__ */ jsx(
           TripCard,
           __spreadProps(__spreadValues({}, cardProps), {
@@ -13845,9 +13905,9 @@ function CategoryPage2({
         }
       ) }),
       /* @__PURE__ */ jsxs("p", { className: "text-sm text-muted-foreground font-ui mb-5", children: [
-        trips.length,
+        sortedTrips.length,
         " ",
-        trips.length === 1 ? "trip" : "trips",
+        sortedTrips.length === 1 ? "trip" : "trips",
         " found"
       ] }),
       (() => {
@@ -13855,7 +13915,7 @@ function CategoryPage2({
         const hiddenCount = sortedTrips.length - visibleTrips.length;
         return /* @__PURE__ */ jsxs(Fragment, { children: [
           /* @__PURE__ */ jsx("div", { className: "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-x-6 gap-y-8 lg:gap-x-[35px] lg:gap-y-[38px]", children: visibleTrips.map((trip, i) => {
-            const _a2 = trip, { featured: _featured } = _a2, cardProps = __objRest(_a2, ["featured"]);
+            const _a2 = trip, { featured: _featured, filterTags: _filterTags, priceValue: _priceValue } = _a2, cardProps = __objRest(_a2, ["featured", "filterTags", "priceValue"]);
             return /* @__PURE__ */ jsx(
               TripCard,
               __spreadProps(__spreadValues({}, cardProps), {